@fluixi/dom 1.0.0-alpha.53

package/dist/lib/dom/utils.mjs

@@ -0,0 +1 @@
+function m(e){return e.startsWith("aria-")||e.startsWith("data-")?e:/[A-Z]/.test(e)?e.replace(/([A-Z])/g,"-$1").toLowerCase():e}function g(e){return e.startsWith("@")||e.startsWith("on")&&e.length>2}function E(e){return e.startsWith("@")?e.slice(1):e.startsWith("on")?e.slice(2).toLowerCase():e}function b(e,t){let n=new Set(["checked","value","selected","disabled","readonly","required","multiple","open","contenteditable","draggable","spellcheck"]),r={input:new Set(["value","checked","indeterminate"]),textarea:new Set(["value"]),select:new Set(["value"]),option:new Set(["selected","value"]),audio:new Set(["volume","currentTime","paused"]),video:new Set(["volume","currentTime","paused"]),img:new Set(["src","srcset"]),iframe:new Set(["src"]),a:new Set(["href"])};return n.has(t)||r[e]&&r[e].has(t)}var x=new Set(["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"]),h=new Set(["svg","g","path","circle","rect","line","polyline","polygon","ellipse","text","tspan","use","defs","symbol","mask","clipPath","pattern","linearGradient","radialGradient","stop","filter","feGaussianBlur","feOffset","feMerge","feMergeNode","foreignObject"]),y="http://www.w3.org/2000/svg";function u(e){return e.localName.includes("-")}function w(e,t,n,r=!1){if(n==null){e.removeAttribute(t);return}if(u(e)){e[t]=n;return}c(e,t,n,r)}var T=new Set(["className","value","checked","selected","innerHTML","innerText","textContent","indeterminate","htmlFor"]);function a(e,t=document){return t.querySelector(e)}function v(e,t=document){return Array.from(t.querySelectorAll(e))}function S(e,t){return e.closest(t)}function A(e,...t){e.classList.add(...t)}function L(e,...t){e.classList.remove(...t)}function C(e,...t){t.forEach(n=>e.classList.toggle(n))}function N(e,t){return e.classList.contains(t)}function c(e,t,n,r=!1){if(n==null||n===!1){e.removeAttribute(t);return}if(n===!0){e.setAttribute(t,"");return}if(typeof n=="object"){e.setAttribute(t,JSON.stringify(n));return}e.setAttribute(t,String(n))}function M(e,t){return e.getAttribute(t)}function O(e,t){e.removeAttribute(t)}function f(e,t){Object.assign(e.style,t)}function I(e,t){return window.getComputedStyle(e).getPropertyValue(t)}function P(e,t={},...n){let r=document.createElement(e);return Object.entries(t).forEach(([o,i])=>{if(o==="class"||o==="className")r.className=i;else if(o==="style"&&typeof i=="object")f(r,i);else if(o.startsWith("on")&&typeof i=="function"){let s=o.slice(2).toLowerCase();r.addEventListener(s,i)}else c(r,o,i)}),n.forEach(o=>{typeof o=="string"?r.appendChild(document.createTextNode(o)):r.appendChild(o)}),r}function R(e){for(;e.firstChild;)e.removeChild(e.firstChild)}function H(e,...t){t.forEach(n=>{typeof n=="string"?e.appendChild(document.createTextNode(n)):e.appendChild(n)})}function V(e){let t=e.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=window.innerHeight&&t.right<=window.innerWidth}function j(e,t={behavior:"smooth",block:"nearest"}){e.scrollIntoView(t)}function G(e){let t=e.getBoundingClientRect();return{top:t.top+window.pageYOffset,left:t.left+window.pageXOffset}}function W(e,t,n,r){let o=i=>{let s=i.target.closest(n);s&&e.contains(s)&&r(i,s)};return e.addEventListener(t,o),()=>{e.removeEventListener(t,o)}}function $(e,t=5e3){return new Promise((n,r)=>{let o=a(e);if(o){n(o);return}let i=new MutationObserver(()=>{let l=a(e);l&&(i.disconnect(),clearTimeout(s),n(l))});i.observe(document.body,{childList:!0,subtree:!0});let s=setTimeout(()=>{i.disconnect(),r(new Error(`Element ${e} not found within ${t}ms`))},t)})}function q(e,t,n={}){let r=new IntersectionObserver(o=>{o.forEach(i=>{t(i.isIntersecting)})},n);return r.observe(e),()=>{r.disconnect()}}function D(e,t){let n=new ResizeObserver(r=>{r.forEach(t)});return n.observe(e),()=>{n.disconnect()}}var d=typeof Symbol=="function"&&Symbol.for?Symbol.for("react.element"):60103;function F(e){return typeof e=="object"&&e!==null&&e.$$typeof===d}function p(e){return e&&typeof e=="object"&&e.strings&&Array.isArray(e.strings)&&e.values&&Array.isArray(e.values)}function z(e){if(typeof e!="function")return!1;try{let t=e();return p(t)}catch{return!1}}function B(e){return typeof e=="object"&&e!==null&&(e.$$typeof==="template"||typeof e.type=="function")}function J(e){return e instanceof Node}function X(e,t,n="Fluixi"){typeof globalThis<"u"&&(typeof globalThis[n]>"u"&&(globalThis[n]={}),typeof globalThis[n][e]>"u"&&(globalThis[n][e]=t))}function K(e,t,n="Fluixi"){return typeof globalThis<"u"&&typeof globalThis[n]<"u"&&typeof globalThis[n][e]<"u"?globalThis[n][e]:t}export{T as JSX_PROPERTIES,h as SVG_ELEMENTS,y as SVG_NAMESPACE,x as VOID_ELEMENTS,A as addClass,H as appendChildren,w as applyElementProp,S as closest,P as createElement,W as delegate,M as getAttribute,K as getGlobal,E as getLitEventName,G as getOffset,I as getStyle,N as hasClass,u as isCustomElement,J as isDOMNode,g as isEventHandler,B as isJSXTemplate,p as isLitTemplateResult,F as isReactElement,z as isTemplateFactory,V as isVisible,q as observeIntersection,D as observeResize,a as query,v as queryAll,X as registerGlobal,O as removeAttribute,R as removeChildren,L as removeClass,j as scrollIntoView,c as setAttribute,f as setStyles,b as shouldSetAsProperty,m as toAttributeName,C as toggleClass,$ as waitForElement};

