@coveord/plasma-mantine 56.18.0 → 56.20.1

package/dist/cjs/components/Collection/layouts/horizontal-layout/HorizontalLayoutBody.js

@@ -0,0 +1,78 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "HorizontalLayoutBody", {
+    enumerable: true,
+    get: function() {
+        return HorizontalLayoutBody;
+    }
+});
+var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
+var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+var _jsxruntime = require("react/jsx-runtime");
+var _core = require("@mantine/core");
+var _react = require("react");
+var _CollectionContext = require("../../CollectionContext.js");
+var _columnUtils = require("../shared/columnUtils.js");
+var _itemRenderer = require("../shared/itemRenderer.js");
+var _layoutConstants = require("../shared/layoutConstants.js");
+var _HorizontalLayoutmodulecss = /*#__PURE__*/ _interop_require_default._(require("./HorizontalLayout.module.css"));
+var defaultProps = _layoutConstants.LAYOUT_BODY_DEFAULT_PROPS;
+/**
+ * Horizontal layout specific content renderer - renders cells in a row
+ */ var renderHorizontalContent = function(item, index, columns, cellContext, layoutClasses) {
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
+        children: columns.map(function(column, colIndex) {
+            var _column_id;
+            var columnId = (_column_id = column.id) !== null && _column_id !== void 0 ? _column_id : "column-".concat(colIndex);
+            return /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Box, {
+                className: layoutClasses.cell,
+                style: (0, _columnUtils.getColumnSizeStyles)(column),
+                children: column.cell(item, index, cellContext)
+            }, columnId);
+        })
+    });
+};
+// Create renderers once - they are stable component references
+var horizontalRenderers = (0, _itemRenderer.createItemRenderers)();
+var HorizontalLayoutBody = function(props) {
+    var collectionCtx = (0, _CollectionContext.useCollectionContext)();
+    var _useProps = (0, _core.useProps)('HorizontalLayoutBody', defaultProps, props), items = _useProps.items, onRemove = _useProps.onRemove, removable = _useProps.removable, draggable = _useProps.draggable, disabled = _useProps.disabled, readOnly = _useProps.readOnly, getItemId = _useProps.getItemId, gap = _useProps.gap, ref = _useProps.ref, others = _object_without_properties._(_useProps, [
+        "items",
+        "onRemove",
+        "removable",
+        "draggable",
+        "disabled",
+        "readOnly",
+        "getItemId",
+        "gap",
+        "ref"
+    ]);
+    var config = (0, _react.useMemo)(function() {
+        return {
+            renderContent: renderHorizontalContent,
+            containerSelector: 'row',
+            inlineControls: true
+        };
+    }, []);
+    var rows = (0, _itemRenderer.mapItemsToComponents)(items, horizontalRenderers, config, _HorizontalLayoutmodulecss.default, {
+        getItemId: getItemId,
+        onRemove: onRemove,
+        removable: removable,
+        draggable: draggable,
+        disabled: disabled,
+        readOnly: readOnly,
+        columns: collectionCtx.columns
+    });
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Stack, _object_spread_props._(_object_spread._({
+        ref: ref,
+        gap: gap
+    }, others), {
+        children: rows
+    }));
+};
+
+//# sourceMappingURL=HorizontalLayoutBody.js.map

