@tipp/ui 2.10.0 → 2.10.2

package/dist/app/roleplay/parts/section-nav.js

@@ -1,7 +1,7 @@
 "use client";
 import {
   SectionNav
-} from "../../../chunk-NKW6BO5R.js";
+} from "../../../chunk-DIISQDYA.js";
 import "../../../chunk-4YAA25AV.js";
 import "../../../chunk-HBF6IIVZ.js";
 import "../../../chunk-AELKCD6B.js";

package/dist/app/roleplay/parts/session-replay-dialog.cjs

@@ -2289,9 +2289,11 @@ function computeSpeechShare(lines) {
   return { userPct, partnerPct: 100 - userPct };
 }
 
-// src/app/roleplay/parts/script-transcript.tsx
+// src/app/roleplay/parts/speech-share-bar.tsx
 var import_jsx_runtime61 = require("react/jsx-runtime");
-function SpeechShareBar({ share }) {
+function SpeechShareBar({
+  share
+}) {
   const isOvertalking = share.userPct > SPEECH_OVERTALK_THRESHOLD;
   return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_themes7.Box, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_themes23.Flex, { align: "center", justify: "between", mb: "1", children: [
@@ -2300,10 +2302,9 @@ function SpeechShareBar({ share }) {
         {
           as: "span",
           style: {
-            fontSize: "0.75rem",
             color: isOvertalking ? "var(--red-11)" : "var(--accent-11)"
           },
-          variant: "body",
+          variant: "caption",
           weight: "medium",
           children: [
             "\uB0B4 \uBC1C\uD654\uB7C9 ",
@@ -2312,7 +2313,7 @@ function SpeechShareBar({ share }) {
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(Typo, { as: "span", color: "gray", style: { fontSize: "0.75rem" }, variant: "body", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(Typo, { as: "span", color: "gray", variant: "caption", children: [
         "\uC0C1\uB300 ",
         share.partnerPct,
         "%"
@@ -2338,18 +2339,12 @@ function SpeechShareBar({ share }) {
         )
       }
     ),
-    isOvertalking ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
-      Typo,
-      {
-        as: "p",
-        mt: "1",
-        style: { fontSize: "0.75rem", color: "var(--red-11)" },
-        variant: "body",
-        children: "\uC0C1\uB300\uC758 \uB9D0\uC744 \uB354 \uB4E3\uACE0 \uC9C8\uBB38\xB7\uACBD\uCCAD\uC758 \uBE44\uC911\uC744 \uB192\uC5EC \uBCF4\uC138\uC694"
-      }
-    ) : null
+    isOvertalking ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Typo, { as: "p", color: "red", mt: "1", variant: "caption", children: "\uC0C1\uB300\uC758 \uB9D0\uC744 \uB354 \uB4E3\uACE0 \uC9C8\uBB38\xB7\uACBD\uCCAD\uC758 \uBE44\uC911\uC744 \uB192\uC5EC \uBCF4\uC138\uC694" }) : null
   ] });
 }
+
+// src/app/roleplay/parts/script-transcript.tsx
+var import_jsx_runtime62 = require("react/jsx-runtime");
 function ScriptTranscript({
   lines,
   partnerName,
@@ -2359,31 +2354,30 @@ function ScriptTranscript({
   onSeek
 }) {
   const activeIndex = canSync ? lines.reduce((acc, line, i) => line.startMs <= currentMs ? i : acc, -1) : -1;
-  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_themes23.Flex, { direction: "column", gap: "2", style: { minWidth: 0 }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_themes7.Box, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_themes23.Flex, { align: "center", gap: "2", justify: "between", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Typo, { as: "span", variant: "body", weight: "bold", children: "\uB300\uD654 \uC2A4\uD06C\uB9BD\uD2B8" }),
-        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_themes23.Flex, { direction: "column", gap: "2", style: { minWidth: 0 }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_themes7.Box, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_themes23.Flex, { align: "center", gap: "2", justify: "between", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Typo, { as: "span", variant: "body", weight: "bold", children: "\uB300\uD654 \uC2A4\uD06C\uB9BD\uD2B8" }),
+        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
           Typo,
           {
             as: "span",
             color: "gray",
-            style: { fontSize: "0.75rem", flexShrink: 0 },
-            variant: "body",
-            children: canSync ? "\uC7AC\uC0DD \uC704\uCE58\uC5D0 \uB9DE\uCDB0 \uD45C\uC2DC" : "\uD0C0\uC784\uB77C\uC778 \uBE44\uB3D9\uAE30"
+            variant: "caption",
+            children: canSync ? "" : "\uD0C0\uC784\uB77C\uC778 \uAE30\uB2A5 \uC0AC\uC6A9 \uBD88\uAC00"
           }
         )
       ] }),
-      partnerName ? /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(Typo, { as: "p", color: "gray", mt: "1", style: { fontSize: "0.75rem" }, variant: "body", children: [
+      partnerName ? /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Typo, { as: "p", color: "gray", mt: "1", variant: "body", children: [
         "\uC0C1\uB300 \xB7 ",
         partnerName
       ] }) : null,
-      speechShare ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_themes7.Box, { mt: "2", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(SpeechShareBar, { share: speechShare }) }) : null
+      speechShare ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes7.Box, { mt: "2", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(SpeechShareBar, { share: speechShare }) }) : null
     ] }),
-    lines.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Typo, { as: "p", color: "gray", variant: "body", children: "\uB300\uD654 \uC2A4\uD06C\uB9BD\uD2B8\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4." }) : /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_themes7.Box, { style: { maxHeight: 440, overflowY: "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_themes23.Flex, { direction: "column", gap: "1", children: lines.map((line, i) => {
+    lines.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Typo, { as: "p", color: "gray", variant: "body", children: "\uB300\uD654 \uC2A4\uD06C\uB9BD\uD2B8\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4." }) : /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes7.Box, { style: { maxHeight: 440, overflowY: "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes23.Flex, { direction: "column", gap: "1", children: lines.map((line, i) => {
       const isUser = line.speaker === "user";
       const isActive = i === activeIndex;
-      return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
+      return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
         import_themes23.Flex,
         {
           align: "start",
@@ -2399,47 +2393,45 @@ function ScriptTranscript({
             background: isActive ? "var(--accent-a3)" : "transparent"
           },
           children: [
-            canSync ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+            canSync ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
               Typo,
               {
                 as: "span",
                 mono: true,
                 style: {
                   color: isActive ? "var(--accent-11)" : "var(--gray-9)",
-                  fontSize: "0.75rem",
                   flexShrink: 0,
                   minWidth: 32,
                   lineHeight: "1.7"
                 },
-                variant: "body",
+                variant: "caption",
                 children: formatTimestamp(line.startMs)
               }
             ) : null,
-            /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
               Typo,
               {
                 as: "span",
                 style: {
                   color: isUser ? "var(--accent-11)" : "var(--gray-11)",
-                  fontSize: "0.8125rem",
                   flexShrink: 0,
                   minWidth: 28,
                   lineHeight: "1.7",
-                  fontWeight: 700,
                   whiteSpace: "nowrap"
                 },
                 variant: "body",
+                weight: "bold",
                 children: isUser ? "\uB098" : "\uC0C1\uB300"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
               Typo,
               {
                 as: "span",
+                color: "gray",
+                highContrast: isActive,
                 style: {
-                  fontSize: "0.875rem",
-                  lineHeight: "1.7",
-                  color: isActive ? "var(--gray-12)" : "var(--gray-11)"
+                  lineHeight: "1.7"
                 },
                 variant: "body",
                 weight: isActive ? "medium" : void 0,
@@ -2455,7 +2447,7 @@ function ScriptTranscript({
 }
 
 // src/app/roleplay/parts/session-replay-dialog.tsx
-var import_jsx_runtime62 = require("react/jsx-runtime");
+var import_jsx_runtime63 = require("react/jsx-runtime");
 function resolveUrl(raw, disp, resolver) {
   return __async(this, null, function* () {
     if (!raw) return void 0;
@@ -2515,14 +2507,14 @@ function SessionReplayDialog({
       setCurrentMs(el.currentTime * 1e3);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Dialog.Root, { onOpenChange, open, children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Dialog.Content, { maxWidth: "1040px", title: "\uC138\uC158 \uB2E4\uC2DC\uBCF4\uAE30", width: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Dialog.Root, { onOpenChange, open, children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Dialog.Content, { maxWidth: "1040px", title: "\uC138\uC158 \uB2E4\uC2DC\uBCF4\uAE30", width: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
     import_themes24.Grid,
     {
       columns: { initial: "1", md: "minmax(0, 1fr) minmax(0, 1.05fr)" },
       gap: "5",
       mt: "2",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes7.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_themes7.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
           Tabs.Root,
           {
             onValueChange: (v) => {
@@ -2530,11 +2522,11 @@ function SessionReplayDialog({
             },
             value: tab,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Tabs.List, { children: [
-                hasVideo ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Tabs.Trigger, { value: "video", children: "\uC601\uC0C1" }) : null,
-                hasAudio ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Tabs.Trigger, { value: "audio", children: "\uC624\uB514\uC624" }) : null
+              /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(Tabs.List, { children: [
+                hasVideo ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Tabs.Trigger, { value: "video", children: "\uC601\uC0C1" }) : null,
+                hasAudio ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Tabs.Trigger, { value: "audio", children: "\uC624\uB514\uC624" }) : null
               ] }),
-              hasVideo ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Tabs.Content, { value: "video", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+              hasVideo ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Tabs.Content, { value: "video", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
                 import_themes7.Box,
                 {
                   mt: "3",
@@ -2543,7 +2535,7 @@ function SessionReplayDialog({
                     overflow: "hidden",
                     background: "var(--gray-3)"
                   },
-                  children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
                     "video",
                     {
                       controls: true,
@@ -2559,7 +2551,7 @@ function SessionReplayDialog({
                   )
                 }
               ) }) : null,
-              hasAudio ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Tabs.Content, { value: "audio", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes7.Box, { mt: "3", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+              hasAudio ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Tabs.Content, { value: "audio", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_themes7.Box, { mt: "3", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
                 "audio",
                 {
                   controls: true,
@@ -2576,7 +2568,7 @@ function SessionReplayDialog({
             ]
           }
         ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
           ScriptTranscript,
           {
             canSync,