@volverjs/ui-vue 0.0.10-beta.34 → 0.0.10-beta.36

package/src/stories/InputText/InputTextMask.stories.ts

@@ -1,13 +1,13 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
-import VvInputText from '@/components/VvInputText/VvInputText.vue'
 import { Default } from './InputText.stories'
 import { defaultArgs, argTypes } from './InputText.settings'
+import VvInputText from '@/components/VvInputText/VvInputText.vue'
 
 const meta: Meta<typeof VvInputText> = {
-	title: 'Components/InputText/Mask',
-	component: VvInputText,
-	args: defaultArgs,
-	argTypes,
+    title: 'Components/InputText/Mask',
+    component: VvInputText,
+    args: defaultArgs,
+    argTypes,
 }
 
 export default meta
@@ -15,108 +15,108 @@ export default meta
 type Story = StoryObj<typeof VvInputText>
 
 export const Regex: Story = {
-	...Default,
-	args: {
-		...defaultArgs,
-		id: 'regexp',
-		iMask: {
-			mask: /^\d+$/,
-		},
-	},
+    ...Default,
+    args: {
+        ...defaultArgs,
+        id: 'regexp',
+        iMask: {
+            mask: /^\d+$/,
+        },
+    },
 }
 
 export const PhoneNumber: Story = {
-	...Default,
-	args: {
-		...defaultArgs,
-		id: 'phone-number',
-		iMask: {
-			mask: '+{39}(000)000-00-00',
-		},
-	},
+    ...Default,
+    args: {
+        ...defaultArgs,
+        id: 'phone-number',
+        iMask: {
+            mask: '+{39}(000)000-00-00',
+        },
+    },
 }
 
 export const Pattern: Story = {
-	...Default,
-	args: {
-		...defaultArgs,
-		id: 'pattern',
-		iMask: {
-			mask: 'XXX-XX-00000',
-			definitions: {
-				X: {
-					mask: '0',
-					displayChar: 'X',
-					placeholderChar: '#',
-				},
-			},
-			lazy: false,
-			overwrite: 'shift',
-		},
-	},
+    ...Default,
+    args: {
+        ...defaultArgs,
+        id: 'pattern',
+        iMask: {
+            mask: 'XXX-XX-00000',
+            definitions: {
+                X: {
+                    mask: '0',
+                    displayChar: 'X',
+                    placeholderChar: '#',
+                },
+            },
+            lazy: false,
+            overwrite: 'shift',
+        },
+    },
 }
 
 export const IntlNumber: Story = {
-	...Default,
-	args: {
-		...defaultArgs,
-		id: 'intl-number',
-		type: 'number',
-		iMask: {
-			mask: Number,
-			thousandsSeparator: '.',
-			radix: ',',
-		},
-	},
+    ...Default,
+    args: {
+        ...defaultArgs,
+        id: 'intl-number',
+        type: 'number',
+        iMask: {
+            mask: Number,
+            thousandsSeparator: '.',
+            radix: ',',
+        },
+    },
 }
 
 export const DatePlaceholder: Story = {
-	...Default,
-	args: {
-		...defaultArgs,
-		id: 'date-placeholder',
-		type: 'date',
-		iMask: {
-			mask: Date,
-			pattern: 'd.m.Y',
-			lazy: false,
-		},
-	},
+    ...Default,
+    args: {
+        ...defaultArgs,
+        id: 'date-placeholder',
+        type: 'date',
+        iMask: {
+            mask: Date,
+            pattern: 'd.m.Y',
+            lazy: false,
+        },
+    },
 }
 
 export const PhoneOrEmail: Story = {
-	...Default,
-	args: {
-		...defaultArgs,
-		id: 'phone-or-email',
-		iMask: {
-			mask: [
-				{
-					mask: '+{39}(000)000-00-00',
-				},
-				{
-					mask: /^\S*@?\S*$/,
-				},
-			],
-		},
-	},
+    ...Default,
+    args: {
+        ...defaultArgs,
+        id: 'phone-or-email',
+        iMask: {
+            mask: [
+                {
+                    mask: '+{39}(000)000-00-00',
+                },
+                {
+                    mask: /^\S*$/,
+                },
+            ],
+        },
+    },
 }
 
 export const Currency: Story = {
-	...Default,
-	args: {
-		...defaultArgs,
-		id: 'currency',
-		type: 'number',
-		iMask: {
-			mask: '€ num',
-			blocks: {
-				num: {
-					mask: Number,
-					thousandsSeparator: '.',
-					radix: ',',
-				},
-			},
-		},
-	},
+    ...Default,
+    args: {
+        ...defaultArgs,
+        id: 'currency',
+        type: 'number',
+        iMask: {
+            mask: '€ num',
+            blocks: {
+                num: {
+                    mask: Number,
+                    thousandsSeparator: '.',
+                    radix: ',',
+                },
+            },
+        },
+    },
 }

