import { isResponsiveType } from '../../../types/type-guard';
/**
 * An abstract class for format {@link ManagedResponsiveScopeInput[Flag]} to CSS class string
 */
export class ResponsiveClassStringFormatter {
  /**
   * > It takes a `ResponsiveType<ManagedResponsiveScopeInput[Flag]>` and returns a string
   *
   * @typedef Flag key of ManagedResponsiveScopeInput
   * @param {ResponsiveType<ManagedResponsiveScopeInput[Flag]>} input - ManagedResponsiveScopeInput[Flag]
   * @returns {string} - CSS class string.
   */
  format(input) {
    if (isResponsiveType(input)) {
      return Object.keys(input)
        .map((breakpoint) => {
        const breakpointValue = input[breakpoint];
        const breakPointFormatted = breakpoint !== 'default' ? breakpoint : undefined;
        return this.formatToken(breakpointValue, breakPointFormatted);
      })
        .join(' ');
    }
    else {
      return this.formatToken(input);
    }
  }
}
