@tripod311/splash 0.0.0

package/README.md

@@ -0,0 +1,241 @@
+# Splash
+
+Splash is a zero-dependency minimalistic UI framework that tries to achieve JSX/Vue template level of comfort without a virtual DOM.
+
+In Splash every component is an extended DOM node with all the consequences — you can add, remove or insert them in regular DOM elements.  
+That’s why it’s called **Splash** — just splash your component anywhere on the page and it will work according to its inner logic.
+
+Splash does not separate props and state variables like other frameworks, primarily because it focuses on rendering the view only.  
+That means a clear split between **component view** and **component logic**.  
+Also it means that all the data passed from a parent component to its children can affect child views immediately — you just need to take it into account.
+
+---
+
+## Core Ideas
+
+1. **Component = one DOM element**  
+   - No ambiguities, no phantom nodes.  
+   - Conditional rendering is solved inside the component.  
+   - If you need a hybrid case — use `ref` and manage it manually.  
+
+2. **Direct DOM**  
+   - No virtual tree.  
+   - Everything is stored and updated directly in the DOM.  
+   - The browser already optimizes repaints — no need for batching.  
+
+3. **Minimal directives**  
+   Just six built-in directives:  
+   - `data-ref` — reference to a specific element.  
+   - `data-slot` — mount point for other components.  
+   - `data-text` — reactive text.  
+   - `data-html` — dynamic HTML.  
+   - `data-class` — reactive classes.  
+   - `data-style` — reactive styles.  
+   Additionally:  
+   - `data-prop-*` — reactive binding to any attribute (src, href, etc.).  
+
+4. **Lifecycle hooks**  
+   - `mounted()` — called after insertion into the DOM.  
+   - `unmounted()` — called when removed.  
+   - `transitionEntry()` — called after mounting + rendering (for CSS animations).  
+
+5. **Single source of truth: state**  
+   - Each component receives `options: Record<string, any>`.  
+   - These turn into the component’s `state`.  
+   - No props vs. state confusion — only a single object.  
+   - State updates trigger view updates exactly where needed.  
+
+6. **Errors are not hidden**  
+   - Splash is not a nanny.  
+   - If you create an infinite update loop, that’s your bug.  
+   - Architectural mistakes are visible immediately.  
+
+---
+
+## Philosophy
+
+- **No extra layers.** DOM already does everything, no need to reinvent it.  
+- **Simplicity over magic.** Minimal directives, maximum predictability.  
+- **Trust the developer.** If you want to work directly with DOM — go ahead.  
+- **Efficiency is natural.** Browsers already batch repaints, no extra abstraction needed.  
+
+---
+
+## API
+
+### 1. Component
+
+Each component is a visible entity. You may think of it as an extension of a DOM node. Each component exposes its root DOM element via the component.DOMNode property, so you can directly manipulate it if needed.
+A component must have a **template** — plain HTML with several helper directives.
+
+**Example template (myComponent.html):**
+```html
+<div data-ref="container">
+  <h1 data-text="header-text"></h1>
+  <p>Static paragraph</p>
+  <!--slot:conditionalPart-->
+  <p data-style="conclusion-style">This is finishing paragraph</p>
+</div>
+```
+
+**Component definition (myComponent.ts):**
+```ts
+import { Component } from "@tripod311/splash"
+import View from "./myComponent.html?raw"
+import ChildComponent from "./childComponent.js"
+
+export default class MyComponent extends Component {
+  private static componentName: string = "MyComponent";
+  private static template: string = View;
+
+  constructor (options: Record<string, any>) {
+    super(options);
+
+    // Initialize state
+    this.state.setProp("header-text", "My component title");
+
+    // Subscribe to state changes
+    this.state.on("src", (newValue: any, oldValue: any) => {
+      /* inner logic */
+    });
+
+    // Batch update
+    this.state.update({
+      diffVar1: "someValue",
+      diffVar2: "someOtherValue"
+    });
+
+    // Fill slots
+    this.slots["conditionalPart"].push(new ChildComponent({ var1: 1 }));
+  }
+
+  mounted () {
+    super.mounted();
+  }
+
+  transitionEntry () {
+    // Called after mounted + rendered → safe for CSS animations
+  }
+
+  unmounted () {
+    super.unmounted();
+  }
+}
+```
+
+**Events:**
+```ts
+// Child → Parent
+this.emit("click", { some: "payload" });
+
+// Parent listens
+childComponent.on("click", payload => {
+  console.log(payload);
+});
+```
+
+**Updating child from parent:**
+```ts
+childComponent.update({ color: "newColor" });
+```
+
+⚠️ Note: Each component must have a distinct `componentName`.  
+Splash caches and shares templates between components with the same names.
+
+---
+
+### 2. Slots
+
+Slots manage child components declaratively. They behave like arrays with lifecycle tracking.
+
+**Example:**
+```ts
+const child = new ChildComponent({ ...state });
+this.slots["mySlot"].setContent([child]);
+```
+
+**API:**
+- `setContent(Component[])` — replace slot contents.  
+- `clear(): Component[]` — unmount all and return them.  
+- `push(c: Component)` — append component.  
+- `pop(): Component | undefined` — remove last.  
+- `unshift(c: Component)` — prepend component.  
+- `shift(): Component | undefined` — remove first.  
+- `inject(pos: number, c: Component)` — insert at position.  
+- `remove(pos: number): Component | undefined` — remove at position.  
+- `getByIndex(index: number): Component | undefined` — access without unmounting.  
+- `length: number` — number of components in slot.  
+
+---
+
+### 3. Mounting & Unmounting
+
+To place a component on the page you can use the `mount` method:
+
+```ts
+import MyComponent from "./MyComponent.js";
+
+const app = new MyComponent({ title: "Hello Splash!" });
+app.mount(document.body);
+```
+
+This will append the component’s DOM node into the provided container and call its `mounted()` lifecycle hook.  
+
+To remove a component from the page, call:
+
+```ts
+app.unmount();
+```
+
+This will remove the DOM node and call its `unmounted()` lifecycle hook.
+
+⚠️ **Important:**  
+Unmounting a component does **not** destroy its state or DOM nodes.  
+The component can be mounted again into another container without losing any data:
+
+```ts
+// move component from one place to another
+app.unmount();
+app.mount(document.getElementById("new-container")!);
+```
+
+This behavior allows implementing modals, window managers, tab systems and other features where components may be parked and reinserted freely.
+
+---
+
+## Template Directives
+
+All directives work with **string-based identifiers**. They are not evaluated — only bound.  
+Initial HTML values are used to initialize state.
+
+- `data-ref` — reference in `this.refs`.  
+- `data-text` — reactive `innerText`.  
+- `data-html` — reactive `innerHTML`.  
+- `data-class` — array of strings for CSS classes.  
+- `data-style` — object `{ [prop]: value }` for styles.  
+- `data-prop-*` — any other attribute (e.g. `data-prop-src` for `<img>`).  
+
+Current reactive values can be accessed via:
+```ts
+this.state.getProp("reactive-var-name")
+```
+
+---
+
+## How it Differs from React/Vue
+
+- No virtual DOM → simpler and faster.  
+- No props/state/context zoo → just `state`.  
+- No hidden batching or reconciliation → updates are explicit.  
+- No “child restrictions” → developers freely manipulate the DOM.  
+- Tiny core, only a few kilobytes.  
+
+---
+
+## Example Scenarios
+
+- **Form:** use `data-ref` for `<input>` and plain native events. No `v-model` or controlled/uncontrolled hacks.  
+- **Mount animations:** use `transitionEntry()` for CSS transitions.  
+- **Conditional rendering:** mount/unmount via `data-slot`, no `v-if` or diffing logic.  
+
+---

