@yeongseoksong/framework 1.6.1 → 1.6.2

package/dist/ui/index.cjs

@@ -219,7 +219,6 @@ __export(ui_exports, {
 module.exports = __toCommonJS(ui_exports);
 
 // ui/atom/Logo.tsx
-var import_image = __toESM(require("next/image"));
 var import_link = __toESM(require("next/link"));
 var import_core = require("@mantine/core");
 
@@ -237,21 +236,7 @@ function Logo(_props) {
   const { size } = (0, import_core.useProps)("Logo", { size: "md" }, _props);
   const theme2 = (0, import_core.useMantineTheme)();
   const resolved = theme2.other.logoSizes[size];
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_link.default, { href: "/", style: { display: "inline-flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_image.default,
-    {
-      src: LOGO_SRC,
-      alt: LOGO_ALT,
-      width: resolved.width,
-      height: resolved.height,
-      style: {
-        width: (0, import_core.rem)(resolved.width),
-        height: "auto",
-        objectFit: "contain"
-      },
-      priority: true
-    }
-  ) });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_link.default, { href: "/", style: { display: "inline-flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Image, { src: LOGO_SRC, alt: LOGO_ALT, w: (0, import_core.rem)(resolved.width), h: "auto", fit: "contain", fetchPriority: "high" }) });
 }
 
 // ui/atom/Tabs.tsx
@@ -1856,7 +1841,7 @@ function MobileNav({ opened, close, topItems, childrenOf, loginFlag }) {
     loginFlag && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core29.Stack, { gap: "xs", mt: "md", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(SdButton.Primary, { size: "xs", children: "\uB85C\uADF8\uC778" }) })
   ] }) });
 }
