import { unit } from '../../../../src/style/variables';

import { Prefix } from '../constants';
import { getVarName } from '../helpers';
import { GumSpacingMixin } from '../models';

/**
 * Converts px value into unit multiplier value (rounded) or returns raw unmodified px value
 * @param pxValue Spacing value in pixels
 * @param rawValueOnly Return exact value (do not modify to fit the unit)
 */
export const spacing: GumSpacingMixin = (pxValue, rawValueOnly) =>
  rawValueOnly
    ? `${pxValue}px`
    : `calc(var(${getVarName(Prefix.unit)}) * ${
        Math.round((pxValue / unit) * 100) / 100
      })`;