<template>
  <section class="kf-panels">
    <span class="kf-p-label" :title="label">{{label}}</span>
    <div class="kf-p-body">
      <a :href="aLink" target="_blank" class="kf-p-link" >{{aLink}}</a>
    </div>
  </section>
</template>

<script setup>
import { computed, toRefs } from "vue";
import {themeColor,defaultLink} from "../index.js";


const props = defineProps(['config','label']);
const { config,label } = toRefs(props);

const aLink = computed(() => {
  // console.log(config.value,'p link');
  let data = config.value;
  let link = defaultLink;
  if(data && typeof data === 'string'){
    link = config.value;
  }
  return link;
})
</script>

<style lang="scss" scoped>
.kf-p-link{
  font-style: italic;
}
</style>