package/dist/cjs/components/Collection/layouts/horizontal-layout/HorizontalLayoutBody.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/Collection/layouts/horizontal-layout/HorizontalLayoutBody.tsx"],"sourcesContent":["import {Box, Stack, useProps} from '@mantine/core';\nimport {ForwardedRef, useMemo} from 'react';\nimport {useCollectionContext} from '../../CollectionContext.js';\nimport {getColumnSizeStyles} from '../shared/columnUtils.js';\nimport {createItemRenderers, ItemContentRenderer, LayoutClasses, mapItemsToComponents} from '../shared/itemRenderer.js';\nimport {LAYOUT_BODY_DEFAULT_PROPS, LayoutBodyProps} from '../shared/layoutConstants.js';\nimport classes from './HorizontalLayout.module.css';\n\nconst defaultProps: Partial<LayoutBodyProps> = LAYOUT_BODY_DEFAULT_PROPS;\n\n/**\n * Horizontal layout specific content renderer - renders cells in a row\n */\nconst renderHorizontalContent: ItemContentRenderer<unknown> = (\n    item,\n    index,\n    columns,\n    cellContext,\n    layoutClasses: LayoutClasses,\n) => (\n    <>\n        {columns.map((column, colIndex) => {\n            const columnId = column.id ?? `column-${colIndex}`;\n            return (\n                <Box key={columnId} className={layoutClasses.cell} style={getColumnSizeStyles(column)}>\n                    {column.cell(item, index, cellContext)}\n                </Box>\n            );\n        })}\n    </>\n);\n\n// Create renderers once - they are stable component references\nconst horizontalRenderers = createItemRenderers<unknown>();\n\nexport const HorizontalLayoutBody = <T,>(props: LayoutBodyProps<T> & {ref?: ForwardedRef<HTMLDivElement>}) => {\n    const collectionCtx = useCollectionContext();\n    const {items, onRemove, removable, draggable, disabled, readOnly, getItemId, gap, ref, ...others} = useProps(\n        'HorizontalLayoutBody',\n        defaultProps as LayoutBodyProps<T>,\n        props,\n    );\n\n    const config = useMemo(\n        () => ({\n            renderContent: renderHorizontalContent,\n            containerSelector: 'row',\n            inlineControls: true,\n        }),\n        [],\n    );\n\n    const rows = mapItemsToComponents(items, horizontalRenderers, config, classes as LayoutClasses, {\n        getItemId,\n        onRemove,\n        removable,\n        draggable,\n        disabled,\n        readOnly,\n        columns: collectionCtx.columns,\n    });\n\n    return (\n        <Stack ref={ref} gap={gap} {...others}>\n            {rows}\n        </Stack>\n    );\n};\n"],"names":["HorizontalLayoutBody","defaultProps","LAYOUT_BODY_DEFAULT_PROPS","renderHorizontalContent","item","index","columns","cellContext","layoutClasses","map","column","colIndex","columnId","id","Box","className","cell","style","getColumnSizeStyles","horizontalRenderers","createItemRenderers","props","collectionCtx","useCollectionContext","useProps","items","onRemove","removable","draggable","disabled","readOnly","getItemId","gap","ref","others","config","useMemo","renderContent","containerSelector","inlineControls","rows","mapItemsToComponents","classes","Stack"],"mappings":";;;;+BAmCaA;;;eAAAA;;;;;;;;oBAnCsB;qBACC;iCACD;2BACD;4BAC0D;+BACnC;kFACrC;AAEpB,IAAMC,eAAyCC,0CAAyB;AAExE;;CAEC,GACD,IAAMC,0BAAwD,SAC1DC,MACAC,OACAC,SACAC,aACAC;yBAEA;kBACKF,QAAQG,GAAG,CAAC,SAACC,QAAQC;gBACDD;YAAjB,IAAME,WAAWF,CAAAA,aAAAA,OAAOG,EAAE,cAATH,wBAAAA,aAAa,AAAC,UAAkB,OAATC;YACxC,qBACI,qBAACG,SAAG;gBAAgBC,WAAWP,cAAcQ,IAAI;gBAAEC,OAAOC,IAAAA,gCAAmB,EAACR;0BACzEA,OAAOM,IAAI,CAACZ,MAAMC,OAAOE;eADpBK;QAIlB;;;AAIR,+DAA+D;AAC/D,IAAMO,sBAAsBC,IAAAA,iCAAmB;AAExC,IAAMpB,uBAAuB,SAAKqB;IACrC,IAAMC,gBAAgBC,IAAAA,uCAAoB;IAC1C,IAAoGC,YAAAA,IAAAA,cAAQ,EACxG,wBACAvB,cACAoB,QAHGI,QAA6FD,UAA7FC,OAAOC,WAAsFF,UAAtFE,UAAUC,YAA4EH,UAA5EG,WAAWC,YAAiEJ,UAAjEI,WAAWC,WAAsDL,UAAtDK,UAAUC,WAA4CN,UAA5CM,UAAUC,YAAkCP,UAAlCO,WAAWC,MAAuBR,UAAvBQ,KAAKC,MAAkBT,UAAlBS,KAAQC,sCAAUV;QAA7FC;QAAOC;QAAUC;QAAWC;QAAWC;QAAUC;QAAUC;QAAWC;QAAKC;;IAMlF,IAAME,SAASC,IAAAA,cAAO,EAClB;eAAO;YACHC,eAAelC;YACfmC,mBAAmB;YACnBC,gBAAgB;QACpB;OACA,EAAE;IAGN,IAAMC,OAAOC,IAAAA,kCAAoB,EAAChB,OAAON,qBAAqBgB,QAAQO,kCAAO,EAAmB;QAC5FX,WAAAA;QACAL,UAAAA;QACAC,WAAAA;QACAC,WAAAA;QACAC,UAAAA;QACAC,UAAAA;QACAxB,SAASgB,cAAchB,OAAO;IAClC;IAEA,qBACI,qBAACqC,WAAK;QAACV,KAAKA;QAAKD,KAAKA;OAASE;kBAC1BM;;AAGb"}

package/dist/cjs/components/Collection/layouts/horizontal-layout/HorizontalLayoutHeader.d.ts

@@ -0,0 +1,6 @@
+import { ForwardedRef } from 'react';
+import { LayoutHeaderProps } from '../shared/layoutConstants.js';
+export declare const HorizontalLayoutHeader: (props: LayoutHeaderProps & {
+    ref?: ForwardedRef<HTMLDivElement>;
+}) => import("react/jsx-runtime.js").JSX.Element;
+//# sourceMappingURL=HorizontalLayoutHeader.d.ts.map

package/dist/cjs/components/Collection/layouts/horizontal-layout/HorizontalLayoutHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HorizontalLayoutHeader.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Collection/layouts/horizontal-layout/HorizontalLayoutHeader.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,YAAY,EAAC,MAAM,OAAO,CAAC;AAInC,OAAO,EAA8B,iBAAiB,EAAC,MAAM,8BAA8B,CAAC;AAK5F,eAAO,MAAM,sBAAsB,GAAI,OAAO,iBAAiB,GAAG;IAAC,GAAG,CAAC,EAAE,YAAY,CAAC,cAAc,CAAC,CAAA;CAAC,+CAsBrG,CAAC"}

