diff --git a/.changeset/swift-rules-drop.md b/.changeset/swift-rules-drop.md new file mode 100644 index 000000000..f22be2875 --- /dev/null +++ b/.changeset/swift-rules-drop.md @@ -0,0 +1,6 @@ +--- +'@launchpad-ui/modal': patch +'@launchpad-ui/core': patch +--- + +[Modal] Remove lodash diff --git a/.storybook/utils.tsx b/.storybook/utils.tsx index 5a6f507bf..ffd9e6d11 100644 --- a/.storybook/utils.tsx +++ b/.storybook/utils.tsx @@ -1,8 +1,7 @@ -import type { ArgsStoryFn } from '@storybook/addons'; import type { Args } from '@storybook/api'; import type { StoryContext } from '@storybook/csf'; // @ts-ignore -import type { DecoratorFn, ReactFramework } from '@storybook/react'; +import type { DecoratorFn, ReactFramework, StoryFn } from '@storybook/react'; import { Fragment } from 'react'; import { cloneDeep } from 'lodash-es'; @@ -15,7 +14,7 @@ export const createWithClassesDecorator = ( classes: string[] = [], renderFunc?: ( props: Args & { className?: string }, - originalStoryFn: ArgsStoryFn>, + originalStoryFn: StoryFn, context: StoryContext ) => JSX.Element ): DecoratorFn => { @@ -24,9 +23,7 @@ export const createWithClassesDecorator = ( const pseudoStates = classes || []; const { viewMode, args, name, component } = Context; // This decorator is explicitly made for react - const originalStoryFn = Context.originalStoryFn as - | ArgsStoryFn> - | undefined; + const originalStoryFn = Context.originalStoryFn; // Just render the component without decoration if viewing the docs if (viewMode === 'docs') { return storyFn(); diff --git a/packages/modal/package.json b/packages/modal/package.json index 91a37b4f2..8d5af6aff 100644 --- a/packages/modal/package.json +++ b/packages/modal/package.json @@ -40,7 +40,6 @@ "@react-aria/focus": "^3.7.0", "clsx": "^1.2.0", "framer-motion": "^6.5.1", - "lodash-es": "^4.17.21", "no-scroll": "^2.1.1" }, "peerDependencies": { @@ -48,7 +47,6 @@ "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" }, "devDependencies": { - "@types/lodash-es": "^4.17.6", "@types/no-scroll": "^2.1.0", "react": "^18.2.0", "react-dom": "^18.2.0" diff --git a/packages/modal/src/Modal.tsx b/packages/modal/src/Modal.tsx index 9f7778971..b4ecdb4d2 100644 --- a/packages/modal/src/Modal.tsx +++ b/packages/modal/src/Modal.tsx @@ -5,7 +5,6 @@ import { Close, IconSize } from '@launchpad-ui/icons'; import { FocusScope } from '@react-aria/focus'; import cx from 'clsx'; import { LazyMotion, m } from 'framer-motion'; -import { defer } from 'lodash-es'; import noScroll from 'no-scroll'; import { useEffect, useRef } from 'react'; @@ -72,13 +71,13 @@ const Modal = ({ onCancel && onCancel(); }; - defer(noScroll.on); + setTimeout(noScroll.on, 1); onReady && onReady(); document.body.classList.add('has-modal'); document.addEventListener('keydown', handleEscape); return () => { - defer(noScroll.off); + setTimeout(noScroll.off, 1); document.body.classList.remove('has-modal'); document.removeEventListener('keydown', handleEscape); }; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 7825bf02f..d3aec12be 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -475,11 +475,9 @@ importers: '@launchpad-ui/progress': workspace:~ '@launchpad-ui/tokens': workspace:~ '@react-aria/focus': ^3.7.0 - '@types/lodash-es': ^4.17.6 '@types/no-scroll': ^2.1.0 clsx: ^1.2.0 framer-motion: ^6.5.1 - lodash-es: ^4.17.21 no-scroll: ^2.1.1 react: ^18.2.0 react-dom: ^18.2.0 @@ -491,10 +489,8 @@ importers: '@react-aria/focus': 3.7.0_react@18.2.0 clsx: 1.2.0 framer-motion: 6.5.1_biqbaboplfbrettd7655fr4n2y - lodash-es: 4.17.21 no-scroll: 2.1.1 devDependencies: - '@types/lodash-es': 4.17.6 '@types/no-scroll': 2.1.0 react: 18.2.0 react-dom: 18.2.0_react@18.2.0