@foxford/ui 2.133.0 → 2.134.0

package/components/GlossyButton/comets/CometsPlayer.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CometsPlayer.mjs","sources":["../../../../../src/components/GlossyButton/comets/CometsPlayer.ts"],"sourcesContent":["import type { CanvasAnimationPlayer } from 'shared/interfaces'\nimport { CometsScene } from './CometsScene'\nimport type { CometSizeScale } from './types'\n\nexport class CometsPlayer implements CanvasAnimationPlayer {\n  private static readonly config = {\n    maxDelta: 0.05,\n    maxPixelRatio: 2,\n    sizeScaleVariables: {\n      head: '--glossy-button-comet-head-scale',\n      tail: '--glossy-button-comet-tail-scale',\n    },\n  }\n\n  private readonly canvas: HTMLCanvasElement\n\n  private readonly ctx: CanvasRenderingContext2D\n\n  private readonly scene = new CometsScene()\n\n  private frame = 0\n\n  private lastTime = 0\n\n  private observer: IntersectionObserver | null = null\n\n  private readonly onError: () => void\n\n  constructor(canvas: HTMLCanvasElement, ctx: CanvasRenderingContext2D, onError: () => void) {\n    this.canvas = canvas\n    this.ctx = ctx\n    this.onError = onError\n  }\n\n  private tick = (now: number) => {\n    try {\n      const dt = this.lastTime ? Math.min((now - this.lastTime) / 1000, CometsPlayer.config.maxDelta) : 0\n      this.lastTime = now\n      this.scene.update(dt)\n      this.scene.draw(this.ctx)\n      if (dt > 0) {\n        this.canvas.style.visibility = 'visible'\n      }\n      this.frame = requestAnimationFrame(this.tick)\n    } catch {\n      this.onError()\n    }\n  }\n\n  private start() {\n    if (!this.frame) {\n      this.frame = requestAnimationFrame(this.tick)\n    }\n  }\n\n  private stop() {\n    this.canvas.style.visibility = 'hidden'\n    cancelAnimationFrame(this.frame)\n    this.frame = 0\n    this.lastTime = 0\n  }\n\n  private getSizeScale(): CometSizeScale | undefined {\n    const style = getComputedStyle(this.canvas)\n    const { head, tail } = CometsPlayer.config.sizeScaleVariables\n    const sizeScale = {\n      head: parseFloat(style.getPropertyValue(head)),\n      tail: parseFloat(style.getPropertyValue(tail)),\n    }\n\n    return Number.isNaN(sizeScale.head) || Number.isNaN(sizeScale.tail) ? undefined : sizeScale\n  }\n\n  private getContentWidth(width: number) {\n    const button = this.canvas.parentElement\n    if (!button) {\n      return\n    }\n\n    const style = getComputedStyle(button)\n\n    return width - (parseFloat(style.paddingLeft) || 0) - (parseFloat(style.paddingRight) || 0)\n  }\n\n  public play(element: Element) {\n    this.destroy()\n    if (typeof IntersectionObserver === 'undefined') {\n      this.start()\n\n      return\n    }\n\n    this.observer = new IntersectionObserver((entries) => {\n      if (entries[entries.length - 1].isIntersecting) {\n        this.start()\n      } else {\n        this.stop()\n      }\n    })\n    this.observer.observe(element)\n  }\n\n  public destroy() {\n    this.stop()\n    this.observer?.disconnect()\n    this.observer = null\n    this.ctx.save()\n    this.ctx.setTransform(1, 0, 0, 1, 0, 0)\n    this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height)\n    this.ctx.restore()\n  }\n\n  public resize() {\n    const width = this.canvas.clientWidth\n    const height = this.canvas.clientHeight\n    const ratio = Math.min(window.devicePixelRatio || 1, CometsPlayer.config.maxPixelRatio)\n    const pixelWidth = Math.round(width * ratio)\n    const pixelHeight = Math.round(height * ratio)\n    if (this.canvas.width !== pixelWidth) {\n      this.canvas.width = pixelWidth\n    }\n    if (this.canvas.height !== pixelHeight) {\n      this.canvas.height = pixelHeight\n    }\n    this.ctx.setTransform(ratio, 0, 0, ratio, 0, 0)\n    this.scene.resize(width, height, this.getSizeScale(), this.getContentWidth(width))\n    this.scene.draw(this.ctx)\n  }\n}\n"],"names":["CometsPlayer","static","maxDelta","maxPixelRatio","sizeScaleVariables","head","tail","scene","CometsScene","frame","lastTime","observer","constructor","canvas","ctx","onError","this","tick","now","dt","Math","min","config","update","draw","style","visibility","requestAnimationFrame","start","stop","cancelAnimationFrame","getSizeScale","getComputedStyle","sizeScale","parseFloat","getPropertyValue","Number","isNaN","undefined","getContentWidth","width","button","parentElement","paddingLeft","paddingRight","play","element","destroy","IntersectionObserver","entries","length","isIntersecting","observe","disconnect","save","setTransform","clearRect","height","restore","resize","clientWidth","clientHeight","ratio","window","devicePixelRatio","pixelWidth","round","pixelHeight"],"mappings":"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"}

package/components/GlossyButton/comets/CometsScene.js

@@ -0,0 +1,2 @@
+'use strict';var tinycolor=require('tinycolor2');var utils=require('./utils.js');function _interopDefault(t){return t&&t.__esModule?t:{default:t}}var tinycolor__default=_interopDefault(tinycolor);class CometsScene{static config={count:{factor:2,area:2400,min:6,max:16},speed:1.5,tailLength:2.5,headScale:.3,edgeOvershoot:4,content:{heightShare:1/3,gap:4},appearTime:.4,fade:{share:.6,power:1.6},headRadius:1.6,glowBlur:3.5,color:"#ffffff",tailColor:tinycolor__default.default("#ffffff").setAlpha(0).toString(),glowColor:tinycolor__default.default("#ffffff").setAlpha(.9).toString()};size=[0,0];sizeScale={head:1,tail:1};contentWidth=0;referenceDistance=0;appearProgress=0;comets=[];get cometCount(){const[t,e]=this.size;if(t<=0||e<=0)return 0;const{factor:o,area:s,min:a,max:n}=CometsScene.config.count;const i=Math.min(n,Math.max(a,Math.round(t*e/s)));return Math.round(i*o)}get contentSize(){const[,t]=this.size;const{heightShare:e,gap:o}=CometsScene.config.content;return[Math.max(0,this.contentWidth/2+o),t*e/2+o]}randomEdgePoint(){const[t,e]=this.size;const{edgeOvershoot:o}=CometsScene.config;const s=t/2+o;const a=e/2+o;const n=utils.getRandomNumber(4*(s+a));return n<2*s?[n-s,-a]:n<2*s+2*a?[s,n-2*s-a]:n<4*s+2*a?[n-3*s-2*a,a]:[-s,n-4*s-3*a]}distanceToContent(t,e){const[o,s]=this.contentSize;const a=t===0?1/0:o/Math.abs(t);const n=e===0?1/0:s/Math.abs(e);return Math.min(a,n)}spawn(t,e){const{speed:o,tailLength:s,headScale:a}=CometsScene.config;const n=utils.getRandomNumber(.5,1.8);const[i,c]=this.randomEdgePoint();const r=Math.hypot(i,c);const h=i/r;const l=c/r;t.angle=Math.atan2(l,h),t.cos=h,t.sin=l,t.start=r,t.stop=Math.min(r,this.distanceToContent(h,l)),t.distance=e?utils.getRandomNumber(t.stop,t.start):t.start,t.tail=utils.getRandomNumber(7,18)*n*s*this.sizeScale.tail,t.velocity=this.referenceDistance*utils.getRandomNumber(.4,.9)*o,t.alpha=utils.getRandomNumber(.55,1),t.scale=n*a*this.sizeScale.head}draw(t){const[e,o]=this.size;t.clearRect(0,0,e,o);const{fade:s,headRadius:a,glowBlur:n,color:i,tailColor:c,glowColor:r}=CometsScene.config;const h=utils.easeInOutQuadratic(this.appearProgress);t.shadowColor=r;const l=e/2;const d=o/2;for(const{angle:e,cos:o,sin:r,distance:f,start:u,stop:m,tail:g,alpha:p,scale:S}of this.comets){const C=l+o*f;const M=d+r*f;const z=f+g;const w=l+o*z;const b=d+r*z;const y=Math.max(u-m,Number.EPSILON);const P=Math.min(1,(f-m)/(y*s.share))**s.power;const v=a*S;const _=t.createLinearGradient(w,b,C,M);_.addColorStop(0,c),_.addColorStop(1,i),t.globalAlpha=Math.min(1,p*P)*h,t.fillStyle=_,t.shadowBlur=n*S,t.beginPath(),t.moveTo(w,b),t.lineTo(C-r*v,M+o*v),t.arc(C,M,v,e+Math.PI/2,e+Math.PI*3/2),t.closePath(),t.fill()}t.shadowBlur=0,t.globalAlpha=1}update(t){this.appearProgress=Math.min(1,this.appearProgress+t/CometsScene.config.appearTime);for(const e of this.comets)e.distance-=e.velocity*t,e.distance<=e.stop&&this.spawn(e,!1)}resize(t,e,o=this.sizeScale,s=this.contentWidth){const[a,n]=this.size;const{head:i,tail:c}=this.sizeScale;if(t===a&&e===n&&o.head===i&&o.tail===c&&s===this.contentWidth)return;this.size=[t,e],this.sizeScale=o,this.contentWidth=s,this.referenceDistance=Math.sqrt((t/2)**2+(e/2)**2)+CometsScene.config.edgeOvershoot;const r=this.cometCount;r!==this.comets.length&&(this.comets=Array.from({length:r},()=>({start:0,stop:0,angle:0,cos:1,sin:0,distance:0,velocity:0,tail:0,alpha:0,scale:1}))),this.comets.forEach(t=>this.spawn(t,!0))}}exports.CometsScene=CometsScene;
+//# sourceMappingURL=CometsScene.js.map

