@foxford/ui 2.0.0-beta-e44eaea-20220707 → 2.0.0-beta-9299aa8-20220707

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 e from'@babel/runtime/helpers/objectSpread2';import r from'@babel/runtime/helpers/objectWithoutProperties';import{Link as a}from'react-router-dom';import{useClassname as t}from'../../hooks/useClassname.js';import{Root as s,Content as o}from'./style.js';import{PROPS_BY_SIZE as i,PRESETS as n}from'./default.js';import{jsxs as l,jsx as m}from'react/jsx-runtime';var d=["children","className","disabled","href","to","as","target","onClick","ref","icon","type","innerRef"];function c(p){var{children:f,className:u,disabled:b,href:y,to:h,as:v,target:j,onClick:N,ref:C,icon:g,type:k,innerRef:x}=p,P=r(p,d);var R=v||(b?'button':y?'a':h?a:'button');var S='a'!==R||b?{}:{href:y||h,target:j};var _='string'==typeof R||b?{}:{to:h||y};var z=P.size&&!P.round&&i[P.size]||{};var B=(e=>e.primary?n.primary:e.secondary?n.secondary:n.default)(p);var E=t(c.displayName,u);return l(s,e(e(e(e(e(e({as:R,className:E,type:'button'===R?k:void 0,onClick:b||P.loading?void 0:N},z),S),_),B),P),{},{disabled:b,ref:C||x,children:[g&&m("span",{className:"icon",children:g}),f&&m(o,{className:"".concat(E,"__content"),children:f})]}))}c.defaultProps={size:'m',rounded:!0,display:'inline-flex',type:'button'},c.displayName='Button';export{c as Button};
1
+ import e from'@babel/runtime/helpers/objectSpread2';import a from'@babel/runtime/helpers/objectWithoutProperties';import{Link as r}from'react-router-dom';import{useClassname as t}from'../../hooks/useClassname.js';import{Root as s,Content as o}from'./style.js';import{PROPS_BY_SIZE as i,PRESETS as n}from'./default.js';import{jsxs as l,jsx as m}from'react/jsx-runtime';var d=["children","className","disabled","href","to","as","target","onClick","ref","icon","type","innerRef"];function c(p){var{children:f,className:u,disabled:y,href:b,to:h,as:v,target:j,onClick:N,ref:C,icon:g,type:k,innerRef:x}=p,P=a(p,d);var R=v||(y?'button':b?'a':h?r:'button');var S='a'!==R||y?{}:{href:b||h,target:j};var _='string'==typeof R||y?{}:{to:h||b};var z=P.size&&!P.round&&i[P.size]||{};var B=(e=>e.primary?n.primary:e.secondary?n.secondary:n.default)(p);var E=t(c.displayName,u);var I=t(c.displayName);return l(s,e(e(e(e(e(e({as:R,className:E,type:'button'===R?k:void 0,onClick:y||P.loading?void 0:N},z),S),_),B),P),{},{disabled:y,ref:C||x,children:[g&&m("span",{className:"icon",children:g}),f&&m(o,{className:"".concat(I,"__content"),children:f})]}))}c.defaultProps={size:'m',rounded:!0,display:'inline-flex',type:'button'},c.displayName='Button';export{c as Button};
2
2
  //# sourceMappingURL=Button.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import { Link } from 'react-router-dom'\nimport { useClassname } from 'hooks/useClassname'\nimport { Display } from '../../mixins/display'\nimport { ResponsiveNamedProperty } from '../../mixins/responsive-property'\nimport { BaseProps, Tooltiped } from '../../shared/interfaces'\nimport { Color } from '../../mixins/color'\nimport { Anchor } from '../../components/Anchor'\nimport * as Styled from './style'\nimport { PRESETS, PROPS_BY_SIZE } from './default'\n\nexport interface ButtonProps\n extends BaseProps,\n Tooltiped,\n Display,\n Color,\n Color<'fontColor'>,\n ResponsiveNamedProperty<'padding'>,\n ResponsiveNamedProperty<'paddingTop'>,\n ResponsiveNamedProperty<'paddingRight'>,\n ResponsiveNamedProperty<'paddingBottom'>,\n ResponsiveNamedProperty<'paddingLeft'>,\n ResponsiveNamedProperty<'margin'>,\n ResponsiveNamedProperty<'marginTop'>,\n ResponsiveNamedProperty<'marginRight'>,\n ResponsiveNamedProperty<'marginBottom'>,\n ResponsiveNamedProperty<'marginLeft'>,\n ResponsiveNamedProperty<'fontSize'>,\n ResponsiveNamedProperty<'fluid', boolean>,\n ResponsiveNamedProperty<'width', 'auto' | 'l' | 'm' | 's' | 'xs' | number>,\n ResponsiveNamedProperty<'height', 'l' | 'm' | 's' | 'xs' | number> {\n /**\n * Node type\n */\n as?: 'div' | 'span' | 'a' | 'button' | typeof Link | typeof Anchor\n target?: string\n rel?: string\n /**\n * Link href\n */\n href?: string\n /**\n * React router link to\n */\n to?: string\n /**\n * Type for button element\n */\n type?: 'button' | 'submit' | 'reset'\n /**\n * Children react node\n */\n children?: React.ReactNode\n /**\n * Basic button\n */\n basic?: boolean\n /**\n * Disabled\n */\n disabled?: boolean\n /**\n * Is primary\n */\n primary?: boolean\n /**\n * Is secondary\n */\n secondary?: boolean\n /**\n * Is inverted\n */\n inverted?: boolean\n /**\n * Is rounded\n */\n rounded?: boolean\n /**\n * Is round (in a shape of circle)\n */\n round?: boolean\n /**\n * Indicates if there should not be any margin\n * between this button and the previous one\n */\n noSpacing?: boolean\n /**\n * Is in loading state\n */\n loading?: boolean\n /**\n * Button icon\n */\n icon?: React.ReactNode\n /** On click callback */\n onClick?: () => void\n /** Function to make ref */\n ref?: React.LegacyRef<HTMLDivElement>\n /**\n * Size\n */\n size?: 'l' | 'm' | 's' | 'xs'\n}\n\nButton.defaultProps = {\n size: 'm',\n rounded: true,\n display: 'inline-flex',\n type: 'button',\n}\n\nButton.displayName = 'Button'\n\nconst extractPresetByProps = (props: ButtonProps): Partial<ButtonProps> => {\n if (props.primary) return PRESETS.primary\n if (props.secondary) return PRESETS.secondary\n return PRESETS.default\n}\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n * - [`Display`](#/Миксины)\n * - [`Tooltiped`](#/Миксины)\n * - [`Color`](#/Миксины)\n * - [`Color<'fontColor'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'padding'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'paddingTop'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'paddingRight'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'paddingBottom'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'paddingLeft'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'margin'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'marginTop'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'marginRight'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'marginBottom'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'marginLeft'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'fontSize'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'fluid', boolean>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'width', 'auto' | 'l' | 'm' | 's' | 'xs' | number>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'height', 'l' | 'm' | 's' | 'xs' | number>`](#/Миксины)\n */\nexport function Button(props: ButtonProps) {\n const { children, className, disabled, href, to, as, target, onClick, ref, icon, type, innerRef, ...restProps } =\n props\n\n const _as = as || (disabled ? 'button' : href ? 'a' : to ? Link : 'button')\n const aProps = _as === 'a' && !disabled ? { href: href || to, target } : {}\n const linkProps = typeof _as !== 'string' && !disabled ? { to: to || href } : {}\n const propsBySize: Partial<ButtonProps> =\n restProps.size && !restProps.round ? PROPS_BY_SIZE[restProps.size] || {} : {}\n const presetProps: Partial<ButtonProps> = extractPresetByProps(props)\n const _className = useClassname(Button.displayName, className)\n\n return (\n <Styled.Root\n as={_as}\n className={_className}\n type={_as === 'button' ? type : undefined}\n onClick={disabled || restProps.loading ? undefined : onClick}\n {...propsBySize}\n {...aProps}\n {...linkProps}\n {...presetProps}\n {...restProps}\n disabled={disabled}\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref={(ref || innerRef) as any}\n >\n {icon && <span className='icon'>{icon}</span>}\n {children && <Styled.Content className={`${_className}__content`}>{children}</Styled.Content>}\n </Styled.Root>\n )\n}\n"],"names":["Button","props","children","className","disabled","href","to","as","target","onClick","ref","icon","type","innerRef","restProps","_excluded","_as","Link","aProps","linkProps","propsBySize","size","round","PROPS_BY_SIZE","presetProps","primary","PRESETS","secondary","default","_className","useClassname","displayName","_jsxs","Styled.Root","_objectSpread","loading","_jsx","Styled.Content","concat","defaultProps","rounded","display"],"mappings":"6dA4IO,SAASA,EAAOC,GACrB,IAAMC,SAAEA,EAAFC,UAAYA,EAAZC,SAAuBA,EAAvBC,KAAiCA,EAAjCC,GAAuCA,EAAvCC,GAA2CA,EAA3CC,OAA+CA,EAA/CC,QAAuDA,EAAvDC,IAAgEA,EAAhEC,KAAqEA,EAArEC,KAA2EA,EAA3EC,SAAiFA,GACrFZ,EADkGa,IAClGb,EADFc,GAGA,IAAMC,EAAMT,IAAOH,EAAW,SAAWC,EAAO,IAAMC,EAAKW,EAAO,UAClE,IAAMC,EAAiB,MAARF,GAAgBZ,EAA0C,GAA/B,CAAEC,KAAMA,GAAQC,EAAIE,OAAAA,GAC9D,IAAMW,EAA2B,iBAARH,GAAqBZ,EAAgC,GAArB,CAAEE,GAAIA,GAAMD,GACrE,IAAMe,EACJN,EAAUO,OAASP,EAAUQ,OAAQC,EAAcT,EAAUO,OAAc,GAC7E,IAAMG,EArCsBvB,CAAAA,GACxBA,EAAMwB,QAAgBC,EAAQD,QAC9BxB,EAAM0B,UAAkBD,EAAQC,UAC7BD,EAAQE,QAHa3B,CAqCmCA,GAC/D,IAAM4B,EAAaC,EAAa9B,EAAO+B,YAAa5B,GAEpD,OACE6B,EAACC,EAADC,EAAAA,EAAAA,EAAAA,EAAAA,EAAAA,EAAA,CACE3B,GAAIS,EACJb,UAAW0B,EACXjB,KAAc,WAARI,EAAmBJ,OAAAA,EACzBH,QAASL,GAAYU,EAAUqB,eAAsB1B,GACjDW,GACAF,GACAC,GACAK,GACAV,GATN,GAAA,CAUEV,SAAUA,EAEVM,IAAMA,GAAOG,EAZfX,SAAA,CAcGS,GAAQyB,EAAA,OAAA,CAAMjC,UAAU,OAAhBD,SAAwBS,IAChCT,GAAYkC,EAACC,EAAD,CAAgBlC,UAAS,GAAAmC,OAAKT,EAA9B,aAAA3B,SAAsDA,QAjEzEF,EAAOuC,aAAe,CACpBlB,KAAM,IACNmB,WACAC,QAAS,cACT7B,KAAM,UAGRZ,EAAO+B,YAAc"}
