<template>
  <CodeDiff
    language="json"
    :context="999999"
    :hideHeader="false"
    :old-string="oldString"
    :new-string="newString"
    :output-format="mode"
    :theme="theme"
  />
</template>

<script setup>
import { ref, watch } from 'vue';
import { CodeDiff } from 'v-code-diff';
import { useSystemStore } from '@/store/index';

const props = defineProps({
  oldString: {
    type: String,
    default: '',
  },
  newString: {
    type: String,
    default: '',
  },
  mode: {
    type: String,
    default: 'line-by-line',
  },
});

const systemStore = useSystemStore();

// 主题
const theme = ref(systemStore.theme);
watch(
  () => systemStore.theme,
  (value) => {
    theme.value = value;
  }
);
</script>

<style lang="scss" scoped></style>
