@hua-labs/ui 2.2.0 → 2.3.0

package/dist/interactive/kanban.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Kanban Board Components
+ *
+ * 칸반 보드 컴포넌트 엔트리 포인트입니다.
+ * @dnd-kit 의존성이 격리되어 있어, 칸반을 사용하지 않는 번들에 영향을 주지 않습니다.
+ *
+ * @example
+ * import { KanbanBoard, KanbanColumn, KanbanCard } from '@hua-labs/ui/interactive/kanban';
+ */
+export { KanbanBoard, KanbanColumn, KanbanColumnHeader, KanbanCard, KanbanAddCard, KanbanAddColumn, KanbanDropIndicator, KanbanProvider, useKanban, KanbanContext, } from "../components/dashboard/kanban";
+export type { KanbanColumnType, KanbanCardType, KanbanPriority, KanbanAssignee, KanbanDragType, KanbanDragData, KanbanCardMoveEvent, KanbanColumnMoveEvent, KanbanBoardProps, KanbanColumnProps, KanbanColumnHeaderProps, KanbanCardProps, KanbanAddCardProps, KanbanAddColumnProps, KanbanDropIndicatorProps, } from "../components/dashboard/kanban";
+//# sourceMappingURL=kanban.d.ts.map

package/dist/interactive/kanban.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"kanban.d.ts","sourceRoot":"","sources":["../../src/interactive/kanban.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,OAAO,EACL,WAAW,EACX,YAAY,EACZ,kBAAkB,EAClB,UAAU,EACV,aAAa,EACb,eAAe,EACf,mBAAmB,EACnB,cAAc,EACd,SAAS,EACT,aAAa,GACd,MAAM,gCAAgC,CAAC;AACxC,YAAY,EACV,gBAAgB,EAChB,cAAc,EACd,cAAc,EACd,cAAc,EACd,cAAc,EACd,cAAc,EACd,mBAAmB,EACnB,qBAAqB,EACrB,gBAAgB,EAChB,iBAAiB,EACjB,uBAAuB,EACvB,eAAe,EACf,kBAAkB,EAClB,oBAAoB,EACpB,wBAAwB,GACzB,MAAM,gCAAgC,CAAC"}

package/dist/interactive-kanban.d.mts

