@sensiblestats/widget-react 0.63.0 → 0.65.0

package/dist/styles.css

@@ -74,6 +74,17 @@
   --ss-g-font-body: 'Barlow', system-ui, -apple-system, 'Segoe UI', sans-serif;
 }
 
+/* ── match link (u443) ── a card's team names as a button that opens the operator's match page.
+   The button keeps the wrapped element's own class for its layout. Every one of those classes is
+   declared further down this file, so on equal specificity it wins over this reset: keep this
+   block above them. */
+.ss-w-matchlink { appearance: none; position: relative; width: 100%; padding-right: 16px; background: none; border: 0; border-radius: 6px; font: inherit; color: inherit; text-align: inherit; cursor: pointer; }
+.ss-w-matchlink::after { content: ''; position: absolute; right: 3px; top: 50%; width: 7px; height: 7px; margin-top: -4px; border-top: 1.5px solid var(--ss-w-faint); border-right: 1.5px solid var(--ss-w-faint); transform: rotate(45deg); }
+.ss-w-matchlink:hover::after { border-color: var(--ss-w-accent); }
+.ss-w-matchlink:focus-visible { outline: 2px solid var(--ss-w-accent); outline-offset: 2px; }
+/* The pinned match card centres its score in the card, so it pads both edges alike. */
+.ss-w-mon-main.ss-w-matchlink { padding-left: 16px; }
+
 /* ── games ui kit (u393) ── */
 .ss-g-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
 .ss-g-head { display: flex; align-items: center; gap: 6px; padding: 8px 16px 8px 6px; font-family: var(--ss-g-font-body); }
@@ -341,7 +352,7 @@
 .ss-w-bi-book { font-size: 9.5px; color: var(--ss-w-faint); }
 .ss-w-bi-pick-row .ss-w-slip { flex: none; }
 
-/* row 3: bar-chart glyph + reasoning prose + stats-expander chevron, in a subtle strip */
+/* row 3: bar-chart glyph + reasoning prose, in a subtle strip */
 .ss-w-bi-reason { display: flex; align-items: flex-start; gap: 8px; background: var(--ss-w-bubble); border-radius: 10px; padding: 8px 10px; }
 .ss-w-bi-chart { flex: none; width: 13px; height: 12px; margin-top: 2px; opacity: .55;
   background:
@@ -350,23 +361,8 @@
     linear-gradient(var(--ss-w-accent), var(--ss-w-accent)) right / 3px 75% no-repeat;
   background-position: left bottom, center bottom, right bottom;
 }
-.ss-w-bi-reason-body { display: flex; flex-direction: column; gap: 8px; min-width: 0; flex: 1; }
-.ss-w-bi-text { font-size: 12px; line-height: 1.45; color: var(--ss-w-ink); }
-.ss-w-bi-text-clamp { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
-.ss-w-bi-expand { flex: none; align-self: center; display: grid; place-items: center; width: 22px; height: 22px; margin: -2px -4px -2px 0; background: none; border: none; color: var(--ss-w-faint); cursor: pointer; }
-.ss-w-bi-expand:hover { color: var(--ss-w-ink); }
-.ss-w-bi-arrow { width: 7px; height: 7px; border-right: 1.6px solid currentColor; border-top: 1.6px solid currentColor; transform: rotate(45deg); transition: transform .15s ease; }
-.ss-w-bi-arrow-open { transform: rotate(135deg); }
-.ss-w-bi-rows { display: flex; flex-direction: column; }
-.ss-w-bi-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 5px 0; border-top: 1px solid var(--ss-w-line); }
-.ss-w-bi-row:first-child { border-top: none; }
-.ss-w-bi-row-lbl { font-size: 11.5px; color: var(--ss-w-faint); min-width: 0; }
-.ss-w-bi-row-num { font-family: ui-monospace, monospace; font-weight: 700; font-variant-numeric: tabular-nums; font-size: 13px; flex: none; color: var(--ss-w-ink); }
+.ss-w-bi-text { flex: 1; min-width: 0; font-size: 12px; line-height: 1.45; color: var(--ss-w-ink); }
 .ss-w-bi-disc { font-size: 10px; font-style: italic; color: var(--ss-w-faint); }
-.ss-w-bi-scoped { display: flex; flex-direction: column; gap: 8px; }
-.ss-w-bi-scopes { display: inline-flex; align-items: center; gap: 2px; flex-wrap: wrap; align-self: flex-start; background: var(--ss-w-bubble); border: 1px solid var(--ss-w-line); border-radius: 9px; padding: 2px; }
-.ss-w-bi-chip { font-size: 11px; font-weight: 600; border: none; border-radius: 7px; padding: 4px 10px; color: var(--ss-w-faint); background: none; cursor: pointer; }
-.ss-w-bi-chip[aria-pressed="true"] { color: var(--ss-w-ink); background: var(--ss-w-panel); box-shadow: 0 1px 2px rgba(0,0,0,.08); }
 
 /* market odds card */
 .ss-w-mocards { display: flex; flex-direction: column; gap: 7px; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sensiblestats/widget-react",
-  "version": "0.63.0",
+  "version": "0.65.0",
   "description": "Embeddable SensibleStats chat widget for React.",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -37,7 +37,7 @@
     "prepublishOnly": "yarn build"
   },
   "dependencies": {
-    "@sensiblestats/widget-sdk": "^0.38.0",
+    "@sensiblestats/widget-sdk": "^0.40.0",
     "react-markdown": "^9.0.1",
     "remark-gfm": "^4.0.0"
   },