sellmate-design-system-react 0.2.0 → 0.4.0

package/dist/components/SGnb/SGnb.d.ts

@@ -1,8 +1,10 @@
-import { type CSSProperties, type ReactNode } from 'react';
-import { type SGnbType, type SGnbColor, type SGnbMenuItem } from './gnb.config';
-export interface SGnbProps {
-    /** 레이아웃 구조: box(라운드) / belt(풀폭). 미지정 시 SLayout 의 type 을 따른다. */
+import { type HTMLAttributes, type ReactNode } from 'react';
+import { type SGnbType, type SGnbHeader, type SGnbColor, type SGnbMenuItem } from './gnb.config';
+export interface SGnbProps extends Omit<HTMLAttributes<HTMLDivElement>, 'color'> {
+    /** 메뉴 스타일: box(라운드) / belt(풀폭 행). 미지정 시 SLayout 의 type 을 따른다. */
     type?: SGnbType;
+    /** 상단바 구조: fix(GNB 폭 고정) / full(레이아웃 전폭). 미지정 시 SLayout 의 header 를 따른다. */
+    header?: SGnbHeader;
     /** 색상 테마: light / dark */
     color?: SGnbColor;
     /** 메뉴 트리 (depth1 → depth2 → depth3) */
@@ -15,21 +17,23 @@ export interface SGnbProps {
     folded?: boolean;
     /** 접힘 토글 (sdFoldChange) */
     onFoldChange?: (folded: boolean) => void;
-    /** 앱런처(그리드) 버튼 클릭 */
+    /** 앱런처(그리드) 버튼 클릭. 미지정 시 런처 버튼을 렌더하지 않는다. */
     onLauncherClick?: () => void;
     /** 상단바 로고 영역 (slot) */
     logo?: ReactNode;
-    /** 상단바 검색 영역 (slot) */
-    search?: ReactNode;
-    className?: string;
-    style?: CSSProperties;
+    /** 메뉴 landmark(nav) 의 접근성 레이블. 한 화면에 nav 가 여럿일 때 구분한다. */
+    ariaLabel?: string;
 }
 /**
  * SGnb — 글로벌 네비게이션.
- * type(box/belt) × color(light/dark) 두 축으로 4가지 조합. 상단바(앱런처+로고/검색 슬롯+접기 토글)
- * + depth1/2/3 메뉴 트리 + fold(레일). 치수는 --cmp-gnbBox / --cmp-gnbBelt, 색은 --cmp-light / --cmp-dark 토큰 합성.
+ * 세 축이 독립이다: type(box/belt) = 메뉴 스타일, header(fix/full) = 상단바 구조,
+ * color(light/dark) = 색. 치수는 --cmp-gnbBox / --cmp-gnbBelt, 색은 --cmp-light / --cmp-dark 토큰 합성.
  *
- * SLayout 안에서 쓰면 type·folded 를 context 에서 읽어 앱이 type 을 중복으로 넘길 필요가 없다.
+ * header 가 배치와 접힘 형태를 정한다:
+ * - fix: 상단바가 GNB 컬럼(메뉴 폭) 안에 있다. 접으면 48px 세로 레일로 좁혀진다.
+ * - full: 상단바가 레이아웃 전폭을 가로지르고 그 아래 [메뉴 | 페이지]. 접으면 메뉴만 사라진다.
+ *
+ * SLayout 안에서 쓰면 type·header·folded 를 context 에서 읽어 앱이 중복으로 넘길 필요가 없다.
  * SLayout 없이 단독으로도 동작한다(prop 또는 기본값 사용).
  */
 export declare const SGnb: import("react").ForwardRefExoticComponent<SGnbProps & import("react").RefAttributes<HTMLDivElement>>;