package/components/GlossyButton/comets/CometsScene.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CometsScene.js","sources":["../../../../../src/components/GlossyButton/comets/CometsScene.ts"],"sourcesContent":["import tinycolor from 'tinycolor2'\nimport type { Comet, CometSizeScale } from './types'\nimport { getRandomNumber, easeInOutQuadratic } from './utils'\n\nconst COLOR = '#ffffff'\n\nexport class CometsScene {\n  private static readonly config = {\n    count: { factor: 2, area: 2400, min: 6, max: 16 },\n    speed: 1.5,\n    tailLength: 2.5,\n    headScale: 0.3,\n    edgeOvershoot: 4,\n    content: { heightShare: 1 / 3, gap: 4 },\n    appearTime: 0.4,\n    fade: { share: 0.6, power: 1.6 },\n    headRadius: 1.6,\n    glowBlur: 3.5,\n    color: COLOR,\n    tailColor: tinycolor(COLOR).setAlpha(0).toString(),\n    glowColor: tinycolor(COLOR).setAlpha(0.9).toString(),\n  }\n\n  private size: [number, number] = [0, 0]\n\n  private sizeScale: CometSizeScale = { head: 1, tail: 1 }\n\n  private contentWidth = 0\n\n  private referenceDistance = 0\n\n  private appearProgress = 0\n\n  private comets: Comet[] = []\n\n  private get cometCount() {\n    const [width, height] = this.size\n    if (width <= 0 || height <= 0) {\n      return 0\n    }\n\n    const { factor, area, min, max } = CometsScene.config.count\n    const base = Math.min(max, Math.max(min, Math.round((width * height) / area)))\n\n    return Math.round(base * factor)\n  }\n\n  private get contentSize(): [number, number] {\n    const [, height] = this.size\n    const { heightShare, gap } = CometsScene.config.content\n\n    return [Math.max(0, this.contentWidth / 2 + gap), (height * heightShare) / 2 + gap]\n  }\n\n  private randomEdgePoint(): [number, number] {\n    const [width, height] = this.size\n    const { edgeOvershoot } = CometsScene.config\n    const halfWidth = width / 2 + edgeOvershoot\n    const halfHeight = height / 2 + edgeOvershoot\n    const position = getRandomNumber(4 * (halfWidth + halfHeight))\n\n    if (position < 2 * halfWidth) {\n      return [position - halfWidth, -halfHeight]\n    }\n    if (position < 2 * halfWidth + 2 * halfHeight) {\n      return [halfWidth, position - 2 * halfWidth - halfHeight]\n    }\n    if (position < 4 * halfWidth + 2 * halfHeight) {\n      return [position - 3 * halfWidth - 2 * halfHeight, halfHeight]\n    }\n\n    return [-halfWidth, position - 4 * halfWidth - 3 * halfHeight]\n  }\n\n  private distanceToContent(cos: number, sin: number) {\n    const [halfWidth, halfHeight] = this.contentSize\n    const toEdgeX = cos === 0 ? Infinity : halfWidth / Math.abs(cos)\n    const toEdgeY = sin === 0 ? Infinity : halfHeight / Math.abs(sin)\n\n    return Math.min(toEdgeX, toEdgeY)\n  }\n\n  private spawn(comet: Comet, initial: boolean) {\n    const { speed, tailLength, headScale } = CometsScene.config\n    const scale = getRandomNumber(0.5, 1.8)\n    const [x, y] = this.randomEdgePoint()\n    const start = Math.hypot(x, y)\n    const cos = x / start\n    const sin = y / start\n\n    comet.angle = Math.atan2(sin, cos)\n    comet.cos = cos\n    comet.sin = sin\n    comet.start = start\n    comet.stop = Math.min(start, this.distanceToContent(cos, sin))\n    comet.distance = initial ? getRandomNumber(comet.stop, comet.start) : comet.start\n    comet.tail = getRandomNumber(7, 18) * scale * tailLength * this.sizeScale.tail\n    comet.velocity = this.referenceDistance * getRandomNumber(0.4, 0.9) * speed\n    comet.alpha = getRandomNumber(0.55, 1)\n    comet.scale = scale * headScale * this.sizeScale.head\n  }\n\n  public draw(ctx: CanvasRenderingContext2D) {\n    const [width, height] = this.size\n    ctx.clearRect(0, 0, width, height)\n\n    const { fade: fadeSettings, headRadius, glowBlur, color, tailColor, glowColor } = CometsScene.config\n    const appear = easeInOutQuadratic(this.appearProgress)\n    ctx.shadowColor = glowColor\n\n    const centerX = width / 2\n    const centerY = height / 2\n\n    for (const { angle, cos, sin, distance, start, stop, tail, alpha, scale } of this.comets) {\n      const headX = centerX + cos * distance\n      const headY = centerY + sin * distance\n      const tailDistance = distance + tail\n      const tailX = centerX + cos * tailDistance\n      const tailY = centerY + sin * tailDistance\n      const path = Math.max(start - stop, Number.EPSILON)\n      const fade = Math.min(1, (distance - stop) / (path * fadeSettings.share)) ** fadeSettings.power\n      const radius = headRadius * scale\n      const gradient = ctx.createLinearGradient(tailX, tailY, headX, headY)\n      gradient.addColorStop(0, tailColor)\n      gradient.addColorStop(1, color)\n\n      ctx.globalAlpha = Math.min(1, alpha * fade) * appear\n      ctx.fillStyle = gradient\n      ctx.shadowBlur = glowBlur * scale\n      ctx.beginPath()\n      ctx.moveTo(tailX, tailY)\n      ctx.lineTo(headX - sin * radius, headY + cos * radius)\n      ctx.arc(headX, headY, radius, angle + Math.PI / 2, angle + (Math.PI * 3) / 2)\n      ctx.closePath()\n      ctx.fill()\n    }\n\n    ctx.shadowBlur = 0\n    ctx.globalAlpha = 1\n  }\n\n  public update(dt: number) {\n    this.appearProgress = Math.min(1, this.appearProgress + dt / CometsScene.config.appearTime)\n    for (const comet of this.comets) {\n      comet.distance -= comet.velocity * dt\n      if (comet.distance <= comet.stop) {\n        this.spawn(comet, false)\n      }\n    }\n  }\n\n  public resize(\n    width: number,\n    height: number,\n    sizeScale: CometSizeScale = this.sizeScale,\n    contentWidth: number = this.contentWidth\n  ) {\n    const [currentWidth, currentHeight] = this.size\n    const { head, tail } = this.sizeScale\n    if (\n      width === currentWidth &&\n      height === currentHeight &&\n      sizeScale.head === head &&\n      sizeScale.tail === tail &&\n      contentWidth === this.contentWidth\n    ) {\n      return\n    }\n\n    this.size = [width, height]\n    this.sizeScale = sizeScale\n    this.contentWidth = contentWidth\n    this.referenceDistance = Math.sqrt((width / 2) ** 2 + (height / 2) ** 2) + CometsScene.config.edgeOvershoot\n    const count = this.cometCount\n    if (count !== this.comets.length) {\n      this.comets = Array.from({ length: count }, () => ({\n        start: 0,\n        stop: 0,\n        angle: 0,\n        cos: 1,\n        sin: 0,\n        distance: 0,\n        velocity: 0,\n        tail: 0,\n        alpha: 0,\n        scale: 1,\n      }))\n    }\n\n    this.comets.forEach((comet) => this.spawn(comet, true))\n  }\n}\n"],"names":["CometsScene","static","count","factor","area","min","max","speed","tailLength","headScale","edgeOvershoot","content","heightShare","gap","appearTime","fade","share","power","headRadius","glowBlur","color","tailColor","tinycolor","setAlpha","toString","glowColor","size","sizeScale","head","tail","contentWidth","referenceDistance","appearProgress","comets","cometCount","width","height","this","config","base","Math","round","contentSize","randomEdgePoint","halfWidth","halfHeight","position","getRandomNumber","distanceToContent","cos","sin","toEdgeX","Infinity","abs","toEdgeY","spawn","comet","initial","scale","x","y","start","hypot","angle","atan2","stop","distance","velocity","alpha","draw","ctx","clearRect","fadeSettings","appear","easeInOutQuadratic","shadowColor","centerX","centerY","headX","headY","tailDistance","tailX","tailY","path","Number","EPSILON","radius","gradient","createLinearGradient","addColorStop","globalAlpha","fillStyle","shadowBlur","beginPath","moveTo","lineTo","arc","PI","closePath","fill","update","dt","resize","currentWidth","currentHeight","sqrt","length","Array","from","forEach"],"mappings":"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"}

package/components/GlossyButton/comets/CometsScene.mjs

