@foxford/ui 2.118.1 → 2.119.0-beta-3939fb6-20260713

package/components/Button/Button.mjs

@@ -1,2 +1,2 @@
-import{forwardRef}from'react';import{useTheme}from'styled-components';import{useClassname}from'../../hooks/useClassname.mjs';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{useComputedRel,useComputedLinkProps}from'./hooks.mjs';import{SIZES,SIZES_ROUND,SIZES_TEXT,SIZES_ICON}from'./sizes.mjs';import{SIZES_DEFAULT,SIZES_ROUND_DEFAULT,PROPS_BY_SIZE,SIZES_TEXT_DEFAULT}from'./sizes-default.mjs';import{Root,ContentWithStatus,IconAnimation,Content}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{Text}from'../Text/Text.mjs';import{Icon}from'../Icon/Icon.mjs';import{CheckFill}from'../../icon-pack/src/icons/CheckFill/index.mjs';import{LoaderFill}from'../../icon-pack/src/icons/LoaderFill/index.mjs';const COMPONENT_NAME='Button';const Button=withMergedProps(forwardRef((e,o)=>{let{size:s="m",inline:t=!0,rounded:n=!0,color:r="accent",fontColor:i="white",showContentOnStatus:c,textProps:a={},iconProps:l={},leftIconProps:m={},rightIconProps:p={},as:d,sizeXXS:S,sizeXS:u,sizeS:f,sizeM:E,sizeL:I,sizeXL:h,className:j,children:_,content:x,fontWeight:C,icon:T,innerRef:z,...N}=e;const Z=useTheme();N.preset!=='default'||typeof s!='string'||N.round||(N={...PROPS_BY_SIZE[s]??{},...N}),N.href&&(d='a'),N.to&&(d=Z.link),N.disabled&&(d='button'),N.primary&&(r='primary'),N.secondary&&(r='atlantis');const P=useClassname("Button",j);const g=useClassname("Button");const y=useComputedRel(Z,N);const L=useComputedLinkProps(d,N);let[F,O]=Array.isArray(T)?T:[T];const R={size:s,sizeXXS:S,sizeXS:u,sizeS:f,sizeM:E,sizeL:I,sizeXL:h};const A={...R,as:'span',color:'inherit',weight:C??(N.preset==='brand'?800:600),lineHeight:N.preset==='brand'?1.2:1,sizes:N.preset==='brand'?SIZES_TEXT:SIZES_TEXT_DEFAULT};const X={...R,color:'inherit',preset:N.preset,sizes:SIZES_ICON};const D=N.preset==='brand'&&N.success;const U=N.preset==='brand'&&N.loading;const k=typeof _!='function'&&(_||x)?jsx(Text,{className:`${g}__content`,...A,...a,children:_||x}):null;return jsx(Root,{...N,...L,...R,inline:t,color:r,fontColor:i,rounded:n,rel:y,as:d,className:P,ref:o??z,children:typeof _=='function'?_({textProps:A,iconProps:X}):jsxs(Fragment,{children:[D||U?jsxs(ContentWithStatus,{children:[D?jsx(Icon,{...X,...l,icon:jsx(CheckFill,{})}):jsx(IconAnimation,{children:jsx(Icon,{...X,...l,icon:jsx(LoaderFill,{})})}),c?k:null]}):null,jsxs(Content,{"aria-hidden":D||U,children:[F?jsx(Icon,{className:"icon",name:typeof F=='string'?F:void 0,icon:typeof F!='string'?F:void 0,...X,...l,...m}):null,k,O?jsx(Icon,{className:"icon",name:typeof O=='string'?O:void 0,icon:typeof O!='string'?O:void 0,...X,...l,...p}):null]})]})})}),{displayName:"Button",sizes:e=>{let o=e.preset==='brand'?SIZES:SIZES_DEFAULT;return e.round&&(o=e.preset==='brand'?SIZES_ROUND:SIZES_ROUND_DEFAULT),o}});export{Button,COMPONENT_NAME,SIZES,SIZES_ROUND};
+import{forwardRef}from'react';import{useTheme}from'styled-components';import{useClassname}from'../../hooks/useClassname.mjs';import{deepmerge}from'../../shared/utils/misc.mjs';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{useComputedRel,useComputedLinkProps}from'./hooks.mjs';import{SIZES,SIZES_ROUND,SIZES_TEXT,SIZES_ICON}from'./sizes.mjs';import{SIZES_DEFAULT,SIZES_ROUND_DEFAULT,PROPS_BY_SIZE,SIZES_TEXT_DEFAULT}from'./sizes-default.mjs';import{Root,ContentWithStatus,IconAnimation,Content}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{Text}from'../Text/Text.mjs';import{Icon}from'../Icon/Icon.mjs';import{CheckFill}from'../../icon-pack/src/icons/CheckFill/index.mjs';import{LoaderFill}from'../../icon-pack/src/icons/LoaderFill/index.mjs';const COMPONENT_NAME='Button';const Button=withMergedProps(forwardRef((e,s)=>{let{size:o="m",inline:t=!0,rounded:n=!0,color:r="accent",fontColor:i="white",showContentOnStatus:c,textProps:m={},iconProps:a={},leftIconProps:l={},rightIconProps:p={},textSizes:d={},iconSizes:S={},as:u,sizeXXS:f,sizeXS:E,sizeS:h,sizeM:I,sizeL:j,sizeXL:x,className:_,children:C,content:T,fontWeight:z,icon:N,innerRef:g,...Z}=e;const P=useTheme();Z.preset!=='default'||typeof o!='string'||Z.round||(Z={...PROPS_BY_SIZE[o]??{},...Z}),Z.href&&(u='a'),Z.to&&(u=P.link),Z.disabled&&(u='button'),Z.primary&&(r='primary'),Z.secondary&&(r='atlantis');const y=useClassname("Button",_);const L=useClassname("Button");const F=useComputedRel(P,Z);const O=useComputedLinkProps(u,Z);let[R,A]=Array.isArray(N)?N:[N];const X={size:o,sizeXXS:f,sizeXS:E,sizeS:h,sizeM:I,sizeL:j,sizeXL:x};const D={...X,as:'span',color:'inherit',weight:z??(Z.preset==='brand'?800:600),lineHeight:Z.preset==='brand'?1.2:1,sizes:deepmerge(Z.preset==='brand'?SIZES_TEXT:SIZES_TEXT_DEFAULT,d)};const U={...X,color:'inherit',preset:Z.preset,sizes:deepmerge(SIZES_ICON,S)};const k=Z.preset==='brand'&&Z.success;const b=Z.preset==='brand'&&Z.loading;const M=typeof C!='function'&&(C||T)?jsx(Text,{className:`${L}__content`,...D,...m,children:C||T}):null;return jsx(Root,{...Z,...O,...X,inline:t,color:r,fontColor:i,rounded:n,rel:F,as:u,className:y,ref:s??g,children:typeof C=='function'?C({textProps:D,iconProps:U}):jsxs(Fragment,{children:[k||b?jsxs(ContentWithStatus,{children:[k?jsx(Icon,{...U,...a,icon:jsx(CheckFill,{})}):jsx(IconAnimation,{children:jsx(Icon,{...U,...a,icon:jsx(LoaderFill,{})})}),c?M:null]}):null,jsxs(Content,{"aria-hidden":k||b,children:[R?jsx(Icon,{className:"icon",name:typeof R=='string'?R:void 0,icon:typeof R!='string'?R:void 0,...U,...a,...l}):null,M,A?jsx(Icon,{className:"icon",name:typeof A=='string'?A:void 0,icon:typeof A!='string'?A:void 0,...U,...a,...p}):null]})]})})}),{displayName:"Button",sizes:e=>{let s=e.preset==='brand'?SIZES:SIZES_DEFAULT;return e.round&&(s=e.preset==='brand'?SIZES_ROUND:SIZES_ROUND_DEFAULT),s}});export{Button,COMPONENT_NAME,SIZES,SIZES_ROUND};
 //# sourceMappingURL=Button.mjs.map

