Table = ({
  contents,
  rows,
  columns,
  bs_style,
  bs_small,
  bs_striped,
  bs_bordered,
  bs_borderless,
  bs_wauto,
  customClass
}) => {
  const {
    selected,
    connectors: { connect, drag },
  } = useNode((node) => ({ selected: node.events.selected }));
  return (
    <table
      className={`${selected ? "selected-node" : ""} ${customClass} ${
        bs_style ? "table" : ""
      } ${bs_style && bs_small ? "table-sm" : ""} ${
        bs_style && bs_striped ? "table-striped" : ""
      } ${bs_style && bs_bordered ? "table-bordered" : ""} ${
        bs_style && bs_borderless ? "table-borderless" : ""
      } ${bs_style && bs_wauto ? "w-auto" : ""}`}
      ref={(dom) => connect(drag(dom))}
    >
      <tbody>
        {ntimes(rows, (ri) => (
          <tr key={ri}>
            {ntimes(columns, (ci) => (
              <td key={ci}>
                <Element canvas id={`cell_${ri}_${ci}`} is={Column}>
                  {contents?.[ri]?.[ci]}
                </Element>
              </td>
            ))}
          </tr>
        ))}
      </tbody>
    </table>
  );
}
@param {object} props
@param {string[]} props.contents
@param {string[]} props.titles
@param {string} props.tabsStyle
@param {number} props.ntabs
@returns {div}
@namespace
@category saltcorn-builder
@subcategory components