first commit

resources/js/views/demos/components/menu/DemoMenuLocation.vue

@@ -0,0 +1,60 @@
+<script setup>
+const items = [
+  {
+    title: 'Option 1',
+    value: 'Option 1',
+  },
+  {
+    title: 'Option 2',
+    value: 'Option 2',
+  },
+  {
+    title: 'Option 3',
+    value: 'Option 3',
+  },
+]
+</script>
+
+<template>
+  <div class="demo-space-x">
+    <VMenu location="top">
+      <template #activator="{ props }">
+        <VBtn v-bind="props">
+          Top
+        </VBtn>
+      </template>
+
+      <VList :items="items" />
+    </VMenu>
+
+    <VMenu location="bottom">
+      <template #activator="{ props }">
+        <VBtn v-bind="props">
+          Bottom
+        </VBtn>
+      </template>
+
+      <VList :items="items" />
+    </VMenu>
+
+    <VMenu location="start">
+      <template #activator="{ props }">
+        <VBtn v-bind="props">
+          Start
+        </VBtn>
+      </template>
+
+      <VList :items="items" />
+    </VMenu>
+
+    <VMenu location="end">
+      <template #activator="{ props }">
+        <VBtn v-bind="props">
+          End
+        </VBtn>
+      </template>
+
+      <VList :items="items" />
+    </VMenu>
+  </div>
+</template>