@foxford/ui 2.30.1-beta-ec5d2c1-20240611 → 2.32.1-beta-adc1163-20240618

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,2 +1,2 @@
1
- import r from'@babel/runtime/helpers/objectSpread2';import e from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as t}from'react';import{withMergedProps as s}from'../../hocs/withMergedProps.js';import{Skeleton as a}from'../Skeleton/Skeleton.js';import{Text as o}from'../Text/Text.js';import{abbreviateCaption as i}from'./utils.js';import{SIZES as n}from'./constants.js';import{SIZES_DEFAULT as p,SIZES_MAPPING_RULES as m}from'./default-constants.js';import{Root as l}from'./style.js';import{jsx as d,Fragment as f}from'react/jsx-runtime';var h=["size","textProps","borderRadius","children","text"];var c=s(t(((t,s)=>{var n;var{size:p="m",textProps:c={},borderRadius:u="50%",children:b,text:j}=t,S=e(t,h);var x='string'!=typeof p||'default'!==S.preset&&'sm'!==p?p:null!==(n=m[p])&&void 0!==n?n:p;return d(l,r(r({},S),{},{size:x,borderRadius:u,ref:s,children:S.loading?d(a,{as:"span",width:"100%",height:"100%",borderRadius:"inherit"}):d(f,{children:null!=b?b:!S.src&&d(o,r(r({as:"span",appearance:"caption",size:"inherit",color:"inherit",lineHeight:1,marginTop:1,transform:"uppercase"},c),{},{children:i(j||S.title||'')}))})}))})),{displayName:'Avatar',sizes:r=>'brand'===r.preset?n:p});export{c as Avatar};
1
+ import r from'@babel/runtime/helpers/objectSpread2';import e from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as t}from'react';import{withMergedProps as s}from'../../hocs/withMergedProps.js';import{Skeleton as a}from'../Skeleton/Skeleton.js';import{Text as o}from'../Text/Text.js';import{abbreviateCaption as i}from'./utils.js';import{SIZES_SQUARE as n,SIZES as p}from'./constants.js';import{SIZES_DEFAULT as m,SIZES_MAPPING_RULES as l}from'./default-constants.js';import{Root as d}from'./style.js';import{jsx as f,Fragment as h}from'react/jsx-runtime';var c=["size","textProps","children","text"];var S=s(t(((t,s)=>{var n;var{size:p="m",textProps:m={},children:S,text:u}=t,j=e(t,c);var b='string'!=typeof p||'default'!==j.preset&&'sm'!==p?p:null!==(n=l[p])&&void 0!==n?n:p;return f(d,r(r({},j),{},{size:b,ref:s,children:j.loading?f(a,{as:"span",width:"100%",height:"100%",borderRadius:"inherit"}):f(h,{children:null!=S?S:!j.src&&f(o,r(r({as:"span",appearance:"caption",size:"inherit",color:"inherit",lineHeight:1,marginTop:1,transform:"uppercase"},m),{},{children:i(u||j.title||'')}))})}))})),{displayName:'Avatar',sizes:r=>'brand'===r.preset?r.square?n:p:m});export{S as Avatar};
2
2
  //# sourceMappingURL=Avatar.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.js","sources":["../../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { Skeleton } from 'components/Skeleton'\nimport { Text } from 'components/Text'\nimport { abbreviateCaption } from './utils'\nimport { SIZES } from './constants'\nimport { SIZES_MAPPING_RULES, SIZES_DEFAULT } from './default-constants'\nimport type { AvatarProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Avatar'\n\n/**\n *\n * Component accepts all \\<span\\> attributes.\n *\n * Responsive \"size\", \"margin\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [AvatarProps](https://github.com/foxford/ui/blob/master/src/components/AvatarProps/types.ts)\n */\nconst Avatar: React.ForwardRefExoticComponent<AvatarProps> = withMergedProps<AvatarProps, HTMLSpanElement>(\n forwardRef((props, ref) => {\n const { size = 'm', textProps = {}, borderRadius = '50%', children, text, ...restProps } = props\n\n const sizeMapped =\n typeof size === 'string' && (restProps.preset === 'default' || size === 'sm')\n ? SIZES_MAPPING_RULES[size] ?? size\n : size\n\n return (\n <Styled.Root {...restProps} size={sizeMapped} borderRadius={borderRadius} ref={ref}>\n {restProps.loading ? (\n <Skeleton as='span' width='100%' height='100%' borderRadius='inherit' />\n ) : (\n <>\n {children ??\n (!restProps.src && (\n <Text\n as='span'\n appearance='caption'\n size='inherit'\n color='inherit'\n lineHeight={1}\n marginTop={1}\n transform='uppercase'\n {...textProps}\n >\n {abbreviateCaption(text || restProps.title || '')}\n </Text>\n ))}\n </>\n )}\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => (props.preset === 'brand' ? SIZES : SIZES_DEFAULT),\n }\n)\n\nexport { Avatar }\n"],"names":["Avatar","withMergedProps","forwardRef","props","ref","_SIZES_MAPPING_RULES$","size","textProps","borderRadius","children","text","restProps","_excluded","sizeMapped","preset","SIZES_MAPPING_RULES","_jsx","Styled.Root","loading","Skeleton","as","width","height","_Fragment","src","Text","_objectSpread","appearance","color","lineHeight","marginTop","transform","abbreviateCaption","title","displayName","sizes","SIZES","SIZES_DEFAULT"],"mappings":"ymBAsBMA,IAAAA,EAAuDC,EAC3DC,IAAYC,EAAOC,KAAQ,IAAAC,EACzB,IAAMC,KAAEA,EAAO,IAATC,UAAcA,EAAY,GAA1BC,aAA8BA,EAAe,MAA7CC,SAAoDA,EAApDC,KAA8DA,GAAuBP,EAAdQ,IAAcR,EAA3FS,GAEA,IAAMC,EACY,iBAATP,GAA2C,YAArBK,EAAUG,QAAiC,OAATR,EAE3DA,EAFJ,QAAAD,EACIU,EAAoBT,UAAAA,IADxBD,EAAAA,EACiCC,EAGnC,OACEU,EAACC,SAAgBN,GAAjB,GAAA,CAA4BL,KAAMO,EAAYL,aAAcA,EAAcJ,IAAKA,EAA/EK,SACGE,EAAUO,QACTF,EAACG,EAAD,CAAUC,GAAG,OAAOC,MAAM,OAAOC,OAAO,OAAOd,aAAa,YAE5DQ,EAAAO,EAAA,CAAAd,SACGA,MAAAA,EAAAA,GACGE,EAAUa,KACVR,EAACS,EAADC,EAAAA,EAAA,CACEN,GAAG,OACHO,WAAW,UACXrB,KAAK,UACLsB,MAAM,UACNC,WAAY,EACZC,UAAW,EACXC,UAAU,aACNxB,GARN,GAAA,CAAAE,SAUGuB,EAAkBtB,GAAQC,EAAUsB,OAAS,eAQ9D,CACEC,YAhDmB,SAiDnBC,MAAQhC,GAA4B,UAAjBA,EAAMW,OAAqBsB,EAAQC"}
1
+ {"version":3,"file":"Avatar.js","sources":["../../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { Skeleton } from 'components/Skeleton'\nimport { Text } from 'components/Text'\nimport { abbreviateCaption } from './utils'\nimport { SIZES, SIZES_SQUARE } from './constants'\nimport { SIZES_MAPPING_RULES, SIZES_DEFAULT } from './default-constants'\nimport type { AvatarProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Avatar'\n\n/**\n *\n * Component accepts all \\<span\\> attributes.\n *\n * Responsive \"size\", \"margin\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [AvatarProps](https://github.com/foxford/ui/blob/master/src/components/Avatar/types.ts)\n */\nconst Avatar: React.ForwardRefExoticComponent<AvatarProps> = withMergedProps<AvatarProps, HTMLSpanElement>(\n forwardRef((props, ref) => {\n const { size = 'm', textProps = {}, children, text, ...restProps } = props\n\n const sizeMapped =\n typeof size === 'string' && (restProps.preset === 'default' || size === 'sm')\n ? SIZES_MAPPING_RULES[size] ?? size\n : size\n\n return (\n <Styled.Root {...restProps} size={sizeMapped} ref={ref}>\n {restProps.loading ? (\n <Skeleton as='span' width='100%' height='100%' borderRadius='inherit' />\n ) : (\n <>\n {children ??\n (!restProps.src && (\n <Text\n as='span'\n appearance='caption'\n size='inherit'\n color='inherit'\n lineHeight={1}\n marginTop={1}\n transform='uppercase'\n {...textProps}\n >\n {abbreviateCaption(text || restProps.title || '')}\n </Text>\n ))}\n </>\n )}\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => {\n if (props.preset === 'brand') {\n return props.square ? SIZES_SQUARE : SIZES\n }\n\n return SIZES_DEFAULT\n },\n }\n)\n\nexport { Avatar }\n"],"names":["Avatar","withMergedProps","forwardRef","props","ref","_SIZES_MAPPING_RULES$","size","textProps","children","text","restProps","_excluded","sizeMapped","preset","SIZES_MAPPING_RULES","_jsx","Styled.Root","loading","Skeleton","as","width","height","borderRadius","_Fragment","src","Text","_objectSpread","appearance","color","lineHeight","marginTop","transform","abbreviateCaption","title","displayName","sizes","square","SIZES_SQUARE","SIZES","SIZES_DEFAULT"],"mappings":"4mBAsBMA,IAAAA,EAAuDC,EAC3DC,GAAW,CAACC,EAAOC,KAAQ,IAAAC,EACzB,IAAMC,KAAEA,EAAO,IAATC,UAAcA,EAAY,GAA1BC,SAA8BA,EAA9BC,KAAwCA,GAAuBN,EAAdO,IAAcP,EAArEQ,GAEA,IAAMC,EACY,iBAATN,GAA2C,YAArBI,EAAUG,QAAiC,OAATP,EAE3DA,EAFJ,QAAAD,EACIS,EAAoBR,UAAAA,IADxBD,EAAAA,EACiCC,EAGnC,OACES,EAACC,SAAgBN,GAAjB,GAAA,CAA4BJ,KAAMM,EAAYR,IAAKA,EAAnDI,SACGE,EAAUO,QACTF,EAACG,EAAD,CAAUC,GAAG,OAAOC,MAAM,OAAOC,OAAO,OAAOC,aAAa,YAE5DP,EAAAQ,EAAA,CAAAf,SACGA,MAAAA,EAAAA,GACGE,EAAUc,KACVT,EAACU,EAADC,EAAAA,EAAA,CACEP,GAAG,OACHQ,WAAW,UACXrB,KAAK,UACLsB,MAAM,UACNC,WAAY,EACZC,UAAW,EACXC,UAAU,aACNxB,GARN,GAAA,CAAAC,SAUGwB,EAAkBvB,GAAQC,EAAUuB,OAAS,eAQ9D,CACEC,YAhDmB,SAiDnBC,MAAQhC,GACe,UAAjBA,EAAMU,OACDV,EAAMiC,OAASC,EAAeC,EAGhCC"}
@@ -1,2 +1,2 @@
1
- var t={xxxl:{width:120,height:120,fontSize:36},xxl:{width:68,height:68,fontSize:24},xl:{width:52,height:52,fontSize:18},l:{width:48,height:48,fontSize:16},m:{width:40,height:40,fontSize:14},s:{width:32,height:32,fontSize:12},xs:{width:24,height:24,fontSize:10},xxs:{width:20,height:20,fontSize:8},xxxs:{width:16,height:16,fontSize:6}};export{t as SIZES};
1
+ var i={xxxl:{width:120,height:120,fontSize:36,borderRadius:'50%'},xxl:{width:68,height:68,fontSize:24,borderRadius:'50%'},xl:{width:52,height:52,fontSize:18,borderRadius:'50%'},l:{width:48,height:48,fontSize:16,borderRadius:'50%'},m:{width:40,height:40,fontSize:14,borderRadius:'50%'},s:{width:32,height:32,fontSize:12,borderRadius:'50%'},xs:{width:24,height:24,fontSize:10,borderRadius:'50%'},xxs:{width:20,height:20,fontSize:8,borderRadius:'50%'},xxxs:{width:16,height:16,fontSize:6,borderRadius:'50%'}};var e={xxxl:{width:120,height:120,fontSize:36,borderRadius:24},xxl:{width:68,height:68,fontSize:24,borderRadius:14},xl:{width:52,height:52,fontSize:18,borderRadius:11},l:{width:48,height:48,fontSize:16,borderRadius:10},m:{width:40,height:40,fontSize:14,borderRadius:8},s:{width:32,height:32,fontSize:12,borderRadius:7},xs:{width:24,height:24,fontSize:10,borderRadius:5},xxs:{width:20,height:20,fontSize:8,borderRadius:4},xxxs:{width:16,height:16,fontSize:6,borderRadius:4}};export{i as SIZES,e as SIZES_SQUARE};
2
2
  //# sourceMappingURL=constants.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"constants.js","sources":["../../../../src/components/Avatar/constants.ts"],"sourcesContent":["import type { Sizes } from 'shared/types'\n\nexport const SIZES: Sizes = {\n xxxl: {\n width: 120,\n height: 120,\n fontSize: 36,\n },\n xxl: {\n width: 68,\n height: 68,\n fontSize: 24,\n },\n xl: {\n width: 52,\n height: 52,\n fontSize: 18,\n },\n l: {\n width: 48,\n height: 48,\n fontSize: 16,\n },\n m: {\n width: 40,\n height: 40,\n fontSize: 14,\n },\n s: {\n width: 32,\n height: 32,\n fontSize: 12,\n },\n xs: {\n width: 24,\n height: 24,\n fontSize: 10,\n },\n xxs: {\n width: 20,\n height: 20,\n fontSize: 8,\n },\n xxxs: {\n width: 16,\n height: 16,\n fontSize: 6,\n },\n}\n"],"names":["SIZES","xxxl","width","height","fontSize","xxl","xl","l","m","s","xs","xxs","xxxs"],"mappings":"AAEO,IAAMA,EAAe,CAC1BC,KAAM,CACJC,MAAO,IACPC,OAAQ,IACRC,SAAU,IAEZC,IAAK,CACHH,MAAO,GACPC,OAAQ,GACRC,SAAU,IAEZE,GAAI,CACFJ,MAAO,GACPC,OAAQ,GACRC,SAAU,IAEZG,EAAG,CACDL,MAAO,GACPC,OAAQ,GACRC,SAAU,IAEZI,EAAG,CACDN,MAAO,GACPC,OAAQ,GACRC,SAAU,IAEZK,EAAG,CACDP,MAAO,GACPC,OAAQ,GACRC,SAAU,IAEZM,GAAI,CACFR,MAAO,GACPC,OAAQ,GACRC,SAAU,IAEZO,IAAK,CACHT,MAAO,GACPC,OAAQ,GACRC,SAAU,GAEZQ,KAAM,CACJV,MAAO,GACPC,OAAQ,GACRC,SAAU"}
