import { StandardDragDropList } from '@pega/cosmos-react-dnd';
import { Flex } from '@pega/cosmos-react-core';
import StandardListDemoComp, {} from './Demo';
import { mockFields, mockViews, mockGroups } from './mockData';
export default {
    title: 'DnD/StandardDragDropList',
    component: StandardDragDropList
};
export const StandardDragDropListDemo = (args) => {
    return (<Flex container={{ direction: 'column', gap: 2 }}>
      <StandardListDemoComp items={[...mockFields.slice(0, 3), ...mockViews.slice(0, 2), mockGroups[0]]} draggable={args.draggable} info={args.info} icons={args.icons} onConfigure={args.onConfigure} onRemove={args.onRemove} onAddTo={args.onAddTo} footer={args.footer} selectable={args.selectable} onSelectionChange={args.onSelectionChange}/>
      <StandardListDemoComp items={[...mockFields.slice(3, 6), ...mockViews.slice(2, 4), mockGroups[1], mockGroups[2]]} draggable={args.draggable} info={args.info} icons={args.icons} onConfigure={args.onConfigure} onRemove={args.onRemove} onAddTo={args.onAddTo} footer={args.footer} selectable={args.selectable}/>
    </Flex>);
};
StandardDragDropListDemo.args = {
    draggable: true,
    icons: true,
    info: 'Drag and drop to reorder',
    onConfigure: true,
    onRemove: true,
    onAddTo: true,
    footer: true,
    selectable: false
};
StandardDragDropListDemo.argTypes = {
    draggable: { control: { type: 'boolean' } },
    icons: { control: { type: 'boolean' } },
    info: { control: { type: 'text' } },
    onConfigure: { control: { type: 'boolean' } },
    onRemove: { control: { type: 'boolean' } },
    onAddTo: { control: { type: 'boolean' } },
    footer: { control: { type: 'boolean' } },
    selectable: { control: { type: 'boolean' } }
};
//# sourceMappingURL=StandardDragDropList.stories.jsx.map