@tipp/ui 1.6.21 → 1.6.22

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 (63) hide show
  1. package/dist/app/index.cjs +8 -15
  2. package/dist/app/index.cjs.map +1 -1
  3. package/dist/app/index.js +1 -1
  4. package/dist/app/platform/contents-card.cjs +592 -27
  5. package/dist/app/platform/contents-card.cjs.map +1 -1
  6. package/dist/app/platform/contents-card.js +52 -1
  7. package/dist/atoms/button.d.cts +1 -1
  8. package/dist/atoms/button.d.ts +1 -1
  9. package/dist/chunk-3K3WU7XM.js +145 -0
  10. package/dist/chunk-3K3WU7XM.js.map +1 -0
  11. package/dist/chunk-44STOGYA.js +164 -0
  12. package/dist/chunk-44STOGYA.js.map +1 -0
  13. package/dist/chunk-53ZJS5JI.js +111 -0
  14. package/dist/chunk-53ZJS5JI.js.map +1 -0
  15. package/dist/chunk-6LV4UGX5.js +165 -0
  16. package/dist/chunk-6LV4UGX5.js.map +1 -0
  17. package/dist/chunk-6RT2RUZ2.js +145 -0
  18. package/dist/chunk-6RT2RUZ2.js.map +1 -0
  19. package/dist/chunk-7CANQHBM.js +117 -0
  20. package/dist/chunk-7CANQHBM.js.map +1 -0
  21. package/dist/chunk-7WJGYLRQ.js +99 -0
  22. package/dist/chunk-7WJGYLRQ.js.map +1 -0
  23. package/dist/chunk-ABZVJJ4O.js +74 -0
  24. package/dist/chunk-ABZVJJ4O.js.map +1 -0
  25. package/dist/chunk-BBEZXZQH.js +284 -0
  26. package/dist/chunk-BBEZXZQH.js.map +1 -0
  27. package/dist/chunk-CUVAI5MJ.js +117 -0
  28. package/dist/chunk-CUVAI5MJ.js.map +1 -0
  29. package/dist/chunk-FBOJKLC6.js +64 -0
  30. package/dist/chunk-FBOJKLC6.js.map +1 -0
  31. package/dist/chunk-HXJYOUBE.js +30 -0
  32. package/dist/chunk-HXJYOUBE.js.map +1 -0
  33. package/dist/chunk-KCGIEABE.js +117 -0
  34. package/dist/chunk-KCGIEABE.js.map +1 -0
  35. package/dist/chunk-L5XYBDEW.js +116 -0
  36. package/dist/chunk-L5XYBDEW.js.map +1 -0
  37. package/dist/chunk-MWBEL3OY.js +111 -0
  38. package/dist/chunk-MWBEL3OY.js.map +1 -0
  39. package/dist/chunk-O5H5SQHB.js +110 -0
  40. package/dist/chunk-O5H5SQHB.js.map +1 -0
  41. package/dist/chunk-QGXLI3QC.js +111 -0
  42. package/dist/chunk-QGXLI3QC.js.map +1 -0
  43. package/dist/chunk-RPTU2HZS.js +111 -0
  44. package/dist/chunk-RPTU2HZS.js.map +1 -0
  45. package/dist/chunk-RVLCXUJU.js +113 -0
  46. package/dist/chunk-RVLCXUJU.js.map +1 -0
  47. package/dist/chunk-VKGTIYVH.js +63 -0
  48. package/dist/chunk-VKGTIYVH.js.map +1 -0
  49. package/dist/chunk-VR25ARRS.js +60 -0
  50. package/dist/chunk-VR25ARRS.js.map +1 -0
  51. package/dist/chunk-WEU6WLM4.js +39 -0
  52. package/dist/chunk-WEU6WLM4.js.map +1 -0
  53. package/dist/chunk-YC6CJEKF.js +102 -0
  54. package/dist/chunk-YC6CJEKF.js.map +1 -0
  55. package/dist/chunk-YMKOJKGY.js +145 -0
  56. package/dist/chunk-YMKOJKGY.js.map +1 -0
  57. package/dist/chunk-YTBR7GSV.js +111 -0
  58. package/dist/chunk-YTBR7GSV.js.map +1 -0
  59. package/dist/index.cjs +8 -15
  60. package/dist/index.cjs.map +1 -1
  61. package/dist/index.js +1 -1
  62. package/package.json +1 -1
  63. package/src/app/platform/contents-card.tsx +22 -26
