fix: macro 삭제

src/App.tsx

@@ -8,7 +8,7 @@ import { useEffect } from 'react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
 import { ThemeProvider } from 'styled-components';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import ToastContainerBox from 'utils/toast/ToastContainer';
 
 import Router from './Router';

src/components/common/atomComponents/PasswordInput.tsx

@@ -2,7 +2,7 @@ import React, { useState } from 'react';
 
 import Text from 'components/common/atomComponents/Text';
 import { PasswordEyeIc, PasswordOpenEyeIc } from 'components/Icon/icon';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 interface ValueProps {

src/components/common/atomComponents/PlaceInput.tsx

@@ -1,8 +1,8 @@
 import React, { Dispatch, SetStateAction, useState } from 'react';
 
-import { InputCancelIc ,InputErrorIc } from 'components/Icon/icon';
+import { InputCancelIc, InputErrorIc } from 'components/Icon/icon';
 import { MeetingInfo } from 'pages/createMeeting/types/useFunnelInterface';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 
 interface ValueProps {
   data: string;
@@ -61,9 +61,9 @@ const InputSection = styled.div`
   input:focus + div {
     display: flex;
     svg {
-      cursor: pointer;
       width: 2rem;
       height: 2rem;
+      cursor: pointer;
     }
   }
 `;
@@ -87,9 +87,9 @@ const StyledTextInput = styled.input<{ $iserror: boolean }>`
   caret-color: ${({ theme }) => theme.colors.main1};
 
   &:focus {
-    outline: none;
     border-bottom: 2px solid
       ${({ $iserror, theme }) => ($iserror ? theme.colors.red : theme.colors.main1)};
+    outline: none;
   }
 `;
 

src/components/common/atomComponents/Text.tsx

@@ -1,4 +1,4 @@
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 
 interface ValueProps {
   children: string | string[] | number;

src/components/common/atomComponents/TextAreaInput.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
 import Text from 'components/common/atomComponents/Text';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 interface ValueProps {

src/components/common/atomComponents/TextInput.tsx

@@ -2,7 +2,7 @@ import React, { useState } from 'react';
 
 import Text from 'components/common/atomComponents/Text';
 import { InputCancelIc, InputErrorIc } from 'components/Icon/icon';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 interface ValueProps {

src/components/common/moleculesComponents/Header.tsx

@@ -7,7 +7,7 @@ import { ScheduleStepType } from 'pages/selectSchedule/types';
 import CopyToClipboard from 'react-copy-to-clipboard';
 import { useParams } from 'react-router';
 import { useNavigate } from 'react-router-dom';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 import { notify } from 'utils/toast/copyLink';
 

src/components/common/moleculesComponents/TitleComponents.tsx

@@ -1,5 +1,5 @@
 import Text from 'components/common/atomComponents/Text';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 interface TextProps {

src/components/legacy/scheduleComponents/components/PriorityDropdown.tsx

@@ -5,7 +5,7 @@ import Text from 'components/common/atomComponents/Text';
 import { Circle1Ic, Circle2Ic, Circle3Ic, DropDownIc, DropUpIc } from 'components/Icon/icon';
 import { ScheduleStates } from 'pages/legacy/selectSchedule/types/Schedule';
 import { useRecoilState } from 'recoil';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 function PriorityDropdown() {

src/pages/ComponentTesting.tsx

@@ -21,7 +21,7 @@ import {
   RadioCheckedIc,
   TimeIc,
 } from 'components/Icon/icon';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 const buttonType: string[] = [

src/pages/bestMeetTime/components/AlternativeCard.tsx

@@ -1,6 +1,6 @@
 import Text from 'components/common/atomComponents/Text';
 import { BestDataProps } from 'pages/bestMeetTime/types/meetCardData';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 function AlternativeCard({ rank, carddata, chooseMeetime, selected }: BestDataProps) {

src/pages/bestMeetTime/components/BestMeetTime.tsx

@@ -11,7 +11,7 @@ import { whatisBestMeetime } from 'pages/bestMeetTime/utils/whatisBestMeetime';
 import LoadingPage from 'pages/errorLoading/LoadingPage';
 import { useParams } from 'react-router';
 import { useNavigate } from 'react-router-dom';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 import BlankMeetCard from './BlankMeetCard';

src/pages/bestMeetTime/components/BestTimeCard.tsx

@@ -3,7 +3,7 @@ import React, { useState } from 'react';
 import Text from 'components/common/atomComponents/Text';
 import { DropdownWhite, DropupWhite } from 'components/Icon/icon';
 import { BestDataProps } from 'pages/bestMeetTime/types/meetCardData';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 function BestTimeCard({ rank, carddata, chooseMeetime, selected }: BestDataProps) {

src/pages/bestMeetTime/components/BlankMeetCard.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
 import Text from 'components/common/atomComponents/Text';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 function BlankMeetCard() {

src/pages/bestMeetTime/components/ConfirmModal.tsx

@@ -5,7 +5,7 @@ import { ExitIc } from 'components/Icon/icon';
 import { BestMeetFinished } from 'pages/bestMeetTime/types/meetCardData';
 import LoadingPage from 'pages/errorLoading/LoadingPage';
 import { useNavigate, useParams } from 'react-router-dom';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 import { authClient } from 'utils/apis/axios';
 

src/pages/createMeeting/CreateMeeting.tsx

@@ -3,7 +3,7 @@ import { useState } from 'react';
 import Header from 'components/common/moleculesComponents/Header';
 import ReturnBodyComponent from 'pages/createMeeting/components/ReturnBodyComponent';
 import ReturnTitleComponent from 'pages/createMeeting/components/ReturnTitleComponent';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 
 import { funnelStep } from './data/meetingInfoData';
 import { MeetingInfo } from './types/useFunnelInterface';

src/pages/createMeeting/components/ReturnBodyComponent.tsx

@@ -1,6 +1,6 @@
 import React, { Dispatch, SetStateAction } from 'react';
 
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 
 import SetAdditionalInfo from './useFunnel/SetAdditionalInfo';
 import SetDates from './useFunnel/SetDates';

src/pages/createMeeting/components/useFunnel/SetAdditionalInfo.tsx

@@ -6,7 +6,7 @@ import Text from 'components/common/atomComponents/Text';
 import TextAreaInput from 'components/common/atomComponents/TextAreaInput';
 import { FunnelProps, MeetingInfo } from 'pages/createMeeting/types/useFunnelInterface';
 import { useNavigate } from 'react-router-dom';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { createMeetingApi } from 'utils/apis/legacy/createMeetingApi';
 
 function SetAdditionalInfo({ meetingInfo, setMeetingInfo }: FunnelProps) {

src/pages/createMeeting/components/useFunnel/SetDates.tsx

@@ -8,7 +8,7 @@ import Text from 'components/common/atomComponents/Text';
 import { FunnelProps, MeetingInfo } from 'pages/createMeeting/types/useFunnelInterface';
 import { Calendar, DateObject, getAllDatesInRange } from 'react-multi-date-picker';
 import { useRecoilState } from 'recoil';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 
 const months = [
   '1월',

src/pages/createMeeting/components/useFunnel/SetDuration.tsx

@@ -2,7 +2,7 @@ import Button from 'components/common/atomComponents/Button';
 import Text from 'components/common/atomComponents/Text';
 import { durationType } from 'pages/createMeeting/data/meetingInfoData';
 import { FunnelProps, MeetingInfo } from 'pages/createMeeting/types/useFunnelInterface';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 
 function SetDuration({ meetingInfo, setMeetingInfo, setStep }: FunnelProps) {
   return (

src/pages/createMeeting/components/useFunnel/SetHostInfo.tsx

@@ -5,7 +5,7 @@ import PasswordInput from 'components/common/atomComponents/PasswordInput';
 import Text from 'components/common/atomComponents/Text';
 import TextInput from 'components/common/atomComponents/TextInput';
 import { FunnelProps, MeetingInfo } from 'pages/createMeeting/types/useFunnelInterface';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 function SetHostInfo({ meetingInfo, setMeetingInfo, setStep }: FunnelProps) {

src/pages/createMeeting/components/useFunnel/SetPlace.tsx

@@ -3,7 +3,7 @@ import PlaceInput from 'components/common/atomComponents/PlaceInput';
 import Text from 'components/common/atomComponents/Text';
 import { placeType } from 'pages/createMeeting/data/meetingInfoData';
 import { FunnelProps } from 'pages/createMeeting/types/useFunnelInterface';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 
 function SetPlace({ meetingInfo, setMeetingInfo, setStep }: FunnelProps) {
   const setPlaceDetail = (place: string) => {

src/pages/createMeeting/components/useFunnel/SetTitle.tsx

@@ -4,7 +4,7 @@ import Button from 'components/common/atomComponents/Button';
 import Text from 'components/common/atomComponents/Text';
 import TextInput from 'components/common/atomComponents/TextInput';
 import { FunnelProps, MeetingInfo } from 'pages/createMeeting/types/useFunnelInterface';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 
 function SetTitle({ meetingInfo, setMeetingInfo, setStep }: FunnelProps) {
   const titleOnChange = (e: React.ChangeEvent<HTMLInputElement>) => {

src/pages/cueCard/CueCard.tsx

@@ -6,7 +6,7 @@ import Header from 'components/common/moleculesComponents/Header';
 import html2canvas from 'html2canvas';
 import CueCardTitle from 'pages/cueCard/components/CueCardTitle';
 import CopyToClipboard from 'react-copy-to-clipboard';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { downLoadNotify, notify } from 'utils/toast/copyLink';
 
 import Qcard from './components/Qcard';

src/pages/cueCard/components/CueCardTitle.tsx

@@ -1,5 +1,5 @@
 import Text from 'components/common/atomComponents/Text';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 interface TextProps {

src/pages/cueCard/components/Qcard.tsx

@@ -5,7 +5,7 @@ import { OfflinePlaceIc, OnlinePlaceIc, TimeIc } from 'components/Icon/icon';
 import LoadingPage from 'pages/errorLoading/LoadingPage';
 import { useParams } from 'react-router';
 import { useNavigate } from 'react-router-dom';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 import GetQcardDataHooks from '../hooks/getQCardData';

src/pages/errorLoading/ErrorPage404.tsx

@@ -2,7 +2,7 @@ import Error404 from 'assets/images/Error404.png';
 import Button from 'components/common/atomComponents/Button';
 import Text from 'components/common/atomComponents/Text';
 import { Link } from 'react-router-dom';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 function ErrorPage404() {

src/pages/errorLoading/LoadingPage.tsx

@@ -1,4 +1,4 @@
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 
 function LoadingPage() {
   return (

src/pages/legacy/selectSchedule/SelectModal.tsx

@@ -6,7 +6,7 @@ import { useSelectContext } from 'pages/selectSchedule/contexts/useSelectContext
 import { formatHostScheduleScheme, formatMemberScheduleScheme } from 'pages/selectSchedule/utils';
 import { useNavigate, useParams } from 'react-router';
 import { useRecoilValue } from 'recoil';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 import { hostAvailableApi, userAvailableApi } from 'utils/apis/legacy/createHostAvailableSchedule';
 

src/pages/loginEntrance/LoginEntrance.tsx

@@ -1,6 +1,6 @@
 import { useState } from 'react';
 
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 
 import HostComponent from './components/HostComponent';
 import MemberComponent from './components/MemberComponent';

src/pages/loginEntrance/components/HostComponent.tsx

@@ -8,7 +8,7 @@ import TextInput from 'components/common/atomComponents/TextInput';
 import Header from 'components/common/moleculesComponents/Header';
 import TitleComponent from 'components/common/moleculesComponents/TitleComponents';
 import { useNavigate, useParams } from 'react-router-dom';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 import { client } from 'utils/apis/axios';
 

src/pages/loginEntrance/components/IncorrectInfoModal.tsx

@@ -3,7 +3,7 @@ import React, { Dispatch, SetStateAction, useState } from 'react';
 
 import { ExitIc } from 'components/Icon/icon';
 import Text from 'components/common/atomComponents/Text';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 interface ModalProps {

src/pages/loginEntrance/components/MemberComponent.tsx

@@ -5,7 +5,7 @@ import Header from 'components/common/moleculesComponents/Header';
 import Text from 'components/common/atomComponents/Text';
 import TextInput from 'components/common/atomComponents/TextInput';
 import TitleComponent from 'components/common/moleculesComponents/TitleComponents';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 import { useNavigate } from 'react-router-dom';
 import { useParams } from 'react-router';

src/pages/loginEntrance/components/NoAvailableTimeModal.tsx

@@ -3,7 +3,7 @@ import React, { Dispatch, SetStateAction, useState } from 'react';
 
 import { ExitIc } from 'components/Icon/icon';
 import Text from 'components/common/atomComponents/Text';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 interface ModalProps {

src/pages/onBoarding/OnBoarding.tsx

@@ -10,7 +10,7 @@ import Button from 'components/common/atomComponents/Button';
 import Text from 'components/common/atomComponents/Text';
 import Header from 'components/common/moleculesComponents/Header';
 import { Link } from 'react-router-dom';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { Autoplay, Navigation, Pagination } from 'swiper/modules';
 import { Swiper, SwiperSlide } from 'swiper/react';
 

src/pages/onBoarding/components/Explain.tsx

@@ -1,5 +1,5 @@
 import Text from 'components/common/atomComponents/Text';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 interface ExplainProps {

src/pages/selectSchedule/components/selectPriority/PriorityDropdown.tsx

@@ -8,7 +8,7 @@ import {
   SelectSlotType,
   useSelectContext,
 } from 'pages/selectSchedule/contexts/useSelectContext';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 /**

src/pages/steppingStone/SteppingLayout.tsx

@@ -2,7 +2,7 @@ import { useEffect, useState } from 'react';
 
 import Header from 'components/common/moleculesComponents/Header';
 import { useNavigate, useParams } from 'react-router-dom';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { client } from 'utils/apis/axios';
 
 import SteppingBody from './components/SteppingBody';

src/pages/steppingStone/components/SteppingBody.tsx

@@ -6,7 +6,7 @@ import stepingInsert from 'assets/images/steppingInsert.png';
 import stepingPlus from 'assets/images/steppingPlus.png';
 import Text from 'components/common/atomComponents/Text';
 import { useNavigate } from 'react-router-dom';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 
 interface BodyType {

src/pages/steppingStone/components/SteppingBtnSection.tsx

@@ -5,7 +5,7 @@ import Text from 'components/common/atomComponents/Text';
 import CopyToClipboard from 'react-copy-to-clipboard';
 import { useParams } from 'react-router';
 import { Link, useLocation } from 'react-router-dom';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 import { theme } from 'styles/theme';
 import { notify } from 'utils/toast/copyLink';
 

src/utils/toast/ToastContainer.tsx

@@ -1,5 +1,5 @@
 import { ToastContainer } from 'react-toastify';
-import styled from 'styled-components/macro';
+import styled from 'styled-components';
 
 function ToastContainerBox() {
   return (