include llama.cpp since there were some edits
This commit is contained in:
zefie committed
1 parent
db7f28d087
commit
8c66990853
3918 files changed
+1640170
-1
No files matched your search
@@ -0,0 +1,35 @@
|
||||
<script lang="ts" module>
|
||||
import { Copy } from '@lucide/svelte';
|
||||
import { defineMeta } from '@storybook/addon-svelte-csf';
|
||||
import ActionIcon from '$lib/components/app/actions/ActionIcon.svelte';
|
||||
import { expect } from 'storybook/test';
|
||||
|
||||
const { Story } = defineMeta({
|
||||
component: ActionIcon,
|
||||
parameters: {
|
||||
layout: 'centered'
|
||||
},
|
||||
tags: ['!dev'],
|
||||
title: 'Components/ActionIcon/Accessibility'
|
||||
});
|
||||
</script>
|
||||
|
||||
<Story
|
||||
asChild
|
||||
name="SingleTabStop"
|
||||
play={async ({ canvas, userEvent }) => {
|
||||
const before = await canvas.findByRole('button', { name: 'before' });
|
||||
const target = await canvas.findByRole('button', { name: 'Copy' });
|
||||
|
||||
before.focus();
|
||||
await userEvent.tab();
|
||||
|
||||
await expect(target).toHaveFocus();
|
||||
}}
|
||||
>
|
||||
<div>
|
||||
<button type="button">before</button>
|
||||
|
||||
<ActionIcon icon={Copy} onclick={() => {}} tooltip="Copy" />
|
||||
</div>
|
||||
</Story>
|
||||
@@ -0,0 +1,50 @@
|
||||
<script lang="ts" module>
|
||||
import { defineMeta } from '@storybook/addon-svelte-csf';
|
||||
import ChatMessageStatistics from '$lib/components/app/chat/ChatMessages/ChatMessageStatistics/ChatMessageStatistics.svelte';
|
||||
import { expect } from 'storybook/test';
|
||||
|
||||
const { Story } = defineMeta({
|
||||
component: ChatMessageStatistics,
|
||||
parameters: {
|
||||
layout: 'centered'
|
||||
},
|
||||
tags: ['!dev'],
|
||||
title: 'Components/ChatMessageStatistics/Accessibility'
|
||||
});
|
||||
</script>
|
||||
|
||||
<Story
|
||||
args={{
|
||||
agenticTimings: {
|
||||
llm: { predicted_ms: 1000, predicted_n: 200, prompt_ms: 500, prompt_n: 100 },
|
||||
toolCallsCount: 1,
|
||||
toolsMs: 500,
|
||||
turns: 1
|
||||
},
|
||||
hideSummary: false,
|
||||
isLive: false,
|
||||
predictedMs: 1000,
|
||||
predictedTokens: 200,
|
||||
promptMs: 500,
|
||||
promptTokens: 100
|
||||
}}
|
||||
name="ViewButtonsSingleTabStop"
|
||||
play={async ({ canvas, userEvent }) => {
|
||||
const reading = await canvas.findByRole('button', { name: 'Reading' });
|
||||
const generation = await canvas.findByRole('button', { name: 'Generation' });
|
||||
const tools = await canvas.findByRole('button', { name: 'Tools' });
|
||||
const summary = await canvas.findByRole('button', { name: 'Summary' });
|
||||
|
||||
reading.focus();
|
||||
await expect(reading).toHaveFocus();
|
||||
|
||||
await userEvent.tab();
|
||||
await expect(generation).toHaveFocus();
|
||||
|
||||
await userEvent.tab();
|
||||
await expect(tools).toHaveFocus();
|
||||
|
||||
await userEvent.tab();
|
||||
await expect(summary).toHaveFocus();
|
||||
}}
|
||||
/>
|
||||
@@ -0,0 +1,51 @@
|
||||
<script lang="ts" module>
|
||||
import { defineMeta } from '@storybook/addon-svelte-csf';
|
||||
import ChatScreenForm from '$lib/components/app/chat/ChatScreen/ChatScreenForm.svelte';
|
||||
import { ATTACHMENT_TOOLTIP_TEXT } from '$lib/constants';
|
||||
import { expect, screen, waitFor } from 'storybook/test';
|
||||
|
||||
const { Story } = defineMeta({
|
||||
component: ChatScreenForm,
|
||||
parameters: {
|
||||
layout: 'centered'
|
||||
},
|
||||
tags: ['!dev'],
|
||||
title: 'Components/ChatScreen/ChatScreenForm/Accessibility'
|
||||
});
|
||||
</script>
|
||||
|
||||
<Story
|
||||
args={{ class: 'max-w-[56rem] w-[calc(100vw-2rem)]' }}
|
||||
name="AddButtonSingleTabStop"
|
||||
play={async ({ canvas, userEvent }) => {
|
||||
const textarea = await canvas.findByRole('textbox');
|
||||
|
||||
await userEvent.clear(textarea);
|
||||
await userEvent.type(textarea, 'What is the meaning of life?');
|
||||
|
||||
const trigger = await canvas.findByRole('button', { name: ATTACHMENT_TOOLTIP_TEXT });
|
||||
|
||||
trigger.focus();
|
||||
await expect(trigger).toHaveFocus();
|
||||
|
||||
await userEvent.tab();
|
||||
|
||||
await expect(trigger).not.toHaveFocus();
|
||||
}}
|
||||
/>
|
||||
|
||||
<Story
|
||||
args={{ class: 'max-w-[56rem] w-[calc(100vw-2rem)]' }}
|
||||
name="AddDropdownFocusesFirstEnabled"
|
||||
play={async ({ canvas, userEvent }) => {
|
||||
const trigger = await canvas.findByRole('button', { name: ATTACHMENT_TOOLTIP_TEXT });
|
||||
|
||||
trigger.focus();
|
||||
await userEvent.keyboard('{Enter}');
|
||||
await screen.findByRole('menu');
|
||||
|
||||
await waitFor(() => {
|
||||
expect(document.activeElement).toHaveTextContent('Add files');
|
||||
});
|
||||
}}
|
||||
/>
|
||||
@@ -0,0 +1,52 @@
|
||||
<script lang="ts" module>
|
||||
import { defineMeta } from '@storybook/addon-svelte-csf';
|
||||
import ModelsManagerModelRow from '$lib/components/app/models/ModelsManager/ModelsManagerModelRow.svelte';
|
||||
import { MODEL_ROW_GRID_CLASS } from '$lib/constants';
|
||||
import type { ModelOption } from '$lib/types/models';
|
||||
import { expect } from 'storybook/test';
|
||||
|
||||
const { Story } = defineMeta({
|
||||
parameters: {
|
||||
layout: 'centered'
|
||||
},
|
||||
tags: ['!dev'],
|
||||
title: 'Components/ModelsManager/Accessibility'
|
||||
});
|
||||
|
||||
const option: ModelOption = {
|
||||
capabilities: [],
|
||||
id: 'org/Qwen3-8B:Q4_K_M',
|
||||
model: 'org/Qwen3-8B:Q4_K_M',
|
||||
name: 'Qwen3-8B'
|
||||
};
|
||||
|
||||
const ROW_NAME = /org\/Qwen3\s+8B/;
|
||||
</script>
|
||||
|
||||
<script lang="ts">
|
||||
let selected = $state(false);
|
||||
</script>
|
||||
|
||||
<!-- The row answers Enter and Space on its own, so a keyboard user selects a model
|
||||
without reaching for the pointer. -->
|
||||
<Story
|
||||
name="RowKeyboardSelect"
|
||||
play={async ({ canvas, userEvent }) => {
|
||||
const row = await canvas.findByRole('button', { name: ROW_NAME });
|
||||
|
||||
row.focus();
|
||||
await userEvent.keyboard('{Enter}');
|
||||
|
||||
await expect(row).toHaveAttribute('aria-pressed', 'true');
|
||||
}}
|
||||
>
|
||||
<div class={MODEL_ROW_GRID_CLASS + ' w-[40rem]'}>
|
||||
<ModelsManagerModelRow
|
||||
isFavorite={() => false}
|
||||
onDelete={() => {}}
|
||||
onSelect={() => (selected = true)}
|
||||
{option}
|
||||
{selected}
|
||||
/>
|
||||
</div>
|
||||
</Story>
|
||||
@@ -0,0 +1,74 @@
|
||||
<script lang="ts" module>
|
||||
import { defineMeta } from '@storybook/addon-svelte-csf';
|
||||
import { ScrollCarousel } from '$lib/components/app';
|
||||
import { ScrollCarouselVariant } from '$lib/enums';
|
||||
import { expect, waitFor } from 'storybook/test';
|
||||
|
||||
const { Story } = defineMeta({
|
||||
component: ScrollCarousel,
|
||||
parameters: {
|
||||
layout: 'centered'
|
||||
},
|
||||
tags: ['!dev'],
|
||||
title: 'Components/ScrollCarousel/Accessibility'
|
||||
});
|
||||
</script>
|
||||
|
||||
<Story
|
||||
asChild
|
||||
name="ArrowsNotInTabOrderWhenNotScrollable"
|
||||
play={async ({ canvas, userEvent }) => {
|
||||
const before = await canvas.findByRole('button', { name: 'before' });
|
||||
const after = await canvas.findByRole('button', { name: 'after' });
|
||||
const leftArrow = await canvas.findByRole('button', { name: 'Scroll left' });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(leftArrow).toBeDisabled();
|
||||
});
|
||||
|
||||
before.focus();
|
||||
await userEvent.tab();
|
||||
|
||||
await expect(after).toHaveFocus();
|
||||
}}
|
||||
>
|
||||
<div>
|
||||
<button type="button">before</button>
|
||||
|
||||
<ScrollCarousel class="w-96" variant={ScrollCarouselVariant.CENTER}>
|
||||
<div class="h-12 w-12 shrink-0 bg-muted"></div>
|
||||
|
||||
<div class="h-12 w-12 shrink-0 bg-muted"></div>
|
||||
</ScrollCarousel>
|
||||
|
||||
<button type="button">after</button>
|
||||
</div>
|
||||
</Story>
|
||||
|
||||
<Story
|
||||
asChild
|
||||
name="ArrowsInTabOrderWhenScrollable"
|
||||
play={async ({ canvas, userEvent }) => {
|
||||
const before = await canvas.findByRole('button', { name: 'before' });
|
||||
const rightArrow = await canvas.findByRole('button', { name: 'Scroll right' });
|
||||
|
||||
await waitFor(() => {
|
||||
expect(rightArrow).not.toBeDisabled();
|
||||
});
|
||||
|
||||
before.focus();
|
||||
await userEvent.tab();
|
||||
|
||||
await expect(rightArrow).toHaveFocus();
|
||||
}}
|
||||
>
|
||||
<div>
|
||||
<button type="button">before</button>
|
||||
|
||||
<ScrollCarousel class="w-48" variant={ScrollCarouselVariant.CENTER}>
|
||||
{#each [...Array(20).keys()] as i (i)}
|
||||
<div class="h-12 w-24 shrink-0 bg-muted">{i}</div>
|
||||
{/each}
|
||||
</ScrollCarousel>
|
||||
</div>
|
||||
</Story>
|
||||
+36
@@ -0,0 +1,36 @@
|
||||
<script lang="ts" module>
|
||||
import { defineMeta } from '@storybook/addon-svelte-csf';
|
||||
import SidebarNavigationConversationItem from '$lib/components/app/navigation/SidebarNavigation/SidebarNavigationConversationItem.svelte';
|
||||
import { expect } from 'storybook/test';
|
||||
|
||||
const mockForkedConversation: DatabaseConversation = {
|
||||
currNode: 'msg-2',
|
||||
forkedFromConversationId: 'conv-1',
|
||||
id: 'conv-2',
|
||||
lastModified: Date.now(),
|
||||
name: 'Forked Conversation'
|
||||
};
|
||||
|
||||
const { Story } = defineMeta({
|
||||
component: SidebarNavigationConversationItem,
|
||||
parameters: {
|
||||
layout: 'centered'
|
||||
},
|
||||
tags: ['!dev'],
|
||||
title: 'Components/SidebarNavigationConversationItem/Accessibility'
|
||||
});
|
||||
</script>
|
||||
|
||||
<Story
|
||||
args={{ conversation: mockForkedConversation, depth: 1 }}
|
||||
name="ForkIconSingleTabStop"
|
||||
play={async ({ canvas, userEvent }) => {
|
||||
const row = await canvas.findByRole('button', { name: /Forked Conversation/ });
|
||||
const forkIcon = await canvas.findByRole('link');
|
||||
|
||||
row.focus();
|
||||
await userEvent.tab();
|
||||
|
||||
await expect(forkIcon).toHaveFocus();
|
||||
}}
|
||||
/>
|
||||
Reference in new issue
Block a user