import type { CSSProperties } from 'react'

function clampScale(value: number) {
  if (!Number.isFinite(value)) return 0
  return Math.min(1, Math.max(0, value))
}

export function barFillStyle(
  percent: number,
  origin: 'left' | 'right' = 'left',
): CSSProperties {
  return {
    transform: `scaleX(${clampScale(percent / 100)})`,
    transformOrigin: `${origin} center`,
  }
}