mirror of https://github.com/catlog22/Claude-Code-Workflow.git synced 2026-03-06 16:31:12 +08:00

Files

catlog22 f389e3e6dd feat: add dynamic pipeline detection for team sessions v5 architecture

Backend:
- Fix readLegacyFiles to handle { name, prefix }[] role format
- Add roles backfill in getEffectiveTeamMeta when meta.json exists
- Ensure pipeline_stages and roles flow correctly to API response

Team Skills:
- Add pipeline metadata initialization to all 16 team skill coordinator roles
- Each skill now reports pipeline_stages and roles to meta.json at session init

Documentation:
- Update command references and component documentation
- Add numerical-analysis-workflow skill spec
- Sync zh/en translations for commands and components

2026-03-04 14:52:07 +08:00

3.1 KiB

Raw Blame History

title, description, sidebar

title	description	sidebar
Checkbox	Checkbox component for binary choice selection	auto

Checkbox

Overview

The Checkbox component allows users to select one or more options from a set. Built on Radix UI Checkbox Primitive, it provides full accessibility support including keyboard navigation.

Live Demo

:::demo checkbox-variants Shows different checkbox states including checked, unchecked, indeterminate, and disabled :::

Props

States

Unchecked

The default state when the checkbox is not selected.

Checked

The checkbox shows a checkmark icon when selected.

Indeterminate

A mixed state (partial selection) typically used for parent checkboxes when some but not all children are selected.

Disabled

Disabled checkboxes are non-interactive and displayed with reduced opacity.

Usage Examples

Basic Checkbox

<Checkbox />

With Label

<div class="flex items-center space-x-2">
  <Checkbox id="terms" />
  <label for="terms">I agree to the terms and conditions</label>
</div>

Controlled Checkbox

<script setup>
import { ref } from 'vue'

const checked = ref(false)
</script>

<template>
  <div class="flex items-center space-x-2">
    <Checkbox v-model:checked="checked" />
    <span>{{ checked ? 'Checked' : 'Unchecked' }}</span>
  </div>
</template>

Indeterminate State

<script setup>
import { ref } from 'vue'

const state = ref('indeterminate')
</script>

<template>
  <Checkbox :checked="state" />
</template>

Form Integration

<form @submit="handleSubmit">
  <div class="space-y-2">
    <div class="flex items-center space-x-2">
      <Checkbox id="newsletter" name="newsletter" value="yes" />
      <label for="newsletter">Subscribe to newsletter</label>
    </div>
    <div class="flex items-center space-x-2">
      <Checkbox id="updates" name="updates" value="yes" />
      <label for="updates">Receive product updates</label>
    </div>
  </div>
  <Button type="submit" class="mt-4">Submit</Button>
</form>

Input
Select
Radio Group

3.1 KiB Raw Blame History