@sensiblestats/widget-react 0.72.0 → 0.72.2

package/dist/styles.css

@@ -74,16 +74,6 @@
   --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; }
@@ -446,7 +436,13 @@
 .ss-w-tool-foot { flex: none; padding: 10px 14px 12px; border-top: 1px solid var(--ss-w-line); }
 .ss-w-tool-row { display: flex; flex-direction: column; gap: 8px; padding: 10px 11px; border: 1px solid var(--ss-w-line); border-left: 3px solid var(--ss-w-accent); border-radius: 12px; }
 .ss-w-tool-ask { font-size: 14px; font-weight: 650; line-height: 1.7; color: var(--ss-w-ink); overflow-wrap: anywhere; }
-.ss-w-tool-num { display: inline-block; min-width: 44px; min-height: 32px; margin: 0 2px; padding: 3px 8px; font: inherit; font-variant-numeric: tabular-nums; font-weight: 800; color: var(--ss-w-accent); background: color-mix(in srgb, var(--ss-w-accent) 10%, var(--ss-w-panel)); border: 1px dashed color-mix(in srgb, var(--ss-w-accent) 55%, var(--ss-w-line)); border-radius: 8px; cursor: pointer; }
+.ss-w-tool-num { position: relative; display: inline-block; vertical-align: middle; margin: 0 2px; font-variant-numeric: tabular-nums; font-weight: 800; color: var(--ss-w-accent); }
+.ss-w-tool-num-size { display: block; font-size: max(16px, 1em); user-select: none; -webkit-user-select: none; visibility: hidden; box-sizing: border-box; min-width: 44px; min-height: 32px; padding: 6px 26px 6px 10px; line-height: 1.3; white-space: pre; }
+.ss-w-tool-num-select { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0 22px 0 10px; font: inherit; font-size: max(16px, 1em); font-variant-numeric: tabular-nums; font-weight: 800; color: var(--ss-w-accent); background-color: color-mix(in srgb, var(--ss-w-accent) 10%, var(--ss-w-panel)); border: 1.5px solid color-mix(in srgb, var(--ss-w-accent) 65%, var(--ss-w-line)); border-radius: 8px; cursor: pointer; appearance: none; -webkit-appearance: none; }
+.ss-w-tool-num::after { content: ""; position: absolute; right: 9px; top: 50%; width: 5px; height: 5px; margin-top: -4px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); pointer-events: none; }
+.ss-w-tool-num-select:focus-visible { outline: 2px solid var(--ss-w-accent); outline-offset: 2px; }
+.ss-w-tool-num-select option { font-weight: 600; color: var(--ss-w-ink); background: var(--ss-w-panel); }
+.ss-w-tool-num-select option:disabled { color: var(--ss-w-faint); }
 .ss-w-tool-picks { list-style: none; display: flex; flex-direction: column; gap: 4px; }
 .ss-w-tool-pick { display: grid; grid-template-columns: 1fr auto; column-gap: 8px; padding: 5px 8px; font-size: 12px; line-height: 1.35; background: var(--ss-w-bubble); border-radius: 8px; }
 .ss-w-tool-pick-match { grid-column: 1; font-weight: 650; color: var(--ss-w-ink); overflow-wrap: anywhere; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sensiblestats/widget-react",
-  "version": "0.72.0",
+  "version": "0.72.2",
   "description": "Embeddable SensibleStats chat widget for React.",
   "type": "module",
   "main": "./dist/index.cjs",