@coveord/plasma-mantine
Version:
A Plasma flavoured Mantine theme
106 lines (105 loc) • 4.55 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "CollectionItem", {
enumerable: true,
get: function() {
return CollectionItem;
}
});
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 _CollectionContext = require("./CollectionContext");
var RemoveButton = function(param) {
var onClick = param.onClick;
return /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.ActionIcon, {
style: {
alignSelf: 'center'
},
variant: "subtle",
onClick: onClick,
color: "action",
children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_plasmareacticons.RemoveSize16Px, {
height: 16
})
});
};
var RemoveButtonPlaceholder = function() {
return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
style: {
width: 28
}
});
};
var StaticCollectionItem = function(param) {
var onRemove = param.onRemove, _param_removable = param.removable, removable = _param_removable === void 0 ? true : _param_removable, children = param.children;
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._({}, ctx.getStyles('item')), {
children: [
children,
removeButton
]
}));
};
var DisabledCollectionItem = function(param) {
var children = param.children;
var ctx = (0, _CollectionContext.useCollectionContext)();
return /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Group, _object_spread_props._(_object_spread._({}, ctx.getStyles('item')), {
children: children
}));
};
var DraggableCollectionItem = function(param) {
var id = param.id, onRemove = param.onRemove, _param_removable = param.removable, removable = _param_removable === void 0 ? true : _param_removable, children = param.children;
var ctx = (0, _CollectionContext.useCollectionContext)();
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;
return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_core.Group, _object_spread_props._(_object_spread._({
ref: setNodeRef
}, ctx.getStyles('item', {
style: transform ? {
transform: _utilities.CSS.Transform.toString(transform),
transition: transition
} : undefined
})), {
"data-isdragging": isDragging,
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
})
})),
children,
removeButton
]
}));
};
var CollectionItem = function(_param) {
var draggable = _param.draggable, disabled = _param.disabled, otherProps = _object_without_properties._(_param, [
"draggable",
"disabled"
]);
if (disabled) {
return /*#__PURE__*/ (0, _jsxruntime.jsx)(DisabledCollectionItem, _object_spread._({}, otherProps));
}
if (draggable) {
return /*#__PURE__*/ (0, _jsxruntime.jsx)(DraggableCollectionItem, _object_spread._({}, otherProps));
}
return /*#__PURE__*/ (0, _jsxruntime.jsx)(StaticCollectionItem, _object_spread._({}, otherProps));
};
//# sourceMappingURL=CollectionItem.js.map