@iamfiro/design 0.3.4 → 0.3.5

package/lib/types/components/AppShell/AppShell.d.ts

@@ -14,8 +14,15 @@ export interface AppShellProps {
     variant?: 'plain' | 'inset';
     /** Width of the sidebar on wide screens. */
     sidebarWidth?: number;
-    /** Wide screens: folds the sidebar away (it slides out while the main area widens). */
+    /** inset: extra room (px) left of the sidebar's content on wide screens, for a sidebar wider than its menu. */
+    sidebarIndent?: number;
+    /** Wide screens: folds the sidebar (see sidebarCollapse for how). */
     sidebarCollapsed?: boolean;
+    /**
+     * What a folded sidebar becomes. hide: it slides out and the main area takes the room.
+     * rail: it narrows to its item icons (names come up as tooltips); header and footer content centre.
+     */
+    sidebarCollapse?: 'hide' | 'rail';
     /** Narrow screens: the sidebar becomes a drawer that you open and close. */
     mobileSidebarOpen?: boolean;
     onMobileSidebarOpenChange?: (open: boolean) => void;
@@ -35,4 +42,4 @@ export interface AppShellProps {
  * Page frame: a fixed sidebar beside a scrolling main area (and an optional panel on the right);
  * the sidebar becomes a slide-in drawer on small screens.
  */
-export declare function AppShell({ sidebar, header, children, variant, sidebarWidth, sidebarCollapsed, mobileSidebarOpen, onMobileSidebarOpenChange, aside, asideWidth, asideOpen, asideLabel, scrollKey, className, }: AppShellProps): import("react").JSX.Element;
+export declare function AppShell({ sidebar, header, children, variant, sidebarWidth, sidebarIndent, sidebarCollapsed, sidebarCollapse, mobileSidebarOpen, onMobileSidebarOpenChange, aside, asideWidth, asideOpen, asideLabel, scrollKey, className, }: AppShellProps): import("react").JSX.Element;

package/lib/types/components/Sidebar/rail.d.ts

@@ -0,0 +1,4 @@
+/** True while an AppShell has folded its sidebar into an icon rail (`sidebarCollapse="rail"`). */
+export declare const SidebarRailContext: import("react").Context<boolean>;
+/** Whether the sidebar around this component is an icon rail, for header and footer content that shrinks with it. */
+export declare const useSidebarRail: () => boolean;

package/lib/types/components/index.d.ts

@@ -32,6 +32,7 @@ export type { CodeLanguage } from './CodeBlock/highlight';
 export { Breadcrumb } from './Breadcrumb/Breadcrumb';
 export type { BreadcrumbItem, BreadcrumbProps } from './Breadcrumb/Breadcrumb';
 export { Sidebar, SidebarGroup, SidebarItem } from './Sidebar/Sidebar';
+export { useSidebarRail } from './Sidebar/rail';
 export type { SidebarGroupProps, SidebarItemProps, SidebarProps } from './Sidebar/Sidebar';
 export { AppShell } from './AppShell/AppShell';
 export type { AppShellProps } from './AppShell/AppShell';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iamfiro/design",
-  "version": "0.3.4",
+  "version": "0.3.5",
   "description": "Lumen 디자인 시스템 — React 컴포넌트 · 토큰 · 훅. 에이전트는 AGENTS.md부터 읽는다.",
   "type": "module",
   "main": "./lib/index.js",