restrucuture and add readme

README.md

@@ -3,8 +3,29 @@
 Vue port of shadcn-ui.
 This project is in active development by [radix vue](github.com/radix-vue/radix-vue) team. We are working on this while porting radix to vue, simultaneously.
 
+## Installation
+
+Coming soon
+
+
+## Usage
+Examples can see at [App.vue](./packages/shadcn-vue/src/App.vue)
+
+## Contributors
+
 We welcome contributors to both [radix vue](github.com/radix-vue/radix-vue) and [shadcn vue](github.com/radix-vue/shadcn-vue). We are actively looking someone that can lead the shadcn vue project based on radix-vue. Please [join our discord](https://discord.gg/dpf7BZY3) and we will get you up and running with the project, lets build them together!
 
 If you want to get notified when we release the initial version, please give it a star! Hopefully we will get them done by this month!
 
-Sincerely, radix-vue team.
+## Community
+
+- [Join us on discord!](https://discord.gg/dpf7BZY3)
+
+## Authors
+
+- @khairulhaaziq
+- @mujahidfa
+- @zernonia
+
+## License
+- MIT License

packages/shadcn-vue/src/App.vue

@@ -5,46 +5,46 @@ import {
   AccordionTrigger,
   AccordionItem,
   AccordionContent,
-} from "./components/Accordion";
+} from "./components/ui/Accordion";
-import { Alert, AlertDescription, AlertTitle } from "./components/Alert";
+import { Alert, AlertDescription, AlertTitle } from "./components/ui/Alert";
 import { Card as InternalCard } from "./components/Internal/Docs/Card";
 import { TransitionExpand } from "@morev/vue-transitions";
 import { Icon } from "@iconify/vue";
-import { Button } from "./components/Button";
+import { Button } from "./components/ui/Button";
 import {
   AlertDialog,
   AlertDialogTitle,
   AlertDialogHeader,
   AlertDialogDescription,
   AlertDialogFooter,
-} from "./components/AlertDialog";
+} from "./components/ui/AlertDialog";
 import {
   Dialog,
   DialogTitle,
   DialogHeader,
   DialogDescription,
   DialogFooter,
-} from "./components/Dialog";
+} from "./components/ui/Dialog";
-import { Avatar, AvatarFallback, AvatarImage } from "./components/Avatar";
+import { Avatar, AvatarFallback, AvatarImage } from "./components/ui/Avatar";
-import { Badge } from "./components/Badge";
+import { Badge } from "./components/ui/Badge";
-import { Checkbox } from "./components/Checkbox";
+import { Checkbox } from "./components/ui/Checkbox";
-import { Label } from "./components/Label";
+import { Label } from "./components/ui/Label";
-import { Input } from "./components/Input";
+import { Input } from "./components/ui/Input";
-import { Textarea } from "./components/Textarea";
+import { Textarea } from "./components/ui/Textarea";
-import { Switch } from "./components/Switch";
+import { Switch } from "./components/ui/Switch";
-import { Toggle } from "./components/Toggle";
+import { Toggle } from "./components/ui/Toggle";
-import { Card } from "./components/Demos";
+import { Card } from "./components/ui/Demos";
-import { AspectRatio, Image } from "./components/AspectRatio";
+import { AspectRatio, Image } from "./components/ui/AspectRatio";
 import {
   Collapsible,
   CollapsibleTrigger,
   CollapsibleContent,
-} from "./components/Collapsible";
+} from "./components/ui/Collapsible";
-import { Select, SelectContent, SelectItem, SelectLabel, SelectTrigger } from "./components/Select";
+import { Select, SelectContent, SelectItem, SelectLabel, SelectTrigger } from "./components/ui/Select";
-import { Popover, PopoverContent, PopoverTrigger } from "./components/Popover";
+import { Popover, PopoverContent, PopoverTrigger } from "./components/ui/Popover";
-import { Separator } from "./components/Separator";
+import { Separator } from "./components/ui/Separator";
-import { Tooltip, TooltipTrigger } from "./components/Tooltip";
+import { Tooltip, TooltipTrigger } from "./components/ui/Tooltip";
-import { RadioGroup, RadioGroupItem } from "./components/RadioGroup";
+import { RadioGroup, RadioGroupItem } from "./components/ui/RadioGroup";
 
 const alertDialogIsOpen = ref(false);
 const dialogIsOpen = ref(false);
@@ -184,8 +184,8 @@ const components = [
                 and remove your data from our servers.
               </AlertDialogDescription>
             </AlertDialogHeader>
-						<AlertDialogFooter><Button variant="outline"
+            <AlertDialogFooter><Button variant="outline" @click="alertDialogIsOpen = false">Cancel</Button><Button>CTA
-								@click="alertDialogIsOpen = false">Cancel</Button><Button>CTA Button</Button>
+                Button</Button>
             </AlertDialogFooter>
           </AlertDialog>
         </InternalCard>
@@ -328,8 +328,8 @@ const components = [
             </SelectTrigger>
             <SelectContent>
               <SelectLabel>Fruits</SelectLabel>
-							<SelectItem v-for="person in people" :key="person.id" :value="person.id"
+              <SelectItem v-for="person in people" :key="person.id" :value="person.id" :disabled="person.unavailable">{{
-								:disabled="person.unavailable">{{ person.name }}</SelectItem>
+                person.name }}</SelectItem>
             </SelectContent>
           </Select>
         </InternalCard>

packages/shadcn-vue/src/components/ui/Demos/Card.vue

@@ -1,7 +1,7 @@
 
 <script setup>
 import { Icon } from "@iconify/vue";
-import { Button } from "@/src/components/Button"
+import { Button } from "@/src/components/ui/Button"
 import {
 	Card,
 	CardContent,
@@ -9,7 +9,7 @@ import {
 	CardFooter,
 	CardHeader,
 	CardTitle,
-} from "@/src/components/Card"
+} from "@/src/components/ui/Card"
 
 const notifications = [
 	{