@dotss/tictoccroc 0.0.22 → 0.0.24

package/dist/shared/components/Carousel/Carousel.mjs

@@ -13,7 +13,7 @@ function ye({
   renderPagination: z,
   ...C
 }) {
-  const { spacing: $ } = he(), [l, Y] = I(1), [w, ee] = I(0), [te, ne] = I(0), L = p(null), c = p(null), u = p(null), X = p(0), F = p(0), b = p(0), S = p(!1), D = p(!0), k = p(0), v = $.content(K), E = $.content(O), N = Q.toArray(Z).filter(ue).filter((e) => e.type === me), x = N.length, j = (e, t) => {
+  const { spacing: $ } = he(), [l, Y] = I(1), [w, ee] = I(1), [te, ne] = I(0), L = p(null), c = p(null), u = p(null), X = p(0), F = p(0), b = p(0), S = p(!1), D = p(!0), k = p(0), v = $.content(K), E = $.content(O), N = Q.toArray(Z).filter(ue).filter((e) => e.type === me), x = N.length, j = (e, t) => {
     X.current = e, F.current = t;
   }, M = () => {
     var o;

package/dist/shared/components/ChatKit/BotMessage/BotMessage.d.ts

@@ -1,7 +1,8 @@
 import { FlexboxProps } from 'node_modules/@dotss/ui/Flexbox/Flexbox';
-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';
+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' | 'ASSIGNMENT_MATCHING_SUCCEEDED' | 'PARENT_REJECTED_APPLICATION' | 'TEACHER_REFUSED_OFFER' | 'PARENT_CANCELED_MATCHING' | 'TEACHER_CANCELED_MATCHING' | 'TEACHER_COMPLETED_CARE' | 'ADMIN_CANCELED_MATCHING';
 export type BotMessageCtaType = 'MY_CLASS_CHECK' | 'OFFER_CHECK' | 'CHANGE_INFO_CHECK' | 'MY_APPLICATION_INFO_VIEW' | 'CARE_NOTE_CHECK' | 'TEACHER_SELECTION';
-export type BotMessageSubCtaType = 'MATCHING';
+export type BotMessageCtaTargetTable = 'OFFER' | 'MATCHING';
+export type BotMessageSubCtaTargetTable = 'OFFER' | 'MATCHING';
 export interface BotMessageOffer {
     careStartDate: string;
     careStartTime: string;
@@ -14,9 +15,9 @@ export interface BotMessageProps extends Omit<FlexboxProps, 'id' | 'title'> {
     id: string | number;
     botMessageType: BotMessageType;
     ctaType?: BotMessageCtaType | null;
-    ctaTargetTable?: string | null;
+    ctaTargetTable?: BotMessageCtaTargetTable | null;
     ctaTargetId?: number | null;
-    subCtaTargetTable?: BotMessageSubCtaType | null;
+    subCtaTargetTable?: BotMessageSubCtaTargetTable | null;
     subCtaTargetId?: number | null;
     mine: boolean;
     avatarUrl?: string;
@@ -29,10 +30,11 @@ export interface BotMessageProps extends Omit<FlexboxProps, 'id' | 'title'> {
         botMessageType: BotMessageType;
         ctaType?: BotMessageCtaType | null;
         ctaTargetId?: number | null;
-        subCtaTargetTable?: BotMessageSubCtaType | null;
+        ctaTargetTable?: string | null;
+        subCtaTargetTable?: BotMessageSubCtaTargetTable | null;
         subCtaTargetId?: number | null;
     }) => void;
     onView?: () => void;
 }
-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;
+declare function BotMessage({ id, botMessageType, ctaType, ctaTargetId, ctaTargetTable, subCtaTargetTable, subCtaTargetId, mine, avatarUrl, title, content, unreadUserCount, offer, regDatetime, onAction, onView, inlineCSS, ...props }: BotMessageProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export default BotMessage;

package/dist/shared/components/ChatKit/BotMessage/BotMessage.mjs

@@ -1,39 +1,47 @@
 import { jsxs as t, jsx as r } from "react/jsx-runtime";
-import { useRef as E, useEffect as F } from "react";
-import { Flexbox as n, Typography as e, Button as L } from "@dotss/ui";
-import $ from "@dotss/ui/core/useTheme";
-import q from "dayjs";
-import { getClassInfo as z, getCtaButtonText as G } from "./BotMessage.utils.mjs";
-import J from "../../Image/Image.mjs";
-import K from "../../../hooks/useInView/useInView.mjs";
+import { useRef as F, useEffect as L } from "react";
+import { Flexbox as n, Typography as e, Button as $ } from "@dotss/ui";
+import q from "@dotss/ui/core/useTheme";
+import z from "dayjs";
+import { getClassInfo as G, getCtaButtonText as J } from "./BotMessage.utils.mjs";
+import K from "../../Image/Image.mjs";
+import N from "../../../hooks/useInView/useInView.mjs";
 import S from "../../../utils/getCareTypeLabel/getCareTypeLabel.mjs";
-function O({
-  id: N,
+function V({
+  id: P,
   botMessageType: y,
   ctaType: s,
   ctaTargetId: C,
-  subCtaTargetTable: b,
-  subCtaTargetId: v,
+  ctaTargetTable: b,
+  subCtaTargetTable: v,
+  subCtaTargetId: T,
   mine: a,
   avatarUrl: g,
-  title: T,
+  title: R,
   content: p,
   unreadUserCount: h,
-  offer: R,
-  regDatetime: w,
+  offer: w,
+  regDatetime: I,
   onAction: o,
   onView: l,
-  inlineCSS: I,
-  ...B
+  inlineCSS: B,
+  ...j
 }) {
   const {
-    palette: { brand: j, grey: m, background: D },
+    palette: { brand: D, grey: m, background: k },
     spacing: d
-  } = $(), f = E(null), { isInView: u } = K(f), x = G(s), i = R, k = [
+  } = q(), f = F(null), { isInView: u } = N(f), x = J(s), i = w, H = [
     S(i == null ? void 0 : i.firstCareType),
     S(i == null ? void 0 : i.secondCareType)
-  ].filter(Boolean).filter((M) => M !== "-").join("+"), c = z(i), H = () => o == null ? void 0 : o({ botMessageType: y, ctaType: s, ctaTargetId: C, subCtaTargetTable: b, subCtaTargetId: v });
-  return F(() => {
+  ].filter(Boolean).filter((E) => E !== "-").join("+"), c = G(i), M = () => o == null ? void 0 : o({
+    botMessageType: y,
+    ctaType: s,
+    ctaTargetId: C,
+    ctaTargetTable: b,
+    subCtaTargetTable: v,
+    subCtaTargetId: T
+  });
+  return L(() => {
     u && (l == null || l());
   }, [u, l]), /* @__PURE__ */ t(
     n,
@@ -45,10 +53,10 @@ function O({
       pl: 4,
       pr: 4,
       flexDirection: a ? "row" : "row-reverse",
-      ...B,
+      ...j,
       inlineCSS: {
         overflowAnchor: "none",
-        ...I
+        ...B
       },
       children: [
         /* @__PURE__ */ r(e, { visuallyHidden: !0, children: "안내" }),
@@ -68,7 +76,7 @@ function O({
                   variant: "c5B",
                   "aria-hidden": !0,
                   inlineCSS: {
-                    color: j.primary.text
+                    color: D.primary.text
                   },
                   children: h
                 }
@@ -83,7 +91,7 @@ function O({
                   inlineCSS: {
                     whiteSpace: "nowrap"
                   },
-                  children: q(w).format("A h:mm")
+                  children: z(I).format("A h:mm")
                 }
               )
             ]
@@ -104,7 +112,7 @@ function O({
             },
             children: [
               g && /* @__PURE__ */ r(
-                J,
+                K,
                 {
                   src: g,
                   width: 32,
@@ -114,7 +122,7 @@ function O({
                 }
               ),
               /* @__PURE__ */ t(n, { flexDirection: "column", children: [
-                /* @__PURE__ */ r(e, { tag: "p", variant: "h4B", children: T }),
+                /* @__PURE__ */ r(e, { tag: "p", variant: "h4B", children: R }),
                 p && /* @__PURE__ */ r(
                   e,
                   {
@@ -134,7 +142,7 @@ function O({
                     flexDirection: "column",
                     inlineCSS: {
                       borderRadius: d.content(2),
-                      backgroundColor: D.primary
+                      backgroundColor: k.primary
                     },
                     children: [
                       /* @__PURE__ */ t(e, { tag: "dl", children: [
@@ -147,16 +155,16 @@ function O({
                       ] }),
                       /* @__PURE__ */ t(e, { tag: "dl", children: [
                         /* @__PURE__ */ r(e, { tag: "dt", visuallyHidden: !0, children: "돌봄 유형" }),
-                        /* @__PURE__ */ r(e, { tag: "dd", variant: "b4R", color: "grey.70", children: k })
+                        /* @__PURE__ */ r(e, { tag: "dd", variant: "b4R", color: "grey.70", children: H })
                       ] })
                     ]
                   }
                 ),
                 x && /* @__PURE__ */ r(
-                  L,
+                  $,
                   {
                     color: "secondary",
-                    onClick: H,
+                    onClick: M,
                     inlineCSS: {
                       marginTop: d.content(2)
                     },
@@ -172,5 +180,5 @@ function O({
   );
 }
 export {
-  O as default
+  V as default
 };

package/dist/shared/components/ChatKit/BotMessage/index.d.ts

@@ -1,4 +1,4 @@
-import { default as BotMessage, BotMessageCtaType, BotMessageOffer, BotMessageProps, BotMessageSubCtaType, BotMessageType } from './BotMessage';
+import { default as BotMessage, BotMessageCtaTargetTable, BotMessageCtaType, BotMessageOffer, BotMessageProps, BotMessageSubCtaTargetTable, BotMessageType } from './BotMessage';
 export { getClassInfo, getCtaButtonText, getBotMessageLabel } from './BotMessage.utils';
-export type { BotMessageProps, BotMessageCtaType, BotMessageType, BotMessageOffer, BotMessageSubCtaType };
+export type { BotMessageProps, BotMessageCtaType, BotMessageType, BotMessageOffer, BotMessageSubCtaTargetTable, BotMessageCtaTargetTable };
 export default BotMessage;

package/dist/shared/components/ChatKit/Message/Message.fallback.mjs

@@ -1,53 +1,61 @@
-import { jsxs as t, jsx as i } from "react/jsx-runtime";
-import { Flexbox as l, Skeleton as n } from "@dotss/ui";
-import h from "@dotss/ui/core/useTheme";
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import { Flexbox as n, Skeleton as l } from "@dotss/ui";
+import f from "@dotss/ui/core/useTheme";
 function x({
-  mine: e = !1,
-  showAvatar: r = !1,
+  mine: i = !1,
+  showAvatar: t = !1,
   showTime: o = !1,
-  width: s = 200,
-  inlineCSS: a,
-  ...f
+  width: a = 200,
+  inlineCSS: s,
+  ...d
 }) {
-  const { spacing: d } = h();
-  return /* @__PURE__ */ t(
-    l,
+  const { spacing: h } = f();
+  return /* @__PURE__ */ r(
+    n,
     {
       alignItems: "flex-end",
-      flexDirection: e ? "row-reverse" : "row",
+      flexDirection: i ? "row-reverse" : "row",
       pl: 4,
       pr: 4,
       gap: 1,
-      ...f,
+      ...d,
       inlineCSS: {
         overflowAnchor: "none",
-        ...a
+        ...s
       },
       children: [
-        /* @__PURE__ */ t(l, { alignItems: "flex-start", gap: 2.5, children: [
-          !e && r && /* @__PURE__ */ i(n, { width: 32, height: 32, borderRadius: 200 }),
-          /* @__PURE__ */ i(
-            n,
+        /* @__PURE__ */ r(n, { alignItems: "flex-start", gap: 2.5, children: [
+          !i && t && /* @__PURE__ */ e(l, { width: 32, height: 32, borderRadius: 200 }),
+          /* @__PURE__ */ e(
+            l,
             {
-              width: s,
+              width: a,
               height: 38,
               borderRadius: 12,
               inlineCSS: {
-                marginLeft: !e && r ? d.content(10.5) : void 0
+                marginLeft: !i && t ? h.content(10.5) : void 0
               }
             }
           )
         ] }),
-        /* @__PURE__ */ i(
-          l,
+        /* @__PURE__ */ e(
+          n,
           {
             flexDirection: "column",
-            alignItems: e ? "flex-end" : "flex-start",
             inlineCSS: {
-              visibility: o ? "visible" : "hidden",
               whiteSpace: "nowrap"
             },
-            children: /* @__PURE__ */ i(n, { width: 38, height: 12 })
+            children: /* @__PURE__ */ r(n, { flexDirection: "column", alignItems: i ? "flex-end" : "flex-start", gap: 1, children: [
+              /* @__PURE__ */ e(l, { width: 4.49, height: 12 }),
+              /* @__PURE__ */ e(
+                l,
+                {
+                  width: 38,
+                  height: 12,
+                  inlineCSS: { display: o ? "visible" : "hidden" }
+                }
+              )
+            ] })
           }
         )
       ]

package/dist/shared/components/ChatKit/Message/Message.mjs

@@ -1,6 +1,6 @@
 import { jsxs as t, jsx as r, Fragment as O } from "react/jsx-runtime";
 import { useRef as b, useImperativeHandle as q, useEffect as x } from "react";
-import { Flexbox as s, Typography as v, Button as J, Icon as C, Menu as K, MenuBlock as $, CircularProgressIndicator as Q } from "@dotss/ui";
+import { Flexbox as s, Typography as C, Button as J, Icon as I, Menu as K, MenuBlock as P, CircularProgressIndicator as Q } from "@dotss/ui";
 import W from "@dotss/ui/core/useTheme";
 import { useCheckHoverPossible as X } from "@dotss/ui/hooks";
 import { MenuButton as Y } from "@dotss/ui/Menu";
@@ -8,22 +8,22 @@ import Z from "dayjs";
 import _ from "../../Image/Image.mjs";
 import V from "../../../hooks/useInView/useInView.mjs";
 function ar({
-  id: I,
+  id: v,
   content: p = "",
   mine: e = !1,
-  avatarUrl: h = "",
-  unreadUserCount: f = 0,
-  regDatetime: z,
+  avatarUrl: f = "",
+  unreadUserCount: h = 0,
+  regDatetime: $,
   status: n,
   onView: c,
   openMenu: g,
   onCloseMenu: i,
-  onClickMenu: B,
+  onClickMenu: z,
   onResend: u,
   onDelete: S,
-  onViewAll: D,
+  onViewAll: B,
   showAvatar: k,
-  showTime: F,
+  showTime: D,
   ref: R,
   inlineCSS: T,
   ...j
@@ -33,7 +33,7 @@ function ar({
     spacing: w
   } = W(), { isHoverPossible: G } = X(), l = b(null), E = b(null), m = b(null);
   q(R, () => l.current);
-  const L = V(l), N = 300, d = n === "FAILED", P = p.length > N, H = (a) => {
+  const F = V(l), L = 300, d = n === "FAILED", N = p.length > L, H = (a) => {
     a === "resend" ? (i == null || i(), m.current = setTimeout(() => {
       u == null || u();
     }, 200)) : a === "delete" && (i == null || i(), m.current = setTimeout(() => {
@@ -41,8 +41,8 @@ function ar({
     }, 200));
   };
   return x(() => {
-    L && (c == null || c());
-  }, [L, c]), x(() => {
+    F && (c == null || c());
+  }, [F, c]), x(() => {
     var a;
     d && ((a = l == null ? void 0 : l.current) == null || a.scrollIntoView());
   }, [d]), x(() => () => {
@@ -65,15 +65,16 @@ function ar({
       },
       children: [
         /* @__PURE__ */ t(s, { alignItems: "flex-start", gap: 2.5, children: [
-          !e && k && h && /* @__PURE__ */ r(
+          !e && k && f && /* @__PURE__ */ r(
             _,
             {
-              src: h,
+              src: f,
               width: 32,
               height: 32,
               borderRadius: "50%",
               alt: "째깍악어 선생님 심볼",
               role: "presentation",
+              enableFallback: !0,
               style: {
                 objectFit: "cover"
               }
@@ -86,7 +87,7 @@ function ar({
               pb: 2,
               pl: 3,
               pr: 3,
-              ml: !e && !k && h ? 10.5 : void 0,
+              ml: !e && !k && f ? 10.5 : void 0,
               flexDirection: "column",
               gap: 2.5,
               inlineCSS: {
@@ -95,7 +96,7 @@ function ar({
               },
               children: [
                 /* @__PURE__ */ r(
-                  v,
+                  C,
                   {
                     tag: "p",
                     variant: "b3R",
@@ -104,16 +105,16 @@ function ar({
                       whiteSpace: "pre-wrap",
                       wordBreak: "break-all"
                     },
-                    children: P ? p.slice(0, N) + "..." : p
+                    children: N ? p.slice(0, L) + "..." : p
                   }
                 ),
-                P && /* @__PURE__ */ r(
+                N && /* @__PURE__ */ r(
                   J,
                   {
                     variant: "text",
                     size: "xSmall",
-                    endAdornment: /* @__PURE__ */ r(C, { name: "ChevronRightLine" }),
-                    onClick: D,
+                    endAdornment: /* @__PURE__ */ r(I, { name: "ChevronRightLine" }),
+                    onClick: B,
                     inlineCSS: {
                       marginLeft: "auto"
                     },
@@ -130,8 +131,8 @@ function ar({
             {
               ref: E,
               isMenuOpen: !!g,
-              menuId: `message-${I}-menu`,
-              onClick: B,
+              menuId: `message-${v}-menu`,
+              onClick: z,
               size: "xSmall",
               inlineCSS: {
                 padding: w.content(0.5),
@@ -150,7 +151,7 @@ function ar({
               },
               children: [
                 /* @__PURE__ */ r(
-                  C,
+                  I,
                   {
                     name: "ResetLine",
                     size: "xSmall",
@@ -161,7 +162,7 @@ function ar({
                   }
                 ),
                 /* @__PURE__ */ r(
-                  C,
+                  I,
                   {
                     name: "CloseLine",
                     size: "xSmall",
@@ -177,7 +178,7 @@ function ar({
           /* @__PURE__ */ t(
             K,
             {
-              id: `message-${I}-menu`,
+              id: `message-${v}-menu`,
               anchorRef: E,
               open: g,
               onClose: i,
@@ -185,8 +186,8 @@ function ar({
               width: 160,
               placement: "bottom-left",
               children: [
-                /* @__PURE__ */ r($, { value: "resend", children: "재전송" }),
-                /* @__PURE__ */ r($, { value: "delete", children: "삭제" })
+                /* @__PURE__ */ r(P, { value: "resend", children: "재전송" }),
+                /* @__PURE__ */ r(P, { value: "delete", children: "삭제" })
               ]
             }
           )
@@ -200,8 +201,8 @@ function ar({
               whiteSpace: "nowrap"
             },
             children: [
-              e && f > 0 && n === "SUCCEEDED" && /* @__PURE__ */ r(
-                v,
+              e && h > 0 && n === "SUCCEEDED" && /* @__PURE__ */ r(
+                C,
                 {
                   tag: "span",
                   variant: "c5B",
@@ -209,10 +210,10 @@ function ar({
                   inlineCSS: {
                     color: y.primary.text
                   },
-                  children: f
+                  children: h
                 }
               ),
-              e && f > 0 && n === "PENDING" && /* @__PURE__ */ r(
+              e && h > 0 && n === "PENDING" && /* @__PURE__ */ r(
                 Q,
                 {
                   size: "small",
@@ -224,15 +225,15 @@ function ar({
                 }
               ),
               /* @__PURE__ */ r(
-                v,
+                C,
                 {
                   tag: "span",
                   variant: "c5R",
                   color: "etc.dimmed01",
                   inlineCSS: {
-                    visibility: F ? "visible" : "hidden"
+                    display: D ? void 0 : "none"
                   },
-                  children: Z(z).format("A h:mm")
+                  children: Z($).format("A h:mm")
                 }
               )
             ]

package/dist/shared/components/Image/Image.d.ts

@@ -15,9 +15,10 @@ export interface ImageProps extends Omit<HTMLProps<HTMLImageElement>, 'onError'>
     disabledResizing?: boolean;
     withIntrinsicRatio?: boolean;
     wrapperProps?: FlexboxProps;
+    enableBlurPlaceholder?: boolean;
     enableFallback?: boolean;
     enableErrorFallback?: boolean;
-    renderErrorFallback?: (hasError: boolean) => ReactNode;
+    renderErrorFallback?: () => ReactNode;
 }
 declare const Image: import('react').ForwardRefExoticComponent<Omit<ImageProps, "ref"> & import('react').RefAttributes<HTMLImageElement>>;
 export default Image;