package/dist/component.d.ts

@@ -0,0 +1,39 @@
+import { ComponentState } from "./componentState.js";
+import ReactiveText from "./reactives/reactiveText.js";
+import ReactiveHTML from "./reactives/reactiveHTML.js";
+import ReactiveStyle from "./reactives/reactiveStyle.js";
+import ReactiveClass from "./reactives/reactiveClass.js";
+import ReactiveProp from "./reactives/reactiveProp.js";
+import Slot from "./slot.js";
+type EventListener = (payload: any) => void;
+export default class Component {
+    protected static componentName: string;
+    protected static template: string;
+    protected state: ComponentState;
+    protected view: Node;
+    protected parentElement?: HTMLElement;
+    private setupAF?;
+    protected refs: Record<string, HTMLElement>;
+    protected slots: Record<string, Slot>;
+    protected textReactives: Record<string, ReactiveText>;
+    protected htmlReactives: Record<string, ReactiveHTML>;
+    protected classReactives: Record<string, ReactiveClass>;
+    protected styleReactives: Record<string, ReactiveStyle>;
+    protected propReactives: Record<string, ReactiveProp>;
+    protected listeners: Record<string, EventListener[]>;
+    constructor(options: Record<string, any>);
+    protected build(root: Node): void;
+    protected buildState(options: Record<string, any>): void;
+    mounted(): void;
+    transitionReady(): void;
+    unmounted(): void;
+    update(diff: Record<string, any>): void;
+    mount(parentElement: HTMLElement): void;
+    unmount(): void;
+    get DOMNode(): HTMLElement;
+    on(eventName: string, listener: EventListener): void;
+    off(eventName: string, listener: EventListener): void;
+    emit(eventName: string, payload: any): void;
+}
+export {};
+//# sourceMappingURL=component.d.ts.map

package/dist/component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../src/component.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AACpD,OAAO,YAAY,MAAM,6BAA6B,CAAA;AACtD,OAAO,YAAY,MAAM,6BAA6B,CAAA;AACtD,OAAO,aAAa,MAAM,8BAA8B,CAAA;AACxD,OAAO,aAAa,MAAM,8BAA8B,CAAA;AACxD,OAAO,YAAY,MAAM,6BAA6B,CAAA;AACtD,OAAO,IAAI,MAAM,WAAW,CAAA;AAE5B,KAAK,aAAa,GAAG,CAAC,OAAO,EAAE,GAAG,KAAK,IAAI,CAAC;AAE5C,MAAM,CAAC,OAAO,OAAO,SAAS;IAC7B,SAAS,CAAC,MAAM,CAAC,aAAa,EAAE,MAAM,CAAM;IAC5C,SAAS,CAAC,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAM;IAEvC,SAAS,CAAC,KAAK,EAAG,cAAc,CAAC;IACjC,SAAS,CAAC,IAAI,EAAE,IAAI,CAAC;IACrB,SAAS,CAAC,aAAa,CAAC,EAAE,WAAW,CAAC;IACtC,OAAO,CAAC,OAAO,CAAC,CAA2C;IAE3D,SAAS,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAM;IACjD,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,CAAM;IAE3C,SAAS,CAAC,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,CAAM;IAC3D,SAAS,CAAC,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,CAAM;IAC3D,SAAS,CAAC,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,CAAM;IAC7D,SAAS,CAAC,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,CAAM;IAC7D,SAAS,CAAC,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,CAAM;IAE3D,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,aAAa,EAAE,CAAC,CAAM;gBAE7C,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IAezC,SAAS,CAAC,KAAK,CAAE,IAAI,EAAE,IAAI;IA4C3B,SAAS,CAAC,UAAU,CAAE,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IA6ClD,OAAO;IAaP,eAAe;IAIf,SAAS;IAOT,MAAM,CAAE,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IAIjC,KAAK,CAAE,aAAa,EAAE,WAAW;IAOjC,OAAO;IAKP,IAAI,OAAO,IAAK,WAAW,CAE1B;IAED,EAAE,CAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,aAAa;IAU9C,GAAG,CAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,aAAa;IAiB/C,IAAI,CAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG;CAWrC"}

package/dist/component.js

