@ihabdevteam/core 0.181.0 → 0.183.0

package/dist/ihabdevteam-core.d.ts

@@ -1600,7 +1600,7 @@ export declare function copyText(text: string): Promise<boolean>;
  *
  * 값은 손으로 적고 `test/coreVersion.test.ts` 가 package.json 과 어긋나면 운다.
  */
-export declare const CORE_VERSION = "0.181.0";
+export declare const CORE_VERSION = "0.183.0";
 
 /** @public */
 declare const coreDefault: Record<string, unknown>;
@@ -2145,29 +2145,30 @@ export declare function EffectPartyPopperHost({ trigger, active }: {
 /** @public 아무것도 안 고른 상태 — 시험이 기준값으로 쓴다. */
 export declare const EMPTY_COMPOSITION: WordComposition;
 
-export declare function EmptyState({ icon, emoji, title, message, hint, action, compact, className }: EmptyStateProps): JSX.Element;
+export declare function EmptyState({ icon, title, message, action, className }: EmptyStateProps): JSX.Element;
 
 /** @public */
 export declare interface EmptyStateProps {
+    /** 위에 서는 아이콘 — **lucide 이름만** 받는다(`Icon` 과 같은 규약).
+     *  그림문자(emoji)를 받던 `emoji` prop 은 0.182.0 에서 걷었다: 같은 자리에 두 갈래가 있으면
+     *  제품마다 다른 것이 서고, 그림문자는 기기·글꼴마다 다르게 그려지며 색·크기를 토큰으로 못 맞춘다
+     *  (사용자 지시 2026-09-21 "아이콘은 항상 루시드 아이콘만"). */
     icon?: string;
-    emoji?: string;
     title?: string;
     message?: string;
-    /** 메시지 아래 보조 안내(선택). message와 별도 문단으로 렌더 — 문자열 접합 오용 방지. */
-    hint?: string;
     /**
      * 메시지 아래 단추(다시 시도 등). `onClick` 이 **약속(Promise)을 돌려주면 끝날 때까지(성공·실패 모두) 단추를 막는다** —
      * 두 번 눌러 요청이 두 번 나가지 않게.
      */
+    /** 메시지 아래 단추 — **크기는 늘 40 이다.**
+     *  0.181.0 에서 잠깐 `size`(40·48·56)를 받았는데, 빈 화면마다 단추 크기가 달라지면 같은 제품 안에서
+     *  "이 단추가 더 중요한가" 로 읽힌다. 빈 화면의 단추는 하나뿐이라 크기로 위계를 줄 것이 없다
+     *  (사용자 지시 2026-09-21). */
     action?: {
         label: string;
         icon?: string;
         onClick: () => void | Promise<unknown>;
-        /** 단추 크기 — 기본 40. 빈 화면이 한 쪽을 통째로 차지하면 48·56 이 어울린다(말귀 고객관리 2026-09-21). */
-        size?: 40 | 48 | 56;
     };
-    /** 표 안의 빈 행처럼 좁은 자리에 넣을 때 위아래 여백을 줄인다. */
-    compact?: boolean;
     className?: string;
 }
 
@@ -2185,7 +2186,9 @@ export declare function ErrorState({ message, hint, icon, onRetry, retryLabel, c
 export declare interface ErrorStateProps {
     /** 에러 메시지(미지정 시 공용 기본 문구). */
     message?: string;
-    /** 보조 안내(선택). */
+    /** 보조 안내(선택) — "잠시 뒤 다시 시도해 보세요" 처럼 **다음에 할 일**을 적는다.
+     *  `EmptyState` 의 같은 줄은 0.182.0 에서 걷었지만(빈 화면은 글자 줄이 적어야 한다),
+     *  실패 화면은 까닭과 다음 걸음이 갈리므로 여기서는 지킨다. */
     hint?: string;
     icon?: string;
     /**
@@ -4564,6 +4567,20 @@ export declare interface PopupProps {
     /** 복잡한 커스텀 footer가 필요할 때 사용. buttons가 없을 때만 렌더됩니다.
      * buttons와 달리 기본 폭/정렬 제약(.popup-footer--buttons)이 적용되지 않아 자유 배치 가능. */
     footer?: ReactNode | ((opts: PopupOptions) => ReactNode);
+    /** 머리 **오른쪽에 서는 보기 고르개** — 창 하나가 갈래 둘(고객정보 · 훈련기록)을 담을 때 쓴다.
+     *  닫기(X)와 `headerActions` **앞**, 제목 오른쪽에 선다. `SegmentedControl size={40}` 그대로이고,
+     *  창이 좁으면 제목 아래로 줄을 바꾼다(제목을 밀어내지 않는다).
+     *  이름이 없으면 낭독기가 '선택 탭' 으로 읽으니 `ariaLabel` 을 준다. */
+    headerSegment?: {
+        value: string;
+        onChange: (key: string) => void;
+        options: {
+            key: string;
+            label: string;
+            disabled?: boolean;
+        }[];
+        ariaLabel?: string;
+    };
     /** 커스텀 footer 래퍼에 추가할 클래스 (정렬·간격 override용) */
     footerClassName?: string;
     /** 바닥 줄의 가로 배치 — `'center'`(기본) · `'fill'` · `'between'`.
@@ -5858,8 +5875,12 @@ export declare interface SegmentedControlProps {
      */
     onChange?: (v: string) => void;
     className?: string;
-    /** 버튼 높이 — Button 과 같은 숫자 size (24 / 32 / 40 / 48). **겉높이가 곧 size 다**(0.159.0 부터 판 여백 없음) —
-     *  옆에 `Button size={32}` 를 세우면 셈 없이 나란히 선다. */
+    /** 버튼 높이 — Button 과 같은 숫자 size (24 / 32 / 40 / 48). **기본 40.** **겉높이가 곧 size 다**(0.159.0 부터 판 여백 없음) —
+     *  옆에 `Button size={32}` 를 세우면 셈 없이 나란히 선다.
+     *
+     *  기본이 48 이던 것을 40 으로 내렸다(사용자 지시 2026-09-21). 코어가 제 안에서 세우는 고르개는 이미 **전부 40**
+     *  이었고(`Toolbar`·`FilterPanel`·`BarChart`·`PanelRow`…), 옆에 서는 `Dropdown`·`TextField` 도 40 이다 —
+     *  기본값만 혼자 48 이라 안 주고 쓴 자리가 한 급 크게 섰다. */
     size?: 24 | 32 | 40 | 48;
     shape?: 'rounded' | 'pill';
     useBG?: boolean;

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

@@ -9,15 +9,17 @@
   border: 1px solid var(--color-whiteLine);
   border-radius: var(--radius-m);
 }
-.empty-state__emoji { font-size: 40px; line-height: 1; }
-.empty-state__icon { width: 40px; height: 40px; color: var(--color-lightGray); }
-.empty-state__title { color: var(--color-lightGray); margin: 0; }
+/* 빈 화면 아이콘 — 40 은 제목(h4) 옆에서 작았다(사용자 지시 2026-09-21) */
+.empty-state__icon { width: 56px; height: 56px; color: var(--color-lightGray); }
+/* 제목과 본문은 **같은 색** 이다(사용자 지시 2026-09-21) — 전에는 제목이 한 단계 옅어(lightGray)
+   제목이 본문보다 뒤로 물러나 보였다. 위계는 글자 등급(h4 · body-3)이 준다.
+   같은 색으로 모을 때 gray 를 고른 것은 lightGray 가 흰 지면에서 AA(4.5:1)에 못 미치기 때문이다. */
+.empty-state__title { color: var(--color-gray); margin: 0; }
 .empty-state__message { color: var(--color-gray); margin: 0; }
-.empty-state__hint { color: var(--color-lightGray); margin: 0; }
+/* 제목과 본문은 **한 덩어리로 읽힌다** — 그 사이만 좁힌다(사용자 지시 2026-09-21).
+   통의 gap(10px)은 아이콘·단추 사이에 그대로 남는다. */
+.empty-state__title + .empty-state__message { margin-top: -6px; }
 .empty-state__action { margin-top: var(--spacing-xs); min-width: 120px; }
 
-/* 표의 빈 행처럼 좁은 자리 — 페이지 여백 대신 컨텐츠 여백을 쓴다 */
-.empty-state--compact {
-  padding: var(--spacing-page) var(--spacing-m);
-  padding-block: 56px;
-}
+/* `compact` 는 0.183.0 에서 걷었다 — 표·패널의 빈 자리는 **줄(row)로** 나타내기로 했다(사용자 지시 2026-09-21).
+   좁은 자리용 변종을 두면 같은 빈 상태가 두 꼴로 살고, 그 둘이 따로 늙는다. */

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

@@ -1,25 +1,26 @@
 import './EmptyState.css';
 /** @public */
 export interface EmptyStateProps {
+    /** 위에 서는 아이콘 — **lucide 이름만** 받는다(`Icon` 과 같은 규약).
+     *  그림문자(emoji)를 받던 `emoji` prop 은 0.182.0 에서 걷었다: 같은 자리에 두 갈래가 있으면
+     *  제품마다 다른 것이 서고, 그림문자는 기기·글꼴마다 다르게 그려지며 색·크기를 토큰으로 못 맞춘다
+     *  (사용자 지시 2026-09-21 "아이콘은 항상 루시드 아이콘만"). */
     icon?: string;
-    emoji?: string;
     title?: string;
     message?: string;
-    /** 메시지 아래 보조 안내(선택). message와 별도 문단으로 렌더 — 문자열 접합 오용 방지. */
-    hint?: string;
     /**
      * 메시지 아래 단추(다시 시도 등). `onClick` 이 **약속(Promise)을 돌려주면 끝날 때까지(성공·실패 모두) 단추를 막는다** —
      * 두 번 눌러 요청이 두 번 나가지 않게.
      */
+    /** 메시지 아래 단추 — **크기는 늘 40 이다.**
+     *  0.181.0 에서 잠깐 `size`(40·48·56)를 받았는데, 빈 화면마다 단추 크기가 달라지면 같은 제품 안에서
+     *  "이 단추가 더 중요한가" 로 읽힌다. 빈 화면의 단추는 하나뿐이라 크기로 위계를 줄 것이 없다
+     *  (사용자 지시 2026-09-21). */
     action?: {
         label: string;
         icon?: string;
         onClick: () => void | Promise<unknown>;
-        /** 단추 크기 — 기본 40. 빈 화면이 한 쪽을 통째로 차지하면 48·56 이 어울린다(말귀 고객관리 2026-09-21). */
-        size?: 40 | 48 | 56;
     };
-    /** 표 안의 빈 행처럼 좁은 자리에 넣을 때 위아래 여백을 줄인다. */
-    compact?: boolean;
     className?: string;
 }
-export default function EmptyState({ icon, emoji, title, message, hint, action, compact, className }: EmptyStateProps): import("react").JSX.Element;
+export default function EmptyState({ icon, title, message, action, className }: EmptyStateProps): import("react").JSX.Element;

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

@@ -4,12 +4,11 @@ import { cx } from '../utils/cx';
 import './EmptyState.css';
 import Icon from './Icon';
 import { usePendingPress } from '../hooks/usePendingPress';
-export default function EmptyState({ icon, emoji, title, message, hint, action, compact, className }) {
+export default function EmptyState({ icon, title, message, action, className }) {
     const { pending, press } = usePendingPress(action?.onClick);
-    return (_jsxs("div", { className: cx('empty-state', compact && 'empty-state--compact', className), children: [emoji && _jsx("span", { className: "empty-state__emoji", children: emoji }), icon && _jsx(Icon, { icon: icon, className: "empty-state__icon" }), title && _jsx("p", { className: "empty-state__title body-2", children: title }), message && _jsx("p", { className: "empty-state__message body-3", children: message }), hint && _jsx("p", { className: "empty-state__hint caption-1", children: hint }), action && (
+    return (_jsxs("div", { className: cx('empty-state', className), children: [icon && _jsx(Icon, { icon: icon, className: "empty-state__icon" }), title && _jsx("p", { className: "empty-state__title h4", children: title }), message && _jsx("p", { className: "empty-state__message body-3", children: message }), action && (
             // type="button" — 없으면 폼 안에서 누르는 순간 폼이 제출된다
             _jsxs("button", { type: "button", 
-                /* 코어 `Button` 을 안 쓰고 클래스를 적는 것은 `aria-busy` 때문이다 — 약속이 끝날 때까지 알린다.
-                   크기만 `action.size` 로 받는다(그 값이 `button{n}`·`button{n}--bar` 두 이름을 함께 정한다). */
-                className: cx('empty-state__action button', `button${action.size ?? 40}`, `button${action.size ?? 40}--bar`, 'button--variant-main button--align-center button--shape-rounded'), onClick: press, disabled: pending, "aria-busy": pending || undefined, children: [action.icon && _jsx(Icon, { icon: action.icon, className: "button__icon" }), _jsx("span", { className: "button__label button-1", children: action.label })] }))] }));
+                /* 코어 `Button` 을 안 쓰고 클래스를 적는 것은 `aria-busy` 때문이다 — 약속이 끝날 때까지 알린다. */
+                className: "empty-state__action button button40 button40--bar button--variant-main button--align-center button--shape-rounded", onClick: press, disabled: pending, "aria-busy": pending || undefined, children: [action.icon && _jsx(Icon, { icon: action.icon, className: "button__icon" }), _jsx("span", { className: "button__label button-1", children: action.label })] }))] }));
 }

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

@@ -1,2 +1,5 @@
 /* ErrorState — EmptyState 레이아웃(empty-state) 재사용, 에러 톤만 오버라이드 */
 .error-state__icon { color: var(--color-error); }
+/* 보조 안내 — EmptyState 가 제 hint 줄을 걷으면서(0.182.0) 이 꼴을 여기로 옮겼다.
+   그때까지는 `.empty-state__hint` 를 함께 쓰고 있었다. */
+.error-state__hint { color: var(--color-lightGray); margin: 0; }

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

@@ -6,7 +6,9 @@ import './ErrorState.css';
 export interface ErrorStateProps {
     /** 에러 메시지(미지정 시 공용 기본 문구). */
     message?: string;
-    /** 보조 안내(선택). */
+    /** 보조 안내(선택) — "잠시 뒤 다시 시도해 보세요" 처럼 **다음에 할 일**을 적는다.
+     *  `EmptyState` 의 같은 줄은 0.182.0 에서 걷었지만(빈 화면은 글자 줄이 적어야 한다),
+     *  실패 화면은 까닭과 다음 걸음이 갈리므로 여기서는 지킨다. */
     hint?: string;
     icon?: string;
     /**

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

@@ -9,7 +9,7 @@ import { usePendingPress } from '../hooks/usePendingPress';
 export default function ErrorState({ message, hint, icon = 'triangle-alert', onRetry, retryLabel, className }) {
     const { t } = useTranslation();
     const { pending, press } = usePendingPress(onRetry);
-    return (_jsxs("div", { className: cx('empty-state', 'error-state', className), role: "alert", children: [_jsx(Icon, { icon: icon, className: "empty-state__icon error-state__icon" }), _jsx("p", { className: "empty-state__message body-3", children: message ?? t('common.errorState.message', { defaultValue: '불러오지 못했습니다.' }) }), hint && _jsx("p", { className: "empty-state__hint caption-1", children: hint }), onRetry && (_jsxs("button", { 
+    return (_jsxs("div", { className: cx('empty-state', 'error-state', className), role: "alert", children: [_jsx(Icon, { icon: icon, className: "empty-state__icon error-state__icon" }), _jsx("p", { className: "empty-state__message body-3", children: message ?? t('common.errorState.message', { defaultValue: '불러오지 못했습니다.' }) }), hint && _jsx("p", { className: "error-state__hint caption-1", children: hint }), onRetry && (_jsxs("button", { 
                 // type="button" — 없으면 폼 안에서 다시 시도를 누르는 순간 폼이 제출된다
                 type: "button", className: "empty-state__action button button40 button40--bar button--variant-main button--align-center button--shape-rounded", onClick: press, disabled: pending, "aria-busy": pending || undefined, children: [_jsx(Icon, { icon: "rotate-cw", className: "button__icon" }), _jsx("span", { className: "button__label button-1", children: retryLabel ?? t('common.errorState.retry', { defaultValue: '다시 시도' }) })] }))] }));
 }

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

@@ -70,6 +70,9 @@
 .popup-header-main .popup-title--left { flex: none; }
 .popup-header .popup-title--left { margin: 0; }
 .popup-subtitle { text-align: left; color: var(--color-gray); margin: 0; }
+/* 머리 오른쪽 고르개(headerSegment) — 닫기·headerActions 앞. 좁으면 제목 아래로 줄을 바꾸고
+   제목을 밀어내지 않는다(제목 칸이 flex:1 로 먼저 줄어든다). */
+.popup-header-segment { flex-shrink: 0; }
 .popup-header-actions { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
 .popup-content {
   padding: 20px 20px 0;

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

@@ -36,6 +36,20 @@ export interface PopupProps {
     /** 복잡한 커스텀 footer가 필요할 때 사용. buttons가 없을 때만 렌더됩니다.
      * buttons와 달리 기본 폭/정렬 제약(.popup-footer--buttons)이 적용되지 않아 자유 배치 가능. */
     footer?: ReactNode | ((opts: PopupOptions) => ReactNode);
+    /** 머리 **오른쪽에 서는 보기 고르개** — 창 하나가 갈래 둘(고객정보 · 훈련기록)을 담을 때 쓴다.
+     *  닫기(X)와 `headerActions` **앞**, 제목 오른쪽에 선다. `SegmentedControl size={40}` 그대로이고,
+     *  창이 좁으면 제목 아래로 줄을 바꾼다(제목을 밀어내지 않는다).
+     *  이름이 없으면 낭독기가 '선택 탭' 으로 읽으니 `ariaLabel` 을 준다. */
+    headerSegment?: {
+        value: string;
+        onChange: (key: string) => void;
+        options: {
+            key: string;
+            label: string;
+            disabled?: boolean;
+        }[];
+        ariaLabel?: string;
+    };
     /** 커스텀 footer 래퍼에 추가할 클래스 (정렬·간격 override용) */
     footerClassName?: string;
     /** 바닥 줄의 가로 배치 — `'center'`(기본) · `'fill'` · `'between'`.

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

@@ -4,6 +4,7 @@ import { useCallback, useState, useEffect, useRef, useId } from "react";
 import { createPortal } from "react-dom";
 import { useTranslation } from "react-i18next";
 import Button from "../Button";
+import SegmentedControl from "../SegmentedControl";
 import { pushEsc } from "../../hooks/escStack";
 import { lockBodyScroll } from "../../hooks/bodyScrollLock";
 import "./Popup.css";
@@ -15,7 +16,7 @@ const ANIM_MS = 260;
 /** @public */
 export default function Popup(props) {
     const { t } = useTranslation();
-    const { title, subtitle, headerActions, children, buttons, footer, footerClassName = "", footerLayout = 'center', onClose, closeDisabled = false, beforeClose, closeOnBackdrop = true, className = "", ariaLabel, useTitle = true, inline = false, size, layer = 'modal', height, fillBody = false, resetScrollKey } = props || {};
+    const { title, subtitle, headerActions, headerSegment, children, buttons, footer, footerClassName = "", footerLayout = 'center', onClose, closeDisabled = false, beforeClose, closeOnBackdrop = true, className = "", ariaLabel, useTitle = true, inline = false, size, layer = 'modal', height, fillBody = false, resetScrollKey } = props || {};
     const [closing, setClosing] = useState(false);
     // 닫힘 애니메이션 중(260ms)엔 버튼이 시각적으로만 흐려질 뿐 클릭은 계속 가능해,
     // 그 사이 같은 버튼을 연타하면 cb(확인/완료 콜백)가 여러 번 예약되어 중복 실행된다.
@@ -211,7 +212,7 @@ export default function Popup(props) {
             e.preventDefault(); }, children: _jsxs("div", { ref: panelRef, className: `popup-panel${size ? ` popup-panel--${size}` : ''}${height != null ? ' popup-panel--has-height' : ''}${fillBody ? ' popup-panel--fill-body' : ''}`, 
             /* 높이는 **CSS 변수로** 넘긴다 — 인라인 height 로 박으면 앱의 미디어 규칙(좁은 화면만 다른 높이)이 못 이겼다.
                max-height(CSS)가 height 보다 이기므로 화면보다 크게 줘도 화면에 맞춰진다 */
-            style: height != null ? { '--popup-height': typeof height === 'number' ? `${height}px` : height } : undefined, tabIndex: -1, role: inline ? undefined : 'dialog', "aria-modal": inline ? undefined : true, "aria-labelledby": !inline && useTitle && title ? titleId : undefined, "aria-label": !inline && !(useTitle && title) ? (ariaLabel ?? (typeof title === 'string' ? title : undefined)) : undefined, children: [!useTitle && (headerActions || onClose) ? (_jsxs("div", { className: "popup-close-float", children: [headerActions, onClose && _jsx(Button, { htmlType: "button", size: 40, type: "dot", icon: "x", variant: "transparent-gray", useBorder: false, onClick: closeWithAnimation, disabled: closeDisabled, ariaLabel: t('common.close', '닫기') })] })) : (title || headerActions || onClose) ? (_jsxs("div", { className: `popup-header${subtitle ? ' popup-header--with-subtitle' : ''}`, children: [_jsxs("div", { className: "popup-header-main", children: [_jsx("span", { id: titleId, className: "popup-title popup-title--left h2", children: title }), subtitle && _jsx("span", { className: "popup-subtitle body-3", children: subtitle })] }), _jsxs("div", { className: "popup-header-actions", children: [headerActions, onClose && (_jsx(Button, { htmlType: "button", size: 40, type: "dot", icon: "x", variant: "transparent-gray", useBorder: false, onClick: closeWithAnimation, disabled: closeDisabled, ariaLabel: t('common.close', '닫기') }))] })] })) : null, _jsx("div", { className: "popup-content", ref: contentRef, tabIndex: contentScrollable ? 0 : undefined, children: _jsx("div", { className: "popup-content__inner", children: typeof children === 'function' ? children({ animateThen, closeWithAnimation }) : children }) }), buttons?.length ? (_jsx("div", { className: `popup-footer popup-footer--buttons${footerLayout !== 'center' ? ` popup-footer--${footerLayout}` : ''}`, children: buttons.map((btn, i) => (_jsx(Button, { htmlType: "button", size: 48, variant: btn.variant ?? 'default', label: btn.label, disabled: btn.disabled, onClick: () => btn.onClick?.({ animateThen, closeWithAnimation }) }, i))) })) : footer ? (_jsx("div", { className: `popup-footer${footerLayout !== 'center' ? ` popup-footer--${footerLayout}` : ''}${footerClassName ? ` ${footerClassName}` : ''}`, children: typeof footer === 'function' ? footer({ animateThen, closeWithAnimation }) : footer })) : null] }) }));
+            style: height != null ? { '--popup-height': typeof height === 'number' ? `${height}px` : height } : undefined, tabIndex: -1, role: inline ? undefined : 'dialog', "aria-modal": inline ? undefined : true, "aria-labelledby": !inline && useTitle && title ? titleId : undefined, "aria-label": !inline && !(useTitle && title) ? (ariaLabel ?? (typeof title === 'string' ? title : undefined)) : undefined, children: [!useTitle && (headerActions || onClose) ? (_jsxs("div", { className: "popup-close-float", children: [headerActions, onClose && _jsx(Button, { htmlType: "button", size: 40, type: "dot", icon: "x", variant: "transparent-gray", useBorder: false, onClick: closeWithAnimation, disabled: closeDisabled, ariaLabel: t('common.close', '닫기') })] })) : (title || headerActions || onClose) ? (_jsxs("div", { className: `popup-header${subtitle ? ' popup-header--with-subtitle' : ''}`, children: [_jsxs("div", { className: "popup-header-main", children: [_jsx("span", { id: titleId, className: "popup-title popup-title--left h2", children: title }), subtitle && _jsx("span", { className: "popup-subtitle body-3", children: subtitle })] }), headerSegment && (_jsx("div", { className: "popup-header-segment", children: _jsx(SegmentedControl, { size: 40, ariaLabel: headerSegment.ariaLabel, options: headerSegment.options.map(o => ({ key: o.key, label: o.label, disabled: o.disabled })), value: headerSegment.value, onChange: headerSegment.onChange }) })), _jsxs("div", { className: "popup-header-actions", children: [headerActions, onClose && (_jsx(Button, { htmlType: "button", size: 40, type: "dot", icon: "x", variant: "transparent-gray", useBorder: false, onClick: closeWithAnimation, disabled: closeDisabled, ariaLabel: t('common.close', '닫기') }))] })] })) : null, _jsx("div", { className: "popup-content", ref: contentRef, tabIndex: contentScrollable ? 0 : undefined, children: _jsx("div", { className: "popup-content__inner", children: typeof children === 'function' ? children({ animateThen, closeWithAnimation }) : children }) }), buttons?.length ? (_jsx("div", { className: `popup-footer popup-footer--buttons${footerLayout !== 'center' ? ` popup-footer--${footerLayout}` : ''}`, children: buttons.map((btn, i) => (_jsx(Button, { htmlType: "button", size: 48, variant: btn.variant ?? 'default', label: btn.label, disabled: btn.disabled, onClick: () => btn.onClick?.({ animateThen, closeWithAnimation }) }, i))) })) : footer ? (_jsx("div", { className: `popup-footer${footerLayout !== 'center' ? ` popup-footer--${footerLayout}` : ''}${footerClassName ? ` ${footerClassName}` : ''}`, children: typeof footer === 'function' ? footer({ animateThen, closeWithAnimation }) : footer })) : null] }) }));
     if (inline || typeof document === 'undefined')
         return el;
     return createPortal(el, document.body);

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

