@tipp/ui 2.10.6 → 2.11.0

package/dist/app/roleplay/rp-session-detail.d.cts

@@ -11,7 +11,9 @@ interface RpSessionDetailProps {
     }) => string | Promise<string>;
     onError?: (error: unknown, context: Record<string, unknown>) => void;
     sectionScrollMarginTop?: string;
+    /** 헤더 액션 행(PDF 다운로드·영상)의 '영상' 버튼 우측에 렌더되는 소비자 정의 액션 슬롯(예: website 공유하기 버튼). */
+    headerActions?: React__default.ReactNode;
 }
-declare function RpSessionDetail({ detail, history, isLoading, script, onResolveMediaUrl, onError: _onError, sectionScrollMarginTop, }: RpSessionDetailProps): React__default.ReactElement;
+declare function RpSessionDetail({ detail, history, isLoading, script, onResolveMediaUrl, onError: _onError, sectionScrollMarginTop, headerActions, }: RpSessionDetailProps): React__default.ReactElement;
 
 export { RpSessionDetail, type RpSessionDetailProps };

package/dist/app/roleplay/rp-session-detail.d.ts

@@ -11,7 +11,9 @@ interface RpSessionDetailProps {
     }) => string | Promise<string>;
     onError?: (error: unknown, context: Record<string, unknown>) => void;
     sectionScrollMarginTop?: string;
+    /** 헤더 액션 행(PDF 다운로드·영상)의 '영상' 버튼 우측에 렌더되는 소비자 정의 액션 슬롯(예: website 공유하기 버튼). */
+    headerActions?: React__default.ReactNode;
 }
-declare function RpSessionDetail({ detail, history, isLoading, script, onResolveMediaUrl, onError: _onError, sectionScrollMarginTop, }: RpSessionDetailProps): React__default.ReactElement;
+declare function RpSessionDetail({ detail, history, isLoading, script, onResolveMediaUrl, onError: _onError, sectionScrollMarginTop, headerActions, }: RpSessionDetailProps): React__default.ReactElement;
 
 export { RpSessionDetail, type RpSessionDetailProps };

package/dist/app/roleplay/rp-session-detail.js

@@ -1,14 +1,14 @@
 "use client";
 import {
   RpSessionDetail
-} from "../../chunk-4LFGW6SO.js";
+} from "../../chunk-ORP7UCUU.js";
 import "../../chunk-TFJJKM3W.js";
 import "../../chunk-BTU3IMVG.js";
 import "../../chunk-YHA4OOND.js";
 import "../../chunk-WVY3C64M.js";
 import "../../chunk-5QIT4URV.js";
 import "../../chunk-GA6W62DO.js";
-import "../../chunk-VJREZH2Z.js";
+import "../../chunk-JDCA3TP5.js";
 import "../../chunk-2XDAK4B7.js";
 import "../../chunk-2IRG44IV.js";
 import "../../chunk-DIISQDYA.js";

package/dist/{chunk-VJREZH2Z.js → chunk-JDCA3TP5.js}

@@ -70,7 +70,8 @@ function Header({
   detail,
   hasScript,
   onOpenReplay,
-  onResolveMediaUrl
+  onResolveMediaUrl,
+  actions
 }) {
   var _a;
   const pdfHref = detail.embedLink;
@@ -175,7 +176,8 @@ function Header({
                     /* @__PURE__ */ jsx("span", { style: { whiteSpace: "nowrap" }, children: "\uC601\uC0C1" })
                   ]
                 }
-              ) : null
+              ) : null,
+              actions != null ? actions : null
             ]
           }
         )
