WeDtCheckboxFilter

A compact and intuitive toggle-style filter component that behaves like a checkbox. It supports highlighted states, raw value output, and direct integration with WeDataTable filter.

<template>
  <WeDtCheckboxFilter
    v-model="filters.enabled"
    label="Enabled"
  />
</template>

<script setup>
const filters = ref({
  enabled: null,
})
</script>

Modes

The component can work in two modes:

1. Structured filter mode (default)

Emits an object like:

{
  operator: '=',
  value: true
}

2. Raw value mode

By enabling emitRawValue = true, the component emits only the toggled raw value without wrapping it in a filter object.

Props

Prop	Type	Default	Description
label	String	null	Label shown next to the checkbox
emitRawValue	Boolean	false	When true, v-model returns only the raw toggled value
trueValue	any	true	Value assigned when the component is toggled on
falseValue	any	null	Value assigned when toggled off