src/widgets/SampleList/ui/SampleListSection/SampleListSection.svelte

@@ -0,0 +1,33 @@
+<!--
+    Component: SampleListSection
+    Wraps SampleList with a Section component
+-->
+<script lang="ts">
+import { handleTitleStatusChanged } from '$entities/Breadcrumb';
+import type { ResponsiveManager } from '$shared/lib';
+import { cn } from '$shared/shadcn/utils/shadcn-utils';
+import { Section } from '$shared/ui';
+import {
+    type Snippet,
+    getContext,
+} from 'svelte';
+import SampleList from '../SampleList/SampleList.svelte';
+
+const responsive = getContext<ResponsiveManager>('responsive');
+</script>
+
+<Section
+    class="py-4 sm:py-10 md:py-12 gap-6 sm:gap-x-12 sm:gap-y-8"
+    index={3}
+    id="sample_set"
+    onTitleStatusChange={handleTitleStatusChanged}
+    title="Sample Set"
+    headerTitle="visual_output"
+    headerSubtitle="render_engine:"
+>
+    {#snippet content({ className })}
+        <div class={cn(className, !responsive.isDesktopLarge && 'col-start-0 col-span-2')}>
+            <SampleList />
+        </div>
+    {/snippet}
+</Section>