package/dist/cjs/components/Collection/layouts/horizontal-layout/HorizontalLayoutHeader.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "HorizontalLayoutHeader", {
+    enumerable: true,
+    get: function() {
+        return HorizontalLayoutHeader;
+    }
+});
+var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
+var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+var _jsxruntime = require("react/jsx-runtime");
+var _core = require("@mantine/core");
+var _CollectionContext = require("../../CollectionContext.js");
+var _columnUtils = require("../shared/columnUtils.js");
+var _headerUtils = require("../shared/headerUtils.js");
+var _layoutConstants = require("../shared/layoutConstants.js");
+var _HorizontalLayoutmodulecss = /*#__PURE__*/ _interop_require_default._(require("./HorizontalLayout.module.css"));
+var defaultProps = _layoutConstants.LAYOUT_HEADER_DEFAULT_PROPS;
+var HorizontalLayoutHeader = function(props) {
+    var collectionCtx = (0, _CollectionContext.useCollectionContext)();
+    var _useProps = (0, _core.useProps)('HorizontalLayoutHeader', defaultProps, props), draggable = _useProps.draggable, removable = _useProps.removable, style = _useProps.style, ref = _useProps.ref, others = _object_without_properties._(_useProps, [
+        "draggable",
+        "removable",
+        "style",
+        "ref"
+    ]);
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_core.Box, _object_spread_props._(_object_spread._({
+        ref: ref,
+        className: _HorizontalLayoutmodulecss.default.headerRow,
+        style: style
+    }, others), {
+        children: [
+            draggable && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                className: _HorizontalLayoutmodulecss.default.dragHandleHeader
+            }),
+            collectionCtx.columns.map(function(column, index) {
+                var _column_id;
+                var columnId = (_column_id = column.id) !== null && _column_id !== void 0 ? _column_id : "column-".concat(index);
+                return /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Box, {
+                    className: _HorizontalLayoutmodulecss.default.headerCell,
+                    style: (0, _columnUtils.getColumnSizeStyles)(column),
+                    children: (0, _headerUtils.renderColumnHeader)(column.header, index)
+                }, columnId);
+            }),
+            removable && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                className: _HorizontalLayoutmodulecss.default.removeButtonHeader
+            })
+        ]
+    }));
+};
+
+//# sourceMappingURL=HorizontalLayoutHeader.js.map

package/dist/cjs/components/Collection/layouts/horizontal-layout/HorizontalLayoutHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/Collection/layouts/horizontal-layout/HorizontalLayoutHeader.tsx"],"sourcesContent":["import {Box, useProps} from '@mantine/core';\nimport {ForwardedRef} from 'react';\nimport {useCollectionContext} from '../../CollectionContext.js';\nimport {getColumnSizeStyles} from '../shared/columnUtils.js';\nimport {renderColumnHeader} from '../shared/headerUtils.js';\nimport {LAYOUT_HEADER_DEFAULT_PROPS, LayoutHeaderProps} from '../shared/layoutConstants.js';\nimport classes from './HorizontalLayout.module.css';\n\nconst defaultProps: Partial<LayoutHeaderProps> = LAYOUT_HEADER_DEFAULT_PROPS;\n\nexport const HorizontalLayoutHeader = (props: LayoutHeaderProps & {ref?: ForwardedRef<HTMLDivElement>}) => {\n    const collectionCtx = useCollectionContext();\n    const {draggable, removable, style, ref, ...others} = useProps(\n        'HorizontalLayoutHeader',\n        defaultProps as LayoutHeaderProps,\n        props,\n    );\n\n    return (\n        <Box ref={ref} className={classes.headerRow} style={style} {...others}>\n            {draggable && <div className={classes.dragHandleHeader} />}\n            {collectionCtx.columns.map((column, index) => {\n                const columnId = column.id ?? `column-${index}`;\n                return (\n                    <Box key={columnId} className={classes.headerCell} style={getColumnSizeStyles(column)}>\n                        {renderColumnHeader(column.header, index)}\n                    </Box>\n                );\n            })}\n            {removable && <div className={classes.removeButtonHeader} />}\n        </Box>\n    );\n};\n"],"names":["HorizontalLayoutHeader","defaultProps","LAYOUT_HEADER_DEFAULT_PROPS","props","collectionCtx","useCollectionContext","useProps","draggable","removable","style","ref","others","Box","className","classes","headerRow","div","dragHandleHeader","columns","map","column","index","columnId","id","headerCell","getColumnSizeStyles","renderColumnHeader","header","removeButtonHeader"],"mappings":";;;;+BAUaA;;;eAAAA;;;;;;;;oBAVe;iCAEO;2BACD;2BACD;+BAC4B;kFACzC;AAEpB,IAAMC,eAA2CC,4CAA2B;AAErE,IAAMF,yBAAyB,SAACG;IACnC,IAAMC,gBAAgBC,IAAAA,uCAAoB;IAC1C,IAAsDC,YAAAA,IAAAA,cAAQ,EAC1D,0BACAL,cACAE,QAHGI,YAA+CD,UAA/CC,WAAWC,YAAoCF,UAApCE,WAAWC,QAAyBH,UAAzBG,OAAOC,MAAkBJ,UAAlBI,KAAQC,sCAAUL;QAA/CC;QAAWC;QAAWC;QAAOC;;IAMpC,qBACI,sBAACE,SAAG;QAACF,KAAKA;QAAKG,WAAWC,kCAAO,CAACC,SAAS;QAAEN,OAAOA;OAAWE;;YAC1DJ,2BAAa,qBAACS;gBAAIH,WAAWC,kCAAO,CAACG,gBAAgB;;YACrDb,cAAcc,OAAO,CAACC,GAAG,CAAC,SAACC,QAAQC;oBACfD;gBAAjB,IAAME,WAAWF,CAAAA,aAAAA,OAAOG,EAAE,cAATH,wBAAAA,aAAa,AAAC,UAAe,OAANC;gBACxC,qBACI,qBAACT,SAAG;oBAAgBC,WAAWC,kCAAO,CAACU,UAAU;oBAAEf,OAAOgB,IAAAA,gCAAmB,EAACL;8BACzEM,IAAAA,+BAAkB,EAACN,OAAOO,MAAM,EAAEN;mBAD7BC;YAIlB;YACCd,2BAAa,qBAACQ;gBAAIH,WAAWC,kCAAO,CAACc,kBAAkB;;;;AAGpE"}