package/components/Button/Button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Button.mjs","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["/* eslint-disable prefer-const */\nimport { forwardRef } from 'react'\nimport { useTheme } from 'styled-components'\nimport { CheckFill, LoaderFill } from '@foxford/icon-pack'\nimport { useClassname } from 'hooks/useClassname'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { Text } from 'components/Text'\nimport type { IconProps } from 'components/Icon'\nimport type { TextProps } from 'components/Text'\nimport { useComputedRel, useComputedLinkProps } from './hooks'\nimport { SIZES, SIZES_ROUND, SIZES_ICON, SIZES_TEXT } from './sizes'\nimport { SIZES_DEFAULT, SIZES_ROUND_DEFAULT, PROPS_BY_SIZE, SIZES_TEXT_DEFAULT } from './sizes-default'\nimport type { ButtonProps, Size } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Button'\n\n/**\n *\n * Контрол многоцелевого назначения.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<button\\> элемента.\n */\nconst Button: React.ForwardRefExoticComponent<ButtonProps> = withMergedProps<ButtonProps, HTMLButtonElement>(\n  forwardRef<HTMLButtonElement, MergedProps<ButtonProps>>((props, ref) => {\n    let {\n      size = 'm',\n      inline = true,\n      rounded = true,\n      color = 'accent',\n      fontColor = 'white',\n      showContentOnStatus,\n      textProps: textPropsProp = {},\n      iconProps: iconPropsProp = {},\n      leftIconProps = {},\n      rightIconProps = {},\n      as: _as,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      className,\n      children,\n      content,\n      fontWeight,\n      icon,\n      innerRef,\n      ...restProps\n    } = props\n\n    const theme = useTheme()\n\n    if (restProps.preset === 'default' && typeof size === 'string' && !restProps.round) {\n      const propsBySize = PROPS_BY_SIZE[size as Size] ?? {}\n      restProps = { ...propsBySize, ...restProps }\n    }\n\n    if (restProps.href) _as = 'a'\n    if (restProps.to) _as = theme.link\n    if (restProps.disabled) _as = 'button'\n\n    if (restProps.primary) color = 'primary'\n    if (restProps.secondary) color = 'atlantis'\n\n    const rootClassName = useClassname(COMPONENT_NAME, className)\n    const textClassName = useClassname(COMPONENT_NAME)\n    const rel = useComputedRel(theme, restProps)\n    const linkProps = useComputedLinkProps(_as, restProps)\n\n    let [before, after] = Array.isArray(icon) ? icon : [icon]\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const textProps: TextProps = {\n      ...sizeProps,\n      as: 'span',\n      color: 'inherit',\n      weight: fontWeight ?? (restProps.preset === 'brand' ? 800 : 600),\n      lineHeight: restProps.preset === 'brand' ? 1.2 : 1,\n      sizes: restProps.preset === 'brand' ? SIZES_TEXT : SIZES_TEXT_DEFAULT,\n    }\n\n    const iconProps: IconProps = {\n      ...sizeProps,\n      color: 'inherit',\n      preset: restProps.preset,\n      sizes: SIZES_ICON,\n    }\n\n    const success = restProps.preset === 'brand' && restProps.success\n    const loading = restProps.preset === 'brand' && restProps.loading\n\n    const mainContent =\n      typeof children !== 'function' && (children || content) ? (\n        <Text className={`${textClassName}__content`} {...textProps} {...textPropsProp}>\n          {children || content}\n        </Text>\n      ) : null\n\n    return (\n      <Styled.Root\n        {...restProps}\n        {...linkProps}\n        {...sizeProps}\n        inline={inline}\n        color={color}\n        fontColor={fontColor}\n        rounded={rounded}\n        rel={rel}\n        as={_as}\n        className={rootClassName}\n        ref={ref ?? innerRef}\n      >\n        {typeof children === 'function' ? (\n          children({ textProps, iconProps })\n        ) : (\n          <>\n            {success || loading ? (\n              <Styled.ContentWithStatus>\n                {success ? (\n                  <Icon {...iconProps} {...iconPropsProp} icon={<CheckFill />} />\n                ) : (\n                  <Styled.IconAnimation>\n                    <Icon {...iconProps} {...iconPropsProp} icon={<LoaderFill />} />\n                  </Styled.IconAnimation>\n                )}\n                {showContentOnStatus ? mainContent : null}\n              </Styled.ContentWithStatus>\n            ) : null}\n            <Styled.Content aria-hidden={success || loading}>\n              {before ? (\n                <Icon\n                  className='icon'\n                  name={typeof before === 'string' ? before : undefined}\n                  icon={typeof before !== 'string' ? before : undefined}\n                  {...iconProps}\n                  {...iconPropsProp}\n                  {...leftIconProps}\n                />\n              ) : null}\n              {mainContent}\n              {after ? (\n                <Icon\n                  className='icon'\n                  name={typeof after === 'string' ? after : undefined}\n                  icon={typeof after !== 'string' ? after : undefined}\n                  {...iconProps}\n                  {...iconPropsProp}\n                  {...rightIconProps}\n                />\n              ) : null}\n            </Styled.Content>\n          </>\n        )}\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: (props) => {\n      let sizes = props.preset === 'brand' ? SIZES : SIZES_DEFAULT\n      if (props.round) sizes = props.preset === 'brand' ? SIZES_ROUND : SIZES_ROUND_DEFAULT\n\n      return sizes\n    },\n  }\n)\n\nexport { Button, COMPONENT_NAME, SIZES, SIZES_ROUND }\n\nexport type { ButtonProps }\n"],"names":["COMPONENT_NAME","Button","withMergedProps","forwardRef","props","ref","size","inline","rounded","color","fontColor","showContentOnStatus","textProps","textPropsProp","iconProps","iconPropsProp","leftIconProps","rightIconProps","as","_as","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","className","children","content","fontWeight","icon","innerRef","restProps","theme","useTheme","preset","round","PROPS_BY_SIZE","href","to","link","disabled","primary","secondary","rootClassName","useClassname","textClassName","rel","useComputedRel","linkProps","useComputedLinkProps","before","after","Array","isArray","sizeProps","weight","lineHeight","sizes","SIZES_TEXT","SIZES_TEXT_DEFAULT","SIZES_ICON","success","loading","mainContent","_jsx","Text","Styled","_jsxs","_Fragment","Icon","CheckFill","LoaderFill","name","undefined","displayName","SIZES","SIZES_DEFAULT","SIZES_ROUND","SIZES_ROUND_DEFAULT"],"mappings":"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"}
+{"version":3,"file":"Button.mjs","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["/* eslint-disable prefer-const */\nimport { forwardRef } from 'react'\nimport { useTheme } from 'styled-components'\nimport { CheckFill, LoaderFill } from '@foxford/icon-pack'\nimport { useClassname } from 'hooks/useClassname'\nimport { deepmerge } from 'shared/utils/misc'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { Text } from 'components/Text'\nimport type { IconProps } from 'components/Icon'\nimport type { TextProps } from 'components/Text'\nimport { useComputedRel, useComputedLinkProps } from './hooks'\nimport { SIZES, SIZES_ROUND, SIZES_ICON, SIZES_TEXT } from './sizes'\nimport { SIZES_DEFAULT, SIZES_ROUND_DEFAULT, PROPS_BY_SIZE, SIZES_TEXT_DEFAULT } from './sizes-default'\nimport type { ButtonProps, Size } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Button'\n\n/**\n *\n * Контрол многоцелевого назначения.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<button\\> элемента.\n */\nconst Button: React.ForwardRefExoticComponent<ButtonProps> = withMergedProps<ButtonProps, HTMLButtonElement>(\n  forwardRef<HTMLButtonElement, MergedProps<ButtonProps>>((props, ref) => {\n    let {\n      size = 'm',\n      inline = true,\n      rounded = true,\n      color = 'accent',\n      fontColor = 'white',\n      showContentOnStatus,\n      textProps: textPropsProp = {},\n      iconProps: iconPropsProp = {},\n      leftIconProps = {},\n      rightIconProps = {},\n      textSizes = {},\n      iconSizes = {},\n      as: _as,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      className,\n      children,\n      content,\n      fontWeight,\n      icon,\n      innerRef,\n      ...restProps\n    } = props\n\n    const theme = useTheme()\n\n    if (restProps.preset === 'default' && typeof size === 'string' && !restProps.round) {\n      const propsBySize = PROPS_BY_SIZE[size as Size] ?? {}\n      restProps = { ...propsBySize, ...restProps }\n    }\n\n    if (restProps.href) _as = 'a'\n    if (restProps.to) _as = theme.link\n    if (restProps.disabled) _as = 'button'\n\n    if (restProps.primary) color = 'primary'\n    if (restProps.secondary) color = 'atlantis'\n\n    const rootClassName = useClassname(COMPONENT_NAME, className)\n    const textClassName = useClassname(COMPONENT_NAME)\n    const rel = useComputedRel(theme, restProps)\n    const linkProps = useComputedLinkProps(_as, restProps)\n\n    let [before, after] = Array.isArray(icon) ? icon : [icon]\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const textProps: TextProps = {\n      ...sizeProps,\n      as: 'span',\n      color: 'inherit',\n      weight: fontWeight ?? (restProps.preset === 'brand' ? 800 : 600),\n      lineHeight: restProps.preset === 'brand' ? 1.2 : 1,\n      sizes: deepmerge(restProps.preset === 'brand' ? SIZES_TEXT : SIZES_TEXT_DEFAULT, textSizes),\n    }\n\n    const iconProps: IconProps = {\n      ...sizeProps,\n      color: 'inherit',\n      preset: restProps.preset,\n      sizes: deepmerge(SIZES_ICON, iconSizes),\n    }\n\n    const success = restProps.preset === 'brand' && restProps.success\n    const loading = restProps.preset === 'brand' && restProps.loading\n\n    const mainContent =\n      typeof children !== 'function' && (children || content) ? (\n        <Text className={`${textClassName}__content`} {...textProps} {...textPropsProp}>\n          {children || content}\n        </Text>\n      ) : null\n\n    return (\n      <Styled.Root\n        {...restProps}\n        {...linkProps}\n        {...sizeProps}\n        inline={inline}\n        color={color}\n        fontColor={fontColor}\n        rounded={rounded}\n        rel={rel}\n        as={_as}\n        className={rootClassName}\n        ref={ref ?? innerRef}\n      >\n        {typeof children === 'function' ? (\n          children({ textProps, iconProps })\n        ) : (\n          <>\n            {success || loading ? (\n              <Styled.ContentWithStatus>\n                {success ? (\n                  <Icon {...iconProps} {...iconPropsProp} icon={<CheckFill />} />\n                ) : (\n                  <Styled.IconAnimation>\n                    <Icon {...iconProps} {...iconPropsProp} icon={<LoaderFill />} />\n                  </Styled.IconAnimation>\n                )}\n                {showContentOnStatus ? mainContent : null}\n              </Styled.ContentWithStatus>\n            ) : null}\n            <Styled.Content aria-hidden={success || loading}>\n              {before ? (\n                <Icon\n                  className='icon'\n                  name={typeof before === 'string' ? before : undefined}\n                  icon={typeof before !== 'string' ? before : undefined}\n                  {...iconProps}\n                  {...iconPropsProp}\n                  {...leftIconProps}\n                />\n              ) : null}\n              {mainContent}\n              {after ? (\n                <Icon\n                  className='icon'\n                  name={typeof after === 'string' ? after : undefined}\n                  icon={typeof after !== 'string' ? after : undefined}\n                  {...iconProps}\n                  {...iconPropsProp}\n                  {...rightIconProps}\n                />\n              ) : null}\n            </Styled.Content>\n          </>\n        )}\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: (props) => {\n      let sizes = props.preset === 'brand' ? SIZES : SIZES_DEFAULT\n      if (props.round) sizes = props.preset === 'brand' ? SIZES_ROUND : SIZES_ROUND_DEFAULT\n\n      return sizes\n    },\n  }\n)\n\nexport { Button, COMPONENT_NAME, SIZES, SIZES_ROUND }\n\nexport type { ButtonProps }\n"],"names":["COMPONENT_NAME","Button","withMergedProps","forwardRef","props","ref","size","inline","rounded","color","fontColor","showContentOnStatus","textProps","textPropsProp","iconProps","iconPropsProp","leftIconProps","rightIconProps","textSizes","iconSizes","as","_as","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","className","children","content","fontWeight","icon","innerRef","restProps","theme","useTheme","preset","round","PROPS_BY_SIZE","href","to","link","disabled","primary","secondary","rootClassName","useClassname","textClassName","rel","useComputedRel","linkProps","useComputedLinkProps","before","after","Array","isArray","sizeProps","weight","lineHeight","sizes","deepmerge","SIZES_TEXT","SIZES_TEXT_DEFAULT","SIZES_ICON","success","loading","mainContent","_jsx","Text","Styled","_jsxs","_Fragment","Icon","CheckFill","LoaderFill","name","undefined","displayName","SIZES","SIZES_DEFAULT","SIZES_ROUND","SIZES_ROUND_DEFAULT"],"mappings":"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"}

package/components/DialogComponent/DialogComponent.js

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var useScrollThresholds=require('../../hooks/useScrollThresholds.js');var constants=require('../../shared/constants.js');var dom=require('../../shared/utils/dom.js');var useScrollLock=require('../../hooks/useScrollLock.js');var dragging=require('./images/dragging.svg.js');var style=require('./style.js');var sizes=require('./sizes.js');var layouts=require('./layouts.js');var Header=require('./Header.js');var jsxRuntime=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');var AspectRatio=require('../AspectRatio/AspectRatio.js');var Skeleton=require('../Skeleton/Skeleton.js');var Text=require('../Text/Text.js');var index=require('../../icon-pack/src/icons/Close/index.js');const DialogComponent=withMergedProps.withMergedProps(React.forwardRef((e,s)=>{const{size:t="s",layout:o="vertical",scrollable:n=!1,scrollFading:i=!1,sizeXXS:r,sizeXS:l,sizeS:a,sizeM:c,sizeL:u,sizeXL:d,layoutXXS:x,layoutXS:j,layoutS:m,layoutM:y,layoutL:R,layoutXL:S,root:g,floats:p,media:h,body:I,header:T,caption:z,title:A,subtitle:k,children:E,footer:L,closeButton:b,progressLine:C,fancy:v,imgSrcVertical:P,imgSrcHorizontal:_,draggable:w,loading:N,stickyHeader:f,className:O,backgroundClassName:B,onGrab:D,onNudge:q,...X}=e;const H={size:t,sizeXXS:r,sizeXS:l,sizeS:a,sizeM:c,sizeL:u,sizeXL:d};const Y={layout:o,layoutXXS:x,layoutXS:j,layoutS:m,layoutM:y,layoutL:R,layoutXL:S};const Z={...H,appearance:'body',color:'content-onmain-tertiary',wordBreak:'break-word',marginBottom:'0.8em',sizes:sizes.SIZES_CAPTION};const M={...H,as:'h2',appearance:'heading',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.5em',sizes:sizes.SIZES_TITLE};const V={...H,as:'p',appearance:'body',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.8em',sizes:sizes.SIZES_SUBTITLE};const F=v?{icon:jsxRuntime.jsx(index.Close,{}),size:'xxl',secondary:!0}:{icon:jsxRuntime.jsx(index.Close,{}),size:'l',marginTop:8,marginRight:8};const U={size:'xs'};const K=v?O:dom.concatClassNames(O,B);const G=n&&i;const[J,Q]=React.useState(null);const{scrollThresholds:W,setScrollThresholds:$}=useScrollThresholds.useScrollThresholds({enabled:G,target:J});return useScrollLock.useScrollLock({locked:!n,target:J}),jsxRuntime.jsxs(style.Root,{...X,...H,...Y,layouts:v?layouts.LAYOUTS_FANCY:layouts.LAYOUTS,className:K,fancy:v,ref:s,children:[v?jsxRuntime.jsx(style.FancyBackground,{className:B}):null,React.isValidElement(g)?g:typeof g=='function'?g({captionProps:Z,titleProps:M,subtitleProps:V,closeButtonProps:F,progressLineProps:U,onGrab:D,onNudge:q}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[p,w?jsxRuntime.jsx(style.DraggingHandle,{...Y,layouts:layouts.VISIBILITY_VERTICAL,onPointerDown:D,children:jsxRuntime.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:q,children:jsxRuntime.jsx(Icon.Icon,{icon:jsxRuntime.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary"})})}):null,b?jsxRuntime.jsx(style.ButtonPosition,{children:React.isValidElement(b)?b:typeof b=='function'?b(F):null}):null,N||h||P?jsxRuntime.jsx(style.Media,{...Y,layouts:v?layouts.LAYOUTS_FANCY_MEDIA_VERTICAL:layouts.LAYOUTS_MEDIA_VERTICAL,children:N?jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"3:1",width:"100%",children:jsxRuntime.jsx(Skeleton.Skeleton,{borderRadius:0})}):React.isValidElement(h)?h:jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"3:1",width:"100%",children:jsxRuntime.jsx(style.Img,{src:P})})}):null,N||h||_?jsxRuntime.jsx(style.Media,{...Y,layouts:layouts.LAYOUTS_MEDIA_HORIZONTAL,children:N?jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"5:7",height:"100%",children:jsxRuntime.jsx(Skeleton.Skeleton,{borderRadius:0})}):React.isValidElement(h)?h:jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"5:7",height:"100%",children:jsxRuntime.jsx(style.Img,{src:_})})}):null,jsxRuntime.jsxs(style.Body,{children:[C&&!N?jsxRuntime.jsx(style.ProgressPosition,{...Y,layouts:v?layouts.LAYOUTS_FANCY_PROGRESS:layouts.LAYOUTS_PROGRESS,children:React.isValidElement(C)?C:typeof C=='function'?C(U):null}):null,w?jsxRuntime.jsx(style.DraggingHandle,{...Y,layouts:layouts.VISIBILITY_HORIZONTAL,onPointerDown:D,children:jsxRuntime.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:q,children:jsxRuntime.jsx(Icon.Icon,{icon:jsxRuntime.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary"})})}):null,v?jsxRuntime.jsx(style.LayoutSpacer,{...Y,layouts:layouts.VISIBILITY_HORIZONTAL,paddingTop:76}):null,N?jsxRuntime.jsx(style.Container,{...H,sizes:sizes.SIZES_CONTAINER,children:jsxRuntime.jsxs(style.Content,{...H,sizes:sizes.SIZES_CONTENT,children:[jsxRuntime.jsx(Skeleton.Skeleton,{children:jsxRuntime.jsx(Text.Text,{...M,marginBottom:"1.5em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"90%",children:jsxRuntime.jsx(Text.Text,{...V,marginBottom:"0.4em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"70%",children:jsxRuntime.jsx(Text.Text,{...V,marginBottom:"0.4em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"50%",children:jsxRuntime.jsx(Text.Text,{...V,marginBottom:"0.8em"})})]})}):React.isValidElement(I)?I:typeof I=='function'?I({captionProps:Z,titleProps:M,subtitleProps:V}):jsxRuntime.jsxs(style.Container,{...H,sizes:sizes.SIZES_CONTAINER,children:[f?jsxRuntime.jsx(style.StickyHeader,{...H,sizes:sizes.SIZES_STICKY_HEADER,children:jsxRuntime.jsx(Header.Header,{header:T,caption:z,title:A,subtitle:k,captionProps:Z,titleProps:M,subtitleProps:V})}):null,G?jsxRuntime.jsx(style.Fading,{visible:W.top===!1}):null,jsxRuntime.jsx(style.ContentScrollArea,{ref:Q,scrollable:n,tabIndex:n?0:void 0,onScroll:e=>{G&&$(e.currentTarget)},onKeyDown:e=>{constants.keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):constants.keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:jsxRuntime.jsxs(style.Content,{...H,sizes:sizes.SIZES_CONTENT,children:[f?null:jsxRuntime.jsx(Header.Header,{header:T,caption:z,title:A,subtitle:k,captionProps:Z,titleProps:M,subtitleProps:V}),E]})}),G?jsxRuntime.jsx(style.Fading,{visible:W.bottom===!1,after:!0}):null,L?jsxRuntime.jsx(style.Footer,{...H,sizes:sizes.SIZES_FOOTER,children:L}):null]})]})]})]})}),{sizes:e=>e.fancy?sizes.SIZES_FANCY:sizes.SIZES,displayName:'DialogComponent'});exports.DialogComponent=DialogComponent;
+'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var useScrollThresholds=require('../../hooks/useScrollThresholds.js');var constants=require('../../shared/constants.js');var dom=require('../../shared/utils/dom.js');var useScrollLock=require('../../hooks/useScrollLock.js');var dragging=require('./images/dragging.svg.js');var style=require('./style.js');var sizes=require('./sizes.js');var layouts=require('./layouts.js');var Header=require('./Header.js');var jsxRuntime=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');var AspectRatio=require('../AspectRatio/AspectRatio.js');var Skeleton=require('../Skeleton/Skeleton.js');var Text=require('../Text/Text.js');var index=require('../../icon-pack/src/icons/Close/index.js');const DialogComponent=withMergedProps.withMergedProps(React.forwardRef((e,s)=>{const{size:t="s",layout:o="vertical",scrollable:i=!1,scrollFading:n=!1,sizeXXS:r,sizeXS:l,sizeS:a,sizeM:c,sizeL:u,sizeXL:d,layoutXXS:x,layoutXS:j,layoutS:m,layoutM:y,layoutL:R,layoutXL:S,root:g,floats:p,media:h,body:I,header:T,caption:z,title:A,subtitle:k,children:E,footer:L,closeButton:b,progressLine:C,fancy:v,imgSrcVertical:P,imgSrcHorizontal:_,draggable:w,loading:N,stickyHeader:f,className:O,backgroundClassName:B,onGrab:D,onNudge:q,...X}=e;const H={size:t,sizeXXS:r,sizeXS:l,sizeS:a,sizeM:c,sizeL:u,sizeXL:d};const Y={layout:o,layoutXXS:x,layoutXS:j,layoutS:m,layoutM:y,layoutL:R,layoutXL:S};const Z={...H,appearance:'body',color:'content-onmain-tertiary',wordBreak:'break-word',marginBottom:'0.8em',sizes:sizes.SIZES_CAPTION};const M={...H,as:'h2',appearance:'heading',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.5em',sizes:sizes.SIZES_TITLE};const V={...H,as:'p',appearance:'body',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.8em',sizes:sizes.SIZES_SUBTITLE};const F=v?{icon:jsxRuntime.jsx(index.Close,{}),size:'xxl',filled:!0}:{icon:jsxRuntime.jsx(index.Close,{}),size:'l',marginTop:8,marginRight:8};const U={size:'xs'};const K=v?O:dom.concatClassNames(O,B);const G=i&&n;const[J,Q]=React.useState(null);const{scrollThresholds:W,setScrollThresholds:$}=useScrollThresholds.useScrollThresholds({enabled:G,target:J});return useScrollLock.useScrollLock({locked:!i,target:J}),jsxRuntime.jsxs(style.Root,{...X,...H,...Y,layouts:v?layouts.LAYOUTS_FANCY:layouts.LAYOUTS,className:K,fancy:v,ref:s,children:[v?jsxRuntime.jsx(style.FancyBackground,{className:B}):null,React.isValidElement(g)?g:typeof g=='function'?g({captionProps:Z,titleProps:M,subtitleProps:V,closeButtonProps:F,progressLineProps:U,onGrab:D,onNudge:q}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[p,w?jsxRuntime.jsx(style.DraggingHandle,{...Y,layouts:layouts.VISIBILITY_VERTICAL,onPointerDown:D,children:jsxRuntime.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:q,children:jsxRuntime.jsx(Icon.Icon,{icon:jsxRuntime.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary"})})}):null,b?jsxRuntime.jsx(style.ButtonPosition,{children:React.isValidElement(b)?b:typeof b=='function'?b(F):null}):null,N||h||P?jsxRuntime.jsx(style.Media,{...Y,layouts:v?layouts.LAYOUTS_FANCY_MEDIA_VERTICAL:layouts.LAYOUTS_MEDIA_VERTICAL,children:N?jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"3:1",width:"100%",children:jsxRuntime.jsx(Skeleton.Skeleton,{borderRadius:0})}):React.isValidElement(h)?h:jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"3:1",width:"100%",children:jsxRuntime.jsx(style.Img,{src:P})})}):null,N||h||_?jsxRuntime.jsx(style.Media,{...Y,layouts:layouts.LAYOUTS_MEDIA_HORIZONTAL,children:N?jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"5:7",height:"100%",children:jsxRuntime.jsx(Skeleton.Skeleton,{borderRadius:0})}):React.isValidElement(h)?h:jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"5:7",height:"100%",children:jsxRuntime.jsx(style.Img,{src:_})})}):null,jsxRuntime.jsxs(style.Body,{children:[C&&!N?jsxRuntime.jsx(style.ProgressPosition,{...Y,layouts:v?layouts.LAYOUTS_FANCY_PROGRESS:layouts.LAYOUTS_PROGRESS,children:React.isValidElement(C)?C:typeof C=='function'?C(U):null}):null,w?jsxRuntime.jsx(style.DraggingHandle,{...Y,layouts:layouts.VISIBILITY_HORIZONTAL,onPointerDown:D,children:jsxRuntime.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:q,children:jsxRuntime.jsx(Icon.Icon,{icon:jsxRuntime.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary"})})}):null,v?jsxRuntime.jsx(style.LayoutSpacer,{...Y,layouts:layouts.VISIBILITY_HORIZONTAL,paddingTop:76}):null,N?jsxRuntime.jsx(style.Container,{...H,sizes:sizes.SIZES_CONTAINER,children:jsxRuntime.jsxs(style.Content,{...H,sizes:sizes.SIZES_CONTENT,children:[jsxRuntime.jsx(Skeleton.Skeleton,{children:jsxRuntime.jsx(Text.Text,{...M,marginBottom:"1.5em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"90%",children:jsxRuntime.jsx(Text.Text,{...V,marginBottom:"0.4em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"70%",children:jsxRuntime.jsx(Text.Text,{...V,marginBottom:"0.4em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"50%",children:jsxRuntime.jsx(Text.Text,{...V,marginBottom:"0.8em"})})]})}):React.isValidElement(I)?I:typeof I=='function'?I({captionProps:Z,titleProps:M,subtitleProps:V}):jsxRuntime.jsxs(style.Container,{...H,sizes:sizes.SIZES_CONTAINER,children:[f?jsxRuntime.jsx(style.StickyHeader,{...H,sizes:sizes.SIZES_STICKY_HEADER,children:jsxRuntime.jsx(Header.Header,{header:T,caption:z,title:A,subtitle:k,captionProps:Z,titleProps:M,subtitleProps:V})}):null,G?jsxRuntime.jsx(style.Fading,{visible:W.top===!1}):null,jsxRuntime.jsx(style.ContentScrollArea,{ref:Q,scrollable:i,tabIndex:i?0:void 0,onScroll:e=>{G&&$(e.currentTarget)},onKeyDown:e=>{constants.keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):constants.keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:jsxRuntime.jsxs(style.Content,{...H,sizes:sizes.SIZES_CONTENT,children:[f?null:jsxRuntime.jsx(Header.Header,{header:T,caption:z,title:A,subtitle:k,captionProps:Z,titleProps:M,subtitleProps:V}),E]})}),G?jsxRuntime.jsx(style.Fading,{visible:W.bottom===!1,after:!0}):null,L?jsxRuntime.jsx(style.Footer,{...H,sizes:sizes.SIZES_FOOTER,children:L}):null]})]})]})]})}),{sizes:e=>e.fancy?sizes.SIZES_FANCY:sizes.SIZES,displayName:'DialogComponent'});exports.DialogComponent=DialogComponent;
 //# sourceMappingURL=DialogComponent.js.map

package/components/DialogComponent/DialogComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogComponent.js","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useState, isValidElement } from 'react'\nimport { Close } from '@foxford/icon-pack'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { useScrollThresholds } from 'hooks/useScrollThresholds'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Skeleton } from 'components/Skeleton'\nimport { AspectRatio } from 'components/AspectRatio'\nimport type { TextProps } from 'components/Text'\nimport type { IconButtonProps } from 'components/IconButton'\nimport type { ProgressLineProps } from 'components/ProgressLine'\nimport { concatClassNames } from 'shared/utils/dom'\nimport { useScrollLock } from 'hooks/useScrollLock'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport {\n  SIZES,\n  SIZES_FANCY,\n  SIZES_CONTAINER,\n  SIZES_CONTENT,\n  SIZES_FOOTER,\n  SIZES_CAPTION,\n  SIZES_TITLE,\n  SIZES_SUBTITLE,\n  SIZES_STICKY_HEADER,\n} from './sizes'\nimport {\n  LAYOUTS,\n  LAYOUTS_FANCY,\n  LAYOUTS_MEDIA_VERTICAL,\n  LAYOUTS_FANCY_MEDIA_VERTICAL,\n  LAYOUTS_MEDIA_HORIZONTAL,\n  LAYOUTS_PROGRESS,\n  LAYOUTS_FANCY_PROGRESS,\n  VISIBILITY_VERTICAL,\n  VISIBILITY_HORIZONTAL,\n} from './layouts'\nimport type { DialogComponentProps } from './types'\nimport { Header } from './Header'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n  DialogComponentProps,\n  HTMLDivElement\n>(\n  forwardRef<HTMLDivElement, MergedProps<DialogComponentProps>>((props, ref) => {\n    const {\n      size = 's',\n      layout = 'vertical',\n      scrollable = false,\n      scrollFading = false,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n      root,\n      floats,\n      media,\n      body,\n      header,\n      caption,\n      title,\n      subtitle,\n      children,\n      footer,\n      closeButton,\n      progressLine,\n      fancy,\n      imgSrcVertical,\n      imgSrcHorizontal,\n      draggable,\n      loading,\n      stickyHeader,\n      className,\n      backgroundClassName,\n      onGrab,\n      onNudge,\n      ...restProps\n    } = props\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const layoutProps = {\n      layout,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n    }\n\n    const captionProps: TextProps = {\n      ...sizeProps,\n      appearance: 'body',\n      color: 'content-onmain-tertiary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_CAPTION,\n    }\n\n    const titleProps: TextProps = {\n      ...sizeProps,\n      as: 'h2',\n      appearance: 'heading',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.5em',\n      sizes: SIZES_TITLE,\n    }\n\n    const subtitleProps: TextProps = {\n      ...sizeProps,\n      as: 'p',\n      appearance: 'body',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_SUBTITLE,\n    }\n\n    const closeButtonProps: IconButtonProps = fancy\n      ? { icon: <Close />, size: 'xxl', secondary: true }\n      : { icon: <Close />, size: 'l', marginTop: 8, marginRight: 8 }\n\n    const progressLineProps: ProgressLineProps = {\n      size: 'xs',\n    }\n\n    const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n    const scrollFadingEnabled = scrollable && scrollFading\n\n    const [contentRef, setContentRef] = useState<HTMLDivElement | null>(null)\n\n    const { scrollThresholds, setScrollThresholds } = useScrollThresholds({\n      enabled: scrollFadingEnabled,\n      target: contentRef,\n    })\n\n    useScrollLock({ locked: !scrollable, target: contentRef })\n\n    return (\n      <Styled.Root\n        {...restProps}\n        {...sizeProps}\n        {...layoutProps}\n        layouts={fancy ? LAYOUTS_FANCY : LAYOUTS}\n        className={rootClassName}\n        fancy={fancy}\n        ref={ref}\n      >\n        {fancy ? <Styled.FancyBackground className={backgroundClassName} /> : null}\n        {isValidElement(root) ? (\n          root\n        ) : typeof root === 'function' ? (\n          root({\n            captionProps,\n            titleProps,\n            subtitleProps,\n            closeButtonProps,\n            progressLineProps,\n            onGrab,\n            onNudge,\n          })\n        ) : (\n          <>\n            {floats}\n            {draggable ? (\n              <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_VERTICAL} onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            ) : null}\n            {closeButton ? (\n              <Styled.ButtonPosition>\n                {isValidElement(closeButton)\n                  ? closeButton\n                  : typeof closeButton === 'function'\n                    ? closeButton(closeButtonProps)\n                    : null}\n              </Styled.ButtonPosition>\n            ) : null}\n            {loading || media || imgSrcVertical ? (\n              <Styled.Media {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_MEDIA_VERTICAL : LAYOUTS_MEDIA_VERTICAL}>\n                {loading ? (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Styled.Img src={imgSrcVertical} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            ) : null}\n            {loading || media || imgSrcHorizontal ? (\n              <Styled.Media {...layoutProps} layouts={LAYOUTS_MEDIA_HORIZONTAL}>\n                {loading ? (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Styled.Img src={imgSrcHorizontal} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            ) : null}\n            <Styled.Body>\n              {progressLine && !loading ? (\n                <Styled.ProgressPosition {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_PROGRESS : LAYOUTS_PROGRESS}>\n                  {isValidElement(progressLine)\n                    ? progressLine\n                    : typeof progressLine === 'function'\n                      ? progressLine(progressLineProps)\n                      : null}\n                </Styled.ProgressPosition>\n              ) : null}\n              {draggable ? (\n                <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_HORIZONTAL} onPointerDown={onGrab}>\n                  <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                    <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                  </Styled.DraggingIconContainer>\n                </Styled.DraggingHandle>\n              ) : null}\n              {fancy ? <Styled.LayoutSpacer {...layoutProps} layouts={VISIBILITY_HORIZONTAL} paddingTop={76} /> : null}\n              {loading ? (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  <Styled.Content {...sizeProps} sizes={SIZES_CONTENT}>\n                    <Skeleton>\n                      <Text {...titleProps} marginBottom='1.5em' />\n                    </Skeleton>\n                    <Skeleton width='90%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='70%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='50%'>\n                      <Text {...subtitleProps} marginBottom='0.8em' />\n                    </Skeleton>\n                  </Styled.Content>\n                </Styled.Container>\n              ) : isValidElement(body) ? (\n                body\n              ) : typeof body === 'function' ? (\n                body({\n                  captionProps,\n                  titleProps,\n                  subtitleProps,\n                })\n              ) : (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  {stickyHeader ? (\n                    <Styled.StickyHeader {...sizeProps} sizes={SIZES_STICKY_HEADER}>\n                      <Header\n                        header={header}\n                        caption={caption}\n                        title={title}\n                        subtitle={subtitle}\n                        captionProps={captionProps}\n                        titleProps={titleProps}\n                        subtitleProps={subtitleProps}\n                      />\n                    </Styled.StickyHeader>\n                  ) : null}\n                  {scrollFadingEnabled ? <Styled.Fading visible={scrollThresholds.top === false} /> : null}\n                  <Styled.ContentScrollArea\n                    ref={setContentRef}\n                    scrollable={scrollable}\n                    tabIndex={scrollable ? 0 : undefined}\n                    onScroll={(evt) => {\n                      if (scrollFadingEnabled) {\n                        setScrollThresholds(evt.currentTarget)\n                      }\n                    }}\n                    onKeyDown={(evt) => {\n                      if (keyboardKeys.ArrowUp.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, -13)\n                      } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, 13)\n                      }\n                    }}\n                  >\n                    <Styled.Content {...sizeProps} sizes={SIZES_CONTENT}>\n                      {!stickyHeader ? (\n                        <Header\n                          header={header}\n                          caption={caption}\n                          title={title}\n                          subtitle={subtitle}\n                          captionProps={captionProps}\n                          titleProps={titleProps}\n                          subtitleProps={subtitleProps}\n                        />\n                      ) : null}\n                      {children}\n                    </Styled.Content>\n                  </Styled.ContentScrollArea>\n                  {scrollFadingEnabled ? <Styled.Fading visible={scrollThresholds.bottom === false} after /> : null}\n                  {footer ? (\n                    <Styled.Footer {...sizeProps} sizes={SIZES_FOOTER}>\n                      {footer}\n                    </Styled.Footer>\n                  ) : null}\n                </Styled.Container>\n              )}\n            </Styled.Body>\n          </>\n        )}\n      </Styled.Root>\n    )\n  }),\n  {\n    sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { DialogComponent }\n"],"names":["DialogComponent","withMergedProps","forwardRef","props","ref","size","layout","scrollable","scrollFading","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","layoutXXS","layoutXS","layoutS","layoutM","layoutL","layoutXL","root","floats","media","body","header","caption","title","subtitle","children","footer","closeButton","progressLine","fancy","imgSrcVertical","imgSrcHorizontal","draggable","loading","stickyHeader","className","backgroundClassName","onGrab","onNudge","restProps","sizeProps","layoutProps","captionProps","appearance","color","wordBreak","marginBottom","sizes","SIZES_CAPTION","titleProps","as","SIZES_TITLE","subtitleProps","SIZES_SUBTITLE","closeButtonProps","icon","_jsx","Close","secondary","marginTop","marginRight","progressLineProps","rootClassName","concatClassNames","scrollFadingEnabled","contentRef","setContentRef","useState","scrollThresholds","setScrollThresholds","useScrollThresholds","enabled","target","useScrollLock","locked","_jsxs","Styled","layouts","LAYOUTS_FANCY","LAYOUTS","isValidElement","_Fragment","VISIBILITY_VERTICAL","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","LAYOUTS_FANCY_MEDIA_VERTICAL","LAYOUTS_MEDIA_VERTICAL","AspectRatio","ratio","width","Skeleton","borderRadius","src","LAYOUTS_MEDIA_HORIZONTAL","height","LAYOUTS_FANCY_PROGRESS","LAYOUTS_PROGRESS","VISIBILITY_HORIZONTAL","paddingTop","SIZES_CONTAINER","SIZES_CONTENT","Text","SIZES_STICKY_HEADER","Header","visible","top","undefined","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","bottom","after","SIZES_FOOTER","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}
+{"version":3,"file":"DialogComponent.js","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useState, isValidElement } from 'react'\nimport { Close } from '@foxford/icon-pack'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { useScrollThresholds } from 'hooks/useScrollThresholds'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Skeleton } from 'components/Skeleton'\nimport { AspectRatio } from 'components/AspectRatio'\nimport type { TextProps } from 'components/Text'\nimport type { IconButtonProps } from 'components/IconButton'\nimport type { ProgressLineProps } from 'components/ProgressLine'\nimport { concatClassNames } from 'shared/utils/dom'\nimport { useScrollLock } from 'hooks/useScrollLock'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport {\n  SIZES,\n  SIZES_FANCY,\n  SIZES_CONTAINER,\n  SIZES_CONTENT,\n  SIZES_FOOTER,\n  SIZES_CAPTION,\n  SIZES_TITLE,\n  SIZES_SUBTITLE,\n  SIZES_STICKY_HEADER,\n} from './sizes'\nimport {\n  LAYOUTS,\n  LAYOUTS_FANCY,\n  LAYOUTS_MEDIA_VERTICAL,\n  LAYOUTS_FANCY_MEDIA_VERTICAL,\n  LAYOUTS_MEDIA_HORIZONTAL,\n  LAYOUTS_PROGRESS,\n  LAYOUTS_FANCY_PROGRESS,\n  VISIBILITY_VERTICAL,\n  VISIBILITY_HORIZONTAL,\n} from './layouts'\nimport type { DialogComponentProps } from './types'\nimport { Header } from './Header'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n  DialogComponentProps,\n  HTMLDivElement\n>(\n  forwardRef<HTMLDivElement, MergedProps<DialogComponentProps>>((props, ref) => {\n    const {\n      size = 's',\n      layout = 'vertical',\n      scrollable = false,\n      scrollFading = false,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n      root,\n      floats,\n      media,\n      body,\n      header,\n      caption,\n      title,\n      subtitle,\n      children,\n      footer,\n      closeButton,\n      progressLine,\n      fancy,\n      imgSrcVertical,\n      imgSrcHorizontal,\n      draggable,\n      loading,\n      stickyHeader,\n      className,\n      backgroundClassName,\n      onGrab,\n      onNudge,\n      ...restProps\n    } = props\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const layoutProps = {\n      layout,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n    }\n\n    const captionProps: TextProps = {\n      ...sizeProps,\n      appearance: 'body',\n      color: 'content-onmain-tertiary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_CAPTION,\n    }\n\n    const titleProps: TextProps = {\n      ...sizeProps,\n      as: 'h2',\n      appearance: 'heading',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.5em',\n      sizes: SIZES_TITLE,\n    }\n\n    const subtitleProps: TextProps = {\n      ...sizeProps,\n      as: 'p',\n      appearance: 'body',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_SUBTITLE,\n    }\n\n    const closeButtonProps: IconButtonProps = fancy\n      ? { icon: <Close />, size: 'xxl', filled: true }\n      : { icon: <Close />, size: 'l', marginTop: 8, marginRight: 8 }\n\n    const progressLineProps: ProgressLineProps = {\n      size: 'xs',\n    }\n\n    const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n    const scrollFadingEnabled = scrollable && scrollFading\n\n    const [contentRef, setContentRef] = useState<HTMLDivElement | null>(null)\n\n    const { scrollThresholds, setScrollThresholds } = useScrollThresholds({\n      enabled: scrollFadingEnabled,\n      target: contentRef,\n    })\n\n    useScrollLock({ locked: !scrollable, target: contentRef })\n\n    return (\n      <Styled.Root\n        {...restProps}\n        {...sizeProps}\n        {...layoutProps}\n        layouts={fancy ? LAYOUTS_FANCY : LAYOUTS}\n        className={rootClassName}\n        fancy={fancy}\n        ref={ref}\n      >\n        {fancy ? <Styled.FancyBackground className={backgroundClassName} /> : null}\n        {isValidElement(root) ? (\n          root\n        ) : typeof root === 'function' ? (\n          root({\n            captionProps,\n            titleProps,\n            subtitleProps,\n            closeButtonProps,\n            progressLineProps,\n            onGrab,\n            onNudge,\n          })\n        ) : (\n          <>\n            {floats}\n            {draggable ? (\n              <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_VERTICAL} onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            ) : null}\n            {closeButton ? (\n              <Styled.ButtonPosition>\n                {isValidElement(closeButton)\n                  ? closeButton\n                  : typeof closeButton === 'function'\n                    ? closeButton(closeButtonProps)\n                    : null}\n              </Styled.ButtonPosition>\n            ) : null}\n            {loading || media || imgSrcVertical ? (\n              <Styled.Media {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_MEDIA_VERTICAL : LAYOUTS_MEDIA_VERTICAL}>\n                {loading ? (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Styled.Img src={imgSrcVertical} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            ) : null}\n            {loading || media || imgSrcHorizontal ? (\n              <Styled.Media {...layoutProps} layouts={LAYOUTS_MEDIA_HORIZONTAL}>\n                {loading ? (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Styled.Img src={imgSrcHorizontal} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            ) : null}\n            <Styled.Body>\n              {progressLine && !loading ? (\n                <Styled.ProgressPosition {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_PROGRESS : LAYOUTS_PROGRESS}>\n                  {isValidElement(progressLine)\n                    ? progressLine\n                    : typeof progressLine === 'function'\n                      ? progressLine(progressLineProps)\n                      : null}\n                </Styled.ProgressPosition>\n              ) : null}\n              {draggable ? (\n                <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_HORIZONTAL} onPointerDown={onGrab}>\n                  <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                    <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                  </Styled.DraggingIconContainer>\n                </Styled.DraggingHandle>\n              ) : null}\n              {fancy ? <Styled.LayoutSpacer {...layoutProps} layouts={VISIBILITY_HORIZONTAL} paddingTop={76} /> : null}\n              {loading ? (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  <Styled.Content {...sizeProps} sizes={SIZES_CONTENT}>\n                    <Skeleton>\n                      <Text {...titleProps} marginBottom='1.5em' />\n                    </Skeleton>\n                    <Skeleton width='90%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='70%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='50%'>\n                      <Text {...subtitleProps} marginBottom='0.8em' />\n                    </Skeleton>\n                  </Styled.Content>\n                </Styled.Container>\n              ) : isValidElement(body) ? (\n                body\n              ) : typeof body === 'function' ? (\n                body({\n                  captionProps,\n                  titleProps,\n                  subtitleProps,\n                })\n              ) : (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  {stickyHeader ? (\n                    <Styled.StickyHeader {...sizeProps} sizes={SIZES_STICKY_HEADER}>\n                      <Header\n                        header={header}\n                        caption={caption}\n                        title={title}\n                        subtitle={subtitle}\n                        captionProps={captionProps}\n                        titleProps={titleProps}\n                        subtitleProps={subtitleProps}\n                      />\n                    </Styled.StickyHeader>\n                  ) : null}\n                  {scrollFadingEnabled ? <Styled.Fading visible={scrollThresholds.top === false} /> : null}\n                  <Styled.ContentScrollArea\n                    ref={setContentRef}\n                    scrollable={scrollable}\n                    tabIndex={scrollable ? 0 : undefined}\n                    onScroll={(evt) => {\n                      if (scrollFadingEnabled) {\n                        setScrollThresholds(evt.currentTarget)\n                      }\n                    }}\n                    onKeyDown={(evt) => {\n                      if (keyboardKeys.ArrowUp.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, -13)\n                      } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, 13)\n                      }\n                    }}\n                  >\n                    <Styled.Content {...sizeProps} sizes={SIZES_CONTENT}>\n                      {!stickyHeader ? (\n                        <Header\n                          header={header}\n                          caption={caption}\n                          title={title}\n                          subtitle={subtitle}\n                          captionProps={captionProps}\n                          titleProps={titleProps}\n                          subtitleProps={subtitleProps}\n                        />\n                      ) : null}\n                      {children}\n                    </Styled.Content>\n                  </Styled.ContentScrollArea>\n                  {scrollFadingEnabled ? <Styled.Fading visible={scrollThresholds.bottom === false} after /> : null}\n                  {footer ? (\n                    <Styled.Footer {...sizeProps} sizes={SIZES_FOOTER}>\n                      {footer}\n                    </Styled.Footer>\n                  ) : null}\n                </Styled.Container>\n              )}\n            </Styled.Body>\n          </>\n        )}\n      </Styled.Root>\n    )\n  }),\n  {\n    sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { DialogComponent }\n"],"names":["DialogComponent","withMergedProps","forwardRef","props","ref","size","layout","scrollable","scrollFading","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","layoutXXS","layoutXS","layoutS","layoutM","layoutL","layoutXL","root","floats","media","body","header","caption","title","subtitle","children","footer","closeButton","progressLine","fancy","imgSrcVertical","imgSrcHorizontal","draggable","loading","stickyHeader","className","backgroundClassName","onGrab","onNudge","restProps","sizeProps","layoutProps","captionProps","appearance","color","wordBreak","marginBottom","sizes","SIZES_CAPTION","titleProps","as","SIZES_TITLE","subtitleProps","SIZES_SUBTITLE","closeButtonProps","icon","_jsx","Close","filled","marginTop","marginRight","progressLineProps","rootClassName","concatClassNames","scrollFadingEnabled","contentRef","setContentRef","useState","scrollThresholds","setScrollThresholds","useScrollThresholds","enabled","target","useScrollLock","locked","_jsxs","Styled","layouts","LAYOUTS_FANCY","LAYOUTS","isValidElement","_Fragment","VISIBILITY_VERTICAL","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","LAYOUTS_FANCY_MEDIA_VERTICAL","LAYOUTS_MEDIA_VERTICAL","AspectRatio","ratio","width","Skeleton","borderRadius","src","LAYOUTS_MEDIA_HORIZONTAL","height","LAYOUTS_FANCY_PROGRESS","LAYOUTS_PROGRESS","VISIBILITY_HORIZONTAL","paddingTop","SIZES_CONTAINER","SIZES_CONTENT","Text","SIZES_STICKY_HEADER","Header","visible","top","undefined","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","bottom","after","SIZES_FOOTER","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}

package/components/DialogComponent/DialogComponent.mjs

@@ -1,2 +1,2 @@
-import{forwardRef,useState,isValidElement}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{useScrollThresholds}from'../../hooks/useScrollThresholds.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{concatClassNames}from'../../shared/utils/dom.mjs';import{useScrollLock}from'../../hooks/useScrollLock.mjs';import SvgDragging from'./images/dragging.svg.mjs';import{Root,FancyBackground,DraggingHandle,DraggingIconContainer,ButtonPosition,Media,Img,Body,ProgressPosition,LayoutSpacer,Container,Content,StickyHeader,Fading,ContentScrollArea,Footer}from'./style.mjs';import{SIZES_SUBTITLE,SIZES_TITLE,SIZES_CAPTION,SIZES_CONTAINER,SIZES_CONTENT,SIZES_STICKY_HEADER,SIZES_FOOTER,SIZES_FANCY,SIZES}from'./sizes.mjs';import{LAYOUTS_FANCY,LAYOUTS,VISIBILITY_VERTICAL,LAYOUTS_FANCY_MEDIA_VERTICAL,LAYOUTS_MEDIA_VERTICAL,LAYOUTS_MEDIA_HORIZONTAL,LAYOUTS_FANCY_PROGRESS,LAYOUTS_PROGRESS,VISIBILITY_HORIZONTAL}from'./layouts.mjs';import{Header}from'./Header.mjs';import{jsxs,jsx,Fragment}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';import{AspectRatio}from'../AspectRatio/AspectRatio.mjs';import{Skeleton}from'../Skeleton/Skeleton.mjs';import{Text}from'../Text/Text.mjs';import{Close}from'../../icon-pack/src/icons/Close/index.mjs';const DialogComponent=withMergedProps(forwardRef((o,e)=>{const{size:t="s",layout:s="vertical",scrollable:r=!1,scrollFading:n=!1,sizeXXS:i,sizeXS:a,sizeS:l,sizeM:c,sizeL:d,sizeXL:S,layoutXXS:m,layoutXS:g,layoutS:I,layoutM:p,layoutL:u,layoutXL:T,root:j,floats:x,media:y,body:h,header:E,caption:A,title:L,subtitle:_,children:C,footer:O,closeButton:R,progressLine:f,fancy:N,imgSrcVertical:k,imgSrcHorizontal:b,draggable:z,loading:P,stickyHeader:Y,className:D,backgroundClassName:B,onGrab:Z,onNudge:w,...F}=o;const V={size:t,sizeXXS:i,sizeXS:a,sizeS:l,sizeM:c,sizeL:d,sizeXL:S};const H={layout:s,layoutXXS:m,layoutXS:g,layoutS:I,layoutM:p,layoutL:u,layoutXL:T};const U={...V,appearance:'body',color:'content-onmain-tertiary',wordBreak:'break-word',marginBottom:'0.8em',sizes:SIZES_CAPTION};const M={...V,as:'h2',appearance:'heading',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.5em',sizes:SIZES_TITLE};const X={...V,as:'p',appearance:'body',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.8em',sizes:SIZES_SUBTITLE};const v=N?{icon:jsx(Close,{}),size:'xxl',secondary:!0}:{icon:jsx(Close,{}),size:'l',marginTop:8,marginRight:8};const K={size:'xs'};const G=N?D:concatClassNames(D,B);const q=r&&n;const[J,Q]=useState(null);const{scrollThresholds:W,setScrollThresholds:$}=useScrollThresholds({enabled:q,target:J});return useScrollLock({locked:!r,target:J}),jsxs(Root,{...F,...V,...H,layouts:N?LAYOUTS_FANCY:LAYOUTS,className:G,fancy:N,ref:e,children:[N?jsx(FancyBackground,{className:B}):null,isValidElement(j)?j:typeof j=='function'?j({captionProps:U,titleProps:M,subtitleProps:X,closeButtonProps:v,progressLineProps:K,onGrab:Z,onNudge:w}):jsxs(Fragment,{children:[x,z?jsx(DraggingHandle,{...H,layouts:VISIBILITY_VERTICAL,onPointerDown:Z,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:w,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary"})})}):null,R?jsx(ButtonPosition,{children:isValidElement(R)?R:typeof R=='function'?R(v):null}):null,P||y||k?jsx(Media,{...H,layouts:N?LAYOUTS_FANCY_MEDIA_VERTICAL:LAYOUTS_MEDIA_VERTICAL,children:P?jsx(AspectRatio,{ratio:"3:1",width:"100%",children:jsx(Skeleton,{borderRadius:0})}):isValidElement(y)?y:jsx(AspectRatio,{ratio:"3:1",width:"100%",children:jsx(Img,{src:k})})}):null,P||y||b?jsx(Media,{...H,layouts:LAYOUTS_MEDIA_HORIZONTAL,children:P?jsx(AspectRatio,{ratio:"5:7",height:"100%",children:jsx(Skeleton,{borderRadius:0})}):isValidElement(y)?y:jsx(AspectRatio,{ratio:"5:7",height:"100%",children:jsx(Img,{src:b})})}):null,jsxs(Body,{children:[f&&!P?jsx(ProgressPosition,{...H,layouts:N?LAYOUTS_FANCY_PROGRESS:LAYOUTS_PROGRESS,children:isValidElement(f)?f:typeof f=='function'?f(K):null}):null,z?jsx(DraggingHandle,{...H,layouts:VISIBILITY_HORIZONTAL,onPointerDown:Z,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:w,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary"})})}):null,N?jsx(LayoutSpacer,{...H,layouts:VISIBILITY_HORIZONTAL,paddingTop:76}):null,P?jsx(Container,{...V,sizes:SIZES_CONTAINER,children:jsxs(Content,{...V,sizes:SIZES_CONTENT,children:[jsx(Skeleton,{children:jsx(Text,{...M,marginBottom:"1.5em"})}),jsx(Skeleton,{width:"90%",children:jsx(Text,{...X,marginBottom:"0.4em"})}),jsx(Skeleton,{width:"70%",children:jsx(Text,{...X,marginBottom:"0.4em"})}),jsx(Skeleton,{width:"50%",children:jsx(Text,{...X,marginBottom:"0.8em"})})]})}):isValidElement(h)?h:typeof h=='function'?h({captionProps:U,titleProps:M,subtitleProps:X}):jsxs(Container,{...V,sizes:SIZES_CONTAINER,children:[Y?jsx(StickyHeader,{...V,sizes:SIZES_STICKY_HEADER,children:jsx(Header,{header:E,caption:A,title:L,subtitle:_,captionProps:U,titleProps:M,subtitleProps:X})}):null,q?jsx(Fading,{visible:W.top===!1}):null,jsx(ContentScrollArea,{ref:Q,scrollable:r,tabIndex:r?0:void 0,onScroll:o=>{q&&$(o.currentTarget)},onKeyDown:o=>{keyboardKeys.ArrowUp.validate(o.key)?(o.preventDefault(),o.currentTarget.scrollBy(0,-13)):keyboardKeys.ArrowDown.validate(o.key)&&(o.preventDefault(),o.currentTarget.scrollBy(0,13))},children:jsxs(Content,{...V,sizes:SIZES_CONTENT,children:[Y?null:jsx(Header,{header:E,caption:A,title:L,subtitle:_,captionProps:U,titleProps:M,subtitleProps:X}),C]})}),q?jsx(Fading,{visible:W.bottom===!1,after:!0}):null,O?jsx(Footer,{...V,sizes:SIZES_FOOTER,children:O}):null]})]})]})]})}),{sizes:o=>o.fancy?SIZES_FANCY:SIZES,displayName:'DialogComponent'});export{DialogComponent};
+import{forwardRef,useState,isValidElement}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{useScrollThresholds}from'../../hooks/useScrollThresholds.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{concatClassNames}from'../../shared/utils/dom.mjs';import{useScrollLock}from'../../hooks/useScrollLock.mjs';import SvgDragging from'./images/dragging.svg.mjs';import{Root,FancyBackground,DraggingHandle,DraggingIconContainer,ButtonPosition,Media,Img,Body,ProgressPosition,LayoutSpacer,Container,Content,StickyHeader,Fading,ContentScrollArea,Footer}from'./style.mjs';import{SIZES_SUBTITLE,SIZES_TITLE,SIZES_CAPTION,SIZES_CONTAINER,SIZES_CONTENT,SIZES_STICKY_HEADER,SIZES_FOOTER,SIZES_FANCY,SIZES}from'./sizes.mjs';import{LAYOUTS_FANCY,LAYOUTS,VISIBILITY_VERTICAL,LAYOUTS_FANCY_MEDIA_VERTICAL,LAYOUTS_MEDIA_VERTICAL,LAYOUTS_MEDIA_HORIZONTAL,LAYOUTS_FANCY_PROGRESS,LAYOUTS_PROGRESS,VISIBILITY_HORIZONTAL}from'./layouts.mjs';import{Header}from'./Header.mjs';import{jsxs,jsx,Fragment}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';import{AspectRatio}from'../AspectRatio/AspectRatio.mjs';import{Skeleton}from'../Skeleton/Skeleton.mjs';import{Text}from'../Text/Text.mjs';import{Close}from'../../icon-pack/src/icons/Close/index.mjs';const DialogComponent=withMergedProps(forwardRef((o,e)=>{const{size:t="s",layout:s="vertical",scrollable:r=!1,scrollFading:n=!1,sizeXXS:i,sizeXS:l,sizeS:a,sizeM:c,sizeL:d,sizeXL:S,layoutXXS:m,layoutXS:g,layoutS:I,layoutM:p,layoutL:u,layoutXL:T,root:j,floats:x,media:y,body:h,header:E,caption:A,title:L,subtitle:_,children:C,footer:f,closeButton:O,progressLine:R,fancy:N,imgSrcVertical:k,imgSrcHorizontal:b,draggable:z,loading:P,stickyHeader:Y,className:D,backgroundClassName:B,onGrab:Z,onNudge:w,...F}=o;const V={size:t,sizeXXS:i,sizeXS:l,sizeS:a,sizeM:c,sizeL:d,sizeXL:S};const H={layout:s,layoutXXS:m,layoutXS:g,layoutS:I,layoutM:p,layoutL:u,layoutXL:T};const U={...V,appearance:'body',color:'content-onmain-tertiary',wordBreak:'break-word',marginBottom:'0.8em',sizes:SIZES_CAPTION};const M={...V,as:'h2',appearance:'heading',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.5em',sizes:SIZES_TITLE};const X={...V,as:'p',appearance:'body',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.8em',sizes:SIZES_SUBTITLE};const v=N?{icon:jsx(Close,{}),size:'xxl',filled:!0}:{icon:jsx(Close,{}),size:'l',marginTop:8,marginRight:8};const K={size:'xs'};const G=N?D:concatClassNames(D,B);const q=r&&n;const[J,Q]=useState(null);const{scrollThresholds:W,setScrollThresholds:$}=useScrollThresholds({enabled:q,target:J});return useScrollLock({locked:!r,target:J}),jsxs(Root,{...F,...V,...H,layouts:N?LAYOUTS_FANCY:LAYOUTS,className:G,fancy:N,ref:e,children:[N?jsx(FancyBackground,{className:B}):null,isValidElement(j)?j:typeof j=='function'?j({captionProps:U,titleProps:M,subtitleProps:X,closeButtonProps:v,progressLineProps:K,onGrab:Z,onNudge:w}):jsxs(Fragment,{children:[x,z?jsx(DraggingHandle,{...H,layouts:VISIBILITY_VERTICAL,onPointerDown:Z,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:w,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary"})})}):null,O?jsx(ButtonPosition,{children:isValidElement(O)?O:typeof O=='function'?O(v):null}):null,P||y||k?jsx(Media,{...H,layouts:N?LAYOUTS_FANCY_MEDIA_VERTICAL:LAYOUTS_MEDIA_VERTICAL,children:P?jsx(AspectRatio,{ratio:"3:1",width:"100%",children:jsx(Skeleton,{borderRadius:0})}):isValidElement(y)?y:jsx(AspectRatio,{ratio:"3:1",width:"100%",children:jsx(Img,{src:k})})}):null,P||y||b?jsx(Media,{...H,layouts:LAYOUTS_MEDIA_HORIZONTAL,children:P?jsx(AspectRatio,{ratio:"5:7",height:"100%",children:jsx(Skeleton,{borderRadius:0})}):isValidElement(y)?y:jsx(AspectRatio,{ratio:"5:7",height:"100%",children:jsx(Img,{src:b})})}):null,jsxs(Body,{children:[R&&!P?jsx(ProgressPosition,{...H,layouts:N?LAYOUTS_FANCY_PROGRESS:LAYOUTS_PROGRESS,children:isValidElement(R)?R:typeof R=='function'?R(K):null}):null,z?jsx(DraggingHandle,{...H,layouts:VISIBILITY_HORIZONTAL,onPointerDown:Z,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:w,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary"})})}):null,N?jsx(LayoutSpacer,{...H,layouts:VISIBILITY_HORIZONTAL,paddingTop:76}):null,P?jsx(Container,{...V,sizes:SIZES_CONTAINER,children:jsxs(Content,{...V,sizes:SIZES_CONTENT,children:[jsx(Skeleton,{children:jsx(Text,{...M,marginBottom:"1.5em"})}),jsx(Skeleton,{width:"90%",children:jsx(Text,{...X,marginBottom:"0.4em"})}),jsx(Skeleton,{width:"70%",children:jsx(Text,{...X,marginBottom:"0.4em"})}),jsx(Skeleton,{width:"50%",children:jsx(Text,{...X,marginBottom:"0.8em"})})]})}):isValidElement(h)?h:typeof h=='function'?h({captionProps:U,titleProps:M,subtitleProps:X}):jsxs(Container,{...V,sizes:SIZES_CONTAINER,children:[Y?jsx(StickyHeader,{...V,sizes:SIZES_STICKY_HEADER,children:jsx(Header,{header:E,caption:A,title:L,subtitle:_,captionProps:U,titleProps:M,subtitleProps:X})}):null,q?jsx(Fading,{visible:W.top===!1}):null,jsx(ContentScrollArea,{ref:Q,scrollable:r,tabIndex:r?0:void 0,onScroll:o=>{q&&$(o.currentTarget)},onKeyDown:o=>{keyboardKeys.ArrowUp.validate(o.key)?(o.preventDefault(),o.currentTarget.scrollBy(0,-13)):keyboardKeys.ArrowDown.validate(o.key)&&(o.preventDefault(),o.currentTarget.scrollBy(0,13))},children:jsxs(Content,{...V,sizes:SIZES_CONTENT,children:[Y?null:jsx(Header,{header:E,caption:A,title:L,subtitle:_,captionProps:U,titleProps:M,subtitleProps:X}),C]})}),q?jsx(Fading,{visible:W.bottom===!1,after:!0}):null,f?jsx(Footer,{...V,sizes:SIZES_FOOTER,children:f}):null]})]})]})]})}),{sizes:o=>o.fancy?SIZES_FANCY:SIZES,displayName:'DialogComponent'});export{DialogComponent};
 //# sourceMappingURL=DialogComponent.mjs.map

package/components/DialogComponent/DialogComponent.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DialogComponent.mjs","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useState, isValidElement } from 'react'\nimport { Close } from '@foxford/icon-pack'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { useScrollThresholds } from 'hooks/useScrollThresholds'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Skeleton } from 'components/Skeleton'\nimport { AspectRatio } from 'components/AspectRatio'\nimport type { TextProps } from 'components/Text'\nimport type { IconButtonProps } from 'components/IconButton'\nimport type { ProgressLineProps } from 'components/ProgressLine'\nimport { concatClassNames } from 'shared/utils/dom'\nimport { useScrollLock } from 'hooks/useScrollLock'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport {\n  SIZES,\n  SIZES_FANCY,\n  SIZES_CONTAINER,\n  SIZES_CONTENT,\n  SIZES_FOOTER,\n  SIZES_CAPTION,\n  SIZES_TITLE,\n  SIZES_SUBTITLE,\n  SIZES_STICKY_HEADER,\n} from './sizes'\nimport {\n  LAYOUTS,\n  LAYOUTS_FANCY,\n  LAYOUTS_MEDIA_VERTICAL,\n  LAYOUTS_FANCY_MEDIA_VERTICAL,\n  LAYOUTS_MEDIA_HORIZONTAL,\n  LAYOUTS_PROGRESS,\n  LAYOUTS_FANCY_PROGRESS,\n  VISIBILITY_VERTICAL,\n  VISIBILITY_HORIZONTAL,\n} from './layouts'\nimport type { DialogComponentProps } from './types'\nimport { Header } from './Header'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n  DialogComponentProps,\n  HTMLDivElement\n>(\n  forwardRef<HTMLDivElement, MergedProps<DialogComponentProps>>((props, ref) => {\n    const {\n      size = 's',\n      layout = 'vertical',\n      scrollable = false,\n      scrollFading = false,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n      root,\n      floats,\n      media,\n      body,\n      header,\n      caption,\n      title,\n      subtitle,\n      children,\n      footer,\n      closeButton,\n      progressLine,\n      fancy,\n      imgSrcVertical,\n      imgSrcHorizontal,\n      draggable,\n      loading,\n      stickyHeader,\n      className,\n      backgroundClassName,\n      onGrab,\n      onNudge,\n      ...restProps\n    } = props\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const layoutProps = {\n      layout,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n    }\n\n    const captionProps: TextProps = {\n      ...sizeProps,\n      appearance: 'body',\n      color: 'content-onmain-tertiary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_CAPTION,\n    }\n\n    const titleProps: TextProps = {\n      ...sizeProps,\n      as: 'h2',\n      appearance: 'heading',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.5em',\n      sizes: SIZES_TITLE,\n    }\n\n    const subtitleProps: TextProps = {\n      ...sizeProps,\n      as: 'p',\n      appearance: 'body',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_SUBTITLE,\n    }\n\n    const closeButtonProps: IconButtonProps = fancy\n      ? { icon: <Close />, size: 'xxl', secondary: true }\n      : { icon: <Close />, size: 'l', marginTop: 8, marginRight: 8 }\n\n    const progressLineProps: ProgressLineProps = {\n      size: 'xs',\n    }\n\n    const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n    const scrollFadingEnabled = scrollable && scrollFading\n\n    const [contentRef, setContentRef] = useState<HTMLDivElement | null>(null)\n\n    const { scrollThresholds, setScrollThresholds } = useScrollThresholds({\n      enabled: scrollFadingEnabled,\n      target: contentRef,\n    })\n\n    useScrollLock({ locked: !scrollable, target: contentRef })\n\n    return (\n      <Styled.Root\n        {...restProps}\n        {...sizeProps}\n        {...layoutProps}\n        layouts={fancy ? LAYOUTS_FANCY : LAYOUTS}\n        className={rootClassName}\n        fancy={fancy}\n        ref={ref}\n      >\n        {fancy ? <Styled.FancyBackground className={backgroundClassName} /> : null}\n        {isValidElement(root) ? (\n          root\n        ) : typeof root === 'function' ? (\n          root({\n            captionProps,\n            titleProps,\n            subtitleProps,\n            closeButtonProps,\n            progressLineProps,\n            onGrab,\n            onNudge,\n          })\n        ) : (\n          <>\n            {floats}\n            {draggable ? (\n              <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_VERTICAL} onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            ) : null}\n            {closeButton ? (\n              <Styled.ButtonPosition>\n                {isValidElement(closeButton)\n                  ? closeButton\n                  : typeof closeButton === 'function'\n                    ? closeButton(closeButtonProps)\n                    : null}\n              </Styled.ButtonPosition>\n            ) : null}\n            {loading || media || imgSrcVertical ? (\n              <Styled.Media {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_MEDIA_VERTICAL : LAYOUTS_MEDIA_VERTICAL}>\n                {loading ? (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Styled.Img src={imgSrcVertical} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            ) : null}\n            {loading || media || imgSrcHorizontal ? (\n              <Styled.Media {...layoutProps} layouts={LAYOUTS_MEDIA_HORIZONTAL}>\n                {loading ? (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Styled.Img src={imgSrcHorizontal} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            ) : null}\n            <Styled.Body>\n              {progressLine && !loading ? (\n                <Styled.ProgressPosition {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_PROGRESS : LAYOUTS_PROGRESS}>\n                  {isValidElement(progressLine)\n                    ? progressLine\n                    : typeof progressLine === 'function'\n                      ? progressLine(progressLineProps)\n                      : null}\n                </Styled.ProgressPosition>\n              ) : null}\n              {draggable ? (\n                <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_HORIZONTAL} onPointerDown={onGrab}>\n                  <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                    <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                  </Styled.DraggingIconContainer>\n                </Styled.DraggingHandle>\n              ) : null}\n              {fancy ? <Styled.LayoutSpacer {...layoutProps} layouts={VISIBILITY_HORIZONTAL} paddingTop={76} /> : null}\n              {loading ? (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  <Styled.Content {...sizeProps} sizes={SIZES_CONTENT}>\n                    <Skeleton>\n                      <Text {...titleProps} marginBottom='1.5em' />\n                    </Skeleton>\n                    <Skeleton width='90%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='70%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='50%'>\n                      <Text {...subtitleProps} marginBottom='0.8em' />\n                    </Skeleton>\n                  </Styled.Content>\n                </Styled.Container>\n              ) : isValidElement(body) ? (\n                body\n              ) : typeof body === 'function' ? (\n                body({\n                  captionProps,\n                  titleProps,\n                  subtitleProps,\n                })\n              ) : (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  {stickyHeader ? (\n                    <Styled.StickyHeader {...sizeProps} sizes={SIZES_STICKY_HEADER}>\n                      <Header\n                        header={header}\n                        caption={caption}\n                        title={title}\n                        subtitle={subtitle}\n                        captionProps={captionProps}\n                        titleProps={titleProps}\n                        subtitleProps={subtitleProps}\n                      />\n                    </Styled.StickyHeader>\n                  ) : null}\n                  {scrollFadingEnabled ? <Styled.Fading visible={scrollThresholds.top === false} /> : null}\n                  <Styled.ContentScrollArea\n                    ref={setContentRef}\n                    scrollable={scrollable}\n                    tabIndex={scrollable ? 0 : undefined}\n                    onScroll={(evt) => {\n                      if (scrollFadingEnabled) {\n                        setScrollThresholds(evt.currentTarget)\n                      }\n                    }}\n                    onKeyDown={(evt) => {\n                      if (keyboardKeys.ArrowUp.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, -13)\n                      } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, 13)\n                      }\n                    }}\n                  >\n                    <Styled.Content {...sizeProps} sizes={SIZES_CONTENT}>\n                      {!stickyHeader ? (\n                        <Header\n                          header={header}\n                          caption={caption}\n                          title={title}\n                          subtitle={subtitle}\n                          captionProps={captionProps}\n                          titleProps={titleProps}\n                          subtitleProps={subtitleProps}\n                        />\n                      ) : null}\n                      {children}\n                    </Styled.Content>\n                  </Styled.ContentScrollArea>\n                  {scrollFadingEnabled ? <Styled.Fading visible={scrollThresholds.bottom === false} after /> : null}\n                  {footer ? (\n                    <Styled.Footer {...sizeProps} sizes={SIZES_FOOTER}>\n                      {footer}\n                    </Styled.Footer>\n                  ) : null}\n                </Styled.Container>\n              )}\n            </Styled.Body>\n          </>\n        )}\n      </Styled.Root>\n    )\n  }),\n  {\n    sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { DialogComponent }\n"],"names":["DialogComponent","withMergedProps","forwardRef","props","ref","size","layout","scrollable","scrollFading","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","layoutXXS","layoutXS","layoutS","layoutM","layoutL","layoutXL","root","floats","media","body","header","caption","title","subtitle","children","footer","closeButton","progressLine","fancy","imgSrcVertical","imgSrcHorizontal","draggable","loading","stickyHeader","className","backgroundClassName","onGrab","onNudge","restProps","sizeProps","layoutProps","captionProps","appearance","color","wordBreak","marginBottom","sizes","SIZES_CAPTION","titleProps","as","SIZES_TITLE","subtitleProps","SIZES_SUBTITLE","closeButtonProps","icon","_jsx","Close","secondary","marginTop","marginRight","progressLineProps","rootClassName","concatClassNames","scrollFadingEnabled","contentRef","setContentRef","useState","scrollThresholds","setScrollThresholds","useScrollThresholds","enabled","target","useScrollLock","locked","_jsxs","Styled","layouts","LAYOUTS_FANCY","LAYOUTS","isValidElement","_Fragment","VISIBILITY_VERTICAL","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","LAYOUTS_FANCY_MEDIA_VERTICAL","LAYOUTS_MEDIA_VERTICAL","AspectRatio","ratio","width","Skeleton","borderRadius","src","LAYOUTS_MEDIA_HORIZONTAL","height","LAYOUTS_FANCY_PROGRESS","LAYOUTS_PROGRESS","VISIBILITY_HORIZONTAL","paddingTop","SIZES_CONTAINER","SIZES_CONTENT","Text","SIZES_STICKY_HEADER","Header","visible","top","undefined","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","bottom","after","SIZES_FOOTER","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}
+{"version":3,"file":"DialogComponent.mjs","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useState, isValidElement } from 'react'\nimport { Close } from '@foxford/icon-pack'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { useScrollThresholds } from 'hooks/useScrollThresholds'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Skeleton } from 'components/Skeleton'\nimport { AspectRatio } from 'components/AspectRatio'\nimport type { TextProps } from 'components/Text'\nimport type { IconButtonProps } from 'components/IconButton'\nimport type { ProgressLineProps } from 'components/ProgressLine'\nimport { concatClassNames } from 'shared/utils/dom'\nimport { useScrollLock } from 'hooks/useScrollLock'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport {\n  SIZES,\n  SIZES_FANCY,\n  SIZES_CONTAINER,\n  SIZES_CONTENT,\n  SIZES_FOOTER,\n  SIZES_CAPTION,\n  SIZES_TITLE,\n  SIZES_SUBTITLE,\n  SIZES_STICKY_HEADER,\n} from './sizes'\nimport {\n  LAYOUTS,\n  LAYOUTS_FANCY,\n  LAYOUTS_MEDIA_VERTICAL,\n  LAYOUTS_FANCY_MEDIA_VERTICAL,\n  LAYOUTS_MEDIA_HORIZONTAL,\n  LAYOUTS_PROGRESS,\n  LAYOUTS_FANCY_PROGRESS,\n  VISIBILITY_VERTICAL,\n  VISIBILITY_HORIZONTAL,\n} from './layouts'\nimport type { DialogComponentProps } from './types'\nimport { Header } from './Header'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n  DialogComponentProps,\n  HTMLDivElement\n>(\n  forwardRef<HTMLDivElement, MergedProps<DialogComponentProps>>((props, ref) => {\n    const {\n      size = 's',\n      layout = 'vertical',\n      scrollable = false,\n      scrollFading = false,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n      root,\n      floats,\n      media,\n      body,\n      header,\n      caption,\n      title,\n      subtitle,\n      children,\n      footer,\n      closeButton,\n      progressLine,\n      fancy,\n      imgSrcVertical,\n      imgSrcHorizontal,\n      draggable,\n      loading,\n      stickyHeader,\n      className,\n      backgroundClassName,\n      onGrab,\n      onNudge,\n      ...restProps\n    } = props\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const layoutProps = {\n      layout,\n      layoutXXS,\n      layoutXS,\n      layoutS,\n      layoutM,\n      layoutL,\n      layoutXL,\n    }\n\n    const captionProps: TextProps = {\n      ...sizeProps,\n      appearance: 'body',\n      color: 'content-onmain-tertiary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_CAPTION,\n    }\n\n    const titleProps: TextProps = {\n      ...sizeProps,\n      as: 'h2',\n      appearance: 'heading',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.5em',\n      sizes: SIZES_TITLE,\n    }\n\n    const subtitleProps: TextProps = {\n      ...sizeProps,\n      as: 'p',\n      appearance: 'body',\n      color: 'content-onmain-primary',\n      wordBreak: 'break-word',\n      marginBottom: '0.8em',\n      sizes: SIZES_SUBTITLE,\n    }\n\n    const closeButtonProps: IconButtonProps = fancy\n      ? { icon: <Close />, size: 'xxl', filled: true }\n      : { icon: <Close />, size: 'l', marginTop: 8, marginRight: 8 }\n\n    const progressLineProps: ProgressLineProps = {\n      size: 'xs',\n    }\n\n    const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n    const scrollFadingEnabled = scrollable && scrollFading\n\n    const [contentRef, setContentRef] = useState<HTMLDivElement | null>(null)\n\n    const { scrollThresholds, setScrollThresholds } = useScrollThresholds({\n      enabled: scrollFadingEnabled,\n      target: contentRef,\n    })\n\n    useScrollLock({ locked: !scrollable, target: contentRef })\n\n    return (\n      <Styled.Root\n        {...restProps}\n        {...sizeProps}\n        {...layoutProps}\n        layouts={fancy ? LAYOUTS_FANCY : LAYOUTS}\n        className={rootClassName}\n        fancy={fancy}\n        ref={ref}\n      >\n        {fancy ? <Styled.FancyBackground className={backgroundClassName} /> : null}\n        {isValidElement(root) ? (\n          root\n        ) : typeof root === 'function' ? (\n          root({\n            captionProps,\n            titleProps,\n            subtitleProps,\n            closeButtonProps,\n            progressLineProps,\n            onGrab,\n            onNudge,\n          })\n        ) : (\n          <>\n            {floats}\n            {draggable ? (\n              <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_VERTICAL} onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            ) : null}\n            {closeButton ? (\n              <Styled.ButtonPosition>\n                {isValidElement(closeButton)\n                  ? closeButton\n                  : typeof closeButton === 'function'\n                    ? closeButton(closeButtonProps)\n                    : null}\n              </Styled.ButtonPosition>\n            ) : null}\n            {loading || media || imgSrcVertical ? (\n              <Styled.Media {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_MEDIA_VERTICAL : LAYOUTS_MEDIA_VERTICAL}>\n                {loading ? (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='3:1' width='100%'>\n                    <Styled.Img src={imgSrcVertical} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            ) : null}\n            {loading || media || imgSrcHorizontal ? (\n              <Styled.Media {...layoutProps} layouts={LAYOUTS_MEDIA_HORIZONTAL}>\n                {loading ? (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Skeleton borderRadius={0} />\n                  </AspectRatio>\n                ) : isValidElement(media) ? (\n                  media\n                ) : (\n                  <AspectRatio ratio='5:7' height='100%'>\n                    <Styled.Img src={imgSrcHorizontal} />\n                  </AspectRatio>\n                )}\n              </Styled.Media>\n            ) : null}\n            <Styled.Body>\n              {progressLine && !loading ? (\n                <Styled.ProgressPosition {...layoutProps} layouts={fancy ? LAYOUTS_FANCY_PROGRESS : LAYOUTS_PROGRESS}>\n                  {isValidElement(progressLine)\n                    ? progressLine\n                    : typeof progressLine === 'function'\n                      ? progressLine(progressLineProps)\n                      : null}\n                </Styled.ProgressPosition>\n              ) : null}\n              {draggable ? (\n                <Styled.DraggingHandle {...layoutProps} layouts={VISIBILITY_HORIZONTAL} onPointerDown={onGrab}>\n                  <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                    <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' />\n                  </Styled.DraggingIconContainer>\n                </Styled.DraggingHandle>\n              ) : null}\n              {fancy ? <Styled.LayoutSpacer {...layoutProps} layouts={VISIBILITY_HORIZONTAL} paddingTop={76} /> : null}\n              {loading ? (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  <Styled.Content {...sizeProps} sizes={SIZES_CONTENT}>\n                    <Skeleton>\n                      <Text {...titleProps} marginBottom='1.5em' />\n                    </Skeleton>\n                    <Skeleton width='90%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='70%'>\n                      <Text {...subtitleProps} marginBottom='0.4em' />\n                    </Skeleton>\n                    <Skeleton width='50%'>\n                      <Text {...subtitleProps} marginBottom='0.8em' />\n                    </Skeleton>\n                  </Styled.Content>\n                </Styled.Container>\n              ) : isValidElement(body) ? (\n                body\n              ) : typeof body === 'function' ? (\n                body({\n                  captionProps,\n                  titleProps,\n                  subtitleProps,\n                })\n              ) : (\n                <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER}>\n                  {stickyHeader ? (\n                    <Styled.StickyHeader {...sizeProps} sizes={SIZES_STICKY_HEADER}>\n                      <Header\n                        header={header}\n                        caption={caption}\n                        title={title}\n                        subtitle={subtitle}\n                        captionProps={captionProps}\n                        titleProps={titleProps}\n                        subtitleProps={subtitleProps}\n                      />\n                    </Styled.StickyHeader>\n                  ) : null}\n                  {scrollFadingEnabled ? <Styled.Fading visible={scrollThresholds.top === false} /> : null}\n                  <Styled.ContentScrollArea\n                    ref={setContentRef}\n                    scrollable={scrollable}\n                    tabIndex={scrollable ? 0 : undefined}\n                    onScroll={(evt) => {\n                      if (scrollFadingEnabled) {\n                        setScrollThresholds(evt.currentTarget)\n                      }\n                    }}\n                    onKeyDown={(evt) => {\n                      if (keyboardKeys.ArrowUp.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, -13)\n                      } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n                        evt.preventDefault()\n                        evt.currentTarget.scrollBy(0, 13)\n                      }\n                    }}\n                  >\n                    <Styled.Content {...sizeProps} sizes={SIZES_CONTENT}>\n                      {!stickyHeader ? (\n                        <Header\n                          header={header}\n                          caption={caption}\n                          title={title}\n                          subtitle={subtitle}\n                          captionProps={captionProps}\n                          titleProps={titleProps}\n                          subtitleProps={subtitleProps}\n                        />\n                      ) : null}\n                      {children}\n                    </Styled.Content>\n                  </Styled.ContentScrollArea>\n                  {scrollFadingEnabled ? <Styled.Fading visible={scrollThresholds.bottom === false} after /> : null}\n                  {footer ? (\n                    <Styled.Footer {...sizeProps} sizes={SIZES_FOOTER}>\n                      {footer}\n                    </Styled.Footer>\n                  ) : null}\n                </Styled.Container>\n              )}\n            </Styled.Body>\n          </>\n        )}\n      </Styled.Root>\n    )\n  }),\n  {\n    sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { DialogComponent }\n"],"names":["DialogComponent","withMergedProps","forwardRef","props","ref","size","layout","scrollable","scrollFading","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","layoutXXS","layoutXS","layoutS","layoutM","layoutL","layoutXL","root","floats","media","body","header","caption","title","subtitle","children","footer","closeButton","progressLine","fancy","imgSrcVertical","imgSrcHorizontal","draggable","loading","stickyHeader","className","backgroundClassName","onGrab","onNudge","restProps","sizeProps","layoutProps","captionProps","appearance","color","wordBreak","marginBottom","sizes","SIZES_CAPTION","titleProps","as","SIZES_TITLE","subtitleProps","SIZES_SUBTITLE","closeButtonProps","icon","_jsx","Close","filled","marginTop","marginRight","progressLineProps","rootClassName","concatClassNames","scrollFadingEnabled","contentRef","setContentRef","useState","scrollThresholds","setScrollThresholds","useScrollThresholds","enabled","target","useScrollLock","locked","_jsxs","Styled","layouts","LAYOUTS_FANCY","LAYOUTS","isValidElement","_Fragment","VISIBILITY_VERTICAL","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","LAYOUTS_FANCY_MEDIA_VERTICAL","LAYOUTS_MEDIA_VERTICAL","AspectRatio","ratio","width","Skeleton","borderRadius","src","LAYOUTS_MEDIA_HORIZONTAL","height","LAYOUTS_FANCY_PROGRESS","LAYOUTS_PROGRESS","VISIBILITY_HORIZONTAL","paddingTop","SIZES_CONTAINER","SIZES_CONTENT","Text","SIZES_STICKY_HEADER","Header","visible","top","undefined","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","bottom","after","SIZES_FOOTER","SIZES_FANCY","SIZES","displayName"],"mappings":"8vCA4CA,MAAMA,gBAAyEC,gBAI7EC,WAA8D,CAACC,EAAOC,KACpE,MAAMC,KACJA,EAAO,IAAGC,OACVA,EAAS,WAAUC,WACnBA,GAAa,EAAKC,aAClBA,GAAe,EAAKC,QACpBA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,UACNA,EAASC,SACTA,EAAQC,QACRA,EAAOC,QACPA,EAAOC,QACPA,EAAOC,SACPA,EAAQC,KACRA,EAAIC,OACJA,EAAMC,MACNA,EAAKC,KACLA,EAAIC,OACJA,EAAMC,QACNA,EAAOC,MACPA,EAAKC,SACLA,EAAQC,SACRA,EAAQC,OACRA,EAAMC,YACNA,EAAWC,aACXA,EAAYC,MACZA,EAAKC,eACLA,EAAcC,iBACdA,EAAgBC,UAChBA,EAASC,QACTA,EAAOC,aACPA,EAAYC,UACZA,EAASC,oBACTA,EAAmBC,OACnBA,EAAMC,QACNA,KACGC,GACDxC,EAEJ,MAAMyC,EAAY,CAChBvC,OACAI,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAM+B,EAAc,CAClBvC,SACAS,YACAC,WACAC,UACAC,UACAC,UACAC,YAGF,MAAM0B,EAA0B,IAC3BF,EACHG,WAAY,OACZC,MAAO,0BACPC,UAAW,aACXC,aAAc,QACdC,MAAOC,eAGT,MAAMC,EAAwB,IACzBT,EACHU,GAAI,KACJP,WAAY,UACZC,MAAO,yBACPC,UAAW,aACXC,aAAc,QACdC,MAAOI,aAGT,MAAMC,EAA2B,IAC5BZ,EACHU,GAAI,IACJP,WAAY,OACZC,MAAO,yBACPC,UAAW,aACXC,aAAc,QACdC,MAAOM,gBAGT,MAAMC,EAAoCzB,EACtC,CAAE0B,KAAMC,IAACC,UAAUxD,KAAM,MAAOyD,QAAQ,GACxC,CAAEH,KAAMC,IAACC,UAAUxD,KAAM,IAAK0D,UAAW,EAAGC,YAAa,GAE7D,MAAMC,EAAuC,CAC3C5D,KAAM,MAGR,MAAM6D,EAAiBjC,EAA2DM,EAAnD4B,iBAAiB5B,EAAWC,GAE3D,MAAM4B,EAAsB7D,GAAcC,EAE1C,MAAO6D,EAAYC,GAAiBC,SAAgC,MAEpE,MAAMC,iBAAEA,EAAgBC,oBAAEA,GAAwBC,oBAAoB,CACpEC,QAASP,EACTQ,OAAQP,IAKV,OAFAQ,cAAc,CAAEC,QAASvE,EAAYqE,OAAQP,IAG3CU,KAACC,KAAW,IACNrC,KACAC,KACAC,EACJoC,QAAShD,EAAQiD,cAAgBC,QACjC5C,UAAW2B,EACXjC,MAAOA,EACP7B,IAAKA,EAAIyB,UAERI,EAAQ2B,IAACoB,gBAAsB,CAACzC,UAAWC,IAA0B,KACrE4C,eAAe/D,GACdA,SACSA,GAAS,WAClBA,EAAK,CACHyB,eACAO,aACAG,gBACAE,mBACAO,oBACAxB,SACAC,YAGFqC,KAAAM,SAAA,CAAAxD,SAAA,CACGP,EACAc,EACCwB,IAACoB,eAAqB,IAAKnC,EAAaoC,QAASK,oBAAqBC,cAAe9C,EAAOZ,SAC1F+B,IAACoB,sBAA4B,CAACQ,SAAU,EAAGC,UAAW/C,EAAQb,SAC5D+B,IAAC8B,KAAI,CAAC/B,KAAMC,IAAC+B,gBAAatF,KAAM,GAAI2C,MAAM,gCAG5C,KACHjB,EACC6B,IAACoB,eAAqB,CAAAnD,SACnBuD,eAAerD,GACZA,SACOA,GAAgB,WACrBA,EAAY2B,GACZ,OAEN,KACHrB,GAAWd,GAASW,EACnB0B,IAACoB,MAAY,IAAKnC,EAAaoC,QAAShD,EAAQ2D,6BAA+BC,uBAAuBhE,SACnGQ,EACCuB,IAACkC,YAAW,CAACC,MAAM,MAAMC,MAAM,OAAMnE,SACnC+B,IAACqC,SAAQ,CAACC,aAAc,MAExBd,eAAe7D,GACjBA,EAEAqC,IAACkC,YAAW,CAACC,MAAM,MAAMC,MAAM,OAAMnE,SACnC+B,IAACoB,IAAU,CAACmB,IAAKjE,QAIrB,KACHG,GAAWd,GAASY,EACnByB,IAACoB,MAAY,IAAKnC,EAAaoC,QAASmB,yBAAyBvE,SAC9DQ,EACCuB,IAACkC,YAAW,CAACC,MAAM,MAAMM,OAAO,OAAMxE,SACpC+B,IAACqC,SAAQ,CAACC,aAAc,MAExBd,eAAe7D,GACjBA,EAEAqC,IAACkC,YAAW,CAACC,MAAM,MAAMM,OAAO,OAAMxE,SACpC+B,IAACoB,IAAU,CAACmB,IAAKhE,QAIrB,KACJ4C,KAACC,KAAW,CAAAnD,SAAA,CACTG,IAAiBK,EAChBuB,IAACoB,iBAAuB,IAAKnC,EAAaoC,QAAShD,EAAQqE,uBAAyBC,iBAAiB1E,SAClGuD,eAAepD,GACZA,SACOA,GAAiB,WACtBA,EAAaiC,GACb,OAEN,KACH7B,EACCwB,IAACoB,eAAqB,IAAKnC,EAAaoC,QAASuB,sBAAuBjB,cAAe9C,EAAOZ,SAC5F+B,IAACoB,sBAA4B,CAACQ,SAAU,EAAGC,UAAW/C,EAAQb,SAC5D+B,IAAC8B,KAAI,CAAC/B,KAAMC,IAAC+B,gBAAatF,KAAM,GAAI2C,MAAM,gCAG5C,KACHf,EAAQ2B,IAACoB,aAAmB,IAAKnC,EAAaoC,QAASuB,sBAAuBC,WAAY,KAAS,KACnGpE,EACCuB,IAACoB,UAAgB,IAAKpC,EAAWO,MAAOuD,gBAAgB7E,SACtDkD,KAACC,QAAc,IAAKpC,EAAWO,MAAOwD,cAAc9E,SAAA,CAClD+B,IAACqC,SAAQ,CAAApE,SACP+B,IAACgD,KAAI,IAAKvD,EAAYH,aAAa,YAErCU,IAACqC,SAAQ,CAACD,MAAM,MAAKnE,SACnB+B,IAACgD,KAAI,IAAKpD,EAAeN,aAAa,YAExCU,IAACqC,SAAQ,CAACD,MAAM,MAAKnE,SACnB+B,IAACgD,KAAI,IAAKpD,EAAeN,aAAa,YAExCU,IAACqC,SAAQ,CAACD,MAAM,MAAKnE,SACnB+B,IAACgD,KAAI,IAAKpD,EAAeN,aAAa,iBAI1CkC,eAAe5D,GACjBA,SACSA,GAAS,WAClBA,EAAK,CACHsB,eACAO,aACAG,kBAGFuB,KAACC,UAAgB,IAAKpC,EAAWO,MAAOuD,gBAAgB7E,UACrDS,EACCsB,IAACoB,aAAmB,IAAKpC,EAAWO,MAAO0D,oBAAoBhF,SAC7D+B,IAACkD,OAAM,CACLrF,OAAQA,EACRC,QAASA,EACTC,MAAOA,EACPC,SAAUA,EACVkB,aAAcA,EACdO,WAAYA,EACZG,cAAeA,MAGjB,KACHY,EAAsBR,IAACoB,OAAa,CAAC+B,QAASvC,EAAiBwC,OAAQ,IAAY,KACpFpD,IAACoB,kBAAwB,CACvB5E,IAAKkE,EACL/D,WAAYA,EACZiF,SAAUjF,EAAa,OAAI0G,EAC3BC,SAAWC,IACL/C,GACFK,EAAoB0C,EAAIC,gBAG5B3B,UAAY0B,IACNE,aAAaC,QAAQC,SAASJ,EAAIK,MACpCL,EAAIM,iBACJN,EAAIC,cAAcM,SAAS,GAAG,KACrBL,aAAaM,UAAUJ,SAASJ,EAAIK,OAC7CL,EAAIM,iBACJN,EAAIC,cAAcM,SAAS,EAAG,MAEhC7F,SAEFkD,KAACC,QAAc,IAAKpC,EAAWO,MAAOwD,cAAc9E,UAChDS,EAUE,KATFsB,IAACkD,OAAM,CACLrF,OAAQA,EACRC,QAASA,EACTC,MAAOA,EACPC,SAAUA,EACVkB,aAAcA,EACdO,WAAYA,EACZG,cAAeA,IAGlB3B,OAGJuC,EAAsBR,IAACoB,OAAa,CAAC+B,QAASvC,EAAiBoD,UAAW,EAAOC,OAAK,IAAM,KAC5F/F,EACC8B,IAACoB,OAAa,IAAKpC,EAAWO,MAAO2E,aAAajG,SAC/CC,IAED,mBASpB,CACEqB,MAAQhD,GAAWA,EAAM8B,MAAQ8F,YAAcC,MAC/CC,YA5SmB"}

