@foxford/ui 2.15.1 → 2.16.0

package/components/Amount/Amount.js.map

@@ -1 +1 @@
-{"version":3,"file":"Amount.js","sources":["../../../../src/components/Amount/Amount.tsx"],"sourcesContent":["import { PureComponent } from 'react'\nimport cx from 'clsx'\nimport { ColorProperty } from 'mixins/color'\nimport { ResponsiveNamedProperty } from 'mixins/responsive-property'\nimport { DisplayProperty } from 'mixins/display'\nimport { BaseProps } from 'shared/interfaces'\nimport { Text } from '../Text'\nimport { CurrencyCodes, CURRENCY_MAP } from './data'\nimport * as Styled from './style'\n\nexport interface AmountProps extends BaseProps, ColorProperty, ResponsiveNamedProperty<'size'>, DisplayProperty {\n  /**\n   * Value for amount\n   */\n  value?: number\n  /**\n   * Digits after point\n   */\n  digitsAfterPoint?: number\n  /**\n   * Show zero minor part\n   */\n  showZeroMinorPart?: boolean\n  /**\n   * Separator of major and minor part of amount\n   */\n  separator?: string\n  /**\n   * International code of currency.\n   */\n  currency?: keyof typeof CurrencyCodes | string\n  /**\n   * Use Header component for display amount\n   */\n  isHeader?: boolean\n  /**\n   * Amount is not valid and will be crossed out with ```text-decoration: line-through```\n   */\n  crossedOut?: boolean\n  /**\n   * If need only currency symbol\n   */\n  onlyCurrency?: boolean\n}\n\nconst AMOUNT_MAJOR_PART_SIZE = 3\nconst ZERO_MINOR_PART_REGEXP = /^0+$/\nconst MINUS_SIGN_HTML_CODE = '\\u2212'\n\nfunction createSplitter(partSize: number): (_s: string) => string[] {\n  const parts = (str: string): string[] => {\n    const { length } = str\n\n    if (length <= partSize) {\n      return [str]\n    }\n\n    const from = length - partSize\n    const to = length\n\n    return [str.slice(from, to)].concat(parts(str.slice(0, from)))\n  }\n\n  return parts\n}\n\nfunction formatAmount(\n  value: AmountProps['value'] = 0,\n  digitsAfterPoint: AmountProps['digitsAfterPoint'],\n  currencyCode: AmountProps['currency']\n) {\n  const isNegative = value < 0\n\n  const valueAbs = Math.abs(value)\n  const valueAbsStr = valueAbs.toFixed(digitsAfterPoint)\n\n  const numberParts = valueAbsStr.split('.')\n  const majorPart = numberParts[0]\n  const minorPart = numberParts[1]\n\n  const amountSplitter = createSplitter(AMOUNT_MAJOR_PART_SIZE)\n\n  const majorPartFormatted = amountSplitter(majorPart).reverse().join(' ')\n\n  const formattedValueStr = majorPartFormatted + (minorPart ? `,${minorPart}` : '')\n\n  return {\n    majorPart: majorPartFormatted,\n    minorPart,\n    value: formattedValueStr,\n    isNegative,\n    currencySymbol: currencyCode ? Amount.getCurrencySymbol(currencyCode) : '',\n  }\n}\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n * - [`Color`](#/Миксины)\n * - [`ResponsiveNamedProperty<'size'>`](#/Миксины)\n */\nexport class Amount extends PureComponent<AmountProps> {\n  static displayName = 'Amount'\n  static defaultProps = {\n    isHeader: false,\n    showZeroMinorPart: false,\n    crossedOut: false,\n    digitsAfterPoint: 2,\n    separator: ',',\n    onlyCurrency: false,\n  }\n\n  static getCurrencySymbol(currencyCode: keyof typeof CurrencyCodes | string) {\n    return CURRENCY_MAP[currencyCode] || currencyCode\n  }\n\n  renderMinorPart(minorPart: string) {\n    const { showZeroMinorPart, separator } = this.props\n\n    let needMinorPart = false\n\n    if (minorPart) {\n      needMinorPart = true\n\n      if (!showZeroMinorPart && ZERO_MINOR_PART_REGEXP.test(minorPart)) {\n        needMinorPart = false\n      }\n    }\n\n    if (needMinorPart) {\n      return (\n        <span className='minor-container'>\n          <span className='separator'>{separator}</span>\n          <span className='minor'>{minorPart}</span>\n        </span>\n      )\n    }\n\n    return null\n  }\n\n  renderCurrencySymbol = (currencySymbol: string) => (\n    <span style={{ position: 'relative' }}>\n      {this.props.currency === 'RUR' ? (\n        <span\n          style={{\n            position: 'absolute',\n            width: 0,\n            opacity: 0,\n            visibility: 'hidden',\n          }}\n        >\n          руб.\n        </span>\n      ) : null}\n      <span>{` ${currencySymbol}`}</span>\n    </span>\n  )\n\n  render() {\n    const { value, digitsAfterPoint, currency, isHeader, className, style, crossedOut, onlyCurrency, ...rest } =\n      this.props\n\n    const { majorPart, minorPart, isNegative, currencySymbol } = formatAmount(value, digitsAfterPoint, currency)\n\n    const classNames = cx('amount', className)\n\n    const amountInner = (\n      <Styled.Root className={classNames} style={style} crossedOut={crossedOut}>\n        {!onlyCurrency ? (\n          <>\n            <span className='major'>\n              {isNegative && MINUS_SIGN_HTML_CODE}\n              {majorPart}\n            </span>\n            {this.renderMinorPart(minorPart)}\n          </>\n        ) : null}\n        {currency && this.renderCurrencySymbol(currencySymbol)}\n      </Styled.Root>\n    )\n\n    const Element = isHeader ? Text.Heading : Text\n\n    return (\n      <Element {...rest} as='span'>\n        {amountInner}\n      </Element>\n    )\n  }\n}\n"],"names":["ZERO_MINOR_PART_REGEXP","createSplitter","partSize","parts","str","length","from","slice","concat","Amount","PureComponent","constructor","super","arguments","this","renderCurrencySymbol","currencySymbol","_jsxs","style","position","children","props","currency","_jsx","width","opacity","visibility","static","currencyCode","CURRENCY_MAP","renderMinorPart","minorPart","showZeroMinorPart","separator","needMinorPart","test","className","render","_this$props","value","digitsAfterPoint","isHeader","crossedOut","onlyCurrency","rest","_objectWithoutProperties","_excluded","majorPart","isNegative","r","e","t","undefined","numberParts","Math","abs","toFixed","split","majorPartFormatted","reverse","join","formattedValueStr","getCurrencySymbol","classNames","cx","amountInner","Styled.Root","_Fragment","Text","Heading","_objectSpread","as","displayName","defaultProps"],"mappings":"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"}
+{"version":3,"file":"Amount.js","sources":["../../../../src/components/Amount/Amount.tsx"],"sourcesContent":["import { PureComponent } from 'react'\nimport cx from 'clsx'\nimport type { ColorProperty } from 'mixins/color'\nimport type { DisplayProperty } from 'mixins/display'\nimport type { BaseProps, ResponsiveSizeProps } from 'shared/interfaces'\nimport { Text } from '../Text'\nimport { CurrencyCodes, CURRENCY_MAP } from './data'\nimport * as Styled from './style'\n\nexport interface AmountProps extends ResponsiveSizeProps, BaseProps, ColorProperty, DisplayProperty {\n  /**\n   * Value for amount\n   */\n  value?: number\n  /**\n   * Digits after point\n   */\n  digitsAfterPoint?: number\n  /**\n   * Show zero minor part\n   */\n  showZeroMinorPart?: boolean\n  /**\n   * Separator of major and minor part of amount\n   */\n  separator?: string\n  /**\n   * International code of currency.\n   */\n  currency?: keyof typeof CurrencyCodes | string\n  /**\n   * Use Header component for display amount\n   */\n  isHeader?: boolean\n  /**\n   * Amount is not valid and will be crossed out with ```text-decoration: line-through```\n   */\n  crossedOut?: boolean\n  /**\n   * If need only currency symbol\n   */\n  onlyCurrency?: boolean\n}\n\nconst AMOUNT_MAJOR_PART_SIZE = 3\nconst ZERO_MINOR_PART_REGEXP = /^0+$/\nconst MINUS_SIGN_HTML_CODE = '\\u2212'\n\nfunction createSplitter(partSize: number): (_s: string) => string[] {\n  const parts = (str: string): string[] => {\n    const { length } = str\n\n    if (length <= partSize) {\n      return [str]\n    }\n\n    const from = length - partSize\n    const to = length\n\n    return [str.slice(from, to)].concat(parts(str.slice(0, from)))\n  }\n\n  return parts\n}\n\nfunction formatAmount(\n  value: AmountProps['value'] = 0,\n  digitsAfterPoint: AmountProps['digitsAfterPoint'],\n  currencyCode: AmountProps['currency']\n) {\n  const isNegative = value < 0\n\n  const valueAbs = Math.abs(value)\n  const valueAbsStr = valueAbs.toFixed(digitsAfterPoint)\n\n  const numberParts = valueAbsStr.split('.')\n  const majorPart = numberParts[0]\n  const minorPart = numberParts[1]\n\n  const amountSplitter = createSplitter(AMOUNT_MAJOR_PART_SIZE)\n\n  const majorPartFormatted = amountSplitter(majorPart).reverse().join(' ')\n\n  const formattedValueStr = majorPartFormatted + (minorPart ? `,${minorPart}` : '')\n\n  return {\n    majorPart: majorPartFormatted,\n    minorPart,\n    value: formattedValueStr,\n    isNegative,\n    currencySymbol: currencyCode ? Amount.getCurrencySymbol(currencyCode) : '',\n  }\n}\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n * - [`Color`](#/Миксины)\n * - [`ResponsiveNamedProperty<'size'>`](#/Миксины)\n */\nexport class Amount extends PureComponent<AmountProps> {\n  static displayName = 'Amount'\n  static defaultProps = {\n    isHeader: false,\n    showZeroMinorPart: false,\n    crossedOut: false,\n    digitsAfterPoint: 2,\n    separator: ',',\n    onlyCurrency: false,\n  }\n\n  static getCurrencySymbol(currencyCode: keyof typeof CurrencyCodes | string) {\n    return CURRENCY_MAP[currencyCode] || currencyCode\n  }\n\n  renderMinorPart(minorPart: string) {\n    const { showZeroMinorPart, separator } = this.props\n\n    let needMinorPart = false\n\n    if (minorPart) {\n      needMinorPart = true\n\n      if (!showZeroMinorPart && ZERO_MINOR_PART_REGEXP.test(minorPart)) {\n        needMinorPart = false\n      }\n    }\n\n    if (needMinorPart) {\n      return (\n        <span className='minor-container'>\n          <span className='separator'>{separator}</span>\n          <span className='minor'>{minorPart}</span>\n        </span>\n      )\n    }\n\n    return null\n  }\n\n  renderCurrencySymbol = (currencySymbol: string) => (\n    <span style={{ position: 'relative' }}>\n      {this.props.currency === 'RUR' ? (\n        <span\n          style={{\n            position: 'absolute',\n            width: 0,\n            opacity: 0,\n            visibility: 'hidden',\n          }}\n        >\n          руб.\n        </span>\n      ) : null}\n      <span>{` ${currencySymbol}`}</span>\n    </span>\n  )\n\n  render() {\n    const { value, digitsAfterPoint, currency, isHeader, className, style, crossedOut, onlyCurrency, ...rest } =\n      this.props\n\n    const { majorPart, minorPart, isNegative, currencySymbol } = formatAmount(value, digitsAfterPoint, currency)\n\n    const classNames = cx('amount', className)\n\n    const amountInner = (\n      <Styled.Root className={classNames} style={style} crossedOut={crossedOut}>\n        {!onlyCurrency ? (\n          <>\n            <span className='major'>\n              {isNegative && MINUS_SIGN_HTML_CODE}\n              {majorPart}\n            </span>\n            {this.renderMinorPart(minorPart)}\n          </>\n        ) : null}\n        {currency && this.renderCurrencySymbol(currencySymbol)}\n      </Styled.Root>\n    )\n\n    const Element = isHeader ? Text.Heading : Text\n\n    return (\n      <Element {...rest} as='span'>\n        {amountInner}\n      </Element>\n    )\n  }\n}\n"],"names":["ZERO_MINOR_PART_REGEXP","createSplitter","partSize","parts","str","length","from","slice","concat","Amount","PureComponent","constructor","super","arguments","this","renderCurrencySymbol","currencySymbol","_jsxs","style","position","children","props","currency","_jsx","width","opacity","visibility","static","currencyCode","CURRENCY_MAP","renderMinorPart","minorPart","showZeroMinorPart","separator","needMinorPart","test","className","render","_this$props","value","digitsAfterPoint","isHeader","crossedOut","onlyCurrency","rest","_objectWithoutProperties","_excluded","majorPart","isNegative","r","e","t","undefined","numberParts","Math","abs","toFixed","split","majorPartFormatted","reverse","join","formattedValueStr","getCurrencySymbol","classNames","cx","amountInner","Styled.Root","_Fragment","Text","Heading","_objectSpread","as","displayName","defaultProps"],"mappings":"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"}

package/components/ArrowBadge/ArrowBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"ArrowBadge.js","sources":["../../../../src/components/ArrowBadge/ArrowBadge.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport type { TextProps } from 'shared/interfaces'\nimport * as Styled from './style'\nimport type { ArrowBadgeProps } from './types'\nimport { SIZES } from './constants'\n\nconst COMPONENT_NAME = 'ArrowBadge'\n\n/**\n *\n * Component interface extends:\n * - [`ResponsiveSizeProps`](#/Interfaces)\n * - [`ResponsiveMarginProps`](#/Interfaces)\n * - [`ColorSchemaProps`](#/Interfaces)\n * - [`ColorPaletteProps<keyof ArrowBadgePalette>`](#/Interfaces)\n * - [`TypographyProps`](#/Interfaces)\n * - [`BaseProps`](#/Interfaces)\n * - [`React.ComponentPropsWithRef<'div'>`](#/Interfaces)\n */\nconst ArrowBadge: React.ForwardRefExoticComponent<ArrowBadgeProps> = withMergedProps<ArrowBadgeProps, HTMLDivElement>(\n  forwardRef((props, ref) => {\n    const { size = 'm', textProps = {}, children, left, right, fancy, ...restProps } = props\n\n    const baseTextProps: TextProps = { as: 'div', size: 'inherit', color: 'inherit' }\n\n    return (\n      <Styled.Root {...restProps} size={size} ref={ref}>\n        <Styled.Edge left={left} right={right} fancy={fancy} />\n        <Styled.Content>\n          {typeof children === 'function' ? (\n            children({ baseTextProps, textProps })\n          ) : (\n            <Text {...baseTextProps} {...textProps}>\n              {children}\n            </Text>\n          )}\n        </Styled.Content>\n        <Styled.Edge left={left} right={right} fancy={fancy} after />\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: SIZES,\n  }\n)\n\nexport { ArrowBadge, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","ArrowBadge","withMergedProps","forwardRef","props","ref","size","textProps","children","left","right","fancy","restProps","_excluded","baseTextProps","as","color","_jsxs","Styled.Root","_jsx","Styled.Edge","Styled.Content","Text","after","displayName","sizes","SIZES"],"mappings":"2cAQMA,IAAAA,EAAiB,aAajBC,IAAAA,EAA+DC,EACnEC,GAAW,CAACC,EAAOC,KACjB,IAAMC,KAAEA,EAAO,IAATC,UAAcA,EAAY,GAA1BC,SAA8BA,EAA9BC,KAAwCA,EAAxCC,MAA8CA,EAA9CC,MAAqDA,GAAwBP,EAAdQ,IAAcR,EAAnFS,GAEA,IAAMC,EAA2B,CAAEC,GAAI,MAAOT,KAAM,UAAWU,MAAO,WAEtE,OACEC,EAACC,SAAgBN,GAAjB,GAAA,CAA4BN,KAAMA,EAAMD,IAAKA,EAA7CG,SACE,CAAAW,EAACC,EAAD,CAAaX,KAAMA,EAAMC,MAAOA,EAAOC,MAAOA,IAC9CQ,EAACE,EAAD,CAAAb,SACuB,mBAAbA,EACNA,EAAS,CAAEM,cAAAA,EAAeP,UAAAA,IAE1BY,EAACG,EAASR,EAAAA,EAAAA,EAAAA,GAAAA,GAAmBP,GAA7B,GAAA,CAAAC,SACGA,OAIPW,EAACC,EAAD,CAAaX,KAAMA,EAAMC,MAAOA,EAAOC,MAAOA,EAAOY,OAAK,WAIhE,CACEC,YApCmB,aAqCnBC,MAAOC"}
+{"version":3,"file":"ArrowBadge.js","sources":["../../../../src/components/ArrowBadge/ArrowBadge.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport type { TextProps } from 'components/Text'\nimport * as Styled from './style'\nimport type { ArrowBadgeProps } from './types'\nimport { SIZES } from './constants'\n\nconst COMPONENT_NAME = 'ArrowBadge'\n\n/**\n *\n * Component interface extends:\n * - [`ResponsiveSizeProps`](#/Interfaces)\n * - [`ResponsiveMarginProps`](#/Interfaces)\n * - [`ColorSchemaProps`](#/Interfaces)\n * - [`ColorPaletteProps<keyof ArrowBadgePalette>`](#/Interfaces)\n * - [`TypographyProps`](#/Interfaces)\n * - [`BaseProps`](#/Interfaces)\n * - [`React.ComponentPropsWithRef<'div'>`](#/Interfaces)\n */\nconst ArrowBadge: React.ForwardRefExoticComponent<ArrowBadgeProps> = withMergedProps<ArrowBadgeProps, HTMLDivElement>(\n  forwardRef((props, ref) => {\n    const { size = 'm', textProps = {}, children, left, right, fancy, ...restProps } = props\n\n    const baseTextProps: TextProps = { as: 'div', size: 'inherit', color: 'inherit' }\n\n    return (\n      <Styled.Root {...restProps} size={size} ref={ref}>\n        <Styled.Edge left={left} right={right} fancy={fancy} />\n        <Styled.Content>\n          {typeof children === 'function' ? (\n            children({ baseTextProps, textProps })\n          ) : (\n            <Text {...baseTextProps} {...textProps}>\n              {children}\n            </Text>\n          )}\n        </Styled.Content>\n        <Styled.Edge left={left} right={right} fancy={fancy} after />\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: SIZES,\n  }\n)\n\nexport { ArrowBadge, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","ArrowBadge","withMergedProps","forwardRef","props","ref","size","textProps","children","left","right","fancy","restProps","_excluded","baseTextProps","as","color","_jsxs","Styled.Root","_jsx","Styled.Edge","Styled.Content","Text","after","displayName","sizes","SIZES"],"mappings":"2cAQMA,IAAAA,EAAiB,aAajBC,IAAAA,EAA+DC,EACnEC,GAAW,CAACC,EAAOC,KACjB,IAAMC,KAAEA,EAAO,IAATC,UAAcA,EAAY,GAA1BC,SAA8BA,EAA9BC,KAAwCA,EAAxCC,MAA8CA,EAA9CC,MAAqDA,GAAwBP,EAAdQ,IAAcR,EAAnFS,GAEA,IAAMC,EAA2B,CAAEC,GAAI,MAAOT,KAAM,UAAWU,MAAO,WAEtE,OACEC,EAACC,SAAgBN,GAAjB,GAAA,CAA4BN,KAAMA,EAAMD,IAAKA,EAA7CG,SACE,CAAAW,EAACC,EAAD,CAAaX,KAAMA,EAAMC,MAAOA,EAAOC,MAAOA,IAC9CQ,EAACE,EAAD,CAAAb,SACuB,mBAAbA,EACNA,EAAS,CAAEM,cAAAA,EAAeP,UAAAA,IAE1BY,EAACG,EAASR,EAAAA,EAAAA,EAAAA,GAAAA,GAAmBP,GAA7B,GAAA,CAAAC,SACGA,OAIPW,EAACC,EAAD,CAAaX,KAAMA,EAAMC,MAAOA,EAAOC,MAAOA,EAAOY,OAAK,WAIhE,CACEC,YApCmB,aAqCnBC,MAAOC"}

package/components/ArrowBadge/style.js

