@neuralfog/elemix 0.4.0 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (37) hide show
  1. package/README.md +0 -15
  2. package/dist/decorators.js +1 -1
  3. package/dist/index.js +1 -1
  4. package/dist/render-GbmCSARc.js +1 -0
  5. package/dist/render.js +1 -1
  6. package/dist/signal.js +1 -1
  7. package/dist/src/renderer/types.d.ts +1 -3
  8. package/dist/src/renderer/utils.d.ts +10 -1
  9. package/dist/src/testing/html.d.ts +1 -0
  10. package/dist/src/testing/mocks/MockCSSStyleSheet.d.ts +15 -0
  11. package/dist/src/testing/present.d.ts +8 -0
  12. package/dist/src/testing/shadowRoot.d.ts +3 -0
  13. package/dist/src/testing/types.d.ts +2 -0
  14. package/dist/test/bundle.test.d.ts +1 -0
  15. package/dist/test/component.test.d.ts +1 -0
  16. package/dist/test/decorator-edge.test.d.ts +1 -0
  17. package/dist/test/fixtures/DecoratorEdge.d.ts +14 -0
  18. package/dist/test/fixtures/StyledHost.d.ts +14 -0
  19. package/dist/test/fixtures/renderer/SelfClosing.d.ts +26 -0
  20. package/dist/test/reactive-collections.test.d.ts +1 -0
  21. package/dist/test/renderer/self-closing.test.d.ts +1 -0
  22. package/dist/test/testing-mocks.test.d.ts +1 -0
  23. package/dist/test/testing-shadow-root.test.d.ts +1 -0
  24. package/dist/test/utilities.test.d.ts +1 -0
  25. package/dist/testing/index.d.ts +3 -0
  26. package/dist/testing/index.js +1 -0
  27. package/dist/testing/mocks.d.ts +1 -0
  28. package/dist/testing/mocks.js +1 -0
  29. package/dist/testing/snapshots.d.ts +1 -0
  30. package/dist/testing/snapshots.js +3 -0
  31. package/dist/{types-B6SjOQPJ.js → types-CoiQASBn.js} +1 -1
  32. package/dist/utilities.js +1 -1
  33. package/dist/utils-C1MFaM_r.js +1 -0
  34. package/package.json +22 -3
  35. package/dist/render-BC66dqY-.js +0 -1
  36. package/dist/utils-Bfw6tf_Y.js +0 -1
  37. /package/dist/test/{renderer/event-bindings.test.d.ts → branch-coverage.test.d.ts} +0 -0
package/README.md CHANGED
@@ -369,18 +369,3 @@ html`<div .class=${'active highlight'}>String</div>`;
369
369
  html`<div .class=${{ active: isActive, disabled: isDisabled }}>Object</div>`;
