Implement Map ujsx component for dynamic array mapping

src/component/index.ts

@@ -2,5 +2,7 @@ export { Operation } from "./operation.js";
 export type { OperationProps } from "./operation.js";
 export { Parallel } from "./parallel.js";
 export type { ParallelProps } from "./parallel.js";
+export { Map } from "./map.js";
+export type { MapOver, MapProps } from "./map.js";
 export { Sequential } from "./sequential.js";
 export type { SequentialProps } from "./sequential.js";

src/component/map.ts

@@ -1 +1,24 @@
-export {};
+import type { UComponent, UElement, UNode, PropValue, UniversalProps } from "@alkdev/ujsx";
+import type { Signal } from "@preact/signals-core";
+import type { CallResult } from "../schema/edge.js";
+
+export type MapOver = Signal<unknown[]> | unknown[] | ((results: Record<string, CallResult>) => unknown[]);
+
+export interface MapProps {
+  over: MapOver;
+  as: string;
+}
+
+export const Map: UComponent<MapProps & UniversalProps> = (
+  props: (MapProps & UniversalProps) & { children?: UNode[] },
+): UElement => {
+  const { over, as, children, ...rest } = props;
+  const elementProps: UniversalProps = { ...rest, over: over as PropValue, as };
+  return {
+    type: "map",
+    props: elementProps,
+    children: children ?? [],
+  };
+};
+
+Map.displayName = "Map";