invoke-prompt-editor-demo/src/components/LibraryItem.tsx

27 lines
889 B
TypeScript

import { Composable } from "./IComposable";
import { LibraryItem as LibItem } from "../lib/prompt";
import AddCircleOutlineOutlinedIcon from '@mui/icons-material/AddCircleOutlineOutlined';
import { Button } from "@material-ui/core";
export interface StyleProps {
item: LibItem
onInsertItem: (item: LibItem) => void;
}
export function LibraryItem(props: StyleProps) {
const { item, onInsertItem } = props
return (
<div>
<Button onClick={() => onInsertItem(item)} aria-label="Add">
<AddCircleOutlineOutlinedIcon/>
</Button>
<span>
{
item.name ? (
<div className={`catetory-${item.category}`}>{item.name} - {item.prompt}</div>
) : (<div>{item.prompt}</div>)
}
</span>
</div>
) as Composable;
};