styled-tooltip-component
Version:
The bootstrap tooltip component created with styled-components
88 lines (62 loc) • 3.91 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.TooltipArrow = void 0;
var _styledComponents = _interopRequireWildcard(require("styled-components"));
var _styledBaseComponents = require("styled-base-components");
var _styledConfig = require("styled-config");
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; } }
function _templateObject5() {
var data = _taggedTemplateLiteral(["\n position: absolute;\n display: block;\n width: 0.8rem;\n height: 0.4rem;\n &::before {\n position: absolute;\n content: \"\";\n border-color: transparent;\n border-style: solid;\n }\n ", ";\n ", ";\n ", ";\n ", ";\n"]);
_templateObject5 = function _templateObject5() {
return data;
};
return data;
}
function _templateObject4() {
var data = _taggedTemplateLiteral(["\n width: 0.4rem;\n right: 0;\n height: 100%;\n &::before {\n left: 0;\n top: calc(50% - 0.35rem);\n border-width: 0.4rem 0 0.4rem 0.4rem;\n border-left-color: ", ";\n }\n "]);
_templateObject4 = function _templateObject4() {
return data;
};
return data;
}
function _templateObject3() {
var data = _taggedTemplateLiteral(["\n width: 0.4rem;\n left: 0;\n height: 100%;\n &::before {\n right: 0;\n top: calc(50% - 0.35rem);\n border-width: 0.4rem 0.4rem 0.4rem 0;\n border-right-color: ", ";\n }\n "]);
_templateObject3 = function _templateObject3() {
return data;
};
return data;
}
function _templateObject2() {
var data = _taggedTemplateLiteral(["\n top: 0;\n width: 100%;\n &::before {\n bottom: 0.4rem;\n left: calc(50% - 0.35rem);\n border-width: 0 0.4rem 0.4rem;\n border-bottom-color: ", ";\n }\n "]);
_templateObject2 = function _templateObject2() {
return data;
};
return data;
}
function _templateObject() {
var data = _taggedTemplateLiteral(["\n bottom: 0;\n width: 100%;\n &::before {\n top: 0.4rem;\n left: calc(50% - 0.35rem);\n border-width: 0.4rem 0.4rem 0;\n border-top-color: ", ";\n }\n "]);
_templateObject = function _templateObject() {
return data;
};
return data;
}
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
var tooltipArrowTop = function tooltipArrowTop(props) {
return props.top && (0, _styledComponents.css)(_templateObject(), (0, _styledConfig.getColor)(props, 'tooltipArrow', 'borderColor'));
};
var tooltipArrowBottom = function tooltipArrowBottom(props) {
return props.bottom && (0, _styledComponents.css)(_templateObject2(), (0, _styledConfig.getColor)(props, 'tooltipArrow', 'borderColor'));
};
var tooltipArrowRight = function tooltipArrowRight(props) {
return props.right && (0, _styledComponents.css)(_templateObject3(), (0, _styledConfig.getColor)(props, 'tooltipArrow', 'borderColor'));
};
var tooltipArrowLeft = function tooltipArrowLeft(props) {
return props.left && (0, _styledComponents.css)(_templateObject4(), (0, _styledConfig.getColor)(props, 'tooltipArrow', 'borderColor'));
};
var TooltipArrow = (0, _styledComponents.default)(_styledBaseComponents.Div)(_templateObject5(), tooltipArrowTop, tooltipArrowRight, tooltipArrowBottom, tooltipArrowLeft);
exports.TooltipArrow = TooltipArrow;
TooltipArrow.defaultProps = {
theme: _styledConfig.theme
};