feat: add histoire/nuxt component lib using nuxt subproject

apps/build.gradle

@@ -43,15 +43,16 @@ task testJavaScript(type: YarnTask, dependsOn: checkFormat) {
 
 task buildJavascript(type: YarnTask, dependsOn: testJavaScript) {
     environment = ["NODE_OPTIONS": "--max-old-space-size=4096"]
-    args = ['run', 'nx', 'run-many', '--target=format:write,build,build-showcase', "--parallel=${Math.ceil(Runtime.runtime.availableProcessors() / 2)}", '--verbose']
+    args = ['run', 'nx', 'run-many', '--target=format:write,build,build-showcase,story:build', "--parallel=${Math.ceil(Runtime.runtime.availableProcessors() / 2)}", '--verbose']
     doLast {
         file("${project.projectDir}").eachDir { dir ->
-            if (dir.name == 'molgenis-components' || dir.name == 'molgenis-viz') {
+            if (dir.name == 'molgenis-components' || dir.name == 'molgenis-viz' ||  dir.name == 'nuxt-components') {
                 copy {
                     from dir.path + "/showCase"
                     into "${buildDir}/generated/main/resources/public_html/apps/" + dir.name
                 }
-            } else if (dir.name != ".gradle" && dir.name != 'build' && dir.name != 'node_modules') {
+            } 
+            else if (dir.name != ".gradle" && dir.name != 'build' && dir.name != 'node_modules') {
                 println dir.path + "/dist"
                 copy {
                     from dir.name + "/dist"

apps/nuxt-components/.gitignore

@@ -0,0 +1,36 @@
+# Nuxt dev/build outputs
+.output
+.data
+.nuxt
+.nitro
+.cache
+dist
+
+# Node dependencies
+node_modules
+
+# Logs
+logs
+*.log
+
+# Misc
+.DS_Store
+.fleet
+.idea
+
+# Local env files
+.env
+.env.*
+!.env.example
+
+# EMX2 spesific
+node_modules
+.DS_Store
+dist
+dist-ssr
+*.local
+showCase
+gen-docs
+gen
+assets/**/*.css
+!assets/**/main.css

apps/nuxt-components/README.md

@@ -0,0 +1,75 @@
+# Nuxt 3 Minimal Starter
+
+Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
+
+## Setup
+
+Make sure to install the dependencies:
+
+```bash
+# npm
+npm install
+
+# pnpm
+pnpm install
+
+# yarn
+yarn install
+
+# bun
+bun install
+```
+
+## Development Server
+
+Start the development server on `http://localhost:3000`:
+
+```bash
+# npm
+npm run dev
+
+# pnpm
+pnpm run dev
+
+# yarn
+yarn dev
+
+# bun
+bun run dev
+```
+
+## Production
+
+Build the application for production:
+
+```bash
+# npm
+npm run build
+
+# pnpm
+pnpm run build
+
+# yarn
+yarn build
+
+# bun
+bun run build
+```
+
+Locally preview production build:
+
+```bash
+# npm
+npm run preview
+
+# pnpm
+pnpm run preview
+
+# yarn
+yarn preview
+
+# bun
+bun run preview
+```
+
+Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.

apps/nuxt-components/app.vue

@@ -0,0 +1,5 @@
+<template>
+  <div>
+    <NuxtWelcome />
+  </div>
+</template>

apps/nuxt-components/assets/css/main.css

@@ -0,0 +1,61 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@font-face {
+    font-family: "Bebas Neue";
+    src: url("../fonts/BebasNeue-Regular.woff2");
+  }
+
+  @font-face {
+    font-family: "IBM Plex Sans";
+    font-weight: 400;
+    src: url("../fonts/IBMPlexSans-Regular.woff2");
+  }
+
+  @font-face {
+    font-family: "IBM Plex Sans";
+    font-weight: 700;
+    src: url("../fonts/IBMPlexSans-Bold.woff2");
+  }
+
+  @font-face {
+    font-family: "IBM Plex Sans";
+    font-weight: 700;
+    font-style: italic;
+    src: url("../fonts/IBMPlexSans-BoldItalic.woff2");
+  }
+
+  @font-face {
+    font-family: "IBM Plex Sans";
+    font-style: italic;
+    src: url("../fonts/IBMPlexSans-Italic.woff2");
+  }
+
+  @layer components {
+    [type="checkbox"]:checked {
+      background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23262626' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
+    }
+
+    [type="radio"]:checked {
+      background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23262626' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e");
+    }
+
+    [type="checkbox"],
+    [type="radio"] {
+      @apply focus:ring-0 focus:ring-offset-0;
+    }
+
+    [type="checkbox"],
+    [type="checkbox"]:checked,
+    [type="checkbox"]:checked:hover,
+    [type="checkbox"]:checked:focus,
+    [type="checkbox"]:indeterminate:hover,
+    [type="radio"],
+    [type="radio"]:checked,
+    [type="radio"]:checked:hover,
+    [type="radio"]:checked:focus {
+      @apply border-white;
+    }
+  }
+