package/dist/cjs/components/Collection/layouts/shared/DragHandle.d.ts

@@ -0,0 +1,12 @@
+import type { FunctionComponent } from 'react';
+export interface DragHandleProps {
+    setActivatorNodeRef: (element: HTMLElement | null) => void;
+    listeners: any;
+    attributes: any;
+}
+/**
+ * Shared drag handle component used by both horizontal and vertical layouts.
+ * Renders the drag icon with proper event handlers for drag and drop functionality.
+ */
+export declare const DragHandle: FunctionComponent<DragHandleProps>;
+//# sourceMappingURL=DragHandle.d.ts.map

package/dist/cjs/components/Collection/layouts/shared/DragHandle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DragHandle.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Collection/layouts/shared/DragHandle.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,OAAO,CAAC;AAG7C,MAAM,WAAW,eAAe;IAC5B,mBAAmB,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IAC3D,SAAS,EAAE,GAAG,CAAC;IACf,UAAU,EAAE,GAAG,CAAC;CACnB;AAED;;;GAGG;AACH,eAAO,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,CAOzD,CAAC"}

package/dist/cjs/components/Collection/layouts/shared/DragHandle.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "DragHandle", {
+    enumerable: true,
+    get: function() {
+        return DragHandle;
+    }
+});
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
+var _jsxruntime = require("react/jsx-runtime");
+var _plasmareacticons = require("@coveord/plasma-react-icons");
+var _CollectionContext = require("../../CollectionContext.js");
+var DragHandle = function(param) {
+    var setActivatorNodeRef = param.setActivatorNodeRef, listeners = param.listeners, attributes = param.attributes;
+    var getStyles = (0, _CollectionContext.useCollectionContext)().getStyles;
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", _object_spread_props._(_object_spread._({
+        ref: setActivatorNodeRef
+    }, listeners, attributes, getStyles('dragHandle')), {
+        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_plasmareacticons.DragAndDropSize16Px, {
+            height: 16
+        })
+    }));
+};
+
+//# sourceMappingURL=DragHandle.js.map

package/dist/cjs/components/Collection/layouts/shared/DragHandle.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/Collection/layouts/shared/DragHandle.tsx"],"sourcesContent":["import {DragAndDropSize16Px} from '@coveord/plasma-react-icons';\nimport type {FunctionComponent} from 'react';\nimport {useCollectionContext} from '../../CollectionContext.js';\n\nexport interface DragHandleProps {\n    setActivatorNodeRef: (element: HTMLElement | null) => void;\n    listeners: any;\n    attributes: any;\n}\n\n/**\n * Shared drag handle component used by both horizontal and vertical layouts.\n * Renders the drag icon with proper event handlers for drag and drop functionality.\n */\nexport const DragHandle: FunctionComponent<DragHandleProps> = ({setActivatorNodeRef, listeners, attributes}) => {\n    const {getStyles} = useCollectionContext();\n    return (\n        <div ref={setActivatorNodeRef} {...listeners} {...attributes} {...getStyles('dragHandle')}>\n            <DragAndDropSize16Px height={16} />\n        </div>\n    );\n};\n"],"names":["DragHandle","setActivatorNodeRef","listeners","attributes","getStyles","useCollectionContext","div","ref","DragAndDropSize16Px","height"],"mappings":";;;;+BAcaA;;;eAAAA;;;;;;gCAdqB;iCAEC;AAY5B,IAAMA,aAAiD;QAAEC,4BAAAA,qBAAqBC,kBAAAA,WAAWC,mBAAAA;IAC5F,IAAM,AAACC,YAAaC,IAAAA,uCAAoB,IAAjCD;IACP,qBACI,qBAACE;QAAIC,KAAKN;OAAyBC,WAAeC,YAAgBC,UAAU;kBACxE,cAAA,qBAACI,qCAAmB;YAACC,QAAQ;;;AAGzC"}

