/** Build the Background selection halo from every supported hex color form. */
export function backgroundSelectionShadow(color: string): string {
  const valid = /^#(?:[\da-f]{3}|[\da-f]{6}|[\da-f]{8})$/i.test(color);
  const raw = (valid ? color : "#46a5e5").slice(1);
  const expanded =
    raw.length === 3
      ? raw
          .split("")
          .map((digit) => digit + digit)
          .join("")
      : raw;
  const rgb = expanded.slice(0, 6);
  const alpha = expanded.length === 8 ? parseInt(expanded.slice(6), 16) : 255;
  // Multiply the selected color's opacity by each halo opacity. Appending
  // another alpha byte to a short or alpha-bearing hex color is invalid CSS.
  const tint = (opacity: number): string =>
    `#${rgb}${Math.round((alpha * opacity) / 255)
      .toString(16)
      .padStart(2, "0")}`;
  return `0 0 0 3px ${tint(0x33)}, 0 0 0 6px ${tint(0x1a)}`;
}