@@ -0,0 +1,180 @@
+import TemplateCache from "./templateCache.js";
+import { ComponentState } from "./componentState.js";
+import ReactiveText from "./reactives/reactiveText.js";
+import ReactiveHTML from "./reactives/reactiveHTML.js";
+import ReactiveStyle from "./reactives/reactiveStyle.js";
+import ReactiveClass from "./reactives/reactiveClass.js";
+import ReactiveProp from "./reactives/reactiveProp.js";
+import Slot from "./slot.js";
+export default class Component {
+    static componentName = "";
+    static template = "";
+    state;
+    view;
+    parentElement;
+    setupAF;
+    refs = {};
+    slots = {};
+    textReactives = {};
+    htmlReactives = {};
+    classReactives = {};
+    styleReactives = {};
+    propReactives = {};
+    listeners = {};
+    constructor(options) {
+        const ctor = this.constructor;
+        const template = TemplateCache.getTemplate(ctor.componentName);
+        if (template === null) {
+            this.view = TemplateCache.compileTemplate(ctor.componentName, ctor.template);
+        }
+        else {
+            this.view = template;
+        }
+        this.build(this.view);
+        this.buildState(options);
+    }
+    build(root) {
+        if (root.nodeType === Node.COMMENT_NODE) {
+            const comment = root;
+            if (comment.data.startsWith("slot:")) {
+                const slotName = comment.data.slice("slot:".length);
+                this.slots[slotName] = new Slot(comment);
+                return;
+            }
+        }
+        else if (root.nodeType === Node.ELEMENT_NODE) {
+            const element = root;
+            for (const attr of Array.from(element.attributes)) {
+                if (attr.name.startsWith("data-ref")) {
+                    this.refs[attr.value] = element;
+                }
+                if (attr.name.startsWith("data-text")) {
+                    this.textReactives[attr.value] = new ReactiveText(element);
+                }
+                if (attr.name.startsWith("data-html")) {
+                    this.htmlReactives[attr.value] = new ReactiveHTML(element);
+                }
+                if (attr.name.startsWith("data-class")) {
+                    this.classReactives[attr.value] = new ReactiveClass(element);
+                }
+                if (attr.name.startsWith("data-style")) {
+                    this.styleReactives[attr.value] = new ReactiveStyle(element);
+                }
+                if (attr.name.startsWith("data-prop-")) {
+                    const propName = attr.name.slice("data-prop-".length);
+                    this.propReactives[attr.value] = new ReactiveProp(element, propName);
+                }
+            }
+            for (const child of Array.from(root.childNodes)) {
+                this.build(child);
+            }
+        }
+    }
+    buildState(options) {
+        const base = {};
+        for (const key in this.textReactives) {
+            base[key] = this.textReactives[key].current();
+        }
+        for (const key in this.htmlReactives) {
+            base[key] = this.htmlReactives[key].current();
+        }
+        for (const key in this.classReactives) {
+            base[key] = this.classReactives[key].current();
+        }
+        for (const key in this.styleReactives) {
+            base[key] = this.styleReactives[key].current();
+        }
+        for (const key in this.propReactives) {
+            base[key] = this.propReactives[key].current();
+        }
+        this.state = new ComponentState(base);
+        for (const key in this.textReactives) {
+            const reactive = this.textReactives[key];
+            this.state.on(key, reactive.update.bind(reactive));
+        }
+        for (const key in this.htmlReactives) {
+            const reactive = this.htmlReactives[key];
+            this.state.on(key, reactive.update.bind(reactive));
+        }
+        for (const key in this.classReactives) {
+            const reactive = this.classReactives[key];
+            this.state.on(key, reactive.update.bind(reactive));
+        }
+        for (const key in this.styleReactives) {
+            const reactive = this.styleReactives[key];
+            this.state.on(key, reactive.update.bind(reactive));
+        }
+        for (const key in this.propReactives) {
+            const reactive = this.propReactives[key];
+            this.state.on(key, reactive.update.bind(reactive));
+        }
+        this.state.update(options);
+    }
+    mounted() {
+        this.setupAF = requestAnimationFrame(() => {
+            this.setupAF = requestAnimationFrame(() => {
+                this.transitionReady();
+                this.setupAF = undefined;
+            });
+        });
+        for (const id in this.slots) {
+            this.slots[id].mount();
+        }
+    }
+    transitionReady() {
+        // place where you can start all css animations
+    }
+    unmounted() {
+        if (this.setupAF !== undefined)
+            cancelAnimationFrame(this.setupAF);
+        for (const id in this.slots) {
+            this.slots[id].unmount();
+        }
+    }
+    update(diff) {
+        this.state.update(diff);
+    }
+    mount(parentElement) {
+        this.parentElement = parentElement;
+        this.parentElement.appendChild(this.view);
+        this.view.offsetWidth;
+        this.mounted();
+    }
+    unmount() {
+        this.unmounted();
+        this.parentElement?.removeChild(this.view);
+    }
+    get DOMNode() {
+        return this.view;
+    }
+    on(eventName, listener) {
+        if (!this.listeners[eventName]) {
+            this.listeners[eventName] = [];
+        }
+        const arr = this.listeners[eventName];
+        arr.push(listener);
+    }
+    off(eventName, listener) {
+        const arr = this.listeners[eventName];
+        if (arr !== undefined) {
+            const lArr = arr;
+            const index = lArr.indexOf(listener);
+            if (index !== -1) {
+                lArr.splice(index, 1);
+                if (lArr.length === 0) {
+                    delete this.listeners[eventName];
+                }
+            }
+        }
+    }
+    emit(eventName, payload) {
+        const arr = this.listeners[eventName];
+        if (arr !== undefined) {
+            const lArr = arr.slice();
+            for (const listener of lArr) {
+                listener(payload);
+            }
+        }
+    }
+}
+//# sourceMappingURL=component.js.map

package/dist/component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"component.js","sourceRoot":"","sources":["../src/component.ts"],"names":[],"mappings":"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"}

package/dist/componentState.d.ts

@@ -0,0 +1,13 @@
+export type StateListener = (newValue: any, oldValue: any) => void;
+export declare class ComponentState {
+    private value;
+    private listeners;
+    constructor(value?: Record<string, any>);
+    on(propName: string, listener: StateListener): void;
+    off(propName: string, listener: StateListener): void;
+    update(diff: Record<string, any>): void;
+    getProps(): Record<string, any>;
+    getProp(propName: string): any;
+    setProp(propName: string, propValue: any): void;
+}
+//# sourceMappingURL=componentState.d.ts.map

