@devrongx/games 0.4.23 → 0.4.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2,6 +2,7 @@
2
2
  // Shared constants and micro-components for IPL betting UI.
3
3
 
4
4
  import Image from "next/image";
5
+ import { motion } from "framer-motion";
5
6
  import { Coins, Trophy, Swords, Square, Zap, Target, BarChart3, Star, ArrowUpRight } from "lucide-react";
6
7
 
7
8
  /** Font style applied to all betting UI text */
@@ -32,6 +33,29 @@ export const SelectedCheck = ({ size = 10 }: { size?: number }) => (
32
33
  </svg>
33
34
  );
34
35
 
36
+ /** Filter pill with animated fill — used in the game screen filter bar */
37
+ export const FilterPill = ({ label, active = false, onClick }: { label: string; active?: boolean; onClick: () => void }) => (
38
+ <button
39
+ onClick={onClick}
40
+ className="flex-shrink-0 px-2.5 py-1 rounded-full text-[10px] font-semibold tracking-wide relative overflow-hidden"
41
+ style={{
42
+ ...OUTFIT,
43
+ border: `1px solid ${active ? "#22E3E8" : "rgba(34,227,232,0.2)"}`,
44
+ }}
45
+ >
46
+ <motion.div
47
+ className="absolute inset-0 rounded-full"
48
+ initial={false}
49
+ animate={{ scaleX: active ? 1 : 0, opacity: active ? 1 : 0 }}
50
+ transition={{ duration: 0.25, ease: "easeOut" }}
51
+ style={{ background: "#22E3E8", transformOrigin: "left" }}
52
+ />
53
+ <span className="relative z-10" style={{ color: active ? "#0a0a12" : "#22E3E8" }}>
54
+ {label}
55
+ </span>
56
+ </button>
57
+ );
58
+
35
59
  /** Build iplgpt.com URL with question + options pre-filled */
36
60
  export const buildIplGptUrl = (question: string, options: string[]) => {
37
61
  const params = new URLSearchParams({ q: question, opts: options.join(",") });