@foxford/ui 2.16.2 → 2.17.0-beta-cee51ed-20231220

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (65) hide show
  1. package/components/Alert/Alert.js +1 -1
  2. package/components/Alert/Alert.js.map +1 -1
  3. package/components/Alert/style.js +1 -1
  4. package/components/Alert/style.js.map +1 -1
  5. package/components/Alert/utils.js.map +1 -1
  6. package/components/Amount/Amount.js.map +1 -1
  7. package/components/Anchor/Anchor.js +1 -1
  8. package/components/Anchor/Anchor.js.map +1 -1
  9. package/components/Anchor/constants.js +2 -0
  10. package/components/Anchor/constants.js.map +1 -0
  11. package/components/Anchor/style.js +1 -1
  12. package/components/Anchor/style.js.map +1 -1
  13. package/components/Arrow/Arrow.js +1 -1
  14. package/components/Arrow/Arrow.js.map +1 -1
  15. package/components/Arrow/style.js +1 -1
  16. package/components/Arrow/style.js.map +1 -1
  17. package/components/ArrowBadge/constants.js.map +1 -1
  18. package/components/Badge/constants.js.map +1 -1
  19. package/components/Button/Button.js +1 -1
  20. package/components/Button/Button.js.map +1 -1
  21. package/components/Button/constants.js.map +1 -1
  22. package/components/Button/style.js +1 -1
  23. package/components/Button/style.js.map +1 -1
  24. package/components/Checkbox/Checkbox.js +1 -1
  25. package/components/Checkbox/Checkbox.js.map +1 -1
  26. package/components/Checkbox/style.js +1 -1
  27. package/components/Checkbox/style.js.map +1 -1
  28. package/components/ContextMenu.Multilevel/ContextMenu.Multilevel.js.map +1 -1
  29. package/components/Icon/Icon.js +1 -1
  30. package/components/Icon/Icon.js.map +1 -1
  31. package/components/Switcher/Switcher.js +1 -1
  32. package/components/Switcher/Switcher.js.map +1 -1
  33. package/components/Switcher/style.js +1 -1
  34. package/components/Switcher/style.js.map +1 -1
  35. package/components/Tab/constants.js.map +1 -1
  36. package/components/Tab/style.js.map +1 -1
  37. package/components/Text/constants.js.map +1 -1
  38. package/components/Text/style.js +1 -1
  39. package/components/Text/style.js.map +1 -1
  40. package/components/Text.Heading/Text.Heading.js +1 -1
  41. package/components/Text.Heading/Text.Heading.js.map +1 -1
  42. package/components/Textarea/Textarea.js +1 -1
  43. package/components/Textarea/Textarea.js.map +1 -1
  44. package/components/Textarea/style.js +1 -1
  45. package/components/Textarea/style.js.map +1 -1
  46. package/dts/index.d.ts +383 -381
  47. package/hocs/withMergedProps.js.map +1 -1
  48. package/hooks/useClassname.js +1 -1
  49. package/hooks/useClassname.js.map +1 -1
  50. package/index.cjs.js +1 -1
  51. package/index.cjs.js.map +1 -1
  52. package/mixins/color.js.map +1 -1
  53. package/mixins/responsive-property.js.map +1 -1
  54. package/mixins/shared.js.map +1 -1
  55. package/mixins/size.js +1 -1
  56. package/mixins/size.js.map +1 -1
  57. package/package.json +2 -1
  58. package/shared/utils/style.js.map +1 -1
  59. package/theme/colors-dark.js.map +1 -1
  60. package/theme/colors-light.js.map +1 -1
  61. package/theme/colors.js.map +1 -1
  62. package/hooks/use-theme.js +0 -2
  63. package/hooks/use-theme.js.map +0 -1
  64. package/shared/utils/inject-theme.js +0 -2
  65. package/shared/utils/inject-theme.js.map +0 -1
