@coveord/plasma-mantine 56.18.0 → 56.20.0

package/dist/cjs/components/Collection/CollectionContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Collection/CollectionContext.ts"],"sourcesContent":["import {createSafeContext, type GetStylesApi} from '@mantine/core';\nimport type {CollectionFactory} from './Collection.js';\n\ninterface CollectionContextType {\n    getStyles: GetStylesApi<CollectionFactory>;\n}\n\nexport const [CollectionProvider, useCollectionContext] = createSafeContext<CollectionContextType>(\n    'Collection component was not found in tree',\n);\n"],"names":["CollectionProvider","useCollectionContext","createSafeContext"],"mappings":";;;;;;;;;;;QAOcA;eAAAA;;QAAoBC;eAAAA;;;;oBAPiB;IAOOC,wCAAAA,IAAAA,uBAAiB,EACvE;AADG,IAAOF,qBAA4CE,uBAAxBD,uBAAwBC"}
+{"version":3,"sources":["../../../../src/components/Collection/CollectionContext.ts"],"sourcesContent":["import {createSafeContext, type GetStylesApi} from '@mantine/core';\nimport type {CollectionFactory} from './Collection.js';\nimport type {CollectionColumnDef} from './CollectionColumn.types.js';\n\ninterface CollectionContextType {\n    getStyles: GetStylesApi<CollectionFactory>;\n    /**\n     * Column definitions for the collection (only present when using column-based layout)\n     */\n    columns?: Array<CollectionColumnDef<unknown>>;\n}\n\nexport const [CollectionProvider, useCollectionContext] = createSafeContext<CollectionContextType>(\n    'Collection component was not found in tree',\n);\n"],"names":["CollectionProvider","useCollectionContext","createSafeContext"],"mappings":";;;;;;;;;;;QAYcA;eAAAA;;QAAoBC;eAAAA;;;;oBAZiB;IAYOC,wCAAAA,IAAAA,uBAAiB,EACvE;AADG,IAAOF,qBAA4CE,uBAAxBD,uBAAwBC"}

package/dist/cjs/components/Collection/CollectionItem.d.ts

@@ -1,12 +1,12 @@
 import { GroupProps } from '@mantine/core';
-import { FunctionComponent, PropsWithChildren } from 'react';
+import { FunctionComponent, type MouseEventHandler, PropsWithChildren } from 'react';
 interface CollectionItemProps extends CollectionItemSharedProps {
     draggable?: boolean;
     disabled: boolean;
 }
 interface CollectionItemSharedProps extends GroupProps {
     id: string;
-    onRemove?: React.MouseEventHandler<HTMLButtonElement>;
+    onRemove?: MouseEventHandler<HTMLButtonElement>;
     removable?: boolean;
 }
 export declare const CollectionItem: FunctionComponent<PropsWithChildren<CollectionItemProps>>;