package/dist/componentState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"componentState.d.ts","sourceRoot":"","sources":["../src/componentState.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,aAAa,GAAG,CAAC,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,KAAK,IAAI,CAAC;AAEnE,qBAAa,cAAc;IAC1B,OAAO,CAAC,KAAK,CAAsB;IACnC,OAAO,CAAC,SAAS,CAAuC;gBAE3C,KAAK,GAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAM;IAI5C,EAAE,CAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,aAAa;IAQ7C,GAAG,CAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,aAAa;IAM9C,MAAM,CAAE,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IAwBjC,QAAQ,IAAK,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IAIhC,OAAO,CAAE,QAAQ,EAAE,MAAM,GAAG,GAAG;IAI/B,OAAO,CAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG;CAYzC"}

package/dist/componentState.js

@@ -0,0 +1,55 @@
+export class ComponentState {
+    value;
+    listeners = {};
+    constructor(value = {}) {
+        this.value = value;
+    }
+    on(propName, listener) {
+        if (this.listeners[propName] === undefined) {
+            this.listeners[propName] = [];
+        }
+        this.listeners[propName].push(listener);
+    }
+    off(propName, listener) {
+        if (this.listeners[propName] !== undefined) {
+            this.listeners[propName] = this.listeners[propName].filter(l => l !== listener);
+        }
+    }
+    update(diff) {
+        const makeCalls = {
+            "*": {
+                newValue: Object.assign({}, this.value, diff),
+                oldValue: Object.assign({}, this.value)
+            }
+        };
+        for (const propName in diff) {
+            makeCalls[propName] = { newValue: diff[propName], oldValue: this.value[propName] };
+            this.value[propName] = diff[propName];
+        }
+        for (const propName in makeCalls) {
+            if (this.listeners[propName] !== undefined) {
+                const arr = this.listeners[propName];
+                for (const l of arr) {
+                    l(makeCalls[propName].newValue, makeCalls[propName].oldValue);
+                }
+            }
+        }
+    }
+    getProps() {
+        return this.value;
+    }
+    getProp(propName) {
+        return this.value[propName];
+    }
+    setProp(propName, propValue) {
+        const oldValue = this.value[propName];
+        this.value[propName] = propValue;
+        if (this.listeners[propName] !== undefined) {
+            const arr = this.listeners[propName];
+            for (const l of arr) {
+                l(propValue, oldValue);
+            }
+        }
+    }
+}
+//# sourceMappingURL=componentState.js.map

package/dist/componentState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"componentState.js","sourceRoot":"","sources":["../src/componentState.ts"],"names":[],"mappings":"AAEA,MAAM,OAAO,cAAc;IAClB,KAAK,CAAsB;IAC3B,SAAS,GAAoC,EAAE,CAAC;IAExD,YAAa,QAA6B,EAAE;QAC3C,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;IACpB,CAAC;IAED,EAAE,CAAE,QAAgB,EAAE,QAAuB;QAC5C,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,SAAS,EAAE,CAAC;YAC5C,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC;QAC/B,CAAC;QAED,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAC1C,CAAC;IAED,GAAG,CAAE,QAAgB,EAAE,QAAuB;QAC7C,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,SAAS,EAAE,CAAC;YAC5C,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAE,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,QAAQ,CAAC,CAAC;QAClF,CAAC;IACF,CAAC;IAED,MAAM,CAAE,IAAyB;QAChC,MAAM,SAAS,GAAsD;YACpE,GAAG,EAAE;gBACJ,QAAQ,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC;gBAC7C,QAAQ,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC;aACvC;SACD,CAAC;QAEF,KAAK,MAAM,QAAQ,IAAI,IAAI,EAAE,CAAC;YAC7B,SAAS,CAAC,QAAQ,CAAC,GAAG,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC;YACnF,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;QACvC,CAAC;QAED,KAAK,MAAM,QAAQ,IAAI,SAAS,EAAE,CAAC;YAClC,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,SAAS,EAAE,CAAC;gBAC5C,MAAM,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAoB,CAAC;gBAExD,KAAK,MAAM,CAAC,IAAI,GAAG,EAAE,CAAC;oBACrB,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,QAAQ,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,CAAC;gBAC/D,CAAC;YACF,CAAC;QACF,CAAC;IACF,CAAC;IAED,QAAQ;QACP,OAAO,IAAI,CAAC,KAAK,CAAC;IACnB,CAAC;IAED,OAAO,CAAE,QAAgB;QACxB,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IAC7B,CAAC;IAED,OAAO,CAAE,QAAgB,EAAE,SAAc;QACxC,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QACtC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,SAAS,CAAC;QAEjC,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,SAAS,EAAE,CAAC;YAC5C,MAAM,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAoB,CAAC;YAExD,KAAK,MAAM,CAAC,IAAI,GAAG,EAAE,CAAC;gBACrB,CAAC,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;YACxB,CAAC;QACF,CAAC;IACF,CAAC;CACD"}

package/dist/index.d.ts

@@ -0,0 +1,14 @@
+import Component from "./component.js";
+import { ComponentState } from "./componentState.js";
+import Slot from "./slot.js";
+import TemplateCache from "./templateCache.js";
+import ReactiveElement from "./reactiveElement.js";
+import ReactiveText from "./reactives/reactiveText.js";
+import ReactiveHTML from "./reactives/reactiveHTML.js";
+import ReactiveStyle from "./reactives/reactiveStyle.js";
+import ReactiveClass from "./reactives/reactiveClass.js";
+import ReactiveProp from "./reactives/reactiveProp.js";
+import type { StateListener } from "./componentState.js";
+export type { StateListener };
+export { Component, ComponentState, Slot, TemplateCache, ReactiveElement, ReactiveText, ReactiveHTML, ReactiveStyle, ReactiveClass, ReactiveProp };
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,gBAAgB,CAAA;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AACpD,OAAO,IAAI,MAAM,WAAW,CAAA;AAC5B,OAAO,aAAa,MAAM,oBAAoB,CAAA;AAC9C,OAAO,eAAe,MAAM,sBAAsB,CAAA;AAClD,OAAO,YAAY,MAAM,6BAA6B,CAAA;AACtD,OAAO,YAAY,MAAM,6BAA6B,CAAA;AACtD,OAAO,aAAa,MAAM,8BAA8B,CAAA;AACxD,OAAO,aAAa,MAAM,8BAA8B,CAAA;AACxD,OAAO,YAAY,MAAM,6BAA6B,CAAA;AAEtD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAExD,YAAY,EAAE,aAAa,EAAE,CAAA;AAE7B,OAAO,EACN,SAAS,EACT,cAAc,EACd,IAAI,EACJ,aAAa,EACb,eAAe,EACf,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,aAAa,EACb,YAAY,EACZ,CAAA"}

