<script setup lang="ts">
import type { Filter } from '@/models';
import { ref, watchEffect } from 'vue'
import { ToggleButton, SelectButton, Card } from 'primevue'
const props = defineProps<{
  filter: Filter
}>()

watchEffect(() => {
  console.log(props.filter);
})
</script>

<template>
  <article class="prose dark:prose-invert">
    <h2>Filter detail:</h2>
  </article>
  <ToggleButton v-if="filter.type === 'leaf'" v-model="filter.show" onLabel="Show" offLabel="Hide" />
</template>