package/dist/cjs/components/Collection/CollectionItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CollectionItem.d.ts","sourceRoot":"","sources":["../../../../src/components/Collection/CollectionItem.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAQ,UAAU,EAAW,MAAM,eAAe,CAAC;AAC1D,OAAO,EAAC,iBAAiB,EAAE,iBAAiB,EAAC,MAAM,OAAO,CAAC;AAK3D,UAAU,mBAAoB,SAAQ,yBAAyB;IAC3D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;CACrB;AAED,UAAU,yBAA0B,SAAQ,UAAU;IAClD,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACtD,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB;AAoHD,eAAO,MAAM,cAAc,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,mBAAmB,CAAC,CAYpF,CAAC"}
+{"version":3,"file":"CollectionItem.d.ts","sourceRoot":"","sources":["../../../../src/components/Collection/CollectionItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAQ,UAAU,EAAW,MAAM,eAAe,CAAC;AAC1D,OAAO,EAAC,iBAAiB,EAAE,KAAK,iBAAiB,EAAE,iBAAiB,EAAC,MAAM,OAAO,CAAC;AAMnF,UAAU,mBAAoB,SAAQ,yBAAyB;IAC3D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;CACrB;AAED,UAAU,yBAA0B,SAAQ,UAAU;IAClD,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAChD,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB;AAyGD,eAAO,MAAM,cAAc,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,mBAAmB,CAAC,CAYpF,CAAC"}

package/dist/cjs/components/Collection/CollectionItem.js

@@ -12,36 +12,16 @@ 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 _plasmareacticons = require("@coveord/plasma-react-icons");
 var _sortable = require("@dnd-kit/sortable");
 var _utilities = require("@dnd-kit/utilities");
 var _core = require("@mantine/core");
-var _ActionIcon = require("../ActionIcon/ActionIcon.js");
 var _CollectionContext = require("./CollectionContext.js");
+var _DragHandle = require("./layouts/shared/DragHandle.js");
+var _RemoveButton = require("./layouts/shared/RemoveButton.js");
 var defaultProps = {
     removable: true,
     gap: 'sm'
 };
-var RemoveButton = function(param) {
-    var onClick = param.onClick;
-    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_ActionIcon.ActionIcon.Quaternary, {
-        style: {
-            alignSelf: 'center'
-        },
-        onClick: onClick,
-        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_plasmareacticons.IconTrash, {
-            "aria-label": "Remove",
-            size: 16
-        })
-    });
-};
-var RemoveButtonPlaceholder = function() {
-    return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-        style: {
-            width: 28
-        }
-    });
-};
 var StaticCollectionItem = function(props) {
     var _useProps = (0, _core.useProps)('CollectionItem', defaultProps, props), children = _useProps.children, removable = _useProps.removable, onRemove = _useProps.onRemove, id = _useProps.id, // Style props
     style = _useProps.style, className = _useProps.className, classNames = _useProps.classNames, styles = _useProps.styles, others = _object_without_properties._(_useProps, [
@@ -55,9 +35,6 @@ var StaticCollectionItem = function(props) {
         "styles"
     ]);
     var ctx = (0, _CollectionContext.useCollectionContext)();
-    var removeButton = removable && onRemove ? /*#__PURE__*/ (0, _jsxruntime.jsx)(RemoveButton, {
-        onClick: onRemove
-    }) : /*#__PURE__*/ (0, _jsxruntime.jsx)(RemoveButtonPlaceholder, {});
     return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_core.Group, _object_spread_props._(_object_spread._({
         "data-testid": "item-".concat(id)
     }, ctx.getStyles('item', {
@@ -68,16 +45,21 @@ var StaticCollectionItem = function(props) {
     }), others), {
         children: [
             children,
-            removeButton
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_RemoveButton.RemoveButton, {
+                removable: removable,
+                onRemove: onRemove
+            })
         ]
     }));
 };
 var DisabledCollectionItem = function(props) {
     var ctx = (0, _CollectionContext.useCollectionContext)();
-    var _useProps = (0, _core.useProps)('CollectionItem', defaultProps, props), children = _useProps.children, id = _useProps.id, // Style props
+    var _useProps = (0, _core.useProps)('CollectionItem', defaultProps, props), children = _useProps.children, id = _useProps.id, _removable = _useProps.removable, _onRemove = _useProps.onRemove, // Style props
     style = _useProps.style, className = _useProps.className, classNames = _useProps.classNames, styles = _useProps.styles, others = _object_without_properties._(_useProps, [
         "children",
         "id",
+        "removable",
+        "onRemove",
         "style",
         "className",
         "classNames",
@@ -106,9 +88,6 @@ var DraggableCollectionItem = function(props) {
         "classNames",
         "styles"
     ]);
-    var removeButton = removable && onRemove ? /*#__PURE__*/ (0, _jsxruntime.jsx)(RemoveButton, {
-        onClick: onRemove
-    }) : null;
     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;
@@ -127,15 +106,16 @@ var DraggableCollectionItem = function(props) {
         "data-isdragging": isDragging
     }), others), {
         children: [
-            /*#__PURE__*/ (0, _jsxruntime.jsx)("div", _object_spread_props._(_object_spread._({
-                ref: setActivatorNodeRef
-            }, listeners, attributes, ctx.getStyles('dragHandle')), {
-                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_plasmareacticons.DragAndDropSize24Px, {
-                    height: 16
-                })
-            })),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_DragHandle.DragHandle, {
+                setActivatorNodeRef: setActivatorNodeRef,
+                listeners: listeners,
+                attributes: attributes
+            }),
             children,
