feat(dht22): add dht22 element (#23)

Author: urish

src/dht22-element.stories.ts

@@ -0,0 +1,7 @@
+import { storiesOf } from '@storybook/web-components';
+import { html } from 'lit-html';
+import './dht22-element';
+
+storiesOf('DHT22', module)
+  .addParameters({ component: 'wokwi-dht22' })
+  .add('Default', () => html`<wokwi-dht22></wokwi-dht22>`);

src/dht22-element.ts

@@ -0,0 +1,49 @@
+import { customElement, html, LitElement } from 'lit-element';
+import { ElementPin } from './pin';
+
+@customElement('wokwi-dht22')
+export class DHT22Element extends LitElement {
+  readonly pinInfo: ElementPin[] = [
+    { name: 'VCC', x: 10, y: 114.9, signals: [{ type: 'power', signal: 'VCC' }], number: 1 },
+    { name: 'SDA', x: 22.4, y: 114.9, signals: [], number: 2 },
+    { name: 'NC', x: 35.3, y: 114.9, signals: [], number: 3 },
+    { name: 'GND', x: 48, y: 114.9, signals: [{ type: 'power', signal: 'GND' }], number: 4 },
+  ];
+
+  render() {
+    return html`
+      <svg
+        width="15.1mm"
+        height="30.885mm"
+        version="1.1"
+        viewBox="0 0 15.1 30.885"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <g fill="#ccc" stroke-linecap="round" stroke-width=".21">
+          <rect x="2.27" y="23.885" width=".75" height="7" rx=".2" />
+          <rect x="5.55" y="23.885" width=".75" height="7" rx=".2" />
+          <rect x="8.96" y="23.885" width=".75" height="7" rx=".2" />
+          <rect x="12.32" y="23.885" width=".75" height="7" rx=".2" />
+        </g>
+        <path
+          d="M15.05 23.995V5.033m0 0c0-.107-1.069-4.962-2.662-4.96L2.803.09C1.193.09.05 4.926.05 5.033v18.962c0 .107.086.192.192.192h14.616a.192.192 0 00.192-.192M7.615.948h.004c1.08 0 1.956.847 1.956 1.892s-.876 1.892-1.956 1.892-1.956-.847-1.956-1.892c0-1.044.873-1.89 1.952-1.892zM4.967 8.66H5.9a.21.21 0 01.211.21v.935a.21.21 0 01-.21.21h-.934a.21.21 0 01-.212-.21V8.87a.21.21 0 01.212-.211zm2.168 0h.934a.21.21 0 01.21.21v.935a.21.21 0 01-.21.21h-.934a.21.21 0 01-.21-.21V8.87a.21.21 0 01.21-.211zm2.152 0h.935a.21.21 0 01.21.21v.935a.21.21 0 01-.21.21h-.935a.21.21 0 01-.21-.21V8.87a.21.21 0 01.21-.211zm5.757 0v1.356m0 0h-3.217a.553.553 0 01-.554-.554v-.249a.55.55 0 01.554-.553h3.217M.05 8.66h3.282c.307 0 .554.247.554.553v.25a.552.552 0 01-.554.553H.05m0 1.054h3.282c.307 0 .554.247.554.554v.249a.552.552 0 01-.554.554H.05m4.917-1.357H5.9a.21.21 0 01.211.211v.934a.21.21 0 01-.21.211h-.934a.21.21 0 01-.212-.21v-.935a.21.21 0 01.212-.21zm2.168 0h.934a.21.21 0 01.211.211v.934a.21.21 0 01-.211.211h-.934a.21.21 0 01-.21-.21v-.935a.21.21 0 01.21-.21zm2.153 0h.934a.21.21 0 01.21.211v.934a.21.21 0 01-.21.211h-.934a.21.21 0 01-.211-.21v-.935a.21.21 0 01.21-.21zm2.539 0h3.217v1.356h-3.217a.552.552 0 01-.554-.553v-.25c0-.306.247-.553.554-.553zM.05 13.547h3.282c.307 0 .553.247.553.554v.249a.552.552 0 01-.553.553H.05m4.916-1.356H5.9a.21.21 0 01.211.211v.934a.21.21 0 01-.21.211h-.935a.21.21 0 01-.21-.21v-.935a.21.21 0 01.21-.21zm2.169 0h.933a.21.21 0 01.212.211v.934a.21.21 0 01-.212.211h-.933a.21.21 0 01-.211-.21v-.935a.21.21 0 01.21-.21zm2.152 0h.934a.21.21 0 01.211.211v.934a.21.21 0 01-.21.211h-.935a.21.21 0 01-.21-.21v-.935a.21.21 0 01.21-.21zm5.757 1.356h-3.217a.552.552 0 01-.554-.553v-.25c0-.306.247-.553.554-.553h3.217m0 3.791h-3.218a.553.553 0 01-.553-.554v-.249c0-.306.247-.553.553-.553h3.218m-14.994 0h3.282c.307 0 .553.247.553.553v.25a.552.552 0 01-.553.553H.05m4.916-1.356H5.9a.21.21 0 01.211.211v.934a.21.21 0 01-.21.21h-.935a.21.21 0 01-.21-.21v-.934a.21.21 0 01.21-.21zm2.169 0h.934a.21.21 0 01.21.211v.934a.21.21 0 01-.21.21h-.934a.21.21 0 01-.211-.21v-.934a.21.21 0 01.211-.21zm2.152 0h.934a.21.21 0 01.211.211v.934a.21.21 0 01-.21.21h-.935a.21.21 0 01-.21-.21v-.934a.21.21 0 01.21-.21zM.05 18.362h3.282c.307 0 .553.247.553.554v.25a.552.552 0 01-.553.552H.05m4.916-1.355H5.9a.21.21 0 01.211.21v.934a.21.21 0 01-.21.211h-.935a.21.21 0 01-.21-.21v-.934a.21.21 0 01.21-.211zm2.169 0h.933a.21.21 0 01.212.21v.934a.21.21 0 01-.212.211h-.933a.21.21 0 01-.211-.21v-.934a.21.21 0 01.21-.211zm2.152 0h.934a.21.21 0 01.211.21v.934a.21.21 0 01-.21.211h-.935a.21.21 0 01-.21-.21v-.934a.21.21 0 01.21-.211zm5.757 1.355h-3.218a.552.552 0 01-.553-.553v-.25c0-.306.247-.552.553-.552h3.218M10.49 5.056V7.31a.192.192 0 01-.193.193h-.85a.192.192 0 01-.193-.193V5.056H8.23v2.286a.192.192 0 01-.192.192h-.851a.192.192 0 01-.193-.192V5.056H5.94v2.286a.192.192 0 01-.193.192h-.85a.192.192 0 01-.193-.192V5.056C.033 5.025.05 5.033.05 5.033m15 0l-4.56.023v0"
+          fill="#f2f2f2"
+          stroke="#000"
+          stroke-linecap="round"
+          stroke-width=".1"
+        />
+        <text
+          x="3.7415893"
+          y="22.863354"
+          fill="#000000"
+          font-family="sans-serif"
+          font-size="2.2px"
+          stroke-width=".05"
+          style="line-height:1.25"
+        >
+          DHT22
+        </text>
+      </svg>
+    `;
+  }
+}

src/index.ts

@@ -16,3 +16,4 @@ export { SSD1306Element } from './ssd1306-element';
 export { BuzzerElement } from './buzzer-element';
 export { RotaryDialerElement } from './rotary-dialer-element';
 export { ServoElement } from './servo-element';
+export { DHT22Element as Dht22Element } from './dht22-element';

src/react-types.ts

@@ -15,6 +15,7 @@ import { ResistorElement } from './resistor-element';
 import { RotaryDialerElement } from './rotary-dialer-element';
 import { SSD1306Element } from './ssd1306-element';
 import { ServoElement } from './servo-element';
+import { DHT22Element } from './dht22-element';
 
 declare global {
   namespace JSX {
@@ -33,6 +34,7 @@ declare global {
       'wokwi-buzzer': Partial<BuzzerElement>;
       'wokwi-rotary-dialer': Partial<RotaryDialerElement>;
       'wokwi-servo': Partial<ServoElement>;
+      'wokwi-dht22': Partial<DHT22Element>;
     }
   }
 }