@xaendar/core 0.7.12 → 0.7.14

package/dist/xaendar-core.es.d.ts

@@ -150,6 +150,7 @@ export declare class Context {
      */
     private _unwatchFns;
     /**
+     *
      */
     createElement: Function_2<[string], Element>;
     /**
@@ -250,6 +251,30 @@ export declare class Context {
  */
 export declare function createAnchor(label: string, parentNode: HTMLElement, context: Context, referenceNode?: Comment | null): Comment;
 
+/**
+ * Creates an HTML element with the specified tag name.
+ *
+ * @param tagName - The HTML tag name of the element to create.
+ * @returns The newly created HTML element.
+ */
+export declare function createElement(tagName: string): HTMLElement;
+
+/**
+ * Creates a MathML element with the specified tag name using the MathML namespace.
+ *
+ * @param tagName - The MathML tag name of the element to create.
+ * @returns The newly created MathML element.
+ */
+export declare function createMATHMLement(tagName: string): MathMLElement;
+
+/**
+ * Creates an SVG element with the specified tag name using the SVG namespace.
+ *
+ * @param tagName - The SVG tag name of the element to create.
+ * @returns The newly created SVG element.
+ */
+export declare function createSVGElement(tagName: string): SVGElement;
+
 /**
  * Runs a side-effectful function and automatically re-runs it whenever any
  * Signal read during its execution changes.
@@ -454,8 +479,6 @@ declare type IterationVariablesHandle = {
     update: (newIndex: number, items: unknown[]) => void;
 };
 
-export declare const MATHML_NS = "http://w3.org";
-
 /**
  * Mounts a node into the DOM and binds it to the context lifecycle.
  *
@@ -666,8 +689,6 @@ declare type Signal_2<Value = any> = Signal.State<Value> & {
 };
 export { Signal_2 as Signal }
 
-export declare const SVG_NS = "http://www.w3.org/2000/svg";
-
 /**
  * Creates a reactive switch/case structure by converting it into an if/else-if chain
  * and delegating to {@link _if}.

package/dist/xaendar-core.es.js

@@ -1,17 +1,3 @@
-//#region ../packages/core/src/costants.ts
-/**
-* Metadata key used internally to store the list of observed attribute names
-* on a web component class.
-*
-* Populated by the `@Property` decorator and consumed by `@WebComponent` to
-* define `observedAttributes` on the custom element class.
-*
-* @internal
-*/
-var INTERNAL_OBSERVED_ATTRIBUTES = `observedAttributes`;
-var SVG_NS = "http://www.w3.org/2000/svg";
-var MATHML_NS = "http://w3.org";
-//#endregion
 //#region ../packages/core/src/decorators/event.decorator.ts
 function isEventOptions(value) {
 	return !!value && typeof value === "object" && ("bubbles" in value || "cancelable" in value || "composed" in value);
@@ -63,6 +49,20 @@ function Event(options) {
 	};
 }
 //#endregion
+//#region ../packages/core/src/costants.ts
+/**
+* Metadata key used internally to store the list of observed attribute names
+* on a web component class.
+*
+* Populated by the `@Property` decorator and consumed by `@WebComponent` to
+* define `observedAttributes` on the custom element class.
+*
+* @internal
+*/
+var INTERNAL_OBSERVED_ATTRIBUTES = `observedAttributes`;
+var SVG_NS = "http://www.w3.org/2000/svg";
+var MATHML_NS = "http://www.w3.org/1998/Math/MathML";
+//#endregion
 //#region ../packages/core/src/signals/input/input-instance.symbol.ts
 /**
 * Unique symbol used to mark an object as a valid `InputSignal` instance.
@@ -496,6 +496,66 @@ function signal(value, options) {
 */
 var untracked = Signal.subtle.untrack;
 //#endregion
+//#region ../packages/core/src/utils/render-element.util.ts
+/**
+* Creates a DOM element, applies attributes and event listeners, appends it
+* to the parent, and registers cleanup functions in the current context.
+*
+* Static (literal) attribute values are set once via `setAttribute`. Dynamic
+* attribute values are wrapped in a reactive `effect` so they update
+* automatically whenever the underlying signal changes. Event listeners are
+* attached with `addEventListener` and the corresponding `removeEventListener`
+* is registered as a cleanup function.
+*
+* @param parentNode - The parent HTML element to append the new element to.
+* @param context - The current template execution scope.
+* @param tagName - The HTML tag name of the element to create.
+* @param attributes - List of attribute descriptors to apply to the element.
+* @param events - List of event listener descriptors to attach to the element.
+* @returns The newly created HTML element.
+*/
+function _renderElement(parentNode, context, anchor, tagName, attributes, events) {
+	const element = context.createElement(tagName);
+	mountNode(element, parentNode, context, anchor);
+	attributes.forEach(({ name, value, literal }) => {
+		literal ? element.setAttribute(name, String(value())) : context.listen(effect(() => element.setAttribute(name, String(value()))));
+	});
+	events.forEach((event) => {
+		const handler = ($event) => context.getEventHandler(event.handler)(...event.parameters.map((event) => event($event)));
+		const name = event.name;
+		element.addEventListener(name, handler);
+		context.listen(() => element.removeEventListener(name, handler));
+	});
+	return element;
+}
+/**
+* Creates an HTML element with the specified tag name.
+*
+* @param tagName - The HTML tag name of the element to create.
+* @returns The newly created HTML element.
+*/
+function createElement(tagName) {
+	return document.createElement(tagName);
+}
+/**
+* Creates an SVG element with the specified tag name using the SVG namespace.
+*
+* @param tagName - The SVG tag name of the element to create.
+* @returns The newly created SVG element.
+*/
+function createSVGElement(tagName) {
+	return document.createElementNS(SVG_NS, tagName);
+}
+/**
+* Creates a MathML element with the specified tag name using the MathML namespace.
+*
+* @param tagName - The MathML tag name of the element to create.
+* @returns The newly created MathML element.
+*/
+function createMATHMLement(tagName) {
+	return document.createElementNS(MATHML_NS, tagName);
+}
+//#endregion
 //#region ../packages/core/src/utils/context.util.ts
 /**
 * Tracks identifier scope during run time template function execution
@@ -529,6 +589,7 @@ var Context = class {
 	*/
 	_unwatchFns = new Array();
 	/**
+	* 
 	*/
 	createElement;
 	/**
@@ -539,7 +600,7 @@ var Context = class {
 	constructor(_root, _parent) {
 		this._root = _root;
 		this._parent = _parent;
-		this.createElement = this._parent.createElement;
+		this.createElement = createElement;
 	}
 	/**
 	* Registers a new identifier name in this scope.
@@ -922,39 +983,6 @@ function teardown(parentContext, state) {
 	}
 }
 //#endregion
-//#region ../packages/core/src/utils/render-element.util.ts
-/**
-* Creates a DOM element, applies attributes and event listeners, appends it
-* to the parent, and registers cleanup functions in the current context.
-*
-* Static (literal) attribute values are set once via `setAttribute`. Dynamic
-* attribute values are wrapped in a reactive `effect` so they update
-* automatically whenever the underlying signal changes. Event listeners are
-* attached with `addEventListener` and the corresponding `removeEventListener`
-* is registered as a cleanup function.
-*
-* @param parentNode - The parent HTML element to append the new element to.
-* @param context - The current template execution scope.
-* @param tagName - The HTML tag name of the element to create.
-* @param attributes - List of attribute descriptors to apply to the element.
-* @param events - List of event listener descriptors to attach to the element.
-* @returns The newly created HTML element.
-*/
-function _renderElement(parentNode, context, anchor, tagName, attributes, events) {
-	const element = context.createElement(tagName);
-	mountNode(element, parentNode, context, anchor);
-	attributes.forEach(({ name, value, literal }) => {
-		literal ? element.setAttribute(name, String(value())) : context.listen(effect(() => element.setAttribute(name, String(value()))));
-	});
-	events.forEach((event) => {
-		const handler = ($event) => context.getEventHandler(event.handler)(...event.parameters.map((event) => event($event)));
-		const name = event.name;
-		element.addEventListener(name, handler);
-		context.listen(() => element.removeEventListener(name, handler));
-	});
-	return element;
-}
-//#endregion
 //#region ../packages/core/src/utils/render-text.util.ts
 /**
 * Creates a reactive text node bound to a named identifier in the current scope.
@@ -1018,4 +1046,4 @@ function _switch(parentNode, parentContext, expression, blocks) {
 	})));
 }
 //#endregion
-export { BaseWebComponent, Context, Event, MATHML_NS, Property, SVG_NS, WebComponent, _for, _if, _iterationVariables, _renderElement, _renderLiteralText, _renderText, _switch, computed, createAnchor, effect, input, mountNode, signal, untracked };
+export { BaseWebComponent, Context, Event, Property, WebComponent, _for, _if, _iterationVariables, _renderElement, _renderLiteralText, _renderText, _switch, computed, createAnchor, createElement, createMATHMLement, createSVGElement, effect, input, mountNode, signal, untracked };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xaendar/core",
-  "version": "0.7.12",
+  "version": "0.7.14",
   "description": "A library containing core utils such as webcomponent base classes and theming support",
   "sideEffects": false,
   "type": "module",
@@ -16,7 +16,7 @@
     }
   },
   "dependencies": {
-    "@xaendar/signals": "0.7.12",
-    "@xaendar/types": "0.7.12"
+    "@xaendar/signals": "0.7.14",
+    "@xaendar/types": "0.7.14"
   }
 }