dev: add narrow UpObject story to test overflow/ellipsis

feat/users
Tomáš Mládek 2024-02-20 13:47:11 +01:00
parent 0b488d9384
commit 894faa94ae
2 changed files with 20 additions and 2 deletions

View File

@ -0,0 +1,11 @@
<div class="narrow">
<slot />
</div>
<style>
.narrow {
width: 256px;
border: 1px dashed red;
padding: 1em 0;
}
</style>

View File

@ -1,6 +1,7 @@
import type { Meta, StoryObj } from '@storybook/svelte'; import type { Meta, StoryObj } from '@storybook/svelte';
import UpObject from '../lib/components/display/UpObject.svelte'; import UpObject from '../lib/components/display/UpObject.svelte';
import { videoAddress } from './common'; import { videoAddress } from './common';
import NarrowDecorator from './NarrowDecorator.svelte';
const address = videoAddress; const address = videoAddress;
@ -20,8 +21,7 @@ const meta: Meta<UpObject> = {
onResolved: { onResolved: {
action: 'resolved' action: 'resolved'
} }
// eslint-disable-next-line @typescript-eslint/no-explicit-any }
} as any
}; };
export default meta; export default meta;
@ -54,3 +54,10 @@ export const BannerWithLabels: Story = {
labels: ['Label 1', 'Label B', 'Label III'] labels: ['Label 1', 'Label B', 'Label III']
} }
}; };
export const Overflow: Story = {
args: {
labels: ['qwertyuiopasdfghjklzxcvbnmqwertyuiopasdfghjklzxcvbnm'.repeat(3)]
},
decorators: [() => NarrowDecorator as any]
};