ci: add "Preview in LiveCodes" github action

.github/workflows/livecodes-post-comment.yml

@@ -0,0 +1,21 @@
+name: comment
+
+on:
+  workflow_run:
+    workflows: ['livecodes'] # the workflow that created the artifact
+    types:
+      - completed
+
+jobs:
+  upload:
+    runs-on: ubuntu-latest
+    permissions:
+      pull-requests: write
+    if: >
+      github.event.workflow_run.event == 'pull_request' &&
+      github.event.workflow_run.conclusion == 'success'
+
+    steps:
+      - uses: live-codes/pr-comment-from-artifact@v1
+        with:
+          GITHUB_TOKEN: ${{ github.token }}

.github/workflows/livecodes-preview.yml

@@ -0,0 +1,18 @@
+name: livecodes
+
+on: [pull_request]
+
+jobs:
+  build_and_prepare:
+    runs-on: ubuntu-latest
+    name: Generate Playgrounds
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Build and generate
+        uses: live-codes/preview-in-livecodes@v1
+        with:
+          install-command: 'npm install'
+          build-command: 'npm run build'
+          base-url: 'https://deploy-preview-{{LC::PR}}--racingbars.netlify.app/'

.livecodes/js-esm.json

@@ -0,0 +1,24 @@
+{
+  "title": "RacingBars",
+  "activeEditor": "script",
+  "markup": {
+    "language": "html",
+    "content": "<div id=\"race\">Loading...</div>"
+  },
+  "style": {
+    "language": "css",
+    "content": "#race {\n  height: 80vh;\n}\n"
+  },
+  "script": {
+    "language": "javascript",
+    "content": "import { race } from \"racing-bars\";\n\n/** @type {import('racing-bars').Options} */\nconst options = {\n  dataTransform: (data) =>\n    data.map((d) => ({\n      ...d,\n      icon: `https://flagsapi.com/${d.code}/flat/64.png`,\n    })),\n  title: \"World Population in 60 Years\",\n  subTitle: \"Country Population in millions\",\n  caption: \"Source: World Bank\",\n  dateCounter: \"YYYY\",\n  showIcons: true,\n  labelsPosition: \"outside\",\n};\n\nrace(\"{{LC::TO_URL(./data/population.csv)}}\", \"#race\", options);\n"
+  },
+  "imports": {
+    "racing-bars": "{{LC::TO_URL(./lib/racing-bars.js)}}",
+    "racing-bars/react": "{{LC::TO_URL(./lib/react.js)}}",
+    "racing-bars/vue": "{{LC::TO_URL(./lib/vue.js)}}"
+  },
+  "types": {
+    "racing-bars": "{{LC::TO_URL(./lib/racing-bars.d.ts)}}"
+  }
+}