react-grid-layout 2.0.0 → 2.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +97 -25
- package/css/styles.css +0 -1
- package/dist/{ResponsiveGridLayout-D6lFRE3f.d.mts → ResponsiveGridLayout-BkHF9YHa.d.mts} +10 -1
- package/dist/{ResponsiveGridLayout-CH4s0tKj.d.ts → ResponsiveGridLayout-CLn16-X3.d.ts} +10 -1
- package/dist/{calculate-CwYDW8na.d.mts → calculate-DsVTldEE.d.ts} +30 -2
- package/dist/{calculate-mgLpNJ5O.d.ts → calculate-DwbL1D06.d.mts} +30 -2
- package/dist/{chunk-4HNUMWQK.mjs → chunk-2O3ZME4Q.mjs} +178 -297
- package/dist/chunk-2O3ZME4Q.mjs.map +1 -0
- package/dist/chunk-526JND3R.mjs +3 -0
- package/dist/{chunk-ZWN22PS2.mjs.map → chunk-526JND3R.mjs.map} +1 -1
- package/dist/chunk-7ELO5FRW.js +4 -0
- package/dist/{chunk-PBQSHIID.js.map → chunk-7ELO5FRW.js.map} +1 -1
- package/dist/chunk-AWM66AWF.mjs +422 -0
- package/dist/chunk-AWM66AWF.mjs.map +1 -0
- package/dist/chunk-BJFPTW5Q.js +449 -0
- package/dist/chunk-BJFPTW5Q.js.map +1 -0
- package/dist/{chunk-3WO4SAYB.js → chunk-FN6MIZ24.js} +221 -345
- package/dist/chunk-FN6MIZ24.js.map +1 -0
- package/dist/{chunk-H5KMDLY3.js → chunk-GPZBANOK.js} +40 -39
- package/dist/chunk-GPZBANOK.js.map +1 -0
- package/dist/{chunk-ZCXE6SR5.mjs → chunk-LWF5EYMO.mjs} +4 -3
- package/dist/chunk-LWF5EYMO.mjs.map +1 -0
- package/dist/{chunk-R35HZZTA.mjs → chunk-MXXN7GUE.mjs} +170 -62
- package/dist/chunk-MXXN7GUE.mjs.map +1 -0
- package/dist/{chunk-BFTKGAP3.js → chunk-QRW3ND4U.js} +230 -122
- package/dist/chunk-QRW3ND4U.js.map +1 -0
- package/dist/core.d.mts +159 -6
- package/dist/core.d.ts +159 -6
- package/dist/core.js +141 -85
- package/dist/core.mjs +3 -3
- package/dist/extras.d.mts +133 -3
- package/dist/extras.d.ts +133 -3
- package/dist/extras.js +373 -2
- package/dist/extras.js.map +1 -1
- package/dist/extras.mjs +367 -2
- package/dist/extras.mjs.map +1 -1
- package/dist/index.d.mts +5 -5
- package/dist/index.d.ts +5 -5
- package/dist/index.js +64 -64
- package/dist/index.mjs +5 -5
- package/dist/legacy.d.mts +2 -2
- package/dist/legacy.d.ts +2 -2
- package/dist/legacy.js +26 -25
- package/dist/legacy.js.map +1 -1
- package/dist/legacy.mjs +16 -15
- package/dist/legacy.mjs.map +1 -1
- package/dist/{position-Dk2b4ZMS.d.ts → position-C8a5g6bb.d.mts} +11 -6
- package/dist/{position-BmN1z36J.d.mts → position-H8tBL91b.d.ts} +11 -6
- package/dist/react.d.mts +11 -5
- package/dist/react.d.ts +11 -5
- package/dist/react.js +38 -38
- package/dist/react.mjs +5 -5
- package/dist/{responsive-CJxefsYw.d.mts → responsive-BB5d98xz.d.mts} +1 -1
- package/dist/{responsive-C4L1ESlm.d.ts → responsive-BXI-GCXG.d.ts} +1 -1
- package/dist/{types-Cxf4nHNr.d.mts → types-CokovIMH.d.mts} +98 -4
- package/dist/{types-Cxf4nHNr.d.ts → types-CokovIMH.d.ts} +98 -4
- package/index-dev.js +16 -0
- package/package.json +2 -1
- package/dist/chunk-2KUHNJXF.mjs +0 -90
- package/dist/chunk-2KUHNJXF.mjs.map +0 -1
- package/dist/chunk-3WO4SAYB.js.map +0 -1
- package/dist/chunk-4HNUMWQK.mjs.map +0 -1
- package/dist/chunk-BFTKGAP3.js.map +0 -1
- package/dist/chunk-F6NQPYKT.js +0 -98
- package/dist/chunk-F6NQPYKT.js.map +0 -1
- package/dist/chunk-H5KMDLY3.js.map +0 -1
- package/dist/chunk-PBQSHIID.js +0 -4
- package/dist/chunk-R35HZZTA.mjs.map +0 -1
- package/dist/chunk-ZCXE6SR5.mjs.map +0 -1
- package/dist/chunk-ZWN22PS2.mjs +0 -3
package/dist/legacy.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/legacy/ReactGridLayout.tsx","../src/legacy/ResponsiveReactGridLayout.tsx","../src/react/components/WidthProvider.tsx"],"names":["jsx","node"],"mappings":"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","file":"legacy.mjs","sourcesContent":["/**\n * Legacy ReactGridLayout wrapper\n *\n * This component wraps the new TypeScript GridLayout to provide\n * backwards compatibility with the v1 API by converting flat props\n * to the new composable interface format.\n */\n\nimport React from \"react\";\nimport {\n GridLayout,\n type GridLayoutProps\n} from \"../react/components/GridLayout.js\";\nimport type {\n Layout,\n LayoutItem,\n CompactType,\n ResizeHandleAxis,\n GridConfig,\n DragConfig,\n ResizeConfig,\n DropConfig,\n PositionStrategy\n} from \"../core/types.js\";\nimport { getCompactor } from \"../core/compactors.js\";\nimport {\n transformStrategy,\n absoluteStrategy,\n createScaledStrategy\n} from \"../core/position.js\";\n\n// ============================================================================\n// Legacy Props Interface\n// ============================================================================\n\n/**\n * Legacy props interface for backwards compatibility with v1 API.\n * These flat props are converted to composable interfaces internally.\n */\nexport interface LegacyReactGridLayoutProps {\n // Required\n children: React.ReactNode;\n width: number;\n\n // Grid measurement (→ gridConfig)\n cols?: number;\n rowHeight?: number;\n maxRows?: number;\n margin?: readonly [number, number];\n containerPadding?: readonly [number, number] | null;\n\n // Layout data\n layout?: Layout;\n droppingItem?: LayoutItem;\n\n // Compaction (→ compactor)\n compactType?: CompactType;\n preventCollision?: boolean;\n allowOverlap?: boolean;\n /** @deprecated Use compactType instead */\n verticalCompact?: boolean;\n\n // Drag behavior (→ dragConfig)\n isDraggable?: boolean;\n isBounded?: boolean;\n draggableHandle?: string;\n draggableCancel?: string;\n\n // Resize behavior (→ resizeConfig)\n isResizable?: boolean;\n resizeHandles?: ResizeHandleAxis[];\n resizeHandle?:\n | React.ReactElement\n | ((\n axis: ResizeHandleAxis,\n ref: React.Ref<HTMLElement>\n ) => React.ReactElement);\n\n // Drop behavior (→ dropConfig)\n isDroppable?: boolean;\n\n // Position (→ positionStrategy)\n useCSSTransforms?: boolean;\n transformScale?: number;\n\n // Container props (passed through)\n autoSize?: boolean;\n className?: string;\n style?: React.CSSProperties;\n innerRef?: React.Ref<HTMLDivElement>;\n\n // Callbacks (passed through)\n onLayoutChange?: (layout: Layout) => void;\n onDragStart?: GridLayoutProps[\"onDragStart\"];\n onDrag?: GridLayoutProps[\"onDrag\"];\n onDragStop?: GridLayoutProps[\"onDragStop\"];\n onResizeStart?: GridLayoutProps[\"onResizeStart\"];\n onResize?: GridLayoutProps[\"onResize\"];\n onResizeStop?: GridLayoutProps[\"onResizeStop\"];\n onDrop?: (layout: Layout, item: LayoutItem | undefined, e: Event) => void;\n onDropDragOver?: (\n e: React.DragEvent\n ) => { w?: number; h?: number } | false | void;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\n/**\n * ReactGridLayout - Legacy wrapper component\n *\n * Converts v1 flat props to v2 composable interfaces for backwards compatibility.\n */\nfunction ReactGridLayout(props: LegacyReactGridLayoutProps) {\n const {\n // Required\n children,\n width,\n\n // Grid measurement\n cols = 12,\n rowHeight = 150,\n maxRows = Infinity,\n margin = [10, 10],\n containerPadding = null,\n\n // Layout data\n layout,\n droppingItem,\n\n // Compaction\n compactType: compactTypeProp,\n preventCollision = false,\n allowOverlap = false,\n verticalCompact,\n\n // Drag behavior\n isDraggable = true,\n isBounded = false,\n draggableHandle,\n draggableCancel,\n\n // Resize behavior\n isResizable = true,\n resizeHandles = [\"se\"],\n resizeHandle,\n\n // Drop behavior\n isDroppable = false,\n\n // Position\n useCSSTransforms = true,\n transformScale = 1,\n\n // Container props\n autoSize,\n className,\n style,\n innerRef,\n\n // Callbacks\n onLayoutChange,\n onDragStart,\n onDrag,\n onDragStop,\n onResizeStart,\n onResize,\n onResizeStop,\n onDrop,\n onDropDragOver\n } = props;\n\n // Handle deprecated verticalCompact prop\n let compactType: CompactType =\n compactTypeProp === undefined ? \"vertical\" : compactTypeProp;\n if (verticalCompact === false) {\n if (process.env[\"NODE_ENV\"] !== \"production\") {\n console.warn(\n \"`verticalCompact` on <ReactGridLayout> is deprecated and will be removed soon. \" +\n 'Use `compactType`: \"horizontal\" | \"vertical\" | null.'\n );\n }\n compactType = null;\n }\n\n // Convert flat props to composable interfaces\n\n const gridConfig: Partial<GridConfig> = {\n cols,\n rowHeight,\n maxRows,\n margin,\n containerPadding\n };\n\n const dragConfig: Partial<DragConfig> = {\n enabled: isDraggable,\n bounded: isBounded,\n handle: draggableHandle,\n cancel: draggableCancel\n };\n\n const resizeConfig: Partial<ResizeConfig> = {\n enabled: isResizable,\n handles: resizeHandles,\n handleComponent: resizeHandle\n };\n\n const dropConfig: Partial<DropConfig> = {\n enabled: isDroppable\n };\n\n // Build position strategy\n let positionStrategy: PositionStrategy;\n if (!useCSSTransforms) {\n positionStrategy = absoluteStrategy;\n } else if (transformScale !== 1) {\n positionStrategy = createScaledStrategy(transformScale);\n } else {\n positionStrategy = transformStrategy;\n }\n\n // Get compactor from type and options\n const compactor = getCompactor(compactType, allowOverlap, preventCollision);\n\n return (\n <GridLayout\n width={width}\n gridConfig={gridConfig}\n dragConfig={dragConfig}\n resizeConfig={resizeConfig}\n dropConfig={dropConfig}\n positionStrategy={positionStrategy}\n compactor={compactor}\n layout={layout}\n droppingItem={droppingItem}\n autoSize={autoSize}\n className={className}\n style={style}\n innerRef={innerRef}\n onLayoutChange={onLayoutChange}\n onDragStart={onDragStart}\n onDrag={onDrag}\n onDragStop={onDragStop}\n onResizeStart={onResizeStart}\n onResize={onResize}\n onResizeStop={onResizeStop}\n onDrop={onDrop}\n onDropDragOver={onDropDragOver}\n >\n {children}\n </GridLayout>\n );\n}\n\n// Static properties for backwards compatibility\nReactGridLayout.displayName = \"ReactGridLayout\";\n\nexport default ReactGridLayout;\nexport { ReactGridLayout };\n","/**\n * Legacy ResponsiveReactGridLayout wrapper\n *\n * This component wraps the new TypeScript ResponsiveGridLayout to provide\n * backwards compatibility with the v1 API by converting flat props\n * to the new composable interface format.\n */\n\nimport React from \"react\";\nimport {\n ResponsiveGridLayout,\n type ResponsiveGridLayoutProps\n} from \"../react/components/ResponsiveGridLayout.js\";\nimport type {\n Layout,\n LayoutItem,\n CompactType,\n Breakpoint,\n Breakpoints,\n ResponsiveLayouts,\n ResizeHandleAxis,\n DragConfig,\n ResizeConfig,\n DropConfig,\n PositionStrategy\n} from \"../core/types.js\";\nimport { getCompactor } from \"../core/compactors.js\";\nimport {\n transformStrategy,\n absoluteStrategy,\n createScaledStrategy\n} from \"../core/position.js\";\n\n// ============================================================================\n// Legacy Props Interface\n// ============================================================================\n\n/**\n * Legacy props interface for backwards compatibility with v1 API.\n * These flat props are converted to composable interfaces internally.\n */\nexport interface LegacyResponsiveReactGridLayoutProps<\n B extends Breakpoint = string\n> {\n // Required\n children: React.ReactNode;\n width: number;\n\n // Responsive-specific\n breakpoint?: B;\n breakpoints?: Breakpoints<B>;\n cols?: Breakpoints<B>;\n layouts?: ResponsiveLayouts<B>;\n onBreakpointChange?: (newBreakpoint: B, cols: number) => void;\n onLayoutChange?: (layout: Layout, layouts: ResponsiveLayouts<B>) => void;\n onWidthChange?: (\n containerWidth: number,\n margin: readonly [number, number],\n cols: number,\n containerPadding: readonly [number, number] | null\n ) => void;\n\n // Grid measurement\n rowHeight?: number;\n maxRows?: number;\n margin?:\n | readonly [number, number]\n | Partial<Record<B, readonly [number, number]>>;\n containerPadding?:\n | readonly [number, number]\n | Partial<Record<B, readonly [number, number] | null>>\n | null;\n\n // Layout data\n droppingItem?: LayoutItem;\n\n // Compaction (→ compactor)\n compactType?: CompactType;\n preventCollision?: boolean;\n allowOverlap?: boolean;\n /** @deprecated Use compactType instead */\n verticalCompact?: boolean;\n\n // Drag behavior (→ dragConfig)\n isDraggable?: boolean;\n isBounded?: boolean;\n draggableHandle?: string;\n draggableCancel?: string;\n\n // Resize behavior (→ resizeConfig)\n isResizable?: boolean;\n resizeHandles?: ResizeHandleAxis[];\n resizeHandle?:\n | React.ReactElement\n | ((\n axis: ResizeHandleAxis,\n ref: React.Ref<HTMLElement>\n ) => React.ReactElement);\n\n // Drop behavior (→ dropConfig)\n isDroppable?: boolean;\n\n // Position (→ positionStrategy)\n useCSSTransforms?: boolean;\n transformScale?: number;\n\n // Container props (passed through)\n autoSize?: boolean;\n className?: string;\n style?: React.CSSProperties;\n innerRef?: React.Ref<HTMLDivElement>;\n\n // Callbacks (passed through)\n onDragStart?: ResponsiveGridLayoutProps<B>[\"onDragStart\"];\n onDrag?: ResponsiveGridLayoutProps<B>[\"onDrag\"];\n onDragStop?: ResponsiveGridLayoutProps<B>[\"onDragStop\"];\n onResizeStart?: ResponsiveGridLayoutProps<B>[\"onResizeStart\"];\n onResize?: ResponsiveGridLayoutProps<B>[\"onResize\"];\n onResizeStop?: ResponsiveGridLayoutProps<B>[\"onResizeStop\"];\n onDrop?: (layout: Layout, item: LayoutItem | undefined, e: Event) => void;\n onDropDragOver?: (\n e: React.DragEvent\n ) => { w?: number; h?: number } | false | void;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\n/**\n * ResponsiveReactGridLayout - Legacy wrapper component\n *\n * Converts v1 flat props to v2 composable interfaces for backwards compatibility.\n */\nfunction ResponsiveReactGridLayout<B extends Breakpoint = string>(\n props: LegacyResponsiveReactGridLayoutProps<B>\n) {\n const {\n // Required\n children,\n width,\n\n // Responsive-specific\n breakpoint,\n breakpoints,\n cols,\n layouts,\n onBreakpointChange,\n onLayoutChange,\n onWidthChange,\n\n // Grid measurement\n rowHeight,\n maxRows,\n margin,\n containerPadding,\n\n // Layout data\n droppingItem,\n\n // Compaction\n compactType: compactTypeProp,\n preventCollision = false,\n allowOverlap = false,\n verticalCompact,\n\n // Drag behavior\n isDraggable = true,\n isBounded = false,\n draggableHandle,\n draggableCancel,\n\n // Resize behavior\n isResizable = true,\n resizeHandles = [\"se\"],\n resizeHandle,\n\n // Drop behavior\n isDroppable = false,\n\n // Position\n useCSSTransforms = true,\n transformScale = 1,\n\n // Container props\n autoSize,\n className,\n style,\n innerRef,\n\n // Callbacks\n onDragStart,\n onDrag,\n onDragStop,\n onResizeStart,\n onResize,\n onResizeStop,\n onDrop,\n onDropDragOver\n } = props;\n\n // Handle deprecated verticalCompact prop\n let compactType: CompactType =\n compactTypeProp === undefined ? \"vertical\" : compactTypeProp;\n if (verticalCompact === false) {\n if (process.env[\"NODE_ENV\"] !== \"production\") {\n console.warn(\n \"`verticalCompact` on <ResponsiveReactGridLayout> is deprecated and will be removed soon. \" +\n 'Use `compactType`: \"horizontal\" | \"vertical\" | null.'\n );\n }\n compactType = null;\n }\n\n // Convert flat props to composable interfaces\n\n const dragConfig: Partial<DragConfig> = {\n enabled: isDraggable,\n bounded: isBounded,\n handle: draggableHandle,\n cancel: draggableCancel\n };\n\n const resizeConfig: Partial<ResizeConfig> = {\n enabled: isResizable,\n handles: resizeHandles,\n handleComponent: resizeHandle\n };\n\n const dropConfig: Partial<DropConfig> = {\n enabled: isDroppable\n };\n\n // Build position strategy\n let positionStrategy: PositionStrategy;\n if (!useCSSTransforms) {\n positionStrategy = absoluteStrategy;\n } else if (transformScale !== 1) {\n positionStrategy = createScaledStrategy(transformScale);\n } else {\n positionStrategy = transformStrategy;\n }\n\n // Get compactor from type and options\n const compactor = getCompactor(compactType, allowOverlap, preventCollision);\n\n return (\n <ResponsiveGridLayout<B>\n width={width}\n breakpoint={breakpoint}\n breakpoints={breakpoints}\n cols={cols}\n layouts={layouts}\n rowHeight={rowHeight}\n maxRows={maxRows}\n margin={margin}\n containerPadding={containerPadding}\n compactor={compactor}\n dragConfig={dragConfig}\n resizeConfig={resizeConfig}\n dropConfig={dropConfig}\n positionStrategy={positionStrategy}\n droppingItem={droppingItem}\n autoSize={autoSize}\n className={className}\n style={style}\n innerRef={innerRef}\n onBreakpointChange={onBreakpointChange}\n onLayoutChange={onLayoutChange}\n onWidthChange={onWidthChange}\n onDragStart={onDragStart}\n onDrag={onDrag}\n onDragStop={onDragStop}\n onResizeStart={onResizeStart}\n onResize={onResize}\n onResizeStop={onResizeStop}\n onDrop={onDrop}\n onDropDragOver={onDropDragOver}\n >\n {children}\n </ResponsiveGridLayout>\n );\n}\n\n// Static properties for backwards compatibility\nResponsiveReactGridLayout.displayName = \"ResponsiveReactGridLayout\";\n\nexport default ResponsiveReactGridLayout;\nexport { ResponsiveReactGridLayout, ResponsiveReactGridLayout as Responsive };\n","/**\n * WidthProvider HOC\n *\n * A Higher-Order Component that provides width measurement to grid layouts.\n * This wraps any component and provides the container width as a prop.\n */\n\nimport React, { useState, useRef, useEffect, type ComponentType } from \"react\";\nimport clsx from \"clsx\";\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface WidthProviderProps {\n /** If true, will not render children until mounted */\n measureBeforeMount?: boolean;\n /** Additional class name */\n className?: string;\n /** Additional styles */\n style?: React.CSSProperties;\n}\n\ntype WithWidthProps<P> = Omit<P, \"width\"> & WidthProviderProps;\n\n// ============================================================================\n// Constants\n// ============================================================================\n\nconst layoutClassName = \"react-grid-layout\";\n\n// ============================================================================\n// WidthProvider HOC\n// ============================================================================\n\n/**\n * WidthProvider - HOC that provides container width\n *\n * A simple HOC that provides facility for listening to container resizes.\n * Wraps the provided component and passes down a `width` prop.\n *\n * @example\n * ```tsx\n * import { GridLayout, WidthProvider } from 'react-grid-layout';\n *\n * const GridLayoutWithWidth = WidthProvider(GridLayout);\n *\n * function MyGrid() {\n * return (\n * <GridLayoutWithWidth cols={12} rowHeight={30}>\n * <div key=\"a\">a</div>\n * </GridLayoutWithWidth>\n * );\n * }\n * ```\n */\nexport function WidthProvider<P extends { width: number }>(\n ComposedComponent: ComponentType<P>\n): ComponentType<WithWidthProps<P>> {\n function WidthProviderWrapper(props: WithWidthProps<P>) {\n const { measureBeforeMount = false, className, style, ...rest } = props;\n\n const [width, setWidth] = useState(1280);\n const [mounted, setMounted] = useState(false);\n const elementRef = useRef<HTMLDivElement>(null);\n const resizeObserverRef = useRef<ResizeObserver | null>(null);\n\n useEffect(() => {\n setMounted(true);\n\n // Set up ResizeObserver\n resizeObserverRef.current = new ResizeObserver(entries => {\n const node = elementRef.current;\n if (node instanceof HTMLElement && entries[0]) {\n const newWidth = entries[0].contentRect.width;\n setWidth(newWidth);\n }\n });\n\n const node = elementRef.current;\n if (node instanceof HTMLElement) {\n resizeObserverRef.current.observe(node);\n }\n\n return () => {\n if (node instanceof HTMLElement && resizeObserverRef.current) {\n resizeObserverRef.current.unobserve(node);\n }\n resizeObserverRef.current?.disconnect();\n };\n }, []);\n\n // If measureBeforeMount is true and not yet mounted, render placeholder\n if (measureBeforeMount && !mounted) {\n return (\n <div\n className={clsx(className, layoutClassName)}\n style={style}\n ref={elementRef}\n />\n );\n }\n\n return (\n <ComposedComponent\n innerRef={elementRef}\n className={className}\n style={style}\n {...(rest as unknown as P)}\n width={width}\n />\n );\n }\n\n WidthProviderWrapper.displayName = `WidthProvider(${ComposedComponent.displayName || ComposedComponent.name || \"Component\"})`;\n\n return WidthProviderWrapper;\n}\n\nexport default WidthProvider;\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/legacy/ReactGridLayout.tsx","../src/legacy/ResponsiveReactGridLayout.tsx","../src/react/components/WidthProvider.tsx"],"names":["jsx"],"mappings":"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","file":"legacy.mjs","sourcesContent":["/**\n * Legacy ReactGridLayout wrapper\n *\n * This component wraps the new TypeScript GridLayout to provide\n * backwards compatibility with the v1 API by converting flat props\n * to the new composable interface format.\n */\n\nimport React from \"react\";\nimport {\n GridLayout,\n type GridLayoutProps\n} from \"../react/components/GridLayout.js\";\nimport type {\n Layout,\n LayoutItem,\n CompactType,\n ResizeHandleAxis,\n GridConfig,\n DragConfig,\n ResizeConfig,\n DropConfig,\n PositionStrategy,\n LayoutConstraint\n} from \"../core/types.js\";\nimport { getCompactor } from \"../core/compactors.js\";\nimport {\n transformStrategy,\n absoluteStrategy,\n createScaledStrategy\n} from \"../core/position.js\";\nimport { defaultConstraints, containerBounds } from \"../core/constraints.js\";\n\n// ============================================================================\n// Legacy Props Interface\n// ============================================================================\n\n/**\n * Legacy props interface for backwards compatibility with v1 API.\n * These flat props are converted to composable interfaces internally.\n */\nexport interface LegacyReactGridLayoutProps {\n // Required\n children: React.ReactNode;\n width: number;\n\n // Grid measurement (→ gridConfig)\n cols?: number;\n rowHeight?: number;\n maxRows?: number;\n margin?: readonly [number, number];\n containerPadding?: readonly [number, number] | null;\n\n // Layout data\n layout?: Layout;\n droppingItem?: LayoutItem;\n\n // Compaction (→ compactor)\n compactType?: CompactType;\n preventCollision?: boolean;\n allowOverlap?: boolean;\n /** @deprecated Use compactType instead */\n verticalCompact?: boolean;\n\n // Drag behavior (→ dragConfig)\n isDraggable?: boolean;\n isBounded?: boolean;\n draggableHandle?: string;\n draggableCancel?: string;\n\n // Resize behavior (→ resizeConfig)\n isResizable?: boolean;\n resizeHandles?: ResizeHandleAxis[];\n resizeHandle?:\n | React.ReactElement\n | ((\n axis: ResizeHandleAxis,\n ref: React.Ref<HTMLElement>\n ) => React.ReactElement);\n\n // Drop behavior (→ dropConfig)\n isDroppable?: boolean;\n\n // Position (→ positionStrategy)\n useCSSTransforms?: boolean;\n transformScale?: number;\n\n // Container props (passed through)\n autoSize?: boolean;\n className?: string;\n style?: React.CSSProperties;\n innerRef?: React.Ref<HTMLDivElement>;\n\n // Callbacks (passed through)\n onLayoutChange?: (layout: Layout) => void;\n onDragStart?: GridLayoutProps[\"onDragStart\"];\n onDrag?: GridLayoutProps[\"onDrag\"];\n onDragStop?: GridLayoutProps[\"onDragStop\"];\n onResizeStart?: GridLayoutProps[\"onResizeStart\"];\n onResize?: GridLayoutProps[\"onResize\"];\n onResizeStop?: GridLayoutProps[\"onResizeStop\"];\n onDrop?: (layout: Layout, item: LayoutItem | undefined, e: Event) => void;\n onDropDragOver?: (\n e: React.DragEvent\n ) => { w?: number; h?: number } | false | void;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\n/**\n * ReactGridLayout - Legacy wrapper component\n *\n * Converts v1 flat props to v2 composable interfaces for backwards compatibility.\n */\nfunction ReactGridLayout(props: LegacyReactGridLayoutProps) {\n const {\n // Required\n children,\n width,\n\n // Grid measurement\n cols = 12,\n rowHeight = 150,\n maxRows = Infinity,\n margin = [10, 10],\n containerPadding = null,\n\n // Layout data\n layout,\n droppingItem,\n\n // Compaction\n compactType: compactTypeProp,\n preventCollision = false,\n allowOverlap = false,\n verticalCompact,\n\n // Drag behavior\n isDraggable = true,\n isBounded = false,\n draggableHandle,\n draggableCancel,\n\n // Resize behavior\n isResizable = true,\n resizeHandles = [\"se\"],\n resizeHandle,\n\n // Drop behavior\n isDroppable = false,\n\n // Position\n useCSSTransforms = true,\n transformScale = 1,\n\n // Container props\n autoSize,\n className,\n style,\n innerRef,\n\n // Callbacks\n onLayoutChange,\n onDragStart,\n onDrag,\n onDragStop,\n onResizeStart,\n onResize,\n onResizeStop,\n onDrop,\n onDropDragOver\n } = props;\n\n // Handle deprecated verticalCompact prop\n let compactType: CompactType =\n compactTypeProp === undefined ? \"vertical\" : compactTypeProp;\n if (verticalCompact === false) {\n if (process.env[\"NODE_ENV\"] !== \"production\") {\n console.warn(\n \"`verticalCompact` on <ReactGridLayout> is deprecated and will be removed soon. \" +\n 'Use `compactType`: \"horizontal\" | \"vertical\" | null.'\n );\n }\n compactType = null;\n }\n\n // Convert flat props to composable interfaces\n\n const gridConfig: Partial<GridConfig> = {\n cols,\n rowHeight,\n maxRows,\n margin,\n containerPadding\n };\n\n const dragConfig: Partial<DragConfig> = {\n enabled: isDraggable,\n bounded: isBounded,\n handle: draggableHandle,\n cancel: draggableCancel\n };\n\n const resizeConfig: Partial<ResizeConfig> = {\n enabled: isResizable,\n handles: resizeHandles,\n handleComponent: resizeHandle\n };\n\n const dropConfig: Partial<DropConfig> = {\n enabled: isDroppable\n };\n\n // Build position strategy\n let positionStrategy: PositionStrategy;\n if (!useCSSTransforms) {\n positionStrategy = absoluteStrategy;\n } else if (transformScale !== 1) {\n positionStrategy = createScaledStrategy(transformScale);\n } else {\n positionStrategy = transformStrategy;\n }\n\n // Get compactor from type and options\n const compactor = getCompactor(compactType, allowOverlap, preventCollision);\n\n // Build constraints array based on legacy props\n // When isBounded is true, add containerBounds constraint\n const constraints: LayoutConstraint[] = isBounded\n ? [...defaultConstraints, containerBounds]\n : defaultConstraints;\n\n return (\n <GridLayout\n width={width}\n gridConfig={gridConfig}\n dragConfig={dragConfig}\n resizeConfig={resizeConfig}\n dropConfig={dropConfig}\n positionStrategy={positionStrategy}\n compactor={compactor}\n constraints={constraints}\n layout={layout}\n droppingItem={droppingItem}\n autoSize={autoSize}\n className={className}\n style={style}\n innerRef={innerRef}\n onLayoutChange={onLayoutChange}\n onDragStart={onDragStart}\n onDrag={onDrag}\n onDragStop={onDragStop}\n onResizeStart={onResizeStart}\n onResize={onResize}\n onResizeStop={onResizeStop}\n onDrop={onDrop}\n onDropDragOver={onDropDragOver}\n >\n {children}\n </GridLayout>\n );\n}\n\n// Static properties for backwards compatibility\nReactGridLayout.displayName = \"ReactGridLayout\";\n\nexport default ReactGridLayout;\nexport { ReactGridLayout };\n","/**\n * Legacy ResponsiveReactGridLayout wrapper\n *\n * This component wraps the new TypeScript ResponsiveGridLayout to provide\n * backwards compatibility with the v1 API by converting flat props\n * to the new composable interface format.\n */\n\nimport React from \"react\";\nimport {\n ResponsiveGridLayout,\n type ResponsiveGridLayoutProps\n} from \"../react/components/ResponsiveGridLayout.js\";\nimport type {\n Layout,\n LayoutItem,\n CompactType,\n Breakpoint,\n Breakpoints,\n ResponsiveLayouts,\n ResizeHandleAxis,\n DragConfig,\n ResizeConfig,\n DropConfig,\n PositionStrategy\n} from \"../core/types.js\";\nimport { getCompactor } from \"../core/compactors.js\";\nimport {\n transformStrategy,\n absoluteStrategy,\n createScaledStrategy\n} from \"../core/position.js\";\n\n// ============================================================================\n// Legacy Props Interface\n// ============================================================================\n\n/**\n * Legacy props interface for backwards compatibility with v1 API.\n * These flat props are converted to composable interfaces internally.\n */\nexport interface LegacyResponsiveReactGridLayoutProps<\n B extends Breakpoint = string\n> {\n // Required\n children: React.ReactNode;\n width: number;\n\n // Responsive-specific\n breakpoint?: B;\n breakpoints?: Breakpoints<B>;\n cols?: Breakpoints<B>;\n layouts?: ResponsiveLayouts<B>;\n onBreakpointChange?: (newBreakpoint: B, cols: number) => void;\n onLayoutChange?: (layout: Layout, layouts: ResponsiveLayouts<B>) => void;\n onWidthChange?: (\n containerWidth: number,\n margin: readonly [number, number],\n cols: number,\n containerPadding: readonly [number, number] | null\n ) => void;\n\n // Grid measurement\n rowHeight?: number;\n maxRows?: number;\n margin?:\n | readonly [number, number]\n | Partial<Record<B, readonly [number, number]>>;\n containerPadding?:\n | readonly [number, number]\n | Partial<Record<B, readonly [number, number] | null>>\n | null;\n\n // Layout data\n droppingItem?: LayoutItem;\n\n // Compaction (→ compactor)\n compactType?: CompactType;\n preventCollision?: boolean;\n allowOverlap?: boolean;\n /** @deprecated Use compactType instead */\n verticalCompact?: boolean;\n\n // Drag behavior (→ dragConfig)\n isDraggable?: boolean;\n isBounded?: boolean;\n draggableHandle?: string;\n draggableCancel?: string;\n\n // Resize behavior (→ resizeConfig)\n isResizable?: boolean;\n resizeHandles?: ResizeHandleAxis[];\n resizeHandle?:\n | React.ReactElement\n | ((\n axis: ResizeHandleAxis,\n ref: React.Ref<HTMLElement>\n ) => React.ReactElement);\n\n // Drop behavior (→ dropConfig)\n isDroppable?: boolean;\n\n // Position (→ positionStrategy)\n useCSSTransforms?: boolean;\n transformScale?: number;\n\n // Container props (passed through)\n autoSize?: boolean;\n className?: string;\n style?: React.CSSProperties;\n innerRef?: React.Ref<HTMLDivElement>;\n\n // Callbacks (passed through)\n onDragStart?: ResponsiveGridLayoutProps<B>[\"onDragStart\"];\n onDrag?: ResponsiveGridLayoutProps<B>[\"onDrag\"];\n onDragStop?: ResponsiveGridLayoutProps<B>[\"onDragStop\"];\n onResizeStart?: ResponsiveGridLayoutProps<B>[\"onResizeStart\"];\n onResize?: ResponsiveGridLayoutProps<B>[\"onResize\"];\n onResizeStop?: ResponsiveGridLayoutProps<B>[\"onResizeStop\"];\n onDrop?: (layout: Layout, item: LayoutItem | undefined, e: Event) => void;\n onDropDragOver?: (\n e: React.DragEvent\n ) => { w?: number; h?: number } | false | void;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\n/**\n * ResponsiveReactGridLayout - Legacy wrapper component\n *\n * Converts v1 flat props to v2 composable interfaces for backwards compatibility.\n */\nfunction ResponsiveReactGridLayout<B extends Breakpoint = string>(\n props: LegacyResponsiveReactGridLayoutProps<B>\n) {\n const {\n // Required\n children,\n width,\n\n // Responsive-specific\n breakpoint,\n breakpoints,\n cols,\n layouts,\n onBreakpointChange,\n onLayoutChange,\n onWidthChange,\n\n // Grid measurement\n rowHeight,\n maxRows,\n margin,\n containerPadding,\n\n // Layout data\n droppingItem,\n\n // Compaction\n compactType: compactTypeProp,\n preventCollision = false,\n allowOverlap = false,\n verticalCompact,\n\n // Drag behavior\n isDraggable = true,\n isBounded = false,\n draggableHandle,\n draggableCancel,\n\n // Resize behavior\n isResizable = true,\n resizeHandles = [\"se\"],\n resizeHandle,\n\n // Drop behavior\n isDroppable = false,\n\n // Position\n useCSSTransforms = true,\n transformScale = 1,\n\n // Container props\n autoSize,\n className,\n style,\n innerRef,\n\n // Callbacks\n onDragStart,\n onDrag,\n onDragStop,\n onResizeStart,\n onResize,\n onResizeStop,\n onDrop,\n onDropDragOver\n } = props;\n\n // Handle deprecated verticalCompact prop\n let compactType: CompactType =\n compactTypeProp === undefined ? \"vertical\" : compactTypeProp;\n if (verticalCompact === false) {\n if (process.env[\"NODE_ENV\"] !== \"production\") {\n console.warn(\n \"`verticalCompact` on <ResponsiveReactGridLayout> is deprecated and will be removed soon. \" +\n 'Use `compactType`: \"horizontal\" | \"vertical\" | null.'\n );\n }\n compactType = null;\n }\n\n // Convert flat props to composable interfaces\n\n const dragConfig: Partial<DragConfig> = {\n enabled: isDraggable,\n bounded: isBounded,\n handle: draggableHandle,\n cancel: draggableCancel\n };\n\n const resizeConfig: Partial<ResizeConfig> = {\n enabled: isResizable,\n handles: resizeHandles,\n handleComponent: resizeHandle\n };\n\n const dropConfig: Partial<DropConfig> = {\n enabled: isDroppable\n };\n\n // Build position strategy\n let positionStrategy: PositionStrategy;\n if (!useCSSTransforms) {\n positionStrategy = absoluteStrategy;\n } else if (transformScale !== 1) {\n positionStrategy = createScaledStrategy(transformScale);\n } else {\n positionStrategy = transformStrategy;\n }\n\n // Get compactor from type and options\n const compactor = getCompactor(compactType, allowOverlap, preventCollision);\n\n return (\n <ResponsiveGridLayout<B>\n width={width}\n breakpoint={breakpoint}\n breakpoints={breakpoints}\n cols={cols}\n layouts={layouts}\n rowHeight={rowHeight}\n maxRows={maxRows}\n margin={margin}\n containerPadding={containerPadding}\n compactor={compactor}\n dragConfig={dragConfig}\n resizeConfig={resizeConfig}\n dropConfig={dropConfig}\n positionStrategy={positionStrategy}\n droppingItem={droppingItem}\n autoSize={autoSize}\n className={className}\n style={style}\n innerRef={innerRef}\n onBreakpointChange={onBreakpointChange}\n onLayoutChange={onLayoutChange}\n onWidthChange={onWidthChange}\n onDragStart={onDragStart}\n onDrag={onDrag}\n onDragStop={onDragStop}\n onResizeStart={onResizeStart}\n onResize={onResize}\n onResizeStop={onResizeStop}\n onDrop={onDrop}\n onDropDragOver={onDropDragOver}\n >\n {children}\n </ResponsiveGridLayout>\n );\n}\n\n// Static properties for backwards compatibility\nResponsiveReactGridLayout.displayName = \"ResponsiveReactGridLayout\";\n\nexport default ResponsiveReactGridLayout;\nexport { ResponsiveReactGridLayout, ResponsiveReactGridLayout as Responsive };\n","/**\n * WidthProvider HOC\n *\n * A Higher-Order Component that provides width measurement to grid layouts.\n * This wraps any component and provides the container width as a prop.\n */\n\nimport React, { useState, useRef, useEffect, type ComponentType } from \"react\";\nimport clsx from \"clsx\";\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface WidthProviderProps {\n /** If true, will not render children until mounted */\n measureBeforeMount?: boolean;\n /** Additional class name */\n className?: string;\n /** Additional styles */\n style?: React.CSSProperties;\n}\n\ntype WithWidthProps<P> = Omit<P, \"width\"> & WidthProviderProps;\n\n// ============================================================================\n// Constants\n// ============================================================================\n\nconst layoutClassName = \"react-grid-layout\";\n\n// ============================================================================\n// WidthProvider HOC\n// ============================================================================\n\n/**\n * WidthProvider - HOC that provides container width\n *\n * A simple HOC that provides facility for listening to container resizes.\n * Wraps the provided component and passes down a `width` prop.\n *\n * @example\n * ```tsx\n * import { GridLayout, WidthProvider } from 'react-grid-layout';\n *\n * const GridLayoutWithWidth = WidthProvider(GridLayout);\n *\n * function MyGrid() {\n * return (\n * <GridLayoutWithWidth cols={12} rowHeight={30}>\n * <div key=\"a\">a</div>\n * </GridLayoutWithWidth>\n * );\n * }\n * ```\n */\nexport function WidthProvider<P extends { width: number }>(\n ComposedComponent: ComponentType<P>\n): ComponentType<WithWidthProps<P>> {\n function WidthProviderWrapper(props: WithWidthProps<P>) {\n const { measureBeforeMount = false, className, style, ...rest } = props;\n\n const [width, setWidth] = useState(1280);\n const [mounted, setMounted] = useState(false);\n const elementRef = useRef<HTMLDivElement>(null);\n const resizeObserverRef = useRef<ResizeObserver | null>(null);\n\n // Set mounted state on first render\n useEffect(() => {\n setMounted(true);\n }, []);\n\n // Set up ResizeObserver - re-runs when mounted changes to observe the new element\n // This fixes measureBeforeMount where the ref changes from placeholder to composed component\n useEffect(() => {\n const node = elementRef.current;\n if (!(node instanceof HTMLElement)) return;\n\n const observer = new ResizeObserver(entries => {\n if (entries[0]) {\n const newWidth = entries[0].contentRect.width;\n setWidth(newWidth);\n }\n });\n\n observer.observe(node);\n resizeObserverRef.current = observer;\n\n return () => {\n observer.unobserve(node);\n observer.disconnect();\n };\n }, [mounted]);\n\n // If measureBeforeMount is true and not yet mounted, render placeholder\n if (measureBeforeMount && !mounted) {\n return (\n <div\n className={clsx(className, layoutClassName)}\n style={style}\n ref={elementRef}\n />\n );\n }\n\n return (\n <ComposedComponent\n innerRef={elementRef}\n className={className}\n style={style}\n {...(rest as unknown as P)}\n width={width}\n />\n );\n }\n\n WidthProviderWrapper.displayName = `WidthProvider(${ComposedComponent.displayName || ComposedComponent.name || \"Component\"})`;\n\n return WidthProviderWrapper;\n}\n\nexport default WidthProvider;\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { L as Layout, a as LayoutItem, C as CompactType, M as Mutable, c as Compactor, P as Position, d as ResizeHandleAxis,
|
|
1
|
+
import { L as Layout, a as LayoutItem, C as CompactType, M as Mutable, c as Compactor, P as Position, d as ResizeHandleAxis, k as PositionStrategy } from './types-CokovIMH.mjs';
|
|
2
2
|
|
|
3
3
|
/**
|
|
4
4
|
* Core layout manipulation utilities.
|
|
@@ -107,10 +107,10 @@ declare function correctBounds(layout: Mutable<LayoutItem>[], bounds: {
|
|
|
107
107
|
* @param x - New X position (or undefined to keep current)
|
|
108
108
|
* @param y - New Y position (or undefined to keep current)
|
|
109
109
|
* @param isUserAction - True if this is a direct user action (affects collision resolution)
|
|
110
|
-
* @param preventCollision - True to
|
|
110
|
+
* @param preventCollision - True to block movement into occupied space (item snaps back). No effect if allowOverlap is true.
|
|
111
111
|
* @param compactType - Compaction type for collision resolution
|
|
112
112
|
* @param cols - Number of columns in the grid
|
|
113
|
-
* @param allowOverlap - True to allow items to
|
|
113
|
+
* @param allowOverlap - True to allow items to stack on top of each other
|
|
114
114
|
* @returns The updated layout
|
|
115
115
|
*/
|
|
116
116
|
declare function moveElement(layout: Layout, l: LayoutItem, x: number | undefined, y: number | undefined, isUserAction: boolean | undefined, preventCollision: boolean | undefined, compactType: CompactType, cols: number, allowOverlap?: boolean): LayoutItem[];
|
|
@@ -157,8 +157,9 @@ declare function validateLayout(layout: Layout, contextName?: string): void;
|
|
|
157
157
|
* @param item - Item being moved (will be mutated)
|
|
158
158
|
* @param moveToCoord - Target coordinate
|
|
159
159
|
* @param axis - Which axis to move on ('x' or 'y')
|
|
160
|
+
* @param hasStatics - Whether layout contains static items (disables early break optimization)
|
|
160
161
|
*/
|
|
161
|
-
declare function resolveCompactionCollision(layout: Layout, item: LayoutItem, moveToCoord: number, axis: "x" | "y"): void;
|
|
162
|
+
declare function resolveCompactionCollision(layout: Layout, item: LayoutItem, moveToCoord: number, axis: "x" | "y", hasStatics?: boolean): void;
|
|
162
163
|
/**
|
|
163
164
|
* Compact a single item vertically (move up).
|
|
164
165
|
*
|
|
@@ -226,11 +227,15 @@ declare const horizontalOverlapCompactor: Compactor;
|
|
|
226
227
|
* This is a convenience function for backwards compatibility with the
|
|
227
228
|
* string-based compactType API.
|
|
228
229
|
*
|
|
229
|
-
*
|
|
230
|
+
* Note: For 'wrap' mode, import `wrapCompactor` from 'react-grid-layout/extras'
|
|
231
|
+
* and pass it directly to the `compactor` prop. This function returns
|
|
232
|
+
* `noCompactor` for 'wrap' type since the wrap compactor is tree-shakeable.
|
|
233
|
+
*
|
|
234
|
+
* @param compactType - 'vertical', 'horizontal', 'wrap', or null
|
|
230
235
|
* @param allowOverlap - Whether to allow overlapping items
|
|
231
236
|
* @returns The appropriate Compactor
|
|
232
237
|
*/
|
|
233
|
-
declare function getCompactor(compactType:
|
|
238
|
+
declare function getCompactor(compactType: CompactType, allowOverlap?: boolean, preventCollision?: boolean): Compactor;
|
|
234
239
|
|
|
235
240
|
/**
|
|
236
241
|
* Position calculation utilities.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { L as Layout, a as LayoutItem, C as CompactType, M as Mutable, c as Compactor, P as Position, d as ResizeHandleAxis,
|
|
1
|
+
import { L as Layout, a as LayoutItem, C as CompactType, M as Mutable, c as Compactor, P as Position, d as ResizeHandleAxis, k as PositionStrategy } from './types-CokovIMH.js';
|
|
2
2
|
|
|
3
3
|
/**
|
|
4
4
|
* Core layout manipulation utilities.
|
|
@@ -107,10 +107,10 @@ declare function correctBounds(layout: Mutable<LayoutItem>[], bounds: {
|
|
|
107
107
|
* @param x - New X position (or undefined to keep current)
|
|
108
108
|
* @param y - New Y position (or undefined to keep current)
|
|
109
109
|
* @param isUserAction - True if this is a direct user action (affects collision resolution)
|
|
110
|
-
* @param preventCollision - True to
|
|
110
|
+
* @param preventCollision - True to block movement into occupied space (item snaps back). No effect if allowOverlap is true.
|
|
111
111
|
* @param compactType - Compaction type for collision resolution
|
|
112
112
|
* @param cols - Number of columns in the grid
|
|
113
|
-
* @param allowOverlap - True to allow items to
|
|
113
|
+
* @param allowOverlap - True to allow items to stack on top of each other
|
|
114
114
|
* @returns The updated layout
|
|
115
115
|
*/
|
|
116
116
|
declare function moveElement(layout: Layout, l: LayoutItem, x: number | undefined, y: number | undefined, isUserAction: boolean | undefined, preventCollision: boolean | undefined, compactType: CompactType, cols: number, allowOverlap?: boolean): LayoutItem[];
|
|
@@ -157,8 +157,9 @@ declare function validateLayout(layout: Layout, contextName?: string): void;
|
|
|
157
157
|
* @param item - Item being moved (will be mutated)
|
|
158
158
|
* @param moveToCoord - Target coordinate
|
|
159
159
|
* @param axis - Which axis to move on ('x' or 'y')
|
|
160
|
+
* @param hasStatics - Whether layout contains static items (disables early break optimization)
|
|
160
161
|
*/
|
|
161
|
-
declare function resolveCompactionCollision(layout: Layout, item: LayoutItem, moveToCoord: number, axis: "x" | "y"): void;
|
|
162
|
+
declare function resolveCompactionCollision(layout: Layout, item: LayoutItem, moveToCoord: number, axis: "x" | "y", hasStatics?: boolean): void;
|
|
162
163
|
/**
|
|
163
164
|
* Compact a single item vertically (move up).
|
|
164
165
|
*
|
|
@@ -226,11 +227,15 @@ declare const horizontalOverlapCompactor: Compactor;
|
|
|
226
227
|
* This is a convenience function for backwards compatibility with the
|
|
227
228
|
* string-based compactType API.
|
|
228
229
|
*
|
|
229
|
-
*
|
|
230
|
+
* Note: For 'wrap' mode, import `wrapCompactor` from 'react-grid-layout/extras'
|
|
231
|
+
* and pass it directly to the `compactor` prop. This function returns
|
|
232
|
+
* `noCompactor` for 'wrap' type since the wrap compactor is tree-shakeable.
|
|
233
|
+
*
|
|
234
|
+
* @param compactType - 'vertical', 'horizontal', 'wrap', or null
|
|
230
235
|
* @param allowOverlap - Whether to allow overlapping items
|
|
231
236
|
* @returns The appropriate Compactor
|
|
232
237
|
*/
|
|
233
|
-
declare function getCompactor(compactType:
|
|
238
|
+
declare function getCompactor(compactType: CompactType, allowOverlap?: boolean, preventCollision?: boolean): Compactor;
|
|
234
239
|
|
|
235
240
|
/**
|
|
236
241
|
* Position calculation utilities.
|
package/dist/react.d.mts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React__default, { ReactElement, CSSProperties, RefObject } from 'react';
|
|
2
|
-
import { D as DroppingPosition, d as ResizeHandleAxis,
|
|
3
|
-
export { P as Position } from './types-
|
|
4
|
-
export { E as EventCallback, G as GridLayout, a as GridLayoutProps, R as ResponsiveGridLayout, b as ResponsiveGridLayoutProps } from './ResponsiveGridLayout-
|
|
5
|
-
export { b as bottom, c as cloneLayout, a as cloneLayoutItem, d as getCompactor, g as getLayoutItem, h as horizontalCompactor, n as noCompactor, f as setTopLeft, s as setTransform, e as verticalCompactor } from './position-
|
|
6
|
-
export { c as calcGridItemPosition, b as calcWH, a as calcXY } from './calculate-
|
|
2
|
+
import { D as DroppingPosition, d as ResizeHandleAxis, f as LayoutConstraint, a as LayoutItem, L as Layout, G as GridDragEvent, e as GridResizeEvent, C as CompactType, c as Compactor, B as Breakpoint, b as Breakpoints, R as ResponsiveLayouts } from './types-CokovIMH.mjs';
|
|
3
|
+
export { P as Position } from './types-CokovIMH.mjs';
|
|
4
|
+
export { E as EventCallback, G as GridLayout, a as GridLayoutProps, R as ResponsiveGridLayout, b as ResponsiveGridLayoutProps } from './ResponsiveGridLayout-BkHF9YHa.mjs';
|
|
5
|
+
export { b as bottom, c as cloneLayout, a as cloneLayoutItem, d as getCompactor, g as getLayoutItem, h as horizontalCompactor, n as noCompactor, f as setTopLeft, s as setTransform, e as verticalCompactor } from './position-C8a5g6bb.mjs';
|
|
6
|
+
export { c as calcGridItemPosition, b as calcWH, a as calcXY } from './calculate-DwbL1D06.mjs';
|
|
7
7
|
|
|
8
8
|
/**
|
|
9
9
|
* GridItem component
|
|
@@ -74,6 +74,12 @@ interface GridItemProps {
|
|
|
74
74
|
resizeHandles?: ResizeHandleAxis[];
|
|
75
75
|
/** Custom resize handle */
|
|
76
76
|
resizeHandle?: ResizeHandle;
|
|
77
|
+
/** Layout constraints for position/size limiting */
|
|
78
|
+
constraints?: LayoutConstraint[];
|
|
79
|
+
/** The layout item data (for per-item constraints) */
|
|
80
|
+
layoutItem?: LayoutItem;
|
|
81
|
+
/** Current layout (for constraint context) */
|
|
82
|
+
layout?: Layout;
|
|
77
83
|
/** Called when drag starts */
|
|
78
84
|
onDragStart?: GridItemCallback<GridDragEvent>;
|
|
79
85
|
/** Called during drag */
|
package/dist/react.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React__default, { ReactElement, CSSProperties, RefObject } from 'react';
|
|
2
|
-
import { D as DroppingPosition, d as ResizeHandleAxis,
|
|
3
|
-
export { P as Position } from './types-
|
|
4
|
-
export { E as EventCallback, G as GridLayout, a as GridLayoutProps, R as ResponsiveGridLayout, b as ResponsiveGridLayoutProps } from './ResponsiveGridLayout-
|
|
5
|
-
export { b as bottom, c as cloneLayout, a as cloneLayoutItem, d as getCompactor, g as getLayoutItem, h as horizontalCompactor, n as noCompactor, f as setTopLeft, s as setTransform, e as verticalCompactor } from './position-
|
|
6
|
-
export { c as calcGridItemPosition, b as calcWH, a as calcXY } from './calculate-
|
|
2
|
+
import { D as DroppingPosition, d as ResizeHandleAxis, f as LayoutConstraint, a as LayoutItem, L as Layout, G as GridDragEvent, e as GridResizeEvent, C as CompactType, c as Compactor, B as Breakpoint, b as Breakpoints, R as ResponsiveLayouts } from './types-CokovIMH.js';
|
|
3
|
+
export { P as Position } from './types-CokovIMH.js';
|
|
4
|
+
export { E as EventCallback, G as GridLayout, a as GridLayoutProps, R as ResponsiveGridLayout, b as ResponsiveGridLayoutProps } from './ResponsiveGridLayout-CLn16-X3.js';
|
|
5
|
+
export { b as bottom, c as cloneLayout, a as cloneLayoutItem, d as getCompactor, g as getLayoutItem, h as horizontalCompactor, n as noCompactor, f as setTopLeft, s as setTransform, e as verticalCompactor } from './position-H8tBL91b.js';
|
|
6
|
+
export { c as calcGridItemPosition, b as calcWH, a as calcXY } from './calculate-DsVTldEE.js';
|
|
7
7
|
|
|
8
8
|
/**
|
|
9
9
|
* GridItem component
|
|
@@ -74,6 +74,12 @@ interface GridItemProps {
|
|
|
74
74
|
resizeHandles?: ResizeHandleAxis[];
|
|
75
75
|
/** Custom resize handle */
|
|
76
76
|
resizeHandle?: ResizeHandle;
|
|
77
|
+
/** Layout constraints for position/size limiting */
|
|
78
|
+
constraints?: LayoutConstraint[];
|
|
79
|
+
/** The layout item data (for per-item constraints) */
|
|
80
|
+
layoutItem?: LayoutItem;
|
|
81
|
+
/** Current layout (for constraint context) */
|
|
82
|
+
layout?: Layout;
|
|
77
83
|
/** Called when drag starts */
|
|
78
84
|
onDragStart?: GridItemCallback<GridDragEvent>;
|
|
79
85
|
/** Called during drag */
|
package/dist/react.js
CHANGED
|
@@ -1,96 +1,96 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
4
|
-
require('./chunk-
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
var
|
|
3
|
+
var chunkGPZBANOK_js = require('./chunk-GPZBANOK.js');
|
|
4
|
+
require('./chunk-7ELO5FRW.js');
|
|
5
|
+
var chunkQRW3ND4U_js = require('./chunk-QRW3ND4U.js');
|
|
6
|
+
var chunkFN6MIZ24_js = require('./chunk-FN6MIZ24.js');
|
|
7
|
+
var chunkBJFPTW5Q_js = require('./chunk-BJFPTW5Q.js');
|
|
8
8
|
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
Object.defineProperty(exports, "DEFAULT_BREAKPOINTS", {
|
|
12
12
|
enumerable: true,
|
|
13
|
-
get: function () { return
|
|
13
|
+
get: function () { return chunkGPZBANOK_js.DEFAULT_BREAKPOINTS; }
|
|
14
14
|
});
|
|
15
15
|
Object.defineProperty(exports, "DEFAULT_COLS", {
|
|
16
16
|
enumerable: true,
|
|
17
|
-
get: function () { return
|
|
17
|
+
get: function () { return chunkGPZBANOK_js.DEFAULT_COLS; }
|
|
18
18
|
});
|
|
19
19
|
Object.defineProperty(exports, "useContainerWidth", {
|
|
20
20
|
enumerable: true,
|
|
21
|
-
get: function () { return
|
|
21
|
+
get: function () { return chunkGPZBANOK_js.useContainerWidth; }
|
|
22
22
|
});
|
|
23
23
|
Object.defineProperty(exports, "useGridLayout", {
|
|
24
24
|
enumerable: true,
|
|
25
|
-
get: function () { return
|
|
25
|
+
get: function () { return chunkGPZBANOK_js.useGridLayout; }
|
|
26
26
|
});
|
|
27
27
|
Object.defineProperty(exports, "useResponsiveLayout", {
|
|
28
28
|
enumerable: true,
|
|
29
|
-
get: function () { return
|
|
29
|
+
get: function () { return chunkGPZBANOK_js.useResponsiveLayout; }
|
|
30
30
|
});
|
|
31
31
|
Object.defineProperty(exports, "GridItem", {
|
|
32
32
|
enumerable: true,
|
|
33
|
-
get: function () { return
|
|
33
|
+
get: function () { return chunkQRW3ND4U_js.GridItem; }
|
|
34
34
|
});
|
|
35
35
|
Object.defineProperty(exports, "GridLayout", {
|
|
36
36
|
enumerable: true,
|
|
37
|
-
get: function () { return
|
|
37
|
+
get: function () { return chunkQRW3ND4U_js.GridLayout; }
|
|
38
38
|
});
|
|
39
39
|
Object.defineProperty(exports, "ResponsiveGridLayout", {
|
|
40
40
|
enumerable: true,
|
|
41
|
-
get: function () { return
|
|
42
|
-
});
|
|
43
|
-
Object.defineProperty(exports, "bottom", {
|
|
44
|
-
enumerable: true,
|
|
45
|
-
get: function () { return chunk3WO4SAYB_js.bottom; }
|
|
46
|
-
});
|
|
47
|
-
Object.defineProperty(exports, "cloneLayout", {
|
|
48
|
-
enumerable: true,
|
|
49
|
-
get: function () { return chunk3WO4SAYB_js.cloneLayout; }
|
|
50
|
-
});
|
|
51
|
-
Object.defineProperty(exports, "cloneLayoutItem", {
|
|
52
|
-
enumerable: true,
|
|
53
|
-
get: function () { return chunk3WO4SAYB_js.cloneLayoutItem; }
|
|
41
|
+
get: function () { return chunkQRW3ND4U_js.ResponsiveGridLayout; }
|
|
54
42
|
});
|
|
55
43
|
Object.defineProperty(exports, "getCompactor", {
|
|
56
44
|
enumerable: true,
|
|
57
|
-
get: function () { return
|
|
58
|
-
});
|
|
59
|
-
Object.defineProperty(exports, "getLayoutItem", {
|
|
60
|
-
enumerable: true,
|
|
61
|
-
get: function () { return chunk3WO4SAYB_js.getLayoutItem; }
|
|
45
|
+
get: function () { return chunkFN6MIZ24_js.getCompactor; }
|
|
62
46
|
});
|
|
63
47
|
Object.defineProperty(exports, "horizontalCompactor", {
|
|
64
48
|
enumerable: true,
|
|
65
|
-
get: function () { return
|
|
49
|
+
get: function () { return chunkFN6MIZ24_js.horizontalCompactor; }
|
|
66
50
|
});
|
|
67
51
|
Object.defineProperty(exports, "noCompactor", {
|
|
68
52
|
enumerable: true,
|
|
69
|
-
get: function () { return
|
|
53
|
+
get: function () { return chunkFN6MIZ24_js.noCompactor; }
|
|
70
54
|
});
|
|
71
55
|
Object.defineProperty(exports, "setTopLeft", {
|
|
72
56
|
enumerable: true,
|
|
73
|
-
get: function () { return
|
|
57
|
+
get: function () { return chunkFN6MIZ24_js.setTopLeft; }
|
|
74
58
|
});
|
|
75
59
|
Object.defineProperty(exports, "setTransform", {
|
|
76
60
|
enumerable: true,
|
|
77
|
-
get: function () { return
|
|
61
|
+
get: function () { return chunkFN6MIZ24_js.setTransform; }
|
|
78
62
|
});
|
|
79
63
|
Object.defineProperty(exports, "verticalCompactor", {
|
|
80
64
|
enumerable: true,
|
|
81
|
-
get: function () { return
|
|
65
|
+
get: function () { return chunkFN6MIZ24_js.verticalCompactor; }
|
|
66
|
+
});
|
|
67
|
+
Object.defineProperty(exports, "bottom", {
|
|
68
|
+
enumerable: true,
|
|
69
|
+
get: function () { return chunkBJFPTW5Q_js.bottom; }
|
|
82
70
|
});
|
|
83
71
|
Object.defineProperty(exports, "calcGridItemPosition", {
|
|
84
72
|
enumerable: true,
|
|
85
|
-
get: function () { return
|
|
73
|
+
get: function () { return chunkBJFPTW5Q_js.calcGridItemPosition; }
|
|
86
74
|
});
|
|
87
75
|
Object.defineProperty(exports, "calcWH", {
|
|
88
76
|
enumerable: true,
|
|
89
|
-
get: function () { return
|
|
77
|
+
get: function () { return chunkBJFPTW5Q_js.calcWH; }
|
|
90
78
|
});
|
|
91
79
|
Object.defineProperty(exports, "calcXY", {
|
|
92
80
|
enumerable: true,
|
|
93
|
-
get: function () { return
|
|
81
|
+
get: function () { return chunkBJFPTW5Q_js.calcXY; }
|
|
82
|
+
});
|
|
83
|
+
Object.defineProperty(exports, "cloneLayout", {
|
|
84
|
+
enumerable: true,
|
|
85
|
+
get: function () { return chunkBJFPTW5Q_js.cloneLayout; }
|
|
86
|
+
});
|
|
87
|
+
Object.defineProperty(exports, "cloneLayoutItem", {
|
|
88
|
+
enumerable: true,
|
|
89
|
+
get: function () { return chunkBJFPTW5Q_js.cloneLayoutItem; }
|
|
90
|
+
});
|
|
91
|
+
Object.defineProperty(exports, "getLayoutItem", {
|
|
92
|
+
enumerable: true,
|
|
93
|
+
get: function () { return chunkBJFPTW5Q_js.getLayoutItem; }
|
|
94
94
|
});
|
|
95
95
|
//# sourceMappingURL=react.js.map
|
|
96
96
|
//# sourceMappingURL=react.js.map
|
package/dist/react.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
export { DEFAULT_BREAKPOINTS, DEFAULT_COLS, useContainerWidth, useGridLayout, useResponsiveLayout } from './chunk-
|
|
2
|
-
import './chunk-
|
|
3
|
-
export { GridItem, GridLayout, ResponsiveGridLayout } from './chunk-
|
|
4
|
-
export {
|
|
5
|
-
export { calcGridItemPosition, calcWH, calcXY } from './chunk-
|
|
1
|
+
export { DEFAULT_BREAKPOINTS, DEFAULT_COLS, useContainerWidth, useGridLayout, useResponsiveLayout } from './chunk-LWF5EYMO.mjs';
|
|
2
|
+
import './chunk-526JND3R.mjs';
|
|
3
|
+
export { GridItem, GridLayout, ResponsiveGridLayout } from './chunk-MXXN7GUE.mjs';
|
|
4
|
+
export { getCompactor, horizontalCompactor, noCompactor, setTopLeft, setTransform, verticalCompactor } from './chunk-2O3ZME4Q.mjs';
|
|
5
|
+
export { bottom, calcGridItemPosition, calcWH, calcXY, cloneLayout, cloneLayoutItem, getLayoutItem } from './chunk-AWM66AWF.mjs';
|
|
6
6
|
//# sourceMappingURL=react.mjs.map
|
|
7
7
|
//# sourceMappingURL=react.mjs.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { a as LayoutItem, L as Layout, C as CompactType, B as Breakpoint, b as Breakpoints, R as ResponsiveLayouts } from './types-
|
|
1
|
+
import { a as LayoutItem, L as Layout, C as CompactType, B as Breakpoint, b as Breakpoints, R as ResponsiveLayouts } from './types-CokovIMH.mjs';
|
|
2
2
|
|
|
3
3
|
/**
|
|
4
4
|
* Collision detection utilities for grid layouts.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { a as LayoutItem, L as Layout, C as CompactType, B as Breakpoint, b as Breakpoints, R as ResponsiveLayouts } from './types-
|
|
1
|
+
import { a as LayoutItem, L as Layout, C as CompactType, B as Breakpoint, b as Breakpoints, R as ResponsiveLayouts } from './types-CokovIMH.js';
|
|
2
2
|
|
|
3
3
|
/**
|
|
4
4
|
* Collision detection utilities for grid layouts.
|
|
@@ -66,6 +66,11 @@ interface LayoutItem {
|
|
|
66
66
|
* @internal
|
|
67
67
|
*/
|
|
68
68
|
moved?: boolean;
|
|
69
|
+
/**
|
|
70
|
+
* Per-item layout constraints.
|
|
71
|
+
* Applied in addition to grid-level constraints.
|
|
72
|
+
*/
|
|
73
|
+
constraints?: LayoutConstraint[];
|
|
69
74
|
}
|
|
70
75
|
/**
|
|
71
76
|
* A layout is a readonly array of layout items.
|
|
@@ -145,9 +150,10 @@ interface DragOverEvent extends MouseEvent {
|
|
|
145
150
|
* Type of compaction to apply to the layout.
|
|
146
151
|
* - 'vertical': Items compact upward (default)
|
|
147
152
|
* - 'horizontal': Items compact leftward
|
|
153
|
+
* - 'wrap': Items arranged in wrapped-paragraph style (like words in text)
|
|
148
154
|
* - null: No compaction (free-form positioning)
|
|
149
155
|
*/
|
|
150
|
-
type CompactType = "horizontal" | "vertical" | null;
|
|
156
|
+
type CompactType = "horizontal" | "vertical" | "wrap" | null;
|
|
151
157
|
/**
|
|
152
158
|
* Standard callback signature for layout change events.
|
|
153
159
|
*
|
|
@@ -187,9 +193,25 @@ type OnLayoutChangeCallback = (layout: Layout) => void;
|
|
|
187
193
|
interface Compactor {
|
|
188
194
|
/** Compaction type identifier */
|
|
189
195
|
readonly type: CompactType;
|
|
190
|
-
/**
|
|
196
|
+
/**
|
|
197
|
+
* Whether items can overlap (stack on top of each other).
|
|
198
|
+
*
|
|
199
|
+
* When true:
|
|
200
|
+
* - Items can be placed on top of other items
|
|
201
|
+
* - Dragging into another item does NOT push it away
|
|
202
|
+
* - Compaction is skipped after drag/resize
|
|
203
|
+
*/
|
|
191
204
|
readonly allowOverlap: boolean;
|
|
192
|
-
/**
|
|
205
|
+
/**
|
|
206
|
+
* Whether to block movement that would cause collision.
|
|
207
|
+
*
|
|
208
|
+
* When true (and allowOverlap is false):
|
|
209
|
+
* - Dragging into another item is blocked (item snaps back)
|
|
210
|
+
* - Other items are NOT pushed away
|
|
211
|
+
* - Only affects drag/resize, not compaction
|
|
212
|
+
*
|
|
213
|
+
* Has no effect when allowOverlap is true.
|
|
214
|
+
*/
|
|
193
215
|
readonly preventCollision?: boolean;
|
|
194
216
|
/**
|
|
195
217
|
* Compact the layout.
|
|
@@ -252,6 +274,75 @@ interface PositionStrategy {
|
|
|
252
274
|
*/
|
|
253
275
|
calcDragPosition(clientX: number, clientY: number, offsetX: number, offsetY: number): PartialPosition;
|
|
254
276
|
}
|
|
277
|
+
/**
|
|
278
|
+
* Context provided to constraint functions during drag/resize operations.
|
|
279
|
+
*/
|
|
280
|
+
interface ConstraintContext {
|
|
281
|
+
/** Number of columns in the grid */
|
|
282
|
+
cols: number;
|
|
283
|
+
/** Maximum number of rows (Infinity if unbounded) */
|
|
284
|
+
maxRows: number;
|
|
285
|
+
/** Container width in pixels */
|
|
286
|
+
containerWidth: number;
|
|
287
|
+
/** Container height in pixels (may be 0 if auto-height) */
|
|
288
|
+
containerHeight: number;
|
|
289
|
+
/** Row height in pixels */
|
|
290
|
+
rowHeight: number;
|
|
291
|
+
/** Margin between items [x, y] in pixels */
|
|
292
|
+
margin: readonly [number, number];
|
|
293
|
+
/** Current layout state */
|
|
294
|
+
layout: Layout;
|
|
295
|
+
}
|
|
296
|
+
/**
|
|
297
|
+
* Interface for layout constraints.
|
|
298
|
+
*
|
|
299
|
+
* Implement this interface to create custom position/size constraints.
|
|
300
|
+
* Built-in constraints: gridBounds, minMaxSize, containerBounds, boundedX, boundedY.
|
|
301
|
+
*
|
|
302
|
+
* @example
|
|
303
|
+
* ```typescript
|
|
304
|
+
* // Grid-level constraints
|
|
305
|
+
* <GridLayout constraints={[gridBounds, minMaxSize, aspectRatio(16/9)]} />
|
|
306
|
+
*
|
|
307
|
+
* // Per-item constraints
|
|
308
|
+
* const layout = [
|
|
309
|
+
* { i: 'video', x: 0, y: 0, w: 4, h: 2, constraints: [aspectRatio(16/9)] }
|
|
310
|
+
* ];
|
|
311
|
+
* ```
|
|
312
|
+
*/
|
|
313
|
+
interface LayoutConstraint {
|
|
314
|
+
/** Constraint identifier for debugging */
|
|
315
|
+
readonly name: string;
|
|
316
|
+
/**
|
|
317
|
+
* Constrain position during drag operations.
|
|
318
|
+
* Called after grid unit conversion, before layout update.
|
|
319
|
+
*
|
|
320
|
+
* @param item - The item being dragged
|
|
321
|
+
* @param x - Proposed x position in grid units
|
|
322
|
+
* @param y - Proposed y position in grid units
|
|
323
|
+
* @param context - Grid context (cols, maxRows, etc.)
|
|
324
|
+
* @returns Constrained x, y position
|
|
325
|
+
*/
|
|
326
|
+
constrainPosition?(item: LayoutItem, x: number, y: number, context: ConstraintContext): {
|
|
327
|
+
x: number;
|
|
328
|
+
y: number;
|
|
329
|
+
};
|
|
330
|
+
/**
|
|
331
|
+
* Constrain size during resize operations.
|
|
332
|
+
* Called after grid unit conversion, before layout update.
|
|
333
|
+
*
|
|
334
|
+
* @param item - The item being resized
|
|
335
|
+
* @param w - Proposed width in grid units
|
|
336
|
+
* @param h - Proposed height in grid units
|
|
337
|
+
* @param handle - Which resize handle is being used
|
|
338
|
+
* @param context - Grid context (cols, maxRows, etc.)
|
|
339
|
+
* @returns Constrained w, h size
|
|
340
|
+
*/
|
|
341
|
+
constrainSize?(item: LayoutItem, w: number, h: number, handle: ResizeHandleAxis, context: ConstraintContext): {
|
|
342
|
+
w: number;
|
|
343
|
+
h: number;
|
|
344
|
+
};
|
|
345
|
+
}
|
|
255
346
|
/**
|
|
256
347
|
* Grid measurement configuration.
|
|
257
348
|
* Groups all grid metrics (columns, row height, margins).
|
|
@@ -324,10 +415,13 @@ interface DropConfig {
|
|
|
324
415
|
/**
|
|
325
416
|
* Called when dragging over the grid.
|
|
326
417
|
* Return dimensions to override defaultItem, or false to reject the drop.
|
|
418
|
+
* Can also return dragOffsetX/dragOffsetY to specify cursor offset for centering.
|
|
327
419
|
*/
|
|
328
420
|
onDragOver?: (e: DragEvent) => {
|
|
329
421
|
w?: number;
|
|
330
422
|
h?: number;
|
|
423
|
+
dragOffsetX?: number;
|
|
424
|
+
dragOffsetY?: number;
|
|
331
425
|
} | false | void;
|
|
332
426
|
}
|
|
333
427
|
/** Default drop configuration */
|
|
@@ -372,4 +466,4 @@ type DeepPartial<T> = {
|
|
|
372
466
|
*/
|
|
373
467
|
type ArrayElement<T> = T extends readonly (infer U)[] ? U : never;
|
|
374
468
|
|
|
375
|
-
export { type ArrayElement as A, type Breakpoint as B, type CompactType as C, type DroppingPosition as D, type EventCallback as E, type GridDragEvent as G, type Layout as L, type Mutable as M, type OnLayoutChangeCallback as O, type Position as P, type ResponsiveLayouts as R, type Size as S, type LayoutItem as a, type Breakpoints as b, type Compactor as c, type ResizeHandleAxis as d, type GridResizeEvent as e, type
|
|
469
|
+
export { type ArrayElement as A, type Breakpoint as B, type CompactType as C, type DroppingPosition as D, type EventCallback as E, type GridDragEvent as G, type Layout as L, type Mutable as M, type OnLayoutChangeCallback as O, type Position as P, type ResponsiveLayouts as R, type Size as S, type LayoutItem as a, type Breakpoints as b, type Compactor as c, type ResizeHandleAxis as d, type GridResizeEvent as e, type LayoutConstraint as f, type ConstraintContext as g, type PartialPosition as h, type ReactDraggableCallbackData as i, type DragOverEvent as j, type PositionStrategy as k, type GridConfig as l, type DragConfig as m, type ResizeConfig as n, type DropConfig as o, type BreakpointCols as p, type OnBreakpointChangeCallback as q, type DeepPartial as r, defaultGridConfig as s, defaultDragConfig as t, defaultResizeConfig as u, defaultDropConfig as v };
|