carbon-react
Version:
A library of reusable React components for easily building user interfaces.
2 lines (1 loc) • 2.78 kB
JavaScript
import i,{css as e}from"styled-components";import{margin as r}from"styled-system";import{StyledCheckableInput as t}from"../../__internal__/checkable-input/checkable-input.style.js";import o from"../../__internal__/field-help/field-help.style.js";import l from"../../__internal__/checkable-input/hidden-checkable-input.style.js";import a from"../../__internal__/checkable-input/checkable-input-svg-wrapper.style.js";import n,{StyledLabelContainer as s}from"../../__internal__/label/label.style.js";import d from"../../__internal__/validations/validation-icon.style.js";import p from"../../style/themes/apply-base-theme.js";import c from"../../style/utils/add-focus-styling.js";const g=i.div.attrs(p).withConfig({displayName:"checkbox.style__StyledCheckbox",componentId:"sc-ac6c7db0-0"})(["margin-bottom:var(--fieldSpacing);"," ",""],r,(({disabled:i,error:r,warning:p,info:g,fieldHelpInline:m,labelSpacing:f,inputWidth:h,reverse:b,size:v,adaptiveSpacingSmallScreen:x,applyNewValidation:u})=>e([""," ","{padding-top:1px;}","{height:16px;}svg{background-color:var(--colorsUtilityYang100);","}",",svg{height:16px;position:absolute;padding:1px;}",",",",",",svg{box-sizing:border-box;min-width:16px;width:16px;border-radius:var(--borderRadius025);",";}",":not([disabled]){&:focus + ",",&:hover + ","{","}}","{width:auto;flex:0 1 auto;}","{margin-left:16px;margin-top:0;padding-left:",";}","{position:relative;display:inline-block;}"," ",":checked ~ "," svg path{fill:var(--colorsUtilityYin090);}"," "," "," ",""],x&&"margin-left: 0;",t,a,!i&&e(["border:1px solid var(--colorsUtilityMajor300);"," "," "," ",""],g&&"border: 1px solid var(--colorsSemanticInfo500);",p&&"border: 1px solid var(--colorsSemanticCaution500);",r&&"border: 2px solid var(--colorsSemanticNegative500);",p&&u&&"border: 1px solid var(--colorsUtilityMajor300);"),l,t,l,a,"large"===v&&"border-radius: var(--borderRadius050)",l,a,a,c(),s,o,1===f?"var(--spacing100)":"var(--spacing200)",d,"large"===v&&e(["","{height:24px;}",",",",",",svg{height:24px;width:24px;min-width:24px;}","{margin-left:24px;}",""],a,t,l,a,o,m&&e(["",",","{align-self:center;}"],o,s)),l,a,i&&e(["svg{background-color:var(--colorsUtilityDisabled400);border:1px solid var(--colorsUtilityDisabled600);}svg path{fill:var(--colorsUtilityDisabled400);}",":checked ~ "," svg path{fill:var(--colorsUtilityYin030);}","{&:hover,&:focus{outline:none;cursor:not-allowed;}}"],l,a,a),m&&`\n ${o} {\n margin-left: 0;\n }\n\n ${n} {\n flex: 0 1 auto;\n }\n `,void 0!==h&&0!==h&&`\n ${o} {\n ${b?"margin-right":"margin-left"}: ${h}% !important;\n }\n `,b&&e(["","{margin-left:0;padding-left:0;}","{flex:0 1 auto;}",""],o,n,m&&e(["","{margin-right:8px;}","{padding-left:6px;}"],t,o)))));export{g as default};