45 lines
729 B
TypeScript
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,
|
||
|
|
},
|
||
|
|
);
|
||
|
|
},
|
||
|
|
});
|