package/components/IconButton/IconButton.js

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var sizes=require('./sizes.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');const IconButton=withMergedProps.withMergedProps(React.forwardRef((e,r)=>{const{size:s="m",type:t="button",iconProps:i={},icon:o,...n}=e;return jsxRuntime.jsx(style.Root,{...n,size:s,type:t,ref:r,children:jsxRuntime.jsx(Icon.Icon,{preset:"brand",size:"inherit",name:typeof o=='string'?o:void 0,icon:typeof o!='string'?o:void 0,...i})})}),{displayName:'IconButton',sizes:e=>e.square?sizes.SIZES_SQUARE:sizes.SIZES});exports.IconButton=IconButton;
+'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var sizes=require('./sizes.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Slot=require('../Slot/Slot.js');var Icon=require('../Icon/Icon.js');const IconButton=withMergedProps.withMergedProps(React.forwardRef((e,r)=>{const{size:s="m",type:t="button",iconProps:o={},icon:i,children:n,...c}=e;const u={preset:'brand',size:'inherit'};return jsxRuntime.jsx(style.Root,{...c,size:s,type:t,ref:r,children:jsxRuntime.jsx(Slot.Slot,{render:n,props:u,fallback:jsxRuntime.jsx(Icon.Icon,{name:typeof i=='string'?i:void 0,icon:typeof i!='string'?i:void 0,...u,...o})})})}),{displayName:'IconButton',sizes:e=>e.square?sizes.SIZES_SQUARE:sizes.SIZES});exports.IconButton=IconButton;
 //# sourceMappingURL=IconButton.js.map

