@dotss/tictoccroc 0.0.31 → 0.0.33

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 (4) hide show
  1. package/dist/shared/components/ChatKit/InputBar/InputBar.mjs +1 -0
  2. package/dist/teacher/profile/components/ProfileSummary/ProfileSummary.d.ts +3 -2
  3. package/dist/teacher/profile/components/ProfileSummary/ProfileSummary.mjs +109 -78
  4. package/package.json +1 -1
package/dist/shared/components/ChatKit/InputBar/InputBar.mjs CHANGED
@@ -43,6 +43,7 @@ function E({ wrapperProps: i, inlineCSS: g, onSend: a, value: t, ref: u, ...c })
43
43
  flexGrow: 1,
44
44
  inlineCSS: {
45
45
  position: "relative",
46
+ maxWidth: "100%",
46
47
  paddingRight: o.content(12),
47
48
  border: `1px solid ${s[10]}`,
48
49
  borderRadius: 20,
package/dist/teacher/profile/components/ProfileSummary/ProfileSummary.d.ts CHANGED
@@ -5,6 +5,7 @@ export interface ProfileSummaryProps extends FlexboxProps {
5
5
  src: string;
6
6
  placeholder?: ReactNode;
7
7
  status: 'VERIFIED' | 'PENDING' | 'REJECTED' | 'DELETED';
8
+ adornment?: ReactNode;
8
9
  onClick?: (e: MouseEvent<HTMLDivElement> | KeyboardEvent<HTMLDivElement>) => void;
9
10
  };
10
11
  introduction: {
@@ -14,7 +15,7 @@ export interface ProfileSummaryProps extends FlexboxProps {
14
15
  status: 'VERIFIED' | 'PENDING' | 'REJECTED' | 'DELETED';
15
16
  };
16
17
  name: string;
17
- adronment?: ReactNode;
18
+ adornment?: ReactNode;
18
19
  grade?: string;
19
20
  activeHours: number;
20
21
  rating: number;
@@ -22,5 +23,5 @@ export interface ProfileSummaryProps extends FlexboxProps {
22
23
  lastActiveAt?: string;
23
24
  action?: ReactNode;
24
25
  }
25
- declare function ProfileSummary({ avatar, introduction, name, grade, activeHours, rating, reviewCount, adronment, lastActiveAt, action }: ProfileSummaryProps): import("@emotion/react/jsx-runtime").JSX.Element;
26
+ declare function ProfileSummary({ avatar, introduction, name, grade, activeHours, rating, reviewCount, adornment, lastActiveAt, action }: ProfileSummaryProps): import("@emotion/react/jsx-runtime").JSX.Element;
26
27
  export default ProfileSummary;
package/dist/teacher/profile/components/ProfileSummary/ProfileSummary.mjs CHANGED
@@ -1,36 +1,36 @@
1
- import { jsxs as n, jsx as e, Fragment as C } from "react/jsx-runtime";
2
- import { useState as R, useRef as F, useEffect as J } from "react";
1
+ import { jsxs as i, jsx as e, Fragment as C } from "react/jsx-runtime";
2
+ import { useState as I, useRef as F, useEffect as J } from "react";
3
3
  import { Flexbox as r, Typography as t, Icon as d, Label as B, Button as A } from "@dotss/ui";
4
4
  import G from "@dotss/ui/core/useTheme";
5
5
  import K from "dayjs";
6
6
  import O from "../../../../shared/components/Image/Image.mjs";
7
7
  import { getLastActiveText as W } from "./ProfileSummary.utils.mjs";
8
8
  function Y({
9
- avatar: i,
9
+ avatar: n,
10
10
  introduction: l,
11
11
  name: u,
12
- grade: f,
13
- activeHours: S = 0,
12
+ grade: S,
13
+ activeHours: f = 0,
14
14
  rating: h = 0,
15
15
  reviewCount: p = 0,
16
- adronment: L,
16
+ adornment: L,
17
17
  lastActiveAt: x,
18
- action: v
18
+ action: k
19
19
  }) {
20
20
  const {
21
- palette: { background: y, brand: E, etc: k },
21
+ palette: { background: y, brand: w, etc: D },
22
22
  spacing: a
23
- } = G(), [m, D] = R(!1), [z, T] = R(!1), b = F(null), w = S > 0 || p > 0, c = x ? K(x) : null, I = c ? W(c) : null, j = (o) => {
23
+ } = G(), [m, v] = I(!1), [z, T] = I(!1), b = F(null), E = f > 0 || p > 0, c = x ? K(x) : null, R = c ? W(c) : null, j = (o) => {
24
24
  var s, g;
25
25
  switch (o.key) {
26
26
  case "Enter":
27
- o.preventDefault(), (s = i.onClick) == null || s.call(i, o);
27
+ o.preventDefault(), (s = n.onClick) == null || s.call(n, o);
28
28
  break;
29
29
  case " ":
30
- o.preventDefault(), (g = i.onClick) == null || g.call(i, o);
30
+ o.preventDefault(), (g = n.onClick) == null || g.call(n, o);
31
31
  break;
32
32
  }
33
- }, M = () => D((o) => !o);
33
+ }, M = () => v((o) => !o);
34
34
  return J(() => {
35
35
  const o = () => {
36
36
  if (!b.current) return;
@@ -40,7 +40,7 @@ function Y({
40
40
  return o(), window.addEventListener("resize", o), () => {
41
41
  window.removeEventListener("resize", o);
42
42
  };
43
- }, [l.aboutMe]), /* @__PURE__ */ n(
43
+ }, [l.aboutMe]), /* @__PURE__ */ i(
44
44
  r,
45
45
  {
46
46
  tag: "section",
@@ -51,36 +51,30 @@ function Y({
51
51
  width: "100%"
52
52
  },
53
53
  children: [
54
- /* @__PURE__ */ n(r, { alignItems: "center", gap: 4, children: [
55
- /* @__PURE__ */ n(r, { flexDirection: "column", gap: 2, alignItems: "center", justifyContent: "center", children: [
56
- /* @__PURE__ */ n(
54
+ /* @__PURE__ */ i(r, { alignItems: "center", gap: 4, children: [
55
+ /* @__PURE__ */ i(r, { flexDirection: "column", gap: 2, alignItems: "center", justifyContent: "center", children: [
56
+ /* @__PURE__ */ i(
57
57
  r,
58
58
  {
59
- role: typeof i.onClick == "function" ? "button" : void 0,
60
- tabIndex: typeof i.onClick == "function" ? 0 : -1,
59
+ role: typeof n.onClick == "function" ? "button" : void 0,
60
+ tabIndex: typeof n.onClick == "function" ? 0 : -1,
61
61
  onKeyDown: j,
62
- onClick: i.onClick,
62
+ onClick: n.onClick,
63
63
  alignItems: "center",
64
64
  justifyContent: "center",
65
65
  flexDirection: "column",
66
66
  gap: 2,
67
67
  inlineCSS: {
68
68
  position: "relative",
69
- border: "1px solid rgba(0, 0, 0, 0.05)",
70
- borderRadius: 100,
71
- width: 88,
72
- height: 88,
73
- overflow: "hidden",
74
- backgroundColor: y.primary,
75
- cursor: typeof i.onClick == "function" ? "pointer" : void 0
69
+ cursor: typeof n.onClick == "function" ? "pointer" : void 0
76
70
  },
77
71
  children: [
78
- i.src && /* @__PURE__ */ e(
72
+ n.src && /* @__PURE__ */ e(
79
73
  O,
80
74
  {
81
75
  width: 88,
82
76
  height: 88,
83
- src: i.src,
77
+ src: n.src,
84
78
  alt: `${u} 선생님 프로필 이미지`,
85
79
  fit: "cover",
86
80
  borderRadius: 100,
@@ -90,13 +84,20 @@ function Y({
90
84
  }
91
85
  }
92
86
  ),
93
- !i.src && !i.placeholder && /* @__PURE__ */ n(
87
+ n.adornment,
88
+ !n.src && !n.placeholder && /* @__PURE__ */ i(
94
89
  r,
95
90
  {
96
91
  role: "status",
97
92
  flexDirection: "column",
98
93
  alignItems: "center",
99
94
  justifyContent: "center",
95
+ inlineCSS: {
96
+ width: 88,
97
+ height: 88,
98
+ backgroundColor: y.primary,
99
+ borderRadius: 100
100
+ },
100
101
  children: [
101
102
  /* @__PURE__ */ e(
102
103
  t,
@@ -112,8 +113,23 @@ function Y({
112
113
  ]
113
114
  }
114
115
  ),
115
- !i.src && i.placeholder && i.placeholder,
116
- i.status === "REJECTED" && /* @__PURE__ */ n(C, { children: [
116
+ !n.src && n.placeholder && n.placeholder,
117
+ /* @__PURE__ */ e(
118
+ r,
119
+ {
120
+ "aria-hidden": !0,
121
+ inlineCSS: {
122
+ position: "absolute",
123
+ top: 0,
124
+ left: 0,
125
+ width: "100%",
126
+ height: "100%",
127
+ border: "1px solid rgba(0, 0, 0, 0.05)",
128
+ borderRadius: 100
129
+ }
130
+ }
131
+ ),
132
+ n.status === "REJECTED" && /* @__PURE__ */ i(C, { children: [
117
133
  /* @__PURE__ */ e(
118
134
  r,
119
135
  {
@@ -126,6 +142,7 @@ function Y({
126
142
  width: "100%",
127
143
  height: "100%",
128
144
  opacity: 0.8,
145
+ borderRadius: 100,
129
146
  backgroundColor: y.primary,
130
147
  zIndex: 1
131
148
  }
@@ -158,16 +175,16 @@ function Y({
158
175
  variant: "c3M",
159
176
  color: "grey.50",
160
177
  inlineCSS: {
161
- visibility: I ? void 0 : "hidden"
178
+ visibility: R ? void 0 : "hidden"
162
179
  },
163
- children: I || "활동 정보 없음"
180
+ children: R || "활동 정보 없음"
164
181
  }
165
182
  )
166
183
  ] }),
167
- /* @__PURE__ */ n(r, { flexDirection: "column", justifyContent: "flex-start", gap: 3, flexGrow: 1, children: [
168
- /* @__PURE__ */ n(r, { alignItems: "center", gap: 2, flexWrap: "wrap", children: [
169
- f && /* @__PURE__ */ e(B, { variant: "outlined", size: "small", color: "blue", "aria-label": `${f} 등급`, children: f }),
170
- /* @__PURE__ */ n(
184
+ /* @__PURE__ */ i(r, { flexDirection: "column", justifyContent: "flex-start", gap: 3, flexGrow: 1, children: [
185
+ /* @__PURE__ */ i(r, { alignItems: "center", gap: 2, flexWrap: "wrap", children: [
186
+ S && /* @__PURE__ */ e(B, { variant: "outlined", size: "small", color: "blue", "aria-label": `${S} 등급`, children: S }),
187
+ /* @__PURE__ */ i(
171
188
  t,
172
189
  {
173
190
  tag: "p",
@@ -197,7 +214,7 @@ function Y({
197
214
  }
198
215
  )
199
216
  ] }),
200
- /* @__PURE__ */ n(
217
+ /* @__PURE__ */ i(
201
218
  r,
202
219
  {
203
220
  pl: 4,
@@ -207,49 +224,63 @@ function Y({
207
224
  justifyContent: "space-around",
208
225
  alignItems: "center",
209
226
  gap: 5,
210
- "aria-hidden": !w,
227
+ "aria-hidden": !E,
211
228
  inlineCSS: {
212
229
  borderRadius: 8,
213
230
  backgroundColor: y.primary,
214
- visibility: w ? void 0 : "hidden"
231
+ visibility: E ? void 0 : "hidden"
215
232
  },
216
233
  children: [
217
- /* @__PURE__ */ n(r, { alignItems: "center", role: "group", "aria-label": `누적 수업 ${S}시간`, children: [
218
- /* @__PURE__ */ e(d, { name: "TimeLine", size: "xSmall", color: "grey.70" }),
219
- /* @__PURE__ */ e(
220
- t,
221
- {
222
- tag: "p",
223
- variant: "h4B",
224
- inlineCSS: {
225
- marginLeft: a.content(1),
226
- color: E.primary.text
227
- },
228
- children: S.toLocaleString()
229
- }
230
- ),
231
- /* @__PURE__ */ e(
232
- t,
233
- {
234
- tag: "span",
235
- variant: "b5R",
236
- color: "grey.70",
237
- inlineCSS: {
238
- marginLeft: a.content(0.5)
239
- },
240
- children: "시간"
241
- }
242
- )
243
- ] }),
244
- /* @__PURE__ */ n(
234
+ /* @__PURE__ */ i(
235
+ r,
236
+ {
237
+ alignItems: "center",
238
+ role: "group",
239
+ "aria-label": `누적 수업 ${f}시간`,
240
+ inlineCSS: {
241
+ whiteSpace: "nowrap"
242
+ },
243
+ children: [
244
+ /* @__PURE__ */ e(d, { name: "TimeLine", size: "xSmall", color: "grey.70" }),
245
+ /* @__PURE__ */ e(
246
+ t,
247
+ {
248
+ tag: "p",
249
+ variant: "h4B",
250
+ inlineCSS: {
251
+ marginLeft: a.content(1),
252
+ color: w.primary.text
253
+ },
254
+ children: f.toLocaleString()
255
+ }
256
+ ),
257
+ /* @__PURE__ */ e(
258
+ t,
259
+ {
260
+ tag: "span",
261
+ variant: "b5R",
262
+ color: "grey.70",
263
+ inlineCSS: {
264
+ marginLeft: a.content(0.5)
265
+ },
266
+ children: "시간"
267
+ }
268
+ )
269
+ ]
270
+ }
271
+ ),
272
+ /* @__PURE__ */ i(
245
273
  r,
246
274
  {
247
275
  alignItems: "center",
248
276
  role: "group",
249
277
  "aria-label": h > 0 ? `평점 ${h}, 리뷰 ${p}개` : `평점 집계중, 리뷰 ${p}개`,
278
+ inlineCSS: {
279
+ whiteSpace: "nowrap"
280
+ },
250
281
  children: [
251
282
  /* @__PURE__ */ e(d, { name: "ReviewLine", size: "xSmall", color: "grey.70" }),
252
- h > 0 ? /* @__PURE__ */ n(C, { children: [
283
+ h > 0 ? /* @__PURE__ */ i(C, { children: [
253
284
  /* @__PURE__ */ e(
254
285
  t,
255
286
  {
@@ -257,12 +288,12 @@ function Y({
257
288
  variant: "h4B",
258
289
  inlineCSS: {
259
290
  marginLeft: a.content(1),
260
- color: E.primary.text
291
+ color: w.primary.text
261
292
  },
262
293
  children: h.toLocaleString()
263
294
  }
264
295
  ),
265
- /* @__PURE__ */ n(
296
+ /* @__PURE__ */ i(
266
297
  t,
267
298
  {
268
299
  tag: "span",
@@ -298,7 +329,7 @@ function Y({
298
329
  )
299
330
  ] })
300
331
  ] }),
301
- /* @__PURE__ */ n(
332
+ /* @__PURE__ */ i(
302
333
  r,
303
334
  {
304
335
  flexDirection: "column",
@@ -306,7 +337,7 @@ function Y({
306
337
  position: "relative"
307
338
  },
308
339
  children: [
309
- (!l.summary || !l.aboutMe) && !l.placeholder && /* @__PURE__ */ n(
340
+ (!l.summary || !l.aboutMe) && !l.placeholder && /* @__PURE__ */ i(
310
341
  t,
311
342
  {
312
343
  tag: "p",
@@ -315,7 +346,7 @@ function Y({
315
346
  "aria-label": "작성된 프로필 소개가 없어요.",
316
347
  inlineCSS: {
317
348
  "& > span": {
318
- color: k.red
349
+ color: D.red
319
350
  }
320
351
  },
321
352
  children: [
@@ -325,9 +356,9 @@ function Y({
325
356
  }
326
357
  ),
327
358
  (!l.summary || !l.aboutMe) && l.placeholder && l.placeholder,
328
- l.summary && l.aboutMe && /* @__PURE__ */ n(C, { children: [
359
+ l.summary && l.aboutMe && /* @__PURE__ */ i(C, { children: [
329
360
  l.status === "REJECTED" && /* @__PURE__ */ e(t, { role: "status", visuallyHidden: !0, children: "프로필 소개가 반려되었어요. 다시 작성해주세요." }),
330
- /* @__PURE__ */ n(
361
+ /* @__PURE__ */ i(
331
362
  t,
332
363
  {
333
364
  tag: "dl",
@@ -354,7 +385,7 @@ function Y({
354
385
  ]
355
386
  }
356
387
  ),
357
- /* @__PURE__ */ n(
388
+ /* @__PURE__ */ i(
358
389
  t,
359
390
  {
360
391
  ref: b,
@@ -393,7 +424,7 @@ function Y({
393
424
  ]
394
425
  }
395
426
  ),
396
- v
427
+ k
397
428
  ]
398
429
  }
399
430
  );
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@dotss/tictoccroc",
3
3
  "type": "module",
4
- "version": "0.0.31",
4
+ "version": "0.0.33",
5
5
  "description": "Tictoccroc shared components, hooks, utils, and APIs for Dotss",
6
6
  "main": "./dist/index.mjs",
7
7
  "module": "./dist/index.mjs",