effect-start 0.22.0 → 0.23.0

package/dist/hyper/HyperHtml.test.js

@@ -0,0 +1,197 @@
+import { jsx as _jsx } from "effect-start/jsx-runtime";
+/** @jsxImportSource effect-start */
+import * as test from "bun:test";
+import * as HyperHtml from "./HyperHtml.js";
+import * as HyperNode from "./HyperNode.js";
+test.it("boolean true attributes render without value (React-like)", () => {
+    const node = HyperNode.make("div", {
+        hidden: true,
+        disabled: true,
+        "data-active": true,
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe("<div hidden disabled data-active></div>");
+});
+test.it("boolean false attributes are omitted", () => {
+    const node = HyperNode.make("div", {
+        hidden: false,
+        disabled: false,
+        "data-active": false,
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe("<div></div>");
+});
+test.it("string attributes render with values", () => {
+    const node = HyperNode.make("div", {
+        id: "test",
+        class: "my-class",
+        "data-value": "hello",
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe('<div id="test" class="my-class" data-value="hello"></div>');
+});
+test.it("number attributes render with values", () => {
+    const node = HyperNode.make("input", {
+        type: "number",
+        min: 0,
+        max: 100,
+        value: 50,
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe('<input type="number" min="0" max="100" value="50">');
+});
+test.it("null and undefined attributes are omitted", () => {
+    const node = HyperNode.make("div", {
+        id: null,
+        class: undefined,
+        "data-test": "value",
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe('<div data-test="value"></div>');
+});
+test.it("mixed boolean and string attributes", () => {
+    const node = HyperNode.make("input", {
+        type: "checkbox",
+        checked: true,
+        disabled: false,
+        name: "test",
+        value: "on",
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe('<input type="checkbox" checked name="test" value="on">');
+});
+test.it("data-* attributes with object values use single-quoted JSON", () => {
+    const node = HyperNode.make("div", {
+        "data-signals": {
+            draft: "",
+            pendingDraft: "",
+            username: "User123",
+        },
+    });
+    const html = HyperHtml.renderToString(node);
+    test
+        .expect(html)
+        .toBe(`<div data-signals='{"draft":"","pendingDraft":"","username":"User123"}'></div>`);
+});
+test.it("data-* attributes with array values use single-quoted JSON", () => {
+    const node = HyperNode.make("div", {
+        "data-items": [1, 2, 3],
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe("<div data-items='[1,2,3]'></div>");
+});
+test.it("data-* attributes with nested object values use single-quoted JSON", () => {
+    const node = HyperNode.make("div", {
+        "data-config": {
+            user: { name: "John", active: true },
+            settings: { theme: "dark" },
+        },
+    });
+    const html = HyperHtml.renderToString(node);
+    test
+        .expect(html)
+        .toBe(`<div data-config='{"user":{"name":"John","active":true},"settings":{"theme":"dark"}}'></div>`);
+});
+test.it("data-* object values with single quotes in values are escaped", () => {
+    const node = HyperNode.make("div", {
+        "data-signals": {
+            message: "it's a test",
+            name: "O'Brien",
+        },
+    });
+    const html = HyperHtml.renderToString(node);
+    test
+        .expect(html)
+        .toBe(`<div data-signals='{"message":"it&#39;s a test","name":"O&#39;Brien"}'></div>`);
+});
+test.it("data-* string values are not JSON stringified", () => {
+    const node = HyperNode.make("div", {
+        "data-value": "hello world",
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe('<div data-value="hello world"></div>');
+});
+test.it("non-data attributes with object values are not JSON stringified", () => {
+    const node = HyperNode.make("div", {
+        style: "color: red",
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe('<div style="color: red"></div>');
+});
+test.it("script with function child renders as IIFE", () => {
+    const handler = (window) => {
+        console.log("Hello from", window.document.title);
+    };
+    const node = HyperNode.make("script", {
+        children: handler,
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe(`<script>(${handler.toString()})(window)</script>`);
+});
+test.it("script with arrow function child renders as IIFE", () => {
+    const node = HyperNode.make("script", {
+        children: (window) => {
+            window.alert("test");
+        },
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toContain("<script>(");
+    test.expect(html).toContain(")(window)</script>");
+    test.expect(html).toContain("window.alert");
+});
+test.it("script with string child renders without escaping", () => {
+    const node = HyperNode.make("script", {
+        children: "console.log('hello')",
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe("<script>console.log('hello')</script>");
+});
+test.it("script with string child preserves ampersands and quotes", () => {
+    const node = HyperNode.make("script", {
+        children: 'if (a && b) { console.log("yes") }',
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe('<script>if (a && b) { console.log("yes") }</script>');
+});
+test.it("style tag content is not escaped", () => {
+    const node = HyperNode.make("style", {
+        children: ".foo > .bar { content: '&'; }",
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe("<style>.foo > .bar { content: '&'; }</style>");
+});
+test.it("script with attributes and no children", () => {
+    const node = HyperNode.make("script", {
+        type: "module",
+        src: "https://example.com/app.js",
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe('<script type="module" src="https://example.com/app.js"></script>');
+});
+test.it("normal tag string content is escaped", () => {
+    const node = HyperNode.make("div", {
+        children: "a && b",
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toBe("<div>a &amp;&amp; b</div>");
+});
+test.it("data-* function values are serialized with toString", () => {
+    const node = HyperNode.make("div", {
+        "data-on-click": () => console.log("clicked"),
+    });
+    const html = HyperHtml.renderToString(node);
+    test.expect(html).toContain("data-on-click=");
+    test.expect(html).toContain("console.log");
+});
+test.it("data-* object values don't render as [object Object]", () => {
+    const html = HyperHtml.renderToString(_jsx("div", { "data-signals": { isOpen: false, count: 42 }, children: "content" }));
+    test.expect(html).toBe(`<div data-signals='{"isOpen":false,"count":42}'>content</div>`);
+    test.expect(html).not.toContain("[object Object]");
+});
+test.it("JSX component with data-* object values", () => {
+    function TestComponent() {
+        return (_jsx("div", { "data-signals": { isOpen: false }, children: _jsx("span", { children: "nested" }) }));
+    }
+    const html = HyperHtml.renderToString(_jsx(TestComponent, {}));
+    test.expect(html).toBe(`<div data-signals='{"isOpen":false}'><span>nested</span></div>`);
+});

package/dist/hyper/HyperRoute.test.js

@@ -18,7 +18,9 @@ test.describe("HyperRoute.html", () => {
     test.it("renders nested JSX elements", async () => {
         const handler = RouteHttp.toWebHandler(Route.get(HyperRoute.html(_jsxs("div", { class: "container", children: [_jsx("h1", { children: "Title" }), _jsx("p", { children: "Paragraph" })] }))));
         const response = await Http.fetch(handler, { path: "/" });
-        test.expect(await response.text()).toBe("<div class=\"container\"><h1>Title</h1><p>Paragraph</p></div>");
+        test
+            .expect(await response.text())
+            .toBe('<div class="container"><h1>Title</h1><p>Paragraph</p></div>');
     });
     test.it("renders JSX from Effect", async () => {
         const handler = RouteHttp.toWebHandler(Route.get(HyperRoute.html(Effect.succeed(_jsx("span", { children: "From Effect" })))));
@@ -28,7 +30,7 @@ test.describe("HyperRoute.html", () => {
     test.it("renders JSX from generator function", async () => {
         const handler = RouteHttp.toWebHandler(Route.get(HyperRoute.html(Effect.gen(function* () {
             const name = yield* Effect.succeed("World");
-            return (_jsxs("div", { children: ["Hello ", name] }));
+            return _jsxs("div", { children: ["Hello ", name] });
         }))));
         const response = await Http.fetch(handler, { path: "/" });
         test.expect(await response.text()).toBe("<div>Hello World</div>");
@@ -57,7 +59,16 @@ test.describe("HyperRoute.html", () => {
                 username: "User123",
             }, children: "Content" }))));
         const response = await Http.fetch(handler, { path: "/" });
-        test.expect(await response.text()).toBe("<div data-signals=\"{&quot;draft&quot;:&quot;&quot;,&quot;pendingDraft&quot;:&quot;&quot;,&quot;username&quot;:&quot;User123&quot;}\">Content</div>");
+        test
+            .expect(await response.text())
+            .toBe(`<div data-signals='{"draft":"","pendingDraft":"","username":"User123"}'>Content</div>`);
+    });
+    test.it("data-on-click function argument is typed as DataEvent", () => {
+        const node = (_jsx("button", { "data-on:click": (e) => {
+                test.expectTypeOf(e).toEqualTypeOf();
+                test.expectTypeOf(e.window).toEqualTypeOf();
+            } }));
+        test.expect(node).toBeDefined();
     });
     test.it("renders script with function child as IIFE", async () => {
         const handler = RouteHttp.toWebHandler(Route.get(HyperRoute.html(_jsx("script", { children: (window) => {

package/dist/hyper/html.d.ts

@@ -0,0 +1,11 @@
+declare const HtmlStringSymbol: unique symbol;
+export interface HtmlString {
+    readonly [HtmlStringSymbol]: true;
+    readonly value: string;
+}
+export type HtmlValue = string | number | bigint | boolean | null | undefined | HtmlString | Function | Record<string, unknown> | ReadonlyArray<HtmlValue>;
+export declare const html: {
+    (strings: TemplateStringsArray, ...values: Array<HtmlValue>): HtmlString;
+    raw(value: string): HtmlString;
+};
+export {};

package/dist/hyper/html.js

@@ -0,0 +1,30 @@
+const HtmlStringSymbol = Symbol.for("HtmlString");
+const makeHtmlString = (value) => ({
+    [HtmlStringSymbol]: true,
+    value,
+});
+const isHtmlString = (value) => typeof value === "object" && value !== null && HtmlStringSymbol in value;
+const resolveValue = (value) => {
+    if (value === null || value === undefined || value === false || value === true)
+        return "";
+    if (isHtmlString(value))
+        return value.value;
+    if (Array.isArray(value))
+        return value.map(resolveValue).join("");
+    if (typeof value === "function")
+        return value.toString();
+    if (typeof value === "object")
+        return JSON.stringify(value);
+    if (typeof value === "string")
+        return value;
+    return String(value);
+};
+export const html = (strings, ...values) => {
+    let result = strings[0];
+    for (let i = 0; i < values.length; i++) {
+        result += resolveValue(values[i]);
+        result += strings[i + 1];
+    }
+    return makeHtmlString(result);
+};
+html.raw = (value) => makeHtmlString(value);

package/dist/hyper/index.d.ts

@@ -1,4 +1,6 @@
 export * as Hyper from "./Hyper.ts";
+export { html } from "./html.ts";
+export type { HtmlString, HtmlValue } from "./html.ts";
 export * as HyperHtml from "./HyperHtml.ts";
 export * as HyperNode from "./HyperNode.ts";
 export * as HyperRoute from "./HyperRoute.ts";

package/dist/hyper/index.js

@@ -1,4 +1,5 @@
 export * as Hyper from "./Hyper.js";
+export { html } from "./html.js";
 export * as HyperHtml from "./HyperHtml.js";
 export * as HyperNode from "./HyperNode.js";
 export * as HyperRoute from "./HyperRoute.js";

package/dist/hyper/jsx-runtime.d.ts

@@ -4,4 +4,4 @@ declare function Fragment(props: {
     children: JSX.Element;
 }): HyperNode.HyperNode;
 declare function jsx<T extends HyperNode.Type>(type: T, props: T extends string ? HyperNode.Props : T extends (props: infer P) => any ? P : never): HyperNode.HyperNode;
-export { Fragment, type JSX, jsx, jsx as jsxDEV, jsx as jsxs, };
+export { Fragment, type JSX, jsx, jsx as jsxDEV, jsx as jsxs };

package/dist/hyper/jsx-runtime.js

@@ -5,4 +5,4 @@ function Fragment(props) {
 function jsx(type, props) {
     return HyperNode.make(type, props);
 }
-export { Fragment, jsx, jsx as jsxDEV, jsx as jsxs, };
+export { Fragment, jsx, jsx as jsxDEV, jsx as jsxs };

package/dist/index.d.ts

@@ -4,4 +4,5 @@ export * as Entity from "./Entity.ts";
 export * as FileRouter from "./FileRouter.ts";
 export * as Route from "./Route.ts";
 export * as Start from "./Start.ts";
+export * as System from "./System.ts";
 export * as Unique from "./Unique.ts";

package/dist/index.js

@@ -4,4 +4,5 @@ export * as Entity from "./Entity.js";
 export * as FileRouter from "./FileRouter.js";
 export * as Route from "./Route.js";
 export * as Start from "./Start.js";
+export * as System from "./System.js";
 export * as Unique from "./Unique.js";

package/dist/lint/plugin.d.ts

@@ -0,0 +1,86 @@
+declare namespace _default {
+    namespace meta {
+        let name: string;
+        let version: string;
+    }
+    let rules: {
+        "prefer-namespace-import": {
+            meta: {
+                type: string;
+                docs: {
+                    description: string;
+                };
+                fixable: string;
+                hasSuggestions: boolean;
+                schema: never[];
+                messages: {
+                    preferNamespace: string;
+                };
+            };
+            create(context: any): {
+                ImportDeclaration(node: any): void;
+            };
+        };
+        "test-space-around": {
+            meta: {
+                type: string;
+                docs: {
+                    description: string;
+                };
+                fixable: string;
+                schema: never[];
+                messages: {
+                    requireBlankBefore: string;
+                    requireBlankAfter: string;
+                };
+            };
+            create(context: any): {
+                Program?: undefined;
+                BlockStatement?: undefined;
+            } | {
+                Program(node: any): void;
+                BlockStatement(node: any): void;
+            };
+        };
+        "export-default-before-functions": {
+            meta: {
+                type: string;
+                docs: {
+                    description: string;
+                };
+                schema: never[];
+                messages: {
+                    defaultAfterFunction: string;
+                };
+            };
+            create(context: any): {
+                Program(node: any): void;
+            };
+        };
+        "test-assertion-newline": {
+            meta: {
+                type: string;
+                docs: {
+                    description: string;
+                };
+                fixable: string;
+                schema: never[];
+                messages: {
+                    requireNewline: string;
+                    requireBlankBefore: string;
+                    requireBlankAfter: string;
+                };
+            };
+            create(context: any): {
+                ExpressionStatement?: undefined;
+                Program?: undefined;
+                BlockStatement?: undefined;
+            } | {
+                ExpressionStatement(node: any): void;
+                Program(node: any): void;
+                BlockStatement(node: any): void;
+            };
+        };
+    };
+}
+export default _default;