1 | import { GlTruncate } from '../../../index';
|
2 | import { POSITION } from './constants';
|
3 | import readme from './truncate.md';
|
4 |
|
5 | const template = '<gl-truncate :text="text" :position="position" :with-tooltip="withTooltip" />';
|
6 |
|
7 | const generateProps = ({
|
8 | text = 'src/thisIs/AVeryLongFilePath/that/needs/to/be/smartly/truncated/from/the/middle/so/we/dont/lose/important/information/here.vue',
|
9 | position = 'middle',
|
10 | withTooltip = false,
|
11 | } = {}) => ({
|
12 | text,
|
13 | position,
|
14 | withTooltip,
|
15 | });
|
16 |
|
17 | const Template = (args, { argTypes }) => ({
|
18 | components: {
|
19 | GlTruncate,
|
20 | },
|
21 | props: Object.keys(argTypes),
|
22 | template,
|
23 | });
|
24 | export const Default = Template.bind({});
|
25 | Default.args = generateProps();
|
26 |
|
27 | export default {
|
28 | title: 'utilities/truncate',
|
29 | component: GlTruncate,
|
30 | parameters: {
|
31 | storyshots: { disable: true },
|
32 | docs: {
|
33 | description: {
|
34 | component: readme,
|
35 | },
|
36 | },
|
37 | },
|
38 | argTypes: {
|
39 | text: {
|
40 | control: 'text',
|
41 | },
|
42 | position: {
|
43 | options: Object.values(POSITION),
|
44 | control: 'select',
|
45 | },
|
46 | withTooltip: {
|
47 | control: 'boolean',
|
48 | },
|
49 | },
|
50 | };
|