preview image
プレビューを開始
2024/08/01

下からにゅるっと出てくるドロワーメニュー(スワイプ可能)

framer-motionでアニメーションを実装しています。

SHARE

About Preview

このコンポーネントを使いたい場合は、component.tsxの内容をコピーして、render.tsxを参考にコンポーネントを使ってください

Default Packages

プレビュー画面では以下のパッケージがインストールされています

  • TailwindCSS
  • framer-motion
  • clsx
  • tailwind-merge
  • react-use-measure
pnpm add tailwindcss framer-motion clsx tailwind-merge react-use-measure

Component PropsType

interface DragCloseDrawerProps {
  open: boolean;
  setOpen:  React.Dispatch<React.SetStateAction<boolean>>;
  className?: string;
  children?: React.ReactNode[];
}