@@ -0,0 +1,2 @@
+import tinycolor from'tinycolor2';import{getRandomNumber,easeInOutQuadratic}from'./utils.mjs';class CometsScene{static config={count:{factor:2,area:2400,min:6,max:16},speed:1.5,tailLength:2.5,headScale:.3,edgeOvershoot:4,content:{heightShare:1/3,gap:4},appearTime:.4,fade:{share:.6,power:1.6},headRadius:1.6,glowBlur:3.5,color:"#ffffff",tailColor:tinycolor("#ffffff").setAlpha(0).toString(),glowColor:tinycolor("#ffffff").setAlpha(.9).toString()};size=[0,0];sizeScale={head:1,tail:1};contentWidth=0;referenceDistance=0;appearProgress=0;comets=[];get cometCount(){const[t,e]=this.size;if(t<=0||e<=0)return 0;const{factor:o,area:s,min:a,max:n}=CometsScene.config.count;const i=Math.min(n,Math.max(a,Math.round(t*e/s)));return Math.round(i*o)}get contentSize(){const[,t]=this.size;const{heightShare:e,gap:o}=CometsScene.config.content;return[Math.max(0,this.contentWidth/2+o),t*e/2+o]}randomEdgePoint(){const[t,e]=this.size;const{edgeOvershoot:o}=CometsScene.config;const s=t/2+o;const a=e/2+o;const n=getRandomNumber(4*(s+a));return n<2*s?[n-s,-a]:n<2*s+2*a?[s,n-2*s-a]:n<4*s+2*a?[n-3*s-2*a,a]:[-s,n-4*s-3*a]}distanceToContent(t,e){const[o,s]=this.contentSize;const a=t===0?1/0:o/Math.abs(t);const n=e===0?1/0:s/Math.abs(e);return Math.min(a,n)}spawn(t,e){const{speed:o,tailLength:s,headScale:a}=CometsScene.config;const n=getRandomNumber(.5,1.8);const[i,c]=this.randomEdgePoint();const r=Math.hypot(i,c);const h=i/r;const l=c/r;t.angle=Math.atan2(l,h),t.cos=h,t.sin=l,t.start=r,t.stop=Math.min(r,this.distanceToContent(h,l)),t.distance=e?getRandomNumber(t.stop,t.start):t.start,t.tail=getRandomNumber(7,18)*n*s*this.sizeScale.tail,t.velocity=this.referenceDistance*getRandomNumber(.4,.9)*o,t.alpha=getRandomNumber(.55,1),t.scale=n*a*this.sizeScale.head}draw(t){const[e,o]=this.size;t.clearRect(0,0,e,o);const{fade:s,headRadius:a,glowBlur:n,color:i,tailColor:c,glowColor:r}=CometsScene.config;const h=easeInOutQuadratic(this.appearProgress);t.shadowColor=r;const l=e/2;const m=o/2;for(const{angle:e,cos:o,sin:r,distance:d,start:g,stop:f,tail:p,alpha:u,scale:S}of this.comets){const C=l+o*d;const M=m+r*d;const z=d+p;const b=l+o*z;const w=m+r*z;const P=Math.max(g-f,Number.EPSILON);const y=Math.min(1,(d-f)/(P*s.share))**s.power;const R=a*S;const N=t.createLinearGradient(b,w,C,M);N.addColorStop(0,c),N.addColorStop(1,i),t.globalAlpha=Math.min(1,u*y)*h,t.fillStyle=N,t.shadowBlur=n*S,t.beginPath(),t.moveTo(b,w),t.lineTo(C-r*R,M+o*R),t.arc(C,M,R,e+Math.PI/2,e+Math.PI*3/2),t.closePath(),t.fill()}t.shadowBlur=0,t.globalAlpha=1}update(t){this.appearProgress=Math.min(1,this.appearProgress+t/CometsScene.config.appearTime);for(const e of this.comets)e.distance-=e.velocity*t,e.distance<=e.stop&&this.spawn(e,!1)}resize(t,e,o=this.sizeScale,s=this.contentWidth){const[a,n]=this.size;const{head:i,tail:c}=this.sizeScale;if(t===a&&e===n&&o.head===i&&o.tail===c&&s===this.contentWidth)return;this.size=[t,e],this.sizeScale=o,this.contentWidth=s,this.referenceDistance=Math.sqrt((t/2)**2+(e/2)**2)+CometsScene.config.edgeOvershoot;const r=this.cometCount;r!==this.comets.length&&(this.comets=Array.from({length:r},()=>({start:0,stop:0,angle:0,cos:1,sin:0,distance:0,velocity:0,tail:0,alpha:0,scale:1}))),this.comets.forEach(t=>this.spawn(t,!0))}}export{CometsScene};
+//# sourceMappingURL=CometsScene.mjs.map

package/components/GlossyButton/comets/CometsScene.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CometsScene.mjs","sources":["../../../../../src/components/GlossyButton/comets/CometsScene.ts"],"sourcesContent":["import tinycolor from 'tinycolor2'\nimport type { Comet, CometSizeScale } from './types'\nimport { getRandomNumber, easeInOutQuadratic } from './utils'\n\nconst COLOR = '#ffffff'\n\nexport class CometsScene {\n  private static readonly config = {\n    count: { factor: 2, area: 2400, min: 6, max: 16 },\n    speed: 1.5,\n    tailLength: 2.5,\n    headScale: 0.3,\n    edgeOvershoot: 4,\n    content: { heightShare: 1 / 3, gap: 4 },\n    appearTime: 0.4,\n    fade: { share: 0.6, power: 1.6 },\n    headRadius: 1.6,\n    glowBlur: 3.5,\n    color: COLOR,\n    tailColor: tinycolor(COLOR).setAlpha(0).toString(),\n    glowColor: tinycolor(COLOR).setAlpha(0.9).toString(),\n  }\n\n  private size: [number, number] = [0, 0]\n\n  private sizeScale: CometSizeScale = { head: 1, tail: 1 }\n\n  private contentWidth = 0\n\n  private referenceDistance = 0\n\n  private appearProgress = 0\n\n  private comets: Comet[] = []\n\n  private get cometCount() {\n    const [width, height] = this.size\n    if (width <= 0 || height <= 0) {\n      return 0\n    }\n\n    const { factor, area, min, max } = CometsScene.config.count\n    const base = Math.min(max, Math.max(min, Math.round((width * height) / area)))\n\n    return Math.round(base * factor)\n  }\n\n  private get contentSize(): [number, number] {\n    const [, height] = this.size\n    const { heightShare, gap } = CometsScene.config.content\n\n    return [Math.max(0, this.contentWidth / 2 + gap), (height * heightShare) / 2 + gap]\n  }\n\n  private randomEdgePoint(): [number, number] {\n    const [width, height] = this.size\n    const { edgeOvershoot } = CometsScene.config\n    const halfWidth = width / 2 + edgeOvershoot\n    const halfHeight = height / 2 + edgeOvershoot\n    const position = getRandomNumber(4 * (halfWidth + halfHeight))\n\n    if (position < 2 * halfWidth) {\n      return [position - halfWidth, -halfHeight]\n    }\n    if (position < 2 * halfWidth + 2 * halfHeight) {\n      return [halfWidth, position - 2 * halfWidth - halfHeight]\n    }\n    if (position < 4 * halfWidth + 2 * halfHeight) {\n      return [position - 3 * halfWidth - 2 * halfHeight, halfHeight]\n    }\n\n    return [-halfWidth, position - 4 * halfWidth - 3 * halfHeight]\n  }\n\n  private distanceToContent(cos: number, sin: number) {\n    const [halfWidth, halfHeight] = this.contentSize\n    const toEdgeX = cos === 0 ? Infinity : halfWidth / Math.abs(cos)\n    const toEdgeY = sin === 0 ? Infinity : halfHeight / Math.abs(sin)\n\n    return Math.min(toEdgeX, toEdgeY)\n  }\n\n  private spawn(comet: Comet, initial: boolean) {\n    const { speed, tailLength, headScale } = CometsScene.config\n    const scale = getRandomNumber(0.5, 1.8)\n    const [x, y] = this.randomEdgePoint()\n    const start = Math.hypot(x, y)\n    const cos = x / start\n    const sin = y / start\n\n    comet.angle = Math.atan2(sin, cos)\n    comet.cos = cos\n    comet.sin = sin\n    comet.start = start\n    comet.stop = Math.min(start, this.distanceToContent(cos, sin))\n    comet.distance = initial ? getRandomNumber(comet.stop, comet.start) : comet.start\n    comet.tail = getRandomNumber(7, 18) * scale * tailLength * this.sizeScale.tail\n    comet.velocity = this.referenceDistance * getRandomNumber(0.4, 0.9) * speed\n    comet.alpha = getRandomNumber(0.55, 1)\n    comet.scale = scale * headScale * this.sizeScale.head\n  }\n\n  public draw(ctx: CanvasRenderingContext2D) {\n    const [width, height] = this.size\n    ctx.clearRect(0, 0, width, height)\n\n    const { fade: fadeSettings, headRadius, glowBlur, color, tailColor, glowColor } = CometsScene.config\n    const appear = easeInOutQuadratic(this.appearProgress)\n    ctx.shadowColor = glowColor\n\n    const centerX = width / 2\n    const centerY = height / 2\n\n    for (const { angle, cos, sin, distance, start, stop, tail, alpha, scale } of this.comets) {\n      const headX = centerX + cos * distance\n      const headY = centerY + sin * distance\n      const tailDistance = distance + tail\n      const tailX = centerX + cos * tailDistance\n      const tailY = centerY + sin * tailDistance\n      const path = Math.max(start - stop, Number.EPSILON)\n      const fade = Math.min(1, (distance - stop) / (path * fadeSettings.share)) ** fadeSettings.power\n      const radius = headRadius * scale\n      const gradient = ctx.createLinearGradient(tailX, tailY, headX, headY)\n      gradient.addColorStop(0, tailColor)\n      gradient.addColorStop(1, color)\n\n      ctx.globalAlpha = Math.min(1, alpha * fade) * appear\n      ctx.fillStyle = gradient\n      ctx.shadowBlur = glowBlur * scale\n      ctx.beginPath()\n      ctx.moveTo(tailX, tailY)\n      ctx.lineTo(headX - sin * radius, headY + cos * radius)\n      ctx.arc(headX, headY, radius, angle + Math.PI / 2, angle + (Math.PI * 3) / 2)\n      ctx.closePath()\n      ctx.fill()\n    }\n\n    ctx.shadowBlur = 0\n    ctx.globalAlpha = 1\n  }\n\n  public update(dt: number) {\n    this.appearProgress = Math.min(1, this.appearProgress + dt / CometsScene.config.appearTime)\n    for (const comet of this.comets) {\n      comet.distance -= comet.velocity * dt\n      if (comet.distance <= comet.stop) {\n        this.spawn(comet, false)\n      }\n    }\n  }\n\n  public resize(\n    width: number,\n    height: number,\n    sizeScale: CometSizeScale = this.sizeScale,\n    contentWidth: number = this.contentWidth\n  ) {\n    const [currentWidth, currentHeight] = this.size\n    const { head, tail } = this.sizeScale\n    if (\n      width === currentWidth &&\n      height === currentHeight &&\n      sizeScale.head === head &&\n      sizeScale.tail === tail &&\n      contentWidth === this.contentWidth\n    ) {\n      return\n    }\n\n    this.size = [width, height]\n    this.sizeScale = sizeScale\n    this.contentWidth = contentWidth\n    this.referenceDistance = Math.sqrt((width / 2) ** 2 + (height / 2) ** 2) + CometsScene.config.edgeOvershoot\n    const count = this.cometCount\n    if (count !== this.comets.length) {\n      this.comets = Array.from({ length: count }, () => ({\n        start: 0,\n        stop: 0,\n        angle: 0,\n        cos: 1,\n        sin: 0,\n        distance: 0,\n        velocity: 0,\n        tail: 0,\n        alpha: 0,\n        scale: 1,\n      }))\n    }\n\n    this.comets.forEach((comet) => this.spawn(comet, true))\n  }\n}\n"],"names":["CometsScene","static","count","factor","area","min","max","speed","tailLength","headScale","edgeOvershoot","content","heightShare","gap","appearTime","fade","share","power","headRadius","glowBlur","color","tailColor","tinycolor","setAlpha","toString","glowColor","size","sizeScale","head","tail","contentWidth","referenceDistance","appearProgress","comets","cometCount","width","height","this","config","base","Math","round","contentSize","randomEdgePoint","halfWidth","halfHeight","position","getRandomNumber","distanceToContent","cos","sin","toEdgeX","Infinity","abs","toEdgeY","spawn","comet","initial","scale","x","y","start","hypot","angle","atan2","stop","distance","velocity","alpha","draw","ctx","clearRect","fadeSettings","appear","easeInOutQuadratic","shadowColor","centerX","centerY","headX","headY","tailDistance","tailX","tailY","path","Number","EPSILON","radius","gradient","createLinearGradient","addColorStop","globalAlpha","fillStyle","shadowBlur","beginPath","moveTo","lineTo","arc","PI","closePath","fill","update","dt","resize","currentWidth","currentHeight","sqrt","length","Array","from","forEach"],"mappings":"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"}

