@nodeject/ui-components
Version:
UI library for non-trivial components
102 lines (101 loc) • 4.72 kB
JavaScript
;
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ItemDraggableContainer = void 0;
var react_smooth_dnd_1 = require("@richardrout/react-smooth-dnd");
var antd_1 = require("antd");
var classcat_1 = require("classcat");
var React = require("react");
var components_1 = require("./components");
var styles = require("./Item.module.less");
var ItemDraggableContainer = function (props) {
var classNameItem = props.classNameItem, events = props.events, id = props.id, isFilteredOut = props.isVisible, newCardIsVisible = props.newCardIsVisible;
// const getStyle = (style: React.CSSProperties, snapshot: DraggableStateSnapshot) => {
// if (!snapshot.isDropAnimating) {
// return style
// }
// const { moveTo, curve, duration } = snapshot.dropAnimation
// // move to the right spot
// const translate = `translate(${moveTo.x}px, ${moveTo.y}px)`
// // add a bit of turn for fun
// const rotate = 'rotate(0.5turn)'
// // patching the existing style
// return {
// ...style,
// // transform: `${translate} ${rotate}`,
// // slowing down the drop because we can
// transition: 'all 0.1s'
// }
// }
var Item = props.Item || components_1.DefaultItem;
// console.log(id, props.isVisiblePerformance)
return (React.createElement(react_smooth_dnd_1.Draggable, { className: props.isVisiblePerformance
? styles.itemVisibleWebkit
: styles.itemHiddenWebkit },
React.createElement(ItemWrapper, __assign({ classNameItem: classNameItem, events: events, id: id, isDragging: false, isVisible: isFilteredOut, Item: Item, newCardIsVisible: newCardIsVisible }, props))));
};
exports.ItemDraggableContainer = ItemDraggableContainer;
var ItemWrapper = function (props) {
var _a;
var classNameItem = props.classNameItem, _b = props.events, onItemClick = _b.onItemClick, onItemDelete = _b.onItemDelete, id = props.id, isDragging = props.isDragging, isVisible = props.isVisible, newCardIsVisible = props.newCardIsVisible;
var useless2 = props.events, useless3 = props.Item, data = __rest(props, ["events", "Item"]);
var onClick = function () {
onItemClick(id);
};
var onDeleteItemClick = function () {
onItemDelete(id);
};
var Item = props.Item || components_1.DefaultItem;
var className = classcat_1.default((_a = {},
_a[styles.item] = isVisible,
_a[styles.itemFilteredOut] = !isVisible,
_a[classNameItem] = Boolean(classNameItem),
_a));
var itemProps = __assign(__assign({}, props), { data: data,
newCardIsVisible: newCardIsVisible });
var itemWrapperClassName = isDragging
? styles.dragging + " " + className
: className;
// const ref = React.useRef()
// const { height } = useResizeDetector({ targetRef: ref })
// const [heightStyle, setHeightStyle] = React.useState(null)
// contain-intrinsic-size: auto 110px;
// React.useLayoutEffect(() => {
// setHeightStyle((previousHeight) => {
// return {
// containIntrinsicSize:
// height > previousHeight && height > 100
// ? `auto ${height}px`
// : `auto ${100}px`
// }
// })
// }, [height])
// const [style, setStyle] = React.useState<any>({
// // contentVisibility: 'auto'
// })
// const isRendered
return (React.createElement("div", { className: itemWrapperClassName, onClick: onClick },
React.createElement(Item, __assign({}, itemProps, { isDragging: isDragging }),
React.createElement(antd_1.Button, { onClick: onDeleteItemClick }, "Delete"))));
};