package/dist/lib/element/index.cjs

@@ -0,0 +1 @@
+"use strict";var r=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var j=Object.prototype.hasOwnProperty;var m=(p,e,s,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of f(e))!j.call(p,t)&&t!==s&&r(p,t,{get:()=>e[t],enumerable:!(o=y(e,t))||o.enumerable});return p};var x=p=>m(r({},"__esModule",{value:!0}),p);var a={};module.exports=x(a);

package/dist/lib/element/index.d.ts

@@ -0,0 +1,2 @@
+export type * from "./types.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/lib/element/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/element/index.ts"],"names":[],"mappings":"AAAA,mBAAmB,YAAY,CAAA"}

package/dist/lib/element/index.js

@@ -0,0 +1 @@
+export {};

package/dist/lib/element/types.cjs

@@ -0,0 +1 @@
+"use strict";var o=Object.defineProperty;var s=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var p=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of l(e))!d.call(t,n)&&n!==r&&o(t,n,{get:()=>e[n],enumerable:!(i=s(e,n))||i.enumerable});return t};var a=t=>p(o({},"__esModule",{value:!0}),t);var f={};module.exports=a(f);

package/dist/lib/element/types.d.ts

@@ -0,0 +1,129 @@
+/**
+ * @fileoverview Advanced types for @fluixi/element
+ * @module @fluixi/dom/element/types
+ */
+export type PropTypeConstructor = typeof String | typeof Number | typeof Boolean | typeof Object | typeof Array;
+export interface PropDefinition<T = unknown> {
+    type?: PropTypeConstructor;
+    default?: T;
+    attribute?: string | false;
+}
+/** Resolve the TS type from a PropDefinition's `type` constructor */
+export type InferPropType<D extends PropDefinition> = D extends PropDefinition<infer Def> ? D['type'] extends typeof String ? string : D['type'] extends typeof Number ? number : D['type'] extends typeof Boolean ? boolean : D['type'] extends typeof Array ? unknown[] : D['type'] extends typeof Object ? Record<string, unknown> : Def extends undefined ? unknown : Def : unknown;
+/** Signal tuple: [accessor, setter] — matches createSignal return */
+export type SignalTuple<T> = [
+    get: () => T,
+    set: (v: T | ((prev: T) => T)) => void
+];
+/** Map prop defs to signal tuples with correct types */
+export type PropsSignals<T extends Record<string, PropDefinition>> = {
+    [K in keyof T]: SignalTuple<InferPropType<T[K]>>;
+};
+/** Render function for defineElement — fully typed props and event context */
+export type ElementRenderFn<T extends Record<string, PropDefinition>, E extends Record<string, EventDefinition> = Record<string, EventDefinition>> = (props: PropsSignals<T>, ctx: ElementRenderContext<E>) => unknown;
+export interface EventDefinition<T = unknown> {
+    detail?: T;
+}
+/** Map event defs to typed onXxx handlers */
+export type ElementEventHandlers<E extends Record<string, EventDefinition>> = {
+    [K in keyof E as K extends string ? `on${Capitalize<K>}` : never]?: (event: CustomEvent<E[K] extends EventDefinition<infer D> ? D : unknown>) => void;
+};
+/** Context object passed as second argument to defineElement render callback */
+export interface ElementRenderContext<E extends Record<string, EventDefinition>> {
+    emit: <K extends string & keyof E>(name: K, ...args: E[K] extends EventDefinition<infer D> ? D extends undefined ? [] : [detail: D] : [detail?: unknown]) => void;
+}
+export interface ElementLifecycleCallbacks {
+    connectedCallback?: (host: HTMLElement) => void;
+    disconnectedCallback?: (host: HTMLElement) => void;
+    adoptedCallback?: (host: HTMLElement) => void;
+    formAssociatedCallback?: (host: HTMLElement, form: HTMLFormElement | null) => void;
+    formDisabledCallback?: (host: HTMLElement, disabled: boolean) => void;
+    formResetCallback?: (host: HTMLElement) => void;
+    formStateRestoreCallback?: (host: HTMLElement, state: unknown, mode: 'restore' | 'autocomplete') => void;
+    onAttributeChange?: (host: HTMLElement, name: string, oldVal: string | null, newVal: string | null) => void;
+}
+export interface DefineElementOptions<P extends Record<string, PropDefinition> = Record<string, PropDefinition>, E extends Record<string, EventDefinition> = Record<string, EventDefinition>> {
+    shadow?: 'open' | 'closed' | 'none';
+    styles?: string | CSSStyleSheet | (string | CSSStyleSheet)[];
+    props?: P;
+    events?: E;
+    formAssociated?: boolean;
+    lifecycle?: ElementLifecycleCallbacks;
+}
+/** Convert prop defs into the attribute interface for JSX / vanilla / lit */
+export type ElementAttributes<P extends Record<string, PropDefinition>> = {
+    [K in keyof P]?: InferPropType<P[K]> | (() => InferPropType<P[K]>);
+};
+/** HTMLElement with typed setProp/getProp */
+export interface TypedFluixiElement<P extends Record<string, PropDefinition>> extends HTMLElement {
+    setProp<K extends string & keyof P>(name: K, value: InferPropType<P[K]>): void;
+    getProp<K extends string & keyof P>(name: K): InferPropType<P[K]>;
+}
+/** Constructor type returned by defineElement — carries tag name + prop types + event types */
+export interface FluixiElementConstructor<Tag extends string = string, P extends Record<string, PropDefinition> = Record<string, PropDefinition>, E extends Record<string, EventDefinition> = Record<string, EventDefinition>> {
+    new (): TypedFluixiElement<P>;
+    observedAttributes: string[];
+    readonly prototype: TypedFluixiElement<P>;
+    readonly __tag: Tag;
+    readonly __props: P;
+    readonly __events: E;
+}
+/**
+ * Extract the JSX attributes interface from a FluixiElementConstructor.
+ * Use in `declare global { interface HTMLElementTagNameMap }`.
+ *
+ * @example
+ * ```ts
+ * const MyCounter = defineElement('my-counter', ..., { props: { name: { type: String } } });
+ * declare global {
+ *   interface HTMLElementTagNameMap {
+ *     'my-counter': FluixiElementInstance<typeof MyCounter>;
+ *   }
+ * }
+ * ```
+ */
+export type FluixiElementInstance<T> = T extends FluixiElementConstructor<any, infer P> ? TypedFluixiElement<P> : HTMLElement;
+/**
+ * Extract JSX-compatible attributes from a FluixiElementConstructor.
+ * For use in JSX IntrinsicElements augmentation.
+ *
+ * @example
+ * ```ts
+ * declare module '@fluixi/jsx/jsx' {
+ *   namespace JSX {
+ *     interface IntrinsicElements {
+ *       'my-counter': FluixiElementJSXAttributes<typeof MyCounter>;
+ *     }
+ *   }
+ * }
+ * ```
+ */
+export type FluixiElementJSXAttributes<T> = T extends FluixiElementConstructor<any, infer P, infer E> ? ElementAttributes<P> & ElementEventHandlers<E> & FluixiHTMLAttributes : FluixiHTMLAttributes;
+/** Base HTML attributes for custom elements in JSX */
+export interface FluixiHTMLAttributes {
+    id?: string;
+    class?: string;
+    className?: string;
+    style?: string | Record<string, string | number>;
+    slot?: string;
+    hidden?: boolean;
+    tabIndex?: number;
+    title?: string;
+    children?: unknown;
+    ref?: ((el: HTMLElement) => void) | {
+        current: HTMLElement | null;
+    };
+    [key: `on${string}`]: ((event: Event) => void) | undefined;
+    [key: `data-${string}`]: string | undefined;
+}
+/** Map to build HTML attribute keys from prop defs (uses attribute override or kebab-case) */
+export type PropToAttribute<P extends Record<string, PropDefinition>> = {
+    [K in keyof P as P[K] extends {
+        attribute: false;
+    } ? never : P[K] extends {
+        attribute: infer A extends string;
+    } ? A : K extends string ? CamelToKebab<K> : never]?: InferPropType<P[K]>;
+};
+/** CamelCase → kebab-case at the type level */
+export type CamelToKebab<S extends string> = S extends `${infer C}${infer Rest}` ? C extends Uppercase<C> ? `-${Lowercase<C>}${CamelToKebab<Rest>}` : `${C}${CamelToKebab<Rest>}` : S;
+//# sourceMappingURL=types.d.ts.map

