From 0919fa47067897dec31334dbd0d45df334cea7f9 Mon Sep 17 00:00:00 2001
From: NehemiahAklil <nehemiahaklil@gmail.com>
Date: Tue, 20 Aug 2024 22:15:38 +0300
Subject: [PATCH] Update Tags with Combobox example to make conent collapsable

---
 .../lib/registry/default/example/TagsInputComboboxDemo.vue    | 4 +++-
 .../lib/registry/new-york/example/TagsInputComboboxDemo.vue   | 4 +++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/apps/www/src/lib/registry/default/example/TagsInputComboboxDemo.vue b/apps/www/src/lib/registry/default/example/TagsInputComboboxDemo.vue
index 2dfae1bc..1c642d9d 100644
--- a/apps/www/src/lib/registry/default/example/TagsInputComboboxDemo.vue
+++ b/apps/www/src/lib/registry/default/example/TagsInputComboboxDemo.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { computed, ref } from 'vue'
-import { ComboboxAnchor, ComboboxInput, ComboboxPortal, ComboboxRoot } from 'radix-vue'
+import { ComboboxAnchor, ComboboxInput, ComboboxPortal, ComboboxRoot, ComboboxContent  } from 'radix-vue'
 import { CommandEmpty, CommandGroup, CommandItem, CommandList } from '@/lib/registry/default/ui/command'
 import { TagsInput, TagsInputInput, TagsInputItem, TagsInputItemDelete, TagsInputItemText } from '@/lib/registry/default/ui/tags-input'
 
@@ -36,6 +36,7 @@ const filteredFrameworks = computed(() => frameworks.filter(i => !modelValue.val
       </ComboboxAnchor>
 
       <ComboboxPortal>
+        <ComboboxContent>
         <CommandList
           position="popper"
           class="w-[--radix-popper-anchor-width] rounded-md mt-2 border bg-popover text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"
@@ -59,6 +60,7 @@ const filteredFrameworks = computed(() => frameworks.filter(i => !modelValue.val
             </CommandItem>
           </CommandGroup>
         </CommandList>
+        </ComboboxContent>
       </ComboboxPortal>
     </ComboboxRoot>
   </TagsInput>
diff --git a/apps/www/src/lib/registry/new-york/example/TagsInputComboboxDemo.vue b/apps/www/src/lib/registry/new-york/example/TagsInputComboboxDemo.vue
index 1cd0c08a..015fe508 100644
--- a/apps/www/src/lib/registry/new-york/example/TagsInputComboboxDemo.vue
+++ b/apps/www/src/lib/registry/new-york/example/TagsInputComboboxDemo.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { computed, ref } from 'vue'
-import { ComboboxAnchor, ComboboxInput, ComboboxPortal, ComboboxRoot } from 'radix-vue'
+import { ComboboxAnchor, ComboboxInput, ComboboxPortal, ComboboxRoot, ComboboxContent } from 'radix-vue'
 import { CommandEmpty, CommandGroup, CommandItem, CommandList } from '@/lib/registry/new-york/ui/command'
 import { TagsInput, TagsInputInput, TagsInputItem, TagsInputItemDelete, TagsInputItemText } from '@/lib/registry/new-york/ui/tags-input'
 
@@ -36,6 +36,7 @@ const filteredFrameworks = computed(() => frameworks.filter(i => !modelValue.val
       </ComboboxAnchor>
 
       <ComboboxPortal>
+        <ComboboxContent>
         <CommandList
           position="popper"
           class="w-[--radix-popper-anchor-width] rounded-md mt-2 border bg-popover text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"
@@ -59,6 +60,7 @@ const filteredFrameworks = computed(() => frameworks.filter(i => !modelValue.val
             </CommandItem>
           </CommandGroup>
         </CommandList>
+        </ComboboxContent>
       </ComboboxPortal>
     </ComboboxRoot>
   </TagsInput>