370
370
  ```
371
371
 
372
- ## Bind Attributes
373
-
374
- Use `.bind-attrs` to dynamically set multiple attributes from an object.
375
-
376
- ```typescript
377
- html`<div .bind-attrs=${{ 'data-id': '123', 'aria-label': 'Card' }}>Content</div>`;
378
- ```
379
-
380
- ## Bind Events
381
-
382
- Use `.bind-events` to dynamically attach multiple event handlers from an object.
383
-
384
- ```typescript
385
- html`<div .bind-events=${{ click: onClick, input: onInput }}>Content</div>`;
386
- ```
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./types-B6SjOQPJ.js"),t=require("./utilities-COO_YT_a.js");var n=(e,t)=>{customElements.get(e)===void 0&&customElements.define(e,t)},r=e=>r=>{let i=t.t(r.name);r.$styles=e?.styles||[],n(i,r)},i=t=>(n,r)=>{n.stateProperties||=new Map,n.stateProperties.has(r)||n.stateProperties.set(r,t||e.t.LOCAL_STATE)};exports.component=r,exports.state=i;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./types-CoiQASBn.js"),t=require("./utilities-COO_YT_a.js");var n=(e,t)=>{customElements.get(e)===void 0&&customElements.define(e,t)},r=e=>r=>{let i=t.t(r.name);r.$styles=e?.styles||[],n(i,r)},i=t=>(n,r)=>{n.stateProperties||=new Map,n.stateProperties.has(r)||n.stateProperties.set(r,t||e.t.LOCAL_STATE)};exports.component=r,exports.state=i;
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./render-BC66dqY-.js"),t=require("./types-B6SjOQPJ.js"),n=require("./renderers-BBOJdSjj.js"),r=require("./Reactive-CQV_s8zX.js"),i=require("./App-tMVVu8H5.js");var a=class{component;locked=!1;scheduledRenderTriggers=new Set;constructor(e){this.component=e}schedule(e,t=!1){let r=n.n.active;n.n.active=null;let i;try{i=this.component.template()}finally{n.n.active=r}i&&(e&&this.scheduledRenderTriggers.add(e),this.locked||(this.locked=!0,n.t.add(this),setTimeout(()=>{this.render(Array.from(this.scheduledRenderTriggers)),this.scheduledRenderTriggers.clear(),this.locked=!1,n.t.delete(this),t&&(this.component.onMount(),this.component.removeAttribute(`data-cloak`))},0)))}render(t){for(let e of this.component.tracked)e.unsubscribe(this.component);this.component.tracked.clear();let r=n.n.active;n.n.active=this.component;try{e.n(this.component.template(),this.component.root)}finally{n.n.active=r}this.component.onRender(t)}},o=class{component;constructor(e){this.component=e}initialize(){let e=this.component.constructor.prototype.stateProperties;if(e)for(let[t,n]of e){let e=this.component;e[t]=new r.t(e[t],n).subscribe(this.component).value}}},s=class{component;data={};constructor(e){this.component=e}initialize(){this.data=new r.t(this.data,t.t.PROPS).subscribe(this.component).value}setReactive(e,t){this.data[e]=t}set(e,t){if(typeof t==`object`&&t){this.setReactive(e,t);return}let n=this.data[e];if(typeof t==`function`){this.data[e]||this.setReactive(e,t);return}n!==t&&this.setReactive(e,t)}},c=class{component;styles;constructor(e){this.component=e,this.styles=this.component.constructor.$styles}initialize(){if(this.component.shadowRoot&&this.styles.length){let e=new CSSStyleSheet;e.replaceSync(this.styles.join(` `));let t=i.t.config.baseStyles||[];this.component.shadowRoot.adoptedStyleSheets=[...t,e,...this.component.controlStyles]}}},l=class extends HTMLElement{$props=new s(this);$renderer=new a(this);$localState=new o(this);$styles=new c(this);$controlStyles;tracked=new Set;get root(){return this.shadowRoot}get props(){return this.$props.data}get styles(){return this.$styles}get controlStyles(){return this.$controlStyles||[]}constructor(){super(),this.attachShadow({mode:`open`}),this.setAttribute(`data-cloak`,``)}connectedCallback(){this.beforeMount(),this.$styles.initialize(),this.$props.initialize(),this.$localState.initialize(),this.render(t.t.ON_MOUNT,!0)}disconnectedCallback(){n.t.delete(this.$renderer),this.unsubscribeFromSignals(),this.onDispose()}template(){}onRender(e){}beforeMount(){}onMount(){}onDispose(){}render(e,t=!1){this.$renderer.schedule(e,t)}setControlStyles(e){this.$controlStyles=e}unsubscribeFromSignals(){for(let e of this.tracked)e.unsubscribe(this);this.tracked.clear()}hasSlot(e){return Array.from(this.children).some(t=>t.getAttribute(`slot`)===e)}};exports.Component=l,exports.RenderTrigger=t.t,exports.html=t.n;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./render-GbmCSARc.js"),t=require("./types-CoiQASBn.js"),n=require("./renderers-BBOJdSjj.js"),r=require("./Reactive-CQV_s8zX.js"),i=require("./App-tMVVu8H5.js");var a=class{component;locked=!1;scheduledRenderTriggers=new Set;constructor(e){this.component=e}schedule(e,t=!1){let r=n.n.active;n.n.active=null;let i;try{i=this.component.template()}finally{n.n.active=r}i&&(e&&this.scheduledRenderTriggers.add(e),this.locked||(this.locked=!0,n.t.add(this),setTimeout(()=>{this.render(Array.from(this.scheduledRenderTriggers)),this.scheduledRenderTriggers.clear(),this.locked=!1,n.t.delete(this),t&&(this.component.onMount(),this.component.removeAttribute(`data-cloak`))},0)))}render(t){for(let e of this.component.tracked)e.unsubscribe(this.component);this.component.tracked.clear();let r=n.n.active;n.n.active=this.component;try{e.n(this.component.template(),this.component.root)}finally{n.n.active=r}this.component.onRender(t)}},o=class{component;constructor(e){this.component=e}initialize(){let e=this.component.constructor.prototype.stateProperties;if(e)for(let[t,n]of e){let e=this.component;e[t]=new r.t(e[t],n).subscribe(this.component).value}}},s=class{component;data={};constructor(e){this.component=e}initialize(){this.data=new r.t(this.data,t.t.PROPS).subscribe(this.component).value}setReactive(e,t){this.data[e]=t}set(e,t){if(typeof t==`object`&&t){this.setReactive(e,t);return}let n=this.data[e];if(typeof t==`function`){this.data[e]||this.setReactive(e,t);return}n!==t&&this.setReactive(e,t)}},c=class{component;styles;constructor(e){this.component=e,this.styles=this.component.constructor.$styles}initialize(){if(this.component.shadowRoot&&this.styles.length){let e=new CSSStyleSheet;e.replaceSync(this.styles.join(` `));let t=i.t.config.baseStyles||[];this.component.shadowRoot.adoptedStyleSheets=[...t,e,...this.component.controlStyles]}}},l=class extends HTMLElement{$props=new s(this);$renderer=new a(this);$localState=new o(this);$styles=new c(this);$controlStyles;tracked=new Set;get root(){return this.shadowRoot}get props(){return this.$props.data}get styles(){return this.$styles}get controlStyles(){return this.$controlStyles||[]}constructor(){super(),this.attachShadow({mode:`open`}),this.setAttribute(`data-cloak`,``)}connectedCallback(){this.beforeMount(),this.$styles.initialize(),this.$props.initialize(),this.$localState.initialize(),this.render(t.t.ON_MOUNT,!0)}disconnectedCallback(){n.t.delete(this.$renderer),this.unsubscribeFromSignals(),this.onDispose()}template(){}onRender(e){}beforeMount(){}onMount(){}onDispose(){}render(e,t=!1){this.$renderer.schedule(e,t)}setControlStyles(e){this.$controlStyles=e}unsubscribeFromSignals(){for(let e of this.tracked)e.unsubscribe(this);this.tracked.clear()}hasSlot(e){return Array.from(this.children).some(t=>t.getAttribute(`slot`)===e)}};exports.Component=l,exports.RenderTrigger=t.t,exports.html=t.n;
@@ -0,0 +1 @@
1
+ const e=require("./utils-C1MFaM_r.js");var t={deletes:[],inserts:[],moves:[]},n=(e,n)=>{let i=e.length,a=n.length;if(i===a){let r=!0;for(let t=0;t<i;t++)if(e[t].key!==n[t].key){r=!1;break}if(r)return t}let o=Object.create(null);for(let t=0;t<i;t++)o[e[t].key]=t;let s=new Int32Array(a),c=[],l=[],u=Object.create(null);for(let e=0;e<a;e++){let t=n[e].key;u[t]=!0;let r=o[t];r===void 0?s[e]=-1:(s[e]=r,c.push(r),l.push(e))}let d=r(c),f=new Uint8Array(a);for(let e=0;e<d.length;e++)f[l[d[e]]]=1;let p=[],m=[],h=[];for(let t=0;t<i;t++)u[e[t].key]!==!0&&p.push({key:e[t].key});for(let e=0;e<a;e++){let t=e+1<a?n[e+1].key:void 0;s[e]===-1?m.push({key:n[e].key,value:n[e],beforeKey:t}):f[e]||h.push({key:n[e].key,beforeKey:t})}return{deletes:p,inserts:m,moves:h}},r=e=>{let t=e.length;if(t===0)return[];let n=new Int32Array(t),r=new Int32Array(t),i=0;for(let a=0;a<t;a++){let t=0,o=i;for(;t<o;){let n=t+o>>>1;e[r[n]]<e[a]?t=n+1:o=n}r[t]=a,t===i&&i++,n[a]=t>0?r[t-1]:-1}let a=Array(i),o=r[i-1];for(let e=i-1;e>=0;e--)a[e]=o,o=n[o];return a},i=e=>typeof e==`object`&&!!e&&`strings`in e&&`values`in e,a=/(\S+)(?==(?:["']?)$)/,o=(t,n)=>{let r=t.match(a);if(!r)return;let i=r[1],o={index:n,name:i,value:e.i(n),virtual:!1,type:e.o.STD},s=i[0];return s===`@`?(o.virtual=!0,o.type=e.o.EVENT):s===`:`?(o.virtual=!0,o.type=i.endsWith(`:ref`)?e.o.REF:e.o.PROP):s===`~`&&i.startsWith(`~model`)?(o.virtual=!0,o.type=e.o.MODEL):s===`.`&&i.startsWith(`.class`)&&(o.virtual=!0,o.type=e.o.DIRECT_CLASS),o},s=new Map,c=e=>{let t=s.get(e);if(t)return t;let n=``;for(let t=0;t<e.length;t++){let r=e[t],i=r.charCodeAt(0);n+=i>=48&&i<=57||i>=65&&i<=90||i>=97&&i<=122||r===`-`||r===`_`?r:`\\${r}`}return s.set(e,n),n},l=(e,t,n)=>{for(let r=0,i=t.length;r<i;r++){let i=t[r],a=e.querySelector(`[${c(i.name)}='${i.value}']`);a&&(i.virtual&&a.removeAttribute(i.name),n.set(i.index,S[i.type](a,i)))}},u=e=>Array.isArray(e)?`list`:i(e)?`template`:`string`,d=(e,t,n)=>e===`list`?h(t,n):e===`template`?m(t,n):p(t),f=(e,t,n)=>{let r,i;return e=>{let a=u(e);i&&i!==a&&(r?.dispose(),r=void 0),r||(r=d(a,t,n),i=a),r.update(e)}},p=e=>{let t=document.createTextNode(``);return e.before(t),{update:e=>{let n=e==null?``:String(e);t.textContent!==n&&(t.textContent=n)},dispose:()=>{t.remove()}}},m=(e,t)=>{let n,r,i=[],a=()=>{for(let e=0;e<i.length;e++)i[e].remove();i=[]};return{update:o=>{let s=o;n!==s.strings&&(r=void 0,a()),r||(r=t(s),n=s.strings,i=r.mountBefore(e,s.values)),r.update(s.values)},dispose:a}},h=(e,t)=>{let r=new Map,i=new Map,a=[],o=(n,a)=>{if(!n.key)throw Error(`use repeat directive when rendering the lists`);let o=r.get(n.key);if(!o){o=t(n),r.set(n.key,o);let s=a||e,c=o.mountBefore(s,n.values);c.length&&i.set(n.key,c[c.length-1])}return o},s=()=>{for(let[,e]of i)e.remove();r.clear(),i.clear()},c=e=>{for(let t=0;t<e.length;t++)o(e[t]).update(e[t].values)};return{update:t=>{let l=t;if(!a.length){c(l),a=l;return}if(!l.length){s(),a=l;return}let{deletes:u,inserts:d,moves:f}=n(a,l);if(u.length===l.length||d.length===l.length){s(),c(l),a=l;return}for(let e=u.length-1;e>=0;e--){let t=u[e].key;i.get(t)?.remove(),i.delete(t),r.delete(t)}for(let t=f.length-1;t>=0;t--){let n=i.get(f[t].key),r=i.get(f[t].beforeKey);n&&r?r.before(n):n&&e.before(n)}for(let e=d.length-1;e>=0;e--){let t=i.get(d[e].beforeKey);o(d[e].value,t)}for(let e=0;e<l.length;e++)r.get(l[e].key)?.update(l[e].values);a=l},dispose:()=>{s(),a=[]}}},g=(e,t)=>{let n,{name:r}=t;return t=>{if(t===void 0)return;let i=String(t);n!==i&&(n=i,e.setAttribute(r,i))}},_=(e,t)=>{let n,r=`on${t.name.slice(1)}`;return t=>{t===void 0||n===t||(n=t,e[r]=t)}},v=(e,t)=>{let n=t.name.slice(1);return t=>{let r=e;r.$props&&r.$props.set(n,t)}},y=e=>t=>{if(t===void 0)return;let n=t,r=e;r.value!==n.value&&(r.value=n.value),e.oninput||=e=>{n.value=e.target.value}},b=e=>t=>{t!==void 0&&(t.value=e)},x=t=>{let n=t.getAttribute(`class`)||``,r;return i=>{if(i==null){n.length&&r!==n&&(r=n,t.setAttribute(`class`,n));return}if(typeof i==`string`){let a=e.a(n,i);r!==a&&(r=a,t.setAttribute(`class`,a));return}if(typeof i==`object`){let a=``;for(let[e,t]of Object.entries(i))t&&(a.length&&(a+=` `),a+=e);let o=e.a(n,a);r!==o&&(r=o,t.setAttribute(`class`,o))}}},S={[e.o.STD]:g,[e.o.EVENT]:_,[e.o.PROP]:v,[e.o.MODEL]:e=>y(e),[e.o.REF]:e=>b(e),[e.o.DIRECT_CLASS]:e=>x(e)},C=t=>{let n=new Map,r=[],i,a=``,{strings:s}=t;for(let t=0,n=s.length;t<n;t++)if(a+=s[t],t<n-1){let n=o(s[t],t);n&&r.push(n),a+=e.i(t)}a=e.n(e.t(a));let c=()=>(i||(i=document.createElement(`template`),i.innerHTML=a),i.content.cloneNode(!0)),u=(t,i)=>{let a=document.createTreeWalker(t,NodeFilter.SHOW_COMMENT,null);for(;a.nextNode();){let{nodeValue:t}=a.currentNode;if(t?.startsWith(`₥`)){let r=e.r(t);n.set(r,f(i[r],a.currentNode,C))}}l(t,r,n)};return{mount:(e,t)=>{let n=c();u(n,t),e.appendChild(n)},mountBefore:(e,t)=>{let n=c();u(n,t);let r=Array.from(n.childNodes);return e.before(n),r},update:e=>{for(let[t,r]of n)r(e[t])}}},w=(e,...t)=>({strings:e,values:t,key:``}),T=Symbol(),E=(e,t)=>{if(!t)throw Error(`render method needs to accept instance of HTMLElement`);let n=t;n[T]||(n[T]=new Map);let r=n[T],i=r.get(e.strings);i||(i=C(e),r.set(e.strings,i),i.mount(t,e.values)),i.update(e.values)};Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return E}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return w}});
package/dist/render.js CHANGED
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./render-BC66dqY-.js");exports.html=e.t,exports.render=e.n;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./render-GbmCSARc.js");exports.html=e.t,exports.render=e.n;
package/dist/signal.js CHANGED
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./types-B6SjOQPJ.js"),t=require("./Reactive-CQV_s8zX.js");var n=(n,r)=>new t.t(n,r||e.t.SIGNAL);exports.signal=n;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./types-CoiQASBn.js"),t=require("./Reactive-CQV_s8zX.js");var n=(n,r)=>new t.t(n,r||e.t.SIGNAL);exports.signal=n;
@@ -16,9 +16,7 @@ export declare const Attr: {
16
16
  readonly MODEL: 2;
17
17
  readonly STD: 3;
18
18
  readonly REF: 4;
19
- readonly BIND_ATTRS: 5;
20
- readonly BIND_EVENTS: 6;
21
- readonly DIRECT_CLASS: 7;
19
+ readonly DIRECT_CLASS: 5;
22
20
  };
23
21
  export type Attr = (typeof Attr)[keyof typeof Attr];
24
22
  export type AttrDef = {
@@ -1,5 +1,14 @@
1
1
  export declare const indexFromMarker: (comment: string) => number;
2
2
  export declare const makeMarker: (index: number) => string;
3
3
  export declare const fixAttributeQuotes: (input: string) => string;
4
- export declare const camelToKebab: (s: string) => string;
4
+ /**
5
+ * Browsers do NOT honor XHTML-style self-closing on non-void HTML elements:
6
+ * `<pf-foo />` is parsed as `<pf-foo>` (open) and everything after becomes
7
+ * its child until a closing tag is found. This preprocessor rewrites
8
+ * self-closing non-void tags into explicit open + close so the parser
9
+ * handles them as intended. The attribute matcher treats quoted strings
10
+ * as a single unit so embedded `>` (e.g. inside `<!--MARKER-->` hole
11
+ * placeholders) doesn't terminate the match.
12
+ */
13
+ export declare const fixSelfClosing: (input: string) => string;
5
14
  export declare const mergeClasses: (a: string, b: string) => string;
@@ -0,0 +1 @@
1
+ export declare const HTML: (element: HTMLElement) => string;
@@ -0,0 +1,15 @@
1
+ export declare class MockCSSStyleSheet {
2
+ cssRules: CSSRuleMock[];
3
+ constructor();
4
+ insertRule(rule: string, index?: number): number;
5
+ deleteRule(index: number): void;
6
+ replaceSync(cssText: string): void;
7
+ }
8
+ declare class CSSRuleMock {
9
+ cssText: string;
10
+ parentRule: CSSRule | null;
11
+ parentStyleSheet: CSSStyleSheet | null;
12
+ type: number;
13
+ constructor(cssText: string);
14
+ }
15
+ export {};
@@ -0,0 +1,8 @@
1
+ import type { Template } from './types';
2
+ export type Presenter = {
3
+ screen(template: Template): Presenter;
4
+ body(): HTMLElement;
5
+ root<Component extends HTMLElement>(): Component;
6
+ getComponent<Component extends HTMLElement>(tag: string): Component;
7
+ };
8
+ export declare const present: () => Presenter;
@@ -0,0 +1,3 @@
1
+ export declare const queryAll: <T extends HTMLElement = HTMLElement>(root: HTMLElement | ShadowRoot, selector: string) => T[];
2
+ export declare const query: <T extends HTMLElement = HTMLElement>(root: HTMLElement | ShadowRoot, selector: string) => T | undefined;
3
+ export declare const waitFor: <T extends HTMLElement = HTMLElement>(root: HTMLElement | ShadowRoot, selector: string, timeoutMs?: number) => Promise<T>;
@@ -0,0 +1,2 @@
1
+ import type { HtmlTemplate } from '../renderer/types';
2
+ export type Template = HtmlTemplate;
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1 @@
1
+ import './fixtures/StyledHost';
@@ -0,0 +1 @@
1
+ import './fixtures/DecoratorEdge';
@@ -0,0 +1,14 @@
1
+ import { Component } from '../../src/component/Component';
2
+ import { type Template } from '../../src/types';
3
+ export declare class FirstDefinition extends Component {
4
+ template: () => Template;
5
+ }
6
+ export declare class PreExistingTag extends Component {
7
+ template: () => Template;
8
+ }
9
+ export declare class RepeatedStateDecorator extends Component {
10
+ data: {
11
+ value: string;
12
+ };
13
+ template: () => Template;
14
+ }
@@ -0,0 +1,14 @@
1
+ import { Component } from '../../src/component/Component';
2
+ import type { Template } from '../../src/types';
3
+ export declare class StyledHost extends Component {
4
+ template: () => Template;
5
+ }
6
+ export declare class UnstyledHost extends Component {
7
+ template: () => Template;
8
+ }
9
+ export declare class MultiStyledHost extends Component {
10
+ template: () => Template;
11
+ }
12
+ export declare class SlotHost extends Component {
13
+ template: () => Template;
14
+ }
@@ -0,0 +1,26 @@
1
+ import { Component } from '../../../src/component/Component';
2
+ import { type Template } from '../../../src/types';
3
+ export declare class SelfClosingChild extends Component {
4
+ template: () => Template;
5
+ }
6
+ export declare class SelfClosingHost extends Component {
7
+ template: () => Template;
8
+ }
9
+ export declare class SelfClosingSlots extends Component {
10
+ template: () => Template;
11
+ }
12
+ export declare class SelfClosingSlotHost extends Component {
13
+ template: () => Template;
14
+ }
15
+ export declare class VoidElementHost extends Component {
16
+ template: () => Template;
17
+ }
18
+ export declare class ConditionalSelfClose extends Component {
19
+ showIcon: boolean;
20
+ template: () => Template;
21
+ }
22
+ export declare class SearchWithClear extends Component {
23
+ query: string;
24
+ private clear;
25
+ template: () => Template;
26
+ }
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1 @@
1
+ import '../fixtures/renderer/SelfClosing';
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1 @@
1
+ import './fixtures/StyledHost';
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,3 @@
1
+ export * from '../src/testing/present';
2
+ export { query, queryAll, waitFor, } from '../src/testing/shadowRoot';
3
+ export type { Template } from '../src/testing/types';
@@ -0,0 +1 @@
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../render-GbmCSARc.js");var t=(e,n)=>{let r=Array.from(e.querySelectorAll(n)),i=e=>{for(let i of t(e,n))r.includes(i)||r.push(i)};e instanceof HTMLElement&&e.shadowRoot&&i(e.shadowRoot);for(let t of e.querySelectorAll(`*`))t.shadowRoot&&i(t.shadowRoot);return r},n=(e,n)=>t(e,n)[0],r=async(e,t,r=2e3)=>{let i=performance.now();for(;performance.now()-i<r;){let r=n(e,t);if(r)return r;await new Promise(e=>setTimeout(e,25))}throw Error(`Timeout waiting for ${t}`)},i=()=>{let t={screen(n){return e.n(n,document.body),t},body(){return document.body},root(){return document.body.firstElementChild},getComponent(e){return n(document.body,e)}};return t};exports.present=i,exports.query=n,exports.queryAll=t,exports.waitFor=r;
@@ -0,0 +1 @@
1
+ export * from '../src/testing/mocks/MockCSSStyleSheet';
@@ -0,0 +1 @@
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=class{cssRules;constructor(){this.cssRules=[]}insertRule(e,n){if(n===void 0&&(n=this.cssRules.length),n<0||n>this.cssRules.length)throw RangeError(`Index size error`);return this.cssRules.splice(n,0,new t(e)),n}deleteRule(e){if(e<0||e>=this.cssRules.length)throw RangeError(`Index size error`);this.cssRules.splice(e,1)}replaceSync(e){this.cssRules=e.split(/(?<=})\s*/).filter(e=>e.trim()).map(e=>new t(e))}},t=class{cssText;parentRule;parentStyleSheet;type;constructor(e){this.cssText=e,this.parentRule=null,this.parentStyleSheet=null,this.type=CSSRule.STYLE_RULE}};exports.MockCSSStyleSheet=e;
@@ -0,0 +1 @@
1
+ export * from '../src/testing/html';
@@ -0,0 +1,3 @@
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));let c=require("unified"),l=require("rehype-parse");l=s(l);let u=require("rehype-format");u=s(u);let d=require("rehype-stringify");d=s(d);var f=e=>(0,c.unified)().use(l.default,{fragment:!0}).use(u.default).use(d.default).processSync(e).toString(),p=e=>{if(!e)return``;if(e.nodeType===3&&e.textContent)return e.textContent.trim();if(e.nodeType!==1)return``;let t=``,n=e.cloneNode();if(e.shadowRoot&&(t+=`
2
+ <!-- #shadowroot -->
3
+ `),e=e.shadowRoot||e,e.children.length)for(let n of e.childNodes)n.assignedNodes?n.assignedNodes()[0]?n.nodeName.includes(`-`)?t+=`\n${p(n.assignedNodes()[0])}\n`:t+=p(n.assignedNodes()[0]):n.nodeName.includes(`-`)?t+=`\n${n.innerHTML}\n`:t+=n.innerHTML:n.nodeName.includes(`-`)?t+=`\n${p(n)}\n`:t+=p(n);else t=e.innerHTML;return n.innerHTML=t,n.outerHTML},m=e=>f(p(e));exports.HTML=m;
@@ -1 +1 @@
1
- var e=require("./render-BC66dqY-.js").t,t={PROPS:`PROPS`,SIGNAL:`SIGNAL`,LOCAL_STATE:`LOCAL_STATE`,ON_MOUNT:`ON_MOUNT`};Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return e}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return t}});
1
+ var e=require("./render-GbmCSARc.js").t,t={PROPS:`PROPS`,SIGNAL:`SIGNAL`,LOCAL_STATE:`LOCAL_STATE`,ON_MOUNT:`ON_MOUNT`};Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return e}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return t}});
package/dist/utilities.js CHANGED
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./utils-Bfw6tf_Y.js"),t=require("./utilities-COO_YT_a.js");exports.camelToKebabCase=t.t,exports.fastUID=t.n,exports.makeCssStylesheet=t.r,exports.mergeClasses=e.a,exports.ref=t.i,exports.render=t.a;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./utils-C1MFaM_r.js"),t=require("./utilities-COO_YT_a.js");exports.camelToKebabCase=t.t,exports.fastUID=t.n,exports.makeCssStylesheet=t.r,exports.mergeClasses=e.a,exports.ref=t.i,exports.render=t.a;
@@ -0,0 +1 @@
1
+ var e={EVENT:0,PROP:1,MODEL:2,STD:3,REF:4,DIRECT_CLASS:5},t=RegExp(`₥(\\d+)`),n=e=>{let n=e.match(t);if(!n)throw Error(`Unable to extract index from hole comment`);return Number(n[1])},r=e=>`<!--₥${e}-->`,i=e=>e.replace(/(\S+)=((<!--[\s\S]*?-->)|([^\s">]+))/g,`$1="$2"`),a=new Set([`area`,`base`,`br`,`col`,`embed`,`hr`,`img`,`input`,`link`,`meta`,`source`,`track`,`wbr`]),o=/<([a-zA-Z][a-zA-Z0-9-]*)((?:"<!--[\s\S]*?-->"|"[^"<>]*"|'[^'<>]*'|[^<>])*?)\s*\/>/g,s=e=>e.replace(o,(e,t,n)=>a.has(t.toLowerCase())?e:`<${t}${n}></${t}>`),c=(e,t)=>{let n=new Set,r=``,i=e=>{let t=e.split(` `);for(let e=0;e<t.length;e++){let i=t[e];i&&!n.has(i)&&(n.add(i),r.length&&(r+=` `),r+=i)}};return i(e),i(t),r};Object.defineProperty(exports,"a",{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,"o",{enumerable:!0,get:function(){return e}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return n}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return i}});
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@neuralfog/elemix",
3
- "version": "0.4.0",
3
+ "version": "0.5.0",
4
4
  "license": "MIT",
5
5
  "author": "brownhounds",
6
6
  "main": "dist/index.js",
@@ -15,7 +15,10 @@
15
15
  "./reactive": "./dist/reactive.js",
16
16
  "./config": "./dist/config.js",
17
17
  "./app": "./dist/app.js",
18
- "./utilities": "./dist/utilities.js"
18
+ "./utilities": "./dist/utilities.js",
19
+ "./testing": "./dist/testing/index.js",
20
+ "./testing/snapshots": "./dist/testing/snapshots.js",
21
+ "./testing/mocks": "./dist/testing/mocks.js"
19
22
  },
20
23
  "scripts": {
21
24
  "clean": "rm -rf ./dist ./bundle ./coverage",
@@ -31,15 +34,31 @@
31
34
  "lint:fix": "biome format --write && biome lint --fix",
32
35
  "release": "npm run clean && npm run build && npm publish --access public"
33
36
  },
37
+ "peerDependencies": {
38
+ "rehype-format": "5.0.1",
39
+ "rehype-parse": "9.0.1",
40
+ "rehype-stringify": "10.0.1",
41
+ "unified": "11.0.5"
42
+ },
43
+ "peerDependenciesMeta": {
44
+ "rehype-format": { "optional": true },
45
+ "rehype-parse": { "optional": true },
46
+ "rehype-stringify": { "optional": true },
47
+ "unified": { "optional": true }
48
+ },
34
49
  "devDependencies": {
35
50
  "@neuralfog/biome-config": "0.1.2",
36
- "@neuralfog/elemix-testing": "0.2.0",
37
51
  "@neuralfog/ts-config": "0.1.2",
52
+ "@types/node": "25.9.1",
38
53
  "@vitest/coverage-v8": "4.1.7",
39
54
  "@vitest/ui": "4.1.7",
40
55
  "esbuild": "0.28.0",
41
56
  "jsdom": "29.1.1",
57
+ "rehype-format": "5.0.1",
58
+ "rehype-parse": "9.0.1",
59
+ "rehype-stringify": "10.0.1",
42
60
  "typescript": "6.0.3",
61
+ "unified": "11.0.5",
43
62
  "vite": "8.0.14",
44
63
  "vitest": "4.1.7"
45
64
  }
@@ -1 +0,0 @@
1
- const e=require("./utils-Bfw6tf_Y.js");var t={deletes:[],inserts:[],moves:[]},n=(e,n)=>{let i=e.length,a=n.length;if(i===a){let r=!0;for(let t=0;t<i;t++)if(e[t].key!==n[t].key){r=!1;break}if(r)return t}let o=Object.create(null);for(let t=0;t<i;t++)o[e[t].key]=t;let s=new Int32Array(a),c=[],l=[],u=Object.create(null);for(let e=0;e<a;e++){let t=n[e].key;u[t]=!0;let r=o[t];r===void 0?s[e]=-1:(s[e]=r,c.push(r),l.push(e))}let d=r(c),f=new Uint8Array(a);for(let e=0;e<d.length;e++)f[l[d[e]]]=1;let p=[],m=[],h=[];for(let t=0;t<i;t++)u[e[t].key]!==!0&&p.push({key:e[t].key});for(let e=0;e<a;e++){let t=e+1<a?n[e+1].key:void 0;s[e]===-1?m.push({key:n[e].key,value:n[e],beforeKey:t}):f[e]||h.push({key:n[e].key,beforeKey:t})}return{deletes:p,inserts:m,moves:h}},r=e=>{let t=e.length;if(t===0)return[];let n=new Int32Array(t),r=new Int32Array(t),i=0;for(let a=0;a<t;a++){let t=0,o=i;for(;t<o;){let n=t+o>>>1;e[r[n]]<e[a]?t=n+1:o=n}r[t]=a,t===i&&i++,n[a]=t>0?r[t-1]:-1}let a=Array(i),o=r[i-1];for(let e=i-1;e>=0;e--)a[e]=o,o=n[o];return a},i=e=>typeof e==`object`&&!!e&&`strings`in e&&`values`in e,a=/(\S+)(?==(?:["']?)$)/,o=(t,n)=>{let r=t.match(a);if(!r)return;let i=r[1],o={index:n,name:i,value:e.i(n),virtual:!1,type:e.o.STD},s=i[0];return s===`@`?(o.virtual=!0,o.type=e.o.EVENT):s===`:`?(o.virtual=!0,o.type=i.endsWith(`:ref`)?e.o.REF:e.o.PROP):s===`~`&&i.startsWith(`~model`)?(o.virtual=!0,o.type=e.o.MODEL):s===`.`&&(i.startsWith(`.bind-attrs`)?(o.virtual=!0,o.type=e.o.BIND_ATTRS):i.startsWith(`.bind-events`)?(o.virtual=!0,o.type=e.o.BIND_EVENTS):i.startsWith(`.class`)&&(o.virtual=!0,o.type=e.o.DIRECT_CLASS)),o},s=new Map,c=e=>{let t=s.get(e);if(t)return t;let n=``;for(let t=0;t<e.length;t++){let r=e[t],i=r.charCodeAt(0);n+=i>=48&&i<=57||i>=65&&i<=90||i>=97&&i<=122||r===`-`||r===`_`?r:`\\${r}`}return s.set(e,n),n},l=(e,t,n)=>{for(let r=0,i=t.length;r<i;r++){let i=t[r],a=e.querySelector(`[${c(i.name)}='${i.value}']`);a&&(i.virtual&&a.removeAttribute(i.name),n.set(i.index,w[i.type](a,i)))}},u=e=>Array.isArray(e)?`list`:i(e)?`template`:`string`,d=(e,t,n)=>e===`list`?h(t,n):e===`template`?m(t,n):p(t),f=(e,t,n)=>{let r,i;return e=>{let a=u(e);i&&i!==a&&(r?.dispose(),r=void 0),r||(r=d(a,t,n),i=a),r.update(e)}},p=e=>{let t=document.createTextNode(``);return e.before(t),{update:e=>{let n=e==null?``:String(e);t.textContent!==n&&(t.textContent=n)},dispose:()=>{t.remove()}}},m=(e,t)=>{let n,r,i=[],a=()=>{for(let e=0;e<i.length;e++)i[e].remove();i=[]};return{update:o=>{let s=o;n!==s.strings&&(r=void 0,a()),r||(r=t(s),n=s.strings,i=r.mountBefore(e,s.values)),r.update(s.values)},dispose:a}},h=(e,t)=>{let r=new Map,i=new Map,a=[],o=(n,a)=>{if(!n.key)throw Error(`use repeat directive when rendering the lists`);let o=r.get(n.key);if(!o){o=t(n),r.set(n.key,o);let s=a||e,c=o.mountBefore(s,n.values);c.length&&i.set(n.key,c[c.length-1])}return o},s=()=>{for(let[,e]of i)e.remove();r.clear(),i.clear()},c=e=>{for(let t=0;t<e.length;t++)o(e[t]).update(e[t].values)};return{update:t=>{let l=t;if(!a.length){c(l),a=l;return}if(!l.length){s(),a=l;return}let{deletes:u,inserts:d,moves:f}=n(a,l);if(u.length===l.length||d.length===l.length){s(),c(l),a=l;return}for(let e=u.length-1;e>=0;e--){let t=u[e].key;i.get(t)?.remove(),i.delete(t),r.delete(t)}for(let t=f.length-1;t>=0;t--){let n=i.get(f[t].key),r=i.get(f[t].beforeKey);n&&r?r.before(n):n&&e.before(n)}for(let e=d.length-1;e>=0;e--){let t=i.get(d[e].beforeKey);o(d[e].value,t)}for(let e=0;e<l.length;e++)r.get(l[e].key)?.update(l[e].values);a=l},dispose:()=>{s(),a=[]}}},g=(e,t)=>{let n,{name:r}=t;return t=>{if(t===void 0)return;let i=String(t);n!==i&&(n=i,e.setAttribute(r,i))}},_=(e,t)=>{let n,r=`on${t.name.slice(1)}`;return t=>{t===void 0||n===t||(n=t,e[r]=t)}},v=(e,t)=>{let n=t.name.slice(1);return t=>{let r=e;r.$props&&r.$props.set(n,t)}},y=e=>t=>{if(t===void 0)return;let n=t,r=e;r.value!==n.value&&(r.value=n.value),e.oninput||=e=>{n.value=e.target.value}},b=e=>t=>{t!==void 0&&(t.value=e)},x=t=>{let n=t.getAttribute(`class`)||``,r;return i=>{if(!(typeof i!=`object`||!i))for(let[a,o]of Object.entries(i)){let i=e.t(a);if(o==null||o===!1){t.hasAttribute(i)&&t.removeAttribute(i),n.length&&r!==n&&(r=n,t.setAttribute(`class`,n));continue}if(i===`class`){let i=e.a(n,String(o));r!==i&&(r=i,t.setAttribute(`class`,i));continue}let s=String(o);t.getAttribute(i)!==s&&t.setAttribute(i,s)}}},S=t=>{let n=t.getAttribute(`class`)||``,r;return i=>{if(i==null){n.length&&r!==n&&(r=n,t.setAttribute(`class`,n));return}if(typeof i==`string`){let a=e.a(n,i);r!==a&&(r=a,t.setAttribute(`class`,a));return}if(typeof i==`object`){let a=``;for(let[e,t]of Object.entries(i))t&&(a.length&&(a+=` `),a+=e);let o=e.a(n,a);r!==o&&(r=o,t.setAttribute(`class`,o))}}},C=e=>{let t=new Map;return n=>{if(!(typeof n!=`object`||!n))for(let[r,i]of Object.entries(n))t.get(r)!==i&&(t.set(r,i),e[`on${r}`]=i)}},w={[e.o.STD]:g,[e.o.EVENT]:_,[e.o.PROP]:v,[e.o.MODEL]:e=>y(e),[e.o.REF]:e=>b(e),[e.o.BIND_ATTRS]:e=>x(e),[e.o.BIND_EVENTS]:e=>C(e),[e.o.DIRECT_CLASS]:e=>S(e)},T=t=>{let n=new Map,r=[],i,a=``,{strings:s}=t;for(let t=0,n=s.length;t<n;t++)if(a+=s[t],t<n-1){let n=o(s[t],t);n&&r.push(n),a+=e.i(t)}a=e.n(a);let c=()=>(i||(i=document.createElement(`template`),i.innerHTML=a),i.content.cloneNode(!0)),u=(t,i)=>{let a=document.createTreeWalker(t,NodeFilter.SHOW_COMMENT,null);for(;a.nextNode();){let{nodeValue:t}=a.currentNode;if(t?.startsWith(`₥`)){let r=e.r(t);n.set(r,f(i[r],a.currentNode,T))}}l(t,r,n)};return{mount:(e,t)=>{let n=c();u(n,t),e.appendChild(n)},mountBefore:(e,t)=>{let n=c();u(n,t);let r=Array.from(n.childNodes);return e.before(n),r},update:e=>{for(let[t,r]of n)r(e[t])}}},E=(e,...t)=>({strings:e,values:t,key:``}),D=Symbol(),O=(e,t)=>{if(!t)throw Error(`render method needs to accept instance of HTMLElement`);let n=t;n[D]||(n[D]=new Map);let r=n[D],i=r.get(e.strings);i||(i=T(e),r.set(e.strings,i),i.mount(t,e.values)),i.update(e.values)};Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return O}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return E}});
@@ -1 +0,0 @@
1
- var e={EVENT:0,PROP:1,MODEL:2,STD:3,REF:4,BIND_ATTRS:5,BIND_EVENTS:6,DIRECT_CLASS:7},t=RegExp(`₥(\\d+)`),n=e=>{let n=e.match(t);if(!n)throw Error(`Unable to extract index from hole comment`);return Number(n[1])},r=e=>`<!--₥${e}-->`,i=e=>e.replace(/(\S+)=((<!--[\s\S]*?-->)|([^\s">]+))/g,`$1="$2"`),a=e=>e.replace(/([A-Z])/g,e=>`-${e.toLowerCase()}`),o=(e,t)=>{let n=new Set,r=``,i=e=>{let t=e.split(` `);for(let e=0;e<t.length;e++){let i=t[e];i&&!n.has(i)&&(n.add(i),r.length&&(r+=` `),r+=i)}};return i(e),i(t),r};Object.defineProperty(exports,"a",{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,"o",{enumerable:!0,get:function(){return e}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return n}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return a}});