1
+ {"version":3,"file":"constants.js","sources":["../../../../src/components/Avatar/constants.ts"],"sourcesContent":["import type { Sizes } from 'shared/types'\n\nexport const SIZES: Sizes = {\n xxxl: {\n width: 120,\n height: 120,\n fontSize: 36,\n borderRadius: '50%',\n },\n xxl: {\n width: 68,\n height: 68,\n fontSize: 24,\n borderRadius: '50%',\n },\n xl: {\n width: 52,\n height: 52,\n fontSize: 18,\n borderRadius: '50%',\n },\n l: {\n width: 48,\n height: 48,\n fontSize: 16,\n borderRadius: '50%',\n },\n m: {\n width: 40,\n height: 40,\n fontSize: 14,\n borderRadius: '50%',\n },\n s: {\n width: 32,\n height: 32,\n fontSize: 12,\n borderRadius: '50%',\n },\n xs: {\n width: 24,\n height: 24,\n fontSize: 10,\n borderRadius: '50%',\n },\n xxs: {\n width: 20,\n height: 20,\n fontSize: 8,\n borderRadius: '50%',\n },\n xxxs: {\n width: 16,\n height: 16,\n fontSize: 6,\n borderRadius: '50%',\n },\n}\n\nexport const SIZES_SQUARE: Sizes = {\n xxxl: {\n width: 120,\n height: 120,\n fontSize: 36,\n borderRadius: 24,\n },\n xxl: {\n width: 68,\n height: 68,\n fontSize: 24,\n borderRadius: 14,\n },\n xl: {\n width: 52,\n height: 52,\n fontSize: 18,\n borderRadius: 11,\n },\n l: {\n width: 48,\n height: 48,\n fontSize: 16,\n borderRadius: 10,\n },\n m: {\n width: 40,\n height: 40,\n fontSize: 14,\n borderRadius: 8,\n },\n s: {\n width: 32,\n height: 32,\n fontSize: 12,\n borderRadius: 7,\n },\n xs: {\n width: 24,\n height: 24,\n fontSize: 10,\n borderRadius: 5,\n },\n xxs: {\n width: 20,\n height: 20,\n fontSize: 8,\n borderRadius: 4,\n },\n xxxs: {\n width: 16,\n height: 16,\n fontSize: 6,\n borderRadius: 4,\n },\n}\n"],"names":["SIZES","xxxl","width","height","fontSize","borderRadius","xxl","xl","l","m","s","xs","xxs","xxxs","SIZES_SQUARE"],"mappings":"AAEO,IAAMA,EAAe,CAC1BC,KAAM,CACJC,MAAO,IACPC,OAAQ,IACRC,SAAU,GACVC,aAAc,OAEhBC,IAAK,CACHJ,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBE,GAAI,CACFL,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBG,EAAG,CACDN,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBI,EAAG,CACDP,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBK,EAAG,CACDR,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBM,GAAI,CACFT,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBO,IAAK,CACHV,MAAO,GACPC,OAAQ,GACRC,SAAU,EACVC,aAAc,OAEhBQ,KAAM,CACJX,MAAO,GACPC,OAAQ,GACRC,SAAU,EACVC,aAAc,QAIX,IAAMS,EAAsB,CACjCb,KAAM,CACJC,MAAO,IACPC,OAAQ,IACRC,SAAU,GACVC,aAAc,IAEhBC,IAAK,CACHJ,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,IAEhBE,GAAI,CACFL,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,IAEhBG,EAAG,CACDN,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,IAEhBI,EAAG,CACDP,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,GAEhBK,EAAG,CACDR,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,GAEhBM,GAAI,CACFT,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,GAEhBO,IAAK,CACHV,MAAO,GACPC,OAAQ,GACRC,SAAU,EACVC,aAAc,GAEhBQ,KAAM,CACJX,MAAO,GACPC,OAAQ,GACRC,SAAU,EACVC,aAAc"}
@@ -1,2 +1,2 @@
1
- var t={l:'xl',m:'l',sm:'m'};var h={xxxl:{width:120,height:120,fontSize:36},xxl:{width:120,height:120,fontSize:36},xl:{width:120,height:120,fontSize:36},l:{width:68,height:68,fontSize:24},m:{width:52,height:52,fontSize:12},s:{width:40,height:40,fontSize:12},xs:{width:32,height:32,fontSize:12},xxs:{width:32,height:32,fontSize:12},xxxs:{width:32,height:32,fontSize:12}};export{h as SIZES_DEFAULT,t as SIZES_MAPPING_RULES};
1
+ var i={l:'xl',m:'l',sm:'m'};var e={xxxl:{width:120,height:120,fontSize:36,borderRadius:'50%'},xxl:{width:120,height:120,fontSize:36,borderRadius:'50%'},xl:{width:120,height:120,fontSize:36,borderRadius:'50%'},l:{width:68,height:68,fontSize:24,borderRadius:'50%'},m:{width:52,height:52,fontSize:12,borderRadius:'50%'},s:{width:40,height:40,fontSize:12,borderRadius:'50%'},xs:{width:32,height:32,fontSize:12,borderRadius:'50%'},xxs:{width:32,height:32,fontSize:12,borderRadius:'50%'},xxxs:{width:32,height:32,fontSize:12,borderRadius:'50%'}};export{e as SIZES_DEFAULT,i as SIZES_MAPPING_RULES};
2
2
  //# sourceMappingURL=default-constants.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"default-constants.js","sources":["../../../../src/components/Avatar/default-constants.ts"],"sourcesContent":["import type { Size, Sizes } from 'shared/types'\n\nexport const SIZES_MAPPING_RULES: Record<string, Size> = { l: 'xl', m: 'l', sm: 'm' }\n\nexport const SIZES_DEFAULT: Sizes = {\n xxxl: {\n width: 120,\n height: 120,\n fontSize: 36,\n },\n xxl: {\n width: 120,\n height: 120,\n fontSize: 36,\n },\n xl: {\n width: 120,\n height: 120,\n fontSize: 36,\n },\n l: {\n width: 68,\n height: 68,\n fontSize: 24,\n },\n m: {\n width: 52,\n height: 52,\n fontSize: 12,\n },\n s: {\n width: 40,\n height: 40,\n fontSize: 12,\n },\n xs: {\n width: 32,\n height: 32,\n fontSize: 12,\n },\n xxs: {\n width: 32,\n height: 32,\n fontSize: 12,\n },\n xxxs: {\n width: 32,\n height: 32,\n fontSize: 12,\n },\n}\n"],"names":["SIZES_MAPPING_RULES","l","m","sm","SIZES_DEFAULT","xxxl","width","height","fontSize","xxl","xl","s","xs","xxs","xxxs"],"mappings":"AAEO,IAAMA,EAA4C,CAAEC,EAAG,KAAMC,EAAG,IAAKC,GAAI,KAEzE,IAAMC,EAAuB,CAClCC,KAAM,CACJC,MAAO,IACPC,OAAQ,IACRC,SAAU,IAEZC,IAAK,CACHH,MAAO,IACPC,OAAQ,IACRC,SAAU,IAEZE,GAAI,CACFJ,MAAO,IACPC,OAAQ,IACRC,SAAU,IAEZP,EAAG,CACDK,MAAO,GACPC,OAAQ,GACRC,SAAU,IAEZN,EAAG,CACDI,MAAO,GACPC,OAAQ,GACRC,SAAU,IAEZG,EAAG,CACDL,MAAO,GACPC,OAAQ,GACRC,SAAU,IAEZI,GAAI,CACFN,MAAO,GACPC,OAAQ,GACRC,SAAU,IAEZK,IAAK,CACHP,MAAO,GACPC,OAAQ,GACRC,SAAU,IAEZM,KAAM,CACJR,MAAO,GACPC,OAAQ,GACRC,SAAU"}
