calcite-react/Table/Table-styled.js

Calcite components for React

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.StyledTableRow = exports.StyledTableHeaderRow = exports.StyledTableHeaderCell = exports.StyledTableHeader = exports.StyledTableCell = exports.StyledTableBody = exports.StyledTable = void 0;

var _styledComponents = _interopRequireWildcard(require("styled-components"));

var _helpers = require("../utils/helpers");

var _CalciteThemeProvider = require("../CalciteThemeProvider");

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }

// Copyright 2019 Esri
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
// http://www.apache.org/licenses/LICENSE-2.0
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.​
// styled-components
// Utils, common elements
// Calcite theme and Esri colors
// Calcite components
// Icons
// Third party libraries
var StyledTable = _styledComponents.default.table.withConfig({
  displayName: "StyledTable",
  componentId: "sc-5v914g-0"
})(["width:100%;background-color:", ";border-collapse:collapse;border-spacing:0;border:1px solid ", ";text-align:initial;overflow:auto;", ";", ";", ";", ";", ";", ";"], function (props) {
  return props.theme.palette.white;
}, function (props) {
  return props.theme.palette.lighterGray;
}, (0, _helpers.fontSize)(-2), function (props) {
  return props.blue && (0, _styledComponents.css)(["border-color:", ";"], function (props) {
    return props.theme.palette.blue;
  });
}, function (props) {
  return props.plain && (0, _styledComponents.css)(["border:none;"]);
}, function (props) {
  return props.noTable && (0, _styledComponents.css)(["width:auto;background-color:transparent;border-collapse:auto;border-spacing:0;border:none;overflow:auto;margin-bottom:0;"]);
}, function (props) {
  return props.noCol && (0, _styledComponents.css)(["border-left:none;border-right:none;"]);
}, function (props) {
  return props.noRow && (0, _styledComponents.css)(["border-top:none;border-bottom:none;"]);
});

exports.StyledTable = StyledTable;
StyledTable.defaultProps = {
  theme: _CalciteThemeProvider.CalciteTheme
};

var StyledTableBody = _styledComponents.default.tbody.withConfig({
  displayName: "StyledTableBody",
  componentId: "sc-5v914g-1"
})(["overflow:auto;width:100%;", ";", ";", ";"], function (props) {
  return props.noTable && (0, _styledComponents.css)(["border:none;background-color:transparent;overflow:auto;width:100%;", ";"], (0, _helpers.fontSize)(0));
}, function (props) {
  return props.noCol && (0, _styledComponents.css)(["border-left:none;border-right:none;"]);
}, function (props) {
  return props.noRow && (0, _styledComponents.css)(["border-top:none;border-bottom:none;"]);
});

exports.StyledTableBody = StyledTableBody;
StyledTableBody.defaultProps = {
  theme: _CalciteThemeProvider.CalciteTheme
};

var StyledTableCell = _styledComponents.default.td.withConfig({
  displayName: "StyledTableCell",
  componentId: "sc-5v914g-2"
})(["font-weight:300;border-left:1px solid ", ";border-right:1px solid ", ";padding:", ";", ";", ";", ";", ";", ";", ";", ";"], function (props) {
  return props.theme.palette.lighterGray;
}, function (props) {
  return props.theme.palette.lighterGray;
}, function (props) {
  return (0, _helpers.unitCalc)(props.theme.baseline, 3, '/');
}, function (props) {
  return props.blue && (0, _styledComponents.css)(["border-color:", ";"], function (props) {
    return props.theme.palette.blue;
  });
}, function (props) {
  return props.plain && (0, _styledComponents.css)(["background-color:transparent;border:none;*:nth-child(even) > &{background-color:transparent;}"]);
}, function (props) {
  return props.striped && (0, _styledComponents.css)(["*:nth-child(even) > &{background-color:", ";}", ";"], props.theme.palette.offWhite, props.blue && (0, _styledComponents.css)(["*:nth-child(even) > &{background-color:", ";}"], props.theme.palette.lightestBlue));
}, function (props) {
  return props.noTable && (0, _styledComponents.css)(["background-color:transparent;border:none;"]);
}, function (props) {
  return props.noCol && (0, _styledComponents.css)(["border-left:none;border-right:none;"]);
}, function (props) {
  return props.noRow && (0, _styledComponents.css)(["border-top:none;border-bottom:none;"]);
}, function (props) {
  return props.justified && (0, _styledComponents.css)(["&:first-child{padding-left:0;}&:last-child{padding-right:0;}"]);
});

exports.StyledTableCell = StyledTableCell;
StyledTableCell.defaultProps = {
  theme: _CalciteThemeProvider.CalciteTheme
};

