@sensiblestats/widget-react 0.47.1 → 0.48.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @sensiblestats/widget-react
 
+## 0.48.0
+
+### Minor Changes
+
+- Today-tab fixture rows now read like a scoreboard: the score sits between the two teams instead of after them, a finished match shows FT (MS in Turkish) in place of its kickoff time, and a finished match no longer offers a pin unless it is already pinned.
+
+## 0.47.2
+
+### Patch Changes
+
+- Hide a Today-tab competition group whose every match has been hoisted into the live band, instead of rendering an empty header with a count of 0.
+
 ## 0.47.1
 
 ### Patch Changes

package/dist/index.cjs

@@ -129,6 +129,7 @@ var STRINGS = {
     tabToday: "Today",
     sectionLive: "Live",
     halfTime: "HT",
+    fullTime: "FT",
     staleStates: "Live scores can't be updated \u2014 showing the last known state."
   },
   tr: {
@@ -207,6 +208,7 @@ var STRINGS = {
     tabToday: "Bug\xFCn",
     sectionLive: "Canl\u0131",
     halfTime: "\u0130Y",
+    fullTime: "MS",
     staleStates: "Canl\u0131 skorlar g\xFCncellenemiyor \u2014 son bilinen durum g\xF6steriliyor."
   }
 };
@@ -286,6 +288,7 @@ function normalizeUi(cfg) {
     tabToday: strings.tabToday,
     sectionLive: strings.sectionLive,
     halfTime: strings.halfTime,
+    fullTime: strings.fullTime,
     staleStates: strings.staleStates,
     pinLabel: strings.pinLabel,
     unpinLabel: strings.unpinLabel,
@@ -3784,16 +3787,18 @@ function FixtureRow({ match, state, stale, nowMs, ui, monitor }) {
   const isLive = state?.phase === "live" && !stale && !readingStale;
   const hasScore = (state?.phase === "live" || state?.phase === "fullTime") && typeof state.homeScore === "number" && typeof state.awayScore === "number";
   const ticked = displayMinute(state, nowMs);
-  const when = state?.isHalfTime && !stale ? ui.halfTime : isLive ? ticked ?? "\u2014" : state?.phase === "live" ? "\u2014" : kickoffLabel(match.kickoffUnix);
+  const isFinished = state?.phase === "fullTime";
+  const when = state?.isHalfTime && !stale ? ui.halfTime : isLive ? ticked ?? "\u2014" : state?.phase === "live" ? "\u2014" : isFinished ? ui.fullTime : kickoffLabel(match.kickoffUnix);
+  const pin = { kind: "match", matchId: match.matchId };
+  const showPin = !isFinished || monitor.isPinned(pinKey(pin));
   return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: isLive || state?.isHalfTime ? "ss-w-drow ss-w-drow--live" : "ss-w-drow", children: [
     /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { className: isLive || state?.isHalfTime ? "ss-w-drow-when ss-w-drow-when--live" : "ss-w-drow-when", children: when }),
     /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("span", { className: "ss-w-drow-fx", children: [
       /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Side, { name: match.homeTeamName, crest: match.homeTeamImagePath }),
-      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { className: "ss-w-drow-dash", children: "\u2013" }),
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { className: hasScore ? "ss-w-drow-sc" : "ss-w-drow-sc ss-w-drow-sc--idle", children: hasScore ? `${state.homeScore}\u2013${state.awayScore}` : "\u2013" }),
       /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Side, { name: match.awayTeamName, crest: match.awayTeamImagePath })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { className: hasScore ? "ss-w-drow-sc" : "ss-w-drow-sc ss-w-drow-sc--idle", children: hasScore ? `${state.homeScore}\u2013${state.awayScore}` : "\u2013" }),
-    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(PinToggle, { ui, monitor, pin: { kind: "match", matchId: match.matchId } })
+    showPin ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(PinToggle, { ui, monitor, pin }) : null
   ] });
 }
 
@@ -3802,6 +3807,9 @@ var import_jsx_runtime50 = require("react/jsx-runtime");
 function CompetitionGroup({ group, open, onToggle, states, stale, nowMs, ui, monitor, disambiguate = false }) {
   const own = group.matches.filter((m) => !isTreatedLive(states[m.matchId], stale, nowMs));
   const hasLive = own.length !== group.matches.length;
+  if (own.length === 0) {
+    return null;
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "ss-w-grp", children: [
     /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("button", { type: "button", className: "ss-w-grp-head", "aria-expanded": open, onClick: onToggle, children: [
       /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "ss-w-grp-chev", children: open ? "\u25BE" : "\u25B8" }),
@@ -4783,7 +4791,7 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 .ss-w-grp-count { margin-left: auto; flex: none; font-size: 10.5px; font-weight: 700; color: var(--ss-w-faint); background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); border-radius: 999px; padding: 1px 7px; font-variant-numeric: tabular-nums; }
 .ss-w-grp-body { display: flex; flex-direction: column; padding: 2px 11px 6px; }
 
-.ss-w-drow { display: grid; grid-template-columns: 42px minmax(0,1fr) auto 22px; align-items: center; gap: 9px; padding: 7px 0; border-bottom: 1px solid var(--ss-w-line); }
+.ss-w-drow { display: grid; grid-template-columns: 42px minmax(0,1fr) 22px; align-items: center; gap: 9px; padding: 7px 0; border-bottom: 1px solid var(--ss-w-line); }
 .ss-w-drow:last-child { border-bottom: none; }
 .ss-w-drow-when { font-size: 11px; font-weight: 700; color: var(--ss-w-faint); font-variant-numeric: tabular-nums; }
 .ss-w-drow-when--live { color: var(--ss-w-neg); }
@@ -4792,8 +4800,11 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 .ss-w-drow-fx { display: flex; align-items: center; gap: 6px; min-width: 0; }
 .ss-w-drow-side { display: flex; align-items: center; gap: 5px; min-width: 0; flex: 1 1 0; }
 .ss-w-drow-nm { font-size: 12.5px; font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.ss-w-drow-dash { flex: none; color: var(--ss-w-faint); font-size: 11px; }
-.ss-w-drow-sc { font-size: 12.5px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--ss-w-ink); }
+/* Centre slot of .ss-w-drow-fx, between the two sides: flex:none so a widening score never
+   steals width the team names need to avoid ellipsis. min-width holds the slot at the width of a
+   one-digit scoreline so an unscored row's bare dash does not pull the column out of line -- the
+   scores read as a column down the list, not a jitter. */
+.ss-w-drow-sc { flex: none; min-width: 26px; text-align: center; font-size: 12.5px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--ss-w-ink); }
 .ss-w-drow-sc--idle { color: var(--ss-w-faint); font-weight: 600; }
 .ss-w-drow--live { background: color-mix(in srgb, var(--ss-w-neg) 5%, transparent); border-radius: 8px; padding: 7px 6px; margin: 0 -6px; border-bottom: none; }
 .ss-w-drow-crest { width: 16px; height: 16px; flex: none; border-radius: 50%; object-fit: contain; background: var(--ss-w-bubble); }