-            removeButton
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_RemoveButton.RemoveButton, {
+                removable: removable,
+                onRemove: onRemove
+            })
         ]
     }));
 };

package/dist/cjs/components/Collection/CollectionItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Collection/CollectionItem.tsx"],"sourcesContent":["import {DragAndDropSize24Px, IconTrash} from '@coveord/plasma-react-icons';\nimport {useSortable} from '@dnd-kit/sortable';\nimport {CSS} from '@dnd-kit/utilities';\nimport {Group, GroupProps, useProps} from '@mantine/core';\nimport {FunctionComponent, PropsWithChildren} from 'react';\n\nimport {ActionIcon} from '../ActionIcon/ActionIcon.js';\nimport {useCollectionContext} from './CollectionContext.js';\n\ninterface CollectionItemProps extends CollectionItemSharedProps {\n    draggable?: boolean;\n    disabled: boolean;\n}\n\ninterface CollectionItemSharedProps extends GroupProps {\n    id: string;\n    onRemove?: React.MouseEventHandler<HTMLButtonElement>;\n    removable?: boolean;\n}\n\nconst defaultProps: Partial<CollectionItemSharedProps> = {\n    removable: true,\n    gap: 'sm',\n};\n\nconst RemoveButton: FunctionComponent<{\n    onClick: React.MouseEventHandler<HTMLButtonElement>;\n}> = ({onClick}) => (\n    <ActionIcon.Quaternary style={{alignSelf: 'center'}} onClick={onClick}>\n        <IconTrash aria-label=\"Remove\" size={16} />\n    </ActionIcon.Quaternary>\n);\n\nconst RemoveButtonPlaceholder = () => <div style={{width: 28}} />;\n\nconst StaticCollectionItem: FunctionComponent<PropsWithChildren<CollectionItemSharedProps>> = (props) => {\n    const {\n        children,\n        removable,\n        onRemove,\n        id,\n\n        // Style props\n        style,\n        className,\n        classNames,\n        styles,\n        ...others\n    } = useProps('CollectionItem', defaultProps, props);\n    const ctx = useCollectionContext();\n    const removeButton = removable && onRemove ? <RemoveButton onClick={onRemove} /> : <RemoveButtonPlaceholder />;\n\n    return (\n        <Group\n            data-testid={`item-${id}`}\n            {...ctx.getStyles('item', {style, className, classNames, styles})}\n            {...others}\n        >\n            {children}\n            {removeButton}\n        </Group>\n    );\n};\n\nconst DisabledCollectionItem: FunctionComponent<PropsWithChildren<CollectionItemSharedProps>> = (props) => {\n    const ctx = useCollectionContext();\n    const {\n        children,\n        id,\n\n        // Style props\n        style,\n        className,\n        classNames,\n        styles,\n        ...others\n    } = useProps('CollectionItem', defaultProps, props);\n    return (\n        <Group\n            data-testid={`item-${id}`}\n            {...ctx.getStyles('item', {style, className, classNames, styles})}\n            {...others}\n        >\n            {children}\n        </Group>\n    );\n};\n\nconst DraggableCollectionItem: FunctionComponent<PropsWithChildren<CollectionItemSharedProps>> = (props) => {\n    const ctx = useCollectionContext();\n    const {\n        children,\n        removable,\n        onRemove,\n        id,\n\n        // Style props\n        className,\n        classNames,\n        styles,\n        ...others\n    } = useProps('CollectionItem', defaultProps, props);\n    const removeButton = removable && onRemove ? <RemoveButton onClick={onRemove} /> : null;\n    const {attributes, listeners, setNodeRef, transform, transition, isDragging, setActivatorNodeRef} = useSortable({\n        id,\n    });\n\n    return (\n        <Group\n            data-testid={`item-${id}`}\n            ref={setNodeRef}\n            {...ctx.getStyles('item', {\n                style: transform\n                    ? {\n                          transform: CSS.Transform.toString(transform),\n                          transition,\n                      }\n                    : undefined,\n                className,\n                classNames,\n                styles,\n            })}\n            data-isdragging={isDragging}\n            {...others}\n        >\n            <div ref={setActivatorNodeRef} {...listeners} {...attributes} {...ctx.getStyles('dragHandle')}>\n                <DragAndDropSize24Px height={16} />\n            </div>\n            {children}\n            {removeButton}\n        </Group>\n    );\n};\n\nexport const CollectionItem: FunctionComponent<PropsWithChildren<CollectionItemProps>> = ({\n    draggable,\n    disabled,\n    ...otherProps\n}) => {\n    if (disabled) {\n        return <DisabledCollectionItem {...otherProps} />;\n    }\n    if (draggable) {\n        return <DraggableCollectionItem {...otherProps} />;\n    }\n    return <StaticCollectionItem {...otherProps} />;\n};\n"],"names":["CollectionItem","defaultProps","removable","gap","RemoveButton","onClick","ActionIcon","Quaternary","style","alignSelf","IconTrash","aria-label","size","RemoveButtonPlaceholder","div","width","StaticCollectionItem","props","useProps","children","onRemove","id","className","classNames","styles","others","ctx","useCollectionContext","removeButton","Group","data-testid","getStyles","DisabledCollectionItem","DraggableCollectionItem","useSortable","attributes","listeners","setNodeRef","transform","transition","isDragging","setActivatorNodeRef","ref","CSS","Transform","toString","undefined","data-isdragging","DragAndDropSize24Px","height","draggable","disabled","otherProps"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/Collection/CollectionItem.tsx"],"sourcesContent":["import {useSortable} from '@dnd-kit/sortable';\nimport {CSS} from '@dnd-kit/utilities';\nimport {Group, GroupProps, useProps} from '@mantine/core';\nimport {FunctionComponent, type MouseEventHandler, PropsWithChildren} from 'react';\n\nimport {useCollectionContext} from './CollectionContext.js';\nimport {DragHandle} from './layouts/shared/DragHandle.js';\nimport {RemoveButton} from './layouts/shared/RemoveButton.js';\n\ninterface CollectionItemProps extends CollectionItemSharedProps {\n    draggable?: boolean;\n    disabled: boolean;\n}\n\ninterface CollectionItemSharedProps extends GroupProps {\n    id: string;\n    onRemove?: MouseEventHandler<HTMLButtonElement>;\n    removable?: boolean;\n}\n\nconst defaultProps: Partial<CollectionItemSharedProps> = {\n    removable: true,\n    gap: 'sm',\n};\n\nconst StaticCollectionItem: FunctionComponent<PropsWithChildren<CollectionItemSharedProps>> = (props) => {\n    const {\n        children,\n        removable,\n        onRemove,\n        id,\n\n        // Style props\n        style,\n        className,\n        classNames,\n        styles,\n        ...others\n    } = useProps('CollectionItem', defaultProps, props);\n    const ctx = useCollectionContext();\n\n    return (\n        <Group\n            data-testid={`item-${id}`}\n            {...ctx.getStyles('item', {style, className, classNames, styles})}\n            {...others}\n        >\n            {children}\n            <RemoveButton removable={removable} onRemove={onRemove} />\n        </Group>\n    );\n};\n\nconst DisabledCollectionItem: FunctionComponent<PropsWithChildren<CollectionItemSharedProps>> = (props) => {\n    const ctx = useCollectionContext();\n    const {\n        children,\n        id,\n        removable: _removable,\n        onRemove: _onRemove,\n\n        // Style props\n        style,\n        className,\n        classNames,\n        styles,\n        ...others\n    } = useProps('CollectionItem', defaultProps, props);\n    return (\n        <Group\n            data-testid={`item-${id}`}\n            {...ctx.getStyles('item', {style, className, classNames, styles})}\n            {...others}\n        >\n            {children}\n        </Group>\n    );\n};\n\nconst DraggableCollectionItem: FunctionComponent<PropsWithChildren<CollectionItemSharedProps>> = (props) => {\n    const ctx = useCollectionContext();\n    const {\n        children,\n        removable,\n        onRemove,\n        id,\n\n        // Style props\n        className,\n        classNames,\n        styles,\n        ...others\n    } = useProps('CollectionItem', defaultProps, props);\n\n    const {attributes, listeners, setNodeRef, transform, transition, isDragging, setActivatorNodeRef} = useSortable({\n        id,\n    });\n\n    return (\n        <Group\n            data-testid={`item-${id}`}\n            ref={setNodeRef}\n            {...ctx.getStyles('item', {\n                style: transform\n                    ? {\n                          transform: CSS.Transform.toString(transform),\n                          transition,\n                      }\n                    : undefined,\n                className,\n                classNames,\n                styles,\n            })}\n            data-isdragging={isDragging}\n            {...others}\n        >\n            <DragHandle setActivatorNodeRef={setActivatorNodeRef} listeners={listeners} attributes={attributes} />\n            {children}\n            <RemoveButton removable={removable} onRemove={onRemove} />\n        </Group>\n    );\n};\n\nexport const CollectionItem: FunctionComponent<PropsWithChildren<CollectionItemProps>> = ({\n    draggable,\n    disabled,\n    ...otherProps\n}) => {\n    if (disabled) {\n        return <DisabledCollectionItem {...otherProps} />;\n    }\n    if (draggable) {\n        return <DraggableCollectionItem {...otherProps} />;\n    }\n    return <StaticCollectionItem {...otherProps} />;\n};\n"],"names":["CollectionItem","defaultProps","removable","gap","StaticCollectionItem","props","useProps","children","onRemove","id","style","className","classNames","styles","others","ctx","useCollectionContext","Group","data-testid","getStyles","RemoveButton","DisabledCollectionItem","_removable","_onRemove","DraggableCollectionItem","useSortable","attributes","listeners","setNodeRef","transform","transition","isDragging","setActivatorNodeRef","ref","CSS","Transform","toString","undefined","data-isdragging","DragHandle","draggable","disabled","otherProps"],"mappings":"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"}

package/dist/cjs/components/Collection/layouts/CollectionLayout.types.d.ts

@@ -0,0 +1,46 @@
+import type { MantineSpacing } from '@mantine/core';
+import { ReactElement, ReactNode } from 'react';
+/**
+ * Props passed to layout Header component
+ */
+export interface CollectionLayoutHeaderProps {
+    /** Whether drag and drop is enabled */
+    draggable?: boolean;
+    /** Whether items are removable */
+    removable?: boolean;
+}
+/**
+ * Props passed to layout Body component
+ */
+export interface CollectionLayoutBodyProps<T = unknown> {
+    /** Items to render */
+    items: T[];
+    /** Callback to remove an item */
+    onRemove?: (index: number) => void;
+    /** Whether items are removable */
+    removable?: boolean;
+    /** Whether drag and drop is enabled */
+    draggable?: boolean;
+    /** Whether the collection is disabled */
+    disabled?: boolean;
+    /** Function to get unique ID for each item */
+    getItemId?: (item: T, index: number) => string;
+    /** Gap between items */
+    gap?: MantineSpacing;
+}
+/**
+ * Collection Layout interface
+ * Follows the same pattern as Table's RowLayout
+ */
+export interface CollectionLayout {
+    (props: {
+        children: ReactNode;
+    }): ReactElement;
+    /** Layout display name */
+    displayName: string;
+    /** Header component - renders column headers */
+    Header: (props: CollectionLayoutHeaderProps) => ReactElement | null;
+    /** Body component - renders rows/items */
+    Body: <TData>(props: CollectionLayoutBodyProps<TData>) => ReactElement;
+}
+//# sourceMappingURL=CollectionLayout.types.d.ts.map

package/dist/cjs/components/Collection/layouts/CollectionLayout.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionLayout.types.d.ts","sourceRoot":"","sources":["../../../../../src/components/Collection/layouts/CollectionLayout.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,eAAe,CAAC;AAClD,OAAO,EAAC,YAAY,EAAE,SAAS,EAAC,MAAM,OAAO,CAAC;AAE9C;;GAEG;AACH,MAAM,WAAW,2BAA2B;IACxC,uCAAuC;IACvC,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,kCAAkC;IAClC,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB;AAED;;GAEG;AACH,MAAM,WAAW,yBAAyB,CAAC,CAAC,GAAG,OAAO;IAClD,sBAAsB;IACtB,KAAK,EAAE,CAAC,EAAE,CAAC;IAEX,iCAAiC;IACjC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAEnC,kCAAkC;IAClC,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,uCAAuC;IACvC,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,8CAA8C;IAC9C,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAE/C,wBAAwB;IACxB,GAAG,CAAC,EAAE,cAAc,CAAC;CACxB;AAED;;;GAGG;AACH,MAAM,WAAW,gBAAgB;IAC7B,CAAC,KAAK,EAAE;QAAC,QAAQ,EAAE,SAAS,CAAA;KAAC,GAAG,YAAY,CAAC;IAE7C,0BAA0B;IAC1B,WAAW,EAAE,MAAM,CAAC;IAEpB,gDAAgD;IAChD,MAAM,EAAE,CAAC,KAAK,EAAE,2BAA2B,KAAK,YAAY,GAAG,IAAI,CAAC;IAEpE,0CAA0C;IAC1C,IAAI,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,yBAAyB,CAAC,KAAK,CAAC,KAAK,YAAY,CAAC;CAC1E"}

package/dist/cjs/components/Collection/layouts/CollectionLayout.types.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+
+//# sourceMappingURL=CollectionLayout.types.js.map

package/dist/cjs/components/Collection/layouts/CollectionLayout.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/Collection/layouts/CollectionLayout.types.ts"],"names":[],"mappings":""}

package/dist/cjs/components/Collection/layouts/CollectionLayouts.d.ts

@@ -0,0 +1,26 @@
+export declare const CollectionLayouts: {
+    readonly Horizontal: {
+        ({ children }: import("./shared/layoutConstants.js").LayoutProps): import("react/jsx-runtime.js").JSX.Element;
+        Body: <T>(props: import("./shared/layoutConstants.js").LayoutBodyProps<T> & {
+            ref?: import("react").ForwardedRef<HTMLDivElement>;
+        }) => import("react/jsx-runtime.js").JSX.Element;
+        Header: (props: import("./shared/layoutConstants.js").LayoutHeaderProps & {
+            ref?: import("react").ForwardedRef<HTMLDivElement>;
+        }) => import("react/jsx-runtime.js").JSX.Element;
+        displayName: string;
+    };
+    readonly Vertical: {
+        ({ children }: import("./shared/layoutConstants.js").LayoutProps): import("react/jsx-runtime.js").JSX.Element;
+        Body: <T>(props: import("./shared/layoutConstants.js").LayoutBodyProps<T> & {
+            ref?: import("react").ForwardedRef<HTMLDivElement>;
+        }) => import("react/jsx-runtime.js").JSX.Element;
+        Header: (_props: import("./shared/layoutConstants.js").LayoutHeaderProps & {
+            ref?: import("react").ForwardedRef<HTMLDivElement>;
+        }) => null;
+        displayName: string;
+    };
+};
+export { HorizontalLayout } from './horizontal-layout/HorizontalLayout.js';
+export { VerticalLayout } from './vertical-layout/VerticalLayout.js';
+export type { CollectionLayout, CollectionLayoutBodyProps, CollectionLayoutHeaderProps, } from './CollectionLayout.types.js';
+//# sourceMappingURL=CollectionLayouts.d.ts.map

package/dist/cjs/components/Collection/layouts/CollectionLayouts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionLayouts.d.ts","sourceRoot":"","sources":["../../../../../src/components/Collection/layouts/CollectionLayouts.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,iBAAiB;;;;eAY2xB,CAAC;;;eAA5xB,CAAC;;;;;;;eAAgyF,CAAC;;;eANh0F,CAAC;;;;CAHS,CAAC;AAEX,OAAO,EAAC,gBAAgB,EAAC,MAAM,yCAAyC,CAAC;AACzE,OAAO,EAAC,cAAc,EAAC,MAAM,qCAAqC,CAAC;AACnE,YAAY,EACR,gBAAgB,EAChB,yBAAyB,EACzB,2BAA2B,GAC9B,MAAM,6BAA6B,CAAC"}

package/dist/cjs/components/Collection/layouts/CollectionLayouts.js

@@ -0,0 +1,29 @@
+"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 CollectionLayouts () {
+        return CollectionLayouts;
+    },
+    get HorizontalLayout () {
+        return _HorizontalLayout.HorizontalLayout;
+    },
+    get VerticalLayout () {
+        return _VerticalLayout.VerticalLayout;
+    }
+});
+var _HorizontalLayout = require("./horizontal-layout/HorizontalLayout.js");
+var _VerticalLayout = require("./vertical-layout/VerticalLayout.js");
+var CollectionLayouts = {
+    Horizontal: _HorizontalLayout.HorizontalLayout,
+    Vertical: _VerticalLayout.VerticalLayout
+};
+
+//# sourceMappingURL=CollectionLayouts.js.map