@@ -1,2 +1,2 @@
-import o from'@babel/runtime/helpers/objectSpread2';import r,{css as n}from'styled-components';import{responsiveSize as a}from'../../mixins/size.js';import{responsiveMargin as t}from'../../mixins/margin.js';import{createShouldForwardProp as e}from'../../shared/utils/style.js';import{getColor as c}from'../../mixins/color.js';import{focus as i}from'../../mixins/focus.js';import s from'./images/arrow.module.svg.js';import l from'./images/rectangle.module.svg.js';import m from'./images/fancy.module.svg.js';var d=e();var g=r.div.withConfig({componentId:"fox-ui__sc-gzccd8-0"})(["flex-shrink:0;display:flex;align-items:center;height:100%;padding:0 1px;margin:0 -1px;"]);var p=r.svg.withConfig({shouldForwardProp:()=>!1}).attrs((o=>{var r=l;return o.fancy&&(r=m),(o.right&&o.after||o.left&&!o.after)&&(r=s),{as:r}})).withConfig({componentId:"fox-ui__sc-gzccd8-1"})(["flex-shrink:0;height:100%;",""],(o=>o.after&&'transform: rotate(180deg);'));var f=o=>"\n  & > ".concat(g," {\n    color: ").concat(o.color,";\n    background-color: ").concat(o.backgroundColor,";\n  }\n  & > ").concat(p," {\n    color: ").concat(o.backgroundColor,";\n  }\n");var u={primary:n(["",""],(r=>f(o({color:r.theme.colors['content-onmain-primary'],backgroundColor:r.theme.colors['bg-brand-primary-200']},r.palette)))),secondary:n(["",""],(r=>f(o({color:r.theme.colors['content-onmain-primary'],backgroundColor:r.theme.colors['bg-brand-secondary-200']},r.palette)))),tertiary:n(["",""],(r=>f(o({color:r.theme.colors['content-onmain-primary'],backgroundColor:r.theme.colors['bg-brand-tertiary-200']},r.palette)))),quaternary:n(["",""],(r=>f(o({color:r.theme.colors['content-onmain-primary'],backgroundColor:r.theme.colors['bg-brand-quaternary-200']},r.palette))))};var h=r.div.withConfig({shouldForwardProp:d}).attrs({dynamicSizeDeclaration:function(o,r,n){return{height:'1.8em',fontSize:"".concat(arguments.length<=0?void 0:o).concat(arguments.length<=2?void 0:n)}}}).withConfig({componentId:"fox-ui__sc-gzccd8-2"})(["box-sizing:border-box;isolation:isolate;display:inline-flex;width:max-content;flex-shrink:0;"," "," "," "," "," "," ",""],(o=>o.quaternary?u.quaternary:o.tertiary?u.tertiary:o.secondary?u.secondary:u.primary),i,a,t,(o=>o.cursor&&"cursor: ".concat(o.cursor,";")),(o=>o.color&&"& > ".concat(g," {\n       color: ").concat(c(o.color,o),";\n     }")),(o=>o.backgroundColor&&"& > ".concat(g," {\n       background-color: ").concat(c(o.backgroundColor,o),";\n     }\n     & > ").concat(p," {\n       color: ").concat(c(o.backgroundColor,o),";\n     }")));export{g as Content,p as Edge,h as Root};
+import o from'@babel/runtime/helpers/objectSpread2';import r,{css as n}from'styled-components';import{responsiveSize as a}from'../../mixins/size.js';import{responsiveMargin as t}from'../../mixins/margin.js';import{createShouldForwardProp as e}from'../../shared/utils/style.js';import{getColor as c}from'../../mixins/color.js';import{focus as i}from'../../mixins/focus.js';import s from'./images/arrow.module.svg.js';import l from'./images/rectangle.module.svg.js';import m from'./images/fancy.module.svg.js';var d=e();var g=r.div.withConfig({componentId:"fox-ui__sc-gzccd8-0"})(["flex-shrink:0;display:flex;align-items:center;height:100%;padding:0 1px;margin:0 -1px;"]);var p=r.svg.withConfig({shouldForwardProp:()=>!1}).attrs((o=>{var r=l;return o.fancy&&(r=m),(o.right&&o.after||o.left&&!o.after)&&(r=s),{as:r}})).withConfig({componentId:"fox-ui__sc-gzccd8-1"})(["flex-shrink:0;height:100%;",""],(o=>o.after&&'transform: rotate(180deg);'));var f=o=>"\n  & > ".concat(g," {\n    color: ").concat(o.color,";\n    background-color: ").concat(o.backgroundColor,";\n  }\n  & > ").concat(p," {\n    color: ").concat(o.backgroundColor,";\n  }\n");var u={primary:n(["",""],(r=>f(o({color:r.theme.colors['content-onmain-primary'],backgroundColor:r.theme.colors['bg-brand-primary-200']},r.palette)))),secondary:n(["",""],(r=>f(o({color:r.theme.colors['content-onmain-primary'],backgroundColor:r.theme.colors['bg-brand-secondary-200']},r.palette)))),tertiary:n(["",""],(r=>f(o({color:r.theme.colors['content-onmain-primary'],backgroundColor:r.theme.colors['bg-brand-tertiary-200']},r.palette)))),quaternary:n(["",""],(r=>f(o({color:r.theme.colors['content-onmain-primary'],backgroundColor:r.theme.colors['bg-brand-quaternary-200']},r.palette))))};var h=r.div.withConfig({shouldForwardProp:d}).attrs({dynamicSizeDeclaration:(o,r,n)=>({height:'1.8em',[r]:'string'==typeof o?o:"".concat(o).concat(n)})}).withConfig({componentId:"fox-ui__sc-gzccd8-2"})(["box-sizing:border-box;isolation:isolate;display:inline-flex;width:max-content;flex-shrink:0;"," "," "," "," "," "," ",""],(o=>o.quaternary?u.quaternary:o.tertiary?u.tertiary:o.secondary?u.secondary:u.primary),i,a,t,(o=>o.cursor&&"cursor: ".concat(o.cursor,";")),(o=>o.color&&"& > ".concat(g," {\n       color: ").concat(c(o.color,o),";\n     }")),(o=>o.backgroundColor&&"& > ".concat(g," {\n       background-color: ").concat(c(o.backgroundColor,o),";\n     }\n     & > ").concat(p," {\n       color: ").concat(c(o.backgroundColor,o),";\n     }")));export{g as Content,p as Edge,h as Root};
 //# sourceMappingURL=style.js.map

package/components/ArrowBadge/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/ArrowBadge/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport type { ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { responsiveSize } from 'mixins/size'\nimport { responsiveMargin } from 'mixins/margin'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport type { DynamicSizeDeclaration } from 'shared/interfaces'\nimport { getColor } from 'mixins/color'\nimport { focus } from 'mixins/focus'\nimport type { StyledArrowBadgeProps, StyledArrowBadgeEdgeProps, ArrowBadgePalette } from './types'\nimport Arrow from './images/arrow.module.svg'\nimport Rectangle from './images/rectangle.module.svg'\nimport Fancy from './images/fancy.module.svg'\n\nconst shouldForwardArrowBadgeProp = createShouldForwardProp()\n\nexport const Content = styled.div`\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n  height: 100%;\n  padding: 0 1px;\n  margin: 0 -1px;\n`\n\nexport const Edge = styled.svg\n  .withConfig({ shouldForwardProp: () => false })\n  .attrs((props: StyledArrowBadgeEdgeProps) => {\n    let Shape = Rectangle\n\n    if (props.fancy) Shape = Fancy\n    if ((props.right && props.after) || (props.left && !props.after)) Shape = Arrow\n\n    return { as: Shape }\n  })<StyledArrowBadgeEdgeProps>`\n  flex-shrink: 0;\n  height: 100%;\n  ${(props) => props.after && 'transform: rotate(180deg);'}\n`\n\nconst template = (palette: ArrowBadgePalette) => `\n  & > ${Content} {\n    color: ${palette.color};\n    background-color: ${palette.backgroundColor};\n  }\n  & > ${Edge} {\n    color: ${palette.backgroundColor};\n  }\n`\n\nconst COLOR_SCHEMA = {\n  primary: css<StyledArrowBadgeProps>`\n    ${(props) =>\n      template({\n        color: props.theme.colors['content-onmain-primary'],\n        backgroundColor: props.theme.colors['bg-brand-primary-200'],\n        ...props.palette,\n      })}\n  `,\n  secondary: css<StyledArrowBadgeProps>`\n    ${(props) =>\n      template({\n        color: props.theme.colors['content-onmain-primary'],\n        backgroundColor: props.theme.colors['bg-brand-secondary-200'],\n        ...props.palette,\n      })}\n  `,\n  tertiary: css<StyledArrowBadgeProps>`\n    ${(props) =>\n      template({\n        color: props.theme.colors['content-onmain-primary'],\n        backgroundColor: props.theme.colors['bg-brand-tertiary-200'],\n        ...props.palette,\n      })}\n  `,\n  quaternary: css<StyledArrowBadgeProps>`\n    ${(props) =>\n      template({\n        color: props.theme.colors['content-onmain-primary'],\n        backgroundColor: props.theme.colors['bg-brand-quaternary-200'],\n        ...props.palette,\n      })}\n  `,\n}\n\nconst colorSchema = (props: ThemedStyledProps<StyledArrowBadgeProps, DefaultTheme>) => {\n  if (props.quaternary) return COLOR_SCHEMA.quaternary\n  if (props.tertiary) return COLOR_SCHEMA.tertiary\n  if (props.secondary) return COLOR_SCHEMA.secondary\n\n  return COLOR_SCHEMA.primary\n}\n\nexport const Root = styled.div\n  .withConfig<StyledArrowBadgeProps>({\n    shouldForwardProp: shouldForwardArrowBadgeProp,\n  })\n  .attrs({\n    dynamicSizeDeclaration: (...args: Parameters<DynamicSizeDeclaration>) => {\n      return {\n        height: '1.8em',\n        fontSize: `${args[0]}${args[2]}`,\n      }\n    },\n  })`\n  box-sizing: border-box;\n  isolation: isolate;\n  display: inline-flex;\n  width: max-content;\n  flex-shrink: 0;\n\n  ${colorSchema}\n  ${focus}\n  ${responsiveSize}\n  ${responsiveMargin}\n\n  ${(props) => props.cursor && `cursor: ${props.cursor};`}\n  ${(props) =>\n    props.color &&\n    `& > ${Content} {\n       color: ${getColor(props.color, props)};\n     }`}\n  ${(props) =>\n    props.backgroundColor &&\n    `& > ${Content} {\n       background-color: ${getColor(props.backgroundColor, props)};\n     }\n     & > ${Edge} {\n       color: ${getColor(props.backgroundColor, props)};\n     }`}\n`\n"],"names":["shouldForwardArrowBadgeProp","createShouldForwardProp","Content","styled","div","withConfig","componentId","Edge","svg","shouldForwardProp","attrs","props","Shape","Rectangle","fancy","Fancy","right","after","left","Arrow","as","template","palette","concat","color","backgroundColor","COLOR_SCHEMA","primary","css","_objectSpread","theme","colors","secondary","tertiary","quaternary","Root","dynamicSizeDeclaration","o","r","n","height","fontSize","arguments","length","undefined","focus","responsiveSize","responsiveMargin","cursor","getColor"],"mappings":"4fAaA,IAAMA,EAA8BC,IAEvBC,IAAAA,EAAUC,EAAOC,IAAVC,WAAA,CAAAC,YAAA,uBAAGH,CAAhB,CAAA,2FASA,IAAMI,EAAOJ,EAAOK,IACxBH,WAAW,CAAEI,kBAAmB,SAChCC,OAAOC,IACN,IAAIC,EAAQC,EAKZ,OAHIF,EAAMG,QAAOF,EAAQG,IACpBJ,EAAMK,OAASL,EAAMM,OAAWN,EAAMO,OAASP,EAAMM,SAAQL,EAAQO,GAEnE,CAAEC,GAAIR,MARAP,WAAA,CAAAC,YAAA,uBAAGH,CAAH,CAAA,6BAAA,KAYZQ,GAAUA,EAAMM,OAAS,+BAG9B,IAAMI,EAAYC,qBACVpB,EADS,mBAAAqB,OAEJD,EAAQE,0CACGF,EAAQG,gBAExBlB,kBAAAA,OAAAA,4BACKe,EAAQG,gBANrB,YAUA,IAAMC,EAAe,CACnBC,QAASC,EACJjB,CAAAA,GAAAA,KAAAA,GACDU,EAAQQ,EAAA,CACNL,MAAOb,EAAMmB,MAAMC,OAAO,0BAC1BN,gBAAiBd,EAAMmB,MAAMC,OAAO,yBACjCpB,EAAMW,YAGfU,UAAWJ,EACNjB,CAAAA,GAAAA,KAAAA,GACDU,EAAQQ,EAAA,CACNL,MAAOb,EAAMmB,MAAMC,OAAO,0BAC1BN,gBAAiBd,EAAMmB,MAAMC,OAAO,2BACjCpB,EAAMW,YAGfW,SAAUL,EACLjB,CAAAA,GAAAA,KAAAA,GACDU,EAAQQ,EAAA,CACNL,MAAOb,EAAMmB,MAAMC,OAAO,0BAC1BN,gBAAiBd,EAAMmB,MAAMC,OAAO,0BACjCpB,EAAMW,YAGfY,WAAYN,EACPjB,CAAAA,GAAAA,KAAAA,GACDU,EAAQQ,EAAA,CACNL,MAAOb,EAAMmB,MAAMC,OAAO,0BAC1BN,gBAAiBd,EAAMmB,MAAMC,OAAO,4BACjCpB,EAAMW,aAaV,IAAMa,EAAOhC,EAAOC,IACxBC,WAAkC,CACjCI,kBAAmBT,IAEpBU,MAAM,CACL0B,uBAAwB,SAAAC,EAAAC,EAAAC,GACtB,MAAO,CACLC,OAAQ,QACRC,SAAQ,GAAAlB,OAAAmB,UAAAC,QAAA,OAAAC,EAHYP,GAGZd,OAAAmB,UAAAC,QAAA,OAAA,EAHYJ,OALXlC,WAAA,CAAAC,YAAA,uBAAGH,CAAH,CAAA,+FAAA,IAAA,IAAA,IAAA,IAAA,IAAA,IAAA,KARIQ,GACfA,EAAMuB,WAAmBR,EAAaQ,WACtCvB,EAAMsB,SAAiBP,EAAaO,SACpCtB,EAAMqB,UAAkBN,EAAaM,UAElCN,EAAaC,SAsBlBkB,EACAC,EACAC,GAECpC,GAAUA,EAAMqC,QAAqBrC,WAAAA,OAAAA,EAAMqC,OAvB/B,OAwBZrC,GACDA,EAAMa,OAAN,OAAAD,OACOrB,EADP,sBAAAqB,OAEY0B,EAAStC,EAAMa,MAAOb,GAFlC,eAICA,GACDA,EAAMc,iBACCvB,OAAAA,OAAAA,EACgB+C,iCAAAA,OAAAA,EAAStC,EAAMc,gBAAiBd,GAEhDJ,wBAAAA,OAAAA,+BACK0C,EAAStC,EAAMc,gBAAiBd"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/ArrowBadge/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport type { ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { responsiveSize } from 'mixins/size'\nimport { responsiveMargin } from 'mixins/margin'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { getColor } from 'mixins/color'\nimport { focus } from 'mixins/focus'\nimport type { StyledArrowBadgeProps, StyledArrowBadgeEdgeProps, ArrowBadgePalette } from './types'\nimport Arrow from './images/arrow.module.svg'\nimport Rectangle from './images/rectangle.module.svg'\nimport Fancy from './images/fancy.module.svg'\n\nconst shouldForwardArrowBadgeProp = createShouldForwardProp()\n\nexport const Content = styled.div`\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n  height: 100%;\n  padding: 0 1px;\n  margin: 0 -1px;\n`\n\nexport const Edge = styled.svg\n  .withConfig({ shouldForwardProp: () => false })\n  .attrs((props: StyledArrowBadgeEdgeProps) => {\n    let Shape = Rectangle\n\n    if (props.fancy) Shape = Fancy\n    if ((props.right && props.after) || (props.left && !props.after)) Shape = Arrow\n\n    return { as: Shape }\n  })<StyledArrowBadgeEdgeProps>`\n  flex-shrink: 0;\n  height: 100%;\n  ${(props) => props.after && 'transform: rotate(180deg);'}\n`\n\nconst template = (palette: ArrowBadgePalette) => `\n  & > ${Content} {\n    color: ${palette.color};\n    background-color: ${palette.backgroundColor};\n  }\n  & > ${Edge} {\n    color: ${palette.backgroundColor};\n  }\n`\n\nconst COLOR_SCHEMA = {\n  primary: css<StyledArrowBadgeProps>`\n    ${(props) =>\n      template({\n        color: props.theme.colors['content-onmain-primary'],\n        backgroundColor: props.theme.colors['bg-brand-primary-200'],\n        ...props.palette,\n      })}\n  `,\n  secondary: css<StyledArrowBadgeProps>`\n    ${(props) =>\n      template({\n        color: props.theme.colors['content-onmain-primary'],\n        backgroundColor: props.theme.colors['bg-brand-secondary-200'],\n        ...props.palette,\n      })}\n  `,\n  tertiary: css<StyledArrowBadgeProps>`\n    ${(props) =>\n      template({\n        color: props.theme.colors['content-onmain-primary'],\n        backgroundColor: props.theme.colors['bg-brand-tertiary-200'],\n        ...props.palette,\n      })}\n  `,\n  quaternary: css<StyledArrowBadgeProps>`\n    ${(props) =>\n      template({\n        color: props.theme.colors['content-onmain-primary'],\n        backgroundColor: props.theme.colors['bg-brand-quaternary-200'],\n        ...props.palette,\n      })}\n  `,\n}\n\nconst colorSchema = (props: ThemedStyledProps<StyledArrowBadgeProps, DefaultTheme>) => {\n  if (props.quaternary) return COLOR_SCHEMA.quaternary\n  if (props.tertiary) return COLOR_SCHEMA.tertiary\n  if (props.secondary) return COLOR_SCHEMA.secondary\n\n  return COLOR_SCHEMA.primary\n}\n\nexport const Root = styled.div\n  .withConfig<StyledArrowBadgeProps>({\n    shouldForwardProp: shouldForwardArrowBadgeProp,\n  })\n  .attrs(<Required<Pick<StyledArrowBadgeProps, 'dynamicSizeDeclaration'>>>{\n    dynamicSizeDeclaration: (size, cssProperty, cssUnit) => {\n      return {\n        height: '1.8em',\n        [cssProperty]: typeof size === 'string' ? size : `${size}${cssUnit}`,\n      }\n    },\n  })`\n  box-sizing: border-box;\n  isolation: isolate;\n  display: inline-flex;\n  width: max-content;\n  flex-shrink: 0;\n\n  ${colorSchema}\n  ${focus}\n  ${responsiveSize}\n  ${responsiveMargin}\n\n  ${(props) => props.cursor && `cursor: ${props.cursor};`}\n  ${(props) =>\n    props.color &&\n    `& > ${Content} {\n       color: ${getColor(props.color, props)};\n     }`}\n  ${(props) =>\n    props.backgroundColor &&\n    `& > ${Content} {\n       background-color: ${getColor(props.backgroundColor, props)};\n     }\n     & > ${Edge} {\n       color: ${getColor(props.backgroundColor, props)};\n     }`}\n`\n"],"names":["shouldForwardArrowBadgeProp","createShouldForwardProp","Content","styled","div","withConfig","componentId","Edge","svg","shouldForwardProp","attrs","props","Shape","Rectangle","fancy","Fancy","right","after","left","Arrow","as","template","palette","concat","color","backgroundColor","COLOR_SCHEMA","primary","css","_objectSpread","theme","colors","secondary","tertiary","quaternary","Root","dynamicSizeDeclaration","size","cssProperty","cssUnit","height","focus","responsiveSize","responsiveMargin","cursor","getColor"],"mappings":"4fAYA,IAAMA,EAA8BC,IAEvBC,IAAAA,EAAUC,EAAOC,IAAVC,WAAA,CAAAC,YAAA,uBAAGH,CAAhB,CAAA,2FASA,IAAMI,EAAOJ,EAAOK,IACxBH,WAAW,CAAEI,kBAAmB,KAAM,IACtCC,OAAOC,IACN,IAAIC,EAAQC,EAKZ,OAHIF,EAAMG,QAAOF,EAAQG,IACpBJ,EAAMK,OAASL,EAAMM,OAAWN,EAAMO,OAASP,EAAMM,SAAQL,EAAQO,GAEnE,CAAEC,GAAIR,MARAP,WAAA,CAAAC,YAAA,uBAAGH,CAAH,CAAA,6BAAA,KAYZQ,GAAUA,EAAMM,OAAS,+BAG9B,IAAMI,EAAYC,qBACVpB,EADS,mBAAAqB,OAEJD,EAAQE,0CACGF,EAAQG,gBAExBlB,kBAAAA,OAAAA,4BACKe,EAAQG,gBANrB,YAUA,IAAMC,EAAe,CACnBC,QAASC,EACJjB,CAAAA,GAAAA,KAAAA,GACDU,EAAQQ,EAAA,CACNL,MAAOb,EAAMmB,MAAMC,OAAO,0BAC1BN,gBAAiBd,EAAMmB,MAAMC,OAAO,yBACjCpB,EAAMW,YAGfU,UAAWJ,EACNjB,CAAAA,GAAAA,KAAAA,GACDU,EAAQQ,EAAA,CACNL,MAAOb,EAAMmB,MAAMC,OAAO,0BAC1BN,gBAAiBd,EAAMmB,MAAMC,OAAO,2BACjCpB,EAAMW,YAGfW,SAAUL,EACLjB,CAAAA,GAAAA,KAAAA,GACDU,EAAQQ,EAAA,CACNL,MAAOb,EAAMmB,MAAMC,OAAO,0BAC1BN,gBAAiBd,EAAMmB,MAAMC,OAAO,0BACjCpB,EAAMW,YAGfY,WAAYN,EACPjB,CAAAA,GAAAA,KAAAA,GACDU,EAAQQ,EAAA,CACNL,MAAOb,EAAMmB,MAAMC,OAAO,0BAC1BN,gBAAiBd,EAAMmB,MAAMC,OAAO,4BACjCpB,EAAMW,aAaV,IAAMa,EAAOhC,EAAOC,IACxBC,WAAkC,CACjCI,kBAAmBT,IAEpBU,MAAuE,CACtE0B,uBAAwB,CAACC,EAAMC,EAAaC,KAAAA,CAExCC,OAAQ,QACRF,CAACA,GAA8B,iBAATD,EAAoBA,EAA3B,GAAAd,OAAqCc,GAArCd,OAA4CgB,OARlDlC,WAAA,CAAAC,YAAA,uBAAGH,CAAH,CAAA,+FAAA,IAAA,IAAA,IAAA,IAAA,IAAA,IAAA,KARIQ,GACfA,EAAMuB,WAAmBR,EAAaQ,WACtCvB,EAAMsB,SAAiBP,EAAaO,SACpCtB,EAAMqB,UAAkBN,EAAaM,UAElCN,EAAaC,SAsBlBc,EACAC,EACAC,GAEChC,GAAUA,EAAMiC,QAAqBjC,WAAAA,OAAAA,EAAMiC,OAvB/B,OAwBZjC,GACDA,EAAMa,OAAN,OAAAD,OACOrB,EADP,sBAAAqB,OAEYsB,EAASlC,EAAMa,MAAOb,GAFlC,eAICA,GACDA,EAAMc,iBACCvB,OAAAA,OAAAA,EACgB2C,iCAAAA,OAAAA,EAASlC,EAAMc,gBAAiBd,GAEhDJ,wBAAAA,OAAAA,+BACKsC,EAASlC,EAAMc,gBAAiBd"}