package/components/GlossyButton/comets/utils.js

@@ -0,0 +1,2 @@
+'use strict';exports.easeInOutQuadratic=t=>t<.5?2*t*t:1-(-2*t+2)**2/2,exports.getRandomNumber=(t,a)=>a===void 0?Math.random()*t:t+Math.random()*(a-t);
+//# sourceMappingURL=utils.js.map

package/components/GlossyButton/comets/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../../../../../src/components/GlossyButton/comets/utils.ts"],"sourcesContent":["const getRandomNumber = (minOrMax: number, max?: number) => {\n  if (max === undefined) {\n    return Math.random() * minOrMax\n  }\n\n  return minOrMax + Math.random() * (max - minOrMax)\n}\n\nconst easeInOutQuadratic = (x: number) => (x < 0.5 ? 2 * x * x : 1 - (-2 * x + 2) ** 2 / 2)\n\nexport { getRandomNumber, easeInOutQuadratic }\n"],"names":["x","getRandomNumber","minOrMax","max","undefined","Math","random"],"mappings":"wCAQ4BA,GAAeA,EAAI,GAAM,EAAIA,EAAIA,EAAI,IAAK,EAAKA,EAAI,IAAM,EAAI,0BARjEC,CAACC,EAAkBC,IACrCA,SAAQC,EACHC,KAAKC,SAAWJ,EAGlBA,EAAWG,KAAKC,UAAYH,EAAMD"}

package/components/GlossyButton/comets/utils.mjs

@@ -0,0 +1,2 @@
+const getRandomNumber=(a,t)=>t===void 0?Math.random()*a:a+Math.random()*(t-a);const easeInOutQuadratic=a=>a<.5?2*a*a:1-(-2*a+2)**2/2;export{easeInOutQuadratic,getRandomNumber};
+//# sourceMappingURL=utils.mjs.map

package/components/GlossyButton/comets/utils.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.mjs","sources":["../../../../../src/components/GlossyButton/comets/utils.ts"],"sourcesContent":["const getRandomNumber = (minOrMax: number, max?: number) => {\n  if (max === undefined) {\n    return Math.random() * minOrMax\n  }\n\n  return minOrMax + Math.random() * (max - minOrMax)\n}\n\nconst easeInOutQuadratic = (x: number) => (x < 0.5 ? 2 * x * x : 1 - (-2 * x + 2) ** 2 / 2)\n\nexport { getRandomNumber, easeInOutQuadratic }\n"],"names":["getRandomNumber","minOrMax","max","undefined","Math","random","easeInOutQuadratic","x"],"mappings":"AAAA,MAAMA,gBAAkBA,CAACC,EAAkBC,IACrCA,SAAQC,EACHC,KAAKC,SAAWJ,EAGlBA,EAAWG,KAAKC,UAAYH,EAAMD,GAG3C,MAAMK,mBAAsBC,GAAeA,EAAI,GAAM,EAAIA,EAAIA,EAAI,IAAK,EAAKA,EAAI,IAAM,EAAI"}

package/components/GlossyButton/sizes.js

@@ -0,0 +1,2 @@
+'use strict';exports.SIZES={l:{paddingLeft:64,paddingRight:64,'--glossy-button-gap':'12px','--glossy-button-height':'104px','--glossy-button-shadow-blur':'38px','--glossy-button-highlight-blur':'48px','--glossy-button-gloss':'100px','--glossy-button-comet-head-scale':'1.17','--glossy-button-comet-tail-scale':'1.07'},m:{paddingLeft:48,paddingRight:48,'--glossy-button-gap':'10px','--glossy-button-height':'88px','--glossy-button-shadow-blur':'32px','--glossy-button-highlight-blur':'40px','--glossy-button-gloss':'84px','--glossy-button-comet-head-scale':'1','--glossy-button-comet-tail-scale':'1'},s:{paddingLeft:40,paddingRight:40,'--glossy-button-gap':'8px','--glossy-button-height':'72px','--glossy-button-shadow-blur':'28px','--glossy-button-highlight-blur':'32px','--glossy-button-gloss':'78px','--glossy-button-comet-head-scale':'0.83','--glossy-button-comet-tail-scale':'0.86'},xs:{paddingLeft:32,paddingRight:32,'--glossy-button-gap':'6px','--glossy-button-height':'56px','--glossy-button-shadow-blur':'20px','--glossy-button-highlight-blur':'26px','--glossy-button-gloss':'63px','--glossy-button-comet-head-scale':'0.67','--glossy-button-comet-tail-scale':'0.71'}},exports.SIZES_ICON={l:{fontSize:40},m:{fontSize:32},s:{fontSize:24},xs:{fontSize:20}},exports.SIZES_TEXT={l:{fontSize:28},m:{fontSize:24},s:{fontSize:20},xs:{fontSize:16}};
+//# sourceMappingURL=sizes.js.map

package/components/GlossyButton/sizes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sizes.js","sources":["../../../../src/components/GlossyButton/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n  l: {\n    paddingLeft: 64,\n    paddingRight: 64,\n    '--glossy-button-gap': '12px',\n    '--glossy-button-height': '104px',\n    '--glossy-button-shadow-blur': '38px',\n    '--glossy-button-highlight-blur': '48px',\n    '--glossy-button-gloss': '100px',\n    '--glossy-button-comet-head-scale': '1.17',\n    '--glossy-button-comet-tail-scale': '1.07',\n  },\n  m: {\n    paddingLeft: 48,\n    paddingRight: 48,\n    '--glossy-button-gap': '10px',\n    '--glossy-button-height': '88px',\n    '--glossy-button-shadow-blur': '32px',\n    '--glossy-button-highlight-blur': '40px',\n    '--glossy-button-gloss': '84px',\n    '--glossy-button-comet-head-scale': '1',\n    '--glossy-button-comet-tail-scale': '1',\n  },\n  s: {\n    paddingLeft: 40,\n    paddingRight: 40,\n    '--glossy-button-gap': '8px',\n    '--glossy-button-height': '72px',\n    '--glossy-button-shadow-blur': '28px',\n    '--glossy-button-highlight-blur': '32px',\n    '--glossy-button-gloss': '78px',\n    '--glossy-button-comet-head-scale': '0.83',\n    '--glossy-button-comet-tail-scale': '0.86',\n  },\n  xs: {\n    paddingLeft: 32,\n    paddingRight: 32,\n    '--glossy-button-gap': '6px',\n    '--glossy-button-height': '56px',\n    '--glossy-button-shadow-blur': '20px',\n    '--glossy-button-highlight-blur': '26px',\n    '--glossy-button-gloss': '63px',\n    '--glossy-button-comet-head-scale': '0.67',\n    '--glossy-button-comet-tail-scale': '0.71',\n  },\n}\n\nexport const SIZES_ICON: Record<Size, CSSProperties> = {\n  l: { fontSize: 40 },\n  m: { fontSize: 32 },\n  s: { fontSize: 24 },\n  xs: { fontSize: 20 },\n}\n\nexport const SIZES_TEXT: Record<Size, CSSProperties> = {\n  l: { fontSize: 28 },\n  m: { fontSize: 24 },\n  s: { fontSize: 20 },\n  xs: { fontSize: 16 },\n}\n"],"names":["l","paddingLeft","paddingRight","m","s","xs","fontSize"],"mappings":"2BAGkD,CAChDA,EAAG,CACDC,YAAa,GACbC,aAAc,GACd,sBAAuB,OACvB,yBAA0B,QAC1B,8BAA+B,OAC/B,iCAAkC,OAClC,wBAAyB,QACzB,mCAAoC,OACpC,mCAAoC,QAEtCC,EAAG,CACDF,YAAa,GACbC,aAAc,GACd,sBAAuB,OACvB,yBAA0B,OAC1B,8BAA+B,OAC/B,iCAAkC,OAClC,wBAAyB,OACzB,mCAAoC,IACpC,mCAAoC,KAEtCE,EAAG,CACDH,YAAa,GACbC,aAAc,GACd,sBAAuB,MACvB,yBAA0B,OAC1B,8BAA+B,OAC/B,iCAAkC,OAClC,wBAAyB,OACzB,mCAAoC,OACpC,mCAAoC,QAEtCG,GAAI,CACFJ,YAAa,GACbC,aAAc,GACd,sBAAuB,MACvB,yBAA0B,OAC1B,8BAA+B,OAC/B,iCAAkC,OAClC,wBAAyB,OACzB,mCAAoC,OACpC,mCAAoC,4BAIe,CACrDF,EAAG,CAAEM,SAAU,IACfH,EAAG,CAAEG,SAAU,IACfF,EAAG,CAAEE,SAAU,IACfD,GAAI,CAAEC,SAAU,wBAGqC,CACrDN,EAAG,CAAEM,SAAU,IACfH,EAAG,CAAEG,SAAU,IACfF,EAAG,CAAEE,SAAU,IACfD,GAAI,CAAEC,SAAU"}

package/components/GlossyButton/sizes.mjs