package/src/stories/InputText/InputTextMinMax.stories.ts

@@ -1,13 +1,13 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
-import VvInputText from '@/components/VvInputText/VvInputText.vue'
 import { Default } from './InputText.stories'
 import { defaultArgs, argTypes } from './InputText.settings'
+import VvInputText from '@/components/VvInputText/VvInputText.vue'
 
 const meta: Meta<typeof VvInputText> = {
-	title: 'Components/InputText/MinMax',
-	component: VvInputText,
-	args: defaultArgs,
-	argTypes,
+    title: 'Components/InputText/MinMax',
+    component: VvInputText,
+    args: defaultArgs,
+    argTypes,
 }
 
 export default meta
@@ -15,37 +15,37 @@ export default meta
 type Story = StoryObj<typeof VvInputText>
 
 export const MinNumber: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'number',
-		min: -15,
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'number',
+        min: -15,
+    },
 }
 
 export const MaxNumber: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'number',
-		max: 15,
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'number',
+        max: 15,
+    },
 }
 
 export const MinDate: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'date',
-		min: new Date().toISOString().split('T')[0],
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'date',
+        min: new Date().toISOString().split('T')[0],
+    },
 }
 
 export const MaxDate: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'date',
-		max: new Date().toISOString().split('T')[0],
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'date',
+        max: new Date().toISOString().split('T')[0],
+    },
 }

package/src/stories/InputText/InputTextSlots.stories.ts

@@ -1,13 +1,13 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
-import VvInputText from '@/components/VvInputText/VvInputText.vue'
 import { Default } from './InputText.stories'
 import { defaultArgs, argTypes } from './InputText.settings'
+import VvInputText from '@/components/VvInputText/VvInputText.vue'
 
 const meta: Meta<typeof VvInputText> = {
-	title: 'Components/InputText/Slots',
-	component: VvInputText,
-	args: defaultArgs,
-	argTypes,
+    title: 'Components/InputText/Slots',
+    component: VvInputText,
+    args: defaultArgs,
+    argTypes,
 }
 
 export default meta
@@ -15,25 +15,25 @@ export default meta
 type Story = StoryObj<typeof VvInputText>
 
 export const Before: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		before: '<div class="vv-badge vv-badge--sm uppercase">Before</div>',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        before: '<div class="vv-badge vv-badge--sm uppercase">Before</div>',
+    },
 }
 
 export const After: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		after: '<div class="vv-badge vv-badge--sm uppercase">After</div>',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        after: '<div class="vv-badge vv-badge--sm uppercase">After</div>',
+    },
 }
 
 export const Hint: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		hint: 'Hint <em class="italic">slot!</em>',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        hint: 'Hint <em class="italic">slot!</em>',
+    },
 }

package/src/stories/InputText/InputTextType.stories.ts

@@ -1,13 +1,13 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
-import VvInputText from '@/components/VvInputText/VvInputText.vue'
 import { Default } from './InputText.stories'
 import { defaultArgs, argTypes } from './InputText.settings'
+import VvInputText from '@/components/VvInputText/VvInputText.vue'
 
 const meta: Meta<typeof VvInputText> = {
-	title: 'Components/InputText/Type',
-	component: VvInputText,
-	args: defaultArgs,
-	argTypes,
+    title: 'Components/InputText/Type',
+    component: VvInputText,
+    args: defaultArgs,
+    argTypes,
 }
 
 export default meta
@@ -15,105 +15,105 @@ export default meta
 type Story = StoryObj<typeof VvInputText>
 
 export const Text: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'text',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'text',
+    },
 }
 
 export const Password: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'password',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'password',
+    },
 }
 
 export const Date: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'date',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'date',
+    },
 }
 
 export const DateTime: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'datetime-local',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'datetime-local',
+    },
 }
 
 export const Time: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'time',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'time',
+    },
 }
 
 export const Month: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'month',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'month',
+    },
 }
 
 export const Week: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'week',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'week',
+    },
 }
 
 export const Number: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'number',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'number',
+    },
 }
 
 export const Email: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'email',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'email',
+    },
 }
 
 export const Tel: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'tel',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'tel',
