@tipp/ui 2.3.18 → 2.3.19

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 (133) hide show
  1. package/dist/app/index.cjs.map +1 -1
  2. package/dist/app/index.js +3 -3
  3. package/dist/app/platform/edit-coaching-time.cjs.map +1 -1
  4. package/dist/app/platform/edit-coaching-time.js +3 -3
  5. package/dist/app/platform/edit-service-type.cjs.map +1 -1
  6. package/dist/app/platform/edit-service-type.js +3 -3
  7. package/dist/app/platform/goal-manage-card-edit.cjs.map +1 -1
  8. package/dist/app/platform/goal-manage-card-edit.js +3 -3
  9. package/dist/app/platform/on-offline-radio-card.cjs.map +1 -1
  10. package/dist/app/platform/on-offline-radio-card.js +3 -3
  11. package/dist/app/platform/reservation-card.cjs.map +1 -1
  12. package/dist/app/platform/reservation-card.js +3 -3
  13. package/dist/app/platform/session-card.cjs.map +1 -1
  14. package/dist/app/platform/session-card.js +3 -3
  15. package/dist/chunk-232ZBMFV.js +196 -0
  16. package/dist/chunk-232ZBMFV.js.map +1 -0
  17. package/dist/chunk-24572XRX.js +140 -0
  18. package/dist/chunk-24572XRX.js.map +1 -0
  19. package/dist/chunk-34XTOQID.js +140 -0
  20. package/dist/chunk-34XTOQID.js.map +1 -0
  21. package/dist/chunk-3A3VE6SX.js +160 -0
  22. package/dist/chunk-3A3VE6SX.js.map +1 -0
  23. package/dist/chunk-3LEW5RYJ.js +163 -0
  24. package/dist/chunk-3LEW5RYJ.js.map +1 -0
  25. package/dist/chunk-3MCSM3WD.js +163 -0
  26. package/dist/chunk-3MCSM3WD.js.map +1 -0
  27. package/dist/chunk-3MG2RPYN.js +163 -0
  28. package/dist/chunk-3MG2RPYN.js.map +1 -0
  29. package/dist/chunk-4SFBZJWH.js +140 -0
  30. package/dist/chunk-4SFBZJWH.js.map +1 -0
  31. package/dist/chunk-5IQ4474Z.js +89 -0
  32. package/dist/chunk-5IQ4474Z.js.map +1 -0
  33. package/dist/chunk-5RMPQM6F.js +163 -0
  34. package/dist/chunk-5RMPQM6F.js.map +1 -0
  35. package/dist/chunk-5UUCPFYY.js +140 -0
  36. package/dist/chunk-5UUCPFYY.js.map +1 -0
  37. package/dist/chunk-6LZWYVNE.js +160 -0
  38. package/dist/chunk-6LZWYVNE.js.map +1 -0
  39. package/dist/chunk-6PJ7QIPK.js +140 -0
  40. package/dist/chunk-6PJ7QIPK.js.map +1 -0
  41. package/dist/chunk-7AGAGV4E.js +69 -0
  42. package/dist/chunk-7AGAGV4E.js.map +1 -0
  43. package/dist/chunk-7AZNNMJF.js +129 -0
  44. package/dist/chunk-7AZNNMJF.js.map +1 -0
  45. package/dist/chunk-7BAQZVH3.js +152 -0
  46. package/dist/chunk-7BAQZVH3.js.map +1 -0
  47. package/dist/chunk-7RB2YZCU.js +159 -0
  48. package/dist/chunk-7RB2YZCU.js.map +1 -0
  49. package/dist/chunk-A5SSQHU7.js +135 -0
  50. package/dist/chunk-A5SSQHU7.js.map +1 -0
  51. package/dist/chunk-BAFUUZ5V.js +163 -0
  52. package/dist/chunk-BAFUUZ5V.js.map +1 -0
  53. package/dist/chunk-BT4BMBJC.js +163 -0
  54. package/dist/chunk-BT4BMBJC.js.map +1 -0
  55. package/dist/chunk-D7NY3IWA.js +152 -0
  56. package/dist/chunk-D7NY3IWA.js.map +1 -0
  57. package/dist/chunk-DL5EXP6Q.js +129 -0
  58. package/dist/chunk-DL5EXP6Q.js.map +1 -0
  59. package/dist/chunk-EEXQP6FN.js +129 -0
  60. package/dist/chunk-EEXQP6FN.js.map +1 -0
  61. package/dist/chunk-EOPCVKLK.js +69 -0
  62. package/dist/chunk-EOPCVKLK.js.map +1 -0
  63. package/dist/chunk-FJYLZOAR.js +140 -0
  64. package/dist/chunk-FJYLZOAR.js.map +1 -0
  65. package/dist/chunk-GFRV5VDJ.js +132 -0
  66. package/dist/chunk-GFRV5VDJ.js.map +1 -0
  67. package/dist/chunk-H53J2DZE.js +157 -0
  68. package/dist/chunk-H53J2DZE.js.map +1 -0
  69. package/dist/chunk-HBQ6WF3C.js +196 -0
  70. package/dist/chunk-HBQ6WF3C.js.map +1 -0
  71. package/dist/chunk-I6ITAPUG.js +158 -0
  72. package/dist/chunk-I6ITAPUG.js.map +1 -0
  73. package/dist/chunk-IPEPHM2U.js +89 -0
  74. package/dist/chunk-IPEPHM2U.js.map +1 -0
  75. package/dist/chunk-J65X5ID3.js +136 -0
  76. package/dist/chunk-J65X5ID3.js.map +1 -0
  77. package/dist/chunk-K6PJ5GES.js +129 -0
  78. package/dist/chunk-K6PJ5GES.js.map +1 -0
  79. package/dist/chunk-LFISV2GU.js +160 -0
  80. package/dist/chunk-LFISV2GU.js.map +1 -0
  81. package/dist/chunk-LRTZTSV6.js +135 -0
  82. package/dist/chunk-LRTZTSV6.js.map +1 -0
  83. package/dist/chunk-MOITMVXZ.js +159 -0
  84. package/dist/chunk-MOITMVXZ.js.map +1 -0
  85. package/dist/chunk-MYGRIOQM.js +163 -0
  86. package/dist/chunk-MYGRIOQM.js.map +1 -0
  87. package/dist/chunk-NBVTF6TV.js +163 -0
  88. package/dist/chunk-NBVTF6TV.js.map +1 -0
  89. package/dist/chunk-NMOMXXLD.js +163 -0
  90. package/dist/chunk-NMOMXXLD.js.map +1 -0
  91. package/dist/chunk-OHSKOJ2Y.js +136 -0
  92. package/dist/chunk-OHSKOJ2Y.js.map +1 -0
  93. package/dist/chunk-QF22MRN6.js +152 -0
  94. package/dist/chunk-QF22MRN6.js.map +1 -0
  95. package/dist/chunk-QHAU3JHA.js +152 -0
  96. package/dist/chunk-QHAU3JHA.js.map +1 -0
  97. package/dist/chunk-QQTXIKFT.js +163 -0
  98. package/dist/chunk-QQTXIKFT.js.map +1 -0
  99. package/dist/chunk-RQFJZYKH.js +160 -0
  100. package/dist/chunk-RQFJZYKH.js.map +1 -0
  101. package/dist/chunk-SRU4OFM3.js +135 -0
  102. package/dist/chunk-SRU4OFM3.js.map +1 -0
  103. package/dist/chunk-T5EBUYAB.js +160 -0
  104. package/dist/chunk-T5EBUYAB.js.map +1 -0
  105. package/dist/chunk-THTRJNHI.js +159 -0
  106. package/dist/chunk-THTRJNHI.js.map +1 -0
  107. package/dist/chunk-WQRH5YGD.js +129 -0
  108. package/dist/chunk-WQRH5YGD.js.map +1 -0
  109. package/dist/chunk-X2MARIQ5.js +140 -0
  110. package/dist/chunk-X2MARIQ5.js.map +1 -0
  111. package/dist/chunk-XTU7VQ2V.js +158 -0
  112. package/dist/chunk-XTU7VQ2V.js.map +1 -0
  113. package/dist/chunk-YBO2LITL.js +163 -0
  114. package/dist/chunk-YBO2LITL.js.map +1 -0
  115. package/dist/chunk-YOADPBEF.js +129 -0
  116. package/dist/chunk-YOADPBEF.js.map +1 -0
  117. package/dist/chunk-YRCJG2BQ.js +163 -0
  118. package/dist/chunk-YRCJG2BQ.js.map +1 -0
  119. package/dist/chunk-YXGSOU62.js +129 -0
  120. package/dist/chunk-YXGSOU62.js.map +1 -0
  121. package/dist/chunk-ZKLZRBDG.js +163 -0
  122. package/dist/chunk-ZKLZRBDG.js.map +1 -0
  123. package/dist/index.cjs +36 -11
  124. package/dist/index.cjs.map +1 -1
  125. package/dist/index.js +7 -7
  126. package/dist/molecules/index.cjs +36 -11
  127. package/dist/molecules/index.cjs.map +1 -1
  128. package/dist/molecules/index.js +7 -7
  129. package/dist/molecules/training-info-guideline.cjs +85 -24
  130. package/dist/molecules/training-info-guideline.cjs.map +1 -1
  131. package/dist/molecules/training-info-guideline.js +4 -1
  132. package/package.json +3 -3
  133. package/src/molecules/training-info-guideline.tsx +51 -10
