@oddsmith/ui 1.0.3 → 1.0.4

package/dist/components/os-leaderboard-casino/sections/hero-section/hero-section.js

@@ -130,10 +130,12 @@ let n = class extends f {
     return p`
       <div class="countdown">
         <span class="label">Ends in</span>
-        ${s(e.days, "days")}<span class="sep">:</span>
-        ${s(e.hours, "hours")}<span class="sep">:</span>
-        ${s(e.minutes, "min")}<span class="sep">:</span>
-        ${s(e.seconds, "sec")}
+        <div class="countdown-track">
+          ${s(e.days, "days")}<span class="sep">:</span>
+          ${s(e.hours, "hours")}<span class="sep">:</span>
+          ${s(e.minutes, "min")}<span class="sep">:</span>
+          ${s(e.seconds, "sec")}
+        </div>
       </div>
     `;
   }

package/dist/components/os-leaderboard-casino/sections/hero-section/hero-section.js.map

@@ -1 +1 @@
-{"version":3,"file":"hero-section.js","sources":["../../../../../src/components/os-leaderboard-casino/sections/hero-section/hero-section.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { Component } from '@oddsmith/lib/lit/component.js';\nimport { scss } from '@oddsmith/lib/lit/scss.js';\nimport { OS_LEADERBOARD_CASINO_HERO } from '@os-leaderboard-casino/constants/tags.js';\nimport { osLeaderboardCasinoTheme } from '@os-leaderboard-casino/theme/index.js';\nimport type { LeaderboardStatus } from '@os-leaderboard-casino/types/data.js';\nimport type { OsLeaderboardCasinoHeroSection } from '@os-leaderboard-casino/types/sections.js';\nimport type { HeroSectionHost } from './hero-section.host.js';\nimport renderTemplate from './hero-section.html?lit-html';\nimport styles from './hero-section.scss?inline';\n\ninterface CountdownParts {\n  expired: boolean;\n  days: number;\n  hours: number;\n  minutes: number;\n  seconds: number;\n}\n\nfunction countdownTo(endTs: string, now = Date.now()): CountdownParts {\n  const remaining = Math.floor((new Date(endTs).getTime() - now) / 1000);\n  if (!Number.isFinite(remaining) || remaining <= 0) {\n    return { expired: true, days: 0, hours: 0, minutes: 0, seconds: 0 };\n  }\n  return {\n    expired: false,\n    days: Math.floor(remaining / 86400),\n    hours: Math.floor((remaining % 86400) / 3600),\n    minutes: Math.floor((remaining % 3600) / 60),\n    seconds: remaining % 60,\n  };\n}\n\nconst STATUS_LABELS: Record<LeaderboardStatus, string> = {\n  upcoming: 'Upcoming',\n  active: 'Live',\n  completed: 'Finished',\n  cancelled: 'Cancelled',\n};\n\n/** Glam hero — golden ring, shimmer title, prize-pool headline, glowing countdown. */\n@Component({ selector: OS_LEADERBOARD_CASINO_HERO })\nexport class OsLeaderboardCasinoHero\n  extends LitElement\n  implements HeroSectionHost\n{\n  static styles = [osLeaderboardCasinoTheme, scss(styles)];\n\n  @property({ attribute: false })\n  section!: OsLeaderboardCasinoHeroSection;\n\n  @state()\n  private now = Date.now();\n\n  /** Animated odometer value shown for `prizePoolValue`. */\n  @state()\n  private poolDisplay: number | null = null;\n\n  @state()\n  poolBump = false;\n\n  private timer?: ReturnType<typeof setInterval>;\n  private poolRaf?: number;\n  private bumpTimer?: ReturnType<typeof setTimeout>;\n\n  get showBanner(): boolean {\n    return Boolean(this.section?.bannerAsset?.url);\n  }\n\n  get bannerUrl(): string {\n    return this.section?.bannerAsset?.url ?? '';\n  }\n\n  get bannerAlt(): string {\n    return this.section?.bannerAsset?.label || '';\n  }\n\n  get showStatus(): boolean {\n    return Boolean(this.section?.status);\n  }\n\n  get status(): LeaderboardStatus | undefined {\n    return this.section?.status;\n  }\n\n  get statusLabel(): string {\n    const status = this.section?.status;\n    return status ? STATUS_LABELS[status] : '';\n  }\n\n  get showActiveDot(): boolean {\n    return this.section?.status === 'active';\n  }\n\n  get showDescription(): boolean {\n    return Boolean(this.section?.description);\n  }\n\n  get showPool(): boolean {\n    return this.poolDisplay != null || Boolean(this.section?.prizePool);\n  }\n\n  get poolValueLabel(): string {\n    if (this.poolDisplay != null) return this.formatPool(this.poolDisplay);\n    return this.section?.prizePool ?? '';\n  }\n\n  get poolLabel(): string {\n    return this.section?.prizePoolLabel ?? 'Total prize pool';\n  }\n\n  get showRising(): boolean {\n    return this.poolDisplay != null;\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this.timer = setInterval(() => {\n      this.now = Date.now();\n    }, 1000);\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    if (this.timer) clearInterval(this.timer);\n    if (this.poolRaf) cancelAnimationFrame(this.poolRaf);\n    if (this.bumpTimer) clearTimeout(this.bumpTimer);\n  }\n\n  willUpdate(changed: Map<string, unknown>) {\n    if (!changed.has('section')) return;\n    const target = this.section?.prizePoolValue;\n    if (target == null) {\n      this.poolDisplay = null;\n      return;\n    }\n    if (this.poolDisplay == null) {\n      this.poolDisplay = target;\n      return;\n    }\n    if (target !== this.poolDisplay) this.animatePool(target);\n  }\n\n  /** Rolling count-up from the current display value to `target`. */\n  private animatePool(target: number) {\n    if (this.poolRaf) cancelAnimationFrame(this.poolRaf);\n    const from = this.poolDisplay ?? target;\n    const duration = 1100;\n    const start = performance.now();\n    const tick = (t: number) => {\n      const p = Math.min(1, (t - start) / duration);\n      const eased = 1 - Math.pow(1 - p, 3);\n      this.poolDisplay = Math.round(from + (target - from) * eased);\n      if (p < 1) this.poolRaf = requestAnimationFrame(tick);\n    };\n    this.poolRaf = requestAnimationFrame(tick);\n\n    if (target > from) {\n      this.poolBump = true;\n      if (this.bumpTimer) clearTimeout(this.bumpTimer);\n      this.bumpTimer = setTimeout(() => {\n        this.poolBump = false;\n      }, 650);\n    }\n  }\n\n  private formatPool(value: number): string {\n    try {\n      return new Intl.NumberFormat('en-US', {\n        style: 'currency',\n        currency: this.section?.prizePoolCurrency ?? 'USD',\n        maximumFractionDigits: 0,\n      }).format(value);\n    } catch {\n      return value.toLocaleString();\n    }\n  }\n\n  private get isFinished(): boolean {\n    const status = this.section?.status;\n    if (status === 'completed' || status === 'cancelled') return true;\n    if (!this.section?.endTs) return false;\n    return countdownTo(this.section.endTs, this.now).expired;\n  }\n\n  renderCountdown() {\n    const endTs = this.section?.endTs;\n    if (!endTs) return nothing;\n\n    if (this.isFinished) {\n      return html`<span class=\"ended\">🏁 Contest finished</span>`;\n    }\n\n    const c = countdownTo(endTs, this.now);\n    const cell = (v: number, label: string) =>\n      html`<div class=\"cell\">\n        <b>${String(v).padStart(2, '0')}</b><span>${label}</span>\n      </div>`;\n\n    return html`\n      <div class=\"countdown\">\n        <span class=\"label\">Ends in</span>\n        ${cell(c.days, 'days')}<span class=\"sep\">:</span>\n        ${cell(c.hours, 'hours')}<span class=\"sep\">:</span>\n        ${cell(c.minutes, 'min')}<span class=\"sep\">:</span>\n        ${cell(c.seconds, 'sec')}\n      </div>\n    `;\n  }\n\n  render() {\n    if (!this.section) return nothing;\n    return renderTemplate(this);\n  }\n}\n"],"names":["countdownTo","endTs","now","remaining","STATUS_LABELS","OsLeaderboardCasinoHero","LitElement","status","changed","target","from","duration","start","tick","t","p","eased","value","nothing","html","c","cell","v","label","renderTemplate","osLeaderboardCasinoTheme","scss","styles","__decorateClass","property","state","Component","OS_LEADERBOARD_CASINO_HERO"],"mappings":"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"}
+{"version":3,"file":"hero-section.js","sources":["../../../../../src/components/os-leaderboard-casino/sections/hero-section/hero-section.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { Component } from '@oddsmith/lib/lit/component.js';\nimport { scss } from '@oddsmith/lib/lit/scss.js';\nimport { OS_LEADERBOARD_CASINO_HERO } from '@os-leaderboard-casino/constants/tags.js';\nimport { osLeaderboardCasinoTheme } from '@os-leaderboard-casino/theme/index.js';\nimport type { LeaderboardStatus } from '@os-leaderboard-casino/types/data.js';\nimport type { OsLeaderboardCasinoHeroSection } from '@os-leaderboard-casino/types/sections.js';\nimport type { HeroSectionHost } from './hero-section.host.js';\nimport renderTemplate from './hero-section.html?lit-html';\nimport styles from './hero-section.scss?inline';\n\ninterface CountdownParts {\n  expired: boolean;\n  days: number;\n  hours: number;\n  minutes: number;\n  seconds: number;\n}\n\nfunction countdownTo(endTs: string, now = Date.now()): CountdownParts {\n  const remaining = Math.floor((new Date(endTs).getTime() - now) / 1000);\n  if (!Number.isFinite(remaining) || remaining <= 0) {\n    return { expired: true, days: 0, hours: 0, minutes: 0, seconds: 0 };\n  }\n  return {\n    expired: false,\n    days: Math.floor(remaining / 86400),\n    hours: Math.floor((remaining % 86400) / 3600),\n    minutes: Math.floor((remaining % 3600) / 60),\n    seconds: remaining % 60,\n  };\n}\n\nconst STATUS_LABELS: Record<LeaderboardStatus, string> = {\n  upcoming: 'Upcoming',\n  active: 'Live',\n  completed: 'Finished',\n  cancelled: 'Cancelled',\n};\n\n/** Glam hero — golden ring, shimmer title, prize-pool headline, glowing countdown. */\n@Component({ selector: OS_LEADERBOARD_CASINO_HERO })\nexport class OsLeaderboardCasinoHero\n  extends LitElement\n  implements HeroSectionHost\n{\n  static styles = [osLeaderboardCasinoTheme, scss(styles)];\n\n  @property({ attribute: false })\n  section!: OsLeaderboardCasinoHeroSection;\n\n  @state()\n  private now = Date.now();\n\n  /** Animated odometer value shown for `prizePoolValue`. */\n  @state()\n  private poolDisplay: number | null = null;\n\n  @state()\n  poolBump = false;\n\n  private timer?: ReturnType<typeof setInterval>;\n  private poolRaf?: number;\n  private bumpTimer?: ReturnType<typeof setTimeout>;\n\n  get showBanner(): boolean {\n    return Boolean(this.section?.bannerAsset?.url);\n  }\n\n  get bannerUrl(): string {\n    return this.section?.bannerAsset?.url ?? '';\n  }\n\n  get bannerAlt(): string {\n    return this.section?.bannerAsset?.label || '';\n  }\n\n  get showStatus(): boolean {\n    return Boolean(this.section?.status);\n  }\n\n  get status(): LeaderboardStatus | undefined {\n    return this.section?.status;\n  }\n\n  get statusLabel(): string {\n    const status = this.section?.status;\n    return status ? STATUS_LABELS[status] : '';\n  }\n\n  get showActiveDot(): boolean {\n    return this.section?.status === 'active';\n  }\n\n  get showDescription(): boolean {\n    return Boolean(this.section?.description);\n  }\n\n  get showPool(): boolean {\n    return this.poolDisplay != null || Boolean(this.section?.prizePool);\n  }\n\n  get poolValueLabel(): string {\n    if (this.poolDisplay != null) return this.formatPool(this.poolDisplay);\n    return this.section?.prizePool ?? '';\n  }\n\n  get poolLabel(): string {\n    return this.section?.prizePoolLabel ?? 'Total prize pool';\n  }\n\n  get showRising(): boolean {\n    return this.poolDisplay != null;\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this.timer = setInterval(() => {\n      this.now = Date.now();\n    }, 1000);\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    if (this.timer) clearInterval(this.timer);\n    if (this.poolRaf) cancelAnimationFrame(this.poolRaf);\n    if (this.bumpTimer) clearTimeout(this.bumpTimer);\n  }\n\n  willUpdate(changed: Map<string, unknown>) {\n    if (!changed.has('section')) return;\n    const target = this.section?.prizePoolValue;\n    if (target == null) {\n      this.poolDisplay = null;\n      return;\n    }\n    if (this.poolDisplay == null) {\n      this.poolDisplay = target;\n      return;\n    }\n    if (target !== this.poolDisplay) this.animatePool(target);\n  }\n\n  /** Rolling count-up from the current display value to `target`. */\n  private animatePool(target: number) {\n    if (this.poolRaf) cancelAnimationFrame(this.poolRaf);\n    const from = this.poolDisplay ?? target;\n    const duration = 1100;\n    const start = performance.now();\n    const tick = (t: number) => {\n      const p = Math.min(1, (t - start) / duration);\n      const eased = 1 - Math.pow(1 - p, 3);\n      this.poolDisplay = Math.round(from + (target - from) * eased);\n      if (p < 1) this.poolRaf = requestAnimationFrame(tick);\n    };\n    this.poolRaf = requestAnimationFrame(tick);\n\n    if (target > from) {\n      this.poolBump = true;\n      if (this.bumpTimer) clearTimeout(this.bumpTimer);\n      this.bumpTimer = setTimeout(() => {\n        this.poolBump = false;\n      }, 650);\n    }\n  }\n\n  private formatPool(value: number): string {\n    try {\n      return new Intl.NumberFormat('en-US', {\n        style: 'currency',\n        currency: this.section?.prizePoolCurrency ?? 'USD',\n        maximumFractionDigits: 0,\n      }).format(value);\n    } catch {\n      return value.toLocaleString();\n    }\n  }\n\n  private get isFinished(): boolean {\n    const status = this.section?.status;\n    if (status === 'completed' || status === 'cancelled') return true;\n    if (!this.section?.endTs) return false;\n    return countdownTo(this.section.endTs, this.now).expired;\n  }\n\n  renderCountdown() {\n    const endTs = this.section?.endTs;\n    if (!endTs) return nothing;\n\n    if (this.isFinished) {\n      return html`<span class=\"ended\">🏁 Contest finished</span>`;\n    }\n\n    const c = countdownTo(endTs, this.now);\n    const cell = (v: number, label: string) =>\n      html`<div class=\"cell\">\n        <b>${String(v).padStart(2, '0')}</b><span>${label}</span>\n      </div>`;\n\n    return html`\n      <div class=\"countdown\">\n        <span class=\"label\">Ends in</span>\n        <div class=\"countdown-track\">\n          ${cell(c.days, 'days')}<span class=\"sep\">:</span>\n          ${cell(c.hours, 'hours')}<span class=\"sep\">:</span>\n          ${cell(c.minutes, 'min')}<span class=\"sep\">:</span>\n          ${cell(c.seconds, 'sec')}\n        </div>\n      </div>\n    `;\n  }\n\n  render() {\n    if (!this.section) return nothing;\n    return renderTemplate(this);\n  }\n}\n"],"names":["countdownTo","endTs","now","remaining","STATUS_LABELS","OsLeaderboardCasinoHero","LitElement","status","changed","target","from","duration","start","tick","t","p","eased","value","nothing","html","c","cell","v","label","renderTemplate","osLeaderboardCasinoTheme","scss","styles","__decorateClass","property","state","Component","OS_LEADERBOARD_CASINO_HERO"],"mappings":"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"}

