@braineet/ui
Version:
Braineet design system
97 lines (96 loc) • 6.44 kB
JavaScript
;
exports.__esModule = true;
exports.TdStyled = exports.StyledTextHeader = exports.StyledText = exports.StyledRow = exports.StyledIcon = exports.StyledHead = exports.StyledButtonHeader = exports.StyledBoxHeader = exports.PaneStyled = void 0;
var _styledComponents = _interopRequireWildcard(require("styled-components"));
var _utils = require("../../../utils");
var _box = _interopRequireDefault(require("../../box"));
var _icon = _interopRequireDefault(require("../../icon"));
var _pane = _interopRequireDefault(require("../../pane"));
var _text = _interopRequireDefault(require("../../text"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var StyledRow = (0, _styledComponents.default)(_pane.default).withConfig({
displayName: "styles__StyledRow",
componentId: "sc-17inmjk-0"
})(["cursor:pointer;transition:background-color 0.1s ease-out,box-shadow 0.1s ease-out;background-color:", ";border:none;outline:none;border-radius:8px;td:first-child{border-top-left-radius:8px;border-bottom-left-radius:8px;}td:last-child{border-top-right-radius:8px;border-bottom-right-radius:8px;}&:focus,&:hover{background-color:", ";}&:active{background-color:", ";box-shadow:", ";}"], function (props) {
return props.theme.colors.white;
}, function (props) {
return props.theme.colors.brand10;
}, function (props) {
return props.theme.colors.brand10;
}, function (props) {
return (0, _utils.border)(["0px 0px 0px 0px " + props.theme.colors.white + " inset"]);
});
exports.StyledRow = StyledRow;
var StyledHead = (0, _styledComponents.default)(_pane.default).withConfig({
displayName: "styles__StyledHead",
componentId: "sc-17inmjk-1"
})(["padding:6px;background:transparent;border:none;"]);
exports.StyledHead = StyledHead;
var StyledBoxHeader = (0, _styledComponents.default)(_box.default).withConfig({
displayName: "styles__StyledBoxHeader",
componentId: "sc-17inmjk-2"
})(["overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0 4px;border:none;padding:4px;"]);
exports.StyledBoxHeader = StyledBoxHeader;
var StyledButtonHeader = _styledComponents.default.button.withConfig({
displayName: "styles__StyledButtonHeader",
componentId: "sc-17inmjk-3"
})(["align-items:center;width:100%;text-align:left;padding:8px;overflow:hidden;text-overflow:ellipsis;border:none;background-color:transparent;height:40px;transition:background-color 0.1s ease-out;box-shadow:none;cursor:default;", " ", ""], (0, _utils.borderRadius)(4), function (props) {
return !props.noFilter && (0, _styledComponents.css)(["cursor:pointer;&:hover,&:focus{background-color:", ";}&:active{background-color:", ";color:", ";}", ""], props.theme.colors.brand10, props.theme.colors.brand10, props.theme.colors.brand90, props.selected && Active);
});
exports.StyledButtonHeader = StyledButtonHeader;
var StyledTextHeader = (0, _styledComponents.default)(_text.default).withConfig({
displayName: "styles__StyledTextHeader",
componentId: "sc-17inmjk-4"
})(["max-width:90%;text-overflow:ellipsis;overflow:hidden;line-height:26px;", ""], function (props) {
return props.selected && Active;
});
exports.StyledTextHeader = StyledTextHeader;
var StyledText = (0, _styledComponents.default)(_text.default).withConfig({
displayName: "styles__StyledText",
componentId: "sc-17inmjk-5"
})(["text-overflow:ellipsis;white-space:nowrap;display:block;max-width:100%;color:", ";"], function (props) {
return props.theme.colors.black;
});
exports.StyledText = StyledText;
var StyledIcon = (0, _styledComponents.default)(_icon.default).withConfig({
displayName: "styles__StyledIcon",
componentId: "sc-17inmjk-6"
})(["display:inline-block;vertical-align:middle;margin-left:8px;", ""], function (props) {
return props.selected && Active;
});
exports.StyledIcon = StyledIcon;
var Active = (0, _styledComponents.css)(["color:", ";fill:", ";"], function (props) {
return props.theme.colors.brand;
}, function (props) {
return props.theme.colors.brand;
});
var PaneStyled = (0, _styledComponents.default)(_pane.default).withConfig({
displayName: "styles__PaneStyled",
componentId: "sc-17inmjk-7"
})(["border-spacing:", ";border-collapse:separate;table-layout:fixed;border-radius:", ";thead{td:first-child{border-top-left-radius:", ";}td:last-child{border-top-right-radius:", ";}}"], function (p) {
return p.borderSpacing || '0 8px';
}, function (p) {
return p.theme.borderRadius.md;
}, function (p) {
return p.theme.borderRadius.md;
}, function (p) {
return p.theme.borderRadius.md;
});
exports.PaneStyled = PaneStyled;
var TdStyled = _styledComponents.default.td.withConfig({
displayName: "styles__TdStyled",
componentId: "sc-17inmjk-8"
})(["vertical-align:middle;width:", ";", " ", " ", " ", ""], function (props) {
return props.width;
}, function (props) {
return props.borderTop ? "\n border-top: " + props.borderTop + ";\n " : null;
}, function (props) {
return props.borderBottom ? "\n border-bottom: " + props.borderBottom + ";\n " : null;
}, function (props) {
return props.borderLeft ? "\n border-left: " + props.borderLeft + ";\n " : null;
}, function (props) {
return props.borderRight ? "\n border-right: " + props.borderRight + ";\n " : null;
});
exports.TdStyled = TdStyled;