@@ -17,8 +17,12 @@ export interface SegmentedControlProps {
      */
     onChange?: (v: string) => void;
     className?: string;
-    /** 버튼 높이 — Button 과 같은 숫자 size (24 / 32 / 40 / 48). **겉높이가 곧 size 다**(0.159.0 부터 판 여백 없음) —
-     *  옆에 `Button size={32}` 를 세우면 셈 없이 나란히 선다. */
+    /** 버튼 높이 — Button 과 같은 숫자 size (24 / 32 / 40 / 48). **기본 40.** **겉높이가 곧 size 다**(0.159.0 부터 판 여백 없음) —
+     *  옆에 `Button size={32}` 를 세우면 셈 없이 나란히 선다.
+     *
+     *  기본이 48 이던 것을 40 으로 내렸다(사용자 지시 2026-09-21). 코어가 제 안에서 세우는 고르개는 이미 **전부 40**
+     *  이었고(`Toolbar`·`FilterPanel`·`BarChart`·`PanelRow`…), 옆에 서는 `Dropdown`·`TextField` 도 40 이다 —
+     *  기본값만 혼자 48 이라 안 주고 쓴 자리가 한 급 크게 섰다. */
     size?: 24 | 32 | 40 | 48;
     shape?: 'rounded' | 'pill';
     useBG?: boolean;

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

@@ -10,7 +10,7 @@ export default function SegmentedControl(props) {
     const { t } = useTranslation();
     const { options = [], 
     // 안 주면 **켜진** 첫 칸 — 꺼진 첫 칸이 골라져 있었다(Tabs 와 같게)
-    value = options.find((o) => !o.disabled)?.key ?? options[0]?.key, onChange = (_v) => { }, className = '', size = 48, shape = 'pill', useBG = true, fullWidth = false, minButtonWidth, ariaLabel, } = props || {};
+    value = options.find((o) => !o.disabled)?.key ?? options[0]?.key, onChange = (_v) => { }, className = '', size = 40, shape = 'pill', useBG = true, fullWidth = false, minButtonWidth, ariaLabel, } = props || {};
     /* **라디오 무리는 Tab 자리 하나 + 화살표**가 ARIA 규칙이다.
        `role="radiogroup"`·`role="radio"` 만 붙여 놓고 키를 안 만들면 **안 붙인 것보다
        나쁘다** — 낭독기가 "라디오 그룹, 3 중 2" 라고 읽어 주니 사람은 화살표를 누르는데

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

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

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

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