6ddaa69f69
* add dependency * rename Input to TextInput and use daisy * base styling * storybook setup with tailwind and theme changer * daisy buttons * add flaticons * text input to daisy * Navbar to daisy * login using daisy * autodocs is... auto * refactor Tabs to separate components * move TextInput * move button * move navbar * remove index * move container * move loader * move tabs to navigation * organize storybook hierarchy * use card * remove storybook dark mode * README * ignore db file * ignore db * prisma scripts * format * blyat * fix redirect
45 lines
1 KiB
Svelte
45 lines
1 KiB
Svelte
<script module lang="ts">
|
|
import { defineMeta } from '@storybook/addon-svelte-csf';
|
|
import TextInput from './TextInput.svelte';
|
|
|
|
const { Story } = defineMeta({
|
|
title: 'Data Input/Text Input',
|
|
component: TextInput,
|
|
argTypes: {
|
|
color: {
|
|
control: 'select',
|
|
options: [
|
|
'primary',
|
|
'secondary',
|
|
'accent',
|
|
'ghost',
|
|
'link',
|
|
'info',
|
|
'success',
|
|
'warning',
|
|
'error',
|
|
],
|
|
},
|
|
bordered: {
|
|
control: 'boolean',
|
|
},
|
|
size: {
|
|
control: 'select',
|
|
options: ['Default', 'xs', 'sm', 'lg'],
|
|
defaultValue: 'Default',
|
|
},
|
|
type: {
|
|
control: 'select',
|
|
options: ['email', 'password', 'search', 'tel', 'text', 'url'],
|
|
},
|
|
},
|
|
});
|
|
</script>
|
|
|
|
{#snippet icon()}
|
|
<i class="fi fi-rr-user"></i>
|
|
{/snippet}
|
|
|
|
<Story name="Text Label" args={{ color: 'primary', name: 'text', start: 'Text' }} />
|
|
<Story name="Icon Start" args={{ color: 'secondary', name: 'text', start: icon }} />
|
|
<Story name="Icon End" args={{ color: 'secondary', name: 'text', end: icon }} />
|