As it is visible here, part of the layout is deferred to the parent component. See Login template. Signed-off-by: André Jaenisch <andre.jaenisch@posteo.de>
110 lines
2.4 KiB
TypeScript
110 lines
2.4 KiB
TypeScript
import type { Meta, StoryObj } from '@storybook/svelte';
|
|
|
|
import LoginForm from '$lib/components/organisms/LoginForm.svelte';
|
|
|
|
const meta = {
|
|
title: 'Organisms/LoginForm',
|
|
component: LoginForm,
|
|
tags: ['autodocs'],
|
|
argTypes: {
|
|
form: { controls: 'object' },
|
|
i18n: { controls: 'object' },
|
|
servers: { controls: 'object' }
|
|
}
|
|
} satisfies Meta<LoginForm>;
|
|
|
|
export default meta;
|
|
type Story = StoryObj<typeof meta>;
|
|
|
|
export const Plain: Story = {
|
|
args: {
|
|
form: {
|
|
account: 'jane.doe@domain.example',
|
|
incorrect: false,
|
|
missing: false
|
|
},
|
|
i18n: {
|
|
fields: {
|
|
account: {
|
|
label: 'page.login.form.fields.account.label'
|
|
},
|
|
passphrase: {
|
|
label: 'page.login.form.fields.passphrase.label',
|
|
placeholder: 'page.login.form.fields.passphrase.placeholder'
|
|
},
|
|
server: {
|
|
label: 'page.login.form.fields.server.label'
|
|
}
|
|
},
|
|
reset: 'page.login.form.reset',
|
|
submit: 'page.login.form.submit',
|
|
validation: {
|
|
incorrect: 'page.login.form.validation.incorrect',
|
|
missing: 'page.login.form.validation.missing'
|
|
}
|
|
},
|
|
servers: []
|
|
}
|
|
};
|
|
|
|
export const MissingInput: Story = {
|
|
args: {
|
|
form: {
|
|
account: '',
|
|
incorrect: false,
|
|
missing: true
|
|
},
|
|
i18n: {
|
|
fields: {
|
|
account: {
|
|
label: 'page.login.form.fields.account.label'
|
|
},
|
|
passphrase: {
|
|
label: 'page.login.form.fields.passphrase.label',
|
|
placeholder: 'page.login.form.fields.passphrase.placeholder'
|
|
},
|
|
server: {
|
|
label: 'page.login.form.fields.server.label'
|
|
}
|
|
},
|
|
reset: 'page.login.form.reset',
|
|
submit: 'page.login.form.submit',
|
|
validation: {
|
|
incorrect: 'page.login.form.validation.incorrect',
|
|
missing: 'page.login.form.validation.missing'
|
|
}
|
|
},
|
|
servers: []
|
|
}
|
|
};
|
|
|
|
export const InvalidFormData: Story = {
|
|
args: {
|
|
form: {
|
|
account: 'jane.doe@domain.example',
|
|
incorrect: true,
|
|
missing: false
|
|
},
|
|
i18n: {
|
|
fields: {
|
|
account: {
|
|
label: 'page.login.form.fields.account.label'
|
|
},
|
|
passphrase: {
|
|
label: 'page.login.form.fields.passphrase.label',
|
|
placeholder: 'page.login.form.fields.passphrase.placeholder'
|
|
},
|
|
server: {
|
|
label: 'page.login.form.fields.server.label'
|
|
}
|
|
},
|
|
reset: 'page.login.form.reset',
|
|
submit: 'page.login.form.submit',
|
|
validation: {
|
|
incorrect: 'page.login.form.validation.incorrect',
|
|
missing: 'page.login.form.validation.missing'
|
|
}
|
|
},
|
|
servers: []
|
|
}
|
|
};
|