Skip to content

Commit 945d5e9

Browse files
ikushumikushum
committed
update component gallery section
1 parent cb0cd80 commit 945d5e9

File tree

9 files changed

+1197
-128
lines changed

9 files changed

+1197
-128
lines changed

‎packages/docs/components.d.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -126,6 +126,15 @@ declare module 'vue' {
126126
HomeEntry: typeof import('./src/components/home/Entry.vue')['default']
127127
HomeEpicmaxSupport: typeof import('./src/components/home/EpicmaxSupport.vue')['default']
128128
HomeFooter: typeof import('./src/components/home/Footer.vue')['default']
129+
HomeGalleryChatChat: typeof import('./src/components/home/Gallery/Chat/Chat.vue')['default']
130+
HomeGalleryChatDetail: typeof import('./src/components/home/Gallery/Chat/Detail.vue')['default']
131+
HomeGalleryChatInbox: typeof import('./src/components/home/Gallery/Chat/Inbox.vue')['default']
132+
HomeGalleryChatList: typeof import('./src/components/home/Gallery/Chat/List.vue')['default']
133+
HomeGalleryComponentGallery: typeof import('./src/components/home/Gallery/ComponentGallery.vue')['default']
134+
HomeGalleryComponents: typeof import('./src/components/home/Gallery/Components.vue')['default']
135+
HomeGalleryData: typeof import('./src/components/home/Gallery/Data.vue')['default']
136+
HomeGalleryForm: typeof import('./src/components/home/Gallery/Form.vue')['default']
137+
HomeGallerySelection: typeof import('./src/components/home/Gallery/Selection.vue')['default']
129138
HomeLogo: typeof import('./src/components/home/Logo.vue')['default']
130139
HomeMarquee: typeof import('./src/components/home/Marquee.vue')['default']
131140
HomeSnips: typeof import('./src/components/home/Snips.vue')['default']

‎packages/docs/src/components/home/ComponentGallery.vue‎

Lines changed: 0 additions & 127 deletions
This file was deleted.

‎packages/docs/src/components/home/Gallery/Chat/Chat.vue‎

Lines changed: 238 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,238 @@
1+
<template>
2+
<v-container class="bg-surface-light overflow-hidden" height="100%" fluid>
3+
<v-row class="fill-height my-0">
4+
<template v-if="!mobile">
5+
<v-col class="fill-height" cols="4">
6+
<VChatList
7+
:chats="chats"
8+
:selected-chat="selectedChat"
9+
@select-chat="selectChat"
10+
/>
11+
</v-col>
12+
13+
<v-col class="fill-height" cols="8">
14+
<VChatDetail :chat="selectedChat" :messages="messages" />
15+
</v-col>
16+
</template>
17+
18+
<template v-else>
19+
<v-col v-if="selectedChat" class="fill-height" cols="12">
20+
<VChatDetail
21+
:chat="selectedChat"
22+
:messages="messages"
23+
@back="selectedChat = null"
24+
/>
25+
</v-col>
26+
27+
<v-col v-else class="fill-height" cols="12">
28+
<VChatList
29+
:chats="chats"
30+
:selected-chat="selectedChat"
31+
@select-chat="selectChat"
32+
/>
33+
</v-col>
34+
</template>
35+
</v-row>
36+
</v-container>
37+
</template>
38+
39+
<script setup>
40+
import { ref } from 'vue'
41+
import { useDisplay } from 'vuetify'
42+
import VChatList from '@/components/home/Gallery/Chat/List.vue'
43+
import VChatDetail from '@/components/home/Gallery/Chat/Detail.vue'
44+
45+
const chats = [
46+
{
47+
id: 1,
48+
avatar: 'https://avatars.githubusercontent.com/u/9064066?v=4',
49+
name: 'John Leider',
50+
date: '2025-08-05',
51+
message: `I'll be in your neighborhood doing errands this weekend. Do you want to hang out?`,
52+
},
53+
{
54+
id: 2,
55+
avatar: 'https://avatars.githubusercontent.com/u/58872083?v=4',
56+
name: 'Heather Leider',
57+
date: '2025-08-05',
58+
message: `&mdash; Wish I could come, but I'm out of town this weekend.`,
59+
},
60+
{
61+
id: 3,
62+
avatar: 'https://avatars.githubusercontent.com/u/16421948?v=4',
63+
name: 'Kael Watts-Deuchar',
64+
date: '2025-08-05',
65+
message: 'Do you have Paris recommendations? Have you ever been?',
66+
},
67+
{
68+
id: 12,
69+
avatar: 'https://avatars.githubusercontent.com/u/17315781',
70+
name: 'Ishan Subedi',
71+
date: '2025-08-05',
72+
message: 'We should eat this: Grate, Squash, Corn, and tomatillo Tacos.',
73+
},
74+
{
75+
id: 4,
76+
avatar: 'https://avatars.githubusercontent.com/u/27827979?v=4',
77+
name: 'Andrew Henry',
78+
date: '2025-08-05',
79+
message: 'Have any ideas about what we should get Heidi for her birthday?',
80+
},
81+
{
82+
id: 5,
83+
avatar: 'https://avatars.githubusercontent.com/u/42892508?v=4',
84+
name: 'Blaine Landowski',
85+
date: '2025-08-05',
86+
message: 'We should eat this: Grate, Squash, Corn, and tomatillo Tacos.',
87+
},
88+
{
89+
id: 8,
90+
avatar: 'https://avatars.githubusercontent.com/u/20162853?s=96&v=4',
91+
name: 'Jacek Czarniecki',
92+
date: '2025-08-05',
93+
message: 'We should eat this: Grate, Squash, Corn, and tomatillo Tacos.',
94+
},
95+
{
96+
id: 9,
97+
avatar: 'https://avatars.githubusercontent.com/u/11574195',
98+
name: 'Shubham Patlani',
99+
date: '2025-08-05',
100+
message: 'We should eat this: Grate, Squash, Corn, and tomatillo Tacos.',
101+
},
102+
{
103+
id: 10,
104+
avatar: 'https://avatars.githubusercontent.com/u/47291268',
105+
name: 'Isaias Briones',
106+
date: '2025-08-05',
107+
message: 'We should eat this: Grate, Squash, Corn, and tomatillo Tacos.',
108+
},
109+
{
110+
id: 11,
111+
avatar: 'https://avatars.githubusercontent.com/u/108551827?s=96&v=4',
112+
name: 'Henry Aviles',
113+
date: '2025-08-05',
114+
message: 'We should eat this: Grate, Squash, Corn, and tomatillo Tacos.',
115+
},
116+
{
117+
id: 13,
118+
avatar: 'https://avatars.githubusercontent.com/u/11289484?s=96&v=4',
119+
name: 'Andrei Elkin',
120+
date: '2025-08-05',
121+
message: 'We should eat this: Grate, Squash, Corn, and tomatillo Tacos.',
122+
},
123+
{
124+
id: 14,
125+
avatar: 'https://avatars.githubusercontent.com/u/37642320?s=96&v=4',
126+
name: 'JC Puno',
127+
date: '2025-08-05',
128+
message: 'We should eat this: Grate, Squash, Corn, and tomatillo Tacos.',
129+
},
130+
{
131+
id: 15,
132+
avatar: 'https://gravatar.com/avatar/7d1a8ba680ab9d49bd9cdaeff05d0e76',
133+
name: 'Abdelouahed Oumoussa',
134+
date: '2025-08-05',
135+
message: 'We should eat this: Grate, Squash, Corn, and tomatillo Tacos.',
136+
},
137+
]
138+
139+
const { mobile } = useDisplay()
140+
141+
const messages = ref([
142+
{
143+
id: 1,
144+
date: '2025-08-05',
145+
message: `I'll be in your neighborhood doing errands this weekend. Do you want to hang out?`,
146+
isMine: true,
147+
},
148+
{
149+
id: 2,
150+
date: '2025-08-05',
151+
message: `Just finished that book you recommended - it was amazing! We should discuss it over coffee sometime.`,
152+
},
153+
{
154+
id: 3,
155+
date: '2025-08-05',
156+
message: 'Do you have Paris recommendations? Have you ever been?',
157+
isMine: true,
158+
},
159+
{
160+
id: 4,
161+
date: '2025-08-05',
162+
message: 'Have any ideas about what we should get Heidi for her birthday?',
163+
},
164+
{
165+
id: 5,
166+
date: '2025-08-05',
167+
isMine: true,
168+
message: 'We should eat this: Grate, Squash, Corn, and tomatillo Tacos.',
169+
},
170+
{
171+
id: 6,
172+
date: '2025-08-05',
173+
message: 'Hey, are you going to the concert next weekend? I have an extra ticket!',
174+
},
175+
{
176+
id: 7,
177+
date: '2025-08-05',
178+
message: 'Can you send me the notes from yesterday\'s meeting? I had to leave early.',
179+
isMine: true,
180+
},
181+
{
182+
id: 8,
183+
date: '2025-08-05',
184+
message: 'Check out this new recipe I tried - it turned out incredible!',
185+
},
186+
{
187+
id: 9,
188+
date: '2025-08-05',
189+
message: 'Remember that cafe we visited last summer? They\'re opening a new location downtown!',
190+
isMine: true,
191+
},
192+
{
193+
id: 10,
194+
date: '2025-08-05',
195+
message: 'Happy birthday! Hope you have an amazing day filled with joy and celebration!',
196+
},
197+
{
198+
id: 11,
199+
date: '2025-08-05',
200+
message: 'Did you see the season finale last night? We need to talk about that ending!',
201+
isMine: true,
202+
},
203+
{
204+
id: 12,
205+
date: '2025-08-05',
206+
message: 'Thanks for helping me move yesterday. I owe you dinner!',
207+
},
208+
{
209+
id: 13,
210+
date: '2025-08-05',
211+
message: 'My sister just got engaged! Save the date for the wedding in September.',
212+
isMine: true,
213+
},
214+
{
215+
id: 14,
216+
date: '2025-08-05',
217+
message: 'Found this amazing hiking trail yesterday. We should check it out this weekend!',
218+
},
219+
{
220+
id: 15,
221+
date: '2025-08-05',
222+
message: 'Can you believe it\'s been 5 years since college? Time flies!',
223+
isMine: true,
224+
},
225+
{
226+
id: 17,
227+
date: '2025-08-05',
228+
message: 'I just saw this place and thought of you!',
229+
},
230+
])
231+
232+
const selectedChat = ref(chats[0])
233+
234+
function selectChat (chat) {
235+
selectedChat.value = chat
236+
messages.value = messages.value.reverse()
237+
}
238+
</script>

0 commit comments

Comments
 (0)