add docs supporting importing JLCPCB components using RunFrame

docs/guides/importing-modules-and-chips/importing-from-jlcpcb.mdx

@@ -4,6 +4,8 @@ sidebar_position: 2
 description: JLCPCB has a massive component catalog of 3d models and footprints.
 ---
 
+import YouTubeEmbed from '../../../src/components/YouTubeEmbed';
+
 ## Overview
 
 JLCPCB has a massive component catalog of 3d models and footprints.
@@ -55,14 +57,21 @@ export default () => (
 
 ## CLI Import
 
-To import using the CLI, run `npm install -g easyeda`. This will give you the
-`easyeda` command line tool. You can then run `easyeda convert` as shown below
+To import JLCPCB components using the tsci dev environment, follow these steps:
 
-```
-# Convert a schematic and footprint for JLCPCB part number C46749 (NE555)
-# to tscircuit component
-easyeda convert -i C46749 -o C46749.tsx
-easyeda convert -i C46749 -t tsx
-```
+1. Run `tsci dev` to start the development server
+2. In the tsci dev environment, navigate to "File -> Import"
+
+<YouTubeEmbed youtubeId="tFCGAa81KUs" />
+
+After importing, you can use the component in your circuit like this:
+
+```tsx
+import { ComponentName } from "@tsci/imported-component"
 
-This will create a `tsx` file that you can import.
+export default () => (
+  <board width="10mm" height="10mm">
+    <ComponentName />
+  </board>
+)
+```

src/components/YouTubeEmbed.tsx

@@ -0,0 +1,24 @@
+import React from 'react'
+
+interface YouTubeEmbedProps {
+  youtubeId: string;
+}
+
+const YouTubeEmbed: React.FC<YouTubeEmbedProps> = ({ youtubeId }) => {
+  return (
+    <div style={{ position: 'relative', paddingBottom: '56.25%', height: 0, overflow: 'hidden', maxWidth: '100%' }}>
+      <iframe
+        style={{ position: 'absolute', top: 0, left: 0, width: '100%', height: '100%' }}
+        src={`https://www.youtube.com/embed/${youtubeId}`}
+        title="YouTube video player"
+        frameBorder="0"
+        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+        referrerPolicy="strict-origin-when-cross-origin"
+        allowFullScreen
+      >
+      </iframe>
+    </div>
+  )
+}
+
+export default YouTubeEmbed