package/dist/lib/element/types.d.ts.map

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

package/dist/lib/element/types.js

@@ -0,0 +1,5 @@
+/**
+ * @fileoverview Advanced types for @fluixi/element
+ * @module @fluixi/dom/element/types
+ */
+export {};

package/dist/lib/flow/class-map.cjs

@@ -0,0 +1 @@
+"use strict";var i=Object.defineProperty;var r=Object.getOwnPropertyDescriptor;var a=Object.getOwnPropertyNames;var l=Object.prototype.hasOwnProperty;var d=(n,o)=>{for(var e in o)i(n,e,{get:o[e],enumerable:!0})},u=(n,o,e,t)=>{if(o&&typeof o=="object"||typeof o=="function")for(let s of a(o))!l.call(n,s)&&s!==e&&i(n,s,{get:()=>o[s],enumerable:!(t=r(o,s))||t.enumerable});return n};var f=n=>u(i({},"__esModule",{value:!0}),n);var C={};d(C,{classMap:()=>p});module.exports=f(C);var c=require("@fluixi/reactive/signal");function p(n){return(0,c.createMemo)(()=>{let o=typeof n=="function"?n():n,e=[];for(let[t,s]of Object.entries(o)){if(!t)continue;(typeof s=="function"?s():s)&&e.push(t)}return e.join(" ")})}

