@xbrain-swe/nova-chat-widget 0.1.6 → 0.1.7

package/dist/index.d.cts

@@ -148,7 +148,7 @@ type ViewRenderer = (props: {
 }) => React.ReactNode;
 type ViewRendererMap = Partial<Record<ViewKind, ViewRenderer>>;
 
-declare function XbNovaChat({ viewRenderers, botId, barStyle, panelStyle, backdropStyle, defaultOpen, idleText, onVerdictAction, }: {
+declare function XbNovaChat({ viewRenderers, botId, barStyle, panelStyle, backdropStyle, defaultOpen, idleText, avatarSize, onVerdictAction, }: {
     /** 특정 view만 자체 컴포넌트로 덮어쓰고 싶을 때 — 지정 안 한 view는 기본 렌더러를 쓴다. */
     viewRenderers?: ViewRendererMap;
     /** Provider의 기본 봇 대신 다른 봇과 고정적으로 대화하고 싶을 때. 힌트를 눌러 열면
@@ -167,6 +167,9 @@ declare function XbNovaChat({ viewRenderers, botId, barStyle, panelStyle, backdr
     defaultOpen?: boolean;
     /** 기본(idle) 상태 바 문구. */
     idleText?: string;
+    /** 바(AI 버튼)의 동그란 아바타 지름(px), 기본 28. 바의 접힌 원은 52px이라 44~48이면 원을 거의 채운다.
+     * 채팅 헤더의 아바타는 이 값에 맞춰 24~36px로 따라 커진다. */
+    avatarSize?: number;
     /** 판단 카드의 행동 버튼을 눌렀을 때 — 실제 동작(상담신청 폼 열기, 섹션 스크롤 등)은
      * 소비자가 정한다. SDK는 버튼에 적힌 `action` 문자열을 그대로 넘겨줄 뿐 뜻을 모른다. */
     onVerdictAction?: (action: string) => void;

package/dist/index.d.ts

@@ -148,7 +148,7 @@ type ViewRenderer = (props: {
 }) => React.ReactNode;
 type ViewRendererMap = Partial<Record<ViewKind, ViewRenderer>>;
 
-declare function XbNovaChat({ viewRenderers, botId, barStyle, panelStyle, backdropStyle, defaultOpen, idleText, onVerdictAction, }: {
+declare function XbNovaChat({ viewRenderers, botId, barStyle, panelStyle, backdropStyle, defaultOpen, idleText, avatarSize, onVerdictAction, }: {
     /** 특정 view만 자체 컴포넌트로 덮어쓰고 싶을 때 — 지정 안 한 view는 기본 렌더러를 쓴다. */
     viewRenderers?: ViewRendererMap;
     /** Provider의 기본 봇 대신 다른 봇과 고정적으로 대화하고 싶을 때. 힌트를 눌러 열면
@@ -167,6 +167,9 @@ declare function XbNovaChat({ viewRenderers, botId, barStyle, panelStyle, backdr
     defaultOpen?: boolean;
     /** 기본(idle) 상태 바 문구. */
     idleText?: string;
+    /** 바(AI 버튼)의 동그란 아바타 지름(px), 기본 28. 바의 접힌 원은 52px이라 44~48이면 원을 거의 채운다.
+     * 채팅 헤더의 아바타는 이 값에 맞춰 24~36px로 따라 커진다. */
+    avatarSize?: number;
     /** 판단 카드의 행동 버튼을 눌렀을 때 — 실제 동작(상담신청 폼 열기, 섹션 스크롤 등)은
      * 소비자가 정한다. SDK는 버튼에 적힌 `action` 문자열을 그대로 넘겨줄 뿐 뜻을 모른다. */
     onVerdictAction?: (action: string) => void;

package/dist/index.js

@@ -1476,6 +1476,7 @@ function XbNovaChat({
   backdropStyle,
   defaultOpen = false,
   idleText = "AI\uC5D0\uAC8C \uC774 \uCC28 \uBB3C\uC5B4\uBCF4\uAE30",
+  avatarSize = 28,
   onVerdictAction
 }) {
   const { auth, trackRegistry, factsRegistry, visitorId, clientActionHandlers, theme } = useXbNovaInternal();
@@ -1483,6 +1484,7 @@ function XbNovaChat({
     "--xbnova-accent-1": theme.accentFrom,
     "--xbnova-accent-2": theme.accentTo
   };
+  const headerAvatarSize = Math.min(36, Math.max(24, Math.round(avatarSize * 0.8)));
   const avatarGradientStyle = {
     background: "linear-gradient(135deg, var(--xbnova-accent-1), var(--xbnova-accent-2))"
   };
@@ -1631,7 +1633,8 @@ function XbNovaChat({
                           Avatar,
                           {
                             branding: onboarding?.branding,
-                            className: "h-7 w-7 text-[11px] shadow-md",
+                            size: avatarSize,
+                            className: "shadow-md",
                             gradient: avatarGradientStyle
                           }
                         )
@@ -1679,7 +1682,8 @@ function XbNovaChat({
               Avatar,
               {
                 branding: onboarding?.branding,
-                className: "h-6 w-6 shrink-0 text-[10px]",
+                size: headerAvatarSize,
+                className: "shrink-0",
                 gradient: avatarGradientStyle
               }
             ),
@@ -1797,9 +1801,11 @@ function XbNovaChat({
 }
 function Avatar({
   branding,
-  className,
+  size,
+  className = "",
   gradient
 }) {
+  const box = { width: size, height: size };
   const logoUrl = branding?.logo_url?.trim() ?? "";
   const [failedUrl, setFailedUrl] = useState4("");
   if (logoUrl && failedUrl !== logoUrl) {
@@ -1809,6 +1815,7 @@ function Avatar({
         src: logoUrl,
         alt: "",
         onError: () => setFailedUrl(logoUrl),
+        style: box,
         className: `${className} flex-none rounded-full bg-white object-cover`
       }
     );
@@ -1817,8 +1824,8 @@ function Avatar({
   return /* @__PURE__ */ jsx7(
     "span",
     {
-      className: `${className} flex items-center justify-center rounded-full font-bold text-white`,
-      style: gradient,
+      className: `${className} flex flex-none items-center justify-center rounded-full font-bold text-white`,
+      style: { ...gradient, ...box, fontSize: Math.max(10, Math.round(size * 0.4)) },
       children: text
     }
   );