import { sizes } from '../global/sizes';
import { fontWeights, fontSizes } from '../global/typography';
import { borderWidths, radii } from '../global/borders';
import { space } from '../global/space';
import { systemPalette } from '../global/colors';

const paginationSpace = {
  leftRightPadding: `${space.xsmall}px`,
};

const paginationColors = {
  border: systemPalette.defaultBorder,
  background: systemPalette.defaultLightBackground,
  number: systemPalette.text,
  numberActive: systemPalette.primary,
  numberDisabled: systemPalette.subduedText,
};

const paginationBorderWidths = {
  default: `${borderWidths.base}px`,
};

const paginationSizes = {
  height: `${sizes.large}px`,
  minWidth: `${sizes.large}px`,
};

const paginationFontSizes = {
  default: `${fontSizes.medium}px`,
};

const paginationFontWeights = {
  default: fontWeights.semiBold,
};

const paginationRadii = {
  default: `${radii.base}px`,
};

export {
  paginationSpace,
  paginationColors,
  paginationBorderWidths,
  paginationSizes,
  paginationFontSizes,
  paginationFontWeights,
  paginationRadii,
};