@@ -0,0 +1,163 @@
1
+ import {
2
+ Separator
3
+ } from "./chunk-HYITAA4J.js";
4
+ import {
5
+ Spinner
6
+ } from "./chunk-FR2GDOU2.js";
7
+ import {
8
+ Dialog
9
+ } from "./chunk-AH4A53SZ.js";
10
+ import {
11
+ Box
12
+ } from "./chunk-4Y5BEXVN.js";
13
+ import {
14
+ Typo
15
+ } from "./chunk-PMJIFLDT.js";
16
+ import {
17
+ Flex
18
+ } from "./chunk-25HMMI7R.js";
19
+ import {
20
+ Button
21
+ } from "./chunk-ZVDAEY5Q.js";
22
+ import {
23
+ AspectRatio
24
+ } from "./chunk-EAXUQEO5.js";
25
+
26
+ // src/molecules/training-info-guideline.tsx
27
+ import { useState } from "react";
28
+ import { FileTextIcon, VideoIcon } from "@radix-ui/react-icons";
29
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
30
+ function TrainingInfoGuideline({
31
+ values,
32
+ onClickFileDownload
33
+ }) {
34
+ return /* @__PURE__ */ jsx(Fragment, { children: values.map((value) => /* @__PURE__ */ jsx(
35
+ TrainingInfoGuidelineItem,
36
+ {
37
+ onClickFileDownload,
38
+ value
39
+ },
40
+ getItemKey(value)
41
+ )) });
42
+ }
43
+ function getItemKey(value) {
44
+ return value.url;
45
+ }
46
+ function TrainingInfoGuidelineItem({
47
+ value,
48
+ onClickFileDownload
49
+ }) {
50
+ const [isLoading, setIsLoading] = useState(true);
51
+ if (value.type === "file") {
52
+ return /* @__PURE__ */ jsx(
53
+ TrainingInfoGuidelineButton,
54
+ {
55
+ description: value.filename,
56
+ icon: /* @__PURE__ */ jsx(FileTextIcon, {}),
57
+ onClick: () => {
58
+ onClickFileDownload({ url: value.url, filename: value.filename });
59
+ },
60
+ title: value.downloadButtonName
61
+ }
62
+ );
63
+ }
64
+ if (value.type === "video") {
65
+ return /* @__PURE__ */ jsxs(Dialog.Root, { children: [
66
+ /* @__PURE__ */ jsx(Dialog.Trigger, { children: /* @__PURE__ */ jsx(
67
+ TrainingInfoGuidelineButton,
68
+ {
69
+ description: "\uC601\uC0C1",
70
+ icon: /* @__PURE__ */ jsx(VideoIcon, {}),
71
+ title: value.videoTitle
72
+ }
73
+ ) }),
74
+ /* @__PURE__ */ jsx(
75
+ Dialog.Content,
76
+ {
77
+ height: "100%",
78
+ maxHeight: "500px",
79
+ maxWidth: "800px",
80
+ title: value.videoTitle,
81
+ width: "100%",
82
+ children: /* @__PURE__ */ jsx(AspectRatio, { ratio: 16 / 9, style: { width: "100%" }, children: /* @__PURE__ */ jsxs(
83
+ Flex,
84
+ {
85
+ align: "center",
86
+ justify: "center",
87
+ style: {
88
+ width: "100%",
89
+ height: "100%",
90
+ backgroundColor: "black",
91
+ position: "relative"
92
+ },
93
+ children: [
94
+ isLoading ? /* @__PURE__ */ jsx(
95
+ Flex,
96
+ {
97
+ align: "center",
98
+ height: "100%",
99
+ justify: "center",
100
+ position: "absolute",
101
+ style: {
102
+ position: "absolute",
103
+ top: 0,
104
+ left: 0,
105
+ zIndex: 1,
106
+ color: "white"
107
+ },
108
+ width: "100%",
109
+ children: /* @__PURE__ */ jsx(Spinner, { size: "3", style: { width: 48, height: 48 } })
110
+ }
111
+ ) : null,
112
+ /* @__PURE__ */ jsx(
113
+ "iframe",
114
+ {
115
+ allowFullScreen: true,
116
+ onError: () => {
117
+ setIsLoading(false);
118
+ },
119
+ onLoad: () => {
120
+ setIsLoading(false);
121
+ },
122
+ src: `${value.url}?theme=light`,
123
+ style: { width: "100%", height: "100%", border: "none" },
124
+ title: "Curriculum Video"
125
+ }
126
+ )
127
+ ]
128
+ }
129
+ ) })
130
+ }
131
+ )
132
+ ] });
133
+ }
134
+ return null;
135
+ }
136
+ function TrainingInfoGuidelineButton({
137
+ icon,
138
+ title,
139
+ description,
140
+ onClick
141
+ }) {
142
+ return /* @__PURE__ */ jsx(
143
+ Button,
144
+ {
145
+ onClick,
146
+ style: { width: "100%", height: "48px" },
147
+ variant: "outline",
148
+ children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "2", width: "100%", children: [
149
+ icon,
150
+ /* @__PURE__ */ jsx(Separator, { orientation: "vertical", size: "2" }),
151
+ /* @__PURE__ */ jsxs(Box, { children: [
152
+ /* @__PURE__ */ jsx(Typo, { as: "div", mb: "1", children: title }),
153
+ typeof description === "string" && description !== "" ? /* @__PURE__ */ jsx(Typo, { variant: "caption", children: description }) : null
154
+ ] })
155
+ ] })
156
+ }
157
+ );
158
+ }
159
+
160
+ export {
161
+ TrainingInfoGuideline
162
+ };
163
+ //# sourceMappingURL=chunk-3MG2RPYN.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/molecules/training-info-guideline.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { FileTextIcon, VideoIcon } from '@radix-ui/react-icons';\nimport { AspectRatio } from '@/atoms/aspect-ratio';\nimport { Button } from '@/atoms/button';\nimport type { TrainingInfoGuidelineContents } from '@/types/training-info-guideline-schema-generated';\nimport { Dialog } from '@/atoms/dialog';\nimport { Spinner } from '@/atoms/spinner';\nimport { Box } from '@/atoms/box';\nimport { Separator } from '@/atoms/separator';\nimport { Typo } from '@/atoms/typo';\nimport { Flex } from '../atoms/flex';\n\nexport interface TrainingInfoGuidelineProps {\n values: TrainingInfoGuidelineContents['values'];\n onClickFileDownload: (args: { url: string; filename: string }) => void;\n}\n\nexport function TrainingInfoGuideline({\n values,\n onClickFileDownload,\n}: TrainingInfoGuidelineProps): React.ReactElement {\n return (\n <>\n {values.map((value) => (\n <TrainingInfoGuidelineItem\n key={getItemKey(value)}\n onClickFileDownload={onClickFileDownload}\n value={value}\n />\n ))}\n </>\n );\n}\n\ntype TrainingInfoGuidelineValue =\n TrainingInfoGuidelineContents['values'][number];\n\nfunction getItemKey(value: TrainingInfoGuidelineValue): string {\n return value.url;\n}\n\ninterface TrainingInfoGuidelineItemProps {\n value: TrainingInfoGuidelineValue;\n onClickFileDownload: TrainingInfoGuidelineProps['onClickFileDownload'];\n}\n\nfunction TrainingInfoGuidelineItem({\n value,\n onClickFileDownload,\n}: TrainingInfoGuidelineItemProps): React.ReactElement | null {\n const [isLoading, setIsLoading] = useState(true);\n\n if (value.type === 'file') {\n return (\n <TrainingInfoGuidelineButton\n description={value.filename}\n icon={<FileTextIcon />}\n onClick={() => {\n onClickFileDownload({ url: value.url, filename: value.filename });\n }}\n title={value.downloadButtonName}\n />\n );\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- 차후 다른 타입 추가 시 사용\n if (value.type === 'video') {\n return (\n <Dialog.Root>\n <Dialog.Trigger>\n <TrainingInfoGuidelineButton\n description=\"영상\"\n icon={<VideoIcon />}\n title={value.videoTitle}\n />\n </Dialog.Trigger>\n <Dialog.Content\n height=\"100%\"\n maxHeight=\"500px\"\n maxWidth=\"800px\"\n title={value.videoTitle}\n width=\"100%\"\n >\n <AspectRatio ratio={16 / 9} style={{ width: '100%' }}>\n <Flex\n align=\"center\"\n justify=\"center\"\n style={{\n width: '100%',\n height: '100%',\n backgroundColor: 'black',\n position: 'relative',\n }}\n >\n {isLoading ? (\n <Flex\n align=\"center\"\n height=\"100%\"\n justify=\"center\"\n position=\"absolute\"\n style={{\n position: 'absolute',\n top: 0,\n left: 0,\n zIndex: 1,\n color: 'white',\n }}\n width=\"100%\"\n >\n <Spinner size=\"3\" style={{ width: 48, height: 48 }} />\n </Flex>\n ) : null}\n\n <iframe\n allowFullScreen\n onError={() => {\n setIsLoading(false);\n }} // 필요시 에러 메시지로 대체\n onLoad={() => {\n setIsLoading(false);\n }}\n src={`${value.url}?theme=light`}\n style={{ width: '100%', height: '100%', border: 'none' }}\n title=\"Curriculum Video\"\n />\n </Flex>\n </AspectRatio>\n </Dialog.Content>\n </Dialog.Root>\n );\n }\n return null;\n}\n\ninterface TrainingInfoGuidelineButtonProps {\n icon: React.ReactNode;\n title: string;\n description?: string;\n onClick?: () => void;\n}\n\nfunction TrainingInfoGuidelineButton({\n icon,\n title,\n description,\n onClick,\n}: TrainingInfoGuidelineButtonProps): React.ReactElement {\n return (\n <Button\n onClick={onClick}\n style={{ width: '100%', height: '48px' }}\n variant=\"outline\"\n >\n <Flex align=\"center\" gap=\"2\" width=\"100%\">\n {icon}\n <Separator orientation=\"vertical\" size=\"2\" />\n <Box>\n <Typo as=\"div\" mb=\"1\">\n {title}\n </Typo>\n {typeof description === 'string' && description !== '' ? (\n <Typo variant=\"caption\" >\n {description}\n </Typo>\n ) : null}\n </Box>\n </Flex>\n </Button>\n );\n}\n"],"mappings":"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","names":[]}
@@ -0,0 +1,140 @@
1
+ import {
2
+ Separator
3
+ } from "./chunk-HYITAA4J.js";
4
+ import {
5
+ Spinner
6
+ } from "./chunk-FR2GDOU2.js";
7
+ import {
8
+ Dialog
9
+ } from "./chunk-AH4A53SZ.js";
10
+ import {
11
+ Typo
12
+ } from "./chunk-PMJIFLDT.js";
13
+ import {
14
+ Flex
15
+ } from "./chunk-25HMMI7R.js";
16
+ import {
17
+ Button
18
+ } from "./chunk-ZVDAEY5Q.js";
19
+ import {
20
+ AspectRatio
21
+ } from "./chunk-EAXUQEO5.js";
22
+
23
+ // src/molecules/training-info-guideline.tsx
24
+ import { useState } from "react";
25
+ import { FileTextIcon, VideoIcon } from "@radix-ui/react-icons";
26
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
27
+ function TrainingInfoGuideline({
28
+ values,
29
+ onClickFileDownload
30
+ }) {
31
+ return /* @__PURE__ */ jsx(Fragment, { children: values.map((value) => /* @__PURE__ */ jsx(
32
+ TrainingInfoGuidelineItem,
33
+ {
34
+ onClickFileDownload,
35
+ value
36
+ },
37
+ getItemKey(value)
38
+ )) });
39
+ }
40
+ function getItemKey(value) {
41
+ return value.url;
42
+ }
43
+ function TrainingInfoGuidelineItem({
44
+ value,
45
+ onClickFileDownload
46
+ }) {
47
+ const [isLoading, setIsLoading] = useState(true);
48
+ if (value.type === "file") {
49
+ return /* @__PURE__ */ jsx(
50
+ Button,
51
+ {
52
+ onClick: () => {
53
+ onClickFileDownload({ url: value.url, filename: value.filename });
54
+ },
55
+ style: { height: "48px" },
56
+ variant: "outline",
57
+ children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "2", width: "100%", children: [
58
+ /* @__PURE__ */ jsx(FileTextIcon, {}),
59
+ /* @__PURE__ */ jsx(Separator, { orientation: "vertical", size: "2" }),
60
+ /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "1", children: [
61
+ /* @__PURE__ */ jsx(Typo, { children: value.downloadButtonName }),
62
+ /* @__PURE__ */ jsx(Typo, { variant: "caption", children: value.filename })
63
+ ] })
64
+ ] })
65
+ }
66
+ );
67
+ }
68
+ if (value.type === "video") {
69
+ return /* @__PURE__ */ jsxs(Dialog.Root, { children: [
70
+ /* @__PURE__ */ jsx(Dialog.Trigger, { children: /* @__PURE__ */ jsxs(Button, { variant: "surface", children: [
71
+ /* @__PURE__ */ jsx(VideoIcon, {}),
72
+ value.videoTitle
73
+ ] }) }),
74
+ /* @__PURE__ */ jsx(
75
+ Dialog.Content,
76
+ {
77
+ height: "100%",
78
+ maxHeight: "500px",
79
+ maxWidth: "800px",
80
+ title: value.videoTitle,
81
+ width: "100%",
82
+ children: /* @__PURE__ */ jsx(AspectRatio, { ratio: 16 / 9, style: { width: "100%" }, children: /* @__PURE__ */ jsxs(
83
+ Flex,
84
+ {
85
+ align: "center",
86
+ justify: "center",
87
+ style: {
88
+ width: "100%",
89
+ height: "100%",
90
+ backgroundColor: "black",
91
+ position: "relative"
92
+ },
93
+ children: [
94
+ isLoading ? /* @__PURE__ */ jsx(
95
+ Flex,
96
+ {
97
+ align: "center",
98
+ height: "100%",
99
+ justify: "center",
100
+ position: "absolute",
101
+ style: {
102
+ position: "absolute",
103
+ top: 0,
104
+ left: 0,
105
+ zIndex: 1,
106
+ color: "white"
107
+ },
108
+ width: "100%",
109
+ children: /* @__PURE__ */ jsx(Spinner, { size: "3", style: { width: 48, height: 48 } })
110
+ }
111
+ ) : null,
112
+ /* @__PURE__ */ jsx(
113
+ "iframe",
114
+ {
115
+ allowFullScreen: true,
116
+ onError: () => {
117
+ setIsLoading(false);
118
+ },
119
+ onLoad: () => {
120
+ setIsLoading(false);
121
+ },
122
+ src: `${value.url}?theme=light`,
123
+ style: { width: "100%", height: "100%", border: "none" },
124
+ title: "Curriculum Video"
125
+ }
126
+ )
127
+ ]
128
+ }
129
+ ) })
130
+ }
131
+ )
132
+ ] });
133
+ }
134
+ return null;
135
+ }
136
+
137
+ export {
138
+ TrainingInfoGuideline
139
+ };
140
+ //# sourceMappingURL=chunk-4SFBZJWH.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/molecules/training-info-guideline.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { FileTextIcon, VideoIcon } from '@radix-ui/react-icons';\nimport { AspectRatio } from '@/atoms/aspect-ratio';\nimport { Button } from '@/atoms/button';\nimport type { TrainingInfoGuidelineContents } from '@/types/training-info-guideline-schema-generated';\nimport { Dialog } from '@/atoms/dialog';\nimport { Spinner } from '@/atoms/spinner';\nimport { Flex } from '../atoms/flex';\nimport { Separator, Typo } from '@/atoms';\n\nexport interface TrainingInfoGuidelineProps {\n values: TrainingInfoGuidelineContents['values'];\n onClickFileDownload: (args: { url: string; filename: string }) => void;\n}\n\nexport function TrainingInfoGuideline({\n values,\n onClickFileDownload,\n}: TrainingInfoGuidelineProps): React.ReactElement {\n return (\n <>\n {values.map((value) => (\n <TrainingInfoGuidelineItem\n key={getItemKey(value)}\n onClickFileDownload={onClickFileDownload}\n value={value}\n />\n ))}\n </>\n );\n}\n\ntype TrainingInfoGuidelineValue =\n TrainingInfoGuidelineContents['values'][number];\n\nfunction getItemKey(value: TrainingInfoGuidelineValue): string {\n return value.url;\n}\n\ninterface TrainingInfoGuidelineItemProps {\n value: TrainingInfoGuidelineValue;\n onClickFileDownload: TrainingInfoGuidelineProps['onClickFileDownload'];\n}\n\nfunction TrainingInfoGuidelineItem({\n value,\n onClickFileDownload,\n}: TrainingInfoGuidelineItemProps): React.ReactElement | null {\n const [isLoading, setIsLoading] = useState(true);\n\n if (value.type === 'file') {\n return (\n <Button\n onClick={() => {\n onClickFileDownload({ url: value.url, filename: value.filename });\n }}\n style={{ height: '48px' }}\n variant=\"outline\"\n >\n <Flex align=\"center\" gap=\"2\" width=\"100%\">\n <FileTextIcon />\n <Separator orientation=\"vertical\" size=\"2\" />\n <Flex direction=\"column\" gap=\"1\">\n <Typo>{value.downloadButtonName}</Typo>\n <Typo variant=\"caption\">{value.filename}</Typo>\n </Flex>\n </Flex>\n </Button>\n );\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- 차후 다른 타입 추가 시 사용\n if (value.type === 'video') {\n return (\n <Dialog.Root>\n <Dialog.Trigger>\n <Button variant=\"surface\">\n <VideoIcon />\n {value.videoTitle}\n </Button>\n </Dialog.Trigger>\n <Dialog.Content\n height=\"100%\"\n maxHeight=\"500px\"\n maxWidth=\"800px\"\n title={value.videoTitle}\n width=\"100%\"\n >\n <AspectRatio ratio={16 / 9} style={{ width: '100%' }}>\n <Flex\n align=\"center\"\n justify=\"center\"\n style={{\n width: '100%',\n height: '100%',\n backgroundColor: 'black',\n position: 'relative',\n }}\n >\n {isLoading ? (\n <Flex\n align=\"center\"\n height=\"100%\"\n justify=\"center\"\n position=\"absolute\"\n style={{\n position: 'absolute',\n top: 0,\n left: 0,\n zIndex: 1,\n color: 'white',\n }}\n width=\"100%\"\n >\n <Spinner size=\"3\" style={{ width: 48, height: 48 }} />\n </Flex>\n ) : null}\n\n <iframe\n allowFullScreen\n onError={() => {\n setIsLoading(false);\n }} // 필요시 에러 메시지로 대체\n onLoad={() => {\n setIsLoading(false);\n }}\n src={`${value.url}?theme=light`}\n style={{ width: '100%', height: '100%', border: 'none' }}\n title=\"Curriculum Video\"\n />\n </Flex>\n </AspectRatio>\n </Dialog.Content>\n </Dialog.Root>\n );\n }\n return null;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,gBAAgB;AAChC,SAAS,cAAc,iBAAiB;AAmBpC,mBAEI,KAwCE,YA1CN;AALG,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AACF,GAAmD;AACjD,SACE,gCACG,iBAAO,IAAI,CAAC,UACX;AAAA,IAAC;AAAA;AAAA,MAEC;AAAA,MACA;AAAA;AAAA,IAFK,WAAW,KAAK;AAAA,EAGvB,CACD,GACH;AAEJ;AAKA,SAAS,WAAW,OAA2C;AAC7D,SAAO,MAAM;AACf;AAOA,SAAS,0BAA0B;AAAA,EACjC;AAAA,EACA;AACF,GAA8D;AAC5D,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,IAAI;AAE/C,MAAI,MAAM,SAAS,QAAQ;AACzB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,SAAS,MAAM;AACb,8BAAoB,EAAE,KAAK,MAAM,KAAK,UAAU,MAAM,SAAS,CAAC;AAAA,QAClE;AAAA,QACA,OAAO,EAAE,QAAQ,OAAO;AAAA,QACxB,SAAQ;AAAA,QAER,+BAAC,QAAK,OAAM,UAAS,KAAI,KAAI,OAAM,QACjC;AAAA,8BAAC,gBAAa;AAAA,UACd,oBAAC,aAAU,aAAY,YAAW,MAAK,KAAI;AAAA,UAC3C,qBAAC,QAAK,WAAU,UAAS,KAAI,KAC3B;AAAA,gCAAC,QAAM,gBAAM,oBAAmB;AAAA,YAChC,oBAAC,QAAK,SAAQ,WAAW,gBAAM,UAAS;AAAA,aAC1C;AAAA,WACF;AAAA;AAAA,IACF;AAAA,EAEJ;AAGA,MAAI,MAAM,SAAS,SAAS;AAC1B,WACE,qBAAC,OAAO,MAAP,EACC;AAAA,0BAAC,OAAO,SAAP,EACC,+BAAC,UAAO,SAAQ,WACd;AAAA,4BAAC,aAAU;AAAA,QACV,MAAM;AAAA,SACT,GACF;AAAA,MACA;AAAA,QAAC,OAAO;AAAA,QAAP;AAAA,UACC,QAAO;AAAA,UACP,WAAU;AAAA,UACV,UAAS;AAAA,UACT,OAAO,MAAM;AAAA,UACb,OAAM;AAAA,UAEN,8BAAC,eAAY,OAAO,KAAK,GAAG,OAAO,EAAE,OAAO,OAAO,GACjD;AAAA,YAAC;AAAA;AAAA,cACC,OAAM;AAAA,cACN,SAAQ;AAAA,cACR,OAAO;AAAA,gBACL,OAAO;AAAA,gBACP,QAAQ;AAAA,gBACR,iBAAiB;AAAA,gBACjB,UAAU;AAAA,cACZ;AAAA,cAEC;AAAA,4BACC;AAAA,kBAAC;AAAA;AAAA,oBACC,OAAM;AAAA,oBACN,QAAO;AAAA,oBACP,SAAQ;AAAA,oBACR,UAAS;AAAA,oBACT,OAAO;AAAA,sBACL,UAAU;AAAA,sBACV,KAAK;AAAA,sBACL,MAAM;AAAA,sBACN,QAAQ;AAAA,sBACR,OAAO;AAAA,oBACT;AAAA,oBACA,OAAM;AAAA,oBAEN,8BAAC,WAAQ,MAAK,KAAI,OAAO,EAAE,OAAO,IAAI,QAAQ,GAAG,GAAG;AAAA;AAAA,gBACtD,IACE;AAAA,gBAEJ;AAAA,kBAAC;AAAA;AAAA,oBACC,iBAAe;AAAA,oBACf,SAAS,MAAM;AACb,mCAAa,KAAK;AAAA,oBACpB;AAAA,oBACA,QAAQ,MAAM;AACZ,mCAAa,KAAK;AAAA,oBACpB;AAAA,oBACA,KAAK,GAAG,MAAM,GAAG;AAAA,oBACjB,OAAO,EAAE,OAAO,QAAQ,QAAQ,QAAQ,QAAQ,OAAO;AAAA,oBACvD,OAAM;AAAA;AAAA,gBACR;AAAA;AAAA;AAAA,UACF,GACF;AAAA;AAAA,MACF;AAAA,OACF;AAAA,EAEJ;AACA,SAAO;AACT;","names":[]}
@@ -0,0 +1,89 @@
1
+ import {
2
+ ReviewQuestion_default
3
+ } from "./chunk-X7QZ46BZ.js";
4
+ import {
5
+ complete_review_default
6
+ } from "./chunk-PYGTM7ML.js";
7
+ import {
8
+ start_review_default
9
+ } from "./chunk-YE3UDMTZ.js";
10
+ import {
11
+ CurriculumReviewProvider,
12
+ useCurriculumReviewContext
13
+ } from "./chunk-GMKRNFH5.js";
14
+
15
+ // src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/index.tsx
16
+ import { jsx } from "react/jsx-runtime";
17
+ function CurriculumReviewStepsInner() {
18
+ const {
19
+ formik,
20
+ step,
21
+ handleStart,
22
+ handleNext,
23
+ handlePrev,
24
+ onClickReviewMyAnswer,
25
+ handleSubmit,
26
+ currentQuestion,
27
+ currentAnswer,
28
+ currentError,
29
+ reviewContents,
30
+ handleAnswerChange
31
+ } = useCurriculumReviewContext();
32
+ const { questions } = reviewContents;
33
+ if (step === 0) {
34
+ return /* @__PURE__ */ jsx(start_review_default, { onStart: handleStart });
35
+ }
36
+ if (step > 0 && step <= questions.length && currentQuestion) {
37
+ return /* @__PURE__ */ jsx(
38
+ ReviewQuestion_default,
39
+ {
40
+ answer: currentAnswer,
41
+ error: currentError,
42
+ index: step - 1,
43
+ isLast: step === questions.length,
44
+ isLoading: formik.isSubmitting,
45
+ isNextDisabled: currentError !== void 0,
46
+ onChange: handleAnswerChange,
47
+ onNext: handleNext,
48
+ onPrev: handlePrev,
49
+ onSubmit: handleSubmit,
50
+ question: currentQuestion,
51
+ total: questions.length
52
+ }
53
+ );
54
+ }
55
+ return /* @__PURE__ */ jsx(complete_review_default, { onClickReviewMyAnswer });
56
+ }
57
+ function CurriculumReviewSteps({
58
+ contents,
59
+ title,
60
+ onClickEndReview,
61
+ onSubmit,
62
+ defaultValues,
63
+ curriculum,
64
+ onReviewValueChange,
65
+ mode,
66
+ done
67
+ }) {
68
+ return /* @__PURE__ */ jsx(
69
+ CurriculumReviewProvider,
70
+ {
71
+ curriculum,
72
+ defaultValues,
73
+ done,
74
+ mode,
75
+ onClickEndReview,
76
+ onReviewValueChange,
77
+ onSubmit,
78
+ reviewContents: contents,
79
+ sectionTitle: title,
80
+ children: /* @__PURE__ */ jsx(CurriculumReviewStepsInner, {})
81
+ }
82
+ );
83
+ }
84
+ var CurriculumReviewSteps_default = CurriculumReviewSteps;
85
+
86
+ export {
87
+ CurriculumReviewSteps_default
88
+ };
89
+ //# sourceMappingURL=chunk-5IQ4474Z.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/index.tsx"],"sourcesContent":["import React from 'react';\nimport { type CurriculumReviewContents } from '@/types/curriculumContents.type';\nimport type { Curriculum } from '@/types'; \nimport {\n CurriculumReviewProvider,\n useCurriculumReviewContext,\n} from './curriculum-review-context';\nimport StartReview from './start-review';\nimport CompleteReview from './complete-review';\nimport ReviewQuestion from './ReviewQuestion';\n \nfunction CurriculumReviewStepsInner(): React.ReactNode {\n const {\n formik,\n step,\n handleStart,\n handleNext,\n handlePrev,\n onClickReviewMyAnswer,\n handleSubmit,\n currentQuestion,\n currentAnswer,\n currentError,\n reviewContents,\n handleAnswerChange,\n } = useCurriculumReviewContext();\n const { questions } = reviewContents;\n\n if (step === 0) {\n return <StartReview onStart={handleStart} />;\n }\n if (step > 0 && step <= questions.length && currentQuestion) {\n return (\n <ReviewQuestion\n answer={currentAnswer}\n error={currentError}\n index={step - 1}\n isLast={step === questions.length}\n isLoading={formik.isSubmitting}\n isNextDisabled={currentError !== undefined}\n onChange={handleAnswerChange}\n onNext={handleNext}\n onPrev={handlePrev}\n onSubmit={handleSubmit}\n question={currentQuestion}\n total={questions.length}\n />\n );\n }\n return <CompleteReview onClickReviewMyAnswer={onClickReviewMyAnswer} />;\n}\n\ninterface CurriculumReviewStepsProps {\n contents: CurriculumReviewContents;\n title: string | undefined;\n onClickEndReview: () => void;\n onSubmit: (values: Record<string, string>) => Promise<boolean>;\n defaultValues?: Record<string, string>;\n curriculum: Curriculum;\n onReviewValueChange: ({\n reviewId,\n answer,\n }: {\n reviewId: string;\n answer: Record<string, string>;\n }) => void;\n mode: 'edit' | 'create';\n done: boolean; \n}\n\nfunction CurriculumReviewSteps({\n contents,\n title,\n onClickEndReview,\n onSubmit,\n defaultValues,\n curriculum,\n onReviewValueChange,\n mode,\n done,\n}: CurriculumReviewStepsProps): React.ReactNode { \n\n return (\n <CurriculumReviewProvider\n curriculum={curriculum}\n defaultValues={defaultValues}\n done={done}\n mode={mode}\n onClickEndReview={onClickEndReview}\n onReviewValueChange={onReviewValueChange}\n onSubmit={onSubmit}\n reviewContents={contents}\n sectionTitle={title}\n >\n <CurriculumReviewStepsInner />\n </CurriculumReviewProvider>\n );\n}\n\nexport default CurriculumReviewSteps;\n"],"mappings":";;;;;;;;;;;;;;;AA6BW;AAlBX,SAAS,6BAA8C;AACrD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,2BAA2B;AAC/B,QAAM,EAAE,UAAU,IAAI;AAEtB,MAAI,SAAS,GAAG;AACd,WAAO,oBAAC,wBAAY,SAAS,aAAa;AAAA,EAC5C;AACA,MAAI,OAAO,KAAK,QAAQ,UAAU,UAAU,iBAAiB;AAC3D,WACE;AAAA,MAAC;AAAA;AAAA,QACC,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,OAAO,OAAO;AAAA,QACd,QAAQ,SAAS,UAAU;AAAA,QAC3B,WAAW,OAAO;AAAA,QAClB,gBAAgB,iBAAiB;AAAA,QACjC,UAAU;AAAA,QACV,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,UAAU;AAAA,QACV,OAAO,UAAU;AAAA;AAAA,IACnB;AAAA,EAEJ;AACA,SAAO,oBAAC,2BAAe,uBAA8C;AACvE;AAoBA,SAAS,sBAAsB;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAgD;AAE9C,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,gBAAgB;AAAA,MAChB,cAAc;AAAA,MAEd,8BAAC,8BAA2B;AAAA;AAAA,EAC9B;AAEJ;AAEA,IAAO,gCAAQ;","names":[]}
@@ -0,0 +1,163 @@
1
+ import {
2
+ Spinner
3
+ } from "./chunk-FR2GDOU2.js";
4
+ import {
5
+ Separator
6
+ } from "./chunk-HYITAA4J.js";
7
+ import {
8
+ Dialog
9
+ } from "./chunk-JQ7VQ5SB.js";
10
+ import {
11
+ Flex
12
+ } from "./chunk-25HMMI7R.js";
13
+ import {
14
+ Button
15
+ } from "./chunk-ZVDAEY5Q.js";
16
+ import {
17
+ AspectRatio
18
+ } from "./chunk-EAXUQEO5.js";
19
+ import {
20
+ Box
21
+ } from "./chunk-4Y5BEXVN.js";
22
+ import {
23
+ Typo
24
+ } from "./chunk-PMJIFLDT.js";
25
+
26
+ // src/molecules/training-info-guideline.tsx
27
+ import { useState } from "react";
28
+ import { FileTextIcon, VideoIcon } from "@radix-ui/react-icons";
29
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
30
+ function TrainingInfoGuideline({
31
+ values,
32
+ onClickFileDownload
33
+ }) {
34
+ return /* @__PURE__ */ jsx(Fragment, { children: values.map((value) => /* @__PURE__ */ jsx(
35
+ TrainingInfoGuidelineItem,
36
+ {
37
+ onClickFileDownload,
38
+ value
39
+ },
40
+ getItemKey(value)
41
+ )) });
42
+ }
43
+ function getItemKey(value) {
44
+ return value.url;
45
+ }
46
+ function TrainingInfoGuidelineItem({
47
+ value,
48
+ onClickFileDownload
49
+ }) {
50
+ const [isLoading, setIsLoading] = useState(true);
51
+ if (value.type === "file") {
52
+ return /* @__PURE__ */ jsx(
53
+ TrainingInfoGuidelineButton,
54
+ {
55
+ description: value.filename,
56
+ icon: /* @__PURE__ */ jsx(FileTextIcon, {}),
57
+ onClick: () => {
58
+ onClickFileDownload({ url: value.url, filename: value.filename });
59
+ },
60
+ title: value.downloadButtonName
61
+ }
62
+ );
63
+ }
64
+ if (value.type === "video") {
65
+ return /* @__PURE__ */ jsxs(Dialog.Root, { children: [
66
+ /* @__PURE__ */ jsx(Dialog.Trigger, { children: /* @__PURE__ */ jsx(
67
+ TrainingInfoGuidelineButton,
68
+ {
69
+ description: "\uC601\uC0C1",
70
+ icon: /* @__PURE__ */ jsx(VideoIcon, {}),
71
+ title: value.videoTitle
72
+ }
73
+ ) }),
74
+ /* @__PURE__ */ jsx(
75
+ Dialog.Content,
76
+ {
77
+ height: "100%",
78
+ maxHeight: "500px",
79
+ maxWidth: "800px",
80
+ title: value.videoTitle,
81
+ width: "100%",
82
+ children: /* @__PURE__ */ jsx(AspectRatio, { ratio: 16 / 9, style: { width: "100%" }, children: /* @__PURE__ */ jsxs(
83
+ Flex,
84
+ {
85
+ align: "center",
86
+ justify: "center",
87
+ style: {
88
+ width: "100%",
89
+ height: "100%",
90
+ backgroundColor: "black",
91
+ position: "relative"
92
+ },
93
+ children: [
94
+ isLoading ? /* @__PURE__ */ jsx(
95
+ Flex,
96
+ {
97
+ align: "center",
98
+ height: "100%",
99
+ justify: "center",
100
+ position: "absolute",
101
+ style: {
102
+ position: "absolute",
103
+ top: 0,
104
+ left: 0,
105
+ zIndex: 1,
106
+ color: "white"
107
+ },
108
+ width: "100%",
109
+ children: /* @__PURE__ */ jsx(Spinner, { size: "3", style: { width: 48, height: 48 } })
110
+ }
111
+ ) : null,
112
+ /* @__PURE__ */ jsx(
113
+ "iframe",
114
+ {
115
+ allowFullScreen: true,
116
+ onError: () => {
117
+ setIsLoading(false);
118
+ },
119
+ onLoad: () => {
120
+ setIsLoading(false);
121
+ },
122
+ src: `${value.url}?theme=light`,
123
+ style: { width: "100%", height: "100%", border: "none" },
124
+ title: "Curriculum Video"
125
+ }
126
+ )
127
+ ]
128
+ }
129
+ ) })
130
+ }
131
+ )
132
+ ] });
133
+ }
134
+ return null;
135
+ }
136
+ function TrainingInfoGuidelineButton({
137
+ icon,
138
+ title,
139
+ description,
140
+ onClick
141
+ }) {
142
+ return /* @__PURE__ */ jsx(
143
+ Button,
144
+ {
145
+ onClick,
146
+ style: { width: "100%", height: "48px", textAlign: "left" },
147
+ variant: "outline",
148
+ children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "2", width: "100%", children: [
149
+ icon,
150
+ /* @__PURE__ */ jsx(Separator, { orientation: "vertical", size: "2" }),
151
+ /* @__PURE__ */ jsxs(Box, { children: [
152
+ /* @__PURE__ */ jsx(Typo, { as: "div", children: title }),
153
+ typeof description === "string" && description !== "" ? /* @__PURE__ */ jsx(Typo, { variant: "caption", children: description }) : null
154
+ ] })
155
+ ] })
156
+ }
157
+ );
158
+ }
159
+
160
+ export {
161
+ TrainingInfoGuideline
162
+ };
163
+ //# sourceMappingURL=chunk-5RMPQM6F.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/molecules/training-info-guideline.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { FileTextIcon, VideoIcon } from '@radix-ui/react-icons';\nimport { AspectRatio } from '@/atoms/aspect-ratio';\nimport { Button } from '@/atoms/button';\nimport type { TrainingInfoGuidelineContents } from '@/types/training-info-guideline-schema-generated';\nimport { Dialog } from '@/atoms/dialog';\nimport { Spinner } from '@/atoms/spinner';\nimport { Box } from '@/atoms/box';\nimport { Separator } from '@/atoms/separator';\nimport { Typo } from '@/atoms/typo';\nimport { Flex } from '../atoms/flex';\n\nexport interface TrainingInfoGuidelineProps {\n values: TrainingInfoGuidelineContents['values'];\n onClickFileDownload: (args: { url: string; filename: string }) => void;\n}\n\nexport function TrainingInfoGuideline({\n values,\n onClickFileDownload,\n}: TrainingInfoGuidelineProps): React.ReactElement {\n return (\n <>\n {values.map((value) => (\n <TrainingInfoGuidelineItem\n key={getItemKey(value)}\n onClickFileDownload={onClickFileDownload}\n value={value}\n />\n ))}\n </>\n );\n}\n\ntype TrainingInfoGuidelineValue =\n TrainingInfoGuidelineContents['values'][number];\n\nfunction getItemKey(value: TrainingInfoGuidelineValue): string {\n return value.url;\n}\n\ninterface TrainingInfoGuidelineItemProps {\n value: TrainingInfoGuidelineValue;\n onClickFileDownload: TrainingInfoGuidelineProps['onClickFileDownload'];\n}\n\nfunction TrainingInfoGuidelineItem({\n value,\n onClickFileDownload,\n}: TrainingInfoGuidelineItemProps): React.ReactElement | null {\n const [isLoading, setIsLoading] = useState(true);\n\n if (value.type === 'file') {\n return (\n <TrainingInfoGuidelineButton\n description={value.filename}\n icon={<FileTextIcon />}\n onClick={() => {\n onClickFileDownload({ url: value.url, filename: value.filename });\n }}\n title={value.downloadButtonName}\n />\n );\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- 차후 다른 타입 추가 시 사용\n if (value.type === 'video') {\n return (\n <Dialog.Root>\n <Dialog.Trigger>\n <TrainingInfoGuidelineButton\n description=\"영상\"\n icon={<VideoIcon />}\n title={value.videoTitle}\n />\n </Dialog.Trigger>\n <Dialog.Content\n height=\"100%\"\n maxHeight=\"500px\"\n maxWidth=\"800px\"\n title={value.videoTitle}\n width=\"100%\"\n >\n <AspectRatio ratio={16 / 9} style={{ width: '100%' }}>\n <Flex\n align=\"center\"\n justify=\"center\"\n style={{\n width: '100%',\n height: '100%',\n backgroundColor: 'black',\n position: 'relative',\n }}\n >\n {isLoading ? (\n <Flex\n align=\"center\"\n height=\"100%\"\n justify=\"center\"\n position=\"absolute\"\n style={{\n position: 'absolute',\n top: 0,\n left: 0,\n zIndex: 1,\n color: 'white',\n }}\n width=\"100%\"\n >\n <Spinner size=\"3\" style={{ width: 48, height: 48 }} />\n </Flex>\n ) : null}\n\n <iframe\n allowFullScreen\n onError={() => {\n setIsLoading(false);\n }} // 필요시 에러 메시지로 대체\n onLoad={() => {\n setIsLoading(false);\n }}\n src={`${value.url}?theme=light`}\n style={{ width: '100%', height: '100%', border: 'none' }}\n title=\"Curriculum Video\"\n />\n </Flex>\n </AspectRatio>\n </Dialog.Content>\n </Dialog.Root>\n );\n }\n return null;\n}\n\ninterface TrainingInfoGuidelineButtonProps {\n icon: React.ReactNode;\n title: string;\n description?: string;\n onClick?: () => void;\n}\n\nfunction TrainingInfoGuidelineButton({\n icon,\n title,\n description,\n onClick,\n}: TrainingInfoGuidelineButtonProps): React.ReactElement {\n return (\n <Button\n onClick={onClick}\n style={{ width: '100%', height: '48px' , textAlign: 'left'}}\n variant=\"outline\"\n >\n <Flex align=\"center\" gap=\"2\" width=\"100%\">\n {icon}\n <Separator orientation=\"vertical\" size=\"2\" />\n <Box>\n <Typo as=\"div\">\n {title}\n </Typo>\n {typeof description === 'string' && description !== '' ? (\n <Typo variant=\"caption\" >\n {description}\n </Typo>\n ) : null}\n </Box>\n \n </Flex>\n </Button>\n );\n}\n"],"mappings":"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","names":[]}