docs: update docs

Author: hunterliu1003

packages/docs/content/2.get-started/1.guide/3.setup.md

@@ -70,6 +70,14 @@ Use plain CSS to define a `<PlainCssConfirmModal>`{lang=ts} component with `<Vue
 
 - Basic example
   ::code-group
+    ::code-block{label="PlainCssConfirmModal.vue"}
+      :code-block-file{path="./PlainCssConfirmModal.vue" language="vue"}
+    ::
+
+    ::code-block{label="Preview.vue"}
+      :code-block-file{path="./PlainCssConfirmModalPreview.vue" language="vue"}
+    ::
+
     ::code-block{label="Preview" preview}
       ::plain-css-confirm-modal-preview
     ::
@@ -86,6 +94,14 @@ Let's take TailwindCSS for example to define a `<ConfirmModal>`{lang=ts} compone
 - Basic example
 
   ::code-group
+    ::code-block{label="ConfirmModal.vue"}
+      :code-block-file{path="./ConfirmModal.vue" language="vue"}
+    ::
+
+    ::code-block{label="Preview.vue"}
+      :code-block-file{path="./ConfirmModalPreview.vue" language="vue"}
+    ::
+
     ::code-block{label="Preview" preview}
       ::confirm-modal-preview
     ::
@@ -105,6 +121,10 @@ As a requirement to using `useModal()`{lang=ts} you must add [\<ModalsContainer>
 
 - Basic example
   ::code-group
+    ::code-block{label="Preview.vue"}
+      :code-block-file{path="./UseModalPreview.vue" language="vue"}
+    ::
+
     ::code-block{label="Preview" preview}
       ::use-modal-preview
     ::
@@ -119,6 +139,10 @@ Use `v-model` for show/hide a modal.
 
 - Basic example
   ::code-group
+    ::code-block{label="Preview.vue"}
+      :code-block-file{path="./VModelPreview.vue" language="vue"}
+    ::
+
     ::code-block{label="Preview" preview}
       ::v-model-preview
     ::
@@ -130,6 +154,10 @@ Use `v-model` for show/hide a modal.
 
 - Basic example
   ::code-group
+    ::code-block{label="Preview.vue"}
+      :code-block-file{path="./ModalIdPreview.vue" language="vue"}
+    ::
+
     ::code-block{label="Preview" preview}
       ::modal-id-preview
     ::