ShiboSoftwareDev/pushbutton-led-tutorial

A compact USB-C powered push-button board with a single red LED, featuring a current-limiting resistor for basic interaction and signaling.

Usage: To import and use the "@tsci/ShiboSoftwareDev.pushbutton-led-tutorial" package: 1. Import the package in your tscircuit project: ```tsx import PushButtonLedTutorial from "@tsci/ShiboSoftwareDev.pushbutton-led-tutorial" ``` 2. Use the component in a board or circuit layout: ```tsx export default () => ( <board> <PushButtonLedTutorial /> </board> ) ``` The component includes a USB-C connector, push button, LED, and a resistor, pre-configured with basic connections and positioning.

Version
0.0.1
License
unset
Stars
6

dist/index.esm.js

PCBPCB preview for dist/index.esm.js
SchematicSchematic preview for dist/index.esm.js
import { createUseComponent } from '@tscircuit/core';

function _extends$2() { return _extends$2 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$2.apply(null, arguments); }
const pinLabels$2 = {
  "1": "pos",
  "2": "neg"
};
const pinNames$1 = Object.values(pinLabels$2);
const RedLed = props => {
  return /*#__PURE__*/React.createElement("led", _extends$2({}, props, {
    cadModel: {
      objUrl: "https://modelcdn.tscircuit.com/easyeda_models/download?uuid=d0740cb8891c49a88b6949cb978926f3&pn=C965799",
      rotationOffset: {
        x: 0,
        y: 0,
        z: 0
      },
      positionOffset: {
        x: 0,
        y: 0,
        z: 0
      }
    },
    pinLabels: pinLabels$2,
    schPinSpacing: 0.75,
    schPortArrangement: {
      leftSide: {
        direction: "top-to-bottom",
        pins: [1]
      },
      rightSide: {
        direction: "bottom-to-top",
        pins: [2]
      }
    },
    supplierPartNumbers: {
      jlcpcb: ["C965799"]
    },
    footprint: /*#__PURE__*/React.createElement("footprint", null, /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["2"],
      pcbX: "-0.7995919999999614mm",
      pcbY: "-0.003428999999982807mm",
      width: "0.7999983999999999mm",
      height: "0.7999983999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["1"],
      pcbX: "0.7995919999999614mm",
      pcbY: "0.003428999999982807mm",
      width: "0.7999983999999999mm",
      height: "0.7999983999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: 0.22047200000019984,
        y: -0.3235452000000123
      }, {
        x: 0.2105660000000853,
        y: -0.3235452000000123
      }, {
        x: -0.11953239999991183,
        y: 0.006477000000018052
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: 0.22047200000019984,
        y: 0.3564890000001242
      }, {
        x: 0.22047200000019984,
        y: 0.3464814000001297
      }, {
        x: -0.11953239999991183,
        y: 0.006477000000018052
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: 0.22047200000019984,
        y: 0.3564890000001242
      }, {
        x: 0.22047200000019984,
        y: -0.3235452000000123
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: 0.24051260000010188,
        y: 0.7565136000000621
      }, {
        x: 1.3905738000000838,
        y: 0.7565136000000621
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: 0.24051260000010188,
        y: -0.7436103999999659
      }, {
        x: 1.3905738000000838,
        y: -0.7436103999999659
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: 1.3905738000000838,
        y: 0.7564628000000084
      }, {
        x: 1.3905738000000838,
        y: -0.7235189999998966
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: -0.1394967999997334,
        y: -0.7458963999999924
      }, {
        x: -1.1896089999999049,
        y: -0.7458963999999924
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: -1.4895575999997845,
        y: -0.345795599999974
      }, {
        x: -1.4895575999997845,
        y: -0.4458207999998649
      }, {
        x: -1.1896089999999049,
        y: -0.7458963999999924
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: -1.4895575999997845,
        y: 0.3541268000000173
      }, {
        x: -1.4895575999997845,
        y: -0.345795599999974
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: -1.4895575999997845,
        y: 0.3541268000000173
      }, {
        x: -1.4895575999997845,
        y: 0.4542790000000423
      }, {
        x: -1.1896089999999049,
        y: 0.7542276000000356
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: -0.1394967999997334,
        y: 0.7542276000000356
      }, {
        x: -1.1896089999999049,
        y: 0.7542276000000356
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: 0.22047200000019984,
        y: 0.006477000000018052
      }, {
        x: -0.11953239999991183,
        y: 0.006477000000018052
      }]
    }))
  }));
};
const useRedLed = createUseComponent(RedLed, pinNames$1);

