From bc1ea337f45e1b8c66f6cae2c7b60ddaeed07965 Mon Sep 17 00:00:00 2001 From: ChanLee_KR Date: Sun, 13 Oct 2024 20:47:07 +0900 Subject: [PATCH] =?UTF-8?q?chore:=20ds=20core=20=ED=8C=A8=ED=82=A4?= =?UTF-8?q?=EC=A7=80=20=EC=A0=81=EC=9A=A9=20(#ATR-605)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- apps/service/package.json | 2 + apps/service/src/app/(service)/layout.tsx | 5 +- apps/service/src/app/(service)/provider.tsx | 8 +- packages/config/attraction-preset.js | 101 ++++++++++---------- packages/config/package.json | 3 + pnpm-lock.yaml | 12 ++- 6 files changed, 76 insertions(+), 55 deletions(-) diff --git a/apps/service/package.json b/apps/service/package.json index 40100b00..ae6fdd34 100644 --- a/apps/service/package.json +++ b/apps/service/package.json @@ -14,6 +14,8 @@ "lint-staged": "lint-staged" }, "dependencies": { + "@attraction/ds-core": "workspace:^", + "@attraction/ds-hooks": "workspace:^", "@attraction/design-system": "workspace:^", "@attraction/icons": "workspace:^", "@attraction/utils": "workspace:^", diff --git a/apps/service/src/app/(service)/layout.tsx b/apps/service/src/app/(service)/layout.tsx index 5ddf7d4b..a36359cb 100644 --- a/apps/service/src/app/(service)/layout.tsx +++ b/apps/service/src/app/(service)/layout.tsx @@ -3,8 +3,11 @@ import Script from 'next/script' import type { PropsWithChildren } from 'react' import '@/app/style/font.css' +import '@attraction/ds-core/dist/token.css' +import '@attraction/ds-core/dist/component.css' // TODO: 스타일 캡슐화 적용 시 제거 +import '@attraction/ds-core/dist/index.css' +import '@attraction/design-system/dist/index.css' // TODO: 디자인 시스템 개편 시 제거 import '@/app/style/index.css' -import '@attraction/design-system/dist/index.css' import { useSession } from '@/entities/auth' import Provider from './provider' diff --git a/apps/service/src/app/(service)/provider.tsx b/apps/service/src/app/(service)/provider.tsx index 5402a207..92da8dc1 100644 --- a/apps/service/src/app/(service)/provider.tsx +++ b/apps/service/src/app/(service)/provider.tsx @@ -1,14 +1,15 @@ -/* eslint-disable react/jsx-key */ +'use client' +/* eslint-disable react/jsx-key */ +import { PropsWithChildren, ReactElement, cloneElement } from 'react' +import { OverlayProvider } from '@attraction/ds-core' import { AuthProvider, DefaultAuthState } from '@/entities/auth' import { ChannelTalkProvider } from '@/entities/channel-talk' import { ModalProvider } from '@/entities/modal' import { PWAProvider } from '@/entities/pwa' import { ThemeProvider } from '@/entities/theme' import { ToastUIProvider } from '@/entities/toast-ui' - import { DeviceProvider, QueryProvider } from '@/shared/lib' -import { PropsWithChildren, ReactElement, cloneElement } from 'react' interface MultiProviderProps { providers: ReactElement[] @@ -41,6 +42,7 @@ export default function Provider({ , , , + , , ]}> {children} diff --git a/packages/config/attraction-preset.js b/packages/config/attraction-preset.js index 90d7db49..a54615a9 100644 --- a/packages/config/attraction-preset.js +++ b/packages/config/attraction-preset.js @@ -1,4 +1,5 @@ import defaultTheme from 'tailwindcss/defaultTheme' +import { $variable } from '@attraction/ds-core' /** @type {import('tailwindcss').Config} */ export default { @@ -11,64 +12,64 @@ export default { }, colors: { gray: { - 50: '#F4F6F8', - 100: '#DDE0E3', - 200: '#C2C7CC', - 300: '#A6ADB5', - 400: '#8A949E', - 500: '#6F7A86', - 600: '#58616A', - 700: '#3C4249', - 800: '#202427', - 900: '#131517', + 50: $variable.color.gray050, + 100: $variable.color.gray100, + 200: $variable.color.gray200, + 300: $variable.color.gray300, + 400: $variable.color.gray400, + 500: $variable.color.gray500, + 600: $variable.color.gray600, + 700: $variable.color.gray700, + 800: $variable.color.gray800, + 900: $variable.color.gray900, }, red: { - 50: '#FBE9E9', - 100: '#F8D3D4', - 200: '#F2B0B1', - 300: '#EB8586', - 400: '#E14B4D', - 500: '#D22325', - 600: '#A61C1E', - 700: '#831617', - 800: '#561C1D', - 900: '#3B1617', + 50: $variable.color.red050, + 100: $variable.color.red100, + 200: $variable.color.red200, + 300: $variable.color.red300, + 400: $variable.color.red400, + 500: $variable.color.red500, + 600: $variable.color.red600, + 700: $variable.color.red700, + 800: $variable.color.red800, + 900: $variable.color.red900, }, yellow: { - 50: '#FFF5E0', - 100: '#FFE7B8', - 200: '#FFDA8F', - 300: '#FFBF3D', - 400: '#FFAB01', - 500: '#EB9D00', - 600: '#C28200', - 700: '#8F6000', - 800: '#543D0E', - 900: '#3D2C0B', + 50: $variable.color.yellow050, + 100: $variable.color.yellow100, + 200: $variable.color.yellow200, + 300: $variable.color.yellow300, + 400: $variable.color.yellow400, + 500: $variable.color.yellow500, + 600: $variable.color.yellow600, + 700: $variable.color.yellow700, + 800: $variable.color.yellow800, + 900: $variable.color.yellow900, }, green: { - 50: '#E5FAF1', - 100: '#B1F1D6', - 200: '#75E6B6', - 300: '#39DB97', - 400: '#23BE7D', - 500: '#1EA46C', - 600: '#198A5B', - 700: '#15704A', - 800: '#133D2B', - 900: '#0F2E21', + 50: $variable.color.green050, + 100: $variable.color.green100, + 200: $variable.color.green200, + 300: $variable.color.green300, + 400: $variable.color.green400, + 500: $variable.color.green500, + 600: $variable.color.green600, + 700: $variable.color.green700, + 800: $variable.color.green800, + 900: $variable.color.green900, }, blue: { - 50: '#E5EFFA', - 100: '#C3DAF3', - 200: '#99BFEB', - 300: '#77AAE4', - 400: '#3B84D8', - 500: '#256BBB', - 600: '#1D5391', - 700: '#163F6F', - 800: '#233851', - 900: '#192739', + 50: $variable.color.blue050, + 100: $variable.color.blue100, + 200: $variable.color.blue200, + 300: $variable.color.blue300, + 400: $variable.color.blue400, + 500: $variable.color.blue500, + 600: $variable.color.blue600, + 700: $variable.color.blue700, + 800: $variable.color.blue800, + 900: $variable.color.blue900, }, }, ...defaultTheme.colors, diff --git a/packages/config/package.json b/packages/config/package.json index 57d8ffde..a5aa455c 100644 --- a/packages/config/package.json +++ b/packages/config/package.json @@ -3,5 +3,8 @@ "version": "1.0.0", "description": "", "license": "ISC", + "dependencies": { + "@attraction/ds-core": "workspace:^" + }, "scripts": {} } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index eef5ac5f..bf673586 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -80,6 +80,12 @@ importers: '@attraction/design-system': specifier: workspace:^ version: link:../../packages/design-system + '@attraction/ds-core': + specifier: workspace:^ + version: link:../../packages/design-system/packages/core + '@attraction/ds-hooks': + specifier: workspace:^ + version: link:../../packages/design-system/packages/hooks '@attraction/icons': specifier: workspace:^ version: link:../../packages/icons @@ -154,7 +160,11 @@ importers: specifier: ^5.92.0 version: 5.92.1(@swc/core@1.5.7) - packages/config: {} + packages/config: + dependencies: + '@attraction/ds-core': + specifier: workspace:^ + version: link:../design-system/packages/core packages/design-system: dependencies: