import { useCallback } from "react";
import { getClassString } from "../getClassString";

/**
 * Добавляет функцию генерации класса для элементов
 * @param baseClass - базовый класс (блок)
 * @returns {TGetCNFunction} Возвращает функцию `getCN`, которая формирует className по базе блока, элементу, модификаторам и утилитарным классам.
 * @example
 * import { useCN } from "@delement/ui/utils/react/useCN";
 *
 * const App = () => {
 *  const { getCN } = useCN("myAppBaseClass");
 *  return (
 *     <div className={getCN()}>
 *       <ul className={getCN("list", {}, [ "isResetList" ])}>
 *        <li className={getCN("item", { isMyItem: true })}></li>
 *       </ul>
 *       <h1 className={getCN("title h2")}>Title with two blocks</h1>
 *     </div>
 *   )
 * }
 */
export type TGetCNFunction = ReturnType<typeof useCN>["getCN"];

/* eslint-disable-next-line */
/**
 *
 */
export const useCN = (baseClass: string = "") => {

  const getCN = useCallback((elem: string = "", mod: Record<string, boolean | string> = {}, utilClasses: string[] = []) => {
    if (typeof baseClass === "string" && baseClass.length) {
      const cn = getClassString(baseClass, elem, mod);
      return utilClasses.length ? [ cn, ...utilClasses ].join(" ") : cn;
    } else {
      return "";
    }
  }, [ baseClass ]);

  return { getCN };
};