package/dist/cjs/components/Collection/layouts/shared/RemoveButton.d.ts

@@ -0,0 +1,11 @@
+import { FunctionComponent, type MouseEventHandler } from 'react';
+export interface RemoveButtonProps {
+    removable?: boolean;
+    onRemove?: MouseEventHandler<HTMLButtonElement>;
+}
+/**
+ * Shared remove button component used by both horizontal and vertical layouts.
+ * Renders a trash icon button when removable, or a spacer div otherwise.
+ */
+export declare const RemoveButton: FunctionComponent<RemoveButtonProps>;
+//# sourceMappingURL=RemoveButton.d.ts.map

package/dist/cjs/components/Collection/layouts/shared/RemoveButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RemoveButton.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Collection/layouts/shared/RemoveButton.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,iBAAiB,EAAE,KAAK,iBAAiB,EAAC,MAAM,OAAO,CAAC;AAIhE,MAAM,WAAW,iBAAiB;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CACnD;AAED;;;GAGG;AACH,eAAO,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,CAc7D,CAAC"}

package/dist/cjs/components/Collection/layouts/shared/RemoveButton.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "RemoveButton", {
+    enumerable: true,
+    get: function() {
+        return RemoveButton;
+    }
+});
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
+var _jsxruntime = require("react/jsx-runtime");
+var _plasmareacticons = require("@coveord/plasma-react-icons");
+var _core = require("@mantine/core");
+var _ActionIcon = require("../../../ActionIcon/ActionIcon.js");
+var _CollectionContext = require("../../CollectionContext.js");
+var RemoveButton = function(param) {
+    var removable = param.removable, onRemove = param.onRemove;
+    var getStyles = (0, _CollectionContext.useCollectionContext)().getStyles;
+    if (!removable || !onRemove) {
+        return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+            style: {
+                width: 28
+            }
+        });
+    }
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Box, _object_spread_props._(_object_spread._({}, getStyles('removeButton')), {
+        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_ActionIcon.ActionIcon.Quaternary, {
+            onClick: onRemove,
+            children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_plasmareacticons.IconTrash, {
+                "aria-label": "Remove",
+                size: 16
+            })
+        })
+    }));
+};
+
+//# sourceMappingURL=RemoveButton.js.map

package/dist/cjs/components/Collection/layouts/shared/RemoveButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/Collection/layouts/shared/RemoveButton.tsx"],"sourcesContent":["import {IconTrash} from '@coveord/plasma-react-icons';\nimport {Box} from '@mantine/core';\nimport {FunctionComponent, type MouseEventHandler} from 'react';\nimport {ActionIcon} from '../../../ActionIcon/ActionIcon.js';\nimport {useCollectionContext} from '../../CollectionContext.js';\n\nexport interface RemoveButtonProps {\n    removable?: boolean;\n    onRemove?: MouseEventHandler<HTMLButtonElement>;\n}\n\n/**\n * Shared remove button component used by both horizontal and vertical layouts.\n * Renders a trash icon button when removable, or a spacer div otherwise.\n */\nexport const RemoveButton: FunctionComponent<RemoveButtonProps> = ({removable, onRemove}) => {\n    const {getStyles} = useCollectionContext();\n\n    if (!removable || !onRemove) {\n        return <div style={{width: 28}} />;\n    }\n\n    return (\n        <Box {...getStyles('removeButton')}>\n            <ActionIcon.Quaternary onClick={onRemove}>\n                <IconTrash aria-label=\"Remove\" size={16} />\n            </ActionIcon.Quaternary>\n        </Box>\n    );\n};\n"],"names":["RemoveButton","removable","onRemove","getStyles","useCollectionContext","div","style","width","Box","ActionIcon","Quaternary","onClick","IconTrash","aria-label","size"],"mappings":";;;;+BAeaA;;;eAAAA;;;;;;gCAfW;oBACN;0BAEO;iCACU;AAW5B,IAAMA,eAAqD;QAAEC,kBAAAA,WAAWC,iBAAAA;IAC3E,IAAM,AAACC,YAAaC,IAAAA,uCAAoB,IAAjCD;IAEP,IAAI,CAACF,aAAa,CAACC,UAAU;QACzB,qBAAO,qBAACG;YAAIC,OAAO;gBAACC,OAAO;YAAE;;IACjC;IAEA,qBACI,qBAACC,SAAG,8CAAKL,UAAU;kBACf,cAAA,qBAACM,sBAAU,CAACC,UAAU;YAACC,SAAST;sBAC5B,cAAA,qBAACU,2BAAS;gBAACC,cAAW;gBAASC,MAAM;;;;AAIrD"}

package/dist/cjs/components/Collection/layouts/shared/columnUtils.d.ts

@@ -0,0 +1,8 @@
+import { CSSProperties } from 'react';
+import { CollectionColumnDef } from '../../CollectionColumn.types.js';
+/**
+ * Converts column size configuration to CSS styles.
+ * Handles both numeric (px) and string (%, fr, etc.) size values.
+ */
+export declare const getColumnSizeStyles: (column: CollectionColumnDef<any>) => CSSProperties;
+//# sourceMappingURL=columnUtils.d.ts.map

