@devrongx/games 0.4.17 → 0.4.19

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devrongx/games",
-  "version": "0.4.17",
+  "version": "0.4.19",
   "description": "Game UI components for sports prediction markets",
   "license": "MIT",
   "main": "./src/index.ts",

package/src/games/prematch-bets/PreMatchGame.tsx

@@ -153,7 +153,7 @@ export const PreMatchGame = ({ config, bets, onBetsChange, onOptionClick, onAmou
     }, [config.markets]);
 
     return (
-        <div className={`w-full flex flex-col gap-3 px-4${marketsOnly ? "" : " relative"}`}>
+        <div className={`w-full flex flex-col gap-3 px-4 pb-28${marketsOnly ? "" : " relative"}`}>
             {!marketsOnly && (
                 <>
                     {/* Match header — edge-to-edge, black bg */}

package/src/matches/MatchCalendar.tsx

@@ -113,7 +113,7 @@ const GAME_TYPE_STYLE: Record<number, { icon: typeof Target; color: string; bg:
 };
 
 function PoolPill({ pool, onPress }: { pool: ITDPool; onPress: (pool: ITDPool) => void }) {
-  const style = GAME_TYPE_STYLE[pool.game_type] ?? { icon: Target, color: "#22E3E8", bg: "rgba(34,227,232,0.06)" };
+  const style = GAME_TYPE_STYLE[pool.game_type] ?? { icon: Target, color: "#22E3E8", bg: "rgba(34,227,232,0.06)", label: "Play" };
   const isClosed = pool.status === TDPoolStatus.CLOSED || pool.status === TDPoolStatus.RESOLVING || pool.status === TDPoolStatus.COMPLETE;
   const isOpen = pool.status === TDPoolStatus.OPEN;
 
@@ -131,20 +131,20 @@ function PoolPill({ pool, onPress }: { pool: ITDPool; onPress: (pool: ITDPool) =
         boxShadow: isOpen ? `0 0 8px ${style.color}18` : undefined,
       }}
     >
-      <span className="text-[10px] font-bold" style={{ ...OUTFIT, color: "#fff" }}>
-        {pool.display_price}
-      </span>
-      {pool.entry_count > 0 && (
-        <span className="text-[8px] font-medium" style={{ ...OUTFIT, color: "rgba(255,255,255,0.65)" }}>
-          {pool.entry_count > 999 ? `${(pool.entry_count / 1000).toFixed(1)}k` : pool.entry_count}
-        </span>
-      )}
       {isOpen && (
         <span className="relative flex h-1.5 w-1.5 shrink-0">
           <span className="animate-ping absolute inline-flex h-full w-full rounded-full opacity-60" style={{ backgroundColor: style.color }} />
           <span className="relative inline-flex rounded-full h-1.5 w-1.5" style={{ backgroundColor: style.color }} />
         </span>
       )}
+      <span className="text-[10px] font-bold tracking-wide" style={{ ...OUTFIT, color: "#fff" }}>
+        PLAY
+      </span>
+      {pool.entry_count > 0 && (
+        <span className="text-[8px] font-medium" style={{ ...OUTFIT, color: `${style.color}99` }}>
+          {pool.entry_count > 999 ? `${(pool.entry_count / 1000).toFixed(1)}k` : pool.entry_count} in
+        </span>
+      )}
     </motion.button>
   );
 }
@@ -430,17 +430,6 @@ export function MatchCalendar({ tournamentId, onPoolPress, partnerSource }: Matc
     }
   }, [scrollTargetIndex, days]);
 
-  // Stage groups
-  const stageGroups = useMemo(() => {
-    const stages = new Map<number, { name: string; orderNo: number }>();
-    for (const m of matches) {
-      if (m.stage && !stages.has(m.stage.id)) {
-        stages.set(m.stage.id, { name: m.stage.name, orderNo: m.stage.order_no });
-      }
-    }
-    return Array.from(stages.values()).sort((a, b) => a.orderNo - b.orderNo);
-  }, [matches]);
-
   const tournament = matches[0]?.tournament;
 
   if (isLoading) {
@@ -471,20 +460,8 @@ export function MatchCalendar({ tournamentId, onPoolPress, partnerSource }: Matc
               </span>
             )}
             <span className="text-[11px] text-white" style={OUTFIT}>
-              {matches.length} matches
+              {matches.length} matches announced
             </span>
-            {stageGroups.length > 0 && (
-              <span
-                className="text-[9px] barlowcondensedBold tracking-widest px-2 py-0.5 rounded-full"
-                style={{
-                  color: "#22E3E8",
-                  background: "rgba(34,227,232,0.08)",
-                  border: "1px solid rgba(34,227,232,0.15)",
-                }}
-              >
-                {stageGroups[0].name.toUpperCase()}
-              </span>
-            )}
           </div>
         </div>
       )}