package/components/IconButton/IconButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.js","sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { SIZES, SIZES_SQUARE } from './sizes'\nimport * as Styled from './style'\nimport type { IconButtonProps } from './types'\n\nconst COMPONENT_NAME = 'IconButton'\n\n/**\n *\n * Контрол многоцелевого назначения.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<button\\> элемента.\n */\nconst IconButton: React.ForwardRefExoticComponent<IconButtonProps> = withMergedProps<\n  IconButtonProps,\n  HTMLButtonElement\n>(\n  forwardRef<HTMLButtonElement, MergedProps<IconButtonProps>>((props, ref) => {\n    const { size = 'm', type = 'button', iconProps = {}, icon, ...restProps } = props\n\n    return (\n      <Styled.Root {...restProps} size={size} type={type} ref={ref}>\n        <Icon\n          preset='brand'\n          size='inherit'\n          name={typeof icon === 'string' ? icon : undefined}\n          icon={typeof icon !== 'string' ? icon : undefined}\n          {...iconProps}\n        />\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: (props) => (props.square ? SIZES_SQUARE : SIZES),\n  }\n)\n\nexport { IconButton }\n"],"names":["IconButton","withMergedProps","forwardRef","props","ref","size","type","iconProps","icon","restProps","_jsx","Styled","children","Icon","preset","name","undefined","displayName","sizes","square","SIZES_SQUARE","SIZES"],"mappings":"qPAgBA,MAAMA,WAA+DC,gBAAAA,gBAInEC,MAAAA,WAA4D,CAACC,EAAOC,KAClE,MAAMC,KAAEA,EAAO,IAAGC,KAAEA,EAAO,SAAQC,UAAEA,EAAY,CAAA,EAAEC,KAAEA,KAASC,GAAcN,EAE5E,OACEO,WAAAA,IAACC,MAAAA,KAAW,IAAKF,EAAWJ,KAAMA,EAAMC,KAAMA,EAAMF,IAAKA,EAAIQ,SAC3DF,WAAAA,IAACG,UAAI,CACHC,OAAO,QACPT,KAAK,UACLU,YAAaP,GAAS,SAAWA,OAAOQ,EACxCR,YAAaA,GAAS,SAAWA,OAAOQ,KACpCT,QAKZ,CACEU,YA5BmB,aA6BnBC,MAAQf,GAAWA,EAAMgB,OAASC,MAAAA,aAAeC,MAAAA"}
+{"version":3,"file":"IconButton.js","sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { Slot } from 'components/Slot'\nimport type { IconProps } from 'components/Icon'\nimport { SIZES, SIZES_SQUARE } from './sizes'\nimport * as Styled from './style'\nimport type { IconButtonProps } from './types'\n\nconst COMPONENT_NAME = 'IconButton'\n\n/**\n *\n * *v1.0.0*\n *\n * Контрол многоцелевого назначения.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<button\\> элемента.\n */\nconst IconButton: React.ForwardRefExoticComponent<IconButtonProps> = withMergedProps<\n  IconButtonProps,\n  HTMLButtonElement\n>(\n  forwardRef<HTMLButtonElement, MergedProps<IconButtonProps>>((props, ref) => {\n    const { size = 'm', type = 'button', iconProps: iconPropsProp = {}, icon, children, ...restProps } = props\n\n    const iconProps: IconProps = {\n      preset: 'brand',\n      size: 'inherit',\n    }\n\n    return (\n      <Styled.Root {...restProps} size={size} type={type} ref={ref}>\n        <Slot\n          render={children}\n          props={iconProps}\n          fallback={\n            <Icon\n              name={typeof icon === 'string' ? icon : undefined}\n              icon={typeof icon !== 'string' ? icon : undefined}\n              {...iconProps}\n              {...iconPropsProp}\n            />\n          }\n        />\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: (props) => (props.square ? SIZES_SQUARE : SIZES),\n  }\n)\n\nexport { IconButton }\n"],"names":["IconButton","withMergedProps","forwardRef","props","ref","size","type","iconProps","iconPropsProp","icon","children","restProps","preset","_jsx","Styled","Slot","render","fallback","Icon","name","undefined","displayName","sizes","square","SIZES_SQUARE","SIZES"],"mappings":"yRAoBA,MAAMA,WAA+DC,gBAAAA,gBAInEC,MAAAA,WAA4D,CAACC,EAAOC,KAClE,MAAMC,KAAEA,EAAO,IAAGC,KAAEA,EAAO,SAAUC,UAAWC,EAAgB,CAAA,EAAEC,KAAEA,EAAIC,SAAEA,KAAaC,GAAcR,EAErG,MAAMI,EAAuB,CAC3BK,OAAQ,QACRP,KAAM,WAGR,OACEQ,WAAAA,IAACC,MAAAA,KAAW,IAAKH,EAAWN,KAAMA,EAAMC,KAAMA,EAAMF,IAAKA,EAAIM,SAC3DG,WAAAA,IAACE,UAAI,CACHC,OAAQN,EACRP,MAAOI,EACPU,SACEJ,WAAAA,IAACK,UAAI,CACHC,YAAaV,GAAS,SAAWA,OAAOW,EACxCX,YAAaA,GAAS,SAAWA,OAAOW,KACpCb,KACAC,UAOhB,CACEa,YAxCmB,aAyCnBC,MAAQnB,GAAWA,EAAMoB,OAASC,MAAAA,aAAeC,MAAAA"}

package/components/IconButton/IconButton.mjs

@@ -1,2 +1,2 @@
-import{forwardRef}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{SIZES_SQUARE,SIZES}from'./sizes.mjs';import{Root}from'./style.mjs';import{jsx}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';const IconButton=withMergedProps(forwardRef((o,r)=>{const{size:t="m",type:e="button",iconProps:s={},icon:i,...n}=o;return jsx(Root,{...n,size:t,type:e,ref:r,children:jsx(Icon,{preset:"brand",size:"inherit",name:typeof i=='string'?i:void 0,icon:typeof i!='string'?i:void 0,...s})})}),{displayName:'IconButton',sizes:o=>o.square?SIZES_SQUARE:SIZES});export{IconButton};
+import{forwardRef}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{SIZES_SQUARE,SIZES}from'./sizes.mjs';import{Root}from'./style.mjs';import{jsx}from'react/jsx-runtime';import{Slot}from'../Slot/Slot.mjs';import{Icon}from'../Icon/Icon.mjs';const IconButton=withMergedProps(forwardRef((o,r)=>{const{size:t="m",type:e="button",iconProps:s={},icon:i,children:n,...m}=o;const p={preset:'brand',size:'inherit'};return jsx(Root,{...m,size:t,type:e,ref:r,children:jsx(Slot,{render:n,props:p,fallback:jsx(Icon,{name:typeof i=='string'?i:void 0,icon:typeof i!='string'?i:void 0,...p,...s})})})}),{displayName:'IconButton',sizes:o=>o.square?SIZES_SQUARE:SIZES});export{IconButton};
 //# sourceMappingURL=IconButton.mjs.map

package/components/IconButton/IconButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.mjs","sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { SIZES, SIZES_SQUARE } from './sizes'\nimport * as Styled from './style'\nimport type { IconButtonProps } from './types'\n\nconst COMPONENT_NAME = 'IconButton'\n\n/**\n *\n * Контрол многоцелевого назначения.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<button\\> элемента.\n */\nconst IconButton: React.ForwardRefExoticComponent<IconButtonProps> = withMergedProps<\n  IconButtonProps,\n  HTMLButtonElement\n>(\n  forwardRef<HTMLButtonElement, MergedProps<IconButtonProps>>((props, ref) => {\n    const { size = 'm', type = 'button', iconProps = {}, icon, ...restProps } = props\n\n    return (\n      <Styled.Root {...restProps} size={size} type={type} ref={ref}>\n        <Icon\n          preset='brand'\n          size='inherit'\n          name={typeof icon === 'string' ? icon : undefined}\n          icon={typeof icon !== 'string' ? icon : undefined}\n          {...iconProps}\n        />\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: (props) => (props.square ? SIZES_SQUARE : SIZES),\n  }\n)\n\nexport { IconButton }\n"],"names":["IconButton","withMergedProps","forwardRef","props","ref","size","type","iconProps","icon","restProps","_jsx","Styled","children","Icon","preset","name","undefined","displayName","sizes","square","SIZES_SQUARE","SIZES"],"mappings":"0OAgBA,MAAMA,WAA+DC,gBAInEC,WAA4D,CAACC,EAAOC,KAClE,MAAMC,KAAEA,EAAO,IAAGC,KAAEA,EAAO,SAAQC,UAAEA,EAAY,CAAA,EAAEC,KAAEA,KAASC,GAAcN,EAE5E,OACEO,IAACC,KAAW,IAAKF,EAAWJ,KAAMA,EAAMC,KAAMA,EAAMF,IAAKA,EAAIQ,SAC3DF,IAACG,KAAI,CACHC,OAAO,QACPT,KAAK,UACLU,YAAaP,GAAS,SAAWA,OAAOQ,EACxCR,YAAaA,GAAS,SAAWA,OAAOQ,KACpCT,QAKZ,CACEU,YA5BmB,aA6BnBC,MAAQf,GAAWA,EAAMgB,OAASC,aAAeC"}
+{"version":3,"file":"IconButton.mjs","sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { Slot } from 'components/Slot'\nimport type { IconProps } from 'components/Icon'\nimport { SIZES, SIZES_SQUARE } from './sizes'\nimport * as Styled from './style'\nimport type { IconButtonProps } from './types'\n\nconst COMPONENT_NAME = 'IconButton'\n\n/**\n *\n * *v1.0.0*\n *\n * Контрол многоцелевого назначения.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<button\\> элемента.\n */\nconst IconButton: React.ForwardRefExoticComponent<IconButtonProps> = withMergedProps<\n  IconButtonProps,\n  HTMLButtonElement\n>(\n  forwardRef<HTMLButtonElement, MergedProps<IconButtonProps>>((props, ref) => {\n    const { size = 'm', type = 'button', iconProps: iconPropsProp = {}, icon, children, ...restProps } = props\n\n    const iconProps: IconProps = {\n      preset: 'brand',\n      size: 'inherit',\n    }\n\n    return (\n      <Styled.Root {...restProps} size={size} type={type} ref={ref}>\n        <Slot\n          render={children}\n          props={iconProps}\n          fallback={\n            <Icon\n              name={typeof icon === 'string' ? icon : undefined}\n              icon={typeof icon !== 'string' ? icon : undefined}\n              {...iconProps}\n              {...iconPropsProp}\n            />\n          }\n        />\n      </Styled.Root>\n    )\n  }),\n  {\n    displayName: COMPONENT_NAME,\n    sizes: (props) => (props.square ? SIZES_SQUARE : SIZES),\n  }\n)\n\nexport { IconButton }\n"],"names":["IconButton","withMergedProps","forwardRef","props","ref","size","type","iconProps","iconPropsProp","icon","children","restProps","preset","_jsx","Styled","Slot","render","fallback","Icon","name","undefined","displayName","sizes","square","SIZES_SQUARE","SIZES"],"mappings":"6QAoBA,MAAMA,WAA+DC,gBAInEC,WAA4D,CAACC,EAAOC,KAClE,MAAMC,KAAEA,EAAO,IAAGC,KAAEA,EAAO,SAAUC,UAAWC,EAAgB,CAAA,EAAEC,KAAEA,EAAIC,SAAEA,KAAaC,GAAcR,EAErG,MAAMI,EAAuB,CAC3BK,OAAQ,QACRP,KAAM,WAGR,OACEQ,IAACC,KAAW,IAAKH,EAAWN,KAAMA,EAAMC,KAAMA,EAAMF,IAAKA,EAAIM,SAC3DG,IAACE,KAAI,CACHC,OAAQN,EACRP,MAAOI,EACPU,SACEJ,IAACK,KAAI,CACHC,YAAaV,GAAS,SAAWA,OAAOW,EACxCX,YAAaA,GAAS,SAAWA,OAAOW,KACpCb,KACAC,UAOhB,CACEa,YAxCmB,aAyCnBC,MAAQnB,GAAWA,EAAMoB,OAASC,aAAeC"}

package/components/IconButton/style.js

@@ -1,2 +1,2 @@
-'use strict';var styled=require('styled-components');var tinycolor=require('tinycolor2');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveMargin=require('../../mixins/responsive-margin.js');var focus=require('../../mixins/focus.js');var style=require('../../shared/utils/style.js');var hover=require('../../mixins/hover.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);var tinycolor__default=_interopDefault(tinycolor);const shouldForwardIconButtonProp=style.createShouldForwardProp(o=>!['square'].includes(o));const template=o=>`\n  color: ${o.color};\n  background-color: ${o.backgroundColor};\n  ${hover.hover(`\n    color: ${o.colorHover};\n    background-color: ${o.backgroundColorHover};\n  `)}\n  &:active {\n    color: ${o.colorActive};\n    background-color: ${o.backgroundColorActive};\n  }\n  &:disabled {\n    color: ${o.colorDisabled};\n    background-color: ${o.backgroundColorDisabled};\n  }\n`;const COLOR_SCHEMA={default:{primary:styled.css(["",""],o=>template({color:o.theme.colors['content-onmain-tertiary'],backgroundColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.theme.colors['bg-oncolor-hover'],colorActive:o.theme.colors['content-onmain-primary'],backgroundColorActive:tinycolor__default.default(o.theme.colors['bg-oncolor-hover']).setAlpha(.12).toString(),colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors.transparent,...o.palette})),secondary:styled.css(["",""],o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-brand-primary-100'],colorHover:o.theme.colors['content-onmain-primary'],backgroundColorHover:tinycolor__default.default(o.theme.colors['bg-brand-primary-100']).darken(5).toString(),colorActive:o.theme.colors['content-onmain-primary'],backgroundColorActive:tinycolor__default.default(o.theme.colors['bg-brand-primary-100']).darken(7).toString(),colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors['bg-disabled-large'],...o.palette}))},contrast:{primary:styled.css(["",""],o=>template({color:o.theme.colors['content-oncolor-tertiary'],backgroundColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.theme.colors['bg-oncontrast-hover'],colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:tinycolor__default.default(o.theme.colors['bg-oncontrast-hover']).setAlpha(.12).toString(),colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors.transparent,...o.palette})),secondary:styled.css(["",""],o=>template({color:o.theme.colors['content-onmain-inverse'],backgroundColor:o.theme.colors['bg-contrast-active'],colorHover:o.theme.colors['content-onmain-inverse'],backgroundColorHover:tinycolor__default.default(o.theme.colors['bg-contrast-active']).lighten(7).toString(),colorActive:o.theme.colors['content-onmain-inverse'],backgroundColorActive:tinycolor__default.default(o.theme.colors['bg-contrast-active']).lighten(11).toString(),colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors['bg-oncolor-disabled'],...o.palette}))}};const Root=styled__default.default.button.withConfig({shouldForwardProp:shouldForwardIconButtonProp}).attrs(o=>({dynamicSizeDeclaration:(r,e)=>({width:'1em',height:'1em',fontSize:typeof r=='string'?r:`${r}${e}`,borderRadius:o.square?'0.2em':'50%'})})).withConfig({displayName:"IconButton__Root",componentId:"ui__sc-y4pwgp-0"})([""," "," "," "," ",""],o=>`\n    box-sizing: border-box;\n    appearance: none;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    padding: 0;\n    margin: 0;\n    border: none;\n    cursor: ${o.disabled?'not-allowed':'pointer'};\n    transition-property: background-color; \n    transition-duration: 250ms;\n  `,o=>{const r=o.contrast?COLOR_SCHEMA.contrast:COLOR_SCHEMA.default;return o.secondary?r.secondary:r.primary},focus.focus,responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);exports.Root=Root;
+'use strict';var styled=require('styled-components');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveMargin=require('../../mixins/responsive-margin.js');var focus=require('../../mixins/focus.js');var style=require('../../shared/utils/style.js');var colors=require('../../shared/utils/colors.js');var hover=require('../../mixins/hover.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const shouldForwardIconButtonProp=style.createShouldForwardProp(o=>!['square','filled'].includes(o));const template=o=>`\n  color: ${o.color};\n  background-color: ${o.backgroundColor};\n  ${hover.hover(`\n    color: ${o.colorHover};\n    background-color: ${o.backgroundColorHover};\n  `)}\n  &:active {\n    color: ${o.colorActive};\n    background-color: ${o.backgroundColorActive};\n  }\n  &:disabled {\n    color: ${o.colorDisabled};\n    background-color: ${o.backgroundColorDisabled};\n  }\n`;const COLOR_SCHEMA={default:{primary:styled.css(["",""],o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.theme.colors['bg-oncolor-hover'],colorActive:o.theme.colors['content-onmain-primary'],backgroundColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors.transparent,...o.palette})),secondary:styled.css(["",""],o=>template({color:o.theme.colors['content-onmain-tertiary'],backgroundColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.theme.colors['bg-oncolor-hover'],colorActive:o.theme.colors['content-onmain-tertiary'],backgroundColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors.transparent,...o.palette})),filled:styled.css(["",""],o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-brand-primary-100'],colorHover:o.theme.colors['content-onmain-primary'],backgroundColorHover:colors.getDarkHoverColor(o.theme.colors['bg-brand-primary-100']),colorActive:o.theme.colors['content-onmain-primary'],backgroundColorActive:o.theme.colors['bg-brand-primary-100'],colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors['bg-disabled-large'],...o.palette}))},contrast:{primary:styled.css(["",""],o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.theme.colors['bg-oncontrast-hover'],colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors.transparent,...o.palette})),secondary:styled.css(["",""],o=>template({color:o.theme.colors['content-oncolor-tertiary'],backgroundColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.theme.colors['bg-oncontrast-hover'],colorActive:o.theme.colors['content-oncolor-tertiary'],backgroundColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors['bg-oncolor-disabled'],...o.palette})),filled:styled.css(["",""],o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.theme.colors['bg-contrast-active'],colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:colors.getLightHoverColor(o.theme.colors['bg-contrast-active']),colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.theme.colors['bg-contrast-active'],colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors['bg-oncolor-disabled'],...o.palette}))}};const Root=styled__default.default.button.withConfig({shouldForwardProp:shouldForwardIconButtonProp}).attrs(o=>({dynamicSizeDeclaration:(r,e)=>({width:'1em',height:'1em',fontSize:typeof r=='string'?r:`${r}${e}`,borderRadius:o.square?'0.2em':'50%'})})).withConfig({displayName:"IconButton__Root",componentId:"ui__sc-y4pwgp-0"})([""," "," "," "," ",""],o=>`\n    box-sizing: border-box;\n    appearance: none;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    padding: 0;\n    margin: 0;\n    border: none;\n    cursor: ${o.disabled?'not-allowed':'pointer'};\n    transition-property: background-color; \n    transition-duration: 250ms;\n  `,o=>{const r=o.contrast?COLOR_SCHEMA.contrast:COLOR_SCHEMA.default;return o.filled?r.filled:o.secondary?r.secondary:r.primary},focus.focus,responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);exports.Root=Root;
 //# sourceMappingURL=style.js.map

