examples/footprinter3d/pushbutton.example.tsx

@@ -0,0 +1,13 @@
+import { JsCadView } from "jscad-fiber"
+import { Footprinter3d } from "lib/Footprinter3d"
+import { ExtrudedPads } from "lib/ExtrudedPads"
+
+const footprint = "pushbutton"
+export default () => {
+  return (
+    <JsCadView zAxisUp showGrid>
+      <Footprinter3d footprint={footprint} />
+      <ExtrudedPads footprint={footprint} />
+    </JsCadView>
+  )
+}

examples/pushButton.example.tsx

@@ -0,0 +1,11 @@
+import { JsCadView } from "jscad-fiber"
+import { PushButton } from "lib/PushButton"
+import { ExtrudedPads } from "../lib/ExtrudedPads"
+export default () => {
+  return (
+    <JsCadView zAxisUp showGrid>
+      <PushButton width={4.5} length={6.5} innerDiameter={1} />
+      <ExtrudedPads footprint="pushbutton" />
+    </JsCadView>
+  )
+}

lib/Footprinter3d.tsx

@@ -15,6 +15,7 @@ import { A1210 } from "./A1210"
 import { A2010 } from "./A2010"
 import { A2512 } from "./A2512"
 import { FemaleHeader } from "./FemaleHeader"
