schlechtenburg/packages/heading/lib/display.ts
2022-03-11 18:23:14 +01:00

45 lines
729 B
TypeScript

import {
defineComponent,
computed,
PropType,
h,
} from 'vue';
import {
model,
} from '@schlechtenburg/core';
import {
getDefaultData,
IHeadingData,
} from './util';
import './style.scss';
export default defineComponent({
name: 'sb-heading-display',
model,
props: {
data: {
type: Object as PropType<IHeadingData>,
default: getDefaultData,
},
},
setup(props) {
const classes = computed(() => ({
'sb-heading': true,
[`sb-heading_align-${props.data.align}`]: true,
[`sb-heading_${props.data.level}`]: true,
}));
return () => h(
`h${props.data.level}`,
{
class: classes,
innerHTML: props.data.value,
},
);
},
});