@foxford/ui 2.0.0-beta-84e5ef6-20220701 → 2.0.0-beta-569cdb6-20220701

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/components/Select/style.js +1 -1
  2. package/components/Select/style.js.map +1 -1
  3. package/index.cjs.js +1 -1
  4. package/index.cjs.js.map +1 -1
  5. package/mixins/color.js +1 -1
  6. package/mixins/color.js.map +1 -1
  7. package/package.json +1 -1
package/components/Select/style.js CHANGED
@@ -1,2 +1,2 @@
1
- import e,{keyframes as l,css as o}from'styled-components';import t from'tinycolor2';import{errorStyle as i}from'../Input/style.js';var r=l(["from{opacity:0;}to{opacity:1;}"]);var c=l(["to{transform:rotate(1turn);}"]);var a=o([".Select{max-width:100%;width:100%;}"]);var n=o([".Select-control{","}"],i);var s=e.span.withConfig({shouldForwardProp:e=>!['error','fluid'].includes(e)}).withConfig({componentId:"fox-ui__sc-ps043s-0"})([".Select{position:relative;max-width:390px;}.Select,.Select div,.Select input,.Select span{box-sizing:border-box;}.Select.is-disabled > .Select-control{cursor:not-allowed;background-color:#f5f5f5;}.Select.is-disabled .Select-value-label{color:rgba(0,0,0,0.16) !important;}.Select.is-disabled > .Select-control:hover{box-shadow:none;}.Select.is-disabled .Select-arrow-zone{cursor:default;pointer-events:none;opacity:0.35;}.Select.is-clearable{.Select-placeholder,&.Select--single > .Select-control .Select-value{padding-right:70px;}}.Select-control{background-color:",";border:solid 1px ",";border-radius:4px;color:",";cursor:default;display:table;border-spacing:0;border-collapse:separate;height:50px;outline:none;overflow:hidden;position:relative;width:100%;}.Select-control .Select-input:focus{outline:none;}.is-searchable.is-open > .Select-control{cursor:text;}.is-open > .Select-control{border-bottom-right-radius:0;border-bottom-left-radius:0;border:1px solid ",";outline:none;}.is-open > .Select-control .Select-arrow{transform:rotate(180deg);}.is-searchable.is-focused:not(.is-open) > .Select-control{cursor:text;}.is-focused:not(.is-open) > .Select-control{border:1px solid ",";}.Select-placeholder,.Select--single > .Select-control .Select-value{bottom:0;color:",";left:0;font-size:16px;line-height:50px;padding-left:20px;padding-right:35px;position:absolute;right:0;top:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.has-value.Select--single > .Select-control .Select-value .Select-value-label,.has-value.is-pseudo-focused.Select--single > .Select-control .Select-value .Select-value-label{color:",";}.has-value.Select--single > .Select-control .Select-value a.Select-value-label,.has-value.is-pseudo-focused.Select--single > .Select-control .Select-value a.Select-value-label{cursor:pointer;text-decoration:none;}.has-value.Select--single > .Select-control .Select-value a.Select-value-label:hover,.has-value.is-pseudo-focused.Select--single > .Select-control .Select-value a.Select-value-label:hover,.has-value.Select--single > .Select-control .Select-value a.Select-value-label:focus,.has-value.is-pseudo-focused.Select--single > .Select-control .Select-value a.Select-value-label:focus{color:#007eff;outline:none;text-decoration:underline;}.Select-input{height:50px;padding-left:20px;padding-right:15px;vertical-align:middle;}.Select-input > input{width:100%;background:none transparent;border:0 none;box-shadow:none;cursor:default;display:inline-block;font-family:inherit;font-size:16px;margin:0;outline:none;line-height:30px;padding:10px 0;-webkit-appearance:none;}.is-focused .Select-input > input{cursor:text;}.is-focused .Select-arrow,.Select-arrow-zone:hover > .Select-arrow{background-image:url('./images/arrow_down_hover.svg');}.has-value.is-pseudo-focused .Select-input{opacity:0;}.Select-control:not(.is-searchable) > .Select-input{outline:none;}.Select-loading-zone{cursor:pointer;display:table-cell;position:relative;text-align:center;vertical-align:middle;width:16px;}.Select-loading{animation:"," 400ms infinite linear;width:16px;height:16px;box-sizing:border-box;border-radius:50%;border:2px solid ",";border-right-color:",";display:inline-block;position:relative;vertical-align:middle;}.Select-clear-zone{animation:"," 200ms;color:",";cursor:pointer;display:table-cell;position:relative;text-align:center;vertical-align:middle;width:35px;line-height:0;.Select-clear{position:relative;top:-1px;}}.Select-clear-zone:hover{color:#d0021b;}.Select-clear{display:inline-block;font-size:0px;line-height:1;color:transparent;overflow:hidden;width:12px;height:12px;background:url('./images/close.svg') no-repeat;background-size:cover;}.Select--multi .Select-clear-zone{width:17px;}.Select-arrow-zone{cursor:pointer;display:table-cell;position:relative;text-align:center;vertical-align:middle;width:35px;line-height:0;}.Select-arrow{background:url('./images/arrow_down.svg') no-repeat;display:inline-block;background-size:12px;height:7px;width:12px;position:relative;transition:0.3s;transform:rotate(0deg);}.is-open .Select-arrow,.Select-arrow-zone:hover > .Select-arrow{background-image:url('./images/arrow_down_hover.svg');}.Select--multi .Select-multi-value-wrapper{display:inline-block;padding-left:20px;}.Select--multi .Select-multi-value-wrapper{.Select-placeholder + .Select-input{margin-left:0;}}.Select--single{.Select-multi-value-wrapper{display:block;width:100%;}.Select-input .react-select-2--value{display:block;width:100%;}}.Select .Select-aria-only{display:inline-block;height:1px;width:1px;margin:-1px;clip:rect(0,0,0,0);overflow:hidden;float:left;}.Select-menu-outer{border-bottom-right-radius:4px;border-bottom-left-radius:4px;background-color:",";border:1px solid ",";box-shadow:0 3px 10px 0 rgba(0,0,0,0.2);box-sizing:border-box;margin-top:-1px;max-height:270px;position:absolute;top:100%;width:100%;z-index:1;-webkit-overflow-scrolling:touch;}.Select-menu{max-height:226px;overflow-x:auto;overflow-y:auto;font-size:16px;}.Select-option{box-sizing:border-box;background-color:",";line-height:30px;color:",";cursor:pointer;display:block;padding:10px 15px 10px 20px;transition:background 0.2s ease;}.Select-option:last-child{border-bottom-right-radius:4px;border-bottom-left-radius:4px;}.Select-option.is-selected{background-color:",";}.Select-option.is-focused{background-color:",";}.Select-option.is-disabled{color:rgba(0,0,0,0.16);cursor:not-allowed;}.Select-noresults{box-sizing:border-box;color:",";cursor:default;display:block;padding:10px 20px;}.Select--multi .Select-input{vertical-align:middle;margin-left:10px;padding:0;}.Select--multi.has-value .Select-input{margin-left:5px;}.Select--multi .Select-value{background-color:",";background-color:",";border-radius:4px;border:1px solid ",";border:1px solid rgba(0,126,255,0.24);color:",";display:inline-block;font-size:0.9em;line-height:1.4;margin-left:4px;margin-top:4px;vertical-align:top;}.Select--multi .Select-value-icon,.Select--multi .Select-value-label{display:inline-block;vertical-align:middle;}.Select--multi .Select-value-icon{font-size:1.5em;line-height:100%;vertical-align:middle;box-sizing:border-box;padding:5px 4px 2px;color:",";}.Select--multi .Select-value-label{border-bottom-right-radius:4px;border-top-right-radius:4px;cursor:default;padding:2px 4px;line-height:1;max-width:90%;overflow:hidden;text-overflow:ellipsis;}.Select--multi a.Select-value-label{color:",";cursor:pointer;text-decoration:none;}.Select--multi a.Select-value-label:hover{text-decoration:underline;}.Select--multi .Select-value-icon{cursor:pointer;border-bottom-left-radius:4px;border-top-left-radius:4px;border-right:1px solid ",";border-right:1px solid rgba(0,126,255,0.24);font-size:1.5em;line-height:100%;box-sizing:border-box;padding:5px 4px 2px;color:",";}.Select--multi .Select-value-icon:hover,.Select--multi .Select-value-icon:focus{background-color:#d8eafd;background-color:rgba(0,113,230,0.08);color:",";}.Select--multi .Select-value-icon:active{background-color:#c2e0ff;background-color:rgba(0,126,255,0.24);}.Select--multi.is-disabled .Select-value{background-color:#fcfcfc;border:1px solid #e3e3e3;color:",";}.Select--multi.is-disabled .Select-value-icon{cursor:not-allowed;border-right:1px solid #e3e3e3;}.Select--multi.is-disabled .Select-value-icon:hover,.Select--multi.is-disabled .Select-value-icon:focus,.Select--multi.is-disabled .Select-value-icon:active{background-color:#fcfcfc;}"," ",""],(e=>e.theme.colors.white),(e=>e.theme.colors.alto),(e=>e.theme.colors.mineShaft),(e=>e.theme.colors.accent),(e=>e.theme.colors.accent),(e=>e.theme.colors.silver),(e=>e.theme.colors.mineShaft),c,(e=>e.theme.colors.alto),(e=>e.theme.colors.mineShaft),r,(e=>e.theme.colors.alto),(e=>e.theme.colors.white),(e=>e.theme.colors.onahau),(e=>e.theme.colors.white),(e=>e.theme.colors.mineShaft),(e=>e.theme.colors.onahau),(e=>e.theme.colors.onahau),(e=>e.theme.colors.silver),(e=>e.theme.colors.nebula),(e=>t(e.theme.colors.nebula).setAlpha(.1).toString()),(e=>e.theme.colors.onahau),(e=>e.theme.colors.mineShaft),(e=>e.theme.colors.accent),(e=>e.theme.colors.accent),(e=>e.theme.colors.onahau),(e=>e.theme.colors.accent),(e=>e.theme.colors.accent),(e=>e.theme.colors.mineShaft),(e=>e.fluid?a:null),(e=>e.error?n:null));export{s as Root};
1
+ import e,{keyframes as l,css as o}from'styled-components';import t from'tinycolor2';import{errorStyle as i}from'../Input/style.js';var r=l(["from{opacity:0;}to{opacity:1;}"]);var a=l(["to{transform:rotate(1turn);}"]);var c=o([".Select{max-width:100%;width:100%;}"]);var n=o([".Select-control{","}"],i);var s=e.span.withConfig({shouldForwardProp:e=>!['error','fluid'].includes(e)}).withConfig({componentId:"fox-ui__sc-ps043s-0"})([".Select{position:relative;max-width:390px;}.Select,.Select div,.Select input,.Select span{box-sizing:border-box;}.Select.is-disabled > .Select-control{cursor:not-allowed;background-color:#f5f5f5;}.Select.is-disabled .Select-value-label{color:rgba(0,0,0,0.16) !important;}.Select.is-disabled > .Select-control:hover{box-shadow:none;}.Select.is-disabled .Select-arrow-zone{cursor:default;pointer-events:none;opacity:0.35;}.Select.is-clearable{.Select-placeholder,&.Select--single > .Select-control .Select-value{padding-right:70px;}}.Select-control{background-color:",";border:solid 1px ",";border-radius:4px;color:",";cursor:default;display:table;border-spacing:0;border-collapse:separate;height:50px;outline:none;overflow:hidden;position:relative;width:100%;}.Select-control .Select-input:focus{outline:none;}.is-searchable.is-open > .Select-control{cursor:text;}.is-open > .Select-control{border-bottom-right-radius:0;border-bottom-left-radius:0;border:1px solid ",";outline:none;}.is-open > .Select-control .Select-arrow{transform:rotate(180deg);}.is-searchable.is-focused:not(.is-open) > .Select-control{cursor:text;}.is-focused:not(.is-open) > .Select-control{border:1px solid ",";}.Select-placeholder,.Select--single > .Select-control .Select-value{bottom:0;color:",";left:0;font-size:16px;line-height:50px;padding-left:20px;padding-right:35px;position:absolute;right:0;top:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.has-value.Select--single > .Select-control .Select-value .Select-value-label,.has-value.is-pseudo-focused.Select--single > .Select-control .Select-value .Select-value-label{color:",";}.has-value.Select--single > .Select-control .Select-value a.Select-value-label,.has-value.is-pseudo-focused.Select--single > .Select-control .Select-value a.Select-value-label{cursor:pointer;text-decoration:none;}.has-value.Select--single > .Select-control .Select-value a.Select-value-label:hover,.has-value.is-pseudo-focused.Select--single > .Select-control .Select-value a.Select-value-label:hover,.has-value.Select--single > .Select-control .Select-value a.Select-value-label:focus,.has-value.is-pseudo-focused.Select--single > .Select-control .Select-value a.Select-value-label:focus{color:#007eff;outline:none;text-decoration:underline;}.Select-input{height:50px;padding-left:20px;padding-right:15px;vertical-align:middle;}.Select-input > input{width:100%;background:none transparent;border:0 none;box-shadow:none;cursor:default;display:inline-block;font-family:inherit;font-size:16px;margin:0;outline:none;line-height:30px;padding:10px 0;-webkit-appearance:none;}.is-focused .Select-input > input{cursor:text;}.is-focused .Select-arrow,.Select-arrow-zone:hover > .Select-arrow{background-image:url(\"data:image/svg+xml,%3Csvg width='18' height='11' viewBox='0 0 18 11' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpolygon id='path-1' points='0 0.328542857 0 12 19.9069167 12 19.9069167 0.328542857 7.22801448e-20 0.328542857'/%3E%3C/defs%3E%3Cg id='Tutorial' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' opacity='.732'%3E%3Cg id='рега' transform='translate(-676.000000, -708.000000)'%3E%3Cg id='arrow-down-sign-to-navigate' transform='translate(674.000000, 708.000000)'%3E%3Cmask id='mask-2' fill='%23fff'%3E%3Cuse xlink:href='%23path-1'/%3E%3C/mask%3E%3Cpath d='M10.9531585,10.8272649 C10.6323293,10.8272649 10.3115001,10.700818 10.0677299,10.4500829 L2.36812901,2.53049343 C1.87729033,2.02563079 1.87729033,1.20866001 2.36812901,0.7053394 C2.8574685,0.20294401 3.65174564,0.20294401 4.14138496,0.7053394 L10.9531585,7.71296866 L17.7664312,0.706573029 C18.2560705,0.20294401 19.0500478,0.20294401 19.5396872,0.706573029 C20.0293265,1.20989364 20.0293265,2.02686441 19.5396872,2.53049343 L11.8397865,10.4500829 C11.5963161,10.7020516 11.2742875,10.8272649 10.9531585,10.8272649 L10.9531585,10.8272649 Z' id='Fill-1' fill='%2348a1e6' mask='url(%23mask-2)'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A\");}.has-value.is-pseudo-focused .Select-input{opacity:0;}.Select-control:not(.is-searchable) > .Select-input{outline:none;}.Select-loading-zone{cursor:pointer;display:table-cell;position:relative;text-align:center;vertical-align:middle;width:16px;}.Select-loading{animation:"," 400ms infinite linear;width:16px;height:16px;box-sizing:border-box;border-radius:50%;border:2px solid ",";border-right-color:",";display:inline-block;position:relative;vertical-align:middle;}.Select-clear-zone{animation:"," 200ms;color:",";cursor:pointer;display:table-cell;position:relative;text-align:center;vertical-align:middle;width:35px;line-height:0;.Select-clear{position:relative;top:-1px;}}.Select-clear-zone:hover{color:#d0021b;}.Select-clear{display:inline-block;font-size:0px;line-height:1;color:transparent;overflow:hidden;width:12px;height:12px;background-image:url(\"data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.6 9.5L19.2 2c.4-.6.4-1.3 0-1.7-.4-.4-1.2-.4-1.6 0L10 8 2.4.2C2 0 1.2 0 .8.3.4.7.4 1.3.8 2l7.6 7.5-8 8c-.5.5-.5 1.2 0 1.7.2.2.4.3.7.3.4 0 .7 0 1-.3l8-8 8 8c.3.2.6.3 1 .3.2 0 .4 0 .7-.3.4-.5.4-1.2 0-1.6l-8-8z' fill='%23D9D9D9' fillRule='evenodd' /%3E%3C/svg%3E%0A\") no-repeat;background-size:cover;}.Select--multi .Select-clear-zone{width:17px;}.Select-arrow-zone{cursor:pointer;display:table-cell;position:relative;text-align:center;vertical-align:middle;width:35px;line-height:0;}.Select-arrow{background-image:url(\"data:image/svg+xml,%3Csvg width='18' height='11' viewBox='0 0 18 11' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpolygon id='path-1' points='0 0.328542857 0 12 19.9069167 12 19.9069167 0.328542857 7.22801448e-20 0.328542857'/%3E%3C/defs%3E%3Cg id='Tutorial' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' opacity='.732'%3E%3Cg id='рега' transform='translate(-676.000000, -708.000000)'%3E%3Cg id='arrow-down-sign-to-navigate' transform='translate(674.000000, 708.000000)'%3E%3Cmask id='mask-2' fill='%23fff'%3E%3Cuse xlink:href='%23path-1'/%3E%3C/mask%3E%3Cpath d='M10.9531585,10.8272649 C10.6323293,10.8272649 10.3115001,10.700818 10.0677299,10.4500829 L2.36812901,2.53049343 C1.87729033,2.02563079 1.87729033,1.20866001 2.36812901,0.7053394 C2.8574685,0.20294401 3.65174564,0.20294401 4.14138496,0.7053394 L10.9531585,7.71296866 L17.7664312,0.706573029 C18.2560705,0.20294401 19.0500478,0.20294401 19.5396872,0.706573029 C20.0293265,1.20989364 20.0293265,2.02686441 19.5396872,2.53049343 L11.8397865,10.4500829 C11.5963161,10.7020516 11.2742875,10.8272649 10.9531585,10.8272649 L10.9531585,10.8272649 Z' id='Fill-1' fill='%23b8b8b8' mask='url(%23mask-2)'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A\") no-repeat;display:inline-block;background-size:12px;height:7px;width:12px;position:relative;transition:0.3s;transform:rotate(0deg);}.is-open .Select-arrow,.Select-arrow-zone:hover > .Select-arrow{background-image:url(\"data:image/svg+xml,%3Csvg width='18' height='11' viewBox='0 0 18 11' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpolygon id='path-1' points='0 0.328542857 0 12 19.9069167 12 19.9069167 0.328542857 7.22801448e-20 0.328542857'/%3E%3C/defs%3E%3Cg id='Tutorial' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' opacity='.732'%3E%3Cg id='рега' transform='translate(-676.000000, -708.000000)'%3E%3Cg id='arrow-down-sign-to-navigate' transform='translate(674.000000, 708.000000)'%3E%3Cmask id='mask-2' fill='%23fff'%3E%3Cuse xlink:href='%23path-1'/%3E%3C/mask%3E%3Cpath d='M10.9531585,10.8272649 C10.6323293,10.8272649 10.3115001,10.700818 10.0677299,10.4500829 L2.36812901,2.53049343 C1.87729033,2.02563079 1.87729033,1.20866001 2.36812901,0.7053394 C2.8574685,0.20294401 3.65174564,0.20294401 4.14138496,0.7053394 L10.9531585,7.71296866 L17.7664312,0.706573029 C18.2560705,0.20294401 19.0500478,0.20294401 19.5396872,0.706573029 C20.0293265,1.20989364 20.0293265,2.02686441 19.5396872,2.53049343 L11.8397865,10.4500829 C11.5963161,10.7020516 11.2742875,10.8272649 10.9531585,10.8272649 L10.9531585,10.8272649 Z' id='Fill-1' fill='%2348a1e6' mask='url(%23mask-2)'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A\");}.Select--multi .Select-multi-value-wrapper{display:inline-block;padding-left:20px;}.Select--multi .Select-multi-value-wrapper{.Select-placeholder + .Select-input{margin-left:0;}}.Select--single{.Select-multi-value-wrapper{display:block;width:100%;}.Select-input .react-select-2--value{display:block;width:100%;}}.Select .Select-aria-only{display:inline-block;height:1px;width:1px;margin:-1px;clip:rect(0,0,0,0);overflow:hidden;float:left;}.Select-menu-outer{border-bottom-right-radius:4px;border-bottom-left-radius:4px;background-color:",";border:1px solid ",";box-shadow:0 3px 10px 0 rgba(0,0,0,0.2);box-sizing:border-box;margin-top:-1px;max-height:270px;position:absolute;top:100%;width:100%;z-index:1;-webkit-overflow-scrolling:touch;}.Select-menu{max-height:226px;overflow-x:auto;overflow-y:auto;font-size:16px;}.Select-option{box-sizing:border-box;background-color:",";line-height:30px;color:",";cursor:pointer;display:block;padding:10px 15px 10px 20px;transition:background 0.2s ease;}.Select-option:last-child{border-bottom-right-radius:4px;border-bottom-left-radius:4px;}.Select-option.is-selected{background-color:",";}.Select-option.is-focused{background-color:",";}.Select-option.is-disabled{color:rgba(0,0,0,0.16);cursor:not-allowed;}.Select-noresults{box-sizing:border-box;color:",";cursor:default;display:block;padding:10px 20px;}.Select--multi .Select-input{vertical-align:middle;margin-left:10px;padding:0;}.Select--multi.has-value .Select-input{margin-left:5px;}.Select--multi .Select-value{background-color:",";background-color:",";border-radius:4px;border:1px solid ",";border:1px solid rgba(0,126,255,0.24);color:",";display:inline-block;font-size:0.9em;line-height:1.4;margin-left:4px;margin-top:4px;vertical-align:top;}.Select--multi .Select-value-icon,.Select--multi .Select-value-label{display:inline-block;vertical-align:middle;}.Select--multi .Select-value-icon{font-size:1.5em;line-height:100%;vertical-align:middle;box-sizing:border-box;padding:5px 4px 2px;color:",";}.Select--multi .Select-value-label{border-bottom-right-radius:4px;border-top-right-radius:4px;cursor:default;padding:2px 4px;line-height:1;max-width:90%;overflow:hidden;text-overflow:ellipsis;}.Select--multi a.Select-value-label{color:",";cursor:pointer;text-decoration:none;}.Select--multi a.Select-value-label:hover{text-decoration:underline;}.Select--multi .Select-value-icon{cursor:pointer;border-bottom-left-radius:4px;border-top-left-radius:4px;border-right:1px solid ",";border-right:1px solid rgba(0,126,255,0.24);font-size:1.5em;line-height:100%;box-sizing:border-box;padding:5px 4px 2px;color:",";}.Select--multi .Select-value-icon:hover,.Select--multi .Select-value-icon:focus{background-color:#d8eafd;background-color:rgba(0,113,230,0.08);color:",";}.Select--multi .Select-value-icon:active{background-color:#c2e0ff;background-color:rgba(0,126,255,0.24);}.Select--multi.is-disabled .Select-value{background-color:#fcfcfc;border:1px solid #e3e3e3;color:",";}.Select--multi.is-disabled .Select-value-icon{cursor:not-allowed;border-right:1px solid #e3e3e3;}.Select--multi.is-disabled .Select-value-icon:hover,.Select--multi.is-disabled .Select-value-icon:focus,.Select--multi.is-disabled .Select-value-icon:active{background-color:#fcfcfc;}"," ",""],(e=>e.theme.colors.white),(e=>e.theme.colors.alto),(e=>e.theme.colors.mineShaft),(e=>e.theme.colors.accent),(e=>e.theme.colors.accent),(e=>e.theme.colors.silver),(e=>e.theme.colors.mineShaft),a,(e=>e.theme.colors.alto),(e=>e.theme.colors.mineShaft),r,(e=>e.theme.colors.alto),(e=>e.theme.colors.white),(e=>e.theme.colors.onahau),(e=>e.theme.colors.white),(e=>e.theme.colors.mineShaft),(e=>e.theme.colors.onahau),(e=>e.theme.colors.onahau),(e=>e.theme.colors.silver),(e=>e.theme.colors.nebula),(e=>t(e.theme.colors.nebula).setAlpha(.1).toString()),(e=>e.theme.colors.onahau),(e=>e.theme.colors.mineShaft),(e=>e.theme.colors.accent),(e=>e.theme.colors.accent),(e=>e.theme.colors.onahau),(e=>e.theme.colors.accent),(e=>e.theme.colors.accent),(e=>e.theme.colors.mineShaft),(e=>e.fluid?c:null),(e=>e.error?n:null));export{s as Root};
2
2
  //# sourceMappingURL=style.js.map
