@ticketmaster/prism/lib/components/Dropdown/Dropdown.styled.js

Live Nation Component library

"use strict";
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
    return cooked;
};
Object.defineProperty(exports, "__esModule", { value: true });
var styled_components_1 = require("styled-components");
var variables_1 = require("../../styles/variables");
var utils_1 = require("../../styles/utils");
var snippets_1 = require("../../styles/snippets");
var arrowBoxShadow = '3px -3px 7px -3px rgba(0,0,0,0.25)';
var arrowSize = 7;
function positioned(positioned, px) {
    return styled_components_1.css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    ", "\n  "], ["\n    ", "\n  "])), positioned + ':' + utils_1.addPx(px));
}
exports.DropdownWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: relative;\n  display: inline-flex;\n"], ["\n  position: relative;\n  display: inline-flex;\n"])));
var listOpen = styled_components_1.css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n"], ["\n  display: flex;\n"])));
exports.DropdownButton = styled_components_1.default.button(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  ", "\n  font-size: inherit;\n  color: inherit;\n"], ["\n  ", "\n  font-size: inherit;\n  color: inherit;\n"])), snippets_1.flexCenter);
exports.DropdownListWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  position: absolute;\n  top: calc(100% + ", ");\n  display: flex;\n\n  ", ": 0;\n"], ["\n  position: absolute;\n  top: calc(100% + ", ");\n  display: flex;\n\n  ", ": 0;\n"])), utils_1.addPx(variables_1.space.small), function (p) { return p.positioned; });
exports.DropdownList = styled_components_1.default.ul(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  position: relative;\n\n  display: none;\n  flex-direction: column;\n  padding: ", " ", ";\n  box-shadow: ", ";\n  background-color: ", ";\n  color: inherit;\n  transform: translateY(", ");\n\n  ", "\n\n  &:before {\n    content: '';\n    position: absolute;\n    top: 0;\n    ", ";\n    display: none;\n    border: solid ", ";\n    height: 0;\n    width: 0;\n    border-bottom-color: ", ";\n    box-shadow: ", ";\n    border-width: ", ";\n    transform-origin: 0 0;\n    transform: rotate(-45deg);\n\n    ", "\n  }\n"], ["\n  position: relative;\n\n  display: none;\n  flex-direction: column;\n  padding: ", " ", ";\n  box-shadow: ", ";\n  background-color: ", ";\n  color: inherit;\n  transform: translateY(", ");\n\n  ", "\n\n  &:before {\n    content: '';\n    position: absolute;\n    top: 0;\n    ", ";\n    display: none;\n    border: solid ", ";\n    height: 0;\n    width: 0;\n    border-bottom-color: ", ";\n    box-shadow: ", ";\n    border-width: ", ";\n    transform-origin: 0 0;\n    transform: rotate(-45deg);\n\n    ", "\n  }\n"])), utils_1.addPx(variables_1.space.medium), utils_1.addPx(variables_1.space.large), function (p) { return p.theme.base.boxShadow; }, function (p) { return p.theme.base.backgroundColor; }, utils_1.addPx(variables_1.space.small), function (p) { return (p.open ? listOpen : null); }, function (p) { return positioned(p.positioned, p.arrowPos - arrowSize); }, function (p) { return p.theme.base.backgroundColor; }, function (p) { return p.theme.base.backgroundColor; }, arrowBoxShadow, utils_1.addPx(arrowSize), function (p) { return (p.open ? listOpen : null); });
exports.DropdownItem = styled_components_1.default.li(templateObject_7 || (templateObject_7 = __makeTemplateObject([""], [""])));
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
//# sourceMappingURL=Dropdown.styled.js.map