package/dist/cjs/components/Collection/layouts/shared/columnUtils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"columnUtils.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Collection/layouts/shared/columnUtils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,aAAa,EAAC,MAAM,OAAO,CAAC;AACpC,OAAO,EAAC,mBAAmB,EAAC,MAAM,iCAAiC,CAAC;AAEpE;;;GAGG;AACH,eAAO,MAAM,mBAAmB,GAAI,QAAQ,mBAAmB,CAAC,GAAG,CAAC,KAAG,aAYtE,CAAC"}

package/dist/cjs/components/Collection/layouts/shared/columnUtils.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "getColumnSizeStyles", {
+    enumerable: true,
+    get: function() {
+        return getColumnSizeStyles;
+    }
+});
+var getColumnSizeStyles = function(column) {
+    var sizeToStyle = function(size) {
+        if (size === undefined) {
+            return undefined;
+        }
+        return typeof size === 'number' ? "".concat(size, "px") : size;
+    };
+    return {
+        minWidth: sizeToStyle(column.minSize),
+        maxWidth: sizeToStyle(column.maxSize)
+    };
+};
+
+//# sourceMappingURL=columnUtils.js.map

package/dist/cjs/components/Collection/layouts/shared/columnUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/Collection/layouts/shared/columnUtils.ts"],"sourcesContent":["import {CSSProperties} from 'react';\nimport {CollectionColumnDef} from '../../CollectionColumn.types.js';\n\n/**\n * Converts column size configuration to CSS styles.\n * Handles both numeric (px) and string (%, fr, etc.) size values.\n */\nexport const getColumnSizeStyles = (column: CollectionColumnDef<any>): CSSProperties => {\n    const sizeToStyle = (size: number | string | undefined): string | undefined => {\n        if (size === undefined) {\n            return undefined;\n        }\n        return typeof size === 'number' ? `${size}px` : size;\n    };\n\n    return {\n        minWidth: sizeToStyle(column.minSize),\n        maxWidth: sizeToStyle(column.maxSize),\n    };\n};\n"],"names":["getColumnSizeStyles","column","sizeToStyle","size","undefined","minWidth","minSize","maxWidth","maxSize"],"mappings":";;;;+BAOaA;;;eAAAA;;;AAAN,IAAMA,sBAAsB,SAACC;IAChC,IAAMC,cAAc,SAACC;QACjB,IAAIA,SAASC,WAAW;YACpB,OAAOA;QACX;QACA,OAAO,OAAOD,SAAS,WAAW,AAAC,GAAO,OAALA,MAAK,QAAMA;IACpD;IAEA,OAAO;QACHE,UAAUH,YAAYD,OAAOK,OAAO;QACpCC,UAAUL,YAAYD,OAAOO,OAAO;IACxC;AACJ"}

package/dist/cjs/components/Collection/layouts/shared/headerUtils.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from 'react';
+import { CollectionColumnDef } from '../../CollectionColumn.types.js';
+/**
+ * Renders a column header by invoking the header function with context if needed.
+ * Handles both static headers (strings/nodes) and dynamic header functions.
+ */
+export declare const renderColumnHeader: (header: CollectionColumnDef<unknown>["header"], index: number) => ReactNode;
+//# sourceMappingURL=headerUtils.d.ts.map

package/dist/cjs/components/Collection/layouts/shared/headerUtils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"headerUtils.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Collection/layouts/shared/headerUtils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAChC,OAAO,EAAC,mBAAmB,EAA0B,MAAM,iCAAiC,CAAC;AAE7F;;;GAGG;AACH,eAAO,MAAM,kBAAkB,GAAI,QAAQ,mBAAmB,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,EAAE,OAAO,MAAM,KAAG,SAMlG,CAAC"}

package/dist/cjs/components/Collection/layouts/shared/headerUtils.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "renderColumnHeader", {
+    enumerable: true,
+    get: function() {
+        return renderColumnHeader;
+    }
+});
+var renderColumnHeader = function(header, index) {
+    if (typeof header === 'function') {
+        var context = {
+            index: index
+        };
+        return header(context);
+    }
+    return header;
+};
+
+//# sourceMappingURL=headerUtils.js.map

package/dist/cjs/components/Collection/layouts/shared/headerUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/Collection/layouts/shared/headerUtils.ts"],"sourcesContent":["import {ReactNode} from 'react';\nimport {CollectionColumnDef, CollectionHeaderContext} from '../../CollectionColumn.types.js';\n\n/**\n * Renders a column header by invoking the header function with context if needed.\n * Handles both static headers (strings/nodes) and dynamic header functions.\n */\nexport const renderColumnHeader = (header: CollectionColumnDef<unknown>['header'], index: number): ReactNode => {\n    if (typeof header === 'function') {\n        const context: CollectionHeaderContext = {index};\n        return header(context);\n    }\n    return header;\n};\n"],"names":["renderColumnHeader","header","index","context"],"mappings":";;;;+BAOaA;;;eAAAA;;;AAAN,IAAMA,qBAAqB,SAACC,QAAgDC;IAC/E,IAAI,OAAOD,WAAW,YAAY;QAC9B,IAAME,UAAmC;YAACD,OAAAA;QAAK;QAC/C,OAAOD,OAAOE;IAClB;IACA,OAAOF;AACX"}

