<template>
	<div class="code-sample" :class="class$container" v-highlight>
		<pre><code>{{ code }}</code></pre>
	</div>
</template>

<script lang="ts">
import { Vue, Component, Prop } from "vue-property-decorator"

@Component
export default class CodeSampleComponent extends Vue
{
	@Prop() readonly code!: string
	@Prop() readonly lang!: string

	get class$container()
	{
		return {
			[`language-${ this.lang }`]: true
		}
	}
}
</script>

<style lang="less" scoped>
.code-sample {
	code { user-select: text; }
}
</style>