-function MegaHeader({ navItems, loginFlag }) {
+function MegaHeader({ navItems, loginFlag, logoSize }) {
   const [opened, { toggle, close }] = (0, import_hooks.useDisclosure)();
   const { topItems, childrenOf, hasAnyChildren } = useNavTree(navItems);
   const { hovered, ref: hoverRef } = (0, import_hooks.useHover)();
@@ -1876,7 +1861,7 @@ function MegaHeader({ navItems, loginFlag }) {
           transition: "box-shadow 0.15s"
         },
         children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(SdContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_core29.Group, { justify: "space-between", align: "flex-start", wrap: "nowrap", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core29.Group, { h: BAR_HEIGHT, align: "center", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Logo, {}) }),
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core29.Group, { h: BAR_HEIGHT, align: "center", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Logo, { size: logoSize }) }),
           /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core29.Group, { gap: "xl", align: "flex-start", wrap: "nowrap", visibleFrom: "sm", children: topItems.map((item) => {
             const kids = childrenOf(item.id);
             return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_core29.Stack, { gap: 0, align: "center", children: [
@@ -1935,12 +1920,12 @@ function MegaHeader({ navItems, loginFlag }) {
 function renderMenuLeaf(item) {
   return item.href ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core29.Menu.Item, { component: "a", href: item.href, children: item.label }, item.id) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core29.Menu.Label, { children: item.label }, item.id);
 }
-function SimpleHeader({ navItems, loginFlag }) {
+function SimpleHeader({ navItems, loginFlag, logoSize }) {
   const [opened, { toggle, close }] = (0, import_hooks.useDisclosure)();
   const { topItems, childrenOf } = useNavTree(navItems);
   return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_jsx_runtime32.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core29.Box, { bg: "var(--mantine-color-body)", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(SdContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_core29.Group, { h: BAR_HEIGHT, justify: "space-between", align: "center", wrap: "nowrap", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Logo, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Logo, { size: logoSize }),
       /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core29.Group, { gap: "xl", align: "center", wrap: "nowrap", visibleFrom: "sm", children: topItems.map((item) => {
         const kids = childrenOf(item.id);
         if (kids.length === 0) {
@@ -2001,12 +1986,12 @@ function SimpleHeader({ navItems, loginFlag }) {
     )
   ] });
 }
-function PanelHeader({ navItems, loginFlag }) {
+function PanelHeader({ navItems, loginFlag, logoSize }) {
   const [opened, { toggle, close }] = (0, import_hooks.useDisclosure)();
   const { topItems, childrenOf } = useNavTree(navItems);
   return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_jsx_runtime32.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core29.Box, { bg: "var(--mantine-color-body)", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(SdContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_core29.Group, { h: BAR_HEIGHT, justify: "space-between", align: "center", wrap: "nowrap", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Logo, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Logo, { size: logoSize }),
       /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core29.Group, { gap: "xl", align: "center", wrap: "nowrap", visibleFrom: "sm", children: topItems.map((item) => {
         const kids = childrenOf(item.id);
         if (kids.length === 0) {
@@ -2132,11 +2117,11 @@ function FooterCompanyInfo({ company }) {
     /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(InfoCell, { label: "Email", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(SdLink.Sub, { href: `mailto:${company.email}`, children: company.email }) })
   ] });
 }
-function SdFooter({ company, navItems, policyLinks, description }) {
+function SdFooter({ company, navItems, policyLinks, description, logoSize = "sm" }) {
   const visibleNav = filterAndSort(navItems);
   const visiblePolicy = filterAndSort(policyLinks);
   return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core30.Box, { component: "footer", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(SdContainer, { py: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_core30.Stack, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Logo, { size: "sm" }),
+    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Logo, { size: logoSize }),
     description && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(SdText.Sub, { children: description }),
     /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_core30.Flex, { direction: { base: "column", md: "row" }, gap: 48, align: "flex-start", children: [
       /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core30.Box, { flex: { base: "0 0 auto", md: "1 1 0" }, w: { base: "100%", md: "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(FooterCompanyInfo, { company }) }),
@@ -2413,9 +2398,13 @@ function LoginForm({
     children
   ] }) });
 }
-function FormHeader({ title, description }) {
+function FormHeader({
+  title,
+  description,
+  logoSize = "sm"
+}) {
   return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_core35.Stack, { gap: "lg", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Logo, { size: "sm" }),
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Logo, { size: logoSize }),
     /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(SdTextBox.Card, { title, description: description != null ? description : "" })
   ] });
 }
@@ -2423,14 +2412,16 @@ function Card7(_a4) {
   var _b = _a4, {
     title = "\uB85C\uADF8\uC778",
     description = "%c \uC11C\uBE44\uC2A4\uB97C \uC774\uC6A9\uD558\uB824\uBA74 \uB85C\uADF8\uC778\uD574 \uC8FC\uC138\uC694.",
-    mih = "100svh"
+    mih = "100svh",
+    logoSize
   } = _b, formProps = __objRest(_b, [
     "title",
     "description",
-    "mih"
+    "mih",
+    "logoSize"
   ]);
   return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core35.Center, { mih, bg: "slate.0", p: "md", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core35.Paper, { w: "100%", maw: 420, p: { base: "lg", sm: "xl" }, radius: "lg", withBorder: true, shadow: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_core35.Stack, { gap: "xl", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(FormHeader, { title, description }),
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(FormHeader, { title, description, logoSize }),
     /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(LoginForm, __spreadValues({}, formProps))
   ] }) }) });
 }
@@ -2440,13 +2431,15 @@ function Split(_a4) {
     description = "\uACC4\uC815 \uC815\uBCF4\uB97C \uC785\uB825\uD574 \uC8FC\uC138\uC694.",
     brandTitle = "%c",
     brandDescription = "\uD558\uB098\uC758 \uACC4\uC815\uC73C\uB85C \uBAA8\uB4E0 \uC11C\uBE44\uC2A4\uB97C \uC774\uC6A9\uD558\uC138\uC694.",
-    mih = "100svh"
+    mih = "100svh",
+    logoSize
   } = _b, formProps = __objRest(_b, [
     "title",
     "description",
     "brandTitle",
     "brandDescription",
-    "mih"
+    "mih",
+    "logoSize"
   ]);
   return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_core35.SimpleGrid, { cols: { base: 1, md: 2 }, spacing: 0, mih, children: [
     /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
@@ -2472,7 +2465,7 @@ function Split(_a4) {
       }
     ),
     /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core35.Center, { p: { base: "md", sm: "xl" }, bg: "white", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_core35.Stack, { gap: "xl", w: "100%", maw: 400, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(FormHeader, { title, description }),
+      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(FormHeader, { title, description, logoSize }),
       /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(LoginForm, __spreadValues({}, formProps))
     ] }) })
   ] });
@@ -2546,13 +2539,15 @@ function MainLayout({
   navItems,
   companyInfo,
   loginFlag,
-  headerVariant = "mega"
+  headerVariant = "mega",
+  headerLogoSize,
+  footerLogoSize
 }) {
   const Header = headers[headerVariant];
   return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_core37.AppShell, { header: { height: 60 }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core37.AppShell.Header, { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Header, { navItems, loginFlag }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core37.AppShell.Header, { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Header, { navItems, loginFlag, logoSize: headerLogoSize }) }),
     /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core37.AppShell.Main, { children }),
-    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SdFooter, { company: companyInfo, navItems })
+    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SdFooter, { company: companyInfo, navItems, logoSize: footerLogoSize })
   ] });
 }
 