package/dist/lib/flow/class-map.d.ts

@@ -0,0 +1,40 @@
+import { Accessor } from '@fluixi/reactive/signal';
+/**
+ * A single class condition — static boolean or a reactive function.
+ */
+export type ClassCondition = boolean | null | undefined | Accessor<boolean | null | undefined> | (() => boolean | null | undefined);
+/**
+ * The classMap argument.
+ * Can be a plain object (values may be reactive) or a function / signal
+ * that returns the entire object reactively.
+ */
+export type ClassMapInput = Record<string, ClassCondition> | Accessor<Record<string, ClassCondition>> | (() => Record<string, ClassCondition>);
+/**
+ * Framework-agnostic reactive class map.
+ *
+ * Returns a `createMemo` accessor that resolves to a space-separated
+ * class string.  The memo re-evaluates whenever any reactive dependency
+ * inside the map changes.
+ *
+ * Works in both JSX and lit-html without any renderer-specific code:
+ *  - JSX:      `<div class={classMap({ active: isActive })} />`
+ *  - lit-html: `class=${classMap({ active: isActive })}`
+ *
+ * For lit-html the `processValues` helper detects the memo (via `$SIGNAL`)
+ * and wraps it with `litrx` automatically.
+ *
+ * @example
+ * // Static
+ * classMap({ active: true, disabled: false })         // → "active"
+ *
+ * // Per-key reactive values
+ * classMap({ active: isActive, 'text-sm': () => size() === 'sm' })
+ *
+ * // Whole map reactive
+ * classMap(() => ({ active: isActive(), error: hasError() }))
+ *
+ * // Mixed — combine a static base class with reactive conditions
+ * classMap({ 'btn': true, 'btn-primary': isPrimary, 'btn-disabled': disabled })
+ */
+export declare function classMap(input: ClassMapInput): Accessor<string>;
+//# sourceMappingURL=class-map.d.ts.map

package/dist/lib/flow/class-map.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"class-map.d.ts","sourceRoot":"","sources":["../../../src/lib/flow/class-map.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAc,MAAM,yBAAyB,CAAC;AAE/D;;GAEG;AACH,MAAM,MAAM,cAAc,GACtB,OAAO,GACP,IAAI,GACJ,SAAS,GACT,QAAQ,CAAC,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC,GACpC,CAAC,MAAM,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;AAEvC;;;;GAIG;AACH,MAAM,MAAM,aAAa,GACrB,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,GAC9B,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC,GACxC,CAAC,MAAM,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC;AAE3C;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,GAAG,QAAQ,CAAC,MAAM,CAAC,CAkB/D"}

package/dist/lib/flow/class-map.js

@@ -0,0 +1,44 @@
+import { createMemo } from '@fluixi/reactive/signal';
+/**
+ * Framework-agnostic reactive class map.
+ *
+ * Returns a `createMemo` accessor that resolves to a space-separated
+ * class string.  The memo re-evaluates whenever any reactive dependency
+ * inside the map changes.
+ *
+ * Works in both JSX and lit-html without any renderer-specific code:
+ *  - JSX:      `<div class={classMap({ active: isActive })} />`
+ *  - lit-html: `class=${classMap({ active: isActive })}`
+ *
+ * For lit-html the `processValues` helper detects the memo (via `$SIGNAL`)
+ * and wraps it with `litrx` automatically.
+ *
+ * @example
+ * // Static
+ * classMap({ active: true, disabled: false })         // → "active"
+ *
+ * // Per-key reactive values
+ * classMap({ active: isActive, 'text-sm': () => size() === 'sm' })
+ *
+ * // Whole map reactive
+ * classMap(() => ({ active: isActive(), error: hasError() }))
+ *
+ * // Mixed — combine a static base class with reactive conditions
+ * classMap({ 'btn': true, 'btn-primary': isPrimary, 'btn-disabled': disabled })
+ */
+export function classMap(input) {
+    return createMemo(() => {
+        const map = typeof input === 'function'
+            ? input()
+            : input;
+        const classes = [];
+        for (const [cls, cond] of Object.entries(map)) {
+            if (!cls)
+                continue;
+            const active = typeof cond === 'function' ? cond() : cond;
+            if (active)
+                classes.push(cls);
+        }
+        return classes.join(' ');
+    });
+}

package/dist/lib/flow/class-map.mjs

@@ -0,0 +1 @@
+import{createMemo as i}from"@fluixi/reactive/signal";function l(n){return i(()=>{let t=typeof n=="function"?n():n,s=[];for(let[e,o]of Object.entries(t)){if(!e)continue;(typeof o=="function"?o():o)&&s.push(e)}return s.join(" ")})}export{l as classMap};

package/dist/lib/flow/dynamic.cjs

@@ -0,0 +1 @@
+"use strict";var s=Object.defineProperty;var a=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var p=Object.prototype.hasOwnProperty;var y=(n,r)=>{for(var o in r)s(n,o,{get:r[o],enumerable:!0})},u=(n,r,o,t)=>{if(r&&typeof r=="object"||typeof r=="function")for(let e of f(r))!p.call(n,e)&&e!==o&&s(n,e,{get:()=>r[e],enumerable:!(t=a(r,e))||t.enumerable});return n};var T=n=>u(s({},"__esModule",{value:!0}),n);var d={};y(d,{Dynamic:()=>l});module.exports=T(d);var i=require("@fluixi/reactive/signal");function c(n){return typeof n=="function"?n:(()=>n)}function l(n){let r=c(n.component),{component:o,...t}=n;return(0,i.createMemo)(()=>{let e=r();return e==null?null:typeof e=="string"?{tag:e,props:t}:e(t)})}