package/components/Badge/Badge.js

@@ -1,2 +1,2 @@
-import e from'@babel/runtime/helpers/objectSpread2';import r from'@babel/runtime/helpers/objectWithoutProperties';import{useClassname as s}from'../../hooks/useClassname.js';import{Text as t}from'../Text/Text.js';import{Root as o}from'./style.js';import{jsx as a}from'react/jsx-runtime';var i=["children","content","className","textProps","round","display"];function n(l){var{children:m,content:p,className:d,textProps:c,round:u,display:h="inline-block"}=l,x=r(l,i);var b=s(n.displayName,d);return a(o,e(e({round:u,display:h,className:b},x),{},{children:a(t,e(e({className:"text",size:u?10:12,weight:u?'bolder':'normal',lineHeight:"s",content:'string'==typeof p?p:void 0},c),{},{children:m||p}))}))}n.displayName='Badge';export{n as Badge};
+import r from'@babel/runtime/helpers/objectSpread2';import o from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as e}from'react';import{withMergedProps as s}from'../../hocs/withMergedProps.js';import{Text as i}from'../Text/Text.js';import{Icon as t}from'../Icon/Icon.js';import'../Icon/icons.js';import{Root as a}from'./style.js';import{SIZES_ROUND as n,SIZES as c}from'./constants.js';import{jsx as p,jsxs as m,Fragment as d}from'react/jsx-runtime';var f=["size","borderRadius","textProps","iconProps","children","content","icon"];var h=s(e(((e,s)=>{var{size:n="s",borderRadius:c=3,textProps:h={},iconProps:l={},children:j,content:x,icon:P}=e,b=o(e,f);var[u,g]=Array.isArray(P)?P:[P];var v={as:'span',size:'inherit',color:'inherit',marginLeft:u?4:void 0,marginRight:g?4:void 0};var R={color:'inherit'};return p(a,r(r({},b),{},{size:n,borderRadius:c,ref:s,children:'function'==typeof j?j({baseTextProps:v,textProps:h,iconBaseProps:R,iconProps:l,icon:P}):m(d,{children:[u&&p(t,r(r({icon:u},R),l)),(j||x)&&p(i,r(r(r({},v),h),{},{children:j||x})),g&&p(t,r(r({icon:g},R),l))]})}))})),{displayName:'Badge',sizes:r=>r.round?n:c});export{h as Badge};
 //# sourceMappingURL=Badge.js.map

package/components/Badge/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","sources":["../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import { ColorProperty } from 'mixins/color'\nimport { DisplayProperty } from 'mixins/display'\nimport { useClassname } from 'hooks/useClassname'\nimport type { BaseProps, TextProps } from 'shared/interfaces'\nimport { Text } from '../Text'\nimport * as Styled from './style'\n\nexport interface BadgeProps extends BaseProps, ColorProperty, DisplayProperty {\n  /**\n   * Children react node\n   */\n  children?: React.ReactNode\n  content?: string | React.ReactNode\n  textProps?: TextProps\n  /** Make badge round */\n  round?: string\n}\n\nBadge.displayName = 'Badge'\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n * - [`Color`](#/Миксины)\n * - [`Display`](#/Миксины)\n */\nexport function Badge({\n  children,\n  content,\n  className,\n  textProps,\n  round,\n  display = 'inline-block',\n  ...restProps\n}: BadgeProps) {\n  const _className = useClassname(Badge.displayName, className)\n  return (\n    <Styled.Root round={round} display={display} className={_className} {...restProps}>\n      <Text\n        className='text'\n        size={round ? 10 : 12}\n        weight={round ? 'bolder' : 'normal'}\n        lineHeight='s'\n        content={typeof content === 'string' ? content : undefined}\n        {...textProps}\n      >\n        {children || content}\n      </Text>\n    </Styled.Root>\n  )\n}\n"],"names":["Badge","_ref","children","content","className","textProps","round","display","restProps","_objectWithoutProperties","_excluded","_className","useClassname","displayName","_jsx","Styled.Root","_objectSpread","Text","size","weight","lineHeight","undefined"],"mappings":"qWA0BO,SAASA,EAQDC,GAAA,IAROC,SACpBA,EADoBC,QAEpBA,EAFoBC,UAGpBA,EAHoBC,UAIpBA,EAJoBC,MAKpBA,EALoBC,QAMpBA,EAAU,gBAEGN,EADVO,EACUC,EAAAR,EAAAS,GACb,IAAMC,EAAaC,EAAaZ,EAAMa,YAAaT,GACnD,OACEU,EAACC,EAADC,EAAAA,EAAA,CAAaV,MAAOA,EAAOC,QAASA,EAASH,UAAWO,GAAgBH,GAAxE,GAAA,CAAAN,SACEY,EAACG,EAADD,EAAAA,EAAA,CACEZ,UAAU,OACVc,KAAMZ,EAAQ,GAAK,GACnBa,OAAQb,EAAQ,SAAW,SAC3Bc,WAAW,IACXjB,QAA4B,iBAAZA,EAAuBA,OAAUkB,GAC7ChB,GANN,GAAA,CAAAH,SAQGA,GAAYC,QA5BrBH,EAAMa,YAAc"}
+{"version":3,"file":"Badge.js","sources":["../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport type { TextProps } from 'components/Text'\nimport type { IconProps } from 'components/Icon'\nimport * as Styled from './style'\nimport { SIZES, SIZES_ROUND } from './constants'\nimport type { BadgeProps } from './types'\n\nconst COMPONENT_NAME = 'Badge'\n\n/**\n *\n * Component interface extends:\n * - [`ResponsiveSizeProps`](#/Interfaces)\n * - [`ResponsiveMarginProps`](#/Interfaces)\n * - [`ColorSchemaProps`](#/Interfaces)\n * - [`ColorPaletteProps<keyof BadgePalette>`](#/Interfaces)\n * - [`TypographyProps`](#/Interfaces)\n * - [`BaseProps`](#/Interfaces)\n * - [`React.ComponentPropsWithRef<'div'>`](#/Interfaces)\n */\nexport const Badge: React.ForwardRefExoticComponent<BadgeProps> = withMergedProps<BadgeProps, HTMLDivElement>(\n  forwardRef((props, ref) => {\n    const {\n      size = 's',\n      borderRadius = 3,\n      textProps = {},\n      iconProps = {},\n      children,\n      content,\n      icon,\n      ...restProps\n    } = props\n\n    const [before, after] = Array.isArray(icon) ? icon : [icon]\n\n    const baseTextProps: TextProps = {\n      as: 'span',\n      size: 'inherit',\n      color: 'inherit',\n      marginLeft: before ? 4 : undefined,\n      marginRight: after ? 4 : undefined,\n    }\n    const iconBaseProps: IconProps = { color: 'inherit' }\n\n    return (\n      <Styled.Root {...restProps} size={size} borderRadius={borderRadius} ref={ref}>\n        {typeof children === 'function' ? (\n          children({ baseTextProps, textProps, iconBaseProps, iconProps, icon })\n        ) : (\n          <>\n            {before && <Icon icon={before} {...iconBaseProps} {...iconProps} />}\n            {(children || content) && (\n              <Text {...baseTextProps} {...textProps}>\n                {children || content}\n              </Text>\n            )}\n            {after && <Icon icon={after} {...iconBaseProps} {...iconProps} />}\n          </>\n        )}\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: (props) => (props.round ? SIZES_ROUND : SIZES),\n  }\n)\n"],"names":["Badge","withMergedProps","forwardRef","props","ref","size","borderRadius","textProps","iconProps","children","content","icon","restProps","_excluded","before","after","Array","isArray","baseTextProps","as","color","marginLeft","marginRight","iconBaseProps","_jsx","Styled.Root","_jsxs","_Fragment","Icon","_objectSpread","Text","displayName","sizes","round","SIZES_ROUND","SIZES"],"mappings":"wiBAuBO,IAAMA,EAAqDC,EAChEC,GAAAA,CAAYC,EAAOC,KACjB,IAAMC,KACJA,EAAO,IADHC,aAEJA,EAAe,EAFXC,UAGJA,EAAY,GAHRC,UAIJA,EAAY,GAJRC,SAKJA,EALIC,QAMJA,EANIC,KAOJA,GAEER,EADCS,IACDT,EATJU,GAWA,IAAOC,EAAQC,GAASC,MAAMC,QAAQN,GAAQA,EAAO,CAACA,GAEtD,IAAMO,EAA2B,CAC/BC,GAAI,OACJd,KAAM,UACNe,MAAO,UACPC,WAAYP,EAAS,SACrBQ,YAAaP,EAAQ,OAAA,GAEvB,IAAMQ,EAA2B,CAAEH,MAAO,WAE1C,OACEI,EAACC,SAAgBb,GAAjB,GAAA,CAA4BP,KAAMA,EAAMC,aAAcA,EAAcF,IAAKA,EAAzEK,SACuB,mBAAbA,EACNA,EAAS,CAAES,cAAAA,EAAeX,UAAAA,EAAWgB,cAAAA,EAAef,UAAAA,EAAWG,KAAAA,IAE/De,EAAAC,EAAA,CAAAlB,SACGK,CAAAA,GAAUU,EAACI,EAADC,EAAAA,EAAA,CAAMlB,KAAMG,GAAYS,GAAmBf,KACpDC,GAAYC,IACZc,EAACM,EAASZ,EAAAA,EAAAA,EAAAA,GAAAA,GAAmBX,GAA7B,GAAA,CAAAE,SACGA,GAAYC,KAGhBK,GAASS,EAACI,EAADC,EAAAA,EAAA,CAAMlB,KAAMI,GAAWQ,GAAmBf,aAM9D,CACEuB,YAxDmB,QAyDnBC,MAAQ7B,GAAWA,EAAM8B,MAAQC,EAAcC"}

package/components/Badge/constants.js

@@ -0,0 +1,2 @@
+var i={xxxl:{height:34,fontSize:22,paddingRight:10,paddingLeft:10},xxl:{height:32,fontSize:20,paddingRight:10,paddingLeft:10},xl:{height:30,fontSize:18,paddingRight:10,paddingLeft:10},l:{height:28,fontSize:16,paddingRight:8,paddingLeft:8},m:{height:26,fontSize:14,paddingRight:8,paddingLeft:8},s:{height:24,fontSize:12,paddingRight:8,paddingLeft:8},xs:{height:22,fontSize:10,paddingRight:6,paddingLeft:6},xxs:{height:20,fontSize:10,paddingRight:6,paddingLeft:6},xxxs:{height:18,fontSize:10,paddingRight:6,paddingLeft:6}};var t={xxxl:{height:34,width:34,fontSize:22},xxl:{height:32,width:32,fontSize:20},xl:{height:30,width:30,fontSize:18},l:{height:28,width:28,fontSize:16},m:{height:26,width:26,fontSize:14},s:{height:24,width:24,fontSize:12},xs:{height:22,width:22,fontSize:10},xxs:{height:20,width:20,fontSize:10},xxxs:{height:18,width:18,fontSize:10}};export{i as SIZES,t as SIZES_ROUND};
+//# sourceMappingURL=constants.js.map

package/components/Badge/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../../src/components/Badge/constants.ts"],"sourcesContent":["import type { Sizes } from 'shared/interfaces'\n\nexport const SIZES: Sizes = {\n  xxxl: {\n    height: 34,\n    fontSize: 22,\n    paddingRight: 10,\n    paddingLeft: 10,\n  },\n  xxl: {\n    height: 32,\n    fontSize: 20,\n    paddingRight: 10,\n    paddingLeft: 10,\n  },\n  xl: {\n    height: 30,\n    fontSize: 18,\n    paddingRight: 10,\n    paddingLeft: 10,\n  },\n  l: {\n    height: 28,\n    fontSize: 16,\n    paddingRight: 8,\n    paddingLeft: 8,\n  },\n  m: {\n    height: 26,\n    fontSize: 14,\n    paddingRight: 8,\n    paddingLeft: 8,\n  },\n  s: {\n    height: 24,\n    fontSize: 12,\n    paddingRight: 8,\n    paddingLeft: 8,\n  },\n  xs: {\n    height: 22,\n    fontSize: 10,\n    paddingRight: 6,\n    paddingLeft: 6,\n  },\n  xxs: {\n    height: 20,\n    fontSize: 10,\n    paddingRight: 6,\n    paddingLeft: 6,\n  },\n  xxxs: {\n    height: 18,\n    fontSize: 10,\n    paddingRight: 6,\n    paddingLeft: 6,\n  },\n}\n\nexport const SIZES_ROUND: Sizes = {\n  xxxl: {\n    height: 34,\n    width: 34,\n    fontSize: 22,\n  },\n  xxl: {\n    height: 32,\n    width: 32,\n    fontSize: 20,\n  },\n  xl: {\n    height: 30,\n    width: 30,\n    fontSize: 18,\n  },\n  l: {\n    height: 28,\n    width: 28,\n    fontSize: 16,\n  },\n  m: {\n    height: 26,\n    width: 26,\n    fontSize: 14,\n  },\n  s: {\n    height: 24,\n    width: 24,\n    fontSize: 12,\n  },\n  xs: {\n    height: 22,\n    width: 22,\n    fontSize: 10,\n  },\n  xxs: {\n    height: 20,\n    width: 20,\n    fontSize: 10,\n  },\n  xxxs: {\n    height: 18,\n    width: 18,\n    fontSize: 10,\n  },\n}\n"],"names":["SIZES","xxxl","height","fontSize","paddingRight","paddingLeft","xxl","xl","l","m","s","xs","xxs","xxxs","SIZES_ROUND","width"],"mappings":"AAEO,IAAMA,EAAe,CAC1BC,KAAM,CACJC,OAAQ,GACRC,SAAU,GACVC,aAAc,GACdC,YAAa,IAEfC,IAAK,CACHJ,OAAQ,GACRC,SAAU,GACVC,aAAc,GACdC,YAAa,IAEfE,GAAI,CACFL,OAAQ,GACRC,SAAU,GACVC,aAAc,GACdC,YAAa,IAEfG,EAAG,CACDN,OAAQ,GACRC,SAAU,GACVC,aAAc,EACdC,YAAa,GAEfI,EAAG,CACDP,OAAQ,GACRC,SAAU,GACVC,aAAc,EACdC,YAAa,GAEfK,EAAG,CACDR,OAAQ,GACRC,SAAU,GACVC,aAAc,EACdC,YAAa,GAEfM,GAAI,CACFT,OAAQ,GACRC,SAAU,GACVC,aAAc,EACdC,YAAa,GAEfO,IAAK,CACHV,OAAQ,GACRC,SAAU,GACVC,aAAc,EACdC,YAAa,GAEfQ,KAAM,CACJX,OAAQ,GACRC,SAAU,GACVC,aAAc,EACdC,YAAa,IAIV,IAAMS,EAAqB,CAChCb,KAAM,CACJC,OAAQ,GACRa,MAAO,GACPZ,SAAU,IAEZG,IAAK,CACHJ,OAAQ,GACRa,MAAO,GACPZ,SAAU,IAEZI,GAAI,CACFL,OAAQ,GACRa,MAAO,GACPZ,SAAU,IAEZK,EAAG,CACDN,OAAQ,GACRa,MAAO,GACPZ,SAAU,IAEZM,EAAG,CACDP,OAAQ,GACRa,MAAO,GACPZ,SAAU,IAEZO,EAAG,CACDR,OAAQ,GACRa,MAAO,GACPZ,SAAU,IAEZQ,GAAI,CACFT,OAAQ,GACRa,MAAO,GACPZ,SAAU,IAEZS,IAAK,CACHV,OAAQ,GACRa,MAAO,GACPZ,SAAU,IAEZU,KAAM,CACJX,OAAQ,GACRa,MAAO,GACPZ,SAAU"}

package/components/Badge/style.js

@@ -1,2 +1,2 @@
-import i,{css as o}from'styled-components';import{color as l}from'../../mixins/color.js';import{display as r}from'../../mixins/display.js';var n=o(["min-width:16px;padding:3px 4px 1px;border-radius:100%;box-sizing:border-box;line-height:0;.text{line-height:12px;}"]);var d=i.div.withConfig({shouldForwardProp:i=>['children','className','style'].includes(i)}).withConfig({componentId:"fox-ui__sc-h3lnrc-0"})(["background-color:currentColor;padding:2px 12px 0px;border-radius:3px;vertical-align:middle;text-align:center;&:not(:last-child){margin-right:8px;}.text{display:inline-block;vertical-align:middle;white-space:nowrap;text-overflow:ellipsis;max-width:100%;overflow:hidden;}"," "," ",""],(i=>i.round?n:null),(i=>i.color?l(i.color,'background-color'):null),(i=>i.display?r(i.display):null));export{d as Root};
+import r from'@babel/runtime/helpers/objectSpread2';import o,{css as n}from'styled-components';import{color as a}from'../../mixins/color.js';import{display as e}from'../../mixins/display.js';import{responsiveSize as t}from'../../mixins/size.js';import{responsiveMargin as i}from'../../mixins/margin.js';import{createShouldForwardProp as s}from'../../shared/utils/style.js';import{focus as c}from'../../mixins/focus.js';var d=s((r=>!['round','content','borderRadius','resetDefaultMargin','display'].includes(r)));var l=r=>"\n  color: ".concat(r.color,";\n  background-color: ").concat(r.backgroundColor,";\n");var m={primary:n(["",""],(o=>l(r({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-brand-primary-100']},o.palette)))),secondary:n(["",""],(o=>l(r({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-brand-secondary-100']},o.palette)))),tertiary:n(["",""],(o=>l(r({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-brand-tertiary-100']},o.palette)))),quaternary:n(["",""],(o=>l(r({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-brand-quaternary-100']},o.palette))))};var p=o.div.withConfig({shouldForwardProp:d}).attrs((r=>({dynamicSizeDeclaration:(o,n,a)=>({[n]:'string'==typeof o?o:"".concat(o).concat(a),height:'1.8em',width:r.round?'1.8em':void 0,paddingRight:r.round?void 0:'0.6em',paddingLeft:r.round?void 0:'0.6em'})}))).withConfig({componentId:"fox-ui__sc-h3lnrc-0"})([""," "," "," "," "," "," "," "," ",""],(r=>{var o='number'==typeof r.borderRadius?"".concat(r.borderRadius,"px"):r.borderRadius;return"\n      box-sizing: border-box;\n      isolation: isolate;\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      width: max-content;\n      flex-shrink: 0;\n      border-radius: ".concat(r.round?'50%':o,";\n    ")}),(r=>r.quaternary?m.quaternary:r.tertiary?m.tertiary:r.secondary?m.secondary:m.primary),c,t,i,(r=>r.cursor&&"cursor: ".concat(r.cursor,";")),(r=>r.color&&a(r.color,'background-color')),(r=>r.display&&e(r.display)),(r=>!r.resetDefaultMargin&&'&:not(:last-child) { margin-right: 8px; }'));export{p as Root};
 //# sourceMappingURL=style.js.map

