App: update to phosphor-react@0.3.0 and replace renamed icons in-situ

src/components/Header/Header.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { motion } from "framer-motion";
-import { ArrowUpRightCircle, ArrowDownCircle } from "phosphor-react";
+import { ArrowCircleUpRight, ArrowCircleDown } from "phosphor-react";
 
 import "./Header.css";
 import markerPurple from "../../assets/marker-purple.svg";
@@ -50,12 +50,12 @@ const Header: React.FC<HeaderProps> = () => {
           </h2>
           <div className="button-container">
             <button className="main-button" onClick={handleGetStarted}>
-              <ArrowUpRightCircle size={24} weight="fill" />
+              <ArrowCircleUpRight size={24} weight="fill" />
               Go to docs
             </button>
 
             <button className="main-button" onClick={handleScrollToIcons}>
-              <ArrowDownCircle size={24} weight="fill" />
+              <ArrowCircleDown size={24} weight="fill" />
               Explore icons
             </button>
           </div>

src/components/IconGrid/InfoPanel.tsx

@@ -2,7 +2,7 @@ import React, { useRef } from "react";
 import { useRecoilValue, useSetRecoilState } from "recoil";
 import { motion } from "framer-motion";
 import { saveAs } from "file-saver";
-import { Icon, Copy, X, CheckCircle, ArchiveDiskDot } from "phosphor-react";
+import { Icon, Copy, X, CheckCircle, Download } from "phosphor-react";
 
 import {
   iconWeightAtom,
@@ -155,7 +155,7 @@ const InfoPanel: React.FC<InfoPanelProps> = (props) => {
             style={{ color: isDark ? "white" : "black" }}
             onClick={handleDownloadSVG}
           >
-            <ArchiveDiskDot size={32} color="currentColor" weight="fill" />{" "}
+            <Download size={32} color="currentColor" weight="fill" />{" "}
             Download SVG
           </button>
           <button