var StyledTableHeader = _styledComponents.default.thead.withConfig({
  displayName: "StyledTableHeader",
  componentId: "sc-5v914g-3"
})(["background-color:", ";border-bottom:1px solid ", ";font-weight:400;font-style:normal;", ";", ";", ";", ";", ";", ";"], function (props) {
  return props.theme.palette.lightestGray;
}, function (props) {
  return props.theme.palette.lighterGray;
}, (0, _helpers.fontSize)(0), function (props) {
  return props.blue && (0, _styledComponents.css)(["background-color:", ";border:none;border-bottom:1px solid ", ";color:", ";"], function (props) {
    return props.theme.palette.blue;
  }, function (props) {
    return props.theme.palette.blue;
  }, function (props) {
    return props.theme.palette.white;
  });
}, function (props) {
  return props.plain && (0, _styledComponents.css)(["background-color:transparent;border:none;"]);
}, function (props) {
  return props.noTable && (0, _styledComponents.css)(["border:none;background-color:transparent;overflow:auto;width:100%;"]);
}, function (props) {
  return props.noCol && (0, _styledComponents.css)(["border-left:none;border-right:none;"]);
}, function (props) {
  return props.noRow && (0, _styledComponents.css)(["border-top:none;border-bottom:none;"]);
});

exports.StyledTableHeader = StyledTableHeader;
StyledTableHeader.defaultProps = {
  theme: _CalciteThemeProvider.CalciteTheme
};

var StyledTableHeaderCell = _styledComponents.default.th.withConfig({
  displayName: "StyledTableHeaderCell",
  componentId: "sc-5v914g-4"
})(["font-weight:300;border-left:1px solid ", ";border-right:1px solid ", ";padding:", ";text-align:left;html[dir='rtl'] &{text-align:right;}", ";", ";", ";", ";", ";", ";"], function (props) {
  return props.theme.palette.lighterGray;
}, function (props) {
  return props.theme.palette.lighterGray;
}, function (props) {
  return (0, _helpers.unitCalc)(props.theme.baseline, 3, '/');
}, function (props) {
  return props.blue && (0, _styledComponents.css)(["border-color:", ";"], function (props) {
    return props.theme.palette.blue;
  });
}, function (props) {
  return props.plain && (0, _styledComponents.css)(["background-color:transparent;border:none;"]);
}, function (props) {
  return props.noTable && (0, _styledComponents.css)(["background-color:transparent;border:none;"]);
}, function (props) {
  return props.noCol && (0, _styledComponents.css)(["border-left:none;border-right:none;"]);
}, function (props) {
  return props.noRow && (0, _styledComponents.css)(["border-top:none;border-bottom:none;"]);
}, function (props) {
  return props.justified && (0, _styledComponents.css)(["&:first-child{padding-left:0;}&:last-child{padding-right:0;}"]);
});

exports.StyledTableHeaderCell = StyledTableHeaderCell;
StyledTableHeaderCell.defaultProps = {
  theme: _CalciteThemeProvider.CalciteTheme
};

var StyledTableHeaderRow = _styledComponents.default.tr.withConfig({
  displayName: "StyledTableHeaderRow",
  componentId: "sc-5v914g-5"
})(["", ";"], function (props) {
  return props.blue && (0, _styledComponents.css)(["&:nth-child(even){background-color:", ";color:", ";}"], function (props) {
    return props.theme.palette.lighterBlue;
  }, function (props) {
    return props.theme.palette.typeColor;
  });
});

exports.StyledTableHeaderRow = StyledTableHeaderRow;
StyledTableHeaderRow.defaultProps = {
  theme: _CalciteThemeProvider.CalciteTheme
};

var StyledTableRow = _styledComponents.default.tr.withConfig({
  displayName: "StyledTableRow",
  componentId: "sc-5v914g-6"
})(["border-bottom:1px solid ", ";", ";", ";", ";", ";", ";", ";"], function (props) {
  return props.theme.palette.lighterGray;
}, function (props) {
  return props.blue && (0, _styledComponents.css)(["border-color:", ";"], function (props) {
    return props.theme.palette.blue;
  });
}, function (props) {
  return props.plain && (0, _styledComponents.css)(["border:none;&:nth-child(even){background-color:transparent;}"]);
}, function (props) {
  return props.striped && (0, _styledComponents.css)(["&:nth-child(even){background-color:", ";a{color:", ";}}", ";"], props.theme.palette.offWhite, props.theme.palette.darkBlue, props.blue && (0, _styledComponents.css)(["&:nth-child(even){background-color:", ";}"], props.theme.palette.lightestBlue));
}, function (props) {
  return props.noTable && (0, _styledComponents.css)(["border:none;"]);
}, function (props) {
  return props.noCol && (0, _styledComponents.css)(["border-left:none;border-right:none;"]);
}, function (props) {
  return props.noRow && (0, _styledComponents.css)(["border-top:none;border-bottom:none;"]);
});

exports.StyledTableRow = StyledTableRow;
StyledTableRow.defaultProps = {
  theme: _CalciteThemeProvider.CalciteTheme
};