@dotss/tictoccroc 0.0.22 → 0.0.23

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,7 @@
 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 BotMessageCtaType = 'MY_CLASS_CHECK' | 'OFFER_CHECK' | 'CHANGE_INFO_CHECK' | 'MY_APPLICATION_INFO_VIEW' | 'CARE_NOTE_CHECK' | 'TEACHER_SELECTION';
-export type BotMessageSubCtaType = 'MATCHING';
+export type BotMessageSubCtaTargetTable = 'MATCHING';
 export interface BotMessageOffer {
     careStartDate: string;
     careStartTime: string;
@@ -16,7 +16,7 @@ export interface BotMessageProps extends Omit<FlexboxProps, 'id' | 'title'> {
     ctaType?: BotMessageCtaType | null;
     ctaTargetTable?: string | null;
     ctaTargetId?: number | null;
-    subCtaTargetTable?: BotMessageSubCtaType | null;
+    subCtaTargetTable?: BotMessageSubCtaTargetTable | null;
     subCtaTargetId?: number | null;
     mine: boolean;
     avatarUrl?: string;
@@ -29,7 +29,7 @@ export interface BotMessageProps extends Omit<FlexboxProps, 'id' | 'title'> {
         botMessageType: BotMessageType;
         ctaType?: BotMessageCtaType | null;
         ctaTargetId?: number | null;
-        subCtaTargetTable?: BotMessageSubCtaType | null;
+        subCtaTargetTable?: BotMessageSubCtaTargetTable | null;
         subCtaTargetId?: number | null;
     }) => void;
     onView?: () => void;

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, 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 };
 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 { useRef as x, useImperativeHandle as q, useEffect as b } from "react";