1
+ {"version":3,"file":"Button.js","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import { Link } from 'react-router-dom'\nimport { useClassname } from 'hooks/useClassname'\nimport { Display } from '../../mixins/display'\nimport { ResponsiveNamedProperty } from '../../mixins/responsive-property'\nimport { BaseProps, Tooltiped } from '../../shared/interfaces'\nimport { Color } from '../../mixins/color'\nimport { Anchor } from '../../components/Anchor'\nimport * as Styled from './style'\nimport { PRESETS, PROPS_BY_SIZE } from './default'\n\nexport interface ButtonProps\n extends BaseProps,\n Tooltiped,\n Display,\n Color,\n Color<'fontColor'>,\n ResponsiveNamedProperty<'padding'>,\n ResponsiveNamedProperty<'paddingTop'>,\n ResponsiveNamedProperty<'paddingRight'>,\n ResponsiveNamedProperty<'paddingBottom'>,\n ResponsiveNamedProperty<'paddingLeft'>,\n ResponsiveNamedProperty<'margin'>,\n ResponsiveNamedProperty<'marginTop'>,\n ResponsiveNamedProperty<'marginRight'>,\n ResponsiveNamedProperty<'marginBottom'>,\n ResponsiveNamedProperty<'marginLeft'>,\n ResponsiveNamedProperty<'fontSize'>,\n ResponsiveNamedProperty<'fluid', boolean>,\n ResponsiveNamedProperty<'width', 'auto' | 'l' | 'm' | 's' | 'xs' | number>,\n ResponsiveNamedProperty<'height', 'l' | 'm' | 's' | 'xs' | number> {\n /**\n * Node type\n */\n as?: 'div' | 'span' | 'a' | 'button' | typeof Link | typeof Anchor\n target?: string\n rel?: string\n /**\n * Link href\n */\n href?: string\n /**\n * React router link to\n */\n to?: string\n /**\n * Type for button element\n */\n type?: 'button' | 'submit' | 'reset'\n /**\n * Children react node\n */\n children?: React.ReactNode\n /**\n * Basic button\n */\n basic?: boolean\n /**\n * Disabled\n */\n disabled?: boolean\n /**\n * Is primary\n */\n primary?: boolean\n /**\n * Is secondary\n */\n secondary?: boolean\n /**\n * Is inverted\n */\n inverted?: boolean\n /**\n * Is rounded\n */\n rounded?: boolean\n /**\n * Is round (in a shape of circle)\n */\n round?: boolean\n /**\n * Indicates if there should not be any margin\n * between this button and the previous one\n */\n noSpacing?: boolean\n /**\n * Is in loading state\n */\n loading?: boolean\n /**\n * Button icon\n */\n icon?: React.ReactNode\n /** On click callback */\n onClick?: () => void\n /** Function to make ref */\n ref?: React.LegacyRef<HTMLDivElement>\n /**\n * Size\n */\n size?: 'l' | 'm' | 's' | 'xs'\n}\n\nButton.defaultProps = {\n size: 'm',\n rounded: true,\n display: 'inline-flex',\n type: 'button',\n}\n\nButton.displayName = 'Button'\n\nconst extractPresetByProps = (props: ButtonProps): Partial<ButtonProps> => {\n if (props.primary) return PRESETS.primary\n if (props.secondary) return PRESETS.secondary\n return PRESETS.default\n}\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n * - [`Display`](#/Миксины)\n * - [`Tooltiped`](#/Миксины)\n * - [`Color`](#/Миксины)\n * - [`Color<'fontColor'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'padding'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'paddingTop'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'paddingRight'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'paddingBottom'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'paddingLeft'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'margin'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'marginTop'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'marginRight'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'marginBottom'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'marginLeft'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'fontSize'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'fluid', boolean>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'width', 'auto' | 'l' | 'm' | 's' | 'xs' | number>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'height', 'l' | 'm' | 's' | 'xs' | number>`](#/Миксины)\n */\nexport function Button(props: ButtonProps) {\n const { children, className, disabled, href, to, as, target, onClick, ref, icon, type, innerRef, ...restProps } =\n props\n\n const _as = as || (disabled ? 'button' : href ? 'a' : to ? Link : 'button')\n const aProps = _as === 'a' && !disabled ? { href: href || to, target } : {}\n const linkProps = typeof _as !== 'string' && !disabled ? { to: to || href } : {}\n const propsBySize: Partial<ButtonProps> =\n restProps.size && !restProps.round ? PROPS_BY_SIZE[restProps.size] || {} : {}\n const presetProps: Partial<ButtonProps> = extractPresetByProps(props)\n const _className = useClassname(Button.displayName, className)\n const _contentClassName = useClassname(Button.displayName)\n\n return (\n <Styled.Root\n as={_as}\n className={_className}\n type={_as === 'button' ? type : undefined}\n onClick={disabled || restProps.loading ? undefined : onClick}\n {...propsBySize}\n {...aProps}\n {...linkProps}\n {...presetProps}\n {...restProps}\n disabled={disabled}\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref={(ref || innerRef) as any}\n >\n {icon && <span className='icon'>{icon}</span>}\n {children && <Styled.Content className={`${_contentClassName}__content`}>{children}</Styled.Content>}\n </Styled.Root>\n )\n}\n"],"names":["Button","props","children","className","disabled","href","to","as","target","onClick","ref","icon","type","innerRef","restProps","_excluded","_as","Link","aProps","linkProps","propsBySize","size","round","PROPS_BY_SIZE","presetProps","primary","PRESETS","secondary","default","_className","useClassname","displayName","_contentClassName","_jsxs","Styled.Root","_objectSpread","undefined","loading","_jsx","Styled.Content","concat","defaultProps","rounded","display"],"mappings":"6dA4IO,SAASA,EAAOC,GACrB,IAAMC,SAAEA,EAAFC,UAAYA,EAAZC,SAAuBA,EAAvBC,KAAiCA,EAAjCC,GAAuCA,EAAvCC,GAA2CA,EAA3CC,OAA+CA,EAA/CC,QAAuDA,EAAvDC,IAAgEA,EAAhEC,KAAqEA,EAArEC,KAA2EA,EAA3EC,SAAiFA,GACrFZ,EADkGa,IAClGb,EADFc,GAGA,IAAMC,EAAMT,IAAOH,EAAW,SAAWC,EAAO,IAAMC,EAAKW,EAAO,UAClE,IAAMC,EAAiB,MAARF,GAAgBZ,EAA0C,GAA/B,CAAEC,KAAMA,GAAQC,EAAIE,OAAAA,GAC9D,IAAMW,EAA2B,iBAARH,GAAqBZ,EAAgC,GAArB,CAAEE,GAAIA,GAAMD,GACrE,IAAMe,EACJN,EAAUO,OAASP,EAAUQ,OAAQC,EAAcT,EAAUO,OAAc,GAC7E,IAAMG,EArCsBvB,CAAAA,GACxBA,EAAMwB,QAAgBC,EAAQD,QAC9BxB,EAAM0B,UAAkBD,EAAQC,UAC7BD,EAAQE,QAHa3B,CAqCmCA,GAC/D,IAAM4B,EAAaC,EAAa9B,EAAO+B,YAAa5B,GACpD,IAAM6B,EAAoBF,EAAa9B,EAAO+B,aAE9C,OACEE,EAACC,EAADC,EAAAA,EAAAA,EAAAA,EAAAA,EAAAA,EAAA,CACE5B,GAAIS,EACJb,UAAW0B,EACXjB,KAAc,WAARI,EAAmBJ,OAAOwB,EAChC3B,QAASL,GAAYU,EAAUuB,aAAUD,EAAY3B,GACjDW,GACAF,GACAC,GACAK,GACAV,GATN,GAAA,CAUEV,SAAUA,EAEVM,IAAMA,GAAOG,EAZfX,SAAA,CAcGS,GAAQ2B,EAAA,OAAA,CAAMnC,UAAU,OAAhBD,SAAwBS,IAChCT,GAAYoC,EAACC,EAAD,CAAgBpC,UAAS,GAAAqC,OAAKR,EAA9B,aAAA9B,SAA6DA,QAlEhFF,EAAOyC,aAAe,CACpBpB,KAAM,IACNqB,WACAC,QAAS,cACT/B,KAAM,UAGRZ,EAAO+B,YAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"useClassname.js","sources":["../../../src/hooks/useClassname.ts"],"sourcesContent":["import cx from 'clsx'\nimport { useTheme } from 'styled-components'\n\nexport function useClassname(componentName: string, originalClassName: string | undefined) {\n const theme = useTheme()\n return cx(`${theme.classNamePrefix}-${componentName}`, originalClassName)\n}\n"],"names":["useClassname","componentName","originalClassName","theme","useTheme","cx","classNamePrefix"],"mappings":"iEAGO,SAASA,EAAaC,EAAuBC,GAClD,IAAMC,EAAQC,IACd,OAAOC,YAAMF,EAAMG,gBAAmBL,KAAAA,OAAAA,GAAiBC"}
1
+ {"version":3,"file":"useClassname.js","sources":["../../../src/hooks/useClassname.ts"],"sourcesContent":["import cx from 'clsx'\nimport { useTheme } from 'styled-components'\n\nexport function useClassname(componentName: string, originalClassName?: string) {\n const theme = useTheme()\n return cx(`${theme.classNamePrefix}-${componentName}`, originalClassName)\n}\n"],"names":["useClassname","componentName","originalClassName","theme","useTheme","cx","classNamePrefix"],"mappings":"iEAGO,SAASA,EAAaC,EAAuBC,GAClD,IAAMC,EAAQC,IACd,OAAOC,YAAMF,EAAMG,gBAAmBL,KAAAA,OAAAA,GAAiBC"}