Team-Tiki · wuzoo · Dec 4, 2024 · Nov 25, 2024 · Nov 26, 2024 · Nov 26, 2024
diff --git a/.editorConfig b/.editorConfig
@@ -0,0 +1,10 @@
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+indent_size = 2
+indent_style = space
+insert_final_newline = true
+max_line_length = 120
+trim_trailing_whitespace = true
diff --git a/.github/workflows/automatic-aws-deployment.yml b/.github/workflows/automatic-aws-deployment.yml
@@ -21,7 +21,7 @@ jobs:
       - name: Setup pnpm
         uses: pnpm/action-setup@v4
         with:
-          version: 9
+          version: 9.1.3
 
       - name: Install dependencies
         run: pnpm install --frozen-lockfile

diff --git a/.github/workflows/check.yml b/.github/workflows/check.yml
@@ -20,7 +20,7 @@ jobs:
       - name: Setup Pnpm
         uses: pnpm/action-setup@v4
         with:
-          version: 9
+          version: 9.1.3
 
       - name: Cache node modules
         id: cache-node

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
@@ -14,7 +14,7 @@ jobs:
        - name: Install pnpm
          uses: pnpm/action-setup@v4
          with:
-           version: 9
+           version: 9.1.3
        - name: Setup Node.js
          uses: actions/setup-node@v4
          with:

diff --git a/.github/workflows/storybook-deploy.yml b/.github/workflows/storybook-deploy.yml
@@ -19,13 +19,13 @@ jobs:
       - name: Install Pnpm
         uses: pnpm/action-setup@v4
         with:
-          version: 9
+          version: 9.1.3
 
       - name: Install dependencies
         run: pnpm install --frozen-lockfile
 
       - name: Build
-        run: pnpm build-storybook
+        run: pnpm client build-storybook
 
       - name: Deploy
         uses: peaceiris/actions-gh-pages@v4 

diff --git a/.gitignore b/.gitignore
@@ -22,6 +22,10 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
-.env
+
+**/.next-env.d.ts
+**/.env
+
 *storybook.log
 storybook-static
+
diff --git a/.prettierrc b/.prettierrc
diff --git a/.eslintrc.cjs → apps/client/.eslintrc.cjs b/.eslintrc.cjs → apps/client/.eslintrc.cjs
diff --git a/apps/client/.prettierrc b/apps/client/.prettierrc
@@ -0,0 +1,31 @@
+{
+    "plugins": ["@trivago/prettier-plugin-sort-imports"],
+
+    "printWidth": 120,
+    "tabWidth": 2,
+    "semi": true,
+    "singleQuote": true,
+    "trailingComma": "es5",
+    "requirePragma": false,
+    "arrowParens": "always",
+    "bracketSameLine": true,
+    "endOfLine": "auto",
+
+    "importOrder": [
+      "^react(.*)",
+      "^@emtion/(.*)$",
+      "^@tanstack/(.*)$",
+      "^zustand(.*)",
+      "^axios(.*)",
+      "^msw(.*)",
+      "^@/common/(.*)$",
+      "^@/page/(.*)$",
+      "^@/shared/(.*)$",
+      "^@/story/(.*)$",
+      "^@/mock/(.*)$",
+      "^[./]"
+    ],
+    "importOrderSeparation": true,
+    "importOrderSortSpecifiers": true
+  }
+
diff --git a/.storybook/main.ts → apps/client/.storybook/main.ts b/.storybook/main.ts → apps/client/.storybook/main.ts
diff --git a/.storybook/preview-head.html → apps/client/.storybook/preview-head.html b/.storybook/preview-head.html → apps/client/.storybook/preview-head.html
diff --git a/.storybook/preview.tsx → apps/client/.storybook/preview.tsx b/.storybook/preview.tsx → apps/client/.storybook/preview.tsx
@@ -1,13 +1,13 @@
 import { Global, ThemeProvider } from '@emotion/react';
 import type { Preview } from '@storybook/react';
+import { theme } from '@tiki/ui';
 
 import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 
 import { GlobalStyle } from '../src/common/style/globalStyle';
