sellmate-design-system-react 9.0.0-beta.25 → 9.0.0-beta.27

package/dist/components/SChipFilter/README.md

@@ -11,8 +11,7 @@
 | `fields?` | `SChipFilterGroup[]` | — | 필터 정의 목록. 묶을 것이 없어도 한 그룹으로 감싸 넘긴다 — `[{ fields: [...] }]`. 그룹은 rule로 함께 검증하거나 divider로 갈라 놓을 때 나눈다. |
 | `value?` | `SChipFilterValueMap` | — | 필터 값 맵 |
 | `activeKeys?` | `string[]` | — | 노출 필터 key 목록. 지정하면 제어 컴포넌트로 동작 — "필터 추가"로 고른 필드를 이 배열에 직접 넣어줘야 칩이 나타난다(onActiveKeysChange에서 받은 keys로 갱신). 지정하지 않으면 fixed·required 필드만 노출된 상태로 시작해 컴포넌트가 내부 상태로 관리하는 비제어 방식으로 동작한다. fixed·required 필드는 이 배열에 없어도 항상 노출된다 |
-| `label?` | `string` | `'검색 필터'` | 좌측 태그 텍스트 |
-| `showLabel?` | `boolean` | `false` | 좌측 태그(label)·구분선 표시 여부 |
+| `label?` | `string` | — | 좌측 태그 텍스트. 지정하면 태그와 그 뒤 구분선이 함께 노출되고, 지정하지 않으면(undefined) 둘 다 생략된다 |
 | `showReset?` | `boolean` | `true` | 검색 초기화 링크 표시 여부 |
 | `disabled?` | `boolean` | `false` | 바 비활성 상태 |
 | `className?` | `string` | — |  |
@@ -24,7 +23,7 @@
 |-------|------|-------------|
 | `onValueChange` | `(value: SChipFilterValueMap) => void` | 전체 값 변경 — 편집 중인 값이 바뀔 때마다(선택할 때마다) 호출된다. 실제 검색 실행은 onSearch를 쓴다 |
 | `onFilterChange` | `(detail: SChipFilterChangeDetail) => void` | 개별 필터 값 변경 |
-| `onSearch` | `(value: SChipFilterValueMap) => void` | 실제 검색을 실행할 시점 — 편집 팝오버의 "검색" 버튼을 누르거나 팝오버가 닫힐 때(바깥 클릭·Esc·다른 칩으로 전환 포함) 그 시점의 전체 값 맵과 함께 호출된다. 팝오버가 없는 필드(인라인 date 프리셋·custom, clearable ×, 검색 초기화)는 값이 바뀌는 즉시 호출된다. keyword 필터에서 Enter 로 키워드를 추가할 때도 그 즉시 호출된다 — 팝오버는 열린 채라 키워드를 이어서 더 넣을 수 있고, 넣을 때마다 조회가 갱신된다. dirty 체크가 기본 적용되어 있어 — 마지막으로 실제 검색이 실행된 값 맵과 비교해 하나라도 달라진 게 없으면(예: 팝오버를 열었다 아무것도 안 바꾸고 닫는 경우) 호출되지 않는다. fields를 그룹으로 넘겼다면 rule을 만족하지 못한 그룹이 있는 동안엔 onSearch가 호출되지 않는다 — 해당 그룹의 경고 툴팁은 이 시점과 무관하게 값이 비어 있는 동안 항상 실시간으로 떠 있다(별도로 validate()를 호출할 필요 없음) |
+| `onSearch` | `(value: SChipFilterValueMap) => void` | 실제 검색을 실행할 시점 — 편집 팝오버의 "검색" 버튼을 누르거나 팝오버가 닫힐 때(바깥 클릭·Esc·다른 칩으로 전환 포함) 그 시점의 전체 값 맵과 함께 호출된다. 팝오버가 없는 필드(인라인 date 프리셋·custom, clearable ×, 검색 초기화)는 값이 바뀌는 즉시 호출된다. keyword 필터에서 Enter 로 키워드를 추가할 때도 그 즉시 호출된다 — 팝오버는 열린 채라 키워드를 이어서 더 넣을 수 있고, 넣을 때마다 조회가 갱신된다. dirty 체크가 기본 적용되어 있어 — 마지막으로 실제 검색이 실행된 값 맵과 비교해 하나라도 달라진 게 없으면(예: 팝오버를 열었다 아무것도 안 바꾸고 닫는 경우) 호출되지 않는다. fields를 그룹으로 넘겼다면 rule을 만족하지 못한 그룹이 있는 동안엔 onSearch가 호출되지 않는다 — 해당 그룹의 경고 툴팁은 이 시점과 무관하게 값이 비어 있는 동안 항상 실시간으로 떠 있다(별도로 validate()를 호출할 필요 없음). required 필드가 비어 있는 동안에도 마찬가지로 호출되지 않는다 — 정상 설정(내장 기본값 또는 defaultValue)이라면 원래 비워지지 않지만, defaultValue 없는 select-multi·keyword·custom에 required만 준 오설정에서는 "검색 초기화"·clearable이 값을 null로 비울 수 있어 이때의 안전장치다 |
 | `onActiveKeysChange` | `(keys: string[]) => void` | 노출 필터 key 변경(칩 추가·제거) — 비제어 방식에서도 참고용으로 호출된다. activeKeys를 직접 제어할 때는 이 값을 그대로 activeKeys에 반영해야 한다 |
 | `onReset` | `() => void` | "검색 초기화" 클릭 — 모든 필드가 기본값(또는 null)으로 리셋된 뒤 호출된다 |
 | `onAddFilter` | `(key: string) => void` | "필터 추가" 목록에서 항목을 골랐을 때 — activeKeys를 직접 제어 중이면 이 콜백에서 (또는 onActiveKeysChange에서) key를 activeKeys에 추가해줘야 칩이 실제로 나타난다. activeKeys를 넘기지 않았다면(비제어) 별도 처리 없이도 컴포넌트가 알아서 칩을 노출한다 |
