@loword/loword-design-system 0.1.3 → 0.2.0

package/dist/components/LDLNB/LDLNB.d.ts

@@ -19,9 +19,12 @@ export interface LDLNBProps {
     handleLogout?: () => void;
     /** 데스크탑 사이드바 초기 접힘 상태 */
     defaultCollapsed?: boolean;
-    /** 데스크탑 사이드바 기본이자 최대(펼침) 너비(px). 기본 300 */
+    /**
+     * 사이드바 기본이자 최대(펼침) 너비(px).
+     * 생략하면 뷰포트에 따라 PC 400 / 태블릿 280을 쓴다.
+     */
     size?: number;
-    /** 드래그로 줄일 수 있는 최소 너비(px). 기본 240 */
+    /** 드래그로 줄일 수 있는 최소 너비(px). 기본 200 */
     minWidth?: number;
     /** 모바일 Drawer가 열리는 방향 (기본 'left') */
     drawerDirection?: 'left' | 'right';

package/dist/components/LDLNB/LDLNB.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LDLNB.d.ts","sourceRoot":"","sources":["../../../src/components/LDLNB/LDLNB.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIpD,OAAgB,EAAE,KAAK,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AAIpE,MAAM,WAAW,UAAU;IACzB,kBAAkB;IAClB,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,yBAAyB;IACzB,QAAQ,EAAE,MAAM,CAAC;IACjB,yDAAyD;IACzD,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,yDAAyD;IACzD,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,qBAAqB;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,kBAAkB;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qBAAqB;IACrB,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,iCAAiC;IACjC,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,yBAAyB;IACzB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,2CAA2C;IAC3C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qCAAqC;IACrC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qCAAqC;IACrC,eAAe,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACnC,2EAA2E;IAC3E,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAKD;;;;GAIG;AACH,QAAA,MAAM,KAAK,GAAI,yKAgBZ,UAAU,4CA2FZ,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"LDLNB.d.ts","sourceRoot":"","sources":["../../../src/components/LDLNB/LDLNB.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIpD,OAAgB,EAAE,KAAK,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AAIpE,MAAM,WAAW,UAAU;IACzB,kBAAkB;IAClB,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,yBAAyB;IACzB,QAAQ,EAAE,MAAM,CAAC;IACjB,yDAAyD;IACzD,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,yDAAyD;IACzD,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,qBAAqB;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,kBAAkB;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qBAAqB;IACrB,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,iCAAiC;IACjC,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,yBAAyB;IACzB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qCAAqC;IACrC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qCAAqC;IACrC,eAAe,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACnC,2EAA2E;IAC3E,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAWD;;;;GAIG;AACH,QAAA,MAAM,KAAK,GAAI,yKAgBZ,UAAU,4CAqGZ,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/dist/components/LDLNB/LDLNB.js

@@ -9,27 +9,42 @@ import cn from '../../utils/cn.js';
 import { isActivePath } from '../../utils/utils.js';
 // mobile: variant(max-width: calc(--size_md - 1px) = 767px)와 동일 기준
 const MOBILE_QUERY = '(max-width: 767px)';
+// tablet: variant(--size_md 768px ~ calc(--size_lg - 1px) 991px)와 동일 기준
+const TABLET_QUERY = '(min-width: 768px) and (max-width: 991px)';
+// 태블릿은 화면 자체가 좁아 PC와 같은 400px면 본문을 절반 가까이 먹는다.
+const PC_SIZE = 400;
+const TABLET_SIZE = 280;
 /**
  * 반응형 LNB. 데스크탑에서는 인라인 사이드바, 모바일(<768px)에서는 햄버거 버튼 +
  * Drawer 오버레이(기본 왼쪽, `drawerDirection`으로 조정)로 자동 전환된다.
  * 뷰포트 감지는 내부에서 처리한다.
  */
-const LDLNB = ({ items, pathname, as = Link, onNavigate, name, email, profileImage, handleLogout, defaultCollapsed = false, size = 400, minWidth = 200, drawerDirection = 'left', triggerClassName, className, children, }) => {
+const LDLNB = ({ items, pathname, as = Link, onNavigate, name, email, profileImage, handleLogout, defaultCollapsed = false, size, minWidth = 200, drawerDirection = 'left', triggerClassName, className, children, }) => {
     const [isMobile, setIsMobile] = useState(false);
+    const [isTablet, setIsTablet] = useState(false);
     const [open, setOpen] = useState(false);
     useEffect(() => {
-        const mql = window.matchMedia(MOBILE_QUERY);
-        const sync = () => setIsMobile(mql.matches);
+        const mobileMql = window.matchMedia(MOBILE_QUERY);
+        const tabletMql = window.matchMedia(TABLET_QUERY);
+        const sync = () => {
+            setIsMobile(mobileMql.matches);
+            setIsTablet(tabletMql.matches);
+        };
         sync();
-        mql.addEventListener('change', sync);
-        return () => mql.removeEventListener('change', sync);
+        mobileMql.addEventListener('change', sync);
+        tabletMql.addEventListener('change', sync);
+        return () => {
+            mobileMql.removeEventListener('change', sync);
+            tabletMql.removeEventListener('change', sync);
+        };
     }, []);
-    const nav = (isMobile) => (_jsx(LNBBase.Provider, { isMobile: isMobile, items: items, pathname: pathname, defaultCollapsed: isMobile ? false : defaultCollapsed, size: size, minWidth: minWidth, children: _jsxs(LNBBase.Root, { className: className, children: [_jsx(LNBBase.Header, { name: name, email: email, profileImage: profileImage, handleLogout: handleLogout }), isMobile && children, _jsx(LNBBase.Content, { children: items.map((group) => (_jsx(LNBBase.Group, { label: group.label, noSlider: group.noSlider, children: _jsx(LNBBase.Menu, { label: group.label, noSlider: group.noSlider, tabCount: group.tabs?.length ?? 0, children: group.tabs?.map((tab) => (_jsx(LNBBase.MenuItem, { as: as, href: tab.path, icon: tab.icon, isActive: isActivePath(pathname, tab.path), onClick: () => {
+    const resolvedSize = size ?? (isTablet ? TABLET_SIZE : PC_SIZE);
+    const nav = (isMobile) => (_jsx(LNBBase.Provider, { isMobile: isMobile, items: items, pathname: pathname, defaultCollapsed: isMobile ? false : defaultCollapsed, size: resolvedSize, minWidth: minWidth, children: _jsxs(LNBBase.Root, { className: className, trigger: _jsx(LNBBase.Trigger, {}), children: [_jsx(LNBBase.Header, { name: name, email: email, profileImage: profileImage, handleLogout: handleLogout }), isMobile && children, _jsx(LNBBase.Content, { children: items.map((group) => (_jsx(LNBBase.Group, { label: group.label, noSlider: group.noSlider, children: _jsx(LNBBase.Menu, { label: group.label, noSlider: group.noSlider, tabCount: group.tabs?.length ?? 0, children: group.tabs?.map((tab) => (_jsx(LNBBase.MenuItem, { as: as, href: tab.path, icon: tab.icon, isActive: isActivePath(pathname, tab.path), onClick: () => {
                                     onNavigate?.(tab.path);
                                     setOpen(false);
                                 }, children: tab.label }, tab.path))) }) }, group.label))) }), _jsx(LNBBase.ResizeWidthBar, { className: "absolute inset-y-0 right-0" })] }) }));
     if (!isMobile)
         return nav(false);
-    return (_jsx(LDDrawer, { title: "\uC804\uCCB4 \uBA54\uB274", direction: drawerDirection, open: open, onOpenChange: setOpen, className: "w-full max-w-none p-0", trigger: _jsx("button", { type: "button", "aria-label": "\uBA54\uB274 \uC5F4\uAE30", className: cn('flex size-10 cursor-pointer items-center justify-center text-neutral500 ld-transition hover:text-mono900', triggerClassName), children: _jsx(MenuIcon, { size: 20 }) }), children: _jsx("div", { className: "pt-6", children: nav(true) }) }));
+    return (_jsx(LDDrawer, { title: "\uC804\uCCB4 \uBA54\uB274", direction: drawerDirection, open: open, onOpenChange: setOpen, className: "w-full max-w-none p-0", trigger: _jsx("button", { type: "button", "aria-label": "\uBA54\uB274 \uC5F4\uAE30", className: cn('flex size-10 cursor-pointer items-center justify-center text-neutral500 ld-transition hover:text-neutral900', triggerClassName), children: _jsx(MenuIcon, { size: 20 }) }), children: _jsx("div", { className: "pt-6", children: nav(true) }) }));
 };
 export default LDLNB;

package/dist/components/LDLNB/LNBBase.d.ts

@@ -22,6 +22,14 @@ interface ProviderProps {
 interface RootProps {
     children: ReactNode;
     className?: string;
+    /**
+     * 패널 **바깥**(오른쪽 여백)에 띄울 요소. `Trigger`를 넣는 자리다.
+     *
+     * 스크롤 컨테이너 안에 두면 `overflow-y-auto`가 가로축까지 `auto`로 만들어
+     * 패널 밖으로 나간 부분이 잘린다. 그래서 children이 아니라 별도 슬롯으로 받아
+     * 스크롤 컨테이너 바깥, 위치 기준이 되는 relative 래퍼 직속으로 렌더한다.
+     */
+    trigger?: ReactNode;
 }
 interface TriggerProps {
     className?: string;
@@ -61,7 +69,7 @@ interface IResizeWidthBar {
 }
 declare const LNBBase: {
     Provider: ({ children, isMobile, items, pathname, size, defaultCollapsed, minWidth, }: ProviderProps) => import("react/jsx-runtime").JSX.Element;
-    Root: ({ children, className }: RootProps) => import("react/jsx-runtime").JSX.Element;
+    Root: ({ children, className, trigger }: RootProps) => import("react/jsx-runtime").JSX.Element;
     Trigger: ({ className }: TriggerProps) => import("react/jsx-runtime").JSX.Element | null;
     Header: ({ name, email, profileImage, handleLogout }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
     Content: ({ children, className }: ContentProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/LDLNB/LNBBase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LNBBase.d.ts","sourceRoot":"","sources":["../../../src/components/LDLNB/LNBBase.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAEV,WAAW,EAEX,SAAS,EAEV,MAAM,OAAO,CAAC;AAoBf,MAAM,WAAW,OAAO;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,OAAO,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAiDD,UAAU,aAAa;IACrB,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAuFD,UAAU,SAAS;IACjB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA+BD,UAAU,YAAY;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA0BD,UAAU,WAAW;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAqCD,UAAU,YAAY;IACpB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAkBD,UAAU,UAAU;IAClB,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAuCD,UAAU,SAAS;IACjB,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AA6BD,UAAU,aAAa;IACrB,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAgCD,UAAU,eAAe;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAgDD,QAAA,MAAM,OAAO;2FAjXV,aAAa;oCAkFuB,SAAS;6BAiChB,YAAY;0DA+BiB,WAAW;uCAwC9B,YAAY;2CAsBR,UAAU;oDA4CG,SAAS;iFA6CjE,aAAa;oCA0BuB,eAAe;CAwDrD,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"LNBBase.d.ts","sourceRoot":"","sources":["../../../src/components/LDLNB/LNBBase.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAEV,WAAW,EAEX,SAAS,EAEV,MAAM,OAAO,CAAC;AAoBf,MAAM,WAAW,OAAO;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,OAAO,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAiDD,UAAU,aAAa;IACrB,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AA6FD,UAAU,SAAS;IACjB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAgCD,UAAU,YAAY;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA2BD,UAAU,WAAW;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAqCD,UAAU,YAAY;IACpB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAkBD,UAAU,UAAU;IAClB,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAuCD,UAAU,SAAS;IACjB,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AA6BD,UAAU,aAAa;IACrB,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAgCD,UAAU,eAAe;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAmDD,QAAA,MAAM,OAAO;2FApYV,aAAa;6CAgGgC,SAAS;6BAkCzB,YAAY;0DAgCiB,WAAW;uCAwC9B,YAAY;2CAsBR,UAAU;oDA4CG,SAAS;iFA6CjE,aAAa;oCA0BuB,eAAe;CA2DrD,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/components/LDLNB/LNBBase.js

@@ -36,6 +36,11 @@ const Provider = ({ children, isMobile, items = [], pathname = '', size = DEFAUL
         setOpenGroups((prev) => prev.includes(label) ? prev.filter((g) => g !== label) : [...prev, label]);
     }, []);
     const isGroupOpen = useCallback((label) => openGroups.includes(label), [openGroups]);
+    // size(펼침 기본 너비)는 뷰포트 구간에 따라 바뀐다. width는 useState 초기값이라
+    // 그대로 두면 마운트 시점 값에 고정되므로, size가 바뀌면 새 기본값으로 맞춘다.
+    useEffect(() => {
+        setWidth(size);
+    }, [size]);
     useEffect(() => {
         if (!isMobile)
             return;
@@ -73,17 +78,17 @@ const Provider = ({ children, isMobile, items = [], pathname = '', size = DEFAUL
     const widthContextValue = useMemo(() => ({ width, setWidth, isResizing, setIsResizing }), [width, isResizing]);
     return (_jsx(LNBContext, { value: contextValue, children: _jsx(LNBWidthContext, { value: widthContextValue, children: children }) }));
 };
-const Root = ({ children, className }) => {
+const Root = ({ children, className, trigger }) => {
     const { isMobile, collapsed } = useLNBContext();
     const { width, isResizing } = useLNBWidthContext();
-    return (_jsx("div", { className: cn('relative mobile:w-full', !isResizing && 'ld-transition', collapsed ? 'w-[60px]' : `w-[${width}px]`, className), style: collapsed || isMobile ? undefined : { width }, children: _jsx("div", { className: cn('size-full bg-mono50 mobile:bg-white', 'h-[calc(100vh-64px)] mobile:h-auto mobile:overflow-hidden', 'scrollbar-hide flex scrollbar-hover flex-col gap-md overflow-y-auto p-sm mobile:py-0'), children: children }) }));
+    return (_jsxs("div", { className: cn('relative mobile:w-full', !isResizing && 'ld-transition', collapsed ? 'w-[60px]' : `w-[${width}px]`, className), style: collapsed || isMobile ? undefined : { width }, children: [trigger, _jsx("div", { className: cn('size-full bg-mono50 mobile:bg-white', 'h-[calc(100vh-64px)] mobile:h-auto mobile:overflow-hidden', 'scrollbar-hide flex scrollbar-hover flex-col gap-md overflow-y-auto p-sm mobile:py-0'), children: children })] }));
 };
 const Trigger = ({ className }) => {
     const { isMobile, collapsed, toggleCollapsed } = useLNBContext();
     const Icon = collapsed ? PanelLeftOpen : PanelLeftClose;
     if (isMobile)
         return null;
-    return (_jsx("button", { type: "button", onClick: toggleCollapsed, className: cn('absolute top-0 -right-10 z-10', 'flex size-10 items-center justify-center', 'text-neutral500', 'cursor-pointer ld-transition hover:text-mono900', className), "aria-label": collapsed ? '사이드바 펼치기' : '사이드바 접기', children: _jsx(Icon, { size: 16 }) }));
+    return (_jsx("button", { type: "button", onClick: toggleCollapsed, className: cn('absolute top-0 -right-10 z-10', 'flex size-10 items-center justify-center', 'text-neutral500', 'cursor-pointer ld-transition hover:text-neutral900', className), "aria-label": collapsed ? '사이드바 펼치기' : '사이드바 접기', children: _jsx(Icon, { size: 20 }) }));
 };
 const Header = ({ name, email, profileImage, handleLogout }) => {
     const { collapsed } = useLNBContext();
@@ -112,7 +117,7 @@ const Menu = ({ children, label, noSlider, tabCount = 0 }) => {
 };
 const MenuItem = ({ as: Comp = 'a', href, isActive, children, icon, className, ...rest }) => {
     const { collapsed } = useLNBContext();
-    return (_jsxs(Comp, { href: href, className: cn('flex w-full items-center gap-sm p-sm display16 bold mobile:display14 mobile:medium', 'cursor-pointer rounded-[5px] text-neutral500 ld-transition hover:bg-mono300 hover:text-mono900', 'overflow-hidden whitespace-nowrap', collapsed && 'justify-center', isActive &&
+    return (_jsxs(Comp, { href: href, className: cn('flex w-full items-center gap-sm p-sm display16 bold mobile:display14 mobile:medium', 'cursor-pointer rounded-[5px] text-neutral500 ld-transition hover:bg-neutral100 hover:text-neutral900', 'overflow-hidden whitespace-nowrap', collapsed && 'justify-center', isActive &&
             'bg-tintBlue text-blue400 hover:bg-tintBlue hover:text-blue400', className), ...rest, children: [_jsx(RenderIcon, { className: "icon-md", children: icon }), !collapsed && children] }));
 };
 const ResizeWidthBar = ({ className }) => {
@@ -142,7 +147,11 @@ const ResizeWidthBar = ({ className }) => {
         document.body.addEventListener('mousemove', onMouseMove);
         document.body.addEventListener('mouseup', onMouseUp, { once: true });
     };
-    return (_jsx("div", { className: cn('group flex w-1 translate-x-1 justify-start ld-transition', className), onMouseDown: handleResizeWidth, children: _jsx("div", { className: "h-full w-px -translate-x-px ld-transition group-hover:cursor-col-resize group-hover:bg-lb500" }) }));
+    return (
+    // 히트 영역은 12px. 잡히는 폭이 1px 선 그대로면 커서를 맞추기가 어렵다는
+    // 피드백이 있어, 보이는 선은 1px로 두고 경계선을 가운데 두는 12px 띠로 넓혔다.
+    // cursor도 이 바깥 요소에 준다 — 안쪽 1px에만 걸면 그 1px 위에서만 커서가 바뀐다.
+    _jsx("div", { className: cn('group flex w-3 translate-x-1.5 cursor-col-resize justify-center', className), onMouseDown: handleResizeWidth, children: _jsx("div", { className: "h-full w-px ld-transition group-hover:bg-lb500" }) }));
 };
 // ── Export ──
 const LNBBase = {

package/dist/components/LDTable/LDTable.d.ts

@@ -1,4 +1,4 @@
-import { type CSSProperties, type ReactNode } from 'react';
+import { type CSSProperties, type ReactNode, type Ref } from 'react';
 import { IClassNames } from '../../components/LDTable/LDTanstackTable.js';
 export interface LDTableProps {
     /** 테이블 콘텐츠 (LDTable.Header, LDTable.Body 등) */
@@ -30,6 +30,7 @@ declare const LDTable: {
     Body: ({ className, children, ...props }: React.HTMLAttributes<HTMLTableSectionElement>) => import("react/jsx-runtime").JSX.Element;
     Row: ({ className, children, ...props }: React.HTMLAttributes<HTMLTableRowElement> & {
         selected?: boolean;
+        ref?: Ref<HTMLTableRowElement>;
     }) => import("react/jsx-runtime").JSX.Element;
     Cell: ({ className, children, ...props }: React.TdHTMLAttributes<HTMLTableCellElement>) => import("react/jsx-runtime").JSX.Element;
 };

package/dist/components/LDTable/LDTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LDTable.d.ts","sourceRoot":"","sources":["../../../src/components/LDTable/LDTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE3D,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AAInE,MAAM,WAAW,YAAY;IAC3B,+CAA+C;IAC/C,QAAQ,EAAE,SAAS,CAAC;IACpB,iBAAiB;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uDAAuD;IACvD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gCAAgC;IAChC,iBAAiB,CAAC,EAAE,SAAS,CAAC;IAC9B,sCAAsC;IACtC,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,mBAAmB;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,uBAAuB;IACvB,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,wBAAwB;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,uBAAuB;IACvB,UAAU,CAAC,EAAE,WAAW,CAAC;CAQ1B;AAED,QAAA,MAAM,OAAO;yHAWV,YAAY;gDAyFZ,KAAK,CAAC,cAAc,CAAC,uBAAuB,CAAC;mDAgB7C,KAAK,CAAC,cAAc,CAAC,mBAAmB,CAAC;oDAUzC,KAAK,CAAC,gBAAgB,CAAC,oBAAoB,CAAC;8CAa5C,KAAK,CAAC,cAAc,CAAC,uBAAuB,CAAC;6CAU7C,KAAK,CAAC,cAAc,CAAC,mBAAmB,CAAC,GAAG;QAAE,QAAQ,CAAC,EAAE,OAAO,CAAA;KAAE;8CAgBlE,KAAK,CAAC,gBAAgB,CAAC,oBAAoB,CAAC;CA5G9C,CAAC;AA4HF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"LDTable.d.ts","sourceRoot":"","sources":["../../../src/components/LDTable/LDTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AAErE,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AAInE,MAAM,WAAW,YAAY;IAC3B,+CAA+C;IAC/C,QAAQ,EAAE,SAAS,CAAC;IACpB,iBAAiB;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uDAAuD;IACvD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gCAAgC;IAChC,iBAAiB,CAAC,EAAE,SAAS,CAAC;IAC9B,sCAAsC;IACtC,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,mBAAmB;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,uBAAuB;IACvB,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,wBAAwB;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,uBAAuB;IACvB,UAAU,CAAC,EAAE,WAAW,CAAC;CAQ1B;AAED,QAAA,MAAM,OAAO;yHAWV,YAAY;gDAyFZ,KAAK,CAAC,cAAc,CAAC,uBAAuB,CAAC;mDAgB7C,KAAK,CAAC,cAAc,CAAC,mBAAmB,CAAC;oDAUzC,KAAK,CAAC,gBAAgB,CAAC,oBAAoB,CAAC;8CAa5C,KAAK,CAAC,cAAc,CAAC,uBAAuB,CAAC;6CAU7C,KAAK,CAAC,cAAc,CAAC,mBAAmB,CAAC,GAAG;QAC7C,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;KAChC;8CAgBE,KAAK,CAAC,gBAAgB,CAAC,oBAAoB,CAAC;CA/G9C,CAAC;AA+HF,eAAe,OAAO,CAAC"}

package/dist/components/LDTable/LDTanstackTable.d.ts

@@ -13,12 +13,24 @@ export interface IClassNames {
     row?: string;
     cell?: string;
 }
+export interface RowReorderEvent {
+    /** 옮긴 행의 id (`getRowId` 결과) */
+    activeId: string;
+    /** 놓인 자리에 있던 행의 id */
+    overId: string;
+    /** 옮긴 행의 원본 `data` 배열에서의 위치 */
+    oldIndex: number;
+    /** 놓인 자리의 원본 `data` 배열에서의 위치 */
+    newIndex: number;
+}
 export interface LDTanstackTableProps<TData, TColumn> extends Omit<HeadlessTableProps<TData, TColumn>, 'children'> {
     title?: string;
     rightSideContents?: ReactNode;
     emptyMessage?: string | ReactNode;
     classNames?: IClassNames;
+    enableRowDragging?: boolean;
+    onRowReorder?: (event: RowReorderEvent) => void;
 }
-declare const LDTanstackTable: <TData, TColumn>({ columns, data, rowCount, paginationState, onPageChange, sortingState, enableRowSelection, enableMultiRowSelection, rowSelectionState, getRowId, rightSideContents, title, emptyMessage, classNames, }: LDTanstackTableProps<TData, TColumn>) => import("react/jsx-runtime").JSX.Element;
+declare const LDTanstackTable: <TData, TColumn>({ columns, data, rowCount, paginationState, onPageChange, sortingState, enableRowSelection, enableMultiRowSelection, rowSelectionState, getRowId, rightSideContents, title, emptyMessage, classNames, enableRowDragging, onRowReorder, }: LDTanstackTableProps<TData, TColumn>) => import("react/jsx-runtime").JSX.Element;
 export default LDTanstackTable;
 //# sourceMappingURL=LDTanstackTable.d.ts.map

package/dist/components/LDTable/LDTanstackTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LDTanstackTable.d.ts","sourceRoot":"","sources":["../../../src/components/LDTable/LDTanstackTable.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAsB,EACpB,KAAK,kBAAkB,EACxB,MAAM,oCAAoC,CAAC;AAK5C,MAAM,WAAW,WAAW;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,oBAAoB,CAAC,KAAK,EAAE,OAAO,CAAE,SAAQ,IAAI,CAChE,kBAAkB,CAAC,KAAK,EAAE,OAAO,CAAC,EAClC,UAAU,CACX;IACC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iBAAiB,CAAC,EAAE,SAAS,CAAC;IAC9B,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,UAAU,CAAC,EAAE,WAAW,CAAC;CAC1B;AAED,QAAA,MAAM,eAAe,GAAI,KAAK,EAAE,OAAO,EAAE,yMAetC,oBAAoB,CAAC,KAAK,EAAE,OAAO,CAAC,4CAwJtC,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"LDTanstackTable.d.ts","sourceRoot":"","sources":["../../../src/components/LDTable/LDTanstackTable.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAsB,EACpB,KAAK,kBAAkB,EACxB,MAAM,oCAAoC,CAAC;AAW5C,MAAM,WAAW,WAAW;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,eAAe;IAC9B,+BAA+B;IAC/B,QAAQ,EAAE,MAAM,CAAC;IACjB,sBAAsB;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,+BAA+B;IAC/B,QAAQ,EAAE,MAAM,CAAC;IACjB,gCAAgC;IAChC,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,oBAAoB,CAAC,KAAK,EAAE,OAAO,CAAE,SAAQ,IAAI,CAChE,kBAAkB,CAAC,KAAK,EAAE,OAAO,CAAC,EAClC,UAAU,CACX;IACC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iBAAiB,CAAC,EAAE,SAAS,CAAC;IAC9B,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,UAAU,CAAC,EAAE,WAAW,CAAC;IACzB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;CACjD;AAED,QAAA,MAAM,eAAe,GAAI,KAAK,EAAE,OAAO,EAAE,0OAiBtC,oBAAoB,CAAC,KAAK,EAAE,OAAO,CAAC,4CAgMtC,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/components/LDTable/LDTanstackTable.js

@@ -4,10 +4,36 @@ import { ArrowDown, ArrowUp } from 'lucide-react';
 import LDPagination from '../../components/LDPagination/LDPagination.js';
 import HeadlessTable from '../../components/LDTable/HeadlessTable.js';
 import LDTable from '../../components/LDTable/LDTable.js';
+import { PlainRow, RowDndProvider, RowSortableProvider, SortableRow, } from '../../components/LDTable/TableRowDnd.js';
 import cn from '../../utils/cn.js';
-const LDTanstackTable = ({ columns, data, rowCount, paginationState, onPageChange, sortingState, enableRowSelection, enableMultiRowSelection, rowSelectionState, getRowId, rightSideContents, title, emptyMessage, classNames, }) => {
+const LDTanstackTable = ({ columns, data, rowCount, paginationState, onPageChange, sortingState, enableRowSelection, enableMultiRowSelection, rowSelectionState, getRowId, rightSideContents, title, emptyMessage, classNames, enableRowDragging = false, onRowReorder, }) => {
     return (_jsx(HeadlessTable, { columns: columns, data: data, rowCount: rowCount, paginationState: paginationState, onPageChange: onPageChange, sortingState: sortingState, enableRowSelection: enableRowSelection, enableMultiRowSelection: enableMultiRowSelection, rowSelectionState: rowSelectionState, getRowId: getRowId, children: ({ headerGroups, rows, isEmpty, tableStyle, visibleColumnCount, currentPage, totalPages, hasPagination, onPageChange: handlePageChange, getHeader, getCell, }) => {
-            return (_jsxs(LDTable, { title: title, totalCount: rowCount, rightSideContents: rightSideContents, isEmpty: isEmpty, emptyMessage: emptyMessage, columnCount: visibleColumnCount, footer: hasPagination && (_jsx(LDPagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: handlePageChange, className: classNames?.pagination })), style: tableStyle, classNames: {
+            const rowIds = rows.map((row) => row.id);
+            const dataIndexByRowId = new Map(rows.map((row) => [row.id, row.index]));
+            const handleRowDragEnd = (activeId, overId) => {
+                const active = String(activeId);
+                const over = String(overId);
+                const oldIndex = dataIndexByRowId.get(active);
+                const newIndex = dataIndexByRowId.get(over);
+                if (oldIndex === undefined || newIndex === undefined)
+                    return;
+                onRowReorder?.({
+                    activeId: active,
+                    overId: over,
+                    oldIndex,
+                    newIndex,
+                });
+            };
+            const RowComp = enableRowDragging ? SortableRow : PlainRow;
+            const bodyRows = rows.map((row) => (_jsx(RowComp, { rowId: row.id, selected: row.getIsSelected(), className: classNames?.row, onClick: () => row.toggleSelected(), children: row.getVisibleCells().map((cell) => {
+                    const c = getCell(cell);
+                    return (_jsx(LDTable.Cell, { className: classNames?.cell, children: _jsx("div", { className: cn('flex w-full items-center', c.meta?.headerAlign === 'left'
+                                ? 'justify-start'
+                                : c.meta?.headerAlign === 'right'
+                                    ? 'justify-end'
+                                    : 'justify-center'), children: _jsx("span", { className: "min-w-0 truncate", children: c.renderCell() }) }) }, c.id));
+                }) }, row.id)));
+            const table = (_jsxs(LDTable, { title: title, totalCount: rowCount, rightSideContents: rightSideContents, isEmpty: isEmpty, emptyMessage: emptyMessage, columnCount: visibleColumnCount, footer: hasPagination && (_jsx(LDPagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: handlePageChange, className: classNames?.pagination })), style: tableStyle, classNames: {
                     ...classNames,
                     root: cn('table-fixed', classNames?.root),
                 }, children: [_jsx(LDTable.Header, { className: classNames?.thead, children: headerGroups.map((hg) => (_jsx(LDTable.HeaderRow, { className: cn('group w-full', classNames?.headRow), children: hg.headers.map((header) => {
@@ -17,14 +43,10 @@ const LDTanstackTable = ({ columns, data, rowCount, paginationState, onPageChang
                                                 : h.meta?.headerAlign === 'left'
                                                     ? 'justify-start'
                                                     : 'justify-center'), children: [_jsx("span", { className: "min-w-0 truncate", children: h.renderHeader() }), h.isSorted === 'asc' && (_jsx(ArrowUp, { className: "size-3 shrink-0" })), h.isSorted === 'desc' && (_jsx(ArrowDown, { className: "size-3 shrink-0" }))] }), h.canResize && (_jsx("div", { onPointerDown: h.resizeHandler, onClick: (e) => e.stopPropagation(), className: cn('absolute top-0 right-0 flex h-full w-5 touch-none justify-end opacity-0 select-none ld-transition group-hover:cursor-col-resize group-hover:opacity-100'), children: _jsx("div", { className: "h-full w-1 bg-neutral200" }) }))] }, h.id));
-                            }) }, hg.id))) }), _jsx(LDTable.Body, { children: rows.map((row) => (_jsx(LDTable.Row, { selected: row.getIsSelected(), className: classNames?.row, onClick: () => row.toggleSelected(), children: row.getVisibleCells().map((cell) => {
-                                const c = getCell(cell);
-                                return (_jsx(LDTable.Cell, { className: classNames?.cell, children: _jsx("div", { className: cn('flex w-full items-center', c.meta?.headerAlign === 'left'
-                                            ? 'justify-start'
-                                            : c.meta?.headerAlign === 'right'
-                                                ? 'justify-end'
-                                                : 'justify-center'), children: _jsx("span", { className: "min-w-0 truncate", children: c.renderCell() }) }) }, c.id));
-                            }) }, row.id))) })] }));
+                            }) }, hg.id))) }), _jsx(LDTable.Body, { children: enableRowDragging ? (_jsx(RowSortableProvider, { rowIds: rowIds, children: bodyRows })) : (bodyRows) })] }));
+            if (!enableRowDragging)
+                return table;
+            return (_jsx(RowDndProvider, { onRowDragEnd: handleRowDragEnd, children: table }));
         } }));
 };
 export default LDTanstackTable;

package/dist/components/LDTable/TableBase.d.ts

@@ -15,6 +15,7 @@ interface HeaderRowProps extends HTMLAttributes<HTMLTableRowElement> {
 interface RowProps extends HTMLAttributes<HTMLTableRowElement> {
     children?: ReactNode;
     selected?: boolean;
+    ref?: Ref<HTMLTableRowElement>;
 }
 interface HeaderCellProps extends ThHTMLAttributes<HTMLTableCellElement> {
     children?: ReactNode;
@@ -29,7 +30,7 @@ export declare const TableBase: {
     Header: ({ className, children, ...props }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
     Body: ({ className, children, ...props }: BodyProps) => import("react/jsx-runtime").JSX.Element;
     HeaderRow: ({ className, children, ...props }: HeaderRowProps) => import("react/jsx-runtime").JSX.Element;
-    Row: ({ className, children, selected, ...props }: RowProps) => import("react/jsx-runtime").JSX.Element;
+    Row: ({ className, children, selected, ref, ...props }: RowProps) => import("react/jsx-runtime").JSX.Element;
     HeaderCell: ({ className, children, sortable, sortDirection, ...props }: HeaderCellProps) => import("react/jsx-runtime").JSX.Element;
     Cell: ({ className, children, ...props }: CellProps) => import("react/jsx-runtime").JSX.Element;
 };

package/dist/components/LDTable/TableBase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableBase.d.ts","sourceRoot":"","sources":["../../../src/components/LDTable/TableBase.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,SAAS,EACd,KAAK,GAAG,EACR,KAAK,gBAAgB,EACrB,KAAK,gBAAgB,EACtB,MAAM,OAAO,CAAC;AAKf,UAAU,SAAU,SAAQ,cAAc,CAAC,gBAAgB,CAAC;IAC1D,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAgBD,UAAU,WAAY,SAAQ,cAAc,CAAC,uBAAuB,CAAC;IACnE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAWD,UAAU,SAAU,SAAQ,cAAc,CAAC,uBAAuB,CAAC;IACjE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAWD,UAAU,cAAe,SAAQ,cAAc,CAAC,mBAAmB,CAAC;IAClE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAWD,UAAU,QAAS,SAAQ,cAAc,CAAC,mBAAmB,CAAC;IAC5D,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAiBD,UAAU,eAAgB,SAAQ,gBAAgB,CAAC,oBAAoB,CAAC;IACtE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,KAAK,CAAC;CACxC;AA8BD,UAAU,SAAU,SAAQ,gBAAgB,CAAC,oBAAoB,CAAC;IAChE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAUD,eAAO,MAAM,SAAS;mDAvHgC,SAAS;gDAkBZ,WAAW;8CAab,SAAS;mDAaJ,cAAc;uDAcV,QAAQ;6EA2B/D,eAAe;8CA0B+B,SAAS;CAgBzD,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"TableBase.d.ts","sourceRoot":"","sources":["../../../src/components/LDTable/TableBase.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,SAAS,EACd,KAAK,GAAG,EACR,KAAK,gBAAgB,EACrB,KAAK,gBAAgB,EACtB,MAAM,OAAO,CAAC;AAKf,UAAU,SAAU,SAAQ,cAAc,CAAC,gBAAgB,CAAC;IAC1D,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAgBD,UAAU,WAAY,SAAQ,cAAc,CAAC,uBAAuB,CAAC;IACnE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAWD,UAAU,SAAU,SAAQ,cAAc,CAAC,uBAAuB,CAAC;IACjE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAWD,UAAU,cAAe,SAAQ,cAAc,CAAC,mBAAmB,CAAC;IAClE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAWD,UAAU,QAAS,SAAQ,cAAc,CAAC,mBAAmB,CAAC;IAC5D,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;CAChC;AAkBD,UAAU,eAAgB,SAAQ,gBAAgB,CAAC,oBAAoB,CAAC;IACtE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,KAAK,CAAC;CACxC;AA8BD,UAAU,SAAU,SAAQ,gBAAgB,CAAC,oBAAoB,CAAC;IAChE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAUD,eAAO,MAAM,SAAS;mDAzHgC,SAAS;gDAkBZ,WAAW;8CAab,SAAS;mDAaJ,cAAc;4DAeL,QAAQ;6EA4BpE,eAAe;8CA0B+B,SAAS;CAgBzD,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/components/LDTable/TableBase.js

@@ -12,8 +12,8 @@ const Body = ({ className, children, ...props }) => {
 const HeaderRow = ({ className, children, ...props }) => {
     return (_jsx("tr", { role: "row", className: className, ...props, children: children }));
 };
-const Row = ({ className, children, selected, ...props }) => {
-    return (_jsx("tr", { role: "row", "aria-selected": selected, "data-state": selected ? 'selected' : undefined, className: className, ...props, children: children }));
+const Row = ({ className, children, selected, ref, ...props }) => {
+    return (_jsx("tr", { ref: ref, role: "row", "aria-selected": selected, "data-state": selected ? 'selected' : undefined, className: className, ...props, children: children }));
 };
 const HeaderCell = ({ className, children, sortable, sortDirection, ...props }) => {
     return (_jsx("th", { role: "columnheader", "aria-sort": sortDirection === 'asc'

package/dist/components/LDTable/TableRowDnd.d.ts

@@ -0,0 +1,26 @@
+import { type UniqueIdentifier } from '@dnd-kit/core';
+import { type ReactNode } from 'react';
+export declare const RowDndProvider: ({ onRowDragEnd, children, }: {
+    onRowDragEnd: (activeId: UniqueIdentifier, overId: UniqueIdentifier) => void;
+    children: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const RowSortableProvider: ({ rowIds, children, }: {
+    rowIds: UniqueIdentifier[];
+    children: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export interface TableRowProps {
+    rowId: string;
+    selected?: boolean;
+    className?: string;
+    onClick?: () => void;
+    children: ReactNode;
+}
+/** 드래그가 꺼져 있을 때의 행. `SortableRow`와 prop 모양을 맞춰 교체 가능하게 둔다 */
+export declare const PlainRow: ({ selected, className, onClick, children, }: TableRowProps) => import("react/jsx-runtime").JSX.Element;
+/** 드래그가 켜져 있을 때의 행 */
+export declare const SortableRow: ({ rowId, selected, className, onClick, children, }: TableRowProps) => import("react/jsx-runtime").JSX.Element;
+export declare const LDRowDragHandle: ({ rowId, className, }: {
+    rowId: string;
+    className?: string;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=TableRowDnd.d.ts.map

package/dist/components/LDTable/TableRowDnd.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableRowDnd.d.ts","sourceRoot":"","sources":["../../../src/components/LDTable/TableRowDnd.tsx"],"names":[],"mappings":"AAEA,OAAO,EAOL,KAAK,gBAAgB,EAGtB,MAAM,eAAe,CAAC;AAUvB,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvC,eAAO,MAAM,cAAc,GAAI,6BAG5B;IACD,YAAY,EAAE,CAAC,QAAQ,EAAE,gBAAgB,EAAE,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC7E,QAAQ,EAAE,SAAS,CAAC;CACrB,4CAwBA,CAAC;AAIF,eAAO,MAAM,mBAAmB,GAAI,uBAGjC;IACD,MAAM,EAAE,gBAAgB,EAAE,CAAC;IAC3B,QAAQ,EAAE,SAAS,CAAC;CACrB,4CAIA,CAAC;AAIF,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,6DAA6D;AAC7D,eAAO,MAAM,QAAQ,GAAI,6CAKtB,aAAa,4CAIf,CAAC;AAEF,sBAAsB;AACtB,eAAO,MAAM,WAAW,GAAI,oDAMzB,aAAa,4CAmBf,CAAC;AAIF,eAAO,MAAM,eAAe,GAAI,uBAG7B;IACD,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,4CAoBA,CAAC"}

package/dist/components/LDTable/TableRowDnd.js

@@ -0,0 +1,40 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { closestCenter, DndContext, KeyboardSensor, MouseSensor, TouchSensor, useSensor, useSensors, } from '@dnd-kit/core';
+import { restrictToVerticalAxis } from '@dnd-kit/modifiers';
+import { SortableContext, sortableKeyboardCoordinates, useSortable, verticalListSortingStrategy, } from '@dnd-kit/sortable';
+import { CSS } from '@dnd-kit/utilities';
+import { GripVertical } from 'lucide-react';
+import LDTable from '../../components/LDTable/LDTable.js';
+import cn from '../../utils/cn.js';
+// ── DndContext ──
+export const RowDndProvider = ({ onRowDragEnd, children, }) => {
+    const sensors = useSensors(useSensor(MouseSensor), useSensor(TouchSensor), useSensor(KeyboardSensor, {
+        coordinateGetter: sortableKeyboardCoordinates,
+    }));
+    const handleDragEnd = ({ active, over }) => {
+        if (!over || active.id === over.id)
+            return;
+        onRowDragEnd(active.id, over.id);
+    };
+    return (_jsx(DndContext, { collisionDetection: closestCenter, modifiers: [restrictToVerticalAxis], onDragEnd: handleDragEnd, sensors: sensors, children: children }));
+};
+// ── SortableContext ──
+export const RowSortableProvider = ({ rowIds, children, }) => (_jsx(SortableContext, { items: rowIds, strategy: verticalListSortingStrategy, children: children }));
+/** 드래그가 꺼져 있을 때의 행. `SortableRow`와 prop 모양을 맞춰 교체 가능하게 둔다 */
+export const PlainRow = ({ selected, className, onClick, children, }) => (_jsx(LDTable.Row, { selected: selected, className: className, onClick: onClick, children: children }));
+/** 드래그가 켜져 있을 때의 행 */
+export const SortableRow = ({ rowId, selected, className, onClick, children, }) => {
+    const { setNodeRef, transform, transition, isDragging } = useSortable({
+        id: rowId,
+    });
+    return (_jsx(LDTable.Row, { ref: setNodeRef, selected: selected, className: cn(isDragging && 'relative z-10 opacity-80', className), onClick: onClick, style: {
+            transform: CSS.Transform.toString(transform),
+            transition: isDragging ? 'none' : transition,
+        }, children: children }));
+};
+// ── Handle ──
+export const LDRowDragHandle = ({ rowId, className, }) => {
+    const { attributes, listeners, isDragging } = useSortable({ id: rowId });
+    return (_jsx("button", { type: "button", "aria-label": "\uC21C\uC11C \uBCC0\uACBD", onClick: (e) => e.stopPropagation(), className: cn('flex size-6 touch-none items-center justify-center', 'text-neutral400 ld-transition hover:text-neutral700', isDragging ? 'cursor-grabbing' : 'cursor-grab', className), ...attributes, ...listeners, children: _jsx(GripVertical, { size: 16 }) }));
+};

package/dist/index.css

@@ -1675,6 +1675,9 @@
   .w-2 {
     width: calc(var(--spacing) * 2);
   }
+  .w-3 {
+    width: calc(var(--spacing) * 3);
+  }
   .w-4 {
     width: calc(var(--spacing) * 4);
   }
@@ -1858,12 +1861,8 @@
     --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
     translate: var(--tw-translate-x) var(--tw-translate-y);
   }
-  .-translate-x-px {
-    --tw-translate-x: -1px;
-    translate: var(--tw-translate-x) var(--tw-translate-y);
-  }
-  .translate-x-1 {
-    --tw-translate-x: calc(var(--spacing) * 1);
+  .translate-x-1\.5 {
+    --tw-translate-x: calc(var(--spacing) * 1.5);
     translate: var(--tw-translate-x) var(--tw-translate-y);
   }
   .-translate-y-1\/2 {
@@ -1925,6 +1924,12 @@
   .cursor-default {
     cursor: default;
   }
+  .cursor-grab {
+    cursor: grab;
+  }
+  .cursor-grabbing {
+    cursor: grabbing;
+  }
   .cursor-not-allowed {
     cursor: not-allowed;
   }
@@ -3070,6 +3075,9 @@
   .opacity-60 {
     opacity: 60%;
   }
+  .opacity-80 {
+    opacity: 80%;
+  }
   .opacity-100 {
     opacity: 100%;
   }
@@ -3724,6 +3732,13 @@
       }
     }
   }
+  .hover\:text-neutral700 {
+    &:hover {
+      @media (hover: hover) {
+        color: var(--color-neutral700);
+      }
+    }
+  }
   .hover\:text-neutral800 {
     &:hover {
       @media (hover: hover) {

package/dist/index.d.ts

@@ -64,6 +64,7 @@ export { default as LDSpinner } from './components/LDSpinner/LDSpinner.js';
 export { default as LDCollapsibleTanstackTable } from './components/LDTable/LDCollapsibleTanstackTable.js';
 export { default as LDTable } from './components/LDTable/LDTable.js';
 export { default as LDTanstackTable } from './components/LDTable/LDTanstackTable.js';
+export { LDRowDragHandle } from './components/LDTable/TableRowDnd.js';
 export { default as LDTabs, type LDTabsColor, type LDTabsContentProps, type LDTabsListProps, type LDTabsPosition, type LDTabsRootProps, type LDTabsShape, type LDTabsSize, type LDTabsTriggerProps, } from './components/LDTabs/LDTabs.js';
 export { default as LDTeamHistory, type LDTeamHistoryProps, } from './components/LDTeamHistory/LDTeamHistory.js';
 export { default as LDFormTextarea } from './components/LDTextarea/LDFormTextarea.js';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -106,6 +106,7 @@ export { default as LDSpinner } from './components/LDSpinner/LDSpinner.js';
 export { default as LDCollapsibleTanstackTable } from './components/LDTable/LDCollapsibleTanstackTable.js';
 export { default as LDTable } from './components/LDTable/LDTable.js';
 export { default as LDTanstackTable } from './components/LDTable/LDTanstackTable.js';
+export { LDRowDragHandle } from './components/LDTable/TableRowDnd.js';
 // LDTabs
 export { default as LDTabs, } from './components/LDTabs/LDTabs.js';
 // LDTeamHistory

package/dist/utils/utils.d.ts

@@ -1,3 +1,9 @@
+/**
+ * 현재 경로가 해당 링크의 경로와 **정확히** 일치하는지 판별합니다.
+ *
+ * 접두사(prefix) 비교는 쓰지 않습니다. `startsWith`로 판별하면 `/admin`이
+ * `/admin/group`·`/admin-group`까지 활성으로 잡아 여러 메뉴가 동시에 켜집니다.
+ */
 export declare const isActivePath: (pathname: string, href: string) => boolean;
 /** 숫자를 정수로 내림 후 천 단위 콤마를 붙인 문자열로 변환합니다 (LDChart 툴팁 표시용). */
 export declare const formatNumberWithComma: (num?: number) => string;

package/dist/utils/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/utils/utils.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY,GAAI,UAAU,MAAM,EAAE,MAAM,MAAM,KAAG,OAG7D,CAAC;AAEF,4DAA4D;AAC5D,eAAO,MAAM,qBAAqB,GAAI,MAAK,MAAU,WAMpD,CAAC;AAEF,iDAAiD;AACjD,eAAO,MAAM,uBAAuB,GAAI,OAAO,MAAM,WAQpD,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/utils/utils.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,eAAO,MAAM,YAAY,GAAI,UAAU,MAAM,EAAE,MAAM,MAAM,KAAG,OAC3C,CAAC;AAEpB,4DAA4D;AAC5D,eAAO,MAAM,qBAAqB,GAAI,MAAK,MAAU,WAMpD,CAAC;AAEF,iDAAiD;AACjD,eAAO,MAAM,uBAAuB,GAAI,OAAO,MAAM,WAQpD,CAAC"}

package/dist/utils/utils.js

@@ -1,8 +1,10 @@
-export const isActivePath = (pathname, href) => {
-    if (href === '/')
-        return pathname === '/';
-    return pathname.startsWith(href);
-};
+/**
+ * 현재 경로가 해당 링크의 경로와 **정확히** 일치하는지 판별합니다.
+ *
+ * 접두사(prefix) 비교는 쓰지 않습니다. `startsWith`로 판별하면 `/admin`이
+ * `/admin/group`·`/admin-group`까지 활성으로 잡아 여러 메뉴가 동시에 켜집니다.
+ */
+export const isActivePath = (pathname, href) => pathname === href;
 /** 숫자를 정수로 내림 후 천 단위 콤마를 붙인 문자열로 변환합니다 (LDChart 툴팁 표시용). */
 export const formatNumberWithComma = (num = 0) => {
     if (isNaN(num)) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loword/loword-design-system",
-  "version": "0.1.3",
+  "version": "0.2.0",
   "description": "로워드 디자인 시스템 컴포넌트 패키지(Tailwind v4)",
   "keywords": [
     "react",
@@ -48,6 +48,10 @@
   },
   "license": "MIT",
   "peerDependencies": {
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/modifiers": "^9.0.0",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
     "@radix-ui/react-accordion": "^1.2.16",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-popover": "^1.1.15",
@@ -88,6 +92,18 @@
     "next": {
       "optional": true
     },
+    "@dnd-kit/core": {
+      "optional": true
+    },
+    "@dnd-kit/modifiers": {
+      "optional": true
+    },
+    "@dnd-kit/sortable": {
+      "optional": true
+    },
+    "@dnd-kit/utilities": {
+      "optional": true
+    },
     "@radix-ui/react-accordion": {
       "optional": true
     },
@@ -186,6 +202,10 @@
     }
   },
   "devDependencies": {
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/modifiers": "^9.0.0",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
     "@eslint/js": "^9.31.0",
     "@hookform/resolvers": "^5.4.0",
     "@radix-ui/react-accordion": "^1.2.16",