package/components/IconButton/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/IconButton/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport { focus } from 'mixins/focus'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport type { CSSColor } from 'shared/types'\nimport { hover } from 'mixins/hover'\nimport type { IconButtonPalette, StyledIconButtonProps } from './types'\n\nconst shouldForwardIconButtonProp = createShouldForwardProp((propKey) => !['square'].includes(propKey))\n\nconst template = (palette: IconButtonPalette) => `\n  color: ${palette.color};\n  background-color: ${palette.backgroundColor};\n  ${hover(`\n    color: ${palette.colorHover};\n    background-color: ${palette.backgroundColorHover};\n  `)}\n  &:active {\n    color: ${palette.colorActive};\n    background-color: ${palette.backgroundColorActive};\n  }\n  &:disabled {\n    color: ${palette.colorDisabled};\n    background-color: ${palette.backgroundColorDisabled};\n  }\n`\n\nconst COLOR_SCHEMA = {\n  default: {\n    primary: css<StyledIconButtonProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-tertiary'],\n          backgroundColor: props.theme.colors.transparent,\n          colorHover: props.theme.colors['content-onmain-primary'],\n          backgroundColorHover: props.theme.colors['bg-oncolor-hover'],\n          colorActive: props.theme.colors['content-onmain-primary'],\n          backgroundColorActive: tinycolor(props.theme.colors['bg-oncolor-hover'])\n            .setAlpha(0.12)\n            .toString() as CSSColor,\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors.transparent,\n          ...props.palette,\n        })}\n    `,\n    secondary: css<StyledIconButtonProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-primary'],\n          backgroundColor: props.theme.colors['bg-brand-primary-100'],\n          colorHover: props.theme.colors['content-onmain-primary'],\n          backgroundColorHover: tinycolor(props.theme.colors['bg-brand-primary-100']).darken(5).toString() as CSSColor,\n          colorActive: props.theme.colors['content-onmain-primary'],\n          backgroundColorActive: tinycolor(props.theme.colors['bg-brand-primary-100']).darken(7).toString() as CSSColor,\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n  },\n  contrast: {\n    primary: css<StyledIconButtonProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-oncolor-tertiary'],\n          backgroundColor: props.theme.colors.transparent,\n          colorHover: props.theme.colors['content-oncolor-primary'],\n          backgroundColorHover: props.theme.colors['bg-oncontrast-hover'],\n          colorActive: props.theme.colors['content-oncolor-primary'],\n          backgroundColorActive: tinycolor(props.theme.colors['bg-oncontrast-hover'])\n            .setAlpha(0.12)\n            .toString() as CSSColor,\n          colorDisabled: props.theme.colors['content-oncolor-disabled'],\n          backgroundColorDisabled: props.theme.colors.transparent,\n          ...props.palette,\n        })}\n    `,\n    secondary: css<StyledIconButtonProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-inverse'],\n          backgroundColor: props.theme.colors['bg-contrast-active'],\n          colorHover: props.theme.colors['content-onmain-inverse'],\n          backgroundColorHover: tinycolor(props.theme.colors['bg-contrast-active']).lighten(7).toString() as CSSColor,\n          colorActive: props.theme.colors['content-onmain-inverse'],\n          backgroundColorActive: tinycolor(props.theme.colors['bg-contrast-active']).lighten(11).toString() as CSSColor,\n          colorDisabled: props.theme.colors['content-oncolor-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n          ...props.palette,\n        })}\n    `,\n  },\n}\n\nexport const Root = styled.button\n  .withConfig<StyledIconButtonProps>({\n    shouldForwardProp: shouldForwardIconButtonProp,\n  })\n  .attrs<StyledIconButtonProps>(\n    (props): Required<Pick<StyledIconButtonProps, 'dynamicSizeDeclaration'>> => ({\n      dynamicSizeDeclaration: (size, sizeUnits) => ({\n        width: '1em',\n        height: '1em',\n        fontSize: typeof size === 'string' ? size : `${size}${sizeUnits}`,\n        borderRadius: props.square ? '0.2em' : '50%',\n      }),\n    })\n  )`\n  ${(props) => `\n    box-sizing: border-box;\n    appearance: none;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    padding: 0;\n    margin: 0;\n    border: none;\n    cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n    transition-property: background-color; \n    transition-duration: 250ms;\n  `}\n\n  ${(props) => {\n    const schema = props.contrast ? COLOR_SCHEMA.contrast : COLOR_SCHEMA.default\n\n    if (props.secondary) return schema.secondary\n\n    return schema.primary\n  }}\n\n  ${focus}\n  ${responsiveSize}\n  ${responsiveMargin}\n`\n"],"names":["shouldForwardIconButtonProp","createShouldForwardProp","propKey","includes","template","palette","color","backgroundColor","hover","colorHover","backgroundColorHover","colorActive","backgroundColorActive","colorDisabled","backgroundColorDisabled","COLOR_SCHEMA","default","primary","css","props","theme","colors","transparent","tinycolor","setAlpha","toString","secondary","darken","contrast","lighten","Root","styled","button","withConfig","shouldForwardProp","attrs","dynamicSizeDeclaration","size","sizeUnits","width","height","fontSize","borderRadius","square","displayName","componentId","disabled","schema","focus","responsiveSize","responsiveMargin"],"mappings":"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"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/IconButton/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport { focus } from 'mixins/focus'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { getDarkHoverColor, getLightHoverColor } from 'shared/utils/colors'\nimport { hover } from 'mixins/hover'\nimport type { IconButtonPalette, StyledIconButtonProps } from './types'\n\nconst shouldForwardIconButtonProp = createShouldForwardProp((propKey) => !['square', 'filled'].includes(propKey))\n\nconst template = (palette: IconButtonPalette) => `\n  color: ${palette.color};\n  background-color: ${palette.backgroundColor};\n  ${hover(`\n    color: ${palette.colorHover};\n    background-color: ${palette.backgroundColorHover};\n  `)}\n  &:active {\n    color: ${palette.colorActive};\n    background-color: ${palette.backgroundColorActive};\n  }\n  &:disabled {\n    color: ${palette.colorDisabled};\n    background-color: ${palette.backgroundColorDisabled};\n  }\n`\n\nconst COLOR_SCHEMA = {\n  default: {\n    primary: css<StyledIconButtonProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-primary'],\n          backgroundColor: props.theme.colors.transparent,\n          colorHover: props.theme.colors['content-onmain-primary'],\n          backgroundColorHover: props.theme.colors['bg-oncolor-hover'],\n          colorActive: props.theme.colors['content-onmain-primary'],\n          backgroundColorActive: props.theme.colors.transparent,\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors.transparent,\n          ...props.palette,\n        })}\n    `,\n    secondary: css<StyledIconButtonProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-tertiary'],\n          backgroundColor: props.theme.colors.transparent,\n          colorHover: props.theme.colors['content-onmain-primary'],\n          backgroundColorHover: props.theme.colors['bg-oncolor-hover'],\n          colorActive: props.theme.colors['content-onmain-tertiary'],\n          backgroundColorActive: props.theme.colors.transparent,\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors.transparent,\n          ...props.palette,\n        })}\n    `,\n    filled: css<StyledIconButtonProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-primary'],\n          backgroundColor: props.theme.colors['bg-brand-primary-100'],\n          colorHover: props.theme.colors['content-onmain-primary'],\n          backgroundColorHover: getDarkHoverColor(props.theme.colors['bg-brand-primary-100']),\n          colorActive: props.theme.colors['content-onmain-primary'],\n          backgroundColorActive: props.theme.colors['bg-brand-primary-100'],\n          colorDisabled: props.theme.colors['content-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n  },\n  contrast: {\n    primary: css<StyledIconButtonProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.theme.colors.transparent,\n          colorHover: props.theme.colors['content-oncolor-primary'],\n          backgroundColorHover: props.theme.colors['bg-oncontrast-hover'],\n          colorActive: props.theme.colors['content-oncolor-primary'],\n          backgroundColorActive: props.theme.colors.transparent,\n          colorDisabled: props.theme.colors['content-oncolor-disabled'],\n          backgroundColorDisabled: props.theme.colors.transparent,\n          ...props.palette,\n        })}\n    `,\n    secondary: css<StyledIconButtonProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-oncolor-tertiary'],\n          backgroundColor: props.theme.colors.transparent,\n          colorHover: props.theme.colors['content-oncolor-primary'],\n          backgroundColorHover: props.theme.colors['bg-oncontrast-hover'],\n          colorActive: props.theme.colors['content-oncolor-tertiary'],\n          backgroundColorActive: props.theme.colors.transparent,\n          colorDisabled: props.theme.colors['content-oncolor-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n          ...props.palette,\n        })}\n    `,\n    filled: css<StyledIconButtonProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-oncolor-primary'],\n          backgroundColor: props.theme.colors['bg-contrast-active'],\n          colorHover: props.theme.colors['content-oncolor-primary'],\n          backgroundColorHover: getLightHoverColor(props.theme.colors['bg-contrast-active']),\n          colorActive: props.theme.colors['content-oncolor-primary'],\n          backgroundColorActive: props.theme.colors['bg-contrast-active'],\n          colorDisabled: props.theme.colors['content-oncolor-disabled'],\n          backgroundColorDisabled: props.theme.colors['bg-oncolor-disabled'],\n          ...props.palette,\n        })}\n    `,\n  },\n}\n\nexport const Root = styled.button\n  .withConfig<StyledIconButtonProps>({\n    shouldForwardProp: shouldForwardIconButtonProp,\n  })\n  .attrs<StyledIconButtonProps>(\n    (props): Required<Pick<StyledIconButtonProps, 'dynamicSizeDeclaration'>> => ({\n      dynamicSizeDeclaration: (size, sizeUnits) => ({\n        width: '1em',\n        height: '1em',\n        fontSize: typeof size === 'string' ? size : `${size}${sizeUnits}`,\n        borderRadius: props.square ? '0.2em' : '50%',\n      }),\n    })\n  )`\n  ${(props) => `\n    box-sizing: border-box;\n    appearance: none;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    padding: 0;\n    margin: 0;\n    border: none;\n    cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n    transition-property: background-color; \n    transition-duration: 250ms;\n  `}\n\n  ${(props) => {\n    const schema = props.contrast ? COLOR_SCHEMA.contrast : COLOR_SCHEMA.default\n\n    if (props.filled) return schema.filled\n    if (props.secondary) return schema.secondary\n\n    return schema.primary\n  }}\n\n  ${focus}\n  ${responsiveSize}\n  ${responsiveMargin}\n`\n"],"names":["shouldForwardIconButtonProp","createShouldForwardProp","propKey","includes","template","palette","color","backgroundColor","hover","colorHover","backgroundColorHover","colorActive","backgroundColorActive","colorDisabled","backgroundColorDisabled","COLOR_SCHEMA","default","primary","css","props","theme","colors","transparent","secondary","filled","getDarkHoverColor","contrast","getLightHoverColor","Root","styled","button","withConfig","shouldForwardProp","attrs","dynamicSizeDeclaration","size","sizeUnits","width","height","fontSize","borderRadius","square","displayName","componentId","disabled","schema","focus","responsiveSize","responsiveMargin"],"mappings":"4dASA,MAAMA,4BAA8BC,MAAAA,wBAAyBC,IAAa,CAAC,SAAU,UAAUC,SAASD,IAExG,MAAME,SAAYC,GAA+B,cACtCA,EAAQC,+BACGD,EAAQE,uBAC1BC,YAAM,gBACGH,EAAQI,sCACGJ,EAAQK,0DAGnBL,EAAQM,uCACGN,EAAQO,2DAGnBP,EAAQQ,yCACGR,EAAQS,kCAIhC,MAAMC,aAAe,CACnBC,QAAS,CACPC,QAASC,OAAAA,IAAG,CAAA,GAAA,IACPC,GACDf,SAAS,CACPE,MAAOa,EAAMC,MAAMC,OAAO,0BAC1Bd,gBAAiBY,EAAMC,MAAMC,OAAOC,YACpCb,WAAYU,EAAMC,MAAMC,OAAO,0BAC/BX,qBAAsBS,EAAMC,MAAMC,OAAO,oBACzCV,YAAaQ,EAAMC,MAAMC,OAAO,0BAChCT,sBAAuBO,EAAMC,MAAMC,OAAOC,YAC1CT,cAAeM,EAAMC,MAAMC,OAAO,oBAClCP,wBAAyBK,EAAMC,MAAMC,OAAOC,eACzCH,EAAMd,WAGfkB,UAAWL,OAAAA,IAAG,CAAA,GAAA,IACTC,GACDf,SAAS,CACPE,MAAOa,EAAMC,MAAMC,OAAO,2BAC1Bd,gBAAiBY,EAAMC,MAAMC,OAAOC,YACpCb,WAAYU,EAAMC,MAAMC,OAAO,0BAC/BX,qBAAsBS,EAAMC,MAAMC,OAAO,oBACzCV,YAAaQ,EAAMC,MAAMC,OAAO,2BAChCT,sBAAuBO,EAAMC,MAAMC,OAAOC,YAC1CT,cAAeM,EAAMC,MAAMC,OAAO,oBAClCP,wBAAyBK,EAAMC,MAAMC,OAAOC,eACzCH,EAAMd,WAGfmB,OAAQN,OAAAA,IAAG,CAAA,GAAA,IACNC,GACDf,SAAS,CACPE,MAAOa,EAAMC,MAAMC,OAAO,0BAC1Bd,gBAAiBY,EAAMC,MAAMC,OAAO,wBACpCZ,WAAYU,EAAMC,MAAMC,OAAO,0BAC/BX,qBAAsBe,OAAAA,kBAAkBN,EAAMC,MAAMC,OAAO,yBAC3DV,YAAaQ,EAAMC,MAAMC,OAAO,0BAChCT,sBAAuBO,EAAMC,MAAMC,OAAO,wBAC1CR,cAAeM,EAAMC,MAAMC,OAAO,oBAClCP,wBAAyBK,EAAMC,MAAMC,OAAO,wBACzCF,EAAMd,YAIjBqB,SAAU,CACRT,QAASC,OAAAA,IAAG,CAAA,GAAA,IACPC,GACDf,SAAS,CACPE,MAAOa,EAAMC,MAAMC,OAAO,2BAC1Bd,gBAAiBY,EAAMC,MAAMC,OAAOC,YACpCb,WAAYU,EAAMC,MAAMC,OAAO,2BAC/BX,qBAAsBS,EAAMC,MAAMC,OAAO,uBACzCV,YAAaQ,EAAMC,MAAMC,OAAO,2BAChCT,sBAAuBO,EAAMC,MAAMC,OAAOC,YAC1CT,cAAeM,EAAMC,MAAMC,OAAO,4BAClCP,wBAAyBK,EAAMC,MAAMC,OAAOC,eACzCH,EAAMd,WAGfkB,UAAWL,OAAAA,IAAG,CAAA,GAAA,IACTC,GACDf,SAAS,CACPE,MAAOa,EAAMC,MAAMC,OAAO,4BAC1Bd,gBAAiBY,EAAMC,MAAMC,OAAOC,YACpCb,WAAYU,EAAMC,MAAMC,OAAO,2BAC/BX,qBAAsBS,EAAMC,MAAMC,OAAO,uBACzCV,YAAaQ,EAAMC,MAAMC,OAAO,4BAChCT,sBAAuBO,EAAMC,MAAMC,OAAOC,YAC1CT,cAAeM,EAAMC,MAAMC,OAAO,4BAClCP,wBAAyBK,EAAMC,MAAMC,OAAO,0BACzCF,EAAMd,WAGfmB,OAAQN,OAAAA,IAAG,CAAA,GAAA,IACNC,GACDf,SAAS,CACPE,MAAOa,EAAMC,MAAMC,OAAO,2BAC1Bd,gBAAiBY,EAAMC,MAAMC,OAAO,sBACpCZ,WAAYU,EAAMC,MAAMC,OAAO,2BAC/BX,qBAAsBiB,OAAAA,mBAAmBR,EAAMC,MAAMC,OAAO,uBAC5DV,YAAaQ,EAAMC,MAAMC,OAAO,2BAChCT,sBAAuBO,EAAMC,MAAMC,OAAO,sBAC1CR,cAAeM,EAAMC,MAAMC,OAAO,4BAClCP,wBAAyBK,EAAMC,MAAMC,OAAO,0BACzCF,EAAMd,aAMZ,MAAMuB,KAAOC,gBAAAA,QAAOC,OACxBC,WAAkC,CACjCC,kBAAmBhC,8BAEpBiC,MACEd,IAAK,CACJe,uBAAwBA,CAACC,EAAMC,KAAS,CACtCC,MAAO,MACPC,OAAQ,MACRC,gBAAiBJ,GAAS,SAAWA,EAAO,GAAGA,IAAOC,IACtDI,aAAcrB,EAAMsB,OAAS,QAAU,WAG5CV,WAAA,CAAAW,YAAA,mBAAAC,YAAA,mBAbiBd,CAajB,CAAA,GAAA,IAAA,IAAA,IAAA,IAAA,IACEV,GAAU,iOAUDA,EAAMyB,SAAW,cAAgB,+FAK1CzB,IACD,MAAM0B,EAAS1B,EAAMO,SAAWX,aAAaW,SAAWX,aAAaC,QAErE,OAAIG,EAAMK,OAAeqB,EAAOrB,OAC5BL,EAAMI,UAAkBsB,EAAOtB,UAE5BsB,EAAO5B,SAGd6B,MAAAA,MACAC,eAAAA,eACAC,iBAAAA"}