package/dist/lib/flow/dynamic.d.ts

@@ -0,0 +1,27 @@
+import { Accessor } from '@fluixi/reactive/signal';
+export interface DynamicProps<T extends Record<string, any> = Record<string, any>> {
+    /**
+     * A component function (or null/undefined) to render.
+     * Can be a reactive accessor that changes over time.
+     *
+     * JSX:    <Dynamic component={currentView()} {...props} />
+     * lit:    Dynamic({ component: currentView, ...props })
+     */
+    component: ((props: T) => any) | string | null | undefined | Accessor<((props: T) => any) | string | null | undefined>;
+    [key: string]: any;
+}
+/**
+ * Renders a component dynamically — mirrors SolidJS `<Dynamic>`.
+ *
+ * The `component` prop can be a reactive accessor.  When it changes,
+ * the old output is discarded and the new component is called.
+ * Returns a memo — works in both JSX and lit-html.
+ *
+ * @example JSX
+ * <Dynamic component={tab() === 'a' ? CompA : CompB} value={x()} />
+ *
+ * @example lit-html
+ * Dynamic({ component: () => tab() === 'a' ? CompA : CompB, value: x })
+ */
+export declare function Dynamic<T extends Record<string, any> = Record<string, any>>(props: DynamicProps<T>): Accessor<any>;
+//# sourceMappingURL=dynamic.d.ts.map

package/dist/lib/flow/dynamic.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dynamic.d.ts","sourceRoot":"","sources":["../../../src/lib/flow/dynamic.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAc,MAAM,yBAAyB,CAAC;AAG/D,MAAM,WAAW,YAAY,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IAC/E;;;;;;OAMG;IACH,SAAS,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,GAAG,CAAC,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,GAAG,QAAQ,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,GAAG,CAAC,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IACvH,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,OAAO,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EACzE,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,GACrB,QAAQ,CAAC,GAAG,CAAC,CAef"}

package/dist/lib/flow/dynamic.js

@@ -0,0 +1,30 @@
+import { createMemo } from '@fluixi/reactive/signal';
+import { normalizeAccessor } from './utils.js';
+/**
+ * Renders a component dynamically — mirrors SolidJS `<Dynamic>`.
+ *
+ * The `component` prop can be a reactive accessor.  When it changes,
+ * the old output is discarded and the new component is called.
+ * Returns a memo — works in both JSX and lit-html.
+ *
+ * @example JSX
+ * <Dynamic component={tab() === 'a' ? CompA : CompB} value={x()} />
+ *
+ * @example lit-html
+ * Dynamic({ component: () => tab() === 'a' ? CompA : CompB, value: x })
+ */
+export function Dynamic(props) {
+    const getComponent = normalizeAccessor(props.component);
+    // Spread all props except `component` to the resolved component.
+    const { component: _c, ...rest } = props;
+    return createMemo(() => {
+        const C = getComponent();
+        if (C == null)
+            return null;
+        if (typeof C === 'string') {
+            // Intrinsic element — return a descriptor that the runtime can handle.
+            return { tag: C, props: rest };
+        }
+        return C(rest);
+    });
+}

package/dist/lib/flow/dynamic.mjs

@@ -0,0 +1 @@
+import{createMemo as s}from"@fluixi/reactive/signal";function o(n){return typeof n=="function"?n:(()=>n)}function y(n){let t=o(n.component),{component:c,...e}=n;return s(()=>{let r=t();return r==null?null:typeof r=="string"?{tag:r,props:e}:r(e)})}export{y as Dynamic};

package/dist/lib/flow/error-boundary.cjs

@@ -0,0 +1 @@
+"use strict";var l=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var i=Object.prototype.hasOwnProperty;var y=(n,r)=>{for(var t in r)l(n,t,{get:r[t],enumerable:!0})},k=(n,r,t,c)=>{if(r&&typeof r=="object"||typeof r=="function")for(let e of u(r))!i.call(n,e)&&e!==t&&l(n,e,{get:()=>r[e],enumerable:!(c=f(r,e))||c.enumerable});return n};var d=n=>k(l({},"__esModule",{value:!0}),n);var h={};y(h,{ErrorBoundary:()=>b});module.exports=d(h);var a=require("@fluixi/reactive/signal");function b(n){let[r,t]=(0,a.createSignal)(null),c=()=>t(null);return(0,a.createMemo)(()=>{let e=r();if(e!==null)return typeof n.fallback=="function"?n.fallback(e,c):n.fallback;try{return typeof n.children=="function"?n.children():n.children}catch(o){return t(o),typeof n.fallback=="function"?n.fallback(o,c):n.fallback}})}

package/dist/lib/flow/error-boundary.d.ts