package/dist/cjs/components/Collection/layouts/shared/itemRenderer.d.ts

@@ -0,0 +1,78 @@
+import { ReactNode } from 'react';
+import { CollectionCellContext, CollectionColumnDef } from '../../CollectionColumn.types.js';
+/**
+ * CSS classes object for layout styling.
+ */
+export interface LayoutClasses {
+    [key: string]: string;
+}
+/**
+ * Common props for rendering an item/row in either layout.
+ */
+export interface ItemProps<T> {
+    item: T;
+    index: number;
+    id: string;
+    columns: Array<CollectionColumnDef<T>>;
+    onRemove?: () => void;
+    removable?: boolean;
+    draggable?: boolean;
+    disabled?: boolean;
+    readOnly?: boolean;
+    classes: LayoutClasses;
+    config: ItemRendererConfig<T>;
+}
+/**
+ * Function type that renders the content specific to each layout.
+ * Horizontal layout renders cells in a row, vertical layout renders stacked fields.
+ */
+export type ItemContentRenderer<T> = (item: T, index: number, columns: Array<CollectionColumnDef<T>>, cellContext: CollectionCellContext<T>, classes: LayoutClasses) => ReactNode;
+/**
+ * Function type that renders content with inline drag handle for draggable items.
+ * Used by layouts that want the drag handle integrated into the content (e.g., vertical layout).
+ */
+export type DraggableContentRenderer<T> = (item: T, index: number, columns: Array<CollectionColumnDef<T>>, cellContext: CollectionCellContext<T>, classes: LayoutClasses, dragHandleProps: {
+    setActivatorNodeRef: (element: HTMLElement | null) => void;
+    listeners: any;
+    attributes: any;
+}) => ReactNode;
+/**
+ * Configuration for creating layout-specific item renderers.
+ */
+export interface ItemRendererConfig<T> {
+    /** The content rendering function specific to the layout */
+    renderContent: ItemContentRenderer<T>;
+    /** The container style selector ('row' for horizontal, 'item' for vertical) */
+    containerSelector: string;
+    /** Optional: whether to render drag handle and remove button inline with content (used by horizontal layout) */
+    inlineControls?: boolean;
+    /**
+     * Optional: custom content renderer for draggable items that integrates the drag handle.
+     * If provided, this is used instead of the default drag handle + renderContent pattern.
+     * Used by vertical layout to place drag handle alongside the field stack.
+     */
+    renderDraggableContent?: DraggableContentRenderer<T>;
+}
+/**
+ * Creates a set of item renderers (draggable, static, disabled) for a layout.
+ * This eliminates the duplication of three nearly identical component variants.
+ * The renderers are stable function references that don't capture variables in closures.
+ */
+export declare const createItemRenderers: <T>() => {
+    DraggableItem: (props: ItemProps<T>) => import("react/jsx-runtime.js").JSX.Element;
+    StaticItem: (props: ItemProps<T>) => import("react/jsx-runtime.js").JSX.Element;
+    DisabledItem: (props: ItemProps<T>) => import("react/jsx-runtime.js").JSX.Element;
+};
+/**
+ * Maps items to their appropriate renderer components based on state.
+ */
+export declare const mapItemsToComponents: <T>(items: T[], renderers: ReturnType<typeof createItemRenderers<T>>, config: ItemRendererConfig<T>, classes: LayoutClasses, options: {
+    getItemId?: (item: T, index: number) => string;
+    onRemove?: (index: number) => void;
+    removable?: boolean;
+    draggable?: boolean;
+    disabled?: boolean;
+    readOnly?: boolean;
+    columns: Array<CollectionColumnDef<T>>;
+}) => ReactNode[];
+//# sourceMappingURL=itemRenderer.d.ts.map

package/dist/cjs/components/Collection/layouts/shared/itemRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"itemRenderer.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Collection/layouts/shared/itemRenderer.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/Collection/layouts/shared/itemRenderer.js