package/dist/components/os-leaderboard-casino/sections/hero-section/hero-section.scss.js

@@ -1,4 +1,4 @@
-const e = ':host{display:block;width:100%}.hero{position:relative;overflow:hidden;border-radius:var(--radius-sm);border:1px solid var(--panel-border);background:radial-gradient(90% 130% at 50% -20%,color-mix(in srgb,var(--violet) 22%,transparent),transparent 55%),radial-gradient(70% 110% at 12% 110%,color-mix(in srgb,var(--gold) 16%,transparent),transparent 58%),radial-gradient(65% 100% at 88% 108%,color-mix(in srgb,var(--gold) 12%,transparent),transparent 62%),var(--panel-bg);box-shadow:var(--panel-shadow);text-align:center;padding:clamp(26px,5vw,44px) clamp(18px,4vw,36px) clamp(22px,4vw,34px)}.hero:before{content:"";position:absolute;top:120%;left:50%;width:150%;aspect-ratio:1;transform:translate(-50%,-50%);transform-origin:50% 50%;background:conic-gradient(from 0deg,transparent 0deg,transparent 45deg,color-mix(in srgb,var(--gold) 24%,transparent) 55deg,color-mix(in srgb,var(--gold) 20%,transparent) 58deg,transparent 67deg,transparent 198deg,color-mix(in srgb,var(--violet) 22%,transparent) 208deg,color-mix(in srgb,var(--violet) 16%,transparent) 211deg,transparent 220deg,transparent 360deg);filter:blur(28px);opacity:.92;animation:halo 16s linear infinite;pointer-events:none;z-index:0}@keyframes halo{to{transform:translate(-50%,-50%) rotate(360deg)}}@media(max-width:640px){.hero:before{top:100%;width:215%}}.banner-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.22;z-index:0}.inner{position:relative;z-index:1}.status{display:inline-flex;align-items:center;gap:7px;font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;padding:6px 14px;border-radius:999px;background:var(--panel-bg);border:1px solid var(--panel-border);color:var(--text-dim)}.status.active{color:var(--green);border-color:color-mix(in srgb,var(--green) 45%,transparent)}.status.active .dot{width:7px;height:7px;border-radius:50%;background:var(--green);animation:pulse 1.6s ease-in-out infinite}.status.completed{color:var(--gold);border-color:var(--hairline-gold)}.status.cancelled{color:var(--red)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}h2{margin:16px 0 0;font-family:var(--font-display);font-size:clamp(26px,5.4vw,40px);font-weight:800;letter-spacing:-.02em;line-height:1.12;background:var(--gold-gradient);background-size:200% auto;background-position:0% center;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 5.5s linear infinite;text-wrap:balance}@keyframes shimmer{0%{background-position:0% center}to{background-position:200% center}}.description{margin:12px auto 0;font-size:13.5px;line-height:1.6;color:var(--text-dim);max-width:52ch}.pool{margin-top:22px;display:inline-flex;flex-direction:column;align-items:center;gap:4px;padding:14px 34px;border-radius:16px;background:var(--panel-bg);border:1px solid var(--panel-border);box-shadow:var(--panel-shadow)}.pool .label{font-size:10px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--text-faint)}.pool .value{font-family:var(--font-mono);font-size:clamp(28px,5vw,38px);font-weight:800;color:var(--gold-strong);text-shadow:0 0 26px var(--gold-glow);line-height:1.1;font-variant-numeric:tabular-nums;transition:text-shadow .3s ease}.pool .value.bump{animation:pool-bump .6s ease}@keyframes pool-bump{0%{transform:scale(1)}35%{transform:scale(1.06);text-shadow:0 0 42px var(--gold-glow),0 0 12px var(--gold-strong)}to{transform:scale(1)}}.pool .rising{display:inline-flex;align-items:center;gap:4px;margin-top:2px;font-size:9.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--green)}.pool .rising i{width:5px;height:5px;border-radius:50%;background:var(--green);animation:pulse 1.6s ease-in-out infinite}.countdown{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:22px;flex-wrap:wrap}.countdown .label{width:100%;font-size:10px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--text-faint);margin-bottom:2px}.cell{min-width:60px;text-align:center;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius-sm);padding:9px 10px 8px}.cell b{display:block;font-family:var(--font-mono);font-size:21px;font-weight:800;color:var(--text);line-height:1.1}.cell span{display:block;margin-top:3px;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint)}.sep{font-family:var(--font-mono);font-size:18px;font-weight:800;color:var(--gold);opacity:.7}@media(max-width:480px){.cell{min-width:48px;padding:8px 6px 7px}.cell b{font-size:18px}.countdown{gap:5px}.sep{font-size:15px}}.ended{display:inline-flex;align-items:center;gap:8px;margin-top:22px;padding:10px 20px;border-radius:var(--radius-sm);background:var(--gold-soft);border:1px solid var(--hairline-gold);color:var(--gold);font-weight:700;font-size:14px}';
+const e = ':host{display:block;width:100%}.hero{position:relative;overflow:hidden;border-radius:var(--radius-sm);border:1px solid var(--panel-border);background:radial-gradient(90% 130% at 50% -20%,color-mix(in srgb,var(--violet) 22%,transparent),transparent 55%),radial-gradient(70% 110% at 12% 110%,color-mix(in srgb,var(--gold) 16%,transparent),transparent 58%),radial-gradient(65% 100% at 88% 108%,color-mix(in srgb,var(--gold) 12%,transparent),transparent 62%),var(--panel-bg);box-shadow:var(--panel-shadow);text-align:center;padding:clamp(26px,5vw,44px) clamp(18px,4vw,36px) clamp(22px,4vw,34px)}.hero:before{content:"";position:absolute;top:120%;left:50%;width:150%;aspect-ratio:1;transform:translate(-50%,-50%);transform-origin:50% 50%;background:conic-gradient(from 0deg,transparent 0deg,transparent 45deg,color-mix(in srgb,var(--gold) 24%,transparent) 55deg,color-mix(in srgb,var(--gold) 20%,transparent) 58deg,transparent 67deg,transparent 198deg,color-mix(in srgb,var(--violet) 22%,transparent) 208deg,color-mix(in srgb,var(--violet) 16%,transparent) 211deg,transparent 220deg,transparent 360deg);filter:blur(28px);opacity:.92;animation:halo 16s linear infinite;pointer-events:none;z-index:0}@keyframes halo{to{transform:translate(-50%,-50%) rotate(360deg)}}@media(max-width:640px){.hero:before{top:100%;width:215%}}.banner-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.22;z-index:0}.inner{position:relative;z-index:1}.status{display:inline-flex;align-items:center;gap:7px;font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;padding:6px 14px;border-radius:999px;background:var(--panel-bg);border:1px solid var(--panel-border);color:var(--text-dim)}.status.active{color:var(--green);border-color:color-mix(in srgb,var(--green) 45%,transparent)}.status.active .dot{width:7px;height:7px;border-radius:50%;background:var(--green);animation:pulse 1.6s ease-in-out infinite}.status.completed{color:var(--gold);border-color:var(--hairline-gold)}.status.cancelled{color:var(--red)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}h2{margin:16px 0 0;font-family:var(--font-display);font-size:clamp(26px,5.4vw,40px);font-weight:800;letter-spacing:-.02em;line-height:1.12;background:var(--gold-gradient);background-size:200% auto;background-position:0% center;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 5.5s linear infinite;text-wrap:balance}@keyframes shimmer{0%{background-position:0% center}to{background-position:200% center}}.description{margin:12px auto 0;font-size:13.5px;line-height:1.6;color:var(--text-dim);max-width:52ch}.pool{margin-top:22px;display:inline-flex;flex-direction:column;align-items:center;gap:4px;padding:14px 34px;border-radius:16px;background:var(--panel-bg);border:1px solid var(--panel-border);box-shadow:var(--panel-shadow)}.pool .label{font-size:10px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--text-faint)}.pool .value{font-family:var(--font-mono);font-size:clamp(28px,5vw,38px);font-weight:800;color:var(--gold-strong);text-shadow:0 0 26px var(--gold-glow);line-height:1.1;font-variant-numeric:tabular-nums;transition:text-shadow .3s ease}.pool .value.bump{animation:pool-bump .6s ease}@keyframes pool-bump{0%{transform:scale(1)}35%{transform:scale(1.06);text-shadow:0 0 42px var(--gold-glow),0 0 12px var(--gold-strong)}to{transform:scale(1)}}.pool .rising{display:inline-flex;align-items:center;gap:4px;margin-top:2px;font-size:9.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--green)}.pool .rising i{width:5px;height:5px;border-radius:50%;background:var(--green);animation:pulse 1.6s ease-in-out infinite}.countdown{--countdown-cell-size: 60px;--countdown-digit-size: 21px;--countdown-unit-size: 9px;--countdown-sep-size: 18px;--countdown-track-gap: 6px;display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:22px}.countdown .label{font-size:10px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--text-faint)}.countdown-track{display:inline-grid;grid-template-columns:var(--countdown-cell-size) auto var(--countdown-cell-size) auto var(--countdown-cell-size) auto var(--countdown-cell-size);column-gap:var(--countdown-track-gap);align-items:center;justify-items:center;max-width:100%}.countdown-track>.cell{width:var(--countdown-cell-size);height:var(--countdown-cell-size);min-width:var(--countdown-cell-size);max-width:var(--countdown-cell-size);min-height:var(--countdown-cell-size);max-height:var(--countdown-cell-size);box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius-sm);padding:0;overflow:hidden;grid-column:span 1}.countdown-track>.cell b{display:block;width:100%;font-family:var(--font-mono);font-size:var(--countdown-digit-size);font-weight:800;color:var(--text);line-height:1}.countdown-track>.cell span{display:block;width:100%;margin-top:3px;font-size:var(--countdown-unit-size);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint);line-height:1;white-space:nowrap}.countdown-track>.sep{flex:none;text-align:center;font-family:var(--font-mono);font-size:var(--countdown-sep-size);font-weight:800;color:var(--gold);opacity:.7;line-height:1}@media(max-width:545px){.countdown{--countdown-cell-size: 52px;--countdown-digit-size: 18px;--countdown-unit-size: 8px;--countdown-sep-size: 15px}}@media(max-width:420px){.countdown{--countdown-cell-size: 44px;--countdown-digit-size: 14px;--countdown-unit-size: 7px;--countdown-sep-size: 11px}.countdown .label{font-size:9px;letter-spacing:.16em}}.ended{display:inline-flex;align-items:center;gap:8px;margin-top:22px;padding:10px 20px;border-radius:var(--radius-sm);background:var(--gold-soft);border:1px solid var(--hairline-gold);color:var(--gold);font-weight:700;font-size:14px}';
 export {
   e as default
 };

