UNPKG

carbon-react

Version:

A library of reusable React components for easily building user interfaces.

2 lines (1 loc) 2.15 kB
import r,{css as i}from"styled-components";import t from"./input-sizes.style.js";import o from"./input.style.js";import e from"../../style/utils/add-focus-styling.js";const n=r.div.withConfig({displayName:"input-presentation.style__StyledInputPresentationContainer",componentId:"sc-5369fb17-0"})(["flex:0 0 ","%;display:flex;position:relative;max-width:",";"],(({inputWidth:r})=>r),(({maxWidth:r})=>r?`${r}`:"100%")),a=r.div.withConfig({displayName:"input-presentation.style__InputPresentationStyle",componentId:"sc-5369fb17-1"})(["align-items:stretch;background:var(--colorsUtilityYang100);"," box-sizing:border-box;cursor:text;display:flex;flex-wrap:wrap;width:100%;margin:0;"," "," "," "," "," "," "," input::-ms-clear{display:none;}input::-webkit-contacts-auto-fill-button{display:none !important;}"],(({hideBorders:r})=>r?"border: 1px solid transparent;":"border: 1px solid var(--colorsUtilityMajor300);"),(({borderRadius:r})=>Array.isArray(r)?`border-radius: ${r.map((r=>`var(--${r})`)).join(" ")};`:`border-radius: var(--${r});`),(({size:r,hasIcon:e,align:n})=>r&&i(["min-height:",";","{padding:0 ",";"," ","}"],t[r].height,o,t[r].horizontalPadding,e&&"right"===n&&"padding-left: 0;",e&&"left"===n&&"padding-right: 0;")),(({disabled:r,hideBorders:t})=>r&&i(["background:var(--colorsUtilityDisabled400);border-color:",";cursor:not-allowed;"],t?"transparent":"var(--colorsUtilityDisabled600)")),(({hasFocus:r})=>r&&i(["&{"," z-index:2;}"],e())),(function({error:r,warning:t,info:o,disabled:e,validationRedesignOptIn:n}){let a;if(e)return"";if(r)a="var(--colorsSemanticNegative500)";else if(t)a=n?"var(--colorsUtilityMajor300)":"var(--colorsSemanticCaution500)";else{if(!o)return"";a="var(--colorsSemanticInfo500)"}return i(["border-color:"," !important;z-index:1;",""],a,r&&`box-shadow: inset 1px 1px 0 ${a}, inset -1px -1px 0 ${a};`)}),(({readOnly:r,hideBorders:t})=>r&&i(["background-color:var(--colorsUtilityReadOnly400);border-color:",";"],t?"transparent":"var(--colorsUtilityReadOnly600)")),(({align:r,prefix:i})=>"right"===r&&`flex-direction: ${i?"row":"row-reverse"};\n `));export{n as StyledInputPresentationContainer,a as default};