@vimeo/iris/components/inputs/Select/Select.style.js

Vimeo Design System

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var tslib_es6 = require('../../../tslib.es6-3ec409b7.js');
var styled = require('styled-components');
var components_inputs_Shared = require('../Shared.js');
var icons_ui_ChevronDown = require('../../../icons/ui/ChevronDown.js');
require('polished');
require('../../../color/colors.js');
require('react');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);

var SelectStyled = styled__default["default"].select(templateObject_1 || (templateObject_1 = tslib_es6.__makeTemplateObject(["\n  appearance: none;\n  ", ";\n  ", ";\n  padding-right: 2rem;\n  cursor: pointer;\n  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;\n  transition: all 120ms ease-in-out, opacity 0ms;\n"], ["\n  appearance: none;\n  ", ";\n  ", ";\n  padding-right: 2rem;\n  cursor: pointer;\n  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;\n  transition: all 120ms ease-in-out, opacity 0ms;\n"])), components_inputs_Shared.inputColors, components_inputs_Shared.inputShape);
var Placeholder = styled__default["default"].div(templateObject_2 || (templateObject_2 = tslib_es6.__makeTemplateObject(["\n  appearance: none;\n  ", ";\n  ", ";\n  padding-right: 2rem;\n  cursor: pointer;\n  text-rendering: auto;\n  letter-spacing: normal;\n  word-spacing: normal;\n  text-transform: none;\n  text-indent: 0px;\n  text-shadow: none;\n  background: transparent;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow: hidden;\n"], ["\n  appearance: none;\n  ", ";\n  ", ";\n  padding-right: 2rem;\n  cursor: pointer;\n  text-rendering: auto;\n  letter-spacing: normal;\n  word-spacing: normal;\n  text-transform: none;\n  text-indent: 0px;\n  text-shadow: none;\n  background: transparent;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow: hidden;\n"])), components_inputs_Shared.inputColors, components_inputs_Shared.inputShape);
var ChevronDown = styled__default["default"](icons_ui_ChevronDown.ChevronDown)(templateObject_3 || (templateObject_3 = tslib_es6.__makeTemplateObject(["\n  position: absolute;\n  top: ", "rem;\n  right: 0.3rem;\n  width: 1.5rem;\n  height: 1.5rem;\n  pointer-events: none;\n\n  * {\n    fill: ", ";\n  }\n"], ["\n  position: absolute;\n  top: ", "rem;\n  right: 0.3rem;\n  width: 1.5rem;\n  height: 1.5rem;\n  pointer-events: none;\n\n  * {\n    fill: ", ";\n  }\n"])), function (p) { return bottom[p.size]; }, function (_a) {
    var theme = _a.theme;
    return theme.content.color;
});
var bottom = {
    xs: 0.1,
    sm: 0.2,
    md: 0.3,
    lg: 0.8,
    xl: 1.1,
};
var templateObject_1, templateObject_2, templateObject_3;

exports.ChevronDown = ChevronDown;
exports.Placeholder = Placeholder;
exports.SelectStyled = SelectStyled;