@@ -2895,11 +2890,11 @@ var theme = (0, import_core39.createTheme)({
   },
   other: {
     logoSizes: {
-      xs: { width: 72, height: 22 },
-      sm: { width: 96, height: 29 },
-      md: { width: 120, height: 36 },
-      lg: { width: 160, height: 48 },
-      xl: { width: 200, height: 60 }
+      xs: { width: 72 },
+      sm: { width: 96 },
+      md: { width: 120 },
+      lg: { width: 160 },
+      xl: { width: 200 }
     },
     surfaceSubtle: "#f8fafc",
     surfaceDark: "#0f172a",

package/dist/ui/index.d.mts

@@ -930,25 +930,27 @@ declare function HeroCarousel({ slides, children }: HeroCarouselProps): react_js
 interface HeaderProps {
     navItems: NavItem[];
     loginFlag?: boolean;
+    /** 로고 크기. 미지정 시 Logo의 theme 기본값(`md`)을 그대로 따른다. */
+    logoSize?: MantineSize;
 }
 /**
  * Mega 변형(기본) — 헤더 전체가 아래로 확장되며 하위 링크가 상위 항목 아래 컬럼으로
  * 한꺼번에 노출되는 메가 메뉴.
  */
-declare function MegaHeader({ navItems, loginFlag }: HeaderProps): react_jsx_runtime.JSX.Element;
+declare function MegaHeader({ navItems, loginFlag, logoSize }: HeaderProps): react_jsx_runtime.JSX.Element;
 /**
  * Simple 변형 — 헤더 바 높이는 고정이고, 자식을 가진 상위 항목마다
  * Mantine `Menu`가 하나씩 붙어 개별 드롭다운으로 열린다.
  * 바가 자라지 않으므로 AppShell.Header 높이를 그대로 쓰는 레이아웃에 적합하다.
  */
-declare function SimpleHeader({ navItems, loginFlag }: HeaderProps): react_jsx_runtime.JSX.Element;
+declare function SimpleHeader({ navItems, loginFlag, logoSize }: HeaderProps): react_jsx_runtime.JSX.Element;
 /**
  * Panel 변형 — Simple처럼 바 높이는 60px로 고정하고 상위 항목마다 Mantine `Menu`가 붙지만,
  * 드롭다운 내부는 Mega와 동일한 그룹 레이아웃으로 편다: 손자가 없는 자식은 단일 링크,
  * 손자가 있는 자식은 그룹 제목(`SdLink.Body`) 아래로 손자를 `SdLink.Sub`로 얹는다.
  * Simple의 개별 드롭다운 안정성 + Mega의 풍부한 그룹 구성이 함께 필요할 때 쓴다.
  */
-declare function PanelHeader({ navItems, loginFlag }: HeaderProps): react_jsx_runtime.JSX.Element;
+declare function PanelHeader({ navItems, loginFlag, logoSize }: HeaderProps): react_jsx_runtime.JSX.Element;
 declare const SdHeader: typeof MegaHeader & {
     Mega: typeof MegaHeader;
     Simple: typeof SimpleHeader;
@@ -963,8 +965,10 @@ interface SdFooterProps {
     navItems?: NavItem[];
     policyLinks?: NavItem[];
     description?: string;
+    /** 로고 크기. 기본 `sm`. */
+    logoSize?: MantineSize;
 }
-declare function SdFooter({ company, navItems, policyLinks, description }: SdFooterProps): react_jsx_runtime.JSX.Element;
+declare function SdFooter({ company, navItems, policyLinks, description, logoSize }: SdFooterProps): react_jsx_runtime.JSX.Element;
 
 interface SdFeatureSectionProps extends Omit<BoxProps, 'title'> {
     label?: string;
@@ -1052,13 +1056,15 @@ interface SdLoginViewProps {
     children?: ReactNode;
     /** 화면 최소 높이. 카탈로그처럼 좁은 프레임에 담을 때 줄인다. */
     mih?: string | number;
+    /** 로고 크기. 기본 `sm`. */
+    logoSize?: MantineSize;
 }
-declare function Card({ title, description, mih, ...formProps }: SdLoginViewProps): react_jsx_runtime.JSX.Element;
+declare function Card({ title, description, mih, logoSize, ...formProps }: SdLoginViewProps): react_jsx_runtime.JSX.Element;
 interface SdLoginSplitProps extends SdLoginViewProps {
     brandTitle?: ReactNode;
     brandDescription?: ReactNode;
 }
-declare function Split({ title, description, brandTitle, brandDescription, mih, ...formProps }: SdLoginSplitProps): react_jsx_runtime.JSX.Element;
+declare function Split({ title, description, brandTitle, brandDescription, mih, logoSize, ...formProps }: SdLoginSplitProps): react_jsx_runtime.JSX.Element;
 declare const SdLoginView: {
     /** 중앙 정렬 카드 — 기본 로그인 화면 */
     Card: typeof Card;
@@ -1096,13 +1102,16 @@ declare const SdResultError: ({ title, description, primaryAction, secondaryActi
 
 /** 헤더 변형 선택자 — SdHeader의 네임스페이스 키와 1:1로 대응한다. */
 type HeaderVariant = 'mega' | 'simple' | 'panel';
-declare function MainLayout({ children, navItems, companyInfo, loginFlag, headerVariant, }: {
+declare function MainLayout({ children, navItems, companyInfo, loginFlag, headerVariant, headerLogoSize, footerLogoSize, }: {
     children: React.ReactNode;
     navItems: NavItem[];
     companyInfo: CompanyInfo;
     loginFlag?: boolean;
     /** 기본 `mega` — hover 시 헤더가 확장되는 메가 메뉴. `simple`은 바 높이 고정 + 개별 드롭다운. `panel`은 바 높이 고정 + 드롭다운 내부를 Mega식 그룹 컬럼으로. */
     headerVariant?: HeaderVariant;
+    /** 헤더 로고 크기. 미지정 시 Logo의 theme 기본값(`md`)을 그대로 따른다. */
+    headerLogoSize?: MantineSize;
+    footerLogoSize?: MantineSize;
 }): react_jsx_runtime.JSX.Element;
 
 /**

package/dist/ui/index.d.ts

@@ -930,25 +930,27 @@ declare function HeroCarousel({ slides, children }: HeroCarouselProps): react_js
 interface HeaderProps {
     navItems: NavItem[];
     loginFlag?: boolean;
+    /** 로고 크기. 미지정 시 Logo의 theme 기본값(`md`)을 그대로 따른다. */
+    logoSize?: MantineSize;
 }
 /**
  * Mega 변형(기본) — 헤더 전체가 아래로 확장되며 하위 링크가 상위 항목 아래 컬럼으로
  * 한꺼번에 노출되는 메가 메뉴.
  */
-declare function MegaHeader({ navItems, loginFlag }: HeaderProps): react_jsx_runtime.JSX.Element;
+declare function MegaHeader({ navItems, loginFlag, logoSize }: HeaderProps): react_jsx_runtime.JSX.Element;
 /**
  * Simple 변형 — 헤더 바 높이는 고정이고, 자식을 가진 상위 항목마다
  * Mantine `Menu`가 하나씩 붙어 개별 드롭다운으로 열린다.
  * 바가 자라지 않으므로 AppShell.Header 높이를 그대로 쓰는 레이아웃에 적합하다.
  */
-declare function SimpleHeader({ navItems, loginFlag }: HeaderProps): react_jsx_runtime.JSX.Element;
+declare function SimpleHeader({ navItems, loginFlag, logoSize }: HeaderProps): react_jsx_runtime.JSX.Element;
 /**
  * Panel 변형 — Simple처럼 바 높이는 60px로 고정하고 상위 항목마다 Mantine `Menu`가 붙지만,
  * 드롭다운 내부는 Mega와 동일한 그룹 레이아웃으로 편다: 손자가 없는 자식은 단일 링크,
  * 손자가 있는 자식은 그룹 제목(`SdLink.Body`) 아래로 손자를 `SdLink.Sub`로 얹는다.
  * Simple의 개별 드롭다운 안정성 + Mega의 풍부한 그룹 구성이 함께 필요할 때 쓴다.
  */
-declare function PanelHeader({ navItems, loginFlag }: HeaderProps): react_jsx_runtime.JSX.Element;
+declare function PanelHeader({ navItems, loginFlag, logoSize }: HeaderProps): react_jsx_runtime.JSX.Element;
 declare const SdHeader: typeof MegaHeader & {
     Mega: typeof MegaHeader;
     Simple: typeof SimpleHeader;
@@ -963,8 +965,10 @@ interface SdFooterProps {
     navItems?: NavItem[];
     policyLinks?: NavItem[];
     description?: string;
+    /** 로고 크기. 기본 `sm`. */
+    logoSize?: MantineSize;
 }
-declare function SdFooter({ company, navItems, policyLinks, description }: SdFooterProps): react_jsx_runtime.JSX.Element;
+declare function SdFooter({ company, navItems, policyLinks, description, logoSize }: SdFooterProps): react_jsx_runtime.JSX.Element;
 
 interface SdFeatureSectionProps extends Omit<BoxProps, 'title'> {
     label?: string;
@@ -1052,13 +1056,15 @@ interface SdLoginViewProps {
     children?: ReactNode;
     /** 화면 최소 높이. 카탈로그처럼 좁은 프레임에 담을 때 줄인다. */
     mih?: string | number;
+    /** 로고 크기. 기본 `sm`. */
+    logoSize?: MantineSize;
 }
-declare function Card({ title, description, mih, ...formProps }: SdLoginViewProps): react_jsx_runtime.JSX.Element;
+declare function Card({ title, description, mih, logoSize, ...formProps }: SdLoginViewProps): react_jsx_runtime.JSX.Element;
 interface SdLoginSplitProps extends SdLoginViewProps {
     brandTitle?: ReactNode;
     brandDescription?: ReactNode;
 }
-declare function Split({ title, description, brandTitle, brandDescription, mih, ...formProps }: SdLoginSplitProps): react_jsx_runtime.JSX.Element;
+declare function Split({ title, description, brandTitle, brandDescription, mih, logoSize, ...formProps }: SdLoginSplitProps): react_jsx_runtime.JSX.Element;
 declare const SdLoginView: {
     /** 중앙 정렬 카드 — 기본 로그인 화면 */
     Card: typeof Card;
@@ -1096,13 +1102,16 @@ declare const SdResultError: ({ title, description, primaryAction, secondaryActi
 
 /** 헤더 변형 선택자 — SdHeader의 네임스페이스 키와 1:1로 대응한다. */
 type HeaderVariant = 'mega' | 'simple' | 'panel';
-declare function MainLayout({ children, navItems, companyInfo, loginFlag, headerVariant, }: {
+declare function MainLayout({ children, navItems, companyInfo, loginFlag, headerVariant, headerLogoSize, footerLogoSize, }: {
     children: React.ReactNode;
     navItems: NavItem[];
     companyInfo: CompanyInfo;
     loginFlag?: boolean;
     /** 기본 `mega` — hover 시 헤더가 확장되는 메가 메뉴. `simple`은 바 높이 고정 + 개별 드롭다운. `panel`은 바 높이 고정 + 드롭다운 내부를 Mega식 그룹 컬럼으로. */
     headerVariant?: HeaderVariant;
+    /** 헤더 로고 크기. 미지정 시 Logo의 theme 기본값(`md`)을 그대로 따른다. */
+    headerLogoSize?: MantineSize;
+    footerLogoSize?: MantineSize;
 }): react_jsx_runtime.JSX.Element;
 
 /**

package/dist/ui/index.mjs

@@ -32,9 +32,8 @@ var __objRest = (source, exclude) => {
 };
 
 // ui/atom/Logo.tsx
-import Image from "next/image";
 import Link from "next/link";
-import { rem, useProps, useMantineTheme } from "@mantine/core";
+import { Image, rem, useProps, useMantineTheme } from "@mantine/core";
 
 // util/env.util.ts
 var _a;
@@ -50,21 +49,7 @@ function Logo(_props) {
   const { size } = useProps("Logo", { size: "md" }, _props);
   const theme2 = useMantineTheme();
   const resolved = theme2.other.logoSizes[size];
-  return /* @__PURE__ */ jsx(Link, { href: "/", style: { display: "inline-flex", alignItems: "center" }, children: /* @__PURE__ */ jsx(
-    Image,
-    {
-      src: LOGO_SRC,
-      alt: LOGO_ALT,
-      width: resolved.width,
-      height: resolved.height,
-      style: {
-        width: rem(resolved.width),
-        height: "auto",
-        objectFit: "contain"
-      },
-      priority: true
-    }
-  ) });
+  return /* @__PURE__ */ jsx(Link, { href: "/", style: { display: "inline-flex", alignItems: "center" }, children: /* @__PURE__ */ jsx(Image, { src: LOGO_SRC, alt: LOGO_ALT, w: rem(resolved.width), h: "auto", fit: "contain", fetchPriority: "high" }) });
 }
 
 // ui/atom/Tabs.tsx
@@ -1711,7 +1696,7 @@ function MobileNav({ opened, close, topItems, childrenOf, loginFlag }) {
     loginFlag && /* @__PURE__ */ jsx31(Stack16, { gap: "xs", mt: "md", children: /* @__PURE__ */ jsx31(SdButton.Primary, { size: "xs", children: "\uB85C\uADF8\uC778" }) })
   ] }) });
 }
-function MegaHeader({ navItems, loginFlag }) {
+function MegaHeader({ navItems, loginFlag, logoSize }) {
   const [opened, { toggle, close }] = useDisclosure();
   const { topItems, childrenOf, hasAnyChildren } = useNavTree(navItems);
   const { hovered, ref: hoverRef } = useHover();
@@ -1731,7 +1716,7 @@ function MegaHeader({ navItems, loginFlag }) {
           transition: "box-shadow 0.15s"
         },
         children: /* @__PURE__ */ jsx31(SdContainer, { children: /* @__PURE__ */ jsxs17(Group10, { justify: "space-between", align: "flex-start", wrap: "nowrap", children: [
-          /* @__PURE__ */ jsx31(Group10, { h: BAR_HEIGHT, align: "center", children: /* @__PURE__ */ jsx31(Logo, {}) }),
+          /* @__PURE__ */ jsx31(Group10, { h: BAR_HEIGHT, align: "center", children: /* @__PURE__ */ jsx31(Logo, { size: logoSize }) }),
           /* @__PURE__ */ jsx31(Group10, { gap: "xl", align: "flex-start", wrap: "nowrap", visibleFrom: "sm", children: topItems.map((item) => {
             const kids = childrenOf(item.id);
             return /* @__PURE__ */ jsxs17(Stack16, { gap: 0, align: "center", children: [
@@ -1790,12 +1775,12 @@ function MegaHeader({ navItems, loginFlag }) {
 function renderMenuLeaf(item) {
   return item.href ? /* @__PURE__ */ jsx31(Menu.Item, { component: "a", href: item.href, children: item.label }, item.id) : /* @__PURE__ */ jsx31(Menu.Label, { children: item.label }, item.id);
 }
-function SimpleHeader({ navItems, loginFlag }) {
+function SimpleHeader({ navItems, loginFlag, logoSize }) {
   const [opened, { toggle, close }] = useDisclosure();
   const { topItems, childrenOf } = useNavTree(navItems);
   return /* @__PURE__ */ jsxs17(Fragment4, { children: [
     /* @__PURE__ */ jsx31(Box13, { bg: "var(--mantine-color-body)", children: /* @__PURE__ */ jsx31(SdContainer, { children: /* @__PURE__ */ jsxs17(Group10, { h: BAR_HEIGHT, justify: "space-between", align: "center", wrap: "nowrap", children: [
-      /* @__PURE__ */ jsx31(Logo, {}),
+      /* @__PURE__ */ jsx31(Logo, { size: logoSize }),
       /* @__PURE__ */ jsx31(Group10, { gap: "xl", align: "center", wrap: "nowrap", visibleFrom: "sm", children: topItems.map((item) => {
         const kids = childrenOf(item.id);
         if (kids.length === 0) {
@@ -1856,12 +1841,12 @@ function SimpleHeader({ navItems, loginFlag }) {
     )
   ] });
 }
-function PanelHeader({ navItems, loginFlag }) {
+function PanelHeader({ navItems, loginFlag, logoSize }) {
   const [opened, { toggle, close }] = useDisclosure();
   const { topItems, childrenOf } = useNavTree(navItems);
   return /* @__PURE__ */ jsxs17(Fragment4, { children: [
     /* @__PURE__ */ jsx31(Box13, { bg: "var(--mantine-color-body)", children: /* @__PURE__ */ jsx31(SdContainer, { children: /* @__PURE__ */ jsxs17(Group10, { h: BAR_HEIGHT, justify: "space-between", align: "center", wrap: "nowrap", children: [
-      /* @__PURE__ */ jsx31(Logo, {}),
+      /* @__PURE__ */ jsx31(Logo, { size: logoSize }),
       /* @__PURE__ */ jsx31(Group10, { gap: "xl", align: "center", wrap: "nowrap", visibleFrom: "sm", children: topItems.map((item) => {
         const kids = childrenOf(item.id);
         if (kids.length === 0) {
@@ -1995,11 +1980,11 @@ function FooterCompanyInfo({ company }) {
     /* @__PURE__ */ jsx32(InfoCell, { label: "Email", children: /* @__PURE__ */ jsx32(SdLink.Sub, { href: `mailto:${company.email}`, children: company.email }) })
   ] });
 }
-function SdFooter({ company, navItems, policyLinks, description }) {
+function SdFooter({ company, navItems, policyLinks, description, logoSize = "sm" }) {
   const visibleNav = filterAndSort(navItems);
   const visiblePolicy = filterAndSort(policyLinks);
   return /* @__PURE__ */ jsx32(Box14, { component: "footer", children: /* @__PURE__ */ jsx32(SdContainer, { py: "lg", children: /* @__PURE__ */ jsxs18(Stack17, { children: [
-    /* @__PURE__ */ jsx32(Logo, { size: "sm" }),
+    /* @__PURE__ */ jsx32(Logo, { size: logoSize }),
     description && /* @__PURE__ */ jsx32(SdText.Sub, { children: description }),
     /* @__PURE__ */ jsxs18(Flex, { direction: { base: "column", md: "row" }, gap: 48, align: "flex-start", children: [
       /* @__PURE__ */ jsx32(Box14, { flex: { base: "0 0 auto", md: "1 1 0" }, w: { base: "100%", md: "auto" }, children: /* @__PURE__ */ jsx32(FooterCompanyInfo, { company }) }),
@@ -2283,9 +2268,13 @@ function LoginForm({
     children
   ] }) });
 }
-function FormHeader({ title, description }) {
+function FormHeader({
+  title,
+  description,
+  logoSize = "sm"
+}) {
   return /* @__PURE__ */ jsxs23(Stack22, { gap: "lg", children: [
-    /* @__PURE__ */ jsx37(Logo, { size: "sm" }),
+    /* @__PURE__ */ jsx37(Logo, { size: logoSize }),
     /* @__PURE__ */ jsx37(SdTextBox.Card, { title, description: description != null ? description : "" })
   ] });
 }
@@ -2293,14 +2282,16 @@ function Card7(_a4) {
   var _b = _a4, {
     title = "\uB85C\uADF8\uC778",
     description = "%c \uC11C\uBE44\uC2A4\uB97C \uC774\uC6A9\uD558\uB824\uBA74 \uB85C\uADF8\uC778\uD574 \uC8FC\uC138\uC694.",
-    mih = "100svh"
+    mih = "100svh",
+    logoSize
   } = _b, formProps = __objRest(_b, [
     "title",
     "description",
-    "mih"
+    "mih",
+    "logoSize"
   ]);
   return /* @__PURE__ */ jsx37(Center5, { mih, bg: "slate.0", p: "md", children: /* @__PURE__ */ jsx37(Paper, { w: "100%", maw: 420, p: { base: "lg", sm: "xl" }, radius: "lg", withBorder: true, shadow: "sm", children: /* @__PURE__ */ jsxs23(Stack22, { gap: "xl", children: [
-    /* @__PURE__ */ jsx37(FormHeader, { title, description }),
+    /* @__PURE__ */ jsx37(FormHeader, { title, description, logoSize }),
     /* @__PURE__ */ jsx37(LoginForm, __spreadValues({}, formProps))
   ] }) }) });
 }
@@ -2310,13 +2301,15 @@ function Split(_a4) {
     description = "\uACC4\uC815 \uC815\uBCF4\uB97C \uC785\uB825\uD574 \uC8FC\uC138\uC694.",
     brandTitle = "%c",
     brandDescription = "\uD558\uB098\uC758 \uACC4\uC815\uC73C\uB85C \uBAA8\uB4E0 \uC11C\uBE44\uC2A4\uB97C \uC774\uC6A9\uD558\uC138\uC694.",
-    mih = "100svh"
+    mih = "100svh",
+    logoSize
   } = _b, formProps = __objRest(_b, [
     "title",
     "description",
     "brandTitle",
     "brandDescription",
-    "mih"
+    "mih",
+    "logoSize"
   ]);
   return /* @__PURE__ */ jsxs23(SimpleGrid7, { cols: { base: 1, md: 2 }, spacing: 0, mih, children: [
     /* @__PURE__ */ jsxs23(
@@ -2342,7 +2335,7 @@ function Split(_a4) {
       }
     ),
     /* @__PURE__ */ jsx37(Center5, { p: { base: "md", sm: "xl" }, bg: "white", children: /* @__PURE__ */ jsxs23(Stack22, { gap: "xl", w: "100%", maw: 400, children: [
-      /* @__PURE__ */ jsx37(FormHeader, { title, description }),
+      /* @__PURE__ */ jsx37(FormHeader, { title, description, logoSize }),
       /* @__PURE__ */ jsx37(LoginForm, __spreadValues({}, formProps))
     ] }) })
   ] });
@@ -2416,13 +2409,15 @@ function MainLayout({
   navItems,
   companyInfo,
   loginFlag,
-  headerVariant = "mega"
+  headerVariant = "mega",
+  headerLogoSize,
+  footerLogoSize
 }) {
   const Header = headers[headerVariant];
   return /* @__PURE__ */ jsxs25(AppShell, { header: { height: 60 }, children: [
-    /* @__PURE__ */ jsx39(AppShell.Header, { children: /* @__PURE__ */ jsx39(Header, { navItems, loginFlag }) }),
+    /* @__PURE__ */ jsx39(AppShell.Header, { children: /* @__PURE__ */ jsx39(Header, { navItems, loginFlag, logoSize: headerLogoSize }) }),
     /* @__PURE__ */ jsx39(AppShell.Main, { children }),
-    /* @__PURE__ */ jsx39(SdFooter, { company: companyInfo, navItems })
+    /* @__PURE__ */ jsx39(SdFooter, { company: companyInfo, navItems, logoSize: footerLogoSize })
   ] });
 }
 
@@ -2765,11 +2760,11 @@ var theme = createTheme({
   },
   other: {
     logoSizes: {
-      xs: { width: 72, height: 22 },
-      sm: { width: 96, height: 29 },
-      md: { width: 120, height: 36 },
-      lg: { width: 160, height: 48 },
-      xl: { width: 200, height: 60 }
+      xs: { width: 72 },
+      sm: { width: 96 },
+      md: { width: 120 },
+      lg: { width: 160 },
+      xl: { width: 200 }
     },
     surfaceSubtle: "#f8fafc",
     surfaceDark: "#0f172a",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yeongseoksong/framework",
-  "version": "1.6.1",
+  "version": "1.6.2",
   "files": [
     "dist"
   ],