@foxford/ui 2.129.0 → 2.130.0

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
- 'use strict';var React=require('react');var styled=require('styled-components');var useClassname=require('../../hooks/useClassname.js');var misc=require('../../shared/utils/misc.js');var withMergedProps=require('../../hocs/withMergedProps.js');var hooks=require('./hooks.js');var sizes=require('./sizes.js');var sizesDefault=require('./sizes-default.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Text=require('../Text/Text.js');var Icon=require('../Icon/Icon.js');var index=require('../../icon-pack/src/icons/CheckFill/index.js');var index$1=require('../../icon-pack/src/icons/LoaderFill/index.js');const Button=withMergedProps.withMergedProps(React.forwardRef((e,s)=>{let{size:t="m",inline:n=!0,rounded:i=!0,color:r="accent",fontColor:o="white",showContentOnStatus:a,textProps:c={},iconProps:l={},leftIconProps:u={},rightIconProps:d={},textSizes:x={},iconSizes:m={},as:p,sizeXXS:j,sizeXS:S,sizeS:z,sizeM:h,sizeL:I,sizeXL:f,className:R,children:y,content:E,fontWeight:v,icon:g,innerRef:C,..._}=e;const q=styled.useTheme();_.preset!=='default'||typeof t!='string'||_.round||(_={...sizesDefault.PROPS_BY_SIZE[t]??{},..._}),_.href&&(p='a'),_.to&&(p=q.link),_.disabled&&(p='button'),_.primary&&(r='primary'),_.secondary&&(r='atlantis');const N=useClassname.useClassname("Button",R);const P=useClassname.useClassname("Button");const T=hooks.useComputedRel(q,_);const D=hooks.useComputedLinkProps(p,_);let[Z,k]=Array.isArray(g)?g:[g];const L={size:t,sizeXXS:j,sizeXS:S,sizeS:z,sizeM:h,sizeL:I,sizeXL:f};const X={...L,as:'span',color:'inherit',weight:v??(_.preset==='brand'?800:600),lineHeight:_.preset==='brand'?1.2:1,sizes:misc.deepmerge(_.preset==='brand'?sizes.SIZES_TEXT:sizesDefault.SIZES_TEXT_DEFAULT,x)};const b={...L,color:'inherit',preset:_.preset,sizes:misc.deepmerge(sizes.SIZES_ICON,m)};const O=_.preset==='brand'&&_.success;const w=_.preset==='brand'&&_.loading;const B=typeof y!='function'&&(y||E)?jsxRuntime.jsx(Text.Text,{className:`${P}__content`,...X,...c,children:y||E}):null;return jsxRuntime.jsx(style.Root,{..._,...D,...L,inline:n,color:r,fontColor:o,rounded:i,rel:T,as:p,className:N,ref:s??C,children:typeof y=='function'?y({textProps:X,iconProps:b}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[O||w?jsxRuntime.jsxs(style.ContentWithStatus,{children:[O?jsxRuntime.jsx(Icon.Icon,{...b,...l,icon:jsxRuntime.jsx(index.CheckFill,{})}):jsxRuntime.jsx(style.IconAnimation,{children:jsxRuntime.jsx(Icon.Icon,{...b,...l,icon:jsxRuntime.jsx(index$1.LoaderFill,{})})}),a?B:null]}):null,jsxRuntime.jsxs(style.Content,{"aria-hidden":O||w,children:[Z?jsxRuntime.jsx(Icon.Icon,{className:"icon",name:typeof Z=='string'?Z:void 0,icon:typeof Z!='string'?Z:void 0,...b,...l,...u}):null,B,k?jsxRuntime.jsx(Icon.Icon,{className:"icon",name:typeof k=='string'?k:void 0,icon:typeof k!='string'?k:void 0,...b,...l,...d}):null]})]})})}),{displayName:"Button",sizes:e=>{let s=e.preset==='brand'?sizes.SIZES:sizesDefault.SIZES_DEFAULT;return e.round&&(s=e.preset==='brand'?sizes.SIZES_ROUND:sizesDefault.SIZES_ROUND_DEFAULT),s}});exports.SIZES=sizes.SIZES,exports.SIZES_ROUND=sizes.SIZES_ROUND,exports.Button=Button,exports.COMPONENT_NAME="Button";
1
+ 'use strict';var React=require('react');var styled=require('styled-components');var useClassname=require('../../hooks/useClassname.js');var misc=require('../../shared/utils/misc.js');var withMergedProps=require('../../hocs/withMergedProps.js');var hooks=require('./hooks.js');var sizes=require('./sizes.js');var sizesDefault=require('./sizes-default.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Slot=require('../Slot/Slot.js');var Text=require('../Text/Text.js');var Icon=require('../Icon/Icon.js');var index=require('../../icon-pack/src/icons/CheckFill/index.js');var index$1=require('../../icon-pack/src/icons/LoaderFill/index.js');const Button=withMergedProps.withMergedProps(React.forwardRef((e,s)=>{let{size:t="m",inline:n=!0,rounded:o=!0,color:i="accent",fontColor:r="white",showContentOnStatus:c,textProps:l={},iconProps:a={},leftIconProps:u={},rightIconProps:d={},textSizes:x={},iconSizes:p={},as:j,root:m,text:S,addonLeft:h,addonRight:R,successIcon:z,loadingIcon:f,sizeXXS:I,sizeXS:y,sizeS:g,sizeM:P,sizeL:v,sizeXL:E,className:k,children:C,content:b,fontWeight:q,icon:_,innerRef:N,...T}=e;const D=styled.useTheme();T.preset!=='default'||typeof t!='string'||T.round||(T={...sizesDefault.PROPS_BY_SIZE[t]??{},...T}),T.href&&(j='a'),T.to&&(j=D.link),T.disabled&&(j='button'),T.primary&&(i='primary'),T.secondary&&(i='atlantis');const L=useClassname.useClassname("Button",k);const Z=useClassname.useClassname("Button");const F=hooks.useComputedRel(D,T);const X=hooks.useComputedLinkProps(j,T);let[O,w]=Array.isArray(_)?_:[_];const B={size:t,sizeXXS:I,sizeXS:y,sizeS:g,sizeM:P,sizeL:v,sizeXL:E};const M={...B,as:'span',color:'inherit',weight:q??(T.preset==='brand'?800:600),lineHeight:T.preset==='brand'?1.2:1,sizes:misc.deepmerge(T.preset==='brand'?sizes.SIZES_TEXT:sizesDefault.SIZES_TEXT_DEFAULT,x)};const A={...B,color:'inherit',preset:T.preset,sizes:misc.deepmerge(sizes.SIZES_ICON,p)};const U={...A,icon:jsxRuntime.jsx(index.CheckFill,{})};const $={...A,icon:jsxRuntime.jsx(index$1.LoaderFill,{})};const W=T.preset==='brand'&&T.success;const H=T.preset==='brand'&&T.loading;const Y=jsxRuntime.jsx(Slot.Slot,{render:S,props:M,fallback:typeof C!='function'&&(C||b)?jsxRuntime.jsx(Text.Text,{className:`${Z}__content`,...M,...l,children:C||b}):null});return jsxRuntime.jsx(style.Root,{...T,...X,...B,inline:n,color:i,fontColor:r,rounded:o,rel:F,as:j,className:L,ref:s??N,children:jsxRuntime.jsx(Slot.Slot,{render:m,props:{textProps:M,iconProps:A,successIconProps:U,loadingIconProps:$},fallback:typeof C=='function'?jsxRuntime.jsx(jsxRuntime.Fragment,{children:C({textProps:M,iconProps:A})}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[W||H?jsxRuntime.jsxs(style.ContentWithStatus,{children:[jsxRuntime.jsx(Slot.Slot,W?{render:z,props:U,fallback:jsxRuntime.jsx(Icon.Icon,{...A,...a,icon:jsxRuntime.jsx(index.CheckFill,{})})}:{render:f,props:$,fallback:jsxRuntime.jsx(style.IconAnimation,{children:jsxRuntime.jsx(Icon.Icon,{...A,...a,icon:jsxRuntime.jsx(index$1.LoaderFill,{})})})}),c?Y:null]}):null,jsxRuntime.jsxs(style.Content,{"aria-hidden":W||H,children:[jsxRuntime.jsx(Slot.Slot,{render:h,props:{iconProps:A},fallback:O?jsxRuntime.jsx(Icon.Icon,{className:"icon",name:typeof O=='string'?O:void 0,icon:typeof O!='string'?O:void 0,...A,...a,...u}):null}),Y,jsxRuntime.jsx(Slot.Slot,{render:R,props:{iconProps:A},fallback:w?jsxRuntime.jsx(Icon.Icon,{className:"icon",name:typeof w=='string'?w:void 0,icon:typeof w!='string'?w:void 0,...A,...a,...d}):null})]})]})})})}),{displayName:"Button",sizes:e=>{let s=e.preset==='brand'?sizes.SIZES:sizesDefault.SIZES_DEFAULT;return e.round&&(s=e.preset==='brand'?sizes.SIZES_ROUND:sizesDefault.SIZES_ROUND_DEFAULT),s}});exports.SIZES=sizes.SIZES,exports.SIZES_ROUND=sizes.SIZES_ROUND,exports.Button=Button,exports.COMPONENT_NAME="Button";
2
2
  //# sourceMappingURL=Button.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["/* eslint-disable prefer-const */\nimport { forwardRef } from 'react'\nimport { useTheme } from 'styled-components'\nimport { CheckFill, LoaderFill } from '@foxford/icon-pack'\nimport { useClassname } from 'hooks/useClassname'\nimport { deepmerge } from 'shared/utils/misc'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { Text } from 'components/Text'\nimport type { IconProps } from 'components/Icon'\nimport type { TextProps } from 'components/Text'\nimport { useComputedRel, useComputedLinkProps } from './hooks'\nimport { SIZES, SIZES_ROUND, SIZES_ICON, SIZES_TEXT } from './sizes'\nimport { SIZES_DEFAULT, SIZES_ROUND_DEFAULT, PROPS_BY_SIZE, SIZES_TEXT_DEFAULT } from './sizes-default'\nimport type { ButtonProps, Size } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Button'\n\n/**\n *\n * Контрол многоцелевого назначения.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<button\\> элемента.\n */\nconst Button: React.ForwardRefExoticComponent<ButtonProps> = withMergedProps<ButtonProps, HTMLButtonElement>(\n forwardRef<HTMLButtonElement, MergedProps<ButtonProps>>((props, ref) => {\n let {\n size = 'm',\n inline = true,\n rounded = true,\n color = 'accent',\n fontColor = 'white',\n showContentOnStatus,\n textProps: textPropsProp = {},\n iconProps: iconPropsProp = {},\n leftIconProps = {},\n rightIconProps = {},\n textSizes = {},\n iconSizes = {},\n as: _as,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n className,\n children,\n content,\n fontWeight,\n icon,\n innerRef,\n ...restProps\n } = props\n\n const theme = useTheme()\n\n if (restProps.preset === 'default' && typeof size === 'string' && !restProps.round) {\n const propsBySize = PROPS_BY_SIZE[size as Size] ?? {}\n restProps = { ...propsBySize, ...restProps }\n }\n\n if (restProps.href) _as = 'a'\n if (restProps.to) _as = theme.link\n if (restProps.disabled) _as = 'button'\n\n if (restProps.primary) color = 'primary'\n if (restProps.secondary) color = 'atlantis'\n\n const rootClassName = useClassname(COMPONENT_NAME, className)\n const textClassName = useClassname(COMPONENT_NAME)\n const rel = useComputedRel(theme, restProps)\n const linkProps = useComputedLinkProps(_as, restProps)\n\n let [before, after] = Array.isArray(icon) ? icon : [icon]\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const textProps: TextProps = {\n ...sizeProps,\n as: 'span',\n color: 'inherit',\n weight: fontWeight ?? (restProps.preset === 'brand' ? 800 : 600),\n lineHeight: restProps.preset === 'brand' ? 1.2 : 1,\n sizes: deepmerge(restProps.preset === 'brand' ? SIZES_TEXT : SIZES_TEXT_DEFAULT, textSizes),\n }\n\n const iconProps: IconProps = {\n ...sizeProps,\n color: 'inherit',\n preset: restProps.preset,\n sizes: deepmerge(SIZES_ICON, iconSizes),\n }\n\n const success = restProps.preset === 'brand' && restProps.success\n const loading = restProps.preset === 'brand' && restProps.loading\n\n const mainContent =\n typeof children !== 'function' && (children || content) ? (\n <Text className={`${textClassName}__content`} {...textProps} {...textPropsProp}>\n {children || content}\n </Text>\n ) : null\n\n return (\n <Styled.Root\n {...restProps}\n {...linkProps}\n {...sizeProps}\n inline={inline}\n color={color}\n fontColor={fontColor}\n rounded={rounded}\n rel={rel}\n as={_as}\n className={rootClassName}\n ref={ref ?? innerRef}\n >\n {typeof children === 'function' ? (\n children({ textProps, iconProps })\n ) : (\n <>\n {success || loading ? (\n <Styled.ContentWithStatus>\n {success ? (\n <Icon {...iconProps} {...iconPropsProp} icon={<CheckFill />} />\n ) : (\n <Styled.IconAnimation>\n <Icon {...iconProps} {...iconPropsProp} icon={<LoaderFill />} />\n </Styled.IconAnimation>\n )}\n {showContentOnStatus ? mainContent : null}\n </Styled.ContentWithStatus>\n ) : null}\n <Styled.Content aria-hidden={success || loading}>\n {before ? (\n <Icon\n className='icon'\n name={typeof before === 'string' ? before : undefined}\n icon={typeof before !== 'string' ? before : undefined}\n {...iconProps}\n {...iconPropsProp}\n {...leftIconProps}\n />\n ) : null}\n {mainContent}\n {after ? (\n <Icon\n className='icon'\n name={typeof after === 'string' ? after : undefined}\n icon={typeof after !== 'string' ? after : undefined}\n {...iconProps}\n {...iconPropsProp}\n {...rightIconProps}\n />\n ) : null}\n </Styled.Content>\n </>\n )}\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => {\n let sizes = props.preset === 'brand' ? SIZES : SIZES_DEFAULT\n if (props.round) sizes = props.preset === 'brand' ? SIZES_ROUND : SIZES_ROUND_DEFAULT\n\n return sizes\n },\n }\n)\n\nexport { Button, COMPONENT_NAME, SIZES, SIZES_ROUND }\n\nexport type { ButtonProps }\n"],"names":["Button","withMergedProps","forwardRef","props","ref","size","inline","rounded","color","fontColor","showContentOnStatus","textProps","textPropsProp","iconProps","iconPropsProp","leftIconProps","rightIconProps","textSizes","iconSizes","as","_as","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","className","children","content","fontWeight","icon","innerRef","restProps","theme","useTheme","preset","round","PROPS_BY_SIZE","href","to","link","disabled","primary","secondary","rootClassName","useClassname","textClassName","rel","useComputedRel","linkProps","useComputedLinkProps","before","after","Array","isArray","sizeProps","weight","lineHeight","sizes","deepmerge","SIZES_TEXT","SIZES_TEXT_DEFAULT","SIZES_ICON","success","loading","mainContent","_jsx","Text","Styled","_jsxs","_Fragment","Icon","CheckFill","LoaderFill","name","undefined","displayName","SIZES","SIZES_DEFAULT","SIZES_ROUND","SIZES_ROUND_DEFAULT"],"mappings":"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"}
1
+ {"version":3,"file":"Button.js","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["/* eslint-disable prefer-const */\nimport { forwardRef } from 'react'\nimport { useTheme } from 'styled-components'\nimport { CheckFill, LoaderFill } from '@foxford/icon-pack'\nimport { useClassname } from 'hooks/useClassname'\nimport { deepmerge } from 'shared/utils/misc'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { Text } from 'components/Text'\nimport { Slot } from 'components/Slot'\nimport type { IconProps } from 'components/Icon'\nimport type { TextProps } from 'components/Text'\nimport { useComputedRel, useComputedLinkProps } from './hooks'\nimport { SIZES, SIZES_ROUND, SIZES_ICON, SIZES_TEXT } from './sizes'\nimport { SIZES_DEFAULT, SIZES_ROUND_DEFAULT, PROPS_BY_SIZE, SIZES_TEXT_DEFAULT } from './sizes-default'\nimport type { ButtonProps, Size } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Button'\n\n/**\n *\n * Контрол многоцелевого назначения.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<button\\> элемента.\n */\nconst Button: React.ForwardRefExoticComponent<ButtonProps> = withMergedProps<ButtonProps, HTMLButtonElement>(\n forwardRef<HTMLButtonElement, MergedProps<ButtonProps>>((props, ref) => {\n let {\n size = 'm',\n inline = true,\n rounded = true,\n color = 'accent',\n fontColor = 'white',\n showContentOnStatus,\n textProps: textPropsProp = {},\n iconProps: iconPropsProp = {},\n leftIconProps = {},\n rightIconProps = {},\n textSizes = {},\n iconSizes = {},\n as: _as,\n root,\n text,\n addonLeft,\n addonRight,\n successIcon,\n loadingIcon,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n className,\n children,\n content,\n fontWeight,\n icon,\n innerRef,\n ...restProps\n } = props\n\n const theme = useTheme()\n\n if (restProps.preset === 'default' && typeof size === 'string' && !restProps.round) {\n const propsBySize = PROPS_BY_SIZE[size as Size] ?? {}\n restProps = { ...propsBySize, ...restProps }\n }\n\n if (restProps.href) _as = 'a'\n if (restProps.to) _as = theme.link\n if (restProps.disabled) _as = 'button'\n\n if (restProps.primary) color = 'primary'\n if (restProps.secondary) color = 'atlantis'\n\n const rootClassName = useClassname(COMPONENT_NAME, className)\n const textClassName = useClassname(COMPONENT_NAME)\n const rel = useComputedRel(theme, restProps)\n const linkProps = useComputedLinkProps(_as, restProps)\n\n let [before, after] = Array.isArray(icon) ? icon : [icon]\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const textProps: TextProps = {\n ...sizeProps,\n as: 'span',\n color: 'inherit',\n weight: fontWeight ?? (restProps.preset === 'brand' ? 800 : 600),\n lineHeight: restProps.preset === 'brand' ? 1.2 : 1,\n sizes: deepmerge(restProps.preset === 'brand' ? SIZES_TEXT : SIZES_TEXT_DEFAULT, textSizes),\n }\n\n const iconProps: IconProps = {\n ...sizeProps,\n color: 'inherit',\n preset: restProps.preset,\n sizes: deepmerge(SIZES_ICON, iconSizes),\n }\n\n const successIconProps: IconProps = {\n ...iconProps,\n icon: <CheckFill />,\n }\n\n const loadingIconProps: IconProps = {\n ...iconProps,\n icon: <LoaderFill />,\n }\n\n const success = restProps.preset === 'brand' && restProps.success\n const loading = restProps.preset === 'brand' && restProps.loading\n\n const mainContent = (\n <Slot\n render={text}\n props={textProps}\n fallback={\n typeof children !== 'function' && (children || content) ? (\n <Text className={`${textClassName}__content`} {...textProps} {...textPropsProp}>\n {children || content}\n </Text>\n ) : null\n }\n />\n )\n\n return (\n <Styled.Root\n {...restProps}\n {...linkProps}\n {...sizeProps}\n inline={inline}\n color={color}\n fontColor={fontColor}\n rounded={rounded}\n rel={rel}\n as={_as}\n className={rootClassName}\n ref={ref ?? innerRef}\n >\n <Slot\n render={root}\n props={{\n textProps,\n iconProps,\n successIconProps,\n loadingIconProps,\n }}\n fallback={\n typeof children === 'function' ? (\n <>{children({ textProps, iconProps })}</>\n ) : (\n <>\n {success || loading ? (\n <Styled.ContentWithStatus>\n {success ? (\n <Slot\n render={successIcon}\n props={successIconProps}\n fallback={<Icon {...iconProps} {...iconPropsProp} icon={<CheckFill />} />}\n />\n ) : (\n <Slot\n render={loadingIcon}\n props={loadingIconProps}\n fallback={\n <Styled.IconAnimation>\n <Icon {...iconProps} {...iconPropsProp} icon={<LoaderFill />} />\n </Styled.IconAnimation>\n }\n />\n )}\n {showContentOnStatus ? mainContent : null}\n </Styled.ContentWithStatus>\n ) : null}\n <Styled.Content aria-hidden={success || loading}>\n <Slot\n render={addonLeft}\n props={{\n iconProps,\n }}\n fallback={\n before ? (\n <Icon\n className='icon'\n name={typeof before === 'string' ? before : undefined}\n icon={typeof before !== 'string' ? before : undefined}\n {...iconProps}\n {...iconPropsProp}\n {...leftIconProps}\n />\n ) : null\n }\n />\n {mainContent}\n <Slot\n render={addonRight}\n props={{\n iconProps,\n }}\n fallback={\n after ? (\n <Icon\n className='icon'\n name={typeof after === 'string' ? after : undefined}\n icon={typeof after !== 'string' ? after : undefined}\n {...iconProps}\n {...iconPropsProp}\n {...rightIconProps}\n />\n ) : null\n }\n />\n </Styled.Content>\n </>\n )\n }\n />\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => {\n let sizes = props.preset === 'brand' ? SIZES : SIZES_DEFAULT\n if (props.round) sizes = props.preset === 'brand' ? SIZES_ROUND : SIZES_ROUND_DEFAULT\n\n return sizes\n },\n }\n)\n\nexport { Button, COMPONENT_NAME, SIZES, SIZES_ROUND }\n\nexport type { ButtonProps }\n"],"names":["Button","withMergedProps","forwardRef","props","ref","size","inline","rounded","color","fontColor","showContentOnStatus","textProps","textPropsProp","iconProps","iconPropsProp","leftIconProps","rightIconProps","textSizes","iconSizes","as","_as","root","text","addonLeft","addonRight","successIcon","loadingIcon","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","className","children","content","fontWeight","icon","innerRef","restProps","theme","useTheme","preset","round","PROPS_BY_SIZE","href","to","link","disabled","primary","secondary","rootClassName","useClassname","textClassName","rel","useComputedRel","linkProps","useComputedLinkProps","before","after","Array","isArray","sizeProps","weight","lineHeight","sizes","deepmerge","SIZES_TEXT","SIZES_TEXT_DEFAULT","SIZES_ICON","successIconProps","_jsx","CheckFill","loadingIconProps","LoaderFill","success","loading","mainContent","Slot","render","fallback","Text","Styled","_Fragment","_jsxs","Icon","name","undefined","displayName","SIZES","SIZES_DEFAULT","SIZES_ROUND","SIZES_ROUND_DEFAULT"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{forwardRef}from'react';import{useTheme}from'styled-components';import{useClassname}from'../../hooks/useClassname.mjs';import{deepmerge}from'../../shared/utils/misc.mjs';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{useComputedRel,useComputedLinkProps}from'./hooks.mjs';import{SIZES,SIZES_ROUND,SIZES_TEXT,SIZES_ICON}from'./sizes.mjs';import{SIZES_DEFAULT,SIZES_ROUND_DEFAULT,PROPS_BY_SIZE,SIZES_TEXT_DEFAULT}from'./sizes-default.mjs';import{Root,ContentWithStatus,IconAnimation,Content}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{Text}from'../Text/Text.mjs';import{Icon}from'../Icon/Icon.mjs';import{CheckFill}from'../../icon-pack/src/icons/CheckFill/index.mjs';import{LoaderFill}from'../../icon-pack/src/icons/LoaderFill/index.mjs';const COMPONENT_NAME='Button';const Button=withMergedProps(forwardRef((e,s)=>{let{size:o="m",inline:t=!0,rounded:n=!0,color:r="accent",fontColor:i="white",showContentOnStatus:c,textProps:m={},iconProps:a={},leftIconProps:l={},rightIconProps:p={},textSizes:d={},iconSizes:S={},as:u,sizeXXS:f,sizeXS:E,sizeS:h,sizeM:I,sizeL:j,sizeXL:x,className:_,children:C,content:T,fontWeight:z,icon:N,innerRef:g,...Z}=e;const P=useTheme();Z.preset!=='default'||typeof o!='string'||Z.round||(Z={...PROPS_BY_SIZE[o]??{},...Z}),Z.href&&(u='a'),Z.to&&(u=P.link),Z.disabled&&(u='button'),Z.primary&&(r='primary'),Z.secondary&&(r='atlantis');const y=useClassname("Button",_);const L=useClassname("Button");const F=useComputedRel(P,Z);const O=useComputedLinkProps(u,Z);let[R,A]=Array.isArray(N)?N:[N];const X={size:o,sizeXXS:f,sizeXS:E,sizeS:h,sizeM:I,sizeL:j,sizeXL:x};const D={...X,as:'span',color:'inherit',weight:z??(Z.preset==='brand'?800:600),lineHeight:Z.preset==='brand'?1.2:1,sizes:deepmerge(Z.preset==='brand'?SIZES_TEXT:SIZES_TEXT_DEFAULT,d)};const U={...X,color:'inherit',preset:Z.preset,sizes:deepmerge(SIZES_ICON,S)};const k=Z.preset==='brand'&&Z.success;const b=Z.preset==='brand'&&Z.loading;const M=typeof C!='function'&&(C||T)?jsx(Text,{className:`${L}__content`,...D,...m,children:C||T}):null;return jsx(Root,{...Z,...O,...X,inline:t,color:r,fontColor:i,rounded:n,rel:F,as:u,className:y,ref:s??g,children:typeof C=='function'?C({textProps:D,iconProps:U}):jsxs(Fragment,{children:[k||b?jsxs(ContentWithStatus,{children:[k?jsx(Icon,{...U,...a,icon:jsx(CheckFill,{})}):jsx(IconAnimation,{children:jsx(Icon,{...U,...a,icon:jsx(LoaderFill,{})})}),c?M:null]}):null,jsxs(Content,{"aria-hidden":k||b,children:[R?jsx(Icon,{className:"icon",name:typeof R=='string'?R:void 0,icon:typeof R!='string'?R:void 0,...U,...a,...l}):null,M,A?jsx(Icon,{className:"icon",name:typeof A=='string'?A:void 0,icon:typeof A!='string'?A:void 0,...U,...a,...p}):null]})]})})}),{displayName:"Button",sizes:e=>{let s=e.preset==='brand'?SIZES:SIZES_DEFAULT;return e.round&&(s=e.preset==='brand'?SIZES_ROUND:SIZES_ROUND_DEFAULT),s}});export{Button,COMPONENT_NAME,SIZES,SIZES_ROUND};
1
+ import{forwardRef}from'react';import{useTheme}from'styled-components';import{useClassname}from'../../hooks/useClassname.mjs';import{deepmerge}from'../../shared/utils/misc.mjs';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{useComputedRel,useComputedLinkProps}from'./hooks.mjs';import{SIZES,SIZES_ROUND,SIZES_TEXT,SIZES_ICON}from'./sizes.mjs';import{SIZES_DEFAULT,SIZES_ROUND_DEFAULT,PROPS_BY_SIZE,SIZES_TEXT_DEFAULT}from'./sizes-default.mjs';import{Root,ContentWithStatus,IconAnimation,Content}from'./style.mjs';import{jsx,Fragment,jsxs}from'react/jsx-runtime';import{Slot}from'../Slot/Slot.mjs';import{Text}from'../Text/Text.mjs';import{Icon}from'../Icon/Icon.mjs';import{CheckFill}from'../../icon-pack/src/icons/CheckFill/index.mjs';import{LoaderFill}from'../../icon-pack/src/icons/LoaderFill/index.mjs';const COMPONENT_NAME='Button';const Button=withMergedProps(forwardRef((o,e)=>{let{size:s="m",inline:t=!0,rounded:n=!0,color:r="accent",fontColor:i="white",showContentOnStatus:c,textProps:l={},iconProps:a={},leftIconProps:p={},rightIconProps:m={},textSizes:d={},iconSizes:S={},as:f,root:u,text:j,addonLeft:x,addonRight:I,successIcon:h,loadingIcon:E,sizeXXS:_,sizeXS:C,sizeS:P,sizeM:g,sizeL:T,sizeXL:z,className:N,children:Z,content:k,fontWeight:F,icon:L,innerRef:b,...y}=o;const R=useTheme();y.preset!=='default'||typeof s!='string'||y.round||(y={...PROPS_BY_SIZE[s]??{},...y}),y.href&&(f='a'),y.to&&(f=R.link),y.disabled&&(f='button'),y.primary&&(r='primary'),y.secondary&&(r='atlantis');const O=useClassname("Button",N);const A=useClassname("Button");const X=useComputedRel(R,y);const D=useComputedLinkProps(f,y);let[U,M]=Array.isArray(L)?L:[L];const w={size:s,sizeXXS:_,sizeXS:C,sizeS:P,sizeM:g,sizeL:T,sizeXL:z};const B={...w,as:'span',color:'inherit',weight:F??(y.preset==='brand'?800:600),lineHeight:y.preset==='brand'?1.2:1,sizes:deepmerge(y.preset==='brand'?SIZES_TEXT:SIZES_TEXT_DEFAULT,d)};const v={...w,color:'inherit',preset:y.preset,sizes:deepmerge(SIZES_ICON,S)};const W={...v,icon:jsx(CheckFill,{})};const Y={...v,icon:jsx(LoaderFill,{})};const H=y.preset==='brand'&&y.success;const $=y.preset==='brand'&&y.loading;const q=jsx(Slot,{render:j,props:B,fallback:typeof Z!='function'&&(Z||k)?jsx(Text,{className:`${A}__content`,...B,...l,children:Z||k}):null});return jsx(Root,{...y,...D,...w,inline:t,color:r,fontColor:i,rounded:n,rel:X,as:f,className:O,ref:e??b,children:jsx(Slot,{render:u,props:{textProps:B,iconProps:v,successIconProps:W,loadingIconProps:Y},fallback:typeof Z=='function'?jsx(Fragment,{children:Z({textProps:B,iconProps:v})}):jsxs(Fragment,{children:[H||$?jsxs(ContentWithStatus,{children:[jsx(Slot,H?{render:h,props:W,fallback:jsx(Icon,{...v,...a,icon:jsx(CheckFill,{})})}:{render:E,props:Y,fallback:jsx(IconAnimation,{children:jsx(Icon,{...v,...a,icon:jsx(LoaderFill,{})})})}),c?q:null]}):null,jsxs(Content,{"aria-hidden":H||$,children:[jsx(Slot,{render:x,props:{iconProps:v},fallback:U?jsx(Icon,{className:"icon",name:typeof U=='string'?U:void 0,icon:typeof U!='string'?U:void 0,...v,...a,...p}):null}),q,jsx(Slot,{render:I,props:{iconProps:v},fallback:M?jsx(Icon,{className:"icon",name:typeof M=='string'?M:void 0,icon:typeof M!='string'?M:void 0,...v,...a,...m}):null})]})]})})})}),{displayName:"Button",sizes:o=>{let e=o.preset==='brand'?SIZES:SIZES_DEFAULT;return o.round&&(e=o.preset==='brand'?SIZES_ROUND:SIZES_ROUND_DEFAULT),e}});export{Button,COMPONENT_NAME,SIZES,SIZES_ROUND};
2
2
  //# sourceMappingURL=Button.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"Button.mjs","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["/* eslint-disable prefer-const */\nimport { forwardRef } from 'react'\nimport { useTheme } from 'styled-components'\nimport { CheckFill, LoaderFill } from '@foxford/icon-pack'\nimport { useClassname } from 'hooks/useClassname'\nimport { deepmerge } from 'shared/utils/misc'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { Text } from 'components/Text'\nimport type { IconProps } from 'components/Icon'\nimport type { TextProps } from 'components/Text'\nimport { useComputedRel, useComputedLinkProps } from './hooks'\nimport { SIZES, SIZES_ROUND, SIZES_ICON, SIZES_TEXT } from './sizes'\nimport { SIZES_DEFAULT, SIZES_ROUND_DEFAULT, PROPS_BY_SIZE, SIZES_TEXT_DEFAULT } from './sizes-default'\nimport type { ButtonProps, Size } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Button'\n\n/**\n *\n * Контрол многоцелевого назначения.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<button\\> элемента.\n */\nconst Button: React.ForwardRefExoticComponent<ButtonProps> = withMergedProps<ButtonProps, HTMLButtonElement>(\n forwardRef<HTMLButtonElement, MergedProps<ButtonProps>>((props, ref) => {\n let {\n size = 'm',\n inline = true,\n rounded = true,\n color = 'accent',\n fontColor = 'white',\n showContentOnStatus,\n textProps: textPropsProp = {},\n iconProps: iconPropsProp = {},\n leftIconProps = {},\n rightIconProps = {},\n textSizes = {},\n iconSizes = {},\n as: _as,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n className,\n children,\n content,\n fontWeight,\n icon,\n innerRef,\n ...restProps\n } = props\n\n const theme = useTheme()\n\n if (restProps.preset === 'default' && typeof size === 'string' && !restProps.round) {\n const propsBySize = PROPS_BY_SIZE[size as Size] ?? {}\n restProps = { ...propsBySize, ...restProps }\n }\n\n if (restProps.href) _as = 'a'\n if (restProps.to) _as = theme.link\n if (restProps.disabled) _as = 'button'\n\n if (restProps.primary) color = 'primary'\n if (restProps.secondary) color = 'atlantis'\n\n const rootClassName = useClassname(COMPONENT_NAME, className)\n const textClassName = useClassname(COMPONENT_NAME)\n const rel = useComputedRel(theme, restProps)\n const linkProps = useComputedLinkProps(_as, restProps)\n\n let [before, after] = Array.isArray(icon) ? icon : [icon]\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const textProps: TextProps = {\n ...sizeProps,\n as: 'span',\n color: 'inherit',\n weight: fontWeight ?? (restProps.preset === 'brand' ? 800 : 600),\n lineHeight: restProps.preset === 'brand' ? 1.2 : 1,\n sizes: deepmerge(restProps.preset === 'brand' ? SIZES_TEXT : SIZES_TEXT_DEFAULT, textSizes),\n }\n\n const iconProps: IconProps = {\n ...sizeProps,\n color: 'inherit',\n preset: restProps.preset,\n sizes: deepmerge(SIZES_ICON, iconSizes),\n }\n\n const success = restProps.preset === 'brand' && restProps.success\n const loading = restProps.preset === 'brand' && restProps.loading\n\n const mainContent =\n typeof children !== 'function' && (children || content) ? (\n <Text className={`${textClassName}__content`} {...textProps} {...textPropsProp}>\n {children || content}\n </Text>\n ) : null\n\n return (\n <Styled.Root\n {...restProps}\n {...linkProps}\n {...sizeProps}\n inline={inline}\n color={color}\n fontColor={fontColor}\n rounded={rounded}\n rel={rel}\n as={_as}\n className={rootClassName}\n ref={ref ?? innerRef}\n >\n {typeof children === 'function' ? (\n children({ textProps, iconProps })\n ) : (\n <>\n {success || loading ? (\n <Styled.ContentWithStatus>\n {success ? (\n <Icon {...iconProps} {...iconPropsProp} icon={<CheckFill />} />\n ) : (\n <Styled.IconAnimation>\n <Icon {...iconProps} {...iconPropsProp} icon={<LoaderFill />} />\n </Styled.IconAnimation>\n )}\n {showContentOnStatus ? mainContent : null}\n </Styled.ContentWithStatus>\n ) : null}\n <Styled.Content aria-hidden={success || loading}>\n {before ? (\n <Icon\n className='icon'\n name={typeof before === 'string' ? before : undefined}\n icon={typeof before !== 'string' ? before : undefined}\n {...iconProps}\n {...iconPropsProp}\n {...leftIconProps}\n />\n ) : null}\n {mainContent}\n {after ? (\n <Icon\n className='icon'\n name={typeof after === 'string' ? after : undefined}\n icon={typeof after !== 'string' ? after : undefined}\n {...iconProps}\n {...iconPropsProp}\n {...rightIconProps}\n />\n ) : null}\n </Styled.Content>\n </>\n )}\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => {\n let sizes = props.preset === 'brand' ? SIZES : SIZES_DEFAULT\n if (props.round) sizes = props.preset === 'brand' ? SIZES_ROUND : SIZES_ROUND_DEFAULT\n\n return sizes\n },\n }\n)\n\nexport { Button, COMPONENT_NAME, SIZES, SIZES_ROUND }\n\nexport type { ButtonProps }\n"],"names":["COMPONENT_NAME","Button","withMergedProps","forwardRef","props","ref","size","inline","rounded","color","fontColor","showContentOnStatus","textProps","textPropsProp","iconProps","iconPropsProp","leftIconProps","rightIconProps","textSizes","iconSizes","as","_as","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","className","children","content","fontWeight","icon","innerRef","restProps","theme","useTheme","preset","round","PROPS_BY_SIZE","href","to","link","disabled","primary","secondary","rootClassName","useClassname","textClassName","rel","useComputedRel","linkProps","useComputedLinkProps","before","after","Array","isArray","sizeProps","weight","lineHeight","sizes","deepmerge","SIZES_TEXT","SIZES_TEXT_DEFAULT","SIZES_ICON","success","loading","mainContent","_jsx","Text","Styled","_jsxs","_Fragment","Icon","CheckFill","LoaderFill","name","undefined","displayName","SIZES","SIZES_DEFAULT","SIZES_ROUND","SIZES_ROUND_DEFAULT"],"mappings":"uxBAkBA,MAAMA,eAAiB,SAQvB,MAAMC,OAAuDC,gBAC3DC,WAAwD,CAACC,EAAOC,KAC9D,IAAIC,KACFA,EAAO,IAAGC,OACVA,GAAS,EAAIC,QACbA,GAAU,EAAIC,MACdA,EAAQ,SAAQC,UAChBA,EAAY,QAAOC,oBACnBA,EACAC,UAAWC,EAAgB,CAAA,EAC3BC,UAAWC,EAAgB,CAAA,EAAEC,cAC7BA,EAAgB,CAAA,EAAEC,eAClBA,EAAiB,CAAA,EAAEC,UACnBA,EAAY,CAAA,EAAEC,UACdA,EAAY,CAAA,EACZC,GAAIC,EAAGC,QACPA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,UACNA,EAASC,SACTA,EAAQC,QACRA,EAAOC,WACPA,EAAUC,KACVA,EAAIC,SACJA,KACGC,GACD9B,EAEJ,MAAM+B,EAAQC,WAEVF,EAAUG,SAAW,kBAAoB/B,GAAS,UAAa4B,EAAUI,QAE3EJ,EAAY,IADQK,cAAcjC,IAAiB,CAAA,KAClB4B,IAG/BA,EAAUM,OAAMnB,EAAM,KACtBa,EAAUO,KAAIpB,EAAMc,EAAMO,MAC1BR,EAAUS,WAAUtB,EAAM,UAE1Ba,EAAUU,UAASnC,EAAQ,WAC3ByB,EAAUW,YAAWpC,EAAQ,YAEjC,MAAMqC,EAAgBC,aArDH,SAqDgCnB,GACnD,MAAMoB,EAAgBD,aAtDH,UAuDnB,MAAME,EAAMC,eAAef,EAAOD,GAClC,MAAMiB,EAAYC,qBAAqB/B,EAAKa,GAE5C,IAAKmB,EAAQC,GAASC,MAAMC,QAAQxB,GAAQA,EAAO,CAACA,GAEpD,MAAMyB,EAAY,CAChBnD,OACAgB,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMf,EAAuB,IACxB6C,EACHrC,GAAI,OACJX,MAAO,UACPiD,OAAQ3B,IAAeG,EAAUG,SAAW,QAAU,IAAM,KAC5DsB,WAAYzB,EAAUG,SAAW,QAAU,IAAM,EACjDuB,MAAOC,UAAU3B,EAAUG,SAAW,QAAUyB,WAAaC,mBAAoB7C,IAGnF,MAAMJ,EAAuB,IACxB2C,EACHhD,MAAO,UACP4B,OAAQH,EAAUG,OAClBuB,MAAOC,UAAUG,WAAY7C,IAG/B,MAAM8C,EAAU/B,EAAUG,SAAW,SAAWH,EAAU+B,QAC1D,MAAMC,EAAUhC,EAAUG,SAAW,SAAWH,EAAUgC,QAE1D,MAAMC,SACGtC,GAAa,aAAeA,GAAYC,GAC7CsC,IAACC,KAAI,CAACzC,UAAW,GAAGoB,gBAA8BpC,KAAeC,EAAagB,SAC3EA,GAAYC,IAEb,KAEN,OACEsC,IAACE,KAAW,IACNpC,KACAiB,KACAM,EACJlD,OAAQA,EACRE,MAAOA,EACPC,UAAWA,EACXF,QAASA,EACTyC,IAAKA,EACL7B,GAAIC,EACJO,UAAWkB,EACXzC,IAAKA,GAAO4B,EAASJ,gBAEbA,GAAa,WACnBA,EAAS,CAAEjB,YAAWE,cAEtByD,KAAAC,SAAA,CAAA3C,SAAA,CACGoC,GAAWC,EACVK,KAACD,kBAAwB,CAAAzC,SAAA,CACtBoC,EACCG,IAACK,KAAI,IAAK3D,KAAeC,EAAeiB,KAAMoC,IAACM,UAAS,CAAA,KAExDN,IAACE,cAAoB,CAAAzC,SACnBuC,IAACK,KAAI,IAAK3D,KAAeC,EAAeiB,KAAMoC,IAACO,WAAU,CAAA,OAG5DhE,EAAsBwD,EAAc,QAErC,KACJI,KAACD,QAAc,CAAC,cAAaL,GAAWC,EAAQrC,SAAA,CAC7CwB,EACCe,IAACK,KAAI,CACH7C,UAAU,OACVgD,YAAavB,GAAW,SAAWA,OAASwB,EAC5C7C,YAAaqB,GAAW,SAAWA,OAASwB,KACxC/D,KACAC,KACAC,IAEJ,KACHmD,EACAb,EACCc,IAACK,KAAI,CACH7C,UAAU,OACVgD,YAAatB,GAAU,SAAWA,OAAQuB,EAC1C7C,YAAasB,GAAU,SAAWA,OAAQuB,KACtC/D,KACAC,KACAE,IAEJ,eAOhB,CACE6D,YA3JmB,SA4JnBlB,MAAQxD,IACN,IAAIwD,EAAQxD,EAAMiC,SAAW,QAAU0C,MAAQC,cAG/C,OAFI5E,EAAMkC,QAAOsB,EAAQxD,EAAMiC,SAAW,QAAU4C,YAAcC,qBAE3DtB"}
1
+ {"version":3,"file":"Button.mjs","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["/* eslint-disable prefer-const */\nimport { forwardRef } from 'react'\nimport { useTheme } from 'styled-components'\nimport { CheckFill, LoaderFill } from '@foxford/icon-pack'\nimport { useClassname } from 'hooks/useClassname'\nimport { deepmerge } from 'shared/utils/misc'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { Text } from 'components/Text'\nimport { Slot } from 'components/Slot'\nimport type { IconProps } from 'components/Icon'\nimport type { TextProps } from 'components/Text'\nimport { useComputedRel, useComputedLinkProps } from './hooks'\nimport { SIZES, SIZES_ROUND, SIZES_ICON, SIZES_TEXT } from './sizes'\nimport { SIZES_DEFAULT, SIZES_ROUND_DEFAULT, PROPS_BY_SIZE, SIZES_TEXT_DEFAULT } from './sizes-default'\nimport type { ButtonProps, Size } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Button'\n\n/**\n *\n * Контрол многоцелевого назначения.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<button\\> элемента.\n */\nconst Button: React.ForwardRefExoticComponent<ButtonProps> = withMergedProps<ButtonProps, HTMLButtonElement>(\n forwardRef<HTMLButtonElement, MergedProps<ButtonProps>>((props, ref) => {\n let {\n size = 'm',\n inline = true,\n rounded = true,\n color = 'accent',\n fontColor = 'white',\n showContentOnStatus,\n textProps: textPropsProp = {},\n iconProps: iconPropsProp = {},\n leftIconProps = {},\n rightIconProps = {},\n textSizes = {},\n iconSizes = {},\n as: _as,\n root,\n text,\n addonLeft,\n addonRight,\n successIcon,\n loadingIcon,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n className,\n children,\n content,\n fontWeight,\n icon,\n innerRef,\n ...restProps\n } = props\n\n const theme = useTheme()\n\n if (restProps.preset === 'default' && typeof size === 'string' && !restProps.round) {\n const propsBySize = PROPS_BY_SIZE[size as Size] ?? {}\n restProps = { ...propsBySize, ...restProps }\n }\n\n if (restProps.href) _as = 'a'\n if (restProps.to) _as = theme.link\n if (restProps.disabled) _as = 'button'\n\n if (restProps.primary) color = 'primary'\n if (restProps.secondary) color = 'atlantis'\n\n const rootClassName = useClassname(COMPONENT_NAME, className)\n const textClassName = useClassname(COMPONENT_NAME)\n const rel = useComputedRel(theme, restProps)\n const linkProps = useComputedLinkProps(_as, restProps)\n\n let [before, after] = Array.isArray(icon) ? icon : [icon]\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const textProps: TextProps = {\n ...sizeProps,\n as: 'span',\n color: 'inherit',\n weight: fontWeight ?? (restProps.preset === 'brand' ? 800 : 600),\n lineHeight: restProps.preset === 'brand' ? 1.2 : 1,\n sizes: deepmerge(restProps.preset === 'brand' ? SIZES_TEXT : SIZES_TEXT_DEFAULT, textSizes),\n }\n\n const iconProps: IconProps = {\n ...sizeProps,\n color: 'inherit',\n preset: restProps.preset,\n sizes: deepmerge(SIZES_ICON, iconSizes),\n }\n\n const successIconProps: IconProps = {\n ...iconProps,\n icon: <CheckFill />,\n }\n\n const loadingIconProps: IconProps = {\n ...iconProps,\n icon: <LoaderFill />,\n }\n\n const success = restProps.preset === 'brand' && restProps.success\n const loading = restProps.preset === 'brand' && restProps.loading\n\n const mainContent = (\n <Slot\n render={text}\n props={textProps}\n fallback={\n typeof children !== 'function' && (children || content) ? (\n <Text className={`${textClassName}__content`} {...textProps} {...textPropsProp}>\n {children || content}\n </Text>\n ) : null\n }\n />\n )\n\n return (\n <Styled.Root\n {...restProps}\n {...linkProps}\n {...sizeProps}\n inline={inline}\n color={color}\n fontColor={fontColor}\n rounded={rounded}\n rel={rel}\n as={_as}\n className={rootClassName}\n ref={ref ?? innerRef}\n >\n <Slot\n render={root}\n props={{\n textProps,\n iconProps,\n successIconProps,\n loadingIconProps,\n }}\n fallback={\n typeof children === 'function' ? (\n <>{children({ textProps, iconProps })}</>\n ) : (\n <>\n {success || loading ? (\n <Styled.ContentWithStatus>\n {success ? (\n <Slot\n render={successIcon}\n props={successIconProps}\n fallback={<Icon {...iconProps} {...iconPropsProp} icon={<CheckFill />} />}\n />\n ) : (\n <Slot\n render={loadingIcon}\n props={loadingIconProps}\n fallback={\n <Styled.IconAnimation>\n <Icon {...iconProps} {...iconPropsProp} icon={<LoaderFill />} />\n </Styled.IconAnimation>\n }\n />\n )}\n {showContentOnStatus ? mainContent : null}\n </Styled.ContentWithStatus>\n ) : null}\n <Styled.Content aria-hidden={success || loading}>\n <Slot\n render={addonLeft}\n props={{\n iconProps,\n }}\n fallback={\n before ? (\n <Icon\n className='icon'\n name={typeof before === 'string' ? before : undefined}\n icon={typeof before !== 'string' ? before : undefined}\n {...iconProps}\n {...iconPropsProp}\n {...leftIconProps}\n />\n ) : null\n }\n />\n {mainContent}\n <Slot\n render={addonRight}\n props={{\n iconProps,\n }}\n fallback={\n after ? (\n <Icon\n className='icon'\n name={typeof after === 'string' ? after : undefined}\n icon={typeof after !== 'string' ? after : undefined}\n {...iconProps}\n {...iconPropsProp}\n {...rightIconProps}\n />\n ) : null\n }\n />\n </Styled.Content>\n </>\n )\n }\n />\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => {\n let sizes = props.preset === 'brand' ? SIZES : SIZES_DEFAULT\n if (props.round) sizes = props.preset === 'brand' ? SIZES_ROUND : SIZES_ROUND_DEFAULT\n\n return sizes\n },\n }\n)\n\nexport { Button, COMPONENT_NAME, SIZES, SIZES_ROUND }\n\nexport type { ButtonProps }\n"],"names":["COMPONENT_NAME","Button","withMergedProps","forwardRef","props","ref","size","inline","rounded","color","fontColor","showContentOnStatus","textProps","textPropsProp","iconProps","iconPropsProp","leftIconProps","rightIconProps","textSizes","iconSizes","as","_as","root","text","addonLeft","addonRight","successIcon","loadingIcon","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","className","children","content","fontWeight","icon","innerRef","restProps","theme","useTheme","preset","round","PROPS_BY_SIZE","href","to","link","disabled","primary","secondary","rootClassName","useClassname","textClassName","rel","useComputedRel","linkProps","useComputedLinkProps","before","after","Array","isArray","sizeProps","weight","lineHeight","sizes","deepmerge","SIZES_TEXT","SIZES_TEXT_DEFAULT","SIZES_ICON","successIconProps","_jsx","CheckFill","loadingIconProps","LoaderFill","success","loading","mainContent","Slot","render","fallback","Text","Styled","_Fragment","_jsxs","Icon","name","undefined","displayName","SIZES","SIZES_DEFAULT","SIZES_ROUND","SIZES_ROUND_DEFAULT"],"mappings":"0zBAmBA,MAAMA,eAAiB,SAQvB,MAAMC,OAAuDC,gBAC3DC,WAAwD,CAACC,EAAOC,KAC9D,IAAIC,KACFA,EAAO,IAAGC,OACVA,GAAS,EAAIC,QACbA,GAAU,EAAIC,MACdA,EAAQ,SAAQC,UAChBA,EAAY,QAAOC,oBACnBA,EACAC,UAAWC,EAAgB,CAAA,EAC3BC,UAAWC,EAAgB,CAAA,EAAEC,cAC7BA,EAAgB,CAAA,EAAEC,eAClBA,EAAiB,CAAA,EAAEC,UACnBA,EAAY,CAAA,EAAEC,UACdA,EAAY,CAAA,EACZC,GAAIC,EAAGC,KACPA,EAAIC,KACJA,EAAIC,UACJA,EAASC,WACTA,EAAUC,YACVA,EAAWC,YACXA,EAAWC,QACXA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,UACNA,EAASC,SACTA,EAAQC,QACRA,EAAOC,WACPA,EAAUC,KACVA,EAAIC,SACJA,KACGC,GACDpC,EAEJ,MAAMqC,EAAQC,WAEVF,EAAUG,SAAW,kBAAoBrC,GAAS,UAAakC,EAAUI,QAE3EJ,EAAY,IADQK,cAAcvC,IAAiB,CAAA,KAClBkC,IAG/BA,EAAUM,OAAMzB,EAAM,KACtBmB,EAAUO,KAAI1B,EAAMoB,EAAMO,MAC1BR,EAAUS,WAAU5B,EAAM,UAE1BmB,EAAUU,UAASzC,EAAQ,WAC3B+B,EAAUW,YAAW1C,EAAQ,YAEjC,MAAM2C,EAAgBC,aA3DH,SA2DgCnB,GACnD,MAAMoB,EAAgBD,aA5DH,UA6DnB,MAAME,EAAMC,eAAef,EAAOD,GAClC,MAAMiB,EAAYC,qBAAqBrC,EAAKmB,GAE5C,IAAKmB,EAAQC,GAASC,MAAMC,QAAQxB,GAAQA,EAAO,CAACA,GAEpD,MAAMyB,EAAY,CAChBzD,OACAsB,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMrB,EAAuB,IACxBmD,EACH3C,GAAI,OACJX,MAAO,UACPuD,OAAQ3B,IAAeG,EAAUG,SAAW,QAAU,IAAM,KAC5DsB,WAAYzB,EAAUG,SAAW,QAAU,IAAM,EACjDuB,MAAOC,UAAU3B,EAAUG,SAAW,QAAUyB,WAAaC,mBAAoBnD,IAGnF,MAAMJ,EAAuB,IACxBiD,EACHtD,MAAO,UACPkC,OAAQH,EAAUG,OAClBuB,MAAOC,UAAUG,WAAYnD,IAG/B,MAAMoD,EAA8B,IAC/BzD,EACHwB,KAAMkC,IAACC,UAAS,CAAA,IAGlB,MAAMC,EAA8B,IAC/B5D,EACHwB,KAAMkC,IAACG,WAAU,CAAA,IAGnB,MAAMC,EAAUpC,EAAUG,SAAW,SAAWH,EAAUoC,QAC1D,MAAMC,EAAUrC,EAAUG,SAAW,SAAWH,EAAUqC,QAE1D,MAAMC,EACJN,IAACO,KAAI,CACHC,OAAQzD,EACRnB,MAAOQ,EACPqE,gBACS9C,GAAa,aAAeA,GAAYC,GAC7CoC,IAACU,KAAI,CAAChD,UAAW,GAAGoB,gBAA8B1C,KAAeC,EAAasB,SAC3EA,GAAYC,IAEb,OAKV,OACEoC,IAACW,KAAW,IACN3C,KACAiB,KACAM,EACJxD,OAAQA,EACRE,MAAOA,EACPC,UAAWA,EACXF,QAASA,EACT+C,IAAKA,EACLnC,GAAIC,EACJa,UAAWkB,EACX/C,IAAKA,GAAOkC,EAASJ,SAErBqC,IAACO,KAAI,CACHC,OAAQ1D,EACRlB,MAAO,CACLQ,YACAE,YACAyD,mBACAG,oBAEFO,gBACS9C,GAAa,WAClBqC,IAAAY,SAAA,CAAAjD,SAAGA,EAAS,CAAEvB,YAAWE,gBAEzBuE,KAAAD,SAAA,CAAAjD,SAAA,CACGyC,GAAWC,EACVQ,KAACF,kBAAwB,CAAAhD,SAAA,CAErBqC,IAACO,KADFH,EACM,CACHI,OAAQtD,EACRtB,MAAOmE,EACPU,SAAUT,IAACc,KAAI,IAAKxE,KAAeC,EAAeuB,KAAMkC,IAACC,UAAS,CAAA,MAG/D,CACHO,OAAQrD,EACRvB,MAAOsE,EACPO,SACET,IAACW,cAAoB,CAAAhD,SACnBqC,IAACc,KAAI,IAAKxE,KAAeC,EAAeuB,KAAMkC,IAACG,WAAU,CAAA,SAKhEhE,EAAsBmE,EAAc,QAErC,KACJO,KAACF,QAAc,CAAC,cAAaP,GAAWC,EAAQ1C,SAAA,CAC9CqC,IAACO,KAAI,CACHC,OAAQxD,EACRpB,MAAO,CACLU,aAEFmE,SACEtB,EACEa,IAACc,KAAI,CACHpD,UAAU,OACVqD,YAAa5B,GAAW,SAAWA,OAAS6B,EAC5ClD,YAAaqB,GAAW,SAAWA,OAAS6B,KACxC1E,KACAC,KACAC,IAEJ,OAGP8D,EACDN,IAACO,KAAI,CACHC,OAAQvD,EACRrB,MAAO,CACLU,aAEFmE,SACErB,EACEY,IAACc,KAAI,CACHpD,UAAU,OACVqD,YAAa3B,GAAU,SAAWA,OAAQ4B,EAC1ClD,YAAasB,GAAU,SAAWA,OAAQ4B,KACtC1E,KACAC,KACAE,IAEJ,mBAWxB,CACEwE,YAvNmB,SAwNnBvB,MAAQ9D,IACN,IAAI8D,EAAQ9D,EAAMuC,SAAW,QAAU+C,MAAQC,cAG/C,OAFIvF,EAAMwC,QAAOsB,EAAQ9D,EAAMuC,SAAW,QAAUiD,YAAcC,qBAE3D3B"}
package/dts/index.d.ts CHANGED
@@ -1845,9 +1845,64 @@ ResponsiveNamedProperty<'height', 'l' | 'm' | 's' | 'xs' | number> {
1845
1845
  borderColorDisabled?: Color;
1846
1846
  shadowColor?: Color;
1847
1847
  };
1848
+ /**
1849
+ * Кастомный рутовый блок.
1850
+ *
1851
+ * Использование компонента только как контейнера.
1852
+ *
1853
+ * @slot
1854
+ * @default undefined */
1855
+ root?: React.ReactElement | ((props: {
1856
+ textProps: TextProps;
1857
+ iconProps: IconProps;
1858
+ successIconProps: IconProps;
1859
+ loadingIconProps: IconProps;
1860
+ }) => React.ReactNode);
1861
+ /**
1862
+ * Основной текстовый контент.
1863
+ *
1864
+ * Если передана строка или число используется встроенная типографика.
1865
+ *
1866
+ * @slot
1867
+ * @default undefined */
1868
+ text?: React.ReactNode | ((textProps: TextProps) => React.ReactNode);
1869
+ /**
1870
+ * Дополнительные элементы слева.
1871
+ *
1872
+ * @slot
1873
+ * @default undefined */
1874
+ addonLeft?: React.ReactElement | ((addonLeftProps: {
1875
+ iconProps: IconProps;
1876
+ }) => React.ReactNode);
1877
+ /**
1878
+ * Дополнительные элементы справа.
1879
+ *
1880
+ * @slot
1881
+ * @default undefined */
1882
+ addonRight?: React.ReactElement | ((addonRightProps: {
1883
+ iconProps: IconProps;
1884
+ }) => React.ReactNode);
1885
+ /**
1886
+ * Иконка для успешного состояния.
1887
+ *
1888
+ * По умолчанию используется checkFill.
1889
+ *
1890
+ * @slot
1891
+ * @default undefined */
1892
+ successIcon?: React.ReactElement | ((iconProps: IconProps) => React.ReactNode);
1893
+ /**
1894
+ * Иконка для состояния загрузки.
1895
+ *
1896
+ * По умолчанию используется loaderFill.
1897
+ *
1898
+ * @slot
1899
+ * @default undefined */
1900
+ loadingIcon?: React.ReactElement | ((iconProps: IconProps) => React.ReactNode);
1848
1901
  /**
1849
1902
  * Основной контент.
1850
1903
  *
1904
+ * Вместо этого пропа можно использовать проп text.
1905
+ *
1851
1906
  * @general
1852
1907
  * @default undefined */
1853
1908
  children?: React.ReactNode | ((rootProps: {
@@ -1861,13 +1916,15 @@ ResponsiveNamedProperty<'height', 'l' | 'm' | 's' | 'xs' | number> {
1861
1916
  * @default {} */
1862
1917
  textProps?: TextProps;
1863
1918
  /**
1864
- * Отображение на одно линии с другими элементами.
1919
+ * Отображение на одной линии с другими элементами.
1865
1920
  *
1866
1921
  * @default true */
1867
1922
  inline?: boolean;
1868
1923
  /**
1869
1924
  * Иконки до и после основного контента.
1870
1925
  *
1926
+ * Вместо этого пропа можно использовать пропы addonLeft, addonRight.
1927
+ *
1871
1928
  * @general
1872
1929
  * @default undefined */
1873
1930
  icon?: JSX.Element | IconName | [Nullable<JSX.Element | IconName>, Nullable<JSX.Element | IconName>];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@foxford/ui",
3
- "version": "2.129.0",
3
+ "version": "2.130.0",
4
4
  "description": "UI components and utilities",
5
5
  "bugs": {
6
6
  "url": "https://github.com/foxford/ui/issues"
@@ -60,6 +60,6 @@
60
60
  "shared",
61
61
  "theme"
62
62
  ],
63
- "sha": "27bf182",
63
+ "sha": "a23165f",
64
64
  "scripts": {}
65
65
  }