import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Draggable } from 'react-beautiful-dnd';
import { DragOutlined } from '@ant-design/icons';
import { Typography } from 'antd';
export default function Item({ id, index }) {
    return (_jsx(Draggable, { draggableId: id, index: index, children: ({ draggableProps, dragHandleProps, innerRef }) => (_jsx("div", { ref: innerRef, ...draggableProps, ...dragHandleProps, style: {
                ...draggableProps.style,
                border: `1px dashed var(--dark-05-color)`,
                borderRadius: 4,
                padding: '5px 12px',
                lineHeight: '22px',
            }, children: _jsxs(Typography.Text, { ellipsis: true, style: { maxWidth: '100%' }, children: [_jsx(DragOutlined, { style: { marginRight: 8 } }), id] }) })) }));
}
//# sourceMappingURL=Item.js.map