import React from 'react';

/**
 * Common wrapper component for all element types
 * Handles common styling, click handlers, and resize handles
 */
function ElementWrapper({
  className,
  style,
  isSelected,
  isDragging,
  onClick,
  onDoubleClick,
  onMouseDown,
  children,
  showResizeHandles,
  ResizeHandles
}) {
  const classes = [
    className,
    isSelected ? 'selected' : '',
    isDragging ? 'dragging' : ''
  ].filter(Boolean).join(' ');

  return (
    <div
      className={classes}
      style={style}
      onClick={onClick}
      onDoubleClick={onDoubleClick}
      onMouseDown={onMouseDown}
    >
      {children}
      {showResizeHandles && ResizeHandles}
    </div>
  );
}

export default ElementWrapper;