@@ -35,7 +34,7 @@
 |--------|------|-------------|
 | `open` | `(key: string) => void` | 특정 필터 편집 팝오버를 엽니다. |
 | `reset` | `() => void` | 모든 필터 값을 초기화합니다. |
-| `validate` | `() => boolean` | 현재 값 기준으로 각 그룹의 rule을 만족하는지 반환합니다. rule을 준 그룹이 없으면 항상 true. 경고 툴팁은 이 호출과 무관하게 rule 위반 상태인 동안 항상 실시간으로 떠 있으므로, 이 메서드는 그 상태를 그대로 읽어오는 용도다(예: 검색 버튼을 눌러도 되는지 사전 확인) |
+| `validate` | `() => boolean` | 현재 값 기준으로 각 그룹의 rule을 만족하는지, 그리고 required 필드가 모두 비어 있지 않은지 반환합니다. rule을 준 그룹이 없고 required 필드도 모두 값이 있으면 항상 true. 경고 툴팁은 이 호출과 무관하게 rule 위반 상태인 동안 항상 실시간으로 떠 있으므로, 이 메서드는 그 상태를 그대로 읽어오는 용도다(예: 검색 버튼을 눌러도 되는지 사전 확인) |
 
 ## Types
 
@@ -52,7 +51,8 @@ export interface SChipFilterGroup {
   /** rule을 만족하지 않을 때 그룹 중앙에 띄울 툴팁 메시지. 지정 안 하면 rule 종류에 따른 기본 문구를 쓴다 */
   tooltipMessage?: string;
   /** 이 그룹 앞에 구분선을 넣을지. 검증(rule)과 구분선은 별개라 — 묶어서 검증만 하고 싶으면
-   *  주지 않는다. 첫 그룹에는 앞에 가를 것이 없으므로 무시된다(showLabel의 구분선이 이미 있다) */
+   *  주지 않는다. 첫 그룹에는 앞에 가를 것이 없으므로 무시된다(label을 지정했다면 그 구분선이
+   *  이미 있다) */
   divider?: boolean;
 }
 ```
@@ -288,12 +288,17 @@ export interface SChipFilterFieldBase {
 ```ts
 /** 프리셋으로 기간을 고르는 필터 — datepicker-range·datepicker-statistics */
 export interface SChipFilterPresetsField extends SChipFilterFieldBase {
-  /** 프리셋 라디오 목록. datepicker-range에서 지정하지 않으면 프리셋 없이 기간 피커 하나만 놓이고,
-   *  datepicker-statistics에서 지정하지 않으면 일별·월별·분기별·반기별·연도별·사용자 지정 기본 목록을 쓴다 */
+  /** 프리셋 라디오 목록. 지정하지 않으면 타입별 기본 목록을 쓴다 —
+   *  datepicker-range: 오늘·지난 7일·지난 30일·사용자 지정,
+   *  datepicker-statistics: 일별·월별·분기별·반기별·연도별·사용자 지정.
+   *  프리셋 라디오 없이 캘린더(datepicker-range) 하나만 두려면 presets: [] 를 명시한다 */
   presets?: SChipFilterDatePreset[];
   /** 선택 가능 범위 */
   selectable?: [string, string];
-  /** "사용자 지정" 프리셋으로 기간을 고를 때의 최대 선택 일수 */
+  /** "사용자 지정" 프리셋으로 기간을 고를 때의 최대 선택 일수.
+   *  지정하지 않아도 presets에 custom 프리셋이 있으면 기본 90일이 적용된다 — 무제한 기간
+   *  집계·조회로 백엔드에 과도한 요청이 가는 것을 막기 위한 안전장치. 다른 상한이 필요하면
+   *  이 값을 직접 지정한다 */
   maxRange?: number;
 }
 ```
@@ -350,10 +355,10 @@ export interface SChipFilterDatePreset {
 
 - [SDatePicker](../SDatePicker)
 - [SDateRangePicker](../SDateRangePicker)
-- [SGhostButton](../SGhostButton)
 - [SIcon](../SIcon)
 - [SRadio](../SRadio)
 - [SRadioButton](../SRadioButton)
+- [SSearchInput](../SSearchInput)
 - [STag](../STag)
 - [STextLink](../STextLink)
 - [STooltip](../STooltip)
@@ -364,10 +369,10 @@ export interface SChipFilterDatePreset {
 graph TD;
   SChipFilter --> SDatePicker
   SChipFilter --> SDateRangePicker
-  SChipFilter --> SGhostButton
   SChipFilter --> SIcon
   SChipFilter --> SRadio
   SChipFilter --> SRadioButton
+  SChipFilter --> SSearchInput
   SChipFilter --> STag
   SChipFilter --> STextLink
   SChipFilter --> STooltip

package/dist/components/SChipFilter/SChipFilter.d.ts

@@ -75,12 +75,17 @@ export interface SChipFilterOptionsField extends SChipFilterFieldBase {
 }
 /** 프리셋으로 기간을 고르는 필터 — datepicker-range·datepicker-statistics */
 export interface SChipFilterPresetsField extends SChipFilterFieldBase {
-    /** 프리셋 라디오 목록. datepicker-range에서 지정하지 않으면 프리셋 없이 기간 피커 하나만 놓이고,
-     *  datepicker-statistics에서 지정하지 않으면 일별·월별·분기별·반기별·연도별·사용자 지정 기본 목록을 쓴다 */
+    /** 프리셋 라디오 목록. 지정하지 않으면 타입별 기본 목록을 쓴다 —
+     *  datepicker-range: 오늘·지난 7일·지난 30일·사용자 지정,
+     *  datepicker-statistics: 일별·월별·분기별·반기별·연도별·사용자 지정.
+     *  프리셋 라디오 없이 캘린더(datepicker-range) 하나만 두려면 presets: [] 를 명시한다 */
     presets?: SChipFilterDatePreset[];
     /** 선택 가능 범위 */
     selectable?: [string, string];
-    /** "사용자 지정" 프리셋으로 기간을 고를 때의 최대 선택 일수 */
+    /** "사용자 지정" 프리셋으로 기간을 고를 때의 최대 선택 일수.
+     *  지정하지 않아도 presets에 custom 프리셋이 있으면 기본 90일이 적용된다 — 무제한 기간
+     *  집계·조회로 백엔드에 과도한 요청이 가는 것을 막기 위한 안전장치. 다른 상한이 필요하면
+     *  이 값을 직접 지정한다 */
     maxRange?: number;
 }
 /** 후보 하나를 고른다 */
@@ -172,7 +177,8 @@ export interface SChipFilterGroup {
     /** rule을 만족하지 않을 때 그룹 중앙에 띄울 툴팁 메시지. 지정 안 하면 rule 종류에 따른 기본 문구를 쓴다 */
     tooltipMessage?: string;
     /** 이 그룹 앞에 구분선을 넣을지. 검증(rule)과 구분선은 별개라 — 묶어서 검증만 하고 싶으면
-     *  주지 않는다. 첫 그룹에는 앞에 가를 것이 없으므로 무시된다(showLabel의 구분선이 이미 있다) */
+     *  주지 않는다. 첫 그룹에는 앞에 가를 것이 없으므로 무시된다(label을 지정했다면 그 구분선이
+     *  이미 있다) */
     divider?: boolean;
 }
 export interface SChipFilterHandle {
@@ -180,7 +186,8 @@ export interface SChipFilterHandle {
     open: (key: string) => void;
     /** 모든 필터 값을 초기화합니다. */
     reset: () => void;
-    /** 현재 값 기준으로 각 그룹의 rule을 만족하는지 반환합니다. rule을 준 그룹이 없으면 항상 true.
+    /** 현재 값 기준으로 각 그룹의 rule을 만족하는지, 그리고 required 필드가 모두 비어 있지 않은지
+     *  반환합니다. rule을 준 그룹이 없고 required 필드도 모두 값이 있으면 항상 true.
      *  경고 툴팁은 이 호출과 무관하게 rule 위반 상태인 동안 항상 실시간으로 떠 있으므로,
      *  이 메서드는 그 상태를 그대로 읽어오는 용도다(예: 검색 버튼을 눌러도 되는지 사전 확인) */
     validate: () => boolean;
@@ -202,7 +209,10 @@ export interface SChipFilterProps {
      *  실제 검색이 실행된 값 맵과 비교해 하나라도 달라진 게 없으면(예: 팝오버를 열었다 아무것도 안 바꾸고
      *  닫는 경우) 호출되지 않는다. fields를 그룹으로 넘겼다면 rule을 만족하지 못한 그룹이 있는 동안엔
      *  onSearch가 호출되지 않는다 — 해당 그룹의 경고 툴팁은 이 시점과 무관하게 값이 비어 있는 동안 항상
-     *  실시간으로 떠 있다(별도로 validate()를 호출할 필요 없음) */
+     *  실시간으로 떠 있다(별도로 validate()를 호출할 필요 없음). required 필드가 비어 있는 동안에도
+     *  마찬가지로 호출되지 않는다 — 정상 설정(내장 기본값 또는 defaultValue)이라면 원래 비워지지
+     *  않지만, defaultValue 없는 select-multi·keyword·custom에 required만 준 오설정에서는 "검색
+     *  초기화"·clearable이 값을 null로 비울 수 있어 이때의 안전장치다 */
     onSearch?: (value: SChipFilterValueMap) => void;
     /** 노출 필터 key 목록. 지정하면 제어 컴포넌트로 동작 — "필터 추가"로 고른 필드를 이 배열에 직접
      *  넣어줘야 칩이 나타난다(onActiveKeysChange에서 받은 keys로 갱신). 지정하지 않으면
@@ -218,10 +228,9 @@ export interface SChipFilterProps {
      *  (또는 onActiveKeysChange에서) key를 activeKeys에 추가해줘야 칩이 실제로 나타난다.
      *  activeKeys를 넘기지 않았다면(비제어) 별도 처리 없이도 컴포넌트가 알아서 칩을 노출한다 */
     onAddFilter?: (key: string) => void;
-    /** 좌측 태그 텍스트 */
+    /** 좌측 태그 텍스트. 지정하면 태그와 그 뒤 구분선이 함께 노출되고, 지정하지 않으면(undefined)
+     *  둘 다 생략된다 */
     label?: string;
-    /** 좌측 태그(label)·구분선 표시 여부 */
-    showLabel?: boolean;
     /** 검색 초기화 링크 표시 여부 */
     showReset?: boolean;
     /** 바 비활성 상태 */

package/dist/components/SGhostButton/README.md

@@ -48,7 +48,6 @@ export type SGhostButtonIntent = 'default' | 'danger' | 'action' | 'subAction' |
  - [SBarcodeInput](../SBarcodeInput)
  - [SCalendar](../SCalendar)
  - [SChip](../SChip)
- - [SChipFilter](../SChipFilter)
  - [SDatePicker](../SDatePicker)
  - [SDateRangePicker](../SDateRangePicker)
  - [SFilePicker](../SFilePicker)
@@ -81,7 +80,6 @@ graph TD;
   SBarcodeInput --> SGhostButton
   SCalendar --> SGhostButton
   SChip --> SGhostButton
-  SChipFilter --> SGhostButton
   SDatePicker --> SGhostButton
   SDateRangePicker --> SGhostButton
   SFilePicker --> SGhostButton

package/dist/components/SSearchInput/README.md

@@ -41,6 +41,7 @@ export type SSearchInputSize = SFieldSize;
 
 ### Used by
 
+ - [SChipFilter](../SChipFilter)
  - [SSelect](../SSelect)
 
 ### Depends on
@@ -56,6 +57,7 @@ graph TD;
   SSearchInput --> SField
   SSearchInput --> SGhostButton
   SSearchInput --> SIcon
+  SChipFilter --> SSearchInput
   SSelect --> SSearchInput
   style SSearchInput fill:#f9f,stroke:#333,stroke-width:4px
 ```

