@tipp/ui 2.10.0 → 2.10.1

package/dist/app/roleplay/index.cjs

@@ -3083,6 +3083,7 @@ function ScoreSummary({
 
 // src/app/roleplay/parts/score-trend-section.tsx
 var import_react68 = require("react");
+var import_date_fns4 = require("date-fns");
 
 // src/molecules/expand-table/index.tsx
 var import_react_table2 = require("@tanstack/react-table");
@@ -4316,6 +4317,11 @@ function useTokenColors(vars) {
 
 // src/app/roleplay/parts/score-trend-section.tsx
 var import_jsx_runtime120 = require("react/jsx-runtime");
+function formatDateOnly(iso) {
+  const d = new Date(iso);
+  if (Number.isNaN(d.getTime())) return iso;
+  return (0, import_date_fns4.format)(d, "M/d");
+}
 function Section4({
   title,
   desc,
@@ -4355,7 +4361,7 @@ function AttemptCell({ row }) {
   );
 }
 function DateCell({ row }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(Typo, { as: "span", mono: true, style: { color: "var(--gray-9)" }, variant: "body", children: formatDate(row.original.createdAt) });
+  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(Typo, { as: "span", mono: true, style: { color: "var(--gray-9)" }, variant: "body", children: formatDateOnly(row.original.createdAt) });
 }
 function ScoreCell({ row }) {
   var _a;
@@ -4453,32 +4459,34 @@ function ScoreTrendSection({
   const columns = (0, import_react68.useMemo)(() => {
     const h = (0, import_react_table2.createColumnHelper)();
     return [
+      // autoSize 컬럼에선 size가 최소폭으로 동작(1fr로 늘어남). 모바일(iPhone SE 375px,
+      // 가용 ≈343px)에서 grid 최소폭 합이 화면을 넘지 않도록 작게 잡는다.
       h.display({
         id: "attempt",
         header: "\uD68C\uCC28",
-        size: 120,
-        meta: { autoSize: true, align: "left" },
+        size: 116,
+        meta: { align: "left" },
         cell: AttemptCell
       }),
       h.display({
         id: "date",
         header: "\uB0A0\uC9DC",
-        size: 130,
+        size: 76,
         meta: { align: "left" },
         cell: DateCell
       }),
       h.display({
         id: "score",
         header: "\uCD1D\uC810",
-        size: 80,
+        size: 64,
         meta: { align: "right" },
         cell: ScoreCell
       }),
       h.display({
         id: "delta",
         header: "\uBCC0\uD654",
-        size: 80,
-        meta: { align: "right" },
+        size: 64,
+        meta: { autoSize: true, align: "left" },
         cell: DeltaCell
       })
     ];
@@ -4508,6 +4516,7 @@ function ScoreTrendSection({
             data: rows,
             getRowStyle: (d) => d.isCurrent ? { background: "var(--accent-a2)" } : {},
             showPagination: false,
+            slim: true,
             variant: "sprite"
           }
         ) })