@alloy-js/core 0.3.0 → 0.5.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/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

@@ -20,7 +20,6 @@ it("works", () => {
   const symbol = binder.createSymbol({
     name: "sym",
     scope,
-    refkey: "foo",
   });
 
   expect([...scope.getSymbolNames()]).toEqual(["sym"]);
@@ -41,13 +40,11 @@ it("resolves symbol conflicts", () => {
   const _s1 = binder.createSymbol({
     name: "sym",
     scope,
-    refkey: "foo",
   });
 
   const s2 = binder.createSymbol({
     name: "sym",
     scope,
-    refkey: "foo",
   });
 
   expect(s2.name).toEqual("sym_2");
@@ -404,3 +401,164 @@ 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);
+  });
+});
+
+describe("refkey resolution", () => {
+  it("resolves existing symbols by refkey", () => {
+    const key = refkey();
+    const binder = createOutputBinder();
+    const sym = binder.createSymbol({
+      name: "foo",
+      refkey: key,
+      scope: binder.globalScope,
+    });
+
+    const resolvedSym = binder.resolveDeclarationByKey(
+      undefined,
+      undefined,
+      key,
+    );
+    expect(resolvedSym.value?.targetDeclaration).toBe(sym);
+  });
+
+  it("resolves symbols by refkey when symbol is added later", () => {
+    const key = refkey();
+    const binder = createOutputBinder();
+
+    const resolvedSym = binder.resolveDeclarationByKey(
+      undefined,
+      undefined,
+      key,
+    );
+
+    const sym = binder.createSymbol({
+      name: "foo",
+      refkey: key,
+      scope: binder.globalScope,
+    });
+
+    expect(resolvedSym.value?.targetDeclaration).toBe(sym);
+  });
+
+  it("resolves symbols by refkey when refkey is added later", () => {
+    const key = refkey();
+    const binder = createOutputBinder();
+
+    const resolvedSym = binder.resolveDeclarationByKey(
+      undefined,
+      undefined,
+      key,
+    );
+
+    const sym = binder.createSymbol({
+      name: "foo",
+      scope: binder.globalScope,
+    });
+
+    expect(resolvedSym.value).toBe(undefined);
+
+    sym.refkey = key;
+    expect(resolvedSym.value?.targetDeclaration).toBe(sym);
+  });
+});

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("");