@yeongseoksong/framework 1.2.0 → 1.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,11 +1,13 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import * as _mantine_core from '@mantine/core';
3
- import { MantineSize, TabsProps, TabsListProps, TabsPanelProps, TitleProps, TextProps, ButtonProps, BoxProps, TableProps, ModalProps, ThemeIconProps, ContainerProps, BadgeProps, TextInputProps, PasswordInputProps, TextareaProps, SelectProps, SkeletonProps, AnchorProps, StackProps, StyleProp, MantineColor, SimpleGridProps, CardProps as CardProps$1, MantineColorsTuple } from '@mantine/core';
3
+ import { MantineSize, TabsProps, TabsListProps, TabsPanelProps, TitleProps, TextProps, ButtonProps, BoxProps, TableProps, ModalProps, ThemeIconProps, ContainerProps, BadgeProps, TextInputProps, PasswordInputProps, TextareaProps, JsonInputProps, NumberInputProps, SliderProps, InputWrapperProps, RatingProps, PinInputProps, SelectProps, NativeSelectProps, MultiSelectProps, AutocompleteProps, TagsInputProps, RadioGroupProps, SegmentedControlProps, CheckboxProps, SwitchProps, FileInputProps, ColorInputProps, SkeletonProps, AnchorProps, StackProps, StyleProp, MantineColor, SimpleGridProps, CardProps as CardProps$1, MantineColorsTuple } from '@mantine/core';
4
4
  import React$1, { ReactNode, ComponentPropsWithoutRef, AnchorHTMLAttributes } from 'react';
5
5
  import * as _mantine_core_lib_components_Modal_ModalCloseButton from '@mantine/core/lib/components/Modal/ModalCloseButton';
6
6
  import * as _mantine_core_lib_components_Modal_ModalBody from '@mantine/core/lib/components/Modal/ModalBody';
7
7
  import * as _mantine_core_lib_components_Modal_ModalTitle from '@mantine/core/lib/components/Modal/ModalTitle';
8
8
  import * as _mantine_core_lib_components_Modal_ModalHeader from '@mantine/core/lib/components/Modal/ModalHeader';
9
+ import { DateInputProps, DatePickerInputProps, TimeInputProps } from '@mantine/dates';
10
+ import { NotificationData, NotificationsProps } from '@mantine/notifications';
9
11
 
