export const CLASS_ROOT = "countdown";

export const CLASS_ANNOUNCEMENT = `${CLASS_ROOT}__announcement`;
export const CLASS_UNIT = `${CLASS_ROOT}__unit`;
export const CLASS_CARD = `${CLASS_ROOT}__card`;
export const CLASS_TOP = `${CLASS_ROOT}__top`;
export const CLASS_LEAF_FRONT = `${CLASS_ROOT}__leaf-front`;
export const CLASS_LEAF_BACK = `${CLASS_ROOT}__leaf-back`;
export const CLASS_BOTTOM = `${CLASS_ROOT}__bottom`;
export const CLASS_VALUE = `${CLASS_ROOT}__value`;
export const CLASS_LABEL = `${CLASS_ROOT}__label`;
export const CLASS_FLIP = "is-flipping";
export const CLASS_TAG_ROOT = "countdown-tag";
export const CLASS_TAG_PART = `${CLASS_TAG_ROOT}__part`;
export const CLASS_TAG_VALUE = `${CLASS_TAG_ROOT}__value`;
export const CLASS_TAG_LABEL = `${CLASS_TAG_ROOT}__label`;
export const CLASS_TAG_SEPARATOR = `${CLASS_TAG_ROOT}__separator`;

export const ATTR_COUNTDOWN = "data-countdown";
export const ATTR_COUNTDOWN_CONFIG = "data-countdown-config";
export const ATTR_COUNTDOWN_UNIT = "data-countdown-unit";
export const ATTR_COUNTDOWN_TAG = "data-countdown-tag";
export const ATTR_COUNTDOWN_TAG_VALUE = "data-countdown-tag-value";

export const SELECTOR_ANNOUNCEMENT = `.${CLASS_ANNOUNCEMENT}`;
export const SELECTOR_UNIT = `.${CLASS_UNIT}`;
export const SELECTOR_LABEL = `.${CLASS_LABEL}`;
export const SELECTOR_TAG_UNIT = `[${ATTR_COUNTDOWN_UNIT}]`;
export const SELECTOR_TAG_LABEL = `.${CLASS_TAG_LABEL}`;
export const SELECTOR_TAG_VALUE = `[${ATTR_COUNTDOWN_TAG_VALUE}]`;
export const SELECTOR_VALUE_LAYERS = [
  `.${CLASS_TOP} .${CLASS_VALUE}`,
  `.${CLASS_LEAF_FRONT} .${CLASS_VALUE}`,
  `.${CLASS_LEAF_BACK} .${CLASS_VALUE}`,
  `.${CLASS_BOTTOM} .${CLASS_VALUE}`,
].join(", ");