@@ -0,0 +1,2 @@
+const SIZES={l:{paddingLeft:64,paddingRight:64,'--glossy-button-gap':'12px','--glossy-button-height':'104px','--glossy-button-shadow-blur':'38px','--glossy-button-highlight-blur':'48px','--glossy-button-gloss':'100px','--glossy-button-comet-head-scale':'1.17','--glossy-button-comet-tail-scale':'1.07'},m:{paddingLeft:48,paddingRight:48,'--glossy-button-gap':'10px','--glossy-button-height':'88px','--glossy-button-shadow-blur':'32px','--glossy-button-highlight-blur':'40px','--glossy-button-gloss':'84px','--glossy-button-comet-head-scale':'1','--glossy-button-comet-tail-scale':'1'},s:{paddingLeft:40,paddingRight:40,'--glossy-button-gap':'8px','--glossy-button-height':'72px','--glossy-button-shadow-blur':'28px','--glossy-button-highlight-blur':'32px','--glossy-button-gloss':'78px','--glossy-button-comet-head-scale':'0.83','--glossy-button-comet-tail-scale':'0.86'},xs:{paddingLeft:32,paddingRight:32,'--glossy-button-gap':'6px','--glossy-button-height':'56px','--glossy-button-shadow-blur':'20px','--glossy-button-highlight-blur':'26px','--glossy-button-gloss':'63px','--glossy-button-comet-head-scale':'0.67','--glossy-button-comet-tail-scale':'0.71'}};const SIZES_ICON={l:{fontSize:40},m:{fontSize:32},s:{fontSize:24},xs:{fontSize:20}};const SIZES_TEXT={l:{fontSize:28},m:{fontSize:24},s:{fontSize:20},xs:{fontSize:16}};export{SIZES,SIZES_ICON,SIZES_TEXT};
+//# sourceMappingURL=sizes.mjs.map

package/components/GlossyButton/sizes.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"sizes.mjs","sources":["../../../../src/components/GlossyButton/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n  l: {\n    paddingLeft: 64,\n    paddingRight: 64,\n    '--glossy-button-gap': '12px',\n    '--glossy-button-height': '104px',\n    '--glossy-button-shadow-blur': '38px',\n    '--glossy-button-highlight-blur': '48px',\n    '--glossy-button-gloss': '100px',\n    '--glossy-button-comet-head-scale': '1.17',\n    '--glossy-button-comet-tail-scale': '1.07',\n  },\n  m: {\n    paddingLeft: 48,\n    paddingRight: 48,\n    '--glossy-button-gap': '10px',\n    '--glossy-button-height': '88px',\n    '--glossy-button-shadow-blur': '32px',\n    '--glossy-button-highlight-blur': '40px',\n    '--glossy-button-gloss': '84px',\n    '--glossy-button-comet-head-scale': '1',\n    '--glossy-button-comet-tail-scale': '1',\n  },\n  s: {\n    paddingLeft: 40,\n    paddingRight: 40,\n    '--glossy-button-gap': '8px',\n    '--glossy-button-height': '72px',\n    '--glossy-button-shadow-blur': '28px',\n    '--glossy-button-highlight-blur': '32px',\n    '--glossy-button-gloss': '78px',\n    '--glossy-button-comet-head-scale': '0.83',\n    '--glossy-button-comet-tail-scale': '0.86',\n  },\n  xs: {\n    paddingLeft: 32,\n    paddingRight: 32,\n    '--glossy-button-gap': '6px',\n    '--glossy-button-height': '56px',\n    '--glossy-button-shadow-blur': '20px',\n    '--glossy-button-highlight-blur': '26px',\n    '--glossy-button-gloss': '63px',\n    '--glossy-button-comet-head-scale': '0.67',\n    '--glossy-button-comet-tail-scale': '0.71',\n  },\n}\n\nexport const SIZES_ICON: Record<Size, CSSProperties> = {\n  l: { fontSize: 40 },\n  m: { fontSize: 32 },\n  s: { fontSize: 24 },\n  xs: { fontSize: 20 },\n}\n\nexport const SIZES_TEXT: Record<Size, CSSProperties> = {\n  l: { fontSize: 28 },\n  m: { fontSize: 24 },\n  s: { fontSize: 20 },\n  xs: { fontSize: 16 },\n}\n"],"names":["SIZES","l","paddingLeft","paddingRight","m","s","xs","SIZES_ICON","fontSize","SIZES_TEXT"],"mappings":"AAGO,MAAMA,MAAqC,CAChDC,EAAG,CACDC,YAAa,GACbC,aAAc,GACd,sBAAuB,OACvB,yBAA0B,QAC1B,8BAA+B,OAC/B,iCAAkC,OAClC,wBAAyB,QACzB,mCAAoC,OACpC,mCAAoC,QAEtCC,EAAG,CACDF,YAAa,GACbC,aAAc,GACd,sBAAuB,OACvB,yBAA0B,OAC1B,8BAA+B,OAC/B,iCAAkC,OAClC,wBAAyB,OACzB,mCAAoC,IACpC,mCAAoC,KAEtCE,EAAG,CACDH,YAAa,GACbC,aAAc,GACd,sBAAuB,MACvB,yBAA0B,OAC1B,8BAA+B,OAC/B,iCAAkC,OAClC,wBAAyB,OACzB,mCAAoC,OACpC,mCAAoC,QAEtCG,GAAI,CACFJ,YAAa,GACbC,aAAc,GACd,sBAAuB,MACvB,yBAA0B,OAC1B,8BAA+B,OAC/B,iCAAkC,OAClC,wBAAyB,OACzB,mCAAoC,OACpC,mCAAoC,SAIjC,MAAMI,WAA0C,CACrDN,EAAG,CAAEO,SAAU,IACfJ,EAAG,CAAEI,SAAU,IACfH,EAAG,CAAEG,SAAU,IACfF,GAAI,CAAEE,SAAU,KAGX,MAAMC,WAA0C,CACrDR,EAAG,CAAEO,SAAU,IACfJ,EAAG,CAAEI,SAAU,IACfH,EAAG,CAAEG,SAAU,IACfF,GAAI,CAAEE,SAAU"}

package/components/GlossyButton/style.js