@@ -0,0 +1,117 @@
1
+ import {
2
+ Skeleton
3
+ } from "./chunk-5H3YPCZK.js";
4
+ import {
5
+ DropdownMenu
6
+ } from "./chunk-4WFMOFN2.js";
7
+ import {
8
+ Grid
9
+ } from "./chunk-EGEQY3KT.js";
10
+ import {
11
+ Heading
12
+ } from "./chunk-HJB3AASV.js";
13
+ import {
14
+ Box
15
+ } from "./chunk-4Y5BEXVN.js";
16
+ import {
17
+ Typo
18
+ } from "./chunk-52MVZ6AN.js";
19
+ import {
20
+ Flex
21
+ } from "./chunk-25HMMI7R.js";
22
+ import {
23
+ Button
24
+ } from "./chunk-Q5AFRGVP.js";
25
+ import {
26
+ DotsVerticalIcon
27
+ } from "./chunk-HLFG5ZTU.js";
28
+
29
+ // src/app/platform/contents-card.tsx
30
+ import { forwardRef } from "react";
31
+ import { jsx, jsxs } from "react/jsx-runtime";
32
+ var ContentsCard = forwardRef(
33
+ ({
34
+ title,
35
+ description,
36
+ imageSrc,
37
+ footer,
38
+ dropdownItems,
39
+ onClickCard,
40
+ isLoading = false
41
+ }, ref) => {
42
+ return /* @__PURE__ */ jsxs(
43
+ Flex,
44
+ {
45
+ className: "hover-shadow",
46
+ direction: "column",
47
+ height: "100%",
48
+ m: "0",
49
+ onClick: onClickCard,
50
+ ref,
51
+ style: {
52
+ backgroundColor: "var(--color-panel)",
53
+ borderRadius: "var(--radius-5)",
54
+ overflow: "hidden",
55
+ cursor: "pointer"
56
+ },
57
+ width: "100%",
58
+ children: [
59
+ /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(
60
+ Box,
61
+ {
62
+ height: "210px",
63
+ style: {
64
+ borderTopLeftRadius: "var(--radius-4)",
65
+ borderTopRightRadius: "var(--radius-4)",
66
+ backgroundImage: `url(${imageSrc})`,
67
+ backgroundSize: "cover",
68
+ backgroundPosition: "center"
69
+ },
70
+ width: "100%"
71
+ }
72
+ ) }),
73
+ /* @__PURE__ */ jsxs(Box, { p: "5", children: [
74
+ /* @__PURE__ */ jsxs(Box, { children: [
75
+ /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(Heading, { mb: "3", variant: "heading5", children: title }) }),
76
+ /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(Typo, { as: "p", variant: "caption", children: description }) })
77
+ ] }),
78
+ /* @__PURE__ */ jsxs(
79
+ Grid,
80
+ {
81
+ align: "center",
82
+ columns: "1fr auto",
83
+ justify: "between",
84
+ pt: "2",
85
+ style: { marginTop: "auto" },
86
+ width: "100%",
87
+ children: [
88
+ /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(Flex, { gap: "3", overflow: "hidden", children: footer }) }),
89
+ Boolean(dropdownItems == null ? void 0 : dropdownItems.length) && /* @__PURE__ */ jsxs(DropdownMenu.Root, { children: [
90
+ /* @__PURE__ */ jsx(DropdownMenu.Trigger, { children: /* @__PURE__ */ jsx(Button, { size: "large", variant: "transparent", children: /* @__PURE__ */ jsx(DotsVerticalIcon, { color: "gray", height: "20px", width: "20px" }) }) }),
91
+ /* @__PURE__ */ jsx(DropdownMenu.Content, { children: dropdownItems == null ? void 0 : dropdownItems.map((item) => /* @__PURE__ */ jsx(
92
+ DropdownMenu.Item,
93
+ {
94
+ onClick: (e) => {
95
+ e.stopPropagation();
96
+ item.onClick();
97
+ },
98
+ children: item.label
99
+ },
100
+ item.label
101
+ )) })
102
+ ] })
103
+ ]
104
+ }
105
+ )
106
+ ] })
107
+ ]
108
+ }
109
+ );
110
+ }
111
+ );
112
+ ContentsCard.displayName = "ContentsCard";
113
+
114
+ export {
115
+ ContentsCard
116
+ };
117
+ //# sourceMappingURL=chunk-CUVAI5MJ.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/app/platform/contents-card.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Heading } from '@/atoms/heading';\nimport { Button } from '@/atoms/button';\nimport { DropdownMenu } from '@/atoms/dropdown-menu';\nimport { Box } from '@/atoms/box';\nimport { Flex } from '@/atoms/flex';\nimport { Grid } from '@/atoms/grid';\nimport { Skeleton } from '@/atoms/skeleton';\nimport { Typo } from '@/atoms/typo';\nimport { DotsVerticalIcon } from '@/icon';\n\nexport interface ContentsCardProps {\n title?: React.ReactNode;\n description?: string;\n id?: string;\n imageSrc?: string | null;\n imageAlt?: string;\n footer?: React.ReactNode;\n dropdownItems?: {\n label: string;\n onClick: () => void;\n }[];\n onClickCard?: () => void;\n isLoading?: boolean;\n}\n\nexport const ContentsCard = forwardRef<HTMLDivElement, ContentsCardProps>(\n (\n {\n title,\n description,\n imageSrc,\n footer,\n dropdownItems,\n onClickCard,\n isLoading = false,\n },\n ref\n ): React.ReactElement => {\n return (\n <Flex\n className=\"hover-shadow\"\n direction=\"column\"\n height=\"100%\"\n m=\"0\"\n onClick={onClickCard}\n ref={ref}\n style={{\n backgroundColor: 'var(--color-panel)',\n borderRadius: 'var(--radius-5)',\n overflow: 'hidden',\n cursor: 'pointer',\n }}\n width=\"100%\"\n >\n {/* 섬네일 */}\n <Skeleton loading={isLoading}>\n <Box\n height=\"210px\"\n style={{\n borderTopLeftRadius: 'var(--radius-4)',\n borderTopRightRadius: 'var(--radius-4)',\n backgroundImage: `url(${imageSrc})`,\n backgroundSize: 'cover',\n backgroundPosition: 'center',\n }}\n width=\"100%\"\n />\n </Skeleton>\n {/* 제목, 설명 */}\n <Box p=\"5\">\n <Box>\n <Skeleton loading={isLoading}>\n <Heading mb=\"3\" variant=\"heading5\">\n {title}\n </Heading>\n </Skeleton>\n <Skeleton loading={isLoading}>\n <Typo as=\"p\" variant=\"caption\">\n {description}\n </Typo>\n </Skeleton>\n </Box>\n <Grid\n align=\"center\"\n columns=\"1fr auto\"\n justify=\"between\"\n pt=\"2\"\n style={{ marginTop: 'auto' }}\n width=\"100%\"\n >\n <Skeleton loading={isLoading}>\n <Flex gap=\"3\" overflow=\"hidden\">\n {footer}\n </Flex>\n </Skeleton>\n {Boolean(dropdownItems?.length) && (\n <DropdownMenu.Root>\n <DropdownMenu.Trigger>\n <Button size=\"large\" variant=\"transparent\">\n <DotsVerticalIcon color=\"gray\" height=\"20px\" width=\"20px\" />\n </Button>\n </DropdownMenu.Trigger>\n <DropdownMenu.Content>\n {dropdownItems?.map((item) => (\n <DropdownMenu.Item\n key={item.label}\n onClick={(e) => {\n e.stopPropagation();\n item.onClick();\n }}\n >\n {item.label}\n </DropdownMenu.Item>\n ))}\n </DropdownMenu.Content>\n </DropdownMenu.Root>\n )}\n </Grid>\n </Box>\n </Flex>\n );\n }\n);\nContentsCard.displayName = 'ContentsCard';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,kBAAkB;AAyDxB,cAcA,YAdA;AA/BH,IAAM,eAAe;AAAA,EAC1B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,EACd,GACA,QACuB;AACvB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,WAAU;AAAA,QACV,QAAO;AAAA,QACP,GAAE;AAAA,QACF,SAAS;AAAA,QACT;AAAA,QACA,OAAO;AAAA,UACL,iBAAiB;AAAA,UACjB,cAAc;AAAA,UACd,UAAU;AAAA,UACV,QAAQ;AAAA,QACV;AAAA,QACA,OAAM;AAAA,QAGN;AAAA,8BAAC,YAAS,SAAS,WACjB;AAAA,YAAC;AAAA;AAAA,cACC,QAAO;AAAA,cACP,OAAO;AAAA,gBACL,qBAAqB;AAAA,gBACrB,sBAAsB;AAAA,gBACtB,iBAAiB,OAAO,QAAQ;AAAA,gBAChC,gBAAgB;AAAA,gBAChB,oBAAoB;AAAA,cACtB;AAAA,cACA,OAAM;AAAA;AAAA,UACR,GACF;AAAA,UAEA,qBAAC,OAAI,GAAE,KACL;AAAA,iCAAC,OACC;AAAA,kCAAC,YAAS,SAAS,WACjB,8BAAC,WAAQ,IAAG,KAAI,SAAQ,YACrB,iBACH,GACF;AAAA,cACA,oBAAC,YAAS,SAAS,WACjB,8BAAC,QAAK,IAAG,KAAI,SAAQ,WAClB,uBACH,GACF;AAAA,eACF;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,OAAM;AAAA,gBACN,SAAQ;AAAA,gBACR,SAAQ;AAAA,gBACR,IAAG;AAAA,gBACH,OAAO,EAAE,WAAW,OAAO;AAAA,gBAC3B,OAAM;AAAA,gBAEN;AAAA,sCAAC,YAAS,SAAS,WACjB,8BAAC,QAAK,KAAI,KAAI,UAAS,UACpB,kBACH,GACF;AAAA,kBACC,QAAQ,+CAAe,MAAM,KAC5B,qBAAC,aAAa,MAAb,EACC;AAAA,wCAAC,aAAa,SAAb,EACC,8BAAC,UAAO,MAAK,SAAQ,SAAQ,eAC3B,8BAAC,oBAAiB,OAAM,QAAO,QAAO,QAAO,OAAM,QAAO,GAC5D,GACF;AAAA,oBACA,oBAAC,aAAa,SAAb,EACE,yDAAe,IAAI,CAAC,SACnB;AAAA,sBAAC,aAAa;AAAA,sBAAb;AAAA,wBAEC,SAAS,CAAC,MAAM;AACd,4BAAE,gBAAgB;AAClB,+BAAK,QAAQ;AAAA,wBACf;AAAA,wBAEC,eAAK;AAAA;AAAA,sBAND,KAAK;AAAA,oBAOZ,IAEJ;AAAA,qBACF;AAAA;AAAA;AAAA,YAEJ;AAAA,aACF;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AACA,aAAa,cAAc;","names":[]}
@@ -0,0 +1,64 @@
1
+ import {
2
+ infoList,
3
+ renderDataListItem,
4
+ sessionList
5
+ } from "./chunk-QUHTO7MY.js";
6
+ import {
7
+ DataList
8
+ } from "./chunk-VTJZMOSP.js";
9
+ import {
10
+ Heading
11
+ } from "./chunk-HJB3AASV.js";
12
+ import {
13
+ Separator
14
+ } from "./chunk-HYITAA4J.js";
15
+ import {
16
+ Box
17
+ } from "./chunk-4Y5BEXVN.js";
18
+ import {
19
+ Flex
20
+ } from "./chunk-25HMMI7R.js";
21
+ import {
22
+ Card
23
+ } from "./chunk-2ZQK7NTN.js";
24
+
25
+ // src/app/platform/userInfos/coaching-customer-info/large.tsx
26
+ import { jsx, jsxs } from "react/jsx-runtime";
27
+ function CoachingCustomerInfoLarge({
28
+ customer,
29
+ session,
30
+ children,
31
+ badge,
32
+ onClickCopy
33
+ }) {
34
+ return /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "5", children: [
35
+ /* @__PURE__ */ jsxs(Box, { children: [
36
+ /* @__PURE__ */ jsxs(Flex, { align: "center", justify: "between", mb: "1", width: "100%", children: [
37
+ /* @__PURE__ */ jsx(Heading, { variant: "heading2", children: (customer == null ? void 0 : customer.username) || "\uC774\uB984 \uC5C6\uC74C" }),
38
+ badge
39
+ ] }),
40
+ /* @__PURE__ */ jsx(Heading, { truncate: true, variant: "heading4", weight: "regular", children: customer == null ? void 0 : customer.company })
41
+ ] }),
42
+ children,
43
+ /* @__PURE__ */ jsx(Card, { size: "2", children: /* @__PURE__ */ jsx(DataList.Root, { children: sessionList.map(
44
+ (el) => renderDataListItem({
45
+ info: el,
46
+ data: session,
47
+ onClickCopy
48
+ })
49
+ ) }) }),
50
+ /* @__PURE__ */ jsx(Separator, { size: "4" }),
51
+ /* @__PURE__ */ jsx(DataList.Root, { children: infoList.map(
52
+ (info) => renderDataListItem({
53
+ info,
54
+ data: customer,
55
+ onClickCopy
56
+ })
57
+ ) })
58
+ ] });
59
+ }
60
+
61
+ export {
62
+ CoachingCustomerInfoLarge
63
+ };
64
+ //# sourceMappingURL=chunk-FBOJKLC6.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/app/platform/userInfos/coaching-customer-info/large.tsx"],"sourcesContent":["import React from 'react';\nimport {\n Box,\n Card,\n DataList,\n Flex,\n Heading,\n Separator,\n} from '../../../../atoms';\nimport type { CoachingCustomerInfoProps } from '../utils';\nimport { infoList, renderDataListItem, sessionList } from '../utils';\n\nexport function CoachingCustomerInfoLarge({\n customer,\n session,\n children,\n badge,\n onClickCopy,\n}: CoachingCustomerInfoProps): React.ReactElement {\n return (\n <Flex direction=\"column\" gap=\"5\">\n {/* 이름, 사명 */}\n <Box>\n <Flex align=\"center\" justify=\"between\" mb=\"1\" width=\"100%\">\n <Heading variant=\"heading2\">\n {customer?.username || '이름 없음'}\n </Heading>\n {badge}\n </Flex>\n <Heading truncate variant=\"heading4\" weight=\"regular\">\n {customer?.company}\n </Heading>\n </Box>\n\n {children}\n\n {/* 세션 정보 */}\n <Card size=\"2\">\n <DataList.Root>\n {sessionList.map((el) =>\n renderDataListItem({\n info: el,\n data: session,\n onClickCopy,\n })\n )}\n </DataList.Root>\n </Card>\n\n {/* 회원 정보 */}\n <Separator size=\"4\" />\n <DataList.Root>\n {infoList.map((info) =>\n renderDataListItem({\n info,\n data: customer,\n onClickCopy,\n })\n )}\n </DataList.Root>\n </Flex>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAuBQ,SACE,KADF;AAXD,SAAS,0BAA0B;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAkD;AAChD,SACE,qBAAC,QAAK,WAAU,UAAS,KAAI,KAE3B;AAAA,yBAAC,OACC;AAAA,2BAAC,QAAK,OAAM,UAAS,SAAQ,WAAU,IAAG,KAAI,OAAM,QAClD;AAAA,4BAAC,WAAQ,SAAQ,YACd,gDAAU,aAAY,6BACzB;AAAA,QACC;AAAA,SACH;AAAA,MACA,oBAAC,WAAQ,UAAQ,MAAC,SAAQ,YAAW,QAAO,WACzC,+CAAU,SACb;AAAA,OACF;AAAA,IAEC;AAAA,IAGD,oBAAC,QAAK,MAAK,KACT,8BAAC,SAAS,MAAT,EACE,sBAAY;AAAA,MAAI,CAAC,OAChB,mBAAmB;AAAA,QACjB,MAAM;AAAA,QACN,MAAM;AAAA,QACN;AAAA,MACF,CAAC;AAAA,IACH,GACF,GACF;AAAA,IAGA,oBAAC,aAAU,MAAK,KAAI;AAAA,IACpB,oBAAC,SAAS,MAAT,EACE,mBAAS;AAAA,MAAI,CAAC,SACb,mBAAmB;AAAA,QACjB;AAAA,QACA,MAAM;AAAA,QACN;AAAA,MACF,CAAC;AAAA,IACH,GACF;AAAA,KACF;AAEJ;","names":[]}
@@ -0,0 +1,30 @@
1
+ import {
2
+ CoachingCustomerInfoMedium
3
+ } from "./chunk-ABZVJJ4O.js";
4
+ import {
5
+ CoachingCustomerInfoSmall
6
+ } from "./chunk-TL3L4CLE.js";
7
+ import {
8
+ CoachingCustomerInfoLarge
9
+ } from "./chunk-FBOJKLC6.js";
10
+ import {
11
+ Box
12
+ } from "./chunk-4Y5BEXVN.js";
13
+ import {
14
+ __spreadValues
15
+ } from "./chunk-N552FDTV.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-HXJYOUBE.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.ReactElement {\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,OACoB;AACpB,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,117 @@
1
+ import {
2
+ Skeleton
3
+ } from "./chunk-5H3YPCZK.js";
4
+ import {
5
+ Grid
6
+ } from "./chunk-EGEQY3KT.js";
7
+ import {
8
+ Heading
9
+ } from "./chunk-HJB3AASV.js";
10
+ import {
11
+ DropdownMenu
12
+ } from "./chunk-4WFMOFN2.js";
13
+ import {
14
+ Box
15
+ } from "./chunk-4Y5BEXVN.js";
16
+ import {
17
+ Typo
18
+ } from "./chunk-52MVZ6AN.js";
19
+ import {
20
+ Flex
21
+ } from "./chunk-25HMMI7R.js";
22
+ import {
23
+ Button
24
+ } from "./chunk-Q5AFRGVP.js";
25
+ import {
26
+ DotsVerticalIcon
27
+ } from "./chunk-HLFG5ZTU.js";
28
+
29
+ // src/app/platform/contents-card.tsx
30
+ import { forwardRef } from "react";
31
+ import { jsx, jsxs } from "react/jsx-runtime";
32
+ var ContentsCard = forwardRef(
33
+ ({
34
+ title,
35
+ description,
36
+ imageSrc,
37
+ footer,
38
+ dropdownItems,
39
+ onClickCard,
40
+ isLoading = false
41
+ }, ref) => {
42
+ return /* @__PURE__ */ jsxs(
43
+ Flex,
44
+ {
45
+ className: "hover-shadow",
46
+ direction: "column",
47
+ height: "100%",
48
+ m: "0",
49
+ onClick: onClickCard,
50
+ ref,
51
+ style: {
52
+ backgroundColor: "var(--color-panel)",
53
+ borderRadius: "var(--radius-5)",
54
+ overflow: "hidden",
55
+ cursor: "pointer"
56
+ },
57
+ width: "100%",
58
+ children: [
59
+ /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(
60
+ Box,
61
+ {
62
+ height: "210px",
63
+ style: {
64
+ borderTopLeftRadius: "var(--radius-4)",
65
+ borderTopRightRadius: "var(--radius-4)",
66
+ backgroundImage: `url(${imageSrc})`,
67
+ backgroundSize: "cover",
68
+ backgroundPosition: "center"
69
+ },
70
+ width: "100%"
71
+ }
72
+ ) }),
73
+ /* @__PURE__ */ jsxs(Box, { p: "5", children: [
74
+ /* @__PURE__ */ jsxs(Box, { children: [
75
+ /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(Heading, { mb: "3", variant: "heading5", children: title }) }),
76
+ /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(Typo, { as: "p", variant: "caption", children: description }) })
77
+ ] }),
78
+ /* @__PURE__ */ jsxs(
79
+ Grid,
80
+ {
81
+ align: "center",
82
+ columns: "1fr auto",
83
+ justify: "between",
84
+ pt: "2",
85
+ style: { marginTop: "auto" },
86
+ width: "100%",
87
+ children: [
88
+ /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(Flex, { gap: "3", overflow: "hidden", children: footer }) }),
89
+ Boolean(dropdownItems == null ? void 0 : dropdownItems.length) && /* @__PURE__ */ jsxs(DropdownMenu.Root, { children: [
90
+ /* @__PURE__ */ jsx(DropdownMenu.Trigger, { children: /* @__PURE__ */ jsx(Button, { size: "large", variant: "transparent", children: /* @__PURE__ */ jsx(DotsVerticalIcon, { color: "gray", height: "20px", width: "20px" }) }) }),
91
+ /* @__PURE__ */ jsx(DropdownMenu.Content, { children: dropdownItems == null ? void 0 : dropdownItems.map((item) => /* @__PURE__ */ jsx(
92
+ DropdownMenu.Item,
93
+ {
94
+ onClick: (e) => {
95
+ e.stopPropagation();
96
+ item.onClick();
97
+ },
98
+ children: item.label
99
+ },
100
+ item.label
101
+ )) })
102
+ ] })
103
+ ]
104
+ }
105
+ )
106
+ ] })
107
+ ]
108
+ }
109
+ );
110
+ }
111
+ );
112
+ ContentsCard.displayName = "ContentsCard";
113
+
114
+ export {
115
+ ContentsCard
116
+ };
117
+ //# sourceMappingURL=chunk-KCGIEABE.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/app/platform/contents-card.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Heading } from '@/atoms/heading';\nimport { Button } from '@/atoms/button';\nimport { DropdownMenu } from '@/atoms/dropdown-menu';\nimport { Box } from '@/atoms/box';\nimport { Flex } from '@/atoms/flex';\nimport { Grid } from '@/atoms/grid';\nimport { Skeleton } from '@/atoms/skeleton';\nimport { Typo } from '@/atoms/typo';\nimport { DotsVerticalIcon } from '@/icon';\n\nexport interface ContentsCardProps {\n title?: React.ReactNode;\n description?: string;\n id?: string;\n imageSrc?: string | null;\n imageAlt?: string;\n footer?: React.ReactNode;\n dropdownItems?: {\n label: string;\n onClick: () => void;\n }[];\n onClickCard?: () => void;\n isLoading?: boolean;\n}\n\nexport const ContentsCard = forwardRef<HTMLDivElement, ContentsCardProps>(\n (\n {\n title,\n description,\n imageSrc,\n footer,\n dropdownItems,\n onClickCard,\n isLoading = false,\n },\n ref\n ): React.ReactElement => {\n return (\n <Flex\n className=\"hover-shadow\"\n direction=\"column\"\n height=\"100%\"\n m=\"0\"\n onClick={onClickCard}\n ref={ref}\n style={{\n backgroundColor: 'var(--color-panel)',\n borderRadius: 'var(--radius-5)',\n overflow: 'hidden',\n cursor: 'pointer',\n }}\n width=\"100%\"\n >\n {/* 섬네일 */}\n <Skeleton loading={isLoading}>\n <Box\n height=\"210px\"\n style={{\n borderTopLeftRadius: 'var(--radius-4)',\n borderTopRightRadius: 'var(--radius-4)',\n backgroundImage: `url(${imageSrc})`,\n backgroundSize: 'cover',\n backgroundPosition: 'center',\n }}\n width=\"100%\"\n />\n </Skeleton>\n {/* 제목, 설명 */}\n <Box p=\"5\">\n <Box>\n <Skeleton loading={isLoading}>\n <Heading mb=\"3\" variant=\"heading5\">\n {title}\n </Heading>\n </Skeleton>\n <Skeleton loading={isLoading}>\n <Typo as=\"p\" variant=\"caption\">\n {description}\n </Typo>\n </Skeleton>\n </Box>\n <Grid\n align=\"center\"\n columns=\"1fr auto\"\n justify=\"between\"\n pt=\"2\"\n style={{ marginTop: 'auto' }}\n width=\"100%\"\n >\n <Skeleton loading={isLoading}>\n <Flex gap=\"3\" overflow=\"hidden\">\n {footer}\n </Flex>\n </Skeleton>\n {Boolean(dropdownItems?.length) && (\n <DropdownMenu.Root>\n <DropdownMenu.Trigger>\n <Button size=\"large\" variant=\"transparent\">\n <DotsVerticalIcon color=\"gray\" height=\"20px\" width=\"20px\" />\n </Button>\n </DropdownMenu.Trigger>\n <DropdownMenu.Content>\n {dropdownItems?.map((item) => (\n <DropdownMenu.Item\n key={item.label}\n onClick={(e) => {\n e.stopPropagation();\n item.onClick();\n }}\n >\n {item.label}\n </DropdownMenu.Item>\n ))}\n </DropdownMenu.Content>\n </DropdownMenu.Root>\n )}\n </Grid>\n </Box>\n </Flex>\n );\n }\n);\nContentsCard.displayName = 'ContentsCard';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,kBAAkB;AAyDxB,cAcA,YAdA;AA/BH,IAAM,eAAe;AAAA,EAC1B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,EACd,GACA,QACuB;AACvB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,WAAU;AAAA,QACV,QAAO;AAAA,QACP,GAAE;AAAA,QACF,SAAS;AAAA,QACT;AAAA,QACA,OAAO;AAAA,UACL,iBAAiB;AAAA,UACjB,cAAc;AAAA,UACd,UAAU;AAAA,UACV,QAAQ;AAAA,QACV;AAAA,QACA,OAAM;AAAA,QAGN;AAAA,8BAAC,YAAS,SAAS,WACjB;AAAA,YAAC;AAAA;AAAA,cACC,QAAO;AAAA,cACP,OAAO;AAAA,gBACL,qBAAqB;AAAA,gBACrB,sBAAsB;AAAA,gBACtB,iBAAiB,OAAO,QAAQ;AAAA,gBAChC,gBAAgB;AAAA,gBAChB,oBAAoB;AAAA,cACtB;AAAA,cACA,OAAM;AAAA;AAAA,UACR,GACF;AAAA,UAEA,qBAAC,OAAI,GAAE,KACL;AAAA,iCAAC,OACC;AAAA,kCAAC,YAAS,SAAS,WACjB,8BAAC,WAAQ,IAAG,KAAI,SAAQ,YACrB,iBACH,GACF;AAAA,cACA,oBAAC,YAAS,SAAS,WACjB,8BAAC,QAAK,IAAG,KAAI,SAAQ,WAClB,uBACH,GACF;AAAA,eACF;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,OAAM;AAAA,gBACN,SAAQ;AAAA,gBACR,SAAQ;AAAA,gBACR,IAAG;AAAA,gBACH,OAAO,EAAE,WAAW,OAAO;AAAA,gBAC3B,OAAM;AAAA,gBAEN;AAAA,sCAAC,YAAS,SAAS,WACjB,8BAAC,QAAK,KAAI,KAAI,UAAS,UACpB,kBACH,GACF;AAAA,kBACC,QAAQ,+CAAe,MAAM,KAC5B,qBAAC,aAAa,MAAb,EACC;AAAA,wCAAC,aAAa,SAAb,EACC,8BAAC,UAAO,MAAK,SAAQ,SAAQ,eAC3B,8BAAC,oBAAiB,OAAM,QAAO,QAAO,QAAO,OAAM,QAAO,GAC5D,GACF;AAAA,oBACA,oBAAC,aAAa,SAAb,EACE,yDAAe,IAAI,CAAC,SACnB;AAAA,sBAAC,aAAa;AAAA,sBAAb;AAAA,wBAEC,SAAS,CAAC,MAAM;AACd,4BAAE,gBAAgB;AAClB,+BAAK,QAAQ;AAAA,wBACf;AAAA,wBAEC,eAAK;AAAA;AAAA,sBAND,KAAK;AAAA,oBAOZ,IAEJ;AAAA,qBACF;AAAA;AAAA;AAAA,YAEJ;AAAA,aACF;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AACA,aAAa,cAAc;","names":[]}
@@ -0,0 +1,116 @@
1
+ import {
2
+ Skeleton
3
+ } from "./chunk-5H3YPCZK.js";
4
+ import {
5
+ Grid
6
+ } from "./chunk-EGEQY3KT.js";
7
+ import {
8
+ Inset
9
+ } from "./chunk-XQOL7UBI.js";
10
+ import {
11
+ Heading
12
+ } from "./chunk-HJB3AASV.js";
13
+ import {
14
+ DropdownMenu
15
+ } from "./chunk-4WFMOFN2.js";
16
+ import {
17
+ Card
18
+ } from "./chunk-2ZQK7NTN.js";
19
+ import {
20
+ Box
21
+ } from "./chunk-4Y5BEXVN.js";
22
+ import {
23
+ Typo
24
+ } from "./chunk-52MVZ6AN.js";
25
+ import {
26
+ Flex
27
+ } from "./chunk-25HMMI7R.js";
28
+ import {
29
+ Button
30
+ } from "./chunk-Q5AFRGVP.js";
31
+ import {
32
+ DotsVerticalIcon
33
+ } from "./chunk-HLFG5ZTU.js";
34
+
35
+ // src/app/platform/contents-card.tsx
36
+ import { forwardRef } from "react";
37
+ import { jsx, jsxs } from "react/jsx-runtime";
38
+ var ContentsCard = forwardRef(
39
+ ({
40
+ title,
41
+ description,
42
+ imageSrc,
43
+ footer,
44
+ dropdownItems,
45
+ onClickCard,
46
+ isLoading = false
47
+ }, ref) => {
48
+ return /* @__PURE__ */ jsxs(
49
+ Card,
50
+ {
51
+ onClick: onClickCard,
52
+ ref,
53
+ style: {
54
+ height: "100%",
55
+ width: "100%",
56
+ display: "grid",
57
+ cursor: "pointer"
58
+ },
59
+ children: [
60
+ /* @__PURE__ */ jsx(Inset, { clip: "padding-box", pb: "0", side: "top", children: /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(
61
+ Box,
62
+ {
63
+ height: "210px",
64
+ style: {
65
+ backgroundImage: `url(${imageSrc})`,
66
+ backgroundSize: "cover",
67
+ backgroundPosition: "center"
68
+ },
69
+ width: "100%"
70
+ }
71
+ ) }) }),
72
+ /* @__PURE__ */ jsxs(Flex, { direction: "column", p: "4", pb: "3", children: [
73
+ /* @__PURE__ */ jsxs(Box, { children: [
74
+ /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(Heading, { mb: "3", variant: "heading5", children: title }) }),
75
+ /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(Typo, { as: "p", variant: "caption", children: description }) })
76
+ ] }),
77
+ /* @__PURE__ */ jsxs(
78
+ Grid,
79
+ {
80
+ align: "center",
81
+ columns: "1fr auto",
82
+ justify: "between",
83
+ pt: "2",
84
+ style: { marginTop: "auto" },
85
+ width: "100%",
86
+ children: [
87
+ /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(Flex, { gap: "3", overflow: "hidden", children: footer }) }),
88
+ Boolean(dropdownItems == null ? void 0 : dropdownItems.length) && /* @__PURE__ */ jsxs(DropdownMenu.Root, { children: [
89
+ /* @__PURE__ */ jsx(DropdownMenu.Trigger, { children: /* @__PURE__ */ jsx(Button, { size: "large", variant: "transparent", children: /* @__PURE__ */ jsx(DotsVerticalIcon, { color: "gray", height: "20px", width: "20px" }) }) }),
90
+ /* @__PURE__ */ jsx(DropdownMenu.Content, { children: dropdownItems == null ? void 0 : dropdownItems.map((item) => /* @__PURE__ */ jsx(
91
+ DropdownMenu.Item,
92
+ {
93
+ onClick: (e) => {
94
+ e.stopPropagation();
95
+ item.onClick();
96
+ },
97
+ children: item.label
98
+ },
99
+ item.label
100
+ )) })
101
+ ] })
102
+ ]
103
+ }
104
+ )
105
+ ] })
106
+ ]
107
+ }
108
+ );
109
+ }
110
+ );
111
+ ContentsCard.displayName = "ContentsCard";
112
+
113
+ export {
114
+ ContentsCard
115
+ };
116
+ //# sourceMappingURL=chunk-L5XYBDEW.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/app/platform/contents-card.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Heading } from '@/atoms/heading';\nimport { Button } from '@/atoms/button';\nimport { DropdownMenu } from '@/atoms/dropdown-menu';\nimport { Box } from '@/atoms/box';\nimport { Flex } from '@/atoms/flex';\nimport { Grid } from '@/atoms/grid';\nimport { Skeleton } from '@/atoms/skeleton';\nimport { Typo } from '@/atoms/typo';\nimport { DotsVerticalIcon } from '@/icon';\nimport { Card, Inset } from '@/atoms';\n\nexport interface ContentsCardProps {\n title?: React.ReactNode;\n description?: string;\n id?: string;\n imageSrc?: string | null;\n imageAlt?: string;\n footer?: React.ReactNode;\n dropdownItems?: {\n label: string;\n onClick: () => void;\n }[];\n onClickCard?: () => void;\n isLoading?: boolean;\n}\n\nexport const ContentsCard = forwardRef<HTMLDivElement, ContentsCardProps>(\n (\n {\n title,\n description,\n imageSrc,\n footer,\n dropdownItems,\n onClickCard,\n isLoading = false,\n },\n ref\n ): React.ReactElement => {\n return (\n <Card\n onClick={onClickCard}\n ref={ref}\n style={{\n height: '100%',\n width: '100%',\n display: 'grid',\n cursor: 'pointer',\n }}\n >\n {/* 섬네일 */}\n <Inset clip=\"padding-box\" pb=\"0\" side=\"top\">\n <Skeleton loading={isLoading}>\n <Box\n height=\"210px\"\n style={{\n backgroundImage: `url(${imageSrc})`,\n backgroundSize: 'cover',\n backgroundPosition: 'center',\n }}\n width=\"100%\"\n />\n </Skeleton>\n </Inset>\n {/* 제목, 설명 */}\n <Flex direction=\"column\" p=\"4\" pb=\"3\">\n <Box>\n <Skeleton loading={isLoading}>\n <Heading mb=\"3\" variant=\"heading5\">\n {title}\n </Heading>\n </Skeleton>\n <Skeleton loading={isLoading}>\n <Typo as=\"p\" variant=\"caption\">\n {description}\n </Typo>\n </Skeleton>\n </Box>\n <Grid\n align=\"center\"\n columns=\"1fr auto\"\n justify=\"between\"\n pt=\"2\"\n style={{ marginTop: 'auto' }}\n width=\"100%\"\n >\n <Skeleton loading={isLoading}>\n <Flex gap=\"3\" overflow=\"hidden\">\n {footer}\n </Flex>\n </Skeleton>\n {Boolean(dropdownItems?.length) && (\n <DropdownMenu.Root>\n <DropdownMenu.Trigger>\n <Button size=\"large\" variant=\"transparent\">\n <DotsVerticalIcon color=\"gray\" height=\"20px\" width=\"20px\" />\n </Button>\n </DropdownMenu.Trigger>\n <DropdownMenu.Content>\n {dropdownItems?.map((item) => (\n <DropdownMenu.Item\n key={item.label}\n onClick={(e) => {\n e.stopPropagation();\n item.onClick();\n }}\n >\n {item.label}\n </DropdownMenu.Item>\n ))}\n </DropdownMenu.Content>\n </DropdownMenu.Root>\n )}\n </Grid>\n </Flex>\n </Card>\n );\n }\n);\nContentsCard.displayName = 'ContentsCard';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,kBAAkB;AAsDtB,cAaF,YAbE;AA3BL,IAAM,eAAe;AAAA,EAC1B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,EACd,GACA,QACuB;AACvB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,SAAS;AAAA,QACT;AAAA,QACA,OAAO;AAAA,UACL,QAAQ;AAAA,UACR,OAAO;AAAA,UACP,SAAS;AAAA,UACT,QAAQ;AAAA,QACV;AAAA,QAGA;AAAA,8BAAC,SAAM,MAAK,eAAc,IAAG,KAAI,MAAK,OACpC,8BAAC,YAAS,SAAS,WACjB;AAAA,YAAC;AAAA;AAAA,cACC,QAAO;AAAA,cACP,OAAO;AAAA,gBACL,iBAAiB,OAAO,QAAQ;AAAA,gBAChC,gBAAgB;AAAA,gBAChB,oBAAoB;AAAA,cACtB;AAAA,cACA,OAAM;AAAA;AAAA,UACR,GACF,GACF;AAAA,UAEA,qBAAC,QAAK,WAAU,UAAS,GAAE,KAAI,IAAG,KAChC;AAAA,iCAAC,OACC;AAAA,kCAAC,YAAS,SAAS,WACjB,8BAAC,WAAQ,IAAG,KAAI,SAAQ,YACrB,iBACH,GACF;AAAA,cACA,oBAAC,YAAS,SAAS,WACjB,8BAAC,QAAK,IAAG,KAAI,SAAQ,WAClB,uBACH,GACF;AAAA,eACF;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,OAAM;AAAA,gBACN,SAAQ;AAAA,gBACR,SAAQ;AAAA,gBACR,IAAG;AAAA,gBACH,OAAO,EAAE,WAAW,OAAO;AAAA,gBAC3B,OAAM;AAAA,gBAEN;AAAA,sCAAC,YAAS,SAAS,WACjB,8BAAC,QAAK,KAAI,KAAI,UAAS,UACpB,kBACH,GACF;AAAA,kBACC,QAAQ,+CAAe,MAAM,KAC5B,qBAAC,aAAa,MAAb,EACC;AAAA,wCAAC,aAAa,SAAb,EACC,8BAAC,UAAO,MAAK,SAAQ,SAAQ,eAC3B,8BAAC,oBAAiB,OAAM,QAAO,QAAO,QAAO,OAAM,QAAO,GAC5D,GACF;AAAA,oBACA,oBAAC,aAAa,SAAb,EACE,yDAAe,IAAI,CAAC,SACnB;AAAA,sBAAC,aAAa;AAAA,sBAAb;AAAA,wBAEC,SAAS,CAAC,MAAM;AACd,4BAAE,gBAAgB;AAClB,+BAAK,QAAQ;AAAA,wBACf;AAAA,wBAEC,eAAK;AAAA;AAAA,sBAND,KAAK;AAAA,oBAOZ,IAEJ;AAAA,qBACF;AAAA;AAAA;AAAA,YAEJ;AAAA,aACF;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AACA,aAAa,cAAc;","names":[]}
@@ -0,0 +1,111 @@
1
+ import {
2
+ Skeleton
3
+ } from "./chunk-5H3YPCZK.js";
4
+ import {
5
+ Grid
6
+ } from "./chunk-EGEQY3KT.js";
7
+ import {
8
+ Inset
9
+ } from "./chunk-XQOL7UBI.js";
10
+ import {
11
+ Heading
12
+ } from "./chunk-HJB3AASV.js";
13
+ import {
14
+ DropdownMenu
15
+ } from "./chunk-4WFMOFN2.js";
16
+ import {
17
+ Card
18
+ } from "./chunk-2ZQK7NTN.js";
19
+ import {
20
+ Box
21
+ } from "./chunk-4Y5BEXVN.js";
22
+ import {
23
+ Typo
24
+ } from "./chunk-52MVZ6AN.js";
25
+ import {
26
+ Flex
27
+ } from "./chunk-25HMMI7R.js";
28
+ import {
29
+ Button
30
+ } from "./chunk-Q5AFRGVP.js";
31
+ import {
32
+ DotsVerticalIcon
33
+ } from "./chunk-HLFG5ZTU.js";
34
+
35
+ // src/app/platform/contents-card.tsx
36
+ import { forwardRef } from "react";
37
+ import { jsx, jsxs } from "react/jsx-runtime";
38
+ var ContentsCard = forwardRef(
39
+ ({
40
+ title,
41
+ description,
42
+ imageSrc,
43
+ footer,
44
+ dropdownItems,
45
+ onClickCard,
46
+ isLoading = false
47
+ }, ref) => {
48
+ return /* @__PURE__ */ jsxs(
49
+ Card,
50
+ {
51
+ onClick: onClickCard,
52
+ ref,
53
+ style: { height: "100%", width: "100%", display: "grid" },
54
+ children: [
55
+ /* @__PURE__ */ jsx(Inset, { clip: "padding-box", pb: "0", side: "top", children: /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(
56
+ Box,
57
+ {
58
+ height: "210px",
59
+ style: {
60
+ backgroundImage: `url(${imageSrc})`,
61
+ backgroundSize: "cover",
62
+ backgroundPosition: "center"
63
+ },
64
+ width: "100%"
65
+ }
66
+ ) }) }),
67
+ /* @__PURE__ */ jsxs(Flex, { direction: "column", p: "4", children: [
68
+ /* @__PURE__ */ jsxs(Box, { children: [
69
+ /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(Heading, { mb: "3", variant: "heading5", children: title }) }),
70
+ /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(Typo, { as: "p", variant: "caption", children: description }) })
71
+ ] }),
72
+ /* @__PURE__ */ jsxs(
73
+ Grid,
74
+ {
75
+ align: "center",
76
+ columns: "1fr auto",
77
+ justify: "between",
78
+ pt: "2",
79
+ style: { marginTop: "auto" },
80
+ width: "100%",
81
+ children: [
82
+ /* @__PURE__ */ jsx(Skeleton, { loading: isLoading, children: /* @__PURE__ */ jsx(Flex, { gap: "3", overflow: "hidden", children: footer }) }),
83
+ Boolean(dropdownItems == null ? void 0 : dropdownItems.length) && /* @__PURE__ */ jsxs(DropdownMenu.Root, { children: [
84
+ /* @__PURE__ */ jsx(DropdownMenu.Trigger, { children: /* @__PURE__ */ jsx(Button, { size: "large", variant: "transparent", children: /* @__PURE__ */ jsx(DotsVerticalIcon, { color: "gray", height: "20px", width: "20px" }) }) }),
85
+ /* @__PURE__ */ jsx(DropdownMenu.Content, { children: dropdownItems == null ? void 0 : dropdownItems.map((item) => /* @__PURE__ */ jsx(
86
+ DropdownMenu.Item,
87
+ {
88
+ onClick: (e) => {
89
+ e.stopPropagation();
90
+ item.onClick();
91
+ },
92
+ children: item.label
93
+ },
94
+ item.label
95
+ )) })
96
+ ] })
97
+ ]
98
+ }
99
+ )
100
+ ] })
101
+ ]
102
+ }
103
+ );
104
+ }
105
+ );
106
+ ContentsCard.displayName = "ContentsCard";
107
+
108
+ export {
109
+ ContentsCard
110
+ };
111
+ //# sourceMappingURL=chunk-MWBEL3OY.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/app/platform/contents-card.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Heading } from '@/atoms/heading';\nimport { Button } from '@/atoms/button';\nimport { DropdownMenu } from '@/atoms/dropdown-menu';\nimport { Box } from '@/atoms/box';\nimport { Flex } from '@/atoms/flex';\nimport { Grid } from '@/atoms/grid';\nimport { Skeleton } from '@/atoms/skeleton';\nimport { Typo } from '@/atoms/typo';\nimport { DotsVerticalIcon } from '@/icon';\nimport { Card, Inset } from '@/atoms';\n\nexport interface ContentsCardProps {\n title?: React.ReactNode;\n description?: string;\n id?: string;\n imageSrc?: string | null;\n imageAlt?: string;\n footer?: React.ReactNode;\n dropdownItems?: {\n label: string;\n onClick: () => void;\n }[];\n onClickCard?: () => void;\n isLoading?: boolean;\n}\n\nexport const ContentsCard = forwardRef<HTMLDivElement, ContentsCardProps>(\n (\n {\n title,\n description,\n imageSrc,\n footer,\n dropdownItems,\n onClickCard,\n isLoading = false,\n },\n ref\n ): React.ReactElement => {\n return (\n <Card\n onClick={onClickCard}\n ref={ref}\n style={{ height: '100%', width: '100%', display: 'grid' }}\n >\n {/* 섬네일 */}\n <Inset clip=\"padding-box\" pb=\"0\" side=\"top\">\n <Skeleton loading={isLoading}>\n <Box\n height=\"210px\"\n style={{\n backgroundImage: `url(${imageSrc})`,\n backgroundSize: 'cover',\n backgroundPosition: 'center',\n }}\n width=\"100%\"\n />\n </Skeleton>\n </Inset>\n {/* 제목, 설명 */}\n <Flex direction=\"column\" p=\"4\">\n <Box>\n <Skeleton loading={isLoading}>\n <Heading mb=\"3\" variant=\"heading5\">\n {title}\n </Heading>\n </Skeleton>\n <Skeleton loading={isLoading}>\n <Typo as=\"p\" variant=\"caption\">\n {description}\n </Typo>\n </Skeleton>\n </Box>\n <Grid\n align=\"center\"\n columns=\"1fr auto\"\n justify=\"between\"\n pt=\"2\"\n style={{ marginTop: 'auto' }}\n width=\"100%\"\n >\n <Skeleton loading={isLoading}>\n <Flex gap=\"3\" overflow=\"hidden\">\n {footer}\n </Flex>\n </Skeleton>\n {Boolean(dropdownItems?.length) && (\n <DropdownMenu.Root>\n <DropdownMenu.Trigger>\n <Button size=\"large\" variant=\"transparent\">\n <DotsVerticalIcon color=\"gray\" height=\"20px\" width=\"20px\" />\n </Button>\n </DropdownMenu.Trigger>\n <DropdownMenu.Content>\n {dropdownItems?.map((item) => (\n <DropdownMenu.Item\n key={item.label}\n onClick={(e) => {\n e.stopPropagation();\n item.onClick();\n }}\n >\n {item.label}\n </DropdownMenu.Item>\n ))}\n </DropdownMenu.Content>\n </DropdownMenu.Root>\n )}\n </Grid>\n </Flex>\n </Card>\n );\n }\n);\nContentsCard.displayName = 'ContentsCard';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,kBAAkB;AAiDtB,cAaF,YAbE;AAtBL,IAAM,eAAe;AAAA,EAC1B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,EACd,GACA,QACuB;AACvB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,SAAS;AAAA,QACT;AAAA,QACA,OAAO,EAAE,QAAQ,QAAQ,OAAO,QAAQ,SAAS,OAAO;AAAA,QAGxD;AAAA,8BAAC,SAAM,MAAK,eAAc,IAAG,KAAI,MAAK,OACpC,8BAAC,YAAS,SAAS,WACjB;AAAA,YAAC;AAAA;AAAA,cACC,QAAO;AAAA,cACP,OAAO;AAAA,gBACL,iBAAiB,OAAO,QAAQ;AAAA,gBAChC,gBAAgB;AAAA,gBAChB,oBAAoB;AAAA,cACtB;AAAA,cACA,OAAM;AAAA;AAAA,UACR,GACF,GACF;AAAA,UAEA,qBAAC,QAAK,WAAU,UAAS,GAAE,KACzB;AAAA,iCAAC,OACC;AAAA,kCAAC,YAAS,SAAS,WACjB,8BAAC,WAAQ,IAAG,KAAI,SAAQ,YACrB,iBACH,GACF;AAAA,cACA,oBAAC,YAAS,SAAS,WACjB,8BAAC,QAAK,IAAG,KAAI,SAAQ,WAClB,uBACH,GACF;AAAA,eACF;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,OAAM;AAAA,gBACN,SAAQ;AAAA,gBACR,SAAQ;AAAA,gBACR,IAAG;AAAA,gBACH,OAAO,EAAE,WAAW,OAAO;AAAA,gBAC3B,OAAM;AAAA,gBAEN;AAAA,sCAAC,YAAS,SAAS,WACjB,8BAAC,QAAK,KAAI,KAAI,UAAS,UACpB,kBACH,GACF;AAAA,kBACC,QAAQ,+CAAe,MAAM,KAC5B,qBAAC,aAAa,MAAb,EACC;AAAA,wCAAC,aAAa,SAAb,EACC,8BAAC,UAAO,MAAK,SAAQ,SAAQ,eAC3B,8BAAC,oBAAiB,OAAM,QAAO,QAAO,QAAO,OAAM,QAAO,GAC5D,GACF;AAAA,oBACA,oBAAC,aAAa,SAAb,EACE,yDAAe,IAAI,CAAC,SACnB;AAAA,sBAAC,aAAa;AAAA,sBAAb;AAAA,wBAEC,SAAS,CAAC,MAAM;AACd,4BAAE,gBAAgB;AAClB,+BAAK,QAAQ;AAAA,wBACf;AAAA,wBAEC,eAAK;AAAA;AAAA,sBAND,KAAK;AAAA,oBAOZ,IAEJ;AAAA,qBACF;AAAA;AAAA;AAAA,YAEJ;AAAA,aACF;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AACA,aAAa,cAAc;","names":[]}