@tipp/ui 2.1.1 → 2.1.2

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.
Files changed (106) hide show
  1. package/dist/app/index.cjs.map +1 -1
  2. package/dist/app/index.js +54 -54
  3. package/dist/app/platform/coach-question-list.cjs.map +1 -1
  4. package/dist/app/platform/coach-question-list.js +34 -34
  5. package/dist/app/platform/contents-card.cjs.map +1 -1
  6. package/dist/app/platform/contents-card.js +34 -34
  7. package/dist/app/platform/curriculum-card.cjs.map +1 -1
  8. package/dist/app/platform/curriculum-card.js +6 -6
  9. package/dist/app/platform/edit-coaching-time.cjs.map +1 -1
  10. package/dist/app/platform/edit-coaching-time.js +42 -42
  11. package/dist/app/platform/edit-service-type.cjs.map +1 -1
  12. package/dist/app/platform/edit-service-type.js +41 -41
  13. package/dist/app/platform/goal-manage-card-edit.cjs.map +1 -1
  14. package/dist/app/platform/goal-manage-card-edit.js +42 -42
  15. package/dist/app/platform/goal-manage-card-read.cjs.map +1 -1
  16. package/dist/app/platform/goal-manage-card-read.js +34 -34
  17. package/dist/app/platform/on-offline-radio-card.cjs.map +1 -1
  18. package/dist/app/platform/on-offline-radio-card.js +41 -41
  19. package/dist/app/platform/report-card.cjs.map +1 -1
  20. package/dist/app/platform/report-card.js +34 -34
  21. package/dist/app/platform/reservation-card.cjs.map +1 -1
  22. package/dist/app/platform/reservation-card.js +42 -42
  23. package/dist/app/platform/session-card.cjs.map +1 -1
  24. package/dist/app/platform/session-card.js +43 -43
  25. package/dist/app/platform/session-review-simple-read.cjs.map +1 -1
  26. package/dist/app/platform/session-review-simple-read.js +34 -34
  27. package/dist/app/platform/userInfos/coaching-customer-info/index.cjs.map +1 -1
  28. package/dist/app/platform/userInfos/coaching-customer-info/index.js +36 -36
  29. package/dist/app/platform/userInfos/coaching-customer-info/large.cjs.map +1 -1
  30. package/dist/app/platform/userInfos/coaching-customer-info/large.js +34 -34
  31. package/dist/app/platform/userInfos/coaching-customer-info/medium.cjs.map +1 -1
  32. package/dist/app/platform/userInfos/coaching-customer-info/medium.js +34 -34
  33. package/dist/app/platform/userInfos/coaching-customer-info/small.cjs.map +1 -1
  34. package/dist/app/platform/userInfos/coaching-customer-info/small.js +33 -33
  35. package/dist/app/platform/userInfos/session-user-info-detail.cjs.map +1 -1
  36. package/dist/app/platform/userInfos/session-user-info-detail.js +33 -33
  37. package/dist/app/platform/userInfos/utils.cjs.map +1 -1
  38. package/dist/app/platform/userInfos/utils.js +33 -33
  39. package/dist/atoms/index.cjs.map +1 -1
  40. package/dist/atoms/index.js +78 -78
  41. package/dist/atoms/pagination.cjs.map +1 -1
  42. package/dist/atoms/pagination.js +5 -5
  43. package/dist/chunk-5WD65DYB.js +165 -0
  44. package/dist/chunk-5WD65DYB.js.map +1 -0
  45. package/dist/chunk-7TGJ65BJ.js +145 -0
  46. package/dist/chunk-7TGJ65BJ.js.map +1 -0
  47. package/dist/chunk-DC7U6ETG.js +174 -0
  48. package/dist/chunk-DC7U6ETG.js.map +1 -0
  49. package/dist/chunk-E46NGFKI.js +99 -0
  50. package/dist/chunk-E46NGFKI.js.map +1 -0
  51. package/dist/chunk-FAVQCOJA.js +354 -0
  52. package/dist/chunk-FAVQCOJA.js.map +1 -0
  53. package/dist/chunk-FS25L5QR.js +169 -0
  54. package/dist/chunk-FS25L5QR.js.map +1 -0
  55. package/dist/chunk-ITHW6JTA.js +125 -0
  56. package/dist/chunk-ITHW6JTA.js.map +1 -0
  57. package/dist/chunk-JC7PQ5UM.js +144 -0
  58. package/dist/chunk-JC7PQ5UM.js.map +1 -0
  59. package/dist/chunk-JID65NHZ.js +281 -0
  60. package/dist/chunk-JID65NHZ.js.map +1 -0
  61. package/dist/chunk-KJTFAPI3.js +68 -0
  62. package/dist/chunk-KJTFAPI3.js.map +1 -0
  63. package/dist/chunk-NH7KPW7D.js +117 -0
  64. package/dist/chunk-NH7KPW7D.js.map +1 -0
  65. package/dist/chunk-RGZEPGPV.js +190 -0
  66. package/dist/chunk-RGZEPGPV.js.map +1 -0
  67. package/dist/chunk-SNHWB7RD.js +63 -0
  68. package/dist/chunk-SNHWB7RD.js.map +1 -0
  69. package/dist/chunk-TRL5MOR2.js +96 -0
  70. package/dist/chunk-TRL5MOR2.js.map +1 -0
  71. package/dist/chunk-TW6WRK5I.js +117 -0
  72. package/dist/chunk-TW6WRK5I.js.map +1 -0
  73. package/dist/icon.cjs +4 -0
  74. package/dist/icon.cjs.map +1 -1
  75. package/dist/icon.d.cts +1 -1
  76. package/dist/icon.d.ts +1 -1
  77. package/dist/icon.js +14 -10
  78. package/dist/icons/index.js +9 -9
  79. package/dist/index.cjs +4 -0
  80. package/dist/index.cjs.map +1 -1
  81. package/dist/index.d.cts +1 -1
  82. package/dist/index.d.ts +1 -1
  83. package/dist/index.js +121 -117
  84. package/dist/molecules/date-picker/date-picker-button.cjs.map +1 -1
  85. package/dist/molecules/date-picker/date-picker-button.js +35 -35
  86. package/dist/molecules/date-picker/index.cjs.map +1 -1
  87. package/dist/molecules/date-picker/index.js +5 -5
  88. package/dist/molecules/expand-table/index.cjs.map +1 -1
  89. package/dist/molecules/expand-table/index.js +34 -34
  90. package/dist/molecules/expand-table/row.cjs.map +1 -1
  91. package/dist/molecules/expand-table/row.js +33 -33
  92. package/dist/molecules/index.cjs.map +1 -1
  93. package/dist/molecules/index.js +45 -45
  94. package/dist/molecules/learning-post.js +2 -2
  95. package/dist/molecules/navigation.cjs.map +1 -1
  96. package/dist/molecules/navigation.js +33 -33
  97. package/dist/molecules/radio-button-card.cjs.map +1 -1
  98. package/dist/molecules/radio-button-card.js +33 -33
  99. package/dist/molecules/stepper.cjs.map +1 -1
  100. package/dist/molecules/stepper.js +6 -6
  101. package/dist/molecules/tag-selector.cjs.map +1 -1
  102. package/dist/molecules/tag-selector.js +34 -34
  103. package/dist/molecules/time-select.cjs.map +1 -1
  104. package/dist/molecules/time-select.js +33 -33
  105. package/package.json +1 -1
  106. package/src/icon.ts +3 -1
