fix: 디자인시스템 QA 이슈 수정

src/components/chips/Chip.vue

@@ -57,7 +57,7 @@ export default {
 			},
 		},
 		/**
-		 * 색상(info, primary, success)
+		 * 색상(info, primary, success, accent, secondary)
 		 */
 		color: {
 			type: String,

src/components/emptyBox/EmptyIllust.vue

@@ -3,7 +3,17 @@
 </template>
 
 <script>
-const ILLUST_SOURCES = ['bookmark', 'class', 'contents', 'credit', 'other', 'payment', 'reply', 'review', 'search'];
+export const ILLUST_SOURCES = [
+	'bookmark',
+	'class',
+	'contents',
+	'credit',
+	'other',
+	'payment',
+	'reply',
+	'review',
+	'search',
+];
 
 export default {
 	name: 'EmptyIllust',

src/components/fileInput/FileInputFileItem.vue

@@ -55,7 +55,6 @@ export default {
 		 */
 		index: {
 			type: Number,
-			default: -1,
 			required: true,
 		},
 		/**

src/components/fileInput/FileInputLinkItem.vue

@@ -34,7 +34,6 @@ export default {
 		},
 		index: {
 			type: Number,
-			default: -1,
 			required: true,
 		},
 		isRemovable: {

src/components/toast/Toast.vue

@@ -127,6 +127,7 @@ export default {
 	color: $white;
 	@include transform(translate(-50%));
 	padding: 14px 16px;
+	min-height: 52px;
 	text-align: center;
 	z-index: 9999;
 	@include border-radius(8px);

stories/components/dataDisplay/EmptyBox.stories.mdx

@@ -3,7 +3,7 @@ import NewGrid from '@/components/grid/NewGrid.vue';
 import NewRow from '@/components/grid/NewRow.vue';
 import NewCol from '@/components/grid/NewCol.vue';
 import EmptyBox, { Types } from '@/components/emptyBox/EmptyBox.vue';
-import EmptyIllust from '@/components/emptyBox/EmptyIllust.vue';
+import EmptyIllust, { ILLUST_SOURCES } from '@/components/emptyBox/EmptyIllust.vue';
 import Typography from '@/components/typography/Typography';
 
 <Meta
@@ -127,22 +127,27 @@ export const Default = (args, { argTypes }) => ({
 <Canvas>
 	<Story name="Emphasized With Graphic" height="120px">
 		{{
+			data() {
+				return {
+					ILLUST_SOURCES
+				};
+			},
 			components: { EmptyBox, EmptyIllust, Typography, NewGrid, NewRow, NewCol },
 			template: `<NewGrid>
                     <NewRow>
-                        <NewCol :col-lg="12" :col-sm="4" class="flex justify-around align-center">
-                            <EmptyBox type="emphasized">
+                        <NewCol :col-lg="4" :col-sm="4" class="flex justify-around align-center" v-for="item in ILLUST_SOURCES" :key="item">
+                            <EmptyBox type="emphasized" >
 								<template v-slot:illust>
-									<EmptyIllust type="other" />
+									<EmptyIllust :type="item" />
 								</template>
                                 <template v-slot:title>
-                                    제출한 과제가 없습니다.
+                                    {{ item }}에 대한 Empty입니다.
                                 </template>
                                 <template v-slot:contents>
-                                    아래를 눌러 과제를 제출하세요.
+									{{ item }}에 대한 Empty입니다.
                                 </template>
                                 <template v-slot:link>
-                                    과제 제출하기
+                                    재시도
                                 </template>
                             </EmptyBox>
                         </NewCol>

stories/components/dataEntry/fileInput/FileInputList.stories.mdx

@@ -123,11 +123,6 @@ export const Default = (args, { argTypes }) => ({
 							isLoading: false,
 							isError: false,
 						},
-						{
-							file: { name: '3.png' },
-							isLoading: false,
-							isError: false,
-						},
 					],
 					links: [
 						{
@@ -159,38 +154,33 @@ export const Default = (args, { argTypes }) => ({
 				},
 			},
 			template: `<div style="width: 100%; display: flex; align-items: flex-start; flex-direction: column;">
-				<div v-if="links.length" class="w-full mb-30">
-					<FileSummary>링크 ({{ links.length }}개)</FileSummary>
-					<FileInputList full>
-						<FileInputLinkItem
-							v-for="(item, index) in links"
-							:key="'link-' + index"
-							:link="item.link"
-							:index="index"
-							is-removable
-							@remove-item="handleClickLinkTrashIcon"
-						/>
-					</FileInputList>
-				</div>
-				<div v-if="files.length" class="w-full">
-					<FileSummary>첨부파일 ({{ files.length }}개)</FileSummary>
-					<FileInputList full>
-						<FileInputFileItem
-							v-for="(item, index) in files"
-							:key="'file-' + index"
-							:file="item.file"
-							:index="index"
-							is-removable
-							:is-loading="item.isLoading"
-							:is-error="item.isError"
-							@click-item="handleClickFileItem"
-							@click-item-content="handleClickFileItem"
-							@remove-item="handleClickFileTrashIcon"
-						/>
-					</FileInputList>
-				</div>
+				<FileInputButton @upload-files="handleUploadFiles"/>
+				<FileInputList full v-if="files.length">
+					<FileInputFileItem
+						v-for="(item, index) in files"
+						:key="'file-' + index"
+						:file="item.file"
+						:index="index"
+						is-removable
+						:is-loading="item.isLoading"
+						:is-error="item.isError"
+						@click-item="handleClickFileItem"
+						@click-item-content="handleClickFileItem"
+						@remove-item="handleClickFileTrashIcon"
+					/>
+				</FileInputList>
+				<FileInputList full v-if="links.length">
+					<FileInputLinkItem
+						v-for="(item, index) in links"
+						:key="'link-' + index"
+						:link="item.link"
+						:index="index"
+						is-removable
+						@remove-item="handleClickLinkTrashIcon"
+					/>
+				</FileInputList>
 			</div>`,
-			components: { FileInputList, FileSummary, FileInputButton, FileInputFileItem, FileInputLinkItem },
+			components: { FileInputList, FileInputButton, FileInputFileItem, FileInputLinkItem },
 		}}
 	</Story>
 </Canvas>
@@ -249,18 +239,7 @@ export const Default = (args, { argTypes }) => ({
 				},
 			},
 			template: `<div style="width: 100%; display: flex; align-items: flex-start; flex-direction: column;">
-				<div class="w-full mb-30">
-					<FileSummary>링크 ({{ links.length }}개)</FileSummary>
-					<FileInputList full>
-						<FileInputLinkItem
-							v-for="(item, index) in links"
-							:key="'link-' + index"
-							:link="item.link"
-							:index="index"
-						/>
-					</FileInputList>
-				</div>
-				<div class="w-full">
+				<div class="w-full mb-16">
 					<FileSummary full show-download-button>첨부파일 ({{ files.length }}개)</FileSummary>
 					<FileInputList full>
 						<FileInputFileItem
@@ -270,9 +249,20 @@ export const Default = (args, { argTypes }) => ({
 							:index="index"
 							:is-loading="item.isLoading"
 							:is-error="item.isError"
-							@clickFileDownloadIcon="handleClickFileDownloadIcon"
-							@clickFileItem="handleClickFileItem"
-							@clickFileItemContent="handleClickFileItem"
+							@download-item="handleClickFileDownloadIcon"
+							@click-item="handleClickFileItem"
+							@click-item-content="handleClickFileItem"
+						/>
+					</FileInputList>
+				</div>
+				<div class="w-full">
+					<FileSummary>링크 ({{ links.length }}개)</FileSummary>
+					<FileInputList full>
+						<FileInputLinkItem
+							v-for="(item, index) in links"
+							:key="'link-' + index"
+							:link="item.link"
+							:index="index"
 						/>
 					</FileInputList>
 				</div>