type Selector = keyof HTMLElementTagNameMap;
type Attributes = Partial<HTMLElement> & {
  [key: string]: any;
};
type Children = (HTMLElement | string)[];
type ContentOrChildren = string | Children;

/**
 * Gets an HTML element based on the provided selector.
 * @param selector - A string representing a selector.
 * @returns The queried HTML element or null if not found.
 */
declare function select(selector: Selector): HTMLElement | null;

/**
 * Gets an HTML element based on the provided element and selector.
 * @param element - An HTMLElement to query within.
 * @param selector - A string representing a selector to query within the element.
 * @returns The queried HTML element or null if not found.
 */
declare function select(
  element: HTMLElement,
  selector: Selector,
): HTMLElement | null;

/**
 * Gets a list of HTML elements based on the provided selector.
 * @param selector - A string representing a selector.
 * @returns The list of queried HTML elements.
 */
declare function selectAll(selector: Selector): NodeListOf<HTMLElement>;

/**
 * Gets a list of HTML elements based on the provided element and selector.
 * @param element - An HTMLElement to query within.
 * @param selector - A string representing a selector to query within the element.
 * @returns The list of queried HTML elements.
 */
declare function selectAll(
  element: HTMLElement,
  selector: Selector,
): NodeListOf<HTMLElement>;

/**
 * Creates an HTML element with the specified tag name and attributes.
 * @param tagName - The name of the HTML tag to create.
 * @param attributes - The attributes of the element.
 * @returns The created HTML element.
 */
declare function create(tagName: Selector, attributes?: Attributes): HTMLElement;

/**
 * Creates an HTML element with the specified tag name and children.
 * @param tagName - The name of the HTML tag to create.
 * @param children - The children of the element.
 * @returns The created HTML element.
 */
declare function create(tagName: Selector, children?: Children): HTMLElement;

/**
 * Creates an HTML element with the specified tag name, attributes, and content.
 * @param tagName - The name of the HTML tag to create.
 * @param attributes - The attributes of the element.
 * @param content - The content of the element.
 * @returns The created HTML element.
 */
declare function create(
  tagName: Selector,
  attributes?: Attributes,
  content?: string,
): HTMLElement;

/**
 * Creates an HTML element with the specified tag name, attributes, and children.
 * @param tagName - The name of the HTML tag to create.
 * @param attributes - The attributes of the element.
 * @param children - The children of the element.
 * @returns The created HTML element.
 */
declare function create(
  tagName: Selector,
  attributes?: Attributes,
  children?: Children,
): HTMLElement;

/**
 * Creates an HTML element with the specified tag name, content, and children.
 * @param tagName - The name of the HTML tag to create.
 * @param content - The content of the element.
 * @param children - The children of the element.
 * @returns The created HTML element.
 */
declare function create(
  tagName: Selector,
  content?: string,
  children?: Children,
): HTMLElement;

/**
 * Creates an HTML element with the specified tag name, attributes, and content or children.
 * @param tagName - The name of the HTML tag to create.
 * @param attrOrChildren - The attributes, content, or children of the element.
 * @returns The created HTML element.
 */
declare function create(
  tagName: Selector,
  attrOrChildren?: Attributes | Children | string,
): HTMLElement;

/**
 * Interpolates a given text with the provided context.
 * @param text - The text containing placeholders in the format {{code}}.
 * @param context - An optional object containing values to be used in the interpolation.
 * @returns The interpolated text.
 */
declare function interpolate<T extends object>(
  text: string,
  context?: T,
): string;

/**
 * Gets the section style based on the item.
 * @param item - The item containing style, tag, and attributes.
 * @returns The section style.
 */
declare function getSectionStyle(item: any): any;

/**
 * Toggles the specified classes on the given element.
 * @param element - The HTML element on which to toggle classes.
 * @param classes - The classes to toggle.
 */
declare function toggleCls(element: HTMLElement, ...classes: string[]): void;

/**
 * Adds the specified classes to the given element.
 * @param element - The HTML element to which to add classes.
 * @param classes - The classes to add.
 */
declare function addCls(element: HTMLElement, ...classes: string[]): void;

/**
 * Removes the specified classes from the given element.
 * @param element - The HTML element from which to remove classes.
 * @param classes - The classes to remove.
 */
declare function removeCls(element: HTMLElement, ...classes: string[]): void;