@sujalchoudhari/solaris-ui
Version:
A UI framework to create HTML pages with just JavaScript.
102 lines (101 loc) • 4.3 kB
TypeScript
import Atom from "./atom";
import { Component } from "../components";
/**
* An Atomizer template can be a string or null.
*/
export type AtomizerTemplate = string | null;
/**
* Atomizer
* -----
* An utility class for loading/parsing and creating templates.
*
* @remarks
* This class is responsible for loading the templates from the template folder.
* It also provides a function to build the component tree from the HTML string.
*
* @author Sujal Choudhari <sjlchoudhari.gmail.com>
*/
export default class Atomizer {
/**
* The folder where the templates are stored.
* @remarks
* Only the templated from this folder will be preloaded loaded.
* If there are many template folders then those components will have to be loaded manually.
* or change the template folder and preload the templates again.
*
* @author Ansh Sharma
*/
static templateFolders: [
{
baseDir: string;
htmlDir: string;
cssDir: string;
jsDir: string;
}
];
static templateFilesToInclude: string[];
/**
* The preloaded templates (the default ones)
*/
static templates: {
[key: string]: AtomizerTemplate;
}[];
/**
* Load a template from the template folder
* @param filename The name of the template file
* @returns New atomizer template
*/
static loadTemplate(filename: string, templateFolderIndex: number): AtomizerTemplate;
/**
* Preload All the templates from the template folder.
* @returns A dictionary of all the preloaded templates with their names as keys.
*/
static preloadTemplates(): {
[key: string]: AtomizerTemplate;
}[];
/**
* Build the component tree from the atom.
* @param atom The atom to be parsed and built into a component tree
* @returns The root component of the component tree.
*/
static buildComponentTreeFromAtom(atom: Atom): Component;
/**
A static method in the Atomizer class that adds a new template folder to the templateFolders array.
@param {object} templateFolder - An object containing the base directory and optional subdirectories for the template folder.
@param {string} templateFolder.baseDir - The base directory for the template folder.
@param {string} [templateFolder.htmlDir] - Optional subdirectory for HTML templates.
@param {string} [templateFolder.cssDir] - Optional subdirectory for CSS templates.
@param {string} [templateFolder.jsDir] - Optional subdirectory for JavaScript templates.
@remarks
If the templateFolder object's baseDir property does not already exist in Atomizer.templateFolders,
the templateFolder object is pushed into Atomizer.templateFolders.
Then, the templates in the newly added folder are preloaded and pushed into Atomizer.templates.
If the baseDir already exists in Atomizer.templateFolders, a warning is logged.
@author Ansh Sharma
*/
static addTemplateFolder(templateFolder: {
baseDir: string;
htmlDir: string;
cssDir: string;
jsDir: string;
}): void;
/**
A static method in the Atomizer class that retrieves a template with the specified name and index from the templates property.
@param {string} templateName - The name of the template to retrieve.
@param {number} [templateFolderIndex=0] - The index of the folder containing the template. Defaults to 0.
@returns {AtomizerTemplate} - The requested template.
@remarks
If the template is found in the templates property, it is returned immediately.
If the template is not found, this method searches through all template folders for the specified name.
If a template is found, it is returned and cached in the templates property for future use.
If no template is found, an error message is logged and an empty string is returned.
@author Ansh Sharma
*/
static getTemplate(templateName: string, templateFolderIndex?: 0): AtomizerTemplate;
/**
* Build the component tree from the HTML string.
* @param html The HTML string to be parsed and built into a component tree
* @returns The root component of the component tree.
*/
static buildComponentTree(html: string): Component;
}