import { computed, ref, defineComponent, } from 'vue'; import { useDynamicBlocks, BlockDefinition, } from '../TreeElement'; import SbButton from './Button'; import SbModal from './Modal'; import './BlockPicker.scss'; export default defineComponent({ name: 'sb-block-picker', props: {}, setup(props, context) { const open = ref(false); const { customBlocks } = useDynamicBlocks(); const blockList = computed(() => Object.keys(customBlocks).map((key) => customBlocks[key])); const selectBlock = (block: BlockDefinition) => () => { open.value = false; context.emit('picked-block', { name: block.name, blockId: `${+(new Date())}`, data: block.getDefaultData(), }); }; return () => (
{ open.value = true; $event.stopPropagation(); }} >Add a block $event.stopPropagation()} eventClose={() => { open.value = false; }} > {...blockList.value.map((block: BlockDefinition) => ( {block.name} ))}
); }, });