function _extends$1() { return _extends$1 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$1.apply(null, arguments); }
const pinLabels$1 = {
  "pin1": "pin1",
  "pin2": "pin2",
  "pin3": "pin3",
  "pin4": "pin4"
};
const pinNames = Object.values(pinLabels$1);
const PushButton = props => {
  return /*#__PURE__*/React.createElement("pushbutton", _extends$1({}, props, {
    cadModel: {
      objUrl: "https://modelcdn.tscircuit.com/easyeda_models/download?uuid=6ef04b62f1e945518af209609f65fa6f&pn=C110153",
      rotationOffset: {
        x: 0,
        y: 0,
        z: 0
      },
      positionOffset: {
        x: 0,
        y: 0,
        z: 3.1
      }
    },
    pinLabels: pinLabels$1,
    schPinSpacing: 0.75,
    schPortArrangement: {
      leftSide: {
        direction: "top-to-bottom",
        pins: [1, 3]
      },
      rightSide: {
        direction: "bottom-to-top",
        pins: [4, 2]
      }
    },
    supplierPartNumbers: {
      jlcpcb: ["C110153"]
    },
    footprint: /*#__PURE__*/React.createElement("footprint", null, /*#__PURE__*/React.createElement("platedhole", {
      portHints: ["4"],
      pcbX: "3.2499299999998357mm",
      pcbY: "-2.249932000000058mm",
      outerDiameter: "1.9999959999999999mm",
      holeDiameter: "1.3000228mm",
      shape: "circle"
    }), /*#__PURE__*/React.createElement("platedhole", {
      portHints: ["2"],
      pcbX: "3.2499299999998357mm",
      pcbY: "2.249932000000058mm",
      outerDiameter: "1.9999959999999999mm",
      holeDiameter: "1.3000228mm",
      shape: "circle"
    }), /*#__PURE__*/React.createElement("platedhole", {
      portHints: ["1"],
      pcbX: "-3.2499299999999494mm",
      pcbY: "2.249932000000058mm",
      outerDiameter: "1.9999959999999999mm",
      holeDiameter: "1.3000228mm",
      shape: "circle"
    }), /*#__PURE__*/React.createElement("platedhole", {
      portHints: ["3"],
      pcbX: "-3.2499299999999494mm",
      pcbY: "-2.249932000000058mm",
      outerDiameter: "1.9999959999999999mm",
      holeDiameter: "1.3000228mm",
      shape: "circle"
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: -2.2743160000001126,
        y: -2.999994000000015
      }, {
        x: 2.274315999999999,
        y: -2.999994000000015
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: -2.999994000000129,
        y: 1.0999978000000965
      }, {
        x: -2.999994000000129,
        y: -0.999998000000005
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: 3.0999937999998792,
        y: 1.0279888000000028
      }, {
        x: 3.0999937999998792,
        y: -1.0999977999999828
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: -1.99999600000001,
        y: 2.999994000000015
      }, {
        x: 2.274315999999999,
        y: 2.999994000000015
      }]
    }))
  }));
};
const usePushButton = createUseComponent(PushButton, pinNames);

function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
const pinLabels = {
  1: ["GND1", "A1"],
  2: ["GND2", "B12"],
  3: ["VBUS1", "A4"],
  4: ["VBUS2", "B9"],
  5: ["SBU2", "B8"],
  6: ["CC1", "A5"],
  7: ["DM2", "B7"],
  8: ["DP1", "A6"],
  9: ["DM1", "A7"],
  10: ["DP2", "B6"],
  11: ["SBU1", "A8"],
  12: ["CC2", "B5"],
  13: ["VBUS1", "A9"],
  14: ["VBUS2", "B4"],
  15: ["GND1", "A12"],
  16: ["GND2", "B1"]
};
/**
 * USB Type C connector (C165948)
 */