package/dist/components/os-leaderboard-casino/sections/prize-section/prize-section.scss.js

@@ -1,4 +1,4 @@
-const o = '@charset "UTF-8";:host{display:block;width:100%}.strategy{font-size:9.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:4px 10px;border-radius:999px;background:var(--violet-soft);border:1px solid color-mix(in srgb,var(--violet) 40%,transparent);color:#c9adff}.podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:end}.slot{position:relative;overflow:hidden;border-radius:var(--radius-sm);padding:16px 12px 14px;text-align:center;border:1px solid var(--panel-border);background:var(--panel-bg);box-shadow:var(--panel-shadow);transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.slot:hover{transform:translateY(-3px)}.slot.first{order:2;padding-top:22px;padding-bottom:20px;border-color:var(--panel-border);background:radial-gradient(120% 90% at 50% -10%,color-mix(in srgb,var(--gold) 18%,transparent),transparent 60%),var(--panel-bg);box-shadow:var(--panel-shadow)}.slot.second{order:1;border-color:var(--panel-border);background:var(--panel-bg)}.slot.third{order:3;border-color:var(--panel-border);background:var(--panel-bg)}.coin{display:flex;justify-content:center;min-height:52px}.slot.first .coin{min-height:68px}.place{margin-top:7px;font-size:9px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--text-faint)}.slot.first .place{color:var(--gold)}.slot.second .place{color:var(--silver)}.slot.third .place{color:var(--bronze)}.slot .name{margin-top:5px;font-size:12px;font-weight:700;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.slot .value{margin-top:6px;font-family:var(--font-mono);font-size:16px;font-weight:800;color:var(--gold-strong)}.slot.first .value{font-size:20px;text-shadow:0 0 18px var(--gold-glow)}.list{display:flex;flex-direction:column;gap:7px;margin-top:10px}.tier{display:flex;align-items:center;gap:12px;width:100%;text-align:left;font-family:var(--font-body);padding:11px 14px;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius-sm);box-shadow:var(--panel-shadow);transition:border-color var(--transition-fast)}.tier:hover{border-color:var(--hairline-gold)}.tier .icon{flex:none;display:grid;place-items:center;line-height:0}.tier .icon svg{width:28px;height:28px}.tier .info{flex:1;min-width:0}.tier .name{font-size:13px;font-weight:700;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tier .range{margin-top:1px;font-size:11px;color:var(--text-dim)}.tier .value{flex:none;font-family:var(--font-mono);font-size:13.5px;font-weight:700;color:var(--gold)}@media(max-width:480px){.slot .value{font-size:13.5px}.slot.first .value{font-size:16px}}';
+const o = '@charset "UTF-8";:host{display:block;width:100%}.strategy{font-size:9.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:4px 10px;border-radius:999px;background:var(--violet-soft);border:1px solid color-mix(in srgb,var(--violet) 40%,transparent);color:#c9adff}.podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:end}.slot{position:relative;overflow:hidden;border-radius:var(--radius-sm);padding:16px 12px 14px;text-align:center;border:1px solid var(--panel-border);background:var(--panel-bg);box-shadow:var(--panel-shadow);transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.slot:hover{transform:translateY(-3px)}.slot.first{order:2;padding-top:22px;padding-bottom:20px;border-color:var(--panel-border);background:radial-gradient(120% 90% at 50% -10%,color-mix(in srgb,var(--gold) 18%,transparent),transparent 60%),var(--panel-bg);box-shadow:var(--panel-shadow)}.slot.second{order:1;border-color:var(--panel-border);background:var(--panel-bg)}.slot.third{order:3;border-color:var(--panel-border);background:var(--panel-bg)}.coin{display:flex;justify-content:center;min-height:52px}.slot.first .coin{min-height:68px}.place{margin-top:7px;font-size:9px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--text-faint)}.slot.first .place{color:var(--gold)}.slot.second .place{color:var(--silver)}.slot.third .place{color:var(--bronze)}.slot .name{margin-top:5px;font-size:12px;font-weight:700;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.slot .value{margin-top:6px;font-family:var(--font-mono);font-size:16px;font-weight:800;color:var(--gold-strong)}.slot.first .value{font-size:20px;text-shadow:0 0 18px var(--gold-glow)}.list{display:flex;flex-direction:column;gap:7px;margin-top:10px}.tier{display:flex;align-items:center;gap:12px;width:100%;text-align:left;font-family:var(--font-body);padding:11px 14px;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius-sm);box-shadow:var(--panel-shadow);transition:border-color var(--transition-fast)}.tier:hover{border-color:var(--hairline-gold)}.tier .icon{flex:none;display:grid;place-items:center;line-height:0}.tier .icon svg{width:28px;height:28px}.tier .info{flex:1;min-width:0}.tier .name{font-size:13px;font-weight:700;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tier .range{margin-top:1px;font-size:11px;color:var(--text-dim)}.tier .value{flex:none;font-family:var(--font-mono);font-size:13.5px;font-weight:700;color:var(--gold)}@media(max-width:480px){.slot .value{font-size:13.5px}.slot.first .value{font-size:16px}}@media(max-width:420px){.podium{gap:8px}.slot{padding:14px 8px 12px}.slot.first{padding-top:18px;padding-bottom:16px}.slot .name{font-size:11px;letter-spacing:-.01em}}';
 export {
   o as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oddsmith/ui",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "Brandable casino leaderboard web component",
   "keywords": [
     "casino",