package/dist/cjs/components/Collection/layouts/CollectionLayouts.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/Collection/layouts/CollectionLayouts.tsx"],"sourcesContent":["import {HorizontalLayout} from './horizontal-layout/HorizontalLayout.js';\nimport {VerticalLayout} from './vertical-layout/VerticalLayout.js';\n\nexport const CollectionLayouts = {\n    Horizontal: HorizontalLayout,\n    Vertical: VerticalLayout,\n} as const;\n\nexport {HorizontalLayout} from './horizontal-layout/HorizontalLayout.js';\nexport {VerticalLayout} from './vertical-layout/VerticalLayout.js';\nexport type {\n    CollectionLayout,\n    CollectionLayoutBodyProps,\n    CollectionLayoutHeaderProps,\n} from './CollectionLayout.types.js';\n"],"names":["CollectionLayouts","HorizontalLayout","VerticalLayout","Horizontal","Vertical"],"mappings":";;;;;;;;;;;QAGaA;eAAAA;;QAKLC;eAAAA,kCAAgB;;QAChBC;eAAAA,8BAAc;;;gCATS;8BACF;AAEtB,IAAMF,oBAAoB;IAC7BG,YAAYF,kCAAgB;IAC5BG,UAAUF,8BAAc;AAC5B"}

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