+import { Flexbox as s, Typography as C, Button as J, Icon as I, Menu as K, MenuBlock as $, 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,11 +8,11 @@ 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,
+  avatarUrl: f = "",
+  unreadUserCount: h = 0,
   regDatetime: z,
   status: n,
   onView: c,
@@ -31,7 +31,7 @@ function ar({
   const {
     palette: { brand: y, grey: o, etc: A },
     spacing: w
-  } = W(), { isHoverPossible: G } = X(), l = b(null), E = b(null), m = b(null);
+  } = W(), { isHoverPossible: G } = X(), l = x(null), E = x(null), m = x(null);
   q(R, () => l.current);
   const L = V(l), N = 300, d = n === "FAILED", P = p.length > N, H = (a) => {
     a === "resend" ? (i == null || i(), m.current = setTimeout(() => {
@@ -40,12 +40,12 @@ function ar({
       S == null || S();
     }, 200));
   };
-  return x(() => {
+  return b(() => {
     L && (c == null || c());
-  }, [L, c]), x(() => {
+  }, [L, c]), b(() => {
     var a;
     d && ((a = l == null ? void 0 : l.current) == null || a.scrollIntoView());
-  }, [d]), x(() => () => {
+  }, [d]), b(() => () => {
     m.current && clearTimeout(m.current);
   }, []), /* @__PURE__ */ t(
     s,
@@ -65,10 +65,10 @@ 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%",
@@ -86,7 +86,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 +95,7 @@ function ar({
               },
               children: [
                 /* @__PURE__ */ r(
-                  v,
+                  C,
                   {
                     tag: "p",
                     variant: "b3R",
@@ -112,7 +112,7 @@ function ar({
                   {
                     variant: "text",
                     size: "xSmall",
-                    endAdornment: /* @__PURE__ */ r(C, { name: "ChevronRightLine" }),
+                    endAdornment: /* @__PURE__ */ r(I, { name: "ChevronRightLine" }),
                     onClick: D,
                     inlineCSS: {
                       marginLeft: "auto"
@@ -130,7 +130,7 @@ function ar({
             {
               ref: E,
               isMenuOpen: !!g,
-              menuId: `message-${I}-menu`,
+              menuId: `message-${v}-menu`,
               onClick: B,
               size: "xSmall",
               inlineCSS: {
@@ -150,7 +150,7 @@ function ar({
               },
               children: [
                 /* @__PURE__ */ r(
-                  C,
+                  I,
                   {
                     name: "ResetLine",
                     size: "xSmall",
@@ -161,7 +161,7 @@ function ar({
                   }
                 ),
                 /* @__PURE__ */ r(
-                  C,
+                  I,
                   {
                     name: "CloseLine",
                     size: "xSmall",
@@ -177,7 +177,7 @@ function ar({
           /* @__PURE__ */ t(
             K,
             {
-              id: `message-${I}-menu`,
+              id: `message-${v}-menu`,
               anchorRef: E,
               open: g,
               onClose: i,
@@ -200,8 +200,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 +209,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,13 +224,13 @@ function ar({
                 }
               ),
               /* @__PURE__ */ r(
-                v,
+                C,
                 {
                   tag: "span",
                   variant: "c5R",
                   color: "etc.dimmed01",
                   inlineCSS: {
-                    visibility: F ? "visible" : "hidden"
+                    display: F ? void 0 : "none"
                   },
                   children: Z(z).format("A h:mm")
                 }

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

@@ -17,7 +17,7 @@ export interface ImageProps extends Omit<HTMLProps<HTMLImageElement>, 'onError'>
     wrapperProps?: FlexboxProps;
     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;

package/dist/shared/components/Image/Image.mjs

@@ -1,4 +1,4 @@
-import { jsxs as L, jsx as d, Fragment as Y } from "react/jsx-runtime";
+import { jsxs as L, jsx as c, Fragment as Y } from "react/jsx-runtime";
 import { forwardRef as Z, useRef as h, useImperativeHandle as w, useState as C, useEffect as R } from "react";
 import { Flexbox as M, Skeleton as U } from "@dotss/ui";
 import F from "../../hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.mjs";
@@ -11,9 +11,9 @@ const k = 100, ot = Z(
     height: o,
     fit: q = "cover",
     position: A = "center",
-    alt: r,
+    alt: E,
     scale: D = 2,
-    onLoad: E,
+    onLoad: r,
     onLazyLoad: g,
     lazy: I = !1,
     borderRadius: l,
@@ -21,21 +21,21 @@ const k = 100, ot = Z(
     withIntrinsicRatio: x = !1,
     enableFallback: T = !1,
     enableErrorFallback: W = !0,
-    renderErrorFallback: c,
+    renderErrorFallback: f,
     wrapperProps: e = {},
     onError: H,
-    ...u
+    ...d
   }, J) => {
-    const a = h(null), $ = h(!1), m = h(null);
+    const u = h(null), $ = h(!1), m = h(null);
     w(J, () => m.current);
-    const [y, K] = C(!1), [O, v] = C(!1), [f, S] = C(!1), j = b({ src: _, width: n, height: o, fit: q, position: A, scale: D, disabledResizing: G }), z = (t) => {
-      v(!0), S(!1), typeof E == "function" && E(t);
+    const [a, K] = C(!1), [O, y] = C(!1), [v, S] = C(!1), j = b({ src: _, width: n, height: o, fit: q, position: A, scale: D, disabledResizing: G }), z = (t) => {
+      y(!0), S(!1), typeof r == "function" && r(t);
     }, B = (t) => {
-      S(!0), v(!1), typeof H == "function" && H(t.nativeEvent);
+      S(!0), y(!1), typeof H == "function" && H(t.nativeEvent);
     };
     return R(() => {
-      if (I && a.current) {
-        const t = a.current, N = () => {
+      if (I && u.current) {
+        const t = u.current, N = () => {
           if (!t) return !1;
           const i = t.getBoundingClientRect();
           return i.bottom >= 0 && i.top <= (window.innerHeight || document.documentElement.clientHeight) + k;
@@ -51,21 +51,21 @@ const k = 100, ot = Z(
         return s(), Q(), X;
       }
     }), R(() => {
-      typeof g == "function" && y && !$.current && ($.current = !0, g());
-    }, [g, y]), F(() => {
+      typeof g == "function" && a && !$.current && ($.current = !0, g());
+    }, [g, a]), F(() => {
       const t = m.current;
-      return t != null && t.complete ? t.naturalWidth > 0 ? (t.style.transition = "none", t.style.opacity = "1", v(!0)) : (t.style.opacity = "0", S(!0)) : t && (t.style.transition = "opacity 0.3s", t.style.opacity = "0", t.onload = () => {
-        t.style.opacity = "1", v(!0), t.onload = null;
+      return t != null && t.complete ? t.naturalWidth > 0 ? (t.style.transition = "none", t.style.opacity = "1", y(!0)) : (t.style.opacity = "0", S(!0)) : t && (t.style.transition = "opacity 0.3s", t.style.opacity = "0", t.onload = () => {
+        t.style.opacity = "1", y(!0), t.onload = null;
       }, t.onerror = () => {
         S(!0), t.onerror = null;
       }), () => {
         t && (t.onload = null, t.onerror = null);
       };
-    }, [y]), I ? /* @__PURE__ */ L(
+    }, [a]), I ? /* @__PURE__ */ L(
       M,
       {
         ...e,
-        ref: a,
+        ref: u,
         inlineCSS: x ? {
           position: "relative",
           paddingTop: `calc(100% / ${n} * ${o})`,
@@ -83,7 +83,7 @@ const k = 100, ot = Z(
           ...e == null ? void 0 : e.inlineCSS
         },
         children: [
-          T && /* @__PURE__ */ d(
+          T && /* @__PURE__ */ c(
             U,
             {
               width: "100%",
@@ -98,19 +98,19 @@ const k = 100, ot = Z(
               }
             }
           ),
-          y && /* @__PURE__ */ L(Y, { children: [
-            /* @__PURE__ */ d(
+          a && /* @__PURE__ */ L(Y, { children: [
+            /* @__PURE__ */ c(
               "img",
               {
                 ref: m,
                 src: j,
-                alt: r,
+                alt: E,
                 width: n,
                 height: o,
                 onLoad: z,
                 onError: B,
-                "aria-hidden": f,
-                ...u,
+                "aria-hidden": v,
+                ...d,
                 style: {
                   position: "absolute",
                   top: 0,
@@ -118,11 +118,11 @@ const k = 100, ot = Z(
                   width: "100%",
                   height: "100%",
                   transition: "opacity 0.3s",
-                  ...u.style
+                  ...d.style
                 }
               }
             ),
-            W && ((c == null ? void 0 : c(f)) || /* @__PURE__ */ d(V, { style: { opacity: f ? 1 : 0, transition: "opacity 0.3s" } }))
+            W && v && ((f == null ? void 0 : f()) || /* @__PURE__ */ c(V, {}))
           ] })
         ]
       }
@@ -130,7 +130,7 @@ const k = 100, ot = Z(
       M,
       {
         ...e,
-        ref: a,
+        ref: u,
         inlineCSS: x ? {
           position: "relative",
           paddingTop: `calc(100% / ${n} * ${o})`,
@@ -149,7 +149,7 @@ const k = 100, ot = Z(
           ...e == null ? void 0 : e.inlineCSS
         },
         children: [
-          T && /* @__PURE__ */ d(
+          T && /* @__PURE__ */ c(
             U,
             {
               width: "100%",
@@ -164,18 +164,18 @@ const k = 100, ot = Z(
               }
             }
           ),
-          /* @__PURE__ */ d(
+          /* @__PURE__ */ c(
             "img",
             {
               ref: m,
               src: j,
-              alt: r,
+              alt: E,
               width: n,
               height: o,
               onLoad: z,
               onError: B,
-              "aria-hidden": f,
-              ...u,
+              "aria-hidden": v,
+              ...d,
               style: {
                 position: "absolute",
                 top: 0,
@@ -183,11 +183,11 @@ const k = 100, ot = Z(
                 width: "100%",
                 height: "100%",
                 transition: "opacity 0.3s",
-                ...u.style
+                ...d.style
               }
             }
           ),
-          W && ((c == null ? void 0 : c(f)) || /* @__PURE__ */ d(V, { style: { opacity: f ? 1 : 0, transition: "opacity 0.3s" } }))
+          W && v && ((f == null ? void 0 : f()) || /* @__PURE__ */ c(V, {}))
         ]
       }
     );

package/dist/shared/components/Swiper/Swiper.mjs

@@ -15,7 +15,7 @@ function vr({
   inlineCSS: S,
   ...w
 }) {
-  const [P, R] = _(E), [s, rr] = _(0), t = f(null), X = f(0), W = f(0), q = f(0), Y = f(0), o = f(!1), d = f(!0), N = f(""), n = f(E), H = f(!1), l = f(null), p = x.count(j), m = x.toArray(j).filter(G).filter((r) => r.type === U || r.type === I), D = p > 1 && !O, tr = x.toArray(m == null ? void 0 : m[0]).filter(G).filter((r) => r.type === U || r.type === I), er = x.toArray(m == null ? void 0 : m[(m == null ? void 0 : m.length) - 1]).filter(G).filter((r) => r.type === U || r.type === I), J = (r, e, i) => {
+  const [P, R] = _(E), [s, rr] = _(1), t = f(null), X = f(0), W = f(0), q = f(0), Y = f(0), o = f(!1), d = f(!0), N = f(""), n = f(E), H = f(!1), l = f(null), p = x.count(j), m = x.toArray(j).filter(G).filter((r) => r.type === U || r.type === I), D = p > 1 && !O, tr = x.toArray(m == null ? void 0 : m[0]).filter(G).filter((r) => r.type === U || r.type === I), er = x.toArray(m == null ? void 0 : m[(m == null ? void 0 : m.length) - 1]).filter(G).filter((r) => r.type === U || r.type === I), J = (r, e, i) => {
     !t.current || !D || (N.current = t.current.style.transform, W.current = r, X.current = r + t.current.offsetWidth * (i + 1), q.current = e);
   }, C = (r, e, i) => {
     if (!t.current || !D || !o.current || !d.current)

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dotss/tictoccroc",
   "type": "module",
-  "version": "0.0.22",
+  "version": "0.0.23",
   "description": "Tictoccroc shared components, hooks, utils, and APIs for Dotss",
   "main": "./dist/index.mjs",
   "module": "./dist/index.mjs",