{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAKH;;;GAGG;AACH,MAAM,CAAC,MAAM,YAAY,GAAqB;IAC5C,sBAAsB,EAAE,QAAQ;IAChC,OAAO,EAAE,IAAI;IACb,IAAI,EAAE,IAAI;IACV,UAAU,EAAE,MAAM;IAClB,kBAAkB,EAAE,GAAG;IACvB,cAAc,EAAE,IAAI;IACpB,MAAM,EAAE,EAAE;IACV,SAAS,EAAE,EAAE,MAAM,EAAE,0BAA0B,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE;IACjF,MAAM,EAAE,0BAA0B;IAClC,SAAS,EAAE,iBAAiB;IAC5B,MAAM,EAAE,EAAE;IACV,UAAU,EAAE,IAAI;IAChB,MAAM,EAAE,CAAC;IACT,MAAM,EAAE,CAAC;IACT,gBAAgB,EAAE,wBAAwB;IAC1C,eAAe,EAAE,EAAE;IACnB,gBAAgB,EAAE,EAAE,MAAM,EAAE,iBAAiB,EAAE,OAAO,EAAE,0BAA0B,EAAC;IACnF,SAAS,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;IAC5B,GAAG,EAAE,MAAM;IAEX,kCAAkC;IAClC,sBAAsB;IACtB,wBAAwB;IACxB,gBAAgB;IAChB,qBAAqB;IACrB,oBAAoB;IACpB,qBAAqB;IACrB,WAAW;CACZ,CAAC","sourcesContent":["/**\r\n * types.ts 12.6.0\r\n * Copyright (c) 2021-2025 Alain Dumesny - see GridStack root license\r\n */\r\n\r\nimport { GridStack } from './gridstack';\r\nimport { GridStackEngine } from './gridstack-engine';\r\n\r\n/**\r\n * Default values for grid options - used during initialization and when saving out grid configuration.\r\n * These values are applied when options are not explicitly provided.\r\n */\r\nexport const gridDefaults: GridStackOptions = {\r\n alwaysShowResizeHandle: 'mobile',\r\n animate: true,\r\n auto: true,\r\n cellHeight: 'auto',\r\n cellHeightThrottle: 100,\r\n cellHeightUnit: 'px',\r\n column: 12,\r\n draggable: { handle: '.grid-stack-item-content', appendTo: 'body', scroll: true },\r\n handle: '.grid-stack-item-content',\r\n itemClass: 'grid-stack-item',\r\n margin: 10,\r\n marginUnit: 'px',\r\n maxRow: 0,\r\n minRow: 0,\r\n placeholderClass: 'grid-stack-placeholder',\r\n placeholderText: '',\r\n removableOptions: { accept: 'grid-stack-item', decline: 'grid-stack-non-removable'},\r\n resizable: { handles: 'se' },\r\n rtl: 'auto',\r\n\r\n // **** same as not being set ****\r\n // disableDrag: false,\r\n // disableResize: false,\r\n // float: false,\r\n // handleClass: null,\r\n // removable: false,\r\n // staticGrid: false,\r\n //removable\r\n};\r\n\r\n/**\r\n * Different layout options when changing the number of columns.\r\n *\r\n * These options control how widgets are repositioned when the grid column count changes.\r\n * Note: The new list may be partially filled if there's a cached layout for that size.\r\n *\r\n * Options:\r\n * - `'list'`: Treat items as a sorted list, keeping them sequentially without resizing (unless too big)\r\n * - `'compact'`: Similar to list, but uses compact() method to fill empty slots by reordering\r\n * - `'moveScale'`: Scale and move items by the ratio of newColumnCount / oldColumnCount\r\n * - `'move'`: Only move items, keep their sizes\r\n * - `'scale'`: Only scale items, keep their positions\r\n * - `'none'`: Leave items unchanged unless they don't fit in the new column count\r\n * - Custom function: Provide your own layout logic\r\n */\r\nexport type ColumnOptions = 'list' | 'compact' | 'moveScale' | 'move' | 'scale' | 'none' |\r\n ((column: number, oldColumn: number, nodes: GridStackNode[], oldNodes: GridStackNode[]) => void);\r\n/**\r\n * Options for the compact() method to reclaim empty space.\r\n * - `'list'`: Keep items in order, move them up sequentially\r\n * - `'compact'`: Find truly empty spaces, may reorder items for optimal fit\r\n */\r\nexport type CompactOptions = 'list' | 'compact';\r\n/**\r\n * Type representing values that can be either numbers or strings (e.g., dimensions with units).\r\n * Used for properties like width, height, margins that accept both numeric and string values.\r\n */\r\nexport type numberOrString = number | string;\r\n/**\r\n * Extended HTMLElement interface for grid items.\r\n * All grid item DOM elements implement this interface to provide access to their grid data.\r\n */\r\nexport interface GridItemHTMLElement extends HTMLElement {\r\n /** Pointer to the associated grid node instance containing position, size, and other widget data */\r\n gridstackNode?: GridStackNode;\r\n /** @internal Original node data (used for restoring during drag operations) */\r\n _gridstackNodeOrig?: GridStackNode;\r\n}\r\n\r\n/**\r\n * Type representing various ways to specify grid elements.\r\n * Can be a CSS selector string, GridItemHTMLElement (HTML element with GS variables when loaded).\r\n */\r\nexport type GridStackElement = string | GridItemHTMLElement;\r\n\r\n/**\r\n * Event handler function types for the .on() method.\r\n * Different handlers receive different parameters based on the event type.\r\n */\r\n\r\n/** General event handler that receives only the event */\r\nexport type GridStackEventHandler = (event: Event) => void;\r\n\r\n/** Element-specific event handler that receives event and affected element */\r\nexport type GridStackElementHandler = (event: Event, el: GridItemHTMLElement) => void;\r\n\r\n/** Node-based event handler that receives event and array of affected nodes */\r\nexport type GridStackNodesHandler = (event: Event, nodes: GridStackNode[]) => void;\r\n\r\n/** Drop event handler that receives previous and new node states */\r\nexport type GridStackDroppedHandler = (event: Event, previousNode: GridStackNode, newNode: GridStackNode) => void;\r\n\r\n/** Union type of all possible event handler types */\r\nexport type GridStackEventHandlerCallback = GridStackEventHandler | GridStackElementHandler | GridStackNodesHandler | GridStackDroppedHandler;\r\n\r\n/**\r\n * Optional callback function called during load() operations.\r\n * Allows custom handling of widget addition/removal for framework integration.\r\n *\r\n * @param parent - The parent HTML element\r\n * @param w - The widget definition\r\n * @param add - True if adding, false if removing\r\n * @param grid - True if this is a grid operation\r\n * @returns The created/modified HTML element, or undefined\r\n */\r\nexport type AddRemoveFcn = (parent: HTMLElement, w: GridStackWidget, add: boolean, grid: boolean) => HTMLElement | undefined;\r\n\r\n/**\r\n * Optional callback function called during save() operations.\r\n * Allows adding custom data to the saved widget structure.\r\n *\r\n * @param node - The internal grid node\r\n * @param w - The widget structure being saved (can be modified)\r\n */\r\nexport type SaveFcn = (node: GridStackNode, w: GridStackWidget) => void;\r\n\r\n/**\r\n * Optional callback function for custom widget content rendering.\r\n * Called during load()/addWidget() to create custom content beyond plain text.\r\n *\r\n * @param el - The widget's content container element\r\n * @param w - The widget definition with content and other properties\r\n */\r\nexport type RenderFcn = (el: HTMLElement, w: GridStackWidget) => void;\r\n\r\n/**\r\n * Optional callback function for custom resize-to-content behavior.\r\n * Called when a widget needs to resize to fit its content.\r\n *\r\n * @param el - The grid item element to resize\r\n */\r\nexport type ResizeToContentFcn = (el: GridItemHTMLElement) => void;\r\n\r\n/**\r\n * Configuration for responsive grid behavior.\r\n *\r\n * Defines how the grid responds to different screen sizes by changing column counts.\r\n * NOTE: Make sure to include the appropriate CSS (gridstack-extra.css) to support responsive behavior.\r\n */\r\nexport interface Responsive {\r\n /** wanted width to maintain (+-50%) to dynamically pick a column count. NOTE: make sure to have correct extra CSS to support this. */\r\n columnWidth?: number;\r\n /** maximum number of columns allowed (default: 12). NOTE: make sure to have correct extra CSS to support this. */\r\n columnMax?: number;\r\n /** explicit width:column breakpoints instead of automatic 'columnWidth'. NOTE: make sure to have correct extra CSS to support this. */\r\n breakpoints?: Breakpoint[];\r\n /** specify if breakpoints are for window size or grid size (default:false = grid) */\r\n breakpointForWindow?: boolean;\r\n /** global re-layout mode when changing columns */\r\n layout?: ColumnOptions;\r\n}\r\n\r\n/**\r\n * Defines a responsive breakpoint for automatic column count changes.\r\n * Used with the responsive.breakpoints option.\r\n */\r\nexport interface Breakpoint {\r\n /** Maximum width (in pixels) for this breakpoint to be active */\r\n w?: number;\r\n /** Number of columns to use when this breakpoint is active */\r\n c: number;\r\n /** Layout mode for this specific breakpoint (overrides global responsive.layout) */\r\n layout?: ColumnOptions;\r\n /** TODO: Future feature - specific children layout for this breakpoint */\r\n // children?: GridStackWidget[];\r\n}\r\n\r\n/**\r\n * Defines the options for a Grid\r\n */\r\nexport interface GridStackOptions {\r\n /**\r\n * Accept widgets dragged from other grids or from outside (default: `false`). Can be:\r\n * - `true`: will accept HTML elements having 'grid-stack-item' as class attribute\r\n * - `false`: will not accept any external widgets\r\n * - string: explicit class name to accept instead of default\r\n * - function: callback called before an item will be accepted when entering a grid\r\n *\r\n * @example\r\n * // Accept all grid items\r\n * acceptWidgets: true\r\n *\r\n * // Accept only items with specific class\r\n * acceptWidgets: 'my-draggable-item'\r\n *\r\n * // Custom validation function\r\n * acceptWidgets: (el) => {\r\n * return el.getAttribute('data-accept') === 'true';\r\n * }\r\n *\r\n * @see {@link http://gridstack.github.io/gridstack.js/demo/two.html} for complete example\r\n */\r\n acceptWidgets?: boolean | string | ((element: Element) => boolean);\r\n\r\n /** possible values (default: `mobile`) - does not apply to non-resizable widgets\r\n * `false` the resizing handles are only shown while hovering over a widget\r\n * `true` the resizing handles are always shown\r\n * 'mobile' if running on a mobile device, default to `true` (since there is no hovering per say), else `false`.\r\n See [example](http://gridstack.github.io/gridstack.js/demo/mobile.html) */\r\n alwaysShowResizeHandle?: true | false | 'mobile';\r\n\r\n /** turns animation on (default?: true) */\r\n animate?: boolean;\r\n\r\n /** if false gridstack will not initialize existing items (default?: true) */\r\n auto?: boolean;\r\n\r\n /**\r\n * One cell height (default: 'auto'). Can be:\r\n * - an integer (px): fixed pixel height\r\n * - a string (ex: '100px', '10em', '10rem'): CSS length value\r\n * - 0: library will not generate styles for rows (define your own CSS)\r\n * - 'auto': height calculated for square cells (width / column) and updated live on window resize\r\n * - 'initial': similar to 'auto' but stays fixed size during window resizing\r\n *\r\n * Note: % values don't work correctly - see demo/cell-height.html\r\n *\r\n * @example\r\n * // Fixed 100px height\r\n * cellHeight: 100\r\n *\r\n * // CSS units\r\n * cellHeight: '5rem'\r\n * cellHeight: '100px'\r\n *\r\n * // Auto-sizing for square cells\r\n * cellHeight: 'auto'\r\n *\r\n * // No CSS generation (custom styles)\r\n * cellHeight: 0\r\n */\r\n cellHeight?: numberOrString;\r\n\r\n /** throttle time delay (in ms) used when cellHeight='auto' to improve performance vs usability (default?: 100).\r\n * A value of 0 will make it instant at a cost of re-creating the CSS file at ever window resize event!\r\n * */\r\n cellHeightThrottle?: number;\r\n\r\n /** (internal) unit for cellHeight (default? 'px') which is set when a string cellHeight with a unit is passed (ex: '10rem') */\r\n cellHeightUnit?: string;\r\n\r\n /** list of children item to create when calling load() or addGrid() */\r\n children?: GridStackWidget[];\r\n\r\n /** number of columns (default?: 12). Note: IF you change this, CSS also have to change. See https://github.com/gridstack/gridstack.js#change-grid-columns.\r\n * Note: for nested grids, it is recommended to use 'auto' which will always match the container grid-item current width (in column) to keep inside and outside\r\n * items always the same. flag is NOT supported for regular non-nested grids.\r\n */\r\n column?: number | 'auto';\r\n\r\n /** responsive column layout for width:column behavior */\r\n columnOpts?: Responsive;\r\n\r\n /** additional class on top of '.grid-stack' (which is required for our CSS) to differentiate this instance.\r\n Note: only used by addGrid(), else your element should have the needed class */\r\n class?: string;\r\n\r\n /** disallows dragging of widgets (default?: false) */\r\n disableDrag?: boolean;\r\n\r\n /** disallows resizing of widgets (default?: false). */\r\n disableResize?: boolean;\r\n\r\n /** allows to override UI draggable options. (default?: { handle?: '.grid-stack-item-content', appendTo?: 'body' }) */\r\n draggable?: DDDragOpt;\r\n\r\n /** let user drag nested grid items out of a parent or not (default true - not supported yet) */\r\n //dragOut?: boolean;\r\n\r\n /** the type of engine to create (so you can subclass) default to GridStackEngine */\r\n engineClass?: typeof GridStackEngine;\r\n\r\n /** enable floating widgets (default?: false) See example (http://gridstack.github.io/gridstack.js/demo/float.html) */\r\n float?: boolean;\r\n\r\n /** draggable handle selector (default?: '.grid-stack-item-content') */\r\n handle?: string;\r\n\r\n /** draggable handle class (e.g. 'grid-stack-item-content'). If set 'handle' is ignored (default?: null) */\r\n handleClass?: string;\r\n\r\n /** additional widget class (default?: 'grid-stack-item') */\r\n itemClass?: string;\r\n\r\n /** re-layout mode when we're a subgrid and we are being resized. default to 'list' */\r\n layout?: ColumnOptions;\r\n\r\n /** true when widgets are only created when they scroll into view (visible) */\r\n lazyLoad?: boolean;\r\n\r\n /**\r\n * gap between grid item and content (default?: 10). This will set all 4 sides and support the CSS formats below\r\n * an integer (px)\r\n * a string with possible units (ex: '2em', '20px', '2rem')\r\n * string with space separated values (ex: '5px 10px 0 20px' for all 4 sides, or '5em 10em' for top/bottom and left/right pairs like CSS).\r\n * Note: all sides must have same units (last one wins, default px)\r\n */\r\n margin?: numberOrString;\r\n\r\n /** OLD way to optionally set each side - use margin: '5px 10px 0 20px' instead. Used internally to store each side. */\r\n marginTop?: numberOrString;\r\n marginRight?: numberOrString;\r\n marginBottom?: numberOrString;\r\n marginLeft?: numberOrString;\r\n\r\n /** (internal) unit for margin (default? 'px') set when `margin` is set as string with unit (ex: 2rem') */\r\n marginUnit?: string;\r\n\r\n /** maximum rows amount. Default? is 0 which means no maximum rows */\r\n maxRow?: number;\r\n\r\n /** minimum rows amount which is handy to prevent grid from collapsing when empty. Default is `0`.\r\n * When no set the `min-height` CSS attribute on the grid div (in pixels) can be used, which will round to the closest row.\r\n */\r\n minRow?: number;\r\n\r\n /** If you are using a nonce-based Content Security Policy, pass your nonce here and\r\n * GridStack will add it to the `