@foxford/ui 2.5.0 → 2.5.1

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.
@@ -1,2 +1,2 @@
1
- import o from'@babel/runtime/helpers/objectSpread2';import e from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as r}from'react';import{Link as n}from'react-router-dom';import{mergeDeepLeft as a}from'ramda';import{useClassname as t}from'../../hooks/useClassname.js';import{useFallbackTheme as s}from'../../hooks/use-theme.js';import{useConfigPriority as i}from'../../hooks/use-config-priority.js';import{useComputedRel as l,useComputedLinkProps as d}from'./hooks.js';import{PROPS_BY_SIZE as u}from'./constants.js';import{Root as m,IconSlot as c,Content as p,SpinnerIcon as f,CheckIcon as h}from'./style.js';import{jsxs as v,jsx as C}from'react/jsx-runtime';var b=["display","size","fontColor","color","disabled","rounded","width","as","type","className","children","content","onClick","onClickCapture","onMouseEnter","onMouseLeave"];var g='Button';var y=r(((r,g)=>{var y;var k=s();var j=i(null===(y=k.components)||void 0===y?void 0:y.Button,r),{display:N="inline-flex",size:x="m",fontColor:B="white",color:M="accent",disabled:P=!1,rounded:L=!0,width:R="auto",as:E="button",type:W,className:w,children:S,content:_,onClick:I,onClickCapture:z,onMouseEnter:A,onMouseLeave:O}=j,T=e(j,b);var D='brand'===k.preset;if('string'==typeof T.preset&&(D='brand'===T.preset),!D&&!T.round){var F;var H=null!==(F=u[x])&&void 0!==F?F:u.m;T=a(T,H)}var U=t("Button",w);var Y=t("Button");var Z=l(k,T);var q=d(E,P,T);T.href&&(E='a'),T.to&&(E=n),T.primary&&(M='primary'),T.secondary&&(M='atlantis');var G=D?800:600;T.fontWeight&&(G=T.fontWeight);var J='number'==typeof G&&G>=800||'bold'===G;var K='0px';L&&(K=D?'48px':'5px'),T.round&&(K='50%');var Q=D?'0.9em 1.6em':'0px';D&&T.round&&(Q='1em');var[V,X]=Array.isArray(T.icon)?T.icon:[T.icon];return D&&T.loading&&!T.success&&!P&&(V=C(f,{strokeWidth:J?2.5:1.5}),X=null),T.success&&(V=C(h,{strokeWidth:J?3:1.5}),X=null),v(m,o(o(o({},T),q),{},{className:U,as:E,color:M,fontColor:B,disabled:P,rel:Z,display:N,rounded:L,size:x,fontWeight:G,borderRadius:K,basePadding:Q,fontBold:J,brandPresetUsed:D,ref:null!=g?g:T.innerRef,type:'button'===E?W:void 0,lineHeight:D?1.2:1,width:T.round?void 0:R,onClick:o=>{P||T.loading||null==I||I(o)},onClickCapture:o=>{P||T.loading||null==z||z(o)},onMouseEnter:o=>{P||T.loading||null==A||A(o)},onMouseLeave:o=>{P||T.loading||null==O||O(o)},children:[V&&C(c,{className:"icon",marginRight:!T.round,children:V}),(_||S)&&C(p,{className:"".concat(Y,"__content"),children:_||S}),X&&!T.round&&C(c,{className:"icon",marginLeft:!0,children:X})]}))}));y.displayName="Button";export{y as Button,g as COMPONENT_NAME};
1
+ import o from'@babel/runtime/helpers/objectSpread2';import e from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as r}from'react';import{Link as a}from'react-router-dom';import{mergeDeepLeft as n}from'ramda';import{useClassname as s}from'../../hooks/useClassname.js';import{useFallbackTheme as t}from'../../hooks/use-theme.js';import{useConfigPriority as i}from'../../hooks/use-config-priority.js';import{useComputedRel as l,useComputedLinkProps as d}from'./hooks.js';import{STATIC_SIZES as u,BRAND_PROPS_BY_SIZE as m,DEFAULT_PROPS_BY_SIZE as c}from'./constants.js';import{Root as p,IconSlot as f,Content as h,SpinnerIcon as v,CheckIcon as C}from'./style.js';import{jsxs as b,jsx as g}from'react/jsx-runtime';var y=["display","size","fontColor","color","disabled","rounded","width","as","type","className","children","content","onClick","onClickCapture","onMouseEnter","onMouseLeave"];var k='Button';var j=r(((r,k)=>{var j;var N=t();var B=i(null===(j=N.components)||void 0===j?void 0:j.Button,r),{display:P="inline-flex",size:S="m",fontColor:_="white",color:x="accent",disabled:E=!1,rounded:R=!0,width:L="auto",as:M="button",type:I,className:A,children:W,content:w,onClick:T,onClickCapture:O,onMouseEnter:z,onMouseLeave:D}=B,Z=e(B,y);var F='brand'===N.preset;'string'==typeof Z.preset&&(F='brand'===Z.preset);var U=u.includes(S);if(U&&!Z.round){var Y;var H=F?m:c;var q=null!==(Y=H[S])&&void 0!==Y?Y:H.m;Z=n(Z,q)}var G='0px';U||Z.round||(G='1em 1.6em');var J=s("Button",A);var K=s("Button");var Q=l(N,Z);var V=d(M,E,Z);Z.href&&(M='a'),Z.to&&(M=a),Z.primary&&(x='primary'),Z.secondary&&(x='atlantis');var X=F?800:600;Z.fontWeight&&(X=Z.fontWeight);var $='number'==typeof X&&X>=800||'bold'===X;var oo='0px';R&&(oo=F?'48px':'5px'),Z.round&&(oo='50%');var[eo,ro]=Array.isArray(Z.icon)?Z.icon:[Z.icon];return F&&Z.loading&&!Z.success&&!E&&(eo=g(v,{strokeWidth:$?2.5:1.5}),ro=null),Z.success&&(eo=g(C,{strokeWidth:$?3:1.5}),ro=null),b(p,o(o(o({},Z),V),{},{className:J,as:M,color:x,fontColor:_,disabled:E,rel:Q,display:P,rounded:R,size:S,fontWeight:X,borderRadius:oo,basePadding:G,fontBold:$,brandPresetUsed:F,ref:null!=k?k:Z.innerRef,type:'button'===M?I:void 0,lineHeight:F?1.2:1,width:Z.round?void 0:L,onClick:o=>{E||Z.loading||null==T||T(o)},onClickCapture:o=>{E||Z.loading||null==O||O(o)},onMouseEnter:o=>{E||Z.loading||null==z||z(o)},onMouseLeave:o=>{E||Z.loading||null==D||D(o)},children:[eo&&g(f,{className:"icon",marginRight:!Z.round,children:eo}),(w||W)&&g(h,{className:"".concat(K,"__content"),children:w||W}),ro&&!Z.round&&g(f,{className:"icon",marginLeft:!0,children:ro})]}))}));j.displayName="Button";export{j as Button,k as COMPONENT_NAME};
2
2
  //# sourceMappingURL=Button.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { Link } from 'react-router-dom'\nimport { mergeDeepLeft } from 'ramda'\nimport { useClassname } from 'hooks/useClassname'\nimport { useFallbackTheme } from 'hooks/use-theme'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport { useComputedRel, useComputedLinkProps } from './hooks'\nimport { PROPS_BY_SIZE } from './constants'\nimport type { ButtonProps, ButtonStaticSize } from './types'\n\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Button'\n\n/**\n * Main button\n */\nconst Button = forwardRef<HTMLElement, ButtonProps>((props, ref) => {\n const theme = useFallbackTheme()\n\n let {\n display = 'inline-flex',\n size = 'm',\n fontColor = 'white',\n color = 'accent',\n disabled = false,\n rounded = true,\n width = 'auto',\n as: _as = 'button',\n type: _type,\n className: _className,\n children,\n content,\n onClick,\n onClickCapture,\n onMouseEnter,\n onMouseLeave,\n ...configProps\n } = useConfigPriority<ButtonProps>(theme.components?.Button, props)\n\n let brandPresetUsed = theme.preset === 'brand'\n if (typeof configProps.preset === 'string') brandPresetUsed = configProps.preset === 'brand'\n\n if (!brandPresetUsed && !configProps.round) {\n const defaultProps = PROPS_BY_SIZE[size as ButtonStaticSize] ?? PROPS_BY_SIZE.m\n configProps = mergeDeepLeft(configProps, defaultProps) as ButtonProps\n }\n\n const className = useClassname(COMPONENT_NAME, _className)\n const classNameContent = useClassname(COMPONENT_NAME)\n const rel = useComputedRel(theme, configProps)\n const linkProps = useComputedLinkProps(_as, disabled, configProps)\n\n if (configProps.href) _as = 'a'\n if (configProps.to) _as = Link\n\n if (configProps.primary) color = 'primary'\n if (configProps.secondary) color = 'atlantis'\n\n let fontWeight: ButtonProps['fontWeight'] = brandPresetUsed ? 800 : 600\n if (configProps.fontWeight) fontWeight = configProps.fontWeight\n\n const fontBold = (typeof fontWeight === 'number' && fontWeight >= 800) || fontWeight === 'bold'\n\n let borderRadius = '0px'\n if (rounded) borderRadius = brandPresetUsed ? '48px' : '5px'\n if (configProps.round) borderRadius = '50%'\n\n let basePadding = brandPresetUsed ? '0.9em 1.6em' : '0px'\n if (brandPresetUsed && configProps.round) basePadding = '1em'\n\n let [leftIcon, rightIcon] = Array.isArray(configProps.icon) ? configProps.icon : [configProps.icon]\n\n if (brandPresetUsed && configProps.loading && !configProps.success && !disabled) {\n leftIcon = <Styled.SpinnerIcon strokeWidth={fontBold ? 2.5 : 1.5} />\n rightIcon = null\n }\n if (configProps.success) {\n leftIcon = <Styled.CheckIcon strokeWidth={fontBold ? 3 : 1.5} />\n rightIcon = null\n }\n\n const handleClick: ButtonProps['onClick'] = (evt) => {\n if (!disabled && !configProps.loading) onClick?.(evt)\n }\n const handleClickCapture: ButtonProps['onClickCapture'] = (evt) => {\n if (!disabled && !configProps.loading) onClickCapture?.(evt)\n }\n const handleMouseEnter: ButtonProps['onMouseEnter'] = (evt) => {\n if (!disabled && !configProps.loading) onMouseEnter?.(evt)\n }\n const handleMouseLeave: ButtonProps['onMouseLeave'] = (evt) => {\n if (!disabled && !configProps.loading) onMouseLeave?.(evt)\n }\n\n return (\n <Styled.Root\n {...configProps}\n {...linkProps}\n className={className}\n as={_as}\n color={color}\n fontColor={fontColor}\n disabled={disabled}\n rel={rel}\n display={display}\n rounded={rounded}\n size={size}\n fontWeight={fontWeight}\n borderRadius={borderRadius}\n basePadding={basePadding}\n fontBold={fontBold}\n brandPresetUsed={brandPresetUsed}\n ref={ref ?? configProps.innerRef}\n type={_as === 'button' ? _type : undefined}\n lineHeight={brandPresetUsed ? 1.2 : 1}\n width={configProps.round ? undefined : width}\n onClick={handleClick}\n onClickCapture={handleClickCapture}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n >\n {leftIcon && (\n <Styled.IconSlot className='icon' marginRight={!configProps.round}>\n {leftIcon}\n </Styled.IconSlot>\n )}\n {(content || children) && (\n <Styled.Content className={`${classNameContent}__content`}>{content || children}</Styled.Content>\n )}\n {rightIcon && !configProps.round && (\n <Styled.IconSlot className='icon' marginLeft>\n {rightIcon}\n </Styled.IconSlot>\n )}\n </Styled.Root>\n )\n})\n\nButton.displayName = COMPONENT_NAME\n\nexport { Button, COMPONENT_NAME }\n\nexport type { ButtonProps }\n"],"names":["COMPONENT_NAME","Button","forwardRef","props","ref","_theme$components","theme","useFallbackTheme","useConfigPriority","components","display","size","fontColor","color","disabled","rounded","width","as","_as","type","_type","className","_className","children","content","onClick","onClickCapture","onMouseEnter","onMouseLeave","_useConfigPriority","configProps","_objectWithoutProperties","_excluded","brandPresetUsed","preset","round","_PROPS_BY_SIZE","defaultProps","PROPS_BY_SIZE","m","mergeDeepLeft","useClassname","classNameContent","rel","useComputedRel","linkProps","useComputedLinkProps","href","to","Link","primary","secondary","fontWeight","fontBold","borderRadius","basePadding","leftIcon","rightIcon","Array","isArray","icon","loading","success","_jsx","Styled.SpinnerIcon","strokeWidth","Styled.CheckIcon","_jsxs","Styled.Root","innerRef","undefined","lineHeight","evt","Styled.IconSlot","marginRight","Styled.Content","concat","marginLeft","displayName"],"mappings":"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"}
