adam-ui-beta/dist/common/Commons.js

adam ui(beta release)

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.BasicDropInputStyled = void 0;

var _styledComponents = _interopRequireDefault(require("styled-components"));

var _templateObject;

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }

var BasicDropInputStyled = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  @keyframes listDrop {\n    0% {\n      opacity:0 ;\n      max-height:0px;\n    };\n    100% {\n      opacity:1 ;\n      max-height:200px;\n    };\n  }\n  position: relative;\n  width: ", ";\n  cursor: pointer;\n  .input {\n    width: 100%;\n    outline: 0;\n    box-sizing: border-box;\n    padding: 8px 16px;\n    border-radius:8px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    font-size: ", ";\n    border:2px solid ", ";\n    background-color:", ";\n    color: ", ";\n    transition:.2s ;\n  }\n  .input::placeholder {\n    color: ", ";\n  }\n  &:hover .input {\n    border:2px solid ", ";\n  }\n  .search-input {\n    opacity: ", ";\n    position: absolute;\n    left:50% ;\n    top:50% ;\n    width: calc(100% - 4px);\n    height:calc(100% - 4px);\n    border:0 ;\n    margin:0 ;\n    outline: 0;\n    box-sizing: border-box;\n    padding: 8px 16px;\n    border-radius:8px;\n    transform:translate(-50%,-50%) ;\n    font-size: ", ";\n    color: ", ";\n    background-color:", ";\n    cursor: pointer;\n  }\n  .svg-IoMdArrowDropdown {\n    position: absolute;\n    top:50% ;\n    right:10px ;\n    height:", ";\n    width:", ";\n    fill: ", ";\n    transform:", ";\n    transition:.3s;\n    z-index: 3;\n  }\n  .data-list {\n    opacity:0 ;\n    position: absolute;\n    top: 100%;\n    left: 0;\n    width:100%;\n    background-color:", ";\n    box-sizing: border-box;\n    border-radius:0 0 8px 8px;\n    box-shadow:0 3px 8px 0 ", ";\n    border:2px solid ", ";\n    overflow:auto ;\n    max-height:0;\n    z-index: 99;\n    animation: ", ";\n    &::-webkit-scrollbar {\n      width: 10px;\n    }\n    &::-webkit-scrollbar-track {\n      background: ", ";\n    }\n    &::-webkit-scrollbar-thumb {\n      background: ", ";\n      border-radius: 10px;\n      border: 2px solid ", ";\n    }\n  }\n  .data {\n    padding:8px 16px;\n    box-sizing:border-box ;\n    color:", ";\n    font-size:", ";\n    transition:.2s ;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    &:hover {\n      background-color: ", ";\n      color:", ";\n    }\n  }\n"])), function (_ref) {
  var props = _ref.props;
  return props.width;
}, function (_ref2) {
  var props = _ref2.props;
  return props.fontSize;
}, function (_ref3) {
  var props = _ref3.props;
  return props.themeColor.sub;
}, function (_ref4) {
  var props = _ref4.props;
  return props.themeColor.bottom;
}, function (_ref5) {
  var props = _ref5.props;
  return props.themeColor.color;
}, function (_ref6) {
  var props = _ref6.props;
  return props.themeColor.placeholder;
}, function (_ref7) {
  var props = _ref7.props;
  return props.themeColor.main;
}, function (_ref8) {
  var props = _ref8.props;
  return props.dropStatus ? 1 : 0;
}, function (_ref9) {
  var props = _ref9.props;
  return props.fontSize;
}, function (_ref10) {
  var props = _ref10.props;
  return props.themeColor.color;
}, function (_ref11) {
  var props = _ref11.props;
  return props.themeColor.bottom;
}, function (_ref12) {
  var props = _ref12.props;
  return props.fontSize;
}, function (_ref13) {
  var props = _ref13.props;
  return props.fontSize;
}, function (_ref14) {
  var props = _ref14.props;
  return props.themeColor.color;
}, function (_ref15) {
  var props = _ref15.props;
  return props.dropStatus ? "translateY(-50%)rotate(180deg)" : "translateY(-50%)rotate(0deg)";
}, function (_ref16) {
  var props = _ref16.props;
  return props.themeColor.bottom;
}, function (_ref17) {
  var props = _ref17.props;
  return props.themeColor.dark;
}, function (_ref18) {
  var props = _ref18.props;
  return props.themeColor.sub;
}, function (_ref19) {
  var props = _ref19.props;
  return props.dropStatus ? "listDrop ".concat(props.dataLength > 6 ? '.2' : '0', "s forwards") : 'unset';
}, function (_ref20) {
  var props = _ref20.props;
  return props.themeColor.sub;
}, function (_ref21) {
  var props = _ref21.props;
  return props.themeColor.main;
}, function (_ref22) {
  var props = _ref22.props;
  return props.themeColor.sub;
}, function (_ref23) {
  var props = _ref23.props;
  return props.themeColor.color;
}, function (_ref24) {
  var props = _ref24.props;
  return props.fontSize;
}, function (_ref25) {
  var props = _ref25.props;
  return props.themeColor.main;
}, function (_ref26) {
  var props = _ref26.props;
  return props.themeColor.bottom;
});

exports.BasicDropInputStyled = BasicDropInputStyled;