package/components/Badge/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/Badge/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { color } from 'mixins/color'\nimport { display } from 'mixins/display'\nimport { BadgeProps } from './Badge'\n\nconst round = css`\n  min-width: 16px;\n  padding: 3px 4px 1px;\n  border-radius: 100%;\n  box-sizing: border-box;\n  line-height: 0;\n\n  .text {\n    line-height: 12px;\n  }\n`\n\nexport const Root = styled.div.withConfig<BadgeProps>({\n  shouldForwardProp: (prop) => ['children', 'className', 'style'].includes(prop),\n})`\n  background-color: currentColor;\n  padding: 2px 12px 0px;\n  border-radius: 3px;\n  vertical-align: middle;\n  text-align: center;\n\n  &:not(:last-child) {\n    margin-right: 8px;\n  }\n\n  .text {\n    display: inline-block;\n    vertical-align: middle;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    max-width: 100%;\n    overflow: hidden;\n  }\n\n  ${(props) => (props.round ? round : null)}\n  ${(props) => (props.color ? color(props.color, 'background-color') : null)}\n  ${(props) => (props.display ? display(props.display) : null)}\n`\n"],"names":["round","css","Root","styled","div","withConfig","shouldForwardProp","prop","includes","componentId","props","color","display"],"mappings":"2IAKA,IAAMA,EAAQC,EAAd,CAAA,uHAYO,IAAMC,EAAOC,EAAOC,IAAIC,WAAuB,CACpDC,kBAAoBC,GAAS,CAAC,WAAY,YAAa,SAASC,SAASD,KAD1DF,WAAA,CAAAI,YAAA,uBAAGN,CAAH,CAAA,gRAAA,IAAA,IAAA,KAsBZO,GAAWA,EAAMV,MAAQA,EAAQ,OACjCU,GAAWA,EAAMC,MAAQA,EAAMD,EAAMC,MAAO,oBAAsB,OAClED,GAAWA,EAAME,QAAUA,EAAQF,EAAME,SAAW"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/Badge/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport type { ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { color } from 'mixins/color'\nimport { display } from 'mixins/display'\nimport { responsiveSize } from 'mixins/size'\nimport { responsiveMargin } from 'mixins/margin'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { focus } from 'mixins/focus'\nimport type { StyledBadgeProps, BadgePalette } from './types'\n\nconst shouldForwardBadgeProp = createShouldForwardProp(\n  (propKey) => !['round', 'content', 'borderRadius', 'resetDefaultMargin', 'display'].includes(propKey)\n)\n\nconst template = (palette: BadgePalette) => `\n  color: ${palette.color};\n  background-color: ${palette.backgroundColor};\n`\n\nconst COLOR_SCHEMA = {\n  primary: css<StyledBadgeProps>`\n    ${(props) =>\n      template({\n        color: props.theme.colors['content-onmain-primary'],\n        backgroundColor: props.theme.colors['bg-brand-primary-100'],\n        ...props.palette,\n      })}\n  `,\n  secondary: css<StyledBadgeProps>`\n    ${(props) =>\n      template({\n        color: props.theme.colors['content-onmain-primary'],\n        backgroundColor: props.theme.colors['bg-brand-secondary-100'],\n        ...props.palette,\n      })}\n  `,\n  tertiary: css<StyledBadgeProps>`\n    ${(props) =>\n      template({\n        color: props.theme.colors['content-onmain-primary'],\n        backgroundColor: props.theme.colors['bg-brand-tertiary-100'],\n        ...props.palette,\n      })}\n  `,\n  quaternary: css<StyledBadgeProps>`\n    ${(props) =>\n      template({\n        color: props.theme.colors['content-onmain-primary'],\n        backgroundColor: props.theme.colors['bg-brand-quaternary-100'],\n        ...props.palette,\n      })}\n  `,\n}\n\nconst badgeStyles = (props: ThemedStyledProps<StyledBadgeProps, DefaultTheme>) => {\n  if (props.quaternary) return COLOR_SCHEMA.quaternary\n  if (props.tertiary) return COLOR_SCHEMA.tertiary\n  if (props.secondary) return COLOR_SCHEMA.secondary\n\n  return COLOR_SCHEMA.primary\n}\n\nexport const Root = styled.div\n  .withConfig<StyledBadgeProps>({\n    shouldForwardProp: shouldForwardBadgeProp,\n  })\n  .attrs<StyledBadgeProps>(\n    (props): Required<Pick<StyledBadgeProps, 'dynamicSizeDeclaration'>> => ({\n      dynamicSizeDeclaration: (size, cssProperty, cssUnit) => {\n        return {\n          [cssProperty]: typeof size === 'string' ? size : `${size}${cssUnit}`,\n          height: '1.8em',\n          width: props.round ? '1.8em' : undefined,\n          paddingRight: props.round ? undefined : '0.6em',\n          paddingLeft: props.round ? undefined : '0.6em',\n        }\n      },\n    })\n  )`\n  ${(props) => {\n    const borderRadius = typeof props.borderRadius === 'number' ? `${props.borderRadius}px` : props.borderRadius\n\n    return `\n      box-sizing: border-box;\n      isolation: isolate;\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      width: max-content;\n      flex-shrink: 0;\n      border-radius: ${props.round ? '50%' : borderRadius};\n    `\n  }}\n\n  ${badgeStyles}\n  ${focus}\n  ${responsiveSize}\n  ${responsiveMargin}\n\n  ${(props) => props.cursor && `cursor: ${props.cursor};`}\n  ${(props) => props.color && color(props.color, 'background-color')}\n  ${(props) => props.display && display(props.display)}\n  ${(props) => !props.resetDefaultMargin && '&:not(:last-child) { margin-right: 8px; }'}\n`\n"],"names":["shouldForwardBadgeProp","createShouldForwardProp","propKey","includes","template","palette","color","backgroundColor","COLOR_SCHEMA","primary","css","props","_objectSpread","theme","colors","secondary","tertiary","quaternary","Root","styled","div","withConfig","shouldForwardProp","attrs","dynamicSizeDeclaration","size","cssProperty","cssUnit","height","width","round","paddingRight","paddingLeft","undefined","componentId","borderRadius","concat","focus","responsiveSize","responsiveMargin","cursor","display","resetDefaultMargin"],"mappings":"maAUA,IAAMA,EAAyBC,GAC5BC,IAAa,CAAC,QAAS,UAAW,eAAgB,qBAAsB,WAAWC,SAASD,KAG/F,IAAME,EAAYC,GACPA,cAAAA,OAAAA,EAAQC,MACGD,2BAAAA,OAAAA,EAAQE,gBAF9B,OAKA,IAAMC,EAAe,CACnBC,QAASC,EACJC,CAAAA,GAAAA,KAAAA,GACDP,EAAQQ,EAAA,CACNN,MAAOK,EAAME,MAAMC,OAAO,0BAC1BP,gBAAiBI,EAAME,MAAMC,OAAO,yBACjCH,EAAMN,YAGfU,UAAWL,EACNC,CAAAA,GAAAA,KAAAA,GACDP,EAAQQ,EAAA,CACNN,MAAOK,EAAME,MAAMC,OAAO,0BAC1BP,gBAAiBI,EAAME,MAAMC,OAAO,2BACjCH,EAAMN,YAGfW,SAAUN,EACLC,CAAAA,GAAAA,KAAAA,GACDP,EAAQQ,EAAA,CACNN,MAAOK,EAAME,MAAMC,OAAO,0BAC1BP,gBAAiBI,EAAME,MAAMC,OAAO,0BACjCH,EAAMN,YAGfY,WAAYP,EACPC,CAAAA,GAAAA,KAAAA,GACDP,EAAQQ,EAAA,CACNN,MAAOK,EAAME,MAAMC,OAAO,0BAC1BP,gBAAiBI,EAAME,MAAMC,OAAO,4BACjCH,EAAMN,aAaV,IAAMa,EAAOC,EAAOC,IACxBC,WAA6B,CAC5BC,kBAAmBtB,IAEpBuB,OACEZ,IAAuE,CACtEa,uBAAwB,CAACC,EAAMC,EAAaC,KACnC,CACLD,CAACA,GAA8B,iBAATD,EAAoBA,EAAUA,GAAAA,OAAAA,GAAOE,OAAAA,GAC3DC,OAAQ,QACRC,MAAOlB,EAAMmB,MAAQ,aAAA,EACrBC,aAAcpB,EAAMmB,WAAAA,EAAoB,QACxCE,YAAarB,EAAMmB,WAAQG,EAAY,cAZhCZ,WAAA,CAAAa,YAAA,uBAAGf,CAAH,CAAA,GAAA,IAAA,IAAA,IAAA,IAAA,IAAA,IAAA,IAAA,IAAA,KAiBZR,IACD,IAAMwB,EAA6C,iBAAvBxB,EAAMwB,aAAb,GAAAC,OAA4CzB,EAAMwB,aAAmBxB,MAAAA,EAAMwB,aAEhG,MAAA,+NAAAC,OAQmBzB,EAAMmB,MAAQ,MAAQK,EARzC,cA5BiBxB,GACfA,EAAMM,WAAmBT,EAAaS,WACtCN,EAAMK,SAAiBR,EAAaQ,SACpCL,EAAMI,UAAkBP,EAAaO,UAElCP,EAAaC,SAoClB4B,EACAC,EACAC,GAEC5B,GAAUA,EAAM6B,QAAqB7B,WAAAA,OAAAA,EAAM6B,OArC/B,OAsCZ7B,GAAUA,EAAML,OAASA,EAAMK,EAAML,MAAO,sBAC5CK,GAAUA,EAAM8B,SAAWA,EAAQ9B,EAAM8B,WACzC9B,IAAWA,EAAM+B,oBAAsB"}

package/components/Button/Button.js

@@ -1,2 +1,2 @@
-import o from'@babel/runtime/helpers/objectSpread2';import e from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as r}from'react';import{Link as a}from'react-router-dom';import{mergeDeepLeft as n}from'ramda';import{useClassname as s}from'../../hooks/useClassname.js';import{useFallbackTheme as t}from'../../hooks/use-theme.js';import{useConfigPriority as i}from'../../hooks/use-config-priority.js';import{useComputedRel as l,useComputedLinkProps as d}from'./hooks.js';import{PROPS_BY_SIZE as c,SIZES_BRAND as u,SIZES as m,SIZES_ROUND_BRAND as p,SIZES_ROUND as f}from'./constants.js';import{Root as h,IconSlot as v,Content as C,SpinnerIcon as y,CheckIcon as b}from'./style.js';import{jsxs as g,jsx as k}from'react/jsx-runtime';var N=["display","size","sizes","fontColor","color","disabled","rounded","width","as","type","className","children","content","onClick","onClickCapture","onMouseEnter","onMouseLeave"];var S='Button';var j=r(((r,S)=>{var j;var R=t();var E=i(null===(j=R.components)||void 0===j?void 0:j.Button,r),{display:B="inline-flex",size:_="m",sizes:x,fontColor:I="white",color:M="accent",disabled:z=!1,rounded:L=!0,width:P="auto",as:D="button",type:W,className:w,children:A,content:O,onClick:Z,onClickCapture:U,onMouseEnter:T,onMouseLeave:F}=E,H=e(E,N);var Y='brand'===R.preset;if('string'==typeof H.preset&&(Y='brand'===H.preset),!Y&&'string'==typeof _&&!H.round){var q;var G=null!==(q=c[_])&&void 0!==q?q:{};H=o(o({},G),H)}var J=Y?u:m;H.round&&(J=Y?p:f),x&&(J=n(x,J));var K=s("Button",w);var Q=s("Button");var V=l(R,H);var X=d(D,z,H);H.href&&(D='a'),H.to&&(D=a),H.primary&&(M='primary'),H.secondary&&(M='atlantis');var $=Y?800:600;H.fontWeight&&($=H.fontWeight);var oo='number'==typeof $&&$>=800||'bold'===$;var eo='0px';L&&(eo=Y?'48px':'5px'),H.round&&(eo='50%');var[ro,ao]=Array.isArray(H.icon)?H.icon:[H.icon];return Y&&H.loading&&!H.success&&!z&&(ro=k(y,{strokeWidth:oo?2.5:1.5}),ao=null),H.success&&(ro=k(b,{strokeWidth:oo?3:1.5}),ao=null),g(h,o(o(o({},H),X),{},{className:K,as:D,color:M,fontColor:I,disabled:z,rel:V,display:B,rounded:L,size:_,sizes:J,dynamicSizeDeclaration:(o,e,r)=>({[e]:"".concat(o).concat(r),padding:H.round?'1em':'1em 1.6em'}),fontWeight:$,borderRadius:eo,brandPresetUsed:Y,ref:null!=S?S:H.innerRef,type:'button'===D?W:void 0,lineHeight:Y?1.2:1,width:H.round?void 0:P,palette:{},onClick:o=>{z||H.loading||null==Z||Z(o)},onClickCapture:o=>{z||H.loading||null==U||U(o)},onMouseEnter:o=>{z||H.loading||null==T||T(o)},onMouseLeave:o=>{z||H.loading||null==F||F(o)},children:[ro&&k(v,{className:"icon",marginRight:!H.round,children:ro}),(O||A)&&k(C,{className:"".concat(Q,"__content"),children:O||A}),ao&&!H.round&&k(v,{className:"icon",marginLeft:!0,children:ao})]}))}));j.displayName="Button";export{j as Button,S as COMPONENT_NAME};
+import o from'@babel/runtime/helpers/objectSpread2';import e from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as r}from'react';import{Link as a}from'react-router-dom';import{mergeDeepLeft as n}from'ramda';import{useClassname as s}from'../../hooks/useClassname.js';import{useFallbackTheme as t}from'../../hooks/use-theme.js';import{useConfigPriority as i}from'../../hooks/use-config-priority.js';import{useComputedRel as l,useComputedLinkProps as d}from'./hooks.js';import{PROPS_BY_SIZE as c,SIZES_BRAND as u,SIZES as m,SIZES_ROUND_BRAND as p,SIZES_ROUND as f}from'./constants.js';import{Root as h,IconSlot as v,Content as y,SpinnerIcon as C,CheckIcon as g}from'./style.js';import{jsxs as b,jsx as k}from'react/jsx-runtime';var N=["display","size","sizes","fontColor","color","disabled","rounded","width","as","type","className","children","content","onClick","onClickCapture","onMouseEnter","onMouseLeave"];var S='Button';var j=r(((r,S)=>{var j;var R=t();var E=i(null===(j=R.components)||void 0===j?void 0:j.Button,r),{display:B="inline-flex",size:_="m",sizes:x,fontColor:I="white",color:M="accent",disabled:z=!1,rounded:L=!0,width:P="auto",as:D="button",type:W,className:w,children:A,content:O,onClick:Z,onClickCapture:U,onMouseEnter:T,onMouseLeave:F}=E,H=e(E,N);var Y='brand'===R.preset;if('string'==typeof H.preset&&(Y='brand'===H.preset),!Y&&'string'==typeof _&&!H.round){var q;var G=null!==(q=c[_])&&void 0!==q?q:{};H=o(o({},G),H)}var J=Y?u:m;H.round&&(J=Y?p:f),x&&(J=n(x,J));var K=s("Button",w);var Q=s("Button");var V=l(R,H);var X=d(D,z,H);H.href&&(D='a'),H.to&&(D=a),H.primary&&(M='primary'),H.secondary&&(M='atlantis');var $=Y?800:600;H.fontWeight&&($=H.fontWeight);var oo='number'==typeof $&&$>=800||'bold'===$;var eo='0px';L&&(eo=Y?'48px':'5px'),H.round&&(eo='50%');var[ro,ao]=Array.isArray(H.icon)?H.icon:[H.icon];return Y&&H.loading&&!H.success&&!z&&(ro=k(C,{strokeWidth:oo?2.5:1.5}),ao=null),H.success&&(ro=k(g,{strokeWidth:oo?3:1.5}),ao=null),b(h,o(o(o({},H),X),{},{className:K,as:D,color:M,fontColor:I,disabled:z,rel:V,display:B,rounded:L,size:_,sizes:J,dynamicSizeDeclaration:(o,e,r)=>({[e]:'string'==typeof o?o:"".concat(o).concat(r),padding:H.round?'1em':'1em 1.6em'}),fontWeight:$,borderRadius:eo,brandPresetUsed:Y,ref:null!=S?S:H.innerRef,type:'button'===D?W:void 0,lineHeight:Y?1.2:1,width:H.round?void 0:P,palette:{},onClick:o=>{z||H.loading||null==Z||Z(o)},onClickCapture:o=>{z||H.loading||null==U||U(o)},onMouseEnter:o=>{z||H.loading||null==T||T(o)},onMouseLeave:o=>{z||H.loading||null==F||F(o)},children:[ro&&k(v,{className:"icon",marginRight:!H.round,children:ro}),(O||A)&&k(y,{className:"".concat(Q,"__content"),children:O||A}),ao&&!H.round&&k(v,{className:"icon",marginLeft:!0,children:ao})]}))}));j.displayName="Button";export{j as Button,S as COMPONENT_NAME};
 //# sourceMappingURL=Button.js.map

