"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.TableColumn = exports.TableColumnHeader = exports.TableRow = exports.TableHeader = exports.TableBody = exports.Table = exports.TableInnerWrapper = exports.TableWrapper = void 0;
const styled_components_1 = __importDefault(require("styled-components"));
exports.TableWrapper = styled_components_1.default.div `
  margin: 0;
  padding: 0;
`;
exports.TableInnerWrapper = styled_components_1.default.div `
  margin: 0;
  padding: 0;
  max-width: 100%;
  overflow-x: auto;
`;
exports.Table = styled_components_1.default.table `
  margin: 0;
  padding: 0;
  border-collapse: collapse;
  min-width: 100%;
`;
exports.TableBody = styled_components_1.default.tbody `
  margin: 0;
  padding: 0;
`;
exports.TableHeader = styled_components_1.default.thead `
  margin: 0;
  padding: 0;
`;
exports.TableRow = styled_components_1.default.tr `
  margin: 0;
  padding: 0;
  color: ${({ theme }) => theme.COLOR.gray1};
  cursor: ${({ onClick }) => (onClick ? 'pointer' : 'default')};
  ${({ borderBottom: borderBottomProp }) => borderBottomProp
    ? `border-bottom: ${borderBottomProp};`
    : `border-bottom: 2px solid ${({ theme }) => theme.COLOR.gray4};`}

  ${({ paginate, borderBottom }) => paginate || borderBottom
    ? ''
    : `&:last-child {
          border-bottom: 0;
        }`}

  &.selected,
  &:hover {
    td {
      background-color: ${({ theme }) => theme.COLOR.gray4};
    }
  }

  &.hide {
    display: none;
  }

  &:hover {
    .showOnHover {
      opacity: 1;
      pointer-events: all;
    }
  }
`;
exports.TableColumnHeader = styled_components_1.default.th((props) => `
  margin: 0;
  padding: ${props.padding || '10px 15px'};
  text-align: ${props.textAlign || 'left'};
  color: ${({ theme }) => theme.COLOR.gray2};
  line-height: ${({ theme }) => theme.lineHeights.lessTight};
`);
exports.TableColumn = styled_components_1.default.td((props) => `
  margin: 0;
  padding: ${props.padding || '3px 15px'};
  white-space: nowrap;
  line-height: ${props.lineHeight || 'initial'};
  text-align: ${props.textAlign || 'left'};

  .canEdit {
    cursor: pointer;
  }

  .editIcon {
    opacity: 0;
    transition: opacity 0.3s;
  }

  &:hover {
    .editIcon {
      opacity: 1;
    }
  }

  .showOnHover {
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
  }
`);
//# sourceMappingURL=styles.js.map