Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[FEAT] 공통 컴포넌트 아이콘 SVG 삽입 #296

Merged
merged 24 commits into from
Nov 28, 2024
Merged
Show file tree
Hide file tree
Changes from 11 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
"react-datepicker": "^7.3.0",
"react-dom": "^18.3.1",
"react-router-dom": "^6.24.1",
"vite-plugin-svgr": "^4.2.0"
"vite-plugin-svgr": "^4.3.0"
},
"devDependencies": {
"@chromatic-com/storybook": "^1.6.1",
Expand Down
7 changes: 0 additions & 7 deletions src/assets/svg.d.ts

This file was deleted.

File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
87 changes: 87 additions & 0 deletions src/assets/svg/V1/index.ts
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

import Icn_arrow_narrow_right from '@/assets/svg/V1/arrow-narrow-right.svg';
import Arrow_up from '@/assets/svg/V1/arrow-up.svg';
import Icn_calander from '@/assets/svg/V1/calendar-minus-01.svg';
import ClockCheck from '@/assets/svg/V1/clock-check.svg';
import Icn_date_clock from '@/assets/svg/V1/clock.svg';
import Dashboard_Complete from '@/assets/svg/V1/Dashboard_Complete_Icon.svg';
import DashboardPostpone from '@/assets/svg/V1/Dashboard_Postpone_Icon.svg';
import DashboardProgress from '@/assets/svg/V1/Dashboard_Progress_Icon.svg';
import DeleteIcon from '@/assets/svg/V1/Delete.svg';
import DoneIcon from '@/assets/svg/V1/DoneIcon.svg';
import TimelineDelete from '@/assets/svg/V1/ic_delete.svg';
import Icn_selectbox_selected from '@/assets/svg/V1/ic_selectbox_selected.svg';
import Icn_selectbox_Unselected from '@/assets/svg/V1/ic_selectbox_unselected.svg';
import IcnArrangeCalendar from '@/assets/svg/V1/icn_arrange_calendar.svg';
import IcnArrangeLeft from '@/assets/svg/V1/icn_arrange_left.svg';
import IcnArrangeRight from '@/assets/svg/V1/icn_arrange_right.svg';
import IcnArrangeSet from '@/assets/svg/V1/icn_arrange_set.svg';
import Icn_clock from '@/assets/svg/V1/icn_clock.svg';
import IcnFile from '@/assets/svg/V1/icn_file.svg';
import Icn_hover_indicator from '@/assets/svg/V1/icn_hover_indicator.svg';
import Icn_nav_calendar from '@/assets/svg/V1/icn_nav_calendar.svg';
import Icn_nav_dashboard from '@/assets/svg/V1/icn_nav_dashboard.svg';
import Icn_nav_setting from '@/assets/svg/V1/icn_nav_setting.svg';
import Icn_nav_today from '@/assets/svg/V1/icn_nav_today.svg';
import Icn_line from '@/assets/svg/V1/line164.svg';
import plus_circle from '@/assets/svg/V1/plus-circle.svg';
import PlusArrow from '@/assets/svg/V1/PlusArrow.svg';
import ProgressIcon from '@/assets/svg/V1/ProgressIcon.svg';
import Refresh from '@/assets/svg/V1/refresh.svg';
import SelectedBox from '@/assets/svg/V1/Selectbox_Selected.svg';
import UnselectedBox from '@/assets/svg/V1/Selectbox_Unselected.svg';
import SettingCheck1 from '@/assets/svg/V1/SettingCheck1.svg';
import SettingCheck2 from '@/assets/svg/V1/SettingCheck2Icon.svg';
import SettingCheck3 from '@/assets/svg/V1/SettingCheck3Icon.svg';
import SettingCheck4 from '@/assets/svg/V1/SettingCheck4Icon.svg';
import SettingProgress from '@/assets/svg/V1/SettingProgressIcon.svg';
import SettingX from '@/assets/svg/V1/SettingXIcon.svg';
import IcnXCricle from '@/assets/svg/V1/x-circle.svg';

여기 import 다 오류나네요! 이렇게 바꿔주세요!!

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

아 기존 V2파일 추가하면서 ?react 부분을 깜빡했었네요! ㅜㅜ
?react가 붙어야 svg 파일들을 리액트 컴포넌트로 사용할 수 있는거로 알고 있는데 V1 경로만 추가해두면 될 것 같아요!

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

image

이 부분 참고해주세요!

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

아 저걸 적용하면 저 부분 생략하고도 컴포넌트로 활용 가능하다는 말잉었군요! 잘못 이해했습니다... 수정해둘게용!!

Original file line number Diff line number Diff line change
@@ -0,0 +1,87 @@
import Icn_arrow_narrow_right from '@/assets/svg/V1/arrow-narrow-right.svg';
import Arrow_up from '@/assets/svg/V1/arrow-up.svg';
import Icn_calander from '@/assets/svg/V1/calendar-minus-01.svg';
import ClockCheck from '@/assets/svg/V1/clock-check.svg';
import Icn_date_clock from '@/assets/svg/V1/clock.svg';
import Dashboard_Complete from '@/assets/svg/V1/Dashboard_Complete_Icon.svg';
import DashboardPostpone from '@/assets/svg/V1/Dashboard_Postpone_Icon.svg';
import DashboardProgress from '@/assets/svg/V1/Dashboard_Progress_Icon.svg';
import DeleteIcon from '@/assets/svg/V1/Delete.svg';
import DoneIcon from '@/assets/svg/V1/DoneIcon.svg';
import TimelineDelete from '@/assets/svg/V1/ic_delete.svg';
import Icn_selectbox_selected from '@/assets/svg/V1/ic_selectbox_selected.svg';
import Icn_selectbox_Unselected from '@/assets/svg/V1/ic_selectbox_unselected.svg';
import IcnArrangeCalendar from '@/assets/svg/V1/icn_arrange_calendar.svg';
import IcnArrangeLeft from '@/assets/svg/V1/icn_arrange_left.svg';
import IcnArrangeRight from '@/assets/svg/V1/icn_arrange_right.svg';
import IcnArrangeSet from '@/assets/svg/V1/icn_arrange_set.svg';
import Icn_clock from '@/assets/svg/V1/icn_clock.svg';
import IcnFile from '@/assets/svg/V1/icn_file.svg';
import Icn_hover_indicator from '@/assets/svg/V1/icn_hover_indicator.svg';
import Icn_nav_calendar from '@/assets/svg/V1/icn_nav_calendar.svg';
import Icn_nav_dashboard from '@/assets/svg/V1/icn_nav_dashboard.svg';
import Icn_nav_setting from '@/assets/svg/V1/icn_nav_setting.svg';
import Icn_nav_today from '@/assets/svg/V1/icn_nav_today.svg';
import Icn_line from '@/assets/svg/V1/line164.svg';
import plus_circle from '@/assets/svg/V1/plus-circle.svg';
import PlusArrow from '@/assets/svg/V1/PlusArrow.svg';
import ProgressIcon from '@/assets/svg/V1/ProgressIcon.svg';
import Refresh from '@/assets/svg/V1/refresh.svg';
import SelectedBox from '@/assets/svg/V1/Selectbox_Selected.svg';
import UnselectedBox from '@/assets/svg/V1/Selectbox_Unselected.svg';
import SettingCheck1 from '@/assets/svg/V1/SettingCheck1.svg';
import SettingCheck2 from '@/assets/svg/V1/SettingCheck2Icon.svg';
import SettingCheck3 from '@/assets/svg/V1/SettingCheck3Icon.svg';
import SettingCheck4 from '@/assets/svg/V1/SettingCheck4Icon.svg';
import SettingProgress from '@/assets/svg/V1/SettingProgressIcon.svg';
import SettingX from '@/assets/svg/V1/SettingXIcon.svg';
import IcnXCricle from '@/assets/svg/V1/x-circle.svg';

const Icons = {
Icn_clock,
Icn_arrow_narrow_right,
Icn_calander,
Icn_date_clock,
Icn_line,
IcnXCricle,
Icn_hover_indicator,
IcnFile,
Navbar: {
Icn_nav_calendar,
Icn_nav_dashboard,
Icn_nav_setting,
Icn_nav_today,
},
ArrangeBtn: {
IcnArrangeRight,
IcnArrangeLeft,
IcnArrangeSet,
IcnArrangeCalendar,
},
Arrow_up,
Refresh,
SelectedBox,
UnselectedBox,
PlusArrow,
DeleteIcon,
SettingIcons: {
SettingCheck1,
SettingCheck2,
SettingCheck3,
SettingCheck4,
},
SettingX,
SettingProgress,
DoneIcon,
ProgressIcon,
TimelineDelete,
ClockCheck,
plus_circle,
Icn_selectbox_selected,
Icn_selectbox_Unselected,
Dashboard_Complete,
DashboardPostpone,
DashboardProgress,
};

export default Icons;
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
3 changes: 3 additions & 0 deletions src/assets/svg/V2/IcnAlert.svg
3 changes: 3 additions & 0 deletions src/assets/svg/V2/IcnArrowDown.svg
3 changes: 3 additions & 0 deletions src/assets/svg/V2/IcnArrowUp.svg
3 changes: 3 additions & 0 deletions src/assets/svg/V2/IcnBlank.svg
3 changes: 3 additions & 0 deletions src/assets/svg/V2/IcnCalendar.svg
3 changes: 3 additions & 0 deletions src/assets/svg/V2/IcnCheck.svg
10 changes: 10 additions & 0 deletions src/assets/svg/V2/IcnCheckboxOff.svg
10 changes: 10 additions & 0 deletions src/assets/svg/V2/IcnCheckboxOn.svg
3 changes: 3 additions & 0 deletions src/assets/svg/V2/IcnColorchip.svg
3 changes: 3 additions & 0 deletions src/assets/svg/V2/IcnDashboard.svg
3 changes: 3 additions & 0 deletions src/assets/svg/V2/IcnDelete.svg
Loading