opti1337/chad
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects 1 Releases 38 Wiki Activity

brutalism design

Browse Source
This commit is contained in:
Opti1337
2026-05-14 01:05:01 +06:00
parent 6a2111092b
commit edef0a70d2
42 changed files with 1114 additions and 316 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
new-client/index.html
View File

@@ -8,7 +8,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Unbounded:wght@200..900&display=swap" rel="stylesheet">
<link rel="stylesheet" href="/src/shared/styles/reset.css" />
<link rel="stylesheet" href="/src/shared/styles/sanitize.css" />

8
new-client/package.json
View File

@@ -10,13 +10,21 @@
},
"dependencies": {
"@ark-ui/vue": "^5.36.2",
"@lucide/vue": "^1.14.0",
"@tanstack/vue-query": "^5.100.10",
"@tauri-apps/plugin-global-shortcut": "^2.3.1",
"@tauri-apps/plugin-opener": "~2",
"@tauri-apps/plugin-process": "^2.3.1",
"@tauri-apps/plugin-updater": "^2.10.1",
"@vueuse/core": "^14.3.0",
"@zag-js/avatar": "^1.40.0",
"@zag-js/collapsible": "^1.40.0",
"@zag-js/password-input": "^1.40.0",
"@zag-js/vue": "^1.40.0",
"date-fns": "^4.1.0",
"mitt": "^3.0.1",
"primevue": "^4.5.5",
"socket.io-client": "^4.8.3",
"vue": "^3.5.32",
"vue-router": "^5.0.6"
},

1
new-client/src-tauri/target/.rustc_info.json Normal file
View File

@@ -0,0 +1 @@
{"rustc_fingerprint":1074701663444030447,"outputs":{"17747080675513052775":{"success":true,"status":"","code":0,"stdout":"rustc 1.95.0 (59807616e 2026-04-14)\nbinary: rustc\ncommit-hash: 59807616e1fa2540724bfbac14d7976d7e4a3860\ncommit-date: 2026-04-14\nhost: x86_64-pc-windows-msvc\nrelease: 1.95.0\nLLVM version: 22.1.2\n","stderr":""},"7971740275564407648":{"success":true,"status":"","code":0,"stdout":"___.exe\nlib___.rlib\n___.dll\n___.dll\n___.lib\n___.dll\nC:\\Users\\opti\\.rustup\\toolchains\\stable-x86_64-pc-windows-msvc\npacked\n___\ndebug_assertions\npanic=\"unwind\"\nproc_macro\ntarget_abi=\"\"\ntarget_arch=\"x86_64\"\ntarget_endian=\"little\"\ntarget_env=\"msvc\"\ntarget_family=\"windows\"\ntarget_feature=\"cmpxchg16b\"\ntarget_feature=\"fxsr\"\ntarget_feature=\"sse\"\ntarget_feature=\"sse2\"\ntarget_feature=\"sse3\"\ntarget_has_atomic=\"128\"\ntarget_has_atomic=\"16\"\ntarget_has_atomic=\"32\"\ntarget_has_atomic=\"64\"\ntarget_has_atomic=\"8\"\ntarget_has_atomic=\"ptr\"\ntarget_os=\"windows\"\ntarget_pointer_width=\"64\"\ntarget_vendor=\"pc\"\nwindows\n","stderr":""}},"successes":{}}

1
new-client/src-tauri/target/debug/.fingerprint/app-4e7dc2d6835c5d74/bin-app.json Normal file
View File

@@ -0,0 +1 @@
{"rustc":8891013984288978370,"features":"[]","declared_features":"[]","target":12687594469746301899,"profile":8731458305071235362,"path":4942398508502643691,"deps":[[1322478694103194923,"app_lib",false,8070585750093435046],[1322478694103194923,"build_script_build",false,16691984141835454783],[2700615264719386388,"tauri_plugin_opener",false,7350390124577390804],[4736393929136623228,"tauri_plugin_global_shortcut",false,15267933955632970549],[5673630358394410545,"tauri_plugin_updater",false,14019643380268120922],[8695090098768911186,"windows",false,17298248671909505349],[10630857666389190470,"log",false,5016507518680283320],[12653526805862679340,"tauri_plugin_log",false,15855325777720298125],[13548984313718623784,"serde",false,7298479236282139191],[13795362694956882968,"serde_json",false,4974751760879812175],[13905323280135927163,"tauri_plugin_single_instance",false,10523578089830730283],[14261240476176424521,"tauri",false,8738078672178348289],[18393575805749125025,"tauri_plugin_process",false,17190748950968290852]],"local":[{"CheckDepInfo":{"dep_info":"debug\\.fingerprint\\app-4e7dc2d6835c5d74\\dep-bin-app","checksum":false}}],"rustflags":[],"config":8247474407144887393,"compile_kind":0}

BIN
new-client/src-tauri/target/debug/app_lib.dll.lib Normal file
View File

Binary file not shown.

11
new-client/src/app/Error.vue
View File

@@ -24,12 +24,19 @@ defineProps<{
&__image {
width: 120px;
margin-bottom: 32px;
margin-bottom: var(--space-6);
user-select: none;
opacity: 0.9;
}
&__message {
color: var(--text-muted);
@include font-body-bold;
padding: var(--space-2) var(--space-3);
background-color: var(--paper);
outline: var(--border-w) solid var(--ink);
outline-offset: calc(var(--border-w) * -1);
box-shadow: var(--shadow);
}
}
</style>

10
new-client/src/app/Preloader.vue
View File

@@ -16,10 +16,14 @@
height: 100%;
> p {
@include font-body-bold;
margin: auto;
padding: 8px 16px;
border-radius: 16px;
background-color: var(--bg-light);
padding: var(--space-2) var(--space-3);
background-color: var(--paper);
outline: var(--border-w) solid var(--ink);
outline-offset: calc(var(--border-w) * -1);
box-shadow: var(--shadow);
}
}
</style>

10
new-client/src/app/Updater.vue
View File

@@ -21,10 +21,14 @@ const { checking, lastUpdate } = useUpdater()
height: 100%;
> p {
@include font-body-bold;
margin: auto;
padding: 8px 16px;
border-radius: 16px;
background-color: var(--bg-light);
padding: var(--space-2) var(--space-3);
background-color: var(--paper);
outline: var(--border-w) solid var(--ink);
outline-offset: calc(var(--border-w) * -1);
box-shadow: var(--shadow);
}
}
</style>

9
new-client/src/app/bootstrap/app.ts
View File

@@ -2,6 +2,7 @@ import { useAuth } from '@shared/composables/use-auth'
import { createApp } from 'vue'
import App from '../App.vue'
import routerPlugin, { router } from '../plugins/router'
import tanstackQueryPlugin from '../plugins/tanstack-query'
const mountPoint = '#app'
@@ -14,8 +15,14 @@ export default async function () {
await router.isReady()
if (!authorized.value && router.currentRoute.value.meta.auth === undefined) {
router.push('/auth/login')
await router.push({ name: '/auth/login', replace: true })
}
if (authorized.value && router.currentRoute.value.meta.auth === 'guest') {
await router.push({ name: '/', replace: true })
}
app.use(tanstackQueryPlugin)
app.mount(mountPoint)
}

6
new-client/src/app/entry.ts
View File

