@1d1s/design-system 2.7.0 → 2.8.0

package/dist/components/Icons/ArrowLeft.d.ts

@@ -0,0 +1,2 @@
+import { default as React } from 'react';
+export declare const ArrowLeft: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,4 +1,5 @@
 export * from './AddCircle';
+export * from './ArrowLeft';
 export * from './Bell';
 export * from './BookOpen';
 export * from './Calendar';

package/dist/components/MobileHeader/MobileHeader.d.ts

@@ -0,0 +1,30 @@
+import { default as React } from 'react';
+export interface MobileHeaderProps extends Omit<React.HTMLAttributes<HTMLElement>, "title"> {
+    /** 가운데 타이틀 — body1 / extrabold 로 통일 렌더 */
+    title: string;
+    /** 뒤로가기 핸들러. 넘기지 않으면 좌측 버튼은 렌더되지 않음 */
+    onBack?: () => void;
+    /** 타이틀 아래 작은 보조 텍스트 */
+    subtitle?: React.ReactNode;
+    /** 우측 액션 슬롯 (설정 / 공유 등) */
+    right?: React.ReactNode;
+    /** 뒤로가기 버튼 aria-label (기본 "뒤로가기") */
+    backLabel?: string;
+}
+/**
+ * MobileHeader
+ * 모바일 서브페이지용 sticky 헤더 — 좌측 뒤로가기 / 가운데 타이틀 / 우측 액션 슬롯.
+ * `lg:hidden` 으로 모바일 전용이며, 데스크톱/태블릿은 {@link TopNav} 를 사용한다.
+ *
+ * 타이틀 규격은 body1(text-xl) · extrabold 로 통일한다.
+ *
+ * @example
+ * ```tsx
+ * <MobileHeader
+ *   title="챌린지 상세"
+ *   onBack={() => router.back()}
+ *   right={<button aria-label="설정"><Settings width={20} height={20} /></button>}
+ * />
+ * ```
+ */
+export declare function MobileHeader({ title, onBack, subtitle, right, backLabel, className, ...props }: MobileHeaderProps): React.ReactElement;

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

@@ -0,0 +1 @@
+export * from './MobileHeader';

package/dist/components/index.d.ts

@@ -24,6 +24,7 @@ export { Icon } from './Icons/Icon';
 export type { IconName, IconProps } from './Icons/Icon';
 export * from './ImagePicker';
 export * from './ImagePlaceholder';
+export * from './MobileHeader';
 export * from './PageWatermark';
 export * from './Pagination';
 export * from './ProgressBar';