@@ -0,0 +1,34 @@
+import { Accessor } from '@fluixi/reactive/signal';
+export interface ErrorBoundaryProps {
+    /** Rendered when an error is caught. Receives the error as argument. */
+    fallback: any | ((err: unknown, reset: () => void) => any);
+    /** The children to try rendering. */
+    children: any;
+}
+/**
+ * Catches synchronous errors thrown during child rendering.
+ *
+ * When a child throws, renders `fallback` instead.  `fallback` can be a
+ * static value or a function `(err, reset) => UI` — calling `reset()` clears
+ * the error state and retries rendering the children.
+ *
+ * Returns a memo — works in both JSX and lit-html.
+ *
+ * Note: Only catches errors thrown synchronously during the render phase
+ * (memo evaluation).  Async errors inside effects are not caught here.
+ *
+ * @example JSX
+ * <ErrorBoundary fallback={(err, reset) => (
+ *   <div>Error: {String(err)} <button onClick={reset}>Retry</button></div>
+ * )}>
+ *   <RiskyComponent />
+ * </ErrorBoundary>
+ *
+ * @example lit-html
+ * ErrorBoundary({
+ *   fallback: (err, reset) => html`<button @click=${reset}>Retry</button>`,
+ *   children: html`${riskyContent}`,
+ * })
+ */
+export declare function ErrorBoundary(props: ErrorBoundaryProps): Accessor<any>;
+//# sourceMappingURL=error-boundary.d.ts.map

package/dist/lib/flow/error-boundary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"error-boundary.d.ts","sourceRoot":"","sources":["../../../src/lib/flow/error-boundary.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAmD,MAAM,yBAAyB,CAAC;AAEpG,MAAM,WAAW,kBAAkB;IACjC,wEAAwE;IACxE,QAAQ,EAAE,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,IAAI,KAAK,GAAG,CAAC,CAAC;IAC3D,qCAAqC;IACrC,QAAQ,EAAE,GAAG,CAAC;CACf;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,QAAQ,CAAC,GAAG,CAAC,CA0BtE"}

package/dist/lib/flow/error-boundary.js

@@ -0,0 +1,49 @@
+import { createMemo, createSignal } from '@fluixi/reactive/signal';
+/**
+ * Catches synchronous errors thrown during child rendering.
+ *
+ * When a child throws, renders `fallback` instead.  `fallback` can be a
+ * static value or a function `(err, reset) => UI` — calling `reset()` clears
+ * the error state and retries rendering the children.
+ *
+ * Returns a memo — works in both JSX and lit-html.
+ *
+ * Note: Only catches errors thrown synchronously during the render phase
+ * (memo evaluation).  Async errors inside effects are not caught here.
+ *
+ * @example JSX
+ * <ErrorBoundary fallback={(err, reset) => (
+ *   <div>Error: {String(err)} <button onClick={reset}>Retry</button></div>
+ * )}>
+ *   <RiskyComponent />
+ * </ErrorBoundary>
+ *
+ * @example lit-html
+ * ErrorBoundary({
+ *   fallback: (err, reset) => html`<button @click=${reset}>Retry</button>`,
+ *   children: html`${riskyContent}`,
+ * })
+ */
+export function ErrorBoundary(props) {
+    const [error, setError] = createSignal(null);
+    const reset = () => setError(null);
+    return createMemo(() => {
+        const err = error();
+        if (err !== null) {
+            return typeof props.fallback === 'function'
+                ? props.fallback(err, reset)
+                : props.fallback;
+        }
+        try {
+            const content = typeof props.children === 'function' ? props.children() : props.children;
+            return content;
+        }
+        catch (e) {
+            // Caught a synchronous render error — switch to fallback.
+            setError(e);
+            return typeof props.fallback === 'function'
+                ? props.fallback(e, reset)
+                : props.fallback;
+        }
+    });
+}

package/dist/lib/flow/error-boundary.mjs

@@ -0,0 +1 @@
+import{createMemo as o,createSignal as l}from"@fluixi/reactive/signal";function k(n){let[a,e]=l(null),t=()=>e(null);return o(()=>{let c=a();if(c!==null)return typeof n.fallback=="function"?n.fallback(c,t):n.fallback;try{return typeof n.children=="function"?n.children():n.children}catch(r){return e(r),typeof n.fallback=="function"?n.fallback(r,t):n.fallback}})}export{k as ErrorBoundary};

package/dist/lib/flow/for.cjs

@@ -0,0 +1 @@
+"use strict";var u=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var T=Object.getOwnPropertyNames;var A=Object.prototype.hasOwnProperty;var x=(r,e)=>{for(var t in e)u(r,t,{get:e[t],enumerable:!0})},v=(r,e,t,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of T(e))!A.call(r,n)&&n!==t&&u(r,n,{get:()=>e[n],enumerable:!(a=f(e,n))||a.enumerable});return r};var U=r=>v(u({},"__esModule",{value:!0}),r);var b={};x(b,{For:()=>m});module.exports=U(b);var i=require("@fluixi/reactive/signal");function p(r){return()=>{let e=r();return typeof e=="function"?e():e}}var c={active:!1,cursor:null,parents:[]};function h(r){let e=c.parents.lastIndexOf(r);e!==-1&&(c.parents.length=e),c.cursor=r.nextSibling}function d(r){if(!c.active||r==null)return;let e=Array.isArray(r)?r[r.length-1]:r;e&&typeof e.nodeType=="number"&&h(e)}function m(r){let e=p(()=>r.each),t=()=>r.fallback??null,a=(n,o)=>{let s=r.children,y=Array.isArray(s)?s.map(l=>typeof l=="function"?l(n,o):l):typeof s=="function"?s(n,o):s;return d(y),y};return r.by?(0,i.keyArray)(e,r.by,(n,o)=>a(n,o),{fallback:t}):(0,i.mapArray)(e,(n,o)=>a(n,o),{fallback:t})}