@@ -0,0 +1,2 @@
+'use strict';var styled=require('styled-components');var style=require('../../shared/utils/style.js');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveMargin=require('../../mixins/responsive-margin.js');var hover=require('../../mixins/hover.js');var cursor=require('../../mixins/cursor.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const shouldForwardGlossyButtonProp=style.createShouldForwardProp(o=>!['inline','variant','shadow','animated','loading'].includes(o));const unscale=o=>`calc((${o}) / var(--glossy-button-scale))`;const Glossy=styled__default.default.span.withConfig({displayName:"GlossyButton__Glossy",componentId:"ui__sc-i66829-0"})(["pointer-events:none;position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;transition-property:box-shadow;transition-duration:300ms;&::before{content:'';position:absolute;top:0;right:1px;bottom:0;left:1px;z-index:-1;border-radius:inherit;transition-property:background-color;transition-duration:300ms;}"]);const height='var(--glossy-button-height)';const shadowOffsetY=unscale(`(${height} - 24px) / 16`);const shadowBlur=unscale('var(--glossy-button-shadow-blur)');const shadowSpread=unscale(`${height} / 8 - 1px`);const shadowHoverBlur=unscale(`${height} / 2 + 4px`);const shadowHoverSpread=unscale(`${height} / 4 + 2px`);const focusInnerWidth=unscale('2px');const focusOuterWidth=unscale('4px');const highlightOffsetY=`calc((${height} - 24px) / 16)`;const highlightBlur='var(--glossy-button-highlight-blur)';const gloss='var(--glossy-button-gloss)';const template=(o,e)=>{const s=e?`0 ${shadowOffsetY} ${shadowBlur} ${shadowSpread} ${o.shadowColor}`:'0 0 0 0 transparent';const t=`0 0 ${shadowHoverBlur} ${shadowHoverSpread} ${o.shadowColor}`;const n=`0 0 0 ${focusInnerWidth} ${o.focusInnerColor}, 0 0 0 ${focusOuterWidth} ${o.focusColor}`;const r='0 0 0 0 transparent, 0 0 0 0 transparent';return`\n    color: ${o.color};\n    box-shadow: ${r}, ${s};\n\n    & ${Glossy} {\n      box-shadow:\n        0 ${highlightOffsetY} ${highlightBlur} 0 ${o.highlightColor} inset,\n        0 calc(-1 * ${highlightOffsetY}) ${highlightBlur} 0 ${o.highlightColor} inset,\n        0 calc(-1 * ${gloss}) ${gloss} 0 ${o.glossColor} inset;\n    }\n\n    & ${Glossy}::before {\n      background-color: ${o.backgroundColor};\n    }\n\n    ${hover.hover(`\n      box-shadow: ${r}, ${t};\n    `)}\n\n    &:focus-visible {\n      box-shadow: ${n}, ${s};\n      outline: 2px solid transparent;\n      outline-offset: 2px;\n    }\n\n    ${hover.hover(`\n        box-shadow: ${n}, ${t};\n      `,'&:focus-visible:hover')}\n    \n    &:disabled {\n      box-shadow: none;\n    }\n\n    &:disabled ${Glossy} {\n      box-shadow:\n        0 ${highlightOffsetY} ${highlightBlur} 0 ${o.disabledHighlightColor} inset,\n        0 calc(-1 * ${highlightOffsetY}) ${highlightBlur} 0 ${o.disabledHighlightColor} inset,\n        0 calc(-1 * ${gloss}) ${gloss} 0 ${o.disabledGlossColor} inset;\n    }\n\n    &:disabled ${Glossy}::before {\n      background-color: ${o.disabledBackgroundColor};\n    }\n`};const COLOR_SCHEMA={primary:styled.css(["",""],o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.theme.colors['bg-brand-primary-500'],disabledBackgroundColor:o.theme.colors['bg-disabled-glossy'],shadowColor:o.theme.colors['effect-shadow-primary-default'],highlightColor:o.theme.colors['effect-shadow-primary-light'],glossColor:o.theme.colors['effect-shadow-primary-glossy'],disabledHighlightColor:o.theme.colors['effect-shadow-disable-light'],disabledGlossColor:o.theme.colors['effect-shadow-disable-glossy'],focusInnerColor:o.theme.colors['border-focus-inner'],focusColor:o.theme.colors['border-focus']},o.shadow)),secondary:styled.css(["",""],o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.theme.colors['bg-brand-secondary-500'],disabledBackgroundColor:o.theme.colors['bg-disabled-glossy'],shadowColor:o.theme.colors['effect-shadow-secondary-default'],highlightColor:o.theme.colors['effect-shadow-secondary-light'],glossColor:o.theme.colors['effect-shadow-secondary-glossy'],disabledHighlightColor:o.theme.colors['effect-shadow-disable-light'],disabledGlossColor:o.theme.colors['effect-shadow-disable-glossy'],focusInnerColor:o.theme.colors['border-focus-inner'],focusColor:o.theme.colors['border-focus']},o.shadow)),black:styled.css(["",""],o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.theme.colors['bg-onmain-contrast'],disabledBackgroundColor:o.theme.colors['bg-disabled-glossy'],shadowColor:o.theme.colors['effect-shadow-black-default'],highlightColor:o.theme.colors['effect-shadow-black-light'],glossColor:o.theme.colors['effect-shadow-black-glossy'],disabledHighlightColor:o.theme.colors['effect-shadow-disable-light'],disabledGlossColor:o.theme.colors['effect-shadow-disable-glossy'],focusInnerColor:o.theme.colors['border-focus-inner'],focusColor:o.theme.colors['border-focus']},o.shadow))};const Root=styled__default.default.button.withConfig({shouldForwardProp:shouldForwardGlossyButtonProp}).withConfig({displayName:"GlossyButton__Root",componentId:"ui__sc-i66829-1"})([""," "," &:active:not(:disabled){--glossy-button-scale:0.95;}@media (prefers-reduced-motion:reduce){&,&:hover:not(:disabled),&:active:not(:disabled){--glossy-button-scale:1;transition-duration:0s;}}"," "," "," ",""],o=>`\n      --glossy-button-scale: 1;\n      display: ${o.inline?'inline-flex':'flex'};\n      height: var(--glossy-button-height);\n      border-radius: calc(var(--glossy-button-height) / 2);\n      box-sizing: border-box;\n      position: relative;\n      justify-content: center;\n      align-items: center;\n      user-select: none;\n      border: none;\n      text-decoration: none;\n      appearance: none;\n      background-color: transparent;\n      -webkit-tap-highlight-color: transparent;\n      white-space: nowrap;\n      vertical-align: top;\n      font: inherit;\n      transform: scale(var(--glossy-button-scale));\n      transition-property: box-shadow, transform;\n      transition-duration: 200ms;\n      transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);\n      will-change: transform;\n    `,hover.hover("\n      --glossy-button-scale: 1.05;\n    ",'&:hover:not(:disabled)'),o=>COLOR_SCHEMA[o.variant],cursor.cursor,responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);const Content=styled__default.default.span.withConfig({displayName:"GlossyButton__Content",componentId:"ui__sc-i66829-2"})(["position:relative;display:flex;align-items:center;justify-content:center;&[aria-hidden='true'],&[aria-hidden='true'] *{visibility:hidden !important;}& > *:not(:last-child){margin-right:var(--glossy-button-gap);}"]);const ContentWithStatus=styled__default.default(Content).withConfig({displayName:"GlossyButton__ContentWithStatus",componentId:"ui__sc-i66829-3"})(["box-sizing:border-box;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);"]);const spinAnimation=styled.keyframes(["100%{transform:rotate(360deg);}"]);const IconAnimation=styled__default.default.span.withConfig({displayName:"GlossyButton__IconAnimation",componentId:"ui__sc-i66829-4"})(["box-sizing:border-box;display:flex;align-items:center;justify-content:center;animation:"," 1600ms infinite linear;@media (prefers-reduced-motion:reduce){animation-name:none;}"],spinAnimation);const Comets=styled__default.default.canvas.withConfig({displayName:"GlossyButton__Comets",componentId:"ui__sc-i66829-5"})(["visibility:hidden;pointer-events:none;position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;"]);exports.Comets=Comets,exports.Content=Content,exports.ContentWithStatus=ContentWithStatus,exports.Glossy=Glossy,exports.IconAnimation=IconAnimation,exports.Root=Root;
+//# sourceMappingURL=style.js.map

package/components/GlossyButton/style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.js","sources":["../../../../src/components/GlossyButton/style.ts"],"sourcesContent":["import styled, { css, keyframes } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport { hover } from 'mixins/hover'\nimport { cursor } from 'mixins/cursor'\nimport type { StyledGlossyButtonProps, GlossyButtonPalette } from './types'\n\nconst shouldForwardGlossyButtonProp = createShouldForwardProp(\n  (propKey) => !['inline', 'variant', 'shadow', 'animated', 'loading'].includes(propKey)\n)\n\nconst unscale = (value: string) => `calc((${value}) / var(--glossy-button-scale))`\n\nexport const Glossy = styled.span`\n  pointer-events: none;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  border-radius: inherit;\n  transition-property: box-shadow;\n  transition-duration: 300ms;\n\n  &::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    right: 1px;\n    bottom: 0;\n    left: 1px;\n    z-index: -1;\n    border-radius: inherit;\n    transition-property: background-color;\n    transition-duration: 300ms;\n  }\n`\n\nconst height = 'var(--glossy-button-height)'\nconst shadowOffsetY = unscale(`(${height} - 24px) / 16`)\nconst shadowBlur = unscale('var(--glossy-button-shadow-blur)')\nconst shadowSpread = unscale(`${height} / 8 - 1px`)\nconst shadowHoverBlur = unscale(`${height} / 2 + 4px`)\nconst shadowHoverSpread = unscale(`${height} / 4 + 2px`)\nconst focusInnerWidth = unscale('2px')\nconst focusOuterWidth = unscale('4px')\nconst highlightOffsetY = `calc((${height} - 24px) / 16)`\nconst highlightBlur = 'var(--glossy-button-highlight-blur)'\nconst gloss = 'var(--glossy-button-gloss)'\n\nconst template = (palette: GlossyButtonPalette, hasShadow?: boolean) => {\n  const shadow = hasShadow\n    ? `0 ${shadowOffsetY} ${shadowBlur} ${shadowSpread} ${palette.shadowColor}`\n    : '0 0 0 0 transparent'\n  const shadowHover = `0 0 ${shadowHoverBlur} ${shadowHoverSpread} ${palette.shadowColor}`\n  const focus = `0 0 0 ${focusInnerWidth} ${palette.focusInnerColor}, 0 0 0 ${focusOuterWidth} ${palette.focusColor}`\n  const noFocus = '0 0 0 0 transparent, 0 0 0 0 transparent'\n\n  return `\n    color: ${palette.color};\n    box-shadow: ${noFocus}, ${shadow};\n\n    & ${Glossy} {\n      box-shadow:\n        0 ${highlightOffsetY} ${highlightBlur} 0 ${palette.highlightColor} inset,\n        0 calc(-1 * ${highlightOffsetY}) ${highlightBlur} 0 ${palette.highlightColor} inset,\n        0 calc(-1 * ${gloss}) ${gloss} 0 ${palette.glossColor} inset;\n    }\n\n    & ${Glossy}::before {\n      background-color: ${palette.backgroundColor};\n    }\n\n    ${hover(`\n      box-shadow: ${noFocus}, ${shadowHover};\n    `)}\n\n    &:focus-visible {\n      box-shadow: ${focus}, ${shadow};\n      outline: 2px solid transparent;\n      outline-offset: 2px;\n    }\n\n    ${hover(\n      `\n        box-shadow: ${focus}, ${shadowHover};\n      `,\n      '&:focus-visible:hover'\n    )}\n    \n    &:disabled {\n      box-shadow: none;\n    }\n\n    &:disabled ${Glossy} {\n      box-shadow:\n        0 ${highlightOffsetY} ${highlightBlur} 0 ${palette.disabledHighlightColor} inset,\n        0 calc(-1 * ${highlightOffsetY}) ${highlightBlur} 0 ${palette.disabledHighlightColor} inset,\n        0 calc(-1 * ${gloss}) ${gloss} 0 ${palette.disabledGlossColor} inset;\n    }\n\n    &:disabled ${Glossy}::before {\n      background-color: ${palette.disabledBackgroundColor};\n    }\n`\n}\n\nconst COLOR_SCHEMA = {\n  primary: css<StyledGlossyButtonProps>`\n    ${(props) =>\n      template(\n        {\n          color: props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.theme.colors['bg-brand-primary-500'],\n          disabledBackgroundColor: props.theme.colors['bg-disabled-glossy'],\n          shadowColor: props.theme.colors['effect-shadow-primary-default'],\n          highlightColor: props.theme.colors['effect-shadow-primary-light'],\n          glossColor: props.theme.colors['effect-shadow-primary-glossy'],\n          disabledHighlightColor: props.theme.colors['effect-shadow-disable-light'],\n          disabledGlossColor: props.theme.colors['effect-shadow-disable-glossy'],\n          focusInnerColor: props.theme.colors['border-focus-inner'],\n          focusColor: props.theme.colors['border-focus'],\n        },\n        props.shadow\n      )}\n  `,\n  secondary: css<StyledGlossyButtonProps>`\n    ${(props) =>\n      template(\n        {\n          color: props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.theme.colors['bg-brand-secondary-500'],\n          disabledBackgroundColor: props.theme.colors['bg-disabled-glossy'],\n          shadowColor: props.theme.colors['effect-shadow-secondary-default'],\n          highlightColor: props.theme.colors['effect-shadow-secondary-light'],\n          glossColor: props.theme.colors['effect-shadow-secondary-glossy'],\n          disabledHighlightColor: props.theme.colors['effect-shadow-disable-light'],\n          disabledGlossColor: props.theme.colors['effect-shadow-disable-glossy'],\n          focusInnerColor: props.theme.colors['border-focus-inner'],\n          focusColor: props.theme.colors['border-focus'],\n        },\n        props.shadow\n      )}\n  `,\n  black: css<StyledGlossyButtonProps>`\n    ${(props) =>\n      template(\n        {\n          color: props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.theme.colors['bg-onmain-contrast'],\n          disabledBackgroundColor: props.theme.colors['bg-disabled-glossy'],\n          shadowColor: props.theme.colors['effect-shadow-black-default'],\n          highlightColor: props.theme.colors['effect-shadow-black-light'],\n          glossColor: props.theme.colors['effect-shadow-black-glossy'],\n          disabledHighlightColor: props.theme.colors['effect-shadow-disable-light'],\n          disabledGlossColor: props.theme.colors['effect-shadow-disable-glossy'],\n          focusInnerColor: props.theme.colors['border-focus-inner'],\n          focusColor: props.theme.colors['border-focus'],\n        },\n        props.shadow\n      )}\n  `,\n}\n\nexport const Root = styled.button.withConfig<StyledGlossyButtonProps>({\n  shouldForwardProp: shouldForwardGlossyButtonProp,\n})`\n  ${(props) => {\n    const display = props.inline ? 'inline-flex' : 'flex'\n\n    return `\n      --glossy-button-scale: 1;\n      display: ${display};\n      height: var(--glossy-button-height);\n      border-radius: calc(var(--glossy-button-height) / 2);\n      box-sizing: border-box;\n      position: relative;\n      justify-content: center;\n      align-items: center;\n      user-select: none;\n      border: none;\n      text-decoration: none;\n      appearance: none;\n      background-color: transparent;\n      -webkit-tap-highlight-color: transparent;\n      white-space: nowrap;\n      vertical-align: top;\n      font: inherit;\n      transform: scale(var(--glossy-button-scale));\n      transition-property: box-shadow, transform;\n      transition-duration: 200ms;\n      transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);\n      will-change: transform;\n    `\n  }}\n\n  ${hover(\n    `\n      --glossy-button-scale: 1.05;\n    `,\n    '&:hover:not(:disabled)'\n  )}\n\n  &:active:not(:disabled) {\n    --glossy-button-scale: 0.95;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    &,\n    &:hover:not(:disabled),\n    &:active:not(:disabled) {\n      --glossy-button-scale: 1;\n      transition-duration: 0s;\n    }\n  }\n\n  ${(props) => COLOR_SCHEMA[props.variant]}\n\n  ${cursor}\n  ${responsiveSize}\n  ${responsiveMargin}\n`\n\nexport const Content = styled.span`\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  &[aria-hidden='true'],\n  &[aria-hidden='true'] * {\n    visibility: hidden !important;\n  }\n\n  & > *:not(:last-child) {\n    margin-right: var(--glossy-button-gap);\n  }\n`\n\nexport const ContentWithStatus = styled(Content)`\n  box-sizing: border-box;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n`\n\nconst spinAnimation = keyframes`\n  100% {\n    transform: rotate(360deg);\n  }\n`\n\nexport const IconAnimation = styled.span`\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  animation: ${spinAnimation} 1600ms infinite linear;\n\n  @media (prefers-reduced-motion: reduce) {\n    animation-name: none;\n  }\n`\n\nexport const Comets = styled.canvas`\n  visibility: hidden;\n  pointer-events: none;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  border-radius: inherit;\n`\n"],"names":["shouldForwardGlossyButtonProp","createShouldForwardProp","propKey","includes","unscale","value","Glossy","styled","span","withConfig","displayName","componentId","height","shadowOffsetY","shadowBlur","shadowSpread","shadowHoverBlur","shadowHoverSpread","focusInnerWidth","focusOuterWidth","highlightOffsetY","highlightBlur","gloss","template","palette","hasShadow","shadow","shadowColor","shadowHover","focus","focusInnerColor","focusColor","noFocus","color","highlightColor","glossColor","backgroundColor","hover","disabledHighlightColor","disabledGlossColor","disabledBackgroundColor","COLOR_SCHEMA","primary","css","props","theme","colors","secondary","black","Root","button","shouldForwardProp","inline","variant","cursor","responsiveSize","responsiveMargin","Content","ContentWithStatus","spinAnimation","keyframes","IconAnimation","Comets","canvas"],"mappings":"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"}