package/dist/index.js

@@ -0,0 +1,12 @@
+import Component from "./component.js";
+import { ComponentState } from "./componentState.js";
+import Slot from "./slot.js";
+import TemplateCache from "./templateCache.js";
+import ReactiveElement from "./reactiveElement.js";
+import ReactiveText from "./reactives/reactiveText.js";
+import ReactiveHTML from "./reactives/reactiveHTML.js";
+import ReactiveStyle from "./reactives/reactiveStyle.js";
+import ReactiveClass from "./reactives/reactiveClass.js";
+import ReactiveProp from "./reactives/reactiveProp.js";
+export { Component, ComponentState, Slot, TemplateCache, ReactiveElement, ReactiveText, ReactiveHTML, ReactiveStyle, ReactiveClass, ReactiveProp };
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,gBAAgB,CAAA;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AACpD,OAAO,IAAI,MAAM,WAAW,CAAA;AAC5B,OAAO,aAAa,MAAM,oBAAoB,CAAA;AAC9C,OAAO,eAAe,MAAM,sBAAsB,CAAA;AAClD,OAAO,YAAY,MAAM,6BAA6B,CAAA;AACtD,OAAO,YAAY,MAAM,6BAA6B,CAAA;AACtD,OAAO,aAAa,MAAM,8BAA8B,CAAA;AACxD,OAAO,aAAa,MAAM,8BAA8B,CAAA;AACxD,OAAO,YAAY,MAAM,6BAA6B,CAAA;AAMtD,OAAO,EACN,SAAS,EACT,cAAc,EACd,IAAI,EACJ,aAAa,EACb,eAAe,EACf,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,aAAa,EACb,YAAY,EACZ,CAAA"}

package/dist/reactiveElement.d.ts

@@ -0,0 +1,7 @@
+export default class ReactiveElement {
+    protected element: HTMLElement;
+    constructor(element: HTMLElement);
+    update(newValue: any, oldValue: any): void;
+    current(): any;
+}
+//# sourceMappingURL=reactiveElement.d.ts.map

package/dist/reactiveElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactiveElement.d.ts","sourceRoot":"","sources":["../src/reactiveElement.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,OAAO,eAAe;IACnC,SAAS,CAAC,OAAO,EAAE,WAAW,CAAC;gBAElB,OAAO,EAAE,WAAW;IAIjC,MAAM,CAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG;IAIpC,OAAO,IAAK,GAAG;CAGf"}

package/dist/reactiveElement.js

@@ -0,0 +1,13 @@
+export default class ReactiveElement {
+    element;
+    constructor(element) {
+        this.element = element;
+    }
+    update(newValue, oldValue) {
+        // abstract method
+    }
+    current() {
+        // abstract
+    }
+}
+//# sourceMappingURL=reactiveElement.js.map

package/dist/reactiveElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactiveElement.js","sourceRoot":"","sources":["../src/reactiveElement.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,OAAO,eAAe;IACzB,OAAO,CAAc;IAE/B,YAAa,OAAoB;QAChC,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;IACxB,CAAC;IAED,MAAM,CAAE,QAAa,EAAE,QAAa;QACnC,kBAAkB;IACnB,CAAC;IAED,OAAO;QACN,WAAW;IACZ,CAAC;CACD"}

package/dist/reactives/reactiveClass.d.ts

@@ -0,0 +1,8 @@
+import ReactiveElement from "../reactiveElement.js";
+export default class ReactiveClass extends ReactiveElement {
+    protected currentClasses: string[];
+    constructor(element: HTMLElement);
+    update(newValue: any, oldValue: any): void;
+    current(): string[];
+}
+//# sourceMappingURL=reactiveClass.d.ts.map

package/dist/reactives/reactiveClass.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactiveClass.d.ts","sourceRoot":"","sources":["../../src/reactives/reactiveClass.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,uBAAuB,CAAA;AAEnD,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,eAAe;IACzD,SAAS,CAAC,cAAc,EAAE,MAAM,EAAE,CAAM;gBAE3B,OAAO,EAAE,WAAW;IAMjC,MAAM,CAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG;IAQpC,OAAO,IAAK,MAAM,EAAE;CAGpB"}

package/dist/reactives/reactiveClass.js

@@ -0,0 +1,18 @@
+import ReactiveElement from "../reactiveElement.js";
+export default class ReactiveClass extends ReactiveElement {
+    currentClasses = [];
+    constructor(element) {
+        super(element);
+        this.currentClasses = Array.from(element.classList);
+    }
+    update(newValue, oldValue) {
+        if (!Array.isArray(newValue))
+            throw new Error("ReactiveClass::update accepts only string[]");
+        this.currentClasses = newValue.map(c => c.toString());
+        this.element.className = this.currentClasses.join(" ");
+    }
+    current() {
+        return this.currentClasses.slice();
+    }
+}
+//# sourceMappingURL=reactiveClass.js.map

package/dist/reactives/reactiveClass.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactiveClass.js","sourceRoot":"","sources":["../../src/reactives/reactiveClass.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,uBAAuB,CAAA;AAEnD,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,eAAe;IAC/C,cAAc,GAAa,EAAE,CAAC;IAExC,YAAa,OAAoB;QAChC,KAAK,CAAC,OAAO,CAAC,CAAC;QAEf,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;IACrD,CAAC;IAED,MAAM,CAAE,QAAa,EAAE,QAAa;QACnC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC;YAAE,MAAM,IAAI,KAAK,CAAC,6CAA6C,CAAC,CAAC;QAE7F,IAAI,CAAC,cAAc,GAAI,QAAkB,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;QAEjE,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACxD,CAAC;IAED,OAAO;QACN,OAAO,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,CAAC;IACpC,CAAC;CACD"}

package/dist/reactives/reactiveHTML.d.ts

@@ -0,0 +1,8 @@
+import ReactiveElement from "../reactiveElement.js";
+export default class ReactiveHTML extends ReactiveElement {
+    protected currentHTML: string;
+    constructor(element: HTMLElement);
+    update(newValue: any, oldValue: any): void;
+    current(): string;
+}
+//# sourceMappingURL=reactiveHTML.d.ts.map

