@postact/jsx 0.0.1 → 0.0.3

package/README.md

@@ -1,15 +1,17 @@
 # @postact/jsx
+This adds JSX support to [Postact](https://github.com/AWeirdDev/postact), if you'd like.
 
-To install dependencies:
+It took me forever, so please enjoy this.
 
-```bash
-bun install
-```
-
-To run:
+You can just add `@postact/jsx` as the JSX input source in your `tsconfig.json`:
 
-```bash
-bun run index.ts
+```jsonc
+{
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "jsxImportSource": "@postact/jsx",
+  }
+}
 ```
 
-This project was created using `bun init` in bun v1.3.5. [Bun](https://bun.com) is a fast all-in-one JavaScript runtime.
+Then you should be good to go. Maybe. I don't fucking know.

package/jsx-runtime.ts

@@ -5,7 +5,6 @@ import {
   type Ref,
   type Subscribable,
   type VirtualElement,
-  type VirtualFragment,
   type VirtualItem,
 } from "@postact/core";
 
@@ -124,7 +123,7 @@ function jsx(type: Symbol | Function | string, props: any): JSX.Element {
   } else if (typeof type === "function") {
     return type(props);
   } else {
-    throw new TypeError("unknown type");
+    throw new TypeError(`unknown type: ${JSON.stringify(type)}`);
   }
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@postact/jsx",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "description": "JSX support for Postact.",
   "author": {
     "name": "AWeirdDev",
@@ -18,15 +18,13 @@
     },
     "./jsx-runtime": {
       "types": "./dist/jsx-runtime.d.ts",
-      "import": "./dist/jsx-runtime.mjs",
-      "require": "./dist/jsx-runtime.cjs",
+      "import": "./dist/jsx-runtime.js",
       "default": "./dist/jsx-runtime.js"
     },
     "./jsx-dev-runtime": {
-      "types": "./dist/jsx-runtime.d.ts",
-      "import": "./dist/jsx-runtime.mjs",
-      "require": "./dist/jsx-runtime.cjs",
-      "default": "./dist/jsx-runtime.js"
+      "types": "./dist/jsx-dev-runtime.d.ts",
+      "import": "./dist/jsx-dev-runtime.js",
+      "default": "./dist/jsx-dev-runtime.js"
     }
   },
   "scripts": {

package/tsconfig.json

@@ -28,5 +28,6 @@
     "noUnusedParameters": false,
     "noPropertyAccessFromIndexSignature": false,
   },
-  "exclude": ["./dist/**", "rolldown.config.ts"]
+  "include": ["./jsx-dev-runtime.ts", "./jsx-runtime.ts"],
+  "exclude": ["./rolldown.config.ts"]
 }

package/test.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var core_1 = require("@postact/core");
-function Counter() {
-  var $count = (0, core_1.state)(0);
-  return <button>asdf</button>;
-}

package/test.prod.js

@@ -1 +0,0 @@
-var l=class extends Error{constructor(q){super(q)}};function g(){if(typeof window>"u")throw new l("expected the runtime context to be in the browser (window is undefined)")}var X=function(q){return q[q.Dependent=0]="Dependent",q[q.State=1]="State",q[q.VirtualElement=2]="VirtualElement",q[q.VirtualFragment=3]="VirtualFragment",q[q.VirtualTextNode=4]="VirtualTextNode",q[q.CSSPaper=5]="CSSPaper",q[q.ComponentPointer=6]="ComponentPointer",q[q.ComponentInstance=7]="ComponentInstance",q[q.Ref=8]="Ref",q}({});function H(q){return q===null?!1:!!(typeof q=="object"&&Object.hasOwn(q,"__p"))}function N(q,z){return z===null?!1:!!((typeof z=="object"||typeof z=="function")&&Object.hasOwn(z,"__p")&&z.__p==q)}function B(q=6){return Array.from({length:q},()=>Math.floor(Math.random()*16).toString(16)).join("")}function h(q){return N(X.VirtualElement,q)}function x(q){return N(X.VirtualFragment,q)}function P(q,z){return{__p:X.VirtualFragment,children:q,subscribable:z}}function d(q){return N(X.VirtualTextNode,q)}function Q(q,z){return{__p:X.VirtualTextNode,data:q,subscribable:z}}var u=class{value;#q;constructor(q){this.value=q,this.#q=new Map}subscribe(q){this.#q.set(q,q)}unsubscribe(q){this.#q.delete(q)}emit(){let q=this.value;this.#q.forEach((z)=>z(q))}};function T(q){return N(X.Dependent,q)||N(X.State,q)||N(X.Ref,q)}var t=class{__p=X.Ref;value;#q;constructor(){this.value=null,this.#q=new Map}subscribe(q){this.#q.set(q,q)}unsubscribe(q){this.#q.delete(q)}emit(){let q=this.value;if(q===null)throw Error("ref is currently null");this.#q.forEach((z)=>z(q))}};function o(q){return N(X.Ref,q)}function C(q,z){let G=window.document.createDocumentFragment();if(q==null)return G;if(typeof q=="string")return G.appendChild(window.document.createTextNode(q)),G;if(d(q)){let K=q,J=window.document.createTextNode(K.data);if(K.subscribable){let O=z.debug?B():"",Y=window.document.createComment(z.debug?`${O}`:""),M=window.document.createComment(z.debug?`/${O}`:""),U=new E(Y,M,G);K.subscribable.subscribe((Z)=>{J.parentNode&&U.setParent(J.parentNode);let m=_(Z,z);U.spreadAndReplace(m)}),G.append(Y,J,M)}else G.appendChild(J);return G}if(h(q)){let K=window.document.createElement(q.tag);return q.attributes.entries().forEach(([J,O])=>{if(O!=null){if(o(O)&&(O.value=K,O.emit()),T(O))return O.subscribe((Y)=>{L(K,J,Y)}),L(K,J,O.value);K.setAttribute(J,O.toString())}}),q.listeners.forEach(([J,O])=>K.addEventListener(J,O)),q.subscribable&&q.subscribable.subscribe((J)=>{let O=_(J,z);K.replaceChildren(O)}),K.append(...q.children.map((J)=>C(J,z))),G.appendChild(K),G}if(x(q)){let K=q.children.reduce((J,O)=>(J.append(C(O,z)),J),window.document.createDocumentFragment());if(q.subscribable){let J=z.debug?B():"",O=window.document.createComment(z.debug?`${J}`:""),Y=window.document.createComment(z.debug?`/${J}`:""),M=new E(O,Y,G);q.subscribable.subscribe((U)=>{O.parentNode&&M.setParent(O.parentNode);let Z=_(U,z);M.spreadAndReplace(Z)}),G.append(O,K,Y)}else G.appendChild(K);return G}else throw Error("unknown virtual item")}function _(q,z){if(q==null)return window.document.createDocumentFragment();if(F(q)){let G=window.document.createDocumentFragment();return G.appendChild(window.document.createTextNode(q.toString())),G}else return C(q,z)}var E=class{#q;#z;#G;constructor(q,z,G){this.#q=q,this.#z=z,this.#G=G}setParent(q){this.#G=q}spreadAndReplace(q){let z=this.#q.nextSibling;for(;z&&!this.#z.isEqualNode(z);){let G=z.nextSibling;this.#G.removeChild(z),z=G}this.#G.insertBefore(q,this.#z)}};function L(q,z,G){G==null?q.removeAttribute(z):q.setAttribute(z,G.toString())}var I={debug:!1};function b(q,z=I){return g(),C(q,z)}function c(q,z){q.replaceChildren(b(z))}function f(q){let z=window.document.querySelector(q);if(!z)throw ReferenceError(`could not find any element matching query: ${q}`);return z.render=(G)=>{c(z,G)},z}var p=Object.freeze({"&amp;":"&","&lt;":"<","&gt;":">","&quot;":'"',"&#39;":"'"}),k=/&(?:amp|lt|gt|quot|#39);/g;function A(q){return q&&k.test(q)?q.replace(k,(z)=>p[z]):q}function F(q){return["string","number","bigint","boolean"].includes(typeof q)}function D(q,z){return typeof z=="function"?z(q):z}var R=class{value;__p=X.State;#q;#z;constructor(q){this.value=q,this.#q=new Map,this.#z=[]}update(q){let z=D(this.value,q);for(let G of this.#z)if(!G(this.value,z))return;this.value=z,this.emit()}set(q){this.value=D(this.value,q)}subscribe(q){this.#q.set(q,q)}unsubscribe(q){this.#q.delete(q)}emit(){let q=this.value;this.#q.forEach((z,G)=>G(q))}withChecker(q){return this.#z.push(q),this}withCheckers(q){return this.#z.push(...q),this}};function j(q){return new R(q)}var e=class{__p=X.Dependent;#q;#z;#G;constructor(q,z,G){this.#z=G||z(Array.isArray(q)?q.map((K)=>K.value):q.value),this.#q=z,this.#G=new Map,Array.isArray(q)?q.forEach((K)=>{K.subscribe(()=>{let J=this.#q(q.map((O)=>O.value));this.#z=J,this.#G.forEach((O,Y)=>Y(J))})}):q.subscribe(()=>{let K=this.#q(q.value);this.#z=K,this.#G.forEach((J,O)=>O(K))})}get value(){return this.#z}subscribe(q){this.#G.set(q,q)}unsubscribe(q){this.#G.delete(q)}};var q0=class extends R{#q;#z;ok;constructor(q){super(null),this.#q=q,this.ok=!1,this.#z=()=>{},this.#q.then((z)=>this.update(z)).catch((z)=>this.#z&&this.#z(z))}catch(q){return this.#z=q,this}};var $=function(q){return q[q.Empty=0]="Empty",q[q.Text=1]="Text",q[q.Subscribable=2]="Subscribable",q[q.VirtualItem=3]="VirtualItem",q[q.Function=4]="Function",q}({});function v(q){return q==null?$.Empty:typeof q=="function"?$.Function:F(q)?$.Text:T(q)?$.Subscribable:$.VirtualItem}function S(q){switch(v(q)){case $.Empty:return null;case $.Text:return Q(q.toString());case $.Subscribable:let z=q,G=z.value;return G==null?Q("",z):F(G)?Q(G.toString(),z):P([G],z);case $.VirtualItem:return q;case $.Function:let K=q();if(K==null)return null;if(F(K))return Q(K.toString());if(!H(K))throw Error(`unresolvable value in children after function calling. value: ${K}`);return K}}function w(q){return N(X.ComponentPointer,q)}function a(q){return N(X.ComponentInstance,q)}var W=class q extends Error{constructor(z){super(z)}static noInsertInTagNames(){return new q("`${...}` is not allowed in tag names")}static noInsertInAttrNames(){return new q("`${...}` is not allowed in attribute names")}static invalidCharacterInTagName(z){return new q(`${z} is not a valid html tag character`)}static invalidCharacterInAttributeName(z){return new q(`${z} is not a valid html attribute character`)}static expectedQuote(){return new q('expected double quote (")')}static expectedAttrName(){return new q("expected attribute name, got empty")}static expectedAttrEqual(){return new q("expected equal sign (=) right after attribute name")}static expectedTagClosing(){return new q("expected tag to be closing (with a slash: /)")}static expectedTagOpening(){return new q("expected an opening tag")}static tagMismatch(z,G){return new q(`the starting and closing tags do not match: \`${z}\` and \`${G}\``)}static noBackslashBeforeInsert(){return new q("there should be no backslash (\\) before ${...}")}static typeCheckComponentProps(){return new q("**do not** add attributes like how you would in JSX.this may lead to runtime type inconsistencies. instead, run components (e.g., `Page`) with attributes like this: \n  html`<${Page({ hello: 'world' })} />`\nthis ensures runtime type safety.")}},z0=class{#q;#z;#G;#J;constructor(q,z){this.#q=q,this.#z=z,this.#G=0,this.#J=0}next(){if(this.#G>=this.#q.length)return null;if(this.#q[this.#G].length==0)return this.#J=0,this.#G+=1,[!0,""];if(this.#J>=this.#q[this.#G].length)return null;let q=this.#q[this.#G],z=q[this.#J];return this.#J=(this.#J+1)%q.length,this.#G+=this.#J==0?1:0,[this.#J==0,z]}seek(){return this.#q[this.#G][this.#J]||null}getInsertion(){return this.#z[this.#G-1]??null}consume(){let q=[];for(;;){let z=this.next();if(!z)break;let[G,K]=z;if(K=="<"){if(G){let J=this.getInsertion();if(w(J)||a(J)){q.push(this.processComponent(J));continue}else throw W.noInsertInTagNames()}q.push(this.processElement())}else if(G){let J=S(this.getInsertion());J!==null&&q.push(J)}else if(!/\s/.test(K))throw W.expectedTagOpening()}return{__p:X.VirtualFragment,children:q}}processElement(){let[q,z,G,K]=this.consumeTag(),[J,O]=n(z);if(G)return{__p:X.VirtualElement,tag:q,attributes:O,children:[],listeners:J};let Y=this.consumeChildren(K),M=this.consumeEndTag();if(q!==M)throw W.tagMismatch(q,typeof M=="string"?M:"[component]");return{__p:X.VirtualElement,tag:q,attributes:O,children:Y,listeners:J}}processComponent(q){let[z,G,K]=this.consumeAttributes();if(z.size>0)throw W.typeCheckComponentProps();if(G)return q.ptr(w(q)?{}:q.props);let J=this.consumeChildren(K),O=this.consumeEndTag();if(typeof O!="function")throw W.tagMismatch("[component]",O);if(!w(O))throw TypeError("expected component pointer for end tag, got other functions instead");if(O.ptr!==q.ptr)throw W.tagMismatch("[component A]","[component B]");return q.ptr({children:P(J),...w(q)?{}:q.props})}consumeTag(){let q="";for(;;){let[z,G]=this.next();if(/\s/.test(G)){let[K,J,O]=this.consumeAttributes();return[q,K,J,O]}if(G==">")return[q,new Map,!1,z];if(z)throw W.noInsertInTagNames();if(!/[a-zA-Z0-9-]/.test(G))throw W.invalidCharacterInTagName(G);q+=G}}consumeAttributes(){let q=new Map,z="",G=0;for(;;){let[K,J]=this.next();if(J==">")return z&&q.set(z,"true"),[q,!1,K];if(J=="/"){let[Y,M]=this.consumeWhitespace();if(M!==">")throw W.expectedTagClosing();return z&&q.set(z,"true"),[q,!0,K]}if(G===0){if(!z&&(/\s/.test(J)||!J))continue;if(/\s|=/.test(J)){if(!z)throw W.expectedAttrName();G=1}else{if(K)throw W.noInsertInAttrNames();if(!/[a-zA-Z0-9-]/.test(J))throw W.invalidCharacterInAttributeName(J);z+=J;continue}}if(J===" "){q.set(z,"true"),z="",G=0;continue}if(J!=="=")throw W.expectedAttrEqual();let O=K?i(this.getInsertion()):this.consumeStringQuote();O!==null&&q.set(z,O),z="",G=0}}consumeEndTag(){let[q,z]=this.consumeWhitespace();if(z!=="/")throw W.expectedTagClosing();if(q){let J=this.getInsertion();if(typeof J=="function")return J;throw W.noInsertInTagNames()}let G="",K=0;for(;;){let[J,O]=this.next();if(O===">")return typeof G=="function"?G:G.trimEnd();if(J){let Y=this.getInsertion();if(typeof Y=="function"&&typeof G!="function")G=Y;else throw W.noInsertInTagNames()}else{if(typeof G=="function"||(/\s/.test(O)&&(K=1),K==0&&!/[a-zA-Z0-9-]/.test(O)))throw W.invalidCharacterInTagName(O);G+=O}}}consumeWhitespace(){let[q,z]=this.next();return/\s/.test(z)?this.consumeWhitespace():[q,z]}consumeStringQuote(){let q="",[z,G]=this.consumeWhitespace();if(G!=='"')throw W.expectedQuote();for(q+='"',z&&(q+=this.getInsertion().toString());;){let[K,J]=this.next();if(J=="\\"){let[O,Y]=this.next();if(O)throw W.noBackslashBeforeInsert();q+="\\"+Y;continue}if(J=='"')break;q+=J,K&&(q+=this.getInsertion().toString())}return JSON.parse(q+'"')}consumeChildren(q){let z="",G=[];for(q&&G.push(S(this.getInsertion()));;){let[K,J]=this.next();if(J==="<"){if(this.seek()==="/")break;z.trim()&&G.push(Q(A(z))),z="",G.push(this.processElement());continue}if(z+=J,K){z.trim()&&G.push(Q(A(z))),z="";let O=this.getInsertion();G.push(S(O))}}return z.trim()&&G.push(Q(A(z))),G}};function i(q){switch(v(q)){case $.Empty:return null;case $.Text:return q.toString();case $.Subscribable:return q;case $.VirtualItem:return null;case $.Function:return q}}function n(q){let z=[];for(let[G,K]of Object.entries(q))G.startsWith("on")&&typeof K=="function"&&(q.delete(G),z.push([G.slice(2),K]));return[z,q]}var G0=new u({pathname:"",hash:" "});var s=Symbol();function y(q){return q.map((z)=>S(z))}function V(q,z){let G=typeof z.children<"u"&&z.children!==null,K=!G?[]:Array.isArray(z.children)?z.children:[z.children];if(q===s)return P(y(K));else if(typeof q==="string"){if(G)delete z.children;return{__p:X.VirtualElement,tag:q,attributes:z,children:y(K),listeners:[]}}else if(typeof q==="function")return q(z)}function r(){let q=j(0);return V("button",{onclick:()=>q.update((z)=>z+1),children:["Current: ",q]})}f("#app").render(V(r,{}));

package/test.tsx

@@ -1,8 +0,0 @@
-import { state, select } from "@postact/core";
-
-function Counter() {
-  const $count = state(0);
-  return <button onclick={() => $count.update((v) => v + 1)}>Current: {$count}</button>;
-}
-
-select("#app").render(<Counter />);