package/dist/lib/flow/for.d.ts

@@ -0,0 +1,64 @@
+import { Accessor } from '@fluixi/reactive/signal';
+type EachSource<T> = ReadonlyArray<T> | (() => ReadonlyArray<T> | null | undefined) | Accessor<ReadonlyArray<T>> | null | undefined | false;
+/** Props when `by` is NOT provided — item is the plain value `T`. */
+export interface ForPropsUnkeyed<T, U = any> {
+    /** Reactive array to iterate over — static, readonly, accessor, or signal. */
+    each: EachSource<T>;
+    /** Rendered when the array is empty or nullish. */
+    fallback?: any;
+    /**
+     * Render function called once per unique item (keyed by object reference).
+     *
+     * @example
+     * <For each={rows}>{(row, idx) => <tr>...</tr>}</For>
+     */
+    children: (item: T, index: Accessor<number>) => U;
+    by?: undefined;
+}
+/** Props when `by` IS provided — item is a reactive `Accessor<T>`. */
+export interface ForPropsKeyed<T, U = any> {
+    /** Reactive array to iterate over — static, readonly, accessor, or signal. */
+    each: EachSource<T>;
+    /** Rendered when the array is empty or nullish. */
+    fallback?: any;
+    /**
+     * Render function called once per unique key.
+     * `item` is a reactive accessor — call `item()` inside to read the current value.
+     * The same DOM is reused whenever `by(item)` returns the same key, even if the
+     * object reference changes.
+     *
+     * @example
+     * <For each={rows} by={r => r.id}>{(row, idx) => <tr>{row().name}</tr>}</For>
+     */
+    children: (item: Accessor<T>, index: Accessor<number>) => U;
+    /**
+     * Key function for stable DOM reuse across reference changes.
+     * When provided, `item` in the render function is an `Accessor<T>`.
+     */
+    by: (item: T) => any;
+}
+export type ForProps<T, U = any> = ForPropsUnkeyed<T, U> | ForPropsKeyed<T, U>;
+/**
+ * Keyed list rendering — mirrors SolidJS `<For>`.
+ *
+ * Default: keyed by object reference. Same object at new index → only index
+ * signal updates (no DOM re-render). Removed items are disposed.
+ *
+ * With `by`: keyed by the return value of `by(item)`. When the same key is
+ * found in the previous render, the DOM entry is reused and the index signal
+ * is updated. The item accessor is a live `createMemo(() => list[idx()])` so
+ * that reading `item().someField` inside a reactive context creates a
+ * fine-grained dependency on the store proxy property — not a frozen snapshot.
+ *
+ * @example Reference-keyed (default)
+ * <For each={items}>{(item, idx) => <li>{item.name}</li>}</For>
+ *
+ * @example Stable-key (by prop) — survives object recreation
+ * <For each={rows} by={r => r.id}>
+ *   {(row, idx) => <tr><td>{() => row().name}</td></tr>}
+ * </For>
+ */
+export declare function For<T, U>(props: ForPropsKeyed<T, U>): Accessor<U[]>;
+export declare function For<T, U>(props: ForPropsUnkeyed<T, U>): Accessor<U[]>;
+export {};
+//# sourceMappingURL=for.d.ts.map

package/dist/lib/flow/for.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"for.d.ts","sourceRoot":"","sources":["../../../src/lib/flow/for.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAsB,MAAM,yBAAyB,CAAC;AAIvE,KAAK,UAAU,CAAC,CAAC,IACb,aAAa,CAAC,CAAC,CAAC,GAChB,CAAC,MAAM,aAAa,CAAC,CAAC,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC,GAC3C,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,GAC1B,IAAI,GACJ,SAAS,GACT,KAAK,CAAC;AAEV,qEAAqE;AACrE,MAAM,WAAW,eAAe,CAAC,CAAC,EAAE,CAAC,GAAG,GAAG;IACzC,8EAA8E;IAC9E,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC;IACpB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf;;;;;OAKG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAClD,EAAE,CAAC,EAAE,SAAS,CAAC;CAChB;AAED,sEAAsE;AACtE,MAAM,WAAW,aAAa,CAAC,CAAC,EAAE,CAAC,GAAG,GAAG;IACvC,8EAA8E;IAC9E,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC;IACpB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf;;;;;;;;OAQG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAC5D;;;OAGG;IACH,EAAE,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,GAAG,CAAC;CACtB;AAED,MAAM,MAAM,QAAQ,CAAC,CAAC,EAAE,CAAC,GAAG,GAAG,IAAI,eAAe,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AAE/E;;;;;;;;;;;;;;;;;;;GAmBG;AAGH,wBAAgB,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC;AACrE,wBAAgB,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,eAAe,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC"}

package/dist/lib/flow/for.js