1
+ {"version":3,"file":"default-constants.js","sources":["../../../../src/components/Avatar/default-constants.ts"],"sourcesContent":["import type { Size, Sizes } from 'shared/types'\n\nexport const SIZES_MAPPING_RULES: Record<string, Size> = { l: 'xl', m: 'l', sm: 'm' }\n\nexport const SIZES_DEFAULT: Sizes = {\n xxxl: {\n width: 120,\n height: 120,\n fontSize: 36,\n borderRadius: '50%',\n },\n xxl: {\n width: 120,\n height: 120,\n fontSize: 36,\n borderRadius: '50%',\n },\n xl: {\n width: 120,\n height: 120,\n fontSize: 36,\n borderRadius: '50%',\n },\n l: {\n width: 68,\n height: 68,\n fontSize: 24,\n borderRadius: '50%',\n },\n m: {\n width: 52,\n height: 52,\n fontSize: 12,\n borderRadius: '50%',\n },\n s: {\n width: 40,\n height: 40,\n fontSize: 12,\n borderRadius: '50%',\n },\n xs: {\n width: 32,\n height: 32,\n fontSize: 12,\n borderRadius: '50%',\n },\n xxs: {\n width: 32,\n height: 32,\n fontSize: 12,\n borderRadius: '50%',\n },\n xxxs: {\n width: 32,\n height: 32,\n fontSize: 12,\n borderRadius: '50%',\n },\n}\n"],"names":["SIZES_MAPPING_RULES","l","m","sm","SIZES_DEFAULT","xxxl","width","height","fontSize","borderRadius","xxl","xl","s","xs","xxs","xxxs"],"mappings":"AAEO,IAAMA,EAA4C,CAAEC,EAAG,KAAMC,EAAG,IAAKC,GAAI,KAEzE,IAAMC,EAAuB,CAClCC,KAAM,CACJC,MAAO,IACPC,OAAQ,IACRC,SAAU,GACVC,aAAc,OAEhBC,IAAK,CACHJ,MAAO,IACPC,OAAQ,IACRC,SAAU,GACVC,aAAc,OAEhBE,GAAI,CACFL,MAAO,IACPC,OAAQ,IACRC,SAAU,GACVC,aAAc,OAEhBR,EAAG,CACDK,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBP,EAAG,CACDI,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBG,EAAG,CACDN,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBI,GAAI,CACFP,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBK,IAAK,CACHR,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBM,KAAM,CACJT,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc"}
@@ -1,2 +1,2 @@
1
- import o from'@babel/runtime/helpers/objectSpread2';import r,{css as e}from'styled-components';import{createShouldForwardProp as n}from'../../shared/utils/style.js';import{responsiveSize as a}from'../../mixins/responsive-size.js';import{responsiveMargin as t}from'../../mixins/responsive-margin.js';import{getColor as s}from'../../mixins/color.js';var c=n((o=>!['src','shadow','borderRadius','square','loading'].includes(o)));var i=o=>"\n color: ".concat(o.color,";\n background-color: ").concat(o.backgroundColor,";\n filter: drop-shadow(0 6px 10px ").concat(o.shadowColor,");\n");var l={default:e(["",""],(r=>i(o({color:r.theme.colors.white,backgroundColor:r.loading?r.theme.colors.transparent:r.theme.colors.mercury,shadowColor:r.shadow?r.theme.colors['bg-oncolor-hover']:r.theme.colors.transparent},r.palette)))),primary:e(["",""],(r=>i(o({color:r.theme.colors['content-brand-primary'],backgroundColor:r.loading?r.theme.colors.transparent:r.theme.colors['bg-brand-primary-100'],shadowColor:r.shadow?r.theme.colors['bg-oncolor-hover']:r.theme.colors.transparent},r.palette))))};var d=r.span.withConfig({shouldForwardProp:c}).attrs({dynamicSizeDeclaration:(o,r)=>({fontSize:'string'==typeof o?o:"".concat(o).concat(r),width:'1em',height:'1em'})}).withConfig({componentId:"fox-ui__sc-1dzfgqr-0"})([""," "," "," "," ",""],(o=>"\n box-sizing: border-box;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n vertical-align: middle;\n flex-shrink: 0;\n cursor: default;\n border-radius: ".concat(o.square?'6px':o.borderRadius,";\n ").concat(o.src&&!o.loading?"\n background-image: url(".concat(o.src,");\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover; \n "):'',"\n ")),(o=>'brand'===o.preset?l.primary:l.default),(o=>o.color&&!o.loading&&"background-color: ".concat(s(o.color,o),";")),a,t);export{d as Root};
1
+ import o from'@babel/runtime/helpers/objectSpread2';import r,{css as e}from'styled-components';import{createShouldForwardProp as n}from'../../shared/utils/style.js';import{responsiveSize as a}from'../../mixins/responsive-size.js';import{responsiveMargin as t}from'../../mixins/responsive-margin.js';import{getColor as s}from'../../mixins/color.js';var c=n((o=>!['src','shadow','square','loading'].includes(o)));var i=o=>"\n color: ".concat(o.color,";\n background-color: ").concat(o.backgroundColor,";\n filter: drop-shadow(0 6px 10px ").concat(o.shadowColor,");\n");var l={default:e(["",""],(r=>i(o({color:r.theme.colors.white,backgroundColor:r.loading?r.theme.colors.transparent:r.theme.colors.mercury,shadowColor:r.shadow?r.theme.colors['bg-oncolor-hover']:r.theme.colors.transparent},r.palette)))),primary:e(["",""],(r=>i(o({color:r.theme.colors['content-brand-primary'],backgroundColor:r.loading?r.theme.colors.transparent:r.theme.colors['bg-brand-primary-100'],shadowColor:r.shadow?r.theme.colors['bg-oncolor-hover']:r.theme.colors.transparent},r.palette))))};var d=r.span.withConfig({shouldForwardProp:c}).attrs((o=>({dynamicSizeDeclaration:(r,e)=>({fontSize:'string'==typeof r?r:"".concat(r).concat(e),borderRadius:o.square?'0.2em':'50%',width:'1em',height:'1em'})}))).withConfig({componentId:"fox-ui__sc-1dzfgqr-0"})([""," "," "," "," ",""],(o=>"\n box-sizing: border-box;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n vertical-align: middle;\n flex-shrink: 0;\n cursor: default;\n ".concat(o.src&&!o.loading?"\n background-image: url(".concat(o.src,");\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover; \n "):'',"\n ")),(o=>'brand'===o.preset?l.primary:l.default),(o=>o.color&&!o.loading&&"background-color: ".concat(s(o.color,o),";")),a,t);export{d as Root};
2
2
  //# sourceMappingURL=style.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../../src/components/Avatar/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport { getColor } from 'mixins/color'\nimport type { StyledAvatarProps, AvatarPalette } from './types'\n\nconst shouldForwardAvatarProp = createShouldForwardProp(\n (propKey) => !['src', 'shadow', 'borderRadius', 'square', 'loading'].includes(propKey)\n)\n\nconst template = (palette: AvatarPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n filter: drop-shadow(0 6px 10px ${palette.shadowColor});\n`\n\nconst COLOR_SCHEMA = {\n default: css<StyledAvatarProps>`\n ${(props) =>\n template({\n color: props.theme.colors.white,\n backgroundColor: props.loading ? props.theme.colors.transparent : props.theme.colors.mercury,\n shadowColor: props.shadow ? props.theme.colors['bg-oncolor-hover'] : props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n primary: css<StyledAvatarProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-brand-primary'],\n backgroundColor: props.loading ? props.theme.colors.transparent : props.theme.colors['bg-brand-primary-100'],\n shadowColor: props.shadow ? props.theme.colors['bg-oncolor-hover'] : props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n}\n\nexport const Root = styled.span\n .withConfig<StyledAvatarProps>({\n shouldForwardProp: shouldForwardAvatarProp,\n })\n .attrs<StyledAvatarProps>(<Required<Pick<StyledAvatarProps, 'dynamicSizeDeclaration'>>>{\n dynamicSizeDeclaration: (size, sizeUnits) => ({\n fontSize: typeof size === 'string' ? size : `${size}${sizeUnits}`,\n width: '1em',\n height: '1em',\n }),\n })`\n ${(props) => `\n box-sizing: border-box;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n vertical-align: middle;\n flex-shrink: 0;\n cursor: default;\n border-radius: ${props.square ? '6px' : props.borderRadius};\n ${\n props.src && !props.loading\n ? `\n background-image: url(${props.src});\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover; \n `\n : ''\n }\n `}\n\n ${(props) => (props.preset === 'brand' ? COLOR_SCHEMA.primary : COLOR_SCHEMA.default)}\n\n ${(props) => props.color && !props.loading && `background-color: ${getColor(props.color, props)};`}\n\n ${responsiveSize}\n ${responsiveMargin}\n`\n"],"names":["shouldForwardAvatarProp","createShouldForwardProp","propKey","includes","template","palette","concat","color","backgroundColor","shadowColor","COLOR_SCHEMA","default","css","props","_objectSpread","theme","colors","white","loading","transparent","mercury","shadow","primary","Root","styled","span","withConfig","shouldForwardProp","attrs","dynamicSizeDeclaration","size","sizeUnits","fontSize","width","height","componentId","square","borderRadius","src","preset","getColor","responsiveSize","responsiveMargin"],"mappings":"4VAOA,IAAMA,EAA0BC,GAC7BC,IAAa,CAAC,MAAO,SAAU,eAAgB,SAAU,WAAWC,SAASD,KAGhF,IAAME,EAAYC,GAAD,cAAAC,OACND,EAAQE,MACGF,2BAAAA,OAAAA,EAAQG,gBAFb,wCAAAF,OAGkBD,EAAQI,YAH3C,QAMA,IAAMC,EAAe,CACnBC,QAASC,EACJC,CAAAA,GAAAA,KAAAA,GACDT,EAAQU,EAAA,CACNP,MAAOM,EAAME,MAAMC,OAAOC,MAC1BT,gBAAiBK,EAAMK,QAAUL,EAAME,MAAMC,OAAOG,YAAcN,EAAME,MAAMC,OAAOI,QACrFX,YAAaI,EAAMQ,OAASR,EAAME,MAAMC,OAAO,oBAAsBH,EAAME,MAAMC,OAAOG,aACrFN,EAAMR,YAGfiB,QAASV,EACJC,CAAAA,GAAAA,KAAAA,GACDT,EAAQU,EAAA,CACNP,MAAOM,EAAME,MAAMC,OAAO,yBAC1BR,gBAAiBK,EAAMK,QAAUL,EAAME,MAAMC,OAAOG,YAAcN,EAAME,MAAMC,OAAO,wBACrFP,YAAaI,EAAMQ,OAASR,EAAME,MAAMC,OAAO,oBAAsBH,EAAME,MAAMC,OAAOG,aACrFN,EAAMR,aAKV,IAAMkB,EAAOC,EAAOC,KACxBC,WAA8B,CAC7BC,kBAAmB3B,IAEpB4B,MAAsF,CACrFC,uBAAwB,CAACC,EAAMC,KAAe,CAC5CC,SAA0B,iBAATF,EAAoBA,EAAUA,GAAAA,OAAAA,GAAOC,OAAAA,GACtDE,MAAO,MACPC,OAAQ,UARGR,WAAA,CAAAS,YAAA,wBAAGX,CAAH,CAAA,GAAA,IAAA,IAAA,IAAA,IAAA,KAWZX,GAAD,gNAAAP,OAQiBO,EAAMuB,OAAS,MAAQvB,EAAMwB,aAE5CxB,WAAAA,OAAAA,EAAMyB,MAAQzB,EAAMK,QAEQL,qCAAAA,OAAAA,EAAMyB,IAFlC,uIAOI,GAjBN,UAqBCzB,GAA4B,UAAjBA,EAAM0B,OAAqB7B,EAAaY,QAAUZ,EAAaC,UAE1EE,GAAUA,EAAMN,QAAUM,EAAMK,SAAgCsB,qBAAAA,OAAAA,EAAS3B,EAAMN,MAAOM,GAlC1E,MAoCb4B,EACAC"}
