@ihabdevteam/core 0.205.0 → 0.207.0

package/dist/ihabdevteam-core.d.ts

@@ -1626,7 +1626,7 @@ export declare function copyText(text: string): Promise<boolean>;
  *
  * 값은 손으로 적고 `test/coreVersion.test.ts` 가 package.json 과 어긋나면 운다.
  */
-export declare const CORE_VERSION = "0.205.0";
+export declare const CORE_VERSION = "0.207.0";
 
 /** @public */
 declare const coreDefault: Record<string, unknown>;
@@ -2350,7 +2350,7 @@ export declare const FILTER_ALL_VALUE = "\uC804\uCCB4";
 export declare function filterContrastCandidates(answer: string, candidates: Iterable<string>, opts: ContrastFilterOpts): string[];
 
 /** @public */
-export declare function FilterPanel({ title, headerAction, collapsible, defaultCollapsed, collapsed: controlledCollapsed, onCollapsedChange, footer, sections, selected, onSelect, align, sectionAlign, className, }: FilterPanelProps): JSX.Element;
+export declare function FilterPanel({ title, headerAction, headerSummary, collapsible, defaultCollapsed, collapsed: controlledCollapsed, onCollapsedChange, footer, sections, selected, onSelect, align, sectionAlign, className, }: FilterPanelProps): JSX.Element;
 
 /** @public */
 export declare interface FilterPanelItem {
@@ -2372,7 +2372,25 @@ export declare interface FilterPanelItem {
 export declare interface FilterPanelProps {
     title?: ReactNode;
     headerAction?: ReactNode;
-    /** 헤더 우측에 접기/펼치기 토글 버튼을 노출하고, 접으면 본문(섹션)을 숨긴다. */
+    /** 머리 오른쪽에 **접혀도 남는** 자리 — 접힌 판이 제 속을 한 줄로 말하게 한다("등급 전체 · 품사 전체" 같은 요약).
+     *
+     *  `headerAction` 은 펼쳤을 때만 서고 접으면 사라진다(본문을 다루는 단추라 접힌 판에서는 할 일이 없다).
+     *  그래서 접힌 판이 무엇을 담고 있는지 말할 자리가 `title` 밖에 없었고, 소비자가 제목 안에 요약을 싣고
+     *  CSS 로 오른쪽 끝까지 미는 억지를 썼다(말귀 단어표 만들기 2026-09-29).
+     *  **펼치면 그 자리를 `headerAction` 이 쓴다** — 둘은 같은 칸을 번갈아 쓴다.
+     *
+     *  **안 주면 코어가 짓는다** — `절 이름 + 고른 값` 을 ` · ` 으로 이어 한 줄로 만든다
+     *  (`등급 전체 · 음절 수 2음절`). 이름표도 값도 코어 것이라 부르는 쪽이 옮겨 적으면 두 벌이 되고,
+     *  표 설정 판처럼 값이 `WordTableBlock` 안에 있는 자리는 부르는 쪽이 지을 길조차 없다
+     *  (말귀 요청 ㉗, 2026-09-29). 셈은 `utils/filterPanelSummary` 에 있다.
+     *
+     *  **주면 준 것이 이긴다** — 글월을 부르는 쪽이 쥐고 싶을 때 쓴다. 코어는 자리만 낸다 —
+     *  여러 조각을 넣을 때는 묶음에 `role="group"` 과 한 줄짜리 `aria-label` 을 주고 낱개는 `aria-hidden` 으로
+     *  숨기는 편이 낫다(낭독기가 조각마다 끊어 읽지 않게). */
+    headerSummary?: ReactNode;
+    /** 헤더 우측에 접기/펼치기 토글 버튼을 노출하고, 접으면 본문(섹션)을 숨긴다.
+     *  **머리 줄 전체가 손잡이다** — 머리 아무 데나 눌러도 접힌다(사용자 지시 2026-09-29).
+     *  `headerAction`·`headerSummary` 안의 단추·입력칸을 누른 것은 접지 않는다. */
     collapsible?: boolean;
     /** collapsible일 때 초기 접힘 상태 */
     defaultCollapsed?: boolean;
@@ -7265,6 +7283,16 @@ export declare function TableFilterPanel(props: TableFilterPanelProps): JSX.Elem
 declare interface TableFilterPanelBaseProps {
     /** 패널 제목. 미지정 시 i18n(wordTable.filterTitle) 기본값 사용. */
     title?: ReactNode;
+    /** 머리에 접기 손잡이를 두고 머리 줄 전체를 손잡이로 만든다(`FilterPanel` 의 것). */
+    collapsible?: boolean;
+    /** 처음에 접힌 채로 연다. */
+    defaultCollapsed?: boolean;
+    /** 접힘을 바깥에서 쥔다(controlled). */
+    collapsed?: boolean;
+    /** 접힘이 바뀔 때 알린다. */
+    onCollapsedChange?: (collapsed: boolean) => void;
+    /** 접혀도 남는 머리 오른쪽 자리 — 요약. */
+    headerSummary?: ReactNode;
     className?: string;
 }
 
@@ -10223,7 +10251,7 @@ export declare interface WordRow {
  * [단어 선정] 패널이 원 출처(섹션 구성은 다르지만 같은 셸을 공용).
  * @public
  */
-export declare function WordSearchFilterPanel({ title, sections, selected, onSelect, className }: WordSearchFilterPanelProps): JSX.Element;
+export declare function WordSearchFilterPanel({ title, sections, selected, onSelect, collapsible, defaultCollapsed, collapsed, onCollapsedChange, headerSummary, headerAction, className, }: WordSearchFilterPanelProps): JSX.Element;
 
 /** @public */
 export declare interface WordSearchFilterPanelProps {
@@ -10237,6 +10265,18 @@ export declare interface WordSearchFilterPanelProps {
     sections: FilterPanelSection[];
     selected: Record<string, string | string[]>;
     onSelect: (value: string, sectionLabel: string) => void;
+    /** 머리에 접기 손잡이를 두고 머리 줄 전체를 손잡이로 만든다 — `FilterPanel` 의 것을 그대로 넘긴다. */
+    collapsible?: boolean;
+    /** 처음에 접힌 채로 연다(`collapsible` 과 함께). */
+    defaultCollapsed?: boolean;
+    /** 접힘을 바깥에서 쥔다(controlled). */
+    collapsed?: boolean;
+    /** 접힘이 바뀔 때 알린다. */
+    onCollapsedChange?: (collapsed: boolean) => void;
+    /** 접혀도 남는 머리 오른쪽 자리 — 접힌 판이 제 속을 말하는 요약(`FilterPanel headerSummary`). */
+    headerSummary?: ReactNode;
+    /** 펼쳤을 때 머리 오른쪽에 서는 조작부(`FilterPanel headerAction`). */
+    headerAction?: ReactNode;
     className?: string;
 }
 
@@ -10326,12 +10366,24 @@ export declare interface WordSearchResultWord {
  */
 export declare function WordTable({ title, titleIcon, disc, className, orientation, contentTypes, cutLine, showOutline, showDivLine, items, editCells, count, activeCell, onActivateCell, onRemoveCell, onRemoveItem, onReorder, renderCellAction, showFillerAdd, contentRef, buttonSize, pageNumber, pageNumberPosition, fitHeight, scoring, marks, onMarkClick, scoreIndexOffset, }: WordTableProps): JSX.Element;
 
-export declare function WordTableBlock({ title, titleIcon, disc, items, onSaveComplete, onLoad, onRemoveItem, onReset, resetLabel, saveButtonLabel, secondarySaveButtonLabel, onReorder, showCellCount, onAddItem, className, renderSavePopup, renderWordSearch, hideControls, saveOnly, tableName, nameValue, onNameChange, descriptionValue, onDescriptionChange, namePlaceholder, descriptionPlaceholder, existingNames, editingName, onCancel, initialItemsPerPage, renderCellAction, actionsLeftExtra }: WordTableBlockProps): JSX.Element;
+export declare function WordTableBlock({ title, titleIcon, disc, filterTitle, filterCollapsible, filterDefaultCollapsed, filterHeaderSummary, items, onSaveComplete, onLoad, onRemoveItem, onReset, resetLabel, saveButtonLabel, secondarySaveButtonLabel, onReorder, showCellCount, onAddItem, className, renderSavePopup, renderWordSearch, hideControls, saveOnly, tableName, nameValue, onNameChange, descriptionValue, onDescriptionChange, namePlaceholder, descriptionPlaceholder, existingNames, editingName, onCancel, initialItemsPerPage, renderCellAction, actionsLeftExtra }: WordTableBlockProps): JSX.Element;
 
 /** @public */
 export declare interface WordTableBlockProps {
     title?: ReactNode;
     titleIcon?: string;
+    /** 안쪽 **표 설정 판의 제목** — 안 주면 코어 기본값(`wordTable.filterTitle`, '표 설정').
+     *
+     *  화면마다 달라야 한다(단어표는 '단어표 설정', 대립쌍표는 그 화면 말) — 그래서 코어 기본값을 바꾸는 것으로는 안 되고,
+     *  앱 사전으로 코어 열쇠를 덮는 것은 말귀의 `guards/i18nOwnership` 이 막는다(옳은 규칙이다).
+     *  **부르는 쪽이 제 열쇠로 지어 넘긴다**(말귀 2026-09-29). */
+    filterTitle?: ReactNode;
+    /** 안쪽 표 설정 판을 접을 수 있게 한다 — 머리 줄 전체가 손잡이다. */
+    filterCollapsible?: boolean;
+    /** 그 판을 처음에 접힌 채로 연다(`filterCollapsible` 과 함께). */
+    filterDefaultCollapsed?: boolean;
+    /** 그 판이 접혀도 머리 오른쪽에 남는 자리 — 요약. */
+    filterHeaderSummary?: ReactNode;
     disc?: ReactNode;
     /** 현재 표의 저장된 이름(불러온 표 등). 있으면 인쇄/PDF 저장 시 파일명으로 사용, 없으면 "오늘 날짜 + 단어표/대립쌍표" */
     tableName?: string;

package/dist/packages/core/src/components/FilterPanel.css

@@ -13,6 +13,9 @@
     display: flex;
     align-items: center;
     justify-content: space-between;
+    /* 제목과 요약이 맞닿지 않게 — 요약이 길면 `space-between` 의 빈 곳이 0이 되어
+       '표 설정구성 이미지…' 로 붙어 읽힌다(실측 2026-09-29). */
+    gap: var(--spacing-s);
 }
 
 /* ── 접기 가능한 패널 ─────────────────────────────────────────
@@ -26,6 +29,18 @@
 .filter-panel--collapsible .filter-panel__header {
     min-height: 60px;
     flex-shrink: 0;
+    /* 머리 줄 전체가 손잡이다(사용자 지시 2026-09-29) — 소비자가 감싸개에 onClick 을 달아
+       머리 안을 눌렀는지 보던 자리다. 안의 단추·입력칸을 누른 것은 컴포넌트가 걸러 낸다. */
+    cursor: pointer;
+}
+/* 접기 손잡이는 **아이콘만** 보인다 — 단추의 바탕·네모 티를 지운다(사용자 지시).
+   포커스 테두리는 남긴다: 키보드 쓰는 사람에게 그 자리가 어디인지 알리는 유일한 표시다. */
+.filter-panel__collapse-toggle,
+.filter-panel__collapse-toggle:hover,
+.filter-panel__collapse-toggle:active {
+    background: transparent;
+    border: none;
+    box-shadow: none;
 }
 .filter-panel--collapsible .filter-panel__sections {
     padding-bottom: var(--spacing-m);
@@ -42,6 +57,10 @@
 .filter-panel__title {
     display: block;
     text-align: left;
+    /* 안 접힌다 — 넘치면 …로 자른다(title-row 의 `max-width` 에 닿았을 때) */
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
 }
 
 /* 헤더 좌측: 접기 버튼 + 타이틀 인라인 */
@@ -50,12 +69,29 @@
     align-items: center;
     gap: var(--spacing-xs);
     min-width: 0;
+    /* **제목이 먼저 자리를 얻고 요약이 양보한다.** 접힌 판의 요약은 길어서(표 설정은 절이 일곱이다)
+       둘이 같이 줄면 짧은 제목이 두 줄로 접혀 60px 머리에 눌린다(실측 2026-09-29: '표 설정' 52px).
+       그렇다고 제목이 머리를 다 먹으면 요약이 통째로 사라지므로 절반까지만 준다. */
+    flex-shrink: 0;
+    max-width: 50%;
+}
+
+
+/* 접힌 판이 제 속을 말하는 한 줄 — 길어지면 줄이지 말고 …로 자른다(머리는 한 줄 높이다).
+   `min-width: 0` 이 없으면 flex 칸이 제 속만큼 벌어져 제목을 밀어낸다. */
+.filter-panel__header-summary {
+    color: var(--color-gray);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    min-width: 0;
 }
 
 .filter-panel__header-actions {
     display: flex;
     align-items: center;
     gap: var(--spacing-xs);
+    min-width: 0;
     margin-left: auto;
 }
 

package/dist/packages/core/src/components/FilterPanel.d.ts

@@ -7,7 +7,25 @@ import type { FilterPanelSection } from '../types/filterPanel';
 export interface FilterPanelProps {
     title?: ReactNode;
     headerAction?: ReactNode;
-    /** 헤더 우측에 접기/펼치기 토글 버튼을 노출하고, 접으면 본문(섹션)을 숨긴다. */
+    /** 머리 오른쪽에 **접혀도 남는** 자리 — 접힌 판이 제 속을 한 줄로 말하게 한다("등급 전체 · 품사 전체" 같은 요약).
+     *
+     *  `headerAction` 은 펼쳤을 때만 서고 접으면 사라진다(본문을 다루는 단추라 접힌 판에서는 할 일이 없다).
+     *  그래서 접힌 판이 무엇을 담고 있는지 말할 자리가 `title` 밖에 없었고, 소비자가 제목 안에 요약을 싣고
+     *  CSS 로 오른쪽 끝까지 미는 억지를 썼다(말귀 단어표 만들기 2026-09-29).
+     *  **펼치면 그 자리를 `headerAction` 이 쓴다** — 둘은 같은 칸을 번갈아 쓴다.
+     *
+     *  **안 주면 코어가 짓는다** — `절 이름 + 고른 값` 을 ` · ` 으로 이어 한 줄로 만든다
+   *  (`등급 전체 · 음절 수 2음절`). 이름표도 값도 코어 것이라 부르는 쪽이 옮겨 적으면 두 벌이 되고,
+   *  표 설정 판처럼 값이 `WordTableBlock` 안에 있는 자리는 부르는 쪽이 지을 길조차 없다
+   *  (말귀 요청 ㉗, 2026-09-29). 셈은 `utils/filterPanelSummary` 에 있다.
+   *
+   *  **주면 준 것이 이긴다** — 글월을 부르는 쪽이 쥐고 싶을 때 쓴다. 코어는 자리만 낸다 —
+     *  여러 조각을 넣을 때는 묶음에 `role="group"` 과 한 줄짜리 `aria-label` 을 주고 낱개는 `aria-hidden` 으로
+     *  숨기는 편이 낫다(낭독기가 조각마다 끊어 읽지 않게). */
+    headerSummary?: ReactNode;
+    /** 헤더 우측에 접기/펼치기 토글 버튼을 노출하고, 접으면 본문(섹션)을 숨긴다.
+     *  **머리 줄 전체가 손잡이다** — 머리 아무 데나 눌러도 접힌다(사용자 지시 2026-09-29).
+     *  `headerAction`·`headerSummary` 안의 단추·입력칸을 누른 것은 접지 않는다. */
     collapsible?: boolean;
     /** collapsible일 때 초기 접힘 상태 */
     defaultCollapsed?: boolean;
@@ -31,4 +49,4 @@ export interface FilterPanelProps {
     className?: string;
 }
 /** @public */
-export default function FilterPanel({ title, headerAction, collapsible, defaultCollapsed, collapsed: controlledCollapsed, onCollapsedChange, footer, sections, selected, onSelect, align, sectionAlign, className, }: FilterPanelProps): import("react").JSX.Element;
+export default function FilterPanel({ title, headerAction, headerSummary, collapsible, defaultCollapsed, collapsed: controlledCollapsed, onCollapsedChange, footer, sections, selected, onSelect, align, sectionAlign, className, }: FilterPanelProps): import("react").JSX.Element;

package/dist/packages/core/src/components/FilterPanel.js

@@ -1,7 +1,7 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { cx } from '../utils/cx';
-import { Fragment, useState } from 'react';
+import { Fragment, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import './FilterPanel.css';
 import Button from './Button';
@@ -12,8 +12,9 @@ export { FILTER_ALL_VALUE } from '../types/filterPanel';
 import { FILTER_ALL_VALUE } from '../types/filterPanel';
 import FilterSectionInfo from './FilterSectionInfo';
 import { devWarnOnce } from '../utils/devWarn';
+import { buildFilterSummary } from '../utils/filterPanelSummary';
 /** @public */
-export default function FilterPanel({ title, headerAction, collapsible = false, defaultCollapsed = false, collapsed: controlledCollapsed, onCollapsedChange, footer, sections, selected = {}, onSelect, align, sectionAlign, className, }) {
+export default function FilterPanel({ title, headerAction, headerSummary, collapsible = false, defaultCollapsed = false, collapsed: controlledCollapsed, onCollapsedChange, footer, sections, selected = {}, onSelect, align, sectionAlign, className, }) {
     // align 우선. 없으면 구 prop(sectionAlign) 매핑, 그것도 없으면 inline 기본.
     const isRow = (align ?? (sectionAlign === 'vertical' ? 'newline' : sectionAlign === 'horizontal' ? 'inline' : 'inline')) === 'inline';
     const { t } = useTranslation();
@@ -24,13 +25,34 @@ export default function FilterPanel({ title, headerAction, collapsible = false,
         setInternalCollapsed(next);
         onCollapsedChange?.(next);
     };
-    const showHeader = title || headerAction || collapsible;
-    return (_jsxs("div", { className: cx('filter-panel', collapsible ? 'filter-panel--collapsible' : '', collapsed ? 'filter-panel--collapsed' : '', className), children: [showHeader && (_jsxs("div", { className: "filter-panel__header", children: [_jsxs("div", { className: "filter-panel__title-row", children: [collapsible && (_jsx(Button, { htmlType: "button", size: 40, type: "dot", variant: "transparent-gray", useBorder: false, icon: collapsed ? 'chevron-down' : 'chevron-up', 
+    /* 머리 아무 데나 눌러도 접힌다. 다만 **그 안의 조작부를 누른 것은 아니다** —
+       `headerAction` 의 단추(초기화 등)를 누르면 그 일만 하고 판은 그대로 둔다.
+       chevron 단추는 제 `onClick` 으로 접으므로 여기서 한 번 더 접지 않는다(두 번 접히면 제자리다). */
+    const 머리누름 = (e) => {
+        if (!collapsible)
+            return;
+        const el = e.target;
+        if (!el || typeof el.closest !== 'function')
+            return;
+        if (el.closest('.filter-panel__collapse-toggle'))
+            return;
+        if (el.closest('button, a, input, select, textarea, label, [role="radiogroup"], [role="button"], [role="menu"]'))
+            return;
+        toggleCollapsed();
+    };
+    /* 안 주면 **코어가 짓는다** — 이름표도 값도 코어 것이라 부르는 쪽이 옮겨 적으면 두 벌이 되고,
+       표 설정 판처럼 값이 아예 `WordTableBlock` 안에 있는 자리는 지을 길조차 없다(말귀 요청 ㉗).
+       `headerSummary` 를 주면 그것이 이긴다 — 글월을 부르는 쪽이 쥐던 길은 그대로 열려 있다.
+       접혀 있을 때만 쓰이므로 펼친 동안은 셈하지 않는다. */
+    const 기본요약 = useMemo(() => (headerSummary !== undefined || !collapsed ? '' : buildFilterSummary(sections, selected, t('common.all', '전체'))), [headerSummary, collapsed, sections, selected, t]);
+    const summaryNode = headerSummary ?? (기본요약 ? _jsx("span", { className: "filter-panel__header-summary body-3", children: 기본요약 }) : null);
+    const showHeader = title || headerAction || headerSummary || collapsible;
+    return (_jsxs("div", { className: cx('filter-panel', collapsible ? 'filter-panel--collapsible' : '', collapsed ? 'filter-panel--collapsed' : '', className), children: [showHeader && (_jsxs("div", { className: "filter-panel__header", onClick: collapsible ? 머리누름 : undefined, children: [_jsx("div", { className: "filter-panel__title-row", children: title && _jsx("span", { className: "filter-panel__title h4", children: title }) }), _jsxs("div", { className: "filter-panel__header-actions", children: [collapsed ? summaryNode : headerAction, collapsible && (_jsx(Button, { htmlType: "button", size: 40, type: "dot", variant: "transparent-gray", useBorder: false, icon: collapsed ? 'chevron-down' : 'chevron-up', 
                                 /* Button은 aria-label을 자기 ariaLabel prop으로 덮어쓴다({...rest} 뒤에
                                    aria-label={ariaLabelString}을 다시 쓴다) — kebab으로 넘기면 undefined가
                                    되어 이름이 통째로 사라진다. 저장소의 다른 호출부는 모두 ariaLabel을 쓴다.
                                    문구도 이 파일만 한국어로 박혀 있었다(키는 이미 있다). */
-                                ariaLabel: collapsed ? t('common.expand', '펼치기') : t('common.collapse', '접기'), "aria-expanded": !collapsed, onClick: toggleCollapsed })), title && _jsx("span", { className: "filter-panel__title h4", children: title })] }), _jsx("div", { className: "filter-panel__header-actions", children: !collapsed && headerAction })] })), !collapsed && (_jsxs(_Fragment, { children: [_jsx("div", { className: cx('filter-panel__sections', isRow ? 'filter-panel__sections--row' : ''), children: sections.map(section => {
+                                className: "filter-panel__collapse-toggle", ariaLabel: collapsed ? t('common.expand', '펼치기') : t('common.collapse', '접기'), "aria-expanded": !collapsed, onClick: toggleCollapsed }))] })] })), !collapsed && (_jsxs(_Fragment, { children: [_jsx("div", { className: cx('filter-panel__sections', isRow ? 'filter-panel__sections--row' : ''), children: sections.map(section => {
                             const sel = selected[section.label];
                             const isAllSelected = sel === undefined || (Array.isArray(sel) ? sel.length === 0 : false);
                             // section.items에 빈 항목(null/undefined)이 섞여 들어오면 item.value 접근에서

package/dist/packages/core/src/components/Word/TableFilterPanel.d.ts

@@ -5,6 +5,16 @@ import { type TableSettingsSetters } from './wordTableSettings';
 interface TableFilterPanelBaseProps {
     /** 패널 제목. 미지정 시 i18n(wordTable.filterTitle) 기본값 사용. */
     title?: ReactNode;
+    /** 머리에 접기 손잡이를 두고 머리 줄 전체를 손잡이로 만든다(`FilterPanel` 의 것). */
+    collapsible?: boolean;
+    /** 처음에 접힌 채로 연다. */
+    defaultCollapsed?: boolean;
+    /** 접힘을 바깥에서 쥔다(controlled). */
+    collapsed?: boolean;
+    /** 접힘이 바뀔 때 알린다. */
+    onCollapsedChange?: (collapsed: boolean) => void;
+    /** 접혀도 남는 머리 오른쪽 자리 — 요약. */
+    headerSummary?: ReactNode;
     className?: string;
 }
 /**

package/dist/packages/core/src/components/Word/TableFilterPanel.js

@@ -16,9 +16,11 @@ function isShellProps(props) {
  */
 export default function TableFilterPanel(props) {
     const { t } = useTranslation();
-    const { title, className } = props;
+    const { title, className, collapsible, defaultCollapsed, collapsed, onCollapsedChange, headerSummary } = props;
+    /* 두 갈래(껍데기 모드·표 설정 모드)가 같은 접기 값을 쓴다 — 한쪽만 넘기면 화면마다 다르게 접힌다 */
+    const 접기 = { collapsible, defaultCollapsed, collapsed, onCollapsedChange, headerSummary };
     if (isShellProps(props)) {
-        return (_jsx(FilterPanel, { className: className, title: title ?? t('wordTable.filterTitle', '표 설정'), sections: props.sections, selected: props.selected, onSelect: props.onSelect, align: "inline" }));
+        return (_jsx(FilterPanel, { className: className, title: title ?? t('wordTable.filterTitle', '표 설정'), sections: props.sections, selected: props.selected, onSelect: props.onSelect, ...접기, align: "inline" }));
     }
     const { hasImage, hasColloquial, contentTypes, orientation, showOutline, cutLine, showDivLine, setters, showCutLine = false, showDivLine2 = false, middleSections = [], extraSelected = {}, onExtraSelect, } = props;
     const sections = [
@@ -38,5 +40,5 @@ export default function TableFilterPanel(props) {
             return;
         onExtraSelect?.(value, sectionLabel);
     };
-    return (_jsx(FilterPanel, { className: className, title: title ?? t('wordTable.filterTitle', '표 설정'), sections: sections, selected: selected, onSelect: onSelect, sectionAlign: "horizontal" }));
+    return (_jsx(FilterPanel, { className: className, title: title ?? t('wordTable.filterTitle', '표 설정'), sections: sections, selected: selected, onSelect: onSelect, ...접기, sectionAlign: "horizontal" }));
 }

package/dist/packages/core/src/components/Word/WordSearchFilterPanel.d.ts

@@ -12,6 +12,18 @@ export interface WordSearchFilterPanelProps {
     sections: FilterPanelSection[];
     selected: Record<string, string | string[]>;
     onSelect: (value: string, sectionLabel: string) => void;
+    /** 머리에 접기 손잡이를 두고 머리 줄 전체를 손잡이로 만든다 — `FilterPanel` 의 것을 그대로 넘긴다. */
+    collapsible?: boolean;
+    /** 처음에 접힌 채로 연다(`collapsible` 과 함께). */
+    defaultCollapsed?: boolean;
+    /** 접힘을 바깥에서 쥔다(controlled). */
+    collapsed?: boolean;
+    /** 접힘이 바뀔 때 알린다. */
+    onCollapsedChange?: (collapsed: boolean) => void;
+    /** 접혀도 남는 머리 오른쪽 자리 — 접힌 판이 제 속을 말하는 요약(`FilterPanel headerSummary`). */
+    headerSummary?: ReactNode;
+    /** 펼쳤을 때 머리 오른쪽에 서는 조작부(`FilterPanel headerAction`). */
+    headerAction?: ReactNode;
     className?: string;
 }
 /**
@@ -20,4 +32,4 @@ export interface WordSearchFilterPanelProps {
  * [단어 선정] 패널이 원 출처(섹션 구성은 다르지만 같은 셸을 공용).
  * @public
  */
-export default function WordSearchFilterPanel({ title, sections, selected, onSelect, className }: WordSearchFilterPanelProps): import("react").JSX.Element;
+export default function WordSearchFilterPanel({ title, sections, selected, onSelect, collapsible, defaultCollapsed, collapsed, onCollapsedChange, headerSummary, headerAction, className, }: WordSearchFilterPanelProps): import("react").JSX.Element;

package/dist/packages/core/src/components/Word/WordSearchFilterPanel.js

@@ -2,13 +2,15 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useTranslation } from 'react-i18next';
 import FilterPanel from '../FilterPanel';
+/* 이 넷이 없어서 소비자가 **껍데기를 건너뛰고 `FilterPanel` 을 직접** 쓰고 있었다 —
+   그러면 이 껍데기가 쥔 두 줄(i18n 제목·`align="inline"`)이 소비자 쪽에 복사된다(말귀 2026-09-29). */
 /**
  * 단어를 어떤 조건으로 좁힐지 고르는 FilterPanel 셸(shell) — 등급/품사/어종/음절 수/선택 섹션 자체는
  * 호출부가 구성해 넘긴다. WordSearchPage의 [단어 검색 설정] 패널과 WordTrainingFilterPanels의
  * [단어 선정] 패널이 원 출처(섹션 구성은 다르지만 같은 셸을 공용).
  * @public
  */
-export default function WordSearchFilterPanel({ title, sections, selected, onSelect, className }) {
+export default function WordSearchFilterPanel({ title, sections, selected, onSelect, collapsible, defaultCollapsed, collapsed, onCollapsedChange, headerSummary, headerAction, className, }) {
     const { t } = useTranslation();
-    return (_jsx(FilterPanel, { className: className, title: title ?? t('wordSearch.filterTitle', '단어 검색 설정'), sections: sections, selected: selected, onSelect: onSelect, align: "inline" }));
+    return (_jsx(FilterPanel, { className: className, title: title ?? t('wordSearch.filterTitle', '단어 검색 설정'), sections: sections, selected: selected, onSelect: onSelect, collapsible: collapsible, defaultCollapsed: defaultCollapsed, collapsed: collapsed, onCollapsedChange: onCollapsedChange, headerSummary: headerSummary, headerAction: headerAction, align: "inline" }));
 }

package/dist/packages/core/src/components/Word/WordSearchResultBlock.css

@@ -20,7 +20,46 @@
     border: 1px solid var(--color-darkWhite);
     background: var(--color-white);
     border-radius: var(--radius-m);
-    padding: var(--spacing-content);
+    /* 옆에 서는 `FilterPanel` 과 같은 여백(사용자 지시 2026-09-29) */
+    padding: var(--spacing-l);
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacing-m);
+}
+
+/* 상자 안 머리 — `FilterPanel` 의 머리와 같은 결(제목 h4 · 부제 body-3 회색).
+   설명은 한 줄을 통째로 쓴다(제목 옆에 두면 조작부를 다음 줄로 밀어낸다). */
+.word-search-result-block__head {
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: var(--spacing-xs);
+}
+.word-search-result-block__head-main {
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-xs);
+    min-width: 0;
+}
+.word-search-result-block__head-icon {
+    flex-shrink: 0;
+    color: var(--color-gray);
+}
+.word-search-result-block__title {
+    text-align: left;
+    min-width: 0;
+}
+.word-search-result-block__head-actions {
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-xs);
+    margin-left: auto;
+}
+.word-search-result-block__head-disc {
+    flex: 0 0 100%;
+    min-width: 0;
+    color: var(--color-gray);
+    margin: 0;
 }
 
 /* 박스↔액션 간격은 '내용이 있는' 액션(더보기/선택초기화/인쇄)이 뒤에 올 때만 준다.

package/dist/packages/core/src/components/Word/WordSearchResultBlock.js

@@ -7,6 +7,7 @@ import { useTranslation } from 'react-i18next';
 import './WordSearchResultBlock.css';
 import Button from '../Button';
 import Section from '../Section';
+import Icon from '../Icon';
 import Dropdown from '../Dropdown';
 import Pagination from '../Pagination';
 import WordImageTooltip from '../Tooltip/WordImageTooltip';
@@ -158,7 +159,16 @@ export default function WordSearchResultBlock({ titleIcon, resultCount, resultUn
     const discNode = disc ?? (notice
         ? _jsxs(_Fragment, { children: [_jsx("span", { className: "word-search-result-block__notice", children: notice }), discLabel ? _jsx("span", { className: "word-search-result-block__disc", children: discLabel }) : null] })
         : discLabel);
-    return (_jsxs(Section, { type: sectionType, icon: titleIcon, title: titleLabel, action: toolbar, disc: discNode, className: cx('word-search-result-block', className), children: [_jsxs("div", { className: "word-search-result-block__inner", children: [(groups ? groups.length === 0 : items.length === 0) && (_jsxs("div", { className: "word-search-result-block__empty-wrap", children: [_jsx("p", { className: "word-search-result-block__empty body-3", children: t('wordSearch.emptyResult', '검색 결과가 없습니다.') }), emptyHint && _jsx("p", { className: "word-search-result-block__empty-hint body-3", children: emptyHint })] })), groups ? ((pagedGroups ?? []).map((group) => (_jsx("div", { className: "word-search-result-block__group", children: _jsx("div", { className: "word-search-result-block__items", children: group.items.map((item) => {
+    return (
+    /* 제목·부제·조작부가 **상자 안** 에 선다(사용자 지시 2026-09-29) — 전에는 `Section` 의 머리가
+       상자 밖에 서서 제목이 테두리 위에 뜨고 좌우 여백도 옆의 `FilterPanel` 과 달라 보였다.
+       이제 여백(--spacing-l)·부제(body-3 회색)를 그 판과 맞춘다.
+
+       **제목만 한 급 위(h3)다**(말귀 요청 ㉘, 2026-09-29). 0.206.0 에서는 곁의 `FilterPanel`
+       과 아주 같은 h4 로 맞췄는데, 그러니 결과 덩이의 머리가 그 위 판 제목들(`검색 옵션` ·
+       `단어 검색 설정`)과 같은 급이 되어 **무엇이 무엇의 머리인지 안 보였다.** 거르개 판은
+       결과를 고르는 도구고 이 덩이는 그 결과라, 나란한 것이 아니라 아래 딸린 것이다. */
+    _jsxs(Section, { type: sectionType, className: cx('word-search-result-block', className), children: [_jsxs("div", { className: "word-search-result-block__inner", children: [(titleLabel || toolbar || discNode) && (_jsxs("div", { className: "word-search-result-block__head", children: [_jsxs("div", { className: "word-search-result-block__head-main", children: [titleIcon && _jsx(Icon, { icon: titleIcon, className: "word-search-result-block__head-icon" }), titleLabel && _jsx("span", { className: "word-search-result-block__title h3", children: titleLabel })] }), toolbar && _jsx("div", { className: "word-search-result-block__head-actions", children: toolbar }), discNode && _jsx("div", { className: "word-search-result-block__head-disc body-3", children: discNode })] })), (groups ? groups.length === 0 : items.length === 0) && (_jsxs("div", { className: "word-search-result-block__empty-wrap", children: [_jsx("p", { className: "word-search-result-block__empty body-3", children: t('wordSearch.emptyResult', '검색 결과가 없습니다.') }), emptyHint && _jsx("p", { className: "word-search-result-block__empty-hint body-3", children: emptyHint })] })), groups ? ((pagedGroups ?? []).map((group) => (_jsx("div", { className: "word-search-result-block__group", children: _jsx("div", { className: "word-search-result-block__items", children: group.items.map((item) => {
                                 const isSelected = selected.includes(item.id);
                                 return (_jsx("div", { onMouseEnter: e => {
                                         openHover(e.currentTarget);

package/dist/packages/core/src/components/Word/WordTableBlock.d.ts

@@ -1,4 +1,4 @@
 import './WordTableBlock.css';
 import type { WordTableBlockProps } from './wordTableBlockTypes';
 export type { WordEntry, WordTableBlockProps } from './wordTableBlockTypes';
-export default function WordTableBlock({ title, titleIcon, disc, items, onSaveComplete, onLoad, onRemoveItem, onReset, resetLabel, saveButtonLabel, secondarySaveButtonLabel, onReorder, showCellCount, onAddItem, className, renderSavePopup, renderWordSearch, hideControls, saveOnly, tableName, nameValue, onNameChange, descriptionValue, onDescriptionChange, namePlaceholder, descriptionPlaceholder, existingNames, editingName, onCancel, initialItemsPerPage, renderCellAction, actionsLeftExtra }: WordTableBlockProps): import("react").JSX.Element;
+export default function WordTableBlock({ title, titleIcon, disc, filterTitle, filterCollapsible, filterDefaultCollapsed, filterHeaderSummary, items, onSaveComplete, onLoad, onRemoveItem, onReset, resetLabel, saveButtonLabel, secondarySaveButtonLabel, onReorder, showCellCount, onAddItem, className, renderSavePopup, renderWordSearch, hideControls, saveOnly, tableName, nameValue, onNameChange, descriptionValue, onDescriptionChange, namePlaceholder, descriptionPlaceholder, existingNames, editingName, onCancel, initialItemsPerPage, renderCellAction, actionsLeftExtra }: WordTableBlockProps): import("react").JSX.Element;

package/dist/packages/core/src/components/Word/WordTableBlock.js

@@ -45,7 +45,7 @@ function 겹치지않는id(list) {
         return id === it.id ? it : { ...it, id };
     });
 }
-export default function WordTableBlock({ title, titleIcon, disc, items, onSaveComplete, onLoad, onRemoveItem, onReset, resetLabel, saveButtonLabel, secondarySaveButtonLabel, onReorder, showCellCount, onAddItem, className, renderSavePopup, renderWordSearch, hideControls, saveOnly, tableName, nameValue, onNameChange, descriptionValue, onDescriptionChange, namePlaceholder, descriptionPlaceholder, existingNames, editingName, onCancel, initialItemsPerPage, renderCellAction, actionsLeftExtra }) {
+export default function WordTableBlock({ title, titleIcon, disc, filterTitle, filterCollapsible, filterDefaultCollapsed, filterHeaderSummary, items, onSaveComplete, onLoad, onRemoveItem, onReset, resetLabel, saveButtonLabel, secondarySaveButtonLabel, onReorder, showCellCount, onAddItem, className, renderSavePopup, renderWordSearch, hideControls, saveOnly, tableName, nameValue, onNameChange, descriptionValue, onDescriptionChange, namePlaceholder, descriptionPlaceholder, existingNames, editingName, onCancel, initialItemsPerPage, renderCellAction, actionsLeftExtra }) {
     const { t } = useTranslation();
     const resolvedResetLabel = resetLabel ?? t('wordPrint.clearAllSelection', '모두 선택 해제');
     const isEditable = items === undefined;
@@ -318,7 +318,7 @@ export default function WordTableBlock({ title, titleIcon, disc, items, onSaveCo
                             setActiveCell(null);
                         },
                         onClose: handleCloseWordSearch,
-                    }), !hideControls && (_jsx(TableFilterPanel, { hasImage: hasImage, hasColloquial: hasColloquial, contentTypes: contentTypes, orientation: orientation, showOutline: showOutline, cutLine: cutLine, showDivLine: showDivLine, setters: { setContentTypes, setOrientation, setShowOutline, setCutLine, setShowDivLine }, showCutLine: (pagesEnabled ? itemsPerPage : count) > 1, showDivLine2: hasPairs, middleSections: middleSections, extraSelected: middleSelected, onExtraSelect: handleMiddleSelect })), isPaginated && pages ? (_jsx("div", { className: "word-table-block__pages", children: pages.map((page, i) => (_jsx(WordTable, { orientation: orientation, contentTypes: contentTypes, cutLine: cutLine, showOutline: showOutline, showDivLine: showDivLine, count: itemsPerPage, items: page, onRemoveItem: onRemoveItem, 
+                    }), !hideControls && (_jsx(TableFilterPanel, { title: filterTitle, collapsible: filterCollapsible, defaultCollapsed: filterDefaultCollapsed, headerSummary: filterHeaderSummary, hasImage: hasImage, hasColloquial: hasColloquial, contentTypes: contentTypes, orientation: orientation, showOutline: showOutline, cutLine: cutLine, showDivLine: showDivLine, setters: { setContentTypes, setOrientation, setShowOutline, setCutLine, setShowDivLine }, showCutLine: (pagesEnabled ? itemsPerPage : count) > 1, showDivLine2: hasPairs, middleSections: middleSections, extraSelected: middleSelected, onExtraSelect: handleMiddleSelect })), isPaginated && pages ? (_jsx("div", { className: "word-table-block__pages", children: pages.map((page, i) => (_jsx(WordTable, { orientation: orientation, contentTypes: contentTypes, cutLine: cutLine, showOutline: showOutline, showDivLine: showDivLine, count: itemsPerPage, items: page, onRemoveItem: onRemoveItem, 
                             /* 쪽이 나뉘면 끌어 옮기기가 통째로 꺼졌다(말귀 단어 찾기: 9개부터). 쪽 안의 자리를 전체 자리로 옮겨 넘긴다 —
                                쪽을 넘는 이동은 하지 않는다. */
                             onReorder: onReorder && ((from, to) => onReorder(from + i * itemsPerPage, to + i * itemsPerPage)), 

package/dist/packages/core/src/components/Word/wordTableBlockTypes.d.ts

@@ -18,6 +18,18 @@ export interface WordEntry {
 export interface WordTableBlockProps {
     title?: ReactNode;
     titleIcon?: string;
+    /** 안쪽 **표 설정 판의 제목** — 안 주면 코어 기본값(`wordTable.filterTitle`, '표 설정').
+     *
+     *  화면마다 달라야 한다(단어표는 '단어표 설정', 대립쌍표는 그 화면 말) — 그래서 코어 기본값을 바꾸는 것으로는 안 되고,
+     *  앱 사전으로 코어 열쇠를 덮는 것은 말귀의 `guards/i18nOwnership` 이 막는다(옳은 규칙이다).
+     *  **부르는 쪽이 제 열쇠로 지어 넘긴다**(말귀 2026-09-29). */
+    filterTitle?: ReactNode;
+    /** 안쪽 표 설정 판을 접을 수 있게 한다 — 머리 줄 전체가 손잡이다. */
+    filterCollapsible?: boolean;
+    /** 그 판을 처음에 접힌 채로 연다(`filterCollapsible` 과 함께). */
+    filterDefaultCollapsed?: boolean;
+    /** 그 판이 접혀도 머리 오른쪽에 남는 자리 — 요약. */
+    filterHeaderSummary?: ReactNode;
     disc?: ReactNode;
     /** 현재 표의 저장된 이름(불러온 표 등). 있으면 인쇄/PDF 저장 시 파일명으로 사용, 없으면 "오늘 날짜 + 단어표/대립쌍표" */
     tableName?: string;

package/dist/packages/core/src/utils/filterPanelSummary.d.ts

@@ -0,0 +1,14 @@
+import type { FilterPanelSection } from '../types/filterPanel';
+/**
+ * **접힌 거르개 판이 제 속을 한 줄로 말하는 글월**을 절과 고른 값에서 짓는다
+ * (`등급 전체 · 음절 수 2음절 · 품사 전체`).
+ *
+ * 왜 코어가 짓나: 이름표도 값도 코어 것이라 **부르는 쪽이 옮겨 적으면 두 벌이 된다.**
+ * 말귀가 등급·음절 수 이름표를 두 화면에 다르게 적어 한 번 어긋났고(말귀 요청 ㉗,
+ * 2026-09-29), 표 설정 판은 아예 값이 `WordTableBlock` 안에 있어 부르는 쪽이 글월을
+ * 지을 길조차 없었다. 그래서 **기본값은 코어가 짓고, 덮고 싶을 때만 `headerSummary`** 다.
+ *
+ * 안 담는 절: `note`(고르는 절이 아니다) · `input`(빈 칸을 '전체'라 말하면 거짓이다) ·
+ * 고른 것이 없는데 '전체' 보기도 없는 절(말할 것이 없다).
+ */
+export declare function buildFilterSummary(sections: readonly FilterPanelSection[], selected: Record<string, string | string[]> | undefined, 전체말: string): string;

package/dist/packages/core/src/utils/filterPanelSummary.js

@@ -0,0 +1,57 @@
+import { FILTER_ALL_VALUE } from '../types/filterPanel';
+/**
+ * **접힌 거르개 판이 제 속을 한 줄로 말하는 글월**을 절과 고른 값에서 짓는다
+ * (`등급 전체 · 음절 수 2음절 · 품사 전체`).
+ *
+ * 왜 코어가 짓나: 이름표도 값도 코어 것이라 **부르는 쪽이 옮겨 적으면 두 벌이 된다.**
+ * 말귀가 등급·음절 수 이름표를 두 화면에 다르게 적어 한 번 어긋났고(말귀 요청 ㉗,
+ * 2026-09-29), 표 설정 판은 아예 값이 `WordTableBlock` 안에 있어 부르는 쪽이 글월을
+ * 지을 길조차 없었다. 그래서 **기본값은 코어가 짓고, 덮고 싶을 때만 `headerSummary`** 다.
+ *
+ * 안 담는 절: `note`(고르는 절이 아니다) · `input`(빈 칸을 '전체'라 말하면 거짓이다) ·
+ * 고른 것이 없는데 '전체' 보기도 없는 절(말할 것이 없다).
+ */
+export function buildFilterSummary(sections, selected, 전체말) {
+    const 조각들 = [];
+    for (const section of sections ?? []) {
+        if (section.type === 'note' || section.type === 'input')
+            continue;
+        const 이름 = section.displayLabel ?? section.label;
+        const 값 = 값말(section, selected?.[section.label], 전체말);
+        if (값 === null)
+            continue;
+        조각들.push(`${이름} ${값}`);
+    }
+    return 조각들.join(' · ');
+}
+/** 한 절이 무엇으로 정해져 있는지 — 말할 것이 없으면 `null` */
+function 값말(section, sel, 전체말) {
+    const 고른것 = Array.isArray(sel) ? sel : sel === undefined ? [] : [sel];
+    /* '전체' 는 두 꼴로 온다 — 아무것도 안 고른 것과 '전체' 보기를 고른 것. 같은 말로 읽는다. */
+    const 실제 = 고른것.filter(v => v !== FILTER_ALL_VALUE);
+    if (실제.length === 0) {
+        return section.allOption ? (section.allLabel ?? 전체말) : null;
+    }
+    return 실제.map(v => 보기말(section, v)).join(', ');
+}
+/** 고른 값 하나를 사람이 읽는 말로 — 보기 목록에 없으면 값 그대로 */
+function 보기말(section, value) {
+    const 보기들 = [
+        ...(section.items ?? []),
+        ...(section.groups ?? []).flat(),
+    ];
+    for (const item of 보기들) {
+        if (item == null)
+            continue;
+        if (typeof item === 'string') {
+            if (item === value)
+                return item;
+            continue;
+        }
+        if (item.value !== value)
+            continue;
+        /* 단추에 쓰는 차례 그대로 — `labels` 는 여러 줄로 쪼갠 것이라 한 줄로 이어 붙인다 */
+        return item.displayLabel ?? item.labels?.join(' ') ?? item.value;
+    }
+    return value;
+}

package/dist/packages/core/src/version.d.ts

@@ -46,4 +46,4 @@
  *
  * 값은 손으로 적고 `test/coreVersion.test.ts` 가 package.json 과 어긋나면 운다.
  */
-export declare const CORE_VERSION = "0.205.0";
+export declare const CORE_VERSION = "0.207.0";

package/dist/packages/core/src/version.js

@@ -46,4 +46,4 @@
  *
  * 값은 손으로 적고 `test/coreVersion.test.ts` 가 package.json 과 어긋나면 운다.
  */
-export const CORE_VERSION = '0.205.0';
+export const CORE_VERSION = '0.207.0';