package/dist/components/SSelect/README.md

@@ -22,7 +22,7 @@
 | `error?` | `boolean` | `false` | 에러 상태 |
 | `rules?` | `Rule[]` | — | 유효성 규칙 — 닫힐 때 자동 검증 |
 | `labelTooltipProps?` | `Partial<STooltipProps>` | — | 레이블 툴팁 상세 옵션 |
-| `dropdownHeight?` | `string` | `'260px'` | 드롭다운 최대 높이 |
+| `dropdownHeight?` | `string` | `'640px'` | 드롭다운 최대 높이. 기본 640px — 창이 이보다 작으면 창 안에 남는 만큼까지만 채워진다 |
 | `dropdownWidth?` | `string` | — | 드롭다운 너비 (없으면 트리거 너비). 창보다 넓게 줘도 창 폭까지만 벌어진다. |
 | `maxDropdownWidth?` | `string` | `'640px'` | 드롭다운 최대 너비. 창이 이보다 좁으면 창 폭이 상한이 된다. |
 | `label?` | `string` | — |  |

package/dist/components/SSelect/SSelect.d.ts

@@ -49,7 +49,7 @@ export interface SSelectProps {
     rules?: Rule[];
     /** 레이블 툴팁 상세 옵션 */
     labelTooltipProps?: Partial<STooltipProps>;
-    /** 드롭다운 최대 높이 */
+    /** 드롭다운 최대 높이. 기본 640px — 창이 이보다 작으면 창 안에 남는 만큼까지만 채워진다 */
     dropdownHeight?: string;
     /** 드롭다운 너비 (없으면 트리거 너비). 창보다 넓게 줘도 창 폭까지만 벌어진다. */
     dropdownWidth?: string;

package/dist/components/STable/README.md

@@ -9,6 +9,7 @@
 | Prop | Type | Default | Description |
 |------|------|---------|-------------|
 | `columns?` | `STableColumn[]` | `[]` |  |
+| `headerGroups?` | `STableHeaderGroup[]` | — | 상위 그룹 헤더. 지정하면 기존 컬럼 헤더가 두 번째 행에 렌더링된다. |
 | `rows?` | `SRow[]` | `[]` |  |
 | `rowKey?` | `string` | `'id'` | 행 식별 필드 |
 | `selectable?` | `boolean` | `false` | 행 선택 체크박스 |
@@ -78,6 +79,21 @@ export type STableColumn = STableColumnBase &
   );
 ```
 
+### STableHeaderGroup
+
+```ts
+/** 2단 헤더의 상위 셀. columnNames는 visible 컬럼 기준으로 연속되어야 한다. */
+export interface STableHeaderGroup {
+  label?: ReactNode;
+  columnNames: string[];
+  rowSpan?: 1 | 2;
+  align?: 'left' | 'center' | 'right';
+  className?: string;
+  style?: CSSProperties;
+  render?: () => ReactNode;
+}
+```
+
 ### SRow
 
 ```ts