1
+ {"version":3,"file":"style.js","sources":["../../../../src/components/Avatar/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport { getColor } from 'mixins/color'\nimport type { StyledAvatarProps, AvatarPalette } from './types'\n\nconst shouldForwardAvatarProp = createShouldForwardProp(\n (propKey) => !['src', 'shadow', 'square', 'loading'].includes(propKey)\n)\n\nconst template = (palette: AvatarPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n filter: drop-shadow(0 6px 10px ${palette.shadowColor});\n`\n\nconst COLOR_SCHEMA = {\n default: css<StyledAvatarProps>`\n ${(props) =>\n template({\n color: props.theme.colors.white,\n backgroundColor: props.loading ? props.theme.colors.transparent : props.theme.colors.mercury,\n shadowColor: props.shadow ? props.theme.colors['bg-oncolor-hover'] : props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n primary: css<StyledAvatarProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-brand-primary'],\n backgroundColor: props.loading ? props.theme.colors.transparent : props.theme.colors['bg-brand-primary-100'],\n shadowColor: props.shadow ? props.theme.colors['bg-oncolor-hover'] : props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n}\n\nexport const Root = styled.span\n .withConfig<StyledAvatarProps>({\n shouldForwardProp: shouldForwardAvatarProp,\n })\n .attrs<StyledAvatarProps>(\n (props): Required<Pick<StyledAvatarProps, 'dynamicSizeDeclaration'>> => ({\n dynamicSizeDeclaration: (size, sizeUnits) => ({\n fontSize: typeof size === 'string' ? size : `${size}${sizeUnits}`,\n borderRadius: props.square ? '0.2em' : '50%',\n width: '1em',\n height: '1em',\n }),\n })\n )`\n ${(props) => `\n box-sizing: border-box;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n vertical-align: middle;\n flex-shrink: 0;\n cursor: default;\n ${\n props.src && !props.loading\n ? `\n background-image: url(${props.src});\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover; \n `\n : ''\n }\n `}\n\n ${(props) => (props.preset === 'brand' ? COLOR_SCHEMA.primary : COLOR_SCHEMA.default)}\n\n ${(props) => props.color && !props.loading && `background-color: ${getColor(props.color, props)};`}\n\n ${responsiveSize}\n ${responsiveMargin}\n`\n"],"names":["shouldForwardAvatarProp","createShouldForwardProp","propKey","includes","template","palette","concat","color","backgroundColor","shadowColor","COLOR_SCHEMA","default","css","props","_objectSpread","theme","colors","white","loading","transparent","mercury","shadow","primary","Root","styled","span","withConfig","shouldForwardProp","attrs","dynamicSizeDeclaration","size","sizeUnits","fontSize","borderRadius","square","width","height","componentId","src","preset","getColor","responsiveSize","responsiveMargin"],"mappings":"4VAOA,IAAMA,EAA0BC,GAC7BC,IAAa,CAAC,MAAO,SAAU,SAAU,WAAWC,SAASD,KAGhE,IAAME,EAAYC,GAAD,cAAAC,OACND,EAAQE,MACGF,2BAAAA,OAAAA,EAAQG,gBAFb,wCAAAF,OAGkBD,EAAQI,YAH3C,QAMA,IAAMC,EAAe,CACnBC,QAASC,EACJC,CAAAA,GAAAA,KAAAA,GACDT,EAAQU,EAAA,CACNP,MAAOM,EAAME,MAAMC,OAAOC,MAC1BT,gBAAiBK,EAAMK,QAAUL,EAAME,MAAMC,OAAOG,YAAcN,EAAME,MAAMC,OAAOI,QACrFX,YAAaI,EAAMQ,OAASR,EAAME,MAAMC,OAAO,oBAAsBH,EAAME,MAAMC,OAAOG,aACrFN,EAAMR,YAGfiB,QAASV,EACJC,CAAAA,GAAAA,KAAAA,GACDT,EAAQU,EAAA,CACNP,MAAOM,EAAME,MAAMC,OAAO,yBAC1BR,gBAAiBK,EAAMK,QAAUL,EAAME,MAAMC,OAAOG,YAAcN,EAAME,MAAMC,OAAO,wBACrFP,YAAaI,EAAMQ,OAASR,EAAME,MAAMC,OAAO,oBAAsBH,EAAME,MAAMC,OAAOG,aACrFN,EAAMR,aAKV,IAAMkB,EAAOC,EAAOC,KACxBC,WAA8B,CAC7BC,kBAAmB3B,IAEpB4B,OACEf,KACCgB,uBAAwB,CAACC,EAAMC,KAAAA,CAC7BC,SAA0B,iBAATF,EAAoBA,EAAUA,GAAAA,OAAAA,GAAOC,OAAAA,GACtDE,aAAcpB,EAAMqB,OAAS,QAAU,MACvCC,MAAO,MACPC,OAAQ,YAVCV,WAAA,CAAAW,YAAA,wBAAGb,CAcfX,CAAAA,GAAAA,IAAAA,IAAAA,IAAAA,IAAAA,KAAAA,GASCA,iMAAAA,OAAAA,EAAMyB,MAAQzB,EAAMK,QAApB,qCAAAZ,OAE4BO,EAAMyB,IAFlC,uIAOI,GAhBN,UAoBCzB,GAA4B,UAAjBA,EAAM0B,OAAqB7B,EAAaY,QAAUZ,EAAaC,UAE1EE,GAAUA,EAAMN,QAAUM,EAAMK,SAAgCsB,qBAAAA,OAAAA,EAAS3B,EAAMN,MAAOM,GAA5E,MAEX4B,EACAC"}
@@ -0,0 +1,2 @@
1
+ import r from'@babel/runtime/helpers/objectSpread2';import i from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as o}from'react';import{withMergedProps as t}from'../../hocs/withMergedProps.js';import{Text as e}from'../Text/Text.js';import{Icon as s}from'../Icon/Icon.js';import'../Icon/icons.js';import{Avatar as a}from'../Avatar/Avatar.js';import{Indicator as n}from'../Indicator/Indicator.js';import{IconButton as p}from'../IconButton/IconButton.js';import{SIZES as c}from'./constants.js';import{Root as d,Content as m}from'./style.js';import{jsx as l,jsxs as z,Fragment as f}from'react/jsx-runtime';var h=["size","textProps","captionProps","iconProps","avatarProps","indicatorProps","discardButtonProps","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","children","text","caption","icon"];var v=t(o(((o,t)=>{var{size:c="m",textProps:v={},captionProps:P={},iconProps:u={},avatarProps:b={},indicatorProps:j={},discardButtonProps:x={},sizeXXS:y,sizeXS:S,sizeS:X,sizeM:I,sizeL:g,sizeXL:B,children:C,text:L,caption:A,icon:M}=o,k=i(o,h);var w='div';var T;k.onClick&&(w='button'),x.onClick&&(w='div'),'button'===w&&(T='button'),k.type&&(T=k.type);var H={size:c,sizeXXS:y,sizeXS:S,sizeS:X,sizeM:I,sizeL:g,sizeXL:B};var[R,q]=Array.isArray(M)?M:[M];var E={as:'span',appearance:'body',size:'inherit',color:'inherit',lineHeight:A?1.3:1};var F={as:'span',appearance:'body',size:.75,sizeUnits:'em',color:'inherit',lineHeight:1};var N={icon:'close',square:!0,disabled:k.disabled};return l(d,r(r(r({},k),H),{},{as:w,type:T,ref:t,children:'function'==typeof C?C({textProps:E,captionProps:F,discardButtonProps:N}):z(f,{children:[R&&l(s,r({preset:"brand",name:'string'==typeof R?R:void 0,icon:'string'!=typeof R?R:void 0},u)),(b.src||b.text)&&l(a,r(r({},H),{},{preset:"brand"},b)),z(m,{children:[l(e,r(r(r({},E),v),{},{children:null!=C?C:L})),A&&l(e,r(r(r({},F),P),{},{children:A}))]}),(j.children||j.text)&&l(n,r(r({},H),j)),q&&l(s,r({preset:"brand",name:'string'==typeof q?q:void 0,icon:'string'!=typeof q?q:void 0},u)),x.onClick&&l(p,r(r(r({},H),N),x))]})}))})),{displayName:'Chip',sizes:c});export{v as Chip};
2
+ //# sourceMappingURL=Chip.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Chip.js","sources":["../../../../src/components/Chip/Chip.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Avatar } from 'components/Avatar'\nimport { Indicator } from 'components/Indicator'\nimport { IconButton } from 'components/IconButton'\nimport type { TextProps } from 'components/Text'\nimport type { IconButtonProps } from 'components/IconButton'\nimport { SIZES } from './constants'\nimport * as Styled from './style'\nimport type { ChipProps } from './types'\n\nconst COMPONENT_NAME = 'Chip'\n\n/**\n *\n * Component accepts all root HTML attributes.\n *\n * Responsive \"size\", \"margin\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [ChipProps](https://github.com/foxford/ui/blob/master/src/components/Chip/types.ts)\n */\nconst Chip: React.ForwardRefExoticComponent<ChipProps> = withMergedProps<ChipProps>(\n forwardRef((props, ref) => {\n const {\n size = 'm',\n textProps = {},\n captionProps = {},\n iconProps = {},\n avatarProps = {},\n indicatorProps = {},\n discardButtonProps = {},\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n children,\n text,\n caption,\n icon,\n ...restProps\n } = props\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n let rootNode: any = 'div'\n\n if (restProps.onClick) rootNode = 'button'\n if (discardButtonProps.onClick) rootNode = 'div'\n\n let rootType: ChipProps['type']\n\n if (rootNode === 'button') rootType = 'button'\n if (restProps.type) rootType = restProps.type\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const [before, after] = Array.isArray(icon) ? icon : [icon]\n\n const textBaseProps: TextProps = {\n as: 'span',\n appearance: 'body',\n size: 'inherit',\n color: 'inherit',\n lineHeight: caption ? 1.3 : 1,\n }\n\n const captionBaseProps: TextProps = {\n as: 'span',\n appearance: 'body',\n size: 0.75,\n sizeUnits: 'em',\n color: 'inherit',\n lineHeight: 1,\n }\n\n const discardButtonBaseProps: IconButtonProps = {\n icon: 'close',\n square: true,\n disabled: restProps.disabled,\n }\n\n return (\n <Styled.Root {...restProps} {...sizeProps} as={rootNode} type={rootType} ref={ref}>\n {typeof children === 'function' ? (\n children({\n textProps: textBaseProps,\n captionProps: captionBaseProps,\n discardButtonProps: discardButtonBaseProps,\n })\n ) : (\n <>\n {before && (\n <Icon\n preset='brand'\n name={typeof before === 'string' ? before : undefined}\n icon={typeof before !== 'string' ? before : undefined}\n {...iconProps}\n />\n )}\n {(avatarProps.src || avatarProps.text) && <Avatar {...sizeProps} preset='brand' {...avatarProps} />}\n <Styled.Content>\n <Text {...textBaseProps} {...textProps}>\n {children ?? text}\n </Text>\n {caption && (\n <Text {...captionBaseProps} {...captionProps}>\n {caption}\n </Text>\n )}\n </Styled.Content>\n {(indicatorProps.children || indicatorProps.text) && <Indicator {...sizeProps} {...indicatorProps} />}\n {after && (\n <Icon\n preset='brand'\n name={typeof after === 'string' ? after : undefined}\n icon={typeof after !== 'string' ? after : undefined}\n {...iconProps}\n />\n )}\n {discardButtonProps.onClick && (\n <IconButton {...sizeProps} {...discardButtonBaseProps} {...discardButtonProps} />\n )}\n </>\n )}\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { Chip }\n"],"names":["Chip","withMergedProps","forwardRef","props","ref","size","textProps","captionProps","iconProps","avatarProps","indicatorProps","discardButtonProps","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","children","text","caption","icon","restProps","_objectWithoutProperties","_excluded","rootNode","rootType","onClick","type","sizeProps","before","after","Array","isArray","textBaseProps","as","appearance","color","lineHeight","captionBaseProps","sizeUnits","discardButtonBaseProps","square","disabled","_jsx","Styled.Root","_jsxs","_Fragment","Icon","_objectSpread","preset","name","undefined","src","Avatar","Styled.Content","Text","Indicator","IconButton","displayName","sizes","SIZES"],"mappings":"+yBAyBMA,IAAAA,EAAmDC,EACvDC,GAAW,CAACC,EAAOC,KACjB,IAAMC,KACJA,EAAO,IADHC,UAEJA,EAAY,GAFRC,aAGJA,EAAe,GAHXC,UAIJA,EAAY,GAJRC,YAKJA,EAAc,GALVC,eAMJA,EAAiB,GANbC,mBAOJA,EAAqB,GAPjBC,QAQJA,EARIC,OASJA,EATIC,MAUJA,EAVIC,MAWJA,EAXIC,MAYJA,EAZIC,OAaJA,EAbIC,SAcJA,EAdIC,KAeJA,EAfIC,QAgBJA,EAhBIC,KAiBJA,GAEElB,EADCmB,EAlBLC,EAmBIpB,EAnBJqB,GAsBA,IAAIC,EAAgB,MAKpB,IAAIC,EAHAJ,EAAUK,UAASF,EAAW,UAC9Bd,EAAmBgB,UAASF,EAAW,OAI1B,WAAbA,IAAuBC,EAAW,UAClCJ,EAAUM,OAAMF,EAAWJ,EAAUM,MAEzC,IAAMC,EAAY,CAChBxB,KAAAA,EACAO,QAAAA,EACAC,OAAAA,EACAC,MAAAA,EACAC,MAAAA,EACAC,MAAAA,EACAC,OAAAA,GAGF,IAAOa,EAAQC,GAASC,MAAMC,QAAQZ,GAAQA,EAAO,CAACA,GAEtD,IAAMa,EAA2B,CAC/BC,GAAI,OACJC,WAAY,OACZ/B,KAAM,UACNgC,MAAO,UACPC,WAAYlB,EAAU,IAAM,GAG9B,IAAMmB,EAA8B,CAClCJ,GAAI,OACJC,WAAY,OACZ/B,KAAM,IACNmC,UAAW,KACXH,MAAO,UACPC,WAAY,GAGd,IAAMG,EAA0C,CAC9CpB,KAAM,QACNqB,UACAC,SAAUrB,EAAUqB,UAGtB,OACEC,EAACC,EAAgBvB,EAAAA,EAAAA,EAAAA,GAAAA,GAAeO,GAAhC,GAAA,CAA2CM,GAAIV,EAAUG,KAAMF,EAAUtB,IAAKA,EAA9Ec,SACuB,mBAAbA,EACNA,EAAS,CACPZ,UAAW4B,EACX3B,aAAcgC,EACd5B,mBAAoB8B,IAGtBK,EAAAC,EAAA,CAAA7B,SACGY,CAAAA,GACCc,EAACI,EAADC,EAAA,CACEC,OAAO,QACPC,KAAwB,iBAAXrB,EAAsBA,OAASsB,EAC5C/B,KAAwB,iBAAXS,EAAsBA,OAASsB,GACxC5C,KAGNC,EAAY4C,KAAO5C,EAAYU,OAASyB,EAACU,SAAWzB,GAAZ,GAAA,CAAuBqB,OAAO,SAAYzC,IACpFqC,EAACS,EAAD,CAAArC,SAAA,CACE0B,EAACY,EAAStB,EAAAA,EAAAA,EAAAA,GAAAA,GAAmB5B,GAA7B,GAAA,CAAAY,SACGA,MAAAA,EAAAA,EAAYC,KAEdC,GACCwB,EAACY,EAASjB,EAAAA,EAAAA,EAAAA,GAAAA,GAAsBhC,GAAhC,GAAA,CAAAW,SACGE,SAILV,EAAeQ,UAAYR,EAAeS,OAASyB,EAACa,EAADR,EAAAA,EAAA,GAAepB,GAAenB,IAClFqB,GACCa,EAACI,EAADC,EAAA,CACEC,OAAO,QACPC,KAAuB,iBAAVpB,EAAqBA,OAAAA,EAClCV,KAAuB,iBAAVU,EAAqBA,OAAAA,GAC9BvB,IAGPG,EAAmBgB,SAClBiB,EAACc,WAAe7B,GAAeY,GAA4B9B,aAOvE,CACEgD,YAhImB,OAiInBC,MAAOC"}
@@ -0,0 +1,2 @@
1
+ var i={xxxl:{fontSize:18,minHeight:40,padding:8,borderRadius:8},xxl:{fontSize:18,minHeight:40,padding:8,borderRadius:8},xl:{fontSize:18,minHeight:40,padding:8,borderRadius:8},l:{fontSize:18,minHeight:40,padding:8,borderRadius:8},m:{fontSize:16,minHeight:36,padding:7,borderRadius:8},s:{fontSize:14,minHeight:32,padding:6,borderRadius:7},xs:{fontSize:12,minHeight:20,padding:4,borderRadius:4},xxs:{fontSize:12,minHeight:20,padding:4,borderRadius:4},xxxs:{fontSize:12,minHeight:20,padding:4,borderRadius:4}};export{i as SIZES};
2
+ //# sourceMappingURL=constants.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"constants.js","sources":["../../../../src/components/Chip/constants.ts"],"sourcesContent":["import type { Sizes } from 'shared/types'\n\nexport const SIZES: Sizes = {\n xxxl: {\n fontSize: 18,\n minHeight: 40,\n padding: 8,\n borderRadius: 8,\n },\n xxl: {\n fontSize: 18,\n minHeight: 40,\n padding: 8,\n borderRadius: 8,\n },\n xl: {\n fontSize: 18,\n minHeight: 40,\n padding: 8,\n borderRadius: 8,\n },\n l: {\n fontSize: 18,\n minHeight: 40,\n padding: 8,\n borderRadius: 8,\n },\n m: {\n fontSize: 16,\n minHeight: 36,\n padding: 7,\n borderRadius: 8,\n },\n s: {\n fontSize: 14,\n minHeight: 32,\n padding: 6,\n borderRadius: 7,\n },\n xs: {\n fontSize: 12,\n minHeight: 20,\n padding: 4,\n borderRadius: 4,\n },\n xxs: {\n fontSize: 12,\n minHeight: 20,\n padding: 4,\n borderRadius: 4,\n },\n xxxs: {\n fontSize: 12,\n minHeight: 20,\n padding: 4,\n borderRadius: 4,\n },\n}\n"],"names":["SIZES","xxxl","fontSize","minHeight","padding","borderRadius","xxl","xl","l","m","s","xs","xxs","xxxs"],"mappings":"AAEO,IAAMA,EAAe,CAC1BC,KAAM,CACJC,SAAU,GACVC,UAAW,GACXC,QAAS,EACTC,aAAc,GAEhBC,IAAK,CACHJ,SAAU,GACVC,UAAW,GACXC,QAAS,EACTC,aAAc,GAEhBE,GAAI,CACFL,SAAU,GACVC,UAAW,GACXC,QAAS,EACTC,aAAc,GAEhBG,EAAG,CACDN,SAAU,GACVC,UAAW,GACXC,QAAS,EACTC,aAAc,GAEhBI,EAAG,CACDP,SAAU,GACVC,UAAW,GACXC,QAAS,EACTC,aAAc,GAEhBK,EAAG,CACDR,SAAU,GACVC,UAAW,GACXC,QAAS,EACTC,aAAc,GAEhBM,GAAI,CACFT,SAAU,GACVC,UAAW,GACXC,QAAS,EACTC,aAAc,GAEhBO,IAAK,CACHV,SAAU,GACVC,UAAW,GACXC,QAAS,EACTC,aAAc,GAEhBQ,KAAM,CACJX,SAAU,GACVC,UAAW,GACXC,QAAS,EACTC,aAAc"}
@@ -0,0 +1,2 @@
1
+ import o from'@babel/runtime/helpers/objectSpread2';import r,{css as e}from'styled-components';import t from'tinycolor2';import{createShouldForwardProp as l}from'../../shared/utils/style.js';import{responsiveSize as n}from'../../mixins/responsive-size.js';import{responsiveMargin as a}from'../../mixins/responsive-margin.js';import{focus as c}from'../../mixins/focus.js';var s=l((o=>!['outline','black','active'].includes(o)));var i=o=>"\n color: ".concat(o.color,";\n background-color: ").concat(o.backgroundColor,";\n border-color: ").concat(o.borderColor,";\n &:hover {\n color: ").concat(o.colorHover,";\n background-color: ").concat(o.backgroundColorHover,";\n border-color: ").concat(o.borderColorHover,";\n }\n &:disabled {\n color: ").concat(o.colorDisabled,";\n background-color: ").concat(o.backgroundColorDisabled,";\n border-color: ").concat(o.borderColorDisabled,";\n }\n");var d={default:{primary:{default:e(["",""],(r=>i(o({color:r.active?r.theme.colors['content-oncolor-primary']:r.theme.colors['content-onmain-primary'],backgroundColor:r.active?r.theme.colors['bg-brand-primary-500']:r.theme.colors['bg-brand-primary-100'],borderColor:r.theme.colors.transparent,colorHover:r.active?r.theme.colors['content-oncolor-primary']:r.theme.colors['content-onmain-primary'],backgroundColorHover:r.active?t(r.theme.colors['bg-brand-primary-500']).lighten(5).toString():t(r.theme.colors['bg-brand-primary-100']).darken(5).toString(),borderColorHover:r.theme.colors.transparent,colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.active?r.theme.colors['bg-disabled-small']:r.theme.colors['bg-disabled-large'],borderColorDisabled:r.theme.colors.transparent},r.palette)))),black:e(["",""],(r=>i(o({color:r.active?r.theme.colors['content-oncolor-primary']:r.theme.colors['content-onmain-primary'],backgroundColor:r.active?r.theme.colors['bg-onmain-contrast']:r.theme.colors['bg-onmain-tertiary'],borderColor:r.theme.colors.transparent,colorHover:r.active?r.theme.colors['content-oncolor-primary']:r.theme.colors['content-onmain-primary'],backgroundColorHover:r.active?t(r.theme.colors['bg-onmain-contrast']).lighten(11).toString():t(r.theme.colors['bg-onmain-tertiary']).darken(11).toString(),borderColorHover:r.theme.colors.transparent,colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.active?r.theme.colors['bg-disabled-small']:r.theme.colors['bg-disabled-large'],borderColorDisabled:r.theme.colors.transparent},r.palette))))},secondary:{default:e(["",""],(r=>i(o({color:r.active?r.theme.colors['content-brand-primary']:r.theme.colors['content-onmain-primary'],backgroundColor:r.theme.colors['bg-brand-primary-100'],borderColor:r.active?r.theme.colors['bg-brand-primary-500']:r.theme.colors['bg-brand-primary-400'],colorHover:r.active?r.theme.colors['content-brand-primary']:r.theme.colors['content-onmain-primary'],backgroundColorHover:r.active?t(r.theme.colors['bg-brand-primary-100']).lighten(2).toString():t(r.theme.colors['bg-brand-primary-100']).darken(5).toString(),borderColorHover:r.active?r.theme.colors['bg-brand-primary-500']:r.theme.colors['bg-brand-primary-400'],colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.theme.colors['bg-disabled-large'],borderColorDisabled:r.theme.colors['border-disabled']},r.palette)))),black:e(["",""],(r=>i(o({color:r.theme.colors['content-onmain-primary'],backgroundColor:r.active?r.theme.colors['bg-onmain-secondary']:r.theme.colors['bg-onmain-tertiary'],borderColor:r.active?r.theme.colors['border-onmain-contrast']:r.theme.colors['border-onmain-default-large'],colorHover:r.theme.colors['content-onmain-primary'],backgroundColorHover:r.active?t(r.theme.colors['bg-onmain-secondary']).lighten(11).toString():t(r.theme.colors['bg-onmain-tertiary']).darken(11).toString(),borderColorHover:r.active?r.theme.colors['border-onmain-contrast']:r.theme.colors['border-onmain-default-large'],colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.theme.colors['bg-disabled-large'],borderColorDisabled:r.theme.colors['border-disabled']},r.palette))))},outline:{default:e(["",""],(r=>i(o({color:r.active?r.theme.colors['content-oncolor-primary']:r.theme.colors['content-onmain-primary'],backgroundColor:r.active?r.theme.colors['bg-brand-primary-500']:r.theme.colors.transparent,borderColor:r.active?r.theme.colors.transparent:r.theme.colors['border-onmain-default-large'],colorHover:r.active?r.theme.colors['content-oncolor-primary']:r.theme.colors['content-onmain-primary'],backgroundColorHover:r.active?t(r.theme.colors['bg-brand-primary-500']).lighten(5).toString():r.theme.colors['content-oncolor-hover'],borderColorHover:r.active?r.theme.colors.transparent:r.theme.colors['border-onmain-default-large'],colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.active?r.theme.colors['bg-disabled-small']:r.theme.colors.transparent,borderColorDisabled:r.active?r.theme.colors.transparent:r.theme.colors['border-disabled']},r.palette)))),black:e(["",""],(r=>i(o({color:r.active?r.theme.colors['content-oncolor-primary']:r.theme.colors['content-onmain-primary'],backgroundColor:r.active?r.theme.colors['bg-onmain-contrast']:r.theme.colors.transparent,borderColor:r.active?r.theme.colors.transparent:r.theme.colors['border-onmain-default-large'],colorHover:r.active?r.theme.colors['content-oncolor-primary']:r.theme.colors['content-onmain-primary'],backgroundColorHover:r.active?t(r.theme.colors['bg-onmain-contrast']).lighten(11).toString():r.theme.colors['content-oncolor-hover'],borderColorHover:r.active?r.theme.colors.transparent:r.theme.colors['border-onmain-default-large'],colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.active?r.theme.colors['bg-disabled-small']:r.theme.colors.transparent,borderColorDisabled:r.active?r.theme.colors.transparent:r.theme.colors['border-disabled']},r.palette))))}},contrast:{primary:{default:e(["",""],(r=>i(o({color:r.theme.colors['content-onmain-primary'],backgroundColor:r.active?r.theme.colors['bg-oncolor-primary']:r.theme.colors['bg-brand-primary-100'],borderColor:r.theme.colors.transparent,colorHover:r.theme.colors['content-onmain-primary'],backgroundColorHover:r.active?t(r.theme.colors['bg-oncolor-primary']).darken(11).toString():t(r.theme.colors['bg-brand-primary-100']).darken(5).toString(),borderColorHover:r.theme.colors.transparent,colorDisabled:r.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:r.theme.colors['bg-oncolor-disabled'],borderColorDisabled:r.theme.colors.transparent},r.palette)))),black:e(["",""],(r=>i(o({color:r.active?r.theme.colors['content-oncolor-constant']:r.theme.colors['content-oncolor-primary'],backgroundColor:r.active?r.theme.colors['bg-oncolor-primary']:r.theme.colors['bg-oncolor-tertiary'],borderColor:r.theme.colors.transparent,colorHover:r.active?r.theme.colors['content-oncolor-constant']:r.theme.colors['content-oncolor-primary'],backgroundColorHover:r.active?t(r.theme.colors['bg-oncolor-primary']).darken(11).toString():t(r.theme.colors['bg-oncolor-tertiary']).setAlpha(.3).toString(),borderColorHover:r.theme.colors.transparent,colorDisabled:r.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:r.theme.colors['bg-oncolor-disabled'],borderColorDisabled:r.theme.colors.transparent},r.palette))))},secondary:{default:e(["",""],(r=>i(o({color:r.theme.colors['content-oncolor-primary'],backgroundColor:r.active?r.theme.colors['bg-oncolor-secondary']:r.theme.colors['bg-oncolor-tertiary'],borderColor:r.active?r.theme.colors['border-oncolor-default']:r.theme.colors['border-oncolor-default-large'],colorHover:r.theme.colors['content-oncolor-primary'],backgroundColorHover:r.active?t(r.theme.colors['bg-oncolor-secondary']).setAlpha(.5).toString():t(r.theme.colors['bg-oncolor-tertiary']).setAlpha(.3).toString(),borderColorHover:r.active?r.theme.colors['border-oncolor-default']:r.theme.colors['border-oncolor-default-large'],colorDisabled:r.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:r.theme.colors['bg-oncolor-disabled'],borderColorDisabled:r.theme.colors['border-oncolor-disabled']},r.palette)))),black:e(["",""],(r=>i(o({color:r.theme.colors['content-oncolor-primary'],backgroundColor:r.active?r.theme.colors['bg-oncolor-secondary']:r.theme.colors['bg-oncolor-tertiary'],borderColor:r.active?r.theme.colors['border-oncolor-default']:r.theme.colors['border-oncolor-default-large'],colorHover:r.theme.colors['content-oncolor-primary'],backgroundColorHover:r.active?t(r.theme.colors['bg-oncolor-secondary']).setAlpha(.5).toString():t(r.theme.colors['bg-oncolor-tertiary']).setAlpha(.3).toString(),borderColorHover:r.active?r.theme.colors['border-oncolor-default']:r.theme.colors['border-oncolor-default-large'],colorDisabled:r.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:r.theme.colors['bg-oncolor-disabled'],borderColorDisabled:r.theme.colors['border-oncolor-disabled']},r.palette))))},outline:{default:e(["",""],(r=>i(o({color:r.active?r.theme.colors['content-oncolor-constant']:r.theme.colors['content-oncolor-primary'],backgroundColor:r.active?r.theme.colors['bg-oncolor-primary']:r.theme.colors.transparent,borderColor:r.active?r.theme.colors.transparent:r.theme.colors['border-oncolor-default'],colorHover:r.active?r.theme.colors['content-oncolor-constant']:r.theme.colors['content-oncolor-primary'],backgroundColorHover:r.active?t(r.theme.colors['bg-oncolor-primary']).darken(11).toString():r.theme.colors['content-onmain-hover'],borderColorHover:r.active?r.theme.colors.transparent:r.theme.colors['border-oncolor-default'],colorDisabled:r.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:r.active?r.theme.colors['bg-oncolor-disabled']:r.theme.colors.transparent,borderColorDisabled:r.active?r.theme.colors.transparent:r.theme.colors['border-oncolor-disabled']},r.palette)))),black:e(["",""],(r=>i(o({color:r.active?r.theme.colors['content-oncolor-constant']:r.theme.colors['content-oncolor-primary'],backgroundColor:r.active?r.theme.colors['bg-oncolor-primary']:r.theme.colors.transparent,borderColor:r.active?r.theme.colors.transparent:r.theme.colors['border-oncolor-default'],colorHover:r.active?r.theme.colors['content-oncolor-constant']:r.theme.colors['content-oncolor-primary'],backgroundColorHover:r.active?t(r.theme.colors['bg-oncolor-primary']).darken(11).toString():r.theme.colors['content-onmain-hover'],borderColorHover:r.active?r.theme.colors.transparent:r.theme.colors['border-oncolor-default'],colorDisabled:r.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:r.active?r.theme.colors['bg-oncolor-disabled']:r.theme.colors.transparent,borderColorDisabled:r.active?r.theme.colors.transparent:r.theme.colors['border-oncolor-disabled']},r.palette))))}}};var m=r.div.withConfig({shouldForwardProp:s}).attrs({dynamicSizeDeclaration:(o,r)=>({fontSize:'string'==typeof o?o:"".concat(o).concat(r),padding:'0.4em',borderRadius:'0.2em'})}).withConfig({componentId:"fox-ui__sc-ndhge9-0"})([""," "," "," "," ",""],(o=>{var r='default';return'button'===o.as&&(r='pointer'),'button'===o.as&&o.disabled&&(r='not-allowed'),"\n box-sizing: border-box;\n appearance: none;\n padding: 0;\n margin: 0;\n display: inline-flex;\n align-items: center;\n border: 1px solid transparent;\n width: max-content;\n flex-shrink: 0;\n cursor: ".concat(r,";\n transition-property: background-color;\n transition-duration: 250ms;\n\n & > *:not(:last-child) {\n margin-right: 6px;\n }\n\n & > *:only-child {\n margin-right: 0.4em;\n margin-left: 0.4em;\n }\n ")}),(o=>{var r=o.contrast?d.contrast:d.default;var e=r.primary;return o.secondary&&(e=r.secondary),o.outline&&(e=r.outline),o.black?e.black:e.default}),c,n,a);var b=r.span.withConfig({componentId:"fox-ui__sc-ndhge9-1"})(["box-sizing:border-box;display:flex;flex-direction:column;flex-grow:1;text-align:start;"]);export{b as Content,m as Root};
2
+ //# sourceMappingURL=style.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"style.js","sources":["../../../../src/components/Chip/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport { focus } from 'mixins/focus'\nimport type { CSSColor } from 'shared/types'\nimport type { StyledChipProps, ChipPalette } from './types'\n\nconst shouldForwardChipProp = createShouldForwardProp((propKey) => !['outline', 'black', 'active'].includes(propKey))\n\nconst template = (palette: ChipPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n border-color: ${palette.borderColor};\n &:hover {\n color: ${palette.colorHover};\n background-color: ${palette.backgroundColorHover};\n border-color: ${palette.borderColorHover};\n }\n &:disabled {\n color: ${palette.colorDisabled};\n background-color: ${palette.backgroundColorDisabled};\n border-color: ${palette.borderColorDisabled};\n }\n`\n\nconst COLOR_SCHEMA = {\n default: {\n primary: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-brand-primary-500']\n : props.theme.colors['bg-brand-primary-100'],\n borderColor: props.theme.colors.transparent,\n colorHover: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(5).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-brand-primary-100']).darken(5).toString() as CSSColor),\n borderColorHover: props.theme.colors.transparent,\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-disabled-small']\n : props.theme.colors['bg-disabled-large'],\n borderColorDisabled: props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-onmain-contrast']\n : props.theme.colors['bg-onmain-tertiary'],\n borderColor: props.theme.colors.transparent,\n colorHover: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-onmain-contrast']).lighten(11).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-onmain-tertiary']).darken(11).toString() as CSSColor),\n borderColorHover: props.theme.colors.transparent,\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-disabled-small']\n : props.theme.colors['bg-disabled-large'],\n borderColorDisabled: props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n },\n secondary: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-brand-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-brand-primary-100'],\n borderColor: props.active\n ? props.theme.colors['bg-brand-primary-500']\n : props.theme.colors['bg-brand-primary-400'],\n colorHover: props.active\n ? props.theme.colors['content-brand-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-brand-primary-100']).lighten(2).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-brand-primary-100']).darken(5).toString() as CSSColor),\n borderColorHover: props.active\n ? props.theme.colors['bg-brand-primary-500']\n : props.theme.colors['bg-brand-primary-400'],\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n borderColorDisabled: props.theme.colors['border-disabled'],\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-onmain-secondary']\n : props.theme.colors['bg-onmain-tertiary'],\n borderColor: props.active\n ? props.theme.colors['border-onmain-contrast']\n : props.theme.colors['border-onmain-default-large'],\n colorHover: props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-onmain-secondary']).lighten(11).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-onmain-tertiary']).darken(11).toString() as CSSColor),\n borderColorHover: props.active\n ? props.theme.colors['border-onmain-contrast']\n : props.theme.colors['border-onmain-default-large'],\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n borderColorDisabled: props.theme.colors['border-disabled'],\n ...props.palette,\n })}\n `,\n },\n outline: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active ? props.theme.colors['bg-brand-primary-500'] : props.theme.colors.transparent,\n borderColor: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-onmain-default-large'],\n colorHover: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(5).toString() as CSSColor)\n : props.theme.colors['content-oncolor-hover'],\n borderColorHover: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-onmain-default-large'],\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-disabled-small']\n : props.theme.colors.transparent,\n borderColorDisabled: props.active ? props.theme.colors.transparent : props.theme.colors['border-disabled'],\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active ? props.theme.colors['bg-onmain-contrast'] : props.theme.colors.transparent,\n borderColor: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-onmain-default-large'],\n colorHover: props.active\n ? props.theme.colors['content-oncolor-primary']\n : props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-onmain-contrast']).lighten(11).toString() as CSSColor)\n : props.theme.colors['content-oncolor-hover'],\n borderColorHover: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-onmain-default-large'],\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-disabled-small']\n : props.theme.colors.transparent,\n borderColorDisabled: props.active ? props.theme.colors.transparent : props.theme.colors['border-disabled'],\n ...props.palette,\n })}\n `,\n },\n },\n contrast: {\n primary: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-oncolor-primary']\n : props.theme.colors['bg-brand-primary-100'],\n borderColor: props.theme.colors.transparent,\n colorHover: props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-primary']).darken(11).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-brand-primary-100']).darken(5).toString() as CSSColor),\n borderColorHover: props.theme.colors.transparent,\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n borderColorDisabled: props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-oncolor-primary']\n : props.theme.colors['bg-oncolor-tertiary'],\n borderColor: props.theme.colors.transparent,\n colorHover: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-primary']).darken(11).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-oncolor-tertiary']).setAlpha(0.3).toString() as CSSColor),\n borderColorHover: props.theme.colors.transparent,\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n borderColorDisabled: props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n },\n secondary: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-oncolor-secondary']\n : props.theme.colors['bg-oncolor-tertiary'],\n borderColor: props.active\n ? props.theme.colors['border-oncolor-default']\n : props.theme.colors['border-oncolor-default-large'],\n colorHover: props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-secondary']).setAlpha(0.5).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-oncolor-tertiary']).setAlpha(0.3).toString() as CSSColor),\n borderColorHover: props.active\n ? props.theme.colors['border-oncolor-default']\n : props.theme.colors['border-oncolor-default-large'],\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n borderColorDisabled: props.theme.colors['border-oncolor-disabled'],\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active\n ? props.theme.colors['bg-oncolor-secondary']\n : props.theme.colors['bg-oncolor-tertiary'],\n borderColor: props.active\n ? props.theme.colors['border-oncolor-default']\n : props.theme.colors['border-oncolor-default-large'],\n colorHover: props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-secondary']).setAlpha(0.5).toString() as CSSColor)\n : (tinycolor(props.theme.colors['bg-oncolor-tertiary']).setAlpha(0.3).toString() as CSSColor),\n borderColorHover: props.active\n ? props.theme.colors['border-oncolor-default']\n : props.theme.colors['border-oncolor-default-large'],\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n borderColorDisabled: props.theme.colors['border-oncolor-disabled'],\n ...props.palette,\n })}\n `,\n },\n outline: {\n default: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active ? props.theme.colors['bg-oncolor-primary'] : props.theme.colors.transparent,\n borderColor: props.active ? props.theme.colors.transparent : props.theme.colors['border-oncolor-default'],\n colorHover: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-primary']).darken(11).toString() as CSSColor)\n : props.theme.colors['content-onmain-hover'],\n borderColorHover: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-oncolor-default'],\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-oncolor-disabled']\n : props.theme.colors.transparent,\n borderColorDisabled: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-oncolor-disabled'],\n ...props.palette,\n })}\n `,\n black: css<StyledChipProps>`\n ${(props) =>\n template({\n color: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.active ? props.theme.colors['bg-oncolor-primary'] : props.theme.colors.transparent,\n borderColor: props.active ? props.theme.colors.transparent : props.theme.colors['border-oncolor-default'],\n colorHover: props.active\n ? props.theme.colors['content-oncolor-constant']\n : props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.active\n ? (tinycolor(props.theme.colors['bg-oncolor-primary']).darken(11).toString() as CSSColor)\n : props.theme.colors['content-onmain-hover'],\n borderColorHover: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-oncolor-default'],\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.active\n ? props.theme.colors['bg-oncolor-disabled']\n : props.theme.colors.transparent,\n borderColorDisabled: props.active\n ? props.theme.colors.transparent\n : props.theme.colors['border-oncolor-disabled'],\n ...props.palette,\n })}\n `,\n },\n },\n}\n\nexport const Root = styled.div\n .withConfig<StyledChipProps>({\n shouldForwardProp: shouldForwardChipProp,\n })\n .attrs<StyledChipProps>(<Required<Pick<StyledChipProps, 'dynamicSizeDeclaration'>>>{\n dynamicSizeDeclaration: (size, sizeUnits) => ({\n fontSize: typeof size === 'string' ? size : `${size}${sizeUnits}`,\n padding: '0.4em',\n borderRadius: '0.2em',\n }),\n })`\n ${(props) => {\n let cursor = 'default'\n\n if (props.as === 'button') cursor = 'pointer'\n if (props.as === 'button' && props.disabled) cursor = 'not-allowed'\n\n return `\n box-sizing: border-box;\n appearance: none;\n padding: 0;\n margin: 0;\n display: inline-flex;\n align-items: center;\n border: 1px solid transparent;\n width: max-content;\n flex-shrink: 0;\n cursor: ${cursor};\n transition-property: background-color;\n transition-duration: 250ms;\n\n & > *:not(:last-child) {\n margin-right: 6px;\n }\n\n & > *:only-child {\n margin-right: 0.4em;\n margin-left: 0.4em;\n }\n `\n }}\n\n ${(props) => {\n const schema = props.contrast ? COLOR_SCHEMA.contrast : COLOR_SCHEMA.default\n\n let schemaVariant = schema.primary\n\n if (props.secondary) schemaVariant = schema.secondary\n if (props.outline) schemaVariant = schema.outline\n\n return props.black ? schemaVariant.black : schemaVariant.default\n }}\n\n ${focus}\n ${responsiveSize}\n ${responsiveMargin}\n`\n\nexport const Content = styled.span`\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n text-align: start;\n`\n"],"names":["shouldForwardChipProp","createShouldForwardProp","propKey","includes","template","palette","color","concat","backgroundColor","borderColor","colorHover","backgroundColorHover","borderColorHover","colorDisabled","backgroundColorDisabled","borderColorDisabled","COLOR_SCHEMA","default","primary","css","props","_objectSpread","active","theme","colors","transparent","tinycolor","lighten","toString","darken","black","secondary","outline","contrast","setAlpha","Root","styled","div","withConfig","shouldForwardProp","attrs","dynamicSizeDeclaration","size","sizeUnits","fontSize","padding","borderRadius","componentId","cursor","as","disabled","schema","schemaVariant","focus","responsiveSize","responsiveMargin","Content","span"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ import o from'@babel/runtime/helpers/objectSpread2';import r from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as t}from'react';import{withMergedProps as e}from'../../hocs/withMergedProps.js';import{Icon as s}from'../Icon/Icon.js';import'../Icon/icons.js';import{SIZES_SQUARE as i,SIZES as n}from'./constants.js';import{Root as p}from'./style.js';import{jsx as a}from'react/jsx-runtime';var m=["size","type","iconProps","icon"];var c=e(t(((t,e)=>{var{size:i="m",type:n="button",iconProps:c={},icon:f}=t,d=r(t,m);return a(p,o(o({},d),{},{size:i,type:n,ref:e,children:a(s,o({preset:"brand",name:'string'==typeof f?f:void 0,icon:'string'!=typeof f?f:void 0},c))}))})),{displayName:'IconButton',sizes:o=>o.square?i:n});export{c as IconButton};
2
+ //# sourceMappingURL=IconButton.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"IconButton.js","sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { SIZES, SIZES_SQUARE } from './constants'\nimport * as Styled from './style'\nimport type { IconButtonProps } from './types'\n\nconst COMPONENT_NAME = 'IconButton'\n\n/**\n *\n * Component accepts all \\<button\\> attributes.\n *\n * Responsive \"size\", \"margin\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [IconButtonProps](https://github.com/foxford/ui/blob/master/src/components/IconButton/types.ts)\n */\nconst IconButton: React.ForwardRefExoticComponent<IconButtonProps> = withMergedProps<\n IconButtonProps,\n HTMLButtonElement\n>(\n forwardRef((props, ref) => {\n const { size = 'm', type = 'button', iconProps = {}, icon, ...restProps } = props\n\n return (\n <Styled.Root {...restProps} size={size} type={type} ref={ref}>\n <Icon\n preset='brand'\n name={typeof icon === 'string' ? icon : undefined}\n icon={typeof icon !== 'string' ? icon : undefined}\n {...iconProps}\n />\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => (props.square ? SIZES_SQUARE : SIZES),\n }\n)\n\nexport { IconButton }\n"],"names":["IconButton","withMergedProps","forwardRef","props","ref","size","type","iconProps","icon","restProps","_excluded","_jsx","Styled.Root","children","Icon","_objectSpread","preset","name","displayName","sizes","square","SIZES_SQUARE","SIZES"],"mappings":"icAmBMA,IAAAA,EAA+DC,EAInEC,GAAW,CAACC,EAAOC,KACjB,IAAMC,KAAEA,EAAO,IAATC,KAAcA,EAAO,SAArBC,UAA+BA,EAAY,GAA3CC,KAA+CA,GAAuBL,EAAdM,IAAcN,EAA5EO,GAEA,OACEC,EAACC,SAAgBH,GAAjB,GAAA,CAA4BJ,KAAMA,EAAMC,KAAMA,EAAMF,IAAKA,EAAzDS,SACEF,EAACG,EAADC,EAAA,CACEC,OAAO,QACPC,KAAsB,iBAATT,EAAoBA,SACjCA,KAAsB,iBAATA,EAAoBA,OAAAA,GAC7BD,UAKZ,CACEW,YA/BmB,aAgCnBC,MAAQhB,GAAWA,EAAMiB,OAASC,EAAeC"}
@@ -0,0 +1,2 @@
1
+ var i={xxxl:{width:40,height:40,fontSize:28,borderRadius:'50%'},xxl:{width:40,height:40,fontSize:28,borderRadius:'50%'},xl:{width:32,height:32,fontSize:24,borderRadius:'50%'},l:{width:28,height:28,fontSize:20,borderRadius:'50%'},m:{width:22,height:22,fontSize:18,borderRadius:'50%'},s:{width:20,height:20,fontSize:16,borderRadius:'50%'},xs:{width:18,height:18,fontSize:14,borderRadius:'50%'},xxs:{width:16,height:16,fontSize:12,borderRadius:'50%'},xxxs:{width:16,height:16,fontSize:12,borderRadius:'50%'}};var e={xxxl:{width:40,height:40,fontSize:28,borderRadius:8},xxl:{width:40,height:40,fontSize:28,borderRadius:8},xl:{width:32,height:32,fontSize:24,borderRadius:7},l:{width:28,height:28,fontSize:20,borderRadius:6},m:{width:22,height:22,fontSize:18,borderRadius:5},s:{width:20,height:20,fontSize:16,borderRadius:4},xs:{width:18,height:18,fontSize:14,borderRadius:4},xxs:{width:16,height:16,fontSize:12,borderRadius:4},xxxs:{width:16,height:16,fontSize:12,borderRadius:4}};export{i as SIZES,e as SIZES_SQUARE};
2
+ //# sourceMappingURL=constants.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"constants.js","sources":["../../../../src/components/IconButton/constants.ts"],"sourcesContent":["import type { Sizes } from 'shared/types'\n\nexport const SIZES: Sizes = {\n xxxl: {\n width: 40,\n height: 40,\n fontSize: 28,\n borderRadius: '50%',\n },\n xxl: {\n width: 40,\n height: 40,\n fontSize: 28,\n borderRadius: '50%',\n },\n xl: {\n width: 32,\n height: 32,\n fontSize: 24,\n borderRadius: '50%',\n },\n l: {\n width: 28,\n height: 28,\n fontSize: 20,\n borderRadius: '50%',\n },\n m: {\n width: 22,\n height: 22,\n fontSize: 18,\n borderRadius: '50%',\n },\n s: {\n width: 20,\n height: 20,\n fontSize: 16,\n borderRadius: '50%',\n },\n xs: {\n width: 18,\n height: 18,\n fontSize: 14,\n borderRadius: '50%',\n },\n xxs: {\n width: 16,\n height: 16,\n fontSize: 12,\n borderRadius: '50%',\n },\n xxxs: {\n width: 16,\n height: 16,\n fontSize: 12,\n borderRadius: '50%',\n },\n}\n\nexport const SIZES_SQUARE = {\n xxxl: {\n width: 40,\n height: 40,\n fontSize: 28,\n borderRadius: 8,\n },\n xxl: {\n width: 40,\n height: 40,\n fontSize: 28,\n borderRadius: 8,\n },\n xl: {\n width: 32,\n height: 32,\n fontSize: 24,\n borderRadius: 7,\n },\n l: {\n width: 28,\n height: 28,\n fontSize: 20,\n borderRadius: 6,\n },\n m: {\n width: 22,\n height: 22,\n fontSize: 18,\n borderRadius: 5,\n },\n s: {\n width: 20,\n height: 20,\n fontSize: 16,\n borderRadius: 4,\n },\n xs: {\n width: 18,\n height: 18,\n fontSize: 14,\n borderRadius: 4,\n },\n xxs: {\n width: 16,\n height: 16,\n fontSize: 12,\n borderRadius: 4,\n },\n xxxs: {\n width: 16,\n height: 16,\n fontSize: 12,\n borderRadius: 4,\n },\n}\n"],"names":["SIZES","xxxl","width","height","fontSize","borderRadius","xxl","xl","l","m","s","xs","xxs","xxxs","SIZES_SQUARE"],"mappings":"AAEO,IAAMA,EAAe,CAC1BC,KAAM,CACJC,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBC,IAAK,CACHJ,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBE,GAAI,CACFL,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBG,EAAG,CACDN,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBI,EAAG,CACDP,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBK,EAAG,CACDR,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBM,GAAI,CACFT,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBO,IAAK,CACHV,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,OAEhBQ,KAAM,CACJX,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,QAIX,IAAMS,EAAe,CAC1Bb,KAAM,CACJC,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,GAEhBC,IAAK,CACHJ,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,GAEhBE,GAAI,CACFL,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,GAEhBG,EAAG,CACDN,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,GAEhBI,EAAG,CACDP,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,GAEhBK,EAAG,CACDR,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,GAEhBM,GAAI,CACFT,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,GAEhBO,IAAK,CACHV,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc,GAEhBQ,KAAM,CACJX,MAAO,GACPC,OAAQ,GACRC,SAAU,GACVC,aAAc"}
@@ -0,0 +1,2 @@
1
+ import o from'@babel/runtime/helpers/objectSpread2';import r,{css as e}from'styled-components';import n from'tinycolor2';import{responsiveSize as t}from'../../mixins/responsive-size.js';import{responsiveMargin as c}from'../../mixins/responsive-margin.js';import{focus as a}from'../../mixins/focus.js';import{createShouldForwardProp as l}from'../../shared/utils/style.js';var i=l((o=>!['square'].includes(o)));var s=o=>"\n color: ".concat(o.color,";\n background-color: ").concat(o.backgroundColor,";\n &:hover {\n color: ").concat(o.colorHover,";\n background-color: ").concat(o.backgroundColorHover,";\n }\n &:active {\n color: ").concat(o.colorActive,";\n background-color: ").concat(o.backgroundColorActive,";\n }\n &:disabled {\n color: ").concat(o.colorDisabled,";\n background-color: ").concat(o.backgroundColorDisabled,";\n }\n");var d={default:{primary:e(["",""],(r=>s(o({color:r.theme.colors['content-onmain-tertiary'],backgroundColor:r.theme.colors.transparent,colorHover:r.theme.colors['content-onmain-primary'],backgroundColorHover:r.theme.colors['bg-oncolor-hover'],colorActive:r.theme.colors['content-onmain-primary'],backgroundColorActive:n(r.theme.colors['bg-oncolor-hover']).setAlpha(.12).toString(),colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.theme.colors.transparent},r.palette)))),secondary:e(["",""],(r=>s(o({color:r.theme.colors['content-onmain-primary'],backgroundColor:r.theme.colors['bg-brand-primary-100'],colorHover:r.theme.colors['content-onmain-primary'],backgroundColorHover:n(r.theme.colors['bg-brand-primary-100']).darken(5).toString(),colorActive:r.theme.colors['content-onmain-primary'],backgroundColorActive:n(r.theme.colors['bg-brand-primary-100']).darken(7).toString(),colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.theme.colors['bg-disabled-large']},r.palette))))},contrast:{primary:e(["",""],(r=>s(o({color:r.theme.colors['content-oncolor-tertiary'],backgroundColor:r.theme.colors.transparent,colorHover:r.theme.colors['content-oncolor-primary'],backgroundColorHover:r.theme.colors['bg-oncontrast-hover'],colorActive:r.theme.colors['content-oncolor-primary'],backgroundColorActive:n(r.theme.colors['bg-oncontrast-hover']).setAlpha(.12).toString(),colorDisabled:r.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:r.theme.colors.transparent},r.palette)))),secondary:e(["",""],(r=>s(o({color:r.theme.colors['content-onmain-inverse'],backgroundColor:r.theme.colors['bg-contrast-active'],colorHover:r.theme.colors['content-onmain-inverse'],backgroundColorHover:n(r.theme.colors['bg-contrast-active']).lighten(7).toString(),colorActive:r.theme.colors['content-onmain-inverse'],backgroundColorActive:n(r.theme.colors['bg-contrast-active']).lighten(11).toString(),colorDisabled:r.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:r.theme.colors['bg-oncolor-disabled']},r.palette))))}};var m=r.button.withConfig({shouldForwardProp:i}).attrs((o=>({dynamicSizeDeclaration:(r,e)=>({width:'1em',height:'1em',fontSize:'string'==typeof r?r:"".concat(r).concat(e),borderRadius:o.square?'0.2em':'50%'})}))).withConfig({componentId:"fox-ui__sc-y4pwgp-0"})([""," "," "," "," ",""],(o=>"\n box-sizing: border-box;\n appearance: none;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n padding: 0;\n margin: 0;\n border: none;\n cursor: ".concat(o.disabled?'not-allowed':'pointer',";\n transition-property: background-color; \n transition-duration: 250ms;\n ")),(o=>{var r=o.contrast?d.contrast:d.default;return o.secondary?r.secondary:r.primary}),a,t,c);export{m as Root};
2
+ //# sourceMappingURL=style.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"style.js","sources":["../../../../src/components/IconButton/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport { focus } from 'mixins/focus'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport type { CSSColor } from 'shared/types'\nimport type { IconButtonPalette, StyledIconButtonProps } from './types'\n\nconst shouldForwardIconButtonProp = createShouldForwardProp((propKey) => !['square'].includes(propKey))\n\nconst template = (palette: IconButtonPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n &:hover {\n color: ${palette.colorHover};\n background-color: ${palette.backgroundColorHover};\n }\n &:active {\n color: ${palette.colorActive};\n background-color: ${palette.backgroundColorActive};\n }\n &:disabled {\n color: ${palette.colorDisabled};\n background-color: ${palette.backgroundColorDisabled};\n }\n`\n\nconst COLOR_SCHEMA = {\n default: {\n primary: css<StyledIconButtonProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-tertiary'],\n backgroundColor: props.theme.colors.transparent,\n colorHover: props.theme.colors['content-onmain-primary'],\n backgroundColorHover: props.theme.colors['bg-oncolor-hover'],\n colorActive: props.theme.colors['content-onmain-primary'],\n backgroundColorActive: tinycolor(props.theme.colors['bg-oncolor-hover'])\n .setAlpha(0.12)\n .toString() as CSSColor,\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n secondary: css<StyledIconButtonProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-brand-primary-100'],\n colorHover: props.theme.colors['content-onmain-primary'],\n backgroundColorHover: tinycolor(props.theme.colors['bg-brand-primary-100']).darken(5).toString() as CSSColor,\n colorActive: props.theme.colors['content-onmain-primary'],\n backgroundColorActive: tinycolor(props.theme.colors['bg-brand-primary-100']).darken(7).toString() as CSSColor,\n colorDisabled: props.theme.colors['content-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n ...props.palette,\n })}\n `,\n },\n contrast: {\n primary: css<StyledIconButtonProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-oncolor-tertiary'],\n backgroundColor: props.theme.colors.transparent,\n colorHover: props.theme.colors['content-oncolor-primary'],\n backgroundColorHover: props.theme.colors['bg-oncontrast-hover'],\n colorActive: props.theme.colors['content-oncolor-primary'],\n backgroundColorActive: tinycolor(props.theme.colors['bg-oncontrast-hover'])\n .setAlpha(0.12)\n .toString() as CSSColor,\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.theme.colors.transparent,\n ...props.palette,\n })}\n `,\n secondary: css<StyledIconButtonProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-inverse'],\n backgroundColor: props.theme.colors['bg-contrast-active'],\n colorHover: props.theme.colors['content-onmain-inverse'],\n backgroundColorHover: tinycolor(props.theme.colors['bg-contrast-active']).lighten(7).toString() as CSSColor,\n colorActive: props.theme.colors['content-onmain-inverse'],\n backgroundColorActive: tinycolor(props.theme.colors['bg-contrast-active']).lighten(11).toString() as CSSColor,\n colorDisabled: props.theme.colors['content-oncolor-disabled'],\n backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n ...props.palette,\n })}\n `,\n },\n}\n\nexport const Root = styled.button\n .withConfig<StyledIconButtonProps>({\n shouldForwardProp: shouldForwardIconButtonProp,\n })\n .attrs<StyledIconButtonProps>(\n (props): Required<Pick<StyledIconButtonProps, 'dynamicSizeDeclaration'>> => ({\n dynamicSizeDeclaration: (size, sizeUnits) => ({\n width: '1em',\n height: '1em',\n fontSize: typeof size === 'string' ? size : `${size}${sizeUnits}`,\n borderRadius: props.square ? '0.2em' : '50%',\n }),\n })\n )`\n ${(props) => `\n box-sizing: border-box;\n appearance: none;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n padding: 0;\n margin: 0;\n border: none;\n cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n transition-property: background-color; \n transition-duration: 250ms;\n `}\n\n ${(props) => {\n const schema = props.contrast ? COLOR_SCHEMA.contrast : COLOR_SCHEMA.default\n\n if (props.secondary) return schema.secondary\n\n return schema.primary\n }}\n\n ${focus}\n ${responsiveSize}\n ${responsiveMargin}\n`\n"],"names":["shouldForwardIconButtonProp","createShouldForwardProp","propKey","includes","template","palette","concat","color","backgroundColor","colorHover","backgroundColorHover","colorActive","backgroundColorActive","colorDisabled","backgroundColorDisabled","COLOR_SCHEMA","default","primary","css","props","_objectSpread","theme","colors","transparent","tinycolor","setAlpha","toString","secondary","darken","contrast","lighten","Root","styled","button","withConfig","shouldForwardProp","attrs","dynamicSizeDeclaration","size","sizeUnits","width","height","fontSize","borderRadius","square","componentId","disabled","schema","focus","responsiveSize","responsiveMargin"],"mappings":"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"}
package/dts/index.d.ts CHANGED
@@ -244,6 +244,7 @@ declare enum BaseColorNames {
244
244
  'border-focus' = "border-focus",
245
245
  'border-oncolor-disabled' = "border-oncolor-disabled",
246
246
  'border-oncolor-default' = "border-oncolor-default",
247
+ 'border-oncolor-default-large' = "border-oncolor-default-large",
247
248
  'bg-onmain-main' = "bg-onmain-main",
248
249
  'bg-onmain-primary' = "bg-onmain-primary",
249
250
  'bg-onmain-secondary' = "bg-onmain-secondary",
@@ -466,6 +467,7 @@ declare const ColorNames: {
466
467
  'border-focus': (typeof BaseColorNames)["border-focus"];
467
468
  'border-oncolor-disabled': (typeof BaseColorNames)["border-oncolor-disabled"];
468
469
  'border-oncolor-default': (typeof BaseColorNames)["border-oncolor-default"];
470
+ 'border-oncolor-default-large': (typeof BaseColorNames)["border-oncolor-default-large"];
469
471
  'bg-onmain-main': (typeof BaseColorNames)["bg-onmain-main"];
470
472
  'bg-onmain-primary': (typeof BaseColorNames)["bg-onmain-primary"];
471
473
  'bg-onmain-secondary': (typeof BaseColorNames)["bg-onmain-secondary"];
@@ -2244,8 +2246,6 @@ ColorProperty<'color'>, Omit<React.ComponentPropsWithRef<'span'>, 'color'> {
2244
2246
  src?: string;
2245
2247
  /** Apply shadow styles */
2246
2248
  shadow?: boolean;
2247
- /** Root border-radius */
2248
- borderRadius?: string | number;
2249
2249
  /** Shape variant */
2250
2250
  square?: boolean;
2251
2251
  /** Loading appearance */
@@ -2260,10 +2260,113 @@ ColorProperty<'color'>, Omit<React.ComponentPropsWithRef<'span'>, 'color'> {
2260
2260
  *
2261
2261
  * Exposed "ref" attached to root node.
2262
2262
  *
2263
- * See full [AvatarProps](https://github.com/foxford/ui/blob/master/src/components/AvatarProps/types.ts)
2263
+ * See full [AvatarProps](https://github.com/foxford/ui/blob/master/src/components/Avatar/types.ts)
2264
2264
  */
2265
2265
  declare const Avatar: React.ForwardRefExoticComponent<AvatarProps>;
2266
2266
 
2267
+ declare type IconButtonPalette = {
2268
+ color: CSSColor;
2269
+ backgroundColor: CSSColor;
2270
+ colorHover: CSSColor;
2271
+ backgroundColorHover: CSSColor;
2272
+ colorActive: CSSColor;
2273
+ backgroundColorActive: CSSColor;
2274
+ colorDisabled: CSSColor;
2275
+ backgroundColorDisabled: CSSColor;
2276
+ };
2277
+ interface IconButtonProps extends ResponsiveSizeProps, ResponsiveMarginProps, Omit<React.ComponentPropsWithRef<'button'>, 'children'> {
2278
+ /** Custom colors */
2279
+ palette?: Partial<Record<keyof IconButtonPalette, Color>>;
2280
+ /** Icon to display */
2281
+ icon?: JSX.Element | IconName;
2282
+ /** Props for icon component */
2283
+ iconProps?: IconProps;
2284
+ /** Shape variant */
2285
+ square?: boolean;
2286
+ /** Appearance variant */
2287
+ primary?: boolean;
2288
+ /** Appearance variant */
2289
+ secondary?: boolean;
2290
+ /** Appearance variant */
2291
+ contrast?: boolean;
2292
+ }
2293
+
2294
+ /**
2295
+ *
2296
+ * Component accepts all \<button\> attributes.
2297
+ *
2298
+ * Responsive "size", "margin" props are supported.
2299
+ *
2300
+ * Exposed "ref" attached to root node.
2301
+ *
2302
+ * See full [IconButtonProps](https://github.com/foxford/ui/blob/master/src/components/IconButton/types.ts)
2303
+ */
2304
+ declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps>;
2305
+
2306
+ declare type ChipPalette = {
2307
+ color: CSSColor;
2308
+ backgroundColor: CSSColor;
2309
+ borderColor: CSSColor;
2310
+ colorHover: CSSColor;
2311
+ backgroundColorHover: CSSColor;
2312
+ borderColorHover: CSSColor;
2313
+ colorDisabled: CSSColor;
2314
+ backgroundColorDisabled: CSSColor;
2315
+ borderColorDisabled: CSSColor;
2316
+ };
2317
+ interface ChipProps extends ResponsiveSizeProps, ResponsiveMarginProps, React.RefAttributes<HTMLElement>, Omit<React.ButtonHTMLAttributes<HTMLElement>, 'children'> {
2318
+ /** Custom colors */
2319
+ palette?: Partial<Record<keyof ChipPalette, Color>>;
2320
+ /** Main text content or render function */
2321
+ children?: React.ReactNode | ((props: {
2322
+ textProps: TextProps;
2323
+ captionProps: TextProps;
2324
+ discardButtonProps: IconButtonProps;
2325
+ }) => React.ReactNode);
2326
+ /** Main text (alternative to children) */
2327
+ text?: React.ReactNode;
2328
+ /** Props for main text component */
2329
+ textProps?: TextProps;
2330
+ /** Additional text */
2331
+ caption?: React.ReactNode;
2332
+ /** Props for caption text component */
2333
+ captionProps?: TextProps;
2334
+ /** Icons before and after content */
2335
+ icon?: JSX.Element | IconName | [Nullable<JSX.Element | IconName>, Nullable<JSX.Element | IconName>];
2336
+ /** Props for icon components */
2337
+ iconProps?: IconProps;
2338
+ /** Props for avatar component */
2339
+ avatarProps?: AvatarProps;
2340
+ /** Props for indicator component */
2341
+ indicatorProps?: IndicatorProps;
2342
+ /** Props for button with 'close' icon */
2343
+ discardButtonProps?: IconButtonProps;
2344
+ /** Appearance variant */
2345
+ primary?: boolean;
2346
+ /** Appearance variant */
2347
+ secondary?: boolean;
2348
+ /** Appearance variant */
2349
+ outline?: boolean;
2350
+ /** Appearance variant */
2351
+ black?: boolean;
2352
+ /** Appearance variant */
2353
+ contrast?: boolean;
2354
+ /** Appearance variant */
2355
+ active?: boolean;
2356
+ }
2357
+
2358
+ /**
2359
+ *
2360
+ * Component accepts all root HTML attributes.
2361
+ *
2362
+ * Responsive "size", "margin" props are supported.
2363
+ *
2364
+ * Exposed "ref" attached to root node.
2365
+ *
2366
+ * See full [ChipProps](https://github.com/foxford/ui/blob/master/src/components/Chip/types.ts)
2367
+ */
2368
+ declare const Chip: React.ForwardRefExoticComponent<ChipProps>;
2369
+
2267
2370
  interface Theme {
2268
2371
  breakpoints: Readonly<Record<Lowercase<Breakpoint>, number>>;
2269
2372
  colors: Record<keyof typeof ColorNames, CSSColor>;
@@ -2286,25 +2389,27 @@ interface Theme {
2286
2389
  name: ThemeName;
2287
2390
  components?: {
2288
2391
  Alert?: AlertProps;
2392
+ Anchor?: AnchorProps;
2289
2393
  Arrow?: ArrowProps;
2394
+ ArrowBadge?: ArrowBadgeProps;
2395
+ Avatar?: AvatarProps;
2396
+ Badge?: BadgeProps;
2290
2397
  Button?: ButtonProps;
2291
2398
  Checkbox?: CheckboxProps;
2292
- Textarea?: TextareaProps;
2293
- Text?: TextProps;
2294
- ArrowBadge?: ArrowBadgeProps;
2295
- 'Text.Heading'?: TextHeadingProps;
2399
+ Chip?: ChipProps;
2400
+ IconButton?: IconButtonProps;
2401
+ Indicator?: IndicatorProps;
2402
+ ListItem?: ListItemProps;
2403
+ Popover?: PopoverProps;
2404
+ PopoverComponent?: PopoverComponentProps;
2405
+ Skeleton?: SkeletonProps;
2296
2406
  Switcher?: SwitcherProps;
2297
2407
  Tab?: TabProps;
2298
- Badge?: BadgeProps;
2299
- Anchor?: AnchorProps;
2300
- Skeleton?: SkeletonProps;
2408
+ Text?: TextProps;
2409
+ 'Text.Heading'?: TextHeadingProps;
2410
+ Textarea?: TextareaProps;
2301
2411
  Tooltip?: TooltipProps;
2302
2412
  TooltipComponent?: TooltipComponentProps;
2303
- Popover?: PopoverProps;
2304
- PopoverComponent?: PopoverComponentProps;
2305
- ListItem?: ListItemProps;
2306
- Indicator?: IndicatorProps;
2307
- Avatar?: AvatarProps;
2308
2413
  };
2309
2414
  }
2310
2415
 
@@ -3893,4 +3998,4 @@ interface FormLabelProps extends ResponsiveSizeProps, ResponsiveMarginProps, Rea
3893
3998
  */
3894
3999
  declare const FormLabel: React.ForwardRefExoticComponent<FormLabelProps>;
3895
4000
 
3896
- export { ActionBtn, Alert, Amount, Anchor, Arrow, ArrowBadge, Avatar, Badge, BaseProps, Breakpoint, Button, COUNTRY_DATA, CSSBorderStyle, CSSColor, CSSFontWeight, CSSGlobalValue, CSSUnit, CSSVerticalAlign, CURRENCY_MAP, Checkbox, Color, ColorNames, ColorPaletteKey, Container, ContextMenu, CurrencyCodes, DEFAULT_MASK, FormLabel, HEX, INITIAL_MASK, Icon, Indicator, Input, ListItem, Modal, Nullable, Paper, Popover, Progress, RGB, RGBA, Radio, withThemeScrollable as Scrollable, Section, Select, Separator, Size, Sizes, Skeleton, Spacer, Spinner, Switcher, Tab, Tabs, Tag, Text, Textarea, Theme, ThemeMode, ThemeName, ThemePreset, ThemeProvider, Tooltip, adultDarkTheme, adultLightTheme, babyDarkTheme, babyLightTheme, baseInputStyle, buildMediaQuery, color, defaultIcons, desktopFirst, hexToRgbA, isHex, mobileFirst, motherDarkTheme, motherLightTheme, property, responsiveNamedProperty, responsiveProperty, screenL, screenM, screenMaxL, screenMaxM, screenMaxS, screenMaxXl, screenMaxXs, screenMaxXxs, screenMinL, screenMinM, screenMinS, screenMinXl, screenMinXs, screenRetina, screenS, screenXl, screenXs, teenDarkTheme, teenLightTheme, defaultTheme as theme, vAlign };
4001
+ export { ActionBtn, Alert, Amount, Anchor, Arrow, ArrowBadge, Avatar, Badge, BaseProps, Breakpoint, Button, COUNTRY_DATA, CSSBorderStyle, CSSColor, CSSFontWeight, CSSGlobalValue, CSSUnit, CSSVerticalAlign, CURRENCY_MAP, Checkbox, Chip, Color, ColorNames, ColorPaletteKey, Container, ContextMenu, CurrencyCodes, DEFAULT_MASK, FormLabel, HEX, INITIAL_MASK, Icon, IconButton, Indicator, Input, ListItem, Modal, Nullable, Paper, Popover, Progress, RGB, RGBA, Radio, withThemeScrollable as Scrollable, Section, Select, Separator, Size, Sizes, Skeleton, Spacer, Spinner, Switcher, Tab, Tabs, Tag, Text, Textarea, Theme, ThemeMode, ThemeName, ThemePreset, ThemeProvider, Tooltip, adultDarkTheme, adultLightTheme, babyDarkTheme, babyLightTheme, baseInputStyle, buildMediaQuery, color, defaultIcons, desktopFirst, hexToRgbA, isHex, mobileFirst, motherDarkTheme, motherLightTheme, property, responsiveNamedProperty, responsiveProperty, screenL, screenM, screenMaxL, screenMaxM, screenMaxS, screenMaxXl, screenMaxXs, screenMaxXxs, screenMinL, screenMinM, screenMinS, screenMinXl, screenMinXs, screenRetina, screenS, screenXl, screenXs, teenDarkTheme, teenLightTheme, defaultTheme as theme, vAlign };