@@ -0,0 +1,125 @@
1
+ import {
2
+ IconButton
3
+ } from "./chunk-O3DNDMV3.js";
4
+ import {
5
+ Typo
6
+ } from "./chunk-LH57PIY2.js";
7
+ import {
8
+ Flex
9
+ } from "./chunk-25HMMI7R.js";
10
+ import {
11
+ ChevronLeftIcon,
12
+ ChevronRightIcon,
13
+ DoubleArrowLeftIcon,
14
+ DoubleArrowRightIcon
15
+ } from "./chunk-TW6WRK5I.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-ITHW6JTA.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":";;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,aAAa,WAAW,SAAS,gBAAgB;AAsG7D,SAMI,KANJ;AA7EG,SAAS,WAAW,OAAyC;AAClE,QAAM,EAAE,UAAU,QAAQ,GAAG,eAAe,EAAE,IAAI;AAElD,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,MAAM,MAAM,QAAQ,MAAM,eAAe,CAAC;AAE3E,QAAM,eAAe,QAAQ,MAAM;AACjC,QAAI,QAAQ,KAAK,IAAI,GAAG,OAAO,YAAY;AAC3C,QAAI,MAAM,KAAK,IAAI,OAAO,OAAO,YAAY;AAC7C,QAAI,OAAO,gBAAgB,KAAK,MAAM,OAAO;AAC3C,YAAM,KAAK,IAAI,OAAO,MAAM,KAAK,IAAI,OAAO,YAAY,IAAI,CAAC;AAAA,IAC/D,WAAW,OAAO,eAAe,SAAS,QAAQ,GAAG;AACnD,cAAQ,KAAK,IAAI,GAAG,SAAS,OAAO,eAAe,MAAM;AAAA,IAC3D;AAEA,WAAO,MAAM,KAAK,EAAE,QAAQ,MAAM,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,IAAI,KAAK;AAAA,EACpE,GAAG,CAAC,OAAO,MAAM,YAAY,CAAC;AAE9B,YAAU,MAAM;AACd,yCAAW;AAAA,EACb,GAAG,CAAC,UAAU,IAAI,CAAC;AAEnB,YAAU,MAAM;AACd,QAAI,MAAM,MAAM;AACd,cAAQ,MAAM,IAAI;AAAA,IACpB;AAAA,EACF,GAAG,CAAC,MAAM,IAAI,CAAC;AAEf,QAAM,OAAO,QAA4B,MAAM;AAC7C,UAAM,IAAI,OAAO;AACjB,WAAO,IAAI,IAAI,SAAY;AAAA,EAC7B,GAAG,CAAC,IAAI,CAAC;AAET,QAAM,OAAO,QAA4B,MAAM;AAC7C,UAAM,IAAI,OAAO;AACjB,WAAO,IAAI,QAAQ,SAAY;AAAA,EACjC,GAAG,CAAC,OAAO,IAAI,CAAC;AAEhB,QAAM,cAAc,YAAY,MAAM;AACpC,YAAQ,QAAQ,IAAI;AAAA,EACtB,GAAG,CAAC,IAAI,CAAC;AAET,QAAM,cAAc,YAAY,MAAM;AACpC,YAAQ,QAAQ,IAAI;AAAA,EACtB,GAAG,CAAC,IAAI,CAAC;AAET,QAAM,aAAa,QAA4B,MAAM;AACnD,QAAI,CAAC,aAAa,OAAQ;AAC1B,WAAO,KAAK,IAAI,GAAG,aAAa,CAAC,IAAI,CAAC;AAAA,EACxC,GAAG,CAAC,YAAY,CAAC;AAEjB,QAAM,oBAAoB,YAAY,MAAM;AAC1C,kBAAc,QAAQ,UAAU;AAAA,EAClC,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,aAAa,QAA4B,MAAM;AACnD,QAAI,CAAC,aAAa,OAAQ;AAC1B,UAAM,IAAI,aAAa,aAAa,SAAS,CAAC,IAAI;AAClD,QAAI,IAAI,MAAO;AACf,WAAO,KAAK,IAAI,OAAO,CAAC;AAAA,EAC1B,GAAG,CAAC,OAAO,YAAY,CAAC;AAExB,QAAM,oBAAoB,YAAY,MAAM;AAC1C,kBAAc,QAAQ,UAAU;AAAA,EAClC,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,WAAW;AAAA,IACf,QAAQ;AAAA,IACR,OAAO;AAAA,EACT;AAEA,QAAM,kBAAmC;AAAA,IACvC,SAAS;AAAA,IACT,MAAM;AAAA,IACN,OAAO,EAAE,cAAc,MAAM;AAAA,EAC/B;AAEA,SACE,qBAAC,QAAK,OAAM,UAAS,WAAU,mBAAkB,KAAI,KACnD;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU,CAAC;AAAA,QACX,SAAS;AAAA,SACL,kBAHL;AAAA,QAKC,8BAAC,wCAAwB,SAAU;AAAA;AAAA,IACrC;AAAA,IACA,oBAAC,2CAAW,UAAU,CAAC,MAAM,SAAS,eAAiB,kBAAtD,EACC,8BAAC,oCAAoB,SAAU,IACjC;AAAA,IACA,oBAAC,QAAK,KAAI,KACP,uBAAa,IAAI,CAAC,SAAS;AAC1B,aACE;AAAA,QAAC;AAAA;AAAA,UACC,WAAW,eAAe,SAAS,OAAO,WAAW,EAAE;AAAA,UAEvD,SAAS,MAAM;AACb,oBAAQ,IAAI;AAAA,UACd;AAAA,UACA,MAAK;AAAA,UAEL,8BAAC,QAAK,SAAQ,QAAQ,gBAAK;AAAA;AAAA,QANtB;AAAA,MAOP;AAAA,IAEJ,CAAC,GACH;AAAA,IACA,oBAAC,2CAAW,UAAU,CAAC,MAAM,SAAS,eAAiB,kBAAtD,EACC,8BAAC,qCAAqB,SAAU,IAClC;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU,CAAC;AAAA,QACX,SAAS;AAAA,SACL,kBAHL;AAAA,QAKC,8BAAC,yCAAyB,SAAU;AAAA;AAAA,IACtC;AAAA,KACF;AAEJ;","names":[]}
@@ -0,0 +1,144 @@
1
+ import {
2
+ EditCoachingTime
3
+ } from "./chunk-DC7U6ETG.js";
4
+ import {
5
+ EditServiceType
6
+ } from "./chunk-44Y6LSNA.js";
7
+ import {
8
+ Grid
9
+ } from "./chunk-EGEQY3KT.js";
10
+ import {
11
+ DataList
12
+ } from "./chunk-VTJZMOSP.js";
13
+ import {
14
+ Dialog
15
+ } from "./chunk-45VFASWZ.js";
16
+ import {
17
+ Heading
18
+ } from "./chunk-3IT3NVK6.js";
19
+ import {
20
+ BulletText
21
+ } from "./chunk-LMWTEDYS.js";
22
+ import {
23
+ Flex
24
+ } from "./chunk-25HMMI7R.js";
25
+ import {
26
+ Button
27
+ } from "./chunk-AFPH32MF.js";
28
+ import {
29
+ Card
30
+ } from "./chunk-HEDMSFPW.js";
31
+ import {
32
+ Pencil1Icon
33
+ } from "./chunk-TW6WRK5I.js";
34
+ import {
35
+ __objRest,
36
+ __spreadProps,
37
+ __spreadValues
38
+ } from "./chunk-2NMEKWO5.js";
39
+
40
+ // src/app/platform/session-card.tsx
41
+ import { useCallback, useMemo } from "react";
42
+ import { format } from "date-fns";
43
+ import { jsx, jsxs } from "react/jsx-runtime";
44
+ var preventDefault = (e) => {
45
+ e.preventDefault();
46
+ };
47
+ function SessionCard(props) {
48
+ const _a = props, {
49
+ sessionNumber,
50
+ userName,
51
+ error,
52
+ ExtraButtons,
53
+ TitleExtra,
54
+ editable,
55
+ onSaveDate,
56
+ onSaveSessionType,
57
+ startAt,
58
+ endAt,
59
+ sessionType
60
+ } = _a, rest = __objRest(_a, [
61
+ "sessionNumber",
62
+ "userName",
63
+ "error",
64
+ "ExtraButtons",
65
+ "TitleExtra",
66
+ "editable",
67
+ "onSaveDate",
68
+ "onSaveSessionType",
69
+ "startAt",
70
+ "endAt",
71
+ "sessionType"
72
+ ]);
73
+ const renderEditButton = useCallback(() => {
74
+ return /* @__PURE__ */ jsx(Button, { color: "gray", ml: "2", variant: "transparent", children: /* @__PURE__ */ jsx(Pencil1Icon, {}) });
75
+ }, []);
76
+ const sessionTimeStr = useMemo(() => {
77
+ if (!startAt || !endAt) return "\uC54C \uC218 \uC5C6\uC74C";
78
+ return `${format(startAt, "yyyy\uB144 MM\uC6D4 dd\uC77C HH\uC2DC mm\uBD84")} ~ ${format(endAt, "HH\uC2DC mm\uBD84")}`;
79
+ }, [startAt, endAt]);
80
+ return /* @__PURE__ */ jsx(Card, __spreadProps(__spreadValues({ error: Boolean(error) }, rest), { children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "3", children: [
81
+ /* @__PURE__ */ jsxs(Flex, { align: "center", width: "100%", children: [
82
+ /* @__PURE__ */ jsx(Heading, { variant: "heading4", children: `${userName || "\uC54C \uC218 \uC5C6\uC74C"}\uB2D8 ${sessionNumber || "-"}\uD68C\uCC28` }),
83
+ TitleExtra,
84
+ error ? /* @__PURE__ */ jsx(BulletText, { as: "p", color: "red", variant: "caption", children: error }) : null
85
+ ] }),
86
+ /* @__PURE__ */ jsxs(DataList.Root, { children: [
87
+ /* @__PURE__ */ jsxs(DataList.Item, { children: [
88
+ /* @__PURE__ */ jsx(DataList.Label, { children: "\uCF54\uCE6D \uC77C\uC2DC" }),
89
+ /* @__PURE__ */ jsxs(DataList.Value, { children: [
90
+ sessionTimeStr,
91
+ editable ? /* @__PURE__ */ jsxs(Dialog.Root, { children: [
92
+ /* @__PURE__ */ jsx(Dialog.Trigger, { children: renderEditButton() }),
93
+ /* @__PURE__ */ jsx(
94
+ Dialog.Content,
95
+ {
96
+ onOpenAutoFocus: preventDefault,
97
+ style: { overflow: "visible" },
98
+ title: `${sessionNumber}\uD68C\uCC28 \uC138\uC158 \uC77C\uC2DC \uBCC0\uACBD\uD558\uAE30`,
99
+ children: /* @__PURE__ */ jsx(
100
+ EditCoachingTime,
101
+ {
102
+ defaultEndAt: endAt,
103
+ defaultStartAt: startAt,
104
+ onClickSave: onSaveDate
105
+ }
106
+ )
107
+ }
108
+ )
109
+ ] }) : null
110
+ ] })
111
+ ] }),
112
+ /* @__PURE__ */ jsxs(Grid, { columns: { initial: "1", xs: "2" }, style: { gap: "inherit" }, children: [
113
+ /* @__PURE__ */ jsxs(DataList.Item, { children: [
114
+ /* @__PURE__ */ jsx(DataList.Label, { children: "\uC138\uC158 \uCC38\uC5EC \uBC29\uC2DD" }),
115
+ /* @__PURE__ */ jsxs(DataList.Value, { children: [
116
+ sessionType === "offlineCoaching" ? "\uC624\uD504\uB77C\uC778" : "\uC628\uB77C\uC778",
117
+ editable ? /* @__PURE__ */ jsxs(Dialog.Root, { children: [
118
+ /* @__PURE__ */ jsx(Dialog.Trigger, { children: renderEditButton() }),
119
+ /* @__PURE__ */ jsx(
120
+ Dialog.Content,
121
+ {
122
+ title: `${sessionNumber}\uD68C\uCC28 \uC138\uC158 \uC9C4\uD589 \uBC29\uC2DD \uBCC0\uACBD\uD558\uAE30`,
123
+ children: /* @__PURE__ */ jsx(
124
+ EditServiceType,
125
+ {
126
+ defaultServiceType: sessionType,
127
+ onClickSave: onSaveSessionType
128
+ }
129
+ )
130
+ }
131
+ )
132
+ ] }) : null
133
+ ] })
134
+ ] }),
135
+ /* @__PURE__ */ jsx(Flex, { gap: "2", justify: "end", children: ExtraButtons })
136
+ ] })
137
+ ] })
138
+ ] }) }));
139
+ }
140
+
141
+ export {
142
+ SessionCard
143
+ };
144
+ //# sourceMappingURL=chunk-JC7PQ5UM.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/app/platform/session-card.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport { format } from 'date-fns';\nimport type { ServiceType } from '@/types/biz.type';\nimport type { CardProps } from '../../atoms';\nimport {\n BulletText,\n Button,\n Card,\n DataList,\n Dialog,\n Flex,\n Grid,\n Heading,\n} from '../../atoms';\nimport { Pencil1Icon } from '../../icon';\nimport { EditCoachingTime } from './edit-coaching-time';\nimport { EditServiceType } from './edit-service-type';\n\nconst preventDefault = (e: Event): void => {\n e.preventDefault();\n};\nexport type SessionCardProps = Omit<CardProps, 'error'> & {\n error?: string;\n startAt?: Date;\n endAt?: Date;\n sessionType?: ServiceType;\n userName?: string;\n sessionNumber?: number;\n ExtraButtons?: React.ReactNode;\n editable?: boolean;\n TitleExtra?: React.ReactNode;\n onSaveDate?: (startTime: Date, endTime: Date) => void;\n onSaveSessionType?: (sessionType: string) => void;\n};\n\nexport function SessionCard(props: SessionCardProps): React.ReactNode {\n const {\n sessionNumber,\n userName,\n error,\n ExtraButtons,\n TitleExtra,\n editable,\n onSaveDate,\n onSaveSessionType,\n startAt,\n endAt,\n sessionType,\n ...rest\n } = props;\n\n const renderEditButton = useCallback((): React.ReactNode => {\n return (\n <Button color=\"gray\" ml=\"2\" variant=\"transparent\">\n <Pencil1Icon />\n </Button>\n );\n }, []);\n\n const sessionTimeStr = useMemo(() => {\n if (!startAt || !endAt) return '알 수 없음';\n\n return `${format(startAt, 'yyyy년 MM월 dd일 HH시 mm분')} ~ ${format(endAt, 'HH시 mm분')}`;\n }, [startAt, endAt]);\n\n return (\n <Card error={Boolean(error)} {...rest}>\n <Flex direction=\"column\" gap=\"3\">\n <Flex align=\"center\" width=\"100%\">\n <Heading variant=\"heading4\">\n {`${userName || '알 수 없음'}님 ${sessionNumber || '-'}회차`}\n </Heading>\n {TitleExtra}\n {error ? (\n <BulletText as=\"p\" color=\"red\" variant=\"caption\">\n {error}\n </BulletText>\n ) : null}\n </Flex>\n <DataList.Root>\n <DataList.Item>\n <DataList.Label>코칭 일시</DataList.Label>\n <DataList.Value>\n {sessionTimeStr}\n {editable ? (\n <Dialog.Root>\n <Dialog.Trigger>{renderEditButton()}</Dialog.Trigger>\n <Dialog.Content\n onOpenAutoFocus={preventDefault}\n style={{ overflow: 'visible' }}\n title={`${sessionNumber}회차 세션 일시 변경하기`}\n >\n <EditCoachingTime\n defaultEndAt={endAt}\n defaultStartAt={startAt}\n onClickSave={onSaveDate}\n />\n </Dialog.Content>\n </Dialog.Root>\n ) : null}\n </DataList.Value>\n </DataList.Item>\n <Grid columns={{ initial: '1', xs: '2' }} style={{ gap: 'inherit' }}>\n <DataList.Item>\n <DataList.Label>세션 참여 방식</DataList.Label>\n <DataList.Value>\n {sessionType === 'offlineCoaching' ? '오프라인' : '온라인'}\n {editable ? (\n <Dialog.Root>\n <Dialog.Trigger>{renderEditButton()}</Dialog.Trigger>\n <Dialog.Content\n title={`${sessionNumber}회차 세션 진행 방식 변경하기`}\n >\n <EditServiceType\n defaultServiceType={sessionType}\n onClickSave={onSaveSessionType}\n />\n </Dialog.Content>\n </Dialog.Root>\n ) : null}\n </DataList.Value>\n </DataList.Item>\n\n <Flex gap=\"2\" justify=\"end\">\n {ExtraButtons}\n </Flex>\n </Grid>\n </DataList.Root>\n </Flex>\n </Card>\n );\n}\n"],"mappings":"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","names":[]}
@@ -0,0 +1,281 @@
1
+ import {
2
+ OnOfflineRadioCard
3
+ } from "./chunk-4QWYV2QX.js";
4
+ import {
5
+ DatePickerButton
6
+ } from "./chunk-SNHWB7RD.js";
7
+ import {
8
+ TimeSelect
9
+ } from "./chunk-5VWEW4M2.js";
10
+ import {
11
+ getTimeOption,
12
+ parseTimeOption
13
+ } from "./chunk-NWJSLIQ3.js";
14
+ import {
15
+ Form
16
+ } from "./chunk-QD5ZSFPG.js";
17
+ import {
18
+ toast
19
+ } from "./chunk-26ZU5KUR.js";
20
+ import {
21
+ Inset
22
+ } from "./chunk-XQOL7UBI.js";
23
+ import {
24
+ Grid
25
+ } from "./chunk-EGEQY3KT.js";
26
+ import {
27
+ Heading
28
+ } from "./chunk-3IT3NVK6.js";
29
+ import {
30
+ Box
31
+ } from "./chunk-4Y5BEXVN.js";
32
+ import {
33
+ BulletText
34
+ } from "./chunk-LMWTEDYS.js";
35
+ import {
36
+ Typo
37
+ } from "./chunk-LH57PIY2.js";
38
+ import {
39
+ Flex
40
+ } from "./chunk-25HMMI7R.js";
41
+ import {
42
+ Button
43
+ } from "./chunk-AFPH32MF.js";
44
+ import {
45
+ Card
46
+ } from "./chunk-HEDMSFPW.js";
47
+ import {
48
+ ArrowRightIcon,
49
+ Cross1Icon
50
+ } from "./chunk-TW6WRK5I.js";
51
+ import {
52
+ Badge
53
+ } from "./chunk-FCIHNIOH.js";
54
+ import {
55
+ __spreadProps,
56
+ __spreadValues
57
+ } from "./chunk-2NMEKWO5.js";
58
+
59
+ // src/app/platform/reservation-card.tsx
60
+ import { useCallback, useEffect, useMemo, useState } from "react";
61
+ import { setHours, setMinutes } from "date-fns";
62
+ import { jsx, jsxs } from "react/jsx-runtime";
63
+ function ReservationCard(props) {
64
+ const {
65
+ sessionNumber,
66
+ customerName,
67
+ readonly,
68
+ defaultTime,
69
+ defaultType,
70
+ error,
71
+ minTime,
72
+ maxTime,
73
+ onClickReserve,
74
+ onClickCancel,
75
+ onClickCompleteSession
76
+ } = props;
77
+ const [editValues, setEditValues] = useState({
78
+ date: props.defaultTime,
79
+ type: props.defaultType
80
+ });
81
+ const date = readonly ? defaultTime : editValues.date;
82
+ const type = readonly ? defaultType : editValues.type;
83
+ const time = date && getTimeOption(date);
84
+ const onClickSave = useCallback(() => {
85
+ var _a;
86
+ (_a = props.onClickSave) == null ? void 0 : _a.call(props, editValues);
87
+ }, [editValues, props]);
88
+ const onClickReset = useCallback(() => {
89
+ setEditValues({
90
+ date: defaultTime,
91
+ type: defaultType
92
+ });
93
+ }, [defaultTime, defaultType]);
94
+ const ActionButtons = useMemo(() => {
95
+ if (readonly) {
96
+ return /* @__PURE__ */ jsx(Button, { onClick: onClickReserve, size: "small", variant: "surface", children: defaultTime && defaultType ? "\uC608\uC57D \uC218\uC815\uD558\uAE30" : "\uC608\uC57D\uD558\uAE30" });
97
+ }
98
+ return /* @__PURE__ */ jsx(Button, { color: "gray", onClick: onClickCancel, variant: "transparent", children: /* @__PURE__ */ jsx(Cross1Icon, {}) });
99
+ }, [defaultTime, defaultType, onClickCancel, onClickReserve, readonly]);
100
+ const onChangeDate = useCallback(
101
+ (newDate) => {
102
+ if (!newDate) return;
103
+ const { hour = 0, minute = 0 } = time ? parseTimeOption(time) : {};
104
+ setEditValues((prev) => {
105
+ return __spreadProps(__spreadValues({}, prev), {
106
+ date: setMinutes(setHours(newDate, hour), minute)
107
+ });
108
+ });
109
+ },
110
+ [time]
111
+ );
112
+ const onChangeType = useCallback((newType) => {
113
+ setEditValues((prev) => {
114
+ return __spreadProps(__spreadValues({}, prev), {
115
+ type: newType
116
+ });
117
+ });
118
+ }, []);
119
+ const onChangeTime = useCallback(
120
+ (v) => {
121
+ const { hour, minute } = parseTimeOption(v);
122
+ if (typeof v === "undefined") {
123
+ setEditValues((prev) => {
124
+ return __spreadProps(__spreadValues({}, prev), {
125
+ date: v
126
+ });
127
+ });
128
+ }
129
+ setEditValues((prev) => {
130
+ return __spreadProps(__spreadValues({}, prev), {
131
+ date: setMinutes(setHours(date || /* @__PURE__ */ new Date(), hour), minute)
132
+ });
133
+ });
134
+ },
135
+ [date]
136
+ );
137
+ useEffect(() => {
138
+ if (!minTime || !editValues.date || readonly) return;
139
+ if (editValues.date < minTime) {
140
+ toast.warn("\uC120\uD0DD \uAC00\uB2A5\uD55C \uC2DC\uAC04\uB300\uB85C \uBCC0\uACBD\uB418\uC5C8\uC2B5\uB2C8\uB2E4.");
141
+ setEditValues((prev) => {
142
+ return __spreadProps(__spreadValues({}, prev), {
143
+ date: minTime
144
+ });
145
+ });
146
+ }
147
+ }, [editValues, minTime, readonly]);
148
+ useEffect(() => {
149
+ if (!maxTime || !editValues.date || readonly) return;
150
+ if (editValues.date > maxTime) {
151
+ toast.warn("\uC120\uD0DD \uAC00\uB2A5\uD55C \uC2DC\uAC04\uB300\uB85C \uBCC0\uACBD\uB418\uC5C8\uC2B5\uB2C8\uB2E4.");
152
+ setEditValues((prev) => {
153
+ return __spreadProps(__spreadValues({}, prev), {
154
+ date: maxTime
155
+ });
156
+ });
157
+ }
158
+ }, [editValues, maxTime, readonly]);
159
+ return /* @__PURE__ */ jsxs(
160
+ Card,
161
+ {
162
+ error: Boolean(error),
163
+ size: "3",
164
+ style: { overflow: "visible", contain: "initial" },
165
+ children: [
166
+ /* @__PURE__ */ jsxs(Flex, { gap: "3", justify: "between", mb: "5", children: [
167
+ /* @__PURE__ */ jsxs(
168
+ Grid,
169
+ {
170
+ align: "center",
171
+ columns: { initial: "1", xs: "auto 1fr" },
172
+ gapY: "2",
173
+ children: [
174
+ /* @__PURE__ */ jsxs(Flex, { align: "center", children: [
175
+ /* @__PURE__ */ jsxs(Heading, { variant: "heading4", children: [
176
+ customerName || "-",
177
+ "\uB2D8 ",
178
+ sessionNumber || "-",
179
+ "\uD68C\uCC28 \uC138\uC158"
180
+ ] }),
181
+ /* @__PURE__ */ jsx(Badge, { ml: "2", children: "\uB2E4\uC74C \uC138\uC158" })
182
+ ] }),
183
+ error ? /* @__PURE__ */ jsx(BulletText, { color: "red", variant: "caption", children: error }) : null
184
+ ]
185
+ }
186
+ ),
187
+ /* @__PURE__ */ jsx(Flex, { children: ActionButtons })
188
+ ] }),
189
+ /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
190
+ Form.Root,
191
+ {
192
+ onSubmit: (e) => {
193
+ e.preventDefault();
194
+ },
195
+ children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "5", children: [
196
+ /* @__PURE__ */ jsx(Form.Field, { name: "date", children: /* @__PURE__ */ jsxs(Form.Label, { asChild: true, children: [
197
+ /* @__PURE__ */ jsx(Heading, { mb: "2", variant: "heading5", weight: "regular", children: "\uC138\uC158 \uC77C\uC790\uC640 \uC2DC\uAC01" }),
198
+ /* @__PURE__ */ jsxs(Grid, { columns: "1fr auto", gap: "4", children: [
199
+ /* @__PURE__ */ jsx(
200
+ DatePickerButton,
201
+ {
202
+ disabled: readonly,
203
+ maxDate: maxTime,
204
+ minDate: minTime,
205
+ onChange: onChangeDate,
206
+ placeholder: "\uC77C\uC790\uB97C \uC120\uD0DD\uD574\uC8FC\uC138\uC694",
207
+ selected: date,
208
+ size: "large"
209
+ }
210
+ ),
211
+ /* @__PURE__ */ jsx(
212
+ TimeSelect,
213
+ {
214
+ disabled: readonly,
215
+ maxTime,
216
+ minTime,
217
+ onValueChange: onChangeTime,
218
+ size: "3",
219
+ time: date,
220
+ value: time
221
+ }
222
+ )
223
+ ] })
224
+ ] }) }),
225
+ /* @__PURE__ */ jsxs(Form.Field, { name: "type", children: [
226
+ /* @__PURE__ */ jsx(Form.Label, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { mb: "2", variant: "heading5", weight: "regular", children: "\uC628/\uC624\uD504\uB77C\uC778 \uC9C4\uD589 \uC5EC\uBD80" }) }),
227
+ /* @__PURE__ */ jsx(Form.Control, { asChild: true, children: /* @__PURE__ */ jsx(
228
+ OnOfflineRadioCard,
229
+ {
230
+ disabled: readonly,
231
+ onValueChange: onChangeType,
232
+ size: "1",
233
+ value: type
234
+ }
235
+ ) })
236
+ ] }),
237
+ readonly ? null : /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "3", justify: "end", children: [
238
+ /* @__PURE__ */ jsx(
239
+ Button,
240
+ {
241
+ color: "gray",
242
+ onClick: onClickReset,
243
+ size: "small",
244
+ variant: "transparent",
245
+ children: "\uCD08\uAE30\uD654\uD558\uAE30"
246
+ }
247
+ ),
248
+ /* @__PURE__ */ jsx(Button, { onClick: onClickSave, size: "small", children: "\uC800\uC7A5\uD558\uAE30" })
249
+ ] })
250
+ ] })
251
+ }
252
+ ) }),
253
+ readonly ? /* @__PURE__ */ jsx(Inset, { clip: "border-box", side: "bottom", children: /* @__PURE__ */ jsx(
254
+ Box,
255
+ {
256
+ mt: "5",
257
+ px: "5",
258
+ py: "4",
259
+ style: { backgroundColor: "var(--accent-a3)" },
260
+ width: "100%",
261
+ children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "4", justify: "center", children: [
262
+ /* @__PURE__ */ jsxs(Typo, { children: [
263
+ sessionNumber || "-",
264
+ "\uD68C\uCC28 \uC138\uC158\uC744 \uC644\uB8CC\uD558\uC168\uB098\uC694?"
265
+ ] }),
266
+ /* @__PURE__ */ jsxs(Button, { onClick: onClickCompleteSession, size: "small", children: [
267
+ "\uC138\uC158 \uC885\uB8CC\uD558\uAE30",
268
+ /* @__PURE__ */ jsx(ArrowRightIcon, {})
269
+ ] })
270
+ ] })
271
+ }
272
+ ) }) : null
273
+ ]
274
+ }
275
+ );
276
+ }
277
+
278
+ export {
279
+ ReservationCard
280
+ };
281
+ //# sourceMappingURL=chunk-JID65NHZ.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/app/platform/reservation-card.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport { setHours, setMinutes } from 'date-fns';\nimport {\n Badge,\n Box,\n BulletText,\n Button,\n Card,\n Flex,\n Form,\n Grid,\n Heading,\n Inset,\n toast,\n Typo,\n} from '../../atoms';\nimport { ArrowRightIcon, Cross1Icon } from '../../icon';\nimport { DatePickerButton, TimeSelect } from '../../molecules';\nimport { getTimeOption, parseTimeOption } from '../../utils';\nimport { OnOfflineRadioCard } from './on-offline-radio-card';\n\ntype Type = 'onlineCoaching' | 'offlineCoaching';\n\ninterface Values {\n date?: Date;\n type?: Type;\n}\n\nexport interface ReservationCardProps {\n sessionNumber?: number;\n readonly?: boolean;\n defaultTime?: Date;\n defaultType?: Type;\n customerName?: string;\n error?: string;\n onClickCompleteSession?: () => void;\n onClickReserve?: () => void;\n onClickSave?: (values: Values) => void;\n onClickCancel?: () => void;\n minTime?: Date;\n maxTime?: Date;\n}\n\nexport function ReservationCard(\n props: ReservationCardProps\n): React.ReactNode {\n const {\n sessionNumber,\n customerName,\n readonly,\n defaultTime,\n defaultType,\n error,\n minTime,\n maxTime,\n onClickReserve,\n onClickCancel,\n onClickCompleteSession,\n } = props;\n\n const [editValues, setEditValues] = useState<Values>({\n date: props.defaultTime,\n type: props.defaultType,\n });\n\n const date = readonly ? defaultTime : editValues.date;\n const type = readonly ? defaultType : editValues.type;\n const time = date && getTimeOption(date);\n\n const onClickSave = useCallback(() => {\n props.onClickSave?.(editValues);\n }, [editValues, props]);\n\n const onClickReset = useCallback(() => {\n setEditValues({\n date: defaultTime,\n type: defaultType,\n });\n }, [defaultTime, defaultType]);\n\n const ActionButtons = useMemo(() => {\n if (readonly) {\n return (\n <Button onClick={onClickReserve} size=\"small\" variant=\"surface\">\n {defaultTime && defaultType ? '예약 수정하기' : '예약하기'}\n </Button>\n );\n }\n return (\n <Button color=\"gray\" onClick={onClickCancel} variant=\"transparent\">\n <Cross1Icon />\n </Button>\n );\n }, [defaultTime, defaultType, onClickCancel, onClickReserve, readonly]);\n\n const onChangeDate = useCallback(\n (newDate: Date | null) => {\n if (!newDate) return;\n const { hour = 0, minute = 0 } = time ? parseTimeOption(time) : {};\n setEditValues((prev) => {\n return {\n ...prev,\n date: setMinutes(setHours(newDate, hour), minute),\n };\n });\n },\n [time]\n );\n\n const onChangeType = useCallback((newType: string) => {\n setEditValues((prev) => {\n return {\n ...prev,\n type: newType as Type,\n };\n });\n }, []);\n\n const onChangeTime = useCallback(\n (v?: string) => {\n const { hour, minute } = parseTimeOption(v);\n if (typeof v === 'undefined') {\n setEditValues((prev) => {\n return {\n ...prev,\n date: v,\n };\n });\n }\n setEditValues((prev) => {\n return {\n ...prev,\n date: setMinutes(setHours(date || new Date(), hour), minute),\n };\n });\n },\n [date]\n );\n\n useEffect(() => {\n if (!minTime || !editValues.date || readonly) return;\n if (editValues.date < minTime) {\n toast.warn('선택 가능한 시간대로 변경되었습니다.');\n setEditValues((prev) => {\n return {\n ...prev,\n date: minTime,\n };\n });\n }\n }, [editValues, minTime, readonly]);\n\n useEffect(() => {\n if (!maxTime || !editValues.date || readonly) return;\n if (editValues.date > maxTime) {\n toast.warn('선택 가능한 시간대로 변경되었습니다.');\n setEditValues((prev) => {\n return {\n ...prev,\n date: maxTime,\n };\n });\n }\n }, [editValues, maxTime, readonly]);\n\n return (\n <Card\n error={Boolean(error)}\n size=\"3\"\n style={{ overflow: 'visible', contain: 'initial' }}\n >\n <Flex gap=\"3\" justify=\"between\" mb=\"5\">\n <Grid\n align=\"center\"\n columns={{ initial: '1', xs: 'auto 1fr' }}\n gapY=\"2\"\n >\n <Flex align=\"center\">\n <Heading variant=\"heading4\">\n {customerName || '-'}님 {sessionNumber || '-'}회차 세션\n </Heading>\n <Badge ml=\"2\">다음 세션</Badge>\n </Flex>\n {error ? (\n <BulletText color=\"red\" variant=\"caption\">\n {error}\n </BulletText>\n ) : null}\n </Grid>\n <Flex>{ActionButtons}</Flex>\n </Flex>\n\n <Box>\n <Form.Root\n onSubmit={(e) => {\n e.preventDefault();\n }}\n >\n <Flex direction=\"column\" gap=\"5\">\n <Form.Field name=\"date\">\n <Form.Label asChild>\n <Heading mb=\"2\" variant=\"heading5\" weight=\"regular\">\n 세션 일자와 시각\n </Heading>\n <Grid columns=\"1fr auto\" gap=\"4\">\n <DatePickerButton\n disabled={readonly}\n maxDate={maxTime}\n minDate={minTime}\n onChange={onChangeDate}\n placeholder=\"일자를 선택해주세요\"\n selected={date}\n size=\"large\"\n />\n <TimeSelect\n disabled={readonly}\n maxTime={maxTime}\n minTime={minTime}\n onValueChange={onChangeTime}\n size=\"3\"\n time={date}\n value={time}\n />\n </Grid>\n </Form.Label>\n </Form.Field>\n\n <Form.Field name=\"type\">\n <Form.Label asChild>\n <Heading mb=\"2\" variant=\"heading5\" weight=\"regular\">\n 온/오프라인 진행 여부\n </Heading>\n </Form.Label>\n <Form.Control asChild>\n <OnOfflineRadioCard\n disabled={readonly}\n onValueChange={onChangeType}\n size=\"1\"\n value={type}\n />\n </Form.Control>\n </Form.Field>\n\n {readonly ? null : (\n <Flex align=\"center\" gap=\"3\" justify=\"end\">\n <Button\n color=\"gray\"\n onClick={onClickReset}\n size=\"small\"\n variant=\"transparent\"\n >\n 초기화하기\n </Button>\n <Button onClick={onClickSave} size=\"small\">\n 저장하기\n </Button>\n </Flex>\n )}\n </Flex>\n </Form.Root>\n </Box>\n\n {readonly ? (\n <Inset clip=\"border-box\" side=\"bottom\">\n <Box\n mt=\"5\"\n px=\"5\"\n py=\"4\"\n style={{ backgroundColor: 'var(--accent-a3)' }}\n width=\"100%\"\n >\n <Flex align=\"center\" gap=\"4\" justify=\"center\">\n <Typo>{sessionNumber || '-'}회차 세션을 완료하셨나요?</Typo>\n <Button onClick={onClickCompleteSession} size=\"small\">\n 세션 종료하기\n <ArrowRightIcon />\n </Button>\n </Flex>\n </Box>\n </Inset>\n ) : null}\n </Card>\n );\n}\n"],"mappings":"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","names":[]}