@@ -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 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{PROPS_BY_SIZE as c,SIZES_BRAND as u,SIZES as m,SIZES_ROUND_BRAND as p,SIZES_ROUND as f}from'./constants.js';import{Root as h,IconSlot as v,Content as y,SpinnerIcon as C,CheckIcon as g}from'./style.js';import{jsxs as b,jsx as k}from'react/jsx-runtime';var N=["display","size","sizes","fontColor","color","disabled","rounded","width","as","type","className","children","content","onClick","onClickCapture","onMouseEnter","onMouseLeave"];var S='Button';var j=r(((r,S)=>{var j;var R=t();var E=i(null===(j=R.components)||void 0===j?void 0:j.Button,r),{display:B="inline-flex",size:_="m",sizes:x,fontColor:I="white",color:M="accent",disabled:z=!1,rounded:L=!0,width:P="auto",as:D="button",type:W,className:w,children:A,content:O,onClick:Z,onClickCapture:U,onMouseEnter:T,onMouseLeave:F}=E,H=e(E,N);var Y='brand'===R.preset;if('string'==typeof H.preset&&(Y='brand'===H.preset),!Y&&'string'==typeof _&&!H.round){var q;var G=null!==(q=c[_])&&void 0!==q?q:{};H=o(o({},G),H)}var J=Y?u:m;H.round&&(J=Y?p:f),x&&(J=n(x,J));var K=s("Button",w);var Q=s("Button");var V=l(R,H);var X=d(D,z,H);H.href&&(D='a'),H.to&&(D=a),H.primary&&(M='primary'),H.secondary&&(M='atlantis');var $=Y?800:600;H.fontWeight&&($=H.fontWeight);var oo='number'==typeof $&&$>=800||'bold'===$;var eo='0px';L&&(eo=Y?'48px':'5px'),H.round&&(eo='50%');var[ro,ao]=Array.isArray(H.icon)?H.icon:[H.icon];return Y&&H.loading&&!H.success&&!z&&(ro=k(C,{strokeWidth:oo?2.5:1.5}),ao=null),H.success&&(ro=k(g,{strokeWidth:oo?3:1.5}),ao=null),b(h,o(o(o({},H),X),{},{className:K,as:D,color:M,fontColor:I,disabled:z,rel:V,display:B,rounded:L,size:_,sizes:J,dynamicSizeDeclaration:(o,e,r)=>({[e]:'string'==typeof o?o:"".concat(o).concat(r),padding:H.round?'1em':'1em 1.6em'}),fontWeight:$,borderRadius:eo,brandPresetUsed:Y,ref:null!=S?S:H.innerRef,type:'button'===D?W:void 0,lineHeight:Y?1.2:1,width:H.round?void 0:P,palette:{},onClick:o=>{z||H.loading||null==Z||Z(o)},onClickCapture:o=>{z||H.loading||null==U||U(o)},onMouseEnter:o=>{z||H.loading||null==T||T(o)},onMouseLeave:o=>{z||H.loading||null==F||F(o)},children:[ro&&k(v,{className:"icon",marginRight:!H.round,children:ro}),(O||A)&&k(y,{className:"".concat(Q,"__content"),children:O||A}),ao&&!H.round&&k(v,{className:"icon",marginLeft:!0,children:ao})]}))}));j.displayName="Button";export{j as Button,S 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{useTheme as n}from'styled-components';import{Link as t}from'react-router-dom';import{mergeDeepLeft as a}from'ramda';import{useClassname as s}from'../../hooks/useClassname.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 c,SIZES_BRAND as u,SIZES as m,SIZES_ROUND_BRAND as p,SIZES_ROUND as f}from'./constants.js';import{Root as h,IconSlot as v,Content as y,SpinnerIcon as C,CheckIcon as g}from'./style.js';import{jsxs as b,jsx as k}from'react/jsx-runtime';var N=["display","size","sizes","fontColor","color","disabled","rounded","width","as","type","className","children","content","onClick","onClickCapture","onMouseEnter","onMouseLeave"];var S='Button';var R=r(((r,S)=>{var R;var j=n();var E=i(null===(R=j.components)||void 0===R?void 0:R.Button,r),{display:B="inline-flex",size:_="m",sizes:x,fontColor:I="white",color:M="accent",disabled:z=!1,rounded:L=!0,width:P="auto",as:D="button",type:W,className:w,children:A,content:O,onClick:Z,onClickCapture:U,onMouseEnter:T,onMouseLeave:H}=E,Y=e(E,N);var q='brand'===j.preset;if('string'==typeof Y.preset&&(q='brand'===Y.preset),!q&&'string'==typeof _&&!Y.round){var F;var G=null!==(F=c[_])&&void 0!==F?F:{};Y=o(o({},G),Y)}var J=q?u:m;Y.round&&(J=q?p:f),x&&(J=a(x,J));var K=s("Button",w);var Q=s("Button");var V=l(j,Y);var X=d(D,z,Y);Y.href&&(D='a'),Y.to&&(D=t),Y.primary&&(M='primary'),Y.secondary&&(M='atlantis');var $=q?800:600;Y.fontWeight&&($=Y.fontWeight);var oo='number'==typeof $&&$>=800||'bold'===$;var eo='0px';L&&(eo=q?'48px':'5px'),Y.round&&(eo='50%');var[ro,no]=Array.isArray(Y.icon)?Y.icon:[Y.icon];return q&&Y.loading&&!Y.success&&!z&&(ro=k(C,{strokeWidth:oo?2.5:1.5}),no=null),Y.success&&(ro=k(g,{strokeWidth:oo?3:1.5}),no=null),b(h,o(o(o({},Y),X),{},{className:K,as:D,color:M,fontColor:I,disabled:z,rel:V,display:B,rounded:L,size:_,sizes:J,dynamicSizeDeclaration:(o,e,r)=>({[e]:'string'==typeof o?o:"".concat(o).concat(r),padding:Y.round?'1em':'1em 1.6em'}),fontWeight:$,borderRadius:eo,brandPresetUsed:q,ref:null!=S?S:Y.innerRef,type:'button'===D?W:void 0,lineHeight:q?1.2:1,width:Y.round?void 0:P,palette:{},onClick:o=>{z||Y.loading||null==Z||Z(o)},onClickCapture:o=>{z||Y.loading||null==U||U(o)},onMouseEnter:o=>{z||Y.loading||null==T||T(o)},onMouseLeave:o=>{z||Y.loading||null==H||H(o)},children:[ro&&k(v,{className:"icon",marginRight:!Y.round,children:ro}),(O||A)&&k(y,{className:"".concat(Q,"__content"),children:O||A}),no&&!Y.round&&k(v,{className:"icon",marginLeft:!0,children:no})]}))}));R.displayName="Button";export{R as Button,S 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 type { Sizes } from 'shared/interfaces'\nimport { useComputedRel, useComputedLinkProps } from './hooks'\nimport { SIZES, SIZES_BRAND, SIZES_ROUND, SIZES_ROUND_BRAND, PROPS_BY_SIZE } from './constants'\nimport type { ButtonProps, StyledButtonProps } from './types'\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 sizes,\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 && typeof size === 'string' && !configProps.round) {\n const propsBySize = PROPS_BY_SIZE[size] ?? {}\n configProps = { ...propsBySize, ...configProps }\n }\n\n let componentSizes = brandPresetUsed ? SIZES_BRAND : SIZES\n if (configProps.round) componentSizes = brandPresetUsed ? SIZES_ROUND_BRAND : SIZES_ROUND\n if (sizes) componentSizes = mergeDeepLeft(sizes, componentSizes) as Sizes\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 handleDynamicSizeDeclaration: StyledButtonProps['dynamicSizeDeclaration'] = (size, cssProperty, cssUnit) => {\n return {\n [cssProperty]: typeof size === 'string' ? size : `${size}${cssUnit}`,\n padding: configProps.round ? '1em' : '1em 1.6em',\n }\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 sizes={componentSizes}\n dynamicSizeDeclaration={handleDynamicSizeDeclaration}\n fontWeight={fontWeight}\n borderRadius={borderRadius}\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 palette={{}}\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","sizes","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$size","propsBySize","PROPS_BY_SIZE","componentSizes","SIZES_BRAND","SIZES","SIZES_ROUND_BRAND","SIZES_ROUND","mergeDeepLeft","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","dynamicSizeDeclaration","cssProperty","cssUnit","padding","innerRef","lineHeight","palette","evt","Styled.IconSlot","marginRight","Styled.Content","concat","marginLeft","displayName"],"mappings":"i6BAYMA,IAAAA,EAAiB,SAKjBC,IAAAA,EAASC,GAAqC,CAACC,EAAOC,KAAQ,IAAAC,EAClE,IAAMC,EAAQC,IAEd,IAmBIC,EAAAA,UAA+BF,EAAAA,EAAMG,kBAAAA,aAANJ,EAAkBJ,OAAQE,IAnBzDO,QACFA,EAAU,cADRC,KAEFA,EAAO,IAFLC,MAGFA,EAHEC,UAIFA,EAAY,QAJVC,MAKFA,EAAQ,SALNC,SAMFA,KANEC,QAOFA,GAAU,EAPRC,MAQFA,EAAQ,OACRC,GAAIC,EAAM,SACVC,KAAMC,EACNC,UAAWC,EAXTC,SAYFA,EAZEC,QAaFA,EAbEC,QAcFA,EAdEC,eAeFA,EAfEC,aAgBFA,EAhBEC,aAiBFA,GAjBFC,EAkBKC,EAlBLC,EAAAF,EAAAG,GAqBA,IAAIC,EAAmC,UAAjB5B,EAAM6B,OAG5B,GAFkC,iBAAvBJ,EAAYI,SAAqBD,EAAyC,UAAvBH,EAAYI,SAErED,GAAmC,iBAATvB,IAAsBoB,EAAYK,MAAO,CAAA,IAAAC,EACtE,IAAMC,UAAcC,EAAAA,EAAc5B,UAAAA,QAAS,GAC3CoB,EAAmBO,EAAAA,EAAAA,GAAAA,GAAgBP,GAGrC,IAAIS,EAAiBN,EAAkBO,EAAcC,EACjDX,EAAYK,QAAOI,EAAiBN,EAAkBS,EAAoBC,GAC1EhC,IAAO4B,EAAiBK,EAAcjC,EAAO4B,IAEjD,IAAMlB,EAAYwB,EAzCG,SAyC0BvB,GAC/C,IAAMwB,EAAmBD,EA1CJ,UA2CrB,IAAME,EAAMC,EAAe3C,EAAOyB,GAClC,IAAMmB,EAAYC,EAAqBhC,EAAKJ,EAAUgB,GAElDA,EAAYqB,OAAMjC,EAAM,KACxBY,EAAYsB,KAAIlC,EAAMmC,GAEtBvB,EAAYwB,UAASzC,EAAQ,WAC7BiB,EAAYyB,YAAW1C,EAAQ,YAEnC,IAAI2C,EAAwCvB,EAAkB,IAAM,IAChEH,EAAY0B,aAAYA,EAAa1B,EAAY0B,YAErD,IAAMC,GAAkC,iBAAfD,GAA2BA,GAAc,KAAuB,SAAfA,EAE1E,IAAIE,GAAe,MACf3C,IAAS2C,GAAezB,EAAkB,OAAS,OACnDH,EAAYK,QAAOuB,GAAe,OAEtC,IAAKC,GAAUC,IAAaC,MAAMC,QAAQhC,EAAYiC,MAAQjC,EAAYiC,KAAO,CAACjC,EAAYiC,MA+B9F,OA7BI9B,GAAmBH,EAAYkC,UAAYlC,EAAYmC,UAAYnD,IACrE6C,GAAWO,EAACC,EAAD,CAAoBC,YAAaX,GAAW,IAAM,MAC7DG,GAAY,MAEV9B,EAAYmC,UACdN,GAAWO,EAACG,EAAD,CAAkBD,YAAaX,GAAW,EAAI,MACzDG,GAAY,MAwBZU,EAACC,EACKzC,EAAAA,EAAAA,EAAAA,GAAAA,GACAmB,GAFN,GAAA,CAGE5B,UAAWA,EACXJ,GAAIC,EACJL,MAAOA,EACPD,UAAWA,EACXE,SAAUA,EACViC,IAAKA,EACLtC,QAASA,EACTM,QAASA,EACTL,KAAMA,EACNC,MAAO4B,EACPiC,uBAlC8E,CAAC9D,EAAM+D,EAAaC,KAAAA,CAElGD,CAACA,GAA8B,iBAAT/D,EAAoBA,EAAUA,GAAAA,OAAAA,GAAOgE,OAAAA,GAC3DC,QAAS7C,EAAYK,MAAQ,MAAQ,cAgCrCqB,WAAYA,EACZE,aAAcA,GACdzB,gBAAiBA,EACjB9B,IAAKA,MAAAA,EAAAA,EAAO2B,EAAY8C,SACxBzD,KAAc,WAARD,EAAmBE,OAAAA,EACzByD,WAAY5C,EAAkB,IAAM,EACpCjB,MAAOc,EAAYK,aAAoBnB,EACvC8D,QAAS,GACTrD,QApCyCsD,IACtCjE,GAAagB,EAAYkC,SAASvC,MAAAA,GAAAA,EAAUsD,IAoC/CrD,eAlCuDqD,IACpDjE,GAAagB,EAAYkC,SAAStC,MAAAA,GAAAA,EAAiBqD,IAkCtDpD,aAhCmDoD,IAChDjE,GAAagB,EAAYkC,SAASrC,MAAAA,GAAAA,EAAeoD,IAgCpDnD,aA9BmDmD,IAChDjE,GAAagB,EAAYkC,SAASpC,MAAAA,GAAAA,EAAemD,IAItDxD,SAAA,CA2BGoC,IACCO,EAACc,EAAD,CAAiB3D,UAAU,OAAO4D,aAAcnD,EAAYK,MAA5DZ,SACGoC,MAGHnC,GAAWD,IACX2C,EAACgB,EAAD,CAAgB7D,UAAS,GAAA8D,OAAKrC,EAA9B,aAAAvB,SAA4DC,GAAWD,IAExEqC,KAAc9B,EAAYK,OACzB+B,EAACc,EAAD,CAAiB3D,UAAU,OAAO+D,YAAlC,EAAA7D,SACGqC,YAOX5D,EAAOqF,YAzIgB"}
1
+ {"version":3,"file":"Button.js","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { useTheme } from 'styled-components'\nimport { Link } from 'react-router-dom'\nimport { mergeDeepLeft } from 'ramda'\nimport { useClassname } from 'hooks/useClassname'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport type { Sizes } from 'shared/types'\nimport { useComputedRel, useComputedLinkProps } from './hooks'\nimport { SIZES, SIZES_BRAND, SIZES_ROUND, SIZES_ROUND_BRAND, PROPS_BY_SIZE } from './constants'\nimport type { ButtonProps, StyledButtonProps } from './types'\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 = useTheme()\n\n let {\n display = 'inline-flex',\n size = 'm',\n sizes,\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 && typeof size === 'string' && !configProps.round) {\n const propsBySize = PROPS_BY_SIZE[size] ?? {}\n configProps = { ...propsBySize, ...configProps }\n }\n\n let componentSizes = brandPresetUsed ? SIZES_BRAND : SIZES\n if (configProps.round) componentSizes = brandPresetUsed ? SIZES_ROUND_BRAND : SIZES_ROUND\n if (sizes) componentSizes = mergeDeepLeft(sizes, componentSizes) as Sizes\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 handleDynamicSizeDeclaration: StyledButtonProps['dynamicSizeDeclaration'] = (size, cssProperty, cssUnit) => {\n return {\n [cssProperty]: typeof size === 'string' ? size : `${size}${cssUnit}`,\n padding: configProps.round ? '1em' : '1em 1.6em',\n }\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 sizes={componentSizes}\n dynamicSizeDeclaration={handleDynamicSizeDeclaration}\n fontWeight={fontWeight}\n borderRadius={borderRadius}\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 palette={{}}\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","useTheme","useConfigPriority","components","display","size","sizes","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$size","propsBySize","PROPS_BY_SIZE","componentSizes","SIZES_BRAND","SIZES","SIZES_ROUND_BRAND","SIZES_ROUND","mergeDeepLeft","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","dynamicSizeDeclaration","cssProperty","cssUnit","padding","innerRef","lineHeight","palette","evt","Styled.IconSlot","marginRight","Styled.Content","concat","marginLeft","displayName"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"constants.js","sources":["../../../../src/components/Button/constants.ts"],"sourcesContent":["import type { Sizes, Size } from 'shared/interfaces'\nimport type { ButtonProps } from './types'\n\nexport const FORWARD_PROPS = [\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 SIZES: Sizes = {\n xxxl: {\n fontSize: 24,\n height: 78,\n paddingLeft: 44,\n paddingRight: 44,\n },\n xxl: {\n fontSize: 22,\n height: 72,\n paddingLeft: 40,\n paddingRight: 40,\n },\n xl: {\n fontSize: 20,\n height: 68,\n paddingLeft: 40,\n paddingRight: 40,\n },\n l: {\n fontSize: 18,\n height: 60,\n paddingLeft: 36,\n paddingRight: 36,\n },\n m: {\n fontSize: 16,\n height: 52,\n paddingLeft: 32,\n paddingRight: 32,\n },\n s: {\n fontSize: 14,\n height: 40,\n paddingLeft: 28,\n paddingRight: 28,\n },\n xs: {\n fontSize: 14,\n height: 40,\n paddingLeft: 28,\n paddingRight: 28,\n },\n xxs: {\n fontSize: 12,\n height: 32,\n paddingLeft: 18,\n paddingRight: 18,\n },\n xxxs: {\n fontSize: 10,\n height: 28,\n paddingLeft: 12,\n paddingRight: 12,\n },\n}\n\nexport const SIZES_BRAND: Sizes = {\n xxxl: {\n fontSize: 22,\n height: 64,\n paddingLeft: 36,\n paddingRight: 36,\n },\n xxl: {\n fontSize: 20,\n height: 60,\n paddingLeft: 34,\n paddingRight: 34,\n },\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 xxs: {\n fontSize: 12,\n height: 28,\n paddingLeft: 14,\n paddingRight: 14,\n },\n xxxs: {\n fontSize: 10,\n height: 24,\n paddingLeft: 12,\n paddingRight: 12,\n },\n}\n\nexport const SIZES_ROUND: Sizes = {\n xxxl: {\n fontSize: 32,\n lineHeight: 1,\n padding: '0.28em',\n width: 72,\n height: 72,\n },\n xxl: {\n fontSize: 30,\n lineHeight: 1,\n padding: '0.28em',\n width: 68,\n height: 68,\n },\n xl: {\n fontSize: 26,\n lineHeight: 1,\n padding: '0.28em',\n width: 60,\n height: 60,\n },\n l: {\n fontSize: 23,\n lineHeight: 1,\n padding: '0.28em',\n width: 52,\n height: 52,\n },\n m: {\n fontSize: 21,\n lineHeight: 1,\n padding: '0.28em',\n width: 48,\n height: 48,\n },\n s: {\n fontSize: 18,\n lineHeight: 1,\n padding: '0.28em',\n width: 40,\n height: 40,\n },\n xs: {\n fontSize: 14,\n lineHeight: 1,\n padding: '0.28em',\n width: 32,\n height: 32,\n },\n xxs: {\n fontSize: 12,\n lineHeight: 1,\n padding: '0.28em',\n width: 24,\n height: 24,\n },\n xxxs: {\n fontSize: 8,\n lineHeight: 1,\n padding: '0.28em',\n width: 18,\n height: 18,\n },\n}\n\nexport const SIZES_ROUND_BRAND: Sizes = {\n xxxl: {\n fontSize: 22,\n padding: '1em',\n },\n xxl: {\n fontSize: 20,\n padding: '1em',\n },\n xl: {\n fontSize: 18,\n padding: '1em',\n },\n l: {\n fontSize: 16,\n padding: '1em',\n },\n m: {\n fontSize: 16,\n padding: '1em',\n },\n s: {\n fontSize: 14,\n padding: '1em',\n },\n xs: {\n fontSize: 14,\n padding: '1em',\n },\n xxs: {\n fontSize: 12,\n padding: '1em',\n },\n xxxs: {\n fontSize: 10,\n padding: '1em',\n },\n}\n\n// delete in next major version bump\nexport const PROPS_BY_SIZE: Partial<Record<Size, ButtonProps>> = {\n xl: {\n paddingLeftM: 36,\n paddingRightM: 36,\n paddingLeftS: 32,\n paddingRightS: 32,\n },\n l: {\n fontSizeM: 'm',\n heightM: 56,\n heightS: 52,\n paddingLeftM: 28,\n paddingRightM: 28,\n paddingLeftS: 24,\n paddingRightS: 24,\n },\n m: {\n paddingLeftM: 24,\n paddingRightM: 24,\n paddingLeftS: 20,\n paddingRightS: 20,\n },\n s: {\n paddingLeftM: 20,\n paddingRightM: 20,\n paddingLeftS: 16,\n paddingRightS: 16,\n },\n xs: {\n paddingLeftM: 20,\n paddingRightM: 20,\n paddingLeftS: 16,\n paddingRightS: 16,\n },\n}\n"],"names":["FORWARD_PROPS","SIZES","xxxl","fontSize","height","paddingLeft","paddingRight","xxl","xl","l","m","s","xs","xxs","xxxs","SIZES_BRAND","SIZES_ROUND","lineHeight","padding","width","SIZES_ROUND_BRAND","PROPS_BY_SIZE","paddingLeftM","paddingRightM","paddingLeftS","paddingRightS","fontSizeM","heightM","heightS"],"mappings":"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"}
1
+ {"version":3,"file":"constants.js","sources":["../../../../src/components/Button/constants.ts"],"sourcesContent":["import type { Sizes, Size } from 'shared/types'\nimport type { ButtonProps } from './types'\n\nexport const FORWARD_PROPS = [\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 SIZES: Sizes = {\n xxxl: {\n fontSize: 24,\n height: 78,\n paddingLeft: 44,\n paddingRight: 44,\n },\n xxl: {\n fontSize: 22,\n height: 72,\n paddingLeft: 40,\n paddingRight: 40,\n },\n xl: {\n fontSize: 20,\n height: 68,\n paddingLeft: 40,\n paddingRight: 40,\n },\n l: {\n fontSize: 18,\n height: 60,\n paddingLeft: 36,\n paddingRight: 36,\n },\n m: {\n fontSize: 16,\n height: 52,\n paddingLeft: 32,\n paddingRight: 32,\n },\n s: {\n fontSize: 14,\n height: 40,\n paddingLeft: 28,\n paddingRight: 28,\n },\n xs: {\n fontSize: 14,\n height: 40,\n paddingLeft: 28,\n paddingRight: 28,\n },\n xxs: {\n fontSize: 12,\n height: 32,\n paddingLeft: 18,\n paddingRight: 18,\n },\n xxxs: {\n fontSize: 10,\n height: 28,\n paddingLeft: 12,\n paddingRight: 12,\n },\n}\n\nexport const SIZES_BRAND: Sizes = {\n xxxl: {\n fontSize: 22,\n height: 64,\n paddingLeft: 36,\n paddingRight: 36,\n },\n xxl: {\n fontSize: 20,\n height: 60,\n paddingLeft: 34,\n paddingRight: 34,\n },\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 xxs: {\n fontSize: 12,\n height: 28,\n paddingLeft: 14,\n paddingRight: 14,\n },\n xxxs: {\n fontSize: 10,\n height: 24,\n paddingLeft: 12,\n paddingRight: 12,\n },\n}\n\nexport const SIZES_ROUND: Sizes = {\n xxxl: {\n fontSize: 32,\n lineHeight: 1,\n padding: '0.28em',\n width: 72,\n height: 72,\n },\n xxl: {\n fontSize: 30,\n lineHeight: 1,\n padding: '0.28em',\n width: 68,\n height: 68,\n },\n xl: {\n fontSize: 26,\n lineHeight: 1,\n padding: '0.28em',\n width: 60,\n height: 60,\n },\n l: {\n fontSize: 23,\n lineHeight: 1,\n padding: '0.28em',\n width: 52,\n height: 52,\n },\n m: {\n fontSize: 21,\n lineHeight: 1,\n padding: '0.28em',\n width: 48,\n height: 48,\n },\n s: {\n fontSize: 18,\n lineHeight: 1,\n padding: '0.28em',\n width: 40,\n height: 40,\n },\n xs: {\n fontSize: 14,\n lineHeight: 1,\n padding: '0.28em',\n width: 32,\n height: 32,\n },\n xxs: {\n fontSize: 12,\n lineHeight: 1,\n padding: '0.28em',\n width: 24,\n height: 24,\n },\n xxxs: {\n fontSize: 8,\n lineHeight: 1,\n padding: '0.28em',\n width: 18,\n height: 18,\n },\n}\n\nexport const SIZES_ROUND_BRAND: Sizes = {\n xxxl: {\n fontSize: 22,\n padding: '1em',\n },\n xxl: {\n fontSize: 20,\n padding: '1em',\n },\n xl: {\n fontSize: 18,\n padding: '1em',\n },\n l: {\n fontSize: 16,\n padding: '1em',\n },\n m: {\n fontSize: 16,\n padding: '1em',\n },\n s: {\n fontSize: 14,\n padding: '1em',\n },\n xs: {\n fontSize: 14,\n padding: '1em',\n },\n xxs: {\n fontSize: 12,\n padding: '1em',\n },\n xxxs: {\n fontSize: 10,\n padding: '1em',\n },\n}\n\n// delete in next major version bump\nexport const PROPS_BY_SIZE: Partial<Record<Size, ButtonProps>> = {\n xl: {\n paddingLeftM: 36,\n paddingRightM: 36,\n paddingLeftS: 32,\n paddingRightS: 32,\n },\n l: {\n fontSizeM: 'm',\n heightM: 56,\n heightS: 52,\n paddingLeftM: 28,\n paddingRightM: 28,\n paddingLeftS: 24,\n paddingRightS: 24,\n },\n m: {\n paddingLeftM: 24,\n paddingRightM: 24,\n paddingLeftS: 20,\n paddingRightS: 20,\n },\n s: {\n paddingLeftM: 20,\n paddingRightM: 20,\n paddingLeftS: 16,\n paddingRightS: 16,\n },\n xs: {\n paddingLeftM: 20,\n paddingRightM: 20,\n paddingLeftS: 16,\n paddingRightS: 16,\n },\n}\n"],"names":["FORWARD_PROPS","SIZES","xxxl","fontSize","height","paddingLeft","paddingRight","xxl","xl","l","m","s","xs","xxs","xxxs","SIZES_BRAND","SIZES_ROUND","lineHeight","padding","width","SIZES_ROUND_BRAND","PROPS_BY_SIZE","paddingLeftM","paddingRightM","paddingLeftS","paddingRightS","fontSizeM","heightM","heightS"],"mappings":"AAGaA,IAAAA,EAAgB,CAC3B,KACA,KACA,SACA,MACA,MACA,OACA,OACA,WACA,YACA,QACA,OACA,UACA,iBACA,eACA,eACA,YAGK,IAAMC,EAAe,CAC1BC,KAAM,CACJC,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBC,IAAK,CACHJ,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBE,GAAI,CACFL,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBG,EAAG,CACDN,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBI,EAAG,CACDP,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBK,EAAG,CACDR,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBM,GAAI,CACFT,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBO,IAAK,CACHV,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBQ,KAAM,CACJX,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,KAIX,IAAMS,EAAqB,CAChCb,KAAM,CACJC,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBC,IAAK,CACHJ,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBE,GAAI,CACFL,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBG,EAAG,CACDN,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBI,EAAG,CACDP,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBK,EAAG,CACDR,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBM,GAAI,CACFT,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBO,IAAK,CACHV,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,IAEhBQ,KAAM,CACJX,SAAU,GACVC,OAAQ,GACRC,YAAa,GACbC,aAAc,KAIX,IAAMU,EAAqB,CAChCd,KAAM,CACJC,SAAU,GACVc,WAAY,EACZC,QAAS,SACTC,MAAO,GACPf,OAAQ,IAEVG,IAAK,CACHJ,SAAU,GACVc,WAAY,EACZC,QAAS,SACTC,MAAO,GACPf,OAAQ,IAEVI,GAAI,CACFL,SAAU,GACVc,WAAY,EACZC,QAAS,SACTC,MAAO,GACPf,OAAQ,IAEVK,EAAG,CACDN,SAAU,GACVc,WAAY,EACZC,QAAS,SACTC,MAAO,GACPf,OAAQ,IAEVM,EAAG,CACDP,SAAU,GACVc,WAAY,EACZC,QAAS,SACTC,MAAO,GACPf,OAAQ,IAEVO,EAAG,CACDR,SAAU,GACVc,WAAY,EACZC,QAAS,SACTC,MAAO,GACPf,OAAQ,IAEVQ,GAAI,CACFT,SAAU,GACVc,WAAY,EACZC,QAAS,SACTC,MAAO,GACPf,OAAQ,IAEVS,IAAK,CACHV,SAAU,GACVc,WAAY,EACZC,QAAS,SACTC,MAAO,GACPf,OAAQ,IAEVU,KAAM,CACJX,SAAU,EACVc,WAAY,EACZC,QAAS,SACTC,MAAO,GACPf,OAAQ,KAIL,IAAMgB,EAA2B,CACtClB,KAAM,CACJC,SAAU,GACVe,QAAS,OAEXX,IAAK,CACHJ,SAAU,GACVe,QAAS,OAEXV,GAAI,CACFL,SAAU,GACVe,QAAS,OAEXT,EAAG,CACDN,SAAU,GACVe,QAAS,OAEXR,EAAG,CACDP,SAAU,GACVe,QAAS,OAEXP,EAAG,CACDR,SAAU,GACVe,QAAS,OAEXN,GAAI,CACFT,SAAU,GACVe,QAAS,OAEXL,IAAK,CACHV,SAAU,GACVe,QAAS,OAEXJ,KAAM,CACJX,SAAU,GACVe,QAAS,QAKN,IAAMG,EAAoD,CAC/Db,GAAI,CACFc,aAAc,GACdC,cAAe,GACfC,aAAc,GACdC,cAAe,IAEjBhB,EAAG,CACDiB,UAAW,IACXC,QAAS,GACTC,QAAS,GACTN,aAAc,GACdC,cAAe,GACfC,aAAc,GACdC,cAAe,IAEjBf,EAAG,CACDY,aAAc,GACdC,cAAe,GACfC,aAAc,GACdC,cAAe,IAEjBd,EAAG,CACDW,aAAc,GACdC,cAAe,GACfC,aAAc,GACdC,cAAe,IAEjBb,GAAI,CACFU,aAAc,GACdC,cAAe,GACfC,aAAc,GACdC,cAAe"}
@@ -1,2 +1,2 @@
1
- import o,{css as n,keyframes as r}from'styled-components';import e from'tinycolor2';import{property as t,responsiveNamedProperty as a}from'../../mixins/responsive-property.js';import{color as c}from'../../mixins/color.js';import{responsiveSize as i}from'../../mixins/size.js';import{injectDefaultTheme as s}from'../../shared/utils/inject-theme.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 m={xl:320,l:280,m:245,s:180,xs:140};var p=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 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 h=r(["0%{background-position:0 0;}100%{background-position:50px 50px;}"]);var b=r(["100%{transform:rotate(360deg);}"]);var u=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;"],h);var f=o=>'auto'===o?'auto':'number'==typeof o||'boolean'==typeof o?o:o&&m[o]?m[o]:'auto';var v=()=>n(["min-width:initial;width:100%;"]);var y="\n content: '';\n position: absolute;\n inset: 0;\n border-radius: inherit;\n";var L={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(y,"\n background-color: ").concat(e,";\n opacity: 0;\n }\n &::after {\n ").concat(y,"\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(y,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(y,"\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=o.theme.colors.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=o.theme.colors.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 1px ").concat(e,";\n\n &::before {\n ").concat(y,"\n background-color: ").concat(t,";\n opacity: 0;\n }\n &::after {\n ").concat(y,"\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=o.theme.colors.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=o.theme.colors.transparent),"\n background-color: ".concat(n,";\n color: ").concat(r,";\n box-shadow: inset 0 0 0 1px ").concat(e,";\n\n &::before {\n ").concat(y,"\n background-color: ").concat(o.theme.colors['bg-oncolor-primary'],";\n opacity: 0;\n }\n &::after {\n ").concat(y,"\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(y,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(y,"\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(y,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(y,"\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(y,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(y,"\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(y,"\n background-color: ").concat(o.theme.colors['bg-oncontrast-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(y,"\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 S={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?u:''),(o=>{var n='background-color';return(o.inverted||o.basic||o.outline)&&(n='color'),c(o.color,n)}),(o=>{var n='color';return(o.inverted||o.basic||o.outline)&&(n='background-color'),c(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 x=o.button.withConfig({shouldForwardProp:o=>d.includes(o)||o.includes('data')}).attrs(s).withConfig({componentId:"fox-ui__sc-16o31r2-0"})([""," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," ",""],p,(o=>o.brandPresetUsed?!o.clear||o.base||o.outline||o.onColored?o.clear&&!o.base&&!o.outline&&o.onColored?L.clear.onColored:!o.base||o.clear||o.outline||o.onColored?o.base&&!o.clear&&!o.outline&&o.onColored?L.base.onColored:!o.outline||o.clear||o.base||o.onColored?o.outline&&!o.clear&&!o.base&&o.onColored?L.outline.onColored:o.onColored?L.filled.onColored:L.filled.default:L.outline.default:L.base.default:L.clear.default:S.default),i,(o=>o.padding?t(o.padding,'padding'):null),(o=>o.paddingTop?t(o.paddingTop,'padding-top'):null),(o=>o.paddingRight?t(o.paddingRight,'padding-right'):null),(o=>o.paddingBottom?t(o.paddingBottom,'padding-bottom'):null),(o=>o.paddingLeft?t(o.paddingLeft,'padding-left'):null),(o=>o.margin?t(o.margin,'margin'):null),(o=>o.marginTop?t(o.marginTop,'margin-top'):null),(o=>o.marginRight?t(o.marginRight,'margin-right'):null),(o=>o.marginBottom?t(o.marginBottom,'margin-bottom'):null),(o=>o.marginLeft?t(o.marginLeft,'margin-left'):null),(o=>o.fontSize?t(o.fontSize,'font-size'):null),(o=>o.height?t(o.height,'height'):null),(o=>{var n=o.fluid&&'auto'!==o.width?'max-width':'width';return o.width?t(f(o.width),n):null}),(o=>{var{paddingXS:n,paddingS:r,paddingM:e,paddingL:t,paddingXL:c}=o;return a({sizes:{paddingXS:n,paddingS:r,paddingM:e,paddingL:t,paddingXL:c},cssProperty:'padding'})}),(o=>{var{paddingTopXS:n,paddingTopS:r,paddingTopM:e,paddingTopL:t,paddingTopXL:c}=o;return a({sizes:{paddingTopXS:n,paddingTopS:r,paddingTopM:e,paddingTopL:t,paddingTopXL:c},cssProperty:'padding-top'})}),(o=>{var{paddingRightXS:n,paddingRightS:r,paddingRightM:e,paddingRightL:t,paddingRightXL:c}=o;return a({sizes:{paddingRightXS:n,paddingRightS:r,paddingRightM:e,paddingRightL:t,paddingRightXL:c},cssProperty:'padding-right'})}),(o=>{var{paddingBottomXS:n,paddingBottomS:r,paddingBottomM:e,paddingBottomL:t,paddingBottomXL:c}=o;return a({sizes:{paddingBottomXS:n,paddingBottomS:r,paddingBottomM:e,paddingBottomL:t,paddingBottomXL:c},cssProperty:'padding-bottom'})}),(o=>{var{paddingLeftXS:n,paddingLeftS:r,paddingLeftM:e,paddingLeftL:t,paddingLeftXL:c}=o;return a({sizes:{paddingLeftXS:n,paddingLeftS:r,paddingLeftM:e,paddingLeftL:t,paddingLeftXL:c},cssProperty:'padding-left'})}),(o=>{var{marginXS:n,marginS:r,marginM:e,marginL:t,marginXL:c}=o;return a({sizes:{marginXS:n,marginS:r,marginM:e,marginL:t,marginXL:c},cssProperty:'margin'})}),(o=>{var{marginTopXS:n,marginTopS:r,marginTopM:e,marginTopL:t,marginTopXL:c}=o;return a({sizes:{marginTopXS:n,marginTopS:r,marginTopM:e,marginTopL:t,marginTopXL:c},cssProperty:'margin-top'})}),(o=>{var{marginRightXS:n,marginRightS:r,marginRightM:e,marginRightL:t,marginRightXL:c}=o;return a({sizes:{marginRightXS:n,marginRightS:r,marginRightM:e,marginRightL:t,marginRightXL:c},cssProperty:'margin-right'})}),(o=>{var{marginBottomXS:n,marginBottomS:r,marginBottomM:e,marginBottomL:t,marginBottomXL:c}=o;return a({sizes:{marginBottomXS:n,marginBottomS:r,marginBottomM:e,marginBottomL:t,marginBottomXL:c},cssProperty:'margin-bottom'})}),(o=>{var{marginLeftXS:n,marginLeftS:r,marginLeftM:e,marginLeftL:t,marginLeftXL:c}=o;return a({sizes:{marginLeftXS:n,marginLeftS:r,marginLeftM:e,marginLeftL:t,marginLeftXL:c},cssProperty:'margin-left'})}),(o=>{var{fontSizeXS:n,fontSizeS:r,fontSizeM:e,fontSizeL:t,fontSizeXL:c}=o;return a({sizes:{fontSizeXS:n,fontSizeS:r,fontSizeM:e,fontSizeL:t,fontSizeXL:c},cssProperty:'font-size'})}),(o=>{var{heightXS:n,heightS:r,heightM:e,heightL:t,heightXL:c}=o;return a({sizes:{heightXS:n,heightS:r,heightM:e,heightL:t,heightXL:c},cssProperty:'height'})}),(o=>{var{widthXS:n,widthS:r,widthM:e,widthL:t,widthXL:c,fluid:i,width:s}=o;return a({sizes:{widthXS:n,widthS:r,widthM:e,widthL:t,widthXL:c},cssProperty:i&&'auto'!==s?'max-width':'width',customSizeHandler:f})}),(o=>o.fluid?t(o.fluid,v):null),(o=>{var{fluidXS:n,fluidS:r,fluidM:e,fluidL:t,fluidXL:c}=o;return a({sizes:{fluidXS:n,fluidS:r,fluidM:e,fluidL:t,fluidXL:c},cssProperty:v})}));var X=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 w=o.span.withConfig({componentId:"fox-ui__sc-16o31r2-2"})(["position:relative;z-index:1;"]);var k=o(g).withConfig({componentId:"fox-ui__sc-16o31r2-3"})(["width:100%;animation:"," 2000ms linear infinite;",""],b,(o=>"\n > path {\n stroke-width: ".concat(o.strokeWidth,";\n }\n ")));var z=o(l).withConfig({componentId:"fox-ui__sc-16o31r2-4"})(["width:100%;",""],(o=>"\n > path {\n stroke-width: ".concat(o.strokeWidth,";\n }\n ")));export{z as CheckIcon,w as Content,X as IconSlot,x as Root,k as SpinnerIcon};
1
+ import o,{css as n,keyframes as r}from'styled-components';import e from'tinycolor2';import{property as t,responsiveNamedProperty as a}from'../../mixins/responsive-property.js';import{color as c}from'../../mixins/color.js';import{responsiveSize as i}from'../../mixins/size.js';import{FORWARD_PROPS as s}from'./constants.js';import d from'./images/check.module.svg.js';import l from'./images/spinner.module.svg.js';var g={xl:320,l:280,m:245,s:180,xs:140};var m=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 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 p=r(["0%{background-position:0 0;}100%{background-position:50px 50px;}"]);var h=r(["100%{transform:rotate(360deg);}"]);var b=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;"],p);var u=o=>'auto'===o?'auto':'number'==typeof o||'boolean'==typeof o?o:o&&g[o]?g[o]:'auto';var f=()=>n(["min-width:initial;width:100%;"]);var v="\n content: '';\n position: absolute;\n inset: 0;\n border-radius: inherit;\n";var y={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(v,"\n background-color: ").concat(e,";\n opacity: 0;\n }\n &::after {\n ").concat(v,"\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(v,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(v,"\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=o.theme.colors.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=o.theme.colors.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 1px ").concat(e,";\n\n &::before {\n ").concat(v,"\n background-color: ").concat(t,";\n opacity: 0;\n }\n &::after {\n ").concat(v,"\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=o.theme.colors.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=o.theme.colors.transparent),"\n background-color: ".concat(n,";\n color: ").concat(r,";\n box-shadow: inset 0 0 0 1px ").concat(e,";\n\n &::before {\n ").concat(v,"\n background-color: ").concat(o.theme.colors['bg-oncolor-primary'],";\n opacity: 0;\n }\n &::after {\n ").concat(v,"\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(v,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(v,"\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(v,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(v,"\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(v,"\n background-color: ").concat(o.theme.colors['bg-oncolor-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(v,"\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(v,"\n background-color: ").concat(o.theme.colors['bg-oncontrast-hover'],";\n opacity: 0;\n }\n &::after {\n ").concat(v,"\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 L={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?b:''),(o=>{var n='background-color';return(o.inverted||o.basic||o.outline)&&(n='color'),c(o.color,n)}),(o=>{var n='color';return(o.inverted||o.basic||o.outline)&&(n='background-color'),c(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 S=o.button.withConfig({shouldForwardProp:o=>s.includes(o)||o.includes('data')}).withConfig({componentId:"fox-ui__sc-16o31r2-0"})([""," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," ",""],m,(o=>o.brandPresetUsed?!o.clear||o.base||o.outline||o.onColored?o.clear&&!o.base&&!o.outline&&o.onColored?y.clear.onColored:!o.base||o.clear||o.outline||o.onColored?o.base&&!o.clear&&!o.outline&&o.onColored?y.base.onColored:!o.outline||o.clear||o.base||o.onColored?o.outline&&!o.clear&&!o.base&&o.onColored?y.outline.onColored:o.onColored?y.filled.onColored:y.filled.default:y.outline.default:y.base.default:y.clear.default:L.default),i,(o=>o.padding?t(o.padding,'padding'):null),(o=>o.paddingTop?t(o.paddingTop,'padding-top'):null),(o=>o.paddingRight?t(o.paddingRight,'padding-right'):null),(o=>o.paddingBottom?t(o.paddingBottom,'padding-bottom'):null),(o=>o.paddingLeft?t(o.paddingLeft,'padding-left'):null),(o=>o.margin?t(o.margin,'margin'):null),(o=>o.marginTop?t(o.marginTop,'margin-top'):null),(o=>o.marginRight?t(o.marginRight,'margin-right'):null),(o=>o.marginBottom?t(o.marginBottom,'margin-bottom'):null),(o=>o.marginLeft?t(o.marginLeft,'margin-left'):null),(o=>o.fontSize?t(o.fontSize,'font-size'):null),(o=>o.height?t(o.height,'height'):null),(o=>{var n=o.fluid&&'auto'!==o.width?'max-width':'width';return o.width?t(u(o.width),n):null}),(o=>{var{paddingXS:n,paddingS:r,paddingM:e,paddingL:t,paddingXL:c}=o;return a({sizes:{paddingXS:n,paddingS:r,paddingM:e,paddingL:t,paddingXL:c},cssProperty:'padding'})}),(o=>{var{paddingTopXS:n,paddingTopS:r,paddingTopM:e,paddingTopL:t,paddingTopXL:c}=o;return a({sizes:{paddingTopXS:n,paddingTopS:r,paddingTopM:e,paddingTopL:t,paddingTopXL:c},cssProperty:'padding-top'})}),(o=>{var{paddingRightXS:n,paddingRightS:r,paddingRightM:e,paddingRightL:t,paddingRightXL:c}=o;return a({sizes:{paddingRightXS:n,paddingRightS:r,paddingRightM:e,paddingRightL:t,paddingRightXL:c},cssProperty:'padding-right'})}),(o=>{var{paddingBottomXS:n,paddingBottomS:r,paddingBottomM:e,paddingBottomL:t,paddingBottomXL:c}=o;return a({sizes:{paddingBottomXS:n,paddingBottomS:r,paddingBottomM:e,paddingBottomL:t,paddingBottomXL:c},cssProperty:'padding-bottom'})}),(o=>{var{paddingLeftXS:n,paddingLeftS:r,paddingLeftM:e,paddingLeftL:t,paddingLeftXL:c}=o;return a({sizes:{paddingLeftXS:n,paddingLeftS:r,paddingLeftM:e,paddingLeftL:t,paddingLeftXL:c},cssProperty:'padding-left'})}),(o=>{var{marginXS:n,marginS:r,marginM:e,marginL:t,marginXL:c}=o;return a({sizes:{marginXS:n,marginS:r,marginM:e,marginL:t,marginXL:c},cssProperty:'margin'})}),(o=>{var{marginTopXS:n,marginTopS:r,marginTopM:e,marginTopL:t,marginTopXL:c}=o;return a({sizes:{marginTopXS:n,marginTopS:r,marginTopM:e,marginTopL:t,marginTopXL:c},cssProperty:'margin-top'})}),(o=>{var{marginRightXS:n,marginRightS:r,marginRightM:e,marginRightL:t,marginRightXL:c}=o;return a({sizes:{marginRightXS:n,marginRightS:r,marginRightM:e,marginRightL:t,marginRightXL:c},cssProperty:'margin-right'})}),(o=>{var{marginBottomXS:n,marginBottomS:r,marginBottomM:e,marginBottomL:t,marginBottomXL:c}=o;return a({sizes:{marginBottomXS:n,marginBottomS:r,marginBottomM:e,marginBottomL:t,marginBottomXL:c},cssProperty:'margin-bottom'})}),(o=>{var{marginLeftXS:n,marginLeftS:r,marginLeftM:e,marginLeftL:t,marginLeftXL:c}=o;return a({sizes:{marginLeftXS:n,marginLeftS:r,marginLeftM:e,marginLeftL:t,marginLeftXL:c},cssProperty:'margin-left'})}),(o=>{var{fontSizeXS:n,fontSizeS:r,fontSizeM:e,fontSizeL:t,fontSizeXL:c}=o;return a({sizes:{fontSizeXS:n,fontSizeS:r,fontSizeM:e,fontSizeL:t,fontSizeXL:c},cssProperty:'font-size'})}),(o=>{var{heightXS:n,heightS:r,heightM:e,heightL:t,heightXL:c}=o;return a({sizes:{heightXS:n,heightS:r,heightM:e,heightL:t,heightXL:c},cssProperty:'height'})}),(o=>{var{widthXS:n,widthS:r,widthM:e,widthL:t,widthXL:c,fluid:i,width:s}=o;return a({sizes:{widthXS:n,widthS:r,widthM:e,widthL:t,widthXL:c},cssProperty:i&&'auto'!==s?'max-width':'width',customSizeHandler:u})}),(o=>o.fluid?t(o.fluid,f):null),(o=>{var{fluidXS:n,fluidS:r,fluidM:e,fluidL:t,fluidXL:c}=o;return a({sizes:{fluidXS:n,fluidS:r,fluidM:e,fluidL:t,fluidXL:c},cssProperty:f})}));var x=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 X=o.span.withConfig({componentId:"fox-ui__sc-16o31r2-2"})(["position:relative;z-index:1;"]);var w=o(l).withConfig({componentId:"fox-ui__sc-16o31r2-3"})(["width:100%;animation:"," 2000ms linear infinite;",""],h,(o=>"\n > path {\n stroke-width: ".concat(o.strokeWidth,";\n }\n ")));var k=o(d).withConfig({componentId:"fox-ui__sc-16o31r2-4"})(["width:100%;",""],(o=>"\n > path {\n stroke-width: ".concat(o.strokeWidth,";\n }\n ")));export{k as CheckIcon,X as Content,x as IconSlot,S as Root,w 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 { CalcProperty, property, responsiveNamedProperty } from 'mixins/responsive-property'\nimport { color as colorFn } from 'mixins/color'\nimport type { PossibleValues } from 'mixins/responsive-property'\nimport { responsiveSize } from 'mixins/size'\nimport { injectDefaultTheme } from 'shared/utils/inject-theme'\nimport { FORWARD_PROPS } from './constants'\nimport Check from './images/check.module.svg'\nimport Spinner from './images/spinner.module.svg'\nimport type { StyledButtonProps } from './types'\n\nconst WIDTHS: Record<string, number> = {\n xl: 320,\n l: 280,\n m: 245,\n s: 180,\n xs: 140,\n}\n\nconst baseStyles = css<StyledButtonProps>`\n ${(props) => `\n display: ${props.display};\n font-weight: ${props.fontWeight};\n border-radius: ${props.borderRadius};\n line-height: ${props.lineHeight};\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 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<StyledButtonProps>`\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<StyledButtonProps>`\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<StyledButtonProps>`\n ${(props) => {\n let background = props.theme.colors.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 = 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 = props.theme.colors.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 1px ${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<StyledButtonProps>`\n ${(props) => {\n let background = props.theme.colors.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 = props.theme.colors['border-oncolor-default']\n if (props.disabled) boxShadow = props.theme.colors.transparent\n\n return `\n background-color: ${background};\n color: ${color};\n box-shadow: inset 0 0 0 1px ${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<StyledButtonProps>`\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<StyledButtonProps>`\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<StyledButtonProps>`\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<StyledButtonProps>`\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<StyledButtonProps>`\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 dynamicStyles = (props: ThemedStyledProps<StyledButtonProps, 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\nexport const Root = styled.button\n .withConfig({\n shouldForwardProp: (prop) => {\n return FORWARD_PROPS.includes(prop) || prop.includes('data')\n },\n })\n .attrs<StyledButtonProps>(injectDefaultTheme)`\n ${baseStyles}\n ${dynamicStyles}\n ${responsiveSize}\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","baseStyles","css","props","concat","display","fontWeight","borderRadius","lineHeight","noSpacing","loading","keyframes","spin","defaultLoadingStyles","getWidth","width","fluidStyles","pseudoBaseStyles","PRESET","filled","default","background","theme","colors","black","danger","success","disabled","color","backgroundBefore","onColored","outline","transparent","boxShadow","backgroundAfter","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","responsiveSize","padding","property","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 { CalcProperty, property, responsiveNamedProperty } from 'mixins/responsive-property'\nimport { color as colorFn } from 'mixins/color'\nimport type { PossibleValues } from 'mixins/responsive-property'\nimport { responsiveSize } from 'mixins/size'\nimport { FORWARD_PROPS } from './constants'\nimport Check from './images/check.module.svg'\nimport Spinner from './images/spinner.module.svg'\nimport type { StyledButtonProps } from './types'\n\nconst WIDTHS: Record<string, number> = {\n xl: 320,\n l: 280,\n m: 245,\n s: 180,\n xs: 140,\n}\n\nconst baseStyles = css<StyledButtonProps>`\n ${(props) => `\n display: ${props.display};\n font-weight: ${props.fontWeight};\n border-radius: ${props.borderRadius};\n line-height: ${props.lineHeight};\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 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<StyledButtonProps>`\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<StyledButtonProps>`\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<StyledButtonProps>`\n ${(props) => {\n let background = props.theme.colors.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 = 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 = props.theme.colors.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 1px ${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<StyledButtonProps>`\n ${(props) => {\n let background = props.theme.colors.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 = props.theme.colors['border-oncolor-default']\n if (props.disabled) boxShadow = props.theme.colors.transparent\n\n return `\n background-color: ${background};\n color: ${color};\n box-shadow: inset 0 0 0 1px ${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<StyledButtonProps>`\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<StyledButtonProps>`\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<StyledButtonProps>`\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<StyledButtonProps>`\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<StyledButtonProps>`\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 dynamicStyles = (props: ThemedStyledProps<StyledButtonProps, 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\nexport const Root = styled.button.withConfig<StyledButtonProps>({\n shouldForwardProp: (prop) => {\n return FORWARD_PROPS.includes(prop) || prop.includes('data')\n },\n})`\n ${baseStyles}\n ${dynamicStyles}\n ${responsiveSize}\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","baseStyles","css","props","concat","display","fontWeight","borderRadius","lineHeight","noSpacing","loading","keyframes","spin","defaultLoadingStyles","getWidth","width","fluidStyles","pseudoBaseStyles","PRESET","filled","default","background","theme","colors","black","danger","success","disabled","color","backgroundBefore","onColored","outline","transparent","boxShadow","backgroundAfter","base","clear","PRESET_DEFAULT","fontColor","tiny","saturate","lighten","toString","inverted","basic","cssProperty","colorFn","mercury","silver","Root","styled","button","withConfig","shouldForwardProp","prop","FORWARD_PROPS","includes","componentId","brandPresetUsed","responsiveSize","padding","property","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,2 +1,2 @@
1
- import e from'@babel/runtime/helpers/objectSpread2';import r from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as a}from'react';import s from'clsx';import{useClassname as o}from'../../hooks/useClassname.js';import{useFallbackTheme as t}from'../../hooks/use-theme.js';import{useConfigPriority as i}from'../../hooks/use-config-priority.js';import{CheckboxGroup as l}from'./Group.js';import{Root as c,Input as d,Background as n,BrandMask as m,CheckIcon as h,DefaultMask as u,Content as p}from'./style.js';import{jsxs as b,jsx as k,Fragment as f}from'react/jsx-runtime';var C=["preset","style","id","name","value","disabled","error","success","fluid","children","label","checked","defaultChecked","background","onColored","size","inline","width","className","onChange"];var v='Checkbox';var x=a(((a,l)=>{var v;var x=t();var g=o("Checkbox");var j=i(null===(v=x.components)||void 0===v?void 0:v.Checkbox,a),{preset:y,style:N,id:w,name:M,value:P,disabled:z,error:F,success:G,fluid:I,children:_,label:B,checked:E,defaultChecked:O,background:R,onColored:T,size:W="m",inline:A=!0,width:D=x.defaultInputControlsWidth,className:S,onChange:U=(()=>{})}=j,q=r(j,C);var H='brand'===x.preset;'string'==typeof y&&(H='brand'===y);var J=s(g,S,E&&"".concat(g,"--checked"));var K="".concat(g,"__label");var L=void 0===E?{defaultChecked:O}:{checked:E};return b(c,{ref:l,className:J,style:N,fluid:I,disabled:z,htmlFor:w||M,size:W,inline:A,width:D,error:F,success:G,background:R,onColored:T,brandPresetUsed:H,children:[k(d,e(e(e({},q),L),{},{id:w||M,name:M,type:"checkbox",value:P,disabled:z,onChange:U})),H?b(f,{children:[R&&k(n,{}),k(m,{children:k(h,{})})]}):k(u,{}),(B||_)&&k(p,{className:K,children:B||_})]})}));x.Group=l,x.displayName="Checkbox";export{v as COMPONENT_NAME,x as Checkbox};
1
+ import e from'@babel/runtime/helpers/objectSpread2';import r from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as a}from'react';import{useTheme as s}from'styled-components';import o from'clsx';import{useClassname as t}from'../../hooks/useClassname.js';import{useConfigPriority as i}from'../../hooks/use-config-priority.js';import{CheckboxGroup as n}from'./Group.js';import{Root as d,Input as l,Background as c,BrandMask as m,CheckIcon as h,DefaultMask as u,Content as p}from'./style.js';import{jsxs as b,jsx as f,Fragment as k}from'react/jsx-runtime';var C=["preset","style","id","name","value","disabled","error","success","fluid","children","label","checked","defaultChecked","background","onColored","size","inline","width","className","onChange"];var v='Checkbox';var x=a(((a,n)=>{var v;var x=s();var g=t("Checkbox");var y=i(null===(v=x.components)||void 0===v?void 0:v.Checkbox,a),{preset:j,style:N,id:w,name:M,value:P,disabled:z,error:G,success:I,fluid:_,children:B,label:E,checked:F,defaultChecked:O,background:R,onColored:T,size:W="m",inline:A=!0,width:D=x.defaultInputControlsWidth,className:S,onChange:U=(()=>{})}=y,q=r(y,C);var H='brand'===x.preset;'string'==typeof j&&(H='brand'===j);var J=o(g,S,F&&"".concat(g,"--checked"));var K="".concat(g,"__label");var L=void 0===F?{defaultChecked:O}:{checked:F};return b(d,{ref:n,className:J,style:N,fluid:_,disabled:z,htmlFor:w||M,size:W,inline:A,width:D,error:G,success:I,background:R,onColored:T,brandPresetUsed:H,children:[f(l,e(e(e({},q),L),{},{id:w||M,name:M,type:"checkbox",value:P,disabled:z,onChange:U})),H?b(k,{children:[R&&f(c,{}),f(m,{children:f(h,{})})]}):f(u,{}),(E||B)&&f(p,{className:K,children:E||B})]})}));x.Group=n,x.displayName="Checkbox";export{v as COMPONENT_NAME,x as Checkbox};
2
2
  //# sourceMappingURL=Checkbox.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Checkbox.js","sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport cx from 'clsx'\nimport { useClassname } from 'hooks/useClassname'\nimport { useFallbackTheme } from 'hooks/use-theme'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport { CheckboxGroup } from './Group'\nimport type { CheckboxComponent, CheckboxProps } from './types'\n\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Checkbox'\n\nconst Checkbox = forwardRef<HTMLLabelElement, CheckboxProps>((props, ref) => {\n const theme = useFallbackTheme()\n const baseClassName = useClassname(COMPONENT_NAME)\n\n const {\n preset,\n style,\n id,\n name,\n value,\n disabled,\n error,\n success,\n fluid,\n children,\n label,\n checked,\n defaultChecked,\n background,\n onColored,\n size = 'm',\n inline = true,\n width = theme.defaultInputControlsWidth,\n className: _className,\n onChange = () => undefined,\n ...configProps\n } = useConfigPriority<CheckboxProps>(theme.components?.Checkbox, props)\n\n let brandPresetUsed = theme.preset === 'brand'\n if (typeof preset === 'string') brandPresetUsed = preset === 'brand'\n\n const className = cx(baseClassName, _className, checked && `${baseClassName}--checked`)\n const labelClassName = `${baseClassName}__label`\n const inputProps = checked === undefined ? { defaultChecked } : { checked }\n\n return (\n <Styled.Root\n ref={ref}\n className={className}\n style={style}\n fluid={fluid}\n disabled={disabled}\n htmlFor={id || name}\n size={size}\n inline={inline}\n width={width}\n error={error}\n success={success}\n background={background}\n onColored={onColored}\n brandPresetUsed={brandPresetUsed}\n >\n <Styled.Input\n {...configProps}\n {...inputProps}\n id={id || name}\n name={name}\n type='checkbox'\n value={value}\n disabled={disabled}\n onChange={onChange}\n />\n {brandPresetUsed ? (\n <>\n {background && <Styled.Background />}\n <Styled.BrandMask>\n <Styled.CheckIcon />\n </Styled.BrandMask>\n </>\n ) : (\n <Styled.DefaultMask />\n )}\n {(label || children) && <Styled.Content className={labelClassName}>{label || children}</Styled.Content>}\n </Styled.Root>\n )\n}) as CheckboxComponent\n\nCheckbox.Group = CheckboxGroup\n\nCheckbox.displayName = COMPONENT_NAME\n\nexport { Checkbox, COMPONENT_NAME }\n\nexport type { CheckboxProps }\n"],"names":["COMPONENT_NAME","Checkbox","forwardRef","props","ref","_theme$components","theme","useFallbackTheme","baseClassName","useClassname","useConfigPriority","components","preset","style","id","name","value","disabled","error","success","fluid","children","label","checked","defaultChecked","background","onColored","size","inline","width","defaultInputControlsWidth","className","_className","onChange","_useConfigPriority","configProps","_objectWithoutProperties","_excluded","brandPresetUsed","cx","concat","labelClassName","inputProps","undefined","_jsxs","Styled.Root","htmlFor","_jsx","Styled.Input","type","_Fragment","Styled.Background","Styled.BrandMask","Styled.CheckIcon","Styled.DefaultMask","Styled.Content","Group","CheckboxGroup","displayName"],"mappings":"mxBAUMA,IAAAA,EAAiB,WAEjBC,IAAAA,EAAWC,GAA4C,CAACC,EAAOC,KAAQ,IAAAC,EAC3E,IAAMC,EAAQC,IACd,IAAMC,EAAgBC,EAJD,YAMrB,IAsBIC,EAAAA,UAAiCJ,EAAAA,EAAMK,+BAANN,EAAkBJ,SAAUE,IAtB3DS,OACJA,EADIC,MAEJA,EAFIC,GAGJA,EAHIC,KAIJA,EAJIC,MAKJA,EALIC,SAMJA,EANIC,MAOJA,EAPIC,QAQJA,EARIC,MASJA,EATIC,SAUJA,EAVIC,MAWJA,EAXIC,QAYJA,EAZIC,eAaJA,EAbIC,WAcJA,EAdIC,UAeJA,EAfIC,KAgBJA,EAAO,IAhBHC,OAiBJA,GAAS,EAjBLC,MAkBJA,EAAQvB,EAAMwB,0BACdC,UAAWC,EAnBPC,SAoBJA,EAAW,UApBbC,EAqBKC,EArBLC,EAAAF,EAAAG,GAwBA,IAAIC,EAAmC,UAAjBhC,EAAMM,OACN,iBAAXA,IAAqB0B,EAA6B,UAAX1B,GAElD,IAAMmB,EAAYQ,EAAG/B,EAAewB,EAAYT,GAAO,GAAAiB,OAAOhC,EAAP,cACvD,IAAMiC,EAAoBjC,GAAAA,OAAAA,EAA1B,WACA,IAAMkC,OAAyBC,IAAZpB,EAAwB,CAAEC,eAAAA,GAAmB,CAAED,QAAAA,GAElE,OACEqB,EAACC,EAAD,CACEzC,IAAKA,EACL2B,UAAWA,EACXlB,MAAOA,EACPO,MAAOA,EACPH,SAAUA,EACV6B,QAAShC,GAAMC,EACfY,KAAMA,EACNC,OAAQA,EACRC,MAAOA,EACPX,MAAOA,EACPC,QAASA,EACTM,WAAYA,EACZC,UAAWA,EACXY,gBAAiBA,EAdnBjB,SAAA,CAgBE0B,EAACC,EACKb,EAAAA,EAAAA,EAAAA,GAAAA,GACAO,GAFN,GAAA,CAGE5B,GAAIA,GAAMC,EACVA,KAAMA,EACNkC,KAAK,WACLjC,MAAOA,EACPC,SAAUA,EACVgB,SAAUA,KAEXK,EACCM,EAAAM,EAAA,CAAA7B,SACGI,CAAAA,GAAcsB,EAACI,EAAD,IACfJ,EAACK,EAAD,CAAA/B,SACE0B,EAACM,EAAD,SAIJN,EAACO,EAlCL,KAoCIhC,GAASD,IAAa0B,EAACQ,EAAD,CAAgBxB,UAAWU,EAA3BpB,SAA4CC,GAASD,UAKnFpB,EAASuD,MAAQC,EAEjBxD,EAASyD,YAjFc"}
1
+ {"version":3,"file":"Checkbox.js","sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { useTheme } from 'styled-components'\nimport cx from 'clsx'\nimport { useClassname } from 'hooks/useClassname'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport { CheckboxGroup } from './Group'\nimport type { CheckboxComponent, CheckboxProps } from './types'\n\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Checkbox'\n\nconst Checkbox = forwardRef<HTMLLabelElement, CheckboxProps>((props, ref) => {\n const theme = useTheme()\n const baseClassName = useClassname(COMPONENT_NAME)\n\n const {\n preset,\n style,\n id,\n name,\n value,\n disabled,\n error,\n success,\n fluid,\n children,\n label,\n checked,\n defaultChecked,\n background,\n onColored,\n size = 'm',\n inline = true,\n width = theme.defaultInputControlsWidth,\n className: _className,\n onChange = () => undefined,\n ...configProps\n } = useConfigPriority<CheckboxProps>(theme.components?.Checkbox, props)\n\n let brandPresetUsed = theme.preset === 'brand'\n if (typeof preset === 'string') brandPresetUsed = preset === 'brand'\n\n const className = cx(baseClassName, _className, checked && `${baseClassName}--checked`)\n const labelClassName = `${baseClassName}__label`\n const inputProps = checked === undefined ? { defaultChecked } : { checked }\n\n return (\n <Styled.Root\n ref={ref}\n className={className}\n style={style}\n fluid={fluid}\n disabled={disabled}\n htmlFor={id || name}\n size={size}\n inline={inline}\n width={width}\n error={error}\n success={success}\n background={background}\n onColored={onColored}\n brandPresetUsed={brandPresetUsed}\n >\n <Styled.Input\n {...configProps}\n {...inputProps}\n id={id || name}\n name={name}\n type='checkbox'\n value={value}\n disabled={disabled}\n onChange={onChange}\n />\n {brandPresetUsed ? (\n <>\n {background && <Styled.Background />}\n <Styled.BrandMask>\n <Styled.CheckIcon />\n </Styled.BrandMask>\n </>\n ) : (\n <Styled.DefaultMask />\n )}\n {(label || children) && <Styled.Content className={labelClassName}>{label || children}</Styled.Content>}\n </Styled.Root>\n )\n}) as CheckboxComponent\n\nCheckbox.Group = CheckboxGroup\n\nCheckbox.displayName = COMPONENT_NAME\n\nexport { Checkbox, COMPONENT_NAME }\n\nexport type { CheckboxProps }\n"],"names":["COMPONENT_NAME","Checkbox","forwardRef","props","ref","_theme$components","theme","useTheme","baseClassName","useClassname","useConfigPriority","components","preset","style","id","name","value","disabled","error","success","fluid","children","label","checked","defaultChecked","background","onColored","size","inline","width","defaultInputControlsWidth","className","_className","onChange","_useConfigPriority","configProps","_objectWithoutProperties","_excluded","brandPresetUsed","cx","concat","labelClassName","inputProps","undefined","_jsxs","Styled.Root","htmlFor","_jsx","Styled.Input","type","_Fragment","Styled.Background","Styled.BrandMask","Styled.CheckIcon","Styled.DefaultMask","Styled.Content","Group","CheckboxGroup","displayName"],"mappings":"owBAUMA,IAAAA,EAAiB,WAEjBC,IAAAA,EAAWC,GAA4C,CAACC,EAAOC,KAAQ,IAAAC,EAC3E,IAAMC,EAAQC,IACd,IAAMC,EAAgBC,EAJD,YAMrB,IAsBIC,EAAAA,UAAiCJ,EAAAA,EAAMK,+BAANN,EAAkBJ,SAAUE,IAtB3DS,OACJA,EADIC,MAEJA,EAFIC,GAGJA,EAHIC,KAIJA,EAJIC,MAKJA,EALIC,SAMJA,EANIC,MAOJA,EAPIC,QAQJA,EARIC,MASJA,EATIC,SAUJA,EAVIC,MAWJA,EAXIC,QAYJA,EAZIC,eAaJA,EAbIC,WAcJA,EAdIC,UAeJA,EAfIC,KAgBJA,EAAO,IAhBHC,OAiBJA,GAAS,EAjBLC,MAkBJA,EAAQvB,EAAMwB,0BACdC,UAAWC,EAnBPC,SAoBJA,EAAW,UApBbC,EAqBKC,EArBLC,EAAAF,EAAAG,GAwBA,IAAIC,EAAmC,UAAjBhC,EAAMM,OACN,iBAAXA,IAAqB0B,EAA6B,UAAX1B,GAElD,IAAMmB,EAAYQ,EAAG/B,EAAewB,EAAYT,GAAO,GAAAiB,OAAOhC,EAAP,cACvD,IAAMiC,EAAoBjC,GAAAA,OAAAA,EAA1B,WACA,IAAMkC,OAAyBC,IAAZpB,EAAwB,CAAEC,eAAAA,GAAmB,CAAED,QAAAA,GAElE,OACEqB,EAACC,EAAD,CACEzC,IAAKA,EACL2B,UAAWA,EACXlB,MAAOA,EACPO,MAAOA,EACPH,SAAUA,EACV6B,QAAShC,GAAMC,EACfY,KAAMA,EACNC,OAAQA,EACRC,MAAOA,EACPX,MAAOA,EACPC,QAASA,EACTM,WAAYA,EACZC,UAAWA,EACXY,gBAAiBA,EAdnBjB,SAAA,CAgBE0B,EAACC,EACKb,EAAAA,EAAAA,EAAAA,GAAAA,GACAO,GAFN,GAAA,CAGE5B,GAAIA,GAAMC,EACVA,KAAMA,EACNkC,KAAK,WACLjC,MAAOA,EACPC,SAAUA,EACVgB,SAAUA,KAEXK,EACCM,EAAAM,EAAA,CAAA7B,SACGI,CAAAA,GAAcsB,EAACI,EAAD,IACfJ,EAACK,EAAD,CAAA/B,SACE0B,EAACM,EAAD,SAIJN,EAACO,EAlCL,KAoCIhC,GAASD,IAAa0B,EAACQ,EAAD,CAAgBxB,UAAWU,EAA3BpB,SAA4CC,GAASD,UAKnFpB,EAASuD,MAAQC,EAEjBxD,EAASyD,YAjFc"}
@@ -1,2 +1,2 @@
1
- import o from'@babel/runtime/helpers/taggedTemplateLiteral';import e,{css as r}from'styled-components';import c from'tinycolor2';import{screenMaxS as t}from'../../mixins/screen.js';import{responsiveProperty as n}from'../../mixins/responsive-property.js';import{injectDefaultTheme as l}from'../../shared/utils/inject-theme.js';import s from'./images/check-default.module.svg.js';import a from'./images/check.module.svg.js';var d;var i={extraSmall:12,xs:12,small:14,s:14,medium:16,m:16,large:18,l:18,extraLarge:20,xl:20};var b={extraSmall:16,xs:16,small:20,s:20,medium:24,m:24,large:28,l:28,extraLarge:32,xl:32};var m=['extraSmall','xs','small','s','medium','m','large','l','extraLarge','xl'];var h=r(["",""],(o=>"\n &,\n & * {\n box-sizing: border-box;\n }\n position: relative;\n cursor: pointer;\n padding: ".concat(o.background?12:0,"px;\n display: ").concat(o.inline?'inline-flex':'flex',";\n align-items: baseline;\n isolation: isolate;\n & + & {\n margin-left: 15px;\n }\n ")));var g=e.input.withConfig({componentId:"fox-ui__sc-9s6oap-0"})(["position:absolute;opacity:0;z-index:-1;&:focus{outline:none;}"]);var u=e.span.withConfig({componentId:"fox-ui__sc-9s6oap-1"})(["border-radius:8px;border:1px solid;border-color:transparent;overflow:hidden;&::before{content:'';opacity:0;}&,&::before{position:absolute;top:0;left:0;width:100%;height:100%;transition-property:border-color,background-color,opacity;transition-duration:150ms;transition-timing-function:ease-in;}"]);var p=e(s).withConfig({componentId:"fox-ui__sc-9s6oap-2"})(["position:relative;top:2px;width:1em;height:1em;flex-shrink:0;g{opacity:0;transition:opacity 200ms ease;}"]);var f=e.div.withConfig({componentId:"fox-ui__sc-9s6oap-3"})(["position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1em;height:1em;border-radius:4px;border:1px solid;border-color:transparent;transition-property:border-color;transition-duration:150ms;transition-timing-function:ease-in;"]);var v=e(a).withConfig({componentId:"fox-ui__sc-9s6oap-4"})(["width:50%;opacity:0;"]);var y=e.span.withConfig({componentId:"fox-ui__sc-9s6oap-5"})(["position:relative;margin-left:10px;"]);var C=o=>"\n & > ".concat(y," {\n color: ").concat(o.fontColor,";\n }\n & > ").concat(f," {\n background-color: ").concat(o.bg,";\n color: ").concat(o.color,";\n border-color: ").concat(o.border,";\n }\n & > ").concat(g,":checked ~ ").concat(f," {\n border-color: transparent;\n background-color: ").concat(o.bgChecked,";\n }\n & > ").concat(g,":checked ~ ").concat(f," > ").concat(v," {\n opacity: 1;\n }\n & > ").concat(g,":disabled ~ ").concat(y," {\n color: ").concat(o.colorDisabled,";\n }\n &:hover > ").concat(f," {\n border-color: ").concat(o.borderHover,";\n }\n &:focus {\n outline: none;\n }\n & > ").concat(g,":focus-visible ~ ").concat(f," {\n outline: 1px solid ").concat(o.outlineFocus,";\n outline-offset: 2px;\n }\n");var k=o=>"\n & > ".concat(u," {\n background-color: ").concat(o.bg,";\n border-color: ").concat(o.border,";\n }\n & > ").concat(g,":checked ~ ").concat(u," {\n background-color: ").concat(o.bgChecked,";\n border-color: ").concat(o.borderChecked,";\n }\n &:hover > ").concat(u," {\n background-color: ").concat(o.bgHover,";\n border-color: ").concat(o.borderHover,";\n }\n &:hover > ").concat(u,"::before {\n background-color: ").concat(o.beforeBgHover,";\n opacity: 1;\n }\n");var x={default:{regular:r([""," ",""],(o=>C({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-onmain-primary'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-brand-primary-basic'],borderHover:o.theme.colors['border-brand-primary'],outlineFocus:o.theme.colors['border-brand-primary'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?k({bg:o.theme.colors['bg-onmain-secondary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-brand-primary-100'],borderChecked:o.theme.colors['border-brand-primary'],bgHover:o.theme.colors['bg-oncolor-hover'],borderHover:o.theme.colors['border-onmain-default-large'],beforeBgHover:'transparent'}):null)),error:r([""," ",""],(o=>C({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-error-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-500'],borderHover:o.theme.colors['alert-error'],outlineFocus:o.theme.colors['alert-error'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?k({bg:o.theme.colors['alert-bg-error-100'],border:o.theme.colors['alert-error'],bgChecked:o.theme.colors['alert-bg-error-100'],borderChecked:o.theme.colors['alert-error'],bgHover:o.theme.colors['alert-bg-error-100'],borderHover:o.theme.colors['alert-error'],beforeBgHover:'transparent'}):null)),success:r([""," ",""],(o=>C({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-success-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-500'],borderHover:o.theme.colors['alert-success'],outlineFocus:o.theme.colors['alert-success'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?k({bg:o.theme.colors['alert-bg-success-100'],border:o.theme.colors['alert-success'],bgChecked:o.theme.colors['alert-bg-success-100'],borderChecked:o.theme.colors['alert-success'],bgHover:o.theme.colors['alert-bg-success-100'],borderHover:o.theme.colors['alert-success'],beforeBgHover:'transparent'}):null)),disabled:r(["cursor:auto;"," ",""],(o=>C({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-disabled-large'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-active'],borderHover:o.theme.colors['border-disabled'],outlineFocus:o.theme.colors['border-disabled'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?k({bg:o.theme.colors['bg-disabled-large'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-large'],borderChecked:o.theme.colors['bg-disabled-active'],bgHover:o.theme.colors['bg-disabled-large'],borderHover:o.theme.colors['border-disabled'],beforeBgHover:'transparent'}):null))},onColored:{regular:r([""," ",""],(o=>C(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-onmain-primary'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-brand-primary-basic'],borderHover:o.theme.colors['border-brand-primary'],outlineFocus:o.theme.colors['border-brand-primary'],colorDisabled:o.theme.colors['content-oncolor-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['bg-onmain-primary'],color:o.theme.colors['content-brand-primary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-oncolor-primary'],borderHover:o.theme.colors['border-brand-primary'],outlineFocus:o.theme.colors['content-oncolor-primary'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?k({bg:o.theme.colors['bg-onmain-secondary'],border:o.theme.colors['border-onmain-default-large'],bgChecked:o.theme.colors['bg-onmain-primary'],borderChecked:o.theme.colors['border-onmain-default-large'],bgHover:o.theme.colors['bg-onmain-secondary'],borderHover:o.theme.colors['border-onmain-default-large'],beforeBgHover:o.theme.colors['bg-oncolor-hover']}):null)),error:r([""," ",""],(o=>C(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-error-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-500'],borderHover:o.theme.colors['alert-error'],outlineFocus:o.theme.colors['alert-error'],colorDisabled:o.theme.colors['content-oncolor-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['alert-bg-error-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-500'],borderHover:o.theme.colors['alert-error'],outlineFocus:o.theme.colors['alert-error'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?k({bg:o.theme.colors['alert-bg-error-100'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-100'],borderChecked:o.theme.colors['alert-error'],bgHover:o.theme.colors['alert-bg-error-100'],borderHover:o.theme.colors['alert-error'],beforeBgHover:o.theme.colors['bg-oncolor-hover']}):null)),success:r([""," ",""],(o=>C(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-success-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-500'],borderHover:o.theme.colors['alert-success'],outlineFocus:o.theme.colors['alert-success'],colorDisabled:o.theme.colors['content-oncolor-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['alert-bg-success-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-500'],borderHover:o.theme.colors['alert-success'],outlineFocus:o.theme.colors['alert-success'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?k({bg:o.theme.colors['alert-bg-success-100'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-100'],borderChecked:o.theme.colors['alert-success'],bgHover:o.theme.colors['alert-bg-success-100'],borderHover:o.theme.colors['alert-success'],beforeBgHover:o.theme.colors['bg-oncolor-hover']}):null)),disabled:r(["cursor:auto;"," ",""],(o=>C(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-disabled-large'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-active'],borderHover:o.theme.colors['border-disabled'],outlineFocus:o.theme.colors['border-disabled'],colorDisabled:o.theme.colors['content-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['bg-disabled-large'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-active'],borderHover:o.theme.colors['border-disabled'],outlineFocus:o.theme.colors['border-disabled'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?k({bg:o.theme.colors['bg-onmain-secondary'],border:o.theme.colors['border-oncolor-disabled'],bgChecked:o.theme.colors['bg-onmain-secondary'],borderChecked:o.theme.colors['border-oncolor-disabled'],bgHover:o.theme.colors['bg-onmain-secondary'],borderHover:o.theme.colors['border-oncolor-disabled'],beforeBgHover:'transparent'}):null))}};var H={default:r([""," ",""],(o=>o.error?"\n & > ".concat(p," > rect { \n fill: ").concat(c(o.theme.colors.pomegranate).setAlpha(.1).toString(),";\n stroke: ").concat(o.theme.colors.pomegranate,";\n } \n & > ").concat(p," g > rect {\n fill: ").concat(o.theme.colors.pomegranate,";\n }\n "):null),(o=>"\n color: ".concat(o.disabled?o.theme.colors.alto:o.theme.colors.mineShaft,";\n cursor: ").concat(o.disabled?'not-allowed':'pointer',";\n\n & > ").concat(g,":checked ~ ").concat(p," g {\n opacity: 1;\n }\n & > ").concat(g,":disabled ~ ").concat(p," > rect {\n fill: ").concat(o.theme.colors.white,";\n stroke: ").concat(o.theme.colors.grey,";\n }\n & > ").concat(g,":checked:disabled ~ ").concat(p," g > rect {\n fill: ").concat(o.theme.colors.alto,";\n }\n &:focus {\n outline: none;\n }\n & > ").concat(g,":focus-visible ~ ").concat(p," {\n outline: 1px solid ").concat(o.theme.colors.accent,";\n outline-offset: 2px;\n }\n ")))};var w=e.label.withConfig({shouldForwardProp:o=>['children','htmlFor','style'].includes(o)}).attrs(l).withConfig({componentId:"fox-ui__sc-9s6oap-6"})([""," "," "," "," ",""],h,(o=>o.brandPresetUsed?o.disabled&&!o.onColored?x.default.disabled:o.disabled&&o.onColored?x.onColored.disabled:!o.error||o.success||o.onColored?o.error&&!o.success&&o.onColored?x.onColored.error:!o.success||o.error||o.onColored?o.success&&!o.error&&o.onColored?x.onColored.success:o.onColored?x.onColored.regular:x.default.regular:x.default.success:x.default.error:H.default),(o=>{var e=o.brandPresetUsed?b:i;return m.includes(o.size)?"font-size: ".concat(e[o.size],"px;"):n('size','font-size')}),(o=>n('width',o.fluid&&'auto'!==o.width&&!Array.isArray(o.width)?'max-width':'width')),(o=>o.fluid?'width: 100%;':null));var F=e.div.withConfig({shouldForwardProp:o=>'inline'!==o}).withConfig({componentId:"fox-ui__sc-9s6oap-7"})(["",""],(e=>e.inline?r(["display:flex;flex-direction:row;> ",":first-child{margin-left:0;}> ",":not(:first-child){margin-left:15px;}",""],w,w,t()(d||(d=o(["\n flex-direction: column;\n > ",":first-child {\n margin-top: 0;\n }\n > ",":not(:first-child) {\n margin-top: 15px;\n margin-left: 0;\n }\n "])),w,w)):"\n display: flex;\n flex-direction: column;\n > ".concat(w,":first-child {\n margin-top: 0;\n margin-left: 0;\n }\n > ").concat(w,":not(:first-child) {\n margin-top: 15px;\n margin-left: 0;\n }\n ")));export{u as Background,f as BrandMask,v as CheckIcon,y as Content,p as DefaultMask,F as Group,g as Input,w as Root};
1
+ import o from'@babel/runtime/helpers/taggedTemplateLiteral';import e,{css as r}from'styled-components';import c from'tinycolor2';import{screenMaxS as t}from'../../mixins/screen.js';import{responsiveProperty as n}from'../../mixins/responsive-property.js';import l from'./images/check-default.module.svg.js';import s from'./images/check.module.svg.js';var a;var d={extraSmall:12,xs:12,small:14,s:14,medium:16,m:16,large:18,l:18,extraLarge:20,xl:20};var i={extraSmall:16,xs:16,small:20,s:20,medium:24,m:24,large:28,l:28,extraLarge:32,xl:32};var b=['extraSmall','xs','small','s','medium','m','large','l','extraLarge','xl'];var m=r(["",""],(o=>"\n &,\n & * {\n box-sizing: border-box;\n }\n position: relative;\n cursor: pointer;\n padding: ".concat(o.background?12:0,"px;\n display: ").concat(o.inline?'inline-flex':'flex',";\n align-items: baseline;\n isolation: isolate;\n & + & {\n margin-left: 15px;\n }\n ")));var h=e.input.withConfig({componentId:"fox-ui__sc-9s6oap-0"})(["position:absolute;opacity:0;z-index:-1;&:focus{outline:none;}"]);var g=e.span.withConfig({componentId:"fox-ui__sc-9s6oap-1"})(["border-radius:8px;border:1px solid;border-color:transparent;overflow:hidden;&::before{content:'';opacity:0;}&,&::before{position:absolute;top:0;left:0;width:100%;height:100%;transition-property:border-color,background-color,opacity;transition-duration:150ms;transition-timing-function:ease-in;}"]);var u=e(l).withConfig({componentId:"fox-ui__sc-9s6oap-2"})(["position:relative;top:2px;width:1em;height:1em;flex-shrink:0;g{opacity:0;transition:opacity 200ms ease;}"]);var p=e.div.withConfig({componentId:"fox-ui__sc-9s6oap-3"})(["position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1em;height:1em;border-radius:4px;border:1px solid;border-color:transparent;transition-property:border-color;transition-duration:150ms;transition-timing-function:ease-in;"]);var f=e(s).withConfig({componentId:"fox-ui__sc-9s6oap-4"})(["width:50%;opacity:0;"]);var v=e.span.withConfig({componentId:"fox-ui__sc-9s6oap-5"})(["position:relative;margin-left:10px;"]);var y=o=>"\n & > ".concat(v," {\n color: ").concat(o.fontColor,";\n }\n & > ").concat(p," {\n background-color: ").concat(o.bg,";\n color: ").concat(o.color,";\n border-color: ").concat(o.border,";\n }\n & > ").concat(h,":checked ~ ").concat(p," {\n border-color: transparent;\n background-color: ").concat(o.bgChecked,";\n }\n & > ").concat(h,":checked ~ ").concat(p," > ").concat(f," {\n opacity: 1;\n }\n & > ").concat(h,":disabled ~ ").concat(v," {\n color: ").concat(o.colorDisabled,";\n }\n &:hover > ").concat(p," {\n border-color: ").concat(o.borderHover,";\n }\n &:focus {\n outline: none;\n }\n & > ").concat(h,":focus-visible ~ ").concat(p," {\n outline: 1px solid ").concat(o.outlineFocus,";\n outline-offset: 2px;\n }\n");var C=o=>"\n & > ".concat(g," {\n background-color: ").concat(o.bg,";\n border-color: ").concat(o.border,";\n }\n & > ").concat(h,":checked ~ ").concat(g," {\n background-color: ").concat(o.bgChecked,";\n border-color: ").concat(o.borderChecked,";\n }\n &:hover > ").concat(g," {\n background-color: ").concat(o.bgHover,";\n border-color: ").concat(o.borderHover,";\n }\n &:hover > ").concat(g,"::before {\n background-color: ").concat(o.beforeBgHover,";\n opacity: 1;\n }\n");var k={default:{regular:r([""," ",""],(o=>y({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-onmain-primary'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-brand-primary-basic'],borderHover:o.theme.colors['border-brand-primary'],outlineFocus:o.theme.colors['border-brand-primary'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?C({bg:o.theme.colors['bg-onmain-secondary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-brand-primary-100'],borderChecked:o.theme.colors['border-brand-primary'],bgHover:o.theme.colors['bg-oncolor-hover'],borderHover:o.theme.colors['border-onmain-default-large'],beforeBgHover:'transparent'}):null)),error:r([""," ",""],(o=>y({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-error-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-500'],borderHover:o.theme.colors['alert-error'],outlineFocus:o.theme.colors['alert-error'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?C({bg:o.theme.colors['alert-bg-error-100'],border:o.theme.colors['alert-error'],bgChecked:o.theme.colors['alert-bg-error-100'],borderChecked:o.theme.colors['alert-error'],bgHover:o.theme.colors['alert-bg-error-100'],borderHover:o.theme.colors['alert-error'],beforeBgHover:'transparent'}):null)),success:r([""," ",""],(o=>y({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-success-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-500'],borderHover:o.theme.colors['alert-success'],outlineFocus:o.theme.colors['alert-success'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?C({bg:o.theme.colors['alert-bg-success-100'],border:o.theme.colors['alert-success'],bgChecked:o.theme.colors['alert-bg-success-100'],borderChecked:o.theme.colors['alert-success'],bgHover:o.theme.colors['alert-bg-success-100'],borderHover:o.theme.colors['alert-success'],beforeBgHover:'transparent'}):null)),disabled:r(["cursor:auto;"," ",""],(o=>y({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-disabled-large'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-active'],borderHover:o.theme.colors['border-disabled'],outlineFocus:o.theme.colors['border-disabled'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?C({bg:o.theme.colors['bg-disabled-large'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-large'],borderChecked:o.theme.colors['bg-disabled-active'],bgHover:o.theme.colors['bg-disabled-large'],borderHover:o.theme.colors['border-disabled'],beforeBgHover:'transparent'}):null))},onColored:{regular:r([""," ",""],(o=>y(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-onmain-primary'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-brand-primary-basic'],borderHover:o.theme.colors['border-brand-primary'],outlineFocus:o.theme.colors['border-brand-primary'],colorDisabled:o.theme.colors['content-oncolor-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['bg-onmain-primary'],color:o.theme.colors['content-brand-primary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-oncolor-primary'],borderHover:o.theme.colors['border-brand-primary'],outlineFocus:o.theme.colors['content-oncolor-primary'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?C({bg:o.theme.colors['bg-onmain-secondary'],border:o.theme.colors['border-onmain-default-large'],bgChecked:o.theme.colors['bg-onmain-primary'],borderChecked:o.theme.colors['border-onmain-default-large'],bgHover:o.theme.colors['bg-onmain-secondary'],borderHover:o.theme.colors['border-onmain-default-large'],beforeBgHover:o.theme.colors['bg-oncolor-hover']}):null)),error:r([""," ",""],(o=>y(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-error-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-500'],borderHover:o.theme.colors['alert-error'],outlineFocus:o.theme.colors['alert-error'],colorDisabled:o.theme.colors['content-oncolor-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['alert-bg-error-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-500'],borderHover:o.theme.colors['alert-error'],outlineFocus:o.theme.colors['alert-error'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?C({bg:o.theme.colors['alert-bg-error-100'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-100'],borderChecked:o.theme.colors['alert-error'],bgHover:o.theme.colors['alert-bg-error-100'],borderHover:o.theme.colors['alert-error'],beforeBgHover:o.theme.colors['bg-oncolor-hover']}):null)),success:r([""," ",""],(o=>y(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-success-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-500'],borderHover:o.theme.colors['alert-success'],outlineFocus:o.theme.colors['alert-success'],colorDisabled:o.theme.colors['content-oncolor-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['alert-bg-success-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-500'],borderHover:o.theme.colors['alert-success'],outlineFocus:o.theme.colors['alert-success'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?C({bg:o.theme.colors['alert-bg-success-100'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-100'],borderChecked:o.theme.colors['alert-success'],bgHover:o.theme.colors['alert-bg-success-100'],borderHover:o.theme.colors['alert-success'],beforeBgHover:o.theme.colors['bg-oncolor-hover']}):null)),disabled:r(["cursor:auto;"," ",""],(o=>y(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-disabled-large'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-active'],borderHover:o.theme.colors['border-disabled'],outlineFocus:o.theme.colors['border-disabled'],colorDisabled:o.theme.colors['content-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['bg-disabled-large'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-active'],borderHover:o.theme.colors['border-disabled'],outlineFocus:o.theme.colors['border-disabled'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?C({bg:o.theme.colors['bg-onmain-secondary'],border:o.theme.colors['border-oncolor-disabled'],bgChecked:o.theme.colors['bg-onmain-secondary'],borderChecked:o.theme.colors['border-oncolor-disabled'],bgHover:o.theme.colors['bg-onmain-secondary'],borderHover:o.theme.colors['border-oncolor-disabled'],beforeBgHover:'transparent'}):null))}};var x={default:r([""," ",""],(o=>o.error?"\n & > ".concat(u," > rect { \n fill: ").concat(c(o.theme.colors.pomegranate).setAlpha(.1).toString(),";\n stroke: ").concat(o.theme.colors.pomegranate,";\n } \n & > ").concat(u," g > rect {\n fill: ").concat(o.theme.colors.pomegranate,";\n }\n "):null),(o=>"\n color: ".concat(o.disabled?o.theme.colors.alto:o.theme.colors.mineShaft,";\n cursor: ").concat(o.disabled?'not-allowed':'pointer',";\n\n & > ").concat(h,":checked ~ ").concat(u," g {\n opacity: 1;\n }\n & > ").concat(h,":disabled ~ ").concat(u," > rect {\n fill: ").concat(o.theme.colors.white,";\n stroke: ").concat(o.theme.colors.grey,";\n }\n & > ").concat(h,":checked:disabled ~ ").concat(u," g > rect {\n fill: ").concat(o.theme.colors.alto,";\n }\n &:focus {\n outline: none;\n }\n & > ").concat(h,":focus-visible ~ ").concat(u," {\n outline: 1px solid ").concat(o.theme.colors.accent,";\n outline-offset: 2px;\n }\n ")))};var H=e.label.withConfig({shouldForwardProp:o=>['children','htmlFor','style'].includes(o)}).withConfig({componentId:"fox-ui__sc-9s6oap-6"})([""," "," "," "," ",""],m,(o=>o.brandPresetUsed?o.disabled&&!o.onColored?k.default.disabled:o.disabled&&o.onColored?k.onColored.disabled:!o.error||o.success||o.onColored?o.error&&!o.success&&o.onColored?k.onColored.error:!o.success||o.error||o.onColored?o.success&&!o.error&&o.onColored?k.onColored.success:o.onColored?k.onColored.regular:k.default.regular:k.default.success:k.default.error:x.default),(o=>{var e=o.brandPresetUsed?i:d;return b.includes(o.size)?"font-size: ".concat(e[o.size],"px;"):n('size','font-size')}),(o=>n('width',o.fluid&&'auto'!==o.width&&!Array.isArray(o.width)?'max-width':'width')),(o=>o.fluid?'width: 100%;':null));var w=e.div.withConfig({shouldForwardProp:o=>'inline'!==o}).withConfig({componentId:"fox-ui__sc-9s6oap-7"})(["",""],(e=>e.inline?r(["display:flex;flex-direction:row;> ",":first-child{margin-left:0;}> ",":not(:first-child){margin-left:15px;}",""],H,H,t()(a||(a=o(["\n flex-direction: column;\n > ",":first-child {\n margin-top: 0;\n }\n > ",":not(:first-child) {\n margin-top: 15px;\n margin-left: 0;\n }\n "])),H,H)):"\n display: flex;\n flex-direction: column;\n > ".concat(H,":first-child {\n margin-top: 0;\n margin-left: 0;\n }\n > ").concat(H,":not(:first-child) {\n margin-top: 15px;\n margin-left: 0;\n }\n ")));export{g as Background,p as BrandMask,f as CheckIcon,v as Content,u as DefaultMask,w as Group,h as Input,H as Root};
2
2
  //# sourceMappingURL=style.js.map