Git init

.gitignore

@@ -0,0 +1,24 @@
+# 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

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.

app.vue

@@ -0,0 +1,27 @@
+<script setup lang="ts">
+const navigationItems = [
+  { label: 'Home', route: '/' },
+  { label: 'Subpage', route: '/subpage' },
+]
+</script>
+
+<template>
+  <div class="bg-surface-50 dark:bg-surface-800 dark:text-white h-screen flex flex-col">
+    <div>
+      <Menubar :model="navigationItems" class="mb-4">
+        <template #item="{ item, props }">
+          <NuxtLink v-slot="{ href, navigate }" :to="item.route" custom>
+            <a v-ripple :href="href" v-bind="props.action" @click="navigate">
+              {{ item.label }}
+            </a>
+          </NuxtLink>
+        </template>
+      </Menubar>
+      <NuxtPage />
+    </div>
+  </div>
+</template>
+
+<style>
+@import "./assets/css/base.css"
+</style>

assets/css/base.css

@@ -0,0 +1,25 @@
+:root {
+    --primary-50: 236 253 245;
+    --primary-100: 209 250 229;
+    --primary-200: 167 243 208;
+    --primary-300: 110 231 183;
+    --primary-400: 52 211 153;
+    --primary-500: 16 185 129;
+    --primary-600: 5 150 105;
+    --primary-700: 4 120 87;
+    --primary-800: 6 95 70;
+    --primary-900: 4 78 56;
+    --primary-950: 2 44 34;
+    --surface-0: 255 255 255;
+    --surface-50: 248 250 252;
+    --surface-100: 241 245 249;
+    --surface-200: 226 232 240;
+    --surface-300: 203 213 225;
+    --surface-400: 148 163 184;
+    --surface-500: 100 116 139;
+    --surface-600: 71 85 105;
+    --surface-700: 45 55 72;
+    --surface-800: 30 41 59;
+    --surface-900: 15 23 42;
+    --surface-950: 3 6 23;
+}

composables/use-host-url.ts

@@ -0,0 +1,5 @@
+export default function useHostUrl() {
+  const config = useRuntimeConfig()
+  const scheme = config.public.API_HOST.startsWith('dev.') ? 'http' : 'https'
+  return `${scheme}://${config.public.API_HOST}`
+}

eslint.config.js

@@ -0,0 +1,3 @@
+import antfu from '@antfu/eslint-config'
+
+export default antfu()

nuxt.config.ts

@@ -0,0 +1,23 @@
+import primevue from './primevue/primevue.config'
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+  devtools: {
+    enabled: true,
+    timeline: {
+      enabled: true,
+    },
+  },
+  ssr: false,
+  typescript: {
+    shim: false,
+    // typeCheck: true,
+  },
+  experimental: {
+    typedPages: true,
+    viewTransition: true,
+  },
+  modules: ['nuxt-primevue', '@nuxtjs/tailwindcss'],
+  // @ts-expect-error primevue module throwing TS error
+  primevue,
+  pages: true,
+})

package.json

@@ -0,0 +1,26 @@
+{
+  "name": "pulse-poc",
+  "type": "module",
+  "private": true,
+  "scripts": {
+    "dev": "nuxt dev",
+    "build": "nuxt generate",
+    "preview": "nuxt preview",
+    "postinstall": "nuxt prepare"
+  },
+  "devDependencies": {
+    "@antfu/eslint-config": "^2.6.4",
+    "@nuxtjs/tailwindcss": "^6.11.2",
+    "@types/grecaptcha": "^3.0.7",
+    "eslint": "^8.56.0",
+    "eslint-plugin-format": "^0.1.0",
+    "eslint-plugin-tailwindcss": "^3.14.1",
+    "nuxt": "^3.10.0",
+    "nuxt-primevue": "^0.2.2",
+    "primevue": "^3.47.2",
+    "typescript": "^5.3.3",
+    "vue": "^3.4.15",
+    "vue-router": "^4.2.5",
+    "vue-tsc": "^1.8.27"
+  }
+}

pages/index.vue

@@ -0,0 +1,6 @@
+<template>
+  <div class="m-auto w-64">
+    <h1>This is the landing page</h1>
+    <Button label="Go" severity="danger" />
+  </div>
+</template>

pages/subpage.vue

@@ -0,0 +1,6 @@
+<template>
+  <div class="m-auto w-64">
+    <h1>This is a random subpage</h1>
+    <p>It also requires you to be logged in</p>
+  </div>
+</template>

primevue/presets/accordion/index.js

@@ -0,0 +1,78 @@
+export default {
+  accordiontab: {
+    root: {
+      class: 'mb-1',
+    },
+    header: ({ props }) => ({
+      class: [
+        // State
+        { 'select-none pointer-events-none cursor-default opacity-60': props?.disabled },
+      ],
+    }),
+    headerAction: ({ context }) => ({
+      class: [
+        // Font
+        'font-bold',
+        'leading-none',
+
+        // Alignments
+        'flex items-center',
+        'relative',
+
+        // Sizing
+        'p-5',
+
+        // Shape
+        'rounded-t-md',
+        { 'rounded-br-md rounded-bl-md': !context.active, 'rounded-br-0 rounded-bl-0': context.active },
+
+        // Color
+        'border border-surface-200 dark:border-surface-700',
+        'bg-surface-50 dark:bg-surface-800',
+        'text-surface-600 dark:text-surface-0/80',
+        { 'text-surface-900': context.active },
+
+        // Transition
+        'transition duration-200 ease-in-out',
+        'transition-shadow duration-200',
+
+        // States
+        'hover:bg-surface-100 dark:hover:bg-surface-700/40',
+        'hover:text-surface-900',
+        'focus:outline-none focus:outline-offset-0 focus-visible:ring focus-visible:ring-primary-400/50 ring-inset dark:focus-visible:ring-primary-300/50', // Focus
+
+        // Misc
+        'cursor-pointer no-underline select-none',
+      ],
+    }),
+    headerIcon: {
+      class: 'inline-block mr-2',
+    },
+    headerTitle: {
+      class: 'leading-none',
+    },
+    content: {
+      class: [
+        // Spacing
+        'p-5',
+
+        // Shape
+        'rounded-tl-none rounded-tr-none rounded-br-lg rounded-bl-lg',
+        'border-t-0',
+
+        // Color
+        'bg-surface-0 dark:bg-surface-800',
+        'border border-surface-200 dark:border-surface-700',
+        'text-surface-700 dark:text-surface-0/80',
+      ],
+    },
+    transition: {
+      enterFromClass: 'max-h-0',
+      enterActiveClass: 'overflow-hidden transition-[max-height] duration-1000 ease-[cubic-bezier(0.42,0,0.58,1)]',
+      enterToClass: 'max-h-[1000px]',
+      leaveFromClass: 'max-h-[1000px]',
+      leaveActiveClass: 'overflow-hidden transition-[max-height] duration-[450ms] ease-[cubic-bezier(0,1,0,1)]',
+      leaveToClass: 'max-h-0',
+    },
+  },
+}