diff --git a/.github/workflows/prod-ci-cd.yml b/.github/workflows/prod-ci-cd.yml index dd5f7aaa..616a33ee 100644 --- a/.github/workflows/prod-ci-cd.yml +++ b/.github/workflows/prod-ci-cd.yml @@ -48,6 +48,7 @@ jobs: env: VITE_SERVER_URL: ${{ secrets.VITE_SERVER_URL }} VITE_KAKAO_JAVASCRIPT_KEY: ${{ secrets.VITE_KAKAO_JAVASCRIPT_KEY }} + VITE_SUPABASE_PUBLIC_KEY: ${{ secrets.VITE_SUPABASE_PUBLIC_KEY }} run: yarn build # Step 7: 빌드 결과물 저장 @@ -58,7 +59,7 @@ jobs: cd: runs-on: ubuntu-latest - if: github.event_name == 'push' # push일 때만 실행 + if: github.event_name == 'push' # push일 때만 실행 needs: ci steps: # Step 1: AWS 인증 diff --git a/.github/workflows/publish-storybook.yml b/.github/workflows/publish-storybook.yml index 4f21c94c..b92983bc 100644 --- a/.github/workflows/publish-storybook.yml +++ b/.github/workflows/publish-storybook.yml @@ -38,7 +38,23 @@ jobs: projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }} onlyChanged: true # Only run Chromatic on changed stories - - name: Comment on PR + - name: Comment on PR (with snapshot changes) + if: steps.chromatic.outputs.changeCount != '0' uses: thollander/actions-comment-pull-request@v3 with: - message: '✨ **Storybook preview** : ${{ steps.chromatic.outputs.storybookUrl }}' + message: | + ✨ Storybook + 👉 ${{ steps.chromatic.outputs.storybookUrl }} + + 📸 변경된 스냅샷 + 👉 ${{ steps.chromatic.outputs.buildUrl }} + + - name: Comment on PR (no snapshot changes) + if: steps.chromatic.outputs.changeCount == '0' + uses: thollander/actions-comment-pull-request@v3 + with: + message: | + ✨ Storybook + 👉 ${{ steps.chromatic.outputs.storybookUrl }} + + ✅ 스냅샷 변경 없음 diff --git a/.storybook/preview.ts b/.storybook/preview.ts index 17ed33f4..a40c6683 100644 --- a/.storybook/preview.ts +++ b/.storybook/preview.ts @@ -1,12 +1,16 @@ import type { Preview } from '@storybook/react'; - +import { initialize, mswLoader } from 'msw-storybook-addon'; import { ThemeProvider } from 'styled-components'; import { withThemeFromJSXProvider } from '@storybook/addon-themes'; import theme from '../src/shared/styles/theme'; import GlobalStyles from '../src/shared/styles/globalStyles'; +// Initialize MSW +initialize(); + const preview: Preview = { parameters: { + chromatic: { disableSnapshot: true }, // 기본적으로 Chromatic 스냅샷 비활성화 (필요한 스토리에서만 활성화한다) controls: { matchers: { color: /(background|color)$/i, @@ -25,6 +29,9 @@ const preview: Preview = { GlobalStyles, }), ], + + // Provide the MSW addon loader globally + loaders: [mswLoader], }; export default preview; diff --git a/package.json b/package.json index 6ce01e27..04e62f48 100644 --- a/package.json +++ b/package.json @@ -55,7 +55,7 @@ "@storybook/addon-onboarding": "^8.5.0", "@storybook/addon-themes": "^8.5.2", "@storybook/blocks": "^8.5.0", - "@storybook/react": "^8.5.0", + "@storybook/react": "^8.6.12", "@storybook/react-vite": "^8.5.0", "@storybook/test": "^8.5.0", "@tanstack/eslint-plugin-query": "^5.68.0", @@ -84,8 +84,9 @@ "eslint-plugin-storybook": "^0.11.2", "globals": "^15.14.0", "msw": "^2.7.0", + "msw-storybook-addon": "^2.0.6", "prettier": "^3.4.2", - "storybook": "^8.5.0", + "storybook": "^8.6.12", "storybook-addon-pseudo-states": "^4.0.2", "typescript": "^5.7.3", "typescript-eslint": "^8.18.2", diff --git a/src/features/expense-management/ui/MemberExpenses/index.styles.ts b/src/features/expense-management/ui/MemberExpenses/index.styles.ts index e32a114f..9a7c6a49 100644 --- a/src/features/expense-management/ui/MemberExpenses/index.styles.ts +++ b/src/features/expense-management/ui/MemberExpenses/index.styles.ts @@ -1,5 +1,4 @@ import styled from 'styled-components'; -import Text from '@/shared/ui/Text'; export const MemberExpensesContainer = styled.div` display: flex; @@ -28,28 +27,3 @@ export const ProfileContainer = styled.div` gap: ${({ theme }) => theme.unit[4]}; flex-shrink: 0; `; - -export const ProfileImg = styled.img` - width: ${({ theme }) => theme.unit[36]}; - height: ${({ theme }) => theme.unit[36]}; - object-fit: contain; - border-radius: 50%; -`; - -export const ProfileWrapper = styled.div` - position: relative; // 부모 요소 - display: flex; - align-items: flex-start; - justify-content: flex-end; -`; - -export const DeleteButtonWrapper = styled.div` - position: absolute; // 자식 요소 - width: fit-content; - height: fit-content; -`; - -/* 이름 */ -export const NameText = styled(Text)` - white-space: nowrap; -`; diff --git a/src/features/expense-management/ui/MemberExpenses/index.tsx b/src/features/expense-management/ui/MemberExpenses/index.tsx index 44cb6aa5..7654601b 100644 --- a/src/features/expense-management/ui/MemberExpenses/index.tsx +++ b/src/features/expense-management/ui/MemberExpenses/index.tsx @@ -1,6 +1,6 @@ -import { SystemDanger } from '@/shared/assets/svgs/icon'; import NumberInput from '@/features/expense-management/ui/NumberInput'; import { ExpenseFormMember } from '@/entities/expense/model/expense.type'; +import MemberProfile from '@/shared/ui/MemberProfile'; import * as S from './index.styles'; interface MemberExpensesProps { @@ -14,18 +14,13 @@ function MemberExpenses({ members, onDelete }: MemberExpensesProps) { {members.map((member) => ( - - - {members.length > 1 ? ( - onDelete(member.name)}> - - - ) : null} - - {member.name} + onDelete(member.name)} + /> = { + title: 'ui/BankNameDrawer', + component: BankNameDrawer, + parameters: { + chromatic: { disableSnapshot: false }, + }, +}; + +export default meta; +type Story = StoryObj; + +export const Default: Story = { + args: { + open: true, + onClose: () => {}, + setBankName: () => {}, + }, +}; diff --git a/src/pages/addAccountStep/ui/BankNameDrawer/index.tsx b/src/pages/addAccountStep/ui/BankNameDrawer/index.tsx index 3bdf57aa..5be6ee6c 100644 --- a/src/pages/addAccountStep/ui/BankNameDrawer/index.tsx +++ b/src/pages/addAccountStep/ui/BankNameDrawer/index.tsx @@ -24,7 +24,7 @@ function BankNameDrawer({ open, onClose, setBankName }: BankNameDrawerProps) { theme.unit[20]}; display: flex; justify-content: center; align-items: center; diff --git a/src/pages/billDetail/ui/ExpenseMemberItem/index.style.ts b/src/pages/billDetail/ui/ExpenseMemberItem/index.style.ts index a6005280..14b0351e 100644 --- a/src/pages/billDetail/ui/ExpenseMemberItem/index.style.ts +++ b/src/pages/billDetail/ui/ExpenseMemberItem/index.style.ts @@ -1,6 +1,5 @@ import styled from 'styled-components'; import Accordion from '@/shared/ui/Accordion'; -import { ProfileImg as MemberProfileImg } from '@/shared/ui/MemberProfile/index.style'; export const Container = styled(Accordion)<{ isPaid: boolean }>` padding: ${({ theme }) => theme.unit[20]}; @@ -30,11 +29,6 @@ export const LeftWrapper = styled.div` gap: ${({ theme }) => theme.unit[8]}; `; -export const ProfileImg = styled(MemberProfileImg)` - width: ${({ theme }) => theme.unit[48]}; - height: ${({ theme }) => theme.unit[48]}; -`; - export const SubProfileWrapper = styled.div` display: flex; flex-direction: column; diff --git a/src/pages/billDetail/ui/ExpenseMemberItem/index.tsx b/src/pages/billDetail/ui/ExpenseMemberItem/index.tsx index a85fa526..b6f0bb13 100644 --- a/src/pages/billDetail/ui/ExpenseMemberItem/index.tsx +++ b/src/pages/billDetail/ui/ExpenseMemberItem/index.tsx @@ -8,6 +8,7 @@ import { Close, Confirm, Receipt } from '@/shared/assets/svgs/icon'; import BottomSheet from '@/shared/ui/BottomSheet'; import { MemberSettlement } from '@/entities/settlement/model/settlement.type'; import useUpdatePaymentStatus from '@/features/settlement-details/api/useUpdatePaymentStatus'; +import MemberProfileImage from '@/shared/ui/MemberProfileImage'; import * as S from './index.style'; import StatusChip from './ui/StatusChip'; @@ -64,7 +65,7 @@ function ExpenseMemberItem({ - + diff --git a/src/pages/billDetail/ui/ExpenseTimeHeader/index.stories.tsx b/src/pages/billDetail/ui/ExpenseTimeHeader/index.stories.tsx new file mode 100644 index 00000000..ebc7914c --- /dev/null +++ b/src/pages/billDetail/ui/ExpenseTimeHeader/index.stories.tsx @@ -0,0 +1,71 @@ +import { Meta, StoryObj } from '@storybook/react'; +import { waitFor, within } from '@storybook/test'; +import { createMemoryRouter, RouterProvider } from 'react-router'; +import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; +import { http, HttpResponse } from 'msw'; +import ExpenseTimeHeader from './index'; + +/** + * NOTE + * Flex 컴포넌트의 gap / padding 관련 변경에 대비해서 + * 스냅샷 기준을 만들기 위해 추가한 스토리입니다. + * + * 나중에 유지보수가 과도해질 경우 삭제해도 괜찮습니다. + */ + +const queryClient = new QueryClient(); + +const meta: Meta = { + title: 'ui/ExpenseTimeHeader', + component: ExpenseTimeHeader, + parameters: { + chromatic: { disableSnapshot: false }, + msw: { + handlers: [ + http.get('http://localhost:3000/api/v1/group/header', () => { + return HttpResponse.json({ + groupName: '모또 정기모임', + totalAmount: 150000, + deadline: '2025-12-26T23:59:59Z', + bank: '국민은행', + accountNumber: '123456-78-910111', + }); + }), + ], + }, + }, + decorators: [ + (Story) => { + const mockRouter = createMemoryRouter([ + { + path: '/*', + element: , + loader: () => ({ groupToken: 'mock-group-token' }), + }, + ]); + return ( + + + + ); + }, + ], +}; + +export default meta; +type Story = StoryObj; + +export const Default: Story = { + args: { + totalMember: 6, + paidMember: 3, + status: 'success', + isChecked: false, + }, + play: async ({ canvasElement }) => { + const canvas = within(canvasElement); + await waitFor(() => { + canvas.getByText('정산을 완료해주세요'); + }); + }, +}; diff --git a/src/pages/billDetail/ui/ExpenseTimeHeader/index.style.ts b/src/pages/billDetail/ui/ExpenseTimeHeader/index.style.ts index e83ac71a..0f346f0f 100644 --- a/src/pages/billDetail/ui/ExpenseTimeHeader/index.style.ts +++ b/src/pages/billDetail/ui/ExpenseTimeHeader/index.style.ts @@ -29,10 +29,8 @@ export const ModdoImage = styled.img` export const ExpenseChip = styled.div` display: flex; background: ${({ theme }) => theme.color.semantic.primary.default}; - color: ${({ theme }) => theme.color.semantic.text.inverse}; border-radius: ${({ theme }) => theme.radius.circle}; padding: ${({ theme }) => `${theme.unit[12]} ${theme.unit[20]}`}; - font-size: ${TextVariant('body1Sb')}; `; export const TotalMoney = styled.span` @@ -56,6 +54,13 @@ export const TimeBox = styled.div` align-items: center; `; +export const Timer = styled.div` + display: grid; + width: 174px; + grid-template-columns: repeat(5, auto); + place-items: center; +`; + export const TimeSep = styled.span` color: ${({ theme }) => theme.color.semantic.secondary.strong}; font-size: 1.75rem; diff --git a/src/pages/billDetail/ui/ExpenseTimeHeader/index.tsx b/src/pages/billDetail/ui/ExpenseTimeHeader/index.tsx index b66f9951..809f7856 100644 --- a/src/pages/billDetail/ui/ExpenseTimeHeader/index.tsx +++ b/src/pages/billDetail/ui/ExpenseTimeHeader/index.tsx @@ -172,19 +172,18 @@ function ExpenseTimeHeader({ } sub={ - + 정산 계좌: {accountFormat} } bgColor="semantic.background.normal.alternative" /> -
@@ -195,10 +194,13 @@ function ExpenseTimeHeader({ width="32" style={{ paddingRight: `${theme.unit[8]}` }} /> - + {paidMember} - {`/${totalMember} 정산 완료`} + {`/${totalMember} 정산 완료`} - + 정산 마감까지 남은 시간 - - - {([hours, minutes, seconds] as number[]).map( - (time, index, arr) => ( - // eslint-disable-next-line react/no-array-index-key - - - {String(time).padStart(2, '0')} - - {index < arr.length - 1 && :} - - ) - )} - - - {['시', '분', '초'].map((label) => ( - - {label} + + {([hours, minutes, seconds] as number[]).map((time, index, arr) => ( + // eslint-disable-next-line react/no-array-index-key + + + {String(time).padStart(2, '0')} - ))} - - + {index < arr.length - 1 && :} + + ))} + {['시', '분', '초'].map((label, idx) => ( + + {label} + + ))} + = { + title: 'pages/HomePage', + component: HomePage, + parameters: { + chromatic: { disableSnapshot: false }, + }, + decorators: [ + (Story) => { + const mockRouter = createMemoryRouter([ + { + path: '/*', + element: , + }, + ]); + return ; + }, + ], +}; + +export default meta; +type Story = StoryObj; + +export const Default: Story = {}; diff --git a/src/pages/home/HomePage.tsx b/src/pages/home/HomePage.tsx index 66a92351..85bb9442 100644 --- a/src/pages/home/HomePage.tsx +++ b/src/pages/home/HomePage.tsx @@ -68,7 +68,7 @@ function HomePage() { fill={theme.color.semantic.orange.default} onClick={() => navigate(ROUTE.login)} /> - + @@ -79,9 +79,9 @@ function HomePage() { bgColor={theme.color.semantic.primary.default} height="136px" borderRadius={theme.radius.default} - margin={5} - px={5} - py={5} + margin={20} + px={20} + py={18} > navigate(ROUTE.selectGroup)}> 정산하기 @@ -91,13 +91,15 @@ function HomePage() { fill={theme.color.semantic.orange.default} /> - - - 모임은 즐겁게, 정산은 깔끔하게! -
- 모또만 믿고 맡겨줘! -
-
+ + 모임은 즐겁게, 정산은 깔끔하게! +
+ 모또만 믿고 맡겨줘! +
@@ -115,10 +117,15 @@ function HomePage() { - + 진행중인 정산 - - + + handleSettlementTypeButtonClick('RECEIVE')} @@ -132,8 +139,10 @@ function HomePage() { 보낼 정산 - - 최신순 + + + 최신순 + @@ -154,11 +163,11 @@ function HomePage() { {settlementType === 'SEND' && ( diff --git a/src/pages/home/ui/HomeExpenseItem/index.tsx b/src/pages/home/ui/HomeExpenseItem/index.tsx index 69743c75..cccb9635 100644 --- a/src/pages/home/ui/HomeExpenseItem/index.tsx +++ b/src/pages/home/ui/HomeExpenseItem/index.tsx @@ -1,6 +1,7 @@ import { DollarCircle } from '@/shared/assets/svgs/icon'; import { useTheme } from 'styled-components'; import Text from '@/shared/ui/Text'; +import Flex from '@/shared/ui/Flex'; import DefaultProgressBar from '../DefaultProgressBar'; import * as S from './index.style'; @@ -43,19 +44,14 @@ function HomeExpenseItem({ width={`${theme.unit[28]}`} style={{ paddingRight: `${theme.unit[4]}` }} /> -
-

+ + {paidMember} -

- {`/${totalMember} 정산 완료`} -
+
+ + {`/${totalMember} 정산 완료`} + +
diff --git a/src/pages/login/LoginEntranceView.stories.tsx b/src/pages/login/LoginEntranceView.stories.tsx new file mode 100644 index 00000000..9eb4faff --- /dev/null +++ b/src/pages/login/LoginEntranceView.stories.tsx @@ -0,0 +1,15 @@ +import { Meta, StoryObj } from '@storybook/react'; +import LoginEntranceView from './LoginEntranceView'; + +const meta: Meta = { + title: 'pages/LoginEntranceView', + component: LoginEntranceView, + parameters: { + chromatic: { disableSnapshot: false }, + }, +}; + +export default meta; +type Story = StoryObj; + +export const Default: Story = {}; diff --git a/src/pages/login/LoginEntranceView.styles.tsx b/src/pages/login/LoginEntranceView.styles.tsx new file mode 100644 index 00000000..57f2a38f --- /dev/null +++ b/src/pages/login/LoginEntranceView.styles.tsx @@ -0,0 +1,26 @@ +import styled from 'styled-components'; + +export const ImgContainer = styled.div` + display: flex; + flex-direction: column; + align-items: center; + position: relative; + width: 100%; + height: 330px; +`; + +export const EntranceImg = styled.img` + width: 60%; + max-width: 17.25rem; + height: auto; + object-fit: contain; + position: absolute; + top: 33%; +`; + +export const LogoImg = styled.img` + width: 44%; + max-width: 12.625rem; + height: 4.125rem; + object-fit: contain; +`; diff --git a/src/pages/login/LoginEntranceView.tsx b/src/pages/login/LoginEntranceView.tsx new file mode 100644 index 00000000..35a2036c --- /dev/null +++ b/src/pages/login/LoginEntranceView.tsx @@ -0,0 +1,34 @@ +import { useTheme } from 'styled-components'; +import LogoImg from '@/shared/assets/pngs/LogoImg.png'; +import EntranceModdo from '@/shared/assets/pngs/EntranceModdo.png'; +import Flex from '@/shared/ui/Flex'; +import { CoinLottie } from '@/shared/ui/Lottie'; +import Text from '@/shared/ui/Text'; +import * as S from './LoginEntranceView.styles'; + +// 로그인 페이지 전에 잠시 보여지는 진입 페이지 +function LoginEntranceView() { + const theme = useTheme(); + return ( + + + + + 모또와 함께라면 정산 걱정 끝! + + + + + + + + ); +} +export default LoginEntranceView; diff --git a/src/pages/login/LoginPage.style.ts b/src/pages/login/LoginPage.styles.ts similarity index 57% rename from src/pages/login/LoginPage.style.ts rename to src/pages/login/LoginPage.styles.ts index 3713144e..ce3812eb 100644 --- a/src/pages/login/LoginPage.style.ts +++ b/src/pages/login/LoginPage.styles.ts @@ -1,23 +1,5 @@ import styled from 'styled-components'; -export const ImgContainer = styled.div` - display: flex; - flex-direction: column; - align-items: center; - position: relative; - width: 100%; - height: 330px; -`; - -export const EntranceImg = styled.img` - width: 60%; - max-width: 17.25rem; - height: auto; - object-fit: contain; - position: absolute; - top: 33%; -`; - export const LogoImg = styled.img` width: 44%; max-width: 12.625rem; @@ -69,27 +51,3 @@ export const BottomWrapper = styled.footer` max-width: 600px; min-width: 320px; `; - -export const BottomButton = styled.button<{ - $bgColor?: string; - color?: string; -}>` - display: flex; - justify-content: center; - align-items: center; - background-color: ${({ $bgColor }) => $bgColor || 'black'}; - color: ${({ color }) => color || 'black'}; - font-weight: 600; - border-radius: 9999px; - padding: 1rem 0.875rem; // 16px 14px - /* height: fit-content; */ - /* height: 100px; */ - width: 100%; - line-height: 1.5; - cursor: pointer; - - &:hover { - filter: brightness(0.9); - transition: filter 0.1s; - } -`; diff --git a/src/pages/login/LoginPage.tsx b/src/pages/login/LoginPage.tsx index f0afb5ee..1e4a9c9d 100644 --- a/src/pages/login/LoginPage.tsx +++ b/src/pages/login/LoginPage.tsx @@ -3,14 +3,13 @@ import Text from '@/shared/ui/Text'; import { useNavigate } from 'react-router'; import { ROUTE } from '@/shared/config/route'; import { useEffect, useState } from 'react'; -import { CoinLottie } from '@/shared/ui/Lottie'; -import EntranceModdo from '@/shared/assets/pngs/EntranceModdo.png'; import theme from '@/shared/styles/theme'; import Button from '@/shared/ui/Button'; import { Kakao } from '@/shared/assets/svgs/icon'; import Flex from '@/shared/ui/Flex'; import { useGetGuestToken } from '@/entities/auth/api/useGetGuestToken'; -import * as S from './LoginPage.style'; +import LoginEntranceView from './LoginEntranceView'; +import * as S from './LoginPage.styles'; function LoginPage() { const { refetch: getGuestToken } = useGetGuestToken(); @@ -36,27 +35,7 @@ function LoginPage() { }, []); if (isEntrance) { - return ( - - - - - 모또와 함께라면 정산 걱정 끝! - - - - - - - - ); + return ; } return ( @@ -75,7 +54,7 @@ function LoginPage() { - + - -
+ + + + - + 총{' '} @@ -107,11 +105,14 @@ function AddMember({ members, groupToken }: AddMemberProps) { - + {members.map((member) => ( ))} diff --git a/src/pages/selectGroup/SelectGroupPage.stories.tsx b/src/pages/selectGroup/SelectGroupPage.stories.tsx new file mode 100644 index 00000000..38f68c03 --- /dev/null +++ b/src/pages/selectGroup/SelectGroupPage.stories.tsx @@ -0,0 +1,57 @@ +import { Meta, StoryObj } from '@storybook/react'; +import { http, HttpResponse } from 'msw'; +import { createMemoryRouter, RouterProvider } from 'react-router'; +import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; +import SelectGroupPage from './SelectGroupPage'; + +/** + * NOTE + * Flex 컴포넌트의 gap / padding 관련 변경에 대비해서 + * 스냅샷 기준을 만들기 위해 추가한 스토리입니다. + * + * 나중에 유지보수가 과도해질 경우 삭제해도 괜찮습니다. + */ + +const queryClient = new QueryClient(); + +const meta: Meta = { + title: 'pages/SelectGroupPage', + component: SelectGroupPage, + parameters: { + chromatic: { disableSnapshot: true }, + msw: { + handlers: [ + http.get('http://localhost:3000/api/v1/group/header', () => { + return HttpResponse.json({ + groupName: '모또 정기모임', + totalAmount: 150000, + deadline: '2025-12-26T23:59:59Z', + bank: '국민은행', + accountNumber: '123456-78-910111', + }); + }), + ], + }, + }, + decorators: [ + (Story) => { + const mockRouter = createMemoryRouter([ + { + path: '/*', + element: , + loader: () => ({ groupToken: 'mock-group-token' }), + }, + ]); + return ( + + + + ); + }, + ], +}; + +export default meta; +type Story = StoryObj; + +export const Default: Story = {}; diff --git a/src/pages/selectGroup/SelectGroupPage.tsx b/src/pages/selectGroup/SelectGroupPage.tsx index 7a6e95f8..8a8a9047 100644 --- a/src/pages/selectGroup/SelectGroupPage.tsx +++ b/src/pages/selectGroup/SelectGroupPage.tsx @@ -32,33 +32,24 @@ function SelectGroupPage() { showIcon type="TitleLeft" handleBackButtonClick={() => navigate(-1)} - bgColor="#f1f3f5" + bgColor="semantic.background.normal.alternative" />
- - 정산을 시작하려는 - - - 모임을 선택해 주세요. - - - } + title={`정산을 시작하려는\n모임을 선택해 주세요.`} sub="새로운 정산을 시작하려면 새로 생성을 선택해주세요." bgColor="semantic.primary.subtle" /> - + navigate(ROUTE.groupSetup)} diff --git a/src/shared/api/axios.ts b/src/shared/api/axios.ts index 966ec40f..b6429c69 100644 --- a/src/shared/api/axios.ts +++ b/src/shared/api/axios.ts @@ -2,7 +2,7 @@ import axios, { AxiosHeaders } from 'axios'; import { ROUTE } from '@/shared/config/route'; const axiosInstance = axios.create({ - baseURL: `${import.meta.env.VITE_SERVER_URL}/api/v1`, + baseURL: `${import.meta.env.VITE_SERVER_URL}/functions/v1`, withCredentials: true, headers: { 'Content-Type': 'application/json', @@ -27,6 +27,13 @@ axiosInstance.interceptors.request.use( 'X-Mock-Request': 'true', }); } + // SUPABASE용 apikey 헤더 추가 (필요 시) + else if (newConfig.url?.split('?')[0].endsWith('user/guest/token')) { + newConfig.headers = AxiosHeaders.from({ + ...newConfig.headers, + apikey: import.meta.env.VITE_SUPABASE_PUBLIC_KEY, + }); + } return newConfig; }, (error) => { diff --git a/src/shared/ui/Flex/index.tsx b/src/shared/ui/Flex/index.tsx index 40fa0099..c339c9b3 100644 --- a/src/shared/ui/Flex/index.tsx +++ b/src/shared/ui/Flex/index.tsx @@ -6,6 +6,13 @@ interface FlexProps extends Omit, 'color'>, FlexStyledProps {} +/** + * Flex 컨테이너 + * spacing 값은 theme.unit 토큰 사용 (예: 16 = 1rem = 16px) + * 숫자 토큰 → px 문자열 → rem 문자열 순으로 fallback 처리됨 + * @example + */ + const Flex = forwardRef(({ ...props }, ref) => { return ; }); diff --git a/src/shared/ui/MemberProfile/index.stories.ts b/src/shared/ui/MemberProfile/index.stories.ts new file mode 100644 index 00000000..0f126643 --- /dev/null +++ b/src/shared/ui/MemberProfile/index.stories.ts @@ -0,0 +1,34 @@ +import type { Meta, StoryObj } from '@storybook/react'; +import MemberProfile from './index'; + +const meta: Meta = { + title: 'ui/MemberProfile', + component: MemberProfile, + parameters: { + chromatic: { disableSnapshot: false }, + }, +}; +export default meta; +type Story = StoryObj; + +export const ManagerProfile: Story = { + args: { + id: 1, + name: '모또', + canDelete: false, + handleDeleteButtonClick: () => { + alert('삭제 버튼 클릭됨'); + }, + }, +}; + +export const ParticipantProfile: Story = { + args: { + id: 1, + name: '모또', + canDelete: true, + handleDeleteButtonClick: () => { + alert('삭제 버튼 클릭됨'); + }, + }, +}; diff --git a/src/shared/ui/MemberProfile/index.tsx b/src/shared/ui/MemberProfile/index.tsx index 36ebef4c..8537f9ef 100644 --- a/src/shared/ui/MemberProfile/index.tsx +++ b/src/shared/ui/MemberProfile/index.tsx @@ -2,36 +2,41 @@ import defaultProfileImg from '@/shared/assets/pngs/defaultProfileImg.png'; import { SystemDanger } from '@/shared/assets/svgs/icon'; import Text from '@/shared/ui/Text'; import Flex from '@/shared/ui/Flex'; -import { Member } from '@/entities/member/model/member.type'; import * as S from './index.style'; interface MemberProfileProps { - member: Member; + id: number; + profile?: string; + name: string; + canDelete?: boolean; handleDeleteButtonClick: (id: number) => void; } function MemberProfile({ - member, + id, + profile, + name, + canDelete = true, handleDeleteButtonClick, }: MemberProfileProps) { return ( - {member.role !== 'MANAGER' && ( - handleDeleteButtonClick(member.id)}> + {canDelete && ( + handleDeleteButtonClick(id)}> )} - + - {member.name} + {name} ); } diff --git a/src/shared/ui/MemberProfileImage/index.stories.ts b/src/shared/ui/MemberProfileImage/index.stories.ts new file mode 100644 index 00000000..a142e9a5 --- /dev/null +++ b/src/shared/ui/MemberProfileImage/index.stories.ts @@ -0,0 +1,35 @@ +import type { Meta, StoryObj } from '@storybook/react'; +import MemberProfileImage from './index'; + +const meta: Meta = { + title: 'components/MemberProfileImage', + component: MemberProfileImage, + tags: ['autodocs'], + parameters: { + chromatic: { disableSnapshot: false }, + }, +}; + +export default meta; +type Story = StoryObj; + +export const SmallProfileImage: Story = { + args: { + src: '', + size: 'sm', + }, +}; + +export const MediumProfileImage: Story = { + args: { + src: '', + size: 'md', + }, +}; + +export const LargeProfileImage: Story = { + args: { + src: '', + size: 'lg', + }, +}; diff --git a/src/shared/ui/MemberProfileImage/index.styles.ts b/src/shared/ui/MemberProfileImage/index.styles.ts new file mode 100644 index 00000000..dc500253 --- /dev/null +++ b/src/shared/ui/MemberProfileImage/index.styles.ts @@ -0,0 +1,18 @@ +import styled from 'styled-components'; + +interface ProfileImgProps { + $size: 'sm' | 'md' | 'lg'; +} + +const sizeMap = { + sm: '2.25rem', + md: '2.5rem', + lg: '4.25rem', +} as const; + +export const Image = styled.img` + width: ${(props) => sizeMap[props.$size]}; + height: ${(props) => sizeMap[props.$size]}; + object-fit: contain; + border-radius: 50%; +`; diff --git a/src/shared/ui/MemberProfileImage/index.tsx b/src/shared/ui/MemberProfileImage/index.tsx new file mode 100644 index 00000000..113e0274 --- /dev/null +++ b/src/shared/ui/MemberProfileImage/index.tsx @@ -0,0 +1,13 @@ +import defaultProfileImg from '@/shared/assets/pngs/defaultProfileImg.png'; +import * as S from './index.styles'; + +interface MemberProfileImageProps { + src?: string; + size: 'sm' | 'md' | 'lg'; +} + +function MemberProfileImage({ src, size }: MemberProfileImageProps) { + return ; +} + +export default MemberProfileImage; diff --git a/src/shared/ui/Text/index.tsx b/src/shared/ui/Text/index.tsx index 588ca28e..3606d19f 100644 --- a/src/shared/ui/Text/index.tsx +++ b/src/shared/ui/Text/index.tsx @@ -9,6 +9,7 @@ interface TextProps { as?: ElementType; children: React.ReactNode; textAlign?: CSSProperties['textAlign']; + style?: CSSProperties; } function Text({ @@ -18,6 +19,7 @@ function Text({ as = 'span', textAlign, children, + style, }: TextProps) { return ( {children} diff --git a/yarn.lock b/yarn.lock index b07ec201..9175cfcd 100644 --- a/yarn.lock +++ b/yarn.lock @@ -991,126 +991,256 @@ resolved "https://registry.yarnpkg.com/@esbuild/aix-ppc64/-/aix-ppc64-0.24.2.tgz#38848d3e25afe842a7943643cbcd387cc6e13461" integrity sha512-thpVCb/rhxE/BnMLQ7GReQLLN8q9qbHmI55F4489/ByVg2aQaQ6kbcLb6FHkocZzQhxc4gx0sCk0tJkKBFzDhA== +"@esbuild/aix-ppc64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/aix-ppc64/-/aix-ppc64-0.25.12.tgz#80fcbe36130e58b7670511e888b8e88a259ed76c" + integrity sha512-Hhmwd6CInZ3dwpuGTF8fJG6yoWmsToE+vYgD4nytZVxcu1ulHpUQRAB1UJ8+N1Am3Mz4+xOByoQoSZf4D+CpkA== + "@esbuild/android-arm64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.24.2.tgz#f592957ae8b5643129fa889c79e69cd8669bb894" integrity sha512-cNLgeqCqV8WxfcTIOeL4OAtSmL8JjcN6m09XIgro1Wi7cF4t/THaWEa7eL5CMoMBdjoHOTh/vwTO/o2TRXIyzg== +"@esbuild/android-arm64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.25.12.tgz#8aa4965f8d0a7982dc21734bf6601323a66da752" + integrity sha512-6AAmLG7zwD1Z159jCKPvAxZd4y/VTO0VkprYy+3N2FtJ8+BQWFXU+OxARIwA46c5tdD9SsKGZ/1ocqBS/gAKHg== + "@esbuild/android-arm@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.24.2.tgz#72d8a2063aa630308af486a7e5cbcd1e134335b3" integrity sha512-tmwl4hJkCfNHwFB3nBa8z1Uy3ypZpxqxfTQOcHX+xRByyYgunVbZ9MzUUfb0RxaHIMnbHagwAxuTL+tnNM+1/Q== +"@esbuild/android-arm@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.25.12.tgz#300712101f7f50f1d2627a162e6e09b109b6767a" + integrity sha512-VJ+sKvNA/GE7Ccacc9Cha7bpS8nyzVv0jdVgwNDaR4gDMC/2TTRc33Ip8qrNYUcpkOHUT5OZ0bUcNNVZQ9RLlg== + "@esbuild/android-x64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.24.2.tgz#9a7713504d5f04792f33be9c197a882b2d88febb" integrity sha512-B6Q0YQDqMx9D7rvIcsXfmJfvUYLoP722bgfBlO5cGvNVb5V/+Y7nhBE3mHV9OpxBf4eAS2S68KZztiPaWq4XYw== +"@esbuild/android-x64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.25.12.tgz#87dfb27161202bdc958ef48bb61b09c758faee16" + integrity sha512-5jbb+2hhDHx5phYR2By8GTWEzn6I9UqR11Kwf22iKbNpYrsmRB18aX/9ivc5cabcUiAT/wM+YIZ6SG9QO6a8kg== + "@esbuild/darwin-arm64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.24.2.tgz#02ae04ad8ebffd6e2ea096181b3366816b2b5936" integrity sha512-kj3AnYWc+CekmZnS5IPu9D+HWtUI49hbnyqk0FLEJDbzCIQt7hg7ucF1SQAilhtYpIujfaHr6O0UHlzzSPdOeA== +"@esbuild/darwin-arm64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.25.12.tgz#79197898ec1ff745d21c071e1c7cc3c802f0c1fd" + integrity sha512-N3zl+lxHCifgIlcMUP5016ESkeQjLj/959RxxNYIthIg+CQHInujFuXeWbWMgnTo4cp5XVHqFPmpyu9J65C1Yg== + "@esbuild/darwin-x64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.24.2.tgz#9ec312bc29c60e1b6cecadc82bd504d8adaa19e9" integrity sha512-WeSrmwwHaPkNR5H3yYfowhZcbriGqooyu3zI/3GGpF8AyUdsrrP0X6KumITGA9WOyiJavnGZUwPGvxvwfWPHIA== +"@esbuild/darwin-x64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.25.12.tgz#146400a8562133f45c4d2eadcf37ddd09718079e" + integrity sha512-HQ9ka4Kx21qHXwtlTUVbKJOAnmG1ipXhdWTmNXiPzPfWKpXqASVcWdnf2bnL73wgjNrFXAa3yYvBSd9pzfEIpA== + "@esbuild/freebsd-arm64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.24.2.tgz#5e82f44cb4906d6aebf24497d6a068cfc152fa00" integrity sha512-UN8HXjtJ0k/Mj6a9+5u6+2eZ2ERD7Edt1Q9IZiB5UZAIdPnVKDoG7mdTVGhHJIeEml60JteamR3qhsr1r8gXvg== +"@esbuild/freebsd-arm64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.25.12.tgz#1c5f9ba7206e158fd2b24c59fa2d2c8bb47ca0fe" + integrity sha512-gA0Bx759+7Jve03K1S0vkOu5Lg/85dou3EseOGUes8flVOGxbhDDh/iZaoek11Y8mtyKPGF3vP8XhnkDEAmzeg== + "@esbuild/freebsd-x64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.24.2.tgz#3fb1ce92f276168b75074b4e51aa0d8141ecce7f" integrity sha512-TvW7wE/89PYW+IevEJXZ5sF6gJRDY/14hyIGFXdIucxCsbRmLUcjseQu1SyTko+2idmCw94TgyaEZi9HUSOe3Q== +"@esbuild/freebsd-x64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.25.12.tgz#ea631f4a36beaac4b9279fa0fcc6ca29eaeeb2b3" + integrity sha512-TGbO26Yw2xsHzxtbVFGEXBFH0FRAP7gtcPE7P5yP7wGy7cXK2oO7RyOhL5NLiqTlBh47XhmIUXuGciXEqYFfBQ== + "@esbuild/linux-arm64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.24.2.tgz#856b632d79eb80aec0864381efd29de8fd0b1f43" integrity sha512-7HnAD6074BW43YvvUmE/35Id9/NB7BeX5EoNkK9obndmZBUk8xmJJeU7DwmUeN7tkysslb2eSl6CTrYz6oEMQg== +"@esbuild/linux-arm64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.25.12.tgz#e1066bce58394f1b1141deec8557a5f0a22f5977" + integrity sha512-8bwX7a8FghIgrupcxb4aUmYDLp8pX06rGh5HqDT7bB+8Rdells6mHvrFHHW2JAOPZUbnjUpKTLg6ECyzvas2AQ== + "@esbuild/linux-arm@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.24.2.tgz#c846b4694dc5a75d1444f52257ccc5659021b736" integrity sha512-n0WRM/gWIdU29J57hJyUdIsk0WarGd6To0s+Y+LwvlC55wt+GT/OgkwoXCXvIue1i1sSNWblHEig00GBWiJgfA== +"@esbuild/linux-arm@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.25.12.tgz#452cd66b20932d08bdc53a8b61c0e30baf4348b9" + integrity sha512-lPDGyC1JPDou8kGcywY0YILzWlhhnRjdof3UlcoqYmS9El818LLfJJc3PXXgZHrHCAKs/Z2SeZtDJr5MrkxtOw== + "@esbuild/linux-ia32@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.24.2.tgz#f8a16615a78826ccbb6566fab9a9606cfd4a37d5" integrity sha512-sfv0tGPQhcZOgTKO3oBE9xpHuUqguHvSo4jl+wjnKwFpapx+vUDcawbwPNuBIAYdRAvIDBfZVvXprIj3HA+Ugw== +"@esbuild/linux-ia32@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.25.12.tgz#b24f8acc45bcf54192c7f2f3be1b53e6551eafe0" + integrity sha512-0y9KrdVnbMM2/vG8KfU0byhUN+EFCny9+8g202gYqSSVMonbsCfLjUO+rCci7pM0WBEtz+oK/PIwHkzxkyharA== + "@esbuild/linux-loong64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.24.2.tgz#1c451538c765bf14913512c76ed8a351e18b09fc" integrity sha512-CN9AZr8kEndGooS35ntToZLTQLHEjtVB5n7dl8ZcTZMonJ7CCfStrYhrzF97eAecqVbVJ7APOEe18RPI4KLhwQ== +"@esbuild/linux-loong64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.25.12.tgz#f9cfffa7fc8322571fbc4c8b3268caf15bd81ad0" + integrity sha512-h///Lr5a9rib/v1GGqXVGzjL4TMvVTv+s1DPoxQdz7l/AYv6LDSxdIwzxkrPW438oUXiDtwM10o9PmwS/6Z0Ng== + "@esbuild/linux-mips64el@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.24.2.tgz#0846edeefbc3d8d50645c51869cc64401d9239cb" integrity sha512-iMkk7qr/wl3exJATwkISxI7kTcmHKE+BlymIAbHO8xanq/TjHaaVThFF6ipWzPHryoFsesNQJPE/3wFJw4+huw== +"@esbuild/linux-mips64el@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.25.12.tgz#575a14bd74644ffab891adc7d7e60d275296f2cd" + integrity sha512-iyRrM1Pzy9GFMDLsXn1iHUm18nhKnNMWscjmp4+hpafcZjrr2WbT//d20xaGljXDBYHqRcl8HnxbX6uaA/eGVw== + "@esbuild/linux-ppc64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.24.2.tgz#8e3fc54505671d193337a36dfd4c1a23b8a41412" integrity sha512-shsVrgCZ57Vr2L8mm39kO5PPIb+843FStGt7sGGoqiiWYconSxwTiuswC1VJZLCjNiMLAMh34jg4VSEQb+iEbw== +"@esbuild/linux-ppc64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.25.12.tgz#75b99c70a95fbd5f7739d7692befe60601591869" + integrity sha512-9meM/lRXxMi5PSUqEXRCtVjEZBGwB7P/D4yT8UG/mwIdze2aV4Vo6U5gD3+RsoHXKkHCfSxZKzmDssVlRj1QQA== + "@esbuild/linux-riscv64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.24.2.tgz#6a1e92096d5e68f7bb10a0d64bb5b6d1daf9a694" integrity sha512-4eSFWnU9Hhd68fW16GD0TINewo1L6dRrB+oLNNbYyMUAeOD2yCK5KXGK1GH4qD/kT+bTEXjsyTCiJGHPZ3eM9Q== +"@esbuild/linux-riscv64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.25.12.tgz#2e3259440321a44e79ddf7535c325057da875cd6" + integrity sha512-Zr7KR4hgKUpWAwb1f3o5ygT04MzqVrGEGXGLnj15YQDJErYu/BGg+wmFlIDOdJp0PmB0lLvxFIOXZgFRrdjR0w== + "@esbuild/linux-s390x@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.24.2.tgz#ab18e56e66f7a3c49cb97d337cd0a6fea28a8577" integrity sha512-S0Bh0A53b0YHL2XEXC20bHLuGMOhFDO6GN4b3YjRLK//Ep3ql3erpNcPlEFed93hsQAjAQDNsvcK+hV90FubSw== +"@esbuild/linux-s390x@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.25.12.tgz#17676cabbfe5928da5b2a0d6df5d58cd08db2663" + integrity sha512-MsKncOcgTNvdtiISc/jZs/Zf8d0cl/t3gYWX8J9ubBnVOwlk65UIEEvgBORTiljloIWnBzLs4qhzPkJcitIzIg== + "@esbuild/linux-x64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.24.2.tgz#8140c9b40da634d380b0b29c837a0b4267aff38f" integrity sha512-8Qi4nQcCTbLnK9WoMjdC9NiTG6/E38RNICU6sUNqK0QFxCYgoARqVqxdFmWkdonVsvGqWhmm7MO0jyTqLqwj0Q== +"@esbuild/linux-x64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.25.12.tgz#0583775685ca82066d04c3507f09524d3cd7a306" + integrity sha512-uqZMTLr/zR/ed4jIGnwSLkaHmPjOjJvnm6TVVitAa08SLS9Z0VM8wIRx7gWbJB5/J54YuIMInDquWyYvQLZkgw== + "@esbuild/netbsd-arm64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/netbsd-arm64/-/netbsd-arm64-0.24.2.tgz#65f19161432bafb3981f5f20a7ff45abb2e708e6" integrity sha512-wuLK/VztRRpMt9zyHSazyCVdCXlpHkKm34WUyinD2lzK07FAHTq0KQvZZlXikNWkDGoT6x3TD51jKQ7gMVpopw== +"@esbuild/netbsd-arm64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/netbsd-arm64/-/netbsd-arm64-0.25.12.tgz#f04c4049cb2e252fe96b16fed90f70746b13f4a4" + integrity sha512-xXwcTq4GhRM7J9A8Gv5boanHhRa/Q9KLVmcyXHCTaM4wKfIpWkdXiMog/KsnxzJ0A1+nD+zoecuzqPmCRyBGjg== + "@esbuild/netbsd-x64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.24.2.tgz#7a3a97d77abfd11765a72f1c6f9b18f5396bcc40" integrity sha512-VefFaQUc4FMmJuAxmIHgUmfNiLXY438XrL4GDNV1Y1H/RW3qow68xTwjZKfj/+Plp9NANmzbH5R40Meudu8mmw== +"@esbuild/netbsd-x64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.25.12.tgz#77da0d0a0d826d7c921eea3d40292548b258a076" + integrity sha512-Ld5pTlzPy3YwGec4OuHh1aCVCRvOXdH8DgRjfDy/oumVovmuSzWfnSJg+VtakB9Cm0gxNO9BzWkj6mtO1FMXkQ== + "@esbuild/openbsd-arm64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/openbsd-arm64/-/openbsd-arm64-0.24.2.tgz#58b00238dd8f123bfff68d3acc53a6ee369af89f" integrity sha512-YQbi46SBct6iKnszhSvdluqDmxCJA+Pu280Av9WICNwQmMxV7nLRHZfjQzwbPs3jeWnuAhE9Jy0NrnJ12Oz+0A== +"@esbuild/openbsd-arm64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/openbsd-arm64/-/openbsd-arm64-0.25.12.tgz#6296f5867aedef28a81b22ab2009c786a952dccd" + integrity sha512-fF96T6KsBo/pkQI950FARU9apGNTSlZGsv1jZBAlcLL1MLjLNIWPBkj5NlSz8aAzYKg+eNqknrUJ24QBybeR5A== + "@esbuild/openbsd-x64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.24.2.tgz#0ac843fda0feb85a93e288842936c21a00a8a205" integrity sha512-+iDS6zpNM6EnJyWv0bMGLWSWeXGN/HTaF/LXHXHwejGsVi+ooqDfMCCTerNFxEkM3wYVcExkeGXNqshc9iMaOA== +"@esbuild/openbsd-x64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.25.12.tgz#f8d23303360e27b16cf065b23bbff43c14142679" + integrity sha512-MZyXUkZHjQxUvzK7rN8DJ3SRmrVrke8ZyRusHlP+kuwqTcfWLyqMOE3sScPPyeIXN/mDJIfGXvcMqCgYKekoQw== + +"@esbuild/openharmony-arm64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/openharmony-arm64/-/openharmony-arm64-0.25.12.tgz#49e0b768744a3924be0d7fd97dd6ce9b2923d88d" + integrity sha512-rm0YWsqUSRrjncSXGA7Zv78Nbnw4XL6/dzr20cyrQf7ZmRcsovpcRBdhD43Nuk3y7XIoW2OxMVvwuRvk9XdASg== + "@esbuild/sunos-x64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.24.2.tgz#8b7aa895e07828d36c422a4404cc2ecf27fb15c6" integrity sha512-hTdsW27jcktEvpwNHJU4ZwWFGkz2zRJUz8pvddmXPtXDzVKTTINmlmga3ZzwcuMpUvLw7JkLy9QLKyGpD2Yxig== +"@esbuild/sunos-x64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.25.12.tgz#a6ed7d6778d67e528c81fb165b23f4911b9b13d6" + integrity sha512-3wGSCDyuTHQUzt0nV7bocDy72r2lI33QL3gkDNGkod22EsYl04sMf0qLb8luNKTOmgF/eDEDP5BFNwoBKH441w== + "@esbuild/win32-arm64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.24.2.tgz#c023afb647cabf0c3ed13f0eddfc4f1d61c66a85" integrity sha512-LihEQ2BBKVFLOC9ZItT9iFprsE9tqjDjnbulhHoFxYQtQfai7qfluVODIYxt1PgdoyQkz23+01rzwNwYfutxUQ== +"@esbuild/win32-arm64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.25.12.tgz#9ac14c378e1b653af17d08e7d3ce34caef587323" + integrity sha512-rMmLrur64A7+DKlnSuwqUdRKyd3UE7oPJZmnljqEptesKM8wx9J8gx5u0+9Pq0fQQW8vqeKebwNXdfOyP+8Bsg== + "@esbuild/win32-ia32@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.24.2.tgz#96c356132d2dda990098c8b8b951209c3cd743c2" integrity sha512-q+iGUwfs8tncmFC9pcnD5IvRHAzmbwQ3GPS5/ceCyHdjXubwQWI12MKWSNSMYLJMq23/IUCvJMS76PDqXe1fxA== +"@esbuild/win32-ia32@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.25.12.tgz#918942dcbbb35cc14fca39afb91b5e6a3d127267" + integrity sha512-HkqnmmBoCbCwxUKKNPBixiWDGCpQGVsrQfJoVGYLPT41XWF8lHuE5N6WhVia2n4o5QK5M4tYr21827fNhi4byQ== + "@esbuild/win32-x64@0.24.2": version "0.24.2" resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.24.2.tgz#34aa0b52d0fbb1a654b596acfa595f0c7b77a77b" integrity sha512-7VTgWzgMGvup6aSqDPLiW5zHaxYJGTO4OokMjIlrCtf+VpEL+cXKtCvg723iguPYI5oaUNdS+/V7OU2gvXVWEg== +"@esbuild/win32-x64@0.25.12": + version "0.25.12" + resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.25.12.tgz#9bdad8176be7811ad148d1f8772359041f46c6c5" + integrity sha512-alJC0uCZpTFrSL0CCDjcgleBXPnCrEAhTBILpeAp7M/OFgoqtAetfBzX0xM00MUsVVPpVjlPuMbREqnZCXaTnA== + "@eslint-community/eslint-utils@^4.2.0", "@eslint-community/eslint-utils@^4.4.0": version "4.4.1" resolved "https://registry.yarnpkg.com/@eslint-community/eslint-utils/-/eslint-utils-4.4.1.tgz#d1145bf2c20132d6400495d6df4bf59362fd9d56" @@ -1829,15 +1959,20 @@ resolved "https://registry.yarnpkg.com/@storybook/components/-/components-8.5.3.tgz#8a7a17f01aeda6ae6fddadfa7e76a5a30bd333e1" integrity sha512-iC9VbpM8Equ8wXI2syBzov+8wys4sGYW7Xfz67LdSVbCMhsH9FRtvgbDppJQC/ZDCofg4sTAHhWpDV/KAQ385A== -"@storybook/core@8.5.3": - version "8.5.3" - resolved "https://registry.yarnpkg.com/@storybook/core/-/core-8.5.3.tgz#a353472e5069d127af7ada97f9db601c3d3cd1b5" - integrity sha512-ZLlr2pltbj/hmC54lggJTnh09FCAJR62lIdiXNwa+V+/eJz0CfD8tfGmZGKPSmaQeZBpMwAOeRM97k2oLPF+0w== +"@storybook/components@8.6.15": + version "8.6.15" + resolved "https://registry.yarnpkg.com/@storybook/components/-/components-8.6.15.tgz#9ea6172f8c1f505307649a34a00ff50082b1cbd4" + integrity sha512-+9GVKXPEW8Kl9zvNSTm9+VrJtx/puMZiO7gxCML63nK4aTWJXHQr4t9YUoGammSBM3AV1JglsKm6dBgJEeCoiA== + +"@storybook/core@8.6.15": + version "8.6.15" + resolved "https://registry.yarnpkg.com/@storybook/core/-/core-8.6.15.tgz#ba3aa59b02981136fa671d545b64d380c1188c8b" + integrity sha512-VFpKcphNurJpSC4fpUfKL3GTXVoL53oytghGR30QIw5jKWwaT50HVbTyb41BLOUuZjmMhUQA8weiQEew6RX0gw== dependencies: - "@storybook/csf" "0.1.12" + "@storybook/theming" "8.6.15" better-opn "^3.0.2" browser-assert "^1.2.1" - esbuild "^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0 || ^0.24.0" + esbuild "^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0 || ^0.24.0 || ^0.25.0" esbuild-register "^3.5.0" jsdoc-type-pratt-parser "^4.0.0" process "^0.11.10" @@ -1890,16 +2025,31 @@ resolved "https://registry.yarnpkg.com/@storybook/manager-api/-/manager-api-8.5.3.tgz#2a5c1b2e7d14b54d91ed75c94d9618198629cd40" integrity sha512-JtfuMgQpKIPU0ARn1jNPce8FmknpM0Ap0mppWl+KGAWWGadJPDaX/nrY/19dT1kRgIhyOnbX6tgJxII4E9dE5w== +"@storybook/manager-api@8.6.15": + version "8.6.15" + resolved "https://registry.yarnpkg.com/@storybook/manager-api/-/manager-api-8.6.15.tgz#a3e619388f58bae3925704a2e4105f6873f88263" + integrity sha512-ZOFtH821vFcwzECbFYFTKtSVO96Cvwwg45dMh3M/9bZIdN7klsloX7YNKw8OKvwE6XLFLsi2OvsNNcmTW6g88w== + "@storybook/preview-api@8.5.3": version "8.5.3" resolved "https://registry.yarnpkg.com/@storybook/preview-api/-/preview-api-8.5.3.tgz#8040c9c999154fe8a267db34d4f9064cc13e6e13" integrity sha512-dUsuXW+KgDg4tWXOB6dk5j5gwwRUzbPvicHAY9mzbpSVScbWXuE5T/S/9hHlbtfkhFroWQgPx2eB8z3rai+7RQ== +"@storybook/preview-api@8.6.15": + version "8.6.15" + resolved "https://registry.yarnpkg.com/@storybook/preview-api/-/preview-api-8.6.15.tgz#cd1e0d17b1d9a452bf4da081c05924be7edac22c" + integrity sha512-oqsp8f7QekB9RzpDqOXZQcPPRXXd/mTsnZSdAAQB/pBVqUpC9h/y5hgovbYnJ6DWXcpODbMwH+wbJHZu5lvm+w== + "@storybook/react-dom-shim@8.5.3": version "8.5.3" resolved "https://registry.yarnpkg.com/@storybook/react-dom-shim/-/react-dom-shim-8.5.3.tgz#422d6437872c69dda482016a06cad18f42325992" integrity sha512-kNIGk6mpXW3Wy+uS9pH9b9w/54EPJnH+QXA6MX4EQgmxhMQlGlS/l/YZp+3jsVQW4YgTmqe740qB+ccJAKZxBQ== +"@storybook/react-dom-shim@8.6.15": + version "8.6.15" + resolved "https://registry.yarnpkg.com/@storybook/react-dom-shim/-/react-dom-shim-8.6.15.tgz#772a1b15a28a7c000894238e2e9b995326eab9e8" + integrity sha512-m2trBmmd4iom1qwrp1F109zjRDc0cPaHYhDQxZR4Qqdz8pYevYJTlipDbH/K4NVB6Rn687RT29OoOPfJh6vkFA== + "@storybook/react-vite@^8.5.0": version "8.5.3" resolved "https://registry.yarnpkg.com/@storybook/react-vite/-/react-vite-8.5.3.tgz#c7259f579a38a0f070642e60de400388272da16e" @@ -1915,7 +2065,7 @@ resolve "^1.22.8" tsconfig-paths "^4.2.0" -"@storybook/react@8.5.3", "@storybook/react@^8.5.0": +"@storybook/react@8.5.3": version "8.5.3" resolved "https://registry.yarnpkg.com/@storybook/react/-/react-8.5.3.tgz#4f1c6cf68081b50434edbf9f6c0585c9f5121dee" integrity sha512-QIdBSjsnwV/J919i4Fi7DlwxDKHU815t0c4B/w2KTMtKKBkk+Bge+vgVi0/lNqD3eF4w3yjVWGbkzUQZ63yiPg== @@ -1927,6 +2077,18 @@ "@storybook/react-dom-shim" "8.5.3" "@storybook/theming" "8.5.3" +"@storybook/react@^8.6.12": + version "8.6.15" + resolved "https://registry.yarnpkg.com/@storybook/react/-/react-8.6.15.tgz#368759e7d24d0237efc3fab430dc029cf8f31ffc" + integrity sha512-hdnhlJg+YkpPMOw2hvK7+mhdxAbguA+TFTIAzVV9CeUYoHDIZAsgeKVhRmgZGN20NGjRN5ZcwkplAMJnF9v+6w== + dependencies: + "@storybook/components" "8.6.15" + "@storybook/global" "^5.0.0" + "@storybook/manager-api" "8.6.15" + "@storybook/preview-api" "8.6.15" + "@storybook/react-dom-shim" "8.6.15" + "@storybook/theming" "8.6.15" + "@storybook/test@8.5.3", "@storybook/test@^8.5.0": version "8.5.3" resolved "https://registry.yarnpkg.com/@storybook/test/-/test-8.5.3.tgz#96f51046182e026a89e923404733bf8968d5f290" @@ -1946,6 +2108,11 @@ resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-8.5.3.tgz#44462cc59a0ce66d2e714330399fae4672afda2e" integrity sha512-Jvzw+gT1HNarkJo21WZBq5pU89qDN8u/pD3woSh/1c2h5RS6UylWjQHotPFpcBIQiUSrDFtvCU9xugJm4MD0+w== +"@storybook/theming@8.6.15": + version "8.6.15" + resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-8.6.15.tgz#781e6b36f113a10e76379956b9451276e8d5bda2" + integrity sha512-dAbL0XOekyT6XsF49R6Etj3WxQ/LpdJDIswUUeHgVJ6/yd2opZOGbPxnwA3zlmAh1c0tvpPyhSDXxSG79u8e4Q== + "@surma/rollup-plugin-off-main-thread@^2.2.3": version "2.2.3" resolved "https://registry.yarnpkg.com/@surma/rollup-plugin-off-main-thread/-/rollup-plugin-off-main-thread-2.2.3.tgz#ee34985952ca21558ab0d952f00298ad2190c053" @@ -3738,7 +3905,39 @@ esbuild-register@^3.5.0: dependencies: debug "^4.3.4" -"esbuild@^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0 || ^0.24.0", esbuild@^0.24.2: +"esbuild@^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0 || ^0.24.0 || ^0.25.0": + version "0.25.12" + resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.25.12.tgz#97a1d041f4ab00c2fce2f838d2b9969a2d2a97a5" + integrity sha512-bbPBYYrtZbkt6Os6FiTLCTFxvq4tt3JKall1vRwshA3fdVztsLAatFaZobhkBC8/BrPetoa0oksYoKXoG4ryJg== + optionalDependencies: + "@esbuild/aix-ppc64" "0.25.12" + "@esbuild/android-arm" "0.25.12" + "@esbuild/android-arm64" "0.25.12" + "@esbuild/android-x64" "0.25.12" + "@esbuild/darwin-arm64" "0.25.12" + "@esbuild/darwin-x64" "0.25.12" + "@esbuild/freebsd-arm64" "0.25.12" + "@esbuild/freebsd-x64" "0.25.12" + "@esbuild/linux-arm" "0.25.12" + "@esbuild/linux-arm64" "0.25.12" + "@esbuild/linux-ia32" "0.25.12" + "@esbuild/linux-loong64" "0.25.12" + "@esbuild/linux-mips64el" "0.25.12" + "@esbuild/linux-ppc64" "0.25.12" + "@esbuild/linux-riscv64" "0.25.12" + "@esbuild/linux-s390x" "0.25.12" + "@esbuild/linux-x64" "0.25.12" + "@esbuild/netbsd-arm64" "0.25.12" + "@esbuild/netbsd-x64" "0.25.12" + "@esbuild/openbsd-arm64" "0.25.12" + "@esbuild/openbsd-x64" "0.25.12" + "@esbuild/openharmony-arm64" "0.25.12" + "@esbuild/sunos-x64" "0.25.12" + "@esbuild/win32-arm64" "0.25.12" + "@esbuild/win32-ia32" "0.25.12" + "@esbuild/win32-x64" "0.25.12" + +esbuild@^0.24.2: version "0.24.2" resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.24.2.tgz#b5b55bee7de017bff5fb8a4e3e44f2ebe2c3567d" integrity sha512-+9egpBW8I3CD5XPe0n6BfT5fxLzxrlDzqydF3aviG+9ni1lDC/OvMHcxqEFV0+LANZG5R1bFMWfUrjVsdwxJvA== @@ -4725,7 +4924,7 @@ is-negative-zero@^2.0.3: resolved "https://registry.yarnpkg.com/is-negative-zero/-/is-negative-zero-2.0.3.tgz#ced903a027aca6381b777a5743069d7376a49747" integrity sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw== -is-node-process@^1.2.0: +is-node-process@^1.0.1, is-node-process@^1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/is-node-process/-/is-node-process-1.2.0.tgz#ea02a1b90ddb3934a19aea414e88edef7e11d134" integrity sha512-Vg4o6/fqPxIjtxgUH5QLJhwZ7gW5diGCVlXpuUfELC62CuxM1iHcRe51f2W1FDy04Ai4KJkagKjx3XaqyfRKXw== @@ -5199,6 +5398,13 @@ ms@^2.1.1, ms@^2.1.3: resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.3.tgz#574c8138ce1d2b5861f0b44579dbadd60c6615b2" integrity sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA== +msw-storybook-addon@^2.0.6: + version "2.0.6" + resolved "https://registry.yarnpkg.com/msw-storybook-addon/-/msw-storybook-addon-2.0.6.tgz#0d49e4fbc49b14e97ba315db4222e0f0abb33a07" + integrity sha512-ExCwDbcJoM2V3iQU+fZNp+axVfNc7DWMRh4lyTXebDO8IbpUNYKGFUrA8UqaeWiRGKVuS7+fU+KXEa9b0OP6uA== + dependencies: + is-node-process "^1.0.1" + msw@^2.7.0: version "2.7.0" resolved "https://registry.yarnpkg.com/msw/-/msw-2.7.0.tgz#d13ff87f7e018fc4c359800ff72ba5017033fb56" @@ -6262,12 +6468,12 @@ storybook-addon-pseudo-states@^4.0.2: dependencies: "@storybook/icons" "^1.2.10" -storybook@^8.5.0: - version "8.5.3" - resolved "https://registry.yarnpkg.com/storybook/-/storybook-8.5.3.tgz#9758f0da8a9ee4f6a600370f64833fa5d3079c96" - integrity sha512-2WtNBZ45u1AhviRU+U+ld588tH8gDa702dNSq5C8UBaE9PlOsazGsyp90dw1s9YRvi+ejrjKAupQAU0GwwUiVg== +storybook@^8.6.12: + version "8.6.15" + resolved "https://registry.yarnpkg.com/storybook/-/storybook-8.6.15.tgz#eb4a3bae1ac0fe875bb322a412fac9709d9b5124" + integrity sha512-Ob7DMlwWx8s7dMvcQ3xPc02TvUeralb+xX3oaPRk9wY9Hc6M1IBC/7cEoITkSmRS2v38DHubC+mtEKNc1u2gQg== dependencies: - "@storybook/core" "8.5.3" + "@storybook/core" "8.6.15" streamx@^2.15.0, streamx@^2.21.0: version "2.22.0"