feat: ✨ add CodePen component

.vscode/extensions.json

@@ -0,0 +1,9 @@
+{
+  "recommendations": [
+    "streetsidesoftware.code-spell-checker",
+    "fivethree.vscode-svelte-snippets",
+    "svelte.svelte-vscode",
+    "ardenivanov.svelte-intellisense",
+    "bradlc.vscode-tailwindcss"
+  ]
+}

.vscode/settings.json

@@ -9,6 +9,7 @@
     "deezer",
     "Drasner",
     "Drasner's",
+    "iframe",
     "Mandal",
     "mdsvex",
     "noopener",
@@ -23,5 +24,8 @@
     "vite",
     "Zrzbx"
   ],
-  "css.validate": false
+  "css.validate": false,
+  "editor.codeActionsOnSave": {
+    "source.organizeImports": true
+  }
 }

README.md

@@ -50,22 +50,28 @@ Create an
 
 ## Developing locally
 
-If you have cloned this locally and are wondering why there's a linter
-warning for `sveltekit-embed` that's because you'll need to package
-and install the project locally.
+Import the component locally into the `index.md` file:
+
+```svelte
+import MyComponent from '$lib/components/my-component.svelte'
+```
+
+Test the package locally with the `package:local` script:
 
 ```bash
-# package with sveltkit
-npm run package
-# install local package
-npm i -D ./package
+npm run package:local
+```
+
+And add it to the import statement in the `index.md` file:
+
+```svelte
+import { MyComponent } from 'sveltekit-embed'
 ```
 
-You can use the components locally via the `src/routes/index.svelte`
-file.
+Test locally, then submit a PR 🙏
 
-If you're adding a new component to `src/lib/components` then add the
-export to `src/lib/index.ts`.
+If you're adding a new component to be used in the package then add an
+export to the `src/lib/index.ts` file.
 
 ## Thanks
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "sveltekit-embed",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "author": {
     "name": "Scott Spence",
     "email": "yo@scottspence.dev",
@@ -35,20 +35,20 @@
     }
   },
   "devDependencies": {
-    "@playwright/test": "1.22.0",
+    "@playwright/test": "1.22.2",
     "@sveltejs/adapter-auto": "next",
     "@sveltejs/kit": "next",
     "@tailwindcss/typography": "0.5.2",
     "@typescript-eslint/eslint-plugin": "5.25.0",
     "@typescript-eslint/parser": "5.25.0",
     "autoprefixer": "10.4.7",
     "daisyui": "2.15.0",
-    "eslint": "8.15.0",
+    "eslint": "8.16.0",
     "eslint-config-prettier": "8.5.0",
     "eslint-plugin-svelte3": "4.0.0",
     "husky": "8.0.1",
     "mdsvex": "0.10.5",
-    "postcss": "8.4.13",
+    "postcss": "8.4.14",
     "postcss-load-config": "3.1.4",
     "prettier": "2.6.2",
     "prettier-plugin-svelte": "2.7.0",