From 97b836f54d30c919d4e9dc04cb5d3f71dfda12fb Mon Sep 17 00:00:00 2001 From: Benjamin Wegener Date: Tue, 16 Jan 2024 20:08:29 +0000 Subject: [PATCH] chore(base component) docs and handling variable name placeholders --- lib/core/BaseComponent.js | 63 ++++++++++++++++++++++++++++++++++++++- 1 file changed, 62 insertions(+), 1 deletion(-) diff --git a/lib/core/BaseComponent.js b/lib/core/BaseComponent.js index 250d27e..f996dd5 100644 --- a/lib/core/BaseComponent.js +++ b/lib/core/BaseComponent.js @@ -1,4 +1,7 @@ import Cetra from '../../lib/lib.js'; +/** + * Represents a base component class. + */ export default class BaseComponent { #data = new Map([ ['type', 'BaseComponent'], @@ -7,6 +10,10 @@ export default class BaseComponent { ['cetraId', ''], ]); + /** + * Constructs a new instance of the BaseComponent class. + * @param {Map} data - The initial data for the component. + */ constructor(data = new Map()) { for (const key of this.#data.keys()) { if ( @@ -19,16 +26,36 @@ export default class BaseComponent { this.#data = data; } + /** + * Retrieves the value associated with the specified key from the data map. + * @param {string} key - The key to retrieve the value for. + * @returns {*} - The value associated with the key. + */ get(key) { return this.#data.get(key); } + /** + * Sets a key-value pair in the component's data. + * @param {string} key - The key to set. + * @param {*} value - The value to set. + * @returns {BaseComponent} - The updated component instance. + */ set(key, value) { this.#data.set(key, value); return this; } + /** + * Retrieves the value of a variable by its name. + * + * @param {string} varName - The name of the variable. + * @returns {*} - The value of the variable, or null if the variable is not found. + * @throws {Error} - If no Cetra instance is found. + */ getValue(varName) { + if (typeof varName != 'string') return null; + if (varName.startsWith('$')) varName = varName.slice(1); if (!this.get('variables').has(varName)) return null; const frameWork = Cetra.getInstance(this.get('cetraId')); if (!frameWork) throw new Error('no cetra instance found'); @@ -39,8 +66,30 @@ export default class BaseComponent { return varValue; } - getVar(varName) {} + /** + * Retrieves the value of a variable. + * @param {string} varName - The name of the variable. + * @returns {*} - The value of the variable. + */ + getVal(varName) { + return this.getValue(varName); + } + /** + * Retrieves the value of a variable by its name. + * + * @param {string} varName - The name of the variable. + * @returns {*} - The value of the variable. + */ + getVar(varName) { + return this.get('variables').get(varName); + } + + /** + * Retrieves the DOM node associated with the component. + * @returns {HTMLElement} The DOM node. + * @throws {Error} If no node is found. + */ getNode() { let node = document.querySelector(this.get('selector')); @@ -50,6 +99,12 @@ export default class BaseComponent { return node; } + /** + * Retrieves all DOM nodes that have a data attribute matching the specified variable name. + * @param {string} varName - The name of the variable to search for. + * @returns {Array} - An array of DOM nodes matching the variable name. + * @throws {Error} - Throws an error if no cetra instance is found. + */ getVarNodes(varName) { const frameWork = Cetra.getInstance(this.get('cetraId')); if (!frameWork) throw new Error('no cetra instance found'); @@ -59,6 +114,12 @@ export default class BaseComponent { return [...this.getNode().querySelectorAll(varNodeSelector)]; } + /** + * Updates the component with the given deltas. + * @param {Array} deltas - An array of deltas to apply. + * @throws {TypeError} If deltas is not an array. + * @throws {Error} If no cetra instance is found. + */ update(deltas) { if (!Array.isArray(deltas)) throw new TypeError('deltas must be an array');