SegmentedControl

<script lang="ts">
	import SegmentedControl from '@tcpsystems/ui/foundation/SegmentedControl';
	let view = $state('list');
</script>

<SegmentedControl
	label="View mode"
	name="view-mode"
	bind:value={view}
	options={[
		{ value: 'list', label: 'List' },
		{ value: 'grid', label: 'Grid' },
		{ value: 'kanban', label: 'Kanban' },
	]}
/>

<script lang="ts">
	import SegmentedControl from '@tcpsystems/ui/foundation/SegmentedControl';
	let frequency = $state('daily');
</script>

<SegmentedControl
	label="Report frequency"
	name="report-frequency"
	bind:value={frequency}
	options={[
		{ value: 'instant', label: 'Instant' },
		{ value: 'daily', label: 'Daily' },
		{ value: 'weekly', label: 'Weekly' },
	]}
/>