@alloy-js/core 0.2.0 → 0.4.0

package/test/components/slot.test.tsx

@@ -0,0 +1,172 @@
+import { it } from "vitest";
+import { Output } from "../../src/components/Output.jsx";
+import { SourceFile } from "../../src/components/SourceFile.jsx";
+import {
+  Declaration,
+  Name,
+  OutputSymbol,
+  Ref,
+  refkey,
+  Scope,
+  useBinder,
+} from "../../src/index.js";
+import { render } from "../../src/render.js";
+import { defineSlot, rename, replace } from "../../src/slot.js";
+import "../../testing/extend-expect.js";
+
+it("works with string keys", () => {
+  interface FunctionSlotProps extends FunctionComponentProps {
+    additionalProp: string;
+  }
+
+  const FunctionSlot = defineSlot<FunctionSlotProps>(
+    (query: { name: string }) => query.name,
+  );
+
+  interface FunctionComponentProps {
+    name: string;
+  }
+
+  function MyFunctionComponent(props: FunctionComponentProps) {
+    const FunctionSlotInstance = FunctionSlot.create(
+      props.name,
+      { ...props, additionalProp: "hi" },
+      <>
+        function {props.name}() {"{"}
+          console.log("hello world");
+        {"}"}
+      </>,
+    );
+
+    return <FunctionSlotInstance />;
+  }
+
+  // extension.tsx
+  replace(FunctionSlot.find({ name: "foo" }), (props: any) => {
+    return <>
+      // original
+      { props.original }
+    </>;
+  });
+
+  const tree = render(
+    <Output>
+      <SourceFile path="test.ts" filetype="ts">
+        <MyFunctionComponent name="foo" />
+      </SourceFile>
+    </Output>,
+  );
+
+  console.log(tree.contents[0].contents);
+});
+
+it("works with symbols", () => {
+  interface FunctionSlotProps extends FunctionComponentProps {
+    additionalProp: string;
+  }
+
+  const FunctionSlot = defineSlot<FunctionSlotProps>((query: {
+    fqn: string;
+  }) => {
+    const binder = useBinder();
+    return binder.resolveFQN(query.fqn);
+  });
+
+  interface FunctionComponentProps {
+    name: string;
+  }
+
+  function MyFunctionComponent(props: FunctionComponentProps) {
+    const binder = useBinder();
+    const sym = binder.createSymbol({
+      name: props.name,
+      refkey: refkey(),
+    });
+
+    const FunctionSlotInstance = FunctionSlot.create(
+      sym,
+      { ...props, additionalProp: "hi" },
+      <Declaration symbol={sym}>
+        function <Name />() {"{"}
+          console.log("hello world");
+        {"}"}
+      </Declaration>,
+    );
+
+    return <FunctionSlotInstance />;
+  }
+
+  // extension.tsx
+  replace(FunctionSlot.find({ fqn: "foo.bar" }), (props: any) => {
+    return <>
+      // original
+      { props.original }
+    </>;
+  });
+
+  const tree = render(
+    <Output>
+      <SourceFile path="test.ts" filetype="ts">
+        <Scope name="foo">
+          <MyFunctionComponent name="bar" />
+        </Scope>
+      </SourceFile>
+    </Output>,
+  );
+
+  console.log(tree.contents[0].contents);
+});
+
+it("can rename", () => {
+  interface FunctionSlotProps extends FunctionComponentProps {
+    additionalProp: string;
+  }
+
+  const FunctionSlot = defineSlot<FunctionSlotProps>((query: {
+    fqn: string;
+  }) => {
+    const binder = useBinder();
+    return binder.resolveFQN(query.fqn);
+  });
+
+  interface FunctionComponentProps {
+    name: string;
+  }
+
+  function MyFunctionComponent(props: FunctionComponentProps) {
+    const binder = useBinder();
+    const sym = binder.createSymbol({
+      name: props.name,
+      refkey: refkey(),
+    });
+
+    const FunctionSlotInstance = FunctionSlot.create(
+      sym,
+      { ...props, additionalProp: "hi" },
+      <Declaration symbol={sym}>
+        function <Name />() {"{"}
+          console.log("hello world");
+        {"}"}
+      </Declaration>,
+    );
+
+    return <FunctionSlotInstance />;
+  }
+
+  rename(() => {
+    const binder = useBinder();
+    return binder.resolveFQN("foo.bar") as Ref<OutputSymbol | undefined>;
+  }, "bazxxx");
+
+  const tree = render(
+    <Output>
+      <SourceFile path="test.ts" filetype="ts">
+        <Scope name="foo">
+          <MyFunctionComponent name="bar" />
+        </Scope>
+      </SourceFile>
+    </Output>,
+  );
+
+  console.log(tree.contents[0].contents);
+});