@@ -13,16 +13,16 @@ import checkUpdates from './bootstrap/updater'
await authorize()
initializeApp()
await initializeApp()
}
catch (error) {
console.error(error)
if (error instanceof Error && error.message) {
showError(error.message)
await showError(error.message)
}
else {
showError('Something went wrong')
await showError('Something went wrong')
}
}
finally {

18
new-client/src/app/plugins/router.ts
View File

@@ -1,4 +1,5 @@
import type { Component, FunctionPlugin } from 'vue'
import { useAuth } from '@shared/composables/use-auth'
import { createRouter, createWebHistory } from 'vue-router'
import { routes } from 'vue-router/auto-routes'
@@ -13,6 +14,23 @@ export const router = createRouter({
history: createWebHistory(),
routes,
})
router.onError((e) => {
console.log('wtf', e)
})
router.isReady().then(() => {
router.beforeEach((to) => {
const { authorized } = useAuth()
if (authorized.value && to.meta.auth === 'guest') {
return { name: '/', replace: true }
}
if (!authorized.value && to.meta.auth === undefined) {
return { name: '/auth/login', replace: true }
}
})
})
export default {
install(app) {

8
new-client/src/app/plugins/tanstack-query.ts Normal file
View File

@@ -0,0 +1,8 @@
import type { FunctionPlugin } from 'vue'
import { VueQueryPlugin } from '@tanstack/vue-query'
export default {
install(app) {
app.use(VueQueryPlugin, {})
},
} as FunctionPlugin

1
new-client/src/pages/auth.vue
View File

@@ -10,5 +10,6 @@ definePage({
auth: 'guest',
layout: AuthLayout,
},
// redirect: '/auth/login',
})
</script>

66
new-client/src/pages/auth/login.vue
View File

@@ -1,35 +1,71 @@
<template>
<div class="login-page">
<form class="login-page__form" @submit.prevent="">
<div class="login-page__fields">
<ChadInput placeholder="Login" error="Jopa" />
<ChadInput placeholder="Password" />
<ChadPasswordInput placeholder="Password" label="Test" />
</div>
<ChadCard class="login-page" as="form" title="Sign In" @submit.prevent="submit">
<div class="login-page__fields">
<ChadInput v-model="formData.username" label="Username" />
<ChadPasswordInput v-model="formData.password" label="Password" />
</div>
<ChadButton class="login-page__submit" full type="submit">
<template #actions>
<ChadButton full type="submit" :disabled="!valid" :loading="submitting">
Let's go
</ChadButton>
</form>
</div>
</template>
<template #bottom>
Don't have an account?
<RouterLink :to="{ name: '/auth/register' }">
Register
</RouterLink>
</template>
</ChadCard>
</template>
<script setup lang="ts">
import ChadButton from '@shared/components/ui/Button.vue'
import ChadCard from '@shared/components/ui/Card.vue'
import ChadInput from '@shared/components/ui/Input.vue'
import ChadPasswordInput from '@shared/components/ui/PasswordInput.vue'
import { useAuth } from '@shared/composables/use-auth.ts'
import { computed, reactive, ref } from 'vue'
const { login } = useAuth()
const submitting = ref(false)
const formData = reactive({
username: '',
password: '',
})
const valid = computed(() => {
if (!formData.username)
return false
if (!formData.password)
return false
return true
})
async function submit() {
if (!valid.value || submitting.value)
return
submitting.value = true
await login(formData.username, formData.password)
submitting.value = false
}
</script>
<style lang="scss">
.login-page {
&__fields {
> *:not(:last-child) {
margin-bottom: 16px;
margin-bottom: var(--space-4);
}
}
&__submit {
margin-top: 24px;
}
}
</style>

72
new-client/src/pages/auth/register.vue
View File

@@ -1,6 +1,76 @@
<template>
Register page
<ChadCard class="register-page" as="form" title="Register" @submit.prevent="submit">
<div class="register-page__fields">
<ChadInput v-model="formData.username" label="Username" />
<ChadPasswordInput v-model="formData.password" label="Password" />
<ChadPasswordInput v-model="formData.repeatPassword" label="Repeat password" />
</div>
<template #actions>
<ChadButton full type="submit" :disabled="!valid" :loading="submitting">
Create an account
</ChadButton>
</template>
<template #bottom>
Already have an account?
<RouterLink :to="{ name: '/auth/login' }">
Sign In
</RouterLink>
</template>
</ChadCard>
</template>
<script setup lang="ts">
import ChadButton from '@shared/components/ui/Button.vue'
import ChadCard from '@shared/components/ui/Card.vue'
import ChadInput from '@shared/components/ui/Input.vue'
import ChadPasswordInput from '@shared/components/ui/PasswordInput.vue'
import { useAuth } from '@shared/composables/use-auth.ts'
import { computed, reactive, ref } from 'vue'
const { login } = useAuth()
const submitting = ref(false)
const formData = reactive({
username: '',
password: '',
repeatPassword: '',
})
const valid = computed(() => {
if (!formData.username)
return false
if (!formData.password)
return false
if (formData.password !== formData.repeatPassword)
return false
return true
})
async function submit() {
if (!valid.value || submitting.value)
return
submitting.value = true
await login(formData.username, formData.password)
submitting.value = false
}
</script>
<style lang="scss">
.register-page {
&__fields {
> *:not(:last-child) {
margin-bottom: var(--space-4);
}
}
}
</style>

6
new-client/src/pages/index.vue
View File

@@ -1,5 +1,7 @@
<template>
Index page
<Chat />
</template>
<script setup lang="ts"></script>
<script setup lang="ts">
import Chat from '@widgets/chat/ui/Chat.vue'
</script>

2
new-client/src/shared/api/generated-chad-api.ts
View File

@@ -232,7 +232,7 @@ export class HttpClient<SecurityDataType = unknown> {
fetch(...fetchParams);
private baseApiParams: RequestParams = {
credentials: "same-origin",
credentials: "include",
headers: {},
redirect: "follow",
referrerPolicy: "no-referrer",

16
new-client/src/shared/components/AppLogo.vue
View File

@@ -17,15 +17,21 @@ const { version } = useApp()
<style lang="scss">
.app-logo {
background-color: var(--ink);
padding: var(--space-2);
text-align: center;
&__title {
color: var(--primary);
font-weight: 700;
line-height: 20px;
@include font-display-22;
color: var(--yellow);
}
&__version {
font-size: 0.75rem;
color: var(--text-muted);
@include font-micro;
color: var(--grey-3);
margin-top: var(--space-1);
}
}
</style>

50
new-client/src/shared/components/ui/Avatar.vue Normal file
View File

@@ -0,0 +1,50 @@
<template>
<div class="chad-avatar" v-bind="api.getRootProps()">
<span class="chad-avatar__fallback" v-bind="api.getFallbackProps()">{{ fallback }}</span>
<img class="chad-avatar__image" :alt="fallback" :src="src" v-bind="api.getImageProps()">
</div>
</template>
<script setup lang="ts">
import * as avatar from '@zag-js/avatar'
import { normalizeProps, useMachine } from '@zag-js/vue'
import { computed, useId } from 'vue'
defineOptions({
name: 'ChadAvatar',
})
defineProps<{
src: string
fallback: string
size?: 'sm'
}>()
const service = useMachine(avatar.machine, { id: useId() })
const api = computed(() => avatar.connect(service, normalizeProps))
</script>
<style lang="scss">
.chad-avatar {
outline: var(--border-w) solid var(--ink);
outline-offset: calc(var(--border-w) * -1);
width: 40px;
aspect-ratio: 1;
&__fallback {
@include font-label;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
&__image {
width: 100%;
height: 100%;
object-fit: cover;
}
}
</style>

36
new-client/src/shared/components/ui/Button.vue
View File

@@ -2,6 +2,7 @@
<button
class="chad-button"
:data-loading="loading || undefined"
:data-disabled="disabled || undefined"
:disabled="disabled"
:type="type"
:data-full="full || undefined"
@@ -32,28 +33,43 @@ interface Props {
<style lang="scss">
.chad-button {
@include font-display-14;
border: none;
color: var(--bg-dark);
border-radius: 12px;
padding-inline: 12px;
color: var(--ink);
padding-inline: var(--space-3);
height: 44px;
background-color: var(--primary);
background-color: var(--yellow);
font-weight: 700;
text-align: center;
cursor: pointer;
transition-property: color, background-color;
transition-duration: 150ms;
transition-timing-function: ease-out;
outline: none;
outline: var(--border-w) solid var(--ink);
outline-offset: calc(var(--border-w) * -1);
&[data-full] {
width: 100%;
}
&:hover,
&:focus,
&:focus {
background-color: var(--yellow-deep);
}
&:active {
background-color: var(--secondary);
background-color: var(--ink);
color: var(--yellow);
}
&[data-disabled],
&[data-loading],
&:disabled {
cursor: not-allowed;
background-color: var(--grey-1);
color: var(--grey-3);
}
&[data-loading] {
cursor: wait;
}
}
</style>

68
new-client/src/shared/components/ui/Card.vue Normal file
View File

@@ -0,0 +1,68 @@
<template>
<Component :is="as" class="chad-card">
<p v-if="title" class="chad-card__title">
{{ title }}
</p>
<div class="chad-card__content">
<slot />
</div>
<div v-if="!!slots.actions" class="chad-card__actions">
<slot name="actions" />
</div>
<div v-if="!!slots.bottom" class="chad-card__bottom">
<slot name="bottom" />
</div>
</Component>
</template>
<script setup lang="ts">
defineOptions({
name: 'ChadCard',
})
withDefaults(
defineProps<Props>(),
{
as: 'div',
},
)
const slots = defineSlots<{
default: []
actions: []
bottom: []
}>()
interface Props {
as?: string
title?: string
}
</script>
<style lang="scss">
.chad-card {
display: block;
background-color: var(--paper);
padding: var(--space-6);
outline: var(--border-w) solid var(--ink);
outline-offset: calc(var(--border-w) * -1);
box-shadow: var(--shadow);
&__title {
@include font-display-22;
margin-bottom: var(--space-6);
}
&__actions {
margin-top: var(--space-6);
}
&__bottom {
margin-top: var(--space-4);
}
}
</style>

111
new-client/src/shared/components/ui/Input.vue
View File

@@ -1,40 +1,47 @@
<template>
<FieldRoot class="chad-input" :invalid="!!error">
<FieldLabel v-if="label" class="chad-input__label">
<div
class="chad-input"
:class="{
'is-invalid': !!error,
}"
>
<label v-if="label" :for="inputId" class="chad-input__label">
{{ label }}
</FieldLabel>
</label>
<div class="chad-input__control">
<FieldInput v-model="modelValue" class="chad-input__input" :placeholder="placeholder" type="text" />
</div>
<input :id="inputId" v-model="modelValue" class="chad-input__input" :placeholder="placeholder" type="text">
<FieldHelperText v-if="helper" class="chad-input__helper">
<p v-if="helper" class="chad-input__helper">
{{ helper }}
</FieldHelperText>
<FieldErrorText v-if="error" class="chad-input__error">
</p>
<p v-if="error" class="chad-input__error">
{{ error }}
</FieldErrorText>
</FieldRoot>
</p>
</div>
</template>
<script setup lang="ts">
import type { FieldInputProps, FieldRootProps } from '@ark-ui/vue/field'
import { FieldErrorText, FieldHelperText, FieldInput, FieldLabel, FieldRoot } from '@ark-ui/vue/field'
import { computed, useId } from 'vue'
defineOptions({
name: 'ChadInput',
})
defineProps<Props>()
const modelValue = defineModel<FieldInputProps['modelValue']>('modelValue')
interface Props extends Omit<FieldRootProps, 'ids' | 'invalid'> {
interface Props {
id?: string
label?: string
placeholder?: string
helper?: string
error?: string
}
defineOptions({
name: 'ChadInput',
})
const props = defineProps<Props>()
const modelValue = defineModel<string>('modelValue')
const inputId = computed(() => {
return props.id ?? `input-${useId()}`
})
</script>
<style lang="scss">
@@ -42,47 +49,30 @@ interface Props extends Omit<FieldRootProps, 'ids' | 'invalid'> {
$self: &;
&__label {
@include font-label;
display: block;
color: var(--text-muted);
margin-bottom: 6px;
font-size: 0.75rem;
}
&__control {
border-radius: 12px;
padding-inline: 12px;
height: 44px;
background-color: var(--bg-light);
border: none;
outline: 1px solid var(--border);
outline-offset: -1px;
font-size: 1rem;
transition-property: background-color, outline-color;
transition-duration: 150ms;
transition-timing-function: ease-out;
&:hover,
&:focus-within {
outline-color: var(--primary);
}
#{$self}[data-invalid] & {
outline-color: var(--danger);
}
color: var(--grey-3);
margin-bottom: var(--space-2);
}
&__input {
padding-inline: var(--space-3);
height: 44px;
background-color: var(--paper);
outline: var(--border-w) solid var(--ink);
outline-offset: calc(var(--border-w) * -1);
width: 100%;
height: 100%;
background: none;
border: none;
outline: none;
color: var(--text);
caret-color: var(--secondary);
color: var(--ink);
caret-color: var(--yellow);
caret-shape: block;
&::placeholder {
color: var(--text-muted);
font: inherit;
color: var(--grey-3);
opacity: 0.4;
font-style: italic;
}
&:-webkit-autofill,
@@ -94,21 +84,26 @@ interface Props extends Omit<FieldRootProps, 'ids' | 'invalid'> {
box-shadow: 0 0 0px 1000px var(--bg) inset;
background-color: var(--bg);
}
#{$self}.is-invalid & {
outline-color: var(--red);
}
}
&__helper,
&__error {
@include font-micro;
display: block;
font-size: 0.75rem;
margin-top: 6px;
margin-top: var(--space-1);
}
&__helper {
color: var(--text-muted);
color: var(--grey-3);
}
&__error {
color: var(--danger);
color: var(--red);
}
}
</style>

165
new-client/src/shared/components/ui/PasswordInput.vue
View File

@@ -1,126 +1,131 @@
<template>
<FieldRoot class="chad-password-input" :invalid="!!error">
<FieldLabel v-if="label" class="chad-password-input__label">
<div class="chad-password-input" v-bind="api.getRootProps()">
<label v-if="label" class="chad-password-input__label" v-bind="api.getLabelProps()">
{{ label }}
</FieldLabel>
</label>
<PasswordInputRoot>
<PasswordInputControl class="chad-password-input__control">
<PasswordInputInput v-model="modelValue" class="chad-password-input__input" :placeholder="placeholder" />
<PasswordInputVisibilityTrigger class="chad-password-input__visibility-trigger">
<PasswordInputIndicator>
Z
<template #fallback>
X
</template>
</PasswordInputIndicator>
</PasswordInputVisibilityTrigger>
</PasswordInputControl>
</PasswordInputRoot>
<div class="chad-password-input__control" v-bind="api.getControlProps()">
<input v-bind="api.getInputProps()" v-model="modelValue" class="chad-password-input__input">
<FieldHelperText v-if="helper" class="chad-password-input__helper">
{{ helper }}
</FieldHelperText>
<FieldErrorText v-if="error" class="chad-password-input__error">
{{ error }}
</FieldErrorText>
</FieldRoot>
<button class="chad-password-input__visibility-trigger" v-bind="api.getVisibilityTriggerProps()">
<Component :is="api.visible ? EyeIcon : EyeOffIcon " v-bind="api.getIndicatorProps()" />
</button>
</div>
</div>
</template>
<script setup lang="ts">
import type { FieldInputProps, FieldRootProps } from '@ark-ui/vue/field'
import { FieldErrorText, FieldHelperText, FieldLabel, FieldRoot } from '@ark-ui/vue/field'
import { PasswordInputControl, PasswordInputIndicator, PasswordInputInput, PasswordInputRoot, PasswordInputVisibilityTrigger } from '@ark-ui/vue/password-input'
import { EyeIcon, EyeOffIcon } from '@lucide/vue'
import * as passwordInput from '@zag-js/password-input'
import { normalizeProps, useMachine } from '@zag-js/vue'
import { computed, useId } from 'vue'
defineOptions({
name: 'ChadPasswordInput',
})
defineProps<Props>()
const modelValue = defineModel<FieldInputProps['modelValue']>('modelValue')
interface Props extends Omit<FieldRootProps, 'ids' | 'invalid'> {
interface Props {
id?: string
label?: string
placeholder?: string
helper?: string
error?: string
}
defineOptions({
name: 'ChadPasswordInput',
})
const props = defineProps<Props>()
const modelValue = defineModel<string>('modelValue')
const inputId = computed(() => {
return props.id ?? `input-${useId()}`
})
const service = useMachine(passwordInput.machine, computed(() => {
return {
id: inputId.value,
ignorePasswordManagers: true,
autoComplete: undefined,
}
}))
const api = computed(() => passwordInput.connect(service, normalizeProps))
</script>
<style lang="scss">
.chad-password-input {
$self: &;
&__label {
@include font-label;
display: block;
color: var(--text-muted);
margin-bottom: 6px;
font-size: 0.75rem;
color: var(--grey-3);
margin-bottom: var(--space-2);
}
&__control {
position: relative;
border-radius: 12px;
padding-inline: 12px;
display: flex;
align-items: center;
height: 44px;
width: 100%;
background-color: var(--bg-light);
border: none;
outline: 1px solid var(--border);
outline-offset: -1px;
color: var(--text);
caret-color: var(--secondary);
font-size: 1rem;
&:hover,
&:focus {
outline-color: var(--primary);
}
&::placeholder {
color: var(--text-muted);
opacity: 0.4;
}
&[data-invalid] {
outline-color: var(--danger);
}
&:-webkit-autofill,
&:-webkit-autofill:enabled,
&:-webkit-autofill:hover,
&:-webkit-autofill:focus {
-webkit-text-fill-color: var(--text);
-webkit-box-shadow: 0 0 0px 1000px var(--bg) inset;
box-shadow: 0 0 0px 1000px var(--bg) inset;
background-color: var(--bg);
}
}
&__input {
flex: 1;
padding-inline: var(--space-3);
background-color: var(--paper);
outline: var(--border-w) solid var(--ink);
outline-offset: calc(var(--border-w) * -1);
width: 100%;
height: 100%;
background: none;
border: none;
outline: none;
color: var(--ink);
caret-color: var(--yellow);
caret-shape: block;
&::placeholder {
font: inherit;
color: var(--grey-3);
opacity: 0.4;
font-style: italic;
}
&[data-state='invalid'] {
outline-color: var(--red);
}
}
&__visibility-trigger {
position: absolute;
flex-shrink: 0;
background-color: var(--grey-1);
border: var(--border-w) solid var(--ink);
aspect-ratio: 1;
border-left: 0;
height: 100%;
&:hover,
&:focus {
background-color: var(--grey-2);
}
&:active {
background-color: var(--grey-3);
}
}
&__helper,
&__error {
@include font-micro;
display: block;
font-size: 0.75rem;
margin-top: 6px;
margin-top: var(--space-1);
}
&__helper {
color: var(--text-muted);
color: var(--grey-3);
}
&__error {
color: var(--danger);
color: var(--red);
}
}
</style>

7
new-client/src/shared/composables/use-auth.ts
View File

@@ -1,4 +1,5 @@
import type { User } from '../api/generated-chad-api'
import { router } from '@app/plugins/router'
import { createGlobalState } from '@vueuse/core'
import { computed, readonly, shallowRef } from 'vue'
import api from '../api/client'
@@ -20,6 +21,8 @@ export const useAuth = createGlobalState(() => {
})
setMe(response.data)
await router.push({ name: '/', replace: true })
}
catch {
setMe(undefined)
@@ -34,6 +37,8 @@ export const useAuth = createGlobalState(() => {
})
setMe(response.data)
await router.push({ name: '/', replace: true })
}
catch {}
}
@@ -43,6 +48,8 @@ export const useAuth = createGlobalState(() => {
await api.chad.authLogout()
setMe(undefined)
await router.push({ name: '/auth/login' })
}
catch {}
}

43
new-client/src/shared/composables/use-event-bus.ts Normal file
View File

@@ -0,0 +1,43 @@
import type { EventType } from 'mitt'
import mitt from 'mitt'
export interface AppEvents extends Record<EventType, unknown> {
// 'socket:connected': void
// 'socket:disconnected': void
// 'socket:authenticated': { socketId: string }
//
// 'client:added': ChadClient
// 'client:removed': ChadClient
// 'client:updated': { socketId: string, oldClient: ChadClient, updatedClient: Partial<ChadClient> }
//
// 'consumer:added': Consumer
// 'consumer:removed': Consumer
// 'consumer:paused': Consumer
// 'consumer:resumed': Consumer
//
// 'producer:added': Producer
// 'producer:removed': Producer
// 'producer:paused': Producer
// 'producer:resumed': Producer
'audio:muted': void
'audio:unmuted': void
'output:muted': void
'output:unmuted': void
'video:enabled': void
'video:disabled': void
'share:enabled': void
'share:disabled': void
'chat:new-message': void
}
const emitter = mitt<AppEvents>()
export function useEventBus() {
return {
emit: emitter.emit,
on: emitter.on,
off: emitter.off,
}
}

87
new-client/src/shared/composables/use-signaling.ts Normal file
View File

@@ -0,0 +1,87 @@
import type { Socket } from 'socket.io-client'
import { createSharedComposable } from '@vueuse/core'
import { io } from 'socket.io-client'
import { parseURL } from 'ufo'
import { onScopeDispose, ref, shallowRef, watch } from 'vue'
import { useAuth } from './use-auth'
import { useEventBus } from './use-event-bus'
export const useSignaling = createSharedComposable(() => {
const { emit } = useEventBus()
const { me } = useAuth()
const socket = shallowRef<Socket>()
const connected = ref(false)
watch(socket, (socket, prevSocket) => {
if (prevSocket) {
prevSocket.close()
}
if (!socket) {
return
}
if (import.meta.dev) {
socket.onAny((event, ...args) => {
console.info('[onAny]', event, args)
})
socket.onAnyOutgoing((event, ...args) => {
console.info('[onAnyOutgoing]', event, args)
})
}
socket.on('connect', async () => {
connected.value = true
})
socket.on('disconnect', async () => {
connected.value = false
})
}, { immediate: true, flush: 'sync' })
watch(connected, (connected) => {
if (connected)
emit('socket:connected')
else
emit('socket:disconnected')
}, { immediate: true })
watch(me, (me) => {
if (!me) {
socket.value?.close()
socket.value = undefined
}
})
onScopeDispose(() => {
socket.value?.close()
socket.value = undefined
})
function connect() {
if (socket.value || !me.value)
return
const { protocol, host, pathname } = parseURL(__API_BASE_URL__)
const uri = host ? `${protocol}//${host}` : ``
socket.value = io(uri, {
path: `${pathname}/ws`,
transports: ['websocket'],
withCredentials: true,
auth: {
userId: me.value.id,
},
})
}
return {
socket,
connected,
connect,
}
})

12
new-client/src/shared/layouts/Auth.vue
View File

@@ -27,18 +27,12 @@ defineOptions({
&__container {
margin: auto;
width: 100%;
max-width: 380px;
max-width: 440px;
}
&__logo {
text-align: center;
margin-bottom: 24px;
}
&__content {
padding: 24px;
background-color: var(--bg);
border-radius: 36px;
justify-self: center;
margin-bottom: var(--space-6);
}
}
</style>

90
new-client/src/shared/layouts/Default.vue
View File

@@ -1,30 +1,42 @@
<template>
<div class="default-layout">
<header class="app-header">
<div class="app-header__sidebar">
<AppLogo />
<header class="header">
<div class="header__left">
<p class="header__app-title">
Chad
</p>
<p class="header__version">
{{ version }}
</p>
</div>
<div class="app-header__content">
Header
<div class="header__right">
<p class="header__title">
Messages
</p>
</div>
</header>
<aside class="app-sidebar">
Sidebar
<aside class="sidebar">
<ChannelList class="sidebar__channel-list" />
</aside>
<div class="default-layout__content">
<div class="content">
<slot />
</div>
</div>
</template>
<script setup lang="ts">
import AppLogo from '@shared/components/AppLogo.vue'
import { useApp } from '@shared/composables/use-app.js'
import ChannelList from '@widgets/channel-list/ui/ChannelList.vue'
defineOptions({
name: 'DefaultLayout',
})
const { version } = useApp()
</script>
<style lang="scss">
@@ -37,46 +49,62 @@ defineOptions({
grid-template-rows: auto 1fr;
grid-template-areas: 'header header' 'sidebar content';
&__content {
grid-area: content;
}
.app-header {
.header {
grid-area: header;
display: grid;
grid-template-columns: var(--sidebar-width) 1fr;
align-items: stretch;
background-color: var(--bg);
border-bottom: 1px solid var(--border-muted);
height: 52px;
height: 56px;
border-bottom: var(--border-w) solid var(--ink);
&__sidebar {
border-right: 1px solid var(--border-muted);
}
&__sidebar,
&__content {
&__left {
display: flex;
align-items: center;
padding: 8px;
justify-content: space-between;
background-color: var(--ink);
padding-inline: var(--space-4);
}
&__title {
font-weight: 700;
&__app-title {
@include font-display-14;
color: var(--white);
}
&__version {
margin-left: 4px;
color: var(--text-muted);
font-size: 0.75rem;
@include font-micro;
color: var(--grey-3);
}
&__right {
display: flex;
align-items: center;
padding-inline: var(--space-4);
}
&__title {
@include font-display-14;
}
}
.app-sidebar {
.sidebar {
grid-area: sidebar;
background-color: var(--bg);
border-right: 1px solid var(--border-muted);
padding: 8px;
display: flex;
flex-direction: column;
border-right: var(--border-w) solid var(--ink);
overflow-y: auto;
&__channel-list {
flex: 1;
}
}
.content {
grid-area: content;
overflow-y: auto;
}
}
</style>

44
new-client/src/shared/styles/main.scss
View File

@@ -3,27 +3,41 @@
html,
body,
[data-mount-point]:not(:empty) {
height: 100%;
height: 100%;
}
[data-mount-point]:empty {
display: none;
display: none;
}
body {
background-color: var(--bg-dark);
color: var(--text);
height: 100%;
@include font-body;
background-color: var(--paper);
color: var(--ink);
height: 100%;
}
*,
*::before,
*::after {
font-family: 'Inter', sans-serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
font-variation-settings:
'wdth' 100,
'YTLC' 500;
a {
background-color: var(--yellow);
text-decoration: none;
color: var(--ink);
padding-inline: var(--space-1);
outline: none;
&:focus,
&:hover {
background-color: var(--yellow-deep);
}
&:active {
background-color: var(--ink);
color: var(--yellow);
}
}
//
//*,
//*::before,
//*::after {
// @include font-body;
//}

1
new-client/src/shared/styles/mixins.scss Normal file
View File

@@ -0,0 +1 @@
@forward 'mixins/typography';

54
new-client/src/shared/styles/mixins/typography.scss Normal file
View File

@@ -0,0 +1,54 @@
$display-font-family: 'Unbounded', 'Manrope', system-ui, sans-serif;
$regular-font-family: 'Manrope', system-ui, sans-serif;
@mixin font-display-36 {
font-family: $display-font-family;
font-size: 36px;
letter-spacing: 0.01em;
text-transform: uppercase;
font-weight: 900;
}
@mixin font-display-22 {
font-family: $display-font-family;
font-size: 22px;
letter-spacing: 0.02em;
text-transform: uppercase;
font-weight: 900;
}
@mixin font-display-14 {
font-family: $display-font-family;
font-size: 14px;
letter-spacing: 0.02em;
text-transform: uppercase;
font-weight: 900;
}
@mixin font-body {
font-family: $regular-font-family;
font-size: 14px;
font-weight: 400;
}
@mixin font-body-bold {
font-family: $regular-font-family;
font-size: 14px;
font-weight: 700;
}
@mixin font-label {
font-family: $regular-font-family;
font-size: 12px;
letter-spacing: 0.12em;
text-transform: uppercase;
font-weight: 700;
}
@mixin font-micro {
font-family: $regular-font-family;
font-size: 10px;
letter-spacing: 0.1em;
text-transform: uppercase;
font-weight: 500;
}

85
new-client/src/shared/styles/tokens.scss
View File

@@ -1,64 +1,25 @@
:root {
/* hsl (fallback color) */
--bg-dark: hsl(208 100% 2%);
--bg: hsl(201 86% 4%);
--bg-light: hsl(198 56% 8%);
--text: hsl(199 100% 93%);
--text-muted: hsl(199 36% 68%);
--highlight: hsl(199 28% 37%);
--border: hsl(198 40% 26%);
--border-muted: hsl(197 70% 15%);
--primary: hsl(198 69% 65%);
--secondary: hsl(20 68% 69%);
--danger: hsl(9 26% 64%);
--warning: hsl(52 19% 57%);
--success: hsl(146 17% 59%);
--info: hsl(217 28% 65%);
/* oklch */
--bg-dark: oklch(0.1 0.025 228);
--bg: oklch(0.15 0.025 228);
--bg-light: oklch(0.2 0.025 228);
--text: oklch(0.96 0.05 228);
--text-muted: oklch(0.76 0.05 228);
--highlight: oklch(0.5 0.05 228);
--border: oklch(0.4 0.05 228);
--border-muted: oklch(0.3 0.05 228);
--primary: oklch(0.76 0.1 228);
--secondary: oklch(0.76 0.1 48);
--danger: oklch(0.7 0.05 30);
--warning: oklch(0.7 0.05 100);
--success: oklch(0.7 0.05 160);
--info: oklch(0.7 0.05 260);
}
[data-theme="light"] {
/* hsl (fallback color) */
--bg-dark: hsl(199 53% 89%);
--bg: hsl(199 100% 94%);
--bg-light: hsl(199 100% 99%);
--text: hsl(204 100% 4%);
--text-muted: hsl(198 40% 26%);
--highlight: hsl(199 100% 99%);
--border: hsl(199 22% 49%);
--border-muted: hsl(199 28% 61%);
--primary: hsl(193 100% 16%);
--secondary: hsl(23 81% 25%);
--danger: hsl(9 21% 41%);
--warning: hsl(52 23% 34%);
--success: hsl(147 19% 36%);
--info: hsl(217 22% 41%);
/* oklch */
--bg-dark: oklch(0.92 0.025 228);
--bg: oklch(0.96 0.025 228);
--bg-light: oklch(1 0.025 228);
--text: oklch(0.15 0.05 228);
--text-muted: oklch(0.4 0.05 228);
--highlight: oklch(1 0.05 228);
--border: oklch(0.6 0.05 228);
--border-muted: oklch(0.7 0.05 228);
--primary: oklch(0.4 0.1 228);
--secondary: oklch(0.4 0.1 48);
--danger: oklch(0.5 0.05 30);
--warning: oklch(0.5 0.05 100);
--success: oklch(0.5 0.05 160);
--info: oklch(0.5 0.05 260);
--white: #fff;
--paper: #f4f1e8;
--ink: #0d0d0d;
--yellow: #ffd400;
--yellow-deep: #f5c400;
--red: #ff3b30;
--green: #1f9d55;
--grey-1: #ededed;
--grey-2: #c9c6bd;
--grey-3: #8a8a82;
--shadow: 6px 6px 0 0 var(--ink);
--border-w: 2px;
--space-1: 4px;
--space-2: 8px;
--space-3: 12px;
--space-4: 16px;
--space-5: 20px;
--space-6: 24px;
--space-7: 28px;
--space-8: 32px;
}

7
new-client/src/shared/types.ts Normal file
View File

@@ -0,0 +1,7 @@
export interface ChadClient {
socketId: string
userId: string
channelId: string
inputMuted?: boolean
outputMuted?: boolean
}

16
new-client/src/widgets/channel-list/api/qChannelList.ts Normal file
View File

@@ -0,0 +1,16 @@
import type { Channel, ResponseError } from '@shared/api/generated-chad-api.ts'
import api from '@shared/api/client.ts'
import { useQuery } from '@tanstack/vue-query'
export function qChannelList() {
return useQuery<Channel[], ResponseError>({
queryKey: ['channel-list'],
queryFn: async () => {
const response = await api.chad.channelList()
return response.data
},
placeholderData: () => [],
staleTime: Infinity,
})
}

41
new-client/src/widgets/channel-list/ui/ChannelItem.vue Normal file
View File

@@ -0,0 +1,41 @@
<template>
<li v-bind="api.getRootProps()" class="channel">
<div class="channel__header" v-bind="api.getTriggerProps()">
{{ channel.name }}
</div>
<div v-bind="api.getContentProps()" class="channel__content">
Clients...
</div>
</li>
</template>
<script setup lang="ts">
import type { Channel } from '@shared/api/generated-chad-api.ts'
import type { ChadClient } from '@shared/types.ts'
import * as collapsible from '@zag-js/collapsible'
import { normalizeProps, useMachine } from '@zag-js/vue'
import { computed } from 'vue'
const props = defineProps<{
channel: Channel
clients: ChadClient[]
}>()
const service = useMachine(collapsible.machine, { id: '1' })
const api = computed(() => collapsible.connect(service, normalizeProps))
</script>
<style lang="scss">
.channel {
padding-inline: var(--space-3);
&__header {
@include font-micro;
padding-block: var(--space-2);
color: var(--grey-3);
}
}
</style>

22
new-client/src/widgets/channel-list/ui/ChannelList.vue Normal file
View File

@@ -0,0 +1,22 @@
<template>
<div class="channel-list">
<ul class="channel-list__list">
<ChannelItem v-for="channel in channels" :key="channel.id" :channel="channel" />
</ul>
</div>
</template>
<script setup lang="ts">
import { qChannelList } from '../api/qChannelList.ts'
import ChannelItem from './ChannelItem.vue'
const { data: channels } = qChannelList()
</script>
<style lang="scss">
.channel-list {
> *:not(:last-child) {
margin-bottom: var(--space-6);
}
}
</style>

33
new-client/src/widgets/chat/api/qChatMessages.ts Normal file
View File

@@ -0,0 +1,33 @@
import type { ChatMessage, ResponseError } from '@shared/api/generated-chad-api.ts'
import type { InfiniteData, QueryKey } from '@tanstack/vue-query'
import api from '@shared/api/client.ts'
import { useInfiniteQuery } from '@tanstack/vue-query'
interface Response {
messages: ChatMessage[]
nextCursor?: string
}
type PageParam = string | undefined
export function qChatMessages() {
return useInfiniteQuery<Response, ResponseError, InfiniteData<Response, PageParam>, QueryKey, PageParam>({
queryKey: ['chat-messages'],
queryFn: async ({ pageParam }) => {
const response = await api.chad.chatMessages({ cursor: pageParam, limit: 30 })
return {
messages: response.data.messages.reverse(),
nextCursor: response.data.nextCursor,
}
},
select: data => ({
pages: [...data.pages].reverse(),
pageParams: [...data.pageParams].reverse(),
}),
initialPageParam: undefined,
getNextPageParam: (lastPage) => {
return lastPage.nextCursor
},
shallow: true,
})
}

12
new-client/src/widgets/chat/composables/use-chat.ts Normal file
View File

@@ -0,0 +1,12 @@
import { createGlobalState } from '@vueuse/core'
import { qChatMessages } from '../api/qChatMessages.ts'
export const useChat = createGlobalState(() => {
const { data: messages, hasNextPage: hasMoreMessages, fetchNextPage } = qChatMessages()
return {
messages,
hasMoreMessages,
fetchNextPage,
}
})

24
new-client/src/widgets/chat/ui/Chat.vue Normal file
View File

@@ -0,0 +1,24 @@
<template>
<div class="chat">
<button v-if="hasMoreMessages" type="button" @click="fetchNextPage()">
Load more
</button>
<div v-if="messages" class="chat__messages">
<template v-for="(page, pageIdx) in messages.pages" :key="pageIdx">
<ChatMessage v-for="message in page.messages" :key="message.id" :message="message" />
</template>
</div>
</div>
</template>
<script setup lang="ts">
import ChatMessage from '@widgets/chat/ui/ChatMessage.vue'
import { useChat } from '../composables/use-chat'
const { messages, hasMoreMessages, fetchNextPage } = useChat()
</script>
<style lang="scss">
</style>

47
new-client/src/widgets/chat/ui/ChatMessage.vue Normal file
View File

@@ -0,0 +1,47 @@
<template>
<div class="chat-message">
<ChadAvatar class="chat-message__avatar" src="" :fallback="initials" />
<p class="chat-message__sender">
{{ message.senderId }}
</p>
<p class="chat-message__body">
{{ message.text }}
</p>
</div>
</template>
<script setup lang="ts">
import type { ChatMessage } from '@shared/api/generated-chad-api.ts'
import ChadAvatar from '@shared/components/ui/Avatar.vue'
import { computed } from 'vue'
const props = defineProps<{
message: ChatMessage
}>()
const initials = computed(() => props.message.senderId.slice(props.message.senderId.length - 2))
</script>
<style lang="scss">
.chat-message {
display: grid;
grid-template-columns: auto 1fr;
grid-template-areas: 'avatar sender' 'avatar body';
column-gap: var(--space-3);
padding: var(--space-3) var(--space-6);
&__avatar {
grid-area: avatar;
}
&__sender {
@include font-body-bold;
grid-area: sender;
}
&__body {
grid-area: body;
}
}
</style>

19
new-client/vite.config.ts
View File

@@ -3,7 +3,6 @@ import VuePlugin from '@vitejs/plugin-vue'
import { defineConfig } from 'vite'
import VueRouterPlugin from 'vue-router/vite'
// https://vite.dev/config/
export default defineConfig({
plugins: [
VueRouterPlugin(),
@@ -20,15 +19,15 @@ export default defineConfig({
{ find: '@', replacement: path.resolve(__dirname, './src') },
],
},
// css: {
// preprocessorOptions: {
// scss: {
// additionalData: `
// @use '${path.resolve(__dirname, './shared/styles/tokens.scss')}'' as *;
// `,
// },
// },
// },
css: {
preprocessorOptions: {
scss: {
additionalData: `
@use "@shared/styles/mixins.scss" as *;
`,
},
},
},
server: {
port: 3000,
strictPort: true,

109
new-client/yarn.lock
View File

@@ -442,6 +442,11 @@
"@jridgewell/resolve-uri" "^3.1.0"
"@jridgewell/sourcemap-codec" "^1.4.14"
"@lucide/vue@^1.14.0":
version "1.14.0"
resolved "https://registry.yarnpkg.com/@lucide/vue/-/vue-1.14.0.tgz#e85ed1165d1b5e8ec1012a83a704191ce4268046"
integrity sha512-0s2fsXJGXYqcuyigsRtoTPqbeGGFOiLTYMDFfYvWO4rQNOongaJe1XDiExOLiybbI9+uQPBr5aGoiCdQNlSfQg==
"@napi-rs/wasm-runtime@^1.1.4":
version "1.1.4"
resolved "https://registry.yarnpkg.com/@napi-rs/wasm-runtime/-/wasm-runtime-1.1.4.tgz#a46bbfedc29751b7170c5d23bc1d8ee8c7e3c1e1"
@@ -777,6 +782,11 @@
resolved "https://registry.yarnpkg.com/@sindresorhus/base62/-/base62-1.0.0.tgz#c47c42410e5212e4fa4657670e118ddfba39acd6"
integrity sha512-TeheYy0ILzBEI/CO55CP6zJCSdSWeRtGnHy8U8dWSUH4I68iqTsy7HkMktR4xakThc9jotkPQUXT4ITdbV7cHA==
"@socket.io/component-emitter@~3.1.0":
version "3.1.2"
resolved "https://registry.yarnpkg.com/@socket.io/component-emitter/-/component-emitter-3.1.2.tgz#821f8442f4175d8f0467b9daf26e3a18e2d02af2"
integrity sha512-9BCxFwvbGg/RsZK9tjXd8s4UcwR0MWeFQ1XEKIQVVvAGJyINdrqKMcTRyLoK8Rse1GjzLV9cwjWV1olXRWEXVA==
"@stylistic/eslint-plugin@^5.10.0":
version "5.10.0"
resolved "https://registry.yarnpkg.com/@stylistic/eslint-plugin/-/eslint-plugin-5.10.0.tgz#471bbd9f7a27ceaac4a217e7f5b3890855e5640c"
@@ -796,6 +806,28 @@
dependencies:
tslib "^2.8.0"
"@tanstack/match-sorter-utils@^8.19.4":
version "8.19.4"
resolved "https://registry.yarnpkg.com/@tanstack/match-sorter-utils/-/match-sorter-utils-8.19.4.tgz#dacf772b5d94f4684f10dbeb2518cf72dccab8a5"
integrity sha512-Wo1iKt2b9OT7d+YGhvEPD3DXvPv2etTusIMhMUoG7fbhmxcXCtIjJDEygy91Y2JFlwGyjqiBPRozme7UD8hoqg==
dependencies:
remove-accents "0.5.0"
"@tanstack/query-core@5.100.10":
version "5.100.10"
resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-5.100.10.tgz#aeb34d301fd4ff9762e67dfa018adc33b7a18be4"
integrity sha512-8UR0yJR+GiQ40m3lPhUr0xbfAupe6GSQiksSBSa9SM2NjezFyxXCIA69/lz8cSoNKZLrw1/PktIyQBJcVeMi3w==
"@tanstack/vue-query@^5.100.10":
version "5.100.10"
resolved "https://registry.yarnpkg.com/@tanstack/vue-query/-/vue-query-5.100.10.tgz#eafed0d51887c12dcbba5edb1b7108522ebc3891"
integrity sha512-S1aOmIPQNd5axR2Sw7H8d96EybY3kEZ396KA90e0SGLDYSfd2QgWi7+ItYXRGIDiSjOjlPUnthKDP0mDDBV8Kw==
dependencies:
"@tanstack/match-sorter-utils" "^8.19.4"
"@tanstack/query-core" "5.100.10"
"@vue/devtools-api" "^6.6.3"
vue-demi "^0.14.10"
"@tauri-apps/api@^2.10.1", "@tauri-apps/api@^2.11.0", "@tauri-apps/api@^2.8.0":
version "2.11.0"
resolved "https://registry.yarnpkg.com/@tauri-apps/api/-/api-2.11.0.tgz#00fb69996010178a5153798d4a84f6fe3a1e1182"
@@ -1156,6 +1188,11 @@
"@vue/compiler-dom" "3.5.34"
"@vue/shared" "3.5.34"
"@vue/devtools-api@^6.6.3":
version "6.6.4"
resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-6.6.4.tgz#cbe97fe0162b365edc1dba80e173f90492535343"
integrity sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g==
"@vue/devtools-api@^8.0.6":
version "8.1.1"
resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-8.1.1.tgz#367caf696349b1a49c655939ce605f4c96e30357"
@@ -1303,7 +1340,7 @@
dependencies:
"@zag-js/dom-query" "1.40.0"
"@zag-js/avatar@1.40.0":
"@zag-js/avatar@1.40.0", "@zag-js/avatar@^1.40.0":
version "1.40.0"
resolved "https://registry.yarnpkg.com/@zag-js/avatar/-/avatar-1.40.0.tgz#6d412fe7f7726f7924fcb6a46da397650f07987c"
integrity sha512-DayZDsNXbipT+1GUkX29tVhO4hZonDnidwE3SjEQv9Ic9vCdnwP95+B0FPEuaca03F5ZXFqVXjnPmRVbRMyDYQ==
@@ -1365,7 +1402,7 @@
"@zag-js/types" "1.40.0"
"@zag-js/utils" "1.40.0"
"@zag-js/collapsible@1.40.0":
"@zag-js/collapsible@1.40.0", "@zag-js/collapsible@^1.40.0":
version "1.40.0"
resolved "https://registry.yarnpkg.com/@zag-js/collapsible/-/collapsible-1.40.0.tgz#a8cf143963df8be1421ec5b3f3cbd76581c36f62"
integrity sha512-xDLY4j9D3gdoTirkwzMaCtelfCjnMhBzPyY6c/mh4oPvD3RB6dr3V3kI80i3yxHaUUeDCIUm/XAxK0InPsRBug==
@@ -1695,7 +1732,7 @@
"@zag-js/types" "1.40.0"
"@zag-js/utils" "1.40.0"
"@zag-js/password-input@1.40.0":
"@zag-js/password-input@1.40.0", "@zag-js/password-input@^1.40.0":
version "1.40.0"
resolved "https://registry.yarnpkg.com/@zag-js/password-input/-/password-input-1.40.0.tgz#8d70e938ad5646aef8869d967741a58608d0a16f"
integrity sha512-mD4tbA4m82oV+0NbJ+P00Q4Gwz+zf1kZEZ3Z48ohICfK/WO1KhCgviY7vu/7bCMnRiD3dbi+nEeym8Kb29wRHw==
@@ -2240,7 +2277,12 @@ csstype@3.2.3, csstype@^3.2.3:
resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.2.3.tgz#ec48c0f3e993e50648c86da559e2610995cf989a"
integrity sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==
debug@^4.0.0, debug@^4.1.1, debug@^4.3.1, debug@^4.3.2, debug@^4.4.0, debug@^4.4.3:
date-fns@^4.1.0:
version "4.1.0"
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-4.1.0.tgz#64b3d83fff5aa80438f5b1a633c2e83b8a1c2d14"
integrity sha512-Ukq0owbQXxa/U3EGtsdVBkR1w7KOQ5gIBqdH2hkvknzZPYvBxb/aa6E8L7tmjFtkwZBu3UXBbjIgPo/Ez4xaNg==
debug@^4.0.0, debug@^4.1.1, debug@^4.3.1, debug@^4.3.2, debug@^4.4.0, debug@^4.4.3, debug@~4.4.1:
version "4.4.3"
resolved "https://registry.yarnpkg.com/debug/-/debug-4.4.3.tgz#c6ae432d9bd9662582fce08709b038c58e9e3d6a"
integrity sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==
@@ -2291,6 +2333,22 @@ empathic@^2.0.0:
resolved "https://registry.yarnpkg.com/empathic/-/empathic-2.0.0.tgz#71d3c2b94fad49532ef98a6c34be0386659f6131"
integrity sha512-i6UzDscO/XfAcNYD75CfICkmfLedpyPDdozrLMmQc5ORaQcdMoc21OnlEylMIqI7U8eniKrPMxxtj8k0vhmJhA==
engine.io-client@~6.6.1:
version "6.6.4"
resolved "https://registry.yarnpkg.com/engine.io-client/-/engine.io-client-6.6.4.tgz#a04998787dd342b543eec5d4452da7bb540e7ff8"
integrity sha512-+kjUJnZGwzewFDw951CDWcwj35vMNf2fcj7xQWOctq1F2i1jkDdVvdFG9kM/BEChymCH36KgjnW0NsL58JYRxw==
dependencies:
"@socket.io/component-emitter" "~3.1.0"
debug "~4.4.1"
engine.io-parser "~5.2.1"
ws "~8.18.3"
xmlhttprequest-ssl "~2.1.1"
engine.io-parser@~5.2.1:
version "5.2.3"
resolved "https://registry.yarnpkg.com/engine.io-parser/-/engine.io-parser-5.2.3.tgz#00dc5b97b1f233a23c9398d0209504cf5f94d92f"
integrity sha512-HqD3yTBfnBxIrbnM1DoD6Pcq8NECnh8d4As1Qgh0z5Gg3jRRIqijury0CL3ghu/edArpUYiYqQiDUQBIs4np3Q==
enhanced-resolve@^5.17.1:
version "5.21.0"
resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.21.0.tgz#bb8e6fabaf74930de70e61397798750429e5b1ae"
@@ -3518,6 +3576,11 @@ minimatch@^10.2.2, minimatch@^10.2.4:
dependencies:
brace-expansion "^5.0.5"
mitt@^3.0.1:
version "3.0.1"
resolved "https://registry.yarnpkg.com/mitt/-/mitt-3.0.1.tgz#ea36cf0cc30403601ae074c8f77b7092cdab36d1"
integrity sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==
mlly@^1.7.4, mlly@^1.8.0:
version "1.8.2"
resolved "https://registry.yarnpkg.com/mlly/-/mlly-1.8.2.tgz#e7f7919a82d13b174405613117249a3f449d78bb"
@@ -3834,6 +3897,11 @@ regjsparser@^0.13.0:
dependencies:
jsesc "~3.1.0"
remove-accents@0.5.0:
version "0.5.0"
resolved "https://registry.yarnpkg.com/remove-accents/-/remove-accents-0.5.0.tgz#77991f37ba212afba162e375b627631315bed687"
integrity sha512-8g3/Otx1eJaVD12e31UbJj1YzdtVvzH85HV7t+9MJYk/u3XmkOUJ5Ys9wQrf9PCPK8+xn4ymzqYCiZl6QWKn+A==
reserved-identifiers@^1.0.0:
version "1.2.0"
resolved "https://registry.yarnpkg.com/reserved-identifiers/-/reserved-identifiers-1.2.0.tgz#d2982cd698e317dd3dced1ee1c52412dbd64fc64"
@@ -4048,6 +4116,24 @@ sisteransi@^1.0.5:
resolved "https://registry.yarnpkg.com/sisteransi/-/sisteransi-1.0.5.tgz#134d681297756437cc05ca01370d3a7a571075ed"
integrity sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==
socket.io-client@^4.8.3:
version "4.8.3"
resolved "https://registry.yarnpkg.com/socket.io-client/-/socket.io-client-4.8.3.tgz#62717edd46a318c918125b57e92dc7f8bb71c34c"
integrity sha512-uP0bpjWrjQmUt5DTHq9RuoCBdFJF10cdX9X+a368j/Ft0wmaVgxlrjvK3kjvgCODOMMOz9lcaRzxmso0bTWZ/g==
dependencies:
"@socket.io/component-emitter" "~3.1.0"
debug "~4.4.1"
engine.io-client "~6.6.1"
socket.io-parser "~4.2.4"
socket.io-parser@~4.2.4:
version "4.2.6"
resolved "https://registry.yarnpkg.com/socket.io-parser/-/socket.io-parser-4.2.6.tgz#19156bf179af3931abd05260cfb1491822578a6f"
integrity sha512-asJqbVBDsBCJx0pTqw3WfesSY0iRX+2xzWEWzrpcH7L6fLzrhyF8WPI8UaeM4YCuDfpwA/cgsdugMsmtz8EJeg==
dependencies:
"@socket.io/component-emitter" "~3.1.0"
debug "~4.4.1"
"source-map-js@>=0.6.2 <2.0.0", source-map-js@^1.2.1:
version "1.2.1"
resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.2.1.tgz#1ce5650fddd87abc099eda37dcff024c2667ae46"
@@ -4283,6 +4369,11 @@ vscode-uri@^3.0.8:
resolved "https://registry.yarnpkg.com/vscode-uri/-/vscode-uri-3.1.0.tgz#dd09ec5a66a38b5c3fffc774015713496d14e09c"
integrity sha512-/BpdSx+yCQGnCvecbyXdxHDkuk55/G3xwnC0GqY4gmQ3j+A+g8kzzgB4Nk/SINjqn6+waqw3EgbVF2QKExkRxQ==
vue-demi@^0.14.10:
version "0.14.10"
resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.14.10.tgz#afc78de3d6f9e11bf78c55e8510ee12814522f04"
integrity sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==
vue-eslint-parser@^10.4.0:
version "10.4.0"
resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-10.4.0.tgz#fd7251d0e710a88a6618f50e8a27973bc3c8d69c"
@@ -4354,11 +4445,21 @@ word-wrap@^1.2.5:
resolved "https://registry.yarnpkg.com/word-wrap/-/word-wrap-1.2.5.tgz#d2c45c6dd4fbce621a66f136cbe328afd0410b34"
integrity sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==
ws@~8.18.3:
version "8.18.3"
resolved "https://registry.yarnpkg.com/ws/-/ws-8.18.3.tgz#b56b88abffde62791c639170400c93dcb0c95472"
integrity sha512-PEIGCY5tSlUt50cqyMXfCzX+oOPqN0vuGqWzbcJ2xvnkzkq46oOpz7dQaTDBdfICb4N14+GARUDw2XV2N4tvzg==
xml-name-validator@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/xml-name-validator/-/xml-name-validator-4.0.0.tgz#79a006e2e63149a8600f15430f0a4725d1524835"
integrity sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==
xmlhttprequest-ssl@~2.1.1:
version "2.1.2"
resolved "https://registry.yarnpkg.com/xmlhttprequest-ssl/-/xmlhttprequest-ssl-2.1.2.tgz#e9e8023b3f29ef34b97a859f584c5e6c61418e23"
integrity sha512-TEU+nJVUUnA4CYJFLvK5X9AOeH4KvDvhIfm0vV1GaQRtchnG0hgK5p8hw/xjv8cunWYCsiPCSDzObPyhEwq3KQ==
yaml-eslint-parser@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/yaml-eslint-parser/-/yaml-eslint-parser-2.0.0.tgz#8cb63e3e28787557b9f295df0a8307c327b7fde4"