package/components/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { Link } from 'react-router-dom'\nimport { mergeDeepLeft } from 'ramda'\nimport { useClassname } from 'hooks/useClassname'\nimport { useFallbackTheme } from 'hooks/use-theme'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport type { Sizes } from 'shared/interfaces'\nimport { useComputedRel, useComputedLinkProps } from './hooks'\nimport { SIZES, SIZES_BRAND, SIZES_ROUND, SIZES_ROUND_BRAND, PROPS_BY_SIZE } from './constants'\nimport type { ButtonProps, StyledButtonProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Button'\n\n/**\n * Main button\n */\nconst Button = forwardRef<HTMLElement, ButtonProps>((props, ref) => {\n  const theme = useFallbackTheme()\n\n  let {\n    display = 'inline-flex',\n    size = 'm',\n    sizes,\n    fontColor = 'white',\n    color = 'accent',\n    disabled = false,\n    rounded = true,\n    width = 'auto',\n    as: _as = 'button',\n    type: _type,\n    className: _className,\n    children,\n    content,\n    onClick,\n    onClickCapture,\n    onMouseEnter,\n    onMouseLeave,\n    ...configProps\n  } = useConfigPriority<ButtonProps>(theme.components?.Button, props)\n\n  let brandPresetUsed = theme.preset === 'brand'\n  if (typeof configProps.preset === 'string') brandPresetUsed = configProps.preset === 'brand'\n\n  if (!brandPresetUsed && typeof size === 'string' && !configProps.round) {\n    const propsBySize = PROPS_BY_SIZE[size] ?? {}\n    configProps = { ...propsBySize, ...configProps }\n  }\n\n  let componentSizes = brandPresetUsed ? SIZES_BRAND : SIZES\n  if (configProps.round) componentSizes = brandPresetUsed ? SIZES_ROUND_BRAND : SIZES_ROUND\n  if (sizes) componentSizes = mergeDeepLeft(sizes, componentSizes) as Sizes\n\n  const className = useClassname(COMPONENT_NAME, _className)\n  const classNameContent = useClassname(COMPONENT_NAME)\n  const rel = useComputedRel(theme, configProps)\n  const linkProps = useComputedLinkProps(_as, disabled, configProps)\n\n  if (configProps.href) _as = 'a'\n  if (configProps.to) _as = Link\n\n  if (configProps.primary) color = 'primary'\n  if (configProps.secondary) color = 'atlantis'\n\n  let fontWeight: ButtonProps['fontWeight'] = brandPresetUsed ? 800 : 600\n  if (configProps.fontWeight) fontWeight = configProps.fontWeight\n\n  const fontBold = (typeof fontWeight === 'number' && fontWeight >= 800) || fontWeight === 'bold'\n\n  let borderRadius = '0px'\n  if (rounded) borderRadius = brandPresetUsed ? '48px' : '5px'\n  if (configProps.round) borderRadius = '50%'\n\n  let [leftIcon, rightIcon] = Array.isArray(configProps.icon) ? configProps.icon : [configProps.icon]\n\n  if (brandPresetUsed && configProps.loading && !configProps.success && !disabled) {\n    leftIcon = <Styled.SpinnerIcon strokeWidth={fontBold ? 2.5 : 1.5} />\n    rightIcon = null\n  }\n  if (configProps.success) {\n    leftIcon = <Styled.CheckIcon strokeWidth={fontBold ? 3 : 1.5} />\n    rightIcon = null\n  }\n\n  const handleDynamicSizeDeclaration: StyledButtonProps['dynamicSizeDeclaration'] = (size, cssProperty, cssUnit) => {\n    return {\n      [cssProperty]: `${size}${cssUnit}`,\n      padding: configProps.round ? '1em' : '1em 1.6em',\n    }\n  }\n\n  const handleClick: ButtonProps['onClick'] = (evt) => {\n    if (!disabled && !configProps.loading) onClick?.(evt)\n  }\n  const handleClickCapture: ButtonProps['onClickCapture'] = (evt) => {\n    if (!disabled && !configProps.loading) onClickCapture?.(evt)\n  }\n  const handleMouseEnter: ButtonProps['onMouseEnter'] = (evt) => {\n    if (!disabled && !configProps.loading) onMouseEnter?.(evt)\n  }\n  const handleMouseLeave: ButtonProps['onMouseLeave'] = (evt) => {\n    if (!disabled && !configProps.loading) onMouseLeave?.(evt)\n  }\n\n  return (\n    <Styled.Root\n      {...configProps}\n      {...linkProps}\n      className={className}\n      as={_as}\n      color={color}\n      fontColor={fontColor}\n      disabled={disabled}\n      rel={rel}\n      display={display}\n      rounded={rounded}\n      size={size}\n      sizes={componentSizes}\n      dynamicSizeDeclaration={handleDynamicSizeDeclaration}\n      fontWeight={fontWeight}\n      borderRadius={borderRadius}\n      brandPresetUsed={brandPresetUsed}\n      ref={ref ?? configProps.innerRef}\n      type={_as === 'button' ? _type : undefined}\n      lineHeight={brandPresetUsed ? 1.2 : 1}\n      width={configProps.round ? undefined : width}\n      palette={{}}\n      onClick={handleClick}\n      onClickCapture={handleClickCapture}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n    >\n      {leftIcon && (\n        <Styled.IconSlot className='icon' marginRight={!configProps.round}>\n          {leftIcon}\n        </Styled.IconSlot>\n      )}\n      {(content || children) && (\n        <Styled.Content className={`${classNameContent}__content`}>{content || children}</Styled.Content>\n      )}\n      {rightIcon && !configProps.round && (\n        <Styled.IconSlot className='icon' marginLeft>\n          {rightIcon}\n        </Styled.IconSlot>\n      )}\n    </Styled.Root>\n  )\n})\n\nButton.displayName = COMPONENT_NAME\n\nexport { Button, COMPONENT_NAME }\n\nexport type { ButtonProps }\n"],"names":["COMPONENT_NAME","Button","forwardRef","props","ref","_theme$components","theme","useFallbackTheme","useConfigPriority","components","display","size","sizes","fontColor","color","disabled","rounded","width","as","_as","type","_type","className","_className","children","content","onClick","onClickCapture","onMouseEnter","onMouseLeave","_useConfigPriority","configProps","_objectWithoutProperties","_excluded","brandPresetUsed","preset","round","_PROPS_BY_SIZE$size","propsBySize","PROPS_BY_SIZE","componentSizes","SIZES_BRAND","SIZES","SIZES_ROUND_BRAND","SIZES_ROUND","mergeDeepLeft","useClassname","classNameContent","rel","useComputedRel","linkProps","useComputedLinkProps","href","to","Link","primary","secondary","fontWeight","fontBold","borderRadius","leftIcon","rightIcon","Array","isArray","icon","loading","success","_jsx","Styled.SpinnerIcon","strokeWidth","Styled.CheckIcon","_jsxs","Styled.Root","dynamicSizeDeclaration","cssProperty","cssUnit","concat","padding","innerRef","lineHeight","palette","evt","Styled.IconSlot","marginRight","Styled.Content","marginLeft","displayName"],"mappings":"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"}
+{"version":3,"file":"Button.js","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { Link } from 'react-router-dom'\nimport { mergeDeepLeft } from 'ramda'\nimport { useClassname } from 'hooks/useClassname'\nimport { useFallbackTheme } from 'hooks/use-theme'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport type { Sizes } from 'shared/interfaces'\nimport { useComputedRel, useComputedLinkProps } from './hooks'\nimport { SIZES, SIZES_BRAND, SIZES_ROUND, SIZES_ROUND_BRAND, PROPS_BY_SIZE } from './constants'\nimport type { ButtonProps, StyledButtonProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Button'\n\n/**\n * Main button\n */\nconst Button = forwardRef<HTMLElement, ButtonProps>((props, ref) => {\n  const theme = useFallbackTheme()\n\n  let {\n    display = 'inline-flex',\n    size = 'm',\n    sizes,\n    fontColor = 'white',\n    color = 'accent',\n    disabled = false,\n    rounded = true,\n    width = 'auto',\n    as: _as = 'button',\n    type: _type,\n    className: _className,\n    children,\n    content,\n    onClick,\n    onClickCapture,\n    onMouseEnter,\n    onMouseLeave,\n    ...configProps\n  } = useConfigPriority<ButtonProps>(theme.components?.Button, props)\n\n  let brandPresetUsed = theme.preset === 'brand'\n  if (typeof configProps.preset === 'string') brandPresetUsed = configProps.preset === 'brand'\n\n  if (!brandPresetUsed && typeof size === 'string' && !configProps.round) {\n    const propsBySize = PROPS_BY_SIZE[size] ?? {}\n    configProps = { ...propsBySize, ...configProps }\n  }\n\n  let componentSizes = brandPresetUsed ? SIZES_BRAND : SIZES\n  if (configProps.round) componentSizes = brandPresetUsed ? SIZES_ROUND_BRAND : SIZES_ROUND\n  if (sizes) componentSizes = mergeDeepLeft(sizes, componentSizes) as Sizes\n\n  const className = useClassname(COMPONENT_NAME, _className)\n  const classNameContent = useClassname(COMPONENT_NAME)\n  const rel = useComputedRel(theme, configProps)\n  const linkProps = useComputedLinkProps(_as, disabled, configProps)\n\n  if (configProps.href) _as = 'a'\n  if (configProps.to) _as = Link\n\n  if (configProps.primary) color = 'primary'\n  if (configProps.secondary) color = 'atlantis'\n\n  let fontWeight: ButtonProps['fontWeight'] = brandPresetUsed ? 800 : 600\n  if (configProps.fontWeight) fontWeight = configProps.fontWeight\n\n  const fontBold = (typeof fontWeight === 'number' && fontWeight >= 800) || fontWeight === 'bold'\n\n  let borderRadius = '0px'\n  if (rounded) borderRadius = brandPresetUsed ? '48px' : '5px'\n  if (configProps.round) borderRadius = '50%'\n\n  let [leftIcon, rightIcon] = Array.isArray(configProps.icon) ? configProps.icon : [configProps.icon]\n\n  if (brandPresetUsed && configProps.loading && !configProps.success && !disabled) {\n    leftIcon = <Styled.SpinnerIcon strokeWidth={fontBold ? 2.5 : 1.5} />\n    rightIcon = null\n  }\n  if (configProps.success) {\n    leftIcon = <Styled.CheckIcon strokeWidth={fontBold ? 3 : 1.5} />\n    rightIcon = null\n  }\n\n  const handleDynamicSizeDeclaration: StyledButtonProps['dynamicSizeDeclaration'] = (size, cssProperty, cssUnit) => {\n    return {\n      [cssProperty]: typeof size === 'string' ? size : `${size}${cssUnit}`,\n      padding: configProps.round ? '1em' : '1em 1.6em',\n    }\n  }\n\n  const handleClick: ButtonProps['onClick'] = (evt) => {\n    if (!disabled && !configProps.loading) onClick?.(evt)\n  }\n  const handleClickCapture: ButtonProps['onClickCapture'] = (evt) => {\n    if (!disabled && !configProps.loading) onClickCapture?.(evt)\n  }\n  const handleMouseEnter: ButtonProps['onMouseEnter'] = (evt) => {\n    if (!disabled && !configProps.loading) onMouseEnter?.(evt)\n  }\n  const handleMouseLeave: ButtonProps['onMouseLeave'] = (evt) => {\n    if (!disabled && !configProps.loading) onMouseLeave?.(evt)\n  }\n\n  return (\n    <Styled.Root\n      {...configProps}\n      {...linkProps}\n      className={className}\n      as={_as}\n      color={color}\n      fontColor={fontColor}\n      disabled={disabled}\n      rel={rel}\n      display={display}\n      rounded={rounded}\n      size={size}\n      sizes={componentSizes}\n      dynamicSizeDeclaration={handleDynamicSizeDeclaration}\n      fontWeight={fontWeight}\n      borderRadius={borderRadius}\n      brandPresetUsed={brandPresetUsed}\n      ref={ref ?? configProps.innerRef}\n      type={_as === 'button' ? _type : undefined}\n      lineHeight={brandPresetUsed ? 1.2 : 1}\n      width={configProps.round ? undefined : width}\n      palette={{}}\n      onClick={handleClick}\n      onClickCapture={handleClickCapture}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n    >\n      {leftIcon && (\n        <Styled.IconSlot className='icon' marginRight={!configProps.round}>\n          {leftIcon}\n        </Styled.IconSlot>\n      )}\n      {(content || children) && (\n        <Styled.Content className={`${classNameContent}__content`}>{content || children}</Styled.Content>\n      )}\n      {rightIcon && !configProps.round && (\n        <Styled.IconSlot className='icon' marginLeft>\n          {rightIcon}\n        </Styled.IconSlot>\n      )}\n    </Styled.Root>\n  )\n})\n\nButton.displayName = COMPONENT_NAME\n\nexport { Button, COMPONENT_NAME }\n\nexport type { ButtonProps }\n"],"names":["COMPONENT_NAME","Button","forwardRef","props","ref","_theme$components","theme","useFallbackTheme","useConfigPriority","components","display","size","sizes","fontColor","color","disabled","rounded","width","as","_as","type","_type","className","_className","children","content","onClick","onClickCapture","onMouseEnter","onMouseLeave","_useConfigPriority","configProps","_objectWithoutProperties","_excluded","brandPresetUsed","preset","round","_PROPS_BY_SIZE$size","propsBySize","PROPS_BY_SIZE","componentSizes","SIZES_BRAND","SIZES","SIZES_ROUND_BRAND","SIZES_ROUND","mergeDeepLeft","useClassname","classNameContent","rel","useComputedRel","linkProps","useComputedLinkProps","href","to","Link","primary","secondary","fontWeight","fontBold","borderRadius","leftIcon","rightIcon","Array","isArray","icon","loading","success","_jsx","Styled.SpinnerIcon","strokeWidth","Styled.CheckIcon","_jsxs","Styled.Root","dynamicSizeDeclaration","cssProperty","cssUnit","padding","innerRef","lineHeight","palette","evt","Styled.IconSlot","marginRight","Styled.Content","concat","marginLeft","displayName"],"mappings":"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"}

package/components/Tab/Tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.js","sources":["../../../../src/components/Tab/Tab.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport type { TextProps } from 'shared/interfaces'\nimport { SIZES, SIZES_DEFAULT } from './constants'\nimport * as Styled from './style'\nimport type { TabProps } from './types'\n\nconst COMPONENT_NAME = 'Tab'\n\n/**\n *\n * Component interface extends:\n * - [`ResponsiveSizeProps`](#/Interfaces)\n * - [`ResponsiveMarginProps`](#/Interfaces)\n * - [`ColorPaletteProps<keyof TabPalette>`](#/Interfaces)\n * - [`TypographyProps`](#/Interfaces)\n * - [`BaseProps`](#/Interfaces)\n * - [`React.ComponentPropsWithRef<'button'>`](#/Interfaces)\n */\nconst Tab: React.ForwardRefExoticComponent<TabProps> = withMergedProps<TabProps, HTMLButtonElement>(\n  forwardRef((props, ref) => {\n    const { size = 'm', type = 'button', textProps = {}, children, theme, ...restProps } = props\n\n    const baseTextProps: TextProps = { as: 'span', size: 'inherit', color: 'inherit', weight: 'inherit' }\n\n    return (\n      <Styled.Root\n        {...restProps}\n        size={size}\n        tabTheme={theme}\n        type={restProps.as === undefined ? type : undefined}\n        ref={ref}\n      >\n        {restProps.preset === 'brand' ? (\n          <>\n            {restProps.left && <Styled.Edge />}\n            <Styled.Content>\n              {typeof children === 'function' ? (\n                children({ baseTextProps, textProps })\n              ) : (\n                <Text {...baseTextProps} {...textProps}>\n                  {children}\n                </Text>\n              )}\n            </Styled.Content>\n            {restProps.right && <Styled.Edge after />}\n          </>\n        ) : (\n          <>\n            {typeof children === 'function' ? (\n              children({ baseTextProps, textProps })\n            ) : (\n              <Text {...baseTextProps} {...textProps}>\n                {children}\n              </Text>\n            )}\n          </>\n        )}\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: (props) => {\n      return props.preset === 'brand' ? SIZES : SIZES_DEFAULT\n    },\n  }\n)\n\nexport { Tab, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Tab","withMergedProps","forwardRef","props","ref","size","type","textProps","children","theme","restProps","_excluded","baseTextProps","as","color","weight","_jsx","Styled.Root","tabTheme","preset","_jsxs","_Fragment","left","Styled.Edge","Styled.Content","Text","right","after","displayName","sizes","SIZES","SIZES_DEFAULT"],"mappings":"oeAQMA,IAAAA,EAAiB,MAYjBC,IAAAA,EAAiDC,EACrDC,GAAAA,CAAYC,EAAOC,KACjB,IAAMC,KAAEA,EAAO,IAATC,KAAcA,EAAO,SAArBC,UAA+BA,EAAY,GAA3CC,SAA+CA,EAA/CC,MAAyDA,GAAwBN,EAAdO,IAAcP,EAAvFQ,GAEA,IAAMC,EAA2B,CAAEC,GAAI,OAAQR,KAAM,UAAWS,MAAO,UAAWC,OAAQ,WAE1F,OACEC,EAACC,SACKP,GADN,GAAA,CAEEL,KAAMA,EACNa,SAAUT,EACVH,cAAMI,EAAUG,GAAmBP,OAAAA,EACnCF,IAAKA,EALPI,SAOwB,UAArBE,EAAUS,OACTC,EAAAC,EAAA,CAAAb,SAAA,CACGE,EAAUY,MAAQN,EAACO,EADtB,IAEEP,EAACQ,EAAD,CAAAhB,SACuB,mBAAbA,EACNA,EAAS,CAAEI,cAAAA,EAAeL,UAAAA,IAE1BS,EAACS,EAASb,EAAAA,EAAAA,EAAAA,GAAAA,GAAmBL,GAA7B,GAAA,CAAAC,SACGA,OAINE,EAAUgB,OAASV,EAACO,EAAD,CAAaI,OAAK,OAGxCX,EAAAK,EAAA,CAAAb,SACuB,mBAAbA,EACNA,EAAS,CAAEI,cAAAA,EAAeL,UAAAA,IAE1BS,EAACS,EAASb,EAAAA,EAAAA,EAAAA,GAAAA,GAAmBL,GAA7B,GAAA,CAAAC,SACGA,aAQf,CACEoB,YAvDmB,MAwDnBC,MAAQ1B,GACkB,UAAjBA,EAAMgB,OAAqBW,EAAQC"}
+{"version":3,"file":"Tab.js","sources":["../../../../src/components/Tab/Tab.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport type { TextProps } from 'components/Text'\nimport { SIZES, SIZES_DEFAULT } from './constants'\nimport * as Styled from './style'\nimport type { TabProps } from './types'\n\nconst COMPONENT_NAME = 'Tab'\n\n/**\n *\n * Component interface extends:\n * - [`ResponsiveSizeProps`](#/Interfaces)\n * - [`ResponsiveMarginProps`](#/Interfaces)\n * - [`ColorPaletteProps<keyof TabPalette>`](#/Interfaces)\n * - [`TypographyProps`](#/Interfaces)\n * - [`BaseProps`](#/Interfaces)\n * - [`React.ComponentPropsWithRef<'button'>`](#/Interfaces)\n */\nconst Tab: React.ForwardRefExoticComponent<TabProps> = withMergedProps<TabProps, HTMLButtonElement>(\n  forwardRef((props, ref) => {\n    const { size = 'm', type = 'button', textProps = {}, children, theme, ...restProps } = props\n\n    const baseTextProps: TextProps = { as: 'span', size: 'inherit', color: 'inherit', weight: 'inherit' }\n\n    return (\n      <Styled.Root\n        {...restProps}\n        size={size}\n        tabTheme={theme}\n        type={restProps.as === undefined ? type : undefined}\n        ref={ref}\n      >\n        {restProps.preset === 'brand' ? (\n          <>\n            {restProps.left && <Styled.Edge />}\n            <Styled.Content>\n              {typeof children === 'function' ? (\n                children({ baseTextProps, textProps })\n              ) : (\n                <Text {...baseTextProps} {...textProps}>\n                  {children}\n                </Text>\n              )}\n            </Styled.Content>\n            {restProps.right && <Styled.Edge after />}\n          </>\n        ) : (\n          <>\n            {typeof children === 'function' ? (\n              children({ baseTextProps, textProps })\n            ) : (\n              <Text {...baseTextProps} {...textProps}>\n                {children}\n              </Text>\n            )}\n          </>\n        )}\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: (props) => {\n      return props.preset === 'brand' ? SIZES : SIZES_DEFAULT\n    },\n  }\n)\n\nexport { Tab, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Tab","withMergedProps","forwardRef","props","ref","size","type","textProps","children","theme","restProps","_excluded","baseTextProps","as","color","weight","_jsx","Styled.Root","tabTheme","preset","_jsxs","_Fragment","left","Styled.Edge","Styled.Content","Text","right","after","displayName","sizes","SIZES","SIZES_DEFAULT"],"mappings":"oeAQMA,IAAAA,EAAiB,MAYjBC,IAAAA,EAAiDC,EACrDC,GAAAA,CAAYC,EAAOC,KACjB,IAAMC,KAAEA,EAAO,IAATC,KAAcA,EAAO,SAArBC,UAA+BA,EAAY,GAA3CC,SAA+CA,EAA/CC,MAAyDA,GAAwBN,EAAdO,IAAcP,EAAvFQ,GAEA,IAAMC,EAA2B,CAAEC,GAAI,OAAQR,KAAM,UAAWS,MAAO,UAAWC,OAAQ,WAE1F,OACEC,EAACC,SACKP,GADN,GAAA,CAEEL,KAAMA,EACNa,SAAUT,EACVH,cAAMI,EAAUG,GAAmBP,OAAAA,EACnCF,IAAKA,EALPI,SAOwB,UAArBE,EAAUS,OACTC,EAAAC,EAAA,CAAAb,SAAA,CACGE,EAAUY,MAAQN,EAACO,EADtB,IAEEP,EAACQ,EAAD,CAAAhB,SACuB,mBAAbA,EACNA,EAAS,CAAEI,cAAAA,EAAeL,UAAAA,IAE1BS,EAACS,EAASb,EAAAA,EAAAA,EAAAA,GAAAA,GAAmBL,GAA7B,GAAA,CAAAC,SACGA,OAINE,EAAUgB,OAASV,EAACO,EAAD,CAAaI,OAAK,OAGxCX,EAAAK,EAAA,CAAAb,SACuB,mBAAbA,EACNA,EAAS,CAAEI,cAAAA,EAAeL,UAAAA,IAE1BS,EAACS,EAASb,EAAAA,EAAAA,EAAAA,GAAAA,GAAmBL,GAA7B,GAAA,CAAAC,SACGA,aAQf,CACEoB,YAvDmB,MAwDnBC,MAAQ1B,GACkB,UAAjBA,EAAMgB,OAAqBW,EAAQC"}

package/components/Tab/style.js

@@ -1,2 +1,2 @@
-import o from'@babel/runtime/helpers/objectSpread2';import r,{css as e}from'styled-components';import n from'tinycolor2';import{getColor as t}from'../../mixins/color.js';import{responsiveSize as c}from'../../mixins/size.js';import{responsiveMargin as a}from'../../mixins/margin.js';import{focus as l}from'../../mixins/focus.js';import{createShouldForwardProp as i}from'../../shared/utils/style.js';import m from'./images/arrow.module.svg.js';var s=i((o=>!['active','compact','crispy','crispyCompact','tabTheme','left','right','rounded','outline','onColored'].includes(o)));var d={default:e(["",""],(o=>"\n      font-size: 16px;\n      font-weight: bold;\n      padding-bottom: 12px;\n      color: ".concat(o.active?o.theme.colors.primary:o.theme.colors.mineShaft,";\n      border-bottom: 2px solid ").concat(o.active?'currentcolor':'transparent',";\n      &:hover {\n        color: ").concat(o.theme.colors.primary,";\n      }\n      &.active {\n        color: ").concat(o.theme.colors.primary,";\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 60px;\n      }\n    "))),compact:e(["",""],(o=>"\n      font-size: 16px;\n      font-weight: normal;\n      padding-bottom: 10px;\n      color: ".concat(o.active?o.theme.colors.primary:o.theme.colors.mineShaft,";\n      border-bottom: 2px solid ").concat(o.active?'currentcolor':'transparent',";\n      &:hover {\n        color: ").concat(o.theme.colors.primary,";\n      }\n      &.active {\n        color: ").concat(o.theme.colors.primary,";\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 20px;\n      }\n    "))),crispyCompact:e(["",""],(o=>"\n      font-size: 12px;\n      font-weight: bold;\n      padding-bottom: 6px;\n      text-transform: uppercase;\n      color: ".concat(o.active?o.theme.colors.primary:o.theme.colors.mineShaft,";\n      border-bottom: 2px solid ").concat(o.active?'currentcolor':'transparent',";\n      &:hover {\n        color: ").concat(o.theme.colors.primary,";\n      }\n      &.active {\n        color: ").concat(o.theme.colors.primary,";\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 18px;\n      }\n    "))),crispy:e(["",""],(o=>"\n      font-size: 12px;\n      font-weight: bold;\n      padding-bottom: 30px;\n      text-transform: uppercase;\n      color: ".concat(o.active?o.theme.colors.primary:o.theme.colors.mineShaft,";\n      border-bottom: 2px solid ").concat(o.active?'currentcolor':'transparent',";\n      &:hover {\n        color: ").concat(o.theme.colors.primary,";\n      }\n      &.active {\n        color: ").concat(o.theme.colors.primary,";\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 32px;\n      }\n    ")))};var b=r.span.withConfig({componentId:"fox-ui__sc-26yal1-0"})(["position:relative;z-index:1;display:flex;align-items:center;flex-grow:1;flex-shrink:0;height:100%;padding:0 1em;border:1px solid transparent;"]);var p=r(m).withConfig({shouldForwardProp:()=>!1}).withConfig({componentId:"fox-ui__sc-26yal1-1"})(["flex-shrink:0;height:100%;",""],(o=>o.after&&'transform: rotate(180deg);'));var h=o=>"\n  &:hover > ".concat(b," {\n    color: ").concat(o.colorHover,";\n    background-color: ").concat(o.backgroundColorHover,";\n    border-color: ").concat(o.borderColorHover,";\n  }\n  &:hover > ").concat(p," {\n    color: ").concat(o.backgroundColorHover,";\n    stroke: ").concat(o.borderColorHover,";\n  }\n  & > ").concat(b,",\n  &:active > ").concat(b," {\n    color: ").concat(o.color,";\n    background-color: ").concat(o.backgroundColor,";\n    border-color: ").concat(o.borderColor,";\n  }\n  & > ").concat(p,",\n  &:active > ").concat(p," {\n    color: ").concat(o.backgroundColor,";\n    stroke: ").concat(o.borderColor,";\n  }\n  &:disabled > ").concat(b," {\n    color: ").concat(o.colorDisabled,";\n    background-color: ").concat(o.backgroundColorDisabled,";\n    border-color: ").concat(o.borderColorDisabled,";\n  }\n  &:disabled > ").concat(p," {\n    color: ").concat(o.backgroundColorDisabled,";\n    stroke: ").concat(o.borderColorDisabled,";\n  }\n");var g={default:{filled:e(["",""],(r=>h(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-onmain-tertiary'],borderColor:r.active?r.theme.colors['bg-brand-primary-500']:r.theme.colors['bg-onmain-tertiary'],colorHover:r.active?r.theme.colors['content-oncolor-primary']:r.theme.colors['content-onmain-primary'],backgroundColorHover:r.active?r.theme.colors['bg-brand-primary-500']:n(r.theme.colors['bg-onmain-tertiary']).darken(6).toString(),borderColorHover:r.active?r.theme.colors['bg-brand-primary-500']:n(r.theme.colors['bg-onmain-tertiary']).darken(6).toString(),colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.theme.colors['bg-disabled-large'],borderColorDisabled:r.theme.colors['bg-disabled-large']},r.palette)))),outline:e(["",""],(r=>h(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-onmain-primary'],borderColor:r.active?r.theme.colors['bg-brand-primary-500']: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?r.theme.colors['bg-brand-primary-500']:r.theme.colors['bg-onmain-tertiary'],borderColorHover:r.active?r.theme.colors['bg-brand-primary-500']:r.theme.colors['border-onmain-default-large'],colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.theme.colors['bg-disabled-large'],borderColorDisabled:r.theme.colors['bg-disabled-large']},r.palette))))},onColored:{filled:e(["",""],(r=>h(o({color:r.active?r.theme.colors['content-brand-primary']:r.theme.colors['content-oncolor-primary'],backgroundColor:r.active?r.theme.colors['bg-onmain-primary']:n(r.theme.colors['bg-brand-primary-500']).lighten(10).toString(),borderColor:r.active?r.theme.colors['bg-onmain-primary']:n(r.theme.colors['bg-brand-primary-500']).lighten(10).toString(),colorHover:r.active?r.theme.colors['content-brand-primary']:r.theme.colors['content-oncolor-primary'],backgroundColorHover:r.active?r.theme.colors['bg-onmain-primary']:n(r.theme.colors['bg-brand-primary-500']).lighten(5).toString(),borderColorHover:r.active?r.theme.colors['bg-onmain-primary']:n(r.theme.colors['bg-brand-primary-500']).lighten(5).toString(),colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.theme.colors['bg-disabled-small'],borderColorDisabled:r.theme.colors['bg-disabled-small']},r.palette)))),outline:e(["",""],(r=>h(o({color:r.active?r.theme.colors['content-brand-primary']:r.theme.colors['content-oncolor-primary'],backgroundColor:r.active?r.theme.colors['bg-onmain-primary']:r.theme.colors['bg-brand-primary-500'],borderColor:r.theme.colors['bg-onmain-primary'],colorHover:r.active?r.theme.colors['content-brand-primary']:r.theme.colors['content-oncolor-primary'],backgroundColorHover:r.active?r.theme.colors['bg-onmain-primary']:n(r.theme.colors['bg-brand-primary-500']).darken(3).toString(),borderColorHover:r.theme.colors['bg-onmain-primary'],colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.theme.colors['bg-disabled-small'],borderColorDisabled:r.theme.colors['bg-disabled-small']},r.palette))))}};var v=r.button.withConfig({shouldForwardProp:s}).attrs({dynamicSizeDeclaration:function(o,r,e){return{height:'2.8em',fontSize:"".concat(arguments.length<=0?void 0:o).concat(arguments.length<=2?void 0:e)}}}).withConfig({componentId:"fox-ui__sc-26yal1-2"})([""," "," "," "," "," "," ",""],(o=>{var r;var e=o.rounded?8:0;var n=o.left?0:e;var t=o.right?0:e;return"\n      display: ".concat('brand'===o.preset?'inline-flex':'inline-block',";\n      cursor: ").concat(null!==(r=o.cursor)&&void 0!==r?r:'pointer',";\n      isolation: isolate;\n      flex-shrink: 0;\n      appearance: none;\n      padding: 0;\n      border: none;\n      background-color: transparent;\n      text-decoration: none;\n      width: max-content;\n      &,\n      & > ").concat(b,", \n      & > ").concat(p," {\n        box-sizing: border-box;\n        transition-property: color, background-color;\n        transition-duration: 150ms;\n        transition-timing-function: ease-in;\n      }\n      & > ").concat(b," {\n        border-radius: ").concat(n,"px ").concat(t,"px ").concat(t,"px ").concat(n,"px;\n        border-left-style: ").concat(o.left?'none':'solid',";\n        border-right-style: ").concat(o.right?'none':'solid',";\n        margin-left: ").concat(o.left?-2:0,"px;\n        margin-right: ").concat(o.right?-2:0,"px;\n      }\n    ")}),(o=>{if('brand'===o.preset){var r=o.onColored?g.onColored:g.default;return o.outline?r.outline:r.filled}return o.compact||'compact'===o.tabTheme?d.compact:o.crispyCompact||'crispyCompact'===o.tabTheme?d.crispyCompact:o.crispy||'crispy'===o.tabTheme?d.crispy:d.default}),l,c,a,(o=>o.color&&"color: ".concat(t(o.color,o),";")),(o=>o.borderColor&&"border-color: ".concat(t(o.borderColor,o),";")));export{b as Content,p as Edge,v as Root};
+import o from'@babel/runtime/helpers/objectSpread2';import r,{css as e}from'styled-components';import n from'tinycolor2';import{getColor as t}from'../../mixins/color.js';import{responsiveSize as c}from'../../mixins/size.js';import{responsiveMargin as a}from'../../mixins/margin.js';import{focus as l}from'../../mixins/focus.js';import{createShouldForwardProp as i}from'../../shared/utils/style.js';import m from'./images/arrow.module.svg.js';var s=i((o=>!['active','compact','crispy','crispyCompact','tabTheme','left','right','rounded','outline','onColored'].includes(o)));var d={default:e(["",""],(o=>"\n      font-size: 16px;\n      font-weight: bold;\n      padding-bottom: 12px;\n      color: ".concat(o.active?o.theme.colors.primary:o.theme.colors.mineShaft,";\n      border-bottom: 2px solid ").concat(o.active?'currentcolor':'transparent',";\n      &:hover {\n        color: ").concat(o.theme.colors.primary,";\n      }\n      &.active {\n        color: ").concat(o.theme.colors.primary,";\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 60px;\n      }\n    "))),compact:e(["",""],(o=>"\n      font-size: 16px;\n      font-weight: normal;\n      padding-bottom: 10px;\n      color: ".concat(o.active?o.theme.colors.primary:o.theme.colors.mineShaft,";\n      border-bottom: 2px solid ").concat(o.active?'currentcolor':'transparent',";\n      &:hover {\n        color: ").concat(o.theme.colors.primary,";\n      }\n      &.active {\n        color: ").concat(o.theme.colors.primary,";\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 20px;\n      }\n    "))),crispyCompact:e(["",""],(o=>"\n      font-size: 12px;\n      font-weight: bold;\n      padding-bottom: 6px;\n      text-transform: uppercase;\n      color: ".concat(o.active?o.theme.colors.primary:o.theme.colors.mineShaft,";\n      border-bottom: 2px solid ").concat(o.active?'currentcolor':'transparent',";\n      &:hover {\n        color: ").concat(o.theme.colors.primary,";\n      }\n      &.active {\n        color: ").concat(o.theme.colors.primary,";\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 18px;\n      }\n    "))),crispy:e(["",""],(o=>"\n      font-size: 12px;\n      font-weight: bold;\n      padding-bottom: 30px;\n      text-transform: uppercase;\n      color: ".concat(o.active?o.theme.colors.primary:o.theme.colors.mineShaft,";\n      border-bottom: 2px solid ").concat(o.active?'currentcolor':'transparent',";\n      &:hover {\n        color: ").concat(o.theme.colors.primary,";\n      }\n      &.active {\n        color: ").concat(o.theme.colors.primary,";\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 32px;\n      }\n    ")))};var b=r.span.withConfig({componentId:"fox-ui__sc-26yal1-0"})(["position:relative;z-index:1;display:flex;align-items:center;flex-grow:1;flex-shrink:0;height:100%;padding:0 1em;border:1px solid transparent;"]);var p=r(m).withConfig({shouldForwardProp:()=>!1}).withConfig({componentId:"fox-ui__sc-26yal1-1"})(["flex-shrink:0;height:100%;",""],(o=>o.after&&'transform: rotate(180deg);'));var h=o=>"\n  &:hover > ".concat(b," {\n    color: ").concat(o.colorHover,";\n    background-color: ").concat(o.backgroundColorHover,";\n    border-color: ").concat(o.borderColorHover,";\n  }\n  &:hover > ").concat(p," {\n    color: ").concat(o.backgroundColorHover,";\n    stroke: ").concat(o.borderColorHover,";\n  }\n  & > ").concat(b,",\n  &:active > ").concat(b," {\n    color: ").concat(o.color,";\n    background-color: ").concat(o.backgroundColor,";\n    border-color: ").concat(o.borderColor,";\n  }\n  & > ").concat(p,",\n  &:active > ").concat(p," {\n    color: ").concat(o.backgroundColor,";\n    stroke: ").concat(o.borderColor,";\n  }\n  &:disabled > ").concat(b," {\n    color: ").concat(o.colorDisabled,";\n    background-color: ").concat(o.backgroundColorDisabled,";\n    border-color: ").concat(o.borderColorDisabled,";\n  }\n  &:disabled > ").concat(p," {\n    color: ").concat(o.backgroundColorDisabled,";\n    stroke: ").concat(o.borderColorDisabled,";\n  }\n");var g={default:{filled:e(["",""],(r=>h(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-onmain-tertiary'],borderColor:r.active?r.theme.colors['bg-brand-primary-500']:r.theme.colors['bg-onmain-tertiary'],colorHover:r.active?r.theme.colors['content-oncolor-primary']:r.theme.colors['content-onmain-primary'],backgroundColorHover:r.active?r.theme.colors['bg-brand-primary-500']:n(r.theme.colors['bg-onmain-tertiary']).darken(6).toString(),borderColorHover:r.active?r.theme.colors['bg-brand-primary-500']:n(r.theme.colors['bg-onmain-tertiary']).darken(6).toString(),colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.theme.colors['bg-disabled-large'],borderColorDisabled:r.theme.colors['bg-disabled-large']},r.palette)))),outline:e(["",""],(r=>h(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-onmain-primary'],borderColor:r.active?r.theme.colors['bg-brand-primary-500']: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?r.theme.colors['bg-brand-primary-500']:r.theme.colors['bg-onmain-tertiary'],borderColorHover:r.active?r.theme.colors['bg-brand-primary-500']:r.theme.colors['border-onmain-default-large'],colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.theme.colors['bg-disabled-large'],borderColorDisabled:r.theme.colors['bg-disabled-large']},r.palette))))},onColored:{filled:e(["",""],(r=>h(o({color:r.active?r.theme.colors['content-brand-primary']:r.theme.colors['content-oncolor-primary'],backgroundColor:r.active?r.theme.colors['bg-onmain-primary']:n(r.theme.colors['bg-brand-primary-500']).lighten(10).toString(),borderColor:r.active?r.theme.colors['bg-onmain-primary']:n(r.theme.colors['bg-brand-primary-500']).lighten(10).toString(),colorHover:r.active?r.theme.colors['content-brand-primary']:r.theme.colors['content-oncolor-primary'],backgroundColorHover:r.active?r.theme.colors['bg-onmain-primary']:n(r.theme.colors['bg-brand-primary-500']).lighten(5).toString(),borderColorHover:r.active?r.theme.colors['bg-onmain-primary']:n(r.theme.colors['bg-brand-primary-500']).lighten(5).toString(),colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.theme.colors['bg-disabled-small'],borderColorDisabled:r.theme.colors['bg-disabled-small']},r.palette)))),outline:e(["",""],(r=>h(o({color:r.active?r.theme.colors['content-brand-primary']:r.theme.colors['content-oncolor-primary'],backgroundColor:r.active?r.theme.colors['bg-onmain-primary']:r.theme.colors['bg-brand-primary-500'],borderColor:r.theme.colors['bg-onmain-primary'],colorHover:r.active?r.theme.colors['content-brand-primary']:r.theme.colors['content-oncolor-primary'],backgroundColorHover:r.active?r.theme.colors['bg-onmain-primary']:n(r.theme.colors['bg-brand-primary-500']).darken(3).toString(),borderColorHover:r.theme.colors['bg-onmain-primary'],colorDisabled:r.theme.colors['content-disabled'],backgroundColorDisabled:r.theme.colors['bg-disabled-small'],borderColorDisabled:r.theme.colors['bg-disabled-small']},r.palette))))}};var y=r.button.withConfig({shouldForwardProp:s}).attrs({dynamicSizeDeclaration:(o,r,e)=>({height:'2.8em',[r]:'string'==typeof o?o:"".concat(o).concat(e)})}).withConfig({componentId:"fox-ui__sc-26yal1-2"})([""," "," "," "," "," "," ",""],(o=>{var r;var e=o.rounded?8:0;var n=o.left?0:e;var t=o.right?0:e;return"\n      display: ".concat('brand'===o.preset?'inline-flex':'inline-block',";\n      cursor: ").concat(null!==(r=o.cursor)&&void 0!==r?r:'pointer',";\n      isolation: isolate;\n      flex-shrink: 0;\n      appearance: none;\n      padding: 0;\n      border: none;\n      background-color: transparent;\n      text-decoration: none;\n      width: max-content;\n      &,\n      & > ").concat(b,", \n      & > ").concat(p," {\n        box-sizing: border-box;\n        transition-property: color, background-color;\n        transition-duration: 150ms;\n        transition-timing-function: ease-in;\n      }\n      & > ").concat(b," {\n        border-radius: ").concat(n,"px ").concat(t,"px ").concat(t,"px ").concat(n,"px;\n        border-left-style: ").concat(o.left?'none':'solid',";\n        border-right-style: ").concat(o.right?'none':'solid',";\n        margin-left: ").concat(o.left?-2:0,"px;\n        margin-right: ").concat(o.right?-2:0,"px;\n      }\n    ")}),(o=>{if('brand'===o.preset){var r=o.onColored?g.onColored:g.default;return o.outline?r.outline:r.filled}return o.compact||'compact'===o.tabTheme?d.compact:o.crispyCompact||'crispyCompact'===o.tabTheme?d.crispyCompact:o.crispy||'crispy'===o.tabTheme?d.crispy:d.default}),l,c,a,(o=>o.color&&"color: ".concat(t(o.color,o),";")),(o=>o.borderColor&&"border-color: ".concat(t(o.borderColor,o),";")));export{b as Content,p as Edge,y as Root};
 //# sourceMappingURL=style.js.map

