콘텐츠로 이동
comins.DOCS
Grid Layout시작하기

Grid Layout 전체 기능

현재 배포 버전에서 제공하는 기능을 인벤토리 기준으로 정리했습니다. 기능 이름이나 API로 검색하고 관련 가이드와 Playground 경로를 함께 확인할 수 있습니다.

comins-grid-layout@0.3.023

공개 기능

Basic

widget/basic
관련 API

DashboardWidgetDashboardWidgetShell

가이드

01-quick-start

Playground

/examples/widget/basic

근거

example/src/playground/routes.ts

추가 / 전체 삭제 / 초기화

widget/manage
관련 API

addDashboardWidgetremoveDashboardWidgetclearDashboardWidgets

가이드

02-controlled-state-and-crud

Playground

/examples/widget/manage

근거

example/src/playground/routes.ts

Basic

layout/basic
관련 API

useDashboardGridDashboardGridProps

가이드

01-quick-start

Playground

/examples/layout/basic

근거

example/src/playground/routes.ts

레이아웃 잠금 / 해제

layout/lock
관련 API

DashboardInteractionOptionsDashboardGridCommands

가이드

03-widget-interactions-and-actions

Playground

/examples/layout/lock

근거

example/src/playground/routes.ts

레이아웃 저장 / 불러오기

layout/persistence
관련 API

serializeDashboardLayoutapplyDashboardLayoutSnapshot

가이드

05-persistence

Playground

/examples/layout/persistence

근거

example/src/playground/routes.ts

자동 정렬 / 빈 공간 채우기

layout/arrange
관련 API

autoArrangeDashboardWidgetsDashboardGridCommands

가이드

04-columns-arrange-and-reset

Playground

/examples/layout/arrange

근거

example/src/playground/routes.ts

레이아웃 이벤트

layout/events
관련 API

DashboardLayoutMutationEventDashboardGridHandle

가이드

10-events-and-content-resize

Playground

/examples/layout/events

근거

example/src/playground/routes.ts

셀 높이

advanced/cell-height
관련 API

DashboardGridEngineOptions

가이드

11-engine-options

Playground

/examples/advanced/cell-height

근거

example/src/playground/routes.ts

Float

advanced/float
관련 API

DashboardGridEngineOptions

가이드

11-engine-options

Playground

/examples/advanced/float

근거

example/src/playground/routes.ts

콘텐츠 지연 렌더링

advanced/lazy-load
관련 API

DashboardWidgetShellProps

가이드

09-lazy-rendering

Playground

/examples/advanced/lazy-load

근거

example/src/playground/routes.ts

모바일 터치

advanced/mobile-touch
관련 API

DashboardInteractionOptionsDashboardDragOptions

가이드

13-styling-accessibility-and-boundaries

Playground

/examples/advanced/mobile-touch

근거

example/src/playground/routes.ts

Nested Grid - 구성

advanced/nested/basic
관련 API

DashboardGridPropsDashboardWidget

가이드

12-advanced-gridstack-access

Playground

/examples/advanced/nested/basic

근거

example/src/playground/routes.ts

반응형

advanced/responsive
관련 API

DashboardResponsiveOptionsDashboardLayoutsByColumn

가이드

06-responsive-layouts

Playground

/examples/advanced/responsive

근거

example/src/playground/routes.ts

Size To Content

advanced/size-to-content
관련 API

DashboardGridEngineOptionsDashboardWidgetLayout

가이드

10-events-and-content-resize

Playground

/examples/advanced/size-to-content

근거

example/src/playground/routes.ts

타이틀 Drag Handle

advanced/title-drag
관련 API

DashboardWidgetShellProps

가이드

03-widget-interactions-and-actions

Playground

/examples/advanced/title-drag

근거

example/src/playground/routes.ts

외부 드롭 - 휴지통 삭제

advanced/external-drop-trash
관련 API

useDashboardDragInDashboardExternalDropTarget

가이드

07-external-drop-targets

Playground

/examples/advanced/external-drop-trash

근거

example/src/playground/routes.ts

다중 Grid 전송

advanced/multi-grid/horizontal
관련 API

transferDashboardWidgetDashboardWidgetTransferInput

가이드

08-palette-and-grid-transfer

Playground

/examples/advanced/multi-grid/horizontal

근거

example/src/playground/routes.ts

안전한 공개 핸들러 / 메서드

advanced/public-api
관련 API

DashboardGridHandleDashboardGridCommands

가이드

12-advanced-gridstack-access

Playground

/examples/advanced/public-api

근거

example/src/playground/routes.ts

동적 위젯 크기

widget/resize
관련 API

resizeDashboardWidgetDashboardGridCommandsresizeWidget

가이드

03-widget-interactions-and-actions

Playground

/examples/widget/resize

근거

example/src/playground/routes.ts

이번 버전의 변경 — 0.3.0

섹션 제목: “이번 버전의 변경 — 0.3.0”

프레임워크 중립 /core, 명시적 /react와 Vue 3 CSR /vue 진입점을 제공합니다. resizeWidget·resizeDashboardWidget으로 W/H를 지정하며 최초 변경 전 배치로 복원합니다. 타이틀 더블 클릭은 기본적으로 행 너비를 채웁니다. 알림만 필요한 소비자는 titleDoubleClickAction="none"을 지정합니다. maximize/minimize는 deprecated 호환 API로 유지하고 기본 버튼은 제거했습니다. Nuxt/SSR·Vanilla·Svelte 렌더러·혼합 프레임워크 전송은 지원하지 않습니다.

Core / Vue 3 · Vue 실행 예제