2021-11-02 21:45:27 +13:00
|
|
|
<script>
|
|
|
|
import { getContext } from "svelte"
|
|
|
|
import { generate } from "shortid"
|
2022-08-24 02:53:28 +12:00
|
|
|
import { builderStore } from "../stores/builder.js"
|
2021-11-02 21:45:27 +13:00
|
|
|
import Component from "components/Component.svelte"
|
|
|
|
|
|
|
|
export let type
|
|
|
|
export let props
|
|
|
|
export let styles
|
2022-08-24 06:30:35 +12:00
|
|
|
export let css
|
2021-11-09 03:35:58 +13:00
|
|
|
export let context
|
2022-07-01 06:31:25 +12:00
|
|
|
export let order = 0
|
2022-08-24 19:37:53 +12:00
|
|
|
export let containsSlot = false
|
2021-11-02 21:58:50 +13:00
|
|
|
|
|
|
|
// ID is only exposed as a prop so that it can be bound to from parent
|
|
|
|
// block components
|
2021-11-02 21:45:27 +13:00
|
|
|
export let id
|
|
|
|
|
2022-07-01 06:31:25 +12:00
|
|
|
const component = getContext("component")
|
2021-11-02 21:45:27 +13:00
|
|
|
const block = getContext("block")
|
|
|
|
const rand = generate()
|
|
|
|
|
2021-11-02 21:58:50 +13:00
|
|
|
// Create a fake component instance so that we can use the core Component
|
|
|
|
// to render this part of the block, taking advantage of binding enrichment
|
2021-11-09 03:35:58 +13:00
|
|
|
$: id = `${block.id}-${context ?? rand}`
|
2021-11-03 01:58:38 +13:00
|
|
|
$: instance = {
|
|
|
|
_component: `@budibase/standard-components/${type}`,
|
|
|
|
_id: id,
|
2022-08-24 02:53:28 +12:00
|
|
|
_instanceName: type[0].toUpperCase() + type.slice(1),
|
2021-11-03 01:58:38 +13:00
|
|
|
_styles: {
|
|
|
|
normal: {
|
|
|
|
...styles,
|
2021-11-02 21:45:27 +13:00
|
|
|
},
|
2022-08-24 06:30:35 +12:00
|
|
|
custom: css,
|
2021-11-03 01:58:38 +13:00
|
|
|
},
|
2022-08-24 19:37:53 +12:00
|
|
|
_containsSlot: containsSlot,
|
2021-11-03 01:58:38 +13:00
|
|
|
...props,
|
2021-11-02 21:45:27 +13:00
|
|
|
}
|
2022-08-24 02:53:28 +12:00
|
|
|
|
|
|
|
// Register this block component if we're inside the builder so it can be
|
|
|
|
// ejected later
|
|
|
|
$: {
|
|
|
|
if ($builderStore.inBuilder) {
|
2022-08-24 06:37:38 +12:00
|
|
|
block.registerComponent(id, order ?? 0, $component?.id, instance)
|
2022-08-24 02:53:28 +12:00
|
|
|
}
|
|
|
|
}
|
2021-11-02 21:45:27 +13:00
|
|
|
</script>
|
|
|
|
|
2021-11-13 04:19:25 +13:00
|
|
|
<Component {instance} isBlock>
|
2021-11-02 21:45:27 +13:00
|
|
|
<slot />
|
|
|
|
</Component>
|