첫 커밋

src/widgets/more-menu/more-menu.tsx

@@ -0,0 +1,22 @@
+import { useRef, useState } from 'react';
+import { useClickAway } from 'react-use';
+
+interface MoreMenuProps {
+  children: React.ReactNode;
+}
+export const MoreMenu = ({ children }: MoreMenuProps) => {
+  const [isOnMoreMenu, setIsOnMoreMenu] = useState(false);
+  const ref = useRef(null);
+  useClickAway(ref, () => {
+    setIsOnMoreMenu(false);
+  });
+
+  return (
+    <div ref={ref}>
+      <button type="button" className="btn top-more-btn" onClick={() => setIsOnMoreMenu((prev) => !prev)}>
+        <span>더보기 버튼</span>
+      </button>
+      {isOnMoreMenu && <div className="more-menu on">{children}</div>}
+    </div>
+  );
+};