package/components/Select/style.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../../src/components/Select/style.ts"],"sourcesContent":["import styled, { css, keyframes } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { errorStyle } from '../../components/Input/style'\nimport { SelectProps } from './Select'\n\nconst fadeIn = keyframes`\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n`\n\nconst spin = keyframes`\n to {\n transform: rotate(1turn);\n }\n`\n\nconst fluid = css`\n .Select {\n max-width: 100%;\n width: 100%;\n }\n`\n\nconst error = css`\n .Select-control {\n ${errorStyle}\n }\n`\n\nexport const Root = styled.span.withConfig<SelectProps>({\n shouldForwardProp: (prop) => !['error', 'fluid'].includes(prop),\n})`\n .Select {\n position: relative;\n max-width: 390px;\n }\n .Select,\n .Select div,\n .Select input,\n .Select span {\n box-sizing: border-box;\n }\n .Select.is-disabled > .Select-control {\n cursor: not-allowed;\n background-color: #f5f5f5;\n }\n .Select.is-disabled .Select-value-label {\n color: rgba(0, 0, 0, 0.16) !important;\n }\n .Select.is-disabled > .Select-control:hover {\n box-shadow: none;\n }\n .Select.is-disabled .Select-arrow-zone {\n cursor: default;\n pointer-events: none;\n opacity: 0.35;\n }\n .Select.is-clearable {\n .Select-placeholder,\n &.Select--single > .Select-control .Select-value {\n padding-right: 70px;\n }\n }\n .Select-control {\n background-color: ${(props) => props.theme.colors.white};\n border: solid 1px ${(props) => props.theme.colors.alto};\n border-radius: 4px;\n color: ${(props) => props.theme.colors.mineShaft};\n cursor: default;\n display: table;\n border-spacing: 0;\n border-collapse: separate;\n height: 50px;\n outline: none;\n overflow: hidden;\n position: relative;\n width: 100%;\n }\n .Select-control .Select-input:focus {\n outline: none;\n }\n .is-searchable.is-open > .Select-control {\n cursor: text;\n }\n .is-open > .Select-control {\n border-bottom-right-radius: 0;\n border-bottom-left-radius: 0;\n border: 1px solid ${(props) => props.theme.colors.accent};\n outline: none;\n }\n .is-open > .Select-control .Select-arrow {\n transform: rotate(180deg);\n }\n .is-searchable.is-focused:not(.is-open) > .Select-control {\n cursor: text;\n }\n .is-focused:not(.is-open) > .Select-control {\n border: 1px solid ${(props) => props.theme.colors.accent};\n }\n .Select-placeholder,\n .Select--single > .Select-control .Select-value {\n bottom: 0;\n color: ${(props) => props.theme.colors.silver};\n left: 0;\n font-size: 16px;\n line-height: 50px;\n padding-left: 20px;\n padding-right: 35px;\n position: absolute;\n right: 0;\n top: 0;\n max-width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n .has-value.Select--single > .Select-control .Select-value .Select-value-label,\n .has-value.is-pseudo-focused.Select--single > .Select-control .Select-value .Select-value-label {\n color: ${(props) => props.theme.colors.mineShaft};\n }\n .has-value.Select--single > .Select-control .Select-value a.Select-value-label,\n .has-value.is-pseudo-focused.Select--single > .Select-control .Select-value a.Select-value-label {\n cursor: pointer;\n text-decoration: none;\n }\n .has-value.Select--single > .Select-control .Select-value a.Select-value-label:hover,\n .has-value.is-pseudo-focused.Select--single > .Select-control .Select-value a.Select-value-label:hover,\n .has-value.Select--single > .Select-control .Select-value a.Select-value-label:focus,\n .has-value.is-pseudo-focused.Select--single > .Select-control .Select-value a.Select-value-label:focus {\n color: #007eff;\n outline: none;\n text-decoration: underline;\n }\n .Select-input {\n height: 50px;\n padding-left: 20px;\n padding-right: 15px;\n vertical-align: middle;\n }\n .Select-input > input {\n width: 100%;\n background: none transparent;\n border: 0 none;\n box-shadow: none;\n cursor: default;\n display: inline-block;\n font-family: inherit;\n font-size: 16px;\n margin: 0;\n outline: none;\n line-height: 30px;\n padding: 10px 0;\n -webkit-appearance: none;\n }\n .is-focused .Select-input > input {\n cursor: text;\n }\n .is-focused .Select-arrow,\n .Select-arrow-zone:hover > .Select-arrow {\n background-image: url('./images/arrow_down_hover.svg');\n }\n .has-value.is-pseudo-focused .Select-input {\n opacity: 0;\n }\n .Select-control:not(.is-searchable) > .Select-input {\n outline: none;\n }\n .Select-loading-zone {\n cursor: pointer;\n display: table-cell;\n position: relative;\n text-align: center;\n vertical-align: middle;\n width: 16px;\n }\n .Select-loading {\n animation: ${spin} 400ms infinite linear;\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n border-radius: 50%;\n border: 2px solid ${(props) => props.theme.colors.alto};\n border-right-color: ${(props) => props.theme.colors.mineShaft};\n display: inline-block;\n position: relative;\n vertical-align: middle;\n }\n .Select-clear-zone {\n animation: ${fadeIn} 200ms;\n color: ${(props) => props.theme.colors.alto};\n cursor: pointer;\n display: table-cell;\n position: relative;\n text-align: center;\n vertical-align: middle;\n width: 35px;\n line-height: 0;\n\n .Select-clear {\n position: relative;\n top: -1px;\n }\n }\n .Select-clear-zone:hover {\n color: #d0021b;\n }\n .Select-clear {\n display: inline-block;\n font-size: 0px;\n line-height: 1;\n color: transparent;\n overflow: hidden;\n width: 12px;\n height: 12px;\n background: url('./images/close.svg') no-repeat;\n background-size: cover;\n }\n .Select--multi .Select-clear-zone {\n width: 17px;\n }\n .Select-arrow-zone {\n cursor: pointer;\n display: table-cell;\n position: relative;\n text-align: center;\n vertical-align: middle;\n width: 35px;\n line-height: 0;\n }\n .Select-arrow {\n background: url('./images/arrow_down.svg') no-repeat;\n display: inline-block;\n background-size: 12px;\n height: 7px;\n width: 12px;\n position: relative;\n transition: 0.3s;\n transform: rotate(0deg);\n }\n .is-open .Select-arrow,\n .Select-arrow-zone:hover > .Select-arrow {\n background-image: url('./images/arrow_down_hover.svg');\n }\n .Select--multi .Select-multi-value-wrapper {\n display: inline-block;\n padding-left: 20px;\n }\n .Select--multi .Select-multi-value-wrapper {\n .Select-placeholder + .Select-input {\n margin-left: 0;\n }\n }\n .Select--single {\n .Select-multi-value-wrapper {\n display: block;\n width: 100%;\n }\n .Select-input .react-select-2--value {\n display: block;\n width: 100%;\n }\n }\n .Select .Select-aria-only {\n display: inline-block;\n height: 1px;\n width: 1px;\n margin: -1px;\n clip: rect(0, 0, 0, 0);\n overflow: hidden;\n float: left;\n }\n .Select-menu-outer {\n border-bottom-right-radius: 4px;\n border-bottom-left-radius: 4px;\n background-color: ${(props) => props.theme.colors.white};\n border: 1px solid ${(props) => props.theme.colors.onahau};\n box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.2);\n box-sizing: border-box;\n margin-top: -1px;\n max-height: 270px;\n position: absolute;\n top: 100%;\n width: 100%;\n z-index: 1;\n -webkit-overflow-scrolling: touch;\n }\n .Select-menu {\n max-height: 226px;\n overflow-x: auto;\n overflow-y: auto;\n font-size: 16px;\n }\n .Select-option {\n box-sizing: border-box;\n background-color: ${(props) => props.theme.colors.white};\n line-height: 30px;\n color: ${(props) => props.theme.colors.mineShaft};\n cursor: pointer;\n display: block;\n padding: 10px 15px 10px 20px;\n transition: background 0.2s ease;\n }\n .Select-option:last-child {\n border-bottom-right-radius: 4px;\n border-bottom-left-radius: 4px;\n }\n .Select-option.is-selected {\n background-color: ${(props) => props.theme.colors.onahau};\n }\n .Select-option.is-focused {\n background-color: ${(props) => props.theme.colors.onahau};\n }\n .Select-option.is-disabled {\n color: rgba(0, 0, 0, 0.16);\n cursor: not-allowed;\n }\n .Select-noresults {\n box-sizing: border-box;\n color: ${(props) => props.theme.colors.silver};\n cursor: default;\n display: block;\n padding: 10px 20px;\n }\n .Select--multi .Select-input {\n vertical-align: middle;\n margin-left: 10px;\n padding: 0;\n }\n .Select--multi.has-value .Select-input {\n margin-left: 5px;\n }\n .Select--multi .Select-value {\n background-color: ${(props) => props.theme.colors.nebula};\n background-color: ${(props) => tinycolor(props.theme.colors.nebula).setAlpha(0.1).toString()};\n border-radius: 4px;\n border: 1px solid ${(props) => props.theme.colors.onahau};\n border: 1px solid rgba(0, 126, 255, 0.24);\n color: ${(props) => props.theme.colors.mineShaft};\n display: inline-block;\n font-size: 0.9em;\n line-height: 1.4;\n margin-left: 4px;\n margin-top: 4px;\n vertical-align: top;\n }\n .Select--multi .Select-value-icon,\n .Select--multi .Select-value-label {\n display: inline-block;\n vertical-align: middle;\n }\n .Select--multi .Select-value-icon {\n font-size: 1.5em;\n line-height: 100%;\n vertical-align: middle;\n box-sizing: border-box;\n padding: 5px 4px 2px;\n color: ${(props) => props.theme.colors.accent};\n }\n\n .Select--multi .Select-value-label {\n border-bottom-right-radius: 4px;\n border-top-right-radius: 4px;\n cursor: default;\n padding: 2px 4px;\n line-height: 1;\n max-width: 90%;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n .Select--multi a.Select-value-label {\n color: ${(props) => props.theme.colors.accent};\n cursor: pointer;\n text-decoration: none;\n }\n .Select--multi a.Select-value-label:hover {\n text-decoration: underline;\n }\n .Select--multi .Select-value-icon {\n cursor: pointer;\n border-bottom-left-radius: 4px;\n border-top-left-radius: 4px;\n border-right: 1px solid ${(props) => props.theme.colors.onahau};\n border-right: 1px solid rgba(0, 126, 255, 0.24);\n font-size: 1.5em;\n line-height: 100%;\n box-sizing: border-box;\n padding: 5px 4px 2px;\n color: ${(props) => props.theme.colors.accent};\n }\n .Select--multi .Select-value-icon:hover,\n .Select--multi .Select-value-icon:focus {\n background-color: #d8eafd;\n background-color: rgba(0, 113, 230, 0.08);\n color: ${(props) => props.theme.colors.accent};\n }\n .Select--multi .Select-value-icon:active {\n background-color: #c2e0ff;\n background-color: rgba(0, 126, 255, 0.24);\n }\n .Select--multi.is-disabled .Select-value {\n background-color: #fcfcfc;\n border: 1px solid #e3e3e3;\n color: ${(props) => props.theme.colors.mineShaft};\n }\n .Select--multi.is-disabled .Select-value-icon {\n cursor: not-allowed;\n border-right: 1px solid #e3e3e3;\n }\n .Select--multi.is-disabled .Select-value-icon:hover,\n .Select--multi.is-disabled .Select-value-icon:focus,\n .Select--multi.is-disabled .Select-value-icon:active {\n background-color: #fcfcfc;\n }\n ${(props) => (props.fluid ? fluid : null)}\n ${(props) => (props.error ? error : null)}\n`\n"],"names":["fadeIn","keyframes","spin","fluid","css","error","errorStyle","Root","styled","span","withConfig","shouldForwardProp","prop","includes","componentId","props","theme","colors","white","alto","mineShaft","accent","silver","onahau","nebula","tinycolor","setAlpha","toString"],"mappings":"mIAKA,IAAMA,EAASC,EAAf,CAAA,mCASA,IAAMC,EAAOD,EAAb,CAAA,iCAMA,IAAME,EAAQC,EAAd,CAAA,wCAOA,IAAMC,EAAQD,EAAH,CAAA,mBAAA,KAELE,GAIC,IAAMC,EAAOC,EAAOC,KAAKC,WAAwB,CACtDC,kBAAoBC,IAAU,CAAC,QAAS,SAASC,SAASD,KAD3CF,WAAA,CAAAI,YAAA,uBAAGN,CAAH,CAAA,ujBAAA,qBAAA,4BAAA,+VAAA,yNAAA,wFAAA,8WAAA,u4CAAA,0GAAA,uBAAA,+FAAA,gBAAA,44CAAA,qBAAA,yTAAA,2BAAA,kOAAA,gDAAA,yHAAA,yOAAA,qBAAA,uCAAA,gDAAA,sWAAA,gPAAA,+OAAA,iIAAA,0JAAA,+MAAA,6RAAA,IAAA,KAmCQO,GAAUA,EAAMC,MAAMC,OAAOC,QAC7BH,GAAUA,EAAMC,MAAMC,OAAOE,OAExCJ,GAAUA,EAAMC,MAAMC,OAAOG,YAoBlBL,GAAUA,EAAMC,MAAMC,OAAOI,SAU7BN,GAAUA,EAAMC,MAAMC,OAAOI,SAKxCN,GAAUA,EAAMC,MAAMC,OAAOK,SAgB7BP,GAAUA,EAAMC,MAAMC,OAAOG,WA0D1BlB,GAKQa,GAAUA,EAAMC,MAAMC,OAAOE,OAC3BJ,GAAUA,EAAMC,MAAMC,OAAOG,WAMvCpB,GACHe,GAAUA,EAAMC,MAAMC,OAAOE,OAqFlBJ,GAAUA,EAAMC,MAAMC,OAAOC,QAC7BH,GAAUA,EAAMC,MAAMC,OAAOM,SAmB7BR,GAAUA,EAAMC,MAAMC,OAAOC,QAExCH,GAAUA,EAAMC,MAAMC,OAAOG,YAWlBL,GAAUA,EAAMC,MAAMC,OAAOM,SAG7BR,GAAUA,EAAMC,MAAMC,OAAOM,SAQxCR,GAAUA,EAAMC,MAAMC,OAAOK,SAclBP,GAAUA,EAAMC,MAAMC,OAAOO,SAC7BT,GAAUU,EAAUV,EAAMC,MAAMC,OAAOO,QAAQE,SAAS,IAAKC,aAE7DZ,GAAUA,EAAMC,MAAMC,OAAOM,SAExCR,GAAUA,EAAMC,MAAMC,OAAOG,YAmB7BL,GAAUA,EAAMC,MAAMC,OAAOI,SAc7BN,GAAUA,EAAMC,MAAMC,OAAOI,SAWZN,GAAUA,EAAMC,MAAMC,OAAOM,SAM9CR,GAAUA,EAAMC,MAAMC,OAAOI,SAM7BN,GAAUA,EAAMC,MAAMC,OAAOI,SAS7BN,GAAUA,EAAMC,MAAMC,OAAOG,YAWtCL,GAAWA,EAAMZ,MAAQA,EAAQ,OACjCY,GAAWA,EAAMV,MAAQA,EAAQ"}
1
+ {"version":3,"file":"style.js","sources":["../../../../src/components/Select/style.ts"],"sourcesContent":["import styled, { css, keyframes } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { errorStyle } from '../../components/Input/style'\nimport { SelectProps } from './Select'\n\nconst fadeIn = keyframes`\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n`\n\nconst spin = keyframes`\n to {\n transform: rotate(1turn);\n }\n`\n\nconst fluid = css`\n .Select {\n max-width: 100%;\n width: 100%;\n }\n`\n\nconst error = css`\n .Select-control {\n ${errorStyle}\n }\n`\n\nexport const Root = styled.span.withConfig<SelectProps>({\n shouldForwardProp: (prop) => !['error', 'fluid'].includes(prop),\n})`\n .Select {\n position: relative;\n max-width: 390px;\n }\n .Select,\n .Select div,\n .Select input,\n .Select span {\n box-sizing: border-box;\n }\n .Select.is-disabled > .Select-control {\n cursor: not-allowed;\n background-color: #f5f5f5;\n }\n .Select.is-disabled .Select-value-label {\n color: rgba(0, 0, 0, 0.16) !important;\n }\n .Select.is-disabled > .Select-control:hover {\n box-shadow: none;\n }\n .Select.is-disabled .Select-arrow-zone {\n cursor: default;\n pointer-events: none;\n opacity: 0.35;\n }\n .Select.is-clearable {\n .Select-placeholder,\n &.Select--single > .Select-control .Select-value {\n padding-right: 70px;\n }\n }\n .Select-control {\n background-color: ${(props) => props.theme.colors.white};\n border: solid 1px ${(props) => props.theme.colors.alto};\n border-radius: 4px;\n color: ${(props) => props.theme.colors.mineShaft};\n cursor: default;\n display: table;\n border-spacing: 0;\n border-collapse: separate;\n height: 50px;\n outline: none;\n overflow: hidden;\n position: relative;\n width: 100%;\n }\n .Select-control .Select-input:focus {\n outline: none;\n }\n .is-searchable.is-open > .Select-control {\n cursor: text;\n }\n .is-open > .Select-control {\n border-bottom-right-radius: 0;\n border-bottom-left-radius: 0;\n border: 1px solid ${(props) => props.theme.colors.accent};\n outline: none;\n }\n .is-open > .Select-control .Select-arrow {\n transform: rotate(180deg);\n }\n .is-searchable.is-focused:not(.is-open) > .Select-control {\n cursor: text;\n }\n .is-focused:not(.is-open) > .Select-control {\n border: 1px solid ${(props) => props.theme.colors.accent};\n }\n .Select-placeholder,\n .Select--single > .Select-control .Select-value {\n bottom: 0;\n color: ${(props) => props.theme.colors.silver};\n left: 0;\n font-size: 16px;\n line-height: 50px;\n padding-left: 20px;\n padding-right: 35px;\n position: absolute;\n right: 0;\n top: 0;\n max-width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n .has-value.Select--single > .Select-control .Select-value .Select-value-label,\n .has-value.is-pseudo-focused.Select--single > .Select-control .Select-value .Select-value-label {\n color: ${(props) => props.theme.colors.mineShaft};\n }\n .has-value.Select--single > .Select-control .Select-value a.Select-value-label,\n .has-value.is-pseudo-focused.Select--single > .Select-control .Select-value a.Select-value-label {\n cursor: pointer;\n text-decoration: none;\n }\n .has-value.Select--single > .Select-control .Select-value a.Select-value-label:hover,\n .has-value.is-pseudo-focused.Select--single > .Select-control .Select-value a.Select-value-label:hover,\n .has-value.Select--single > .Select-control .Select-value a.Select-value-label:focus,\n .has-value.is-pseudo-focused.Select--single > .Select-control .Select-value a.Select-value-label:focus {\n color: #007eff;\n outline: none;\n text-decoration: underline;\n }\n .Select-input {\n height: 50px;\n padding-left: 20px;\n padding-right: 15px;\n vertical-align: middle;\n }\n .Select-input > input {\n width: 100%;\n background: none transparent;\n border: 0 none;\n box-shadow: none;\n cursor: default;\n display: inline-block;\n font-family: inherit;\n font-size: 16px;\n margin: 0;\n outline: none;\n line-height: 30px;\n padding: 10px 0;\n -webkit-appearance: none;\n }\n .is-focused .Select-input > input {\n cursor: text;\n }\n .is-focused .Select-arrow,\n .Select-arrow-zone:hover > .Select-arrow {\n background-image: url(\"data:image/svg+xml,%3Csvg width='18' height='11' viewBox='0 0 18 11' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpolygon id='path-1' points='0 0.328542857 0 12 19.9069167 12 19.9069167 0.328542857 7.22801448e-20 0.328542857'/%3E%3C/defs%3E%3Cg id='Tutorial' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' opacity='.732'%3E%3Cg id='рега' transform='translate(-676.000000, -708.000000)'%3E%3Cg id='arrow-down-sign-to-navigate' transform='translate(674.000000, 708.000000)'%3E%3Cmask id='mask-2' fill='%23fff'%3E%3Cuse xlink:href='%23path-1'/%3E%3C/mask%3E%3Cpath d='M10.9531585,10.8272649 C10.6323293,10.8272649 10.3115001,10.700818 10.0677299,10.4500829 L2.36812901,2.53049343 C1.87729033,2.02563079 1.87729033,1.20866001 2.36812901,0.7053394 C2.8574685,0.20294401 3.65174564,0.20294401 4.14138496,0.7053394 L10.9531585,7.71296866 L17.7664312,0.706573029 C18.2560705,0.20294401 19.0500478,0.20294401 19.5396872,0.706573029 C20.0293265,1.20989364 20.0293265,2.02686441 19.5396872,2.53049343 L11.8397865,10.4500829 C11.5963161,10.7020516 11.2742875,10.8272649 10.9531585,10.8272649 L10.9531585,10.8272649 Z' id='Fill-1' fill='%2348a1e6' mask='url(%23mask-2)'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A\");\n }\n .has-value.is-pseudo-focused .Select-input {\n opacity: 0;\n }\n .Select-control:not(.is-searchable) > .Select-input {\n outline: none;\n }\n .Select-loading-zone {\n cursor: pointer;\n display: table-cell;\n position: relative;\n text-align: center;\n vertical-align: middle;\n width: 16px;\n }\n .Select-loading {\n animation: ${spin} 400ms infinite linear;\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n border-radius: 50%;\n border: 2px solid ${(props) => props.theme.colors.alto};\n border-right-color: ${(props) => props.theme.colors.mineShaft};\n display: inline-block;\n position: relative;\n vertical-align: middle;\n }\n .Select-clear-zone {\n animation: ${fadeIn} 200ms;\n color: ${(props) => props.theme.colors.alto};\n cursor: pointer;\n display: table-cell;\n position: relative;\n text-align: center;\n vertical-align: middle;\n width: 35px;\n line-height: 0;\n\n .Select-clear {\n position: relative;\n top: -1px;\n }\n }\n .Select-clear-zone:hover {\n color: #d0021b;\n }\n .Select-clear {\n display: inline-block;\n font-size: 0px;\n line-height: 1;\n color: transparent;\n overflow: hidden;\n width: 12px;\n height: 12px;\n background-image: url(\"data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.6 9.5L19.2 2c.4-.6.4-1.3 0-1.7-.4-.4-1.2-.4-1.6 0L10 8 2.4.2C2 0 1.2 0 .8.3.4.7.4 1.3.8 2l7.6 7.5-8 8c-.5.5-.5 1.2 0 1.7.2.2.4.3.7.3.4 0 .7 0 1-.3l8-8 8 8c.3.2.6.3 1 .3.2 0 .4 0 .7-.3.4-.5.4-1.2 0-1.6l-8-8z' fill='%23D9D9D9' fillRule='evenodd' /%3E%3C/svg%3E%0A\")\n no-repeat;\n background-size: cover;\n }\n .Select--multi .Select-clear-zone {\n width: 17px;\n }\n .Select-arrow-zone {\n cursor: pointer;\n display: table-cell;\n position: relative;\n text-align: center;\n vertical-align: middle;\n width: 35px;\n line-height: 0;\n }\n .Select-arrow {\n background-image: url(\"data:image/svg+xml,%3Csvg width='18' height='11' viewBox='0 0 18 11' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpolygon id='path-1' points='0 0.328542857 0 12 19.9069167 12 19.9069167 0.328542857 7.22801448e-20 0.328542857'/%3E%3C/defs%3E%3Cg id='Tutorial' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' opacity='.732'%3E%3Cg id='рега' transform='translate(-676.000000, -708.000000)'%3E%3Cg id='arrow-down-sign-to-navigate' transform='translate(674.000000, 708.000000)'%3E%3Cmask id='mask-2' fill='%23fff'%3E%3Cuse xlink:href='%23path-1'/%3E%3C/mask%3E%3Cpath d='M10.9531585,10.8272649 C10.6323293,10.8272649 10.3115001,10.700818 10.0677299,10.4500829 L2.36812901,2.53049343 C1.87729033,2.02563079 1.87729033,1.20866001 2.36812901,0.7053394 C2.8574685,0.20294401 3.65174564,0.20294401 4.14138496,0.7053394 L10.9531585,7.71296866 L17.7664312,0.706573029 C18.2560705,0.20294401 19.0500478,0.20294401 19.5396872,0.706573029 C20.0293265,1.20989364 20.0293265,2.02686441 19.5396872,2.53049343 L11.8397865,10.4500829 C11.5963161,10.7020516 11.2742875,10.8272649 10.9531585,10.8272649 L10.9531585,10.8272649 Z' id='Fill-1' fill='%23b8b8b8' mask='url(%23mask-2)'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A\")\n no-repeat;\n display: inline-block;\n background-size: 12px;\n height: 7px;\n width: 12px;\n position: relative;\n transition: 0.3s;\n transform: rotate(0deg);\n }\n .is-open .Select-arrow,\n .Select-arrow-zone:hover > .Select-arrow {\n background-image: url(\"data:image/svg+xml,%3Csvg width='18' height='11' viewBox='0 0 18 11' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpolygon id='path-1' points='0 0.328542857 0 12 19.9069167 12 19.9069167 0.328542857 7.22801448e-20 0.328542857'/%3E%3C/defs%3E%3Cg id='Tutorial' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' opacity='.732'%3E%3Cg id='рега' transform='translate(-676.000000, -708.000000)'%3E%3Cg id='arrow-down-sign-to-navigate' transform='translate(674.000000, 708.000000)'%3E%3Cmask id='mask-2' fill='%23fff'%3E%3Cuse xlink:href='%23path-1'/%3E%3C/mask%3E%3Cpath d='M10.9531585,10.8272649 C10.6323293,10.8272649 10.3115001,10.700818 10.0677299,10.4500829 L2.36812901,2.53049343 C1.87729033,2.02563079 1.87729033,1.20866001 2.36812901,0.7053394 C2.8574685,0.20294401 3.65174564,0.20294401 4.14138496,0.7053394 L10.9531585,7.71296866 L17.7664312,0.706573029 C18.2560705,0.20294401 19.0500478,0.20294401 19.5396872,0.706573029 C20.0293265,1.20989364 20.0293265,2.02686441 19.5396872,2.53049343 L11.8397865,10.4500829 C11.5963161,10.7020516 11.2742875,10.8272649 10.9531585,10.8272649 L10.9531585,10.8272649 Z' id='Fill-1' fill='%2348a1e6' mask='url(%23mask-2)'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A\");\n }\n .Select--multi .Select-multi-value-wrapper {\n display: inline-block;\n padding-left: 20px;\n }\n .Select--multi .Select-multi-value-wrapper {\n .Select-placeholder + .Select-input {\n margin-left: 0;\n }\n }\n .Select--single {\n .Select-multi-value-wrapper {\n display: block;\n width: 100%;\n }\n .Select-input .react-select-2--value {\n display: block;\n width: 100%;\n }\n }\n .Select .Select-aria-only {\n display: inline-block;\n height: 1px;\n width: 1px;\n margin: -1px;\n clip: rect(0, 0, 0, 0);\n overflow: hidden;\n float: left;\n }\n .Select-menu-outer {\n border-bottom-right-radius: 4px;\n border-bottom-left-radius: 4px;\n background-color: ${(props) => props.theme.colors.white};\n border: 1px solid ${(props) => props.theme.colors.onahau};\n box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.2);\n box-sizing: border-box;\n margin-top: -1px;\n max-height: 270px;\n position: absolute;\n top: 100%;\n width: 100%;\n z-index: 1;\n -webkit-overflow-scrolling: touch;\n }\n .Select-menu {\n max-height: 226px;\n overflow-x: auto;\n overflow-y: auto;\n font-size: 16px;\n }\n .Select-option {\n box-sizing: border-box;\n background-color: ${(props) => props.theme.colors.white};\n line-height: 30px;\n color: ${(props) => props.theme.colors.mineShaft};\n cursor: pointer;\n display: block;\n padding: 10px 15px 10px 20px;\n transition: background 0.2s ease;\n }\n .Select-option:last-child {\n border-bottom-right-radius: 4px;\n border-bottom-left-radius: 4px;\n }\n .Select-option.is-selected {\n background-color: ${(props) => props.theme.colors.onahau};\n }\n .Select-option.is-focused {\n background-color: ${(props) => props.theme.colors.onahau};\n }\n .Select-option.is-disabled {\n color: rgba(0, 0, 0, 0.16);\n cursor: not-allowed;\n }\n .Select-noresults {\n box-sizing: border-box;\n color: ${(props) => props.theme.colors.silver};\n cursor: default;\n display: block;\n padding: 10px 20px;\n }\n .Select--multi .Select-input {\n vertical-align: middle;\n margin-left: 10px;\n padding: 0;\n }\n .Select--multi.has-value .Select-input {\n margin-left: 5px;\n }\n .Select--multi .Select-value {\n background-color: ${(props) => props.theme.colors.nebula};\n background-color: ${(props) => tinycolor(props.theme.colors.nebula).setAlpha(0.1).toString()};\n border-radius: 4px;\n border: 1px solid ${(props) => props.theme.colors.onahau};\n border: 1px solid rgba(0, 126, 255, 0.24);\n color: ${(props) => props.theme.colors.mineShaft};\n display: inline-block;\n font-size: 0.9em;\n line-height: 1.4;\n margin-left: 4px;\n margin-top: 4px;\n vertical-align: top;\n }\n .Select--multi .Select-value-icon,\n .Select--multi .Select-value-label {\n display: inline-block;\n vertical-align: middle;\n }\n .Select--multi .Select-value-icon {\n font-size: 1.5em;\n line-height: 100%;\n vertical-align: middle;\n box-sizing: border-box;\n padding: 5px 4px 2px;\n color: ${(props) => props.theme.colors.accent};\n }\n\n .Select--multi .Select-value-label {\n border-bottom-right-radius: 4px;\n border-top-right-radius: 4px;\n cursor: default;\n padding: 2px 4px;\n line-height: 1;\n max-width: 90%;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n .Select--multi a.Select-value-label {\n color: ${(props) => props.theme.colors.accent};\n cursor: pointer;\n text-decoration: none;\n }\n .Select--multi a.Select-value-label:hover {\n text-decoration: underline;\n }\n .Select--multi .Select-value-icon {\n cursor: pointer;\n border-bottom-left-radius: 4px;\n border-top-left-radius: 4px;\n border-right: 1px solid ${(props) => props.theme.colors.onahau};\n border-right: 1px solid rgba(0, 126, 255, 0.24);\n font-size: 1.5em;\n line-height: 100%;\n box-sizing: border-box;\n padding: 5px 4px 2px;\n color: ${(props) => props.theme.colors.accent};\n }\n .Select--multi .Select-value-icon:hover,\n .Select--multi .Select-value-icon:focus {\n background-color: #d8eafd;\n background-color: rgba(0, 113, 230, 0.08);\n color: ${(props) => props.theme.colors.accent};\n }\n .Select--multi .Select-value-icon:active {\n background-color: #c2e0ff;\n background-color: rgba(0, 126, 255, 0.24);\n }\n .Select--multi.is-disabled .Select-value {\n background-color: #fcfcfc;\n border: 1px solid #e3e3e3;\n color: ${(props) => props.theme.colors.mineShaft};\n }\n .Select--multi.is-disabled .Select-value-icon {\n cursor: not-allowed;\n border-right: 1px solid #e3e3e3;\n }\n .Select--multi.is-disabled .Select-value-icon:hover,\n .Select--multi.is-disabled .Select-value-icon:focus,\n .Select--multi.is-disabled .Select-value-icon:active {\n background-color: #fcfcfc;\n }\n ${(props) => (props.fluid ? fluid : null)}\n ${(props) => (props.error ? error : null)}\n`\n"],"names":["fadeIn","keyframes","spin","fluid","css","error","errorStyle","Root","styled","span","withConfig","shouldForwardProp","prop","includes","componentId","props","theme","colors","white","alto","mineShaft","accent","silver","onahau","nebula","tinycolor","setAlpha","toString"],"mappings":"mIAKA,IAAMA,EAASC,EAAf,CAAA,mCASA,IAAMC,EAAOD,EAAb,CAAA,iCAMA,IAAME,EAAQC,EAAd,CAAA,wCAOA,IAAMC,EAAQD,EAAH,CAAA,mBAAA,KAELE,GAIC,IAAMC,EAAOC,EAAOC,KAAKC,WAAwB,CACtDC,kBAAoBC,IAAU,CAAC,QAAS,SAASC,SAASD,KAD3CF,WAAA,CAAAI,YAAA,uBAAGN,CAAH,CAAA,ujBAAA,qBAAA,4BAAA,+VAAA,yNAAA,wFAAA,8WAAA,umFAAA,0GAAA,uBAAA,+FAAA,gBAAA,4sIAAA,qBAAA,yTAAA,2BAAA,kOAAA,gDAAA,yHAAA,yOAAA,qBAAA,uCAAA,gDAAA,sWAAA,gPAAA,+OAAA,iIAAA,0JAAA,+MAAA,6RAAA,IAAA,KAmCQO,GAAUA,EAAMC,MAAMC,OAAOC,QAC7BH,GAAUA,EAAMC,MAAMC,OAAOE,OAExCJ,GAAUA,EAAMC,MAAMC,OAAOG,YAoBlBL,GAAUA,EAAMC,MAAMC,OAAOI,SAU7BN,GAAUA,EAAMC,MAAMC,OAAOI,SAKxCN,GAAUA,EAAMC,MAAMC,OAAOK,SAgB7BP,GAAUA,EAAMC,MAAMC,OAAOG,WA0D1BlB,GAKQa,GAAUA,EAAMC,MAAMC,OAAOE,OAC3BJ,GAAUA,EAAMC,MAAMC,OAAOG,WAMvCpB,GACHe,GAAUA,EAAMC,MAAMC,OAAOE,OAuFlBJ,GAAUA,EAAMC,MAAMC,OAAOC,QAC7BH,GAAUA,EAAMC,MAAMC,OAAOM,SAmB7BR,GAAUA,EAAMC,MAAMC,OAAOC,QAExCH,GAAUA,EAAMC,MAAMC,OAAOG,YAWlBL,GAAUA,EAAMC,MAAMC,OAAOM,SAG7BR,GAAUA,EAAMC,MAAMC,OAAOM,SAQxCR,GAAUA,EAAMC,MAAMC,OAAOK,SAclBP,GAAUA,EAAMC,MAAMC,OAAOO,SAC7BT,GAAUU,EAAUV,EAAMC,MAAMC,OAAOO,QAAQE,SAAS,IAAKC,aAE7DZ,GAAUA,EAAMC,MAAMC,OAAOM,SAExCR,GAAUA,EAAMC,MAAMC,OAAOG,YAmB7BL,GAAUA,EAAMC,MAAMC,OAAOI,SAc7BN,GAAUA,EAAMC,MAAMC,OAAOI,SAWZN,GAAUA,EAAMC,MAAMC,OAAOM,SAM9CR,GAAUA,EAAMC,MAAMC,OAAOI,SAM7BN,GAAUA,EAAMC,MAAMC,OAAOI,SAS7BN,GAAUA,EAAMC,MAAMC,OAAOG,YAWtCL,GAAWA,EAAMZ,MAAQA,EAAQ,OACjCY,GAAWA,EAAMV,MAAQA,EAAQ"}