ui-neu/dist/components/forms/Select.js

Neu UI, a responsive React component library.

import _taggedTemplateLiteral from "/home/runner/work/neu_ui/neu_ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteral";

function _templateObject() {
  var data = _taggedTemplateLiteral(["\n  display: block;\n  font-size: 16px;\n  font-family: roboto, helvetica, sans-serif;\n  color: rgb(139, 139, 139);\n  line-height: 1.3;\n  padding: 0.3em 1.4em 0.3em 0.8em;\n  width: 100%;\n  max-width: 100%;\n  box-sizing: border-box;\n  margin: 0;\n  border: none;\n\n  box-shadow: 6px 6px 10px 0 rgba(0, 0, 0, 0.2),\n    -8px -8px 16px 0 rgba(255, 255, 255, 0.5);\n\n  border-radius: 0.5em;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n  background-color: #fff;\n\n  background-image: url(\"data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E\"),\n    linear-gradient(\n      to bottom,\n      rgba(204, 218, 226, 0.349) 0%,\n      rgba(204, 218, 226, 0.349) 100%\n    );\n  background-repeat: no-repeat, repeat;\n  background-position: right 0.7em top 50%, 0 0;\n  background-size: 0.65em auto, 100%;\n\n  ::-ms-expand {\n    display: none;\n  }\n\n  :focus {\n    box-shadow: 0 0 1px 3px rgba(59, 153, 252, 0.7),\n      6px 6px 10px 0 rgba(0, 0, 0, 0.2),\n      -8px -8px 16px 0 rgba(255, 255, 255, 0.5);\n    color: rgb(139, 139, 139);\n    outline: none;\n  }\n  option {\n    font-weight: 300;\n  }\n"]);

  _templateObject = function _templateObject() {
    return data;
  };

  return data;
}

import React from "react";
import styled from "styled-components";
var StyledSelect = styled.select(_templateObject());
export var Select = function Select(_ref) {
  var options = _ref.options,
      children = _ref.children;
  return /*#__PURE__*/React.createElement(StyledSelect, {
    className: "mb-2"
  }, /*#__PURE__*/React.createElement("option", {
    value: ""
  }, children), options.map(function (value, index) {
    return /*#__PURE__*/React.createElement("option", {
      value: value,
      key: index
    }, value);
  }));
};
Select.defaultProps = {
  children: null,
  value: null
};