@foxford/ui 2.2.0-beta-07cd754-20230316 → 2.3.0-beta-537d612-20230327

package/components/Arrow/Arrow.js

@@ -1,2 +1,2 @@
-import t from'@babel/runtime/helpers/objectSpread2';import r from'@babel/runtime/helpers/objectWithoutProperties';import{PureComponent as e}from'react';import o from'./images/arrow.module.svg.js';import{Root as i}from'./style.js';import{jsx as s}from'react/jsx-runtime';var a=["top","right","bottom","left","onClick"];var l={top:0,right:90,bottom:180,left:270};class n extends e{constructor(){super(...arguments),this.onClickHandler=t=>{t.preventDefault();var{disabled:r,onClick:e}=this.props;r||'function'!=typeof e||e(t)}}render(){var e=this.props,{top:n,right:p,bottom:m,left:c}=e,f=r(e,a);var d={top:n&&!m,right:p&&!c,bottom:m&&!n,left:c&&!p};var b=Object.values(d).filter((t=>!0===t)).length>1;var h=Object.keys(d).reduce(((t,r)=>d[r]?t+l[r]:t),0)/(b?2:1);var u={transform:"rotate(".concat(h,"deg)").concat(b?' translateY(-3px)':'')};return s(i,t(t({},f),{},{onClick:this.onClickHandler,children:s("span",{children:s(o,{style:u})})}))}}n.displayName='Arrow',n.defaultProps={size:'l',top:!1,right:!1,bottom:!1,left:!1,inverse:!1,outline:!1,disabled:!1,onClick:()=>{}};export{n as Arrow};
+import r from'@babel/runtime/helpers/objectSpread2';import e from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as o}from'react';import{useFallbackTheme as s}from'../../hooks/use-theme.js';import{getComponentConfig as t}from'../../shared/utils/get-config.js';import a from'./images/arrow.module.svg.js';import i from'./images/chevron.module.svg.js';import{CONFIG_PROPS as m}from'./constants.js';import{getArrowRotation as l}from'./utils.js';import{Root as n}from'./style.js';import{jsx as p}from'react/jsx-runtime';var f=["className","style","onClick"],d=["size"];var v=o(((o,v)=>{var c,u;var b=s();var j=null!==(c=null===(u=b.components)||void 0===u?void 0:u.Arrow)&&void 0!==c?c:{};var{className:g,style:h,onClick:y}=o,N=e(o,f);var w=t(m,j,N),{size:C="l"}=w,A=e(w,d);var k='brand'===b.preset;'string'==typeof A.preset&&(k='brand'===A.preset);var P=A.square?'8px':'50%';var R=k?a:i;var x=l(A);return p(n,r(r({ref:v,type:"button",className:g,style:h,size:C,borderRadius:P,brandPresetUsed:k,onClick:r=>{r.preventDefault(),A.disabled||'function'!=typeof y||y(r)}},A),{},{children:p("span",{children:p(R,{style:x})})}))}));var c='Arrow';v.displayName="Arrow";export{v as Arrow,c as COMPONENT_NAME};
 //# sourceMappingURL=Arrow.js.map

package/components/Arrow/Arrow.js.map

@@ -1 +1 @@
-{"version":3,"file":"Arrow.js","sources":["../../../../src/components/Arrow/Arrow.tsx"],"sourcesContent":["import { PureComponent } from 'react'\nimport { BaseProps } from '../../shared/interfaces'\nimport ArrowSvg from './images/arrow.module.svg'\nimport * as Styled from './style'\n\nconst DIR_MAP = {\n  top: 0,\n  right: 90,\n  bottom: 180,\n  left: 270,\n}\n\nexport interface ArrowProps extends BaseProps {\n  /**\n   * Size of icon\n   */\n  size?: 'xs' | 'm' | 'l'\n  /**\n   * Direction arrow\n   */\n  top?: boolean\n  /**\n   * Direction arrow\n   */\n  right?: boolean\n  /**\n   * Direction arrow\n   */\n  bottom?: boolean\n  /**\n   * Direction arrow\n   */\n  left?: boolean\n  inverse?: boolean\n  outline?: boolean\n  disabled?: boolean\n  // eslint-disable-next-line no-unused-vars\n  onClick?(event: React.MouseEvent<HTMLButtonElement>): void\n}\n\n/* eslint-disable react/prefer-stateless-function */\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n */\nexport class Arrow extends PureComponent<ArrowProps> {\n  static displayName = 'Arrow'\n  static defaultProps = {\n    size: 'l',\n    top: false,\n    right: false,\n    bottom: false,\n    left: false,\n    inverse: false,\n    outline: false,\n    disabled: false,\n    // eslint-disable-next-line @typescript-eslint/no-empty-function\n    onClick: () => {},\n  }\n\n  onClickHandler = (event: React.MouseEvent<HTMLButtonElement>) => {\n    event.preventDefault()\n    const { disabled, onClick } = this.props\n\n    if (!disabled && typeof onClick === 'function') {\n      onClick(event)\n    }\n  }\n\n  render() {\n    const {\n      top,\n      right,\n      bottom,\n      left,\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      onClick, // eslint-disable-line no-unused-vars\n      ...restProps\n    } = this.props\n\n    const arrowDir = {\n      top: top && !bottom,\n      right: right && !left,\n      bottom: bottom && !top,\n      left: left && !right,\n    }\n\n    const isMultiDir = Object.values(arrowDir).filter((value) => value === true).length > 1\n\n    const rotateDeg =\n      Object.keys(arrowDir).reduce((acc, key) => (arrowDir[key] ? acc + DIR_MAP[key] : acc), 0) / (isMultiDir ? 2 : 1)\n\n    const arrowStyle = {\n      transform: `rotate(${rotateDeg}deg)${isMultiDir ? ' translateY(-3px)' : ''}`,\n    }\n\n    return (\n      <Styled.Root {...restProps} onClick={this.onClickHandler}>\n        <span>\n          <ArrowSvg style={arrowStyle} />\n        </span>\n      </Styled.Root>\n    )\n  }\n}\n"],"names":["DIR_MAP","top","right","bottom","left","Arrow","PureComponent","constructor","super","arguments","this","onClickHandler","event","preventDefault","disabled","onClick","props","render","_this$props","restProps","_objectWithoutProperties","_excluded","arrowDir","isMultiDir","Object","values","filter","value","length","rotateDeg","keys","reduce","acc","key","arrowStyle","transform","concat","_jsx","Styled.Root","children","ArrowSvg","style","displayName","defaultProps","size","inverse","outline"],"mappings":"8TAKA,IAAMA,EAAU,CACdC,IAAK,EACLC,MAAO,GACPC,OAAQ,IACRC,KAAM,KAqCD,MAAMC,UAAcC,EAA0BC,cAAAC,SAAAC,WAAAC,KAenDC,eAAkBC,IAChBA,EAAMC,iBACN,IAAMC,SAAEA,EAAFC,QAAYA,GAAYL,KAAKM,MAE9BF,GAA+B,mBAAZC,GACtBA,EAAQH,IAIZK,SACE,IAAAC,EAQIR,KAAKM,OARHf,IACJA,EADIC,MAEJA,EAFIC,OAGJA,EAHIC,KAIJA,GAJFc,EAOKC,EAPLC,EAAAF,EAAAG,GAUA,IAAMC,EAAW,CACfrB,IAAKA,IAAQE,EACbD,MAAOA,IAAUE,EACjBD,OAAQA,IAAWF,EACnBG,KAAMA,IAASF,GAGjB,IAAMqB,EAAaC,OAAOC,OAAOH,GAAUI,QAAQC,IAAoB,IAAVA,IAAgBC,OAAS,EAEtF,IAAMC,EACJL,OAAOM,KAAKR,GAAUS,SAAQC,EAAKC,IAASX,EAASW,GAAOD,EAAMhC,EAAQiC,GAAOD,GAAM,IAAMT,EAAa,EAAI,GAEhH,IAAMW,EAAa,CACjBC,2BAAqBN,EAAZ,QAAAO,OAA4Bb,EAAa,oBAAsB,KAG1E,OACEc,EAACC,SAAgBnB,GAAjB,GAAA,CAA4BJ,QAASL,KAAKC,eAA1C4B,SACEF,EAAA,OAAA,CAAAE,SACEF,EAACG,EAAD,CAAUC,MAAOP,UAtDd7B,EACJqC,YAAc,QADVrC,EAEJsC,aAAe,CACpBC,KAAM,IACN3C,KAAK,EACLC,SACAC,QAAAA,EACAC,MAAM,EACNyC,WACAC,SAAAA,EACAhC,UAAU,EAEVC,QAAS"}
+{"version":3,"file":"Arrow.js","sources":["../../../../src/components/Arrow/Arrow.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { useFallbackTheme } from 'hooks/use-theme'\nimport { getComponentConfig } from 'shared/utils/get-config'\nimport ArrowSvg from './images/arrow.module.svg'\nimport ChevronSvg from './images/chevron.module.svg'\nimport { CONFIG_PROPS } from './constants'\nimport type { ArrowProps } from './types'\nimport { getArrowRotation } from './utils'\n\nimport * as Styled from './style'\n\n/**\n * Button with arrow icon\n */\nconst Arrow = forwardRef<HTMLButtonElement, ArrowProps>((props, ref) => {\n  const theme = useFallbackTheme()\n\n  const context = theme.components?.Arrow ?? {}\n  const { className, style, onClick, ...restProps } = props\n  const { size = 'l', ...configProps } = getComponentConfig<ArrowProps>(CONFIG_PROPS, context, restProps)\n\n  let brandPresetUsed = theme.preset === 'brand'\n  if (typeof configProps.preset === 'string') brandPresetUsed = configProps.preset === 'brand'\n\n  const borderRadius = configProps.square ? '8px' : '50%'\n  const Icon = brandPresetUsed ? ArrowSvg : ChevronSvg\n  const iconStyles = getArrowRotation(configProps)\n\n  const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    event.preventDefault()\n\n    if (!configProps.disabled && typeof onClick === 'function') {\n      onClick(event)\n    }\n  }\n\n  return (\n    <Styled.Root\n      ref={ref}\n      type='button'\n      className={className}\n      style={style}\n      size={size}\n      borderRadius={borderRadius}\n      brandPresetUsed={brandPresetUsed}\n      onClick={handleClick}\n      {...configProps}\n    >\n      <span>{<Icon style={iconStyles} />}</span>\n    </Styled.Root>\n  )\n})\n\nconst COMPONENT_NAME = 'Arrow'\n\nArrow.displayName = COMPONENT_NAME\n\nexport { Arrow, COMPONENT_NAME }\n\nexport type { ArrowProps }\n"],"names":["Arrow","forwardRef","props","ref","_theme$components$Arr","_theme$components","theme","useFallbackTheme","context","components","className","style","onClick","restProps","_excluded","_getComponentConfig","getComponentConfig","CONFIG_PROPS","size","configProps","_objectWithoutProperties","_excluded2","brandPresetUsed","preset","borderRadius","square","Icon","ArrowSvg","ChevronSvg","iconStyles","getArrowRotation","_jsx","Styled.Root","_objectSpread","type","event","preventDefault","disabled","children","COMPONENT_NAME","displayName"],"mappings":"wkBAcMA,IAAAA,EAAQC,GAAAA,CAA2CC,EAAOC,KAAQ,IAAAC,EAAAC,EACtE,IAAMC,EAAQC,IAEd,IAAMC,EAAO,UAAG,UAAAF,EAAMG,kBAAN,IAAAJ,SAAAA,EAAkBL,aAArB,IAAAI,EAAAA,EAA8B,GAC3C,IAAMM,UAAEA,EAAFC,MAAaA,EAAbC,QAAoBA,GAA0BV,EAAdW,IAAcX,EAApDY,GACA,IAAAC,EAAuCC,EAA+BC,EAAcT,EAASK,IAAvFK,KAAEA,EAAO,KAAfH,EAAuBI,EAAvBC,EAAAL,EAAAM,GAEA,IAAIC,EAAmC,UAAjBhB,EAAMiB,OACM,iBAAvBJ,EAAYI,SAAqBD,EAAyC,UAAvBH,EAAYI,QAE1E,IAAMC,EAAeL,EAAYM,OAAS,MAAQ,MAClD,IAAMC,EAAOJ,EAAkBK,EAAWC,EAC1C,IAAMC,EAAaC,EAAiBX,GAUpC,OACEY,EAACC,EAADC,EAAAA,EAAA,CACE9B,IAAKA,EACL+B,KAAK,SACLxB,UAAWA,EACXC,MAAOA,EACPO,KAAMA,EACNM,aAAcA,EACdF,gBAAiBA,EACjBV,QAjBiBuB,IACnBA,EAAMC,iBAEDjB,EAAYkB,UAA+B,mBAAZzB,GAClCA,EAAQuB,KAcJhB,GATN,GAAA,CAAAmB,SAWEP,EAAA,OAAA,CAAAO,SAAOP,EAACL,EAAD,CAAMf,MAAOkB,YAKpBU,IAAAA,EAAiB,QAEvBvC,EAAMwC,YAFiB"}

