import React from 'react';
import Dropdown from '../index';
import Avatar from '../../avatar';
import Button from '@douyinfe/semi-ui/button/index';
import InTableDemo from './inTable';
import AutoClose from './AutoClose';
import MultiDropdown from './MultiDropdown';
import DisabledItem from './DisabledItem';
import InHoverElements from './InHoverElements';
import WrapAvatar from './WrapAvatar';
import { IconChevronDown, IconBox, IconSimilarity } from '@douyinfe/semi-icons';
export default {
title: 'Dropdown',
parameters: {
chromatic: { disableSnapshot: true },
}
}
export {
InTableDemo,
MultiDropdown,
DisabledItem,
InHoverElements,
WrapAvatar
}
let style = {
display: 'inline-block',
padding: '20px',
};
const change = visible => {
debugger;
};
export const Dropdown1 = () => (
1111
2222 What if the text is super long? Longer than whatever you've known
It looks OK
}
>
分割线
333
44444
}
>
hover
333
44444
}
>
hover bottomRight
333
44444
}
>
hover bottomLeft
);
export const Dropdown2 = () => {
return (
1111
2222 What if the text is super long? Longer than whatever you've known
It looks OK
}
>
);
};
export const AvatarDemo = () => {
return (
document.querySelector('#dropdown-container')}
render={
1111
2222 What if the text is super long? Longer than whatever you've known
It looks OK
}
>
);
};
export const DropdownOnVisibleChange = () => {
return (
{
console.log('onVisibleChange: ', ...args);
}}
render={
1111
2222 What if the text is super long? Longer than whatever you've known
It looks OK
}
>
);
};
export const DropdownAutoCloseWhenClicked = () => ;
DropdownAutoCloseWhenClicked.story = {
name: 'dropdown auto close when clicked',
};
export const DropdownItemType = () => (
<>
primary
secondary
tertiary
warning
danger
default
}
>
Different type Item
primary
secondary
tertiary
warning
编辑danger
default
}
>
Different type Item
>
);
export function DropdownItemPropsDemo() {
return (
}>Menu Item 1
Menu Item 2
Menu Item 3
primary
secondary
tertiary
warning
}
type="danger"
>
danger
}
>
}>
Menu Item 1
Menu Item 2
Menu Item 3
primary
secondary
tertiary
warning
}
type="danger"
>
danger
}
>
);
}