package/components/Tab/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/Tab/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport type { ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { getColor } from 'mixins/color'\nimport { responsiveSize } from 'mixins/size'\nimport { responsiveMargin } from 'mixins/margin'\nimport { focus } from 'mixins/focus'\nimport type { CSSColor, DynamicSizeDeclaration } from 'shared/interfaces'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport type { StyledTabProps, StyledTabEdgeProps, TabPalette } from './types'\nimport Arrow from './images/arrow.module.svg'\n\nconst shouldForwardTabProp = createShouldForwardProp(\n  (propKey) =>\n    ![\n      'active',\n      'compact',\n      'crispy',\n      'crispyCompact',\n      'tabTheme',\n      'left',\n      'right',\n      'rounded',\n      'outline',\n      'onColored',\n    ].includes(propKey)\n)\n\nconst DEFAULT_STYLES = {\n  default: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 16px;\n      font-weight: bold;\n      padding-bottom: 12px;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 60px;\n      }\n    `}\n  `,\n  compact: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 16px;\n      font-weight: normal;\n      padding-bottom: 10px;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 20px;\n      }\n    `}\n  `,\n  crispyCompact: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 12px;\n      font-weight: bold;\n      padding-bottom: 6px;\n      text-transform: uppercase;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 18px;\n      }\n    `}\n  `,\n  crispy: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 12px;\n      font-weight: bold;\n      padding-bottom: 30px;\n      text-transform: uppercase;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 32px;\n      }\n    `}\n  `,\n}\n\nexport const Content = styled.span`\n  position: relative;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  flex-grow: 1;\n  flex-shrink: 0;\n  height: 100%;\n  padding: 0 1em;\n  border: 1px solid transparent;\n`\n\nexport const Edge = styled(Arrow).withConfig({\n  shouldForwardProp: () => false,\n})<StyledTabEdgeProps>`\n  flex-shrink: 0;\n  height: 100%;\n  ${(props) => props.after && 'transform: rotate(180deg);'}\n`\n\nconst template = (palette: TabPalette) => `\n  &:hover > ${Content} {\n    color: ${palette.colorHover};\n    background-color: ${palette.backgroundColorHover};\n    border-color: ${palette.borderColorHover};\n  }\n  &:hover > ${Edge} {\n    color: ${palette.backgroundColorHover};\n    stroke: ${palette.borderColorHover};\n  }\n  & > ${Content},\n  &:active > ${Content} {\n    color: ${palette.color};\n    background-color: ${palette.backgroundColor};\n    border-color: ${palette.borderColor};\n  }\n  & > ${Edge},\n  &:active > ${Edge} {\n    color: ${palette.backgroundColor};\n    stroke: ${palette.borderColor};\n  }\n  &:disabled > ${Content} {\n    color: ${palette.colorDisabled};\n    background-color: ${palette.backgroundColorDisabled};\n    border-color: ${palette.borderColorDisabled};\n  }\n  &:disabled > ${Edge} {\n    color: ${palette.backgroundColorDisabled};\n    stroke: ${palette.borderColorDisabled};\n  }\n`\n\nconst COLOR_SCHEMA = {\n  default: {\n    filled: css<StyledTabProps>`\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-onmain-tertiary'],\n          borderColor: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['bg-onmain-tertiary'],\n          colorHover: props.active\n            ? props.theme.colors['content-oncolor-primary']\n            : props.theme.colors['content-onmain-primary'],\n          backgroundColorHover: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : (tinycolor(props.theme.colors['bg-onmain-tertiary']).darken(6).toString() as CSSColor),\n          borderColorHover: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : (tinycolor(props.theme.colors['bg-onmain-tertiary']).darken(6).toString() as CSSColor),\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n          borderColorDisabled: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    outline: css<StyledTabProps>`\n      ${(props) => {\n        return 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-onmain-primary'],\n          borderColor: props.active\n            ? props.theme.colors['bg-brand-primary-500']\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            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['bg-onmain-tertiary'],\n          borderColorHover: props.active\n            ? props.theme.colors['bg-brand-primary-500']\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['bg-disabled-large'],\n          ...props.palette,\n        })\n      }}\n    `,\n  },\n  onColored: {\n    filled: css<StyledTabProps>`\n      ${(props) =>\n        template({\n          color: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(10).toString() as CSSColor),\n          borderColor: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(10).toString() as CSSColor),\n          colorHover: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColorHover: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(5).toString() as CSSColor),\n          borderColorHover: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(5).toString() as CSSColor),\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-small'],\n          borderColorDisabled: props.theme.colors['bg-disabled-small'],\n          ...props.palette,\n        })}\n    `,\n    outline: css<StyledTabProps>`\n      ${(props) =>\n        template({\n          color: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : props.theme.colors['bg-brand-primary-500'],\n          borderColor: props.theme.colors['bg-onmain-primary'],\n          colorHover: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColorHover: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).darken(3).toString() as CSSColor),\n          borderColorHover: props.theme.colors['bg-onmain-primary'],\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-small'],\n          borderColorDisabled: props.theme.colors['bg-disabled-small'],\n          ...props.palette,\n        })}\n    `,\n  },\n}\n\nconst tabStyles = (props: ThemedStyledProps<StyledTabProps, DefaultTheme>) => {\n  if (props.preset === 'brand') {\n    const schema = props.onColored ? COLOR_SCHEMA.onColored : COLOR_SCHEMA.default\n    return props.outline ? schema.outline : schema.filled\n  }\n\n  if (props.compact || props.tabTheme === 'compact') return DEFAULT_STYLES.compact\n  if (props.crispyCompact || props.tabTheme === 'crispyCompact') return DEFAULT_STYLES.crispyCompact\n  if (props.crispy || props.tabTheme === 'crispy') return DEFAULT_STYLES.crispy\n\n  return DEFAULT_STYLES.default\n}\n\nexport const Root = styled.button\n  .withConfig<StyledTabProps>({\n    shouldForwardProp: shouldForwardTabProp,\n  })\n  .attrs({\n    dynamicSizeDeclaration: (...args: Parameters<DynamicSizeDeclaration>) => {\n      return {\n        height: '2.8em',\n        fontSize: `${args[0]}${args[2]}`,\n      }\n    },\n  })`\n  ${(props) => {\n    const radius = props.rounded ? 8 : 0\n    const leftRadius = props.left ? 0 : radius\n    const rightRadius = props.right ? 0 : radius\n\n    return `\n      display: ${props.preset === 'brand' ? 'inline-flex' : 'inline-block'};\n      cursor: ${props.cursor ?? 'pointer'};\n      isolation: isolate;\n      flex-shrink: 0;\n      appearance: none;\n      padding: 0;\n      border: none;\n      background-color: transparent;\n      text-decoration: none;\n      width: max-content;\n      &,\n      & > ${Content}, \n      & > ${Edge} {\n        box-sizing: border-box;\n        transition-property: color, background-color;\n        transition-duration: 150ms;\n        transition-timing-function: ease-in;\n      }\n      & > ${Content} {\n        border-radius: ${leftRadius}px ${rightRadius}px ${rightRadius}px ${leftRadius}px;\n        border-left-style: ${props.left ? 'none' : 'solid'};\n        border-right-style: ${props.right ? 'none' : 'solid'};\n        margin-left: ${props.left ? -2 : 0}px;\n        margin-right: ${props.right ? -2 : 0}px;\n      }\n    `\n  }}\n\n  ${tabStyles}\n  ${focus}\n  ${responsiveSize}\n  ${responsiveMargin}\n\n  ${(props) => props.color && `color: ${getColor(props.color, props)};`}\n  ${(props) => props.borderColor && `border-color: ${getColor(props.borderColor, props)};`}\n`\n"],"names":["shouldForwardTabProp","createShouldForwardProp","propKey","includes","DEFAULT_STYLES","default","css","props","active","theme","colors","primary","mineShaft","concat","compact","crispyCompact","crispy","Content","styled","span","withConfig","componentId","Edge","Arrow","shouldForwardProp","after","template","palette","colorHover","backgroundColorHover","borderColorHover","color","backgroundColor","borderColor","colorDisabled","backgroundColorDisabled","borderColorDisabled","COLOR_SCHEMA","filled","_objectSpread","tinycolor","darken","toString","outline","onColored","lighten","Root","button","attrs","dynamicSizeDeclaration","o","r","e","height","fontSize","arguments","length","undefined","_props$cursor","radius","rounded","leftRadius","left","rightRadius","right","preset","cursor","schema","tabTheme","focus","responsiveSize","responsiveMargin","getColor"],"mappings":"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"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/Tab/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport type { ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { getColor } from 'mixins/color'\nimport { responsiveSize } from 'mixins/size'\nimport { responsiveMargin } from 'mixins/margin'\nimport { focus } from 'mixins/focus'\nimport type { CSSColor } from 'shared/interfaces'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport type { StyledTabProps, StyledTabEdgeProps, TabPalette } from './types'\nimport Arrow from './images/arrow.module.svg'\n\nconst shouldForwardTabProp = createShouldForwardProp(\n  (propKey) =>\n    ![\n      'active',\n      'compact',\n      'crispy',\n      'crispyCompact',\n      'tabTheme',\n      'left',\n      'right',\n      'rounded',\n      'outline',\n      'onColored',\n    ].includes(propKey)\n)\n\nconst DEFAULT_STYLES = {\n  default: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 16px;\n      font-weight: bold;\n      padding-bottom: 12px;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 60px;\n      }\n    `}\n  `,\n  compact: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 16px;\n      font-weight: normal;\n      padding-bottom: 10px;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 20px;\n      }\n    `}\n  `,\n  crispyCompact: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 12px;\n      font-weight: bold;\n      padding-bottom: 6px;\n      text-transform: uppercase;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 18px;\n      }\n    `}\n  `,\n  crispy: css<StyledTabProps>`\n    ${(props) => `\n      font-size: 12px;\n      font-weight: bold;\n      padding-bottom: 30px;\n      text-transform: uppercase;\n      color: ${props.active ? props.theme.colors.primary : props.theme.colors.mineShaft};\n      border-bottom: 2px solid ${props.active ? 'currentcolor' : 'transparent'};\n      &:hover {\n        color: ${props.theme.colors.primary};\n      }\n      &.active {\n        color: ${props.theme.colors.primary};\n        border-bottom-color: currentcolor;\n      }\n      & + & {\n        margin-left: 32px;\n      }\n    `}\n  `,\n}\n\nexport const Content = styled.span`\n  position: relative;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  flex-grow: 1;\n  flex-shrink: 0;\n  height: 100%;\n  padding: 0 1em;\n  border: 1px solid transparent;\n`\n\nexport const Edge = styled(Arrow).withConfig({\n  shouldForwardProp: () => false,\n})<StyledTabEdgeProps>`\n  flex-shrink: 0;\n  height: 100%;\n  ${(props) => props.after && 'transform: rotate(180deg);'}\n`\n\nconst template = (palette: TabPalette) => `\n  &:hover > ${Content} {\n    color: ${palette.colorHover};\n    background-color: ${palette.backgroundColorHover};\n    border-color: ${palette.borderColorHover};\n  }\n  &:hover > ${Edge} {\n    color: ${palette.backgroundColorHover};\n    stroke: ${palette.borderColorHover};\n  }\n  & > ${Content},\n  &:active > ${Content} {\n    color: ${palette.color};\n    background-color: ${palette.backgroundColor};\n    border-color: ${palette.borderColor};\n  }\n  & > ${Edge},\n  &:active > ${Edge} {\n    color: ${palette.backgroundColor};\n    stroke: ${palette.borderColor};\n  }\n  &:disabled > ${Content} {\n    color: ${palette.colorDisabled};\n    background-color: ${palette.backgroundColorDisabled};\n    border-color: ${palette.borderColorDisabled};\n  }\n  &:disabled > ${Edge} {\n    color: ${palette.backgroundColorDisabled};\n    stroke: ${palette.borderColorDisabled};\n  }\n`\n\nconst COLOR_SCHEMA = {\n  default: {\n    filled: css<StyledTabProps>`\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-onmain-tertiary'],\n          borderColor: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['bg-onmain-tertiary'],\n          colorHover: props.active\n            ? props.theme.colors['content-oncolor-primary']\n            : props.theme.colors['content-onmain-primary'],\n          backgroundColorHover: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : (tinycolor(props.theme.colors['bg-onmain-tertiary']).darken(6).toString() as CSSColor),\n          borderColorHover: props.active\n            ? props.theme.colors['bg-brand-primary-500']\n            : (tinycolor(props.theme.colors['bg-onmain-tertiary']).darken(6).toString() as CSSColor),\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n          borderColorDisabled: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    outline: css<StyledTabProps>`\n      ${(props) => {\n        return 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-onmain-primary'],\n          borderColor: props.active\n            ? props.theme.colors['bg-brand-primary-500']\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            ? props.theme.colors['bg-brand-primary-500']\n            : props.theme.colors['bg-onmain-tertiary'],\n          borderColorHover: props.active\n            ? props.theme.colors['bg-brand-primary-500']\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['bg-disabled-large'],\n          ...props.palette,\n        })\n      }}\n    `,\n  },\n  onColored: {\n    filled: css<StyledTabProps>`\n      ${(props) =>\n        template({\n          color: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(10).toString() as CSSColor),\n          borderColor: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(10).toString() as CSSColor),\n          colorHover: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColorHover: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(5).toString() as CSSColor),\n          borderColorHover: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).lighten(5).toString() as CSSColor),\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-small'],\n          borderColorDisabled: props.theme.colors['bg-disabled-small'],\n          ...props.palette,\n        })}\n    `,\n    outline: css<StyledTabProps>`\n      ${(props) =>\n        template({\n          color: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : props.theme.colors['bg-brand-primary-500'],\n          borderColor: props.theme.colors['bg-onmain-primary'],\n          colorHover: props.active\n            ? props.theme.colors['content-brand-primary']\n            : props.theme.colors['content-oncolor-primary'],\n          backgroundColorHover: props.active\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-brand-primary-500']).darken(3).toString() as CSSColor),\n          borderColorHover: props.theme.colors['bg-onmain-primary'],\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-small'],\n          borderColorDisabled: props.theme.colors['bg-disabled-small'],\n          ...props.palette,\n        })}\n    `,\n  },\n}\n\nconst tabStyles = (props: ThemedStyledProps<StyledTabProps, DefaultTheme>) => {\n  if (props.preset === 'brand') {\n    const schema = props.onColored ? COLOR_SCHEMA.onColored : COLOR_SCHEMA.default\n    return props.outline ? schema.outline : schema.filled\n  }\n\n  if (props.compact || props.tabTheme === 'compact') return DEFAULT_STYLES.compact\n  if (props.crispyCompact || props.tabTheme === 'crispyCompact') return DEFAULT_STYLES.crispyCompact\n  if (props.crispy || props.tabTheme === 'crispy') return DEFAULT_STYLES.crispy\n\n  return DEFAULT_STYLES.default\n}\n\nexport const Root = styled.button\n  .withConfig<StyledTabProps>({\n    shouldForwardProp: shouldForwardTabProp,\n  })\n  .attrs(<Required<Pick<StyledTabProps, 'dynamicSizeDeclaration'>>>{\n    dynamicSizeDeclaration: (size, cssProperty, cssUnit) => {\n      return {\n        height: '2.8em',\n        [cssProperty]: typeof size === 'string' ? size : `${size}${cssUnit}`,\n      }\n    },\n  })`\n  ${(props) => {\n    const radius = props.rounded ? 8 : 0\n    const leftRadius = props.left ? 0 : radius\n    const rightRadius = props.right ? 0 : radius\n\n    return `\n      display: ${props.preset === 'brand' ? 'inline-flex' : 'inline-block'};\n      cursor: ${props.cursor ?? 'pointer'};\n      isolation: isolate;\n      flex-shrink: 0;\n      appearance: none;\n      padding: 0;\n      border: none;\n      background-color: transparent;\n      text-decoration: none;\n      width: max-content;\n      &,\n      & > ${Content}, \n      & > ${Edge} {\n        box-sizing: border-box;\n        transition-property: color, background-color;\n        transition-duration: 150ms;\n        transition-timing-function: ease-in;\n      }\n      & > ${Content} {\n        border-radius: ${leftRadius}px ${rightRadius}px ${rightRadius}px ${leftRadius}px;\n        border-left-style: ${props.left ? 'none' : 'solid'};\n        border-right-style: ${props.right ? 'none' : 'solid'};\n        margin-left: ${props.left ? -2 : 0}px;\n        margin-right: ${props.right ? -2 : 0}px;\n      }\n    `\n  }}\n\n  ${tabStyles}\n  ${focus}\n  ${responsiveSize}\n  ${responsiveMargin}\n\n  ${(props) => props.color && `color: ${getColor(props.color, props)};`}\n  ${(props) => props.borderColor && `border-color: ${getColor(props.borderColor, props)};`}\n`\n"],"names":["shouldForwardTabProp","createShouldForwardProp","propKey","includes","DEFAULT_STYLES","default","css","props","active","theme","colors","primary","mineShaft","concat","compact","crispyCompact","crispy","Content","styled","span","withConfig","componentId","Edge","Arrow","shouldForwardProp","after","template","palette","colorHover","backgroundColorHover","borderColorHover","color","backgroundColor","borderColor","colorDisabled","backgroundColorDisabled","borderColorDisabled","COLOR_SCHEMA","filled","_objectSpread","tinycolor","darken","toString","outline","onColored","lighten","Root","button","attrs","dynamicSizeDeclaration","size","cssProperty","cssUnit","height","_props$cursor","radius","rounded","leftRadius","left","rightRadius","right","preset","cursor","schema","tabTheme","focus","responsiveSize","responsiveMargin","getColor"],"mappings":"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"}

