@mondrianai/runyourai-design-system 0.0.13 → 0.0.14

package/dist/index.d.mts

@@ -712,6 +712,8 @@ type SidebarMainMenuItem = {
     type?: 'item';
     id: string;
     title: string;
+    /** 서브메뉴 패널 헤더 영역을 커스텀할 ReactNode. 미지정 시 title 문자열을 기본 스타일로 표시합니다. */
+    panelHeader?: React$1.ReactNode;
     href: string;
     icon: React$1.ReactNode;
     isActive?: boolean;
@@ -796,13 +798,17 @@ interface TabsProps<T extends string = string> {
      * "pill"      — 회색 배경 컨테이너 + 흰 배경 active (segment control 스타일)
      * "underline" — 하단 밑줄 active (default)
      */
-    variant?: 'pill' | 'underline';
+    variant?: "pill" | "underline";
     /** 컨테이너를 w-full로 펼치고 각 탭 버튼을 균등 분할(flex-1)합니다 */
     block?: boolean;
     /** Tailwind height 클래스 (e.g. "h-[36px]"). 지정 시 내부 버튼 패딩도 자동 조정됩니다. */
     height?: string;
     className?: string;
 }
+/**
+ * 디자인 시스템에서는 동일 뷰의 데이터 전환을 위해 ToggleGroup 대신 Tabs를 사용합니다.
+ * Tabs의 원래 목적으로도 사용하며, 한 화면에 두 가지의 의미로 Tabs를 사용하지 않습니다.
+ */
 declare function Tabs<T extends string = string>({ allTabs, current, onTabChange, variant, block, height, className, }: TabsProps<T>): react_jsx_runtime.JSX.Element;
 
 interface ToggleProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, 'onClick'> {

package/dist/index.d.ts

@@ -712,6 +712,8 @@ type SidebarMainMenuItem = {
     type?: 'item';
     id: string;
     title: string;
+    /** 서브메뉴 패널 헤더 영역을 커스텀할 ReactNode. 미지정 시 title 문자열을 기본 스타일로 표시합니다. */
+    panelHeader?: React$1.ReactNode;
     href: string;
     icon: React$1.ReactNode;
     isActive?: boolean;
@@ -796,13 +798,17 @@ interface TabsProps<T extends string = string> {
      * "pill"      — 회색 배경 컨테이너 + 흰 배경 active (segment control 스타일)
      * "underline" — 하단 밑줄 active (default)
      */
-    variant?: 'pill' | 'underline';
+    variant?: "pill" | "underline";
     /** 컨테이너를 w-full로 펼치고 각 탭 버튼을 균등 분할(flex-1)합니다 */
     block?: boolean;
     /** Tailwind height 클래스 (e.g. "h-[36px]"). 지정 시 내부 버튼 패딩도 자동 조정됩니다. */
     height?: string;
     className?: string;
 }
+/**
+ * 디자인 시스템에서는 동일 뷰의 데이터 전환을 위해 ToggleGroup 대신 Tabs를 사용합니다.
+ * Tabs의 원래 목적으로도 사용하며, 한 화면에 두 가지의 의미로 Tabs를 사용하지 않습니다.
+ */
 declare function Tabs<T extends string = string>({ allTabs, current, onTabChange, variant, block, height, className, }: TabsProps<T>): react_jsx_runtime.JSX.Element;
 
 interface ToggleProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, 'onClick'> {

package/dist/index.js

@@ -4985,7 +4985,7 @@ function Sidebar({
   className,
   LinkComponent
 }) {
-  var _a;
+  var _a, _b, _c;
   const [isPanelOpen, setIsPanelOpen] = React22.useState(true);
   const activeMenu = React22.useMemo(
     () => {
@@ -5068,7 +5068,7 @@ function Sidebar({
                 }
               ) }),
               /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "flex flex-col flex-1 items-center justify-end min-h-0 min-w-0 px-4 py-3 gap-3 w-full", children: utilities == null ? void 0 : utilities.map((util) => {
-                var _a2, _b;
+                var _a2, _b2;
                 if (util.popover) {
                   return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(React22.Fragment, { children: util.popover }, util.id);
                 }
@@ -5113,7 +5113,7 @@ function Sidebar({
                       }
                     )
                   },
-                  (_b = util.id) != null ? _b : util.label
+                  (_b2 = util.id) != null ? _b2 : util.label
                 );
               }) }),
               /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "flex items-center justify-center pt-3 pb-5 shrink-0 w-full", children: avatar })
@@ -5134,7 +5134,7 @@ function Sidebar({
                   className: "flex items-center justify-between pl-2 pr-0.5 py-2 w-full",
                   style: { height: "36px" },
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "flex items-center gap-1.5 min-w-0", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "text-sm font-semibold leading-5 text-foreground tracking-tight truncate", children: (activeMenu == null ? void 0 : activeMenu.title) || "-" }) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "flex items-center gap-1.5 min-w-0", children: (_c = activeMenu == null ? void 0 : activeMenu.panelHeader) != null ? _c : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "text-sm font-semibold leading-5 text-foreground tracking-tight truncate", children: (_b = activeMenu == null ? void 0 : activeMenu.title) != null ? _b : "-" }) }),
                     /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
                       "button",
                       {