schlechtenburg/packages/layout/lib/display.tsx

47 lines
777 B
TypeScript
Raw Normal View History

2020-05-27 13:57:57 +00:00
import {
defineComponent,
2020-12-27 21:32:43 +00:00
computed,
2020-05-27 13:57:57 +00:00
PropType,
2020-12-27 21:32:43 +00:00
} from 'vue';
2020-05-27 13:57:57 +00:00
import {
model,
2020-12-30 13:34:23 +00:00
SbBlock,
} from '@schlechtenburg/core';
2020-05-27 13:57:57 +00:00
import {
2022-03-11 17:23:14 +00:00
ILayoutData,
2020-05-27 13:57:57 +00:00
getDefaultData,
} from './util';
import './style.scss';
export default defineComponent({
name: 'sb-layout-display',
model,
props: {
data: {
2022-03-11 17:23:14 +00:00
type: (null as unknown) as PropType<ILayoutData>,
2020-05-27 13:57:57 +00:00
default: getDefaultData,
},
},
2021-03-08 15:29:35 +00:00
setup(props) {
2020-05-27 13:57:57 +00:00
const classes = computed(() => ({
'sb-layout': true,
[`sb-layout_${props.data.orientation}`]: true,
}));
return () => (
<div class={classes.value}>
2020-05-27 15:32:35 +00:00
{...props.data.children.map((child) => (
2020-05-27 13:57:57 +00:00
<SbBlock
2021-03-07 17:47:28 +00:00
key={child.id}
2020-05-27 13:57:57 +00:00
block={child}
/>
))}
</div>
);
},
});