package/components/IconButton/style.mjs

@@ -1,2 +1,2 @@
-import styled,{css}from'styled-components';import tinycolor from'tinycolor2';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveMargin}from'../../mixins/responsive-margin.mjs';import{focus}from'../../mixins/focus.mjs';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{hover}from'../../mixins/hover.mjs';const shouldForwardIconButtonProp=createShouldForwardProp(o=>!['square'].includes(o));const template=o=>`\n  color: ${o.color};\n  background-color: ${o.backgroundColor};\n  ${hover(`\n    color: ${o.colorHover};\n    background-color: ${o.backgroundColorHover};\n  `)}\n  &:active {\n    color: ${o.colorActive};\n    background-color: ${o.backgroundColorActive};\n  }\n  &:disabled {\n    color: ${o.colorDisabled};\n    background-color: ${o.backgroundColorDisabled};\n  }\n`;const COLOR_SCHEMA={default:{primary:css(["",""],o=>template({color:o.theme.colors['content-onmain-tertiary'],backgroundColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.theme.colors['bg-oncolor-hover'],colorActive:o.theme.colors['content-onmain-primary'],backgroundColorActive:tinycolor(o.theme.colors['bg-oncolor-hover']).setAlpha(.12).toString(),colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors.transparent,...o.palette})),secondary:css(["",""],o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-brand-primary-100'],colorHover:o.theme.colors['content-onmain-primary'],backgroundColorHover:tinycolor(o.theme.colors['bg-brand-primary-100']).darken(5).toString(),colorActive:o.theme.colors['content-onmain-primary'],backgroundColorActive:tinycolor(o.theme.colors['bg-brand-primary-100']).darken(7).toString(),colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors['bg-disabled-large'],...o.palette}))},contrast:{primary:css(["",""],o=>template({color:o.theme.colors['content-oncolor-tertiary'],backgroundColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.theme.colors['bg-oncontrast-hover'],colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:tinycolor(o.theme.colors['bg-oncontrast-hover']).setAlpha(.12).toString(),colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors.transparent,...o.palette})),secondary:css(["",""],o=>template({color:o.theme.colors['content-onmain-inverse'],backgroundColor:o.theme.colors['bg-contrast-active'],colorHover:o.theme.colors['content-onmain-inverse'],backgroundColorHover:tinycolor(o.theme.colors['bg-contrast-active']).lighten(7).toString(),colorActive:o.theme.colors['content-onmain-inverse'],backgroundColorActive:tinycolor(o.theme.colors['bg-contrast-active']).lighten(11).toString(),colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors['bg-oncolor-disabled'],...o.palette}))}};const Root=styled.button.withConfig({shouldForwardProp:shouldForwardIconButtonProp}).attrs(o=>({dynamicSizeDeclaration:(r,e)=>({width:'1em',height:'1em',fontSize:typeof r=='string'?r:`${r}${e}`,borderRadius:o.square?'0.2em':'50%'})})).withConfig({displayName:"IconButton__Root",componentId:"ui__sc-y4pwgp-0"})([""," "," "," "," ",""],o=>`\n    box-sizing: border-box;\n    appearance: none;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    padding: 0;\n    margin: 0;\n    border: none;\n    cursor: ${o.disabled?'not-allowed':'pointer'};\n    transition-property: background-color; \n    transition-duration: 250ms;\n  `,o=>{const r=o.contrast?COLOR_SCHEMA.contrast:COLOR_SCHEMA.default;return o.secondary?r.secondary:r.primary},focus,responsiveSize,responsiveMargin);export{Root};
+import styled,{css}from'styled-components';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveMargin}from'../../mixins/responsive-margin.mjs';import{focus}from'../../mixins/focus.mjs';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{getLightHoverColor,getDarkHoverColor}from'../../shared/utils/colors.mjs';import{hover}from'../../mixins/hover.mjs';const shouldForwardIconButtonProp=createShouldForwardProp(o=>!['square','filled'].includes(o));const template=o=>`\n  color: ${o.color};\n  background-color: ${o.backgroundColor};\n  ${hover(`\n    color: ${o.colorHover};\n    background-color: ${o.backgroundColorHover};\n  `)}\n  &:active {\n    color: ${o.colorActive};\n    background-color: ${o.backgroundColorActive};\n  }\n  &:disabled {\n    color: ${o.colorDisabled};\n    background-color: ${o.backgroundColorDisabled};\n  }\n`;const COLOR_SCHEMA={default:{primary:css(["",""],o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.theme.colors['bg-oncolor-hover'],colorActive:o.theme.colors['content-onmain-primary'],backgroundColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors.transparent,...o.palette})),secondary:css(["",""],o=>template({color:o.theme.colors['content-onmain-tertiary'],backgroundColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.theme.colors['bg-oncolor-hover'],colorActive:o.theme.colors['content-onmain-tertiary'],backgroundColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors.transparent,...o.palette})),filled:css(["",""],o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-brand-primary-100'],colorHover:o.theme.colors['content-onmain-primary'],backgroundColorHover:getDarkHoverColor(o.theme.colors['bg-brand-primary-100']),colorActive:o.theme.colors['content-onmain-primary'],backgroundColorActive:o.theme.colors['bg-brand-primary-100'],colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors['bg-disabled-large'],...o.palette}))},contrast:{primary:css(["",""],o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.theme.colors['bg-oncontrast-hover'],colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors.transparent,...o.palette})),secondary:css(["",""],o=>template({color:o.theme.colors['content-oncolor-tertiary'],backgroundColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.theme.colors['bg-oncontrast-hover'],colorActive:o.theme.colors['content-oncolor-tertiary'],backgroundColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors['bg-oncolor-disabled'],...o.palette})),filled:css(["",""],o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.theme.colors['bg-contrast-active'],colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:getLightHoverColor(o.theme.colors['bg-contrast-active']),colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.theme.colors['bg-contrast-active'],colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors['bg-oncolor-disabled'],...o.palette}))}};const Root=styled.button.withConfig({shouldForwardProp:shouldForwardIconButtonProp}).attrs(o=>({dynamicSizeDeclaration:(r,e)=>({width:'1em',height:'1em',fontSize:typeof r=='string'?r:`${r}${e}`,borderRadius:o.square?'0.2em':'50%'})})).withConfig({displayName:"IconButton__Root",componentId:"ui__sc-y4pwgp-0"})([""," "," "," "," ",""],o=>`\n    box-sizing: border-box;\n    appearance: none;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    padding: 0;\n    margin: 0;\n    border: none;\n    cursor: ${o.disabled?'not-allowed':'pointer'};\n    transition-property: background-color; \n    transition-duration: 250ms;\n  `,o=>{const r=o.contrast?COLOR_SCHEMA.contrast:COLOR_SCHEMA.default;return o.filled?r.filled:o.secondary?r.secondary:r.primary},focus,responsiveSize,responsiveMargin);export{Root};
 //# sourceMappingURL=style.mjs.map