+    },
 }
 
 export const Url: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'url',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'url',
+    },
 }
 
 export const Color: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'color',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'color',
+    },
 }
 
 export const Search: Story = {
-	...Default,
-	args: {
-		...Default.args,
-		type: 'search',
-	},
+    ...Default,
+    args: {
+        ...Default.args,
+        type: 'search',
+    },
 }

package/src/stories/Nav/Nav.settings.ts

@@ -4,32 +4,32 @@ import { VvNavProps } from '@/components/VvNav'
 import { ModifiersArgTypes } from '@/stories/argTypes'
 
 export const defaultArgs: Meta<typeof VvNav>['args'] = {
-	...propsToObject(VvNavProps),
-	items: [
-		{
-			label: 'Item 1',
-			href: 'javascript:void(0)',
-		},
-		{
-			label: 'Item 2',
-			to: 'about',
-		},
-		{
-			label: 'Item 3',
-			on: {
-				click: () => {
-					// eslint-disable-next-line no-console
-					console.log('clicked Item 3')
-				},
-			},
-		},
-	],
-	modifiers: 'sidebar',
+    ...propsToObject(VvNavProps),
+    items: [
+        {
+            label: 'Item 1',
+            href: 'javascript:void(0)',
+        },
+        {
+            label: 'Item 2',
+            to: 'about',
+        },
+        {
+            label: 'Item 3',
+            on: {
+                click: () => {
+                    // eslint-disable-next-line no-console
+                    console.log('clicked Item 3')
+                },
+            },
+        },
+    ],
+    modifiers: 'sidebar',
 }
 
 export const argTypes: ArgTypes = {
-	modifiers: {
-		...ModifiersArgTypes.modifiers,
-		options: ['sidebar', 'aside', 'tabs', 'full'],
-	},
+    modifiers: {
+        ...ModifiersArgTypes.modifiers,
+        options: ['sidebar', 'aside', 'tabs', 'full'],
+    },
 }

package/src/stories/Nav/Nav.stories.ts

@@ -1,14 +1,14 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
-import VvNav from '@/components/VvNav/VvNav.vue'
 import { defaultArgs, argTypes } from './Nav.settings'
 import { defaultTest } from './Nav.test'
+import VvNav from '@/components/VvNav/VvNav.vue'
 
 const meta: Meta<typeof VvNav> = {
-	title: 'Components/Nav',
-	component: VvNav,
-	args: defaultArgs,
-	argTypes,
-	tags: ['autodocs'],
+    title: 'Components/Nav',
+    component: VvNav,
+    args: defaultArgs,
+    argTypes,
+    tags: ['autodocs'],
 }
 
 export default meta
@@ -16,18 +16,18 @@ export default meta
 type Story = StoryObj<typeof VvNav>
 
 export const Default: Story = {
-	args: {
-		...defaultArgs,
-	},
-	render: (args) => ({
-		components: { VvNav },
-		setup() {
-			return { args }
-		},
-		template: /* html */ `
+    args: {
+        ...defaultArgs,
+    },
+    render: args => ({
+        components: { VvNav },
+        setup() {
+            return { args }
+        },
+        template: /* html */ `
 			<div class="m-md w-1/2">
 				<vv-nav v-bind="args" data-testId="element" />
 			</div>`,
-	}),
-	play: defaultTest,
+    }),
+    play: defaultTest,
 }

package/src/stories/Nav/Nav.test.ts

@@ -1,19 +1,19 @@
+import { within } from '@storybook/test'
 import type { PlayAttributes } from '@/test/types'
 import { expect } from '@/test/expect'
-import { within } from '@storybook/test'
 
 export async function defaultTest({ canvasElement, args }: PlayAttributes) {
-	const element = await within(canvasElement).findByTestId('element')
+    const element = await within(canvasElement).findByTestId('element')
 
-	const menuEl = element.getElementsByClassName('vv-nav__menu')[0]
+    const menuEl = element.getElementsByClassName('vv-nav__menu')[0]
 
-	if (!args.items?.length) {
-		throw new Error('No items passed')
-	}
+    if (!args.items?.length) {
+        throw new Error('No items passed')
+    }
 
-	// check children number the same of items prop
-	expect(menuEl.children.length).toEqual(args.items?.length)
+    // check children number the same of items prop
+    expect(menuEl.children.length).toEqual(args.items?.length)
 
-	// check accessibility
-	await expect(element).toHaveNoViolations()
+    // check accessibility
+    await expect(element).toHaveNoViolations()
 }