create-mud 2.2.15-6aff69a91c627ddcc0c1dbccf7b71580e8e0a8fa → 2.2.15-7482a5ae322f26278722081838b6103ce6d264e6

package/dist/templates/react/packages/client/src/ui/icons/ArrowDownIcon.tsx

@@ -0,0 +1,22 @@
+import { DetailedHTMLProps, SVGAttributes } from "react";
+import { twMerge } from "tailwind-merge";
+
+export type Props = DetailedHTMLProps<SVGAttributes<SVGSVGElement>, SVGSVGElement>;
+
+export function ArrowDownIcon({ className, ...props }: Props) {
+  return (
+    <svg
+      className={twMerge("h-[1em] w-[1em]", className)}
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 16 16"
+      fill="currentColor"
+      {...props}
+    >
+      <path
+        fillRule="evenodd"
+        d="M8 2a.75.75 0 0 1 .75.75v8.69l3.22-3.22a.75.75 0 1 1 1.06 1.06l-4.5 4.5a.75.75 0 0 1-1.06 0l-4.5-4.5a.75.75 0 0 1 1.06-1.06l3.22 3.22V2.75A.75.75 0 0 1 8 2Z"
+        clipRule="evenodd"
+      />
+    </svg>
+  );
+}

package/dist/templates/react/packages/client/src/ui/icons/MUDIcon.tsx

@@ -0,0 +1,25 @@
+import { DetailedHTMLProps, SVGAttributes } from "react";
+import { twMerge } from "tailwind-merge";
+
+export type Props = DetailedHTMLProps<SVGAttributes<SVGSVGElement>, SVGSVGElement>;
+
+export function MUDIcon({ className, ...props }: Props) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 8 8"
+      fill="currentColor"
+      shapeRendering="crispEdges"
+      className={twMerge("-my-[0.125em] h-[1.25em] w-[1.25em]", className)}
+      {...props}
+    >
+      {/* eslint-disable-next-line max-len */}
+      <path d="M0 0h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm1 0h1v1H1zm1 0h1v1H2zm1 0h1v1H3zm1 0h1v1H4zm1 0h1v1H5zm2-1h1v1H7zm0 1h1v1H7zM6 7h1v1H6zm1-2h1v1H7zm0-1h1v1H7zm0-1h1v1H7z" />
+      <path
+        d="M2 2h1v1H2zm0 1h1v1H2zm0 1h1v1H2zm0 1h1v1H2zm1-3h1v1H3zm1 0h1v1H4zm1 0h1v1H5zm0 1h1v1H5zm0 1h1v1H5zm0 1h1v1H5zM4 5h1v1H4zM3 5h1v1H3z"
+        opacity=".5"
+      />
+      <path d="M7 2h1v1H7zm0-1h1v1H7zM1 0h1v1H1zm1 0h1v1H2zm1 0h1v1H3zm1 0h1v1H4zm1 0h1v1H5zm1 0h1v1H6zm1 0h1v1H7z" />
+    </svg>
+  );
+}

package/dist/templates/react/packages/client/src/useKeyboardMovement.ts

@@ -0,0 +1,26 @@
+import { useEffect } from "react";
+import { Direction } from "./common";
+
+const keys = new Map<KeyboardEvent["key"], Direction>([
+  ["ArrowUp", "North"],
+  ["ArrowRight", "East"],
+  ["ArrowDown", "South"],
+  ["ArrowLeft", "West"],
+]);
+
+export const useKeyboardMovement = (move: undefined | ((direction: Direction) => void)) => {
+  useEffect(() => {
+    if (!move) return;
+
+    const listener = (event: KeyboardEvent) => {
+      const direction = keys.get(event.key);
+      if (direction == null) return;
+
+      event.preventDefault();
+      move(direction);
+    };
+
+    window.addEventListener("keydown", listener);
+    return () => window.removeEventListener("keydown", listener);
+  }, [move]);
+};

package/dist/templates/react/packages/client/src/wagmiConfig.ts

@@ -0,0 +1,49 @@
+import { Chain, http, webSocket } from "viem";
+import { anvil } from "viem/chains";
+import { createWagmiConfig } from "@latticexyz/entrykit/internal";
+import { rhodolite, garnet, redstone } from "@latticexyz/common/chains";
+import { chainId } from "./common";
+
+const chains = [
+  redstone,
+  garnet,
+  rhodolite,
+  {
+    ...anvil,
+    contracts: {
+      ...anvil.contracts,
+      paymaster: {
+        address: "0xf03E61E7421c43D9068Ca562882E98d1be0a6b6e",
+      },
+    },
+    blockExplorers: {
+      default: {} as never,
+      worldsExplorer: {
+        name: "MUD Worlds Explorer",
+        url: "http://localhost:13690/anvil/worlds",
+      },
+    },
+  },
+] as const satisfies Chain[];
+
+const transports = {
+  [anvil.id]: webSocket(),
+  [garnet.id]: http(),
+  [rhodolite.id]: http(),
+  [redstone.id]: http(),
+} as const;
+
+export const wagmiConfig = createWagmiConfig({
+  chainId,
+  // TODO: swap this with another default project ID or leave empty
+  walletConnectProjectId: "14ce88fdbc0f9c294e26ec9b4d848e44",
+  appName: document.title,
+  chains,
+  transports,
+  pollingInterval: {
+    [anvil.id]: 2000,
+    [garnet.id]: 2000,
+    [rhodolite.id]: 2000,
+    [redstone.id]: 2000,
+  },
+});

package/dist/templates/react/packages/client/tailwind.config.ts

@@ -0,0 +1,10 @@
+import { Config } from "tailwindcss/types/config";
+
+export default {
+  content: ["./**/*.{html,js,jsx,ts,tsx}", "!./node_modules"],
+  theme: {},
+  plugins: [],
+  future: {
+    hoverOnlyWhenSupported: true,
+  },
+} satisfies Config;

package/dist/templates/react/packages/client/vite.config.ts

@@ -3,12 +3,6 @@ import react from "@vitejs/plugin-react";
 
 export default defineConfig({
   plugins: [react()],
-  server: {
-    port: 3000,
-    fs: {
-      strict: false,
-    },
-  },
   build: {
     target: "es2022",
     minify: true,

package/dist/templates/react/packages/contracts/gitignore

@@ -1,9 +1,13 @@
-out/
-cache/
-node_modules/
-bindings/
-artifacts/
-broadcast/
+# foundry
+cache
+broadcast
+out/*
+!out/IWorld.sol
+out/IWorld.sol/*
+!out/IWorld.sol/IWorld.abi.json
+!out/IWorld.sol/IWorld.abi.d.json.ts
 
-# Ignore MUD deploy artifacts
-deploys/**/*.json
+# mud
+.mud
+deploys
+*.db*

package/dist/templates/react/packages/contracts/mud.config.ts

@@ -2,15 +2,20 @@ import { defineWorld } from "@latticexyz/world";
 
 export default defineWorld({
   namespace: "app",
+  enums: {
+    Direction: ["North", "East", "South", "West"],
+  },
   tables: {
-    Tasks: {
-      schema: {
-        id: "bytes32",
-        createdAt: "uint256",
-        completedAt: "uint256",
-        description: "string",
-      },
-      key: ["id"],
+    Position: {
+      schema: { player: "address", x: "int32", y: "int32" },
+      key: ["player"],
     },
   },
+  modules: [
+    {
+      artifactPath:
+        "@latticexyz/world-modules/out/Unstable_CallWithSignatureModule.sol/Unstable_CallWithSignatureModule.json",
+      root: true,
+    },
+  ],
 });