6ee4087a29
- Centralize `useAgents` and `useModels` state within the Nuxt app context to prevent data leaks and improve initialization. - Migrate virtualization from `vue-virtual-scroller` to `@tanstack/vue-virtual` with new `RowVirtualizerFixed` and `RowVirtualizerDynamic` components. - Upgrade Nuxt to v4.3.1 and remove `@vue-macros/nuxt`. - Replace `big.js` with an optimized custom `lshDecimal` string manipulation logic for pricing calculations in the provider API. - Implement automatic focus redirection in `ChatInput` to capture standard keyboard input. - Refactor Sidenav and Settings components to utilize virtualization for long lists (topics, agents, models). - Enhance theme colors and mobile experience. More work to come on both of these.
66 lines
2.1 KiB
Vue
66 lines
2.1 KiB
Vue
<script setup lang="ts">
|
|
import '~/assets/css/reset.css';
|
|
import '~/assets/css/base.css';
|
|
|
|
const { accent, neutral, hinting } = useTheme();
|
|
|
|
// by default, disable hinting
|
|
if (Number.isNaN(Number(hinting.value))) hinting.value = '0';
|
|
|
|
useHead({
|
|
htmlAttrs: {
|
|
style: `
|
|
--neutral-100: var(--palette-${neutral.value}-100);
|
|
--neutral-200: var(--palette-${neutral.value}-200);
|
|
--neutral-300: var(--palette-${neutral.value}-300);
|
|
--color-accent: var(--accent-${accent.value}, var(--accent-violet));
|
|
--color-accent-hover: var(--accent-${accent.value}-hover, var(--accent-violet-hover));
|
|
--accent-hinting: ${hinting.value}%;
|
|
--base-hinting: calc(100% - var(--accent-hinting));`,
|
|
},
|
|
});
|
|
|
|
if (import.meta.client) {
|
|
// force shiki into browser rendering only
|
|
window.sessionStorage.setItem('mdc-shiki-highlighter', 'browser');
|
|
|
|
watchEffect(() => {
|
|
document.documentElement.style.setProperty(
|
|
'--color-accent',
|
|
`var(--accent-${accent.value}, var(--accent-violet))`,
|
|
);
|
|
document.documentElement.style.setProperty(
|
|
'--color-accent-hover',
|
|
`var(--accent-${accent.value}-hover, var(--accent-violet-hover))`,
|
|
);
|
|
// document.documentElement.style.setProperty(
|
|
// '--color-neutral',
|
|
// `var(--neutral-${neutral.value}, var(--neutral-zinc))`,
|
|
// );
|
|
document.documentElement.style.setProperty('--neutral-100', `var(--palette-${neutral.value}-100)`);
|
|
document.documentElement.style.setProperty('--neutral-200', `var(--palette-${neutral.value}-200)`);
|
|
document.documentElement.style.setProperty('--neutral-300', `var(--palette-${neutral.value}-300)`);
|
|
document.documentElement.style.setProperty('--accent-hinting', `${hinting.value}%`);
|
|
});
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<NuxtLoadingIndicator />
|
|
<NuxtLayout>
|
|
<NuxtPage />
|
|
</NuxtLayout>
|
|
<NuxtRouteAnnouncer />
|
|
</template>
|
|
|
|
<style>
|
|
body {
|
|
height: 100%;
|
|
}
|
|
|
|
#__nuxt {
|
|
padding: 0.5rem;
|
|
height: 100%;
|
|
display: flex;
|
|
}
|
|
</style> |