package/dist/reactives/reactiveHTML.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactiveHTML.d.ts","sourceRoot":"","sources":["../../src/reactives/reactiveHTML.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,uBAAuB,CAAA;AAEnD,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,eAAe;IACxD,SAAS,CAAC,WAAW,EAAE,MAAM,CAAM;gBAEtB,OAAO,EAAE,WAAW;IAMjC,MAAM,CAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG;IAKpC,OAAO,IAAK,MAAM;CAGlB"}

package/dist/reactives/reactiveHTML.js

@@ -0,0 +1,16 @@
+import ReactiveElement from "../reactiveElement.js";
+export default class ReactiveHTML extends ReactiveElement {
+    currentHTML = "";
+    constructor(element) {
+        super(element);
+        this.currentHTML = element.innerHTML;
+    }
+    update(newValue, oldValue) {
+        this.currentHTML = newValue ? newValue.toString() : "";
+        this.element.innerHTML = this.currentHTML;
+    }
+    current() {
+        return this.currentHTML;
+    }
+}
+//# sourceMappingURL=reactiveHTML.js.map

package/dist/reactives/reactiveHTML.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactiveHTML.js","sourceRoot":"","sources":["../../src/reactives/reactiveHTML.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,uBAAuB,CAAA;AAEnD,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,eAAe;IAC9C,WAAW,GAAW,EAAE,CAAC;IAEnC,YAAa,OAAoB;QAChC,KAAK,CAAC,OAAO,CAAC,CAAC;QAEf,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC,SAAS,CAAC;IACtC,CAAC;IAED,MAAM,CAAE,QAAa,EAAE,QAAa;QACnC,IAAI,CAAC,WAAW,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QACvD,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC;IAC3C,CAAC;IAED,OAAO;QACN,OAAO,IAAI,CAAC,WAAW,CAAC;IACzB,CAAC;CACD"}

package/dist/reactives/reactiveProp.d.ts

@@ -0,0 +1,9 @@
+import ReactiveElement from "../reactiveElement.js";
+export default class ReactiveProp extends ReactiveElement {
+    protected propName: string;
+    protected currentValue: string | null;
+    constructor(element: HTMLElement, propName: string);
+    update(newValue: any, oldValue: any): void;
+    current(): string | null;
+}
+//# sourceMappingURL=reactiveProp.d.ts.map

package/dist/reactives/reactiveProp.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactiveProp.d.ts","sourceRoot":"","sources":["../../src/reactives/reactiveProp.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,uBAAuB,CAAA;AAEnD,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,eAAe;IACxD,SAAS,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC3B,SAAS,CAAC,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;gBAEzB,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM;IAYnD,MAAM,CAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG;IAYpC,OAAO,IAAK,MAAM,GAAG,IAAI;CAGzB"}

package/dist/reactives/reactiveProp.js

@@ -0,0 +1,29 @@
+import ReactiveElement from "../reactiveElement.js";
+export default class ReactiveProp extends ReactiveElement {
+    propName;
+    currentValue;
+    constructor(element, propName) {
+        super(element);
+        this.propName = propName;
+        if (element.hasAttribute(propName)) {
+            this.currentValue = element.getAttribute(this.propName);
+        }
+        else {
+            this.currentValue = null;
+        }
+    }
+    update(newValue, oldValue) {
+        if (newValue === null || newValue === undefined) {
+            this.currentValue = null;
+            this.element.removeAttribute(this.propName);
+        }
+        else {
+            this.currentValue = newValue.toString();
+            this.element.setAttribute(this.propName, this.currentValue);
+        }
+    }
+    current() {
+        return this.currentValue;
+    }
+}
+//# sourceMappingURL=reactiveProp.js.map

package/dist/reactives/reactiveProp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactiveProp.js","sourceRoot":"","sources":["../../src/reactives/reactiveProp.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,uBAAuB,CAAA;AAEnD,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,eAAe;IAC9C,QAAQ,CAAS;IACjB,YAAY,CAAgB;IAEtC,YAAa,OAAoB,EAAE,QAAgB;QAClD,KAAK,CAAC,OAAO,CAAC,CAAC;QAEf,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QAEzB,IAAI,OAAO,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE,CAAC;YACpC,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QACzD,CAAC;aAAM,CAAC;YACP,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;QAC1B,CAAC;IACF,CAAC;IAED,MAAM,CAAE,QAAa,EAAE,QAAa;QACnC,IAAI,QAAQ,KAAK,IAAI,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;YACjD,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;YAEzB,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC7C,CAAC;aAAM,CAAC;YACP,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC,QAAQ,EAAE,CAAC;YAExC,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAsB,CAAC,CAAC;QACvE,CAAC;IACF,CAAC;IAED,OAAO;QACN,OAAO,IAAI,CAAC,YAAY,CAAC;IAC1B,CAAC;CACD"}

package/dist/reactives/reactiveStyle.d.ts

@@ -0,0 +1,8 @@
+import ReactiveElement from "../reactiveElement.js";
+export default class ReactiveStyle extends ReactiveElement {
+    protected currentStyle: Record<string, string>;
+    constructor(element: HTMLElement);
+    update(newValue: any, oldValue: any): void;
+    current(): Record<string, string>;
+}
+//# sourceMappingURL=reactiveStyle.d.ts.map

package/dist/reactives/reactiveStyle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactiveStyle.d.ts","sourceRoot":"","sources":["../../src/reactives/reactiveStyle.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,uBAAuB,CAAA;AAEnD,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,eAAe;IACzD,SAAS,CAAC,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAM;gBAEvC,OAAO,EAAE,WAAW;IASjC,MAAM,CAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG;IAyBpC,OAAO,IAAK,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;CAGlC"}

package/dist/reactives/reactiveStyle.js