@@ -0,0 +1,160 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get createItemRenderers () {
+        return createItemRenderers;
+    },
+    get mapItemsToComponents () {
+        return mapItemsToComponents;
+    }
+});
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _jsxruntime = require("react/jsx-runtime");
+var _sortable = require("@dnd-kit/sortable");
+var _utilities = require("@dnd-kit/utilities");
+var _core = require("@mantine/core");
+var _DragHandle = require("./DragHandle.js");
+var _RemoveButton = require("./RemoveButton.js");
+var createItemRenderers = function() {
+    /**
+     * Draggable item/row renderer with drag and drop functionality
+     */ var DraggableItem = function(props) {
+        var item = props.item, index = props.index, id = props.id, columns = props.columns, onRemove = props.onRemove, removable = props.removable, disabled = props.disabled, readOnly = props.readOnly, classes = props.classes, config = props.config;
+        var _useSortable = (0, _sortable.useSortable)({
+            id: id
+        }), attributes = _useSortable.attributes, listeners = _useSortable.listeners, setNodeRef = _useSortable.setNodeRef, transform = _useSortable.transform, transition = _useSortable.transition, isDragging = _useSortable.isDragging, setActivatorNodeRef = _useSortable.setActivatorNodeRef;
+        var cellContext = {
+            removable: removable,
+            draggable: true,
+            disabled: disabled,
+            readOnly: readOnly,
+            onRemove: onRemove
+        };
+        var dragHandleProps = {
+            setActivatorNodeRef: setActivatorNodeRef,
+            listeners: listeners,
+            attributes: attributes
+        };
+        // Use renderDraggableContent if provided (integrates drag handle into content)
+        if (config.renderDraggableContent) {
+            return /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Box, {
+                ref: setNodeRef,
+                "data-testid": "item-".concat(id),
+                className: classes[config.containerSelector],
+                style: transform ? {
+                    transform: _utilities.CSS.Transform.toString(transform),
+                    transition: transition
+                } : undefined,
+                "data-isdragging": isDragging,
+                children: config.renderDraggableContent(item, index, columns, cellContext, classes, dragHandleProps)
+            });
+        }
+        // Default behavior: inline drag handle + content + remove button (used by horizontal layout)
+        return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_core.Box, {
+            ref: setNodeRef,
+            "data-testid": "item-".concat(id),
+            className: classes[config.containerSelector],
+            style: transform ? {
+                transform: _utilities.CSS.Transform.toString(transform),
+                transition: transition
+            } : undefined,
+            "data-isdragging": isDragging,
+            children: [
+                /*#__PURE__*/ (0, _jsxruntime.jsx)(_DragHandle.DragHandle, {
+                    setActivatorNodeRef: setActivatorNodeRef,
+                    listeners: listeners,
+                    attributes: attributes
+                }),
+                config.renderContent(item, index, columns, cellContext, classes),
+                config.inlineControls && /*#__PURE__*/ (0, _jsxruntime.jsx)(_RemoveButton.RemoveButton, {
+                    removable: removable,
+                    onRemove: onRemove
+                })
+            ]
+        });
+    };
+    /**
+     * Static (non-draggable) item/row renderer
+     */ var StaticItem = function(props) {
+        var item = props.item, index = props.index, id = props.id, columns = props.columns, onRemove = props.onRemove, removable = props.removable, disabled = props.disabled, readOnly = props.readOnly, classes = props.classes, config = props.config;
+        var cellContext = {
+            removable: removable,
+            draggable: false,
+            disabled: disabled,
+            readOnly: readOnly,
+            onRemove: onRemove
+        };
+        return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_core.Box, {
+            "data-testid": "item-".concat(id),
+            className: classes[config.containerSelector],
+            children: [
+                config.renderContent(item, index, columns, cellContext, classes),
+                config.inlineControls && /*#__PURE__*/ (0, _jsxruntime.jsx)(_RemoveButton.RemoveButton, {
+                    removable: removable,
+                    onRemove: onRemove
+                })
+            ]
+        });
+    };
+    /**
+     * Disabled item/row renderer (no drag, no remove)
+     */ var DisabledItem = function(props) {
+        var item = props.item, index = props.index, id = props.id, columns = props.columns, disabled = props.disabled, readOnly = props.readOnly, classes = props.classes, config = props.config;
+        var cellContext = {
+            removable: false,
+            draggable: false,
+            disabled: disabled,
+            readOnly: readOnly
+        };
+        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Box, {
+            "data-testid": "item-".concat(id),
+            className: classes[config.containerSelector],
+            children: config.renderContent(item, index, columns, cellContext, classes)
+        });
+    };
+    return {
+        DraggableItem: DraggableItem,
+        StaticItem: StaticItem,
+        DisabledItem: DisabledItem
+    };
+};
+var mapItemsToComponents = function(items, renderers, config, classes, options) {
+    var getItemId = options.getItemId, onRemove = options.onRemove, removable = options.removable, draggable = options.draggable, disabled = options.disabled, readOnly = options.readOnly, columns = options.columns;
+    var DraggableItem = renderers.DraggableItem, StaticItem = renderers.StaticItem, DisabledItem = renderers.DisabledItem;
+    return items.map(function(item, index) {
+        var _getItemId;
+        var id = (_getItemId = getItemId === null || getItemId === void 0 ? void 0 : getItemId(item, index)) !== null && _getItemId !== void 0 ? _getItemId : String(index);
+        var itemProps = {
+            item: item,
+            index: index,
+            id: id,
+            columns: columns,
+            onRemove: onRemove ? function() {
+                return onRemove(index);
+            } : undefined,
+            removable: removable,
+            draggable: draggable,
+            disabled: disabled,
+            readOnly: readOnly,
+            classes: classes,
+            config: config
+        };
+        if (disabled) {
+            return /*#__PURE__*/ (0, _jsxruntime.jsx)(DisabledItem, _object_spread._({}, itemProps), id);
+        }
+        if (draggable) {
+            return /*#__PURE__*/ (0, _jsxruntime.jsx)(DraggableItem, _object_spread._({}, itemProps), id);
+        }
+        return /*#__PURE__*/ (0, _jsxruntime.jsx)(StaticItem, _object_spread._({}, itemProps), id);
+    });
+};
+
+//# sourceMappingURL=itemRenderer.js.map