섹션 레이아웃 및 템플릿 스타일 개선

tests/unit/SectionPropertiesPanel.spec.tsx

@@ -0,0 +1,31 @@
+import { describe, it, expect, vi } from "vitest";
+import { render, screen, fireEvent } from "@testing-library/react";
+import type { SectionBlockProps } from "@/features/editor/state/editorStore";
+import { SectionPropertiesPanel } from "@/app/editor/panels/SectionPropertiesPanel";
+
+// 섹션 패널의 숫자 슬라이더/프리셋 제어가 정상적으로 동작하는지 최소 한 번은 검증한다.
+describe("SectionPropertiesPanel", () => {
+  const baseProps: SectionBlockProps = {
+    background: "default",
+    paddingY: "md",
+    columns: [],
+    maxWidthMode: "normal",
+    gapX: "md",
+  };
+
+  it("세로 패딩 프리셋/슬라이더 변경 시 updateBlock 이 paddingYPx 로 호출된다", () => {
+    const updateBlock = vi.fn();
+    render(
+      <SectionPropertiesPanel
+        sectionProps={{ ...baseProps, paddingYPx: 48 }}
+        selectedBlockId="section-1"
+        updateBlock={updateBlock}
+      />,
+    );
+
+    const slider = screen.getByLabelText("세로 패딩 슬라이더");
+    fireEvent.change(slider, { target: { value: "40" } });
+
+    expect(updateBlock).toHaveBeenCalledWith("section-1", expect.objectContaining({ paddingYPx: 40 }));
+  });
+});