package/test/components/source-file.test.tsx

@@ -43,3 +43,31 @@ it("has reactive context", () => {
 
   expect(tree.contents[1].contents).toEqual("hi.txt contents.txt");
 });
+
+it("can change its indent level", () => {
+  function Nested() {
+    return <>
+      base
+        indented
+    </>;
+  }
+  expect(
+    <Output>
+    <SourceFile path="hi.txt" filetype="text" indent="    ">
+      hello
+        there
+
+      <Nested />
+        <Nested />
+    </SourceFile>
+  </Output>,
+  ).toRenderTo(`
+    hello
+        there
+
+    base
+        indented
+        base
+            indented
+  `);
+});

package/test/rendering/basic.test.tsx

@@ -1,5 +1,5 @@
-import { Children } from "@alloy-js/core/jsx-runtime";
 import { describe, expect, it } from "vitest";
+import { Children } from "../../src/jsx-runtime.js";
 import "../../testing/extend-expect.js";
 describe("string nodes", () => {
   it("renders string nodes", () => {

package/test/symbols.test.ts

@@ -404,3 +404,105 @@ describe("instantiating members", () => {
     ).toBeDefined();
   });
 });
+
+describe("symbol name resolution", () => {
+  it("resolves static symbols", () => {
+    const binder = createOutputBinder();
+    const {
+      symbols: { static: staticSym },
+    } = createScopeTree(binder, {
+      root: {
+        symbols: {
+          root: {
+            flags:
+              OutputSymbolFlags.InstanceMemberContainer |
+              OutputSymbolFlags.StaticMemberContainer,
+            staticMembers: {
+              static: {
+                flags: OutputSymbolFlags.StaticMember,
+              },
+            },
+          },
+        },
+      },
+    });
+
+    const result = binder.resolveFQN("root.root.static");
+    expect(result.value).toEqual(staticSym);
+  });
+
+  it("resolves static symbols that are added later", () => {
+    const binder = createOutputBinder();
+    const result = binder.resolveFQN("root.root.static");
+    expect(result.value).toBeUndefined();
+
+    const {
+      symbols: { static: staticSym },
+    } = createScopeTree(binder, {
+      root: {
+        symbols: {
+          root: {
+            flags:
+              OutputSymbolFlags.InstanceMemberContainer |
+              OutputSymbolFlags.StaticMemberContainer,
+            staticMembers: {
+              static: {
+                flags: OutputSymbolFlags.StaticMember,
+              },
+            },
+          },
+        },
+      },
+    });
+
+    expect(result.value).toEqual(staticSym);
+  });
+
+  it("resolves instance symbols", () => {
+    const binder = createOutputBinder();
+    const {
+      symbols: { instance },
+    } = createScopeTree(binder, {
+      root: {
+        symbols: {
+          root: {
+            flags: OutputSymbolFlags.InstanceMemberContainer,
+            instanceMembers: {
+              instance: {
+                flags: OutputSymbolFlags.InstanceMember,
+              },
+            },
+          },
+        },
+      },
+    });
+
+    const result = binder.resolveFQN("root.root#instance");
+    expect(result.value).toEqual(instance);
+  });
+
+  it("resolves instance symbols that are added later", () => {
+    const binder = createOutputBinder();
+    const result = binder.resolveFQN("root.root#instance");
+    expect(result.value).toBeUndefined();
+
+    const {
+      symbols: { instance },
+    } = createScopeTree(binder, {
+      root: {
+        symbols: {
+          root: {
+            flags: OutputSymbolFlags.InstanceMemberContainer,
+            instanceMembers: {
+              instance: {
+                flags: OutputSymbolFlags.InstanceMember,
+              },
+            },
+          },
+        },
+      },
+    });
+
+    expect(result.value).toEqual(instance);
+  });
+});

package/testing/render.ts

@@ -1,5 +1,5 @@
 import { RenderTextTree, renderTree } from "@alloy-js/core";
-import { Children } from "@alloy-js/core/jsx-runtime";
+import { Children } from "../src/jsx-runtime.js";
 
 export function printTree(tree: RenderTextTree) {
   return (tree as any).flat(Infinity).join("");