10
12
  interface LogoProps {
11
13
  size?: MantineSize;
@@ -372,23 +374,89 @@ declare const SdBadgePrimary: ({ children, ...props }: Props$1) => react_jsx_run
372
374
  declare const SdBadgeSuccess: ({ children, ...props }: Props$1) => react_jsx_runtime.JSX.Element;
373
375
  declare const SdBadgeWarning: ({ children, ...props }: Props$1) => react_jsx_runtime.JSX.Element;
374
376
 
377
+ /** Input.Wrapper가 대신 받아 주는 필드들. */
378
+ type WrapperFields = Pick<InputWrapperProps, 'label' | 'description' | 'error' | 'required' | 'withAsterisk'>;
379
+ /** 라디오는 그룹 단위로 쓰인다 — 항목을 `data`로 받아 Select류와 호출부를 맞춘다. */
380
+ interface SdRadioProps extends Omit<RadioGroupProps, 'children'> {
381
+ data: {
382
+ value: string;
383
+ label: ReactNode;
384
+ disabled?: boolean;
385
+ }[];
386
+ orientation?: 'horizontal' | 'vertical';
387
+ }
388
+ declare function SdInputRadio({ data, orientation, ...props }: SdRadioProps): react_jsx_runtime.JSX.Element;
375
389
  declare const SdInput: {
376
390
  /** 일반 텍스트 — 이름, 회사명 등 */
377
- Text: ({ ...props }: TextInputProps) => react_jsx_runtime.JSX.Element;
391
+ Text: (props: TextInputProps) => react_jsx_runtime.JSX.Element;
378
392
  /** 이메일 입력 */
379
- Email: ({ ...props }: TextInputProps) => react_jsx_runtime.JSX.Element;
393
+ Email: (props: TextInputProps) => react_jsx_runtime.JSX.Element;
380
394
  /** 비밀번호 입력 — 마스킹 토글 포함 */
381
- Password: ({ ...props }: PasswordInputProps) => react_jsx_runtime.JSX.Element;
395
+ Password: (props: PasswordInputProps) => react_jsx_runtime.JSX.Element;
382
396
  /** 멀티라인 텍스트 — 문의 메시지 등 */
383
- Textarea: ({ ...props }: TextareaProps) => react_jsx_runtime.JSX.Element;
397
+ Textarea: (props: TextareaProps) => react_jsx_runtime.JSX.Element;
398
+ /** JSON 입력 — 포맷·검증 버튼 포함 */
399
+ Json: (props: JsonInputProps) => react_jsx_runtime.JSX.Element;
400
+ /** 숫자 입력 — 증감 컨트롤 포함 */
401
+ Number: (props: NumberInputProps<number>) => react_jsx_runtime.JSX.Element;
402
+ /** 범위 선택 슬라이더 */
403
+ Slider: ({ label, description, error, required, withAsterisk, ...rest }: Omit<SliderProps, "label" | "error" | "description" | "required" | "withAsterisk"> & WrapperFields) => react_jsx_runtime.JSX.Element;
404
+ /** 별점 */
405
+ Rating: ({ label, description, error, required, withAsterisk, ...rest }: Omit<RatingProps, "label" | "error" | "description" | "required" | "withAsterisk"> & WrapperFields) => react_jsx_runtime.JSX.Element;
406
+ /** 인증번호 등 자리수가 고정된 코드 */
407
+ PinCode: ({ label, description, error, required, withAsterisk, ...rest }: Omit<PinInputProps, "label" | "error" | "description" | "required" | "withAsterisk"> & WrapperFields) => react_jsx_runtime.JSX.Element;
384
408
  /** 드롭다운 선택 */
385
- Select: ({ ...props }: SelectProps) => react_jsx_runtime.JSX.Element;
409
+ Select: (props: SelectProps<string>) => react_jsx_runtime.JSX.Element;
410
+ /** 브라우저 기본 select — 모바일·간단한 목록 */
411
+ NativeSelect: (props: NativeSelectProps) => react_jsx_runtime.JSX.Element;
412
+ /** 다중 선택 */
413
+ MultiSelect: (props: MultiSelectProps<string>) => react_jsx_runtime.JSX.Element;
414
+ /** 입력하며 후보를 좁히는 자동완성(자유 입력 허용) */
415
+ Autocomplete: (props: AutocompleteProps) => react_jsx_runtime.JSX.Element;
416
+ /** 자유롭게 추가하는 태그 목록 */
417
+ Tags: (props: TagsInputProps) => react_jsx_runtime.JSX.Element;
418
+ /** 라디오 그룹 — data로 항목을 넘긴다 */
419
+ Radio: typeof SdInputRadio;
420
+ /** 두세 개 중 하나 — 탭처럼 보이는 선택 */
421
+ Segmented: ({ label, description, error, required, withAsterisk, ...rest }: Omit<SegmentedControlProps<string>, "label" | "error" | "description" | "required" | "withAsterisk"> & WrapperFields) => react_jsx_runtime.JSX.Element;
422
+ /** 체크박스 — getInputProps(name, { type: 'checkbox' }) */
423
+ Checkbox: (props: CheckboxProps) => react_jsx_runtime.JSX.Element;
424
+ /** 스위치 — 즉시 반영되는 on/off */
425
+ Switch: (props: SwitchProps) => react_jsx_runtime.JSX.Element;
426
+ /** 파일 선택 */
427
+ File: (props: FileInputProps<false>) => react_jsx_runtime.JSX.Element;
428
+ /** 색상 선택 */
429
+ Color: (props: ColorInputProps) => react_jsx_runtime.JSX.Element;
430
+ /** 날짜 — 직접 입력 + 달력 팝오버. 값은 'YYYY-MM-DD' 문자열 */
431
+ Date: (props: DateInputProps) => react_jsx_runtime.JSX.Element;
432
+ /** 기간 — 시작·종료 두 날짜 */
433
+ DateRange: (props: DatePickerInputProps<"range">) => react_jsx_runtime.JSX.Element;
434
+ /** 시각 */
435
+ Time: (props: TimeInputProps) => react_jsx_runtime.JSX.Element;
386
436
  };
387
- declare const SdInputText: ({ ...props }: TextInputProps) => react_jsx_runtime.JSX.Element;
388
- declare const SdInputEmail: ({ ...props }: TextInputProps) => react_jsx_runtime.JSX.Element;
389
- declare const SdInputPassword: ({ ...props }: PasswordInputProps) => react_jsx_runtime.JSX.Element;
390
- declare const SdInputTextarea: ({ ...props }: TextareaProps) => react_jsx_runtime.JSX.Element;
391
- declare const SdInputSelect: ({ ...props }: SelectProps) => react_jsx_runtime.JSX.Element;
437
+ declare const SdInputText: (props: TextInputProps) => react_jsx_runtime.JSX.Element;
438
+ declare const SdInputEmail: (props: TextInputProps) => react_jsx_runtime.JSX.Element;
439
+ declare const SdInputPassword: (props: PasswordInputProps) => react_jsx_runtime.JSX.Element;
440
+ declare const SdInputTextarea: (props: TextareaProps) => react_jsx_runtime.JSX.Element;
441
+ declare const SdInputJson: (props: JsonInputProps) => react_jsx_runtime.JSX.Element;
442
+ declare const SdInputNumber: (props: NumberInputProps<number>) => react_jsx_runtime.JSX.Element;
443
+ declare const SdInputSlider: ({ label, description, error, required, withAsterisk, ...rest }: Omit<SliderProps, "label" | "error" | "description" | "required" | "withAsterisk"> & WrapperFields) => react_jsx_runtime.JSX.Element;
444
+ declare const SdInputRating: ({ label, description, error, required, withAsterisk, ...rest }: Omit<RatingProps, "label" | "error" | "description" | "required" | "withAsterisk"> & WrapperFields) => react_jsx_runtime.JSX.Element;
445
+ declare const SdInputPinCode: ({ label, description, error, required, withAsterisk, ...rest }: Omit<PinInputProps, "label" | "error" | "description" | "required" | "withAsterisk"> & WrapperFields) => react_jsx_runtime.JSX.Element;
446
+ declare const SdInputSelect: (props: SelectProps<string>) => react_jsx_runtime.JSX.Element;
447
+ declare const SdInputNativeSelect: (props: NativeSelectProps) => react_jsx_runtime.JSX.Element;
448
+ declare const SdInputMultiSelect: (props: MultiSelectProps<string>) => react_jsx_runtime.JSX.Element;
449
+ declare const SdInputAutocomplete: (props: AutocompleteProps) => react_jsx_runtime.JSX.Element;
450
+ declare const SdInputTags: (props: TagsInputProps) => react_jsx_runtime.JSX.Element;
451
+ declare const SdInputRadioGroup: typeof SdInputRadio;
452
+ declare const SdInputSegmented: ({ label, description, error, required, withAsterisk, ...rest }: Omit<SegmentedControlProps<string>, "label" | "error" | "description" | "required" | "withAsterisk"> & WrapperFields) => react_jsx_runtime.JSX.Element;
453
+ declare const SdInputCheckbox: (props: CheckboxProps) => react_jsx_runtime.JSX.Element;
454
+ declare const SdInputSwitch: (props: SwitchProps) => react_jsx_runtime.JSX.Element;
455
+ declare const SdInputFile: (props: FileInputProps<false>) => react_jsx_runtime.JSX.Element;
456
+ declare const SdInputColor: (props: ColorInputProps) => react_jsx_runtime.JSX.Element;
457
+ declare const SdInputDate: (props: DateInputProps) => react_jsx_runtime.JSX.Element;
458
+ declare const SdInputDateRange: (props: DatePickerInputProps<"range">) => react_jsx_runtime.JSX.Element;
459
+ declare const SdInputTime: (props: TimeInputProps) => react_jsx_runtime.JSX.Element;
392
460
 
393
461
  declare function SkeletonText({ width, ...props }: SkeletonProps): react_jsx_runtime.JSX.Element;
394
462
  declare function SkeletonTitle({ width, ...props }: SkeletonProps): react_jsx_runtime.JSX.Element;
@@ -434,6 +502,77 @@ declare const SdLinkBody: ({ children, onMouseEnter, onMouseLeave, ...props }: P
434
502
  declare const SdLinkSub: ({ children, onMouseEnter, onMouseLeave, ...props }: Props) => react_jsx_runtime.JSX.Element;
435
503
  declare const SdLinkHint: ({ children, onMouseEnter, onMouseLeave, ...props }: Props) => react_jsx_runtime.JSX.Element;
436
504
 
505
+ /**
506
+ * 변형별 색·아이콘·기본 제목. 토스트의 유일한 출처다.
507
+ *
508
+ * `SdToast.Update`가 같은 맵을 읽어 이미 떠 있는 알림을 다른 변형으로 바꾸므로,
509
+ * 톤을 고치려면 여기만 고치면 된다.
510
+ */
511
+ declare const toastStyles: {
512
+ /** 성공 — 저장·전송 완료 */
513
+ Success: {
514
+ color: "green";
515
+ icon: react_jsx_runtime.JSX.Element;
516
+ title: string;
517
+ };
518
+ /** 실패 — 요청 오류·검증 실패 */
519
+ Error: {
520
+ color: "red";
521
+ icon: react_jsx_runtime.JSX.Element;
522
+ title: string;
523
+ };
524
+ /** 주의 — 되돌릴 수 없는 동작 안내 등 */
525
+ Warning: {
526
+ color: "amber";
527
+ icon: react_jsx_runtime.JSX.Element;
528
+ title: string;
529
+ };
530
+ /** 안내 — 중립 정보 */
531
+ Info: {
532
+ color: "primary";
533
+ icon: react_jsx_runtime.JSX.Element;
534
+ title: string;
535
+ };
536
+ /** 진행 중 — 스피너 + 자동 닫힘 없음. Update로 결과 변형으로 바꾼다. */
537
+ Loading: {
538
+ loading: true;
539
+ autoClose: false;
540
+ withCloseButton: false;
541
+ title: string;
542
+ };
543
+ };
544
+ type ToastVariant = keyof typeof toastStyles;
545
+ declare const SdToast: {
546
+ Success: (message: ReactNode, options?: Partial<NotificationData>) => string;
547
+ Error: (message: ReactNode, options?: Partial<NotificationData>) => string;
548
+ Warning: (message: ReactNode, options?: Partial<NotificationData>) => string;
549
+ Info: (message: ReactNode, options?: Partial<NotificationData>) => string;
550
+ Loading: (message: ReactNode, options?: Partial<NotificationData>) => string;
551
+ /**
552
+ * 이미 떠 있는 알림을 다른 변형으로 교체한다 — `Loading` → `Success`/`Error` 전환용.
553
+ * `loading: false`·`autoClose`를 먼저 깔아 두므로 스피너가 그대로 남지 않는다.
554
+ */
555
+ Update: (id: string, variant: ToastVariant, message: ReactNode, options?: Partial<NotificationData>) => string | undefined;
556
+ /** 특정 알림 닫기 */
557
+ Hide: (id: string) => string;
558
+ /** 떠 있는 알림 전부 닫기 */
559
+ Clean: () => void;
560
+ };
561
+ /**
562
+ * 토스트가 실제로 렌더되는 곳. `MantineProvider` 안에 **한 번** 놓는다.
563
+ * 이게 없으면 `SdToast.*` 호출은 조용히 아무 일도 하지 않는다.
564
+ * 소비자 앱에서 `@mantine/notifications/styles.css` 임포트도 필요하다.
565
+ */
566
+ declare function SdToastProvider(props: NotificationsProps): react_jsx_runtime.JSX.Element;
567
+ declare const SdToastSuccess: (message: ReactNode, options?: Partial<NotificationData>) => string;
568
+ declare const SdToastError: (message: ReactNode, options?: Partial<NotificationData>) => string;
569
+ declare const SdToastWarning: (message: ReactNode, options?: Partial<NotificationData>) => string;
570
+ declare const SdToastInfo: (message: ReactNode, options?: Partial<NotificationData>) => string;
571
+ declare const SdToastLoading: (message: ReactNode, options?: Partial<NotificationData>) => string;
572
+ declare const SdToastUpdate: (id: string, variant: ToastVariant, message: ReactNode, options?: Partial<NotificationData>) => string | undefined;
573
+ declare const SdToastHide: (id: string) => string;
574
+ declare const SdToastClean: () => void;
575
+
437
576
  type TitleVariant = 'Display' | 'Section' | 'Card' | 'Sub';
438
577
  type ColorVariant = StyleProp<MantineColor> | undefined;
439
578
  interface TextBoxProps extends Omit<StackProps, 'title' | 'color'> {
@@ -770,9 +909,24 @@ declare function HeroCarousel({ slides, children }: HeroCarouselProps): react_js
770
909
  interface HeaderProps {
771
910
  navItems: NavItem[];
772
911
  loginFlag?: boolean;
773
- children?: ReactNode;
774
912
  }
775
- declare function SdHeader({ navItems, loginFlag, children }: HeaderProps): react_jsx_runtime.JSX.Element;
913
+ /**
914
+ * Mega 변형(기본) — 헤더 전체가 아래로 확장되며 하위 링크가 상위 항목 아래 컬럼으로
915
+ * 한꺼번에 노출되는 메가 메뉴.
916
+ */
917
+ declare function MegaHeader({ navItems, loginFlag }: HeaderProps): react_jsx_runtime.JSX.Element;
918
+ /**
919
+ * Simple 변형 — 헤더 바 높이는 고정이고, 자식을 가진 상위 항목마다
920
+ * Mantine `Menu`가 하나씩 붙어 개별 드롭다운으로 열린다.
921
+ * 바가 자라지 않으므로 AppShell.Header 높이를 그대로 쓰는 레이아웃에 적합하다.
922
+ */
923
+ declare function SimpleHeader({ navItems, loginFlag }: HeaderProps): react_jsx_runtime.JSX.Element;
924
+ declare const SdHeader: typeof MegaHeader & {
925
+ Mega: typeof MegaHeader;
926
+ Simple: typeof SimpleHeader;
927
+ };
928
+ declare const SdHeaderMega: typeof MegaHeader;
929
+ declare const SdHeaderSimple: typeof SimpleHeader;
776
930
 
777
931
  interface SdFooterProps {
778
932
  company: CompanyInfo;
@@ -831,10 +985,94 @@ declare const SdErrorView: {
831
985
  declare const SdErrorViewPage: typeof Page;
832
986
  declare const SdErrorViewNotFound: typeof NotFound;
833
987
 
834
- declare function MainLayout({ children, navItems, companyInfo, }: {
988
+ /** 소셜 로그인 제공자 아이콘·기본 라벨이 고정된 목록. */
989
+ type LoginProvider = 'google' | 'kakao' | 'naver' | 'apple' | 'github';
990
+ interface LoginSocial {
991
+ provider: LoginProvider;
992
+ /** 버튼 라벨. 생략하면 제공자 기본 라벨("구글로 로그인" 등)을 쓴다. */
993
+ label?: ReactNode;
994
+ /** OAuth 시작 핸들러. 리다이렉트가 필요하면 여기서 이동시킨다. */
995
+ onClick?: () => void;
996
+ }
997
+ /** 폼 제출 값. 비제어 폼이라 소비자는 이 값만 받아 인증 로직을 붙이면 된다. */
998
+ interface LoginValues {
999
+ email: string;
1000
+ password: string;
1001
+ remember: boolean;
1002
+ }
1003
+ interface SdLoginViewProps {
1004
+ title?: ReactNode;
1005
+ description?: ReactNode;
1006
+ /** 제출 시 폼 값 전달. 소비자가 인증 호출을 담당한다. */
1007
+ onSubmit?: (values: LoginValues) => void;
1008
+ /** 제출 버튼 로딩 상태 */
1009
+ loading?: boolean;
1010
+ /** 인증 실패 메시지 — 폼 상단에 SdText.Error로 노출 */
1011
+ error?: ReactNode;
1012
+ submitLabel?: ReactNode;
1013
+ /** 자동 로그인 체크박스 노출 여부 */
1014
+ withRemember?: boolean;
1015
+ /** 비밀번호 찾기 링크. 없으면 렌더하지 않는다. */
1016
+ findPasswordHref?: string;
1017
+ /** 회원가입 링크. 없으면 하단 안내가 사라진다. */
1018
+ signUpHref?: string;
1019
+ /** 소셜 로그인 버튼. 비어 있으면 구분선까지 함께 사라진다. */
1020
+ socials?: LoginSocial[];
1021
+ /** 폼 아래 추가 슬롯 — 약관 안내·사업자 정보 등 */
1022
+ children?: ReactNode;
1023
+ /** 화면 최소 높이. 카탈로그처럼 좁은 프레임에 담을 때 줄인다. */
1024
+ mih?: string | number;
1025
+ }
1026
+ declare function Card({ title, description, mih, ...formProps }: SdLoginViewProps): react_jsx_runtime.JSX.Element;
1027
+ interface SdLoginSplitProps extends SdLoginViewProps {
1028
+ brandTitle?: ReactNode;
1029
+ brandDescription?: ReactNode;
1030
+ }
1031
+ declare function Split({ title, description, brandTitle, brandDescription, mih, ...formProps }: SdLoginSplitProps): react_jsx_runtime.JSX.Element;
1032
+ declare const SdLoginView: {
1033
+ /** 중앙 정렬 카드 — 기본 로그인 화면 */
1034
+ Card: typeof Card;
1035
+ /** 좌측 브랜드 패널 + 우측 폼 — 넓은 화면용 */
1036
+ Split: typeof Split;
1037
+ };
1038
+ declare const SdLoginViewCard: typeof Card;
1039
+ declare const SdLoginViewSplit: typeof Split;
1040
+
1041
+ /** 결과 화면의 액션 버튼. SdButton은 component prop을 받지 못해 href가 아닌 onClick만 받는다. */
1042
+ interface ResultAction {
1043
+ label: ReactNode;
1044
+ onClick: () => void;
1045
+ }
1046
+ interface SdResultProps {
1047
+ title?: ReactNode;
1048
+ description?: ReactNode;
1049
+ /** 주 액션 — filled primary */
1050
+ primaryAction?: ResultAction;
1051
+ /** 보조 액션 — ghost */
1052
+ secondaryAction?: ResultAction;
1053
+ /** 제목·설명과 버튼 사이 상세 슬롯 (주문번호 요약 등) */
1054
+ children?: ReactNode;
1055
+ /** 화면 최소 높이. 좁은 프레임에 담을 때 줄인다. SdErrorView와 같은 기본값. */
1056
+ mih?: string | number;
1057
+ }
1058
+ declare const SdResult: {
1059
+ /** 성공 — 가입 완료·결제 완료 등 */
1060
+ Success: ({ title, description, primaryAction, secondaryAction, children, mih, }: SdResultProps) => react_jsx_runtime.JSX.Element;
1061
+ /** 실패 — 결제 실패·처리 중 오류 등. 서버 오류·404는 SdErrorView를 쓴다. */
1062
+ Error: ({ title, description, primaryAction, secondaryAction, children, mih, }: SdResultProps) => react_jsx_runtime.JSX.Element;
1063
+ };
1064
+ declare const SdResultSuccess: ({ title, description, primaryAction, secondaryAction, children, mih, }: SdResultProps) => react_jsx_runtime.JSX.Element;
1065
+ declare const SdResultError: ({ title, description, primaryAction, secondaryAction, children, mih, }: SdResultProps) => react_jsx_runtime.JSX.Element;
1066
+
1067
+ /** 헤더 변형 선택자 — SdHeader의 네임스페이스 키와 1:1로 대응한다. */
1068
+ type HeaderVariant = 'mega' | 'simple';
1069
+ declare function MainLayout({ children, navItems, companyInfo, loginFlag, headerVariant, }: {
835
1070
  children: React.ReactNode;
836
1071
  navItems: NavItem[];
837
1072
  companyInfo: CompanyInfo;
1073
+ loginFlag?: boolean;
1074
+ /** 기본 `mega` — hover 시 헤더가 확장되는 메가 메뉴. `simple`은 바 높이 고정 + 개별 드롭다운. */
1075
+ headerVariant?: HeaderVariant;
838
1076
  }): react_jsx_runtime.JSX.Element;
839
1077
 
840
1078
  interface PageHeroBaseProps {
@@ -853,15 +1091,19 @@ declare function Plain({ children }: {
853
1091
  declare function Image({ image, label, title, description, children }: WithImageProps): react_jsx_runtime.JSX.Element;
854
1092
  declare function Brand({ label, title, description, children }: PageHeroBaseProps): react_jsx_runtime.JSX.Element;
855
1093
  declare const PageLayout: {
856
- /** 이미지 배경 + 대각선 그라디언트 + 좌하단 텍스트 */
1094
+ /** 사진 배경 + 하단 스크림 + 좌측 정렬 텍스트 */
857
1095
  Image: typeof Image;
858
1096
  /** SdTextBox.Section 타이틀 + Plain 컨테이너 */
859
1097
  Minimal: typeof Minimal;
860
- /** primary 그라디언트 배경 + 중앙 텍스트 */
1098
+ /** slate 바탕 + primary 라이트 + 도트 텍스처 */
861
1099
  Brand: typeof Brand;
862
1100
  /** 히어로 없이 SdContainer + py="xl" 만 */
863
1101
  Plain: typeof Plain;
864
1102
  };
1103
+ declare const PageLayoutImage: typeof Image;
1104
+ declare const PageLayoutMinimal: typeof Minimal;
1105
+ declare const PageLayoutBrand: typeof Brand;
1106
+ declare const PageLayoutPlain: typeof Plain;
865
1107
 
866
1108
  declare const theme: {
867
1109
  focusRing?: "auto" | "always" | "never" | undefined;
@@ -1011,4 +1253,4 @@ declare const theme: {
1011
1253
  } | undefined;
1012
1254
  };
1013
1255
 
1014
- export { HeroCarousel, Logo, MainLayout, type NavItem, PageLayout, SdBadge, SdBadgeDefault, SdBadgePrimary, SdBadgeSuccess, SdBadgeWarning, SdButton, SdButtonCancel, SdButtonDelete, SdButtonDownload, SdButtonExcel, SdButtonGhost, SdButtonOutline, SdButtonPrimary, SdButtonSecondary, SdButtonSubmit, SdButtonWhite, SdClients, SdClientsGrid, SdClientsMarquee, SdContainer, SdCta, SdCtaBanner, SdCtaInline, SdCtaSubtle, SdErrorView, SdErrorViewNotFound, SdErrorViewPage, SdFaq, SdFaqDefault, SdFaqFilled, SdFaqWithHeader, SdFeatureSection, SdFeatures, SdFooter, SdHeader, SdInput, SdInputEmail, SdInputPassword, SdInputSelect, SdInputText, SdInputTextarea, SdLink, SdLinkBody, SdLinkHint, SdLinkStrong, SdLinkSub, SdMap, SdMapSingle, SdMapTabs, SdModal, SdNumberIcon, SdPricingCard, SdPricingCardDefault, SdPricingCardFeatured, SdPricingCardGrid, SdQuote, SdQuoteCard, SdQuotePlain, SdSkeleton, SdSkeletonAvatar, SdSkeletonCard, SdSkeletonImage, SdSkeletonText, SdSkeletonTitle, SdSolution, SdSolutionCard, SdSolutionCardGrid, SdSolutionCardItem, SdSolutionFiltered, SdSolutionList, SdSteps, SdStepsBubble, SdStepsCard, SdStepsSection, SdStepsStrip, SdTable, SdTableSpec, SdTabs, SdTabsOutline, SdTabsPills, SdTabsUnderline, SdTestimonial, SdTestimonialCard, SdTestimonialGrid, SdTestimonialStrip, SdText, SdTextBody, SdTextBox, SdTextBoxCard, SdTextBoxHero, SdTextBoxSection, SdTextBoxSub, SdTextError, SdTextEyebrow, SdTextHint, SdTextNumeric, SdTextStrong, SdTextSub, SdTimeline, SdTimelineSection, SdTitle, SdTitleCard, SdTitleDisplay, SdTitleSection, SdTitleSub, theme };
1256
+ export { type HeaderVariant, HeroCarousel, Logo, MainLayout, type NavItem, PageLayout, PageLayoutBrand, PageLayoutImage, PageLayoutMinimal, PageLayoutPlain, SdBadge, SdBadgeDefault, SdBadgePrimary, SdBadgeSuccess, SdBadgeWarning, SdButton, SdButtonCancel, SdButtonDelete, SdButtonDownload, SdButtonExcel, SdButtonGhost, SdButtonOutline, SdButtonPrimary, SdButtonSecondary, SdButtonSubmit, SdButtonWhite, SdClients, SdClientsGrid, SdClientsMarquee, SdContainer, SdCta, SdCtaBanner, SdCtaInline, SdCtaSubtle, SdErrorView, SdErrorViewNotFound, SdErrorViewPage, SdFaq, SdFaqDefault, SdFaqFilled, SdFaqWithHeader, SdFeatureSection, SdFeatures, SdFooter, SdHeader, SdHeaderMega, SdHeaderSimple, SdInput, SdInputAutocomplete, SdInputCheckbox, SdInputColor, SdInputDate, SdInputDateRange, SdInputEmail, SdInputFile, SdInputJson, SdInputMultiSelect, SdInputNativeSelect, SdInputNumber, SdInputPassword, SdInputPinCode, SdInputRadioGroup, SdInputRating, SdInputSegmented, SdInputSelect, SdInputSlider, SdInputSwitch, SdInputTags, SdInputText, SdInputTextarea, SdInputTime, SdLink, SdLinkBody, SdLinkHint, SdLinkStrong, SdLinkSub, SdLoginView, SdLoginViewCard, SdLoginViewSplit, SdMap, SdMapSingle, SdMapTabs, SdModal, SdNumberIcon, SdPricingCard, SdPricingCardDefault, SdPricingCardFeatured, SdPricingCardGrid, SdQuote, SdQuoteCard, SdQuotePlain, SdResult, SdResultError, SdResultSuccess, SdSkeleton, SdSkeletonAvatar, SdSkeletonCard, SdSkeletonImage, SdSkeletonText, SdSkeletonTitle, SdSolution, SdSolutionCard, SdSolutionCardGrid, SdSolutionCardItem, SdSolutionFiltered, SdSolutionList, SdSteps, SdStepsBubble, SdStepsCard, SdStepsSection, SdStepsStrip, SdTable, SdTableSpec, SdTabs, SdTabsOutline, SdTabsPills, SdTabsUnderline, SdTestimonial, SdTestimonialCard, SdTestimonialGrid, SdTestimonialStrip, SdText, SdTextBody, SdTextBox, SdTextBoxCard, SdTextBoxHero, SdTextBoxSection, SdTextBoxSub, SdTextError, SdTextEyebrow, SdTextHint, SdTextNumeric, SdTextStrong, SdTextSub, SdTimeline, SdTimelineSection, SdTitle, SdTitleCard, SdTitleDisplay, SdTitleSection, SdTitleSub, SdToast, SdToastClean, SdToastError, SdToastHide, SdToastInfo, SdToastLoading, SdToastProvider, SdToastSuccess, SdToastUpdate, SdToastWarning, theme };