@@ -0,0 +1,39 @@
+import ReactiveElement from "../reactiveElement.js";
+export default class ReactiveStyle extends ReactiveElement {
+    currentStyle = {};
+    constructor(element) {
+        super(element);
+        for (let i = 0; i < element.style.length; i++) {
+            const propName = element.style[i];
+            this.currentStyle[propName] = element.style.getPropertyValue(propName);
+        }
+    }
+    update(newValue, oldValue) {
+        if (typeof newValue !== 'object')
+            throw new Error("ReactiveStyle::update accepts only Record<string, string> | null");
+        if (newValue === null || newValue === undefined) {
+            for (const propName in this.currentStyle) {
+                this.element.style.removeProperty(propName);
+                delete this.currentStyle[propName];
+            }
+        }
+        else {
+            const newStyles = newValue;
+            const keySet = Object.keys(this.currentStyle).concat(Object.keys(newStyles));
+            for (const key of keySet) {
+                if (newStyles[key] === undefined) {
+                    this.element.style.removeProperty(key);
+                    delete this.currentStyle[key];
+                }
+                else {
+                    this.element.style.setProperty(key, newStyles[key].toString());
+                    this.currentStyle[key] = newStyles[key].toString();
+                }
+            }
+        }
+    }
+    current() {
+        return Object.assign({}, this.currentStyle);
+    }
+}
+//# sourceMappingURL=reactiveStyle.js.map

package/dist/reactives/reactiveStyle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactiveStyle.js","sourceRoot":"","sources":["../../src/reactives/reactiveStyle.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,uBAAuB,CAAA;AAEnD,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,eAAe;IAC/C,YAAY,GAA2B,EAAE,CAAC;IAEpD,YAAa,OAAoB;QAChC,KAAK,CAAC,OAAO,CAAC,CAAC;QAEf,KAAK,IAAI,CAAC,GAAC,CAAC,EAAE,CAAC,GAAC,OAAO,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;YAC3C,MAAM,QAAQ,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;YAClC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,GAAG,OAAO,CAAC,KAAK,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;QACxE,CAAC;IACF,CAAC;IAED,MAAM,CAAE,QAAa,EAAE,QAAa;QACnC,IAAI,OAAO,QAAQ,KAAK,QAAQ;YAAE,MAAM,IAAI,KAAK,CAAC,kEAAkE,CAAC,CAAC;QAEtH,IAAI,QAAQ,KAAK,IAAI,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;YACjD,KAAK,MAAM,QAAQ,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;gBAC1C,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;gBAC5C,OAAO,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;YACpC,CAAC;QACF,CAAC;aAAM,CAAC;YACP,MAAM,SAAS,GAAG,QAAkC,CAAC;YAErD,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC;YAE7E,KAAK,MAAM,GAAG,IAAI,MAAM,EAAE,CAAC;gBAC1B,IAAI,SAAS,CAAC,GAAG,CAAC,KAAK,SAAS,EAAE,CAAC;oBAClC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;oBACvC,OAAO,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC;gBAC/B,CAAC;qBAAM,CAAC;oBACP,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;oBAC/D,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,CAAC;gBACpD,CAAC;YACF,CAAC;QACF,CAAC;IACF,CAAC;IAED,OAAO;QACN,OAAO,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;IAC7C,CAAC;CACD"}

package/dist/reactives/reactiveText.d.ts

@@ -0,0 +1,8 @@
+import ReactiveElement from "../reactiveElement.js";
+export default class ReactiveText extends ReactiveElement {
+    protected currentText: string;
+    constructor(element: HTMLElement);
+    update(newValue: any, oldValue: any): void;
+    current(): string;
+}
+//# sourceMappingURL=reactiveText.d.ts.map

package/dist/reactives/reactiveText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactiveText.d.ts","sourceRoot":"","sources":["../../src/reactives/reactiveText.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,uBAAuB,CAAA;AAEnD,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,eAAe;IACxD,SAAS,CAAC,WAAW,EAAE,MAAM,CAAM;gBAEtB,OAAO,EAAE,WAAW;IAMjC,MAAM,CAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG;IAKpC,OAAO,IAAK,MAAM;CAGlB"}

package/dist/reactives/reactiveText.js

@@ -0,0 +1,16 @@
+import ReactiveElement from "../reactiveElement.js";
+export default class ReactiveText extends ReactiveElement {
+    currentText = "";
+    constructor(element) {
+        super(element);
+        this.currentText = element.innerText;
+    }
+    update(newValue, oldValue) {
+        this.currentText = newValue ? newValue.toString() : "";
+        this.element.innerText = this.currentText;
+    }
+    current() {
+        return this.currentText;
+    }
+}
+//# sourceMappingURL=reactiveText.js.map

package/dist/reactives/reactiveText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactiveText.js","sourceRoot":"","sources":["../../src/reactives/reactiveText.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,uBAAuB,CAAA;AAEnD,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,eAAe;IAC9C,WAAW,GAAW,EAAE,CAAC;IAEnC,YAAa,OAAoB;QAChC,KAAK,CAAC,OAAO,CAAC,CAAC;QAEf,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC,SAAS,CAAC;IACtC,CAAC;IAED,MAAM,CAAE,QAAa,EAAE,QAAa;QACnC,IAAI,CAAC,WAAW,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QACvD,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC;IAC3C,CAAC;IAED,OAAO;QACN,OAAO,IAAI,CAAC,WAAW,CAAC;IACzB,CAAC;CACD"}

package/dist/slot.d.ts

@@ -0,0 +1,20 @@
+import type Component from "./component.js";
+export default class Slot {
+    private anchor;
+    private content;
+    private mounted;
+    constructor(anchor: Comment);
+    setContent(content: Component | Component[]): void;
+    clear(): Component[];
+    mount(): void;
+    unmount(): void;
+    push(component: Component): void;
+    pop(): Component | undefined;
+    unshift(component: Component): void;
+    shift(): Component | undefined;
+    insert(position: number, component: Component): void;
+    remove(position: number): Component | undefined;
+    getByIndex(index: number): Component | undefined;
+    get length(): number;
+}
+//# sourceMappingURL=slot.d.ts.map

