Initial commit from monorepo

app/pages/test-gantt.vue

@@ -0,0 +1,81 @@
+<template>
+  <Section variant="plain" paddingY="md">
+    <Stack gap="6">
+        <Heading :level="1">Test Timeline Chart</Heading>
+
+        <Card>
+          <Stack gap="4">
+            <Heading :level="3" weight="semibold">Hello World vue-timeline-chart</Heading>
+
+            <ClientOnly>
+              <Timeline
+                :groups="timelineGroups"
+                :items="timelineItems"
+                :viewportMin="Date.parse('2024-08-01')"
+                :viewportMax="Date.parse('2024-08-31')"
+                style="height: 400px;"
+              >
+                <template #group-label="{ group }">
+                  <Text weight="semibold">{{ group.label }}</Text>
+                </template>
+                <template #item="{ item }">
+                  <Pill variant="primary">{{ item.label }}</Pill>
+                </template>
+              </Timeline>
+
+              <template #fallback>
+                <Card tone="muted" padding="lg" style="height: 384px;">
+                  <Stack align="center" justify="center" gap="2" fullHeight>
+                    <Text tone="muted">Loading...</Text>
+                  </Stack>
+                </Card>
+              </template>
+            </ClientOnly>
+          </Stack>
+        </Card>
+
+        <Card tone="muted" padding="lg">
+          <Stack gap="2">
+            <Heading :level="4" weight="semibold">Debug info:</Heading>
+            <Text tag="pre" mono size="base">{{ debugInfo }}</Text>
+          </Stack>
+        </Card>
+      </Stack>
+  </Section>
+</template>
+
+<script setup>
+const timelineGroups = [
+  { id: 'group1', label: 'Stage 1' },
+  { id: 'group2', label: 'Stage 2' }
+]
+
+const timelineItems = [
+  {
+    id: 'item1',
+    group: 'group1',
+    start: Date.parse('2024-08-01'),
+    end: Date.parse('2024-08-10'),
+    label: 'Task 1'
+  },
+  {
+    id: 'item2', 
+    group: 'group2',
+    start: Date.parse('2024-08-05'),
+    end: Date.parse('2024-08-15'),
+    label: 'Task 2'
+  }
+]
+
+const debugInfo = computed(() =>
+  JSON.stringify(
+    {
+      groups: timelineGroups,
+      items: timelineItems,
+      timestamp: new Date().toISOString(),
+    },
+    null,
+    2
+  )
+)
+</script>