@@ -0,0 +1,378 @@
+import React$1 from 'react';
+import { C as Color, E as ExtendedVariant } from './common-Bej8Okcg.mjs';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+/**
+ * Kanban Board 타입 정의
+ * @module kanban/types
+ */
+
+/**
+ * 칸반 컬럼 인터페이스
+ */
+interface KanbanColumn$1 {
+    /** 컬럼 고유 ID */
+    id: string;
+    /** 컬럼 제목 */
+    title: string;
+    /** 컬럼 색상 */
+    color?: Color;
+    /** WIP(Work In Progress) 제한 - 최대 카드 수 */
+    limit?: number;
+    /** 컬럼 접힘 상태 */
+    collapsed?: boolean;
+}
+/**
+ * 칸반 카드 우선순위
+ */
+type KanbanPriority = "low" | "medium" | "high" | "urgent";
+/**
+ * 칸반 카드 담당자 인터페이스
+ */
+interface KanbanAssignee {
+    /** 담당자 이름 */
+    name: string;
+    /** 담당자 아바타 이미지 URL */
+    avatar?: string;
+}
+/**
+ * 칸반 카드 인터페이스
+ */
+interface KanbanCard$1 {
+    /** 카드 고유 ID */
+    id: string;
+    /** 소속 컬럼 ID */
+    columnId: string;
+    /** 정렬 순서 (낮을수록 위) */
+    order?: number;
+    /** 카드 제목 */
+    title: string;
+    /** 카드 설명 */
+    description?: string;
+    /** 우선순위 */
+    priority?: KanbanPriority;
+    /** 태그 목록 */
+    tags?: string[];
+    /** 담당자 */
+    assignee?: KanbanAssignee;
+    /** 마감일 */
+    dueDate?: Date | string;
+    /** 추가 메타데이터 */
+    metadata?: Record<string, unknown>;
+}
+/**
+ * 드래그 타입
+ */
+type KanbanDragType = "card" | "column";
+/**
+ * 드래그 데이터 인터페이스
+ */
+interface KanbanDragData {
+    /** 드래그 타입 */
+    type: KanbanDragType;
+    /** 드래그 대상 ID */
+    id: string;
+    /** 소스 컬럼 ID (카드 드래그 시) */
+    columnId?: string;
+    /** 소스 인덱스 */
+    sourceIndex?: number;
+}
+/**
+ * 카드 이동 이벤트 인터페이스
+ */
+interface KanbanCardMoveEvent {
+    /** 카드 ID */
+    cardId: string;
+    /** 출발 컬럼 ID */
+    fromColumnId: string;
+    /** 도착 컬럼 ID */
+    toColumnId: string;
+    /** 새 인덱스 */
+    toIndex: number;
+}
+/**
+ * 컬럼 이동 이벤트 인터페이스
+ */
+interface KanbanColumnMoveEvent {
+    /** 컬럼 ID */
+    columnId: string;
+    /** 새 인덱스 */
+    toIndex: number;
+}
+/**
+ * KanbanBoard Props 인터페이스
+ */
+interface KanbanBoardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "className"> {
+    /** 컬럼 목록 (controlled) */
+    columns?: KanbanColumn$1[];
+    /** 카드 목록 (controlled) */
+    cards?: KanbanCard$1[];
+    /** 기본 컬럼 목록 (uncontrolled) */
+    defaultColumns?: KanbanColumn$1[];
+    /** 기본 카드 목록 (uncontrolled) */
+    defaultCards?: KanbanCard$1[];
+    /** 컬럼 변경 콜백 */
+    onColumnsChange?: (columns: KanbanColumn$1[]) => void;
+    /** 카드 변경 콜백 */
+    onCardsChange?: (cards: KanbanCard$1[]) => void;
+    /** 카드 이동 콜백 */
+    onCardMove?: (event: KanbanCardMoveEvent) => void;
+    /** 컬럼 이동 콜백 */
+    onColumnMove?: (event: KanbanColumnMoveEvent) => void;
+    /** 카드 추가 콜백 */
+    onCardAdd?: (columnId: string, card: Partial<KanbanCard$1>) => void;
+    /** 카드 삭제 콜백 */
+    onCardDelete?: (cardId: string) => void;
+    /** 카드 수정 콜백 */
+    onCardUpdate?: (cardId: string, updates: Partial<KanbanCard$1>) => void;
+    /** 컬럼 추가 콜백 */
+    onColumnAdd?: (column: Partial<KanbanColumn$1>) => void;
+    /** 컬럼 삭제 콜백 */
+    onColumnDelete?: (columnId: string) => void;
+    /** 컬럼 수정 콜백 */
+    onColumnUpdate?: (columnId: string, updates: Partial<KanbanColumn$1>) => void;
+    /** 카드 클릭 콜백 */
+    onCardClick?: (card: KanbanCard$1) => void;
+    /** 스타일 variant */
+    variant?: ExtendedVariant;
+    /** 기본 색상 */
+    color?: Color;
+    /** 컬럼 추가 버튼 표시 */
+    allowAddColumn?: boolean;
+    /** 카드 추가 버튼 표시 */
+    allowAddCard?: boolean;
+    /** 컬럼 드래그 허용 */
+    allowColumnDrag?: boolean;
+    /** 카드 드래그 허용 */
+    allowCardDrag?: boolean;
+    /** 읽기 전용 */
+    readOnly?: boolean;
+    /** 컬럼 최소 너비 */
+    columnMinWidth?: number;
+    /** 컬럼 최대 너비 */
+    columnMaxWidth?: number;
+    /** 드래그 시 배경 딤드 효과 표시 */
+    showDragOverlay?: boolean;
+    /** 딤드 오버레이 인라인 스타일 */
+    dragOverlayStyle?: React.CSSProperties;
+    /** 드래그 중인 카드 회전 각도 (기본: 3) */
+    dragRotation?: number;
+    /** 드래그 중인 카드 스케일 (기본: 1.05) */
+    dragScale?: number;
+    /** dot 유틸리티 스타일 */
+    dot?: string;
+    /** 칸반 드래그 시작 콜백 */
+    onKanbanDragStart?: (type: "card" | "column", id: string) => void;
+    /** 칸반 드래그 종료 콜백 */
+    onKanbanDragEnd?: (type: "card" | "column", id: string) => void;
+}
+/**
+ * KanbanColumn Props 인터페이스
+ */
+interface KanbanColumnProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "id" | "className"> {
+    /** 컬럼 데이터 */
+    column: KanbanColumn$1;
+    /** 컬럼 내 카드 목록 */
+    cards: KanbanCard$1[];
+    /** 컬럼 인덱스 */
+    index: number;
+    /** dot 유틸리티 스타일 */
+    dot?: string;
+}
+/**
+ * KanbanColumnHeader Props 인터페이스
+ */
+interface KanbanColumnHeaderProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "className"> {
+    /** 컬럼 데이터 */
+    column: KanbanColumn$1;
+    /** 카드 수 */
+    cardCount: number;
+    /** 제목 수정 콜백 */
+    onTitleChange?: (title: string) => void;
+    /** 컬럼 삭제 콜백 */
+    onDelete?: () => void;
+    /** 컬럼 접기/펼치기 콜백 */
+    onToggleCollapse?: () => void;
+    /** 드래그 핸들 props (제목 영역에 적용) */
+    dragHandleProps?: Omit<React.HTMLAttributes<HTMLDivElement>, "className">;
+    /** dot 유틸리티 스타일 */
+    dot?: string;
+}
+/**
+ * KanbanCard Props 인터페이스
+ */
+interface KanbanCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "id" | "className"> {
+    /** 카드 데이터 */
+    card: KanbanCard$1;
+    /** 카드 인덱스 */
+    index: number;
+    /** 드래그 중 여부 */
+    isDragging?: boolean;
+    /** 드래그 오버 여부 */
+    isOver?: boolean;
+    /** dot 유틸리티 스타일 */
+    dot?: string;
+}
+/**
+ * KanbanAddCard Props 인터페이스
+ */
+interface KanbanAddCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onSubmit" | "className"> {
+    /** 컬럼 ID */
+    columnId: string;
+    /** 카드 추가 콜백 */
+    onAdd?: (card: Partial<KanbanCard$1>) => void;
+    /** 취소 콜백 */
+    onCancel?: () => void;
+    /** 플레이스홀더 텍스트 */
+    placeholder?: string;
+    /** dot 유틸리티 스타일 */
+    dot?: string;
+}
+/**
+ * KanbanAddColumn Props 인터페이스
+ */
+interface KanbanAddColumnProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onSubmit" | "className"> {
+    /** 컬럼 추가 콜백 */
+    onAdd?: (column: Partial<KanbanColumn$1>) => void;
+    /** 취소 콜백 */
+    onCancel?: () => void;
+    /** 플레이스홀더 텍스트 */
+    placeholder?: string;
+    /** dot 유틸리티 스타일 */
+    dot?: string;
+}
+/**
+ * KanbanDropIndicator Props 인터페이스
+ */
+interface KanbanDropIndicatorProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "className"> {
+    /** 표시 여부 */
+    visible: boolean;
+    /** 방향 */
+    orientation?: "horizontal" | "vertical";
+    /** dot 유틸리티 스타일 */
+    dot?: string;
+}
+
+/**
+ * KanbanBoard 컴포넌트
+ *
+ * @dnd-kit을 사용한 드래그앤드롭 칸반 보드 컴포넌트입니다.
+ * 컬럼 간 카드 이동, 같은 컬럼 내 순서 변경을 지원합니다.
+ */
+declare const KanbanBoard: React$1.ForwardRefExoticComponent<KanbanBoardProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * KanbanColumn 컴포넌트
+ *
+ * @dnd-kit의 useSortable을 사용하여 컬럼 재정렬을 지원합니다.
+ * 카드는 SortableContext로 감싸서 세로 정렬을 지원합니다.
+ */
+declare const KanbanColumn: React$1.ForwardRefExoticComponent<KanbanColumnProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * KanbanColumnHeader 컴포넌트
+ *
+ * 칸반 컬럼의 헤더를 렌더링합니다.
+ * 제목 편집, 삭제, 접기/펼치기 기능을 제공합니다.
+ */
+declare const KanbanColumnHeader: React$1.ForwardRefExoticComponent<KanbanColumnHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * KanbanCard 컴포넌트
+ *
+ * @dnd-kit의 useSortable을 사용하여 드래그앤드롭을 지원합니다.
+ * 우선순위 표시, 담당자, 마감일 등을 지원합니다.
+ */
+declare const KanbanCard: React$1.ForwardRefExoticComponent<KanbanCardProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * KanbanAddCard 컴포넌트
+ *
+ * 새 카드를 추가하는 인라인 폼입니다.
+ * 버튼 클릭 시 입력 폼이 나타나고, Enter로 추가합니다.
+ */
+declare const KanbanAddCard: React$1.ForwardRefExoticComponent<KanbanAddCardProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * KanbanAddColumn 컴포넌트
+ *
+ * 새 컬럼을 추가하는 UI입니다.
+ * 버튼 클릭 시 입력 폼이 나타나고, Enter로 추가합니다.
+ */
+declare const KanbanAddColumn: React$1.ForwardRefExoticComponent<KanbanAddColumnProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * KanbanDropIndicator 컴포넌트
+ *
+ * 드래그앤드롭 시 드롭 위치를 시각적으로 표시합니다.
+ */
+declare const KanbanDropIndicator: React$1.ForwardRefExoticComponent<KanbanDropIndicatorProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Kanban Context Value 인터페이스
+ */
+interface KanbanContextValue {
+    columns: KanbanColumn$1[];
+    cards: KanbanCard$1[];
+    dragData: KanbanDragData | null;
+    dropTargetId: string | null;
+    dropIndex: number | null;
+    startDrag: (data: KanbanDragData) => void;
+    updateDropTarget: (targetId: string | null, index: number | null) => void;
+    endDrag: () => void;
+    moveCard: (cardId: string, toColumnId: string, toIndex: number) => void;
+    addCard: (columnId: string, card: Partial<KanbanCard$1>) => void;
+    updateCard: (cardId: string, updates: Partial<KanbanCard$1>) => void;
+    deleteCard: (cardId: string) => void;
+    moveColumn: (columnId: string, toIndex: number) => void;
+    addColumn: (column: Partial<KanbanColumn$1>) => void;
+    updateColumn: (columnId: string, updates: Partial<KanbanColumn$1>) => void;
+    deleteColumn: (columnId: string) => void;
+    getCardsByColumn: (columnId: string) => KanbanCard$1[];
+    canDropCard: (columnId: string) => boolean;
+    variant: ExtendedVariant;
+    color: Color;
+    allowCardDrag: boolean;
+    allowColumnDrag: boolean;
+    allowAddCard: boolean;
+    allowAddColumn: boolean;
+    readOnly: boolean;
+    onCardClick?: (card: KanbanCard$1) => void;
+}
+declare const KanbanContext: React$1.Context<KanbanContextValue | null>;
+/**
+ * Kanban Context를 사용하는 훅
+ */
+declare function useKanban(): KanbanContextValue;
+/**
+ * Kanban Provider Props
+ */
+interface KanbanProviderProps {
+    children: React$1.ReactNode;
+    columns: KanbanColumn$1[];
+    cards: KanbanCard$1[];
+    onColumnsChange?: (columns: KanbanColumn$1[]) => void;
+    onCardsChange?: (cards: KanbanCard$1[]) => void;
+    onCardMove?: (event: KanbanCardMoveEvent) => void;
+    onColumnMove?: (event: KanbanColumnMoveEvent) => void;
+    onCardAdd?: (columnId: string, card: Partial<KanbanCard$1>) => void;
+    onCardDelete?: (cardId: string) => void;
+    onCardUpdate?: (cardId: string, updates: Partial<KanbanCard$1>) => void;
+    onColumnAdd?: (column: Partial<KanbanColumn$1>) => void;
+    onColumnDelete?: (columnId: string) => void;
+    onColumnUpdate?: (columnId: string, updates: Partial<KanbanColumn$1>) => void;
+    onCardClick?: (card: KanbanCard$1) => void;
+    variant?: ExtendedVariant;
+    color?: Color;
+    allowCardDrag?: boolean;
+    allowColumnDrag?: boolean;
+    allowAddCard?: boolean;
+    allowAddColumn?: boolean;
+    readOnly?: boolean;
+}
+/**
+ * Kanban Provider 컴포넌트
+ */
+declare function KanbanProvider({ children, columns, cards, onColumnsChange, onCardsChange, onCardMove, onColumnMove, onCardAdd, onCardDelete, onCardUpdate, onColumnAdd, onColumnDelete, onColumnUpdate, onCardClick, variant, color, allowCardDrag, allowColumnDrag, allowAddCard, allowAddColumn, readOnly, }: KanbanProviderProps): react_jsx_runtime.JSX.Element;
+
+export { KanbanAddCard, type KanbanAddCardProps, KanbanAddColumn, type KanbanAddColumnProps, type KanbanAssignee, KanbanBoard, type KanbanBoardProps, KanbanCard, type KanbanCardMoveEvent, type KanbanCardProps, type KanbanCard$1 as KanbanCardType, KanbanColumn, KanbanColumnHeader, type KanbanColumnHeaderProps, type KanbanColumnMoveEvent, type KanbanColumnProps, type KanbanColumn$1 as KanbanColumnType, KanbanContext, type KanbanDragData, type KanbanDragType, KanbanDropIndicator, type KanbanDropIndicatorProps, type KanbanPriority, KanbanProvider, useKanban };

package/dist/interactive-kanban.mjs

@@ -0,0 +1,3 @@
+"use client";
+export{f as KanbanAddCard,h as KanbanAddColumn,i as KanbanBoard,e as KanbanCard,g as KanbanColumn,d as KanbanColumnHeader,a as KanbanContext,j as KanbanDropIndicator,c as KanbanProvider,b as useKanban}from'./chunk-TSAXVD2H.mjs';import'./chunk-D7MTTTQY.mjs';import'./chunk-NSDWT2JM.mjs';import'./chunk-OBMOTQEU.mjs';import'./chunk-EAZEI74V.mjs';//# sourceMappingURL=interactive-kanban.mjs.map
+//# sourceMappingURL=interactive-kanban.mjs.map

package/dist/interactive-kanban.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"interactive-kanban.mjs"}