Add Rotate wrapper (#37)

* implement rotate wrapper

* formatbot: Automatically format code

* Implement Rotate wrapper

* formatbot: Automatically format code

---------

Co-authored-by: tscircuitbot <tscircuitbot@users.noreply.github.com>

examples/rotate.fixture.tsx

@@ -0,0 +1,21 @@
+import { Polygon } from "../lib"
+import { JsCadFixture } from "../lib/components/jscad-fixture"
+import { Rotate } from "../lib/jscad-fns"
+
+export default () => (
+  <JsCadFixture>
+    <Rotate angles={[0, 0, Math.PI]}>
+      <Polygon
+        points={[
+          [-2, -1],
+          [2, -1],
+          [2.5, 2],
+          [1, 1],
+          [0, 2],
+          [-1, 1],
+          [-2, 2],
+        ]}
+      />
+    </Rotate>
+  </JsCadFixture>
+)

lib/create-host-config.ts

@@ -14,13 +14,13 @@ import type {
   GeodesicSphereProps,
   PolygonProps,
   ProjectProps,
+  RotateProps,
   RoundedCuboidProps,
   RoundedCylinderProps,
   SphereProps,
   TorusProps,
   UnionProps,
 } from "./jscad-fns"
-import type { TranslateProps } from "./jscad-fns/translate"
 import type { JSCADModule, JSCADPrimitive } from "./jscad-primitives"
 
 export function createHostConfig(jscad: JSCADModule) {
@@ -245,6 +245,20 @@ export function createHostConfig(jscad: JSCADModule) {
         return jscad.transforms.translate(args, childGeometry)
       }
 
+      case "rotate": {
+        const { children, ...rotateProps } =
+          props as JSX.IntrinsicElements["rotate"]
+
+        const childrenGeometry = renderChildren(children)
+
+        const rotateGeometry = jscad.transforms.rotate(
+          rotateProps.angles,
+          childrenGeometry,
+        )
+
+        return rotateGeometry
+      }
+
       default:
         throw new Error(`Unknown element type: ${type}`)
     }

lib/intrinsic-jsx.d.ts

@@ -22,6 +22,7 @@ declare global {
       torus: FN.TorusProps
       custom: FN.CustomProps
       union: FN.UnionProps
+      rotate: { angles: [number, number, number]; children: any }
       translate: { args: [number, number, number]; children: any }
     }
   }

lib/jscad-fns/index.ts

@@ -12,6 +12,7 @@ export * from "./extrude-rotate"
 export * from "./geodesic-sphere"
 export * from "./polygon"
 export * from "./project"
+export * from "./rotate"
 export * from "./rounded-cuboid"
 export * from "./rounded-cylinder"
 export * from "./sphere"

lib/jscad-fns/rotate.tsx

@@ -0,0 +1,13 @@
+import type { Point3 } from "./translate"
+
+export type RotateProps = {
+  angles: Point3
+  children: React.ReactNode
+}
+
+export function Rotate({ angles, children }: RotateProps) {
+  if (!Array.isArray(angles)) {
+    angles = [angles.x, angles.y, angles.z]
+  }
+  return <rotate angles={angles}>{children}</rotate>
+}

lib/jscad-primitives.ts

@@ -1,3 +1,5 @@
+import type { Point3 } from "./jscad-fns"
+
 // Define a type for the JSCAD module structure we expect
 export interface JSCADModule {
   primitives: {
@@ -61,6 +63,7 @@ export interface JSCADModule {
   }
   transforms: {
     translate: (vector: [number, number, number], object: any) => any
+    rotate: (angles: Point3, object: any) => any
   }
   extrusions: {
     extrudeLinear: (