AI solution for JavaScript Coding Question on BFE.dev
153. uglify CSS class names

Here's one possible solution using a closure to keep track of the current sequence:

function generateClassNames() {
  let count = 0;
  let sequence = [''];

  const getNextSequence = () => {
    let carry = 1;
    let i = sequence.length - 1;

    while (i >= 0 && carry > 0) {
      let charCode = sequence[i].charCodeAt(0) + carry;
      if (charCode > 90) {
        charCode = 65;
        carry = 1;
      } else if (charCode > 122 || (charCode > 90 && charCode < 97)) {
        charCode = 97;
        carry = 1;
      } else {
        carry = 0;
      }
      sequence[i] = String.fromCharCode(charCode);
      i--;
    }

    if (carry > 0) {
      sequence.unshift('a');
    }
  }

  const getUniqueClassName = () => {
    const className = sequence.join('');
    count++;
    getNextSequence();
    return className;
  }

  const reset = () => {
    count = 0;
    sequence = [''];
  }

  return {
    getUniqueClassName,
    reset,
  }
}

const { getUniqueClassName, reset } = generateClassNames();

console.log(getUniqueClassName()); // 'a'
console.log(getUniqueClassName()); // 'b'
console.log(getUniqueClassName()); // 'c'
// skipping from 'Y' to 'Z'
console.log(getUniqueClassName()); // 'Z'
console.log(getUniqueClassName()); // 'aa'
console.log(getUniqueClassName()); // 'ab'
console.log(getUniqueClassName()); // 'ac'
// skipping to 'ZZ'
console.log(getUniqueClassName()); // 'ZZ'
console.log(getUniqueClassName()); // 'aaa'
console.log(getUniqueClassName()); // 'aab'
console.log(getUniqueClassName()); // 'aac'

reset();

console.log(getUniqueClassName()); // 'a'

The generateClassNames() function returns an object with two methods: getUniqueClassName() to generate a new class name, and reset() to reset the sequence.

The function uses count to keep track of the number of class names generated, and sequence to generate the class names themselves. sequence is an array of characters that is empty at first, and is updated every time getNextSequence() is called.

getNextSequence() is a helper function that updates the characters in the sequence array to the next one in the sequence. It starts at the end of the array and works backwards, incrementing the character code at each position until it either reaches 'z', 'Z', or an invalid character. If it reaches 'z' or 'Z', it wraps around to 'a' or 'A', respectively, and sets the carry flag to 1 to increment the next character in the sequence. If it reaches an invalid character, it sets the character code to 'a' and sets the carry flag to 1 as well. If it makes it all the way to the beginning of the array and the carry flag is still set, it unshifts a new 'a' onto the sequence array to start a new digit.

getUniqueClassName() generates a new class name by joining the sequence array into a string, increments the count, and calls getNextSequence() to update the sequence for the next class name.

reset() simply resets the count and sequence to their initial values.

Overall, this solution is relatively simple and should be efficient enough for generating CSS class names on the fly.