package/dist/components/STable/STable.d.ts

@@ -147,6 +147,16 @@ export interface STableSort {
     name: string;
     dir: 'asc' | 'desc';
 }
+/** 2단 헤더의 상위 셀. columnNames는 visible 컬럼 기준으로 연속되어야 한다. */
+export interface STableHeaderGroup {
+    label?: ReactNode;
+    columnNames: string[];
+    rowSpan?: 1 | 2;
+    align?: 'left' | 'center' | 'right';
+    className?: string;
+    style?: CSSProperties;
+    render?: () => ReactNode;
+}
 /** STable ref 명령형 API (sd-table @Method 대응) */
 export interface STableHandle {
     /** 행 선택 여부 */
@@ -171,6 +181,8 @@ export interface STableHandle {
 }
 export interface STableProps {
     columns?: STableColumn[];
+    /** 상위 그룹 헤더. 지정하면 기존 컬럼 헤더가 두 번째 행에 렌더링된다. */
+    headerGroups?: STableHeaderGroup[];
     rows?: SRow[];
     /** 행 식별 필드 */
     rowKey?: string;

package/dist/components/STable/index.d.ts

@@ -1 +1 @@
-export { STable, type STableProps, type STableColumn, type STableColumnField, type STableSort, type STableCellContext, type STablePagination, type STableStickyColumn, type STableHandle, type SRow, } from './STable';
+export { STable, type STableProps, type STableColumn, type STableColumnField, type STableSort, type STableHeaderGroup, type STableCellContext, type STablePagination, type STableStickyColumn, type STableHandle, type SRow, } from './STable';