Skip to content

Commit

Permalink
ci: add demos for "Preview in LiveCodes" github action
Browse files Browse the repository at this point in the history
  • Loading branch information
hatemhosny committed Sep 1, 2024
1 parent 3162563 commit 37191b8
Show file tree
Hide file tree
Showing 6 changed files with 104 additions and 16 deletions.
18 changes: 10 additions & 8 deletions .livecodes/js-esm.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"title": "RacingBars",
"title": "JavaScript (ESM)",
"activeEditor": "script",
"markup": {
"language": "html",
Expand All @@ -13,12 +13,14 @@
"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)}}"
"customSettings": {
"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)}}"
}
}
}
26 changes: 26 additions & 0 deletions .livecodes/js-umd.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
{
"title": "JavaScript (UMD)",
"activeEditor": "script",
"markup": {
"language": "html",
"content": "<div id=\"race\">Loading...</div>\n<script src=\"{{LC::TO_URL(./lib/racing-bars.umd.js)}}\"></script>"
},
"style": {
"language": "css",
"content": "#race {\n height: 80vh;\n}\n"
},
"script": {
"language": "javascript",
"content": "/** @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\nracingBars.race(\"{{LC::TO_URL(./data/population.csv)}}\", \"#race\", options);\n"
},
"customSettings": {
"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)}}"
}
}
}
22 changes: 22 additions & 0 deletions .livecodes/react.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
{
"title": "React",
"activeEditor": "script",
"style": {
"language": "css",
"content": ".race {\n height: 80vh;\n}\n"
},
"script": {
"language": "jsx",
"content": "import RacingBars from \"racing-bars/react\";\n\nexport default function App() {\n /** @type {import('racing-bars').Options} */\n const options = {\n dataUrl: \"{{LC::TO_URL(./data/population.csv)}}\",\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\n return <RacingBars className=\"race\" {...options}>Loading...</RacingBars>;\n}\n"
},
"customSettings": {
"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)}}"
}
}
}
18 changes: 18 additions & 0 deletions .livecodes/svelte.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
{
"title": "Vue",
"activeEditor": "script",
"script": {
"language": "svelte",
"content": "<script>\n import { onMount } from \"svelte\";\n import { race } from \"racing-bars\";\n\n const 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\n onMount(() => {\n race(\"{{LC::TO_URL(./data/population.csv)}}\", \"#race\", options);\n });\n</script>\n\n<div id=\"race\">Loading...</div>\n\n<style>\n #race {\n height: 80vh;\n }\n</style>\n"
},
"customSettings": {
"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)}}"
}
}
}
18 changes: 10 additions & 8 deletions .livecodes/ts.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"title": "RacingBars",
"title": "TypeScript",
"activeEditor": "script",
"markup": {
"language": "html",
Expand All @@ -13,12 +13,14 @@
"language": "typescript",
"content": "import { race, type Options } from \"racing-bars\";\n\nconst options: 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)}}"
"customSettings": {
"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)}}"
}
}
}
18 changes: 18 additions & 0 deletions .livecodes/vue.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
{
"title": "Vue",
"activeEditor": "script",
"script": {
"language": "vue",
"content": "<script setup>\n import RacingBars from \"racing-bars/vue\";\n\n const options = {\n dataUrl: \"{{LC::TO_URL(./data/population.csv)}}\",\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</script>\n\n<template>\n <RacingBars class=\"race\" v-bind=\"options\">Loading...</RacingBars>\n</template>\n\n<style scoped>\n .race {\n height: 80vh;\n }\n</style>\n"
},
"customSettings": {
"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)}}"
}
}
}

0 comments on commit 37191b8

Please sign in to comment.