@loword/loword-design-system 0.0.18 → 0.1.0

package/dist/components/LDCarousel/CarouselBase.js

@@ -1,5 +1,6 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import AutoHeight from 'embla-carousel-auto-height';
 import AutoScroll from 'embla-carousel-auto-scroll';
 import Autoplay from 'embla-carousel-autoplay';
 import useEmblaCarousel from 'embla-carousel-react';
@@ -15,7 +16,7 @@ const useCarouselContext = () => {
 };
 /** 외부에서 캐러셀 컨트롤(emblaApi)에 접근하고 싶을 때 사용하는 훅 */
 export const useCarousel = useCarouselContext;
-const Root = ({ orientation = 'horizontal', loop = false, autoplay = false, autoScroll = false, align = 'start', containScroll = 'trimSnaps', options, gap = 16, className, style, children, }) => {
+const Root = ({ orientation = 'horizontal', loop = false, autoplay = false, autoScroll = false, autoHeight = false, align = 'start', containScroll = 'trimSnaps', options, gap = 16, className, style, children, }) => {
     // 자동 이동 플러그인 조립. autoScroll(연속 흐름)이 설정되면 autoplay(스텝형)보다 우선.
     const plugins = [];
     if (autoScroll) {
@@ -34,6 +35,9 @@ const Root = ({ orientation = 'horizontal', loop = false, autoplay = false, auto
             stopOnInteraction: c.stopOnInteraction ?? false,
         }));
     }
+    if (autoHeight) {
+        plugins.push(AutoHeight(typeof autoHeight === 'object' ? autoHeight : {}));
+    }
     const [emblaRef, emblaApi] = useEmblaCarousel({
         align,
         loop,
@@ -84,7 +88,10 @@ const Root = ({ orientation = 'horizontal', loop = false, autoplay = false, auto
             scrollTo,
             orientation,
             gap,
-        }, children: _jsx("div", { className: cn('ld-carousel relative', className), style: style, role: "region", "aria-roledescription": "carousel", children: children }) }));
+        }, children: _jsx("div", { className: cn('ld-carousel relative', 
+            // 플러그인이 트랙 높이를 인라인으로 세팅하므로 슬라이드가 늘어나지 않게 해야 한다.
+            // 해당 CSS는 styles/carousel.css 의 .ld-carousel--auto-height 규칙에 있다.
+            autoHeight && 'ld-carousel--auto-height', className), style: style, role: "region", "aria-roledescription": "carousel", children: children }) }));
 };
 const Viewport = ({ className, children }) => {
     const { emblaRef } = useCarouselContext();
@@ -93,7 +100,7 @@ const Viewport = ({ className, children }) => {
 const Container = ({ className, style, children }) => {
     const { orientation, gap } = useCarouselContext();
     const isVertical = orientation === 'vertical';
-    return (_jsx("div", { className: cn('flex', isVertical ? 'flex-col h-full' : 'flex-row', className), 
+    return (_jsx("div", { className: cn('flex', isVertical ? 'h-full flex-col' : 'flex-row', className), 
         // embla 공식 방식: 간격을 Slide 패딩으로 주고, 첫 칸 패딩만 음수 마진으로 상쇄.
         // flex gap과 달리 loop 이음새(마지막↔처음)에도 간격이 유지됨.
         // 세로 고정 높이에선 음수 마진(-gap)만큼 트랙 높이를 늘려야 마지막 슬라이드가 바닥까지 참.
@@ -129,17 +136,13 @@ const Next = ({ className, children, ...props }) => {
 };
 const TopArrows = ({ className, children, ...props }) => {
     const { scrollNext, scrollPrev, canScrollNext, canScrollPrev } = useCarouselContext();
-    return (
-    // ld-carousel__nav-top: 상단 화살표 영역의 고정 훅.
-    // side 화살표의 .ld-carousel__nav 와 같은 역할 — 소비측에서 반응형 제어(예: 모바일에서만 숨김)를
-    // 할 때 마크업 구조(자식 순서 등)에 기대지 않도록 클래스를 제공한다.
-    _jsxs("div", { className: "ld-carousel__nav-top flex flex-row ml-auto", children: [_jsx("button", { type: "button", onClick: scrollPrev, disabled: !canScrollPrev, "aria-label": props['aria-label'] ?? '이전', className: cn('disabled:opacity-40 disabled:cursor-not-allowed cursor-pointer rounded-full size-8 flex justify-center items-center ld-transition', className), children: children ?? _jsx(ChevronLeft, { size: 22, strokeWidth: 1.2 }) }), _jsx("button", { type: "button", onClick: scrollNext, disabled: !canScrollNext, "aria-label": props['aria-label'] ?? '다음', className: cn('disabled:opacity-40 disabled:cursor-not-allowed cursor-pointer rounded-full size-8 flex justify-center items-center ld-transition', className), children: children ?? _jsx(ChevronRight, { size: 22, strokeWidth: 1.2 }) })] }));
+    return (_jsxs("div", { className: "ml-auto flex flex-row", children: [_jsx("button", { type: "button", onClick: scrollPrev, disabled: !canScrollPrev, "aria-label": props['aria-label'] ?? '이전', className: cn('flex size-8 cursor-pointer items-center justify-center rounded-full ld-transition disabled:cursor-not-allowed disabled:opacity-40', className), children: children ?? _jsx(ChevronLeft, { size: 22, strokeWidth: 1.2 }) }), _jsx("button", { type: "button", onClick: scrollNext, disabled: !canScrollNext, "aria-label": props['aria-label'] ?? '다음', className: cn('flex size-8 cursor-pointer items-center justify-center rounded-full ld-transition disabled:cursor-not-allowed disabled:opacity-40', className), children: children ?? _jsx(ChevronRight, { size: 22, strokeWidth: 1.2 }) })] }));
 };
 const Dots = ({ className, dotClassName }) => {
     const { scrollSnaps, selectedIndex, scrollTo } = useCarouselContext();
     return (_jsx("div", { className: cn('flex items-center justify-center gap-2', className), children: scrollSnaps.map((_, i) => {
             const isActive = i === selectedIndex;
-            return (_jsx("button", { type: "button", onClick: () => scrollTo(i), "aria-label": `${i + 1}번째 슬라이드로 이동`, "aria-current": isActive || undefined, className: cn('rounded-full ld-transition cursor-pointer', isActive ? 'w-5 h-2 bg-lb500' : 'w-2 h-2 bg-mono200', dotClassName) }, i));
+            return (_jsx("button", { type: "button", onClick: () => scrollTo(i), "aria-label": `${i + 1}번째 슬라이드로 이동`, "aria-current": isActive || undefined, className: cn('cursor-pointer rounded-full ld-transition', isActive ? 'h-2 w-5 bg-lb500' : 'h-2 w-2 bg-mono200', dotClassName) }, i));
         }) }));
 };
 const Counter = ({ className, format }) => {

package/dist/components/LDCarousel/LDCarousel.d.ts

@@ -1,5 +1,5 @@
 import { type CSSProperties, type ReactNode } from 'react';
-import { type CarouselOrientation, type RootProps } from './CarouselBase.js';
+import { type CarouselOrientation, type RootProps } from '../../components/LDCarousel/CarouselBase.js';
 export interface LDCarouselProps {
     /** 슬라이드로 렌더링할 노드 배열 */
     slides: ReactNode[];
@@ -14,6 +14,8 @@ export interface LDCarouselProps {
     };
     /** 연속 흐름(Auto Scroll). autoplay와 동시 사용 불가, loop와 함께 권장 */
     autoScroll?: RootProps['autoScroll'];
+    /** 트랙 높이를 선택된 슬라이드 높이에 맞춘다. 슬라이드마다 높이가 다를 때 빈 공간을 없앤다 */
+    autoHeight?: RootProps['autoHeight'];
     /** 슬라이드 정렬 위치. 기본 'start'(왼쪽 끝 붙음) */
     align?: RootProps['align'];
     /** 양 끝 빈 공간 처리. 기본 'trimSnaps'(끝 여백 없게 보정) / 'keepSnaps'(보정+개별 스냅 유지) / false(보정 없이 일관 정렬) */
@@ -49,16 +51,16 @@ export interface LDCarouselProps {
  * 고급 커스터마이징이 필요하면 `LDCarousel.Root` 등 compound API를 직접 조합하세요.
  */
 declare const LDCarousel: {
-    ({ slides, orientation, loop, autoplay, autoScroll, align, containScroll, options, arrowPosition, showDots, showCounter, slidesPerView, grid, gap, className, style, viewportClassName, slideClassName, }: LDCarouselProps): import("react/jsx-runtime").JSX.Element;
-    Root: ({ orientation, loop, autoplay, autoScroll, align, containScroll, options, gap, className, style, children, }: RootProps) => import("react/jsx-runtime").JSX.Element;
-    Viewport: ({ className, children }: import("./CarouselBase.js").ViewportProps) => import("react/jsx-runtime").JSX.Element;
-    Container: ({ className, style, children }: import("./CarouselBase.js").ContainerProps) => import("react/jsx-runtime").JSX.Element;
-    Slide: ({ slidesPerView, index, total, className, style, children, }: import("./CarouselBase.js").SlideProps) => import("react/jsx-runtime").JSX.Element;
-    Prev: ({ className, children, ...props }: import("./CarouselBase.js").NavButtonProps) => import("react/jsx-runtime").JSX.Element;
-    Next: ({ className, children, ...props }: import("./CarouselBase.js").NavButtonProps) => import("react/jsx-runtime").JSX.Element;
-    Dots: ({ className, dotClassName }: import("./CarouselBase.js").DotsProps) => import("react/jsx-runtime").JSX.Element;
-    Counter: ({ className, format }: import("./CarouselBase.js").CounterProps) => import("react/jsx-runtime").JSX.Element;
-    TopArrows: ({ className, children, ...props }: import("./CarouselBase.js").NavButtonProps) => import("react/jsx-runtime").JSX.Element;
+    ({ slides, orientation, loop, autoplay, autoScroll, autoHeight, align, containScroll, options, arrowPosition, showDots, showCounter, slidesPerView, grid, gap, className, style, viewportClassName, slideClassName, }: LDCarouselProps): import("react/jsx-runtime").JSX.Element;
+    Root: ({ orientation, loop, autoplay, autoScroll, autoHeight, align, containScroll, options, gap, className, style, children, }: RootProps) => import("react/jsx-runtime").JSX.Element;
+    Viewport: ({ className, children }: import("../../components/LDCarousel/CarouselBase.js").ViewportProps) => import("react/jsx-runtime").JSX.Element;
+    Container: ({ className, style, children }: import("../../components/LDCarousel/CarouselBase.js").ContainerProps) => import("react/jsx-runtime").JSX.Element;
+    Slide: ({ slidesPerView, index, total, className, style, children, }: import("../../components/LDCarousel/CarouselBase.js").SlideProps) => import("react/jsx-runtime").JSX.Element;
+    Prev: ({ className, children, ...props }: import("../../components/LDCarousel/CarouselBase.js").NavButtonProps) => import("react/jsx-runtime").JSX.Element;
+    Next: ({ className, children, ...props }: import("../../components/LDCarousel/CarouselBase.js").NavButtonProps) => import("react/jsx-runtime").JSX.Element;
+    Dots: ({ className, dotClassName }: import("../../components/LDCarousel/CarouselBase.js").DotsProps) => import("react/jsx-runtime").JSX.Element;
+    Counter: ({ className, format }: import("../../components/LDCarousel/CarouselBase.js").CounterProps) => import("react/jsx-runtime").JSX.Element;
+    TopArrows: ({ className, children, ...props }: import("../../components/LDCarousel/CarouselBase.js").NavButtonProps) => import("react/jsx-runtime").JSX.Element;
 };
 export default LDCarousel;
 //# sourceMappingURL=LDCarousel.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"LDCarousel.d.ts","sourceRoot":"","sources":["../../../src/components/LDCarousel/LDCarousel.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAY,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACrE,OAAqB,EACnB,KAAK,mBAAmB,EACxB,KAAK,SAAS,EACf,MAAM,gBAAgB,CAAC;AAGxB,MAAM,WAAW,eAAe;IAC9B,uBAAuB;IACvB,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,gCAAgC;IAChC,WAAW,CAAC,EAAE,mBAAmB,CAAC;IAClC,sBAAsB;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,sDAAsD;IACtD,QAAQ,CAAC,EAAE,OAAO,GAAG;QAAE,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,iBAAiB,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC;IACrE,0DAA0D;IAC1D,UAAU,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;IACrC,sCAAsC;IACtC,KAAK,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAC3B,8FAA8F;IAC9F,aAAa,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,CAAC;IAC3C;+EAC2E;IAC3E,OAAO,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC/B,8DAA8D;IAC9D,aAAa,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gCAAgC;IAChC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,yDAAyD;IACzD,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAChC,mCAAmC;IACnC,IAAI,CAAC,EAAE;QACL;8DACsD;QACtD,IAAI,EAAE,MAAM,CAAC;QACb,8EAA8E;QAC9E,IAAI,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;KACtB,CAAC;IACF,4CAA4C;IAC5C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,wCAAwC;IACxC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED;;;GAGG;AACH,QAAA,MAAM,UAAU;+MAmBb,eAAe;;;;;;;;;;CAyFjB,CAAC;AAYF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"LDCarousel.d.ts","sourceRoot":"","sources":["../../../src/components/LDCarousel/LDCarousel.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAErE,OAAqB,EACnB,KAAK,mBAAmB,EACxB,KAAK,SAAS,EACf,MAAM,sCAAsC,CAAC;AAG9C,MAAM,WAAW,eAAe;IAC9B,uBAAuB;IACvB,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,gCAAgC;IAChC,WAAW,CAAC,EAAE,mBAAmB,CAAC;IAClC,sBAAsB;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,sDAAsD;IACtD,QAAQ,CAAC,EAAE,OAAO,GAAG;QAAE,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,iBAAiB,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC;IACrE,0DAA0D;IAC1D,UAAU,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;IACrC,yDAAyD;IACzD,UAAU,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;IACrC,sCAAsC;IACtC,KAAK,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAC3B,8FAA8F;IAC9F,aAAa,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,CAAC;IAC3C;+EAC2E;IAC3E,OAAO,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC/B,8DAA8D;IAC9D,aAAa,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gCAAgC;IAChC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,yDAAyD;IACzD,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAChC,mCAAmC;IACnC,IAAI,CAAC,EAAE;QACL;8DACsD;QACtD,IAAI,EAAE,MAAM,CAAC;QACb,8EAA8E;QAC9E,IAAI,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;KACtB,CAAC;IACF,4CAA4C;IAC5C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,wCAAwC;IACxC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED;;;GAGG;AACH,QAAA,MAAM,UAAU;2NAoBb,eAAe;;;;;;;;;;CA0FjB,CAAC;AAYF,eAAe,UAAU,CAAC"}

package/dist/components/LDCarousel/LDCarousel.js

@@ -1,20 +1,20 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment } from 'react';
-import CarouselBase from './CarouselBase.js';
+import CarouselBase from '../../components/LDCarousel/CarouselBase.js';
 import cn from '../../utils/cn.js';
 /**
  * embla-carousel 기반 기본 캐러셀.
  * 고급 커스터마이징이 필요하면 `LDCarousel.Root` 등 compound API를 직접 조합하세요.
  */
-const LDCarousel = ({ slides, orientation = 'horizontal', loop = false, autoplay = false, autoScroll = false, align = 'start', containScroll = 'trimSnaps', options, arrowPosition = 'top', showDots = false, showCounter = false, slidesPerView = 'auto', grid, gap = 16, className, style, viewportClassName, slideClassName, }) => {
+const LDCarousel = ({ slides, orientation = 'horizontal', loop = false, autoplay = false, autoScroll = false, autoHeight = false, align = 'start', containScroll = 'trimSnaps', options, arrowPosition = 'top', showDots = false, showCounter = false, slidesPerView = 'auto', grid, gap = 16, className, style, viewportClassName, slideClassName, }) => {
     const isVertical = orientation === 'vertical';
     const rows = grid?.rows ?? 1;
     const columnCount = Math.ceil(slides.length / rows);
     const columns = rows <= 1
         ? slides.map((_, i) => [i])
         : Array.from({ length: columnCount }, (_, col) => Array.from({ length: rows }, (_, row) => grid?.fill === 'col' ? col * rows + row : row * columnCount + col).filter((i) => i < slides.length));
-    return (_jsx(CarouselBase.Root, { orientation: orientation, loop: loop, autoplay: autoplay, autoScroll: autoScroll, align: align, containScroll: containScroll, options: options, gap: gap, className: cn(arrowPosition === 'side' && !isVertical && 'ld-carousel--nav-gutter-x', className), style: style, children: _jsxs("div", { className: "flex flex-col gap-3", children: [arrowPosition === 'top' && _jsx(CarouselBase.TopArrows, {}), _jsxs("div", { className: cn('flex items-center gap-3 w-full relative', isVertical && 'flex-col', isVertical &&
+    return (_jsx(CarouselBase.Root, { orientation: orientation, loop: loop, autoplay: autoplay, autoScroll: autoScroll, autoHeight: autoHeight, align: align, containScroll: containScroll, options: options, gap: gap, className: cn(arrowPosition === 'side' && !isVertical && 'ld-carousel--nav-gutter-x', className), style: style, children: _jsxs("div", { className: "flex flex-col gap-3", children: [arrowPosition === 'top' && _jsx(CarouselBase.TopArrows, {}), _jsxs("div", { className: cn('relative flex w-full items-center gap-3', isVertical && 'flex-col', isVertical &&
                         arrowPosition === 'side' &&
                         'ld-carousel__nav-clearance-y'), children: [arrowPosition === 'side' && _jsx(CarouselBase.Prev, {}), _jsx(CarouselBase.Viewport, { className: cn('w-full', viewportClassName), children: _jsx(CarouselBase.Container, { children: columns.map((column, i) => (_jsx(CarouselBase.Slide, { slidesPerView: slidesPerView, index: i, total: columns.length, className: slideClassName, children: rows <= 1 ? (slides[i]) : (_jsx("div", { className: "grid h-full items-start", style: {
                                             gridTemplateRows: `repeat(${rows}, minmax(0, 1fr))`,

package/dist/components/LDChart/LDChart.d.ts

@@ -1,8 +1,10 @@
+import type { Color, Position } from '../../types/common.js';
+import type { Subset } from '../../types/subset.js';
 /** label 자동 생성 단위. dayjs의 ManipulateType 중 아래 포맷이 정의된 3개만 허용한다. */
 export type LDChartUnit = 'day' | 'month' | 'year';
-export type LDChartPosition = 'left' | 'right';
+export type LDChartPosition = Subset<Position, 'left' | 'right'>;
 /** 시리즈 색상 프리셋. DS 색 팔레트의 500 단계에 대응한다. */
-export type LDChartColor = 'lowordBlue' | 'blue' | 'red' | 'orange' | 'yellow' | 'green' | 'pink' | 'purple';
+export type LDChartColor = Subset<Color, 'lowordBlue' | 'blue' | 'red' | 'orange' | 'yellow' | 'green' | 'pink' | 'purple'>;
 /**
  * LDChart의 props입니다.
  * 원본(mono repo LDChart) 대비 `loader?: string`은 `loading?: boolean`으로,

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

@@ -1 +1 @@
-{"version":3,"file":"LDChart.d.ts","sourceRoot":"","sources":["../../../src/components/LDChart/LDChart.tsx"],"names":[],"mappings":"AAwCA,mEAAmE;AACnE,MAAM,MAAM,WAAW,GAAG,KAAK,GAAG,OAAO,GAAG,MAAM,CAAC;AAQnD,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,OAAO,CAAC;AAE/C,0CAA0C;AAC1C,MAAM,MAAM,YAAY,GACpB,YAAY,GACZ,MAAM,GACN,KAAK,GACL,QAAQ,GACR,QAAQ,GACR,OAAO,GACP,MAAM,GACN,QAAQ,CAAC;AAyCb;;;;;;;GAOG;AACH,MAAM,WAAW,YAAY;IAC3B,oCAAoC;IACpC,QAAQ,EAAE;QACR,qCAAqC;QACrC,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,cAAc;QACd,KAAK,EAAE,MAAM,EAAE,CAAC;QAChB,iDAAiD;QACjD,KAAK,EAAE,MAAM,EAAE,CAAC;KACjB,CAAC;IACF,qDAAqD;IACrD,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,eAAe,CAAC;IAC3B,4CAA4C;IAC5C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,yBAAyB;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wBAAwB;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gDAAgD;IAChD,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,oBAAoB;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,0DAA0D;IAC1D,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED,QAAA,MAAM,OAAO,GAAI,kHAYd,YAAY,4CAwLd,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"LDChart.d.ts","sourceRoot":"","sources":["../../../src/components/LDChart/LDChart.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAe7C,mEAAmE;AACnE,MAAM,MAAM,WAAW,GAAG,KAAK,GAAG,OAAO,GAAG,MAAM,CAAC;AAQnD,MAAM,MAAM,eAAe,GAAG,MAAM,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC,CAAC;AAEjE,0CAA0C;AAC1C,MAAM,MAAM,YAAY,GAAG,MAAM,CAC/B,KAAK,EACH,YAAY,GACZ,MAAM,GACN,KAAK,GACL,QAAQ,GACR,QAAQ,GACR,OAAO,GACP,MAAM,GACN,QAAQ,CACX,CAAC;AAyCF;;;;;;;GAOG;AACH,MAAM,WAAW,YAAY;IAC3B,oCAAoC;IACpC,QAAQ,EAAE;QACR,qCAAqC;QACrC,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,cAAc;QACd,KAAK,EAAE,MAAM,EAAE,CAAC;QAChB,iDAAiD;QACjD,KAAK,EAAE,MAAM,EAAE,CAAC;KACjB,CAAC;IACF,qDAAqD;IACrD,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,eAAe,CAAC;IAC3B,4CAA4C;IAC5C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,yBAAyB;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wBAAwB;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gDAAgD;IAChD,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,oBAAoB;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,0DAA0D;IAC1D,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED,QAAA,MAAM,OAAO,GAAI,kHAYd,YAAY,4CAyLd,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/components/LDChart/LDChart.js

@@ -4,10 +4,10 @@ import { CategoryScale, Chart as ChartJS, Filler, Legend, LinearScale, LineEleme
 import dayjs from 'dayjs';
 import { useMemo } from 'react';
 import { Line } from 'react-chartjs-2';
+import ChartBase from '../../components/LDChart/ChartBase.js';
+import LDSpinner from '../../components/LDSpinner/LDSpinner.js';
 import cn from '../../utils/cn.js';
-import { formatAbbreviatedNumber, formatNumberWithComma, } from '../../utils/utils.js';
-import LDSpinner from '../LDSpinner/LDSpinner.js';
-import ChartBase from './ChartBase.js';
+import { formatAbbreviatedNumber, formatNumberWithComma } from '../../utils/utils.js';
 // 이 컴포넌트에서만 그리는 선(라인) 차트라 BarElement는 등록하지 않는다.
 ChartJS.register(CategoryScale, LinearScale, PointElement, LineElement, Filler, Tooltip, Legend);
 const EMPTY_LABEL_FORMATS = {
@@ -175,9 +175,9 @@ const LDChart = ({ dataList, color = 'lowordBlue', position = 'right', reverseYA
     };
     // 배경은 기본 투명. 필요한 소비처가 rootClassName으로 지정한다.
     // (원본의 bg-mono5는 정의되지 않은 토큰이라 실제로도 투명하게 렌더됐다.)
-    return (_jsx(ChartBase.Root, { className: cn('w-full flex flex-col items-start justify-start rounded-xs', rootClassName), style: rootStyle, children: _jsxs(ChartBase.Viewport, { style: viewportStyle, className: cn('relative', className), children: [_jsx(Line, { height: Number(viewportStyle.height), data: {
+    return (_jsx(ChartBase.Root, { className: cn('flex w-full flex-col items-start justify-start rounded-xs', rootClassName), style: rootStyle, children: _jsxs(ChartBase.Viewport, { style: viewportStyle, className: cn('relative', className), children: [_jsx(Line, { height: Number(viewportStyle.height), "aria-label": "\uCC28\uD2B8", data: {
                         labels: dataList.label.length > 0 ? dataList.label : emptyLabels,
                         datasets: dataSets,
-                    }, options: options, plugins: [intersectDataVerticalLine] }), _jsx(ChartBase.Overlay, { className: cn('absolute inset-0 z-10 flex items-center justify-center', 'bg-white/70 ld-transition', loading ? 'opacity-100' : 'opacity-0 pointer-events-none'), children: _jsx(LDSpinner, { size: 32, className: "text-lb500" }) })] }) }));
+                    }, options: options, plugins: [intersectDataVerticalLine] }), _jsx(ChartBase.Overlay, { className: cn('absolute inset-0 z-10 flex items-center justify-center', 'bg-white/70 ld-transition', loading ? 'opacity-100' : 'pointer-events-none opacity-0'), children: _jsx(LDSpinner, { className: "size-8 text-lb500" }) })] }) }));
 };
 export default LDChart;

package/dist/components/LDCheckbox/CheckboxBase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxBase.d.ts","sourceRoot":"","sources":["../../../src/components/LDCheckbox/CheckboxBase.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,GAAG,EAIT,MAAM,OAAO,CAAC;AAKf,UAAU,mBAAmB;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,eAAe,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC5C,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C;AAID,eAAO,MAAM,kBAAkB,2BAO9B,CAAC;AAGF,UAAU,SAAS;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,OAAO,EAAE,OAAO,KAAK,MAAM,CAAC,CAAC;IACpD,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAiDD,UAAU,gBAAiB,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC;IAC5E,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAqCD,UAAU,cAAc;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAeD,UAAU,UAAU;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAMD,eAAO,MAAM,YAAY;gGA1GtB,SAAS;gEAiDT,gBAAgB;yDAuChB,cAAc;qCAcuB,UAAU;CASjD,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"CheckboxBase.d.ts","sourceRoot":"","sources":["../../../src/components/LDCheckbox/CheckboxBase.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,SAAS,EACd,KAAK,GAAG,EAGT,MAAM,OAAO,CAAC;AAKf,UAAU,mBAAmB;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,eAAe,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC5C,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C;AAID,eAAO,MAAM,kBAAkB,2BAO9B,CAAC;AAGF,UAAU,SAAS;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,OAAO,EAAE,OAAO,KAAK,MAAM,CAAC,CAAC;IACpD,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAiDD,UAAU,gBAAiB,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC;IAC5E,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAqCD,UAAU,cAAc;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAeD,UAAU,UAAU;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAMD,eAAO,MAAM,YAAY;gGA1GtB,SAAS;gEAiDT,gBAAgB;yDAuChB,cAAc;qCAcuB,UAAU;CASjD,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/components/LDCheckbox/CheckboxBase.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import { Check } from 'lucide-react';
 import { createContext, useContext, useState, } from 'react';
 import cn from '../../utils/cn.js';
-import { Check } from 'lucide-react';
 const CheckboxContext = createContext(null);
 export const useCheckboxContext = () => {
     const ctx = useContext(CheckboxContext);
@@ -26,11 +26,11 @@ const Root = ({ checked, defaultChecked = false, onCheckedChange, disabled = fal
             disabled,
             isFocused,
             setIsFocused,
-        }, children: _jsx("label", { style: style, onClick: (e) => e.stopPropagation(), className: cn('flex flex-row w-fit shrink-0', disabled ? 'cursor-not-allowed' : 'cursor-pointer', resolvedClassName), children: children }) }));
+        }, children: _jsx("label", { style: style, onClick: (e) => e.stopPropagation(), className: cn('flex w-fit shrink-0 flex-row', disabled ? 'cursor-not-allowed' : 'cursor-pointer', resolvedClassName), children: children }) }));
 };
 const HiddenInput = ({ ref, onFocus, onBlur, onChange, ...props }) => {
     const { checked, onCheckedChange, disabled, setIsFocused } = useCheckboxContext();
-    return (_jsx("input", { type: "checkbox", ref: ref, className: "sr-only peer", checked: checked, disabled: disabled, onChange: (e) => {
+    return (_jsx("input", { type: "checkbox", ref: ref, className: "peer sr-only", checked: checked, disabled: disabled, onChange: (e) => {
             e.stopPropagation(); // 이벤트 전파 중단
             onCheckedChange(e.target.checked);
             onChange?.(e);

package/dist/components/LDCheckbox/LDCheckbox.d.ts

@@ -1,5 +1,7 @@
 import { type InputHTMLAttributes, type Ref } from 'react';
-export type CheckboxSize = '2xsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+import type { Size } from '../../types/common.js';
+import type { Subset } from '../../types/subset.js';
+export type CheckboxSize = Subset<Size, '2xsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge'>;
 type CheckboxType = 'default' | 'checkbox' | 'pill';
 export interface LDCheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'size' | 'value'> {
     /** 체크 상태 변경 콜백 (boolean) */

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

@@ -1 +1 @@
-{"version":3,"file":"LDCheckbox.d.ts","sourceRoot":"","sources":["../../../src/components/LDCheckbox/LDCheckbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,mBAAmB,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AAK3D,MAAM,MAAM,YAAY,GACpB,SAAS,GACT,QAAQ,GACR,OAAO,GACP,QAAQ,GACR,OAAO,GACP,QAAQ,CAAC;AACb,KAAK,YAAY,GAAG,SAAS,GAAG,UAAU,GAAG,MAAM,CAAC;AAgFpD,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,GAAG,MAAM,GAAG,OAAO,CAC1B;IACC,4BAA4B;IAC5B,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,kBAAkB;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oBAAoB;IACpB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,aAAa;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oBAAoB;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6DAA6D;IAC7D,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,yBAAyB;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mBAAmB;IACnB,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAwGD,QAAA,MAAM,UAAU,GAAI,8IAejB,eAAe,4CAwDjB,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"LDCheckbox.d.ts","sourceRoot":"","sources":["../../../src/components/LDCheckbox/LDCheckbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,mBAAmB,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AAK3D,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAI7C,MAAM,MAAM,YAAY,GAAG,MAAM,CAC/B,IAAI,EACJ,SAAS,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAC/D,CAAC;AACF,KAAK,YAAY,GAAG,SAAS,GAAG,UAAU,GAAG,MAAM,CAAC;AAgFpD,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,GAAG,MAAM,GAAG,OAAO,CAC1B;IACC,4BAA4B;IAC5B,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,kBAAkB;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oBAAoB;IACpB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,aAAa;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oBAAoB;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6DAA6D;IAC7D,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,yBAAyB;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mBAAmB;IACnB,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAwGD,QAAA,MAAM,UAAU,GAAI,8IAejB,eAAe,4CAwDjB,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/components/LDCheckbox/LDCheckbox.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import CheckboxBase, { useCheckboxContext } from './CheckboxBase.js';
+import CheckboxBase, { useCheckboxContext, } from '../../components/LDCheckbox/CheckboxBase.js';
 import cn from '../../utils/cn.js';
 // medium이 기존 단일 사이즈(24) 기준. 위아래로 프리셋을 확장.
 const checkIconSizes = {
@@ -72,23 +72,23 @@ const pillCheckedPad = {
 // ── Inner: Context에서 checked를 읽어 스타일 적용 ──
 const PillInner = ({ size, label, ref, ...props }) => {
     const { checked } = useCheckboxContext();
-    return (_jsxs(_Fragment, { children: [_jsx(CheckboxBase.HiddenInput, { ref: ref, ...props }), _jsxs("div", { className: "relative flex items-center", children: [_jsx(CheckboxBase.Indicator, { iconSize: pillIconSizes[size], className: cn('absolute left-0'), iconClassName: cn('shrink-0 ld-transition', checked ? 'opacity-100' : 'opacity-0') }), label && (_jsx(CheckboxBase.Label, { className: cn('text-nowrap ld-transition', checked ? pillCheckedPad[size] : 'pl-sm pr-sm'), children: label }))] })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(CheckboxBase.HiddenInput, { ref: ref, ...props }), _jsxs("div", { className: "relative flex items-center", children: [_jsx(CheckboxBase.Indicator, { iconSize: pillIconSizes[size], className: cn('absolute left-0'), iconClassName: cn('shrink-0 ld-transition', checked ? 'opacity-100' : 'opacity-0') }), label && (_jsx(CheckboxBase.Label, { className: cn('text-nowrap ld-transition', checked ? pillCheckedPad[size] : 'pr-sm pl-sm'), children: label }))] })] }));
 };
 const DefaultInner = ({ type, size, label, isRequired, ref, ...props }) => {
     const { checked, disabled } = useCheckboxContext();
     return (_jsxs(_Fragment, { children: [_jsx(CheckboxBase.HiddenInput, { ref: ref, ...props }), _jsx(CheckboxBase.Indicator, { iconSize: type === 'checkbox' ? checkboxIconSizes[size] : checkIconSizes[size], className: cn('ld-transition', type === 'checkbox' &&
-                    'border-none outline-2 rounded-[5px] -outline-offset-2 outline-mono300 p-1', type === 'checkbox' && checked && 'bg-lb500 outline-lb500', type === 'checkbox' && disabled && 'bg-mono100 outline-mono100', 'peer-focus-visible:ring-2 peer-focus-visible:ring-lb500 peer-focus-visible:ring-offset-2'), iconClassName: cn('shrink-0 ld-transition', type === 'checkbox'
+                    'rounded-[5px] border-none p-1 outline-2 -outline-offset-2 outline-mono300', type === 'checkbox' && checked && 'bg-lb500 outline-lb500', type === 'checkbox' && disabled && 'bg-mono100 outline-mono100', 'peer-focus-visible:ring-2 peer-focus-visible:ring-lb500 peer-focus-visible:ring-offset-2'), iconClassName: cn('shrink-0 ld-transition', type === 'checkbox'
                     ? checked
                         ? 'text-white'
                         : 'text-transparent'
                     : checked
                         ? 'text-blue400'
-                        : 'text-neutral500') }), isRequired && (_jsx(CheckboxBase.Label, { className: cn('text-blue400 shrink-0 block', labelHeight[size]), children: "\uD544\uC218" })), label && (_jsx(CheckboxBase.Label, { className: cn('text-neutral900 block', labelHeight[size]), children: label }))] }));
+                        : 'text-neutral500') }), isRequired && (_jsx(CheckboxBase.Label, { className: cn('block shrink-0 text-blue400', labelHeight[size]), children: "\uD544\uC218" })), label && (_jsx(CheckboxBase.Label, { className: cn('block text-neutral900', labelHeight[size]), children: label }))] }));
 };
 const LDCheckbox = ({ checked, defaultChecked, onCheckedChange, onChange, size = 'small', label, isRequired = false, type = 'default', itemCenter = false, disabled = false, className, style, ref, ...props }) => {
     if (type === 'pill') {
-        return (_jsx(CheckboxBase.Root, { checked: checked, defaultChecked: defaultChecked, onCheckedChange: onCheckedChange, disabled: disabled, style: style, className: (c) => cn('items-center gap-2 rounded-full ld-transition bold', pillSizeClasses[size], c ? 'bg-tintBlue text-lb500' : 'bg-mono100 text-mono500', disabled && 'opacity-50 cursor-not-allowed', className), children: _jsx(PillInner, { size: size, label: label, ref: ref, onChange: onChange, ...props }) }));
+        return (_jsx(CheckboxBase.Root, { checked: checked, defaultChecked: defaultChecked, onCheckedChange: onCheckedChange, disabled: disabled, style: style, className: (c) => cn('items-center gap-2 rounded-full bold ld-transition', pillSizeClasses[size], c ? 'bg-tintBlue text-lb500' : 'bg-mono100 text-mono500', disabled && 'cursor-not-allowed opacity-50', className), children: _jsx(PillInner, { size: size, label: label, ref: ref, onChange: onChange, ...props }) }));
     }
-    return (_jsx(CheckboxBase.Root, { checked: checked, defaultChecked: defaultChecked, onCheckedChange: onCheckedChange, disabled: disabled, style: style, className: cn('bold items-center ld-transition', itemCenter && 'items-center', labelSizeClasses[size], gapClasses[size], className), children: _jsx(DefaultInner, { type: type, size: size, label: label, isRequired: isRequired, ref: ref, onChange: onChange, ...props }) }));
+    return (_jsx(CheckboxBase.Root, { checked: checked, defaultChecked: defaultChecked, onCheckedChange: onCheckedChange, disabled: disabled, style: style, className: cn('items-center bold ld-transition', itemCenter && 'items-center', labelSizeClasses[size], gapClasses[size], className), children: _jsx(DefaultInner, { type: type, size: size, label: label, isRequired: isRequired, ref: ref, onChange: onChange, ...props }) }));
 };
 export default LDCheckbox;

package/dist/components/LDCheckbox/LDCheckboxGroup.d.ts

@@ -1,5 +1,5 @@
 import type React from 'react';
-import { type CheckboxSize } from './LDCheckbox.js';
+import { type CheckboxSize } from '../../components/LDCheckbox/LDCheckbox.js';
 export interface CheckboxGroupOption {
     label: string;
     value: string;

package/dist/components/LDCheckbox/LDCheckboxGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LDCheckboxGroup.d.ts","sourceRoot":"","sources":["../../../src/components/LDCheckbox/LDCheckboxGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAmB,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAI7D,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAaD,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,mBAAmB,EAAE,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,MAAM,CAAC;IACvC,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED,QAAA,MAAM,eAAe,GAAI,kFAUtB,oBAAoB,4CA+BtB,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"LDCheckboxGroup.d.ts","sourceRoot":"","sources":["../../../src/components/LDCheckbox/LDCheckboxGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAmB,EACjB,KAAK,YAAY,EAClB,MAAM,oCAAoC,CAAC;AAI5C,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAaD,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,mBAAmB,EAAE,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,MAAM,CAAC;IACvC,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED,QAAA,MAAM,eAAe,GAAI,kFAUtB,oBAAoB,4CA+BtB,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/components/LDCheckbox/LDCheckboxGroup.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import LDCheckbox from './LDCheckbox.js';
+import LDCheckbox from '../../components/LDCheckbox/LDCheckbox.js';
 import cn from '../../utils/cn.js';
 // 아이템 간 간격을 사이즈별로 확장 (수평/수직 공통, LDRadioGroup과 동일 스케일)
 const groupGapClasses = {

package/dist/components/LDCheckbox/LDFormCheckbox.d.ts

@@ -1,6 +1,6 @@
 import { type Ref } from 'react';
 import { type RegisterOptions } from 'react-hook-form';
-import { type LDCheckboxProps } from './LDCheckbox.js';
+import { type LDCheckboxProps } from '../../components/LDCheckbox/LDCheckbox.js';
 interface LDFormCheckboxProps extends Omit<LDCheckboxProps, 'checked' | 'name' | 'onCheckedChange'> {
     name: string;
     options?: RegisterOptions;

package/dist/components/LDCheckbox/LDFormCheckbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LDFormCheckbox.d.ts","sourceRoot":"","sources":["../../../src/components/LDCheckbox/LDFormCheckbox.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAmB,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAGhE,UAAU,mBAAoB,SAAQ,IAAI,CACxC,eAAe,EACf,SAAS,GAAG,MAAM,GAAG,iBAAiB,CACvC;IACC,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAC5B,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,QAAA,MAAM,cAAc,GAAI,gEAOrB,mBAAmB,4CAqBrB,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"LDFormCheckbox.d.ts","sourceRoot":"","sources":["../../../src/components/LDCheckbox/LDFormCheckbox.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAEvD,OAAmB,EACjB,KAAK,eAAe,EACrB,MAAM,oCAAoC,CAAC;AAG5C,UAAU,mBAAoB,SAAQ,IAAI,CACxC,eAAe,EACf,SAAS,GAAG,MAAM,GAAG,iBAAiB,CACvC;IACC,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAC5B,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,QAAA,MAAM,cAAc,GAAI,gEAOrB,mBAAmB,4CAqBrB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/LDCheckbox/LDFormCheckbox.js

@@ -1,7 +1,7 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
-import LDCheckbox from './LDCheckbox.js';
-import FormField from '../LDForm/LDFormField.js';
+import LDCheckbox from '../../components/LDCheckbox/LDCheckbox.js';
+import FormField from '../../components/LDForm/LDFormField.js';
 const LDFormCheckbox = ({ name, options, ref, customErrorMessage = '', disabled = false, ...props }) => {
     return (_jsx(FormField, { name: name, options: options, customErrorMessage: customErrorMessage, disabled: disabled, ref: ref, children: ({ field }) => (_jsx(LDCheckbox, { ...props, checked: !!field.value, onCheckedChange: field.onChange, onBlur: field.onBlur, disabled: disabled, ref: field.ref })) }));
 };

package/dist/components/LDCheckbox/LDFormCheckboxGroup.d.ts

@@ -1,5 +1,5 @@
 import { type RegisterOptions } from 'react-hook-form';
-import { type LDCheckboxGroupProps } from './LDCheckboxGroup.js';
+import { type LDCheckboxGroupProps } from '../../components/LDCheckbox/LDCheckboxGroup.js';
 interface LDFormCheckboxGroupProps extends Omit<LDCheckboxGroupProps, 'value' | 'onChange'> {
     name: string;
     options?: RegisterOptions;

package/dist/components/LDCheckbox/LDFormCheckboxGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LDFormCheckboxGroup.d.ts","sourceRoot":"","sources":["../../../src/components/LDCheckbox/LDFormCheckboxGroup.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAwB,EAAE,KAAK,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAG/E,UAAU,wBAAyB,SAAQ,IAAI,CAC7C,oBAAoB,EACpB,OAAO,GAAG,UAAU,CACrB;IACC,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,QAAA,MAAM,mBAAmB,GAAI,2DAM1B,wBAAwB,4CAkB1B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"LDFormCheckboxGroup.d.ts","sourceRoot":"","sources":["../../../src/components/LDCheckbox/LDFormCheckboxGroup.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAEvD,OAAwB,EACtB,KAAK,oBAAoB,EAC1B,MAAM,yCAAyC,CAAC;AAGjD,UAAU,wBAAyB,SAAQ,IAAI,CAC7C,oBAAoB,EACpB,OAAO,GAAG,UAAU,CACrB;IACC,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,QAAA,MAAM,mBAAmB,GAAI,2DAM1B,wBAAwB,4CAkB1B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/components/LDCheckbox/LDFormCheckboxGroup.js

@@ -1,7 +1,7 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
-import LDCheckboxGroup from './LDCheckboxGroup.js';
-import FormField from '../LDForm/LDFormField.js';
+import LDCheckboxGroup from '../../components/LDCheckbox/LDCheckboxGroup.js';
+import FormField from '../../components/LDForm/LDFormField.js';
 const LDFormCheckboxGroup = ({ name, options, customErrorMessage = '', disabled = false, ...props }) => {
     return (_jsx(FormField, { name: name, options: options, customErrorMessage: customErrorMessage, disabled: disabled, children: ({ field }) => (_jsx(LDCheckboxGroup, { ...props, value: field.value ?? [], onChange: field.onChange, disabled: disabled })) }));
 };

package/dist/components/LDDataCalendar/LDDataCalendar.d.ts

@@ -1,5 +1,6 @@
-import type { ReactNode } from 'react';
 import type { Dayjs } from 'dayjs';
+import type { ComponentProps, ReactNode } from 'react';
+import LDDataCalendarBase from '../../components/LDDataCalendar/LDDataCalendarBase.js';
 export interface LDDataCalendarProps {
     className?: string;
     /** 초기 표시 월 */
@@ -19,11 +20,28 @@ export interface LDDataCalendarProps {
     /** 선택 상세(모바일 Detail 슬롯). 지정 시 그리드 아래에 Detail 렌더 */
     renderDetail?: (date: Dayjs | null) => ReactNode;
 }
+export type LDDataCalendarRootProps = ComponentProps<typeof LDDataCalendarBase.Root>;
+export type LDDataCalendarHeaderProps = ComponentProps<'div'>;
+export type LDDataCalendarPrevProps = ComponentProps<typeof LDDataCalendarBase.Prev>;
+export type LDDataCalendarTitleProps = ComponentProps<typeof LDDataCalendarBase.Title>;
+export type LDDataCalendarNextProps = ComponentProps<typeof LDDataCalendarBase.Next>;
+export type LDDataCalendarGridProps = ComponentProps<typeof LDDataCalendarBase.Grid>;
+export type LDDataCalendarCellProps = ComponentProps<typeof LDDataCalendarBase.Cell>;
+export type LDDataCalendarDetailProps = ComponentProps<typeof LDDataCalendarBase.Detail>;
 /**
- * LDDataCalendar — DataCalendarBase 컴파운드를 조립한 표시 전용 데이터 달력.
- * 헤더(Prev·Title·Next)·그리드·셀 스타일은 컴포넌트가 제공하고,
- * 날짜별 데이터는 `renderCell`, 선택 상세는 `renderDetail`로 주입한다.
+ * 일반적인 데이터 달력 구성을 제공하는 Styled Single 컴포넌트입니다.
+ * 날짜별 데이터는 `renderCell`, 선택 상세는 `renderDetail`로 주입합니다.
  */
-declare const LDDataCalendar: ({ className, defaultMonth, onMonthChange, selectable, defaultSelectedDate, onSelectDate, weekdays, renderCell, renderDetail, }: LDDataCalendarProps) => import("react/jsx-runtime").JSX.Element;
+declare const LDDataCalendar: {
+    ({ className, defaultMonth, onMonthChange, selectable, defaultSelectedDate, onSelectDate, weekdays, renderCell, renderDetail, }: LDDataCalendarProps): import("react/jsx-runtime").JSX.Element;
+    Root: ({ className, ...props }: LDDataCalendarRootProps) => import("react/jsx-runtime").JSX.Element;
+    Header: ({ className, ...props }: LDDataCalendarHeaderProps) => import("react/jsx-runtime").JSX.Element;
+    Prev: ({ children, className, ...props }: LDDataCalendarPrevProps) => import("react/jsx-runtime").JSX.Element;
+    Title: ({ className, ...props }: LDDataCalendarTitleProps) => import("react/jsx-runtime").JSX.Element;
+    Next: ({ children, className, ...props }: LDDataCalendarNextProps) => import("react/jsx-runtime").JSX.Element;
+    Grid: ({ weekdayClassName, ...props }: LDDataCalendarGridProps) => import("react/jsx-runtime").JSX.Element;
+    Cell: ({ className, dateClassName, ...props }: LDDataCalendarCellProps) => import("react/jsx-runtime").JSX.Element;
+    Detail: ({ className, ...props }: LDDataCalendarDetailProps) => import("react/jsx-runtime").JSX.Element;
+};
 export default LDDataCalendar;
 //# sourceMappingURL=LDDataCalendar.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"LDDataCalendar.d.ts","sourceRoot":"","sources":["../../../src/components/LDDataCalendar/LDDataCalendar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC;AAKnC,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc;IACd,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,gBAAgB;IAChB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACvC,wCAAwC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe;IACf,mBAAmB,CAAC,EAAE,KAAK,CAAC;IAC5B,iBAAiB;IACjB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAC;IACrC,qBAAqB;IACrB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,wDAAwD;IACxD,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,KAAK,SAAS,CAAC;IAC5D,mDAAmD;IACnD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,GAAG,IAAI,KAAK,SAAS,CAAC;CAClD;AAKD;;;;GAIG;AACH,QAAA,MAAM,cAAc,GAAI,gIAUrB,mBAAmB,4CA2CrB,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"LDDataCalendar.d.ts","sourceRoot":"","sources":["../../../src/components/LDDataCalendar/LDDataCalendar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,OAAO,kBAAkB,MAAM,gDAAgD,CAAC;AAGhF,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc;IACd,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,gBAAgB;IAChB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACvC,wCAAwC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe;IACf,mBAAmB,CAAC,EAAE,KAAK,CAAC;IAC5B,iBAAiB;IACjB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAC;IACrC,qBAAqB;IACrB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,wDAAwD;IACxD,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,KAAK,SAAS,CAAC;IAC5D,mDAAmD;IACnD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,GAAG,IAAI,KAAK,SAAS,CAAC;CAClD;AAED,MAAM,MAAM,uBAAuB,GAAG,cAAc,CAClD,OAAO,kBAAkB,CAAC,IAAI,CAC/B,CAAC;AACF,MAAM,MAAM,yBAAyB,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;AAC9D,MAAM,MAAM,uBAAuB,GAAG,cAAc,CAClD,OAAO,kBAAkB,CAAC,IAAI,CAC/B,CAAC;AACF,MAAM,MAAM,wBAAwB,GAAG,cAAc,CACnD,OAAO,kBAAkB,CAAC,KAAK,CAChC,CAAC;AACF,MAAM,MAAM,uBAAuB,GAAG,cAAc,CAClD,OAAO,kBAAkB,CAAC,IAAI,CAC/B,CAAC;AACF,MAAM,MAAM,uBAAuB,GAAG,cAAc,CAClD,OAAO,kBAAkB,CAAC,IAAI,CAC/B,CAAC;AACF,MAAM,MAAM,uBAAuB,GAAG,cAAc,CAClD,OAAO,kBAAkB,CAAC,IAAI,CAC/B,CAAC;AACF,MAAM,MAAM,yBAAyB,GAAG,cAAc,CACpD,OAAO,kBAAkB,CAAC,MAAM,CACjC,CAAC;AAyFF;;;GAGG;AACH,QAAA,MAAM,cAAc;qIAUjB,mBAAmB;oCAjGiB,uBAAuB;sCAQrB,yBAAyB;8CAQjB,uBAAuB;qCAOhC,wBAAwB;8CAWf,uBAAuB;2CAO1B,uBAAuB;mDAelE,uBAAuB;sCAiBe,yBAAyB;CAgDjE,CAAC;AAWF,eAAe,cAAc,CAAC"}

package/dist/components/LDDataCalendar/LDDataCalendar.js

@@ -1,13 +1,36 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ChevronLeft, ChevronRight } from 'lucide-react';
+import LDDataCalendarBase from '../../components/LDDataCalendar/LDDataCalendarBase.js';
 import cn from '../../utils/cn.js';
-import LDDataCalendarBase from './LDDataCalendarBase.js';
 const navButtonClass = 'flex items-center justify-center rounded-full size-[30px] bg-neutral100 hover:bg-mono400 text-neutral500 hover:text-neutral900 ld-transition cursor-pointer';
+/** 달력의 월과 선택 상태를 관리하는 Styled Compound 루트입니다. */
+const Root = ({ className, ...props }) => (_jsx(LDDataCalendarBase.Root, { className: cn('w-full select-none', className), ...props }));
+/** 월 이동 버튼과 현재 월 제목을 배치하는 헤더입니다. */
+const Header = ({ className, ...props }) => (_jsx("div", { className: cn('mb-md flex items-center justify-between', className), ...props }));
+/** 이전 달로 이동하는 버튼입니다. 기본 접근성 이름은 `이전 달`입니다. */
+const Prev = ({ children, className, ...props }) => (_jsx(LDDataCalendarBase.Prev, { className: cn(navButtonClass, className), ...props, children: children === undefined ? _jsx(ChevronLeft, { size: 15, "aria-hidden": true }) : children }));
+/** 현재 표시 중인 월 제목입니다. */
+const Title = ({ className, ...props }) => (_jsx(LDDataCalendarBase.Title, { className: cn('flex justify-center display32 bold mobile:display20', className), ...props }));
+/** 다음 달로 이동하는 버튼입니다. 기본 접근성 이름은 `다음 달`입니다. */
+const Next = ({ children, className, ...props }) => (_jsx(LDDataCalendarBase.Next, { className: cn(navButtonClass, className), ...props, children: children === undefined ? _jsx(ChevronRight, { size: 16, "aria-hidden": true }) : children }));
+/** 요일과 날짜 셀을 7열로 렌더링하는 그리드입니다. */
+const Grid = ({ weekdayClassName, ...props }) => (_jsx(LDDataCalendarBase.Grid, { weekdayClassName: cn('py-[10px] display14 text-mono500 mobile:py-1 mobile:display12', weekdayClassName), ...props }));
+/** 날짜와 해당 날짜의 데이터를 표시하는 셀입니다. */
+const Cell = ({ className, dateClassName, ...props }) => (_jsx(LDDataCalendarBase.Cell, { className: cn('flex min-h-[100px] flex-col gap-[15px] py-[10px] data-outside:*:text-mono400 mobile:min-h-13 mobile:gap-1 mobile:py-1', 'ld-transition data-selectable:cursor-pointer data-selectable:rounded-[5px] data-selectable:hover:bg-mono100', 'data-[selected=true]:bg-tintBlue data-[selected=true]:hover:bg-tintBlue', className), dateClassName: cn('self-start display16 leading-none font-normal data-outside:font-normal data-outside:text-mono400 data-weekend:text-danger600 data-outside:data-weekend:text-danger400 mobile:display12', dateClassName), ...props }));
+/** 선택한 날짜의 상세 내용을 표시하는 모바일 영역입니다. */
+const Detail = ({ className, ...props }) => (_jsx(LDDataCalendarBase.Detail, { className: cn('mt-md hidden rounded-[10px] bg-mono50 p-md mobile:block', className), ...props }));
 /**
- * LDDataCalendar — DataCalendarBase 컴파운드를 조립한 표시 전용 데이터 달력.
- * 헤더(Prev·Title·Next)·그리드·셀 스타일은 컴포넌트가 제공하고,
- * 날짜별 데이터는 `renderCell`, 선택 상세는 `renderDetail`로 주입한다.
+ * 일반적인 데이터 달력 구성을 제공하는 Styled Single 컴포넌트입니다.
+ * 날짜별 데이터는 `renderCell`, 선택 상세는 `renderDetail`로 주입합니다.
  */
-const LDDataCalendar = ({ className, defaultMonth, onMonthChange, selectable, defaultSelectedDate, onSelectDate, weekdays, renderCell, renderDetail, }) => (_jsxs(LDDataCalendarBase.Root, { className: cn('w-full select-none', className), defaultMonth: defaultMonth, onMonthChange: onMonthChange, selectable: selectable, defaultSelectedDate: defaultSelectedDate, onSelectDate: onSelectDate, children: [_jsxs("div", { className: "flex items-center justify-between mb-md", children: [_jsx(LDDataCalendarBase.Prev, { className: navButtonClass, children: _jsx(ChevronLeft, { size: 15 }) }), _jsx(LDDataCalendarBase.Title, { className: "display32 mobile:display20 bold flex justify-center" }), _jsx(LDDataCalendarBase.Next, { className: navButtonClass, children: _jsx(ChevronRight, { size: 16 }) })] }), _jsx(LDDataCalendarBase.Grid, { weekdays: weekdays, weekdayClassName: "display14 mobile:display12 text-mono500 py-[10px] mobile:py-1", renderCell: (date, _i, isOutside) => (_jsx(LDDataCalendarBase.Cell, { date: date, isOutside: isOutside, className: cn('min-h-[100px] mobile:min-h-13 py-[10px] mobile:py-1 flex flex-col gap-[15px] mobile:gap-1 data-outside:*:text-mono400', 'data-selectable:cursor-pointer data-selectable:hover:bg-mono100 data-selectable:rounded-[5px] ld-transition', 'data-[selected=true]:bg-tintBlue data-[selected=true]:hover:bg-tintBlue'), dateClassName: "display16 mobile:display12 font-normal self-start leading-none data-[outside]:text-mono400 data-[outside]:font-normal data-[weekend]:text-danger600 data-[outside]:data-[weekend]:text-danger200", children: renderCell?.(date, isOutside) }, date.format('YYYY-MM-DD'))) }), renderDetail && (_jsx(LDDataCalendarBase.Detail, { className: "hidden mobile:block mt-md p-md rounded-[10px] bg-mono50", children: renderDetail }))] }));
+const LDDataCalendar = ({ className, defaultMonth, onMonthChange, selectable, defaultSelectedDate, onSelectDate, weekdays, renderCell, renderDetail, }) => (_jsxs(Root, { className: className, defaultMonth: defaultMonth, onMonthChange: onMonthChange, selectable: selectable, defaultSelectedDate: defaultSelectedDate, onSelectDate: onSelectDate, children: [_jsxs(Header, { children: [_jsx(Prev, {}), _jsx(Title, {}), _jsx(Next, {})] }), _jsx(Grid, { weekdays: weekdays, renderCell: (date, _i, isOutside) => (_jsx(Cell, { date: date, isOutside: isOutside, children: renderCell?.(date, isOutside) }, date.format('YYYY-MM-DD'))) }), renderDetail && _jsx(Detail, { children: renderDetail })] }));
+LDDataCalendar.Root = Root;
+LDDataCalendar.Header = Header;
+LDDataCalendar.Prev = Prev;
+LDDataCalendar.Title = Title;
+LDDataCalendar.Next = Next;
+LDDataCalendar.Grid = Grid;
+LDDataCalendar.Cell = Cell;
+LDDataCalendar.Detail = Detail;
 export default LDDataCalendar;

package/dist/components/LDDataCalendar/LDDataCalendarBase.d.ts

@@ -1,5 +1,5 @@
 import { type Dayjs } from 'dayjs';
-import type { ReactNode } from 'react';
+import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
 interface DataCalendarContextType {
     month: Dayjs;
     changeMonth: (delta: number) => void;
@@ -21,14 +21,10 @@ interface RootProps {
     /** 선택 변경 시 호출 */
     onSelectDate?: (date: Dayjs) => void;
 }
-interface TitleProps {
-    className?: string;
+interface TitleProps extends Omit<ComponentPropsWithoutRef<'span'>, 'children'> {
     format?: string;
 }
-interface NavButtonProps {
-    children?: ReactNode;
-    className?: string;
-}
+type NavButtonProps = Omit<ComponentPropsWithoutRef<'button'>, 'type' | 'onClick'>;
 interface GridProps {
     renderCell: (date: Dayjs, index: number, isOutside: boolean) => ReactNode;
     weekdays?: string[];
@@ -50,9 +46,9 @@ interface DetailProps {
 }
 declare const LDDataCalendarBase: {
     Root: ({ children, className, defaultMonth, onMonthChange, selectable, defaultSelectedDate, onSelectDate, }: RootProps) => import("react/jsx-runtime").JSX.Element;
-    Title: ({ className, format }: TitleProps) => import("react/jsx-runtime").JSX.Element;
-    Prev: ({ children, className }: NavButtonProps) => import("react/jsx-runtime").JSX.Element;
-    Next: ({ children, className }: NavButtonProps) => import("react/jsx-runtime").JSX.Element;
+    Title: ({ format, "aria-live": ariaLive, ...props }: TitleProps) => import("react/jsx-runtime").JSX.Element;
+    Prev: ({ children, "aria-label": ariaLabel, ...props }: NavButtonProps) => import("react/jsx-runtime").JSX.Element;
+    Next: ({ children, "aria-label": ariaLabel, ...props }: NavButtonProps) => import("react/jsx-runtime").JSX.Element;
     Grid: ({ renderCell, weekdays, className, weekdayClassName, }: GridProps) => import("react/jsx-runtime").JSX.Element;
     Cell: ({ date, isOutside, children, className, dateClassName, }: CellProps) => import("react/jsx-runtime").JSX.Element;
     Detail: ({ children, className }: DetailProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/LDDataCalendar/LDDataCalendarBase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LDDataCalendarBase.d.ts","sourceRoot":"","sources":["../../../src/components/LDDataCalendar/LDDataCalendarBase.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAE,KAAK,KAAK,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAC;AAItD,UAAU,uBAAuB;IAC/B,KAAK,EAAE,KAAK,CAAC;IACb,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,8DAA8D;IAC9D,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,oDAAoD;IACpD,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAC;CACpC;AAID,eAAO,MAAM,sBAAsB,+BAOlC,CAAC;AAIF,UAAU,SAAS;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACvC,6CAA6C;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe;IACf,mBAAmB,CAAC,EAAE,KAAK,CAAC;IAC5B,iBAAiB;IACjB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAC;CACtC;AA6CD,UAAU,UAAU;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AASD,UAAU,cAAc;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAwBD,UAAU,SAAS;IACjB,UAAU,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,KAAK,SAAS,CAAC;IAC1E,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAgDD,UAAU,SAAS;IACjB,IAAI,EAAE,KAAK,CAAC;IACZ,uCAAuC;IACvC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAoDD,UAAU,WAAW;IACnB,wCAAwC;IACxC,QAAQ,EAAE,CAAC,YAAY,EAAE,KAAK,GAAG,IAAI,KAAK,SAAS,CAAC;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AASD,QAAA,MAAM,kBAAkB;iHAvMrB,SAAS;mCAwCuC,UAAU;oCAYtB,cAAc;oCASd,cAAc;mEAyBlD,SAAS;qEAwDT,SAAS;sCAkD6B,WAAW;CAOsB,CAAC;AAE3E,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"LDDataCalendarBase.d.ts","sourceRoot":"","sources":["../../../src/components/LDDataCalendar/LDDataCalendarBase.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAE,KAAK,KAAK,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EACL,KAAK,wBAAwB,EAG7B,KAAK,SAAS,EAGf,MAAM,OAAO,CAAC;AAIf,UAAU,uBAAuB;IAC/B,KAAK,EAAE,KAAK,CAAC;IACb,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,8DAA8D;IAC9D,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,oDAAoD;IACpD,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAC;CACpC;AAID,eAAO,MAAM,sBAAsB,+BAOlC,CAAC;AAIF,UAAU,SAAS;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACvC,6CAA6C;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe;IACf,mBAAmB,CAAC,EAAE,KAAK,CAAC;IAC5B,iBAAiB;IACjB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAC;CACtC;AA6CD,UAAU,UAAW,SAAQ,IAAI,CAC/B,wBAAwB,CAAC,MAAM,CAAC,EAChC,UAAU,CACX;IACC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAiBD,KAAK,cAAc,GAAG,IAAI,CACxB,wBAAwB,CAAC,QAAQ,CAAC,EAClC,MAAM,GAAG,SAAS,CACnB,CAAC;AA0CF,UAAU,SAAS;IACjB,UAAU,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,KAAK,SAAS,CAAC;IAC1E,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAgDD,UAAU,SAAS;IACjB,IAAI,EAAE,KAAK,CAAC;IACZ,uCAAuC;IACvC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAoDD,UAAU,WAAW;IACnB,wCAAwC;IACxC,QAAQ,EAAE,CAAC,YAAY,EAAE,KAAK,GAAG,IAAI,KAAK,SAAS,CAAC;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AASD,QAAA,MAAM,kBAAkB;iHAnOrB,SAAS;yDA8CT,UAAU;4DAoBV,cAAc;4DAkBd,cAAc;mEA8Bd,SAAS;qEAwDT,SAAS;sCAkD6B,WAAW;CAOsB,CAAC;AAE3E,eAAe,kBAAkB,CAAC"}

package/dist/components/LDDataCalendar/LDDataCalendarBase.js

@@ -1,7 +1,7 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import dayjs from 'dayjs';
-import { createContext, useContext, useState } from 'react';
+import { createContext, useContext, useState, } from 'react';
 const DataCalendarContext = createContext(null);
 export const useDataCalendarContext = () => {
     const ctx = useContext(DataCalendarContext);
@@ -28,17 +28,17 @@ const Root = ({ children, className, defaultMonth, onMonthChange, selectable = f
             selectDate: selectable ? selectDate : undefined,
         }, children: _jsx("div", { className: className, children: children }) }));
 };
-const Title = ({ className, format = 'YYYY년 M월' }) => {
+const Title = ({ format = 'YYYY년 M월', 'aria-live': ariaLive = 'polite', ...props }) => {
     const { month } = useDataCalendarContext();
-    return _jsx("span", { className: className, children: month.format(format) });
+    return (_jsx("span", { ...props, "aria-live": ariaLive, children: month.format(format) }));
 };
-const Prev = ({ children, className }) => {
+const Prev = ({ children, 'aria-label': ariaLabel = '이전 달', ...props }) => {
     const { changeMonth } = useDataCalendarContext();
-    return (_jsx("button", { type: "button", onClick: () => changeMonth(-1), className: className, children: children }));
+    return (_jsx("button", { ...props, type: "button", "aria-label": ariaLabel, onClick: () => changeMonth(-1), children: children }));
 };
-const Next = ({ children, className }) => {
+const Next = ({ children, 'aria-label': ariaLabel = '다음 달', ...props }) => {
     const { changeMonth } = useDataCalendarContext();
-    return (_jsx("button", { type: "button", onClick: () => changeMonth(1), className: className, children: children }));
+    return (_jsx("button", { ...props, type: "button", "aria-label": ariaLabel, onClick: () => changeMonth(1), children: children }));
 };
 // ── Grid ──
 const DEFAULT_WEEKDAYS = ['일', '월', '화', '수', '목', '금', '토'];