@@ -0,0 +1,12 @@
+import { LayoutProps } from '../shared/layoutConstants.js';
+export declare const HorizontalLayout: {
+    ({ children }: LayoutProps): import("react/jsx-runtime.js").JSX.Element;
+    Body: <T>(props: import("../shared/layoutConstants.js").LayoutBodyProps<T> & {
+        ref?: import("react").ForwardedRef<HTMLDivElement>;
+    }) => import("react/jsx-runtime.js").JSX.Element;
+    Header: (props: import("../shared/layoutConstants.js").LayoutHeaderProps & {
+        ref?: import("react").ForwardedRef<HTMLDivElement>;
+    }) => import("react/jsx-runtime.js").JSX.Element;
+    displayName: string;
+};
+//# sourceMappingURL=HorizontalLayout.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"HorizontalLayout.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Collection/layouts/horizontal-layout/HorizontalLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAC,MAAM,8BAA8B,CAAC;AAIzD,eAAO,MAAM,gBAAgB;mBAAgB,WAAW;;WAK63B,CAAC;;;WAA5xB,CAAC;;;CAL/E,CAAC"}

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

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "HorizontalLayout", {
+    enumerable: true,
+    get: function() {
+        return HorizontalLayout;
+    }
+});
+var _jsxruntime = require("react/jsx-runtime");
+var _HorizontalLayoutBody = require("./HorizontalLayoutBody.js");
+var _HorizontalLayoutHeader = require("./HorizontalLayoutHeader.js");
+var HorizontalLayout = function(param) {
+    var children = param.children;
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
+        children: children
+    });
+};
+HorizontalLayout.Body = _HorizontalLayoutBody.HorizontalLayoutBody;
+HorizontalLayout.Header = _HorizontalLayoutHeader.HorizontalLayoutHeader;
+HorizontalLayout.displayName = 'Horizontal';
+
+//# sourceMappingURL=HorizontalLayout.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/Collection/layouts/horizontal-layout/HorizontalLayout.tsx"],"sourcesContent":["import {LayoutProps} from '../shared/layoutConstants.js';\nimport {HorizontalLayoutBody} from './HorizontalLayoutBody.js';\nimport {HorizontalLayoutHeader} from './HorizontalLayoutHeader.js';\n\nexport const HorizontalLayout = ({children}: LayoutProps) => <>{children}</>;\n\nHorizontalLayout.Body = HorizontalLayoutBody;\nHorizontalLayout.Header = HorizontalLayoutHeader;\nHorizontalLayout.displayName = 'Horizontal';\n"],"names":["HorizontalLayout","children","Body","HorizontalLayoutBody","Header","HorizontalLayoutHeader","displayName"],"mappings":";;;;+BAIaA;;;eAAAA;;;;oCAHsB;sCACE;AAE9B,IAAMA,mBAAmB;QAAEC,iBAAAA;yBAA2B;kBAAGA;;;AAEhED,iBAAiBE,IAAI,GAAGC,0CAAoB;AAC5CH,iBAAiBI,MAAM,GAAGC,8CAAsB;AAChDL,iBAAiBM,WAAW,GAAG"}

