Column = ({ children, align }) => {
  const {
    selected,
    id,
    connectors: { connect, drag },
  } = useNode((node) => ({ selected: node.events.selected }));
  const options = useContext(optionsCtx);

  return (
    <div
      className={`${selected ? "selected-node" : ""} ${
        options.mode === "list" ? "flex-50 list-col-contents" : ""
      }`}
      ref={(dom) => connect(drag(dom))}
    >
      <div
        className={`canvas ${id === "ROOT" ? "root-canvas" : ""} ${
          options.mode === "list" ? "list-empty-msg list-col-canvas" : ""
        }`}
      >
        {children}
      </div>
    </div>
  );
}
@param {object} props
@param {string} props.children
@param {*} props.align
@returns {div}
@category saltcorn-builder
@subcategory components
@namespace