package/dist/slot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot.d.ts","sourceRoot":"","sources":["../src/slot.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,SAAS,MAAM,gBAAgB,CAAA;AAE3C,MAAM,CAAC,OAAO,OAAO,IAAI;IACxB,OAAO,CAAC,MAAM,CAAU;IACxB,OAAO,CAAC,OAAO,CAAmB;IAClC,OAAO,CAAC,OAAO,CAAkB;gBAEpB,MAAM,EAAE,OAAO;IAI5B,UAAU,CAAE,OAAO,EAAE,SAAS,GAAG,SAAS,EAAE;IAmB5C,KAAK,IAAK,SAAS,EAAE;IAarB,KAAK;IAQL,OAAO;IAMP,IAAI,CAAE,SAAS,EAAE,SAAS;IAQ1B,GAAG,IAAK,SAAS,GAAG,SAAS;IAW7B,OAAO,CAAE,SAAS,EAAE,SAAS;IAQ7B,KAAK,IAAK,SAAS,GAAG,SAAS;IAW/B,MAAM,CAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS;IAe9C,MAAM,CAAE,QAAQ,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS;IAahD,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS;IAIhD,IAAI,MAAM,IAAK,MAAM,CAEpB;CACD"}

package/dist/slot.js

@@ -0,0 +1,108 @@
+export default class Slot {
+    anchor;
+    content = [];
+    mounted = false;
+    constructor(anchor) {
+        this.anchor = anchor;
+    }
+    setContent(content) {
+        this.clear();
+        this.content = content;
+        let lastNode = this.anchor;
+        for (const component of this.content) {
+            lastNode.after(component.DOMNode);
+            lastNode = component.DOMNode;
+        }
+        if (this.mounted) {
+            for (const component of this.content) {
+                component.mounted();
+            }
+        }
+    }
+    clear() {
+        for (let component of this.content) {
+            if (this.mounted)
+                component.unmounted();
+            component.DOMNode.remove();
+        }
+        const toReturn = this.content;
+        this.content = [];
+        return toReturn;
+    }
+    mount() {
+        this.mounted = true;
+        for (const component of this.content) {
+            component.mounted();
+        }
+    }
+    unmount() {
+        this.clear();
+        this.mounted = false;
+    }
+    push(component) {
+        this.content.push(component);
+        this.content[this.content.length - 2].DOMNode.after(component.DOMNode);
+        if (this.mounted) {
+            component.mounted();
+        }
+    }
+    pop() {
+        if (this.content.length === 0) {
+            return undefined;
+        }
+        const toReturn = this.content.pop();
+        toReturn.unmounted();
+        toReturn.DOMNode.remove();
+        return toReturn;
+    }
+    unshift(component) {
+        this.content.unshift(component);
+        this.content[0].DOMNode.before(component.DOMNode);
+        if (this.mounted) {
+            component.mounted();
+        }
+    }
+    shift() {
+        if (this.content.length === 0) {
+            return undefined;
+        }
+        const toReturn = this.content.shift();
+        toReturn.unmounted();
+        toReturn.DOMNode.remove();
+        return toReturn;
+    }
+    insert(position, component) {
+        this.content.splice(position, 0, component);
+        const index = this.content.indexOf(component);
+        let anchor;
+        if (index === 0) {
+            anchor = this.anchor;
+        }
+        else {
+            anchor = this.content[index - 1].DOMNode;
+        }
+        anchor.after(component.DOMNode);
+        if (this.mounted) {
+            component.mounted();
+        }
+    }
+    remove(position) {
+        const arr = this.content.splice(position, 1);
+        if (arr.length === 0) {
+            return undefined;
+        }
+        else {
+            const toReturn = arr[0];
+            toReturn.unmounted();
+            toReturn.DOMNode.remove();
+            return toReturn;
+        }
+    }
+    getByIndex(index) {
+        return this.content[index];
+    }
+    get length() {
+        return this.content.length;
+    }
+}
+//# sourceMappingURL=slot.js.map

package/dist/slot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot.js","sourceRoot":"","sources":["../src/slot.ts"],"names":[],"mappings":"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"}

package/dist/templateCache.d.ts

@@ -0,0 +1,6 @@
+export default class TemplateCache {
+    private static templates;
+    static compileTemplate(componentName: string, template: string): Node;
+    static getTemplate(componentName: string): Node | null;
+}
+//# sourceMappingURL=templateCache.d.ts.map

package/dist/templateCache.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"templateCache.d.ts","sourceRoot":"","sources":["../src/templateCache.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,OAAO,aAAa;IACjC,OAAO,CAAC,MAAM,CAAC,SAAS,CAA4B;IAEpD,MAAM,CAAC,eAAe,CAAE,aAAa,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,IAAI;IAQtE,MAAM,CAAC,WAAW,CAAE,aAAa,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;CAGvD"}

package/dist/templateCache.js

@@ -0,0 +1,14 @@
+export default class TemplateCache {
+    static templates = {};
+    static compileTemplate(componentName, template) {
+        const root = document.createElement("div");
+        root.innerHTML = template;
+        const compiled = root.firstElementChild;
+        TemplateCache.templates[componentName] = compiled;
+        return compiled.cloneNode(true);
+    }
+    static getTemplate(componentName) {
+        return TemplateCache.templates[componentName]?.cloneNode(true) || null;
+    }
+}
+//# sourceMappingURL=templateCache.js.map

package/dist/templateCache.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"templateCache.js","sourceRoot":"","sources":["../src/templateCache.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,OAAO,aAAa;IACzB,MAAM,CAAC,SAAS,GAAyB,EAAE,CAAC;IAEpD,MAAM,CAAC,eAAe,CAAE,aAAqB,EAAE,QAAgB;QAC9D,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC3C,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC;QAC1B,MAAM,QAAQ,GAAG,IAAI,CAAC,iBAAyB,CAAC;QAChD,aAAa,CAAC,SAAS,CAAC,aAAa,CAAC,GAAG,QAAQ,CAAC;QAClD,OAAO,QAAQ,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;IACjC,CAAC;IAED,MAAM,CAAC,WAAW,CAAE,aAAqB;QACxC,OAAO,aAAa,CAAC,SAAS,CAAC,aAAa,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC;IACxE,CAAC"}

package/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "@tripod311/splash",
+  "version": "0.0.0",
+  "description": "simple and flexible ui framework",
+  "keywords": [
+    "js",
+    "ts",
+    "ui",
+    "reactive"
+  ],
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "license": "ISC",
+  "author": "Tripod311 ind.tripo@gmail.com",
+  "type": "module",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "devDependencies": {
+    "@types/node": "^24.3.0",
+    "typescript": "^5.9.2"
+  }
+}