@@ -187,4 +189,4 @@ function Header({
 export {
   Header
 };
-//# sourceMappingURL=chunk-VJREZH2Z.js.map
+//# sourceMappingURL=chunk-JDCA3TP5.js.map

package/dist/chunk-JDCA3TP5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/app/roleplay/parts/header.tsx"],"sourcesContent":["'use client';\n\nimport { Badge, Box, Button, Flex, Heading, Typo } from '../../../atoms';\nimport type { RpSessionDetailData } from '../types';\nimport { formatDate, formatDuration, statusLabelOf } from '../utils/session-utils';\n\nexport interface HeaderProps {\n  detail: RpSessionDetailData;\n  hasScript: boolean;\n  onOpenReplay: () => void;\n  onResolveMediaUrl?: (\n    rawUrl: string,\n    options: { disposition: 'inline' | 'attachment' }\n  ) => string | Promise<string>;\n  /** '영상' 버튼 우측에 렌더되는 소비자 정의 액션 슬롯. */\n  actions?: React.ReactNode;\n}\n\nfunction PdfIcon(): React.ReactElement {\n  return (\n    <svg\n      aria-hidden=\"true\"\n      fill=\"none\"\n      height=\"13\"\n      stroke=\"currentColor\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      strokeWidth=\"2\"\n      viewBox=\"0 0 24 24\"\n      width=\"13\"\n    >\n      <path d=\"M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z\" />\n      <path d=\"M14 3v5h5\" />\n      <path d=\"M12 12v5\" />\n      <path d=\"M9.5 14.5 12 17l2.5-2.5\" />\n    </svg>\n  );\n}\n\nfunction VideoIcon(): React.ReactElement {\n  return (\n    <svg\n      aria-hidden=\"true\"\n      fill=\"none\"\n      height=\"13\"\n      stroke=\"currentColor\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      strokeWidth=\"2\"\n      viewBox=\"0 0 24 24\"\n      width=\"13\"\n    >\n      <rect height=\"12\" rx=\"2\" width=\"13\" x=\"2\" y=\"6\" />\n      <path d=\"m15 10 6-3v10l-6-3z\" />\n    </svg>\n  );\n}\n\nexport function Header({\n  detail,\n  hasScript,\n  onOpenReplay,\n  onResolveMediaUrl,\n  actions,\n}: HeaderProps): React.ReactElement {\n  // PDF 산출물은 embedLink(AI 리포트 PDF). trainingLogURL 은 대화 스크립트 JSON 이므로 PDF 가 아니다.\n  const pdfHref = detail.embedLink;\n  const hasReplayMedia = Boolean(\n    detail.trainingVideoURL || detail.trainingAudioURL\n  );\n\n  const handlePdfClick = (): void => {\n    if (!pdfHref || !onResolveMediaUrl) return;\n    void Promise.resolve(\n      onResolveMediaUrl(pdfHref, { disposition: 'attachment' })\n    ).then((url) => {\n      window.open(url, '_blank');\n    });\n  };\n\n  const replayActive = hasScript && hasReplayMedia;\n\n  return (\n    <Box>\n      <Flex\n        align={{ md: 'start' }}\n        direction={{ initial: 'column', md: 'row' }}\n        gap=\"4\"\n        justify=\"between\"\n      >\n        <Box style={{ minWidth: 0 }}>\n          <Flex align=\"center\" gap=\"2\" mb=\"2\" wrap=\"wrap\">\n            <Badge color=\"neutral\" size=\"small\" variant=\"soft\">\n              {statusLabelOf(detail.status)}\n            </Badge>\n            <Typo as=\"span\" color=\"gray\" variant=\"body\">\n              {detail.trainingSessionNum}회차\n              {detail.characterTitle ? ` · ${detail.characterTitle}` : ''}\n            </Typo>\n          </Flex>\n          <Heading\n            size={{ initial: '5', md: '7' }}\n            style={{ textWrap: 'balance' }}\n            weight=\"bold\"\n          >\n            {detail.scenarioTitle ?? '롤플레잉 세션'}\n          </Heading>\n          <Typo as=\"p\" color=\"gray\" mono mt=\"1\" variant=\"body\">\n            {formatDate(detail.createdAt)} · {formatDuration(detail.trainingTime)}\n          </Typo>\n        </Box>\n        <Flex\n          gap=\"2\"\n          justify={{ initial: 'start', md: 'end' }}\n          style={{ flexShrink: 0 }}\n          wrap=\"wrap\"\n        >\n          {onResolveMediaUrl ? (\n            <Button\n              color=\"gray\"\n              disabled={!pdfHref}\n              onClick={pdfHref ? handlePdfClick : undefined}\n              size={{ initial: 'small', md: 'medium' }}\n              title={pdfHref ? undefined : '산출물 없음'}\n              type=\"button\"\n              variant=\"outline\"\n            >\n              <PdfIcon />\n              <span style={{ whiteSpace: 'nowrap' }}>PDF 다운로드</span>\n            </Button>\n          ) : (\n            <Button\n              asChild={Boolean(pdfHref)}\n              color=\"gray\"\n              disabled={!pdfHref}\n              size={{ initial: 'small', md: 'medium' }}\n              title={pdfHref ? undefined : '산출물 없음'}\n              type=\"button\"\n              variant=\"outline\"\n            >\n              {pdfHref ? (\n                <a href={pdfHref} rel=\"noopener noreferrer\" target=\"_blank\">\n                  <PdfIcon />\n                  <span style={{ whiteSpace: 'nowrap' }}>PDF 다운로드</span>\n                </a>\n              ) : (\n                <span>\n                  <PdfIcon />\n                  <span style={{ whiteSpace: 'nowrap' }}>PDF 다운로드</span>\n                </span>\n              )}\n            </Button>\n          )}\n          {hasScript ? (\n            <Button\n              color=\"gray\"\n              disabled={!replayActive}\n              onClick={onOpenReplay}\n              size={{ initial: 'small', md: 'medium' }}\n              title={replayActive ? undefined : '다시보기 없음'}\n              type=\"button\"\n              variant=\"outline\"\n            >\n              <VideoIcon />\n              <span style={{ whiteSpace: 'nowrap' }}>영상</span>\n            </Button>\n          ) : null}\n          {actions ?? null}\n        </Flex>\n      </Flex>\n    </Box>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAoBI,SAWE,KAXF;AAFJ,SAAS,UAA8B;AACrC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAY;AAAA,MACZ,MAAK;AAAA,MACL,QAAO;AAAA,MACP,QAAO;AAAA,MACP,eAAc;AAAA,MACd,gBAAe;AAAA,MACf,aAAY;AAAA,MACZ,SAAQ;AAAA,MACR,OAAM;AAAA,MAEN;AAAA,4BAAC,UAAK,GAAE,8DAA6D;AAAA,QACrE,oBAAC,UAAK,GAAE,aAAY;AAAA,QACpB,oBAAC,UAAK,GAAE,YAAW;AAAA,QACnB,oBAAC,UAAK,GAAE,2BAA0B;AAAA;AAAA;AAAA,EACpC;AAEJ;AAEA,SAAS,YAAgC;AACvC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAY;AAAA,MACZ,MAAK;AAAA,MACL,QAAO;AAAA,MACP,QAAO;AAAA,MACP,eAAc;AAAA,MACd,gBAAe;AAAA,MACf,aAAY;AAAA,MACZ,SAAQ;AAAA,MACR,OAAM;AAAA,MAEN;AAAA,4BAAC,UAAK,QAAO,MAAK,IAAG,KAAI,OAAM,MAAK,GAAE,KAAI,GAAE,KAAI;AAAA,QAChD,oBAAC,UAAK,GAAE,uBAAsB;AAAA;AAAA;AAAA,EAChC;AAEJ;AAEO,SAAS,OAAO;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAoC;AAhEpC;AAkEE,QAAM,UAAU,OAAO;AACvB,QAAM,iBAAiB;AAAA,IACrB,OAAO,oBAAoB,OAAO;AAAA,EACpC;AAEA,QAAM,iBAAiB,MAAY;AACjC,QAAI,CAAC,WAAW,CAAC,kBAAmB;AACpC,SAAK,QAAQ;AAAA,MACX,kBAAkB,SAAS,EAAE,aAAa,aAAa,CAAC;AAAA,IAC1D,EAAE,KAAK,CAAC,QAAQ;AACd,aAAO,KAAK,KAAK,QAAQ;AAAA,IAC3B,CAAC;AAAA,EACH;AAEA,QAAM,eAAe,aAAa;AAElC,SACE,oBAAC,OACC;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,EAAE,IAAI,QAAQ;AAAA,MACrB,WAAW,EAAE,SAAS,UAAU,IAAI,MAAM;AAAA,MAC1C,KAAI;AAAA,MACJ,SAAQ;AAAA,MAER;AAAA,6BAAC,OAAI,OAAO,EAAE,UAAU,EAAE,GACxB;AAAA,+BAAC,QAAK,OAAM,UAAS,KAAI,KAAI,IAAG,KAAI,MAAK,QACvC;AAAA,gCAAC,SAAM,OAAM,WAAU,MAAK,SAAQ,SAAQ,QACzC,wBAAc,OAAO,MAAM,GAC9B;AAAA,YACA,qBAAC,QAAK,IAAG,QAAO,OAAM,QAAO,SAAQ,QAClC;AAAA,qBAAO;AAAA,cAAmB;AAAA,cAC1B,OAAO,iBAAiB,SAAM,OAAO,cAAc,KAAK;AAAA,eAC3D;AAAA,aACF;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,MAAM,EAAE,SAAS,KAAK,IAAI,IAAI;AAAA,cAC9B,OAAO,EAAE,UAAU,UAAU;AAAA,cAC7B,QAAO;AAAA,cAEN,uBAAO,kBAAP,YAAwB;AAAA;AAAA,UAC3B;AAAA,UACA,qBAAC,QAAK,IAAG,KAAI,OAAM,QAAO,MAAI,MAAC,IAAG,KAAI,SAAQ,QAC3C;AAAA,uBAAW,OAAO,SAAS;AAAA,YAAE;AAAA,YAAI,eAAe,OAAO,YAAY;AAAA,aACtE;AAAA,WACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,KAAI;AAAA,YACJ,SAAS,EAAE,SAAS,SAAS,IAAI,MAAM;AAAA,YACvC,OAAO,EAAE,YAAY,EAAE;AAAA,YACvB,MAAK;AAAA,YAEJ;AAAA,kCACC;AAAA,gBAAC;AAAA;AAAA,kBACC,OAAM;AAAA,kBACN,UAAU,CAAC;AAAA,kBACX,SAAS,UAAU,iBAAiB;AAAA,kBACpC,MAAM,EAAE,SAAS,SAAS,IAAI,SAAS;AAAA,kBACvC,OAAO,UAAU,SAAY;AAAA,kBAC7B,MAAK;AAAA,kBACL,SAAQ;AAAA,kBAER;AAAA,wCAAC,WAAQ;AAAA,oBACT,oBAAC,UAAK,OAAO,EAAE,YAAY,SAAS,GAAG,0CAAQ;AAAA;AAAA;AAAA,cACjD,IAEA;AAAA,gBAAC;AAAA;AAAA,kBACC,SAAS,QAAQ,OAAO;AAAA,kBACxB,OAAM;AAAA,kBACN,UAAU,CAAC;AAAA,kBACX,MAAM,EAAE,SAAS,SAAS,IAAI,SAAS;AAAA,kBACvC,OAAO,UAAU,SAAY;AAAA,kBAC7B,MAAK;AAAA,kBACL,SAAQ;AAAA,kBAEP,oBACC,qBAAC,OAAE,MAAM,SAAS,KAAI,uBAAsB,QAAO,UACjD;AAAA,wCAAC,WAAQ;AAAA,oBACT,oBAAC,UAAK,OAAO,EAAE,YAAY,SAAS,GAAG,0CAAQ;AAAA,qBACjD,IAEA,qBAAC,UACC;AAAA,wCAAC,WAAQ;AAAA,oBACT,oBAAC,UAAK,OAAO,EAAE,YAAY,SAAS,GAAG,0CAAQ;AAAA,qBACjD;AAAA;AAAA,cAEJ;AAAA,cAED,YACC;AAAA,gBAAC;AAAA;AAAA,kBACC,OAAM;AAAA,kBACN,UAAU,CAAC;AAAA,kBACX,SAAS;AAAA,kBACT,MAAM,EAAE,SAAS,SAAS,IAAI,SAAS;AAAA,kBACvC,OAAO,eAAe,SAAY;AAAA,kBAClC,MAAK;AAAA,kBACL,SAAQ;AAAA,kBAER;AAAA,wCAAC,aAAU;AAAA,oBACX,oBAAC,UAAK,OAAO,EAAE,YAAY,SAAS,GAAG,0BAAE;AAAA;AAAA;AAAA,cAC3C,IACE;AAAA,cACH,4BAAW;AAAA;AAAA;AAAA,QACd;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;","names":[]}

package/dist/{chunk-4LFGW6SO.js → chunk-ORP7UCUU.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-BTU3IMVG.js";
 import {
   Header
-} from "./chunk-VJREZH2Z.js";
+} from "./chunk-JDCA3TP5.js";
 import {
   SessionReplayDialog
 } from "./chunk-AS3JVRQ3.js";
@@ -83,7 +83,8 @@ function RpSessionDetail({
   script,
   onResolveMediaUrl,
   onError: _onError,
-  sectionScrollMarginTop = "120px"
+  sectionScrollMarginTop = "120px",
+  headerActions
 }) {
   const [replayOpen, setReplayOpen] = useState(false);
   const speechShare = useMemo(
@@ -104,6 +105,7 @@ function RpSessionDetail({
       /* @__PURE__ */ jsx(
         Header,
         {
+          actions: headerActions,
           detail,
           hasScript,
           onOpenReplay: () => {
@@ -139,4 +141,4 @@ function RpSessionDetail({
 export {
   RpSessionDetail
 };
-//# sourceMappingURL=chunk-4LFGW6SO.js.map
+//# sourceMappingURL=chunk-ORP7UCUU.js.map

package/dist/chunk-ORP7UCUU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/app/roleplay/rp-session-detail.tsx"],"sourcesContent":["'use client';\n\nimport React, { useMemo, useState } from 'react';\nimport { Box, Card, Flex, Heading, Progress, Skeleton, Typo } from '../../atoms';\nimport type { RpSessionDetailData, RpSessionHistoryItem, RpSessionScript } from './types';\nimport { parseReportData } from './utils/report-parse';\nimport { computeSpeechShare } from './utils/session-utils';\nimport { Content } from './parts/content';\nimport { Header } from './parts/header';\nimport { SessionReplayDialog } from './parts/session-replay-dialog';\n\n/* ───────────────────────── Public contract ───────────────────────── */\n\nexport interface RpSessionDetailProps {\n  detail: RpSessionDetailData;\n  history: RpSessionHistoryItem[];\n  isLoading?: boolean;\n  script?: RpSessionScript | null;\n  onResolveMediaUrl?: (\n    rawUrl: string,\n    options: { disposition: 'inline' | 'attachment' }\n  ) => string | Promise<string>;\n  onError?: (error: unknown, context: Record<string, unknown>) => void;\n  sectionScrollMarginTop?: string;\n  /** 헤더 액션 행(PDF 다운로드·영상)의 '영상' 버튼 우측에 렌더되는 소비자 정의 액션 슬롯(예: website 공유하기 버튼). */\n  headerActions?: React.ReactNode;\n}\n\n/* ───────────────────────── Skeleton ───────────────────────── */\n\nfunction RpSessionDetailSkeleton(): React.ReactElement {\n  return (\n    <Box py=\"6\">\n      <Flex direction=\"column\" gap=\"6\">\n        <Box>\n          <Skeleton>\n            <Heading size=\"7\">롤플레잉 세션 제목 로딩 중</Heading>\n          </Skeleton>\n          <Box mt=\"2\">\n            <Skeleton>\n              <Typo as=\"p\" variant=\"body\">\n                날짜 · 소요 시간이 로딩되는 영역입니다\n              </Typo>\n            </Skeleton>\n          </Box>\n        </Box>\n        <section>\n          <Skeleton>\n            <Heading size=\"5\">종합 점수</Heading>\n          </Skeleton>\n          <Box mt=\"3\">\n            <Card variant=\"surface\">\n              <Flex align=\"center\" direction=\"column\" gap=\"2\" py=\"3\">\n                <Skeleton>\n                  <Heading size=\"7\">00</Heading>\n                </Skeleton>\n              </Flex>\n            </Card>\n          </Box>\n        </section>\n        <section>\n          <Skeleton>\n            <Heading size=\"5\">평가 지표 요약</Heading>\n          </Skeleton>\n          <Box mt=\"3\">\n            <Flex direction=\"column\" gap=\"3\">\n              {[0, 1, 2].map((i) => (\n                <Skeleton key={i}>\n                  <Typo as=\"p\" variant=\"body\">\n                    평가 지표 항목이 로딩되는 중입니다\n                  </Typo>\n                </Skeleton>\n              ))}\n            </Flex>\n          </Box>\n        </section>\n      </Flex>\n    </Box>\n  );\n}\n\n/* ───────────────────────── Analyzing state ───────────────────────── */\n\nfunction AnalyzingState(): React.ReactElement {\n  return (\n    <Flex\n      align=\"center\"\n      direction=\"column\"\n      justify=\"center\"\n      style={{\n        border: '1px dashed var(--gray-6)',\n        borderRadius: 'var(--radius-3)',\n        background: 'var(--gray-a1)',\n        padding: '40px 24px',\n        textAlign: 'center',\n      }}\n    >\n      <Heading size={{ initial: '4', md: '5' }} weight=\"bold\">\n        AI 분석 중입니다\n      </Heading>\n      <Box mt=\"2\" style={{ maxWidth: '480px' }}>\n        <Typo as=\"p\" variant=\"body\">\n          대화와 산출물은 저장되었고, AI가 지표별 근거와 코칭을 생성하는 중입니다.\n        </Typo>\n      </Box>\n      <Box mt=\"4\" style={{ width: '100%', maxWidth: '280px' }}>\n        <Progress size=\"2\" value={66} />\n      </Box>\n    </Flex>\n  );\n}\n\n/* ───────────────────────── Main component ───────────────────────── */\n\nexport function RpSessionDetail({\n  detail,\n  history,\n  isLoading = false,\n  script,\n  onResolveMediaUrl,\n  onError: _onError,\n  sectionScrollMarginTop = '120px',\n  headerActions,\n}: RpSessionDetailProps): React.ReactElement {\n  const [replayOpen, setReplayOpen] = useState(false);\n\n  // script 미전달 시 발화량 표시 생략. 전달 시 script로 계산.\n  const speechShare = useMemo(\n    () => (script !== null && script !== undefined ? computeSpeechShare(script.items) : null),\n    [script],\n  );\n\n  const report = useMemo(\n    () => parseReportData(detail.reportData, detail.guideline, detail.displayMeta),\n    [detail.reportData, detail.guideline, detail.displayMeta],\n  );\n\n  const hasScript = script !== null && script !== undefined;\n  const isAnalyzing = detail.status === 'analyzing';\n\n  if (isLoading) {\n    return <RpSessionDetailSkeleton />;\n  }\n\n  return (\n    <Box py=\"6\">\n      <Flex direction=\"column\" gap={{ initial: '5', md: '7' }}>\n        <Header\n          actions={headerActions}\n          detail={detail}\n          hasScript={hasScript}\n          onOpenReplay={() => {\n            setReplayOpen(true);\n          }}\n          onResolveMediaUrl={onResolveMediaUrl}\n        />\n\n        {isAnalyzing ? (\n          <AnalyzingState />\n        ) : (\n          <Content\n            detail={detail}\n            history={history}\n            report={report}\n            scrollMarginTop={sectionScrollMarginTop}\n            speechShare={speechShare}\n          />\n        )}\n      </Flex>\n\n      <SessionReplayDialog\n        detail={detail}\n        onOpenChange={setReplayOpen}\n        onResolveMediaUrl={onResolveMediaUrl}\n        open={replayOpen}\n        script={script}\n      />\n    </Box>\n  );\n}\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tipp/ui",
-  "version": "2.10.6",
+  "version": "2.11.0",
   "private": false,
   "type": "module",
   "exports": {

package/src/app/roleplay/parts/header.tsx

@@ -12,6 +12,8 @@ export interface HeaderProps {
     rawUrl: string,
     options: { disposition: 'inline' | 'attachment' }
   ) => string | Promise<string>;
+  /** '영상' 버튼 우측에 렌더되는 소비자 정의 액션 슬롯. */
+  actions?: React.ReactNode;
 }
 
 function PdfIcon(): React.ReactElement {
@@ -59,6 +61,7 @@ export function Header({
   hasScript,
   onOpenReplay,
   onResolveMediaUrl,
+  actions,
 }: HeaderProps): React.ReactElement {
   // PDF 산출물은 embedLink(AI 리포트 PDF). trainingLogURL 은 대화 스크립트 JSON 이므로 PDF 가 아니다.
   const pdfHref = detail.embedLink;
@@ -162,6 +165,7 @@ export function Header({
               <span style={{ whiteSpace: 'nowrap' }}>영상</span>
             </Button>
           ) : null}
+          {actions ?? null}
         </Flex>
       </Flex>
     </Box>

package/src/app/roleplay/rp-session-detail.tsx

@@ -22,6 +22,8 @@ export interface RpSessionDetailProps {
   ) => string | Promise<string>;
   onError?: (error: unknown, context: Record<string, unknown>) => void;
   sectionScrollMarginTop?: string;
+  /** 헤더 액션 행(PDF 다운로드·영상)의 '영상' 버튼 우측에 렌더되는 소비자 정의 액션 슬롯(예: website 공유하기 버튼). */
+  headerActions?: React.ReactNode;
 }
 
 /* ───────────────────────── Skeleton ───────────────────────── */
@@ -118,6 +120,7 @@ export function RpSessionDetail({
   onResolveMediaUrl,
   onError: _onError,
   sectionScrollMarginTop = '120px',
+  headerActions,
 }: RpSessionDetailProps): React.ReactElement {
   const [replayOpen, setReplayOpen] = useState(false);
 
@@ -143,6 +146,7 @@ export function RpSessionDetail({
     <Box py="6">
       <Flex direction="column" gap={{ initial: '5', md: '7' }}>
         <Header
+          actions={headerActions}
           detail={detail}
           hasScript={hasScript}
           onOpenReplay={() => {

package/dist/chunk-4LFGW6SO.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/app/roleplay/rp-session-detail.tsx"],"sourcesContent":["'use client';\n\nimport React, { useMemo, useState } from 'react';\nimport { Box, Card, Flex, Heading, Progress, Skeleton, Typo } from '../../atoms';\nimport type { RpSessionDetailData, RpSessionHistoryItem, RpSessionScript } from './types';\nimport { parseReportData } from './utils/report-parse';\nimport { computeSpeechShare } from './utils/session-utils';\nimport { Content } from './parts/content';\nimport { Header } from './parts/header';\nimport { SessionReplayDialog } from './parts/session-replay-dialog';\n\n/* ───────────────────────── Public contract ───────────────────────── */\n\nexport interface RpSessionDetailProps {\n  detail: RpSessionDetailData;\n  history: RpSessionHistoryItem[];\n  isLoading?: boolean;\n  script?: RpSessionScript | null;\n  onResolveMediaUrl?: (\n    rawUrl: string,\n    options: { disposition: 'inline' | 'attachment' }\n  ) => string | Promise<string>;\n  onError?: (error: unknown, context: Record<string, unknown>) => void;\n  sectionScrollMarginTop?: string;\n}\n\n/* ───────────────────────── Skeleton ───────────────────────── */\n\nfunction RpSessionDetailSkeleton(): React.ReactElement {\n  return (\n    <Box py=\"6\">\n      <Flex direction=\"column\" gap=\"6\">\n        <Box>\n          <Skeleton>\n            <Heading size=\"7\">롤플레잉 세션 제목 로딩 중</Heading>\n          </Skeleton>\n          <Box mt=\"2\">\n            <Skeleton>\n              <Typo as=\"p\" variant=\"body\">\n                날짜 · 소요 시간이 로딩되는 영역입니다\n              </Typo>\n            </Skeleton>\n          </Box>\n        </Box>\n        <section>\n          <Skeleton>\n            <Heading size=\"5\">종합 점수</Heading>\n          </Skeleton>\n          <Box mt=\"3\">\n            <Card variant=\"surface\">\n              <Flex align=\"center\" direction=\"column\" gap=\"2\" py=\"3\">\n                <Skeleton>\n                  <Heading size=\"7\">00</Heading>\n                </Skeleton>\n              </Flex>\n            </Card>\n          </Box>\n        </section>\n        <section>\n          <Skeleton>\n            <Heading size=\"5\">평가 지표 요약</Heading>\n          </Skeleton>\n          <Box mt=\"3\">\n            <Flex direction=\"column\" gap=\"3\">\n              {[0, 1, 2].map((i) => (\n                <Skeleton key={i}>\n                  <Typo as=\"p\" variant=\"body\">\n                    평가 지표 항목이 로딩되는 중입니다\n                  </Typo>\n                </Skeleton>\n              ))}\n            </Flex>\n          </Box>\n        </section>\n      </Flex>\n    </Box>\n  );\n}\n\n/* ───────────────────────── Analyzing state ───────────────────────── */\n\nfunction AnalyzingState(): React.ReactElement {\n  return (\n    <Flex\n      align=\"center\"\n      direction=\"column\"\n      justify=\"center\"\n      style={{\n        border: '1px dashed var(--gray-6)',\n        borderRadius: 'var(--radius-3)',\n        background: 'var(--gray-a1)',\n        padding: '40px 24px',\n        textAlign: 'center',\n      }}\n    >\n      <Heading size={{ initial: '4', md: '5' }} weight=\"bold\">\n        AI 분석 중입니다\n      </Heading>\n      <Box mt=\"2\" style={{ maxWidth: '480px' }}>\n        <Typo as=\"p\" variant=\"body\">\n          대화와 산출물은 저장되었고, AI가 지표별 근거와 코칭을 생성하는 중입니다.\n        </Typo>\n      </Box>\n      <Box mt=\"4\" style={{ width: '100%', maxWidth: '280px' }}>\n        <Progress size=\"2\" value={66} />\n      </Box>\n    </Flex>\n  );\n}\n\n/* ───────────────────────── Main component ───────────────────────── */\n\nexport function RpSessionDetail({\n  detail,\n  history,\n  isLoading = false,\n  script,\n  onResolveMediaUrl,\n  onError: _onError,\n  sectionScrollMarginTop = '120px',\n}: RpSessionDetailProps): React.ReactElement {\n  const [replayOpen, setReplayOpen] = useState(false);\n\n  // script 미전달 시 발화량 표시 생략. 전달 시 script로 계산.\n  const speechShare = useMemo(\n    () => (script !== null && script !== undefined ? computeSpeechShare(script.items) : null),\n    [script],\n  );\n\n  const report = useMemo(\n    () => parseReportData(detail.reportData, detail.guideline, detail.displayMeta),\n    [detail.reportData, detail.guideline, detail.displayMeta],\n  );\n\n  const hasScript = script !== null && script !== undefined;\n  const isAnalyzing = detail.status === 'analyzing';\n\n  if (isLoading) {\n    return <RpSessionDetailSkeleton />;\n  }\n\n  return (\n    <Box py=\"6\">\n      <Flex direction=\"column\" gap={{ initial: '5', md: '7' }}>\n        <Header\n          detail={detail}\n          hasScript={hasScript}\n          onOpenReplay={() => {\n            setReplayOpen(true);\n          }}\n          onResolveMediaUrl={onResolveMediaUrl}\n        />\n\n        {isAnalyzing ? (\n          <AnalyzingState />\n        ) : (\n          <Content\n            detail={detail}\n            history={history}\n            report={report}\n            scrollMarginTop={sectionScrollMarginTop}\n            speechShare={speechShare}\n          />\n        )}\n      </Flex>\n\n      <SessionReplayDialog\n        detail={detail}\n        onOpenChange={setReplayOpen}\n        onResolveMediaUrl={onResolveMediaUrl}\n        open={replayOpen}\n        script={script}\n      />\n    </Box>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-VJREZH2Z.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/app/roleplay/parts/header.tsx"],"sourcesContent":["'use client';\n\nimport { Badge, Box, Button, Flex, Heading, Typo } from '../../../atoms';\nimport type { RpSessionDetailData } from '../types';\nimport { formatDate, formatDuration, statusLabelOf } from '../utils/session-utils';\n\nexport interface HeaderProps {\n  detail: RpSessionDetailData;\n  hasScript: boolean;\n  onOpenReplay: () => void;\n  onResolveMediaUrl?: (\n    rawUrl: string,\n    options: { disposition: 'inline' | 'attachment' }\n  ) => string | Promise<string>;\n}\n\nfunction PdfIcon(): React.ReactElement {\n  return (\n    <svg\n      aria-hidden=\"true\"\n      fill=\"none\"\n      height=\"13\"\n      stroke=\"currentColor\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      strokeWidth=\"2\"\n      viewBox=\"0 0 24 24\"\n      width=\"13\"\n    >\n      <path d=\"M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z\" />\n      <path d=\"M14 3v5h5\" />\n      <path d=\"M12 12v5\" />\n      <path d=\"M9.5 14.5 12 17l2.5-2.5\" />\n    </svg>\n  );\n}\n\nfunction VideoIcon(): React.ReactElement {\n  return (\n    <svg\n      aria-hidden=\"true\"\n      fill=\"none\"\n      height=\"13\"\n      stroke=\"currentColor\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      strokeWidth=\"2\"\n      viewBox=\"0 0 24 24\"\n      width=\"13\"\n    >\n      <rect height=\"12\" rx=\"2\" width=\"13\" x=\"2\" y=\"6\" />\n      <path d=\"m15 10 6-3v10l-6-3z\" />\n    </svg>\n  );\n}\n\nexport function Header({\n  detail,\n  hasScript,\n  onOpenReplay,\n  onResolveMediaUrl,\n}: HeaderProps): React.ReactElement {\n  // PDF 산출물은 embedLink(AI 리포트 PDF). trainingLogURL 은 대화 스크립트 JSON 이므로 PDF 가 아니다.\n  const pdfHref = detail.embedLink;\n  const hasReplayMedia = Boolean(\n    detail.trainingVideoURL || detail.trainingAudioURL\n  );\n\n  const handlePdfClick = (): void => {\n    if (!pdfHref || !onResolveMediaUrl) return;\n    void Promise.resolve(\n      onResolveMediaUrl(pdfHref, { disposition: 'attachment' })\n    ).then((url) => {\n      window.open(url, '_blank');\n    });\n  };\n\n  const replayActive = hasScript && hasReplayMedia;\n\n  return (\n    <Box>\n      <Flex\n        align={{ md: 'start' }}\n        direction={{ initial: 'column', md: 'row' }}\n        gap=\"4\"\n        justify=\"between\"\n      >\n        <Box style={{ minWidth: 0 }}>\n          <Flex align=\"center\" gap=\"2\" mb=\"2\" wrap=\"wrap\">\n            <Badge color=\"neutral\" size=\"small\" variant=\"soft\">\n              {statusLabelOf(detail.status)}\n            </Badge>\n            <Typo as=\"span\" color=\"gray\" variant=\"body\">\n              {detail.trainingSessionNum}회차\n              {detail.characterTitle ? ` · ${detail.characterTitle}` : ''}\n            </Typo>\n          </Flex>\n          <Heading\n            size={{ initial: '5', md: '7' }}\n            style={{ textWrap: 'balance' }}\n            weight=\"bold\"\n          >\n            {detail.scenarioTitle ?? '롤플레잉 세션'}\n          </Heading>\n          <Typo as=\"p\" color=\"gray\" mono mt=\"1\" variant=\"body\">\n            {formatDate(detail.createdAt)} · {formatDuration(detail.trainingTime)}\n          </Typo>\n        </Box>\n        <Flex\n          gap=\"2\"\n          justify={{ initial: 'start', md: 'end' }}\n          style={{ flexShrink: 0 }}\n          wrap=\"wrap\"\n        >\n          {onResolveMediaUrl ? (\n            <Button\n              color=\"gray\"\n              disabled={!pdfHref}\n              onClick={pdfHref ? handlePdfClick : undefined}\n              size={{ initial: 'small', md: 'medium' }}\n              title={pdfHref ? undefined : '산출물 없음'}\n              type=\"button\"\n              variant=\"outline\"\n            >\n              <PdfIcon />\n              <span style={{ whiteSpace: 'nowrap' }}>PDF 다운로드</span>\n            </Button>\n          ) : (\n            <Button\n              asChild={Boolean(pdfHref)}\n              color=\"gray\"\n              disabled={!pdfHref}\n              size={{ initial: 'small', md: 'medium' }}\n              title={pdfHref ? undefined : '산출물 없음'}\n              type=\"button\"\n              variant=\"outline\"\n            >\n              {pdfHref ? (\n                <a href={pdfHref} rel=\"noopener noreferrer\" target=\"_blank\">\n                  <PdfIcon />\n                  <span style={{ whiteSpace: 'nowrap' }}>PDF 다운로드</span>\n                </a>\n              ) : (\n                <span>\n                  <PdfIcon />\n                  <span style={{ whiteSpace: 'nowrap' }}>PDF 다운로드</span>\n                </span>\n              )}\n            </Button>\n          )}\n          {hasScript ? (\n            <Button\n              color=\"gray\"\n              disabled={!replayActive}\n              onClick={onOpenReplay}\n              size={{ initial: 'small', md: 'medium' }}\n              title={replayActive ? undefined : '다시보기 없음'}\n              type=\"button\"\n              variant=\"outline\"\n            >\n              <VideoIcon />\n              <span style={{ whiteSpace: 'nowrap' }}>영상</span>\n            </Button>\n          ) : null}\n        </Flex>\n      </Flex>\n    </Box>\n  );\n}\n"],"mappings":"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","names":[]}