package/components/GlossyButton/style.mjs

@@ -0,0 +1,2 @@
+import styled,{css,keyframes}from'styled-components';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveMargin}from'../../mixins/responsive-margin.mjs';import{hover}from'../../mixins/hover.mjs';import{cursor}from'../../mixins/cursor.mjs';const shouldForwardGlossyButtonProp=createShouldForwardProp(o=>!['inline','variant','shadow','animated','loading'].includes(o));const unscale=o=>`calc((${o}) / var(--glossy-button-scale))`;const Glossy=styled.span.withConfig({displayName:"GlossyButton__Glossy",componentId:"ui__sc-i66829-0"})(["pointer-events:none;position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;transition-property:box-shadow;transition-duration:300ms;&::before{content:'';position:absolute;top:0;right:1px;bottom:0;left:1px;z-index:-1;border-radius:inherit;transition-property:background-color;transition-duration:300ms;}"]);const height='var(--glossy-button-height)';const shadowOffsetY=unscale(`(${height} - 24px) / 16`);const shadowBlur=unscale('var(--glossy-button-shadow-blur)');const shadowSpread=unscale(`${height} / 8 - 1px`);const shadowHoverBlur=unscale(`${height} / 2 + 4px`);const shadowHoverSpread=unscale(`${height} / 4 + 2px`);const focusInnerWidth=unscale('2px');const focusOuterWidth=unscale('4px');const highlightOffsetY=`calc((${height} - 24px) / 16)`;const highlightBlur='var(--glossy-button-highlight-blur)';const gloss='var(--glossy-button-gloss)';const template=(o,s)=>{const e=s?`0 ${shadowOffsetY} ${shadowBlur} ${shadowSpread} ${o.shadowColor}`:'0 0 0 0 transparent';const t=`0 0 ${shadowHoverBlur} ${shadowHoverSpread} ${o.shadowColor}`;const n=`0 0 0 ${focusInnerWidth} ${o.focusInnerColor}, 0 0 0 ${focusOuterWidth} ${o.focusColor}`;const r='0 0 0 0 transparent, 0 0 0 0 transparent';return`\n    color: ${o.color};\n    box-shadow: ${r}, ${e};\n\n    & ${Glossy} {\n      box-shadow:\n        0 ${highlightOffsetY} ${highlightBlur} 0 ${o.highlightColor} inset,\n        0 calc(-1 * ${highlightOffsetY}) ${highlightBlur} 0 ${o.highlightColor} inset,\n        0 calc(-1 * ${gloss}) ${gloss} 0 ${o.glossColor} inset;\n    }\n\n    & ${Glossy}::before {\n      background-color: ${o.backgroundColor};\n    }\n\n    ${hover(`\n      box-shadow: ${r}, ${t};\n    `)}\n\n    &:focus-visible {\n      box-shadow: ${n}, ${e};\n      outline: 2px solid transparent;\n      outline-offset: 2px;\n    }\n\n    ${hover(`\n        box-shadow: ${n}, ${t};\n      `,'&:focus-visible:hover')}\n    \n    &:disabled {\n      box-shadow: none;\n    }\n\n    &:disabled ${Glossy} {\n      box-shadow:\n        0 ${highlightOffsetY} ${highlightBlur} 0 ${o.disabledHighlightColor} inset,\n        0 calc(-1 * ${highlightOffsetY}) ${highlightBlur} 0 ${o.disabledHighlightColor} inset,\n        0 calc(-1 * ${gloss}) ${gloss} 0 ${o.disabledGlossColor} inset;\n    }\n\n    &:disabled ${Glossy}::before {\n      background-color: ${o.disabledBackgroundColor};\n    }\n`};const COLOR_SCHEMA={primary:css(["",""],o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.theme.colors['bg-brand-primary-500'],disabledBackgroundColor:o.theme.colors['bg-disabled-glossy'],shadowColor:o.theme.colors['effect-shadow-primary-default'],highlightColor:o.theme.colors['effect-shadow-primary-light'],glossColor:o.theme.colors['effect-shadow-primary-glossy'],disabledHighlightColor:o.theme.colors['effect-shadow-disable-light'],disabledGlossColor:o.theme.colors['effect-shadow-disable-glossy'],focusInnerColor:o.theme.colors['border-focus-inner'],focusColor:o.theme.colors['border-focus']},o.shadow)),secondary:css(["",""],o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.theme.colors['bg-brand-secondary-500'],disabledBackgroundColor:o.theme.colors['bg-disabled-glossy'],shadowColor:o.theme.colors['effect-shadow-secondary-default'],highlightColor:o.theme.colors['effect-shadow-secondary-light'],glossColor:o.theme.colors['effect-shadow-secondary-glossy'],disabledHighlightColor:o.theme.colors['effect-shadow-disable-light'],disabledGlossColor:o.theme.colors['effect-shadow-disable-glossy'],focusInnerColor:o.theme.colors['border-focus-inner'],focusColor:o.theme.colors['border-focus']},o.shadow)),black:css(["",""],o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.theme.colors['bg-onmain-contrast'],disabledBackgroundColor:o.theme.colors['bg-disabled-glossy'],shadowColor:o.theme.colors['effect-shadow-black-default'],highlightColor:o.theme.colors['effect-shadow-black-light'],glossColor:o.theme.colors['effect-shadow-black-glossy'],disabledHighlightColor:o.theme.colors['effect-shadow-disable-light'],disabledGlossColor:o.theme.colors['effect-shadow-disable-glossy'],focusInnerColor:o.theme.colors['border-focus-inner'],focusColor:o.theme.colors['border-focus']},o.shadow))};const Root=styled.button.withConfig({shouldForwardProp:shouldForwardGlossyButtonProp}).withConfig({displayName:"GlossyButton__Root",componentId:"ui__sc-i66829-1"})([""," "," &:active:not(:disabled){--glossy-button-scale:0.95;}@media (prefers-reduced-motion:reduce){&,&:hover:not(:disabled),&:active:not(:disabled){--glossy-button-scale:1;transition-duration:0s;}}"," "," "," ",""],o=>`\n      --glossy-button-scale: 1;\n      display: ${o.inline?'inline-flex':'flex'};\n      height: var(--glossy-button-height);\n      border-radius: calc(var(--glossy-button-height) / 2);\n      box-sizing: border-box;\n      position: relative;\n      justify-content: center;\n      align-items: center;\n      user-select: none;\n      border: none;\n      text-decoration: none;\n      appearance: none;\n      background-color: transparent;\n      -webkit-tap-highlight-color: transparent;\n      white-space: nowrap;\n      vertical-align: top;\n      font: inherit;\n      transform: scale(var(--glossy-button-scale));\n      transition-property: box-shadow, transform;\n      transition-duration: 200ms;\n      transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);\n      will-change: transform;\n    `,hover("\n      --glossy-button-scale: 1.05;\n    ",'&:hover:not(:disabled)'),o=>COLOR_SCHEMA[o.variant],cursor,responsiveSize,responsiveMargin);const Content=styled.span.withConfig({displayName:"GlossyButton__Content",componentId:"ui__sc-i66829-2"})(["position:relative;display:flex;align-items:center;justify-content:center;&[aria-hidden='true'],&[aria-hidden='true'] *{visibility:hidden !important;}& > *:not(:last-child){margin-right:var(--glossy-button-gap);}"]);const ContentWithStatus=styled(Content).withConfig({displayName:"GlossyButton__ContentWithStatus",componentId:"ui__sc-i66829-3"})(["box-sizing:border-box;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);"]);const spinAnimation=keyframes(["100%{transform:rotate(360deg);}"]);const IconAnimation=styled.span.withConfig({displayName:"GlossyButton__IconAnimation",componentId:"ui__sc-i66829-4"})(["box-sizing:border-box;display:flex;align-items:center;justify-content:center;animation:"," 1600ms infinite linear;@media (prefers-reduced-motion:reduce){animation-name:none;}"],spinAnimation);const Comets=styled.canvas.withConfig({displayName:"GlossyButton__Comets",componentId:"ui__sc-i66829-5"})(["visibility:hidden;pointer-events:none;position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;"]);export{Comets,Content,ContentWithStatus,Glossy,IconAnimation,Root};
+//# sourceMappingURL=style.mjs.map

