@tipp/ui 2.1.29 → 3.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/app/index.cjs +5 -2
- package/dist/app/index.cjs.map +1 -1
- package/dist/app/index.js +53 -53
- package/dist/app/platform/coach-question-list.js +26 -26
- package/dist/app/platform/contents-card.js +26 -26
- package/dist/app/platform/curriculum-card.js +2 -2
- package/dist/app/platform/edit-coaching-time.cjs +5 -2
- package/dist/app/platform/edit-coaching-time.cjs.map +1 -1
- package/dist/app/platform/edit-coaching-time.js +41 -41
- package/dist/app/platform/edit-service-type.cjs +5 -2
- package/dist/app/platform/edit-service-type.cjs.map +1 -1
- package/dist/app/platform/edit-service-type.js +40 -40
- package/dist/app/platform/goal-manage-card-edit.cjs +5 -2
- package/dist/app/platform/goal-manage-card-edit.cjs.map +1 -1
- package/dist/app/platform/goal-manage-card-edit.js +41 -41
- package/dist/app/platform/goal-manage-card-read.js +26 -26
- package/dist/app/platform/on-offline-radio-card.cjs +5 -2
- package/dist/app/platform/on-offline-radio-card.cjs.map +1 -1
- package/dist/app/platform/on-offline-radio-card.js +40 -40
- package/dist/app/platform/report-card.js +26 -26
- package/dist/app/platform/reservation-card.cjs +5 -2
- package/dist/app/platform/reservation-card.cjs.map +1 -1
- package/dist/app/platform/reservation-card.js +41 -41
- package/dist/app/platform/session-card.cjs +5 -2
- package/dist/app/platform/session-card.cjs.map +1 -1
- package/dist/app/platform/session-card.js +42 -42
- package/dist/app/platform/session-review-simple-read.js +26 -26
- package/dist/app/platform/userInfos/coaching-customer-info/index.js +28 -28
- package/dist/app/platform/userInfos/coaching-customer-info/large.js +26 -26
- package/dist/app/platform/userInfos/coaching-customer-info/medium.js +26 -26
- package/dist/app/platform/userInfos/coaching-customer-info/small.js +25 -25
- package/dist/app/platform/userInfos/session-user-info-detail.js +25 -25
- package/dist/app/platform/userInfos/utils.js +25 -25
- package/dist/atoms/index.js +61 -61
- package/dist/chunk-26D5QIDQ.js +174 -0
- package/dist/chunk-26D5QIDQ.js.map +1 -0
- package/dist/chunk-2GLHYOET.js +144 -0
- package/dist/chunk-2GLHYOET.js.map +1 -0
- package/dist/chunk-2TXMPG5S.js +145 -0
- package/dist/chunk-2TXMPG5S.js.map +1 -0
- package/dist/chunk-3QM2WUAX.js +281 -0
- package/dist/chunk-3QM2WUAX.js.map +1 -0
- package/dist/chunk-5DJ2LHPL.js +144 -0
- package/dist/chunk-5DJ2LHPL.js.map +1 -0
- package/dist/chunk-5K4VOWNF.js +84 -0
- package/dist/chunk-5K4VOWNF.js.map +1 -0
- package/dist/chunk-6327I3ZH.js +196 -0
- package/dist/chunk-6327I3ZH.js.map +1 -0
- package/dist/chunk-6D5RCEOQ.js +281 -0
- package/dist/chunk-6D5RCEOQ.js.map +1 -0
- package/dist/chunk-6KZBQD4O.js +231 -0
- package/dist/chunk-6KZBQD4O.js.map +1 -0
- package/dist/chunk-6Q6OHG2C.js +74 -0
- package/dist/chunk-6Q6OHG2C.js.map +1 -0
- package/dist/chunk-7S2RDGXN.js +101 -0
- package/dist/chunk-7S2RDGXN.js.map +1 -0
- package/dist/chunk-7SAWHUJA.js +89 -0
- package/dist/chunk-7SAWHUJA.js.map +1 -0
- package/dist/chunk-7WEVW6IN.js +28 -0
- package/dist/chunk-7WEVW6IN.js.map +1 -0
- package/dist/chunk-A4ZOVTFX.js +117 -0
- package/dist/chunk-A4ZOVTFX.js.map +1 -0
- package/dist/chunk-A75LCRKO.js +45 -0
- package/dist/chunk-A75LCRKO.js.map +1 -0
- package/dist/chunk-AJRM2CRN.js +281 -0
- package/dist/chunk-AJRM2CRN.js.map +1 -0
- package/dist/chunk-AY2MOPIM.js +64 -0
- package/dist/chunk-AY2MOPIM.js.map +1 -0
- package/dist/chunk-AZXDKQTU.js +49 -0
- package/dist/chunk-AZXDKQTU.js.map +1 -0
- package/dist/chunk-B35ENQ53.js +174 -0
- package/dist/chunk-B35ENQ53.js.map +1 -0
- package/dist/chunk-BMVBU4ZS.js +192 -0
- package/dist/chunk-BMVBU4ZS.js.map +1 -0
- package/dist/chunk-BQ2C4JPD.js +231 -0
- package/dist/chunk-BQ2C4JPD.js.map +1 -0
- package/dist/chunk-BQ4YWXRL.js +51 -0
- package/dist/chunk-BQ4YWXRL.js.map +1 -0
- package/dist/chunk-BUU2P46X.js +145 -0
- package/dist/chunk-BUU2P46X.js.map +1 -0
- package/dist/chunk-C4IWE6EG.js +169 -0
- package/dist/chunk-C4IWE6EG.js.map +1 -0
- package/dist/chunk-C7HMJBJA.js +53 -0
- package/dist/chunk-C7HMJBJA.js.map +1 -0
- package/dist/chunk-D4GJM3C3.js +69 -0
- package/dist/chunk-D4GJM3C3.js.map +1 -0
- package/dist/chunk-DE6WTN3Q.js +144 -0
- package/dist/chunk-DE6WTN3Q.js.map +1 -0
- package/dist/chunk-DOA3BJLX.js +144 -0
- package/dist/chunk-DOA3BJLX.js.map +1 -0
- package/dist/chunk-EL53KVY4.js +144 -0
- package/dist/chunk-EL53KVY4.js.map +1 -0
- package/dist/chunk-ERXU77DA.js +281 -0
- package/dist/chunk-ERXU77DA.js.map +1 -0
- package/dist/chunk-EWFUZOWN.js +281 -0
- package/dist/chunk-EWFUZOWN.js.map +1 -0
- package/dist/chunk-FAZOROOU.js +68 -0
- package/dist/chunk-FAZOROOU.js.map +1 -0
- package/dist/chunk-FENPJ55R.js +230 -0
- package/dist/chunk-FENPJ55R.js.map +1 -0
- package/dist/chunk-FNV6FVQA.js +61 -0
- package/dist/chunk-FNV6FVQA.js.map +1 -0
- package/dist/chunk-FWRJFBQW.js +57 -0
- package/dist/chunk-FWRJFBQW.js.map +1 -0
- package/dist/chunk-FY47YMFM.js +145 -0
- package/dist/chunk-FY47YMFM.js.map +1 -0
- package/dist/chunk-GWJMQBPR.js +231 -0
- package/dist/chunk-GWJMQBPR.js.map +1 -0
- package/dist/chunk-H2NGLG6A.js +363 -0
- package/dist/chunk-H2NGLG6A.js.map +1 -0
- package/dist/chunk-H5UOKPYZ.js +79 -0
- package/dist/chunk-H5UOKPYZ.js.map +1 -0
- package/dist/chunk-HPEQBAHB.js +165 -0
- package/dist/chunk-HPEQBAHB.js.map +1 -0
- package/dist/chunk-I3CMYMBL.js +233 -0
- package/dist/chunk-I3CMYMBL.js.map +1 -0
- package/dist/chunk-IME3WMKT.js +63 -0
- package/dist/chunk-IME3WMKT.js.map +1 -0
- package/dist/chunk-IPF2UOFH.js +63 -0
- package/dist/chunk-IPF2UOFH.js.map +1 -0
- package/dist/chunk-ITUS6SKB.js +64 -0
- package/dist/chunk-ITUS6SKB.js.map +1 -0
- package/dist/chunk-IZHU33JE.js +174 -0
- package/dist/chunk-IZHU33JE.js.map +1 -0
- package/dist/chunk-JEO4YX65.js +63 -0
- package/dist/chunk-JEO4YX65.js.map +1 -0
- package/dist/chunk-JSOXMJ6K.js +43 -0
- package/dist/chunk-JSOXMJ6K.js.map +1 -0
- package/dist/chunk-KO66SUJN.js +174 -0
- package/dist/chunk-KO66SUJN.js.map +1 -0
- package/dist/chunk-KTCFIAAM.js +281 -0
- package/dist/chunk-KTCFIAAM.js.map +1 -0
- package/dist/chunk-LEUTTEBC.js +63 -0
- package/dist/chunk-LEUTTEBC.js.map +1 -0
- package/dist/chunk-M2SQB6ZY.js +23 -0
- package/dist/chunk-M2SQB6ZY.js.map +1 -0
- package/dist/chunk-NVNCLLYC.js +63 -0
- package/dist/chunk-NVNCLLYC.js.map +1 -0
- package/dist/chunk-OV5F3JZH.js +54 -0
- package/dist/chunk-OV5F3JZH.js.map +1 -0
- package/dist/chunk-P2VBB4C5.js +65 -0
- package/dist/chunk-P2VBB4C5.js.map +1 -0
- package/dist/chunk-P5ARB7KK.js +174 -0
- package/dist/chunk-P5ARB7KK.js.map +1 -0
- package/dist/chunk-PKZ4JCB2.js +231 -0
- package/dist/chunk-PKZ4JCB2.js.map +1 -0
- package/dist/chunk-QQ4ZK4BW.js +37 -0
- package/dist/chunk-QQ4ZK4BW.js.map +1 -0
- package/dist/chunk-QTVX2ERL.js +99 -0
- package/dist/chunk-QTVX2ERL.js.map +1 -0
- package/dist/chunk-QZJHGU4X.js +145 -0
- package/dist/chunk-QZJHGU4X.js.map +1 -0
- package/dist/chunk-R77BOAW5.js +151 -0
- package/dist/chunk-R77BOAW5.js.map +1 -0
- package/dist/chunk-RPCKPFRL.js +145 -0
- package/dist/chunk-RPCKPFRL.js.map +1 -0
- package/dist/chunk-RTVZMGDC.js +144 -0
- package/dist/chunk-RTVZMGDC.js.map +1 -0
- package/dist/chunk-SLBSIRB6.js +58 -0
- package/dist/chunk-SLBSIRB6.js.map +1 -0
- package/dist/chunk-UIGZ3PK5.js +63 -0
- package/dist/chunk-UIGZ3PK5.js.map +1 -0
- package/dist/chunk-UKKISPC5.js +145 -0
- package/dist/chunk-UKKISPC5.js.map +1 -0
- package/dist/chunk-UPZMRMK7.js +29 -0
- package/dist/chunk-UPZMRMK7.js.map +1 -0
- package/dist/chunk-UXOYDVHH.js +63 -0
- package/dist/chunk-UXOYDVHH.js.map +1 -0
- package/dist/chunk-UZUQQLTU.js +63 -0
- package/dist/chunk-UZUQQLTU.js.map +1 -0
- package/dist/chunk-VBLQSRLF.js +63 -0
- package/dist/chunk-VBLQSRLF.js.map +1 -0
- package/dist/chunk-VDKHCZHN.js +63 -0
- package/dist/chunk-VDKHCZHN.js.map +1 -0
- package/dist/chunk-VE737SXT.js +30 -0
- package/dist/chunk-VE737SXT.js.map +1 -0
- package/dist/chunk-VL652LU6.js +281 -0
- package/dist/chunk-VL652LU6.js.map +1 -0
- package/dist/chunk-VO7GWTGE.js +163 -0
- package/dist/chunk-VO7GWTGE.js.map +1 -0
- package/dist/chunk-W3DLS557.js +144 -0
- package/dist/chunk-W3DLS557.js.map +1 -0
- package/dist/chunk-WB2EZAD2.js +87 -0
- package/dist/chunk-WB2EZAD2.js.map +1 -0
- package/dist/chunk-WEBCXOO7.js +30 -0
- package/dist/chunk-WEBCXOO7.js.map +1 -0
- package/dist/chunk-WZM6EE5T.js +174 -0
- package/dist/chunk-WZM6EE5T.js.map +1 -0
- package/dist/chunk-X2AK6LTW.js +174 -0
- package/dist/chunk-X2AK6LTW.js.map +1 -0
- package/dist/chunk-X4R5GV7Q.js +125 -0
- package/dist/chunk-X4R5GV7Q.js.map +1 -0
- package/dist/chunk-YL5EYCRV.js +233 -0
- package/dist/chunk-YL5EYCRV.js.map +1 -0
- package/dist/chunk-YOIAYFQM.js +39 -0
- package/dist/chunk-YOIAYFQM.js.map +1 -0
- package/dist/chunk-Z4YM6RFE.js +70 -0
- package/dist/chunk-Z4YM6RFE.js.map +1 -0
- package/dist/chunk-Z5TVNR2U.js +145 -0
- package/dist/chunk-Z5TVNR2U.js.map +1 -0
- package/dist/index.cjs +5 -2
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +101 -101
- package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/index.js +30 -30
- package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-comp.js +25 -25
- package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-body.js +29 -29
- package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-footer.js +25 -25
- package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-header.js +25 -25
- package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-layout.js +25 -25
- package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-radio.js +26 -26
- package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-satisfaction-option.js +26 -26
- package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-satisfaction-text.js +25 -25
- package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-text.js +26 -26
- package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/complete-review.js +25 -25
- package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/index.js +32 -32
- package/dist/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/start-review.js +26 -26
- package/dist/molecules/curriculumV2/CurriculumContents/curriculum-ai-traning.js +25 -25
- package/dist/molecules/curriculumV2/CurriculumContents/curriculum-review.js +33 -33
- package/dist/molecules/curriculumV2/CurriculumContents/curriculum-video.js +25 -25
- package/dist/molecules/curriculumV2/CurriculumContents/index.js +34 -34
- package/dist/molecules/curriculumV2/CurriculumSidebar/Items/curriculum-item-title.js +25 -25
- package/dist/molecules/curriculumV2/CurriculumSidebar/Items/curriculum-sidebar-item-wrapper.js +25 -25
- package/dist/molecules/curriculumV2/CurriculumSidebar/Items/section-item.js +25 -25
- package/dist/molecules/curriculumV2/CurriculumSidebar/Items/section-title.js +25 -25
- package/dist/molecules/curriculumV2/CurriculumSidebar/index.js +25 -25
- package/dist/molecules/curriculumV2/CurriculumSidebar/sidebar-item.js +25 -25
- package/dist/molecules/curriculumV2/curriculum-sub-nav.js +25 -25
- package/dist/molecules/curriculumV2/curriculum-v2-layout.js +25 -25
- package/dist/molecules/curriculumV2/index.js +34 -34
- package/dist/molecules/date-picker/date-picker-button.cjs +5 -2
- package/dist/molecules/date-picker/date-picker-button.cjs.map +1 -1
- package/dist/molecules/date-picker/date-picker-button.js +27 -27
- package/dist/molecules/date-picker/index.cjs +5 -2
- package/dist/molecules/date-picker/index.cjs.map +1 -1
- package/dist/molecules/date-picker/index.js +26 -26
- package/dist/molecules/expand-table/index.js +25 -25
- package/dist/molecules/expand-table/row.js +25 -25
- package/dist/molecules/index.cjs +5 -2
- package/dist/molecules/index.cjs.map +1 -1
- package/dist/molecules/index.js +42 -42
- package/dist/molecules/learning-post.js +2 -2
- package/dist/molecules/navigation.js +25 -25
- package/dist/molecules/radio-button-card.js +25 -25
- package/dist/molecules/stepper.js +2 -2
- package/dist/molecules/tag-selector.js +26 -26
- package/dist/molecules/time-select.js +25 -25
- package/package.json +3 -3
- package/src/molecules/date-picker/index.tsx +8 -7
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
import {
|
|
2
|
+
ReviewQuestionContentHeader
|
|
3
|
+
} from "./chunk-JSOXMJ6K.js";
|
|
4
|
+
import {
|
|
5
|
+
TextArea
|
|
6
|
+
} from "./chunk-3F45OPXG.js";
|
|
7
|
+
import {
|
|
8
|
+
Grid
|
|
9
|
+
} from "./chunk-EGEQY3KT.js";
|
|
10
|
+
import {
|
|
11
|
+
Callout
|
|
12
|
+
} from "./chunk-B6XJN6EC.js";
|
|
13
|
+
import {
|
|
14
|
+
Card
|
|
15
|
+
} from "./chunk-HEDMSFPW.js";
|
|
16
|
+
import {
|
|
17
|
+
Box
|
|
18
|
+
} from "./chunk-4Y5BEXVN.js";
|
|
19
|
+
import {
|
|
20
|
+
Typo
|
|
21
|
+
} from "./chunk-PARGQUJB.js";
|
|
22
|
+
import {
|
|
23
|
+
BellIcon
|
|
24
|
+
} from "./chunk-V5XKNSCK.js";
|
|
25
|
+
|
|
26
|
+
// src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-text.tsx
|
|
27
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
28
|
+
function ReviewQuestionText(props) {
|
|
29
|
+
const { question, answer, onChange } = props;
|
|
30
|
+
const minLengthNotMet = question.minLength && answer.length < question.minLength;
|
|
31
|
+
const remainingLength = question.minLength && answer.length < question.minLength ? question.minLength - answer.length : 0;
|
|
32
|
+
return /* @__PURE__ */ jsx(
|
|
33
|
+
Card,
|
|
34
|
+
{
|
|
35
|
+
size: "2",
|
|
36
|
+
style: {
|
|
37
|
+
width: "100%",
|
|
38
|
+
height: "100%"
|
|
39
|
+
},
|
|
40
|
+
children: /* @__PURE__ */ jsxs(Grid, { height: "100%", rows: "1fr auto", children: [
|
|
41
|
+
/* @__PURE__ */ jsxs(Grid, { height: "100%", rows: "auto 1fr", width: "100%", children: [
|
|
42
|
+
/* @__PURE__ */ jsx(
|
|
43
|
+
ReviewQuestionContentHeader,
|
|
44
|
+
{
|
|
45
|
+
icon: question.icon,
|
|
46
|
+
question: question.question,
|
|
47
|
+
title: question.title,
|
|
48
|
+
type: question.type
|
|
49
|
+
}
|
|
50
|
+
),
|
|
51
|
+
/* @__PURE__ */ jsx(
|
|
52
|
+
TextArea,
|
|
53
|
+
{
|
|
54
|
+
mt: "2",
|
|
55
|
+
onChange: (e) => {
|
|
56
|
+
onChange(e.target.value);
|
|
57
|
+
},
|
|
58
|
+
placeholder: question.placeholder,
|
|
59
|
+
value: answer
|
|
60
|
+
}
|
|
61
|
+
)
|
|
62
|
+
] }),
|
|
63
|
+
minLengthNotMet ? /* @__PURE__ */ jsxs(Box, { mt: "2", children: [
|
|
64
|
+
/* @__PURE__ */ jsx(Typo, { align: "right", as: "p", color: "red", variant: "caption", children: `${remainingLength}\uC790 \uB354 \uC791\uC131\uD574\uC8FC\uC138\uC694.` }),
|
|
65
|
+
question.minLengthInfoMessage ? /* @__PURE__ */ jsxs(
|
|
66
|
+
Callout.Root,
|
|
67
|
+
{
|
|
68
|
+
color: "iris",
|
|
69
|
+
mt: "2",
|
|
70
|
+
style: { alignItems: "center" },
|
|
71
|
+
children: [
|
|
72
|
+
/* @__PURE__ */ jsx(Callout.Icon, { children: /* @__PURE__ */ jsx(BellIcon, {}) }),
|
|
73
|
+
/* @__PURE__ */ jsx(Callout.Text, { children: /* @__PURE__ */ jsx(Typo, { as: "p", variant: "caption", children: question.minLengthInfoMessage }) })
|
|
74
|
+
]
|
|
75
|
+
}
|
|
76
|
+
) : null
|
|
77
|
+
] }) : null
|
|
78
|
+
] })
|
|
79
|
+
}
|
|
80
|
+
);
|
|
81
|
+
}
|
|
82
|
+
var review_question_text_default = ReviewQuestionText;
|
|
83
|
+
|
|
84
|
+
export {
|
|
85
|
+
review_question_text_default
|
|
86
|
+
};
|
|
87
|
+
//# sourceMappingURL=chunk-WB2EZAD2.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/ReviewQuestion/review-question-text.tsx"],"sourcesContent":["import React from 'react';\nimport { Box, Card, Callout, Grid, TextArea, Typo } from '@/atoms';\nimport { BellIcon } from '@/icon';\nimport { type CurriculumReviewQuestionText } from '@/types/curriculumContents.type';\nimport { ReviewQuestionContentHeader } from './review-comp';\n\ninterface ReviewQuestionTextProps {\n question: CurriculumReviewQuestionText;\n answer: string;\n error?: string;\n onChange: (value: string) => void;\n}\n\nfunction ReviewQuestionText(props: ReviewQuestionTextProps): React.ReactNode {\n const { question, answer, onChange } = props;\n\n const minLengthNotMet =\n question.minLength && answer.length < question.minLength;\n\n const remainingLength =\n question.minLength && answer.length < question.minLength\n ? question.minLength - answer.length\n : 0;\n\n return (\n <Card\n size=\"2\"\n style={{\n width: '100%',\n height: '100%',\n }}\n >\n <Grid height=\"100%\" rows=\"1fr auto\">\n <Grid height=\"100%\" rows=\"auto 1fr\" width=\"100%\">\n <ReviewQuestionContentHeader\n icon={question.icon}\n question={question.question}\n title={question.title}\n type={question.type}\n />\n\n <TextArea\n mt=\"2\"\n onChange={(e) => {\n onChange(e.target.value);\n }}\n placeholder={question.placeholder}\n value={answer}\n />\n </Grid>\n {minLengthNotMet ? (\n <Box mt=\"2\">\n <Typo align=\"right\" as=\"p\" color=\"red\" variant=\"caption\">\n {`${remainingLength}자 더 작성해주세요.`}\n </Typo>\n {question.minLengthInfoMessage ? (\n <Callout.Root\n color=\"iris\"\n mt=\"2\"\n style={{ alignItems: 'center' }}\n >\n <Callout.Icon>\n <BellIcon />\n </Callout.Icon>\n <Callout.Text>\n <Typo as=\"p\" variant=\"caption\">\n {question.minLengthInfoMessage}\n </Typo>\n </Callout.Text>\n </Callout.Root>\n ) : null}\n </Box>\n ) : null}\n </Grid>\n </Card>\n );\n}\n\nexport default ReviewQuestionText;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAiCQ,SACE,KADF;AApBR,SAAS,mBAAmB,OAAiD;AAC3E,QAAM,EAAE,UAAU,QAAQ,SAAS,IAAI;AAEvC,QAAM,kBACJ,SAAS,aAAa,OAAO,SAAS,SAAS;AAEjD,QAAM,kBACJ,SAAS,aAAa,OAAO,SAAS,SAAS,YAC3C,SAAS,YAAY,OAAO,SAC5B;AAEN,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,OAAO;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,MACV;AAAA,MAEA,+BAAC,QAAK,QAAO,QAAO,MAAK,YACvB;AAAA,6BAAC,QAAK,QAAO,QAAO,MAAK,YAAW,OAAM,QACxC;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,MAAM,SAAS;AAAA,cACf,UAAU,SAAS;AAAA,cACnB,OAAO,SAAS;AAAA,cAChB,MAAM,SAAS;AAAA;AAAA,UACjB;AAAA,UAEA;AAAA,YAAC;AAAA;AAAA,cACC,IAAG;AAAA,cACH,UAAU,CAAC,MAAM;AACf,yBAAS,EAAE,OAAO,KAAK;AAAA,cACzB;AAAA,cACA,aAAa,SAAS;AAAA,cACtB,OAAO;AAAA;AAAA,UACT;AAAA,WACF;AAAA,QACC,kBACC,qBAAC,OAAI,IAAG,KACN;AAAA,8BAAC,QAAK,OAAM,SAAQ,IAAG,KAAI,OAAM,OAAM,SAAQ,WAC5C,aAAG,eAAe,uDACrB;AAAA,UACC,SAAS,uBACR;AAAA,YAAC,QAAQ;AAAA,YAAR;AAAA,cACC,OAAM;AAAA,cACN,IAAG;AAAA,cACH,OAAO,EAAE,YAAY,SAAS;AAAA,cAE9B;AAAA,oCAAC,QAAQ,MAAR,EACC,8BAAC,YAAS,GACZ;AAAA,gBACA,oBAAC,QAAQ,MAAR,EACC,8BAAC,QAAK,IAAG,KAAI,SAAQ,WAClB,mBAAS,sBACZ,GACF;AAAA;AAAA;AAAA,UACF,IACE;AAAA,WACN,IACE;AAAA,SACN;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,+BAAQ;","names":[]}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import {
|
|
2
|
+
CoachingCustomerInfoLarge
|
|
3
|
+
} from "./chunk-OIX2XFJV.js";
|
|
4
|
+
import {
|
|
5
|
+
CoachingCustomerInfoMedium
|
|
6
|
+
} from "./chunk-6Q6OHG2C.js";
|
|
7
|
+
import {
|
|
8
|
+
CoachingCustomerInfoSmall
|
|
9
|
+
} from "./chunk-A75LCRKO.js";
|
|
10
|
+
import {
|
|
11
|
+
Box
|
|
12
|
+
} from "./chunk-4Y5BEXVN.js";
|
|
13
|
+
import {
|
|
14
|
+
__spreadValues
|
|
15
|
+
} from "./chunk-2NMEKWO5.js";
|
|
16
|
+
|
|
17
|
+
// src/app/platform/userInfos/coaching-customer-info/index.tsx
|
|
18
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
19
|
+
function CoachingCustomerInfo(props) {
|
|
20
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
21
|
+
/* @__PURE__ */ jsx(Box, { display: { initial: "block", sm: "none", md: "none" }, children: /* @__PURE__ */ jsx(CoachingCustomerInfoSmall, __spreadValues({}, props)) }),
|
|
22
|
+
/* @__PURE__ */ jsx(Box, { display: { initial: "none", sm: "block", md: "none" }, children: /* @__PURE__ */ jsx(CoachingCustomerInfoMedium, __spreadValues({}, props)) }),
|
|
23
|
+
/* @__PURE__ */ jsx(Box, { display: { initial: "none", sm: "none", md: "block" }, children: /* @__PURE__ */ jsx(CoachingCustomerInfoLarge, __spreadValues({}, props)) })
|
|
24
|
+
] });
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
export {
|
|
28
|
+
CoachingCustomerInfo
|
|
29
|
+
};
|
|
30
|
+
//# sourceMappingURL=chunk-WEBCXOO7.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/app/platform/userInfos/coaching-customer-info/index.tsx"],"sourcesContent":["import React from 'react';\nimport { Box } from '../../../../atoms';\nimport type { CoachingCustomerInfoProps } from '../utils';\nimport { CoachingCustomerInfoSmall } from './small';\nimport { CoachingCustomerInfoMedium } from './medium';\nimport { CoachingCustomerInfoLarge } from './large';\n\nexport {\n CoachingCustomerInfoLarge,\n CoachingCustomerInfoMedium,\n CoachingCustomerInfoSmall,\n};\n\nexport { type CoachingCustomerInfoProps };\n\nexport function CoachingCustomerInfo(\n props: CoachingCustomerInfoProps\n): React.ReactNode {\n return (\n <>\n <Box display={{ initial: 'block', sm: 'none', md: 'none' }}>\n <CoachingCustomerInfoSmall {...props} />\n </Box>\n <Box display={{ initial: 'none', sm: 'block', md: 'none' }}>\n <CoachingCustomerInfoMedium {...props} />\n </Box>\n <Box display={{ initial: 'none', sm: 'none', md: 'block' }}>\n <CoachingCustomerInfoLarge {...props} />\n </Box>\n </>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAmBI,mBAEI,KAFJ;AAJG,SAAS,qBACd,OACiB;AACjB,SACE,iCACE;AAAA,wBAAC,OAAI,SAAS,EAAE,SAAS,SAAS,IAAI,QAAQ,IAAI,OAAO,GACvD,8BAAC,8CAA8B,MAAO,GACxC;AAAA,IACA,oBAAC,OAAI,SAAS,EAAE,SAAS,QAAQ,IAAI,SAAS,IAAI,OAAO,GACvD,8BAAC,+CAA+B,MAAO,GACzC;AAAA,IACA,oBAAC,OAAI,SAAS,EAAE,SAAS,QAAQ,IAAI,QAAQ,IAAI,QAAQ,GACvD,8BAAC,8CAA8B,MAAO,GACxC;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -0,0 +1,174 @@
|
|
|
1
|
+
import {
|
|
2
|
+
DatePickerButton
|
|
3
|
+
} from "./chunk-VBLQSRLF.js";
|
|
4
|
+
import {
|
|
5
|
+
TimeSelect
|
|
6
|
+
} from "./chunk-5VWEW4M2.js";
|
|
7
|
+
import {
|
|
8
|
+
getTimeOption,
|
|
9
|
+
parseTimeOption
|
|
10
|
+
} from "./chunk-NWJSLIQ3.js";
|
|
11
|
+
import {
|
|
12
|
+
Form
|
|
13
|
+
} from "./chunk-A5S42XBJ.js";
|
|
14
|
+
import {
|
|
15
|
+
toast
|
|
16
|
+
} from "./chunk-26ZU5KUR.js";
|
|
17
|
+
import {
|
|
18
|
+
Grid
|
|
19
|
+
} from "./chunk-EGEQY3KT.js";
|
|
20
|
+
import {
|
|
21
|
+
Dialog
|
|
22
|
+
} from "./chunk-2ADFW76N.js";
|
|
23
|
+
import {
|
|
24
|
+
Separator
|
|
25
|
+
} from "./chunk-HYITAA4J.js";
|
|
26
|
+
import {
|
|
27
|
+
Box
|
|
28
|
+
} from "./chunk-4Y5BEXVN.js";
|
|
29
|
+
import {
|
|
30
|
+
Flex
|
|
31
|
+
} from "./chunk-25HMMI7R.js";
|
|
32
|
+
import {
|
|
33
|
+
Button
|
|
34
|
+
} from "./chunk-AFPH32MF.js";
|
|
35
|
+
import {
|
|
36
|
+
__spreadProps,
|
|
37
|
+
__spreadValues
|
|
38
|
+
} from "./chunk-2NMEKWO5.js";
|
|
39
|
+
|
|
40
|
+
// src/app/platform/edit-coaching-time.tsx
|
|
41
|
+
import { useCallback, useState } from "react";
|
|
42
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
43
|
+
var getValueFromDefaultValue = (args) => {
|
|
44
|
+
return {
|
|
45
|
+
startTime: args.startAt ? getTimeOption(args.startAt) : "00:00",
|
|
46
|
+
endTime: args.endAt ? getTimeOption(args.endAt) : "00:00",
|
|
47
|
+
date: args.startAt || /* @__PURE__ */ new Date()
|
|
48
|
+
};
|
|
49
|
+
};
|
|
50
|
+
var getDateFromValue = (date, time) => {
|
|
51
|
+
const { hour, minute } = parseTimeOption(time);
|
|
52
|
+
return new Date(
|
|
53
|
+
date.getFullYear(),
|
|
54
|
+
date.getMonth(),
|
|
55
|
+
date.getDate(),
|
|
56
|
+
hour,
|
|
57
|
+
minute
|
|
58
|
+
);
|
|
59
|
+
};
|
|
60
|
+
function EditCoachingTime(props) {
|
|
61
|
+
const { defaultEndAt, defaultStartAt, onClickCancel } = props;
|
|
62
|
+
const [values, setValues] = useState(() => {
|
|
63
|
+
return getValueFromDefaultValue({
|
|
64
|
+
startAt: defaultStartAt,
|
|
65
|
+
endAt: defaultEndAt
|
|
66
|
+
});
|
|
67
|
+
});
|
|
68
|
+
const [timeError, setTimeError] = useState("");
|
|
69
|
+
const checkTimeError = useCallback(
|
|
70
|
+
(startTime, endTime) => {
|
|
71
|
+
const error = startTime >= endTime ? "\uC2DC\uC791\uC2DC\uAC04\uC744 \uC885\uB8CC\uC2DC\uAC04\uBCF4\uB2E4 \uBE60\uB974\uAC8C \uC120\uD0DD\uD574\uC8FC\uC138\uC694." : "";
|
|
72
|
+
if (error) {
|
|
73
|
+
setTimeError(error);
|
|
74
|
+
return false;
|
|
75
|
+
}
|
|
76
|
+
return true;
|
|
77
|
+
},
|
|
78
|
+
[]
|
|
79
|
+
);
|
|
80
|
+
const onChangeStartTime = useCallback(
|
|
81
|
+
(v) => {
|
|
82
|
+
checkTimeError(v, values.endTime);
|
|
83
|
+
setValues((prev) => __spreadProps(__spreadValues({}, prev), {
|
|
84
|
+
startTime: v
|
|
85
|
+
}));
|
|
86
|
+
},
|
|
87
|
+
[checkTimeError, values.endTime]
|
|
88
|
+
);
|
|
89
|
+
const onChangeEndTime = useCallback(
|
|
90
|
+
(v) => {
|
|
91
|
+
checkTimeError(values.startTime, v);
|
|
92
|
+
setValues((prev) => __spreadProps(__spreadValues({}, prev), {
|
|
93
|
+
endTime: v
|
|
94
|
+
}));
|
|
95
|
+
},
|
|
96
|
+
[checkTimeError, values.startTime]
|
|
97
|
+
);
|
|
98
|
+
const onChangeDate = useCallback((date) => {
|
|
99
|
+
date && setValues((prev) => __spreadProps(__spreadValues({}, prev), {
|
|
100
|
+
date
|
|
101
|
+
}));
|
|
102
|
+
}, []);
|
|
103
|
+
const onClickSave = useCallback(() => {
|
|
104
|
+
if (checkTimeError(values.startTime, values.endTime)) {
|
|
105
|
+
const startAt = getDateFromValue(values.date, values.startTime);
|
|
106
|
+
const endAt = getDateFromValue(values.date, values.endTime);
|
|
107
|
+
props.onClickSave && props.onClickSave(startAt, endAt);
|
|
108
|
+
} else {
|
|
109
|
+
toast.error("\uC785\uB825 \uAC12\uC774 \uC720\uD6A8\uD558\uC9C0 \uC54A\uC2B5\uB2C8\uB2E4.");
|
|
110
|
+
}
|
|
111
|
+
}, [checkTimeError, props, values.date, values.endTime, values.startTime]);
|
|
112
|
+
return /* @__PURE__ */ jsx(Box, { width: { initial: "100%" }, children: /* @__PURE__ */ jsxs(Form.Root, { children: [
|
|
113
|
+
/* @__PURE__ */ jsxs(Form.Field, { name: "date", children: [
|
|
114
|
+
/* @__PURE__ */ jsx(Form.Label, { variant: "caption", children: "\uB0A0\uC9DC" }),
|
|
115
|
+
/* @__PURE__ */ jsx(
|
|
116
|
+
DatePickerButton,
|
|
117
|
+
{
|
|
118
|
+
maxDate: /* @__PURE__ */ new Date(),
|
|
119
|
+
onChange: onChangeDate,
|
|
120
|
+
selected: values.date,
|
|
121
|
+
size: { initial: "large", xs: "medium" }
|
|
122
|
+
}
|
|
123
|
+
)
|
|
124
|
+
] }),
|
|
125
|
+
/* @__PURE__ */ jsxs(
|
|
126
|
+
Grid,
|
|
127
|
+
{
|
|
128
|
+
align: "center",
|
|
129
|
+
columns: {
|
|
130
|
+
initial: "1fr 0 1fr",
|
|
131
|
+
xs: "1fr auto 1fr"
|
|
132
|
+
},
|
|
133
|
+
gapX: "3",
|
|
134
|
+
gapY: "2",
|
|
135
|
+
justify: "center",
|
|
136
|
+
mb: { initial: "5", xs: "4" },
|
|
137
|
+
mt: "5",
|
|
138
|
+
width: "100%",
|
|
139
|
+
children: [
|
|
140
|
+
/* @__PURE__ */ jsx(Form.Field, { name: "startTime", children: /* @__PURE__ */ jsx(Form.Label, { variant: "caption", children: "\uC2DC\uC791 \uC2DC\uAC04" }) }),
|
|
141
|
+
/* @__PURE__ */ jsx("div", {}),
|
|
142
|
+
/* @__PURE__ */ jsx(Form.Field, { name: "endTime", children: /* @__PURE__ */ jsx(Form.Label, { variant: "caption", children: "\uC885\uB8CC \uC2DC\uAC04" }) }),
|
|
143
|
+
/* @__PURE__ */ jsx(
|
|
144
|
+
TimeSelect,
|
|
145
|
+
{
|
|
146
|
+
onValueChange: onChangeStartTime,
|
|
147
|
+
size: { initial: "3", xs: "2" },
|
|
148
|
+
value: values.startTime
|
|
149
|
+
}
|
|
150
|
+
),
|
|
151
|
+
/* @__PURE__ */ jsx(Box, { overflow: "hidden", children: /* @__PURE__ */ jsx(Separator, {}) }),
|
|
152
|
+
/* @__PURE__ */ jsx(
|
|
153
|
+
TimeSelect,
|
|
154
|
+
{
|
|
155
|
+
onValueChange: onChangeEndTime,
|
|
156
|
+
size: { initial: "3", xs: "2" },
|
|
157
|
+
value: values.endTime
|
|
158
|
+
}
|
|
159
|
+
),
|
|
160
|
+
/* @__PURE__ */ jsx(Form.Field, { name: "startEndTime", style: { gridColumn: "1/span 3" }, children: /* @__PURE__ */ jsx(Form.Message, { forceMatch: Boolean(timeError), children: timeError }) })
|
|
161
|
+
]
|
|
162
|
+
}
|
|
163
|
+
),
|
|
164
|
+
/* @__PURE__ */ jsxs(Flex, { gap: "3", justify: "end", children: [
|
|
165
|
+
/* @__PURE__ */ jsx(Dialog.Close, { children: /* @__PURE__ */ jsx(Button, { onClick: onClickCancel, type: "button", variant: "outline", children: "\uCDE8\uC18C\uD558\uAE30" }) }),
|
|
166
|
+
/* @__PURE__ */ jsx(Dialog.Close, { children: /* @__PURE__ */ jsx(Button, { onClick: onClickSave, type: "button", children: "\uC800\uC7A5\uD558\uAE30" }) })
|
|
167
|
+
] })
|
|
168
|
+
] }) });
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
export {
|
|
172
|
+
EditCoachingTime
|
|
173
|
+
};
|
|
174
|
+
//# sourceMappingURL=chunk-WZM6EE5T.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/app/platform/edit-coaching-time.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\nimport {\n Button,\n Flex,\n Form,\n Grid,\n Separator,\n Box,\n toast,\n Dialog,\n} from '../../atoms';\nimport { DatePickerButton, TimeSelect } from '../../molecules';\nimport { getTimeOption, parseTimeOption } from '../../utils';\n\nexport interface EditCoachingTimeProps {\n defaultStartAt?: Date;\n defaultEndAt?: Date;\n onClickSave?: (startAt: Date, endAt: Date) => void;\n onClickCancel?: () => void;\n sessionNumber?: number;\n}\n\ninterface Values {\n startTime: string;\n endTime: string;\n date: Date;\n}\n\nconst getValueFromDefaultValue = (args: {\n startAt?: Date;\n endAt?: Date;\n}): Values => {\n return {\n startTime: args.startAt ? getTimeOption(args.startAt) : '00:00',\n endTime: args.endAt ? getTimeOption(args.endAt) : '00:00',\n date: args.startAt || new Date(),\n };\n};\n\nconst getDateFromValue = (date: Date, time: string): Date => {\n const { hour, minute } = parseTimeOption(time);\n return new Date(\n date.getFullYear(),\n date.getMonth(),\n date.getDate(),\n hour,\n minute\n );\n};\n\nexport function EditCoachingTime(\n props: EditCoachingTimeProps\n): React.ReactNode {\n const { defaultEndAt, defaultStartAt, onClickCancel } = props;\n\n const [values, setValues] = useState<Values>(() => {\n return getValueFromDefaultValue({\n startAt: defaultStartAt,\n endAt: defaultEndAt,\n });\n });\n\n const [timeError, setTimeError] = useState('');\n\n const checkTimeError = useCallback(\n (startTime: string, endTime: string): boolean => {\n const error =\n startTime >= endTime\n ? '시작시간을 종료시간보다 빠르게 선택해주세요.'\n : '';\n if (error) {\n setTimeError(error);\n return false;\n }\n return true;\n },\n []\n );\n\n const onChangeStartTime = useCallback(\n (v: string) => {\n checkTimeError(v, values.endTime);\n setValues((prev) => ({\n ...prev,\n startTime: v,\n }));\n },\n [checkTimeError, values.endTime]\n );\n\n const onChangeEndTime = useCallback(\n (v: string) => {\n checkTimeError(values.startTime, v);\n setValues((prev) => ({\n ...prev,\n endTime: v,\n }));\n },\n [checkTimeError, values.startTime]\n );\n\n const onChangeDate = useCallback((date: Date | null) => {\n date &&\n setValues((prev) => ({\n ...prev,\n date,\n }));\n }, []);\n\n const onClickSave = useCallback(() => {\n if (checkTimeError(values.startTime, values.endTime)) {\n const startAt = getDateFromValue(values.date, values.startTime);\n const endAt = getDateFromValue(values.date, values.endTime);\n props.onClickSave && props.onClickSave(startAt, endAt);\n } else {\n toast.error('입력 값이 유효하지 않습니다.');\n }\n }, [checkTimeError, props, values.date, values.endTime, values.startTime]);\n\n return (\n <Box width={{ initial: '100%' }}>\n <Form.Root>\n <Form.Field name=\"date\">\n <Form.Label variant=\"caption\">날짜</Form.Label>\n <DatePickerButton\n maxDate={new Date()}\n onChange={onChangeDate}\n selected={values.date}\n size={{ initial: 'large', xs: 'medium' }}\n />\n </Form.Field>\n <Grid\n align=\"center\"\n columns={{\n initial: '1fr 0 1fr',\n xs: '1fr auto 1fr',\n }}\n gapX=\"3\"\n gapY=\"2\"\n justify=\"center\"\n mb={{ initial: '5', xs: '4' }}\n mt=\"5\"\n width=\"100%\"\n >\n <Form.Field name=\"startTime\">\n <Form.Label variant=\"caption\">시작 시간</Form.Label>\n </Form.Field>\n <div />\n <Form.Field name=\"endTime\">\n <Form.Label variant=\"caption\">종료 시간</Form.Label>\n </Form.Field>\n <TimeSelect\n onValueChange={onChangeStartTime}\n size={{ initial: '3', xs: '2' }}\n value={values.startTime}\n />\n <Box overflow=\"hidden\">\n <Separator />\n </Box>\n\n <TimeSelect\n onValueChange={onChangeEndTime}\n size={{ initial: '3', xs: '2' }}\n value={values.endTime}\n />\n <Form.Field name=\"startEndTime\" style={{ gridColumn: '1/span 3' }}>\n <Form.Message forceMatch={Boolean(timeError)}>\n {timeError}\n </Form.Message>\n </Form.Field>\n </Grid>\n <Flex gap=\"3\" justify=\"end\">\n <Dialog.Close>\n <Button onClick={onClickCancel} type=\"button\" variant=\"outline\">\n 취소하기\n </Button>\n </Dialog.Close>\n <Dialog.Close>\n <Button onClick={onClickSave} type=\"button\">\n 저장하기\n </Button>\n </Dialog.Close>\n </Flex>\n </Form.Root>\n </Box>\n );\n}\n"],"mappings":"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","names":[]}
|
|
@@ -0,0 +1,174 @@
|
|
|
1
|
+
import {
|
|
2
|
+
DatePickerButton
|
|
3
|
+
} from "./chunk-UXOYDVHH.js";
|
|
4
|
+
import {
|
|
5
|
+
TimeSelect
|
|
6
|
+
} from "./chunk-5VWEW4M2.js";
|
|
7
|
+
import {
|
|
8
|
+
getTimeOption,
|
|
9
|
+
parseTimeOption
|
|
10
|
+
} from "./chunk-NWJSLIQ3.js";
|
|
11
|
+
import {
|
|
12
|
+
Form
|
|
13
|
+
} from "./chunk-A5S42XBJ.js";
|
|
14
|
+
import {
|
|
15
|
+
toast
|
|
16
|
+
} from "./chunk-26ZU5KUR.js";
|
|
17
|
+
import {
|
|
18
|
+
Grid
|
|
19
|
+
} from "./chunk-EGEQY3KT.js";
|
|
20
|
+
import {
|
|
21
|
+
Dialog
|
|
22
|
+
} from "./chunk-2ADFW76N.js";
|
|
23
|
+
import {
|
|
24
|
+
Separator
|
|
25
|
+
} from "./chunk-HYITAA4J.js";
|
|
26
|
+
import {
|
|
27
|
+
Box
|
|
28
|
+
} from "./chunk-4Y5BEXVN.js";
|
|
29
|
+
import {
|
|
30
|
+
Flex
|
|
31
|
+
} from "./chunk-25HMMI7R.js";
|
|
32
|
+
import {
|
|
33
|
+
Button
|
|
34
|
+
} from "./chunk-AFPH32MF.js";
|
|
35
|
+
import {
|
|
36
|
+
__spreadProps,
|
|
37
|
+
__spreadValues
|
|
38
|
+
} from "./chunk-2NMEKWO5.js";
|
|
39
|
+
|
|
40
|
+
// src/app/platform/edit-coaching-time.tsx
|
|
41
|
+
import { useCallback, useState } from "react";
|
|
42
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
43
|
+
var getValueFromDefaultValue = (args) => {
|
|
44
|
+
return {
|
|
45
|
+
startTime: args.startAt ? getTimeOption(args.startAt) : "00:00",
|
|
46
|
+
endTime: args.endAt ? getTimeOption(args.endAt) : "00:00",
|
|
47
|
+
date: args.startAt || /* @__PURE__ */ new Date()
|
|
48
|
+
};
|
|
49
|
+
};
|
|
50
|
+
var getDateFromValue = (date, time) => {
|
|
51
|
+
const { hour, minute } = parseTimeOption(time);
|
|
52
|
+
return new Date(
|
|
53
|
+
date.getFullYear(),
|
|
54
|
+
date.getMonth(),
|
|
55
|
+
date.getDate(),
|
|
56
|
+
hour,
|
|
57
|
+
minute
|
|
58
|
+
);
|
|
59
|
+
};
|
|
60
|
+
function EditCoachingTime(props) {
|
|
61
|
+
const { defaultEndAt, defaultStartAt, onClickCancel } = props;
|
|
62
|
+
const [values, setValues] = useState(() => {
|
|
63
|
+
return getValueFromDefaultValue({
|
|
64
|
+
startAt: defaultStartAt,
|
|
65
|
+
endAt: defaultEndAt
|
|
66
|
+
});
|
|
67
|
+
});
|
|
68
|
+
const [timeError, setTimeError] = useState("");
|
|
69
|
+
const checkTimeError = useCallback(
|
|
70
|
+
(startTime, endTime) => {
|
|
71
|
+
const error = startTime >= endTime ? "\uC2DC\uC791\uC2DC\uAC04\uC744 \uC885\uB8CC\uC2DC\uAC04\uBCF4\uB2E4 \uBE60\uB974\uAC8C \uC120\uD0DD\uD574\uC8FC\uC138\uC694." : "";
|
|
72
|
+
if (error) {
|
|
73
|
+
setTimeError(error);
|
|
74
|
+
return false;
|
|
75
|
+
}
|
|
76
|
+
return true;
|
|
77
|
+
},
|
|
78
|
+
[]
|
|
79
|
+
);
|
|
80
|
+
const onChangeStartTime = useCallback(
|
|
81
|
+
(v) => {
|
|
82
|
+
checkTimeError(v, values.endTime);
|
|
83
|
+
setValues((prev) => __spreadProps(__spreadValues({}, prev), {
|
|
84
|
+
startTime: v
|
|
85
|
+
}));
|
|
86
|
+
},
|
|
87
|
+
[checkTimeError, values.endTime]
|
|
88
|
+
);
|
|
89
|
+
const onChangeEndTime = useCallback(
|
|
90
|
+
(v) => {
|
|
91
|
+
checkTimeError(values.startTime, v);
|
|
92
|
+
setValues((prev) => __spreadProps(__spreadValues({}, prev), {
|
|
93
|
+
endTime: v
|
|
94
|
+
}));
|
|
95
|
+
},
|
|
96
|
+
[checkTimeError, values.startTime]
|
|
97
|
+
);
|
|
98
|
+
const onChangeDate = useCallback((date) => {
|
|
99
|
+
date && setValues((prev) => __spreadProps(__spreadValues({}, prev), {
|
|
100
|
+
date
|
|
101
|
+
}));
|
|
102
|
+
}, []);
|
|
103
|
+
const onClickSave = useCallback(() => {
|
|
104
|
+
if (checkTimeError(values.startTime, values.endTime)) {
|
|
105
|
+
const startAt = getDateFromValue(values.date, values.startTime);
|
|
106
|
+
const endAt = getDateFromValue(values.date, values.endTime);
|
|
107
|
+
props.onClickSave && props.onClickSave(startAt, endAt);
|
|
108
|
+
} else {
|
|
109
|
+
toast.error("\uC785\uB825 \uAC12\uC774 \uC720\uD6A8\uD558\uC9C0 \uC54A\uC2B5\uB2C8\uB2E4.");
|
|
110
|
+
}
|
|
111
|
+
}, [checkTimeError, props, values.date, values.endTime, values.startTime]);
|
|
112
|
+
return /* @__PURE__ */ jsx(Box, { width: { initial: "100%" }, children: /* @__PURE__ */ jsxs(Form.Root, { children: [
|
|
113
|
+
/* @__PURE__ */ jsxs(Form.Field, { name: "date", children: [
|
|
114
|
+
/* @__PURE__ */ jsx(Form.Label, { variant: "caption", children: "\uB0A0\uC9DC" }),
|
|
115
|
+
/* @__PURE__ */ jsx(
|
|
116
|
+
DatePickerButton,
|
|
117
|
+
{
|
|
118
|
+
maxDate: /* @__PURE__ */ new Date(),
|
|
119
|
+
onChange: onChangeDate,
|
|
120
|
+
selected: values.date,
|
|
121
|
+
size: { initial: "large", xs: "medium" }
|
|
122
|
+
}
|
|
123
|
+
)
|
|
124
|
+
] }),
|
|
125
|
+
/* @__PURE__ */ jsxs(
|
|
126
|
+
Grid,
|
|
127
|
+
{
|
|
128
|
+
align: "center",
|
|
129
|
+
columns: {
|
|
130
|
+
initial: "1fr 0 1fr",
|
|
131
|
+
xs: "1fr auto 1fr"
|
|
132
|
+
},
|
|
133
|
+
gapX: "3",
|
|
134
|
+
gapY: "2",
|
|
135
|
+
justify: "center",
|
|
136
|
+
mb: { initial: "5", xs: "4" },
|
|
137
|
+
mt: "5",
|
|
138
|
+
width: "100%",
|
|
139
|
+
children: [
|
|
140
|
+
/* @__PURE__ */ jsx(Form.Field, { name: "startTime", children: /* @__PURE__ */ jsx(Form.Label, { variant: "caption", children: "\uC2DC\uC791 \uC2DC\uAC04" }) }),
|
|
141
|
+
/* @__PURE__ */ jsx("div", {}),
|
|
142
|
+
/* @__PURE__ */ jsx(Form.Field, { name: "endTime", children: /* @__PURE__ */ jsx(Form.Label, { variant: "caption", children: "\uC885\uB8CC \uC2DC\uAC04" }) }),
|
|
143
|
+
/* @__PURE__ */ jsx(
|
|
144
|
+
TimeSelect,
|
|
145
|
+
{
|
|
146
|
+
onValueChange: onChangeStartTime,
|
|
147
|
+
size: { initial: "3", xs: "2" },
|
|
148
|
+
value: values.startTime
|
|
149
|
+
}
|
|
150
|
+
),
|
|
151
|
+
/* @__PURE__ */ jsx(Box, { overflow: "hidden", children: /* @__PURE__ */ jsx(Separator, {}) }),
|
|
152
|
+
/* @__PURE__ */ jsx(
|
|
153
|
+
TimeSelect,
|
|
154
|
+
{
|
|
155
|
+
onValueChange: onChangeEndTime,
|
|
156
|
+
size: { initial: "3", xs: "2" },
|
|
157
|
+
value: values.endTime
|
|
158
|
+
}
|
|
159
|
+
),
|
|
160
|
+
/* @__PURE__ */ jsx(Form.Field, { name: "startEndTime", style: { gridColumn: "1/span 3" }, children: /* @__PURE__ */ jsx(Form.Message, { forceMatch: Boolean(timeError), children: timeError }) })
|
|
161
|
+
]
|
|
162
|
+
}
|
|
163
|
+
),
|
|
164
|
+
/* @__PURE__ */ jsxs(Flex, { gap: "3", justify: "end", children: [
|
|
165
|
+
/* @__PURE__ */ jsx(Dialog.Close, { children: /* @__PURE__ */ jsx(Button, { onClick: onClickCancel, type: "button", variant: "outline", children: "\uCDE8\uC18C\uD558\uAE30" }) }),
|
|
166
|
+
/* @__PURE__ */ jsx(Dialog.Close, { children: /* @__PURE__ */ jsx(Button, { onClick: onClickSave, type: "button", children: "\uC800\uC7A5\uD558\uAE30" }) })
|
|
167
|
+
] })
|
|
168
|
+
] }) });
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
export {
|
|
172
|
+
EditCoachingTime
|
|
173
|
+
};
|
|
174
|
+
//# sourceMappingURL=chunk-X2AK6LTW.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/app/platform/edit-coaching-time.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\nimport {\n Button,\n Flex,\n Form,\n Grid,\n Separator,\n Box,\n toast,\n Dialog,\n} from '../../atoms';\nimport { DatePickerButton, TimeSelect } from '../../molecules';\nimport { getTimeOption, parseTimeOption } from '../../utils';\n\nexport interface EditCoachingTimeProps {\n defaultStartAt?: Date;\n defaultEndAt?: Date;\n onClickSave?: (startAt: Date, endAt: Date) => void;\n onClickCancel?: () => void;\n sessionNumber?: number;\n}\n\ninterface Values {\n startTime: string;\n endTime: string;\n date: Date;\n}\n\nconst getValueFromDefaultValue = (args: {\n startAt?: Date;\n endAt?: Date;\n}): Values => {\n return {\n startTime: args.startAt ? getTimeOption(args.startAt) : '00:00',\n endTime: args.endAt ? getTimeOption(args.endAt) : '00:00',\n date: args.startAt || new Date(),\n };\n};\n\nconst getDateFromValue = (date: Date, time: string): Date => {\n const { hour, minute } = parseTimeOption(time);\n return new Date(\n date.getFullYear(),\n date.getMonth(),\n date.getDate(),\n hour,\n minute\n );\n};\n\nexport function EditCoachingTime(\n props: EditCoachingTimeProps\n): React.ReactNode {\n const { defaultEndAt, defaultStartAt, onClickCancel } = props;\n\n const [values, setValues] = useState<Values>(() => {\n return getValueFromDefaultValue({\n startAt: defaultStartAt,\n endAt: defaultEndAt,\n });\n });\n\n const [timeError, setTimeError] = useState('');\n\n const checkTimeError = useCallback(\n (startTime: string, endTime: string): boolean => {\n const error =\n startTime >= endTime\n ? '시작시간을 종료시간보다 빠르게 선택해주세요.'\n : '';\n if (error) {\n setTimeError(error);\n return false;\n }\n return true;\n },\n []\n );\n\n const onChangeStartTime = useCallback(\n (v: string) => {\n checkTimeError(v, values.endTime);\n setValues((prev) => ({\n ...prev,\n startTime: v,\n }));\n },\n [checkTimeError, values.endTime]\n );\n\n const onChangeEndTime = useCallback(\n (v: string) => {\n checkTimeError(values.startTime, v);\n setValues((prev) => ({\n ...prev,\n endTime: v,\n }));\n },\n [checkTimeError, values.startTime]\n );\n\n const onChangeDate = useCallback((date: Date | null) => {\n date &&\n setValues((prev) => ({\n ...prev,\n date,\n }));\n }, []);\n\n const onClickSave = useCallback(() => {\n if (checkTimeError(values.startTime, values.endTime)) {\n const startAt = getDateFromValue(values.date, values.startTime);\n const endAt = getDateFromValue(values.date, values.endTime);\n props.onClickSave && props.onClickSave(startAt, endAt);\n } else {\n toast.error('입력 값이 유효하지 않습니다.');\n }\n }, [checkTimeError, props, values.date, values.endTime, values.startTime]);\n\n return (\n <Box width={{ initial: '100%' }}>\n <Form.Root>\n <Form.Field name=\"date\">\n <Form.Label variant=\"caption\">날짜</Form.Label>\n <DatePickerButton\n maxDate={new Date()}\n onChange={onChangeDate}\n selected={values.date}\n size={{ initial: 'large', xs: 'medium' }}\n />\n </Form.Field>\n <Grid\n align=\"center\"\n columns={{\n initial: '1fr 0 1fr',\n xs: '1fr auto 1fr',\n }}\n gapX=\"3\"\n gapY=\"2\"\n justify=\"center\"\n mb={{ initial: '5', xs: '4' }}\n mt=\"5\"\n width=\"100%\"\n >\n <Form.Field name=\"startTime\">\n <Form.Label variant=\"caption\">시작 시간</Form.Label>\n </Form.Field>\n <div />\n <Form.Field name=\"endTime\">\n <Form.Label variant=\"caption\">종료 시간</Form.Label>\n </Form.Field>\n <TimeSelect\n onValueChange={onChangeStartTime}\n size={{ initial: '3', xs: '2' }}\n value={values.startTime}\n />\n <Box overflow=\"hidden\">\n <Separator />\n </Box>\n\n <TimeSelect\n onValueChange={onChangeEndTime}\n size={{ initial: '3', xs: '2' }}\n value={values.endTime}\n />\n <Form.Field name=\"startEndTime\" style={{ gridColumn: '1/span 3' }}>\n <Form.Message forceMatch={Boolean(timeError)}>\n {timeError}\n </Form.Message>\n </Form.Field>\n </Grid>\n <Flex gap=\"3\" justify=\"end\">\n <Dialog.Close>\n <Button onClick={onClickCancel} type=\"button\" variant=\"outline\">\n 취소하기\n </Button>\n </Dialog.Close>\n <Dialog.Close>\n <Button onClick={onClickSave} type=\"button\">\n 저장하기\n </Button>\n </Dialog.Close>\n </Flex>\n </Form.Root>\n </Box>\n );\n}\n"],"mappings":"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","names":[]}
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
import {
|
|
2
|
+
IconButton
|
|
3
|
+
} from "./chunk-O3DNDMV3.js";
|
|
4
|
+
import {
|
|
5
|
+
Flex
|
|
6
|
+
} from "./chunk-25HMMI7R.js";
|
|
7
|
+
import {
|
|
8
|
+
Typo
|
|
9
|
+
} from "./chunk-PARGQUJB.js";
|
|
10
|
+
import {
|
|
11
|
+
ChevronLeftIcon,
|
|
12
|
+
ChevronRightIcon,
|
|
13
|
+
DoubleArrowLeftIcon,
|
|
14
|
+
DoubleArrowRightIcon
|
|
15
|
+
} from "./chunk-V5XKNSCK.js";
|
|
16
|
+
import {
|
|
17
|
+
__spreadProps,
|
|
18
|
+
__spreadValues
|
|
19
|
+
} from "./chunk-2NMEKWO5.js";
|
|
20
|
+
|
|
21
|
+
// src/atoms/pagination.tsx
|
|
22
|
+
import { useCallback, useEffect, useMemo, useState } from "react";
|
|
23
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
24
|
+
function Pagination(props) {
|
|
25
|
+
const { onChange, count = 0, siblingCount = 2 } = props;
|
|
26
|
+
const [page, setPage] = useState(() => props.page || props.defaultPage || 1);
|
|
27
|
+
const visibleItems = useMemo(() => {
|
|
28
|
+
let start = Math.max(1, page - siblingCount);
|
|
29
|
+
let end = Math.min(count, page + siblingCount);
|
|
30
|
+
if (page - siblingCount <= 0 && end < count) {
|
|
31
|
+
end = Math.min(count, end + Math.abs(page - siblingCount) + 1);
|
|
32
|
+
} else if (page + siblingCount > count && start > 1) {
|
|
33
|
+
start = Math.max(1, start - (page + siblingCount - count));
|
|
34
|
+
}
|
|
35
|
+
return Array.from({ length: end - start + 1 }, (_, i) => i + start);
|
|
36
|
+
}, [count, page, siblingCount]);
|
|
37
|
+
useEffect(() => {
|
|
38
|
+
onChange == null ? void 0 : onChange(page);
|
|
39
|
+
}, [onChange, page]);
|
|
40
|
+
useEffect(() => {
|
|
41
|
+
if (props.page) {
|
|
42
|
+
setPage(props.page);
|
|
43
|
+
}
|
|
44
|
+
}, [props.page]);
|
|
45
|
+
const prev = useMemo(() => {
|
|
46
|
+
const p = page - 1;
|
|
47
|
+
return p < 1 ? void 0 : p;
|
|
48
|
+
}, [page]);
|
|
49
|
+
const next = useMemo(() => {
|
|
50
|
+
const n = page + 1;
|
|
51
|
+
return n > count ? void 0 : n;
|
|
52
|
+
}, [count, page]);
|
|
53
|
+
const onClickPrev = useCallback(() => {
|
|
54
|
+
prev && setPage(prev);
|
|
55
|
+
}, [prev]);
|
|
56
|
+
const onClickNext = useCallback(() => {
|
|
57
|
+
next && setPage(next);
|
|
58
|
+
}, [next]);
|
|
59
|
+
const doublePrev = useMemo(() => {
|
|
60
|
+
if (!visibleItems.length) return;
|
|
61
|
+
return Math.max(0, visibleItems[0] - 1);
|
|
62
|
+
}, [visibleItems]);
|
|
63
|
+
const onClickDoublePrev = useCallback(() => {
|
|
64
|
+
doublePrev && setPage(doublePrev);
|
|
65
|
+
}, [doublePrev]);
|
|
66
|
+
const doubleNext = useMemo(() => {
|
|
67
|
+
if (!visibleItems.length) return;
|
|
68
|
+
const n = visibleItems[visibleItems.length - 1] + 1;
|
|
69
|
+
if (n > count) return;
|
|
70
|
+
return Math.min(count, n);
|
|
71
|
+
}, [count, visibleItems]);
|
|
72
|
+
const onClickDoubleNext = useCallback(() => {
|
|
73
|
+
doubleNext && setPage(doubleNext);
|
|
74
|
+
}, [doubleNext]);
|
|
75
|
+
const iconSize = {
|
|
76
|
+
height: 24,
|
|
77
|
+
width: 24
|
|
78
|
+
};
|
|
79
|
+
const moveButtonProps = {
|
|
80
|
+
variant: "ghost",
|
|
81
|
+
size: "3",
|
|
82
|
+
style: { borderRadius: "50%" }
|
|
83
|
+
};
|
|
84
|
+
return /* @__PURE__ */ jsxs(Flex, { align: "center", className: "tipp-pagination", gap: "4", children: [
|
|
85
|
+
/* @__PURE__ */ jsx(
|
|
86
|
+
IconButton,
|
|
87
|
+
__spreadProps(__spreadValues({
|
|
88
|
+
disabled: !doublePrev,
|
|
89
|
+
onClick: onClickDoublePrev
|
|
90
|
+
}, moveButtonProps), {
|
|
91
|
+
children: /* @__PURE__ */ jsx(DoubleArrowLeftIcon, __spreadValues({}, iconSize))
|
|
92
|
+
})
|
|
93
|
+
),
|
|
94
|
+
/* @__PURE__ */ jsx(IconButton, __spreadProps(__spreadValues({ disabled: !prev, onClick: onClickPrev }, moveButtonProps), { children: /* @__PURE__ */ jsx(ChevronLeftIcon, __spreadValues({}, iconSize)) })),
|
|
95
|
+
/* @__PURE__ */ jsx(Flex, { gap: "1", children: visibleItems.map((item) => {
|
|
96
|
+
return /* @__PURE__ */ jsx(
|
|
97
|
+
"button",
|
|
98
|
+
{
|
|
99
|
+
className: `page-button ${item === page ? "active" : ""}`,
|
|
100
|
+
onClick: () => {
|
|
101
|
+
setPage(item);
|
|
102
|
+
},
|
|
103
|
+
type: "button",
|
|
104
|
+
children: /* @__PURE__ */ jsx(Typo, { variant: "body", children: item })
|
|
105
|
+
},
|
|
106
|
+
item
|
|
107
|
+
);
|
|
108
|
+
}) }),
|
|
109
|
+
/* @__PURE__ */ jsx(IconButton, __spreadProps(__spreadValues({ disabled: !next, onClick: onClickNext }, moveButtonProps), { children: /* @__PURE__ */ jsx(ChevronRightIcon, __spreadValues({}, iconSize)) })),
|
|
110
|
+
/* @__PURE__ */ jsx(
|
|
111
|
+
IconButton,
|
|
112
|
+
__spreadProps(__spreadValues({
|
|
113
|
+
disabled: !doubleNext,
|
|
114
|
+
onClick: onClickDoubleNext
|
|
115
|
+
}, moveButtonProps), {
|
|
116
|
+
children: /* @__PURE__ */ jsx(DoubleArrowRightIcon, __spreadValues({}, iconSize))
|
|
117
|
+
})
|
|
118
|
+
)
|
|
119
|
+
] });
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
export {
|
|
123
|
+
Pagination
|
|
124
|
+
};
|
|
125
|
+
//# sourceMappingURL=chunk-X4R5GV7Q.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/atoms/pagination.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport {\n ChevronLeftIcon,\n ChevronRightIcon,\n DoubleArrowLeftIcon,\n DoubleArrowRightIcon,\n} from '../icon';\nimport type { IconButtonProps } from './icon-button';\nimport { IconButton } from './icon-button';\nimport { Flex } from './flex';\nimport { Typo } from './typo';\n\nexport interface PaginationProps {\n /** 현재 선택된 페이지, 1부터 시작 */\n page?: number;\n /** 기본 선택 페이지, page보다 낮은 우선 순위를 갖는다 */\n defaultPage?: number;\n /** 선택한 페이지 변경 이벤트 cb */\n onChange?: (page: number) => void;\n /** 전체 페이지의 수 */\n count?: number;\n /** 표시할 페이지 버튼의 개수 */\n siblingCount?: number;\n}\n\nexport function Pagination(props: PaginationProps): React.ReactNode {\n const { onChange, count = 0, siblingCount = 2 } = props;\n\n const [page, setPage] = useState(() => props.page || props.defaultPage || 1);\n\n const visibleItems = useMemo(() => {\n let start = Math.max(1, page - siblingCount);\n let end = Math.min(count, page + siblingCount);\n if (page - siblingCount <= 0 && end < count) {\n end = Math.min(count, end + Math.abs(page - siblingCount) + 1);\n } else if (page + siblingCount > count && start > 1) {\n start = Math.max(1, start - (page + siblingCount - count));\n }\n\n return Array.from({ length: end - start + 1 }, (_, i) => i + start);\n }, [count, page, siblingCount]);\n\n useEffect(() => {\n onChange?.(page);\n }, [onChange, page]);\n\n useEffect(() => {\n if (props.page) {\n setPage(props.page);\n }\n }, [props.page]);\n\n const prev = useMemo<number | undefined>(() => {\n const p = page - 1;\n return p < 1 ? undefined : p;\n }, [page]);\n\n const next = useMemo<number | undefined>(() => {\n const n = page + 1;\n return n > count ? undefined : n;\n }, [count, page]);\n\n const onClickPrev = useCallback(() => {\n prev && setPage(prev);\n }, [prev]);\n\n const onClickNext = useCallback(() => {\n next && setPage(next);\n }, [next]);\n\n const doublePrev = useMemo<number | undefined>(() => {\n if (!visibleItems.length) return;\n return Math.max(0, visibleItems[0] - 1);\n }, [visibleItems]);\n\n const onClickDoublePrev = useCallback(() => {\n doublePrev && setPage(doublePrev);\n }, [doublePrev]);\n\n const doubleNext = useMemo<number | undefined>(() => {\n if (!visibleItems.length) return;\n const n = visibleItems[visibleItems.length - 1] + 1;\n if (n > count) return;\n return Math.min(count, n);\n }, [count, visibleItems]);\n\n const onClickDoubleNext = useCallback(() => {\n doubleNext && setPage(doubleNext);\n }, [doubleNext]);\n\n const iconSize = {\n height: 24,\n width: 24,\n };\n\n const moveButtonProps: IconButtonProps = {\n variant: 'ghost',\n size: '3',\n style: { borderRadius: '50%' },\n };\n\n return (\n <Flex align=\"center\" className=\"tipp-pagination\" gap=\"4\">\n <IconButton\n disabled={!doublePrev}\n onClick={onClickDoublePrev}\n {...moveButtonProps}\n >\n <DoubleArrowLeftIcon {...iconSize} />\n </IconButton>\n <IconButton disabled={!prev} onClick={onClickPrev} {...moveButtonProps}>\n <ChevronLeftIcon {...iconSize} />\n </IconButton>\n <Flex gap=\"1\">\n {visibleItems.map((item) => {\n return (\n <button\n className={`page-button ${item === page ? 'active' : ''}`}\n key={item}\n onClick={() => {\n setPage(item);\n }}\n type=\"button\"\n >\n <Typo variant=\"body\">{item}</Typo>\n </button>\n );\n })}\n </Flex>\n <IconButton disabled={!next} onClick={onClickNext} {...moveButtonProps}>\n <ChevronRightIcon {...iconSize} />\n </IconButton>\n <IconButton\n disabled={!doubleNext}\n onClick={onClickDoubleNext}\n {...moveButtonProps}\n >\n <DoubleArrowRightIcon {...iconSize} />\n </IconButton>\n </Flex>\n );\n}\n"],"mappings":"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","names":[]}
|