algorithm/tech-interview-handbook
1
0
Fork 0
mirror of https://github.com/yangshun/tech-interview-handbook.git synced 2025-07-29 21:23:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

storybook: tweak examples

Browse Source
This commit is contained in:
Yangshun Tay
2022-10-05 20:45:58 +08:00
parent 4fcf80ae2a
commit 522feeffad
2 changed files with 26 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
apps/storybook/stories/dialog.stories.tsx
View File

@ -46,3 +46,14 @@ export function Basic({
</div> </div>
); );
} }
Basic.args = {
children: (
<div>
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eius aliquam
laudantium explicabo pariatur iste dolorem animi vitae error totam. At
sapiente aliquam accusamus facere veritatis.
</div>
),
title: 'Lorem ipsum, dolor sit amet',
};

30
apps/storybook/stories/dropdown-menu.stories.tsx
View File

@ -46,16 +46,16 @@ export function Basic({
>) { >) {
const menuItems = [ const menuItems = [
{ {
label: 'Apple', label: 'Profile',
value: 'apple', value: 'profile',
}, },
{ {
label: 'Banana', label: 'Settings',
value: 'banana', value: 'settings',
}, },
{ {
label: 'Orange', label: 'Sign Out',
value: 'orange', value: 'sign-out',
}, },
]; ];
@ -79,23 +79,23 @@ export function Basic({
Basic.args = { Basic.args = {
align: 'start', align: 'start',
label: 'Select fruitzz', label: 'More actions',
size: 'regular', size: 'regular',
}; };
export function Align() { export function Align() {
const menuItems = [ const menuItems = [
{ {
label: 'Apple', label: 'Profile',
value: 'apple', value: 'profile',
}, },
{ {
label: 'Banana', label: 'Settings',
value: 'banana', value: 'settings',
}, },
{ {
label: 'Orange', label: 'Sign Out',
value: 'orange', value: 'sign-out',
}, },
]; ];
@ -103,7 +103,7 @@ export function Align() {
return ( return (
<div className="flex justify-between"> <div className="flex justify-between">
<DropdownMenu align="start" label="Select fruit" size="regular"> <DropdownMenu align="start" label="Select an action" size="regular">
{menuItems.map(({ label, value }) => ( {menuItems.map(({ label, value }) => (
<DropdownMenu.Item <DropdownMenu.Item
key={value} key={value}
@ -115,7 +115,7 @@ export function Align() {
/> />
))} ))}
</DropdownMenu> </DropdownMenu>
<DropdownMenu align="end" label="Select fruit" size="regular"> <DropdownMenu align="end" label="Select an action" size="regular">
{menuItems.map(({ label, value }) => ( {menuItems.map(({ label, value }) => (
<DropdownMenu.Item <DropdownMenu.Item
key={value} key={value}