package/components/GlossyButton/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","sources":["../../../../src/components/GlossyButton/style.ts"],"sourcesContent":["import styled, { css, keyframes } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport { hover } from 'mixins/hover'\nimport { cursor } from 'mixins/cursor'\nimport type { StyledGlossyButtonProps, GlossyButtonPalette } from './types'\n\nconst shouldForwardGlossyButtonProp = createShouldForwardProp(\n  (propKey) => !['inline', 'variant', 'shadow', 'animated', 'loading'].includes(propKey)\n)\n\nconst unscale = (value: string) => `calc((${value}) / var(--glossy-button-scale))`\n\nexport const Glossy = styled.span`\n  pointer-events: none;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  border-radius: inherit;\n  transition-property: box-shadow;\n  transition-duration: 300ms;\n\n  &::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    right: 1px;\n    bottom: 0;\n    left: 1px;\n    z-index: -1;\n    border-radius: inherit;\n    transition-property: background-color;\n    transition-duration: 300ms;\n  }\n`\n\nconst height = 'var(--glossy-button-height)'\nconst shadowOffsetY = unscale(`(${height} - 24px) / 16`)\nconst shadowBlur = unscale('var(--glossy-button-shadow-blur)')\nconst shadowSpread = unscale(`${height} / 8 - 1px`)\nconst shadowHoverBlur = unscale(`${height} / 2 + 4px`)\nconst shadowHoverSpread = unscale(`${height} / 4 + 2px`)\nconst focusInnerWidth = unscale('2px')\nconst focusOuterWidth = unscale('4px')\nconst highlightOffsetY = `calc((${height} - 24px) / 16)`\nconst highlightBlur = 'var(--glossy-button-highlight-blur)'\nconst gloss = 'var(--glossy-button-gloss)'\n\nconst template = (palette: GlossyButtonPalette, hasShadow?: boolean) => {\n  const shadow = hasShadow\n    ? `0 ${shadowOffsetY} ${shadowBlur} ${shadowSpread} ${palette.shadowColor}`\n    : '0 0 0 0 transparent'\n  const shadowHover = `0 0 ${shadowHoverBlur} ${shadowHoverSpread} ${palette.shadowColor}`\n  const focus = `0 0 0 ${focusInnerWidth} ${palette.focusInnerColor}, 0 0 0 ${focusOuterWidth} ${palette.focusColor}`\n  const noFocus = '0 0 0 0 transparent, 0 0 0 0 transparent'\n\n  return `\n    color: ${palette.color};\n    box-shadow: ${noFocus}, ${shadow};\n\n    & ${Glossy} {\n      box-shadow:\n        0 ${highlightOffsetY} ${highlightBlur} 0 ${palette.highlightColor} inset,\n        0 calc(-1 * ${highlightOffsetY}) ${highlightBlur} 0 ${palette.highlightColor} inset,\n        0 calc(-1 * ${gloss}) ${gloss} 0 ${palette.glossColor} inset;\n    }\n\n    & ${Glossy}::before {\n      background-color: ${palette.backgroundColor};\n    }\n\n    ${hover(`\n      box-shadow: ${noFocus}, ${shadowHover};\n    `)}\n\n    &:focus-visible {\n      box-shadow: ${focus}, ${shadow};\n      outline: 2px solid transparent;\n      outline-offset: 2px;\n    }\n\n    ${hover(\n      `\n        box-shadow: ${focus}, ${shadowHover};\n      `,\n      '&:focus-visible:hover'\n    )}\n    \n    &:disabled {\n      box-shadow: none;\n    }\n\n    &:disabled ${Glossy} {\n      box-shadow:\n        0 ${highlightOffsetY} ${highlightBlur} 0 ${palette.disabledHighlightColor} inset,\n        0 calc(-1 * ${highlightOffsetY}) ${highlightBlur} 0 ${palette.disabledHighlightColor} inset,\n        0 calc(-1 * ${gloss}) ${gloss} 0 ${palette.disabledGlossColor} inset;\n    }\n\n    &:disabled ${Glossy}::before {\n      background-color: ${palette.disabledBackgroundColor};\n    }\n`\n}\n\nconst COLOR_SCHEMA = {\n  primary: css<StyledGlossyButtonProps>`\n    ${(props) =>\n      template(\n        {\n          color: props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.theme.colors['bg-brand-primary-500'],\n          disabledBackgroundColor: props.theme.colors['bg-disabled-glossy'],\n          shadowColor: props.theme.colors['effect-shadow-primary-default'],\n          highlightColor: props.theme.colors['effect-shadow-primary-light'],\n          glossColor: props.theme.colors['effect-shadow-primary-glossy'],\n          disabledHighlightColor: props.theme.colors['effect-shadow-disable-light'],\n          disabledGlossColor: props.theme.colors['effect-shadow-disable-glossy'],\n          focusInnerColor: props.theme.colors['border-focus-inner'],\n          focusColor: props.theme.colors['border-focus'],\n        },\n        props.shadow\n      )}\n  `,\n  secondary: css<StyledGlossyButtonProps>`\n    ${(props) =>\n      template(\n        {\n          color: props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.theme.colors['bg-brand-secondary-500'],\n          disabledBackgroundColor: props.theme.colors['bg-disabled-glossy'],\n          shadowColor: props.theme.colors['effect-shadow-secondary-default'],\n          highlightColor: props.theme.colors['effect-shadow-secondary-light'],\n          glossColor: props.theme.colors['effect-shadow-secondary-glossy'],\n          disabledHighlightColor: props.theme.colors['effect-shadow-disable-light'],\n          disabledGlossColor: props.theme.colors['effect-shadow-disable-glossy'],\n          focusInnerColor: props.theme.colors['border-focus-inner'],\n          focusColor: props.theme.colors['border-focus'],\n        },\n        props.shadow\n      )}\n  `,\n  black: css<StyledGlossyButtonProps>`\n    ${(props) =>\n      template(\n        {\n          color: props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.theme.colors['bg-onmain-contrast'],\n          disabledBackgroundColor: props.theme.colors['bg-disabled-glossy'],\n          shadowColor: props.theme.colors['effect-shadow-black-default'],\n          highlightColor: props.theme.colors['effect-shadow-black-light'],\n          glossColor: props.theme.colors['effect-shadow-black-glossy'],\n          disabledHighlightColor: props.theme.colors['effect-shadow-disable-light'],\n          disabledGlossColor: props.theme.colors['effect-shadow-disable-glossy'],\n          focusInnerColor: props.theme.colors['border-focus-inner'],\n          focusColor: props.theme.colors['border-focus'],\n        },\n        props.shadow\n      )}\n  `,\n}\n\nexport const Root = styled.button.withConfig<StyledGlossyButtonProps>({\n  shouldForwardProp: shouldForwardGlossyButtonProp,\n})`\n  ${(props) => {\n    const display = props.inline ? 'inline-flex' : 'flex'\n\n    return `\n      --glossy-button-scale: 1;\n      display: ${display};\n      height: var(--glossy-button-height);\n      border-radius: calc(var(--glossy-button-height) / 2);\n      box-sizing: border-box;\n      position: relative;\n      justify-content: center;\n      align-items: center;\n      user-select: none;\n      border: none;\n      text-decoration: none;\n      appearance: none;\n      background-color: transparent;\n      -webkit-tap-highlight-color: transparent;\n      white-space: nowrap;\n      vertical-align: top;\n      font: inherit;\n      transform: scale(var(--glossy-button-scale));\n      transition-property: box-shadow, transform;\n      transition-duration: 200ms;\n      transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);\n      will-change: transform;\n    `\n  }}\n\n  ${hover(\n    `\n      --glossy-button-scale: 1.05;\n    `,\n    '&:hover:not(:disabled)'\n  )}\n\n  &:active:not(:disabled) {\n    --glossy-button-scale: 0.95;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    &,\n    &:hover:not(:disabled),\n    &:active:not(:disabled) {\n      --glossy-button-scale: 1;\n      transition-duration: 0s;\n    }\n  }\n\n  ${(props) => COLOR_SCHEMA[props.variant]}\n\n  ${cursor}\n  ${responsiveSize}\n  ${responsiveMargin}\n`\n\nexport const Content = styled.span`\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  &[aria-hidden='true'],\n  &[aria-hidden='true'] * {\n    visibility: hidden !important;\n  }\n\n  & > *:not(:last-child) {\n    margin-right: var(--glossy-button-gap);\n  }\n`\n\nexport const ContentWithStatus = styled(Content)`\n  box-sizing: border-box;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n`\n\nconst spinAnimation = keyframes`\n  100% {\n    transform: rotate(360deg);\n  }\n`\n\nexport const IconAnimation = styled.span`\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  animation: ${spinAnimation} 1600ms infinite linear;\n\n  @media (prefers-reduced-motion: reduce) {\n    animation-name: none;\n  }\n`\n\nexport const Comets = styled.canvas`\n  visibility: hidden;\n  pointer-events: none;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  border-radius: inherit;\n`\n"],"names":["shouldForwardGlossyButtonProp","createShouldForwardProp","propKey","includes","unscale","value","Glossy","styled","span","withConfig","displayName","componentId","height","shadowOffsetY","shadowBlur","shadowSpread","shadowHoverBlur","shadowHoverSpread","focusInnerWidth","focusOuterWidth","highlightOffsetY","highlightBlur","gloss","template","palette","hasShadow","shadow","shadowColor","shadowHover","focus","focusInnerColor","focusColor","noFocus","color","highlightColor","glossColor","backgroundColor","hover","disabledHighlightColor","disabledGlossColor","disabledBackgroundColor","COLOR_SCHEMA","primary","css","props","theme","colors","secondary","black","Root","button","shouldForwardProp","inline","variant","cursor","responsiveSize","responsiveMargin","Content","ContentWithStatus","spinAnimation","keyframes","IconAnimation","Comets","canvas"],"mappings":"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"}