+import { PushButton } from "./PushButton"
 
 /**
  * Outputs a 3d model for any [footprinter string](https://github.com/tscircuit/footprinter)
@@ -33,6 +34,8 @@ export const Footprinter3d = ({ footprint }: { footprint: string }) => {
     imperial: String
     male: boolean
     female: boolean
+    id: number //innerDiameter
+    od: number //outerDiameter
   }
 
   switch (fpJson.fn) {
@@ -105,7 +108,14 @@ export const Footprinter3d = ({ footprint }: { footprint: string }) => {
     }
     case "sot235":
       return <SOT235 />
-
+    case "pushbutton":
+      return (
+        <PushButton
+          width={fpJson.w}
+          length={fpJson.h}
+          innerDiameter={fpJson.id}
+        />
+      )
     case "soic":
       return (
         <Tssop

lib/PushButton.tsx

@@ -0,0 +1,170 @@
+import {
+  Colorize,
+  Cuboid,
+  Cylinder,
+  ExtrudeLinear,
+  Polygon,
+  Rotate,
+  RoundedCuboid,
+  Translate,
+} from "jscad-fiber"
+import { getExpandedStroke } from "./utils/getExpandedStroke"
+
+export const PushButton = ({
+  width,
+  length,
+  innerDiameter = 1,
+}: { width: number; length: number; innerDiameter?: number }) => {
+  const bodyWidth = width
+  const bodyLength = length
+  const bodyHeight = width * 0.7
+  const legWidth = innerDiameter / 2.5
+  return (
+    <>
+      <RoundedCuboid
+        color="#1a1a1f"
+        center={[0, 0, bodyHeight / 2]}
+        size={[bodyLength, bodyLength, bodyHeight]}
+        roundRadius={0.3}
+      />
+      <RoundedCuboid
+        color="#f2f2f2"
+        center={[0, 0, bodyHeight + (bodyHeight * 0.1) / 2.5]}
+        size={[bodyLength, bodyLength, bodyHeight * 0.1]}
+        roundRadius={0.14}
+      />
+      <Cylinder
+        color="#1a1a1f"
+        height={bodyHeight * 0.8}
+        radius={bodyWidth / 3}
+        center={[0, 0, bodyHeight + (bodyHeight * 0.8) / 2]}
+      />
+      <Cylinder
+        color="#1a1a1f"
+        height={bodyHeight * 0.2}
+        radius={innerDiameter / 2}
+        center={[
+          bodyLength / 3,
+          bodyLength / 3,
+          bodyHeight + (bodyHeight * 0.1) / 2,
+        ]}
+      />
+      <Cylinder
+        color="#1a1a1f"
+        height={bodyHeight * 0.2}
+        radius={innerDiameter / 2}
+        center={[
+          -bodyLength / 3,
+          -bodyLength / 3,
+          bodyHeight + (bodyHeight * 0.1) / 2,
+        ]}
+      />
+      <Cylinder
+        color="#1a1a1f"
+        height={bodyHeight * 0.2}
+        radius={innerDiameter / 2}
+        center={[
+          -bodyLength / 3,
+          bodyLength / 3,
+          bodyHeight + (bodyHeight * 0.1) / 2,
+        ]}
+      />
+      <Cylinder
+        color="#1a1a1f"
+        height={bodyHeight * 0.2}
+        radius={innerDiameter / 2}
+        center={[
+          bodyLength / 3,
+          -bodyLength / 3,
+          bodyHeight + (bodyHeight * 0.1) / 2,
+        ]}
+      />
+      <PushButtonLeg
+        thickness={innerDiameter / 3}
+        width={legWidth}
+        horizontalLength={bodyLength * 0.8}
+        verticalLength={bodyHeight / 2}
+        position={{
+          x: -bodyWidth / 2,
+          y: -bodyLength / 2,
+          z: -bodyHeight * 1.2,
+        }}
+      />
+      <PushButtonLeg
+        thickness={innerDiameter / 3}
+        width={legWidth}
+        horizontalLength={bodyLength * 0.8}
+        verticalLength={bodyHeight / 2}
+        position={{
+          x: -bodyWidth / 2,
+          y: bodyLength / 2,
+          z: -bodyHeight * 1.2,
+        }}
+        rotation={Math.PI}
+      />
+      <PushButtonLeg
+        thickness={innerDiameter / 3}
+        width={legWidth}
+        horizontalLength={bodyLength * 0.8}
+        verticalLength={bodyHeight / 2}
+        position={{ x: bodyWidth / 2, y: bodyLength / 2, z: -bodyHeight * 1.2 }}
+        rotation={Math.PI}
+      />
+      <PushButtonLeg
+        thickness={innerDiameter / 3}
+        width={legWidth}
+        horizontalLength={bodyLength * 0.8}
+        verticalLength={bodyHeight / 2}
+        position={{
+          x: bodyWidth / 2 + innerDiameter / 3.6,
+          y: -bodyLength / 2,
+          z: -bodyHeight * 1.2,
+        }}
+      />
+    </>
+  )
+}
+export interface PushButtonLegProps {
+  thickness: number
+  width: number
+  horizontalLength: number
+  verticalLength: number
+  rotation?: number
+  position?: { x: number; y: number; z?: number }
+}
+
+export const PushButtonLeg = (props: PushButtonLegProps) => {
+  const {
+    thickness,
+    width,
+    horizontalLength,
+    verticalLength,
+    rotation = 0,
+    position,
+  } = props
+  const points: [number, number][] = [
+    [0, horizontalLength],
+    [-verticalLength / 3, horizontalLength / 3],
+    [-verticalLength / 5, horizontalLength / 4],
+    [0, 0],
+  ]
+  const polygon = getExpandedStroke(points, thickness)
+
+  return (
+    <Colorize color="#f2f2f2">
+      <Translate
+        offset={{
+          x: position?.x || 0,
+          y: position?.y || 0,
+          z: position?.z || 0,
+        }}
+      >
+        <Rotate rotation={[0, 55, rotation]}>
+          <ExtrudeLinear height={width}>
+            <Polygon points={polygon.map((p) => [p.y, p.x])} />
+          </ExtrudeLinear>
+        </Rotate>
+      </Translate>
+    </Colorize>
+  )
+}

package.json

@@ -1,7 +1,7 @@
 {
   "name": "jscad-electronics",
   "type": "module",
-  "version": "0.0.25",
+  "version": "0.0.26",
   "main": "./dist/index.js",
   "repository": {
     "type": "git",