package/components/Arrow/constants.js

@@ -0,0 +1,2 @@
+var e=['preset','square','onColored','size','top','right','bottom','left','inverse','outline','disabled'];var r=['preset','square','onColored','size','top','right','bottom','left','inverse','outline','borderRadius','brandPresetUsed'];export{e as CONFIG_PROPS,r as TRANSIENT_PROPS};
+//# sourceMappingURL=constants.js.map

package/components/Arrow/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../../src/components/Arrow/constants.ts"],"sourcesContent":["import type { ArrowConfigProp, ArrowTransientProp } from './types'\n\nexport const CONFIG_PROPS: ArrowConfigProp[] = [\n  'preset',\n  'square',\n  'onColored',\n  'size',\n  'top',\n  'right',\n  'bottom',\n  'left',\n  'inverse',\n  'outline',\n  'disabled',\n]\n\nexport const TRANSIENT_PROPS: ArrowTransientProp[] = [\n  'preset',\n  'square',\n  'onColored',\n  'size',\n  'top',\n  'right',\n  'bottom',\n  'left',\n  'inverse',\n  'outline',\n  'borderRadius',\n  'brandPresetUsed',\n]\n"],"names":["CONFIG_PROPS","TRANSIENT_PROPS"],"mappings":"AAEO,IAAMA,EAAkC,CAC7C,SACA,SACA,YACA,OACA,MACA,QACA,SACA,OACA,UACA,UACA,YAGK,IAAMC,EAAwC,CACnD,SACA,SACA,YACA,OACA,MACA,QACA,SACA,OACA,UACA,UACA,eACA"}

package/components/Arrow/images/arrow.module.svg.js