@@ -0,0 +1,28 @@
+import { mapArray, keyArray } from '@fluixi/reactive/signal';
+import { resolveReactiveProp } from './utils.js';
+import { hydrateAdvancePast } from '../dom/hydration-state.js';
+export function For(props) {
+    // Read `each` lazily through the prop getter so `each={items()}` re-runs inside
+    // mapArray's tracking memo (fine-grained keyed diffing), while `each={items}` still
+    // works — resolveReactiveProp unwraps the accessor form once.
+    const each = resolveReactiveProp(() => props.each);
+    const fallback = () => props.fallback ?? null;
+    // Render the children (a fn, or an array of fn/values) for one item, then
+    // ascend the hydration cursor past what was placed.
+    const render = (item, index) => {
+        const children = props.children;
+        const rendered = (Array.isArray(children)
+            ? children.map((c) => (typeof c === 'function' ? c(item, index) : c))
+            : typeof children === 'function'
+                ? children(item, index)
+                : children);
+        hydrateAdvancePast(rendered);
+        return rendered;
+    };
+    // `by` → key-function reconciliation (item is a live accessor); default →
+    // reference reconciliation (item is the plain value). Both keep each item in
+    // its own root so list items stay owner-stable.
+    return props.by
+        ? keyArray(each, props.by, (item, index) => render(item, index), { fallback })
+        : mapArray(each, (item, index) => render(item, index), { fallback });
+}

package/dist/lib/flow/for.mjs

@@ -0,0 +1 @@
+import{mapArray as d,keyArray as f}from"@fluixi/reactive/signal";function u(r){return()=>{let e=r();return typeof e=="function"?e():e}}var a={active:!1,cursor:null,parents:[]};function p(r){let e=a.parents.lastIndexOf(r);e!==-1&&(a.parents.length=e),a.cursor=r.nextSibling}function y(r){if(!a.active||r==null)return;let e=Array.isArray(r)?r[r.length-1]:r;e&&typeof e.nodeType=="number"&&p(e)}function m(r){let e=u(()=>r.each),c=()=>r.fallback??null,i=(n,t)=>{let o=r.children,l=Array.isArray(o)?o.map(s=>typeof s=="function"?s(n,t):s):typeof o=="function"?o(n,t):o;return y(l),l};return r.by?f(e,r.by,(n,t)=>i(n,t),{fallback:c}):d(e,(n,t)=>i(n,t),{fallback:c})}export{m as For};

package/dist/lib/flow/index-flow.cjs

@@ -0,0 +1 @@
+"use strict";var s=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var p=Object.prototype.hasOwnProperty;var d=(r,e)=>{for(var n in e)s(r,n,{get:e[n],enumerable:!0})},y=(r,e,n,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of f(e))!p.call(r,t)&&t!==n&&s(r,t,{get:()=>e[t],enumerable:!(o=u(e,t))||o.enumerable});return r};var T=r=>y(s({},"__esModule",{value:!0}),r);var A={};d(A,{Index:()=>v});module.exports=T(A);var l=require("@fluixi/reactive/signal");function i(r){return()=>{let e=r();return typeof e=="function"?e():e}}var a={active:!1,cursor:null,parents:[]};function x(r){let e=a.parents.lastIndexOf(r);e!==-1&&(a.parents.length=e),a.cursor=r.nextSibling}function c(r){if(!a.active||r==null)return;let e=Array.isArray(r)?r[r.length-1]:r;e&&typeof e.nodeType=="number"&&x(e)}function v(r){let e=i(()=>r.each);return(0,l.indexArray)(e,(n,o)=>{let t=r.children(n,o);return c(t),t},{fallback:()=>r.fallback??null})}

package/dist/lib/flow/index-flow.d.ts

@@ -0,0 +1,34 @@
+import { Accessor } from '@fluixi/reactive/signal';
+export interface IndexProps<T, U = any> {
+    /** Reactive array to iterate over. */
+    each: T[] | Accessor<T[]> | null | undefined;
+    /** Rendered when the array is empty or nullish. */
+    fallback?: any;
+    /**
+     * Render function called once per stable index slot.
+     * `item` is a reactive accessor — updates when the item at that index changes.
+     * `index` is a plain number (stable).
+     *
+     * JSX:    <Index each={items()}>{(item, index) => <li>{item().name}</li>}</Index>
+     * lit:    Index({ each: items, children: (item, index) => html`<li>${item().name}</li>` })
+     */
+    children: (item: Accessor<T>, index: number) => U;
+}
+/**
+ * Non-keyed list rendering — mirrors SolidJS `<Index>`.
+ *
+ * Keyed by position. When the list grows, new slots are created.
+ * When it shrinks, trailing slots are disposed. When an item at a
+ * given index changes value, only the `item` signal updates (no re-render).
+ * Returns a memo of the rendered array — works in both JSX and lit-html.
+ *
+ * @example JSX
+ * <Index each={items()} fallback={<p>Empty</p>}>
+ *   {(item, index) => <li>{index} — {item().name}</li>}
+ * </Index>
+ *
+ * @example lit-html
+ * Index({ each: items, children: (item, i) => html`<li>${i} — ${item().name}</li>` })
+ */
+export declare function Index<T, U = any>(props: IndexProps<T, U>): Accessor<U[] | any>;
+//# sourceMappingURL=index-flow.d.ts.map

package/dist/lib/flow/index-flow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-flow.d.ts","sourceRoot":"","sources":["../../../src/lib/flow/index-flow.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAc,MAAM,yBAAyB,CAAC;AAI/D,MAAM,WAAW,UAAU,CAAC,CAAC,EAAE,CAAC,GAAG,GAAG;IACpC,sCAAsC;IACtC,IAAI,EAAE,CAAC,EAAE,GAAG,QAAQ,CAAC,CAAC,EAAE,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC;IAC7C,mDAAmD;IACnD,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf;;;;;;;OAOG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,CAAC,CAAC;CACnD;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,GAAG,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,QAAQ,CAAC,CAAC,EAAE,GAAG,GAAG,CAAC,CAW9E"}