-import { theme } from '../src/common/style/theme/theme';
 
 const customViewports = {
   Default: {

diff --git a/index.html → apps/client/index.html b/index.html → apps/client/index.html
@@ -2,7 +2,7 @@
 <html lang="ko">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/src/common/asset/svg/favicon.svg" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <link rel='preload' href="/font/subset-PretendardVariable.woff2" />
     <link rel='preload' href="/font/subset-PretendardVariable.woff" />

diff --git a/apps/client/package.json b/apps/client/package.json
@@ -0,0 +1,71 @@
+{
+  "name": "client",
+  "version": "0.0.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "tsc && vite build",
+    "build-storybook": "storybook build",
+    "chromatic": "npx chromatic --project-token=chpt_f4088febbfb82b7",
+    "dev": "vite",
+    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "preview": "vite preview",
+    "storybook": "storybook dev -p 6006"
+  },
+  "dependencies": {
+    "@sentry/react": "^8.22.0",
+    "@tanstack/react-query": "^5.49.2",
+    "@tanstack/react-query-devtools": "^5.49.2",
+    "@tiki/icon": "workspace:^",
+    "@tiki/ui": "workspace:^",
+    "@tiki/utils": "workspace:^",
+    "axios": "^1.7.2",
+    "framer-motion": "^11.11.11",
+    "mime": "^4.0.4",
+    "react-hook-form": "^7.53.1",
+    "react-router-dom": "^6.24.1"
+  },
+  "devDependencies": {
+    "@chromatic-com/storybook": "^1.6.1",
+    "@eslint/js": "^9.6.0",
+    "@sentry/vite-plugin": "^2.21.1",
+    "@storybook/addon-a11y": "^8.2.6",
+    "@storybook/addon-essentials": "^8.2.6",
+    "@storybook/addon-interactions": "^8.2.6",
+    "@storybook/addon-links": "^8.2.6",
+    "@storybook/addon-onboarding": "^8.2.6",
+    "@storybook/blocks": "^8.2.6",
+    "@storybook/builder-vite": "^8.2.6",
+    "@storybook/react": "^8.2.6",
+    "@storybook/react-vite": "^8.2.6",
+    "@storybook/test": "^8.2.6",
+    "@tiki/tsconfig": "workspace:^",
+    "@trivago/prettier-plugin-sort-imports": "^4.3.0",
+    "@types/react-slick": "^0.23.13",
+    "@typescript-eslint/eslint-plugin": "^7.13.1",
+    "@typescript-eslint/parser": "^7.13.1",
+    "@vitejs/plugin-react": "^4.3.1",
+    "@vitejs/plugin-react-swc": "^3.5.0",
+    "chromatic": "^11.5.4",
+    "concurrently": "^9.0.1",
+    "eslint": "^8.57.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-import-resolver-typescript": "^3.6.1",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-jsx-a11y": "^6.9.0",
+    "eslint-plugin-prettier": "^5.1.3",
+    "eslint-plugin-react": "^7.34.3",
+    "eslint-plugin-react-hooks": "^4.6.2",
+    "eslint-plugin-react-refresh": "^0.4.7",
+    "eslint-plugin-storybook": "^0.8.0",
+    "globals": "^15.7.0",
+    "msw": "^2.3.1",
+    "prettier": "^3.3.2",
+    "rollup-plugin-visualizer": "^5.12.0",
+    "storybook": "^8.2.6",
+    "typescript-eslint": "^7.14.1",
+    "vite": "^5.3.2",
+    "vite-plugin-svgr": "^4.2.0",
+    "vite-tsconfig-paths": "^4.3.2"
+  }
+}
diff --git a/src/common/asset/svg/favicon.svg → apps/client/public/favicon.svg b/src/common/asset/svg/favicon.svg → apps/client/public/favicon.svg
diff --git a/public/font/subset-PretendardVariable.woff → ...ublic/font/subset-PretendardVariable.woff b/public/font/subset-PretendardVariable.woff → ...ublic/font/subset-PretendardVariable.woff
diff --git a/public/font/subset-PretendardVariable.woff2 → ...blic/font/subset-PretendardVariable.woff2 b/public/font/subset-PretendardVariable.woff2 → ...blic/font/subset-PretendardVariable.woff2
diff --git a/public/img/advBannerClub1.png → apps/client/public/img/advBannerClub1.png b/public/img/advBannerClub1.png → apps/client/public/img/advBannerClub1.png
diff --git a/public/img/advBannerClub1.webp → apps/client/public/img/advBannerClub1.webp b/public/img/advBannerClub1.webp → apps/client/public/img/advBannerClub1.webp
diff --git a/public/img/advBannerClub2.png → apps/client/public/img/advBannerClub2.png b/public/img/advBannerClub2.png → apps/client/public/img/advBannerClub2.png
diff --git a/public/img/advBannerClub2.webp → apps/client/public/img/advBannerClub2.webp b/public/img/advBannerClub2.webp → apps/client/public/img/advBannerClub2.webp
diff --git a/public/img/advBannerClub3.png → apps/client/public/img/advBannerClub3.png b/public/img/advBannerClub3.png → apps/client/public/img/advBannerClub3.png
diff --git a/public/img/advBannerClub3.webp → apps/client/public/img/advBannerClub3.webp b/public/img/advBannerClub3.webp → apps/client/public/img/advBannerClub3.webp
diff --git a/public/img/advBannerClub4.png → apps/client/public/img/advBannerClub4.png b/public/img/advBannerClub4.png → apps/client/public/img/advBannerClub4.png
diff --git a/public/img/advBannerClub4.webp → apps/client/public/img/advBannerClub4.webp b/public/img/advBannerClub4.webp → apps/client/public/img/advBannerClub4.webp
diff --git a/public/mockServiceWorker.js → apps/client/public/mockServiceWorker.js b/public/mockServiceWorker.js → apps/client/public/mockServiceWorker.js
diff --git a/src/App.tsx → apps/client/src/App.tsx b/src/App.tsx → apps/client/src/App.tsx
diff --git a/src/common/asset/img/comingsoon.png → ...lient/src/common/asset/img/comingsoon.png b/src/common/asset/img/comingsoon.png → ...lient/src/common/asset/img/comingsoon.png
diff --git a/src/common/asset/img/error.png → apps/client/src/common/asset/img/error.png b/src/common/asset/img/error.png → apps/client/src/common/asset/img/error.png
diff --git a/src/common/asset/img/landing01.png → ...client/src/common/asset/img/landing01.png b/src/common/asset/img/landing01.png → ...client/src/common/asset/img/landing01.png
diff --git a/src/common/asset/img/landing01.webp → ...lient/src/common/asset/img/landing01.webp b/src/common/asset/img/landing01.webp → ...lient/src/common/asset/img/landing01.webp
diff --git a/src/common/asset/img/service01.png → ...client/src/common/asset/img/service01.png b/src/common/asset/img/service01.png → ...client/src/common/asset/img/service01.png
diff --git a/src/common/asset/img/service01.webp → ...lient/src/common/asset/img/service01.webp b/src/common/asset/img/service01.webp → ...lient/src/common/asset/img/service01.webp
diff --git a/src/common/asset/img/service02.png → ...client/src/common/asset/img/service02.png b/src/common/asset/img/service02.png → ...client/src/common/asset/img/service02.png
diff --git a/src/common/asset/img/service02.webp → ...lient/src/common/asset/img/service02.webp b/src/common/asset/img/service02.webp → ...lient/src/common/asset/img/service02.webp
diff --git a/src/common/asset/img/workspace_complete.png → ...c/common/asset/img/workspace_complete.png b/src/common/asset/img/workspace_complete.png → ...c/common/asset/img/workspace_complete.png
diff --git a/src/common/asset/img/workspace_complete.webp → .../common/asset/img/workspace_complete.webp b/src/common/asset/img/workspace_complete.webp → .../common/asset/img/workspace_complete.webp
diff --git a/...red/component/CachedImage/CachedImage.tsx → ...mon/component/CachedImage/CachedImage.tsx b/...red/component/CachedImage/CachedImage.tsx → ...mon/component/CachedImage/CachedImage.tsx
@@ -1,6 +1,6 @@
-import { HTMLAttributes } from 'react';
+import { useCachedImage } from '@tiki/utils';
 
-import useCachedImage from '@/common/hook/useCachedImage';
+import { HTMLAttributes } from 'react';
 
 interface CachedImageProps extends HTMLAttributes<HTMLImageElement> {
   imageUrl: string;

diff --git a/...component/ErrorBoundary/ErrorBoundary.tsx → ...component/ErrorBoundary/ErrorBoundary.tsx b/...component/ErrorBoundary/ErrorBoundary.tsx → ...component/ErrorBoundary/ErrorBoundary.tsx
diff --git a/src/common/router/Router.tsx → apps/client/src/common/router/Router.tsx b/src/common/router/Router.tsx → apps/client/src/common/router/Router.tsx
diff --git a/src/common/router/lazy.ts → apps/client/src/common/router/lazy.ts b/src/common/router/lazy.ts → apps/client/src/common/router/lazy.ts
diff --git a/src/common/style/ellipsis.ts → apps/client/src/common/style/ellipsis.ts b/src/common/style/ellipsis.ts → apps/client/src/common/style/ellipsis.ts
diff --git a/src/common/style/globalStyle.ts → apps/client/src/common/style/globalStyle.ts b/src/common/style/globalStyle.ts → apps/client/src/common/style/globalStyle.ts
diff --git a/src/common/style/theme/emotion.d.ts → ...lient/src/common/style/theme/emotion.d.ts b/src/common/style/theme/emotion.d.ts → ...lient/src/common/style/theme/emotion.d.ts
diff --git a/src/main.tsx → apps/client/src/main.tsx b/src/main.tsx → apps/client/src/main.tsx
@@ -1,16 +1,14 @@
 import { Global, ThemeProvider } from '@emotion/react';
+import { ToastContainer, ToastProvider, theme } from '@tiki/ui';
 
 import React from 'react';
 import { createRoot } from 'react-dom/client';
 
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
 
-import ToastContainer from '@/common/component/ToastContainer/ToastContainer';
-import ToastProvider from '@/common/component/ToastContainer/ToastProvider';
 import { AppRouter } from '@/common/router/Router';
 import { GlobalStyle } from '@/common/style/globalStyle';
-import { theme } from '@/common/style/theme/theme';
 
 import { worker } from '@/mock/browser';
 

diff --git a/src/mock/browser.ts → apps/client/src/mock/browser.ts b/src/mock/browser.ts → apps/client/src/mock/browser.ts
diff --git a/src/mock/data/drive.ts → apps/client/src/mock/data/drive.ts b/src/mock/data/drive.ts → apps/client/src/mock/data/drive.ts
diff --git a/src/mock/data/showCase.ts → apps/client/src/mock/data/showCase.ts b/src/mock/data/showCase.ts → apps/client/src/mock/data/showCase.ts
diff --git a/src/mock/data/term.ts → apps/client/src/mock/data/term.ts b/src/mock/data/term.ts → apps/client/src/mock/data/term.ts
diff --git a/src/mock/data/timeLine.ts → apps/client/src/mock/data/timeLine.ts b/src/mock/data/timeLine.ts → apps/client/src/mock/data/timeLine.ts
diff --git a/src/mock/handler/index.ts → apps/client/src/mock/handler/index.ts b/src/mock/handler/index.ts → apps/client/src/mock/handler/index.ts
diff --git a/src/mock/handler/showCase.ts → apps/client/src/mock/handler/showCase.ts b/src/mock/handler/showCase.ts → apps/client/src/mock/handler/showCase.ts
diff --git a/src/mock/handler/timeLine.ts → apps/client/src/mock/handler/timeLine.ts b/src/mock/handler/timeLine.ts → apps/client/src/mock/handler/timeLine.ts
diff --git a/src/mock/handler/workspace.ts → apps/client/src/mock/handler/workspace.ts b/src/mock/handler/workspace.ts → apps/client/src/mock/handler/workspace.ts
diff --git a/...ge/archiving/index/ArchivingPage.style.ts → ...ge/archiving/index/ArchivingPage.style.ts b/...ge/archiving/index/ArchivingPage.style.ts → ...ge/archiving/index/ArchivingPage.style.ts
diff --git a/src/page/archiving/index/ArchivingPage.tsx → ...rc/page/archiving/index/ArchivingPage.tsx b/src/page/archiving/index/ArchivingPage.tsx → ...rc/page/archiving/index/ArchivingPage.tsx
@@ -1,9 +1,8 @@
+import { Button, Flex } from '@tiki/ui';
+
 import { Suspense, useEffect } from 'react';
 import { useLocation } from 'react-router-dom';
 
-import Button from '@/common/component/Button/Button';
-import Flex from '@/common/component/Flex/Flex';
-
 import { contentStyle, pageStyle, timelineStyle } from '@/page/archiving/index/ArchivingPage.style';
 import DateProvider from '@/page/archiving/index/DateProvider';
 import TimeLine from '@/page/archiving/index/component/TimeLine';

diff --git a/src/page/archiving/index/DateProvider.tsx → ...src/page/archiving/index/DateProvider.tsx b/src/page/archiving/index/DateProvider.tsx → ...src/page/archiving/index/DateProvider.tsx
diff --git a/...omponent/DocumentBar/DocumentBar.style.ts → ...omponent/DocumentBar/DocumentBar.style.ts b/...omponent/DocumentBar/DocumentBar.style.ts → ...omponent/DocumentBar/DocumentBar.style.ts
@@ -1,6 +1,5 @@
 import { css } from '@emotion/react';
-
-import { theme } from '@/common/style/theme/theme';
+import { theme } from '@tiki/ui';
 
 export const containerStyle = (blockSelected: string) =>
   css({

diff --git a/...dex/component/DocumentBar/DocumentBar.tsx → ...dex/component/DocumentBar/DocumentBar.tsx b/...dex/component/DocumentBar/DocumentBar.tsx → ...dex/component/DocumentBar/DocumentBar.tsx
@@ -1,6 +1,6 @@
-import { ForwardedRef, forwardRef } from 'react';
+import { theme } from '@tiki/ui';
 
-import { theme } from '@/common/style/theme/theme';
+import { ForwardedRef, forwardRef } from 'react';
 
 import { containerStyle } from '@/page/archiving/index/component/DocumentBar/DocumentBar.style';
 import { Block } from '@/page/archiving/index/type/blockType';

diff --git a/.../component/DocumentBar/Item/Item.style.ts → .../component/DocumentBar/Item/Item.style.ts b/.../component/DocumentBar/Item/Item.style.ts → .../component/DocumentBar/Item/Item.style.ts
@@ -1,6 +1,5 @@
 import { css } from '@emotion/react';
-
-import { theme } from '@/common/style/theme/theme';
+import { theme } from '@tiki/ui';
 
 export const containerStyle = css({
   display: 'flex',

diff --git a/...index/component/DocumentBar/Item/Item.tsx → ...index/component/DocumentBar/Item/Item.tsx b/...index/component/DocumentBar/Item/Item.tsx → ...index/component/DocumentBar/Item/Item.tsx
@@ -1,10 +1,8 @@
 /* eslint-disable jsx-a11y/click-events-have-key-events */
-import { ReactNode } from 'react';
+import { IcDelete, IcDownload } from '@tiki/icon';
+import { Flex, Text } from '@tiki/ui';
 
-import TrashBox from '@/common/asset/svg/ic_delete.svg?react';
-import Download from '@/common/asset/svg/ic_download.svg?react';
-import Flex from '@/common/component/Flex/Flex';
-import Text from '@/common/component/Text/Text';
+import { ReactNode } from 'react';
 
 import { containerStyle, fileNameStyle } from '@/page/archiving/index/component/DocumentBar/Item/Item.style';
 import { downloadDocument } from '@/page/archiving/index/util/document';
@@ -50,8 +48,8 @@ const Item = ({ documentId, children, fileUrl, fileName }: ItemProps) => {
           <Text tag="body6" css={fileNameStyle}>
             {fileName}
           </Text>
-          <Download width={20} height={20} css={{ cursor: 'pointer' }} onClick={handleDownloadClick} />
-          <TrashBox width={20} height={20} onClick={(e) => handleTrashBoxClick(e)} css={{ cursor: 'pointer' }} />
+          <IcDownload width={20} height={20} css={{ cursor: 'pointer' }} onClick={handleDownloadClick} />
+          <IcDelete width={20} height={20} onClick={(e) => handleTrashBoxClick(e)} css={{ cursor: 'pointer' }} />
         </Flex>
       </li>
     </>

diff --git a/...nt/DocumentBar/Selected/Selected.style.ts → ...nt/DocumentBar/Selected/Selected.style.ts b/...nt/DocumentBar/Selected/Selected.style.ts → ...nt/DocumentBar/Selected/Selected.style.ts
@@ -1,6 +1,5 @@
 import { css } from '@emotion/react';
-
-import { theme } from '@/common/style/theme/theme';
+import { theme } from '@tiki/ui';
 
 export const blockNameStyle = css({
   paddingRight: '0.4rem',

diff --git a/...mponent/DocumentBar/Selected/Selected.tsx → ...mponent/DocumentBar/Selected/Selected.tsx b/...mponent/DocumentBar/Selected/Selected.tsx → ...mponent/DocumentBar/Selected/Selected.tsx
@@ -1,8 +1,4 @@
-import Button from '@/common/component/Button/Button';
-import Flex from '@/common/component/Flex/Flex';
-import Heading from '@/common/component/Heading/Heading';
-import Text from '@/common/component/Text/Text';
-import { theme } from '@/common/style/theme/theme';
+import { Button, Flex, Heading, Text, theme } from '@tiki/ui';
 
 import DocumentItem from '@/page/archiving/index/component/DocumentBar/Item/Item';
 import { blockNameStyle, deleteBtnStyle } from '@/page/archiving/index/component/DocumentBar/Selected/Selected.style';

diff --git a/.../component/DocumentBar/Sort/Sort.style.ts → .../component/DocumentBar/Sort/Sort.style.ts b/.../component/DocumentBar/Sort/Sort.style.ts → .../component/DocumentBar/Sort/Sort.style.ts
@@ -1,6 +1,5 @@
 import { css } from '@emotion/react';
-
-import { theme } from '@/common/style/theme/theme';
+import { theme } from '@tiki/ui';
 
 export const buttonStyle = css({
   display: 'flex',

diff --git a/...index/component/DocumentBar/Sort/Sort.tsx → ...index/component/DocumentBar/Sort/Sort.tsx b/...index/component/DocumentBar/Sort/Sort.tsx → ...index/component/DocumentBar/Sort/Sort.tsx
@@ -1,7 +1,7 @@
-import { useEffect } from 'react';
+import { Select } from '@tiki/ui';
+import { useOutsideClick, useOverlay } from '@tiki/utils';
 
-import Select from '@/common/component/Select/Select';
-import { useOutsideClick, useOverlay } from '@/common/hook';
+import { useEffect } from 'react';
 
 import { fontStyle } from '@/page/archiving/index/component/DocumentBar/Sort/Sort.style';
 import { OPTIONS } from '@/page/archiving/index/constant/sortOption';

diff --git a/...dex/component/DocumentBar/Total/Total.tsx → ...dex/component/DocumentBar/Total/Total.tsx b/...dex/component/DocumentBar/Total/Total.tsx → ...dex/component/DocumentBar/Total/Total.tsx
@@ -1,10 +1,8 @@
-import { useState } from 'react';
+import { IcSearch } from '@tiki/icon';
+import { Flex, Input, Text } from '@tiki/ui';
+import { useDebounce } from '@tiki/utils';
 
-import SearchIc from '@/common/asset/svg/ic_search.svg?react';
-import Flex from '@/common/component/Flex/Flex';
-import Input from '@/common/component/Input/Input';
-import Text from '@/common/component/Text/Text';
-import { useDebounce } from '@/common/hook';
+import { useState } from 'react';
 
 import Item from '@/page/archiving/index/component/DocumentBar/Item/Item';
 import { blockNameStyle } from '@/page/archiving/index/component/DocumentBar/Item/Item.style';
@@ -41,7 +39,7 @@ const DocumentTotal = () => {
         <Input
           placeholder={'문서를 검색해보세요'}
           value={searchWord}
-          LeftIcon={<SearchIc />}
+          LeftIcon={<IcSearch />}
           onChange={(e) => {
             setSearchWord(e.target.value);
           }}

diff --git a/...TimeBlockBar/BlockInfo/BlockInfo.style.ts → ...TimeBlockBar/BlockInfo/BlockInfo.style.ts b/...TimeBlockBar/BlockInfo/BlockInfo.style.ts → ...TimeBlockBar/BlockInfo/BlockInfo.style.ts
@@ -1,6 +1,5 @@
 import { css } from '@emotion/react';
-
-import { theme } from '@/common/style/theme/theme';
+import { theme } from '@tiki/ui';
 
 export const periodStyle = css({
   color: theme.colors.gray_800,

diff --git a/...nent/TimeBlockBar/BlockInfo/BlockInfo.tsx → ...nent/TimeBlockBar/BlockInfo/BlockInfo.tsx b/...nent/TimeBlockBar/BlockInfo/BlockInfo.tsx → ...nent/TimeBlockBar/BlockInfo/BlockInfo.tsx
@@ -1,8 +1,4 @@
-import DatePicker from '@/common/component/DatePicker';
-import Flex from '@/common/component/Flex/Flex';
-import Heading from '@/common/component/Heading/Heading';
-import Input from '@/common/component/Input/Input';
-import Text from '@/common/component/Text/Text';
+import { DatePicker, Flex, Heading, Input, Text } from '@tiki/ui';
 
 import { periodStyle, titleInputStyle } from '@/page/archiving/index/component/TimeBlockBar/BlockInfo/BlockInfo.style';
 import { formattingDate } from '@/page/archiving/index/util/date';

diff --git a/...es/TaggedNoteItem/TaggedNoteItem.style.ts → ...es/TaggedNoteItem/TaggedNoteItem.style.ts b/...es/TaggedNoteItem/TaggedNoteItem.style.ts → ...es/TaggedNoteItem/TaggedNoteItem.style.ts