[feat] Enhance Storybook stories for UI components

- Update MoreButton story with transparent button styling and icon sizes
- Add new controls to MultiSelect story for searchBar, selectedCount, and clearButton
- Add hasBorder control to SearchBox story for border customization

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Jin Yi
2025-08-21 23:11:08 +09:00
parent 2358a97fe9
commit c4e42e5125
3 changed files with 23 additions and 4 deletions

View File

@@ -24,22 +24,22 @@ export const Basic: Story = {
<MoreButton>
<template #default="{ close }">
<IconTextButton
type="secondary"
type="transparent"
label="Settings"
@click="() => { close() }"
>
<template #icon>
<Download />
<Download :size="16" />
</template>
</IconTextButton>
<IconTextButton
type="primary"
type="transparent"
label="Profile"
@click="() => { close() }"
>
<template #icon>
<ScrollText />
<ScrollText :size="16" />
</template>
</IconTextButton>
</template>

View File

@@ -13,6 +13,21 @@ const meta: Meta<typeof MultiSelect> = {
},
options: {
control: 'object'
},
hasSearchBox: {
control: 'boolean',
description: 'Toggle searchBar visibility'
},
showSelectedCount: {
control: 'boolean',
description: 'Toggle selected count visibility'
},
hasClearButton: {
control: 'boolean',
description: 'Toggle clear button visibility'
},
searchPlaceholder: {
control: 'text'
}
}
}

View File

@@ -10,6 +10,10 @@ const meta: Meta<typeof SearchBox> = {
argTypes: {
placeHolder: {
control: 'text'
},
hasBorder: {
control: 'boolean',
description: 'Toggle border prop'
}
}
}