package/components/Tag/Tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.js","sources":["../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import { ResponsiveNamedProperty } from 'mixins/responsive-property'\nimport { ColorProperty } from 'mixins/color'\nimport { DisplayProperty } from 'mixins/display'\nimport type { BaseProps, TextProps } from 'shared/interfaces'\nimport { DefaultColorNames } from 'theme/colors'\nimport * as Styled from './style'\n\nexport interface TagProps\n  extends BaseProps,\n    DisplayProperty,\n    ColorProperty,\n    ResponsiveNamedProperty<'height'>,\n    ResponsiveNamedProperty<'width'> {\n  as?: 'button' | 'div' | 'input' | 'label'\n  /**\n   * Field id\n   */\n  id?: string\n  /**\n   * Field name\n   */\n  name?: string\n  /**\n   * Input type\n   */\n  inputType?: 'checkbox' | 'radio'\n  /**\n   * On change handler\n   */\n  onChange?(_e: React.ChangeEvent<HTMLInputElement>): void\n  /**\n   * On click handler\n   */\n  onClick?(_e: React.MouseEvent<HTMLInputElement>): void\n  /**\n   * Whether or not Radio is checked\n   */\n  defaultChecked?: boolean\n  /**\n   * Value\n   */\n  value?: string | number\n  /** Children are placed before Text */\n  /**\n   * Children react node\n   */\n  children?: React.ReactNode\n  /** Inner Text content  */\n  content?: React.ReactNode\n  /** Inner Text component props */\n  textProps?: TextProps\n  /** Checked state */\n  checked?: boolean\n  /** Disabled state */\n  disabled?: boolean\n  /** Error state */\n  error?: boolean\n  /** If as = 'label' could provide for */\n  htmlFor?: string\n  /**\n   * inverse\n   */\n  inverse?: boolean\n  /**\n   * Size\n   */\n  size?: 'l' | 'm' | 's' | 'xs'\n}\n\nTag.defaultProps = {\n  display: 'inline-block',\n  as: 'button',\n  height: 40,\n}\n\nTagInput.defaultProps = {\n  display: 'inline-block',\n  height: 40,\n}\n\n// Prevent brakechanges\nTag.Input = TagInput\n\nTag.displayName = 'Tag'\n\nfunction TagInput(props: typeof TagInput.defaultProps & TagProps) {\n  return <Tag as='input' {...props} />\n}\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n * - [`Display`](#/Миксины)\n * - [`Color`](#/Миксины)\n * - [`ResponsiveNamedProperty<'width'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'height'>`](#/Миксины)\n */\nexport function Tag(props: typeof Tag.defaultProps & TagProps) {\n  const {\n    as,\n    textProps,\n    content,\n    children,\n    htmlFor,\n    id,\n    name,\n    inputType,\n    value,\n    disabled,\n    onChange,\n    onClick,\n    inverse,\n    checked,\n    ...restProps\n  } = props\n\n  const buttonProps = as === 'button' ? { type: 'button' } : {}\n  const labelProps = as === 'label' ? { htmlFor } : {}\n  const inputProps = as === 'input' ? { htmlFor: id || name } : {}\n\n  return (\n    <Styled.Root\n      as={as === 'input' ? 'label' : as}\n      inverse={inverse}\n      checked={checked}\n      disabled={disabled}\n      onClick={as !== 'input' ? onClick : undefined}\n      {...labelProps}\n      {...buttonProps}\n      {...inputProps}\n      {...restProps}\n    >\n      {as === 'input' ? (\n        <input\n          id={id || name}\n          name={name}\n          type={inputType || 'checkbox'}\n          tabIndex={0}\n          onChange={(e) => {\n            e.persist()\n\n            return onChange && onChange(e)\n          }}\n          onClick={(e) => {\n            e.persist()\n\n            return onClick && onClick(e)\n          }}\n          defaultChecked={props.defaultChecked}\n          checked={checked}\n          value={value}\n          disabled={disabled}\n          hidden\n        />\n      ) : null}\n      {children}\n      <Styled.Text\n        size={14}\n        forwardedAs='span'\n        color={checked && !inverse ? DefaultColorNames.white : DefaultColorNames.mineShaft}\n        {...textProps}\n      >\n        {content}\n      </Styled.Text>\n    </Styled.Root>\n  )\n}\n"],"names":["TagInput","props","_jsx","Tag","_objectSpread","as","textProps","content","children","htmlFor","id","name","inputType","value","disabled","onChange","onClick","inverse","checked","restProps","_excluded","buttonProps","type","inputProps","_jsxs","Styled.Root","tabIndex","_onChange","_x","apply","this","arguments","toString","e","persist","_onClick","_x2","defaultChecked","hidden","Styled.Text","size","forwardedAs","color","DefaultColorNames","white","mineShaft","defaultProps","display","height","Input","displayName"],"mappings":"sZAqFA,SAASA,EAASC,GAChB,OAAOC,EAACC,EAADC,EAAA,CAAKC,GAAG,SAAYJ,IAWtB,SAASE,EAAIF,GAClB,IAAMI,GACJA,EADIC,UAEJA,EAFIC,QAGJA,EAHIC,SAIJA,EAJIC,QAKJA,EALIC,GAMJA,EANIC,KAOJA,EAPIC,UAQJA,EARIC,MASJA,EATIC,SAUJA,EAVIC,SAWJA,EAXIC,QAYJA,EAZIC,QAaJA,EAbIC,QAcJA,GAEEjB,EADCkB,IACDlB,EAhBJmB,GAkBA,IAAMC,EAAqB,WAAPhB,EAAkB,CAAEiB,KAAM,UAAa,GAE3D,IAAMC,EAAoB,UAAPlB,EAAiB,CAAEI,QAASC,GAAMC,GAAS,GAE9D,OACEa,EAACC,EAADrB,EAAAA,EAAAA,EAAAA,EAAAA,EAAA,CACEC,GAAW,UAAPA,EAAiB,QAAUA,EAC/BY,QAASA,EACTC,QAASA,EACTJ,SAAUA,EACVE,QAAgB,UAAPX,EAAiBW,OAAAA,GATJ,UAAPX,EAAiB,CAAEI,QAAAA,GAAY,IAW1CY,GACAE,GACAJ,GATN,GAAA,CAAAX,SAWGH,CAAO,UAAPA,EACCH,EAAA,QAAA,CACEQ,GAAIA,GAAMC,EACVA,KAAMA,EACNW,KAAMV,GAAa,WACnBc,SAAU,EACVX,SAAQ,SAAAY,GAAA,SAAAZ,EAAAa,GAAA,OAAAD,EAAAE,MAAAC,KAAAC,WAAA,OAAAhB,EAAAiB,SAAA,IAAAL,EAAAK,WAAAjB,EAAA,EAAGkB,IACTA,EAAEC,UAEKnB,GAAYA,EAASkB,MAE9BjB,QAAO,SAAAmB,GAAA,SAAAnB,EAAAoB,GAAA,OAAAD,EAAAN,MAAAC,KAAAC,WAAA,OAAAf,EAAAgB,SAAA,IAAAG,EAAAH,WAAAhB,EAAA,EAAGiB,IACRA,EAAEC,UAEKlB,GAAWA,EAAQiB,MAE5BI,eAAgBpC,EAAMoC,eACtBnB,QAASA,EACTL,MAAOA,EACPC,SAAUA,EACVwB,QAAM,IAEN,KACH9B,EACDN,EAACqC,EAADnC,EAAAA,EAAA,CACEoC,KAAM,GACNC,YAAY,OACZC,MAAOxB,IAAYD,EAAU0B,EAAkBC,MAAQD,EAAkBE,WACrEvC,GAJN,GAAA,CAAAE,SAMGD,SA7FTJ,EAAI2C,aAAe,CACjBC,QAAS,eACT1C,GAAI,SACJ2C,OAAQ,IAGVhD,EAAS8C,aAAe,CACtBC,QAAS,eACTC,OAAQ,IAIV7C,EAAI8C,MAAQjD,EAEZG,EAAI+C,YAAc"}
+{"version":3,"file":"Tag.js","sources":["../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import { ResponsiveNamedProperty } from 'mixins/responsive-property'\nimport { ColorProperty } from 'mixins/color'\nimport { DisplayProperty } from 'mixins/display'\nimport type { BaseProps } from 'shared/interfaces'\nimport type { TextProps } from 'components/Text'\nimport { DefaultColorNames } from 'theme/colors'\nimport * as Styled from './style'\n\nexport interface TagProps\n  extends BaseProps,\n    DisplayProperty,\n    ColorProperty,\n    ResponsiveNamedProperty<'height'>,\n    ResponsiveNamedProperty<'width'> {\n  as?: 'button' | 'div' | 'input' | 'label'\n  /**\n   * Field id\n   */\n  id?: string\n  /**\n   * Field name\n   */\n  name?: string\n  /**\n   * Input type\n   */\n  inputType?: 'checkbox' | 'radio'\n  /**\n   * On change handler\n   */\n  onChange?(_e: React.ChangeEvent<HTMLInputElement>): void\n  /**\n   * On click handler\n   */\n  onClick?(_e: React.MouseEvent<HTMLInputElement>): void\n  /**\n   * Whether or not Radio is checked\n   */\n  defaultChecked?: boolean\n  /**\n   * Value\n   */\n  value?: string | number\n  /** Children are placed before Text */\n  /**\n   * Children react node\n   */\n  children?: React.ReactNode\n  /** Inner Text content  */\n  content?: React.ReactNode\n  /** Inner Text component props */\n  textProps?: TextProps\n  /** Checked state */\n  checked?: boolean\n  /** Disabled state */\n  disabled?: boolean\n  /** Error state */\n  error?: boolean\n  /** If as = 'label' could provide for */\n  htmlFor?: string\n  /**\n   * inverse\n   */\n  inverse?: boolean\n  /**\n   * Size\n   */\n  size?: 'l' | 'm' | 's' | 'xs'\n}\n\nTag.defaultProps = {\n  display: 'inline-block',\n  as: 'button',\n  height: 40,\n}\n\nTagInput.defaultProps = {\n  display: 'inline-block',\n  height: 40,\n}\n\n// Prevent brakechanges\nTag.Input = TagInput\n\nTag.displayName = 'Tag'\n\nfunction TagInput(props: typeof TagInput.defaultProps & TagProps) {\n  return <Tag as='input' {...props} />\n}\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n * - [`Display`](#/Миксины)\n * - [`Color`](#/Миксины)\n * - [`ResponsiveNamedProperty<'width'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'height'>`](#/Миксины)\n */\nexport function Tag(props: typeof Tag.defaultProps & TagProps) {\n  const {\n    as,\n    textProps,\n    content,\n    children,\n    htmlFor,\n    id,\n    name,\n    inputType,\n    value,\n    disabled,\n    onChange,\n    onClick,\n    inverse,\n    checked,\n    ...restProps\n  } = props\n\n  const buttonProps = as === 'button' ? { type: 'button' } : {}\n  const labelProps = as === 'label' ? { htmlFor } : {}\n  const inputProps = as === 'input' ? { htmlFor: id || name } : {}\n\n  return (\n    <Styled.Root\n      as={as === 'input' ? 'label' : as}\n      inverse={inverse}\n      checked={checked}\n      disabled={disabled}\n      onClick={as !== 'input' ? onClick : undefined}\n      {...labelProps}\n      {...buttonProps}\n      {...inputProps}\n      {...restProps}\n    >\n      {as === 'input' ? (\n        <input\n          id={id || name}\n          name={name}\n          type={inputType || 'checkbox'}\n          tabIndex={0}\n          onChange={(e) => {\n            e.persist()\n\n            return onChange && onChange(e)\n          }}\n          onClick={(e) => {\n            e.persist()\n\n            return onClick && onClick(e)\n          }}\n          defaultChecked={props.defaultChecked}\n          checked={checked}\n          value={value}\n          disabled={disabled}\n          hidden\n        />\n      ) : null}\n      {children}\n      <Styled.Text\n        size={14}\n        forwardedAs='span'\n        color={checked && !inverse ? DefaultColorNames.white : DefaultColorNames.mineShaft}\n        {...textProps}\n      >\n        {content}\n      </Styled.Text>\n    </Styled.Root>\n  )\n}\n"],"names":["TagInput","props","_jsx","Tag","_objectSpread","as","textProps","content","children","htmlFor","id","name","inputType","value","disabled","onChange","onClick","inverse","checked","restProps","_excluded","buttonProps","type","inputProps","_jsxs","Styled.Root","tabIndex","_onChange","_x","apply","this","arguments","toString","e","persist","_onClick","_x2","defaultChecked","hidden","Styled.Text","size","forwardedAs","color","DefaultColorNames","white","mineShaft","defaultProps","display","height","Input","displayName"],"mappings":"sZAsFA,SAASA,EAASC,GAChB,OAAOC,EAACC,EAADC,EAAA,CAAKC,GAAG,SAAYJ,IAWtB,SAASE,EAAIF,GAClB,IAAMI,GACJA,EADIC,UAEJA,EAFIC,QAGJA,EAHIC,SAIJA,EAJIC,QAKJA,EALIC,GAMJA,EANIC,KAOJA,EAPIC,UAQJA,EARIC,MASJA,EATIC,SAUJA,EAVIC,SAWJA,EAXIC,QAYJA,EAZIC,QAaJA,EAbIC,QAcJA,GAEEjB,EADCkB,IACDlB,EAhBJmB,GAkBA,IAAMC,EAAqB,WAAPhB,EAAkB,CAAEiB,KAAM,UAAa,GAE3D,IAAMC,EAAoB,UAAPlB,EAAiB,CAAEI,QAASC,GAAMC,GAAS,GAE9D,OACEa,EAACC,EAADrB,EAAAA,EAAAA,EAAAA,EAAAA,EAAA,CACEC,GAAW,UAAPA,EAAiB,QAAUA,EAC/BY,QAASA,EACTC,QAASA,EACTJ,SAAUA,EACVE,QAAgB,UAAPX,EAAiBW,OAAAA,GATJ,UAAPX,EAAiB,CAAEI,QAAAA,GAAY,IAW1CY,GACAE,GACAJ,GATN,GAAA,CAAAX,SAWGH,CAAO,UAAPA,EACCH,EAAA,QAAA,CACEQ,GAAIA,GAAMC,EACVA,KAAMA,EACNW,KAAMV,GAAa,WACnBc,SAAU,EACVX,SAAQ,SAAAY,GAAA,SAAAZ,EAAAa,GAAA,OAAAD,EAAAE,MAAAC,KAAAC,WAAA,OAAAhB,EAAAiB,SAAA,IAAAL,EAAAK,WAAAjB,EAAA,EAAGkB,IACTA,EAAEC,UAEKnB,GAAYA,EAASkB,MAE9BjB,QAAO,SAAAmB,GAAA,SAAAnB,EAAAoB,GAAA,OAAAD,EAAAN,MAAAC,KAAAC,WAAA,OAAAf,EAAAgB,SAAA,IAAAG,EAAAH,WAAAhB,EAAA,EAAGiB,IACRA,EAAEC,UAEKlB,GAAWA,EAAQiB,MAE5BI,eAAgBpC,EAAMoC,eACtBnB,QAASA,EACTL,MAAOA,EACPC,SAAUA,EACVwB,QAAM,IAEN,KACH9B,EACDN,EAACqC,EAADnC,EAAAA,EAAA,CACEoC,KAAM,GACNC,YAAY,OACZC,MAAOxB,IAAYD,EAAU0B,EAAkBC,MAAQD,EAAkBE,WACrEvC,GAJN,GAAA,CAAAE,SAMGD,SA7FTJ,EAAI2C,aAAe,CACjBC,QAAS,eACT1C,GAAI,SACJ2C,OAAQ,IAGVhD,EAAS8C,aAAe,CACtBC,QAAS,eACTC,OAAQ,IAIV7C,EAAI8C,MAAQjD,EAEZG,EAAI+C,YAAc"}

