feat(LayoutSwitch): create a ui component to switch SampleList layout

This commit is contained in:
Ilia Mashkov
2026-02-27 18:40:46 +03:00
parent c86b5f5db8
commit 887ca6e5e1

View File

@@ -0,0 +1,30 @@
<script lang="ts">
import { ButtonGroup } from '$shared/ui';
import { IconButton } from '$shared/ui';
import GridIcon from '@lucide/svelte/icons/layout-grid';
import ListIcon from '@lucide/svelte/icons/stretch-horizontal';
import { layoutManager } from '../../model';
interface Props {
class?: string;
}
const { class: className }: Props = $props();
function handleClick() {
layoutManager.toggleMode();
}
</script>
<ButtonGroup class={className}>
<IconButton active={layoutManager.mode === 'list'} onclick={handleClick}>
{#snippet icon()}
<ListIcon class="size-4" />
{/snippet}
</IconButton>
<IconButton active={layoutManager.mode === 'grid'} onclick={handleClick}>
{#snippet icon()}
<GridIcon class="size-4" />
{/snippet}
</IconButton>
</ButtonGroup>