1
+ {"version":3,"file":"Button.js","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { Link } from 'react-router-dom'\nimport { mergeDeepLeft } from 'ramda'\nimport { useClassname } from 'hooks/useClassname'\nimport { useFallbackTheme } from 'hooks/use-theme'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport { useComputedRel, useComputedLinkProps } from './hooks'\nimport { DEFAULT_PROPS_BY_SIZE, BRAND_PROPS_BY_SIZE, STATIC_SIZES } from './constants'\nimport type { ButtonProps, ButtonStaticSize } from './types'\n\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Button'\n\n/**\n * Main button\n */\nconst Button = forwardRef<HTMLElement, ButtonProps>((props, ref) => {\n const theme = useFallbackTheme()\n\n let {\n display = 'inline-flex',\n size = 'm',\n fontColor = 'white',\n color = 'accent',\n disabled = false,\n rounded = true,\n width = 'auto',\n as: _as = 'button',\n type: _type,\n className: _className,\n children,\n content,\n onClick,\n onClickCapture,\n onMouseEnter,\n onMouseLeave,\n ...configProps\n } = useConfigPriority<ButtonProps>(theme.components?.Button, props)\n\n let brandPresetUsed = theme.preset === 'brand'\n if (typeof configProps.preset === 'string') brandPresetUsed = configProps.preset === 'brand'\n\n const staticSize = STATIC_SIZES.includes(size as ButtonStaticSize)\n\n if (staticSize && !configProps.round) {\n const propsBySize = brandPresetUsed ? BRAND_PROPS_BY_SIZE : DEFAULT_PROPS_BY_SIZE\n const sizeProps = propsBySize[size as ButtonStaticSize] ?? propsBySize.m\n configProps = mergeDeepLeft(configProps, sizeProps) as ButtonProps\n }\n\n let basePadding = '0px'\n if (!staticSize && !configProps.round) basePadding = '1em 1.6em'\n\n const className = useClassname(COMPONENT_NAME, _className)\n const classNameContent = useClassname(COMPONENT_NAME)\n const rel = useComputedRel(theme, configProps)\n const linkProps = useComputedLinkProps(_as, disabled, configProps)\n\n if (configProps.href) _as = 'a'\n if (configProps.to) _as = Link\n\n if (configProps.primary) color = 'primary'\n if (configProps.secondary) color = 'atlantis'\n\n let fontWeight: ButtonProps['fontWeight'] = brandPresetUsed ? 800 : 600\n if (configProps.fontWeight) fontWeight = configProps.fontWeight\n\n const fontBold = (typeof fontWeight === 'number' && fontWeight >= 800) || fontWeight === 'bold'\n\n let borderRadius = '0px'\n if (rounded) borderRadius = brandPresetUsed ? '48px' : '5px'\n if (configProps.round) borderRadius = '50%'\n\n let [leftIcon, rightIcon] = Array.isArray(configProps.icon) ? configProps.icon : [configProps.icon]\n\n if (brandPresetUsed && configProps.loading && !configProps.success && !disabled) {\n leftIcon = <Styled.SpinnerIcon strokeWidth={fontBold ? 2.5 : 1.5} />\n rightIcon = null\n }\n if (configProps.success) {\n leftIcon = <Styled.CheckIcon strokeWidth={fontBold ? 3 : 1.5} />\n rightIcon = null\n }\n\n const handleClick: ButtonProps['onClick'] = (evt) => {\n if (!disabled && !configProps.loading) onClick?.(evt)\n }\n const handleClickCapture: ButtonProps['onClickCapture'] = (evt) => {\n if (!disabled && !configProps.loading) onClickCapture?.(evt)\n }\n const handleMouseEnter: ButtonProps['onMouseEnter'] = (evt) => {\n if (!disabled && !configProps.loading) onMouseEnter?.(evt)\n }\n const handleMouseLeave: ButtonProps['onMouseLeave'] = (evt) => {\n if (!disabled && !configProps.loading) onMouseLeave?.(evt)\n }\n\n return (\n <Styled.Root\n {...configProps}\n {...linkProps}\n className={className}\n as={_as}\n color={color}\n fontColor={fontColor}\n disabled={disabled}\n rel={rel}\n display={display}\n rounded={rounded}\n size={size}\n fontWeight={fontWeight}\n borderRadius={borderRadius}\n basePadding={basePadding}\n fontBold={fontBold}\n brandPresetUsed={brandPresetUsed}\n ref={ref ?? configProps.innerRef}\n type={_as === 'button' ? _type : undefined}\n lineHeight={brandPresetUsed ? 1.2 : 1}\n width={configProps.round ? undefined : width}\n onClick={handleClick}\n onClickCapture={handleClickCapture}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n >\n {leftIcon && (\n <Styled.IconSlot className='icon' marginRight={!configProps.round}>\n {leftIcon}\n </Styled.IconSlot>\n )}\n {(content || children) && (\n <Styled.Content className={`${classNameContent}__content`}>{content || children}</Styled.Content>\n )}\n {rightIcon && !configProps.round && (\n <Styled.IconSlot className='icon' marginLeft>\n {rightIcon}\n </Styled.IconSlot>\n )}\n </Styled.Root>\n )\n})\n\nButton.displayName = COMPONENT_NAME\n\nexport { Button, COMPONENT_NAME }\n\nexport type { ButtonProps }\n"],"names":["COMPONENT_NAME","Button","forwardRef","props","ref","_theme$components","theme","useFallbackTheme","useConfigPriority","components","display","size","fontColor","color","disabled","rounded","width","as","_as","type","_type","className","_className","children","content","onClick","onClickCapture","onMouseEnter","onMouseLeave","_useConfigPriority","configProps","_objectWithoutProperties","_excluded","brandPresetUsed","preset","staticSize","STATIC_SIZES","includes","round","_propsBySize","propsBySize","BRAND_PROPS_BY_SIZE","DEFAULT_PROPS_BY_SIZE","sizeProps","m","mergeDeepLeft","basePadding","useClassname","classNameContent","rel","useComputedRel","linkProps","useComputedLinkProps","href","to","Link","primary","secondary","fontWeight","fontBold","borderRadius","leftIcon","rightIcon","Array","isArray","icon","loading","success","_jsx","Styled.SpinnerIcon","strokeWidth","Styled.CheckIcon","_jsxs","Styled.Root","innerRef","lineHeight","evt","Styled.IconSlot","marginRight","Styled.Content","concat","marginLeft","displayName"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- var d=['id','to','target','ref','rel','href','type','disabled','className','style','form','onClick','onClickCapture','onMouseLeave','onMouseEnter','children'];var i={l:{fontSize:'l',fontSizeM:'m',height:60,heightM:56,heightS:52,paddingLeft:36,paddingRight:36,paddingLeftM:28,paddingRightM:28,paddingLeftS:24,paddingRightS:24},m:{fontSize:'m',height:52,paddingLeft:32,paddingRight:32,paddingLeftM:24,paddingRightM:24,paddingLeftS:20,paddingRightS:20},s:{fontSize:'s',height:40,paddingLeft:28,paddingRight:28,paddingLeftM:20,paddingRightM:20,paddingLeftS:16,paddingRightS:16},xs:{fontSize:'s',height:40,paddingLeft:28,paddingRight:28,paddingLeftM:20,paddingRightM:20,paddingLeftS:16,paddingRightS:16}};export{d as FORWARD_PROPS,i as PROPS_BY_SIZE};
1
+ var i=['id','to','target','ref','rel','href','type','disabled','className','style','form','onClick','onClickCapture','onMouseLeave','onMouseEnter','children'];var d=['xl','l','m','s','xs'];var g={xl:{fontSize:'xl',height:68,paddingLeft:40,paddingRight:40,paddingLeftM:36,paddingRightM:36,paddingLeftS:32,paddingRightS:32},l:{fontSize:'l',fontSizeM:'m',height:60,heightM:56,heightS:52,paddingLeft:36,paddingRight:36,paddingLeftM:28,paddingRightM:28,paddingLeftS:24,paddingRightS:24},m:{fontSize:'m',height:52,paddingLeft:32,paddingRight:32,paddingLeftM:24,paddingRightM:24,paddingLeftS:20,paddingRightS:20},s:{fontSize:'s',height:40,paddingLeft:28,paddingRight:28,paddingLeftM:20,paddingRightM:20,paddingLeftS:16,paddingRightS:16},xs:{fontSize:'s',height:40,paddingLeft:28,paddingRight:28,paddingLeftM:20,paddingRightM:20,paddingLeftS:16,paddingRightS:16}};var t={xl:{fontSize:18,height:56,paddingLeft:32,paddingRight:32},l:{fontSize:16,height:48,paddingLeft:26,paddingRight:26},m:{fontSize:16,height:44,paddingLeft:28,paddingRight:28},s:{fontSize:14,height:40,paddingLeft:24,paddingRight:24},xs:{fontSize:14,height:32,paddingLeft:16,paddingRight:16}};export{t as BRAND_PROPS_BY_SIZE,g as DEFAULT_PROPS_BY_SIZE,i as FORWARD_PROPS,d as STATIC_SIZES};
2
2
  //# sourceMappingURL=constants.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"constants.js","sources":["../../../../src/components/Button/constants.ts"],"sourcesContent":["import type { ButtonForwardProp, ButtonRootProps, ButtonStaticSize } from './types'\n\nexport const FORWARD_PROPS: ButtonForwardProp[] = [\n 'id',\n 'to',\n 'target',\n 'ref',\n 'rel',\n 'href',\n 'type',\n 'disabled',\n 'className',\n 'style',\n 'form',\n 'onClick',\n 'onClickCapture',\n 'onMouseLeave',\n 'onMouseEnter',\n 'children',\n]\n\nexport const PROPS_BY_SIZE: Record<ButtonStaticSize, Partial<ButtonRootProps>> = {\n l: {\n fontSize: 'l',\n fontSizeM: 'm',\n height: 60,\n heightM: 56,\n heightS: 52,\n paddingLeft: 36,\n paddingRight: 36,\n paddingLeftM: 28,\n paddingRightM: 28,\n paddingLeftS: 24,\n paddingRightS: 24,\n },\n m: {\n fontSize: 'm',\n height: 52,\n paddingLeft: 32,\n paddingRight: 32,\n paddingLeftM: 24,\n paddingRightM: 24,\n paddingLeftS: 20,\n paddingRightS: 20,\n },\n s: {\n fontSize: 's',\n height: 40,\n paddingLeft: 28,\n paddingRight: 28,\n paddingLeftM: 20,\n paddingRightM: 20,\n paddingLeftS: 16,\n paddingRightS: 16,\n },\n xs: {\n fontSize: 's',\n height: 40,\n paddingLeft: 28,\n paddingRight: 28,\n paddingLeftM: 20,\n paddingRightM: 20,\n paddingLeftS: 16,\n paddingRightS: 16,\n },\n}\n"],"names":["FORWARD_PROPS","PROPS_BY_SIZE","l","fontSize","fontSizeM","height","heightM","heightS","paddingLeft","paddingRight","paddingLeftM","paddingRightM","paddingLeftS","paddingRightS","m","s","xs"],"mappings":"AAEaA,IAAAA,EAAqC,CAChD,KACA,KACA,SACA,MACA,MACA,OACA,OACA,WACA,YACA,QACA,OACA,UACA,iBACA,eACA,eACA,YAGK,IAAMC,EAAoE,CAC/EC,EAAG,CACDC,SAAU,IACVC,UAAW,IACXC,OAAQ,GACRC,QAAS,GACTC,QAAS,GACTC,YAAa,GACbC,aAAc,GACdC,aAAc,GACdC,cAAe,GACfC,aAAc,GACdC,cAAe,IAEjBC,EAAG,CACDX,SAAU,IACVE,OAAQ,GACRG,YAAa,GACbC,aAAc,GACdC,aAAc,GACdC,cAAe,GACfC,aAAc,GACdC,cAAe,IAEjBE,EAAG,CACDZ,SAAU,IACVE,OAAQ,GACRG,YAAa,GACbC,aAAc,GACdC,aAAc,GACdC,cAAe,GACfC,aAAc,GACdC,cAAe,IAEjBG,GAAI,CACFb,SAAU,IACVE,OAAQ,GACRG,YAAa,GACbC,aAAc,GACdC,aAAc,GACdC,cAAe,GACfC,aAAc,GACdC,cAAe"}
1
+ {"version":3,"file":"constants.js","sources":["../../../../src/components/Button/constants.ts"],"sourcesContent":["import type { ButtonForwardProp, ButtonRootProps, ButtonStaticSize } from './types'\n\nexport const FORWARD_PROPS: ButtonForwardProp[] = [\n 'id',\n 'to',\n 'target',\n 'ref',\n 'rel',\n 'href',\n 'type',\n 'disabled',\n 'className',\n 'style',\n 'form',\n 'onClick',\n 'onClickCapture',\n 'onMouseLeave',\n 'onMouseEnter',\n 'children',\n]\n\nexport const STATIC_SIZES: ButtonStaticSize[] = ['xl', 'l', 'm', 's', 'xs']\n\nexport const DEFAULT_PROPS_BY_SIZE: Record<ButtonStaticSize, Partial<ButtonRootProps>> = {\n xl: {\n fontSize: 'xl',\n height: 68,\n paddingLeft: 40,\n paddingRight: 40,\n paddingLeftM: 36,\n paddingRightM: 36,\n paddingLeftS: 32,\n paddingRightS: 32,\n },\n l: {\n fontSize: 'l',\n fontSizeM: 'm',\n height: 60,\n heightM: 56,\n heightS: 52,\n paddingLeft: 36,\n paddingRight: 36,\n paddingLeftM: 28,\n paddingRightM: 28,\n paddingLeftS: 24,\n paddingRightS: 24,\n },\n m: {\n fontSize: 'm',\n height: 52,\n paddingLeft: 32,\n paddingRight: 32,\n paddingLeftM: 24,\n paddingRightM: 24,\n paddingLeftS: 20,\n paddingRightS: 20,\n },\n s: {\n fontSize: 's',\n height: 40,\n paddingLeft: 28,\n paddingRight: 28,\n paddingLeftM: 20,\n paddingRightM: 20,\n paddingLeftS: 16,\n paddingRightS: 16,\n },\n xs: {\n fontSize: 's',\n height: 40,\n paddingLeft: 28,\n paddingRight: 28,\n paddingLeftM: 20,\n paddingRightM: 20,\n paddingLeftS: 16,\n paddingRightS: 16,\n },\n}\n\nexport const BRAND_PROPS_BY_SIZE: Record<ButtonStaticSize, Partial<ButtonRootProps>> = {\n xl: {\n fontSize: 18,\n height: 56,\n paddingLeft: 32,\n paddingRight: 32,\n },\n l: {\n fontSize: 16,\n height: 48,\n paddingLeft: 26,\n paddingRight: 26,\n },\n m: {\n fontSize: 16,\n height: 44,\n paddingLeft: 28,\n paddingRight: 28,\n },\n s: {\n fontSize: 14,\n height: 40,\n paddingLeft: 24,\n paddingRight: 24,\n },\n xs: {\n fontSize: 14,\n height: 32,\n paddingLeft: 16,\n paddingRight: 16,\n },\n}\n"],"names":["FORWARD_PROPS","STATIC_SIZES","DEFAULT_PROPS_BY_SIZE","xl","fontSize","height","paddingLeft","paddingRight","paddingLeftM","paddingRightM","paddingLeftS","paddingRightS","l","fontSizeM","heightM","heightS","m","s","xs","BRAND_PROPS_BY_SIZE"],"mappings":"AAEaA,IAAAA,EAAqC,CAChD,KACA,KACA,SACA,MACA,MACA,OACA,OACA,WACA,YACA,QACA,OACA,UACA,iBACA,eACA,eACA,YAGWC,IAAAA,EAAmC,CAAC,KAAM,IAAK,IAAK,IAAK,MAE/D,IAAMC,EAA4E,CACvFC,GAAI,CACFC,SAAU,KACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,GACdC,aAAc,GACdC,cAAe,GACfC,aAAc,GACdC,cAAe,IAEjBC,EAAG,CACDR,SAAU,IACVS,UAAW,IACXR,OAAQ,GACRS,QAAS,GACTC,QAAS,GACTT,YAAa,GACbC,aAAc,GACdC,aAAc,GACdC,cAAe,GACfC,aAAc,GACdC,cAAe,IAEjBK,EAAG,CACDZ,SAAU,IACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,GACdC,aAAc,GACdC,cAAe,GACfC,aAAc,GACdC,cAAe,IAEjBM,EAAG,CACDb,SAAU,IACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,GACdC,aAAc,GACdC,cAAe,GACfC,aAAc,GACdC,cAAe,IAEjBO,GAAI,CACFd,SAAU,IACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,GACdC,aAAc,GACdC,cAAe,GACfC,aAAc,GACdC,cAAe,KAIZ,IAAMQ,EAA0E,CACrFhB,GAAI,CACFC,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBK,EAAG,CACDR,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBS,EAAG,CACDZ,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBU,EAAG,CACDb,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBW,GAAI,CACFd,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc"}
@@ -1,2 +1,2 @@
1
- import o,{css as n,keyframes as r}from'styled-components';import e from'tinycolor2';import{injectDefaultTheme as t}from'../../shared/utils/inject-theme.js';import{property as a,responsiveNamedProperty as c,responsiveProperty as i}from'../../mixins/responsive-property.js';import{color as s}from'../../mixins/color.js';import{FORWARD_PROPS as d}from'./constants.js';import l from'./images/check.module.svg.js';import g from'./images/spinner.module.svg.js';var p={l:20,m:18,s:16,xs:14};var m=['l','m','s','xs'];var h={l:280,m:245,s:180,xs:140};var b={l:52,m:48,s:40,xs:32};var u=n(["",""],(o=>"\n display: ".concat(o.display,";\n font-weight: ").concat(o.fontWeight,";\n border-radius: ").concat(o.borderRadius,";\n line-height: ").concat(o.lineHeight,";\n padding: ").concat(o.basePadding,";\n box-sizing: border-box;\n position: relative;\n isolation: isolate;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n cursor: pointer;\n user-select: none;\n border: none;\n text-decoration: none;\n appearance: none;\n white-space: nowrap;\n text-align: center;\n vertical-align: top;\n transition-property: color, background-color, box-shadow;\n &::before, \n &::after {\n transition-property: opacity;\n }\n &, \n &::before,\n &::after {\n transition-duration: 200ms;\n }\n & + & {\n margin-left: ").concat(o.noSpacing?'auto':'1em',";\n }\n ")));var f=r(["0%{background-position:0 0;}100%{background-position:50px 50px;}"]);var v=r(["100%{transform:rotate(360deg);}"]);var y=n(["background-image:linear-gradient( -45deg,rgba(255,255,255,0.2) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.2) 50%,rgba(255,255,255,0.2) 75%,transparent 75%,transparent );background-size:25px 25px;animation:"," 2s linear infinite;cursor:progress;"],f);var L=o=>'auto'===o?'auto':'number'==typeof o||'boolean'==typeof o?o:o&&h[o]?h[o]:'auto';var S=function(o,r){var e=arguments.length>1&&void 0!==r?r:'px';return n(["width:","",";height:","",";font-size:","",";line-height:","",";padding:","",";"],o,e,o,e,.44*o,e,.44*o,e,.28*o,e)};var x=()=>n(["min-width:initial;width:100%;"]);var X="\n content: '';\n position: absolute;\n inset: 0;\n border-radius: inherit;\n";var w={filled:{default:n(["",""],(o=>{var n=o.theme.colors['bg-brand-primary-basic'];o.black&&(n=o.theme.colors['bg-onmain-contrast']),o.danger&&(n=o.theme.colors['alert-bg-error-500']),o.success&&(n=o.theme.colors['alert-bg-success-500']),o.disabled&&(n=o.theme.colors['bg-disabled-large']);var r=o.theme.colors['content-oncolor-primary'];o.disabled&&(r=o.theme.colors['content-disabled']);var e=o.theme.colors['bg-oncolor-hover'];return o.black&&!o.danger&&(e=o.theme.colors['bg-oncontrast-hover']),"\n background-color: ".concat(n,";\n color: ").concat(r,";\n\n &::before {\n ").concat(X,"\n background-color: ").concat(e,";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n ","\n ")})),onColored:n(["",""],(o=>{var n=o.theme.colors['bg-oncolor-primary'];o.disabled&&(n=o.theme.colors['bg-oncolor-disabled']);var r=o.theme.colors['content-oncolor-constant'];return o.success&&(r=o.theme.colors['alert-success']),o.disabled&&(r=o.theme.colors['content-oncolor-disabled']),"\n background-color: ".concat(n,";\n color: ").concat(r,";\n \n &::before {\n ").concat(X,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n ","\n ")}))},outline:{default:n(["",""],(o=>{var n='transparent';!o.loading||o.success||o.black||o.danger||(n=o.theme.colors['bg-brand-primary-basic']),o.loading&&!o.success&&o.black&&(n=o.theme.colors['bg-onmain-contrast']),o.loading&&!o.success&&o.danger&&(n=o.theme.colors['alert-bg-error-500']),o.success&&(n=o.theme.colors['alert-bg-success-500']),o.disabled&&(n=o.theme.colors['bg-disabled-large']);var r=o.theme.colors['content-brand-primary'];o.black&&(r=o.theme.colors['content-oncolor-inverse']),o.danger&&(r=o.theme.colors['alert-error']),(o.success||o.loading)&&(r=o.theme.colors['content-oncolor-primary']),o.disabled&&(r=o.theme.colors['content-disabled']);var e=o.theme.colors['border-brand-primary'];o.black&&(e=o.theme.colors['border-onmain-contrast']),o.danger&&(e=o.theme.colors['alert-bg-error-500']),o.loading&&!o.success&&(e='transparent'),o.success&&(e=o.theme.colors['alert-bg-success-500']),o.disabled&&(e=o.theme.colors['bg-disabled-large']);var t=o.theme.colors['bg-brand-primary-basic'];o.black&&(t=o.theme.colors['bg-onmain-contrast']),o.danger&&(t=o.theme.colors['alert-bg-error-500']);var a=o.theme.colors['bg-oncolor-hover'];return o.black&&!o.danger&&(a=o.theme.colors['bg-oncontrast-hover']),"\n background-color: ".concat(n,";\n color: ").concat(r,";\n box-shadow: inset 0 0 0 ").concat(o.fontBold?2:1,"px ").concat(e,";\n\n &::before {\n ").concat(X,"\n background-color: ").concat(t,";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n background-color: ").concat(a,";\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover {\n color: ".concat(o.theme.colors['content-oncolor-primary'],";\n box-shadow: none;\n }\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n "),"\n ")})),onColored:n(["",""],(o=>{var n='transparent';(o.success||o.loading)&&(n=o.theme.colors['bg-oncolor-primary']),o.disabled&&(n=o.theme.colors['bg-oncolor-disabled']);var r=o.theme.colors['content-oncolor-primary'];o.loading&&!o.success&&(r=o.theme.colors['content-oncolor-constant']),o.success&&(r=o.theme.colors['alert-success']),o.disabled&&(r=o.theme.colors['content-oncolor-disabled']);var e=o.theme.colors['border-oncolor-default'];return o.disabled&&(e='transparent'),"\n background-color: ".concat(n,";\n color: ").concat(r,";\n box-shadow: inset 0 0 0 ").concat(o.fontBold?2:1,"px ").concat(e,";\n\n &::before {\n ").concat(X,"\n background-color: ").concat(o.theme.colors['bg-oncolor-primary'],";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover {\n color: ".concat(o.theme.colors['content-oncolor-constant'],";\n box-shadow: none;\n }\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n "),"\n ")}))},base:{default:n(["",""],(o=>{var n=o.theme.colors['bg-onmain-tertiary'];o.success&&(n=o.theme.colors['alert-bg-success-500']),o.disabled&&(n=o.theme.colors['bg-disabled-large']);var r=o.theme.colors['content-brand-primary'];return o.black&&(r=o.theme.colors['content-oncolor-inverse']),o.danger&&(r=o.theme.colors['alert-error']),o.success&&(r=o.theme.colors['content-oncolor-primary']),o.disabled&&(r=o.theme.colors['content-disabled']),"\n background-color: ".concat(n,";\n color: ").concat(r,";\n\n &::before {\n ").concat(X,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n ","\n ")})),onColored:n(["",""],(o=>{var n=o.theme.colors['bg-oncolor-secondary'];o.success&&(n=o.theme.colors['bg-oncolor-primary']),o.disabled&&(n=o.theme.colors['bg-oncolor-disabled']);var r=o.theme.colors['content-oncolor-primary'];return o.success&&(r=o.theme.colors['alert-success']),o.disabled&&(r=o.theme.colors['content-oncolor-disabled']),"\n background-color: ".concat(n,";\n color: ").concat(r,";\n\n &::before {\n ").concat(X,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n ","\n ")}))},clear:{default:n(["",""],(o=>{var n=o.theme.colors['content-brand-primary'];return o.black&&(n=o.theme.colors['content-oncolor-inverse']),o.danger&&(n=o.theme.colors['alert-error']),o.success&&(n=o.theme.colors['alert-success']),o.disabled&&(n=o.theme.colors['content-disabled']),"\n background-color: transparent;\n color: ".concat(n,";\n\n &::before {\n ").concat(X,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n ","\n ")})),onColored:n(["",""],(o=>{var n=o.theme.colors['content-oncolor-primary'];return o.disabled&&(n=o.theme.colors['content-oncolor-disabled']),"\n background-color: transparent;\n color: ".concat(n,";\n\n &::before {\n ").concat(X,"\n background-color: ").concat(o.theme.colors['bg-oncontrast-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncontrast-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n ","\n ")}))}};var k={default:n([""," "," "," "," "," ",""],(o=>o.disabled||o.loading?'':"\n &:active {\n box-shadow: inset 0 4px 0px 0px rgba(0, 0, 0, 0.14);\n }\n &:hover {\n color: ".concat(o.fontColor,";\n background-color: ").concat(e(o.theme.colors[o.color]).saturate(-5).lighten(-8).toString(),";\n }\n ").concat(o.inverted||o.basic||o.outline?"\n &:not(:hover) {\n border: 1px solid ".concat(o.theme.colors[o.color],";\n }\n &:hover {\n border: 1px solid ").concat(o.theme.colors[o.color],";\n } \n "):'',"\n ")),(o=>o.loading?y:''),(o=>{var n='background-color';return(o.inverted||o.basic||o.outline)&&(n='color'),s(o.color,n)}),(o=>{var n='color';return(o.inverted||o.basic||o.outline)&&(n='background-color'),s(o.fontColor,n)}),(o=>o.disabled?"\n cursor: not-allowed;\n background-color: ".concat(o.theme.colors.mercury,";\n color: ").concat(o.theme.colors.silver,";\n "):''),(o=>o.basic||o.outline?'background-color: transparent;':''))};var z=o.button.withConfig({shouldForwardProp:o=>d.includes(o)||o.includes('data')}).attrs(t).withConfig({componentId:"fox-ui__sc-16o31r2-0"})([""," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," ",""],u,(o=>o.brandPresetUsed?!o.clear||o.base||o.outline||o.onColored?o.clear&&!o.base&&!o.outline&&o.onColored?w.clear.onColored:!o.base||o.clear||o.outline||o.onColored?o.base&&!o.clear&&!o.outline&&o.onColored?w.base.onColored:!o.outline||o.clear||o.base||o.onColored?o.outline&&!o.clear&&!o.base&&o.onColored?w.outline.onColored:o.onColored?w.filled.onColored:w.filled.default:w.outline.default:w.base.default:w.clear.default:k.default),(o=>o.brandPresetUsed?m.includes(o.size)?"font-size: ".concat(p[o.size],"px;"):i('size','font-size'):''),(o=>o.brandPresetUsed||!o.round?'':m.includes(o.size)?a(b[o.size],S):''),(o=>o.padding?a(o.padding,'padding'):null),(o=>o.paddingTop?a(o.paddingTop,'padding-top'):null),(o=>o.paddingRight?a(o.paddingRight,'padding-right'):null),(o=>o.paddingBottom?a(o.paddingBottom,'padding-bottom'):null),(o=>o.paddingLeft?a(o.paddingLeft,'padding-left'):null),(o=>o.margin?a(o.margin,'margin'):null),(o=>o.marginTop?a(o.marginTop,'margin-top'):null),(o=>o.marginRight?a(o.marginRight,'margin-right'):null),(o=>o.marginBottom?a(o.marginBottom,'margin-bottom'):null),(o=>o.marginLeft?a(o.marginLeft,'margin-left'):null),(o=>o.fontSize?a(o.fontSize,'font-size'):null),(o=>o.height?a(o.height,'height'):null),(o=>{var n=o.fluid&&'auto'!==o.width?'max-width':'width';return o.width?a(L(o.width),n):null}),(o=>{var{paddingXS:n,paddingS:r,paddingM:e,paddingL:t,paddingXL:a}=o;return c({sizes:{paddingXS:n,paddingS:r,paddingM:e,paddingL:t,paddingXL:a},cssProperty:'padding'})}),(o=>{var{paddingTopXS:n,paddingTopS:r,paddingTopM:e,paddingTopL:t,paddingTopXL:a}=o;return c({sizes:{paddingTopXS:n,paddingTopS:r,paddingTopM:e,paddingTopL:t,paddingTopXL:a},cssProperty:'padding-top'})}),(o=>{var{paddingRightXS:n,paddingRightS:r,paddingRightM:e,paddingRightL:t,paddingRightXL:a}=o;return c({sizes:{paddingRightXS:n,paddingRightS:r,paddingRightM:e,paddingRightL:t,paddingRightXL:a},cssProperty:'padding-right'})}),(o=>{var{paddingBottomXS:n,paddingBottomS:r,paddingBottomM:e,paddingBottomL:t,paddingBottomXL:a}=o;return c({sizes:{paddingBottomXS:n,paddingBottomS:r,paddingBottomM:e,paddingBottomL:t,paddingBottomXL:a},cssProperty:'padding-bottom'})}),(o=>{var{paddingLeftXS:n,paddingLeftS:r,paddingLeftM:e,paddingLeftL:t,paddingLeftXL:a}=o;return c({sizes:{paddingLeftXS:n,paddingLeftS:r,paddingLeftM:e,paddingLeftL:t,paddingLeftXL:a},cssProperty:'padding-left'})}),(o=>{var{marginXS:n,marginS:r,marginM:e,marginL:t,marginXL:a}=o;return c({sizes:{marginXS:n,marginS:r,marginM:e,marginL:t,marginXL:a},cssProperty:'margin'})}),(o=>{var{marginTopXS:n,marginTopS:r,marginTopM:e,marginTopL:t,marginTopXL:a}=o;return c({sizes:{marginTopXS:n,marginTopS:r,marginTopM:e,marginTopL:t,marginTopXL:a},cssProperty:'margin-top'})}),(o=>{var{marginRightXS:n,marginRightS:r,marginRightM:e,marginRightL:t,marginRightXL:a}=o;return c({sizes:{marginRightXS:n,marginRightS:r,marginRightM:e,marginRightL:t,marginRightXL:a},cssProperty:'margin-right'})}),(o=>{var{marginBottomXS:n,marginBottomS:r,marginBottomM:e,marginBottomL:t,marginBottomXL:a}=o;return c({sizes:{marginBottomXS:n,marginBottomS:r,marginBottomM:e,marginBottomL:t,marginBottomXL:a},cssProperty:'margin-bottom'})}),(o=>{var{marginLeftXS:n,marginLeftS:r,marginLeftM:e,marginLeftL:t,marginLeftXL:a}=o;return c({sizes:{marginLeftXS:n,marginLeftS:r,marginLeftM:e,marginLeftL:t,marginLeftXL:a},cssProperty:'margin-left'})}),(o=>{var{fontSizeXS:n,fontSizeS:r,fontSizeM:e,fontSizeL:t,fontSizeXL:a}=o;return c({sizes:{fontSizeXS:n,fontSizeS:r,fontSizeM:e,fontSizeL:t,fontSizeXL:a},cssProperty:'font-size'})}),(o=>{var{heightXS:n,heightS:r,heightM:e,heightL:t,heightXL:a}=o;return c({sizes:{heightXS:n,heightS:r,heightM:e,heightL:t,heightXL:a},cssProperty:'height'})}),(o=>{var{widthXS:n,widthS:r,widthM:e,widthL:t,widthXL:a,fluid:i,width:s}=o;return c({sizes:{widthXS:n,widthS:r,widthM:e,widthL:t,widthXL:a},cssProperty:i&&'auto'!==s?'max-width':'width',customSizeHandler:L})}),(o=>o.fluid?a(o.fluid,x):null),(o=>{var{fluidXS:n,fluidS:r,fluidM:e,fluidL:t,fluidXL:a}=o;return c({sizes:{fluidXS:n,fluidS:r,fluidM:e,fluidL:t,fluidXL:a},cssProperty:x})}));var R=o.span.withConfig({componentId:"fox-ui__sc-16o31r2-1"})(["",""],(o=>"\n position: relative;\n z-index: 1;\n display: flex;\n flex-shrink: 0;\n width: 1em;\n height: 1em;\n margin-left: ".concat(o.marginLeft?'0.4em':0,";\n margin-right: ").concat(o.marginRight?'0.4em':0,";\n ")));var M=o.span.withConfig({componentId:"fox-ui__sc-16o31r2-2"})(["position:relative;z-index:1;"]);var B=o(g).withConfig({componentId:"fox-ui__sc-16o31r2-3"})(["width:100%;animation:"," 2000ms linear infinite;",""],v,(o=>"\n > path {\n stroke-width: ".concat(o.strokeWidth,";\n }\n ")));var C=o(l).withConfig({componentId:"fox-ui__sc-16o31r2-4"})(["width:100%;",""],(o=>"\n > path {\n stroke-width: ".concat(o.strokeWidth,";\n }\n ")));export{C as CheckIcon,M as Content,R as IconSlot,z as Root,B as SpinnerIcon};
1
+ import o,{css as n,keyframes as r}from'styled-components';import e from'tinycolor2';import{injectDefaultTheme as t}from'../../shared/utils/inject-theme.js';import{property as a,responsiveNamedProperty as c,responsiveProperty as i}from'../../mixins/responsive-property.js';import{color as s}from'../../mixins/color.js';import{FORWARD_PROPS as d,STATIC_SIZES as l}from'./constants.js';import g from'./images/check.module.svg.js';import p from'./images/spinner.module.svg.js';var m={xl:320,l:280,m:245,s:180,xs:140};var h={xl:60,l:52,m:48,s:40,xs:32};var b={xl:18,l:16,m:16,s:14,xs:14};var u=n(["",""],(o=>"\n display: ".concat(o.display,";\n font-weight: ").concat(o.fontWeight,";\n border-radius: ").concat(o.borderRadius,";\n line-height: ").concat(o.lineHeight,";\n padding: ").concat(o.basePadding,";\n box-sizing: border-box;\n position: relative;\n isolation: isolate;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n cursor: pointer;\n user-select: none;\n border: none;\n text-decoration: none;\n appearance: none;\n white-space: nowrap;\n text-align: center;\n vertical-align: top;\n transition-property: color, background-color, box-shadow;\n &::before, \n &::after {\n transition-property: opacity;\n }\n &, \n &::before,\n &::after {\n transition-duration: 200ms;\n }\n & + & {\n margin-left: ").concat(o.noSpacing?'auto':'1em',";\n }\n ")));var f=r(["0%{background-position:0 0;}100%{background-position:50px 50px;}"]);var v=r(["100%{transform:rotate(360deg);}"]);var y=n(["background-image:linear-gradient( -45deg,rgba(255,255,255,0.2) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.2) 50%,rgba(255,255,255,0.2) 75%,transparent 75%,transparent );background-size:25px 25px;animation:"," 2s linear infinite;cursor:progress;"],f);var L=o=>'auto'===o?'auto':'number'==typeof o||'boolean'==typeof o?o:o&&m[o]?m[o]:'auto';var S=function(o,r){var e=arguments.length>1&&void 0!==r?r:'px';return n(["width:","",";height:","",";font-size:","",";line-height:","",";padding:","",";"],o,e,o,e,.44*o,e,.44*o,e,.28*o,e)};var x=()=>n(["min-width:initial;width:100%;"]);var X="\n content: '';\n position: absolute;\n inset: 0;\n border-radius: inherit;\n";var w={filled:{default:n(["",""],(o=>{var n=o.theme.colors['bg-brand-primary-basic'];o.black&&(n=o.theme.colors['bg-onmain-contrast']),o.danger&&(n=o.theme.colors['alert-bg-error-500']),o.success&&(n=o.theme.colors['alert-bg-success-500']),o.disabled&&(n=o.theme.colors['bg-disabled-large']);var r=o.theme.colors['content-oncolor-primary'];o.disabled&&(r=o.theme.colors['content-disabled']);var e=o.theme.colors['bg-oncolor-hover'];return o.black&&!o.danger&&(e=o.theme.colors['bg-oncontrast-hover']),"\n background-color: ".concat(n,";\n color: ").concat(r,";\n\n &::before {\n ").concat(X,"\n background-color: ").concat(e,";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n ","\n ")})),onColored:n(["",""],(o=>{var n=o.theme.colors['bg-oncolor-primary'];o.disabled&&(n=o.theme.colors['bg-oncolor-disabled']);var r=o.theme.colors['content-oncolor-constant'];return o.success&&(r=o.theme.colors['alert-success']),o.disabled&&(r=o.theme.colors['content-oncolor-disabled']),"\n background-color: ".concat(n,";\n color: ").concat(r,";\n \n &::before {\n ").concat(X,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n ","\n ")}))},outline:{default:n(["",""],(o=>{var n='transparent';!o.loading||o.success||o.black||o.danger||(n=o.theme.colors['bg-brand-primary-basic']),o.loading&&!o.success&&o.black&&(n=o.theme.colors['bg-onmain-contrast']),o.loading&&!o.success&&o.danger&&(n=o.theme.colors['alert-bg-error-500']),o.success&&(n=o.theme.colors['alert-bg-success-500']),o.disabled&&(n=o.theme.colors['bg-disabled-large']);var r=o.theme.colors['content-brand-primary'];o.black&&(r=o.theme.colors['content-oncolor-inverse']),o.danger&&(r=o.theme.colors['alert-error']),(o.success||o.loading)&&(r=o.theme.colors['content-oncolor-primary']),o.disabled&&(r=o.theme.colors['content-disabled']);var e=o.theme.colors['border-brand-primary'];o.black&&(e=o.theme.colors['border-onmain-contrast']),o.danger&&(e=o.theme.colors['alert-bg-error-500']),o.loading&&!o.success&&(e='transparent'),o.success&&(e=o.theme.colors['alert-bg-success-500']),o.disabled&&(e=o.theme.colors['bg-disabled-large']);var t=o.theme.colors['bg-brand-primary-basic'];o.black&&(t=o.theme.colors['bg-onmain-contrast']),o.danger&&(t=o.theme.colors['alert-bg-error-500']);var a=o.theme.colors['bg-oncolor-hover'];return o.black&&!o.danger&&(a=o.theme.colors['bg-oncontrast-hover']),"\n background-color: ".concat(n,";\n color: ").concat(r,";\n box-shadow: inset 0 0 0 ").concat(o.fontBold?2:1,"px ").concat(e,";\n\n &::before {\n ").concat(X,"\n background-color: ").concat(t,";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n background-color: ").concat(a,";\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover {\n color: ".concat(o.theme.colors['content-oncolor-primary'],";\n box-shadow: none;\n }\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n "),"\n ")})),onColored:n(["",""],(o=>{var n='transparent';(o.success||o.loading)&&(n=o.theme.colors['bg-oncolor-primary']),o.disabled&&(n=o.theme.colors['bg-oncolor-disabled']);var r=o.theme.colors['content-oncolor-primary'];o.loading&&!o.success&&(r=o.theme.colors['content-oncolor-constant']),o.success&&(r=o.theme.colors['alert-success']),o.disabled&&(r=o.theme.colors['content-oncolor-disabled']);var e=o.theme.colors['border-oncolor-default'];return o.disabled&&(e='transparent'),"\n background-color: ".concat(n,";\n color: ").concat(r,";\n box-shadow: inset 0 0 0 ").concat(o.fontBold?2:1,"px ").concat(e,";\n\n &::before {\n ").concat(X,"\n background-color: ").concat(o.theme.colors['bg-oncolor-primary'],";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover {\n color: ".concat(o.theme.colors['content-oncolor-constant'],";\n box-shadow: none;\n }\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n "),"\n ")}))},base:{default:n(["",""],(o=>{var n=o.theme.colors['bg-onmain-tertiary'];o.success&&(n=o.theme.colors['alert-bg-success-500']),o.disabled&&(n=o.theme.colors['bg-disabled-large']);var r=o.theme.colors['content-brand-primary'];return o.black&&(r=o.theme.colors['content-oncolor-inverse']),o.danger&&(r=o.theme.colors['alert-error']),o.success&&(r=o.theme.colors['content-oncolor-primary']),o.disabled&&(r=o.theme.colors['content-disabled']),"\n background-color: ".concat(n,";\n color: ").concat(r,";\n\n &::before {\n ").concat(X,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n ","\n ")})),onColored:n(["",""],(o=>{var n=o.theme.colors['bg-oncolor-secondary'];o.success&&(n=o.theme.colors['bg-oncolor-primary']),o.disabled&&(n=o.theme.colors['bg-oncolor-disabled']);var r=o.theme.colors['content-oncolor-primary'];return o.success&&(r=o.theme.colors['alert-success']),o.disabled&&(r=o.theme.colors['content-oncolor-disabled']),"\n background-color: ".concat(n,";\n color: ").concat(r,";\n\n &::before {\n ").concat(X,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n ","\n ")}))},clear:{default:n(["",""],(o=>{var n=o.theme.colors['content-brand-primary'];return o.black&&(n=o.theme.colors['content-oncolor-inverse']),o.danger&&(n=o.theme.colors['alert-error']),o.success&&(n=o.theme.colors['alert-success']),o.disabled&&(n=o.theme.colors['content-disabled']),"\n background-color: transparent;\n color: ".concat(n,";\n\n &::before {\n ").concat(X,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n ","\n ")})),onColored:n(["",""],(o=>{var n=o.theme.colors['content-oncolor-primary'];return o.disabled&&(n=o.theme.colors['content-oncolor-disabled']),"\n background-color: transparent;\n color: ".concat(n,";\n\n &::before {\n ").concat(X,"\n background-color: ").concat(o.theme.colors['bg-oncontrast-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(X,"\n box-shadow: inset 0px 4px 0px ").concat(o.theme.colors['bg-oncontrast-hover'],";\n opacity: 0;\n }\n\n ").concat(o.disabled||o.success||o.loading?'cursor: default;':"\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n ","\n ")}))}};var k={default:n([""," "," "," "," "," ",""],(o=>o.disabled||o.loading?'':"\n &:active {\n box-shadow: inset 0 4px 0px 0px rgba(0, 0, 0, 0.14);\n }\n &:hover {\n color: ".concat(o.fontColor,";\n background-color: ").concat(e(o.theme.colors[o.color]).saturate(-5).lighten(-8).toString(),";\n }\n ").concat(o.inverted||o.basic||o.outline?"\n &:not(:hover) {\n border: 1px solid ".concat(o.theme.colors[o.color],";\n }\n &:hover {\n border: 1px solid ").concat(o.theme.colors[o.color],";\n } \n "):'',"\n ")),(o=>o.loading?y:''),(o=>{var n='background-color';return(o.inverted||o.basic||o.outline)&&(n='color'),s(o.color,n)}),(o=>{var n='color';return(o.inverted||o.basic||o.outline)&&(n='background-color'),s(o.fontColor,n)}),(o=>o.disabled?"\n cursor: not-allowed;\n background-color: ".concat(o.theme.colors.mercury,";\n color: ").concat(o.theme.colors.silver,";\n "):''),(o=>o.basic||o.outline?'background-color: transparent;':''))};var z=o.button.withConfig({shouldForwardProp:o=>d.includes(o)||o.includes('data')}).attrs(t).withConfig({componentId:"fox-ui__sc-16o31r2-0"})([""," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," ",""],u,(o=>o.brandPresetUsed?!o.clear||o.base||o.outline||o.onColored?o.clear&&!o.base&&!o.outline&&o.onColored?w.clear.onColored:!o.base||o.clear||o.outline||o.onColored?o.base&&!o.clear&&!o.outline&&o.onColored?w.base.onColored:!o.outline||o.clear||o.base||o.onColored?o.outline&&!o.clear&&!o.base&&o.onColored?w.outline.onColored:o.onColored?w.filled.onColored:w.filled.default:w.outline.default:w.base.default:w.clear.default:k.default),(o=>l.includes(o.size)?'':i('size','font-size')),(o=>o.round?l.includes(o.size)?o.brandPresetUsed?"font-size: ".concat(b[o.size],"px;\n padding: 1em;"):a(h[o.size],S):'padding: 1em;':''),(o=>o.padding?a(o.padding,'padding'):null),(o=>o.paddingTop?a(o.paddingTop,'padding-top'):null),(o=>o.paddingRight?a(o.paddingRight,'padding-right'):null),(o=>o.paddingBottom?a(o.paddingBottom,'padding-bottom'):null),(o=>o.paddingLeft?a(o.paddingLeft,'padding-left'):null),(o=>o.margin?a(o.margin,'margin'):null),(o=>o.marginTop?a(o.marginTop,'margin-top'):null),(o=>o.marginRight?a(o.marginRight,'margin-right'):null),(o=>o.marginBottom?a(o.marginBottom,'margin-bottom'):null),(o=>o.marginLeft?a(o.marginLeft,'margin-left'):null),(o=>o.fontSize?a(o.fontSize,'font-size'):null),(o=>o.height?a(o.height,'height'):null),(o=>{var n=o.fluid&&'auto'!==o.width?'max-width':'width';return o.width?a(L(o.width),n):null}),(o=>{var{paddingXS:n,paddingS:r,paddingM:e,paddingL:t,paddingXL:a}=o;return c({sizes:{paddingXS:n,paddingS:r,paddingM:e,paddingL:t,paddingXL:a},cssProperty:'padding'})}),(o=>{var{paddingTopXS:n,paddingTopS:r,paddingTopM:e,paddingTopL:t,paddingTopXL:a}=o;return c({sizes:{paddingTopXS:n,paddingTopS:r,paddingTopM:e,paddingTopL:t,paddingTopXL:a},cssProperty:'padding-top'})}),(o=>{var{paddingRightXS:n,paddingRightS:r,paddingRightM:e,paddingRightL:t,paddingRightXL:a}=o;return c({sizes:{paddingRightXS:n,paddingRightS:r,paddingRightM:e,paddingRightL:t,paddingRightXL:a},cssProperty:'padding-right'})}),(o=>{var{paddingBottomXS:n,paddingBottomS:r,paddingBottomM:e,paddingBottomL:t,paddingBottomXL:a}=o;return c({sizes:{paddingBottomXS:n,paddingBottomS:r,paddingBottomM:e,paddingBottomL:t,paddingBottomXL:a},cssProperty:'padding-bottom'})}),(o=>{var{paddingLeftXS:n,paddingLeftS:r,paddingLeftM:e,paddingLeftL:t,paddingLeftXL:a}=o;return c({sizes:{paddingLeftXS:n,paddingLeftS:r,paddingLeftM:e,paddingLeftL:t,paddingLeftXL:a},cssProperty:'padding-left'})}),(o=>{var{marginXS:n,marginS:r,marginM:e,marginL:t,marginXL:a}=o;return c({sizes:{marginXS:n,marginS:r,marginM:e,marginL:t,marginXL:a},cssProperty:'margin'})}),(o=>{var{marginTopXS:n,marginTopS:r,marginTopM:e,marginTopL:t,marginTopXL:a}=o;return c({sizes:{marginTopXS:n,marginTopS:r,marginTopM:e,marginTopL:t,marginTopXL:a},cssProperty:'margin-top'})}),(o=>{var{marginRightXS:n,marginRightS:r,marginRightM:e,marginRightL:t,marginRightXL:a}=o;return c({sizes:{marginRightXS:n,marginRightS:r,marginRightM:e,marginRightL:t,marginRightXL:a},cssProperty:'margin-right'})}),(o=>{var{marginBottomXS:n,marginBottomS:r,marginBottomM:e,marginBottomL:t,marginBottomXL:a}=o;return c({sizes:{marginBottomXS:n,marginBottomS:r,marginBottomM:e,marginBottomL:t,marginBottomXL:a},cssProperty:'margin-bottom'})}),(o=>{var{marginLeftXS:n,marginLeftS:r,marginLeftM:e,marginLeftL:t,marginLeftXL:a}=o;return c({sizes:{marginLeftXS:n,marginLeftS:r,marginLeftM:e,marginLeftL:t,marginLeftXL:a},cssProperty:'margin-left'})}),(o=>{var{fontSizeXS:n,fontSizeS:r,fontSizeM:e,fontSizeL:t,fontSizeXL:a}=o;return c({sizes:{fontSizeXS:n,fontSizeS:r,fontSizeM:e,fontSizeL:t,fontSizeXL:a},cssProperty:'font-size'})}),(o=>{var{heightXS:n,heightS:r,heightM:e,heightL:t,heightXL:a}=o;return c({sizes:{heightXS:n,heightS:r,heightM:e,heightL:t,heightXL:a},cssProperty:'height'})}),(o=>{var{widthXS:n,widthS:r,widthM:e,widthL:t,widthXL:a,fluid:i,width:s}=o;return c({sizes:{widthXS:n,widthS:r,widthM:e,widthL:t,widthXL:a},cssProperty:i&&'auto'!==s?'max-width':'width',customSizeHandler:L})}),(o=>o.fluid?a(o.fluid,x):null),(o=>{var{fluidXS:n,fluidS:r,fluidM:e,fluidL:t,fluidXL:a}=o;return c({sizes:{fluidXS:n,fluidS:r,fluidM:e,fluidL:t,fluidXL:a},cssProperty:x})}));var R=o.span.withConfig({componentId:"fox-ui__sc-16o31r2-1"})(["",""],(o=>"\n position: relative;\n z-index: 1;\n display: flex;\n flex-shrink: 0;\n width: 1em;\n height: 1em;\n margin-left: ".concat(o.marginLeft?'0.4em':0,";\n margin-right: ").concat(o.marginRight?'0.4em':0,";\n ")));var M=o.span.withConfig({componentId:"fox-ui__sc-16o31r2-2"})(["position:relative;z-index:1;"]);var T=o(p).withConfig({componentId:"fox-ui__sc-16o31r2-3"})(["width:100%;animation:"," 2000ms linear infinite;",""],v,(o=>"\n > path {\n stroke-width: ".concat(o.strokeWidth,";\n }\n ")));var B=o(g).withConfig({componentId:"fox-ui__sc-16o31r2-4"})(["width:100%;",""],(o=>"\n > path {\n stroke-width: ".concat(o.strokeWidth,";\n }\n ")));export{B as CheckIcon,M as Content,R as IconSlot,z as Root,T as SpinnerIcon};
2
2
  //# sourceMappingURL=style.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../../src/components/Button/style.ts"],"sourcesContent":["import styled, { css, keyframes } from 'styled-components'\nimport tiny from 'tinycolor2'\nimport type { DefaultTheme, ThemedStyledProps } from 'styled-components'\nimport { injectDefaultTheme } from 'shared/utils/inject-theme'\nimport { CalcProperty, property, responsiveNamedProperty, responsiveProperty } from 'mixins/responsive-property'\nimport { color as colorFn } from 'mixins/color'\nimport type { PossibleValues } from 'mixins/responsive-property'\nimport { FORWARD_PROPS } from './constants'\nimport Check from './images/check.module.svg'\nimport Spinner from './images/spinner.module.svg'\nimport type { ButtonStaticSize, ButtonRootProps, ButtonForwardProp } from './types'\n\nconst SIZES: Record<ButtonStaticSize, number> = {\n l: 20,\n m: 18,\n s: 16,\n xs: 14,\n}\n\nconst STATIC_SIZES: ButtonStaticSize[] = ['l', 'm', 's', 'xs']\n\nconst WIDTHS: Record<ButtonStaticSize, number> = {\n l: 280,\n m: 245,\n s: 180,\n xs: 140,\n}\n\nconst DEFAULT_ROUND_SIZES: Record<ButtonStaticSize, number> = {\n l: 52,\n m: 48,\n s: 40,\n xs: 32,\n}\n\nconst baseStyles = css<ButtonRootProps>`\n ${(props) => `\n display: ${props.display};\n font-weight: ${props.fontWeight};\n border-radius: ${props.borderRadius};\n line-height: ${props.lineHeight};\n padding: ${props.basePadding};\n box-sizing: border-box;\n position: relative;\n isolation: isolate;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n cursor: pointer;\n user-select: none;\n border: none;\n text-decoration: none;\n appearance: none;\n white-space: nowrap;\n text-align: center;\n vertical-align: top;\n transition-property: color, background-color, box-shadow;\n &::before, \n &::after {\n transition-property: opacity;\n }\n &, \n &::before,\n &::after {\n transition-duration: 200ms;\n }\n & + & {\n margin-left: ${props.noSpacing ? 'auto' : '1em'};\n }\n `}\n`\n\nconst loading = keyframes`\n 0% {\n background-position: 0 0;\n }\n 100% {\n background-position: 50px 50px;\n }\n`\n\nconst spin = keyframes`\n 100% {\n transform: rotate(360deg);\n }\n`\n\nconst defaultLoadingStyles = css`\n background-image: linear-gradient(\n -45deg,\n rgba(255, 255, 255, 0.2) 25%,\n transparent 25%,\n transparent 50%,\n rgba(255, 255, 255, 0.2) 50%,\n rgba(255, 255, 255, 0.2) 75%,\n transparent 75%,\n transparent\n );\n background-size: 25px 25px;\n animation: ${loading} 2s linear infinite;\n cursor: progress;\n`\n\nconst getWidth = (width: PossibleValues): PossibleValues => {\n if (width === 'auto') return 'auto'\n if (typeof width === 'number') return width\n if (typeof width === 'boolean') return width\n\n if (width && WIDTHS[width]) return WIDTHS[width]\n\n return 'auto'\n}\n\nconst getDefaultRoundSizes: CalcProperty = (size, sizing = 'px') => css`\n width: ${size as number}${sizing};\n height: ${size as number}${sizing};\n font-size: ${0.44 * (size as number)}${sizing};\n line-height: ${0.44 * (size as number)}${sizing};\n padding: ${0.28 * (size as number)}${sizing};\n`\n\nconst fluidStyles: CalcProperty = () => css`\n min-width: initial;\n width: 100%;\n`\n\nconst pseudoBaseStyles = `\n content: '';\n position: absolute;\n inset: 0;\n border-radius: inherit;\n`\n\nconst PRESET = {\n filled: {\n default: css<ButtonRootProps>`\n ${(props) => {\n let background = props.theme.colors['bg-brand-primary-basic']\n if (props.black) background = props.theme.colors['bg-onmain-contrast']\n if (props.danger) background = props.theme.colors['alert-bg-error-500']\n if (props.success) background = props.theme.colors['alert-bg-success-500']\n if (props.disabled) background = props.theme.colors['bg-disabled-large']\n\n let color = props.theme.colors['content-oncolor-primary']\n if (props.disabled) color = props.theme.colors['content-disabled']\n\n let backgroundBefore = props.theme.colors['bg-oncolor-hover']\n if (props.black && !props.danger) backgroundBefore = props.theme.colors['bg-oncontrast-hover']\n\n return `\n background-color: ${background};\n color: ${color};\n\n &::before {\n ${pseudoBaseStyles}\n background-color: ${backgroundBefore};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n onColored: css<ButtonRootProps>`\n ${(props) => {\n let background = props.theme.colors['bg-oncolor-primary']\n if (props.disabled) background = props.theme.colors['bg-oncolor-disabled']\n\n let color = props.theme.colors['content-oncolor-constant']\n if (props.success) color = props.theme.colors['alert-success']\n if (props.disabled) color = props.theme.colors['content-oncolor-disabled']\n\n return `\n background-color: ${background};\n color: ${color};\n \n &::before {\n ${pseudoBaseStyles}\n background-color: ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n },\n outline: {\n default: css<ButtonRootProps>`\n ${(props) => {\n let background = 'transparent'\n if (props.loading && !props.success && !props.black && !props.danger)\n background = props.theme.colors['bg-brand-primary-basic']\n if (props.loading && !props.success && props.black) background = props.theme.colors['bg-onmain-contrast']\n if (props.loading && !props.success && props.danger) background = props.theme.colors['alert-bg-error-500']\n if (props.success) background = props.theme.colors['alert-bg-success-500']\n if (props.disabled) background = props.theme.colors['bg-disabled-large']\n\n let color = props.theme.colors['content-brand-primary']\n if (props.black) color = props.theme.colors['content-oncolor-inverse']\n if (props.danger) color = props.theme.colors['alert-error']\n if (props.success || props.loading) color = props.theme.colors['content-oncolor-primary']\n if (props.disabled) color = props.theme.colors['content-disabled']\n\n let boxShadow: string = props.theme.colors['border-brand-primary']\n if (props.black) boxShadow = props.theme.colors['border-onmain-contrast']\n if (props.danger) boxShadow = props.theme.colors['alert-bg-error-500']\n if (props.loading && !props.success) boxShadow = 'transparent'\n if (props.success) boxShadow = props.theme.colors['alert-bg-success-500']\n if (props.disabled) boxShadow = props.theme.colors['bg-disabled-large']\n\n let backgroundBefore = props.theme.colors['bg-brand-primary-basic']\n if (props.black) backgroundBefore = props.theme.colors['bg-onmain-contrast']\n if (props.danger) backgroundBefore = props.theme.colors['alert-bg-error-500']\n\n let backgroundAfter = props.theme.colors['bg-oncolor-hover']\n if (props.black && !props.danger) backgroundAfter = props.theme.colors['bg-oncontrast-hover']\n\n return `\n background-color: ${background};\n color: ${color};\n box-shadow: inset 0 0 0 ${props.fontBold ? 2 : 1}px ${boxShadow};\n\n &::before {\n ${pseudoBaseStyles}\n background-color: ${backgroundBefore};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n background-color: ${backgroundAfter};\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover {\n color: ${props.theme.colors['content-oncolor-primary']};\n box-shadow: none;\n }\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n onColored: css<ButtonRootProps>`\n ${(props) => {\n let background = 'transparent'\n if (props.success || props.loading) background = props.theme.colors['bg-oncolor-primary']\n if (props.disabled) background = props.theme.colors['bg-oncolor-disabled']\n\n let color = props.theme.colors['content-oncolor-primary']\n if (props.loading && !props.success) color = props.theme.colors['content-oncolor-constant']\n if (props.success) color = props.theme.colors['alert-success']\n if (props.disabled) color = props.theme.colors['content-oncolor-disabled']\n\n let boxShadow: string = props.theme.colors['border-oncolor-default']\n if (props.disabled) boxShadow = 'transparent'\n\n return `\n background-color: ${background};\n color: ${color};\n box-shadow: inset 0 0 0 ${props.fontBold ? 2 : 1}px ${boxShadow};\n\n &::before {\n ${pseudoBaseStyles}\n background-color: ${props.theme.colors['bg-oncolor-primary']};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover {\n color: ${props.theme.colors['content-oncolor-constant']};\n box-shadow: none;\n }\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n },\n base: {\n default: css<ButtonRootProps>`\n ${(props) => {\n let background = props.theme.colors['bg-onmain-tertiary']\n if (props.success) background = props.theme.colors['alert-bg-success-500']\n if (props.disabled) background = props.theme.colors['bg-disabled-large']\n\n let color = props.theme.colors['content-brand-primary']\n if (props.black) color = props.theme.colors['content-oncolor-inverse']\n if (props.danger) color = props.theme.colors['alert-error']\n if (props.success) color = props.theme.colors['content-oncolor-primary']\n if (props.disabled) color = props.theme.colors['content-disabled']\n\n return `\n background-color: ${background};\n color: ${color};\n\n &::before {\n ${pseudoBaseStyles}\n background-color: ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n onColored: css<ButtonRootProps>`\n ${(props) => {\n let background = props.theme.colors['bg-oncolor-secondary']\n if (props.success) background = props.theme.colors['bg-oncolor-primary']\n if (props.disabled) background = props.theme.colors['bg-oncolor-disabled']\n\n let color = props.theme.colors['content-oncolor-primary']\n if (props.success) color = props.theme.colors['alert-success']\n if (props.disabled) color = props.theme.colors['content-oncolor-disabled']\n\n return `\n background-color: ${background};\n color: ${color};\n\n &::before {\n ${pseudoBaseStyles}\n background-color: ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n },\n clear: {\n default: css<ButtonRootProps>`\n ${(props) => {\n let color = props.theme.colors['content-brand-primary']\n if (props.black) color = props.theme.colors['content-oncolor-inverse']\n if (props.danger) color = props.theme.colors['alert-error']\n if (props.success) color = props.theme.colors['alert-success']\n if (props.disabled) color = props.theme.colors['content-disabled']\n\n return `\n background-color: transparent;\n color: ${color};\n\n &::before {\n ${pseudoBaseStyles}\n background-color: ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n onColored: css<ButtonRootProps>`\n ${(props) => {\n let color = props.theme.colors['content-oncolor-primary']\n if (props.disabled) color = props.theme.colors['content-oncolor-disabled']\n\n return `\n background-color: transparent;\n color: ${color};\n\n &::before {\n ${pseudoBaseStyles}\n background-color: ${props.theme.colors['bg-oncontrast-hover']};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncontrast-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n },\n}\n\nconst PRESET_DEFAULT = {\n default: css<ButtonRootProps>`\n ${(props) => {\n if (props.disabled || props.loading) return ''\n\n return `\n &:active {\n box-shadow: inset 0 4px 0px 0px rgba(0, 0, 0, 0.14);\n }\n &:hover {\n color: ${props.fontColor};\n background-color: ${tiny(props.theme.colors[props.color]).saturate(-5).lighten(-8).toString()};\n }\n ${\n props.inverted || props.basic || props.outline\n ? `\n &:not(:hover) {\n border: 1px solid ${props.theme.colors[props.color]};\n }\n &:hover {\n border: 1px solid ${props.theme.colors[props.color]};\n } \n `\n : ''\n }\n `\n }}\n\n ${(props) => (props.loading ? defaultLoadingStyles : '')}\n \n ${(props) => {\n let cssProperty = 'background-color'\n if (props.inverted || props.basic || props.outline) cssProperty = 'color'\n\n return colorFn(props.color, cssProperty)\n }}\n\n ${(props) => {\n let cssProperty = 'color'\n if (props.inverted || props.basic || props.outline) cssProperty = 'background-color'\n\n return colorFn(props.fontColor, cssProperty)\n }}\n \n ${(props) => {\n if (!props.disabled) return ''\n\n return `\n cursor: not-allowed;\n background-color: ${props.theme.colors.mercury};\n color: ${props.theme.colors.silver};\n `\n }}\n \n ${(props) => (props.basic || props.outline ? 'background-color: transparent;' : '')}\n `,\n}\n\nconst extractStyles = (props: ThemedStyledProps<ButtonRootProps, DefaultTheme>) => {\n if (props.brandPresetUsed) {\n if (props.clear && !props.base && !props.outline && !props.onColored) return PRESET.clear.default\n if (props.clear && !props.base && !props.outline && props.onColored) return PRESET.clear.onColored\n\n if (props.base && !props.clear && !props.outline && !props.onColored) return PRESET.base.default\n if (props.base && !props.clear && !props.outline && props.onColored) return PRESET.base.onColored\n\n if (props.outline && !props.clear && !props.base && !props.onColored) return PRESET.outline.default\n if (props.outline && !props.clear && !props.base && props.onColored) return PRESET.outline.onColored\n\n return props.onColored ? PRESET.filled.onColored : PRESET.filled.default\n }\n\n return PRESET_DEFAULT.default\n}\n\nconst extractSizes = (props: ThemedStyledProps<ButtonRootProps, DefaultTheme>) => {\n if (!props.brandPresetUsed) return ''\n\n return STATIC_SIZES.includes(<ButtonStaticSize>props.size)\n ? `font-size: ${SIZES[<ButtonStaticSize>props.size]}px;`\n : responsiveProperty('size', 'font-size')\n}\n\nconst extractDefaultRoundSizes = (props: ThemedStyledProps<ButtonRootProps, DefaultTheme>) => {\n if (props.brandPresetUsed || !props.round) return ''\n if (!STATIC_SIZES.includes(<ButtonStaticSize>props.size)) return ''\n\n return property(DEFAULT_ROUND_SIZES[<ButtonStaticSize>props.size], getDefaultRoundSizes)\n}\n\nexport const Root = styled.button\n .withConfig({\n shouldForwardProp: (prop) => {\n return FORWARD_PROPS.includes(<ButtonForwardProp>prop) || prop.includes('data')\n },\n })\n .attrs(injectDefaultTheme)<ButtonRootProps>`\n ${baseStyles}\n ${extractStyles}\n ${extractSizes}\n ${extractDefaultRoundSizes}\n\n ${(props) => (props.padding ? property(props.padding, 'padding') : null)}\n ${(props) => (props.paddingTop ? property(props.paddingTop, 'padding-top') : null)}\n ${(props) => (props.paddingRight ? property(props.paddingRight, 'padding-right') : null)}\n ${(props) => (props.paddingBottom ? property(props.paddingBottom, 'padding-bottom') : null)}\n ${(props) => (props.paddingLeft ? property(props.paddingLeft, 'padding-left') : null)}\n\n ${(props) => (props.margin ? property(props.margin, 'margin') : null)}\n ${(props) => (props.marginTop ? property(props.marginTop, 'margin-top') : null)}\n ${(props) => (props.marginRight ? property(props.marginRight, 'margin-right') : null)}\n ${(props) => (props.marginBottom ? property(props.marginBottom, 'margin-bottom') : null)}\n ${(props) => (props.marginLeft ? property(props.marginLeft, 'margin-left') : null)}\n\n ${(props) => (props.fontSize ? property(props.fontSize, 'font-size') : null)}\n\n ${(props) => (props.height ? property(props.height, 'height') : null)}\n\n ${(props) => {\n const cssProperty = props.fluid && props.width !== 'auto' ? 'max-width' : 'width'\n return props.width ? property(getWidth(props.width), cssProperty) : null\n }}\n\n ${({ paddingXS, paddingS, paddingM, paddingL, paddingXL }) => {\n return responsiveNamedProperty({\n sizes: { paddingXS, paddingS, paddingM, paddingL, paddingXL },\n cssProperty: 'padding',\n })\n }}\n ${({ paddingTopXS, paddingTopS, paddingTopM, paddingTopL, paddingTopXL }) => {\n return responsiveNamedProperty({\n sizes: { paddingTopXS, paddingTopS, paddingTopM, paddingTopL, paddingTopXL },\n cssProperty: 'padding-top',\n })\n }}\n ${({ paddingRightXS, paddingRightS, paddingRightM, paddingRightL, paddingRightXL }) => {\n return responsiveNamedProperty({\n sizes: { paddingRightXS, paddingRightS, paddingRightM, paddingRightL, paddingRightXL },\n cssProperty: 'padding-right',\n })\n }}\n ${({ paddingBottomXS, paddingBottomS, paddingBottomM, paddingBottomL, paddingBottomXL }) => {\n return responsiveNamedProperty({\n sizes: { paddingBottomXS, paddingBottomS, paddingBottomM, paddingBottomL, paddingBottomXL },\n cssProperty: 'padding-bottom',\n })\n }}\n ${({ paddingLeftXS, paddingLeftS, paddingLeftM, paddingLeftL, paddingLeftXL }) => {\n return responsiveNamedProperty({\n sizes: { paddingLeftXS, paddingLeftS, paddingLeftM, paddingLeftL, paddingLeftXL },\n cssProperty: 'padding-left',\n })\n }}\n\n ${({ marginXS, marginS, marginM, marginL, marginXL }) => {\n return responsiveNamedProperty({ sizes: { marginXS, marginS, marginM, marginL, marginXL }, cssProperty: 'margin' })\n }}\n ${({ marginTopXS, marginTopS, marginTopM, marginTopL, marginTopXL }) => {\n return responsiveNamedProperty({\n sizes: { marginTopXS, marginTopS, marginTopM, marginTopL, marginTopXL },\n cssProperty: 'margin-top',\n })\n }}\n ${({ marginRightXS, marginRightS, marginRightM, marginRightL, marginRightXL }) => {\n return responsiveNamedProperty({\n sizes: { marginRightXS, marginRightS, marginRightM, marginRightL, marginRightXL },\n cssProperty: 'margin-right',\n })\n }}\n ${({ marginBottomXS, marginBottomS, marginBottomM, marginBottomL, marginBottomXL }) => {\n return responsiveNamedProperty({\n sizes: { marginBottomXS, marginBottomS, marginBottomM, marginBottomL, marginBottomXL },\n cssProperty: 'margin-bottom',\n })\n }}\n ${({ marginLeftXS, marginLeftS, marginLeftM, marginLeftL, marginLeftXL }) => {\n return responsiveNamedProperty({\n sizes: { marginLeftXS, marginLeftS, marginLeftM, marginLeftL, marginLeftXL },\n cssProperty: 'margin-left',\n })\n }}\n\n ${({ fontSizeXS, fontSizeS, fontSizeM, fontSizeL, fontSizeXL }) => {\n return responsiveNamedProperty({\n sizes: { fontSizeXS, fontSizeS, fontSizeM, fontSizeL, fontSizeXL },\n cssProperty: 'font-size',\n })\n }}\n \n ${({ heightXS, heightS, heightM, heightL, heightXL }) => {\n return responsiveNamedProperty({\n sizes: { heightXS, heightS, heightM, heightL, heightXL },\n cssProperty: 'height',\n })\n }}\n\n ${({ widthXS, widthS, widthM, widthL, widthXL, fluid, width }) => {\n return responsiveNamedProperty({\n sizes: { widthXS, widthS, widthM, widthL, widthXL },\n cssProperty: fluid && width !== 'auto' ? 'max-width' : 'width',\n customSizeHandler: getWidth,\n })\n }}\n\n ${(props) => (props.fluid ? property(props.fluid, fluidStyles) : null)}\n ${({ fluidXS, fluidS, fluidM, fluidL, fluidXL }) => {\n return responsiveNamedProperty({\n sizes: { fluidXS, fluidS, fluidM, fluidL, fluidXL },\n cssProperty: fluidStyles,\n })\n }}\n`\n\nexport const IconSlot = styled.span<{\n children: React.ReactNode\n marginLeft?: boolean\n marginRight?: boolean\n}>`\n ${(props) => `\n position: relative;\n z-index: 1;\n display: flex;\n flex-shrink: 0;\n width: 1em;\n height: 1em;\n margin-left: ${props.marginLeft ? '0.4em' : 0};\n margin-right: ${props.marginRight ? '0.4em' : 0};\n `}\n`\n\nexport const Content = styled.span`\n position: relative;\n z-index: 1;\n`\n\nexport const SpinnerIcon = styled(Spinner)`\n width: 100%;\n animation: ${spin} 2000ms linear infinite;\n ${(props) => `\n > path {\n stroke-width: ${props.strokeWidth};\n }\n `}\n`\n\nexport const CheckIcon = styled(Check)`\n width: 100%;\n ${(props) => `\n > path {\n stroke-width: ${props.strokeWidth};\n }\n `}\n`\n"],"names":["SIZES","l","m","s","xs","STATIC_SIZES","WIDTHS","DEFAULT_ROUND_SIZES","baseStyles","css","props","display","fontWeight","concat","borderRadius","lineHeight","basePadding","noSpacing","loading","keyframes","spin","defaultLoadingStyles","getWidth","width","getDefaultRoundSizes","size","r","sizing","fluidStyles","pseudoBaseStyles","PRESET","filled","default","background","theme","colors","black","danger","success","disabled","color","backgroundBefore","onColored","outline","boxShadow","backgroundAfter","fontBold","base","clear","PRESET_DEFAULT","fontColor","tiny","saturate","lighten","toString","inverted","basic","cssProperty","colorFn","mercury","silver","Root","styled","button","withConfig","shouldForwardProp","prop","FORWARD_PROPS","includes","attrs","injectDefaultTheme","componentId","brandPresetUsed","responsiveProperty","round","property","padding","paddingTop","paddingRight","paddingBottom","paddingLeft","margin","marginTop","marginRight","marginBottom","marginLeft","fontSize","height","fluid","_ref","paddingXS","paddingS","paddingM","paddingL","paddingXL","responsiveNamedProperty","sizes","_ref2","paddingTopXS","paddingTopS","paddingTopM","paddingTopL","paddingTopXL","_ref3","paddingRightXS","paddingRightS","paddingRightM","paddingRightL","paddingRightXL","_ref4","paddingBottomXS","paddingBottomS","paddingBottomM","paddingBottomL","paddingBottomXL","_ref5","paddingLeftXS","paddingLeftS","paddingLeftM","paddingLeftL","paddingLeftXL","_ref6","marginXS","marginS","marginM","marginL","marginXL","_ref7","marginTopXS","marginTopS","marginTopM","marginTopL","marginTopXL","_ref8","marginRightXS","marginRightS","marginRightM","marginRightL","marginRightXL","_ref9","marginBottomXS","marginBottomS","marginBottomM","marginBottomL","marginBottomXL","_ref10","marginLeftXS","marginLeftS","marginLeftM","marginLeftL","marginLeftXL","_ref11","fontSizeXS","fontSizeS","fontSizeM","fontSizeL","fontSizeXL","_ref12","heightXS","heightS","heightM","heightL","heightXL","_ref13","widthXS","widthS","widthM","widthL","widthXL","customSizeHandler","_ref14","fluidXS","fluidS","fluidM","fluidL","fluidXL","IconSlot","span","Content","SpinnerIcon","Spinner","strokeWidth","CheckIcon","Check"],"mappings":"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"}
1
+ {"version":3,"file":"style.js","sources":["../../../../src/components/Button/style.ts"],"sourcesContent":["import styled, { css, keyframes } from 'styled-components'\nimport tiny from 'tinycolor2'\nimport type { DefaultTheme, ThemedStyledProps } from 'styled-components'\nimport { injectDefaultTheme } from 'shared/utils/inject-theme'\nimport { CalcProperty, property, responsiveNamedProperty, responsiveProperty } from 'mixins/responsive-property'\nimport { color as colorFn } from 'mixins/color'\nimport type { PossibleValues } from 'mixins/responsive-property'\nimport { FORWARD_PROPS, STATIC_SIZES } from './constants'\nimport Check from './images/check.module.svg'\nimport Spinner from './images/spinner.module.svg'\nimport type { ButtonStaticSize, ButtonRootProps, ButtonForwardProp } from './types'\n\nconst WIDTHS: Record<ButtonStaticSize, number> = {\n xl: 320,\n l: 280,\n m: 245,\n s: 180,\n xs: 140,\n}\n\nconst DEFAULT_ROUND_SIZES: Record<ButtonStaticSize, number> = {\n xl: 60,\n l: 52,\n m: 48,\n s: 40,\n xs: 32,\n}\n\nconst BRAND_ROUND_SIZES: Record<ButtonStaticSize, number> = {\n xl: 18,\n l: 16,\n m: 16,\n s: 14,\n xs: 14,\n}\n\nconst baseStyles = css<ButtonRootProps>`\n ${(props) => `\n display: ${props.display};\n font-weight: ${props.fontWeight};\n border-radius: ${props.borderRadius};\n line-height: ${props.lineHeight};\n padding: ${props.basePadding};\n box-sizing: border-box;\n position: relative;\n isolation: isolate;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n cursor: pointer;\n user-select: none;\n border: none;\n text-decoration: none;\n appearance: none;\n white-space: nowrap;\n text-align: center;\n vertical-align: top;\n transition-property: color, background-color, box-shadow;\n &::before, \n &::after {\n transition-property: opacity;\n }\n &, \n &::before,\n &::after {\n transition-duration: 200ms;\n }\n & + & {\n margin-left: ${props.noSpacing ? 'auto' : '1em'};\n }\n `}\n`\n\nconst loading = keyframes`\n 0% {\n background-position: 0 0;\n }\n 100% {\n background-position: 50px 50px;\n }\n`\n\nconst spin = keyframes`\n 100% {\n transform: rotate(360deg);\n }\n`\n\nconst defaultLoadingStyles = css`\n background-image: linear-gradient(\n -45deg,\n rgba(255, 255, 255, 0.2) 25%,\n transparent 25%,\n transparent 50%,\n rgba(255, 255, 255, 0.2) 50%,\n rgba(255, 255, 255, 0.2) 75%,\n transparent 75%,\n transparent\n );\n background-size: 25px 25px;\n animation: ${loading} 2s linear infinite;\n cursor: progress;\n`\n\nconst getWidth = (width: PossibleValues): PossibleValues => {\n if (width === 'auto') return 'auto'\n if (typeof width === 'number') return width\n if (typeof width === 'boolean') return width\n\n if (width && WIDTHS[width]) return WIDTHS[width]\n\n return 'auto'\n}\n\nconst getDefaultRoundSizes: CalcProperty = (size, sizing = 'px') => css`\n width: ${size as number}${sizing};\n height: ${size as number}${sizing};\n font-size: ${0.44 * (size as number)}${sizing};\n line-height: ${0.44 * (size as number)}${sizing};\n padding: ${0.28 * (size as number)}${sizing};\n`\n\nconst fluidStyles: CalcProperty = () => css`\n min-width: initial;\n width: 100%;\n`\n\nconst pseudoBaseStyles = `\n content: '';\n position: absolute;\n inset: 0;\n border-radius: inherit;\n`\n\nconst PRESET = {\n filled: {\n default: css<ButtonRootProps>`\n ${(props) => {\n let background = props.theme.colors['bg-brand-primary-basic']\n if (props.black) background = props.theme.colors['bg-onmain-contrast']\n if (props.danger) background = props.theme.colors['alert-bg-error-500']\n if (props.success) background = props.theme.colors['alert-bg-success-500']\n if (props.disabled) background = props.theme.colors['bg-disabled-large']\n\n let color = props.theme.colors['content-oncolor-primary']\n if (props.disabled) color = props.theme.colors['content-disabled']\n\n let backgroundBefore = props.theme.colors['bg-oncolor-hover']\n if (props.black && !props.danger) backgroundBefore = props.theme.colors['bg-oncontrast-hover']\n\n return `\n background-color: ${background};\n color: ${color};\n\n &::before {\n ${pseudoBaseStyles}\n background-color: ${backgroundBefore};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n onColored: css<ButtonRootProps>`\n ${(props) => {\n let background = props.theme.colors['bg-oncolor-primary']\n if (props.disabled) background = props.theme.colors['bg-oncolor-disabled']\n\n let color = props.theme.colors['content-oncolor-constant']\n if (props.success) color = props.theme.colors['alert-success']\n if (props.disabled) color = props.theme.colors['content-oncolor-disabled']\n\n return `\n background-color: ${background};\n color: ${color};\n \n &::before {\n ${pseudoBaseStyles}\n background-color: ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n },\n outline: {\n default: css<ButtonRootProps>`\n ${(props) => {\n let background = 'transparent'\n if (props.loading && !props.success && !props.black && !props.danger)\n background = props.theme.colors['bg-brand-primary-basic']\n if (props.loading && !props.success && props.black) background = props.theme.colors['bg-onmain-contrast']\n if (props.loading && !props.success && props.danger) background = props.theme.colors['alert-bg-error-500']\n if (props.success) background = props.theme.colors['alert-bg-success-500']\n if (props.disabled) background = props.theme.colors['bg-disabled-large']\n\n let color = props.theme.colors['content-brand-primary']\n if (props.black) color = props.theme.colors['content-oncolor-inverse']\n if (props.danger) color = props.theme.colors['alert-error']\n if (props.success || props.loading) color = props.theme.colors['content-oncolor-primary']\n if (props.disabled) color = props.theme.colors['content-disabled']\n\n let boxShadow: string = props.theme.colors['border-brand-primary']\n if (props.black) boxShadow = props.theme.colors['border-onmain-contrast']\n if (props.danger) boxShadow = props.theme.colors['alert-bg-error-500']\n if (props.loading && !props.success) boxShadow = 'transparent'\n if (props.success) boxShadow = props.theme.colors['alert-bg-success-500']\n if (props.disabled) boxShadow = props.theme.colors['bg-disabled-large']\n\n let backgroundBefore = props.theme.colors['bg-brand-primary-basic']\n if (props.black) backgroundBefore = props.theme.colors['bg-onmain-contrast']\n if (props.danger) backgroundBefore = props.theme.colors['alert-bg-error-500']\n\n let backgroundAfter = props.theme.colors['bg-oncolor-hover']\n if (props.black && !props.danger) backgroundAfter = props.theme.colors['bg-oncontrast-hover']\n\n return `\n background-color: ${background};\n color: ${color};\n box-shadow: inset 0 0 0 ${props.fontBold ? 2 : 1}px ${boxShadow};\n\n &::before {\n ${pseudoBaseStyles}\n background-color: ${backgroundBefore};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n background-color: ${backgroundAfter};\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover {\n color: ${props.theme.colors['content-oncolor-primary']};\n box-shadow: none;\n }\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n onColored: css<ButtonRootProps>`\n ${(props) => {\n let background = 'transparent'\n if (props.success || props.loading) background = props.theme.colors['bg-oncolor-primary']\n if (props.disabled) background = props.theme.colors['bg-oncolor-disabled']\n\n let color = props.theme.colors['content-oncolor-primary']\n if (props.loading && !props.success) color = props.theme.colors['content-oncolor-constant']\n if (props.success) color = props.theme.colors['alert-success']\n if (props.disabled) color = props.theme.colors['content-oncolor-disabled']\n\n let boxShadow: string = props.theme.colors['border-oncolor-default']\n if (props.disabled) boxShadow = 'transparent'\n\n return `\n background-color: ${background};\n color: ${color};\n box-shadow: inset 0 0 0 ${props.fontBold ? 2 : 1}px ${boxShadow};\n\n &::before {\n ${pseudoBaseStyles}\n background-color: ${props.theme.colors['bg-oncolor-primary']};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover {\n color: ${props.theme.colors['content-oncolor-constant']};\n box-shadow: none;\n }\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n },\n base: {\n default: css<ButtonRootProps>`\n ${(props) => {\n let background = props.theme.colors['bg-onmain-tertiary']\n if (props.success) background = props.theme.colors['alert-bg-success-500']\n if (props.disabled) background = props.theme.colors['bg-disabled-large']\n\n let color = props.theme.colors['content-brand-primary']\n if (props.black) color = props.theme.colors['content-oncolor-inverse']\n if (props.danger) color = props.theme.colors['alert-error']\n if (props.success) color = props.theme.colors['content-oncolor-primary']\n if (props.disabled) color = props.theme.colors['content-disabled']\n\n return `\n background-color: ${background};\n color: ${color};\n\n &::before {\n ${pseudoBaseStyles}\n background-color: ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n onColored: css<ButtonRootProps>`\n ${(props) => {\n let background = props.theme.colors['bg-oncolor-secondary']\n if (props.success) background = props.theme.colors['bg-oncolor-primary']\n if (props.disabled) background = props.theme.colors['bg-oncolor-disabled']\n\n let color = props.theme.colors['content-oncolor-primary']\n if (props.success) color = props.theme.colors['alert-success']\n if (props.disabled) color = props.theme.colors['content-oncolor-disabled']\n\n return `\n background-color: ${background};\n color: ${color};\n\n &::before {\n ${pseudoBaseStyles}\n background-color: ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n },\n clear: {\n default: css<ButtonRootProps>`\n ${(props) => {\n let color = props.theme.colors['content-brand-primary']\n if (props.black) color = props.theme.colors['content-oncolor-inverse']\n if (props.danger) color = props.theme.colors['alert-error']\n if (props.success) color = props.theme.colors['alert-success']\n if (props.disabled) color = props.theme.colors['content-disabled']\n\n return `\n background-color: transparent;\n color: ${color};\n\n &::before {\n ${pseudoBaseStyles}\n background-color: ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncolor-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n onColored: css<ButtonRootProps>`\n ${(props) => {\n let color = props.theme.colors['content-oncolor-primary']\n if (props.disabled) color = props.theme.colors['content-oncolor-disabled']\n\n return `\n background-color: transparent;\n color: ${color};\n\n &::before {\n ${pseudoBaseStyles}\n background-color: ${props.theme.colors['bg-oncontrast-hover']};\n opacity: 0;\n }\n &::after {\n ${pseudoBaseStyles}\n box-shadow: inset 0px 4px 0px ${props.theme.colors['bg-oncontrast-hover']};\n opacity: 0;\n }\n\n ${\n !props.disabled && !props.success && !props.loading\n ? `\n &:hover::before {\n opacity: 1;\n }\n &:active::after {\n opacity: 1;\n }\n `\n : 'cursor: default;'\n }\n `\n }}\n `,\n },\n}\n\nconst PRESET_DEFAULT = {\n default: css<ButtonRootProps>`\n ${(props) => {\n if (props.disabled || props.loading) return ''\n\n return `\n &:active {\n box-shadow: inset 0 4px 0px 0px rgba(0, 0, 0, 0.14);\n }\n &:hover {\n color: ${props.fontColor};\n background-color: ${tiny(props.theme.colors[props.color]).saturate(-5).lighten(-8).toString()};\n }\n ${\n props.inverted || props.basic || props.outline\n ? `\n &:not(:hover) {\n border: 1px solid ${props.theme.colors[props.color]};\n }\n &:hover {\n border: 1px solid ${props.theme.colors[props.color]};\n } \n `\n : ''\n }\n `\n }}\n\n ${(props) => (props.loading ? defaultLoadingStyles : '')}\n \n ${(props) => {\n let cssProperty = 'background-color'\n if (props.inverted || props.basic || props.outline) cssProperty = 'color'\n\n return colorFn(props.color, cssProperty)\n }}\n\n ${(props) => {\n let cssProperty = 'color'\n if (props.inverted || props.basic || props.outline) cssProperty = 'background-color'\n\n return colorFn(props.fontColor, cssProperty)\n }}\n \n ${(props) => {\n if (!props.disabled) return ''\n\n return `\n cursor: not-allowed;\n background-color: ${props.theme.colors.mercury};\n color: ${props.theme.colors.silver};\n `\n }}\n \n ${(props) => (props.basic || props.outline ? 'background-color: transparent;' : '')}\n `,\n}\n\nconst extractStyles = (props: ThemedStyledProps<ButtonRootProps, DefaultTheme>) => {\n if (props.brandPresetUsed) {\n if (props.clear && !props.base && !props.outline && !props.onColored) return PRESET.clear.default\n if (props.clear && !props.base && !props.outline && props.onColored) return PRESET.clear.onColored\n\n if (props.base && !props.clear && !props.outline && !props.onColored) return PRESET.base.default\n if (props.base && !props.clear && !props.outline && props.onColored) return PRESET.base.onColored\n\n if (props.outline && !props.clear && !props.base && !props.onColored) return PRESET.outline.default\n if (props.outline && !props.clear && !props.base && props.onColored) return PRESET.outline.onColored\n\n return props.onColored ? PRESET.filled.onColored : PRESET.filled.default\n }\n\n return PRESET_DEFAULT.default\n}\n\nconst extractFontSize = (props: ThemedStyledProps<ButtonRootProps, DefaultTheme>) => {\n if (STATIC_SIZES.includes(<ButtonStaticSize>props.size)) return ''\n return responsiveProperty('size', 'font-size')\n}\n\nconst extractRoundStyles = (props: ThemedStyledProps<ButtonRootProps, DefaultTheme>) => {\n if (!props.round) return ''\n\n if (STATIC_SIZES.includes(<ButtonStaticSize>props.size)) {\n return props.brandPresetUsed\n ? `font-size: ${BRAND_ROUND_SIZES[<ButtonStaticSize>props.size]}px;\n padding: 1em;`\n : property(DEFAULT_ROUND_SIZES[<ButtonStaticSize>props.size], getDefaultRoundSizes)\n }\n\n return 'padding: 1em;'\n}\n\nexport const Root = styled.button\n .withConfig({\n shouldForwardProp: (prop) => {\n return FORWARD_PROPS.includes(<ButtonForwardProp>prop) || prop.includes('data')\n },\n })\n .attrs(injectDefaultTheme)<ButtonRootProps>`\n ${baseStyles}\n ${extractStyles}\n ${extractFontSize}\n ${extractRoundStyles}\n\n ${(props) => (props.padding ? property(props.padding, 'padding') : null)}\n ${(props) => (props.paddingTop ? property(props.paddingTop, 'padding-top') : null)}\n ${(props) => (props.paddingRight ? property(props.paddingRight, 'padding-right') : null)}\n ${(props) => (props.paddingBottom ? property(props.paddingBottom, 'padding-bottom') : null)}\n ${(props) => (props.paddingLeft ? property(props.paddingLeft, 'padding-left') : null)}\n\n ${(props) => (props.margin ? property(props.margin, 'margin') : null)}\n ${(props) => (props.marginTop ? property(props.marginTop, 'margin-top') : null)}\n ${(props) => (props.marginRight ? property(props.marginRight, 'margin-right') : null)}\n ${(props) => (props.marginBottom ? property(props.marginBottom, 'margin-bottom') : null)}\n ${(props) => (props.marginLeft ? property(props.marginLeft, 'margin-left') : null)}\n\n ${(props) => (props.fontSize ? property(props.fontSize, 'font-size') : null)}\n\n ${(props) => (props.height ? property(props.height, 'height') : null)}\n\n ${(props) => {\n const cssProperty = props.fluid && props.width !== 'auto' ? 'max-width' : 'width'\n return props.width ? property(getWidth(props.width), cssProperty) : null\n }}\n\n ${({ paddingXS, paddingS, paddingM, paddingL, paddingXL }) => {\n return responsiveNamedProperty({\n sizes: { paddingXS, paddingS, paddingM, paddingL, paddingXL },\n cssProperty: 'padding',\n })\n }}\n ${({ paddingTopXS, paddingTopS, paddingTopM, paddingTopL, paddingTopXL }) => {\n return responsiveNamedProperty({\n sizes: { paddingTopXS, paddingTopS, paddingTopM, paddingTopL, paddingTopXL },\n cssProperty: 'padding-top',\n })\n }}\n ${({ paddingRightXS, paddingRightS, paddingRightM, paddingRightL, paddingRightXL }) => {\n return responsiveNamedProperty({\n sizes: { paddingRightXS, paddingRightS, paddingRightM, paddingRightL, paddingRightXL },\n cssProperty: 'padding-right',\n })\n }}\n ${({ paddingBottomXS, paddingBottomS, paddingBottomM, paddingBottomL, paddingBottomXL }) => {\n return responsiveNamedProperty({\n sizes: { paddingBottomXS, paddingBottomS, paddingBottomM, paddingBottomL, paddingBottomXL },\n cssProperty: 'padding-bottom',\n })\n }}\n ${({ paddingLeftXS, paddingLeftS, paddingLeftM, paddingLeftL, paddingLeftXL }) => {\n return responsiveNamedProperty({\n sizes: { paddingLeftXS, paddingLeftS, paddingLeftM, paddingLeftL, paddingLeftXL },\n cssProperty: 'padding-left',\n })\n }}\n\n ${({ marginXS, marginS, marginM, marginL, marginXL }) => {\n return responsiveNamedProperty({ sizes: { marginXS, marginS, marginM, marginL, marginXL }, cssProperty: 'margin' })\n }}\n ${({ marginTopXS, marginTopS, marginTopM, marginTopL, marginTopXL }) => {\n return responsiveNamedProperty({\n sizes: { marginTopXS, marginTopS, marginTopM, marginTopL, marginTopXL },\n cssProperty: 'margin-top',\n })\n }}\n ${({ marginRightXS, marginRightS, marginRightM, marginRightL, marginRightXL }) => {\n return responsiveNamedProperty({\n sizes: { marginRightXS, marginRightS, marginRightM, marginRightL, marginRightXL },\n cssProperty: 'margin-right',\n })\n }}\n ${({ marginBottomXS, marginBottomS, marginBottomM, marginBottomL, marginBottomXL }) => {\n return responsiveNamedProperty({\n sizes: { marginBottomXS, marginBottomS, marginBottomM, marginBottomL, marginBottomXL },\n cssProperty: 'margin-bottom',\n })\n }}\n ${({ marginLeftXS, marginLeftS, marginLeftM, marginLeftL, marginLeftXL }) => {\n return responsiveNamedProperty({\n sizes: { marginLeftXS, marginLeftS, marginLeftM, marginLeftL, marginLeftXL },\n cssProperty: 'margin-left',\n })\n }}\n\n ${({ fontSizeXS, fontSizeS, fontSizeM, fontSizeL, fontSizeXL }) => {\n return responsiveNamedProperty({\n sizes: { fontSizeXS, fontSizeS, fontSizeM, fontSizeL, fontSizeXL },\n cssProperty: 'font-size',\n })\n }}\n \n ${({ heightXS, heightS, heightM, heightL, heightXL }) => {\n return responsiveNamedProperty({\n sizes: { heightXS, heightS, heightM, heightL, heightXL },\n cssProperty: 'height',\n })\n }}\n\n ${({ widthXS, widthS, widthM, widthL, widthXL, fluid, width }) => {\n return responsiveNamedProperty({\n sizes: { widthXS, widthS, widthM, widthL, widthXL },\n cssProperty: fluid && width !== 'auto' ? 'max-width' : 'width',\n customSizeHandler: getWidth,\n })\n }}\n\n ${(props) => (props.fluid ? property(props.fluid, fluidStyles) : null)}\n ${({ fluidXS, fluidS, fluidM, fluidL, fluidXL }) => {\n return responsiveNamedProperty({\n sizes: { fluidXS, fluidS, fluidM, fluidL, fluidXL },\n cssProperty: fluidStyles,\n })\n }}\n`\n\nexport const IconSlot = styled.span<{\n children: React.ReactNode\n marginLeft?: boolean\n marginRight?: boolean\n}>`\n ${(props) => `\n position: relative;\n z-index: 1;\n display: flex;\n flex-shrink: 0;\n width: 1em;\n height: 1em;\n margin-left: ${props.marginLeft ? '0.4em' : 0};\n margin-right: ${props.marginRight ? '0.4em' : 0};\n `}\n`\n\nexport const Content = styled.span`\n position: relative;\n z-index: 1;\n`\n\nexport const SpinnerIcon = styled(Spinner)`\n width: 100%;\n animation: ${spin} 2000ms linear infinite;\n ${(props) => `\n > path {\n stroke-width: ${props.strokeWidth};\n }\n `}\n`\n\nexport const CheckIcon = styled(Check)`\n width: 100%;\n ${(props) => `\n > path {\n stroke-width: ${props.strokeWidth};\n }\n `}\n`\n"],"names":["WIDTHS","xl","l","m","s","xs","DEFAULT_ROUND_SIZES","BRAND_ROUND_SIZES","baseStyles","css","props","display","fontWeight","concat","borderRadius","lineHeight","basePadding","noSpacing","loading","keyframes","spin","defaultLoadingStyles","getWidth","width","getDefaultRoundSizes","size","r","sizing","fluidStyles","pseudoBaseStyles","PRESET","filled","default","background","theme","colors","black","danger","success","disabled","color","backgroundBefore","onColored","outline","boxShadow","backgroundAfter","fontBold","base","clear","PRESET_DEFAULT","fontColor","tiny","saturate","lighten","toString","inverted","basic","cssProperty","colorFn","mercury","silver","Root","styled","button","withConfig","shouldForwardProp","prop","FORWARD_PROPS","includes","attrs","injectDefaultTheme","componentId","brandPresetUsed","STATIC_SIZES","responsiveProperty","round","property","padding","paddingTop","paddingRight","paddingBottom","paddingLeft","margin","marginTop","marginRight","marginBottom","marginLeft","fontSize","height","fluid","_ref","paddingXS","paddingS","paddingM","paddingL","paddingXL","responsiveNamedProperty","sizes","_ref2","paddingTopXS","paddingTopS","paddingTopM","paddingTopL","paddingTopXL","_ref3","paddingRightXS","paddingRightS","paddingRightM","paddingRightL","paddingRightXL","_ref4","paddingBottomXS","paddingBottomS","paddingBottomM","paddingBottomL","paddingBottomXL","_ref5","paddingLeftXS","paddingLeftS","paddingLeftM","paddingLeftL","paddingLeftXL","_ref6","marginXS","marginS","marginM","marginL","marginXL","_ref7","marginTopXS","marginTopS","marginTopM","marginTopL","marginTopXL","_ref8","marginRightXS","marginRightS","marginRightM","marginRightL","marginRightXL","_ref9","marginBottomXS","marginBottomS","marginBottomM","marginBottomL","marginBottomXL","_ref10","marginLeftXS","marginLeftS","marginLeftM","marginLeftL","marginLeftXL","_ref11","fontSizeXS","fontSizeS","fontSizeM","fontSizeL","fontSizeXL","_ref12","heightXS","heightS","heightM","heightL","heightXL","_ref13","widthXS","widthS","widthM","widthL","widthXL","customSizeHandler","_ref14","fluidXS","fluidS","fluidM","fluidL","fluidXL","IconSlot","span","Content","SpinnerIcon","Spinner","strokeWidth","CheckIcon","Check"],"mappings":"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"}
package/dts/index.d.ts CHANGED
@@ -1011,7 +1011,7 @@ declare namespace Badge {
1011
1011
  var displayName: string;
1012
1012
  }
1013
1013
 
1014
- declare type ButtonStaticSize = 'l' | 'm' | 's' | 'xs';
1014
+ declare type ButtonStaticSize = 'xl' | 'l' | 'm' | 's' | 'xs';
1015
1015
  declare type ButtonSize = ButtonStaticSize | ResponsiveProperty$1<`${number}rem` | number>;
1016
1016
  interface ButtonProps extends BaseProps$1, Display$1, Color$1, Color$1<'fontColor'>, ResponsiveNamedProperty$1<'padding'>, ResponsiveNamedProperty$1<'paddingTop'>, ResponsiveNamedProperty$1<'paddingRight'>, ResponsiveNamedProperty$1<'paddingBottom'>, ResponsiveNamedProperty$1<'paddingLeft'>, ResponsiveNamedProperty$1<'margin'>, ResponsiveNamedProperty$1<'marginTop'>, ResponsiveNamedProperty$1<'marginRight'>, ResponsiveNamedProperty$1<'marginBottom'>, ResponsiveNamedProperty$1<'marginLeft'>, ResponsiveNamedProperty$1<'fontSize'>, ResponsiveNamedProperty$1<'fluid', boolean>, ResponsiveNamedProperty$1<'width', 'auto' | 'l' | 'm' | 's' | 'xs' | number>, ResponsiveNamedProperty$1<'height', 'l' | 'm' | 's' | 'xs' | number> {
1017
1017
  /** Root node polymorphic type */