@@ -1,2 +1,2 @@
-import*as t from'react';var r;function e(){return e=Object.assign||function(t){for(var r=1;r<arguments.length;r++){var e=arguments[r];for(var a in e)({}).hasOwnProperty.call(e,a)&&(t[a]=e[a])}return t},e.apply(this,arguments)}var a=a=>t.createElement("svg",e({xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 4.233 4.233"},a),r||(r=t.createElement("path",{d:"m.76 3.175-.363-.369 1.72-1.748 1.72 1.748-.363.369-1.357-1.38z"})));export{a as default};
+import*as r from'react';var t;function e(){return e=Object.assign||function(r){for(var t=1;t<arguments.length;t++){var e=arguments[t];for(var n in e)({}).hasOwnProperty.call(e,n)&&(r[n]=e[n])}return r},e.apply(this,arguments)}var n=n=>r.createElement("svg",e({width:14,height:16,fill:"none",xmlns:"http://www.w3.org/2000/svg"},n),t||(t=r.createElement("path",{d:"M7 1v14M7 1l6 6M7 1 1 7",stroke:"currentcolor",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"})));export{n as default};
 //# sourceMappingURL=arrow.module.svg.js.map

package/components/Arrow/images/arrow.module.svg.js.map

@@ -1 +1 @@
-{"version":3,"file":"arrow.module.svg.js","sources":["../../../../../src/components/Arrow/images/arrow.module.svg"],"sourcesContent":["<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 4.233 4.233\"><path d=\"M.76 3.175l-.363-.369 1.72-1.748 1.72 1.748-.363.369-1.357-1.38z\" /></svg>\n"],"names":["_path","_extends","Object","assign","target","i","arguments","length","source","key","hasOwnProperty","call","apply","this","SvgArrowmodule","props","React","createElement","xmlns","width","height","viewBox","d"],"mappings":"wBAAA,IAAIA,EAEJ,SAASC,IAA2Q,OAA9PA,EAAWC,OAAOC,QAAU,SAAUC,GAAU,IAAK,IAAIC,EAAI,EAAGA,EAAIC,UAAUC,OAAQF,IAAK,CAAE,IAAIG,EAASF,UAAUD,GAAI,IAAK,IAAII,KAAOD,GAAAA,IAA+BE,eAAeC,KAAKH,EAAQC,KAAQL,EAAOK,GAAOD,EAAOC,IAAY,OAAOL,GAAkBH,EAASW,MAAMC,KAAMP,WAI7S,IAACQ,EAAyCC,GACvBC,EAAMC,cAAc,MAAOhB,EAAS,CACtDiB,MAAO,6BACPC,MAAO,GACPC,OAAQ,GACRC,QAAS,mBACRN,GAAQf,IAAUA,EAAqBgB,EAAMC,cAAc,OAAQ,CACpEK,EAAG"}
+{"version":3,"file":"arrow.module.svg.js","sources":["../../../../../src/components/Arrow/images/arrow.module.svg"],"sourcesContent":["<svg width=\"14\" height=\"16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7 1v14M7 1l6 6M7 1 1 7\" stroke=\"currentcolor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>"],"names":["_path","_extends","Object","assign","target","i","arguments","length","source","key","hasOwnProperty","call","apply","this","SvgArrowmodule","props","React","createElement","width","height","fill","xmlns","d","stroke","strokeWidth","strokeLinecap","strokeLinejoin"],"mappings":"wBAAA,IAAIA,EAEJ,SAASC,IAA2Q,OAA9PA,EAAWC,OAAOC,QAAU,SAAUC,GAAU,IAAK,IAAIC,EAAI,EAAGA,EAAIC,UAAUC,OAAQF,IAAK,CAAE,IAAIG,EAASF,UAAUD,GAAI,IAAK,IAAII,KAAOD,GAAcN,IAAiBQ,eAAeC,KAAKH,EAAQC,KAAQL,EAAOK,GAAOD,EAAOC,IAAY,OAAOL,GAAkBH,EAASW,MAAMC,KAAMP,WAI7S,IAACQ,EAAyCC,GACvBC,EAAMC,cAAc,MAAOhB,EAAS,CACtDiB,MAAO,GACPC,OAAQ,GACRC,KAAM,OACNC,MAAO,8BACNN,GAAQf,IAAUA,EAAqBgB,EAAMC,cAAc,OAAQ,CACpEK,EAAG,0BACHC,OAAQ,eACRC,YAAa,IACbC,cAAe,QACfC,eAAgB"}

package/components/Arrow/images/chevron.module.svg.js

@@ -0,0 +1,2 @@
+import*as t from'react';var r;function e(){return e=Object.assign||function(t){for(var r=1;r<arguments.length;r++){var e=arguments[r];for(var a in e)({}).hasOwnProperty.call(e,a)&&(t[a]=e[a])}return t},e.apply(this,arguments)}var a=a=>t.createElement("svg",e({xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 4.233 4.233"},a),r||(r=t.createElement("path",{d:"m.76 3.175-.363-.369 1.72-1.748 1.72 1.748-.363.369-1.357-1.38z"})));export{a as default};
+//# sourceMappingURL=chevron.module.svg.js.map

package/components/Arrow/images/chevron.module.svg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chevron.module.svg.js","sources":["../../../../../src/components/Arrow/images/chevron.module.svg"],"sourcesContent":["<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 4.233 4.233\"><path d=\"M.76 3.175l-.363-.369 1.72-1.748 1.72 1.748-.363.369-1.357-1.38z\" /></svg>\n"],"names":["_path","_extends","Object","assign","target","i","arguments","length","source","key","hasOwnProperty","call","apply","this","SvgChevronmodule","props","React","createElement","xmlns","width","height","viewBox","d"],"mappings":"wBAAA,IAAIA,EAEJ,SAASC,IAA2Q,OAA9PA,EAAWC,OAAOC,QAAU,SAAUC,GAAU,IAAK,IAAIC,EAAI,EAAGA,EAAIC,UAAUC,OAAQF,IAAK,CAAE,IAAIG,EAASF,UAAUD,GAAI,IAAK,IAAII,KAAOD,GAAAA,IAA+BE,eAAeC,KAAKH,EAAQC,KAAQL,EAAOK,GAAOD,EAAOC,IAAY,OAAOL,GAAkBH,EAASW,MAAMC,KAAMP,WAI7S,IAACQ,EAA6CC,GAC3BC,EAAMC,cAAc,MAAOhB,EAAS,CACtDiB,MAAO,6BACPC,MAAO,GACPC,OAAQ,GACRC,QAAS,mBACRN,GAAQf,IAAUA,EAAqBgB,EAAMC,cAAc,OAAQ,CACpEK,EAAG"}

package/components/Arrow/style.js

@@ -1,2 +1,2 @@
-import e,{css as o}from'styled-components';var a=o(["box-shadow:inset 0 0 0 2px ",";background:transparent;svg{fill:",";}"],(e=>e.theme.colors.alto),(e=>e.theme.colors.alto));var t=o(["box-shadow:inset 0 0 0 2px ",";background:transparent;&:hover,&:active{background:",";svg{fill:",";}}&:active{box-shadow:inset 0 4px 0 #eaecf3;}svg{fill:",";}"],(e=>e.theme.colors.white),(e=>e.theme.colors.white),(e=>e.theme.colors.accent),(e=>e.theme.colors.white));var r=o(["cursor:not-allowed;-webkit-filter:grayscale(100%);-moz-filter:grayscale(100%);-ms-filter:grayscale(100%);-o-filter:grayscale(100%);filter:grayscale(100%);"]);var s=e.button.withConfig({componentId:"fox-ui__sc-1xgj0m4-0"})(["outline:0;border:0;background:#fff;border-radius:99em;display:inline-flex;align-items:center;justify-content:center;font-size:0;line-height:0;box-shadow:0 6px 20px rgba(0,0,0,0.1);transition:all 0.2s ease;margin:0;padding:0;cursor:pointer;"," &:hover{background:",";box-shadow:none;svg{fill:white;}}&:active{background:darken($accent,13);box-shadow:inset 0 4px 0 rgba(5,108,188,0.5);}svg{transition:all 0.2s ease;fill:",";}"," "," ",""],(e=>e.size?(e=>{var a;switch(e){case'l':a=40;break;case'm':default:a=28;break;case'xs':a=20}return o(["border-radius:","px;width:","px;height:","px;"],a,a,a)})(e.size):null),(e=>e.theme.colors.accent),(e=>e.theme.colors.accent),(e=>e.outline?a:null),(e=>e.inverse?t:null),(e=>e.disabled?r:null));export{s as Root};
+import o,{css as n}from'styled-components';import{injectDefaultTheme as r}from'../../shared/utils/inject-theme.js';import{responsiveProperty as c}from'../../mixins/responsive-property.js';import{TRANSIENT_PROPS as e}from'./constants.js';var t={l:48,m:44,xs:40};var a={l:40,m:28,xs:20};var l="\n  content: '';\n  position: absolute;\n  inset: 0;\n  border-radius: inherit;\n";var s="\n  cursor: not-allowed;\n  -webkit-filter: grayscale(100%);\n  -moz-filter: grayscale(100%);\n  -ms-filter: grayscale(100%);\n  -o-filter: grayscale(100%);\n  filter: grayscale(100%);\n";var i={filled:{default:n(["",""],(o=>{var{theme:n,disabled:r}=o;return"\n        background-color: ".concat(r?n.colors['bg-disabled-large']:n.colors['bg-onmain-tertiary'],";\n        color: ").concat(r?n.colors['content-disabled']:n.colors['content-onmain-primary'],";\n        &::before {\n          ").concat(l,"\n          opacity: 0;\n          background-color: ").concat(n.colors['bg-oncolor-hover'],";\n      \n        }\n        &::after {\n          ").concat(l,"\n          opacity: 0;\n          box-shadow: inset 0 4px ").concat(n.colors['bg-oncolor-hover'],";\n        }\n        ").concat(r?'cursor: default;':"\n              &:hover::before {\n                opacity: 1;\n              }\n              &:active::before {\n                opacity: 0;\n              }\n              &:active::after {\n                opacity: 1;\n              }\n              &:active {\n                background-color: ".concat(n.colors['bg-brand-primary-basic-active'],";\n                color: ").concat(n.colors['content-oncolor-primary'],";\n              }\n            "),"\n      ")})),onColored:n(["",""],(o=>{var{theme:n,disabled:r}=o;return"\n        background-color: ".concat(n.colors['bg-oncolor-primary'],";\n        color: ").concat(r?n.colors['content-disabled']:n.colors['content-oncolor-constant'],";\n        &::before {\n          ").concat(l,"\n          opacity: 0;\n          background-color: ").concat(n.colors['bg-oncolor-hover'],";\n        }\n        &::after {\n          ").concat(l,"\n          opacity: 0;\n          box-shadow: inset 0 4px ").concat(n.colors['bg-oncolor-hover'],";\n        }\n        ").concat(r?'cursor: default;':"\n              &:hover::before {\n                opacity: 1;\n              }\n              &:active::after {\n                opacity: 1;\n              }\n            ","\n      ")}))},outline:{default:n(["",""],(o=>{var{theme:n,disabled:r}=o;return"\n        background-color: transparent; \n        color: ".concat(r?n.colors['border-disabled']:n.colors['content-onmain-primary'],";\n        &::before {\n          ").concat(l,"\n          opacity: 1;\n          box-shadow: inset 0 0 0 1px ").concat(r?n.colors['border-disabled']:n.colors['border-onmain-contrast'],";\n        }\n        &::after {\n          ").concat(l,"\n          opacity: 0;\n          box-shadow: inset 0 4px ").concat(n.colors['bg-oncolor-hover'],";\n        }\n        ").concat(r?'cursor: default;':"\n              &:hover::before {\n                opacity: 0;\n              }\n              &:hover {\n                background-color: ".concat(n.colors['bg-onmain-tertiary'],";\n              }\n              &:active::after {\n                opacity: 1;\n              }\n              &:active {\n                background-color: ").concat(n.colors['bg-brand-primary-basic-active'],";\n                color: ").concat(n.colors['content-oncolor-primary'],";\n              }\n            "),"\n      ")})),onColored:n(["",""],(o=>{var{theme:n,disabled:r}=o;return"\n        background-color: transparent; \n        color: ".concat(r?n.colors['border-oncolor-disabled']:n.colors['content-oncolor-primary'],";\n        &::before {\n          ").concat(l,"\n          opacity: 1;\n          box-shadow: inset 0 0 0 1px ").concat(r?n.colors['border-oncolor-disabled']:n.colors['border-oncolor-default'],";\n        }\n        &::after {\n          ").concat(l,"\n          opacity: 0;\n          box-shadow: inset 0 4px ").concat(n.colors['bg-oncolor-hover'],";\n        }\n        ").concat(r?'cursor: default;':"\n              &:hover::before {\n                opacity: 0;\n              }\n              &:hover {\n                background-color: ".concat(n.colors['bg-oncolor-primary'],";\n                color: ").concat(n.colors['content-oncolor-constant'],";\n              }\n              &:active::after {\n                opacity: 1;\n              }\n            "),"\n      ")}))}};var d={filled:n(["",""],(o=>{var{theme:n,disabled:r}=o;return"\n      background-color: ".concat(n.colors.white,";\n      box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);\n      & svg {\n        fill: ").concat(n.colors.accent,";\n      }\n      &:hover {\n        background-color: ").concat(n.colors.accent,";\n        box-shadow: none;\n        svg {\n          fill: ").concat(n.colors.white,";\n        }\n      }\n      &:active {\n        box-shadow: inset 0 4px 0 rgba(5, 108, 188, 0.5);\n      }\n      ").concat(r?s:'',"\n    ")})),outline:n(["",""],(o=>{var{theme:n,disabled:r}=o;return"\n      background-color: transparent;\n      box-shadow: inset 0 0 0 2px ".concat(n.colors.alto,";\n      & svg {\n        fill: ").concat(n.colors.alto,";\n      }\n      &:hover {\n        background-color: ").concat(n.colors.accent,";\n        box-shadow: none;\n        svg {\n          fill: ").concat(n.colors.white,";\n        }\n      }\n      &:active {\n        box-shadow: inset 0 4px 0 rgba(5, 108, 188, 0.5);\n      }\n      ").concat(r?s:'',"\n    ")})),inverse:n(["",""],(o=>{var{theme:n,disabled:r}=o;return"\n      background-color: transparent;\n      box-shadow: inset 0 0 0 2px ".concat(n.colors.white,";\n      & svg {\n        fill: ").concat(n.colors.white,";\n      }\n      &:hover {\n        background-color: ").concat(n.colors.white,";\n        box-shadow: none;\n        svg {\n          fill: ").concat(n.colors.accent,";\n        }\n      }\n      &:active {\n        box-shadow: inset 0 4px 0 #eaecf3;\n      }\n      ").concat(r?s:'',"\n    ")}))};var b=(o,n)=>{var r=o.brandPresetUsed?t:a;return['l','m','xs'].includes(o.size)?"".concat(n,": ").concat(r[o.size],"px;"):c('size',n)};var p=o.button.withConfig({shouldForwardProp:o=>!e.includes(o)}).attrs(r).withConfig({componentId:"fox-ui__sc-1xgj0m4-0"})([""," "," "," "," ",""],"\n  &,\n  & > span {\n    box-sizing: border-box;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n  }\n  position: relative;\n  flex-shrink: 0;\n  padding: 0;\n  border: 0;\n  line-height: 1;\n  cursor: pointer;\n  overflow: hidden;\n  transition-property: background-color, box-shadow;\n  &::before, \n  &::after {\n    transition-property: opacity;\n  }\n  &,\n  &::before,\n  &::after {\n    transition-duration: 200ms;\n  }\n",(o=>o.brandPresetUsed?o.outline&&o.onColored?i.outline.onColored:o.outline&&!o.onColored?i.outline.default:!o.outline&&o.onColored?i.filled.onColored:i.filled.default:o.inverse?d.inverse:o.outline?d.outline:d.filled),(o=>b(o,'height')),(o=>b(o,'width')),(o=>"border-radius: ".concat(o.borderRadius,";")));export{p as Root};
 //# sourceMappingURL=style.js.map

package/components/Arrow/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/Arrow/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { ArrowProps } from './Arrow'\n\nconst outline = css`\n  box-shadow: inset 0 0 0 2px ${(props) => props.theme.colors.alto};\n  background: transparent;\n\n  svg {\n    fill: ${(props) => props.theme.colors.alto};\n  }\n`\n\nconst inverse = css`\n  box-shadow: inset 0 0 0 2px ${(props) => props.theme.colors.white};\n  background: transparent;\n  &:hover,\n  &:active {\n    background: ${(props) => props.theme.colors.white};\n    svg {\n      fill: ${(props) => props.theme.colors.accent};\n    }\n  }\n  &:active {\n    box-shadow: inset 0 4px 0 #eaecf3;\n  }\n\n  svg {\n    fill: ${(props) => props.theme.colors.white};\n  }\n`\n\nconst disabled = css`\n  cursor: not-allowed;\n  -webkit-filter: grayscale(100%);\n  -moz-filter: grayscale(100%);\n  -ms-filter: grayscale(100%);\n  -o-filter: grayscale(100%);\n  filter: grayscale(100%);\n`\n\nconst size = (size: ArrowProps['size']) => {\n  let radius\n  switch (size) {\n    case 'l':\n      radius = 40\n      break\n    case 'm':\n      radius = 28\n      break\n    case 'xs':\n      radius = 20\n      break\n    default:\n      radius = 28\n  }\n  return css`\n    border-radius: ${radius}px;\n    width: ${radius}px;\n    height: ${radius}px;\n  `\n}\n\nexport const Root = styled.button<ArrowProps>`\n  outline: 0;\n  border: 0;\n  background: #fff;\n  border-radius: 99em;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 0;\n  line-height: 0;\n  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);\n  transition: all 0.2s ease;\n  margin: 0;\n  padding: 0;\n  cursor: pointer;\n  ${(props) => (props.size ? size(props.size) : null)}\n\n  &:hover {\n    background: ${(props) => props.theme.colors.accent};\n    box-shadow: none;\n    svg {\n      fill: white;\n    }\n  }\n\n  &:active {\n    background: darken($accent, 13);\n    box-shadow: inset 0 4px 0 rgba(5, 108, 188, 0.5);\n  }\n\n  svg {\n    transition: all 0.2s ease;\n    fill: ${(props) => props.theme.colors.accent};\n  }\n\n  ${(props) => (props.outline ? outline : null)}\n  ${(props) => (props.inverse ? inverse : null)}\n  ${(props) => (props.disabled ? disabled : null)}\n`\n"],"names":["outline","css","props","theme","colors","alto","inverse","white","accent","disabled","Root","styled","button","withConfig","componentId","size","radius"],"mappings":"2CAGA,IAAMA,EAAUC,EAAH,CAAA,8BAAA,oCAAA,OACoBC,GAAUA,EAAMC,MAAMC,OAAOC,OAIjDH,GAAUA,EAAMC,MAAMC,OAAOC,OAI1C,IAAMC,EAAUL,sKACiBC,GAAUA,EAAMC,MAAMC,OAAOG,QAI3CL,GAAUA,EAAMC,MAAMC,OAAOG,QAEjCL,GAAUA,EAAMC,MAAMC,OAAOI,SAQ/BN,GAAUA,EAAMC,MAAMC,OAAOG,QAI1C,IAAME,EAAWR,EAAjB,CAAA,+JA+BaS,IAAAA,EAAOC,EAAOC,OAAVC,WAAA,CAAAC,YAAA,wBAAGH,CAAH,CAAA,kPAAA,uBAAA,4JAAA,KAAA,IAAA,IAAA,KAeZT,GAAWA,EAAMa,KArCRA,CAAAA,IACZ,IAAIC,EACJ,OAAQD,GACN,IAAK,IACHC,EAAS,GACT,MACF,IAAK,IAML,QACEA,EAAS,GAJX,MAAA,IAAK,KACHA,EAAS,GAKb,OAAOf,EACYe,CAAAA,iBAAAA,YAAAA,aAAAA,OAAAA,EACRA,EACCA,IAlBAD,CAqCoBb,EAAMa,MAAQ,OAG7Bb,GAAUA,EAAMC,MAAMC,OAAOI,SAcnCN,GAAUA,EAAMC,MAAMC,OAAOI,SAGrCN,GAAWA,EAAMF,QAAUA,EAAU,OACrCE,GAAWA,EAAMI,QAAUA,EAAU,OACrCJ,GAAWA,EAAMO,SAAWA,EAAW"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/Arrow/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport type { DefaultTheme, ThemedStyledProps } from 'styled-components'\nimport { injectDefaultTheme } from 'shared/utils/inject-theme'\nimport { responsiveProperty } from 'mixins/responsive-property'\nimport { TRANSIENT_PROPS } from './constants'\nimport type { ArrowRootProps, ArrowStaticSize, ArrowTransientProp } from './types'\n\nconst SIZES: Record<ArrowStaticSize, number> = { l: 48, m: 44, xs: 40 }\n\nconst DEFAULT_SIZES: Record<ArrowStaticSize, number> = { l: 40, m: 28, xs: 20 }\n\nconst baseStyles = `\n  &,\n  & > span {\n    box-sizing: border-box;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n  }\n  position: relative;\n  flex-shrink: 0;\n  padding: 0;\n  border: 0;\n  line-height: 1;\n  cursor: pointer;\n  overflow: hidden;\n  transition-property: background-color, box-shadow;\n  &::before, \n  &::after {\n    transition-property: opacity;\n  }\n  &,\n  &::before,\n  &::after {\n    transition-duration: 200ms;\n  }\n`\n\nconst pseudoBaseStyles = `\n  content: '';\n  position: absolute;\n  inset: 0;\n  border-radius: inherit;\n`\n\nconst defaultDisabledStyles = `\n  cursor: not-allowed;\n  -webkit-filter: grayscale(100%);\n  -moz-filter: grayscale(100%);\n  -ms-filter: grayscale(100%);\n  -o-filter: grayscale(100%);\n  filter: grayscale(100%);\n`\n\nconst PRESET = {\n  filled: {\n    default: css<ArrowRootProps>`\n      ${({ theme, disabled }) => `\n        background-color: ${disabled ? theme.colors['bg-disabled-large'] : theme.colors['bg-onmain-tertiary']};\n        color: ${disabled ? theme.colors['content-disabled'] : theme.colors['content-onmain-primary']};\n        &::before {\n          ${pseudoBaseStyles}\n          opacity: 0;\n          background-color: ${theme.colors['bg-oncolor-hover']};\n      \n        }\n        &::after {\n          ${pseudoBaseStyles}\n          opacity: 0;\n          box-shadow: inset 0 4px ${theme.colors['bg-oncolor-hover']};\n        }\n        ${\n          disabled\n            ? 'cursor: default;'\n            : `\n              &:hover::before {\n                opacity: 1;\n              }\n              &:active::before {\n                opacity: 0;\n              }\n              &:active::after {\n                opacity: 1;\n              }\n              &:active {\n                background-color: ${theme.colors['bg-brand-primary-basic-active']};\n                color: ${theme.colors['content-oncolor-primary']};\n              }\n            `\n        }\n      `}\n    `,\n    onColored: css<ArrowRootProps>`\n      ${({ theme, disabled }) => `\n        background-color: ${theme.colors['bg-oncolor-primary']};\n        color: ${disabled ? theme.colors['content-disabled'] : theme.colors['content-oncolor-constant']};\n        &::before {\n          ${pseudoBaseStyles}\n          opacity: 0;\n          background-color: ${theme.colors['bg-oncolor-hover']};\n        }\n        &::after {\n          ${pseudoBaseStyles}\n          opacity: 0;\n          box-shadow: inset 0 4px ${theme.colors['bg-oncolor-hover']};\n        }\n        ${\n          disabled\n            ? 'cursor: default;'\n            : `\n              &:hover::before {\n                opacity: 1;\n              }\n              &:active::after {\n                opacity: 1;\n              }\n            `\n        }\n      `}\n    `,\n  },\n  outline: {\n    default: css<ArrowRootProps>`\n      ${({ theme, disabled }) => `\n        background-color: transparent; \n        color: ${disabled ? theme.colors['border-disabled'] : theme.colors['content-onmain-primary']};\n        &::before {\n          ${pseudoBaseStyles}\n          opacity: 1;\n          box-shadow: inset 0 0 0 1px ${\n            disabled ? theme.colors['border-disabled'] : theme.colors['border-onmain-contrast']\n          };\n        }\n        &::after {\n          ${pseudoBaseStyles}\n          opacity: 0;\n          box-shadow: inset 0 4px ${theme.colors['bg-oncolor-hover']};\n        }\n        ${\n          disabled\n            ? 'cursor: default;'\n            : `\n              &:hover::before {\n                opacity: 0;\n              }\n              &:hover {\n                background-color: ${theme.colors['bg-onmain-tertiary']};\n              }\n              &:active::after {\n                opacity: 1;\n              }\n              &:active {\n                background-color: ${theme.colors['bg-brand-primary-basic-active']};\n                color: ${theme.colors['content-oncolor-primary']};\n              }\n            `\n        }\n      `}\n    `,\n    onColored: css<ArrowRootProps>`\n      ${({ theme, disabled }) => `\n        background-color: transparent; \n        color: ${disabled ? theme.colors['border-oncolor-disabled'] : theme.colors['content-oncolor-primary']};\n        &::before {\n          ${pseudoBaseStyles}\n          opacity: 1;\n          box-shadow: inset 0 0 0 1px ${\n            disabled ? theme.colors['border-oncolor-disabled'] : theme.colors['border-oncolor-default']\n          };\n        }\n        &::after {\n          ${pseudoBaseStyles}\n          opacity: 0;\n          box-shadow: inset 0 4px ${theme.colors['bg-oncolor-hover']};\n        }\n        ${\n          disabled\n            ? 'cursor: default;'\n            : `\n              &:hover::before {\n                opacity: 0;\n              }\n              &:hover {\n                background-color: ${theme.colors['bg-oncolor-primary']};\n                color: ${theme.colors['content-oncolor-constant']};\n              }\n              &:active::after {\n                opacity: 1;\n              }\n            `\n        }\n      `}\n    `,\n  },\n}\n\nconst PRESET_DEFAULT = {\n  filled: css<ArrowRootProps>`\n    ${({ theme, disabled }) => `\n      background-color: ${theme.colors.white};\n      box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);\n      & svg {\n        fill: ${theme.colors.accent};\n      }\n      &:hover {\n        background-color: ${theme.colors.accent};\n        box-shadow: none;\n        svg {\n          fill: ${theme.colors.white};\n        }\n      }\n      &:active {\n        box-shadow: inset 0 4px 0 rgba(5, 108, 188, 0.5);\n      }\n      ${disabled ? defaultDisabledStyles : ''}\n    `}\n  `,\n  outline: css<ArrowRootProps>`\n    ${({ theme, disabled }) => `\n      background-color: transparent;\n      box-shadow: inset 0 0 0 2px ${theme.colors.alto};\n      & svg {\n        fill: ${theme.colors.alto};\n      }\n      &:hover {\n        background-color: ${theme.colors.accent};\n        box-shadow: none;\n        svg {\n          fill: ${theme.colors.white};\n        }\n      }\n      &:active {\n        box-shadow: inset 0 4px 0 rgba(5, 108, 188, 0.5);\n      }\n      ${disabled ? defaultDisabledStyles : ''}\n    `}\n  `,\n  inverse: css<ArrowRootProps>`\n    ${({ theme, disabled }) => `\n      background-color: transparent;\n      box-shadow: inset 0 0 0 2px ${theme.colors.white};\n      & svg {\n        fill: ${theme.colors.white};\n      }\n      &:hover {\n        background-color: ${theme.colors.white};\n        box-shadow: none;\n        svg {\n          fill: ${theme.colors.accent};\n        }\n      }\n      &:active {\n        box-shadow: inset 0 4px 0 #eaecf3;\n      }\n      ${disabled ? defaultDisabledStyles : ''}\n    `}\n  `,\n}\n\nconst extractSize = (props: ThemedStyledProps<ArrowRootProps, DefaultTheme>, cssProperty: 'height' | 'width') => {\n  const config = props.brandPresetUsed ? SIZES : DEFAULT_SIZES\n\n  return ['l', 'm', 'xs'].includes(<ArrowStaticSize>props.size)\n    ? `${cssProperty}: ${config[<ArrowStaticSize>props.size]}px;`\n    : responsiveProperty('size', cssProperty)\n}\n\nconst extractStyles = (props: ThemedStyledProps<ArrowRootProps, DefaultTheme>) => {\n  if (props.brandPresetUsed) {\n    if (props.outline && props.onColored) return PRESET.outline.onColored\n    if (props.outline && !props.onColored) return PRESET.outline.default\n    if (!props.outline && props.onColored) return PRESET.filled.onColored\n\n    return PRESET.filled.default\n  }\n\n  if (props.inverse) return PRESET_DEFAULT.inverse\n  if (props.outline) return PRESET_DEFAULT.outline\n\n  return PRESET_DEFAULT.filled\n}\n\nexport const Root = styled.button\n  .withConfig({\n    shouldForwardProp: (prop) => {\n      return !TRANSIENT_PROPS.includes(<ArrowTransientProp>prop)\n    },\n  })\n  .attrs(injectDefaultTheme)<ArrowRootProps>`\n  ${baseStyles}\n  ${extractStyles}\n  ${(props) => extractSize(props, 'height')}\n  ${(props) => extractSize(props, 'width')}\n  ${(props) => `border-radius: ${props.borderRadius};`}\n`\n"],"names":["SIZES","l","m","xs","DEFAULT_SIZES","pseudoBaseStyles","defaultDisabledStyles","PRESET","filled","default","css","_ref","theme","disabled","concat","colors","onColored","_ref2","outline","_ref3","_ref4","PRESET_DEFAULT","_ref5","white","accent","_ref6","alto","inverse","_ref7","extractSize","props","cssProperty","config","brandPresetUsed","includes","size","responsiveProperty","Root","styled","button","withConfig","shouldForwardProp","prop","TRANSIENT_PROPS","attrs","injectDefaultTheme","componentId","borderRadius"],"mappings":"6OAOA,IAAMA,EAAyC,CAAEC,EAAG,GAAIC,EAAG,GAAIC,GAAI,IAEnE,IAAMC,EAAiD,CAAEH,EAAG,GAAIC,EAAG,GAAIC,GAAI,IA6B3E,IAAME,EAAN,oFAOA,IAAMC,EAAN,6LASA,IAAMC,EAAS,CACbC,OAAQ,CACNC,QAASC,EACL,CAAA,GAAA,KAAAC,IAAA,IAACC,MAAEA,EAAFC,SAASA,GAAVF,EAAA,MAAA,+BAAAG,OACoBD,EAAWD,EAAMG,OAAO,qBAAuBH,EAAMG,OAAO,sBACvEF,sBAAAA,OAAAA,EAAWD,EAAMG,OAAO,oBAAsBH,EAAMG,OAAO,0BAEhEV,sCAAAA,OAAAA,EAEkBO,yDAAAA,OAAAA,EAAMG,OAAO,oBAI/BV,wDAAAA,OAAAA,EAEwBO,+DAAAA,OAAAA,EAAMG,OAAO,oBAGvCF,0BAAAA,OAAAA,EACI,mBAYsBD,+SAAAA,OAAAA,EAAMG,OAAO,iCACxBH,8BAAAA,OAAAA,EAAMG,OAAO,2BA7B9B,oCAAA,eAmCJC,UAAWN,EACP,CAAA,GAAA,KAAAO,IAAA,IAACL,MAAEA,EAAFC,SAASA,GAAVI,EAAA,MACoBL,+BAAAA,OAAAA,EAAMG,OAAO,sBADjC,sBAAAD,OAESD,EAAWD,EAAMG,OAAO,oBAAsBH,EAAMG,OAAO,yEAEhEV,EAJJ,yDAAAS,OAMsBF,EAAMG,OAAO,2EAG/BV,EATJ,+DAAAS,OAW4BF,EAAMG,OAAO,qDAGvCF,EACI,mBAfN,+KAAA,gBA4BNK,QAAS,CACPT,QAASC,EACL,CAAA,GAAA,KAAAS,IAAA,IAACP,MAAEA,EAAFC,SAASA,GAAVM,EAAA,MAAA,6DAAAL,OAESD,EAAWD,EAAMG,OAAO,mBAAqBH,EAAMG,OAAO,0BAE/DV,sCAAAA,OAAAA,EAGAQ,mEAAAA,OAAAA,EAAWD,EAAMG,OAAO,mBAAqBH,EAAMG,OAAO,0BAI1DV,gDAAAA,OAAAA,EAEwBO,+DAAAA,OAAAA,EAAMG,OAAO,oBAGvCF,0BAAAA,OAAAA,EACI,mBAMsBD,+IAAAA,OAAAA,EAAMG,OAAO,sBAMbH,mKAAAA,OAAAA,EAAMG,OAAO,iCACxBH,8BAAAA,OAAAA,EAAMG,OAAO,2BA9B9B,oCAAA,eAoCJC,UAAWN,EACP,CAAA,GAAA,KAAAU,IAAA,IAACR,MAAEA,EAAFC,SAASA,GAAVO,EAAA,MAAA,6DAAAN,OAESD,EAAWD,EAAMG,OAAO,2BAA6BH,EAAMG,OAAO,2BAF3E,sCAAAD,OAIIT,EAJJ,mEAAAS,OAOID,EAAWD,EAAMG,OAAO,2BAA6BH,EAAMG,OAAO,0BAPtE,gDAAAD,OAWIT,EAXJ,+DAAAS,OAa4BF,EAAMG,OAAO,oBAGvCF,0BAAAA,OAAAA,EACI,mBAMsBD,+IAAAA,OAAAA,EAAMG,OAAO,sBAP/B,8BAAAD,OAQOF,EAAMG,OAAO,4BAxB9B,mHAAA,iBAoCR,IAAMM,EAAiB,CACrBb,OAAQE,EACJ,CAAA,GAAA,KAAAY,IAAA,IAACV,MAAEA,EAAFC,SAASA,GAAVS,EAAA,MAAA,6BAAAR,OACoBF,EAAMG,OAAOQ,MADjC,sFAAAT,OAIUF,EAAMG,OAAOS,OAJvB,2DAAAV,OAOsBF,EAAMG,OAAOS,OAPnC,iEAAAV,OAUYF,EAAMG,OAAOQ,MAVzB,uHAAAT,OAgBED,EAAWP,EAAwB,GAhBrC,aAmBJY,QAASR,EACL,CAAA,GAAA,KAAAe,IAAA,IAACb,MAAEA,EAAFC,SAASA,GAAVY,EAAA,MAAA,6EAAAX,OAE8BF,EAAMG,OAAOW,KAF3C,oCAAAZ,OAIUF,EAAMG,OAAOW,KAJvB,2DAAAZ,OAOsBF,EAAMG,OAAOS,OAPnC,iEAAAV,OAUYF,EAAMG,OAAOQ,MAVzB,uHAAAT,OAgBED,EAAWP,EAAwB,GAhBrC,aAmBJqB,QAASjB,EACL,CAAA,GAAA,KAAAkB,IAAA,IAAChB,MAAEA,EAAFC,SAASA,GAAVe,EAAA,MAAA,6EAAAd,OAE8BF,EAAMG,OAAOQ,MAF3C,oCAAAT,OAIUF,EAAMG,OAAOQ,MAJvB,2DAAAT,OAOsBF,EAAMG,OAAOQ,MAPnC,iEAAAT,OAUYF,EAAMG,OAAOS,OAVzB,wGAAAV,OAgBED,EAAWP,EAAwB,GAhBrC,cAqBN,IAAMuB,EAAc,CAACC,EAAwDC,KAC3E,IAAMC,EAASF,EAAMG,gBAAkBjC,EAAQI,EAE/C,MAAO,CAAC,IAAK,IAAK,MAAM8B,SAA0BJ,EAAMK,MAAjD,GAAArB,OACAiB,EADA,MAAAjB,OACgBkB,EAAwBF,EAAMK,MACjDC,OAAAA,EAAmB,OAAQL,IAkB1B,IAAMM,EAAOC,EAAOC,OACxBC,WAAW,CACVC,kBAAoBC,IACVC,EAAgBT,SAA6BQ,KAGxDE,MAAMC,GANQL,WAAA,CAAAM,YAAA,wBAAGR,CAAH,CAAA,GAAA,IAAA,IAAA,IAAA,IAAA,IA/QjB,qdAgQuBR,GACjBA,EAAMG,gBACJH,EAAMZ,SAAWY,EAAMd,UAAkBT,EAAOW,QAAQF,UACxDc,EAAMZ,UAAYY,EAAMd,UAAkBT,EAAOW,QAAQT,SACxDqB,EAAMZ,SAAWY,EAAMd,UAAkBT,EAAOC,OAAOQ,UAErDT,EAAOC,OAAOC,QAGnBqB,EAAMH,QAAgBN,EAAeM,QACrCG,EAAMZ,QAAgBG,EAAeH,QAElCG,EAAeb,SAYnBsB,GAAUD,EAAYC,EAAO,YAC7BA,GAAUD,EAAYC,EAAO,WAC7BA,GAAD,kBAAAhB,OAA6BgB,EAAMiB,aAAnC"}

package/components/Arrow/utils.js

@@ -0,0 +1,2 @@
+var t={top:0,right:90,bottom:180,left:270};function r(r){var{top:o,right:e,bottom:a,left:n}=r;var c={top:o&&!a,right:e&&!n,bottom:a&&!o,left:n&&!e};var l=Object.values(c).filter((t=>!0===t)).length>1;var f=Object.keys(c).reduce(((r,o)=>c[o]?r+t[o]:r),0)/(l?2:1);return{transform:"rotate(".concat(f,"deg)").concat(l?' translateY(-3px)':'')}}export{t as DIR_MAP,r as getArrowRotation};
+//# sourceMappingURL=utils.js.map

package/components/Arrow/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../../../../src/components/Arrow/utils.ts"],"sourcesContent":["import type { ArrowProps } from './types'\n\nexport const DIR_MAP = {\n  top: 0,\n  right: 90,\n  bottom: 180,\n  left: 270,\n}\n\nexport function getArrowRotation({ top, right, bottom, left }: ArrowProps): React.CSSProperties {\n  const arrowDir = {\n    top: top && !bottom,\n    right: right && !left,\n    bottom: bottom && !top,\n    left: left && !right,\n  }\n\n  const isMultiDir = Object.values(arrowDir).filter((value) => value === true).length > 1\n\n  const rotateDeg =\n    Object.keys(arrowDir).reduce((acc, key) => (arrowDir[key] ? acc + DIR_MAP[key] : acc), 0) / (isMultiDir ? 2 : 1)\n\n  return {\n    transform: `rotate(${rotateDeg}deg)${isMultiDir ? ' translateY(-3px)' : ''}`,\n  }\n}\n"],"names":["DIR_MAP","top","right","bottom","left","getArrowRotation","_ref","arrowDir","isMultiDir","Object","values","filter","value","length","rotateDeg","keys","reduce","acc","key","transform","concat"],"mappings":"AAEO,IAAMA,EAAU,CACrBC,IAAK,EACLC,MAAO,GACPC,OAAQ,IACRC,KAAM,KAGD,SAASC,EAAgFC,GAAA,IAA/DL,IAAEA,EAAFC,MAAOA,EAAPC,OAAcA,EAAdC,KAAsBA,GAAyCE,EAC9F,IAAMC,EAAW,CACfN,IAAKA,IAAQE,EACbD,MAAOA,IAAUE,EACjBD,OAAQA,IAAWF,EACnBG,KAAMA,IAASF,GAGjB,IAAMM,EAAaC,OAAOC,OAAOH,GAAUI,QAAQC,IAAoB,IAAVA,IAAgBC,OAAS,EAEtF,IAAMC,EACJL,OAAOM,KAAKR,GAAUS,SAAQC,EAAKC,IAASX,EAASW,GAAOD,EAAMjB,EAAQkB,GAAOD,GAAM,IAAMT,EAAa,EAAI,GAEhH,MAAO,CACLW,2BAAqBL,EAAZ,QAAAM,OAA4BZ,EAAa,oBAAsB"}

package/components/ContextMenu/ContextMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.js","sources":["../../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["/* eslint-disable no-use-before-define */\nimport { cloneElement, PureComponent } from 'react'\nimport { ContextMenuMultiLevel } from '../../components/ContextMenu.Multilevel'\nimport { BaseProps } from '../../shared/interfaces'\nimport { Tooltip } from './../Tooltip'\nimport { ContextMenuItem } from './Item'\nimport * as Styled from './style'\nimport { tooltipStyles } from './tooltip-styles'\n\nexport interface ContextMenuProps extends BaseProps {\n  /**\n   * Children react node\n   */\n  children: React.ReactNode\n  /** Indicates if button is active (e.g. when context menu is open) */\n  onClick?: (_e: React.MouseEvent<HTMLDivElement>) => void\n  /** Manually controled state */\n  isOpen?: boolean\n  /** On open menu callback  */\n  onOpen?: (_e: React.MouseEvent<HTMLDivElement>) => void\n  /** On close menu callback  */\n  onClose?: (_e: React.MouseEvent<HTMLDivElement>) => void\n  /** Content */\n  trigger?: React.ReactNode\n  /** Properties for inner Tooltip component */\n  tooltipProps?: Partial<Parameters<typeof Tooltip>[0]>\n  /** Hide overlay for debug */\n  hideOverlay?: boolean\n}\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n */\nexport class ContextMenu extends PureComponent<ContextMenuProps, { isOpen: boolean }> {\n  static Item = ContextMenuItem\n  static MultiLevel = ContextMenuMultiLevel\n  static displayName = 'ContextMenu'\n\n  static defaultProps = {\n    tooltipProps: {\n      event: 'click',\n      placement: 'left-start',\n      offset: 2,\n      showCloseButton: false,\n      styles: tooltipStyles,\n    },\n    hideOverlay: false,\n  }\n\n  constructor(props: ContextMenuProps) {\n    super(props)\n\n    this.state = {\n      isOpen: this.props.isOpen || false,\n    }\n  }\n\n  getOpen = () => {\n    const { isOpen } = this.props\n\n    if (isOpen !== undefined) return isOpen\n\n    return this.state.isOpen || false\n  }\n\n  openMenu = (e: React.MouseEvent<HTMLDivElement>) => {\n    this.setState({ isOpen: true })\n\n    const { onOpen } = this.props\n\n    onOpen && onOpen(e)\n  }\n\n  closeMenu = (e: React.MouseEvent<HTMLDivElement>) => {\n    this.setState({ isOpen: false })\n\n    const { onClose } = this.props\n\n    onClose && onClose(e)\n  }\n\n  toggleMenu = (e: React.MouseEvent<HTMLDivElement>) => {\n    const { openMenu, closeMenu } = this\n    const isOpen = this.getOpen()\n\n    e.persist()\n    e.preventDefault()\n    e.stopPropagation()\n\n    isOpen ? closeMenu(e) : openMenu(e)\n\n    return false\n  }\n\n  render() {\n    const { className, tooltipProps = {}, trigger, children, hideOverlay } = this.props\n    const isOpen = this.getOpen()\n\n    if (children) tooltipProps.content = children\n\n    return (\n      <Styled.Root className={className} isOpen={isOpen} onClick={this.toggleMenu} hideOverlay={hideOverlay}>\n        <Tooltip {...tooltipProps} open={isOpen}>\n          <div onClick={this.closeMenu}>{trigger && cloneElement(trigger as any, { active: isOpen })}</div>\n        </Tooltip>\n      </Styled.Root>\n    )\n  }\n}\n"],"names":["ContextMenu","PureComponent","constructor","props","super","this","getOpen","isOpen","state","openMenu","e","setState","onOpen","closeMenu","onClose","toggleMenu","persist","preventDefault","stopPropagation","render","className","tooltipProps","trigger","children","hideOverlay","content","_jsx","Styled.Root","onClick","Tooltip","_objectSpread","open","cloneElement","active","Item","ContextMenuItem","MultiLevel","ContextMenuMultiLevel","displayName","defaultProps","event","placement","offset","showCloseButton","styles","tooltipStyles"],"mappings":"kaAkCO,MAAMA,UAAoBC,EAgB/BC,YAAYC,GACVC,MAAMD,GAD6BE,KAQrCC,QAAU,KACR,IAAMC,OAAEA,GAAWF,KAAKF,MAExB,gBAAII,EAA6BA,EAE1BF,KAAKG,MAAMD,YAbiBF,KAgBrCI,SAAYC,IACVL,KAAKM,SAAS,CAAEJ,QAAAA,IAEhB,IAAMK,OAAEA,GAAWP,KAAKF,MAExBS,GAAUA,EAAOF,IArBkBL,KAwBrCQ,UAAaH,IACXL,KAAKM,SAAS,CAAEJ,YAEhB,IAAMO,QAAEA,GAAYT,KAAKF,MAEzBW,GAAWA,EAAQJ,IA7BgBL,KAgCrCU,WAAcL,IACZ,IAAMD,SAAEA,EAAFI,UAAYA,GAAcR,KAChC,IAAME,EAASF,KAAKC,UAQpB,OANAI,EAAEM,UACFN,EAAEO,iBACFP,EAAEQ,kBAEFX,EAASM,EAAUH,GAAKD,EAASC,OArCjCL,KAAKG,MAAQ,CACXD,OAAQF,KAAKF,MAAMI,SAAAA,GAyCvBY,SACE,IAAMC,UAAEA,EAAFC,aAAaA,EAAe,GAA5BC,QAAgCA,EAAhCC,SAAyCA,EAAzCC,YAAmDA,GAAgBnB,KAAKF,MAC9E,IAAMI,EAASF,KAAKC,UAIpB,OAFIiB,IAAUF,EAAaI,QAAUF,GAGnCG,EAACC,EAAD,CAAaP,UAAWA,EAAWb,OAAQA,EAAQqB,QAASvB,KAAKU,WAAYS,YAAaA,EAA1FD,SACEG,EAACG,EAADC,EAAAA,EAAA,GAAaT,GAAb,GAAA,CAA2BU,KAAMxB,EAAjCgB,SACEG,EAAA,MAAA,CAAKE,QAASvB,KAAKQ,UAAnBU,SAA+BD,GAAWU,EAAaV,EAAgB,CAAEW,OAAQ1B,YAtE9EP,EACJkC,KAAOC,EADHnC,EAEJoC,WAAaC,EAFTrC,EAGJsC,YAAc,cAHVtC,EAKJuC,aAAe,CACpBlB,aAAc,CACZmB,MAAO,QACPC,UAAW,aACXC,OAAQ,EACRC,mBACAC,OAAQC,GAEVrB,aAAAA"}
+{"version":3,"file":"ContextMenu.js","sources":["../../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["/* eslint-disable no-use-before-define */\nimport { cloneElement, PureComponent } from 'react'\nimport { ContextMenuMultiLevel } from '../../components/ContextMenu.Multilevel'\nimport { BaseProps } from '../../shared/interfaces'\nimport { Tooltip } from './../Tooltip'\nimport { ContextMenuItem } from './Item'\nimport * as Styled from './style'\nimport { tooltipStyles } from './tooltip-styles'\n\nexport interface ContextMenuProps extends BaseProps {\n  /**\n   * Children react node\n   */\n  children: React.ReactNode\n  /** Indicates if button is active (e.g. when context menu is open) */\n  onClick?: (_e: React.MouseEvent<HTMLDivElement>) => void\n  /** Manually controled state */\n  isOpen?: boolean\n  /** On open menu callback  */\n  onOpen?: (_e: React.MouseEvent<HTMLDivElement>) => void\n  /** On close menu callback  */\n  onClose?: (_e: React.MouseEvent<HTMLDivElement>) => void\n  /** Content */\n  trigger?: React.ReactNode\n  /** Properties for inner Tooltip component */\n  tooltipProps?: Partial<Parameters<typeof Tooltip>[0]>\n  /** Hide overlay for debug */\n  hideOverlay?: boolean\n}\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n */\nexport class ContextMenu extends PureComponent<ContextMenuProps, { isOpen: boolean }> {\n  static Item = ContextMenuItem\n  static MultiLevel = ContextMenuMultiLevel\n  static displayName = 'ContextMenu'\n\n  static defaultProps = {\n    tooltipProps: {\n      event: 'click',\n      placement: 'left-start',\n      offset: 2,\n      showCloseButton: false,\n      styles: tooltipStyles,\n    },\n    hideOverlay: false,\n  }\n\n  constructor(props: ContextMenuProps) {\n    super(props)\n\n    this.state = {\n      isOpen: this.props.isOpen || false,\n    }\n  }\n\n  getOpen = () => {\n    const { isOpen } = this.props\n\n    if (isOpen !== undefined) return isOpen\n\n    return this.state.isOpen || false\n  }\n\n  openMenu = (e: React.MouseEvent<HTMLDivElement>) => {\n    this.setState({ isOpen: true })\n\n    const { onOpen } = this.props\n\n    onOpen && onOpen(e)\n  }\n\n  closeMenu = (e: React.MouseEvent<HTMLDivElement>) => {\n    this.setState({ isOpen: false })\n\n    const { onClose } = this.props\n\n    onClose && onClose(e)\n  }\n\n  toggleMenu = (e: React.MouseEvent<HTMLDivElement>) => {\n    const { openMenu, closeMenu } = this\n    const isOpen = this.getOpen()\n\n    e.persist()\n    e.preventDefault()\n    e.stopPropagation()\n\n    isOpen ? closeMenu(e) : openMenu(e)\n\n    return false\n  }\n\n  render() {\n    const { className, tooltipProps = {}, trigger, children, hideOverlay } = this.props\n    const isOpen = this.getOpen()\n\n    if (children) tooltipProps.content = children\n\n    return (\n      <Styled.Root className={className} isOpen={isOpen} onClick={this.toggleMenu} hideOverlay={hideOverlay}>\n        <Tooltip {...tooltipProps} open={isOpen}>\n          {/* eslint-disable-next-line @typescript-eslint/no-explicit-any */}\n          <div onClick={this.closeMenu}>{trigger && cloneElement(trigger as any, { active: isOpen })}</div>\n        </Tooltip>\n      </Styled.Root>\n    )\n  }\n}\n"],"names":["ContextMenu","PureComponent","constructor","props","super","this","getOpen","isOpen","state","openMenu","e","setState","onOpen","closeMenu","onClose","toggleMenu","persist","preventDefault","stopPropagation","render","className","tooltipProps","trigger","children","hideOverlay","content","_jsx","Styled.Root","onClick","Tooltip","_objectSpread","open","cloneElement","active","Item","ContextMenuItem","MultiLevel","ContextMenuMultiLevel","displayName","defaultProps","event","placement","offset","showCloseButton","styles","tooltipStyles"],"mappings":"kaAkCO,MAAMA,UAAoBC,EAgB/BC,YAAYC,GACVC,MAAMD,GAD6BE,KAQrCC,QAAU,KACR,IAAMC,OAAEA,GAAWF,KAAKF,MAExB,gBAAII,EAA6BA,EAE1BF,KAAKG,MAAMD,YAbiBF,KAgBrCI,SAAYC,IACVL,KAAKM,SAAS,CAAEJ,QAAAA,IAEhB,IAAMK,OAAEA,GAAWP,KAAKF,MAExBS,GAAUA,EAAOF,IArBkBL,KAwBrCQ,UAAaH,IACXL,KAAKM,SAAS,CAAEJ,YAEhB,IAAMO,QAAEA,GAAYT,KAAKF,MAEzBW,GAAWA,EAAQJ,IA7BgBL,KAgCrCU,WAAcL,IACZ,IAAMD,SAAEA,EAAFI,UAAYA,GAAcR,KAChC,IAAME,EAASF,KAAKC,UAQpB,OANAI,EAAEM,UACFN,EAAEO,iBACFP,EAAEQ,kBAEFX,EAASM,EAAUH,GAAKD,EAASC,OArCjCL,KAAKG,MAAQ,CACXD,OAAQF,KAAKF,MAAMI,SAAAA,GAyCvBY,SACE,IAAMC,UAAEA,EAAFC,aAAaA,EAAe,GAA5BC,QAAgCA,EAAhCC,SAAyCA,EAAzCC,YAAmDA,GAAgBnB,KAAKF,MAC9E,IAAMI,EAASF,KAAKC,UAIpB,OAFIiB,IAAUF,EAAaI,QAAUF,GAGnCG,EAACC,EAAD,CAAaP,UAAWA,EAAWb,OAAQA,EAAQqB,QAASvB,KAAKU,WAAYS,YAAaA,EAA1FD,SACEG,EAACG,EAADC,EAAAA,EAAA,GAAaT,GAAb,GAAA,CAA2BU,KAAMxB,EAAjCgB,SAEEG,EAAA,MAAA,CAAKE,QAASvB,KAAKQ,UAAnBU,SAA+BD,GAAWU,EAAaV,EAAgB,CAAEW,OAAQ1B,YAvE9EP,EACJkC,KAAOC,EADHnC,EAEJoC,WAAaC,EAFTrC,EAGJsC,YAAc,cAHVtC,EAKJuC,aAAe,CACpBlB,aAAc,CACZmB,MAAO,QACPC,UAAW,aACXC,OAAQ,EACRC,mBACAC,OAAQC,GAEVrB,aAAAA"}

package/components/Paper/Paper.js.map

@@ -1 +1 @@
-{"version":3,"file":"Paper.js","sources":["../../../../src/components/Paper/Paper.tsx"],"sourcesContent":["import { useClassname } from 'hooks/useClassname'\nimport { ResponsiveNamedProperty } from '../../mixins/responsive-property'\nimport { Color } from '../../mixins/color'\nimport * as Styled from './style'\nimport { SpacerProps } from '../../components/Spacer'\n\nexport interface PaperProps extends SpacerProps, Color, ResponsiveNamedProperty<'padding'> {\n  /**\n   * Set to true to generate a circlular paper container\n   */\n  circle?: boolean\n  /**\n   * Paper with rounded corners\n   */\n  rounded?: boolean\n  /**\n   * Paper with shadow\n   */\n  shadow?: boolean\n  /**\n   * This number represents the zDepth of the paper shadow\n   */\n  zDepth?: false | 0 | 1 | 2 | 3 | 4\n  /**\n   * Text align\n   */\n  textAlign?: 'left' | 'center' | 'right'\n}\n\nPaper.displayName = 'Paper'\n\n/**\n * Расширен:\n * - [`SpacerProps`](#/Разметка%20и%20позиционирование/Spacer)\n * - [`Color`](#/Миксины)\n * - [`ResponsiveNamedProperty<'padding'>`](#/Миксины)\n */\nexport function Paper({ padding = 'm', rounded = true, shadow = true, className, ...props }: PaperProps) {\n  const _className = useClassname(Paper.displayName, className)\n\n  return <Styled.Root padding={padding} rounded={rounded} shadow={shadow} className={_className} {...props} />\n}\n"],"names":["Paper","_ref","padding","rounded","shadow","className","props","_objectWithoutProperties","_excluded","_className","useClassname","displayName","_jsx","Styled.Root","_objectSpread"],"mappings":"wSAqCO,SAASA,EAAyFC,GAAA,IAAnFC,QAAEA,EAAU,IAAZC,QAAiBA,GAAAA,EAAjBC,OAAiCA,GAAS,EAA1CC,UAAgDA,GAAmCJ,EAArBK,EAAqBC,EAAAN,EAAAO,GACvG,IAAMC,EAAaC,EAAaV,EAAMW,YAAaN,GAEnD,OAAOO,EAACC,EAADC,EAAA,CAAaZ,QAASA,EAASC,QAASA,EAASC,OAAQA,EAAQC,UAAWI,GAAgBH,IAXrGN,EAAMW,YAAc"}
+{"version":3,"file":"Paper.js","sources":["../../../../src/components/Paper/Paper.tsx"],"sourcesContent":["import { useClassname } from 'hooks/useClassname'\nimport { ResponsiveNamedProperty } from '../../mixins/responsive-property'\nimport { Color } from '../../mixins/color'\nimport { SpacerProps } from '../../components/Spacer'\nimport * as Styled from './style'\n\nexport interface PaperProps extends SpacerProps, Color, ResponsiveNamedProperty<'padding'> {\n  /**\n   * Set to true to generate a circlular paper container\n   */\n  circle?: boolean\n  /**\n   * Paper with rounded corners\n   */\n  rounded?: boolean\n  /**\n   * Paper with shadow\n   */\n  shadow?: boolean\n  /**\n   * This number represents the zDepth of the paper shadow\n   */\n  zDepth?: false | 0 | 1 | 2 | 3 | 4\n  /**\n   * Text align\n   */\n  textAlign?: 'left' | 'center' | 'right'\n}\n\nPaper.displayName = 'Paper'\n\n/**\n * Расширен:\n * - [`SpacerProps`](#/Разметка%20и%20позиционирование/Spacer)\n * - [`Color`](#/Миксины)\n * - [`ResponsiveNamedProperty<'padding'>`](#/Миксины)\n */\nexport function Paper({ padding = 'm', rounded = true, shadow = true, className, ...props }: PaperProps) {\n  const _className = useClassname(Paper.displayName, className)\n\n  return <Styled.Root padding={padding} rounded={rounded} shadow={shadow} className={_className} {...props} />\n}\n"],"names":["Paper","_ref","padding","rounded","shadow","className","props","_objectWithoutProperties","_excluded","_className","useClassname","displayName","_jsx","Styled.Root","_objectSpread"],"mappings":"wSAqCO,SAASA,EAAyFC,GAAA,IAAnFC,QAAEA,EAAU,IAAZC,QAAiBA,GAAAA,EAAjBC,OAAiCA,GAAS,EAA1CC,UAAgDA,GAAmCJ,EAArBK,EAAqBC,EAAAN,EAAAO,GACvG,IAAMC,EAAaC,EAAaV,EAAMW,YAAaN,GAEnD,OAAOO,EAACC,EAADC,EAAA,CAAaZ,QAASA,EAASC,QAASA,EAASC,OAAQA,EAAQC,UAAWI,GAAgBH,IAXrGN,EAAMW,YAAc"}

package/dts/index.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 import * as styled_components from 'styled-components';
 import { DefaultTheme, FlattenSimpleInterpolation, CSSObject, SimpleInterpolation, css } from 'styled-components';
+import { ResponsiveProperty as ResponsiveProperty$1 } from 'mixins/responsive-property';
 import * as react from 'react';
 import { PureComponent, Component } from 'react';
 import { Link, NavLink } from 'react-router-dom';
@@ -14,6 +15,22 @@ import Floater from 'react-floater';
 import { InputState, MaskOptions } from 'react-input-mask';
 import { ReactSelectProps } from 'react-select';
 
+interface ThemeProviderProps {
+    theme: Partial<DefaultTheme> | ((topLevelTheme: DefaultTheme) => DefaultTheme);
+    children: React.ReactNode;
+}
+declare function ThemeProvider(props: ThemeProviderProps): JSX.Element;
+
+declare const defaultTheme: DefaultTheme;
+declare const motherLightTheme: DefaultTheme;
+declare const motherDarkTheme: DefaultTheme;
+declare const babyLightTheme: DefaultTheme;
+declare const babyDarkTheme: DefaultTheme;
+declare const teenLightTheme: DefaultTheme;
+declare const teenDarkTheme: DefaultTheme;
+declare const adultLightTheme: DefaultTheme;
+declare const adultDarkTheme: DefaultTheme;
+
 declare enum ColorNames {
     facebook = "facebook",
     twitter = "twitter",
@@ -188,14 +205,6 @@ declare enum ColorNames {
     superlightgrey = "superlightgrey"
 }
 
-interface Props {
-    theme: DefaultTheme;
-    children: React.ReactNode;
-}
-declare function ThemeProvider(props: Props): JSX.Element;
-
-declare const theme: Theme;
-
 declare type ColorPropsProperties = 'color' | 'fontColor' | `${string}Color` | `color${string}`;
 declare type ColorValue = keyof typeof ColorNames | RGB | RGBA | HEX;
 declare type ColorCalcProperty = (_color: ColorValue) => FlattenSimpleInterpolation | null;
@@ -273,6 +282,44 @@ declare const responsiveNamedProperty: <T extends PropsProperties>({ sizes, cssP
  */
 declare const responsiveProperty: (propName: string, cssProperty?: string | null, sizing?: null | string) => () => (props: any) => styled_components.FlattenInterpolation<styled_components.ThemeProps<styled_components.DefaultTheme>> | null;
 
+declare type ArrowStaticSize = 'l' | 'm' | 'xs';
+declare type ArrowSize = ArrowStaticSize | ResponsiveProperty$1<`${number}rem` | number>;
+declare type ArrowProps = {
+    /** Appearance preset */
+    preset?: 'default' | 'brand';
+    /** Square shape */
+    square?: boolean;
+    /** Used on colored background */
+    onColored?: boolean;
+    /** Size of button */
+    size?: ArrowSize;
+    /** Arrow points top */
+    top?: boolean;
+    /** Arrow points right */
+    right?: boolean;
+    /** Arrow points bottom */
+    bottom?: boolean;
+    /** Arrow points left */
+    left?: boolean;
+    /** Inverted colors */
+    inverse?: boolean;
+    /** Outlined appearance */
+    outline?: boolean;
+    /** Button disabled */
+    disabled?: boolean;
+    /** Click handler */
+    onClick?(event: React.MouseEvent<HTMLButtonElement>): void;
+    /** CSS classname */
+    className?: string;
+    /** Style object */
+    style?: React.CSSProperties;
+};
+
+/**
+ * Button with arrow icon
+ */
+declare const Arrow: react.ForwardRefExoticComponent<ArrowProps & react.RefAttributes<HTMLButtonElement>>;
+
 declare enum SizeInput {
     l = 380,
     m = 300,
@@ -283,6 +330,9 @@ declare enum SizeInput {
 declare type HEX = `#${string}`;
 declare type RGB = `rgb(${number}, ${number}, ${number})`;
 declare type RGBA = `rgba(${number}, ${number}, ${number}, ${number})`;
+declare type ThemePreset = 'default' | 'brand';
+declare type ThemeMode = 'light' | 'dark';
+declare type ComponentContext<P> = Omit<Partial<P>, 'onClick' | 'className' | 'style'>;
 interface Tooltiped {
     innerRef?: React.LegacyRef<HTMLElement>;
     onMouseEnter?: () => void;
@@ -361,11 +411,16 @@ interface Theme {
     utils?: {
         relBuilder?: (_link?: string, _target?: string) => undefined | string;
     };
+    mode: ThemeMode;
+    preset: ThemePreset;
+    components?: {
+        Arrow?: ComponentContext<ArrowProps>;
+    };
 }
 
 declare type StyledComponentProps = {
     theme?: {
-        breakpoints?: typeof theme.breakpoints;
+        breakpoints?: typeof defaultTheme.breakpoints;
     };
 };
 declare type MediaQueryParams = {
@@ -826,53 +881,6 @@ declare namespace Anchor {
     };
 }
 
-interface ArrowProps extends BaseProps {
-    /**
-     * Size of icon
-     */
-    size?: 'xs' | 'm' | 'l';
-    /**
-     * Direction arrow
-     */
-    top?: boolean;
-    /**
-     * Direction arrow
-     */
-    right?: boolean;
-    /**
-     * Direction arrow
-     */
-    bottom?: boolean;
-    /**
-     * Direction arrow
-     */
-    left?: boolean;
-    inverse?: boolean;
-    outline?: boolean;
-    disabled?: boolean;
-    onClick?(event: React.MouseEvent<HTMLButtonElement>): void;
-}
-/**
- * Расширен:
- * - [`BaseProps`](#/Миксины)
- */
-declare class Arrow extends PureComponent<ArrowProps> {
-    static displayName: string;
-    static defaultProps: {
-        size: string;
-        top: boolean;
-        right: boolean;
-        bottom: boolean;
-        left: boolean;
-        inverse: boolean;
-        outline: boolean;
-        disabled: boolean;
-        onClick: () => void;
-    };
-    onClickHandler: (event: React.MouseEvent<HTMLButtonElement>) => void;
-    render(): JSX.Element;
-}
-
 interface AvatarProps extends BaseProps, Color {
     /**
      * Children react node
@@ -2570,4 +2578,4 @@ declare namespace Select {
     var displayName: string;
 }
 
-export { ActionBtn, Amount, Anchor, Arrow, Avatar, Badge, BaseProps, Button, COUNTRY_DATA, CURRENCY_MAP, Checkbox, ColorNames, Container, ContextMenu, CurrencyCodes, DEFAULT_MASK, HEX, INITIAL_MASK, Icon, Input, InputField, Modal, Paper, Progress, RGB, RGBA, Radio, withThemeScrollable as Scrollable, Section, Select, Separator, Spacer, Spinner, Switcher, Tabs, Tag, Text, Textarea, Theme, ThemeProvider, Tooltip, Tooltiped, baseInputStyle, buildMediaQuery, color, defaultIcons, desktopFirst, mobileFirst, property, responsiveNamedProperty, responsiveProperty, screenL, screenM, screenMaxL, screenMaxM, screenMaxS, screenMaxXl, screenMaxXs, screenMaxXxs, screenMinL, screenMinM, screenMinS, screenMinXl, screenMinXs, screenRetina, screenS, screenXl, screenXs, theme, vAlign };
+export { ActionBtn, Amount, Anchor, Arrow, Avatar, Badge, BaseProps, Button, COUNTRY_DATA, CURRENCY_MAP, Checkbox, ColorNames, ComponentContext, Container, ContextMenu, CurrencyCodes, DEFAULT_MASK, HEX, INITIAL_MASK, Icon, Input, InputField, Modal, Paper, Progress, RGB, RGBA, Radio, withThemeScrollable as Scrollable, Section, Select, Separator, Spacer, Spinner, Switcher, Tabs, Tag, Text, Textarea, Theme, ThemeMode, ThemePreset, ThemeProvider, Tooltip, Tooltiped, adultDarkTheme, adultLightTheme, babyDarkTheme, babyLightTheme, baseInputStyle, buildMediaQuery, color, defaultIcons, desktopFirst, mobileFirst, motherDarkTheme, motherLightTheme, property, responsiveNamedProperty, responsiveProperty, screenL, screenM, screenMaxL, screenMaxM, screenMaxS, screenMaxXl, screenMaxXs, screenMaxXxs, screenMinL, screenMinM, screenMinS, screenMinXl, screenMinXs, screenRetina, screenS, screenXl, screenXs, teenDarkTheme, teenLightTheme, defaultTheme as theme, vAlign };

package/hooks/use-theme.js

@@ -0,0 +1,2 @@
+import{useTheme as e}from'styled-components';import{defaultTheme as t}from'../theme/themes.js';function m(){var m=e();return'object'==typeof m&&null!==m&&Object.keys(m).length>0?m:t}export{m as useFallbackTheme};
+//# sourceMappingURL=use-theme.js.map

package/hooks/use-theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-theme.js","sources":["../../../src/hooks/use-theme.ts"],"sourcesContent":["import { useTheme } from 'styled-components'\nimport type { DefaultTheme } from 'styled-components'\nimport { defaultTheme } from '../theme/themes'\n\nexport function useFallbackTheme(): DefaultTheme {\n  const contextTheme = useTheme()\n\n  const shouldForwardTheme =\n    typeof contextTheme === 'object' && contextTheme !== null && Object.keys(contextTheme).length > 0\n\n  return shouldForwardTheme ? contextTheme : defaultTheme\n}\n"],"names":["useFallbackTheme","contextTheme","useTheme","Object","keys","length","defaultTheme"],"mappings":"+FAIO,SAASA,IACd,IAAMC,EAAeC,IAKrB,MAF0B,iBAAjBD,GAA8C,OAAjBA,GAAyBE,OAAOC,KAAKH,GAAcI,OAAS,EAEtEJ,EAAeK"}