package/dist/cjs/components/Collection/layouts/horizontal-layout/HorizontalLayout.module.css

@@ -0,0 +1,37 @@
+.headerRow {
+    display: flex;
+    gap: var(--mantine-spacing-sm);
+    padding-bottom: var(--mantine-spacing-xs);
+    align-items: center;
+}
+
+.headerCell {
+    flex: 1;
+    font-weight: var(--coveo-fw-bold);
+    text-align: left;
+}
+
+.dragHandleHeader {
+    width: var(--mantine-spacing-sm);
+    flex-shrink: 0;
+}
+
+.removeButtonHeader {
+    width: calc(var(--mantine-spacing-md) + var(--mantine-spacing-sm));
+    flex-shrink: 0;
+}
+
+.row {
+    display: flex;
+    gap: var(--mantine-spacing-sm);
+    align-items: center;
+    background: var(--mantine-color-body);
+}
+
+.row[data-isdragging='true'] {
+    z-index: 1;
+}
+
+.cell {
+    flex: 1;
+}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"HorizontalLayoutBody.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Collection/layouts/horizontal-layout/HorizontalLayoutBody.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,YAAY,EAAU,MAAM,OAAO,CAAC;AAI5C,OAAO,EAA4B,eAAe,EAAC,MAAM,8BAA8B,CAAC;AA8BxF,eAAO,MAAM,oBAAoB,GAAI,CAAC,EAAG,OAAO,eAAe,CAAC,CAAC,CAAC,GAAG;IAAC,GAAG,CAAC,EAAE,YAAY,CAAC,cAAc,CAAC,CAAA;CAAC,+CAgCxG,CAAC"}

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