carbon-react
Version:
A library of reusable React components for easily building user interfaces.
2 lines (1 loc) • 2.04 kB
JavaScript
import o,{css as e}from"styled-components";import{margin as t}from"styled-system";import i from"../../__internal__/utils/logger/index.js";import n from"../../style/themes/apply-base-theme.js";import r from"../../style/utils/add-focus-styling.js";import s from"../../style/utils/color.js";import{getWindow as l,getNavigator as a}from"../../__internal__/dom/globals.js";import c,{isSafari as m}from"../../__internal__/utils/helpers/browser-type-check/index.js";import d from"./icon-config.js";import f from"./icon-unicodes.js";const g=o.span.attrs(n).withConfig({displayName:"icon.style__StyledIcon",componentId:"sc-74150e41-0"})(["",""],(({theme:o,color:n,bg:g,isInteractive:p,bgSize:h,bgShape:b,type:u,fontSize:y,disabled:_,hasTooltip:z})=>{let S="var(--colorsYin090)",j="transparent";const v=l(),k=a(),x=function(o,e){const t={small:1,medium:2,large:3,"extra-large":4};return o&&e?t[e]<t[o]?(i.warn(`[WARNING - Icon] The "${e}" \`bgSize\` is smaller than "${o}" \`fontSize\`, the \`bgSize\` has been auto adjusted to a larger size.`),d.backgroundSize[o]):d.backgroundSize[e]:e?d.backgroundSize[e]:void 0}(y,h);if(_)S="var(--colorsYin030)";else if(n){const{color:e}=s({color:n,theme:o});S=e}if(g){const{backgroundColor:e}=s({bg:g,theme:o});j=e}return e(["position:relative;color:",";background-color:",";vertical-align:middle;align-items:center;display:inline-flex;justify-content:center;height:",";width:",";",";",' &::before{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:CarbonIcons;content:"','";font-style:normal;font-weight:normal;vertical-align:middle;'," "," "," display:block;}"," ",""],S,j,x,x,b?`border-radius: ${d.backgroundShape[b]}`:"",p&&e(["&:not(:focus):hover{filter:brightness(0.9);}"]),f[u],y&&e(["font-size:",";line-height:",";"],d.iconSize[y],d.iconSize[y]),v&&"services"===u&&c(v)&&e(["margin-top:",";"],"small"===y?"-7px":"-8px"),k&&v&&"services"===u&&m(k)&&!c(v)&&e(["margin-top:-6px;"]),z&&`\n :focus {\n ${r()}\n }\n `,t)}));export{g as default};