UNPKG

@beisen-phoenix/select

Version:

## 概述

189 lines (177 loc) 7.32 kB
import styled, { css } from 'styled-components'; import { $Fs1, $Fs2, $M1, $M5, $M6, $M7, $M9, $Ra2, $Sp2, $Sp3, $Sp8, $S4, $S5, $alpha, $M2, $red, $family, $scrollBar } from '@beisen-phoenix/style-token'; export function getHeightStyle(size) { if (size === 'large') { return '32px'; } if (size === 'small') { return '26px;'; } if (size === 'normal') { return '30px'; } return 'auto'; } export function getPaddingStyle(size) { if (size === 'large') { return css(["padding-top:5px;padding-bottom:1px;"]); } if (size === 'small') { return css(["padding-top:2px;padding-bottom:0px;"]); } if (size === 'normal') { return css(["padding-top:4px;padding-bottom:0px;"]); } return css(["padding-top:4px;padding-bottom:0px;"]); } export var PlaceHolder = /*#__PURE__*/ styled.div(["position:absolute;top:50%;left:8px;max-width:calc(100% - 32px);height:20px;margin-top:-10px;overflow:hidden;color:", ";", " line-height:20px;white-space:nowrap;text-align:left;display:", ";", ";text-overflow:", ";"], $M5, $Fs1, function (props) { return props.isShowPlaceHolder ? 'block' : 'none'; }, function (props) { return props.size === 'large' ? "".concat($Fs2) : "".concat($Fs1); }, function (props) { return props.isFocus ? '' : 'ellipsis'; }); export var Chosen = /*#__PURE__*/ styled.li(["box-sizing:border-box;height:20px;line-height:20px;position:relative;float:left;max-width:99%;margin:0 ", " ", " 0;padding:0 ", " 0 ", ";overflow:hidden;", " background-color:", ";border-radius:", ";cursor:default;", ";", ";", ";"], $Sp2, $Sp2, $Sp3, $Sp3, $Fs1, $M7, $Ra2, function (props) { if (props.itemDisabled) { return css(["padding-right:", ";cursor:not-allowed;"], $Sp3); } }, function (props) { if (props.selectDisabled) { return css(["color:", ";cursor:not-allowed;"], $M2); } }, function (props) { if (props.size === 'small') { return css(["margin-bottom:3px;"]); } }); export var IconWrapper = /*#__PURE__*/ styled.span(["margin-left:", ";padding-top:2px;float:right;cursor:pointer;", ";"], $Sp2, function (props) { if (props.selectDisabled) { return css(["cursor:not-allowed;"]); } }); export var InputWrapper = /*#__PURE__*/ styled.li(["position:relative;float:left;overflow:hidden;max-width:100%;width:auto;", ";", ";"], $Fs1, function (props) { if (!props.multiValueLength) { return css(["height:26px;width:99%;"]); } }); export var StyledInput = /*#__PURE__*/ styled.input(["display:inline-block;font-family:", ";padding:0;margin:0;max-width:100%;background:transparent;border-width:0;outline:0;border:none;min-width:10px;&::-ms-clear{display:none;}color:", ";height:26px;", ";line-height:26px;", ";", ";", ";"], $family, $M1, function (props) { return props.size === 'large' ? "".concat($Fs2) : "".concat($Fs1); }, function (props) { if (!props.isSearch) { return css(["cursor:pointer;color:transparent;text-shadow:0 0 0 ", ";"], $M1); } }, function (props) { if (props.disabled) { return css(["&[disabled]{cursor:not-allowed;}"]); } }, function (props) { var propsValue = props.propsValue; if (props.isMultiSelect && Array.isArray(propsValue) && propsValue.length) { return css(["width:10px;height:20px;"]); } return css(["width:100%;"]); }); export var SelectIconWrapper = /*#__PURE__*/ styled.div(["", ";font-size:12px;height:12px;margin-left:", ";position:absolute;right:", ";top:50%;transform:translateY(-50%);"], function (props) { if (props.disabled) { return css(["cursor:not-allowed;"]); } }, $Sp2, $Sp3); export var StyledUl = /*#__PURE__*/ styled.ul(["margin:0;width:100%;box-sizing:border-box;position:relative;max-height:120px;overflow-y:auto;overflow-x:hidden;padding:0 ", " 0 8px;", ";"], $Sp8, $scrollBar); export var Wrapper = /*#__PURE__*/ styled.div(["font-family:", ";position:relative;box-sizing:border-box;display:flex;align-items:center;background-color:", ";background:", ";min-height:26px;min-width:100px;margin-bottom:", ";overflow:hidden;box-sizing:border-box;&::before{position:absolute;top:0;left:0;display:block;width:100%;height:100%;border-radius:", ";border:1px solid ", ";box-sizing:border-box;content:'';", ";", ";", ";}", ";", ";", ";&:hover{&::before{cursor:pointer;", ";", ";}.SwitchArrow{cursor:pointer;", ";}.DeleteInputTxt{", ";}}&:active::before,&:focus::before{", ";}"], $family, $M9, $M9, $Sp2, $Ra2, $M6, function (props) { if (!props.isMultiSelect) { return css(["z-index:1;"]); } }, function (props) { if (props.error) { return css(["border-color:", ";"], $red); } }, function (props) { if ((props.isFocus || props.isActive) && !props.error) { return css(["border-color:", ";"], $S4); } }, function (props) { var multiValueLength = props.multiValueLength, size = props.size; if (multiValueLength) { return getPaddingStyle(size); } }, function (props) { if (props.multiValueLength && !props.isSingleLine) { return css(["min-height:", ";height:auto;"], getHeightStyle(props.size)); } return css(["height:", ";"], getHeightStyle(props.size)); }, function (props) { if (props.disabled) { return css(["color:", ";background-color:", ";cursor:not-allowed;"], $M5, $alpha($M6, '0.3')); } }, function (props) { if (!props.disabled && !props.error) { return css(["border-color:", ";"], $S5); } }, function (props) { if (props.disabled) { return css(["cursor:not-allowed;"]); } }, function (props) { if (props.disabled) { return css(["cursor:not-allowed;"]); } if (props.isShowDeleteIcon) { return css(["display:none;"]); } }, function (props) { if (props.isShowDeleteIcon) { return css(["display:block;"]); } }, function (props) { if (!props.disabled && !props.error) { return css(["border-color:", ";"], $S4); } }); export var StyledSpan = /*#__PURE__*/ styled.span(["display:flex;align-items:center;font-family:", ";box-sizing:border-box;color:", ";width:100%;background-color:#fff;pointer-events:none;padding-right:", ";padding-left:", ";left:0;position:absolute;height:100%;opacity:", ";", ";cursor:", ";", ";"], $family, $M1, $Sp8, $Sp3, function (props) { return props.visibleTxt ? 1 : 0; }, function (props) { return props.size === 'large' ? "".concat($Fs2) : "".concat($Fs1); }, function (props) { return props.isSearch ? 'text' : 'pointer'; }, function (props) { if (props.disabled) { return css(["color:", ";background-color:transparent;"], $M2); } if (props.isFocus && props.isSearch) { return "color:".concat($M5); } }); export var StyledWrapper = /*#__PURE__*/ styled.div(["position:relative;zoom:1;cursor:text;"]); export var StyledHiddenSpan = /*#__PURE__*/ styled.span(["display:inline-block;opacity:0;z-index:-1;position:absolute;font-size:12px;"]); export var StyledDeleteIcon = /*#__PURE__*/ styled.div(["z-index:1;display:none;font-size:12px;height:12px;margin-left:", ";position:absolute;right:", ";top:47%;transform:translateY(-50%);&:hover{cursor:pointer;}"], $Sp2, $Sp3); export var StyledTagSpan = /*#__PURE__*/ styled.span(["max-width:120px;display:inline-block;text-overflow:ellipsis;word-break:keep-all;white-space:nowrap;overflow:hidden;color:", ";"], $M2); export var TipsSapn = /*#__PURE__*/ styled.span(["text-overflow:ellipsis;word-break:keep-all;white-space:nowrap;overflow:hidden;"]);