const SmdUsbC = props => {
  return /*#__PURE__*/React.createElement("chip", _extends({}, props, {
    cadModel: {
      objUrl: "https://modelcdn.tscircuit.com/easyeda_models/download?uuid=2a4bc2358b36497d9ab2a66ab6419ba3&pn=C165948",
      rotationOffset: {
        x: 0,
        y: 0,
        z: 180
      },
      positionOffset: {
        x: 0,
        y: -2.5,
        z: 0
      }
    },
    pinLabels: pinLabels,
    supplierPartNumbers: {
      jlcpcb: ["C165948"]
    },
    schPortArrangement: {
      leftSide: {
        pins: [],
        direction: "top-to-bottom"
      },
      rightSide: {
        pins: ["VBUS1", "VBUS2", "DP1", "DP2", "DM1", "DM2", "CC1", "CC2", "SBU1", "SBU2"],
        direction: "top-to-bottom"
      },
      bottomSide: {
        pins: ["GND1", "GND2"],
        direction: "left-to-right"
      }
    },
    schPinStyle: {
      pin8: {
        topMargin: 0.4
      },
      pin6: {
        topMargin: 0.4
      },
      pin11: {
        topMargin: 0.2
      },
      pin2: {
        rightMargin: 1
      }
    },
    manufacturerPartNumber: "TYPE-C-31-M-12",
    footprint: /*#__PURE__*/React.createElement("footprint", null, /*#__PURE__*/React.createElement("hole", {
      pcbX: "-2.8999180000000706mm",
      pcbY: "1.180611049999925mm",
      diameter: "0.7500111999999999mm"
    }), /*#__PURE__*/React.createElement("hole", {
      pcbX: "2.8999180000000706mm",
      pcbY: "1.180611049999925mm",
      diameter: "0.7500111999999999mm"
    }), /*#__PURE__*/React.createElement("platedhole", {
      portHints: ["alt_2"],
      pcbX: "4.32511199999999mm",
      pcbY: "-2.7740863499999477mm",
      outerHeight: "1.7999964mm",
      outerWidth: "1.1999975999999999mm",
      innerHeight: "1.3999972mm",
      innerWidth: "0.7999983999999999mm",
      height: "1.3999972mm",
      shape: "pill"
    }), /*#__PURE__*/React.createElement("platedhole", {
      portHints: ["alt_1"],
      pcbX: "4.32511199999999mm",
      pcbY: "1.4057376499998782mm",
      outerHeight: "1.9999959999999999mm",
      outerWidth: "1.1999975999999999mm",
      innerHeight: "1.5999968mm",
      innerWidth: "0.7999983999999999mm",
      height: "1.5999968mm",
      shape: "pill"
    }), /*#__PURE__*/React.createElement("platedhole", {
      portHints: ["alt_0"],
      pcbX: "-4.32511199999999mm",
      pcbY: "1.4057376499998782mm",
      outerHeight: "1.9999959999999999mm",
      outerWidth: "1.1999975999999999mm",
      innerHeight: "1.5999968mm",
      innerWidth: "0.7999983999999999mm",
      height: "1.5999968mm",
      shape: "pill"
    }), /*#__PURE__*/React.createElement("platedhole", {
      portHints: ["alt_3"],
      pcbX: "-4.32511199999999mm",
      pcbY: "-2.7740863499999477mm",
      outerHeight: "1.7999964mm",
      outerWidth: "1.1999975999999999mm",
      innerHeight: "1.3999972mm",
      innerWidth: "0.7999983999999999mm",
      height: "1.3999972mm",
      shape: "pill"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["B8"],
      pcbX: "-1.7500600000000759mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["A5"],
      pcbX: "-1.2499339999999393mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["B7"],
      pcbX: "-0.7500619999999572mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["A6"],
      pcbX: "-0.2499359999999342mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["A7"],
      pcbX: "0.2499359999999342mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["B6"],
      pcbX: "0.7500619999999572mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["A8"],
      pcbX: "1.2496799999998984mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["B5"],
      pcbX: "1.7500600000000759mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["A1"],
      pcbX: "-3.3500060000000076mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["B12"],
      pcbX: "-3.0500319999999874mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["A4"],
      pcbX: "-2.5499059999999645mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["B9"],
      pcbX: "-2.249932000000058mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["B4"],
      pcbX: "2.249932000000058mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["A9"],
      pcbX: "2.5501600000000053mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["B1"],
      pcbX: "3.050032000000101mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("smtpad", {
      portHints: ["A12"],
      pcbX: "3.3500060000000076mm",
      pcbY: "2.449087049999889mm",
      width: "0.29999939999999997mm",
      height: "1.2999973999999999mm",
      shape: "rect"
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: -4.4689776000000165,
        y: -1.40071475000002
      }, {
        x: -4.4689776000000165,
        y: 0.4621974499998487
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: 4.471009600000116,
        y: -5.119096950000085
      }, {
        x: -4.4689776000000165,
        y: -5.119096950000085
      }, {
        x: -4.4689776000000165,
        y: -3.6377943500000356
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: 4.471009600000116,
        y: -1.4010703500000545
      }, {
        x: 4.471009600000116,
        y: 0.4625530499999968
      }]
    }), /*#__PURE__*/React.createElement("silkscreenpath", {
      route: [{
        x: 4.471009600000116,
        y: -5.119096950000085
      }, {
        x: 4.471009600000116,
        y: -3.6374387500002285
      }]
    }))
  }));
};
const useUsbC = createUseComponent(SmdUsbC, pinLabels);

var index = () => {
  const USBC = useUsbC("USBC");
  const Button = usePushButton("SW1");
  const Led = useRedLed("LED");
  return /*#__PURE__*/React.createElement("board", {
    width: "12mm",
    height: "30mm"
  }, /*#__PURE__*/React.createElement(USBC, {
    GND: "net.GND",
    pcbY: -10,
    VBUS: "net.VBUS"
  }), /*#__PURE__*/React.createElement(Led, {
    neg: "net.GND",
    pcbY: 12,
    schX: -10,
    schY: 0,
    schRotation: "90deg"
  }), /*#__PURE__*/React.createElement(Button, {
    pcbY: 0,
    pin2: ".R1 > .pos",
    pin3: "net.VBUS",
    schX: -4,
    schY: 0
  }), /*#__PURE__*/React.createElement("resistor", {
    name: "R1",
    footprint: "0603",
    resistance: "1k",
    pcbY: 7,
    schX: -7,
    schY: -4,
    schRotation: 90,
    supplierPartNumbers: {
      jlcpcb: ["C22548"]
    }
  }), /*#__PURE__*/React.createElement("trace", {
    from: ".R1 > .neg",
    to: Led.pos
  }));
};

export { index as default };