@dotss/tictoccroc 0.0.16 → 0.0.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/shared/components/ChatKit/BotMessage/BotMessage.d.ts +12 -3
- package/dist/shared/components/ChatKit/BotMessage/BotMessage.mjs +31 -29
- package/dist/shared/components/ChatKit/BotMessage/index.d.ts +2 -2
- package/dist/shared/components/ChatKit/SystemMessage/(Actions)/DirectTrageRiskInfoBottomSheet/DirectTrageRiskInfoBottomSheet.d.ts +2 -1
- package/dist/shared/components/ChatKit/SystemMessage/(Actions)/DirectTrageRiskInfoBottomSheet/DirectTrageRiskInfoBottomSheet.mjs +81 -47
- package/dist/shared/components/ChatKit/SystemMessage/SystemMessage.d.ts +10 -2
- package/dist/shared/components/ChatKit/SystemMessage/SystemMessage.mjs +25 -23
- package/dist/teacher/home/components/BannerAccount/BannerAccount.fallback.mjs +5 -5
- package/dist/teacher/home/components/Carousel1Account/Carousel1Account.fallback.mjs +4 -3
- package/dist/teacher/home/components/Carousel2Account/Carousel2Account.fallback.mjs +10 -9
- package/dist/teacher/home/components/TextAccount/TextAccount.fallback.mjs +95 -86
- package/dist/teacher/profile/components/CareerSection/CareerItem/CareerItem.mjs +12 -12
- package/dist/teacher/profile/components/CareerSection/CareerSection.mjs +26 -33
- package/dist/teacher/profile/components/CertificateSection/CertificateItem/CertificateItem.mjs +2 -3
- package/dist/teacher/profile/components/CertificateSection/CertificateSection.mjs +30 -37
- package/dist/teacher/profile/components/EducationSection/EducationItem/EducationItem.mjs +15 -16
- package/dist/teacher/profile/components/EducationSection/EducationSection.mjs +36 -43
- package/package.json +1 -1
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { FlexboxProps } from 'node_modules/@dotss/ui/Flexbox/Flexbox';
|
|
2
|
-
export type BotMessageType = 'MATCHING_SUCCEEDED' | 'TEACHER_INQUIRED' | 'PARENT_CHANGED_OFFER_SCHEDULE' | 'PARENT_CHANGED_MATCHING_SCHEDULE' | 'TEACHER_APPLIED' | 'PARENT_SENT_OFFER' | '
|
|
2
|
+
export type BotMessageType = 'MATCHING_SUCCEEDED' | 'TEACHER_INQUIRED' | 'PARENT_CHANGED_OFFER_SCHEDULE' | 'PARENT_CHANGED_MATCHING_SCHEDULE' | 'TEACHER_APPLIED' | 'PARENT_SENT_OFFER' | 'KOK_MATCHING_SUCCEEDED' | 'APPLICATION_MATCHING_SUCCEEDED' | 'PARENT_REJECTED_APPLICATION' | 'TEACHER_REFUSED_OFFER' | 'PARENT_CANCELED_MATCHING' | 'TEACHER_CANCELED_MATCHING' | 'TEACHER_COMPLETED_CARE' | 'ADMIN_CANCELED_MATCHING';
|
|
3
3
|
export type BotMessageCtaType = 'MY_CLASS_CHECK' | 'OFFER_CHECK' | 'CHANGE_INFO_CHECK' | 'MY_APPLICATION_INFO_VIEW' | 'CARE_NOTE_CHECK' | 'TEACHER_SELECTION';
|
|
4
|
+
export type BotMessageSubCtaType = 'MATCHING';
|
|
4
5
|
export interface BotMessageOffer {
|
|
5
6
|
careStartDate: string;
|
|
6
7
|
careStartTime: string;
|
|
@@ -15,6 +16,8 @@ export interface BotMessageProps extends Omit<FlexboxProps, 'id' | 'title'> {
|
|
|
15
16
|
ctaType?: BotMessageCtaType | null;
|
|
16
17
|
ctaTargetTable?: string | null;
|
|
17
18
|
ctaTargetId?: number | null;
|
|
19
|
+
subCtaTargetTable?: BotMessageSubCtaType | null;
|
|
20
|
+
subCtaTargetId?: number | null;
|
|
18
21
|
mine: boolean;
|
|
19
22
|
avatarUrl?: string;
|
|
20
23
|
title: string;
|
|
@@ -22,8 +25,14 @@ export interface BotMessageProps extends Omit<FlexboxProps, 'id' | 'title'> {
|
|
|
22
25
|
unreadUserCount: number;
|
|
23
26
|
offer: object | null;
|
|
24
27
|
regDatetime: string;
|
|
25
|
-
onAction?: (
|
|
28
|
+
onAction?: (params: {
|
|
29
|
+
botMessageType: BotMessageType;
|
|
30
|
+
ctaType?: BotMessageCtaType | null;
|
|
31
|
+
ctaTargetId?: number | null;
|
|
32
|
+
subCtaTargetTable?: BotMessageSubCtaType | null;
|
|
33
|
+
subCtaTargetId?: number | null;
|
|
34
|
+
}) => void;
|
|
26
35
|
onView?: () => void;
|
|
27
36
|
}
|
|
28
|
-
declare function BotMessage({ id, botMessageType, ctaType, ctaTargetId, mine, avatarUrl, title, content, unreadUserCount, offer, regDatetime, onAction, onView, inlineCSS, ...props }: BotMessageProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
37
|
+
declare function BotMessage({ id, botMessageType, ctaType, ctaTargetId, subCtaTargetTable, subCtaTargetId, mine, avatarUrl, title, content, unreadUserCount, offer, regDatetime, onAction, onView, inlineCSS, ...props }: BotMessageProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
29
38
|
export default BotMessage;
|
|
@@ -1,37 +1,39 @@
|
|
|
1
1
|
import { jsxs as t, jsx as r } from "react/jsx-runtime";
|
|
2
|
-
import { useRef as
|
|
3
|
-
import { Flexbox as n, Typography as e, Button as
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import G from "../../../hooks/useInView/useInView.mjs";
|
|
2
|
+
import { useRef as E, useEffect as F } from "react";
|
|
3
|
+
import { Flexbox as n, Typography as e, Button as L } from "@dotss/ui";
|
|
4
|
+
import $ from "@dotss/ui/core/useTheme";
|
|
5
|
+
import { getClassInfo as q, getCtaButtonText as z } from "./BotMessage.utils.mjs";
|
|
6
|
+
import G from "../../Image/Image.mjs";
|
|
7
|
+
import J from "../../../hooks/useInView/useInView.mjs";
|
|
9
8
|
import S from "../../../utils/getCareTypeLabel/getCareTypeLabel.mjs";
|
|
10
|
-
|
|
11
|
-
|
|
9
|
+
import K from "dayjs";
|
|
10
|
+
function O({
|
|
11
|
+
id: N,
|
|
12
12
|
botMessageType: y,
|
|
13
13
|
ctaType: s,
|
|
14
14
|
ctaTargetId: C,
|
|
15
|
+
subCtaTargetTable: b,
|
|
16
|
+
subCtaTargetId: v,
|
|
15
17
|
mine: a,
|
|
16
18
|
avatarUrl: g,
|
|
17
|
-
title:
|
|
19
|
+
title: T,
|
|
18
20
|
content: p,
|
|
19
21
|
unreadUserCount: h,
|
|
20
|
-
offer:
|
|
21
|
-
regDatetime:
|
|
22
|
+
offer: R,
|
|
23
|
+
regDatetime: w,
|
|
22
24
|
onAction: o,
|
|
23
25
|
onView: l,
|
|
24
|
-
inlineCSS:
|
|
25
|
-
...
|
|
26
|
+
inlineCSS: I,
|
|
27
|
+
...B
|
|
26
28
|
}) {
|
|
27
29
|
const {
|
|
28
|
-
palette: { brand:
|
|
30
|
+
palette: { brand: j, grey: m, background: D },
|
|
29
31
|
spacing: d
|
|
30
|
-
} =
|
|
32
|
+
} = $(), f = E(null), { isInView: u } = J(f), x = z(s), i = R, k = [
|
|
31
33
|
S(i == null ? void 0 : i.firstCareType),
|
|
32
34
|
S(i == null ? void 0 : i.secondCareType)
|
|
33
|
-
].filter(Boolean).filter((
|
|
34
|
-
return
|
|
35
|
+
].filter(Boolean).filter((M) => M !== "-").join("+"), c = q(i), H = () => o == null ? void 0 : o({ botMessageType: y, ctaType: s, ctaTargetId: C, subCtaTargetTable: b, subCtaTargetId: v });
|
|
36
|
+
return F(() => {
|
|
35
37
|
u && (l == null || l());
|
|
36
38
|
}, [u, l]), /* @__PURE__ */ t(
|
|
37
39
|
n,
|
|
@@ -43,10 +45,10 @@ function A({
|
|
|
43
45
|
pl: 4,
|
|
44
46
|
pr: 4,
|
|
45
47
|
flexDirection: a ? "row" : "row-reverse",
|
|
46
|
-
...
|
|
48
|
+
...B,
|
|
47
49
|
inlineCSS: {
|
|
48
50
|
overflowAnchor: "none",
|
|
49
|
-
...
|
|
51
|
+
...I
|
|
50
52
|
},
|
|
51
53
|
children: [
|
|
52
54
|
/* @__PURE__ */ r(e, { visuallyHidden: !0, children: "안내" }),
|
|
@@ -66,7 +68,7 @@ function A({
|
|
|
66
68
|
variant: "c5B",
|
|
67
69
|
"aria-hidden": !0,
|
|
68
70
|
inlineCSS: {
|
|
69
|
-
color:
|
|
71
|
+
color: j.primary.text
|
|
70
72
|
},
|
|
71
73
|
children: h
|
|
72
74
|
}
|
|
@@ -81,7 +83,7 @@ function A({
|
|
|
81
83
|
inlineCSS: {
|
|
82
84
|
whiteSpace: "nowrap"
|
|
83
85
|
},
|
|
84
|
-
children:
|
|
86
|
+
children: K(w).format("A h:mm")
|
|
85
87
|
}
|
|
86
88
|
)
|
|
87
89
|
]
|
|
@@ -102,7 +104,7 @@ function A({
|
|
|
102
104
|
},
|
|
103
105
|
children: [
|
|
104
106
|
g && /* @__PURE__ */ r(
|
|
105
|
-
|
|
107
|
+
G,
|
|
106
108
|
{
|
|
107
109
|
src: g,
|
|
108
110
|
width: 32,
|
|
@@ -112,7 +114,7 @@ function A({
|
|
|
112
114
|
}
|
|
113
115
|
),
|
|
114
116
|
/* @__PURE__ */ t(n, { flexDirection: "column", children: [
|
|
115
|
-
/* @__PURE__ */ r(e, { tag: "p", variant: "h4B", children:
|
|
117
|
+
/* @__PURE__ */ r(e, { tag: "p", variant: "h4B", children: T }),
|
|
116
118
|
p && /* @__PURE__ */ r(
|
|
117
119
|
e,
|
|
118
120
|
{
|
|
@@ -132,7 +134,7 @@ function A({
|
|
|
132
134
|
flexDirection: "column",
|
|
133
135
|
inlineCSS: {
|
|
134
136
|
borderRadius: d.content(2),
|
|
135
|
-
backgroundColor:
|
|
137
|
+
backgroundColor: D.primary
|
|
136
138
|
},
|
|
137
139
|
children: [
|
|
138
140
|
/* @__PURE__ */ t(e, { tag: "dl", children: [
|
|
@@ -145,16 +147,16 @@ function A({
|
|
|
145
147
|
] }),
|
|
146
148
|
/* @__PURE__ */ t(e, { tag: "dl", children: [
|
|
147
149
|
/* @__PURE__ */ r(e, { tag: "dt", visuallyHidden: !0, children: "돌봄 유형" }),
|
|
148
|
-
/* @__PURE__ */ r(e, { tag: "dd", variant: "b4R", color: "grey.70", children:
|
|
150
|
+
/* @__PURE__ */ r(e, { tag: "dd", variant: "b4R", color: "grey.70", children: k })
|
|
149
151
|
] })
|
|
150
152
|
]
|
|
151
153
|
}
|
|
152
154
|
),
|
|
153
155
|
x && /* @__PURE__ */ r(
|
|
154
|
-
|
|
156
|
+
L,
|
|
155
157
|
{
|
|
156
158
|
color: "secondary",
|
|
157
|
-
onClick:
|
|
159
|
+
onClick: H,
|
|
158
160
|
inlineCSS: {
|
|
159
161
|
marginTop: d.content(2)
|
|
160
162
|
},
|
|
@@ -170,5 +172,5 @@ function A({
|
|
|
170
172
|
);
|
|
171
173
|
}
|
|
172
174
|
export {
|
|
173
|
-
|
|
175
|
+
O as default
|
|
174
176
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { default as BotMessage, BotMessageCtaType, BotMessageOffer, BotMessageProps, BotMessageType } from './BotMessage';
|
|
1
|
+
import { default as BotMessage, BotMessageCtaType, BotMessageOffer, BotMessageProps, BotMessageSubCtaType, BotMessageType } from './BotMessage';
|
|
2
2
|
export { getClassInfo, getCtaButtonText, getBotMessageLabel } from './BotMessage.utils';
|
|
3
|
-
export type { BotMessageProps, BotMessageCtaType, BotMessageType, BotMessageOffer };
|
|
3
|
+
export type { BotMessageProps, BotMessageCtaType, BotMessageType, BotMessageOffer, BotMessageSubCtaType };
|
|
4
4
|
export default BotMessage;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
export interface DirectTradeRiskInfoBottomSheetProps {
|
|
2
|
+
target: 'parent' | 'teacher';
|
|
2
3
|
open: boolean;
|
|
3
4
|
onClose: () => void;
|
|
4
5
|
onInquire: () => void;
|
|
5
6
|
}
|
|
6
|
-
declare function DirectTradeRiskInfoBottomSheet({ open, onClose, onInquire }: DirectTradeRiskInfoBottomSheetProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
7
|
+
declare function DirectTradeRiskInfoBottomSheet({ target, open, onClose, onInquire }: DirectTradeRiskInfoBottomSheetProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
7
8
|
export default DirectTradeRiskInfoBottomSheet;
|
|
@@ -1,23 +1,29 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { BottomSheet as
|
|
3
|
-
import
|
|
4
|
-
function
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import { jsxs as i, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import { BottomSheet as m, BottomSheetTitle as p, BottomSheetContent as s, Typography as n, Flexbox as o, Icon as a, Button as c, BottomSheetAction as S } from "@dotss/ui";
|
|
3
|
+
import b from "@dotss/ui/core/useTheme";
|
|
4
|
+
function u({
|
|
5
|
+
target: t,
|
|
6
|
+
open: d,
|
|
7
|
+
onClose: l,
|
|
8
|
+
onInquire: h
|
|
8
9
|
}) {
|
|
9
10
|
const {
|
|
10
11
|
palette: { background: g },
|
|
11
12
|
spacing: r
|
|
12
|
-
} =
|
|
13
|
-
return /* @__PURE__ */
|
|
14
|
-
/* @__PURE__ */ e(
|
|
15
|
-
/* @__PURE__ */
|
|
16
|
-
/* @__PURE__ */ n
|
|
17
|
-
/* @__PURE__ */ e(
|
|
13
|
+
} = b();
|
|
14
|
+
return /* @__PURE__ */ i(m, { id: "system-message-action", open: d, onClose: l, children: [
|
|
15
|
+
/* @__PURE__ */ e(p, { onClose: l, children: "직거래는 왜 하면 안되나요?" }),
|
|
16
|
+
/* @__PURE__ */ i(s, { children: [
|
|
17
|
+
t === "teacher" && /* @__PURE__ */ i(n, { tag: "p", variant: "h3R", textAlign: "center", children: [
|
|
18
|
+
/* @__PURE__ */ e(n, { tag: "strong", variant: "h3B", color: "etc.red", children: "직거래" }),
|
|
18
19
|
", 선생님에게 더 불리한 선택이에요."
|
|
19
20
|
] }),
|
|
20
|
-
/* @__PURE__ */
|
|
21
|
+
t === "parent" && /* @__PURE__ */ i(n, { tag: "p", variant: "h4R", textAlign: "center", children: [
|
|
22
|
+
/* @__PURE__ */ e(n, { tag: "strong", variant: "h4B", color: "etc.red", children: "선생님과 직거래가 적발되면" }),
|
|
23
|
+
/* @__PURE__ */ e("br", {}),
|
|
24
|
+
"사고 발생 시 째깍악어의 도움을 받을 수 없어요"
|
|
25
|
+
] }),
|
|
26
|
+
/* @__PURE__ */ i(
|
|
21
27
|
o,
|
|
22
28
|
{
|
|
23
29
|
tag: "aside",
|
|
@@ -31,34 +37,61 @@ function x({
|
|
|
31
37
|
borderRadius: 12,
|
|
32
38
|
backgroundColor: g.primary
|
|
33
39
|
},
|
|
34
|
-
children:
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
40
|
+
children: [
|
|
41
|
+
t === "parent" && /* @__PURE__ */ i(
|
|
42
|
+
o,
|
|
43
|
+
{
|
|
44
|
+
tag: "ul",
|
|
45
|
+
flexDirection: "column",
|
|
46
|
+
gap: 1,
|
|
47
|
+
inlineCSS: {
|
|
48
|
+
listStyle: "none",
|
|
49
|
+
padding: 0,
|
|
50
|
+
paddingLeft: r.content(2),
|
|
51
|
+
"& li:before": {
|
|
52
|
+
content: '"•"',
|
|
53
|
+
display: "inline-block",
|
|
54
|
+
maxWidth: 4,
|
|
55
|
+
fontSize: 18,
|
|
56
|
+
marginRight: r.content(2)
|
|
57
|
+
}
|
|
58
|
+
},
|
|
59
|
+
children: [
|
|
60
|
+
/* @__PURE__ */ e(n, { tag: "li", variant: "b4R", color: "grey.70", children: "선생님과의 갈등 및 문제 발생시 째깍악어로부터 어떠한 도움이나 중재를 받으실 수 없고" }),
|
|
61
|
+
/* @__PURE__ */ e(n, { tag: "li", variant: "b4R", color: "grey.70", children: "배상책임보험에 가입되지 않아 아이 안전사고 발생 시 보장받기 어려우며" }),
|
|
62
|
+
/* @__PURE__ */ e(n, { tag: "li", variant: "b4R", color: "grey.70", children: "영업 방해로 간주되어, 법적 조치가 이루어집니다 (약관 제 42조)" })
|
|
63
|
+
]
|
|
64
|
+
}
|
|
65
|
+
),
|
|
66
|
+
t === "teacher" && /* @__PURE__ */ i(
|
|
67
|
+
o,
|
|
68
|
+
{
|
|
69
|
+
tag: "ul",
|
|
70
|
+
flexDirection: "column",
|
|
71
|
+
gap: 1,
|
|
72
|
+
inlineCSS: {
|
|
73
|
+
listStyle: "none",
|
|
74
|
+
padding: 0,
|
|
75
|
+
paddingLeft: r.content(2),
|
|
76
|
+
"& li:before": {
|
|
77
|
+
content: '"•"',
|
|
78
|
+
display: "inline-block",
|
|
79
|
+
maxWidth: 4,
|
|
80
|
+
fontSize: 18,
|
|
81
|
+
marginRight: r.content(2)
|
|
82
|
+
}
|
|
83
|
+
},
|
|
84
|
+
children: [
|
|
85
|
+
/* @__PURE__ */ e(n, { tag: "li", variant: "b4R", color: "grey.70", children: "부모님과의 갈등, 수업 취소, 아이 안전사고 발생 시 째깍악어로부터 어떠한 도움도 받을 수 없으며" }),
|
|
86
|
+
/* @__PURE__ */ e(n, { tag: "li", variant: "b4R", color: "grey.70", children: "직거래가 적발될 경우 경고 없이 활동이 어렵고 바로 계약이 해지돼요" }),
|
|
87
|
+
/* @__PURE__ */ e(n, { tag: "li", variant: "b4R", color: "grey.70", children: "또한, 영업 방해로 간주되어 법적 조치가 진행될 수 있어요" })
|
|
88
|
+
]
|
|
89
|
+
}
|
|
90
|
+
)
|
|
91
|
+
]
|
|
59
92
|
}
|
|
60
93
|
),
|
|
61
|
-
/* @__PURE__ */
|
|
94
|
+
/* @__PURE__ */ i(
|
|
62
95
|
o,
|
|
63
96
|
{
|
|
64
97
|
tag: "section",
|
|
@@ -78,10 +111,11 @@ function x({
|
|
|
78
111
|
inlineCSS: { flexShrink: 0 }
|
|
79
112
|
}
|
|
80
113
|
),
|
|
81
|
-
/* @__PURE__ */ n
|
|
82
|
-
"부모님의 직거래 제안이 왔나요? 당황하지 마시고 째깍악어 운영본부에 알려주세요.",
|
|
114
|
+
/* @__PURE__ */ i(n, { tag: "p", variant: "b4R", color: "etc.orange", children: [
|
|
115
|
+
t === "teacher" && "부모님의 직거래 제안이 왔나요? 당황하지 마시고 째깍악어 운영본부에 알려주세요.",
|
|
116
|
+
t === "parent" && "선생님의 직거래 제안이 왔나요? 당황하지 마시고 째깍악어 운영팀에 알려주세요.",
|
|
83
117
|
/* @__PURE__ */ e(
|
|
84
|
-
|
|
118
|
+
n,
|
|
85
119
|
{
|
|
86
120
|
tag: "span",
|
|
87
121
|
"aria-hidden": !0,
|
|
@@ -93,13 +127,13 @@ function x({
|
|
|
93
127
|
)
|
|
94
128
|
] }),
|
|
95
129
|
/* @__PURE__ */ e(
|
|
96
|
-
|
|
130
|
+
c,
|
|
97
131
|
{
|
|
98
132
|
variant: "text",
|
|
99
133
|
size: "xSmall",
|
|
100
134
|
color: "secondary",
|
|
101
135
|
endAdornment: /* @__PURE__ */ e(a, { name: "ChevronRightLine" }),
|
|
102
|
-
onClick:
|
|
136
|
+
onClick: h,
|
|
103
137
|
inlineCSS: {
|
|
104
138
|
position: "absolute",
|
|
105
139
|
right: 0,
|
|
@@ -112,9 +146,9 @@ function x({
|
|
|
112
146
|
}
|
|
113
147
|
)
|
|
114
148
|
] }),
|
|
115
|
-
/* @__PURE__ */ e(
|
|
149
|
+
/* @__PURE__ */ e(S, { children: /* @__PURE__ */ e(c, { size: "large", onClick: l, children: "이해했어요" }) })
|
|
116
150
|
] });
|
|
117
151
|
}
|
|
118
152
|
export {
|
|
119
|
-
|
|
153
|
+
u as default
|
|
120
154
|
};
|
|
@@ -7,9 +7,17 @@ export interface SystemMessageProps extends Omit<FlexboxProps, 'id'> {
|
|
|
7
7
|
ctaType?: SystemMessageCtaType | null;
|
|
8
8
|
ctaTargetTable?: string | null;
|
|
9
9
|
ctaTargetId?: number | null;
|
|
10
|
+
subCtaTargetTable?: string | null;
|
|
11
|
+
subCtaTargetId?: number | null;
|
|
10
12
|
content: string;
|
|
11
|
-
onAction?: (
|
|
13
|
+
onAction?: (params: {
|
|
14
|
+
systemMessageType: SystemMessageType;
|
|
15
|
+
ctaType?: SystemMessageCtaType | null;
|
|
16
|
+
ctaTargetId?: number | null;
|
|
17
|
+
subCtaTargetTable?: string | null;
|
|
18
|
+
subCtaTargetId?: number | null;
|
|
19
|
+
}) => void;
|
|
12
20
|
onView?: () => void;
|
|
13
21
|
}
|
|
14
|
-
declare function SystemMessage({ children, ref, id, systemMessageType, content, ctaType, ctaTargetId, onAction, onView, inlineCSS, ...props }: SystemMessageProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
22
|
+
declare function SystemMessage({ children, ref, id, systemMessageType, content, ctaType, ctaTargetId, subCtaTargetTable, subCtaTargetId, onAction, onView, inlineCSS, ...props }: SystemMessageProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
15
23
|
export default SystemMessage;
|
|
@@ -1,27 +1,29 @@
|
|
|
1
|
-
import { jsx as e, jsxs as c, Fragment as
|
|
2
|
-
import { useRef as
|
|
3
|
-
import { Flexbox as d, Typography as o, Button as
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
function
|
|
7
|
-
children:
|
|
1
|
+
import { jsx as e, jsxs as c, Fragment as R } from "react/jsx-runtime";
|
|
2
|
+
import { useRef as v, useImperativeHandle as D, useEffect as k } from "react";
|
|
3
|
+
import { Flexbox as d, Typography as o, Button as y, Icon as E } from "@dotss/ui";
|
|
4
|
+
import I from "@dotss/ui/core/useTheme";
|
|
5
|
+
import T from "../../../hooks/useInView/useInView.mjs";
|
|
6
|
+
function L({
|
|
7
|
+
children: W,
|
|
8
8
|
ref: m,
|
|
9
|
-
id:
|
|
9
|
+
id: _,
|
|
10
10
|
systemMessageType: a,
|
|
11
11
|
content: p,
|
|
12
12
|
ctaType: l,
|
|
13
13
|
ctaTargetId: h,
|
|
14
|
+
subCtaTargetTable: u,
|
|
15
|
+
subCtaTargetId: f,
|
|
14
16
|
onAction: i,
|
|
15
17
|
onView: n,
|
|
16
|
-
inlineCSS:
|
|
17
|
-
...
|
|
18
|
+
inlineCSS: g,
|
|
19
|
+
...S
|
|
18
20
|
}) {
|
|
19
21
|
const {
|
|
20
|
-
palette: { grey:
|
|
21
|
-
} =
|
|
22
|
-
|
|
23
|
-
const { isInView: s } =
|
|
24
|
-
return
|
|
22
|
+
palette: { grey: C, pink: b }
|
|
23
|
+
} = I(), r = v(null);
|
|
24
|
+
D(m, () => r.current);
|
|
25
|
+
const { isInView: s } = T(r), t = ["DIRECT_TRADE_WORD_DETECTED"].includes(a), x = () => i == null ? void 0 : i({ systemMessageType: a, ctaType: l, ctaTargetId: h, subCtaTargetTable: u, subCtaTargetId: f });
|
|
26
|
+
return k(() => {
|
|
25
27
|
s && (n == null || n());
|
|
26
28
|
}, [s, n]), /* @__PURE__ */ e(
|
|
27
29
|
d,
|
|
@@ -31,10 +33,10 @@ function z({
|
|
|
31
33
|
mr: 4,
|
|
32
34
|
pt: 1,
|
|
33
35
|
pb: 1,
|
|
34
|
-
...
|
|
36
|
+
...S,
|
|
35
37
|
inlineCSS: {
|
|
36
38
|
overflowAnchor: "none",
|
|
37
|
-
...
|
|
39
|
+
...g
|
|
38
40
|
},
|
|
39
41
|
children: /* @__PURE__ */ e(
|
|
40
42
|
d,
|
|
@@ -43,7 +45,7 @@ function z({
|
|
|
43
45
|
p: 3,
|
|
44
46
|
inlineCSS: {
|
|
45
47
|
width: "100%",
|
|
46
|
-
backgroundColor: t ?
|
|
48
|
+
backgroundColor: t ? b[10] : C[10],
|
|
47
49
|
borderRadius: 8
|
|
48
50
|
},
|
|
49
51
|
children: /* @__PURE__ */ c(
|
|
@@ -62,7 +64,7 @@ function z({
|
|
|
62
64
|
/* @__PURE__ */ e(o, { tag: "span", variant: "h5B", color: t ? "pink.80" : "grey.60", children: "알림" }),
|
|
63
65
|
" ",
|
|
64
66
|
p,
|
|
65
|
-
l && /* @__PURE__ */ c(
|
|
67
|
+
l && /* @__PURE__ */ c(R, { children: [
|
|
66
68
|
/* @__PURE__ */ e(
|
|
67
69
|
o,
|
|
68
70
|
{
|
|
@@ -75,13 +77,13 @@ function z({
|
|
|
75
77
|
}
|
|
76
78
|
),
|
|
77
79
|
/* @__PURE__ */ e(
|
|
78
|
-
|
|
80
|
+
y,
|
|
79
81
|
{
|
|
80
82
|
variant: "text",
|
|
81
83
|
size: "xSmall",
|
|
82
84
|
color: "secondary",
|
|
83
|
-
endAdornment: /* @__PURE__ */ e(
|
|
84
|
-
onClick:
|
|
85
|
+
endAdornment: /* @__PURE__ */ e(E, { name: "ChevronRightLine" }),
|
|
86
|
+
onClick: x,
|
|
85
87
|
"aria-haspopup": "dialog",
|
|
86
88
|
"aria-controls": "system-message-action",
|
|
87
89
|
inlineCSS: {
|
|
@@ -103,5 +105,5 @@ function z({
|
|
|
103
105
|
);
|
|
104
106
|
}
|
|
105
107
|
export {
|
|
106
|
-
|
|
108
|
+
L as default
|
|
107
109
|
};
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { Flexbox as
|
|
1
|
+
import { jsxs as n, Fragment as i, jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { Flexbox as e, Skeleton as o } from "@dotss/ui";
|
|
3
3
|
import t from "../../../../shared/components/LoadingAnnouncer/LoadingAnnouncer.mjs";
|
|
4
4
|
function c() {
|
|
5
|
-
return /* @__PURE__ */
|
|
6
|
-
/* @__PURE__ */
|
|
7
|
-
/* @__PURE__ */
|
|
5
|
+
return /* @__PURE__ */ n(i, { children: [
|
|
6
|
+
/* @__PURE__ */ r(t, {}),
|
|
7
|
+
/* @__PURE__ */ r(e, { "aria-busy": !0, inlineCSS: { width: "100%", cursor: "wait" }, children: /* @__PURE__ */ r(o, { height: 100, borderRadius: 12, inlineCSS: { width: "100%" } }) })
|
|
8
8
|
] });
|
|
9
9
|
}
|
|
10
10
|
export {
|
|
@@ -3,7 +3,7 @@ import d from "@dotss/ui/core/useTheme";
|
|
|
3
3
|
import r from "@dotss/ui/Flexbox";
|
|
4
4
|
import e from "@dotss/ui/Skeleton";
|
|
5
5
|
import h from "../../../../shared/components/LoadingAnnouncer/LoadingAnnouncer.mjs";
|
|
6
|
-
function
|
|
6
|
+
function S() {
|
|
7
7
|
const { spacing: t } = d();
|
|
8
8
|
return /* @__PURE__ */ n(l, { children: [
|
|
9
9
|
/* @__PURE__ */ i(h, {}),
|
|
@@ -12,7 +12,8 @@ function s() {
|
|
|
12
12
|
{
|
|
13
13
|
tag: "section",
|
|
14
14
|
flexDirection: "column",
|
|
15
|
-
|
|
15
|
+
"aria-busy": !0,
|
|
16
|
+
inlineCSS: { width: "100%", overflow: "hidden", cursor: "wait" },
|
|
16
17
|
children: [
|
|
17
18
|
/* @__PURE__ */ i(
|
|
18
19
|
e,
|
|
@@ -63,5 +64,5 @@ function s() {
|
|
|
63
64
|
] });
|
|
64
65
|
}
|
|
65
66
|
export {
|
|
66
|
-
|
|
67
|
+
S as default
|
|
67
68
|
};
|
|
@@ -1,18 +1,19 @@
|
|
|
1
|
-
import { jsxs as t, Fragment as
|
|
1
|
+
import { jsxs as t, Fragment as o, jsx as i } from "react/jsx-runtime";
|
|
2
2
|
import d from "@dotss/ui/core/useTheme";
|
|
3
|
-
import
|
|
3
|
+
import r from "@dotss/ui/Flexbox";
|
|
4
4
|
import n from "@dotss/ui/Skeleton";
|
|
5
5
|
import h from "../../../../shared/components/LoadingAnnouncer/LoadingAnnouncer.mjs";
|
|
6
6
|
function u() {
|
|
7
7
|
const { spacing: e } = d();
|
|
8
|
-
return /* @__PURE__ */ t(
|
|
8
|
+
return /* @__PURE__ */ t(o, { children: [
|
|
9
9
|
/* @__PURE__ */ i(h, {}),
|
|
10
10
|
/* @__PURE__ */ t(
|
|
11
|
-
|
|
11
|
+
r,
|
|
12
12
|
{
|
|
13
13
|
tag: "section",
|
|
14
14
|
flexDirection: "column",
|
|
15
|
-
|
|
15
|
+
"aria-busy": !0,
|
|
16
|
+
inlineCSS: { width: "100%", overflow: "hidden", cursor: "wait" },
|
|
16
17
|
children: [
|
|
17
18
|
/* @__PURE__ */ i(
|
|
18
19
|
n,
|
|
@@ -25,8 +26,8 @@ function u() {
|
|
|
25
26
|
}
|
|
26
27
|
}
|
|
27
28
|
),
|
|
28
|
-
/* @__PURE__ */ t(
|
|
29
|
-
/* @__PURE__ */ t(
|
|
29
|
+
/* @__PURE__ */ t(r, { flexDirection: "row", gap: 3, ml: 4, children: [
|
|
30
|
+
/* @__PURE__ */ t(r, { flexDirection: "column", children: [
|
|
30
31
|
/* @__PURE__ */ i(n, { width: 240, height: 168, borderRadius: 12 }),
|
|
31
32
|
/* @__PURE__ */ i(
|
|
32
33
|
n,
|
|
@@ -45,7 +46,7 @@ function u() {
|
|
|
45
46
|
}
|
|
46
47
|
)
|
|
47
48
|
] }),
|
|
48
|
-
/* @__PURE__ */ t(
|
|
49
|
+
/* @__PURE__ */ t(r, { flexDirection: "column", children: [
|
|
49
50
|
/* @__PURE__ */ i(n, { width: 240, height: 168, borderRadius: 12 }),
|
|
50
51
|
/* @__PURE__ */ i(
|
|
51
52
|
n,
|
|
@@ -64,7 +65,7 @@ function u() {
|
|
|
64
65
|
}
|
|
65
66
|
)
|
|
66
67
|
] }),
|
|
67
|
-
/* @__PURE__ */ t(
|
|
68
|
+
/* @__PURE__ */ t(r, { flexDirection: "column", children: [
|
|
68
69
|
/* @__PURE__ */ i(n, { width: 240, height: 168, borderRadius: 12 }),
|
|
69
70
|
/* @__PURE__ */ i(
|
|
70
71
|
n,
|