Coralite Library
The Coralite library is used for processing and rendering HTML documents with custom elements, templates, and plugins. It provides a structured way to manage document metadata, template paths, plugin configurations, and ignored attributes during rendering.
Table of Contents #
- Coralite Constructor
- Initialise Method
- Compile Method
- Save Method
- Render Method
- Get Page Paths Using Custom Element
- Add Render Queue
- Create Component
Coralite Constructor #
Initializes a new Coralite instance with configuration options for templates, pages, plugins, and ignore attributes.
Parameters #
| Name | Type | Attribute | Description |
|---|---|---|---|
| options | Object |
Required | Configuration options for the Coralite constructor. |
| options.templates | string |
Required | The absolute or relative path to the directory containing Coralite templates. |
| options.pages | string |
Required | The absolute or relative path to the directory containing pages to be rendered with the provided templates. |
| options.plugins | CoralitePluginInstance[] |
Optional | An array of plugin instances that extend Coralite's functionality. |
| options.ignoreByAttribute | IgnoreByAttribute[] |
Optional | An array of objects specifying attribute name-value pairs to ignore during document processing. Each object must have a name and value property. |
Example Usage #
const coralite = new Coralite({
templates: './src/templates',
pages: './src/pages',
plugins: [myCustomPlugin],
ignoreByAttribute: [
{ name: 'data-ignore', value: 'true' },
{ name: 'aria-hidden', value: 'true' }
]
});
Initialise Method #
Initialises the Coralite instance by loading templates and setting up collections for pages and custom elements.
/**
* Initialises the Coralite instance.
* @returns {Promise
Returns #
A promise that resolves when the initialization is complete.
Compile Method #
Compiles specified page(s) by rendering their document content and measuring render time. Processes pages based on provided path(s), replacing custom elements with components, and returns rendered results with performance metrics.
/**
* Compiles specified page(s) by rendering their document content and measuring render time.
* Processes pages based on provided path(s), replacing custom elements with components,
* and returns rendered results with performance metrics.
*
* @param {string | string[]} [path] - Path to a single page or array of page paths relative to the pages directory. If omitted, compiles all pages.
* @return {Promise
Parameters #
| Name | Type | Attribute | Description |
|---|---|---|---|
| path | string | string[] |
Optional | The path or array of paths to the HTML files relative to the project's pages directory. If omitted, compiles all pages in the pages directory. |
Example Usage #
Compile a single page by providing its file path:
coralite.compile('pages/home/index.html')
.then(documents => {
console.log('Compilation result:', documents);
})
.catch(error => {
console.error('Error during compilation:', error);
});
Compiling multiple pages using an array of paths:
coralite.compile(['pages/home/index.html', 'pages/about/index.html'])
.then(documents => {
documents.forEach((document, index) => {
console.log(`Result for page ${index + 1}:`, document);
});
})
.catch(error => {
console.error('Error during compilation:', error);
});
Compiling all pages by omitting the path parameter:
coralite.compile()
.then(documents => {
console.log('All compiled documents:', documents)
})
.catch(error => {
console.error('Error compiling all pages:', error)
});
Save Method #
Saves processed documents as HTML files to the specified output directory.
/**
* Saves processed documents as HTML files to the specified output directory.
* @param {Array
Parameters #
| Name | Type | Attribute | Description |
|---|---|---|---|
| documents | Array<CoraliteResult> |
Required | An array of CoraliteResult objects containing rendered document data. |
| output | string |
Required | The base directory path where HTML files will be saved. Must exist on disk. |
Example Usage #
coralite.compile()
.then(async (documents) => {
// save documents to disk
await coralite.save(documents, './output')
})
.catch(error => {
console.error('Error compiling all pages:', error)
})
Render Method #
Renders the provided node or array of nodes using the render function. This method serves as an internal utility to handle the rendering process.
/**
* Renders the provided node or array of nodes using the render function.
* This method serves as an internal utility to handle the rendering process.
* @private
* @param {CoraliteDocumentRoot | CoraliteAnyNode | CoraliteAnyNode[]} root - The node(s) to be rendered.
* @returns {string} returns raw HTML
*/
coralite._render(root)
Parameters #
| Name | Type | Description |
|---|---|---|
| root | CoraliteDocumentRoot | CoraliteAnyNode | CoraliteAnyNode[] |
The node(s) to be rendered. |
Returns #
Raw HTML string from the rendering process.
Get Page Paths Using Custom Element #
Retrieves page paths associated with a custom element template.
/**
* Retrieves page paths associated with a custom element template.
*
* @param {string} path - The original path potentially prefixed with the templates directory.
* @returns {string[]} An array of page paths linked to the custom element template.
*/
coralite.getPagePathsUsingCustomElement(path)
Parameters #
| Name | Type | Description |
|---|---|---|
| path | string |
The original path potentially prefixed with the templates directory. |
Returns #
An array of page paths linked to the custom element template.
Add Render Queue #
Adds a page to the current render queue.
/**
* Adds a page to the current render queue.
* @param {string|CoraliteCollectionItem} value - The path to a page or a CoraliteCollectionItem to add to the render queue.
*/
coralite.addRenderQueue(value)
Parameters #
| Name | Type | Description |
|---|---|---|
| value | string | CoraliteCollectionItem |
The path to a page or a CoraliteCollectionItem to add to the render queue. |
Create Component #
Creates a component by processing the provided parameters and returning a rendered HTML element.
/**
* @param {Object} options
* @param {string} options.id - id - Unique identifier for the component
* @param {CoraliteModuleValues} [options.values={}] - Token values available for replacement
* @param {CoraliteElement} [options.element] - Mapping of component IDs to their module definitions
* @param {CoraliteDocument} options.document - Current document being processed
* @param {string} [options.contextId] - Context Id
* @param {number} [options.index] - Context index
* @param {boolean} [head=true] - Indicates if the current function call is for the head of the recursion
* @returns {Promise
Parameters #
| Parameter | Type | Description |
|---|---|---|
| options.id | string |
Unique identifier for the component |
| options.values | CoraliteModuleValues |
Token values available for replacement (default: {}) |
| options.element | CoraliteElement |
Mapping of component IDs to their module definitions (optional) |
| options.document | CoraliteDocument |
Current document being processed |
| options.contextId | string |
Context Id (optional) |
| options.index | number |
Context index (optional) |
Returns #
A promise that resolves to a rendered HTML element or void.