package/components/Tag/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/Tag/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { display } from 'mixins/display'\nimport { property, PossibleValues, responsiveNamedProperty } from 'mixins/responsive-property'\nimport { color } from 'mixins/color'\nimport type { TextProps } from 'shared/interfaces'\nimport { Text as UiText } from '../Text'\nimport { TagProps } from './Tag'\n\nconst WIDTHS: Record<Partial<Exclude<TagProps['size'], 'auto' | undefined>>, number> = {\n  l: 220,\n  m: 182,\n  s: 100,\n  xs: 60,\n}\n\nconst chooseWidthValue = (props: TagProps): PossibleValues => {\n  if (props.width === 'auto') return 'auto'\n  if (typeof props.width === 'number') return props.width\n\n  if (props.size && WIDTHS[props.size]) return WIDTHS[props.size]\n\n  return 'auto'\n}\n\nconst active = css`\n  border-color: transparent;\n  background-color: currentColor;\n`\n\nexport const Text = styled(UiText)<TextProps>`\n  display: inline-block;\n  vertical-align: middle;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  max-width: 100%;\n  overflow: hidden;\n  vertical-align: middle;\n  transition: color 0.25s ease;\n`\n\nconst disabled = css`\n  cursor: not-allowed;\n  background-color: rgba(0, 0, 0, 0.04);\n  ${Text} {\n    color: rgba(0, 0, 0, 0.16);\n  }\n`\n\nexport const Root = styled.button.withConfig<TagProps>({\n  shouldForwardProp: (prop) => ['children', 'htmlFor', 'className', 'style', 'onClick'].includes(prop),\n})`\n  padding: 0px 16px;\n  margin-bottom: 10px;\n  border-radius: 3px;\n  background-color: ${(props) => props.theme.colors.white};\n  border: 1px solid ${(props) => props.theme.colors.whiteGray};\n  box-sizing: border-box;\n  vertical-align: middle;\n  transition: color 0.25s ease, background 0.25s ease, border-color 0.25s ease;\n  cursor: pointer;\n  text-align: center;\n  touch-action: manipulation;\n  min-width: 60px;\n\n  ${(props) => (props.size ? property(chooseWidthValue(props), 'width') : null)}\n  ${(props) => (props.height ? property(props.height, 'line-height') : null)}\n  ${(props) => (props.height ? property(props.height, 'height') : null)}\n  ${({ heightXS, heightS, heightM, heightL, heightXL }) =>\n    responsiveNamedProperty({ sizes: { heightXS, heightS, heightM, heightL, heightXL }, cssProperty: 'height' })}\n\n  ${(props) => (props.width ? property(props.width, 'width') : null)}\n    ${({ widthXS, widthS, widthM, widthL, widthXL }) =>\n    responsiveNamedProperty({ sizes: { widthXS, widthS, widthM, widthL, widthXL }, cssProperty: 'width' })}\n\n  ${(props) => (props.display ? display(props.display) : null)}\n  ${(props) => (props.color ? color(props.color) : null)}\n\n  &:not(:last-child) {\n    margin-right: 20px;\n  }\n\n  ${(props) =>\n    !props.disabled\n      ? css`\n          &:hover:not(:disabled) {\n            border-color: currentColor;\n          }\n          &:active:not(:disabled) {\n            ${active}\n            ${Text} {\n              color: ${(props) => props.theme.colors.white};\n            }\n          }\n        `\n      : null}\n\n  ${(props) => (props.inverse || props.checked ? active : null)}\n\n  &:disabled {\n    ${disabled}\n  }\n  ${(props) => (props.disabled ? disabled : null)}\n`\n"],"names":["WIDTHS","l","m","s","xs","active","css","Text","styled","UiText","withConfig","componentId","disabled","Root","button","shouldForwardProp","prop","includes","props","theme","colors","white","whiteGray","size","property","width","height","_ref","heightXS","heightS","heightM","heightL","heightXL","responsiveNamedProperty","sizes","cssProperty","_ref2","widthXS","widthS","widthM","widthL","widthXL","display","color","inverse","checked"],"mappings":"8QAQA,IAAMA,EAAiF,CACrFC,EAAG,IACHC,EAAG,IACHC,EAAG,IACHC,GAAI,IAYN,IAAMC,EAASC,EAAf,CAAA,gEAKaC,EAAOC,EAAOC,GAAVC,WAAA,CAAAC,YAAA,uBAAGH,CAAb,CAAA,2KAWP,IAAMI,EAAWN,EAAH,CAAA,wDAAA,6BAGVC,GAKG,IAAMM,EAAOL,EAAOM,OAAOJ,WAAqB,CACrDK,kBAAoBC,GAAS,CAAC,WAAY,UAAW,YAAa,QAAS,WAAWC,SAASD,KADhFN,WAAA,CAAAC,YAAA,uBAAGH,CAAH,CAAA,0EAAA,qBAAA,oMAAA,IAAA,IAAA,IAAA,IAAA,IAAA,IAAA,IAAA,0CAAA,IAAA,eAAA,IAAA,KAMMU,GAAUA,EAAMC,MAAMC,OAAOC,QAC7BH,GAAUA,EAAMC,MAAMC,OAAOE,YAS/CJ,GAAWA,EAAMK,KAAOC,EAjDHN,CAAAA,GACJ,SAAhBA,EAAMO,MAAyB,OACR,iBAAhBP,EAAMO,MAA2BP,EAAMO,MAE9CP,EAAMK,MAAQvB,EAAOkB,EAAMK,MAAcvB,EAAOkB,EAAMK,MAEnD,OANiBL,CAiD6BA,GAAQ,SAAW,OACrEA,GAAWA,EAAMQ,OAASF,EAASN,EAAMQ,OAAQ,eAAiB,OAClER,GAAWA,EAAMQ,OAASF,EAASN,EAAMQ,OAAQ,UAAY,OAC9DC,IAAA,IAACC,SAAEA,EAAFC,QAAYA,EAAZC,QAAqBA,EAArBC,QAA8BA,EAA9BC,SAAuCA,GAAxCL,EAAA,OACAM,EAAwB,CAAEC,MAAO,CAAEN,SAAAA,EAAUC,QAAAA,EAASC,QAAAA,EAASC,QAAAA,EAASC,SAAAA,GAAYG,YAAa,cAEhGjB,GAAWA,EAAMO,MAAQD,EAASN,EAAMO,MAAO,SAAW,OACzDW,IAAA,IAACC,QAAEA,EAAFC,OAAWA,EAAXC,OAAmBA,EAAnBC,OAA2BA,EAA3BC,QAAmCA,GAApCL,EAAA,OACFH,EAAwB,CAAEC,MAAO,CAAEG,QAAAA,EAASC,OAAAA,EAAQC,OAAAA,EAAQC,OAAAA,EAAQC,QAAAA,GAAWN,YAAa,aAE3FjB,GAAWA,EAAMwB,QAAUA,EAAQxB,EAAMwB,SAAW,OACpDxB,GAAWA,EAAMyB,MAAQA,EAAMzB,EAAMyB,OAAS,OAM9CzB,GACAA,EAAMN,SAYH,KAXAN,EADJ,CAAA,6EAAA,IAAA,UAAA,OAMUD,EACAE,GACUW,GAAUA,EAAMC,MAAMC,OAAOC,UAMhDH,GAAWA,EAAM0B,SAAW1B,EAAM2B,QAAUxC,EAAS,MAGpDO,GAEDM,GAAWA,EAAMN,SAAWA,EAAW"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/Tag/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { display } from 'mixins/display'\nimport { property, PossibleValues, responsiveNamedProperty } from 'mixins/responsive-property'\nimport { color } from 'mixins/color'\nimport { Text as UiText } from 'components/Text'\nimport type { TextProps } from 'components/Text'\nimport { TagProps } from './Tag'\n\nconst WIDTHS: Record<Partial<Exclude<TagProps['size'], 'auto' | undefined>>, number> = {\n  l: 220,\n  m: 182,\n  s: 100,\n  xs: 60,\n}\n\nconst chooseWidthValue = (props: TagProps): PossibleValues => {\n  if (props.width === 'auto') return 'auto'\n  if (typeof props.width === 'number') return props.width\n\n  if (props.size && WIDTHS[props.size]) return WIDTHS[props.size]\n\n  return 'auto'\n}\n\nconst active = css`\n  border-color: transparent;\n  background-color: currentColor;\n`\n\nexport const Text = styled(UiText)<TextProps>`\n  display: inline-block;\n  vertical-align: middle;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  max-width: 100%;\n  overflow: hidden;\n  vertical-align: middle;\n  transition: color 0.25s ease;\n`\n\nconst disabled = css`\n  cursor: not-allowed;\n  background-color: rgba(0, 0, 0, 0.04);\n  ${Text} {\n    color: rgba(0, 0, 0, 0.16);\n  }\n`\n\nexport const Root = styled.button.withConfig<TagProps>({\n  shouldForwardProp: (prop) => ['children', 'htmlFor', 'className', 'style', 'onClick'].includes(prop),\n})`\n  padding: 0px 16px;\n  margin-bottom: 10px;\n  border-radius: 3px;\n  background-color: ${(props) => props.theme.colors.white};\n  border: 1px solid ${(props) => props.theme.colors.whiteGray};\n  box-sizing: border-box;\n  vertical-align: middle;\n  transition: color 0.25s ease, background 0.25s ease, border-color 0.25s ease;\n  cursor: pointer;\n  text-align: center;\n  touch-action: manipulation;\n  min-width: 60px;\n\n  ${(props) => (props.size ? property(chooseWidthValue(props), 'width') : null)}\n  ${(props) => (props.height ? property(props.height, 'line-height') : null)}\n  ${(props) => (props.height ? property(props.height, 'height') : null)}\n  ${({ heightXS, heightS, heightM, heightL, heightXL }) =>\n    responsiveNamedProperty({ sizes: { heightXS, heightS, heightM, heightL, heightXL }, cssProperty: 'height' })}\n\n  ${(props) => (props.width ? property(props.width, 'width') : null)}\n    ${({ widthXS, widthS, widthM, widthL, widthXL }) =>\n    responsiveNamedProperty({ sizes: { widthXS, widthS, widthM, widthL, widthXL }, cssProperty: 'width' })}\n\n  ${(props) => (props.display ? display(props.display) : null)}\n  ${(props) => (props.color ? color(props.color) : null)}\n\n  &:not(:last-child) {\n    margin-right: 20px;\n  }\n\n  ${(props) =>\n    !props.disabled\n      ? css`\n          &:hover:not(:disabled) {\n            border-color: currentColor;\n          }\n          &:active:not(:disabled) {\n            ${active}\n            ${Text} {\n              color: ${(props) => props.theme.colors.white};\n            }\n          }\n        `\n      : null}\n\n  ${(props) => (props.inverse || props.checked ? active : null)}\n\n  &:disabled {\n    ${disabled}\n  }\n  ${(props) => (props.disabled ? disabled : null)}\n`\n"],"names":["WIDTHS","l","m","s","xs","active","css","Text","styled","UiText","withConfig","componentId","disabled","Root","button","shouldForwardProp","prop","includes","props","theme","colors","white","whiteGray","size","property","width","height","_ref","heightXS","heightS","heightM","heightL","heightXL","responsiveNamedProperty","sizes","cssProperty","_ref2","widthXS","widthS","widthM","widthL","widthXL","display","color","inverse","checked"],"mappings":"8QAQA,IAAMA,EAAiF,CACrFC,EAAG,IACHC,EAAG,IACHC,EAAG,IACHC,GAAI,IAYN,IAAMC,EAASC,EAAf,CAAA,gEAKaC,EAAOC,EAAOC,GAAVC,WAAA,CAAAC,YAAA,uBAAGH,CAAb,CAAA,2KAWP,IAAMI,EAAWN,EAAH,CAAA,wDAAA,6BAGVC,GAKG,IAAMM,EAAOL,EAAOM,OAAOJ,WAAqB,CACrDK,kBAAoBC,GAAS,CAAC,WAAY,UAAW,YAAa,QAAS,WAAWC,SAASD,KADhFN,WAAA,CAAAC,YAAA,uBAAGH,CAAH,CAAA,0EAAA,qBAAA,oMAAA,IAAA,IAAA,IAAA,IAAA,IAAA,IAAA,IAAA,0CAAA,IAAA,eAAA,IAAA,KAMMU,GAAUA,EAAMC,MAAMC,OAAOC,QAC7BH,GAAUA,EAAMC,MAAMC,OAAOE,YAS/CJ,GAAWA,EAAMK,KAAOC,EAjDHN,CAAAA,GACJ,SAAhBA,EAAMO,MAAyB,OACR,iBAAhBP,EAAMO,MAA2BP,EAAMO,MAE9CP,EAAMK,MAAQvB,EAAOkB,EAAMK,MAAcvB,EAAOkB,EAAMK,MAEnD,OANiBL,CAiD6BA,GAAQ,SAAW,OACrEA,GAAWA,EAAMQ,OAASF,EAASN,EAAMQ,OAAQ,eAAiB,OAClER,GAAWA,EAAMQ,OAASF,EAASN,EAAMQ,OAAQ,UAAY,OAC9DC,IAAA,IAACC,SAAEA,EAAFC,QAAYA,EAAZC,QAAqBA,EAArBC,QAA8BA,EAA9BC,SAAuCA,GAAxCL,EAAA,OACAM,EAAwB,CAAEC,MAAO,CAAEN,SAAAA,EAAUC,QAAAA,EAASC,QAAAA,EAASC,QAAAA,EAASC,SAAAA,GAAYG,YAAa,cAEhGjB,GAAWA,EAAMO,MAAQD,EAASN,EAAMO,MAAO,SAAW,OACzDW,IAAA,IAACC,QAAEA,EAAFC,OAAWA,EAAXC,OAAmBA,EAAnBC,OAA2BA,EAA3BC,QAAmCA,GAApCL,EAAA,OACFH,EAAwB,CAAEC,MAAO,CAAEG,QAAAA,EAASC,OAAAA,EAAQC,OAAAA,EAAQC,OAAAA,EAAQC,QAAAA,GAAWN,YAAa,aAE3FjB,GAAWA,EAAMwB,QAAUA,EAAQxB,EAAMwB,SAAW,OACpDxB,GAAWA,EAAMyB,MAAQA,EAAMzB,EAAMyB,OAAS,OAM9CzB,GACAA,EAAMN,SAYH,KAXAN,EADJ,CAAA,6EAAA,IAAA,UAAA,OAMUD,EACAE,GACUW,GAAUA,EAAMC,MAAMC,OAAOC,UAMhDH,GAAWA,EAAM0B,SAAW1B,EAAM2B,QAAUxC,EAAS,MAGpDO,GAEDM,GAAWA,EAAMN,SAAWA,EAAW"}

package/components/Text/Text.js

@@ -1,2 +1,2 @@
-import e from'@babel/runtime/helpers/objectWithoutProperties';import t from'@babel/runtime/helpers/objectSpread2';import{forwardRef as r}from'react';import{useFallbackTheme as s}from'../../hooks/use-theme.js';import{useConfigPriority as a}from'../../hooks/use-config-priority.js';import{useClassname as o}from'../../hooks/useClassname.js';import{TextHeading as i}from'../Text.Heading/Text.Heading.js';import{TextEllipse as l}from'../Text.Ellipse/Text.Ellipse.js';import{APPEARANCE as m}from'./constants.js';import{Root as n}from'./style.js';import{jsx as p}from'react/jsx-runtime';var f=["as","weight","lineHeight","fontStyle","size","content","children"];var h='Text';var c=r(((r,i)=>{var l,h;var c=s();var d=a(null===(l=c.components)||void 0===l?void 0:l.Text,r);var g=null!==(h=m[d.appearance])&&void 0!==h?h:{};var u=t(t({},g),d);var{as:v="div",weight:x="normal",lineHeight:T="m",fontStyle:j="normal",size:y="m",content:H,children:E}=u,N=e(u,f);var b=o("Text",N.className);return p(n,t(t({},N),{},E?{ref:i,as:v,weight:x,lineHeight:T,fontStyle:j,size:y,className:b,children:E}:{ref:i,as:v,weight:x,lineHeight:T,fontStyle:j,size:y,className:b,dangerouslySetInnerHTML:{__html:H||''}}))}));c.displayName="Text",c.Heading=i,c.Ellipse=l;export{h as COMPONENT_NAME,c as Text};
+import e from'@babel/runtime/helpers/objectWithoutProperties';import t from'@babel/runtime/helpers/objectSpread2';import{forwardRef as r}from'react';import{withMergedProps as a}from'../../hocs/withMergedProps.js';import{useClassname as s}from'../../hooks/useClassname.js';import{TextHeading as i}from'../Text.Heading/Text.Heading.js';import{TextEllipse as o}from'../Text.Ellipse/Text.Ellipse.js';import{SIZES as n,SIZES_DEFAULT as l,APPEARANCE as m}from'./constants.js';import{Root as p}from'./style.js';import{jsx as c}from'react/jsx-runtime';var f=["size","weight","lineHeight","fontStyle","className","content","children"];var h='Text';var g=Object.assign(a(r(((r,a)=>{var i=r.appearance?t(t({},m[r.appearance]),r):r;var{size:o="m",weight:n="normal",lineHeight:l="m",fontStyle:h="normal",className:g,content:d,children:x}=i,T=e(i,f);var j=s("Text",g);return c(p,t(t({},T),{},x?{size:o,weight:n,lineHeight:l,fontStyle:h,className:j,ref:a,children:x}:{size:o,weight:n,lineHeight:l,fontStyle:h,className:j,dangerouslySetInnerHTML:{__html:d||''},ref:a}))})),{displayName:"Text",sizes:e=>{var t;return'string'==typeof e.appearance&&null!==(t=n[e.appearance])&&void 0!==t?t:l}}),{Heading:i,Ellipse:o});export{h as COMPONENT_NAME,g as Text};
 //# sourceMappingURL=Text.js.map