@foxford/ui 2.52.0 → 2.53.0

package/_virtual/index7.mjs

@@ -1,2 +1,2 @@
-var WarningTriangleFill={};export{WarningTriangleFill as __exports};
+var ResizeHandle={};export{ResizeHandle as __exports};
 //# sourceMappingURL=index7.mjs.map

package/_virtual/index8.js

@@ -0,0 +1,2 @@
+'use strict';exports.__exports={};
+//# sourceMappingURL=index8.js.map

package/_virtual/index8.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index8.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/_virtual/index8.mjs

@@ -0,0 +1,2 @@
+var WarningTriangleFill={};export{WarningTriangleFill as __exports};
+//# sourceMappingURL=index8.mjs.map

package/_virtual/index8.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index8.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/components/DialogComponent/DialogComponent.js

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');var ResizeObserver=require('../../external/.pnpm/resize-observer-polyfill@1.5.1/node_modules/resize-observer-polyfill/dist/ResizeObserver.js');var withMergedProps=require('../../hocs/withMergedProps.js');var constants$1=require('../../shared/constants.js');var dom=require('../../shared/utils/dom.js');var DialogContainer=require('./DialogContainer.js');var dragging=require('./images/dragging.svg.js');var style=require('./style.js');var utils=require('./utils.js');var constants=require('./constants.js');var require$$0=require('react/jsx-runtime');var Visibility=require('../Visibility/Visibility.js');var Spacer=require('../Spacer/Spacer.js');var Icon=require('../Icon/Icon.js');var Skeleton=require('../Skeleton/Skeleton.js');var Text=require('../Text/Text.js');var Button=require('../Button/Button.js');const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver.default((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const DialogComponent=withMergedProps.withMergedProps(React.forwardRef(((e,r)=>{const{size:i="s",iconButtonProps:t={},captionProps:s={},titleProps:n={},subtitleProps:o={},draggingIconProps:a={},imgSrc:l={},skeletonProps:c={},fancy:d,floats:u,children:$,caption:g,title:x,subtitle:y,controls:p,imgLandscapePositionRight:S,imgPortraitPositionBottom:q,className:j,backgroundClassName:h,scrollFadingDisabled:b,draggable:I,loading:m,sizeXXS:z,sizeXS:T,sizeS:v,sizeM:k,sizeL:P,sizeXL:B,onGrab:w,onNudge:C,...R}=e;const D={size:i,sizeXXS:z,sizeXS:T,sizeS:v,sizeM:k,sizeL:P,sizeXL:B};const E=utils.getCommonSizeProps(D);const f=d?j:dom.concatClassNames(j,h);const[M,L]=React.useState(null);const[V,_]=React.useState(null);const A=React.useRef(null);const N=React.useCallback((e=>{e.scrollHeight===e.clientHeight?(L(null),_(null)):(L(e.scrollTop<=0),_(Math.abs(e.scrollHeight-e.clientHeight-e.scrollTop)<=1))}),[]);return React.useLayoutEffect((()=>(!b&&A.current&&(A.current[resizeHandlerSymbol]=N,resizeObserver.observe(A.current)),()=>{A.current&&resizeObserver.unobserve(A.current)})),[N,b]),require$$0.jsxs(style.Root,{...R,...D,className:f,fancy:d,ref:r,children:[u&&u(E),d&&require$$0.jsx(style.FancyBackground,{className:h}),d&&t.onClick&&require$$0.jsx(style.PositionedIconButton,{secondary:!0,size:"xxl",icon:"close",inset:{top:0,right:0},...t}),(I||l.portrait&&!q||d)&&require$$0.jsxs(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_PORTRAIT,children:[d&&require$$0.jsx(Spacer.Spacer,{top:96}),I&&require$$0.jsx(style.DraggingHandle,{onPointerDown:w,children:require$$0.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:C,children:require$$0.jsx(Icon.Icon,{icon:require$$0.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary",...a})})}),l.portrait&&!q&&require$$0.jsx(style.MediaPortraitContainer,{top:!d,children:require$$0.jsxs(style.MediaPortrait,{children:[require$$0.jsx(style.Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),m?require$$0.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):require$$0.jsx(style.Media,{src:l.portrait})]})})]}),l.landscape&&!S&&require$$0.jsx(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_LANDSCAPE_MEDIA,children:require$$0.jsxs(style.MediaLandscape,{children:[require$$0.jsx(style.Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),m?require$$0.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):require$$0.jsx(style.Media,{src:l.landscape})]})}),!d&&t.onClick&&require$$0.jsx(style.PositionedIconButton,{size:"l",icon:"close",inset:{top:8,right:8},...t}),require$$0.jsxs(DialogContainer.DialogContainer,{...D,fancy:d,children:[I&&require$$0.jsx(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_LANDSCAPE,children:require$$0.jsx(style.DraggingHandle,{onPointerDown:w,children:require$$0.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:C,children:require$$0.jsx(Icon.Icon,{icon:require$$0.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary",...a})})})}),require$$0.jsx(style.Fading,{visible:M===!1}),require$$0.jsx(style.ScrollableContent,{ref:A,tabIndex:0,onScroll:e=>{b||N(e.currentTarget)},onKeyDown:e=>{constants$1.keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):constants$1.keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:require$$0.jsxs(require$$0.Fragment,m?{children:[require$$0.jsx(Skeleton.Skeleton,{children:require$$0.jsx(Text.Text,{appearance:"heading",marginBottom:"1.5em",sizes:constants.SIZES_TITLE,...E,...n})}),require$$0.jsx(Skeleton.Skeleton,{width:"90%",children:require$$0.jsx(Text.Text,{appearance:"body",marginBottom:"0.4em",sizes:constants.SIZES_SUBTITLE,...E,...o})}),require$$0.jsx(Skeleton.Skeleton,{width:"70%",children:require$$0.jsx(Text.Text,{appearance:"body",marginBottom:"0.4em",sizes:constants.SIZES_SUBTITLE,...E,...o})}),require$$0.jsx(Skeleton.Skeleton,{width:"50%",children:require$$0.jsx(Text.Text,{appearance:"body",marginBottom:"0.8em",sizes:constants.SIZES_SUBTITLE,...E,...o})})]}:{children:[g&&require$$0.jsx(Text.Text,{appearance:"body",color:"content-onmain-tertiary",wordBreak:"break-word",marginBottom:"0.8em",sizes:constants.SIZES_CAPTION,...E,...s,children:g}),x&&require$$0.jsx(Text.Text,{as:"h2",appearance:"heading",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.5em",sizes:constants.SIZES_TITLE,...E,...n,children:x}),y&&require$$0.jsx(Text.Text,{as:"p",appearance:"body",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.8em",sizes:constants.SIZES_SUBTITLE,...E,...o,children:y}),$]})}),require$$0.jsx(style.Fading,{visible:V===!1,after:!0}),p&&require$$0.jsx(style.Controls,{children:m?require$$0.jsx(Skeleton.Skeleton,{borderRadius:48,...c,children:require$$0.jsx(Button.Button,{preset:"brand",...E})}):p(E)})]}),l.landscape&&S&&require$$0.jsx(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_LANDSCAPE_MEDIA,children:require$$0.jsxs(style.MediaLandscape,{right:!0,children:[require$$0.jsx(style.Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),m?require$$0.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):require$$0.jsx(style.Media,{src:l.landscape})]})}),l.portrait&&q&&require$$0.jsx(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_PORTRAIT,children:require$$0.jsx(style.MediaPortraitContainer,{bottom:!0,children:require$$0.jsxs(style.MediaPortrait,{children:[require$$0.jsx(style.Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),m?require$$0.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):require$$0.jsx(style.Media,{src:l.portrait})]})})})]})})),{sizes:e=>e.fancy?constants.SIZES_FANCY:constants.SIZES,displayName:'DialogComponent'});exports.SIZES=constants.SIZES,exports.SIZES_FANCY=constants.SIZES_FANCY,exports.DialogComponent=DialogComponent;
+'use strict';var React=require('react');var ResizeObserver=require('../../external/.pnpm/resize-observer-polyfill@1.5.1/node_modules/resize-observer-polyfill/dist/ResizeObserver.js');var withMergedProps=require('../../hocs/withMergedProps.js');var constants$1=require('../../shared/constants.js');var dom=require('../../shared/utils/dom.js');var DialogContainer=require('./DialogContainer.js');var dragging=require('./images/dragging.svg.js');var style=require('./style.js');var utils=require('./utils.js');var constants=require('./constants.js');var require$$0=require('react/jsx-runtime');var Visibility=require('../Visibility/Visibility.js');var Spacer=require('../Spacer/Spacer.js');var Icon=require('../Icon/Icon.js');var Skeleton=require('../Skeleton/Skeleton.js');var Text=require('../Text/Text.js');var Button=require('../Button/Button.js');const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver.default((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const DialogComponent=withMergedProps.withMergedProps(React.forwardRef(((e,r)=>{const{size:i="s",iconButtonProps:t={},captionProps:s={},titleProps:n={},subtitleProps:o={},draggingIconProps:a={},imgSrc:l={},skeletonProps:c={},fancy:d,floats:u,children:$,caption:g,title:x,subtitle:y,controls:p,imgLandscapePositionRight:S,imgPortraitPositionBottom:q,className:j,backgroundClassName:h,scrollFadingDisabled:b,draggable:I,loading:m,sizeXXS:z,sizeXS:T,sizeS:v,sizeM:k,sizeL:P,sizeXL:B,onGrab:w,onNudge:C,...R}=e;const D={size:i,sizeXXS:z,sizeXS:T,sizeS:v,sizeM:k,sizeL:P,sizeXL:B};const E=utils.getCommonSizeProps(D);const f=d?j:dom.concatClassNames(j,h);const[M,L]=React.useState(null);const[V,_]=React.useState(null);const A=React.useRef(null);const N=React.useCallback((e=>{e.scrollHeight===e.clientHeight?(L(null),_(null)):(L(e.scrollTop<=0),_(Math.abs(e.scrollHeight-e.clientHeight-e.scrollTop)<=1))}),[]);return React.useLayoutEffect((()=>{const e=A.current;return!b&&e&&(e[resizeHandlerSymbol]=N,resizeObserver.observe(e)),()=>{e&&resizeObserver.unobserve(e)}}),[N,b]),require$$0.jsxs(style.Root,{...R,...D,className:f,fancy:d,ref:r,children:[u&&u(E),d&&require$$0.jsx(style.FancyBackground,{className:h}),d&&t.onClick&&require$$0.jsx(style.PositionedIconButton,{secondary:!0,size:"xxl",icon:"close",inset:{top:0,right:0},...t}),(I||l.portrait&&!q||d)&&require$$0.jsxs(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_PORTRAIT,children:[d&&require$$0.jsx(Spacer.Spacer,{top:96}),I&&require$$0.jsx(style.DraggingHandle,{onPointerDown:w,children:require$$0.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:C,children:require$$0.jsx(Icon.Icon,{icon:require$$0.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary",...a})})}),l.portrait&&!q&&require$$0.jsx(style.MediaPortraitContainer,{top:!d,children:require$$0.jsxs(style.MediaPortrait,{children:[require$$0.jsx(style.Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),m?require$$0.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):require$$0.jsx(style.Media,{src:l.portrait})]})})]}),l.landscape&&!S&&require$$0.jsx(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_LANDSCAPE_MEDIA,children:require$$0.jsxs(style.MediaLandscape,{children:[require$$0.jsx(style.Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),m?require$$0.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):require$$0.jsx(style.Media,{src:l.landscape})]})}),!d&&t.onClick&&require$$0.jsx(style.PositionedIconButton,{size:"l",icon:"close",inset:{top:8,right:8},...t}),require$$0.jsxs(DialogContainer.DialogContainer,{...D,fancy:d,children:[I&&require$$0.jsx(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_LANDSCAPE,children:require$$0.jsx(style.DraggingHandle,{onPointerDown:w,children:require$$0.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:C,children:require$$0.jsx(Icon.Icon,{icon:require$$0.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary",...a})})})}),require$$0.jsx(style.Fading,{visible:M===!1}),require$$0.jsx(style.ScrollableContent,{ref:A,tabIndex:0,onScroll:e=>{b||N(e.currentTarget)},onKeyDown:e=>{constants$1.keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):constants$1.keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:require$$0.jsxs(require$$0.Fragment,m?{children:[require$$0.jsx(Skeleton.Skeleton,{children:require$$0.jsx(Text.Text,{appearance:"heading",marginBottom:"1.5em",sizes:constants.SIZES_TITLE,...E,...n})}),require$$0.jsx(Skeleton.Skeleton,{width:"90%",children:require$$0.jsx(Text.Text,{appearance:"body",marginBottom:"0.4em",sizes:constants.SIZES_SUBTITLE,...E,...o})}),require$$0.jsx(Skeleton.Skeleton,{width:"70%",children:require$$0.jsx(Text.Text,{appearance:"body",marginBottom:"0.4em",sizes:constants.SIZES_SUBTITLE,...E,...o})}),require$$0.jsx(Skeleton.Skeleton,{width:"50%",children:require$$0.jsx(Text.Text,{appearance:"body",marginBottom:"0.8em",sizes:constants.SIZES_SUBTITLE,...E,...o})})]}:{children:[g&&require$$0.jsx(Text.Text,{appearance:"body",color:"content-onmain-tertiary",wordBreak:"break-word",marginBottom:"0.8em",sizes:constants.SIZES_CAPTION,...E,...s,children:g}),x&&require$$0.jsx(Text.Text,{as:"h2",appearance:"heading",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.5em",sizes:constants.SIZES_TITLE,...E,...n,children:x}),y&&require$$0.jsx(Text.Text,{as:"p",appearance:"body",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.8em",sizes:constants.SIZES_SUBTITLE,...E,...o,children:y}),$]})}),require$$0.jsx(style.Fading,{visible:V===!1,after:!0}),p&&require$$0.jsx(style.Controls,{children:m?require$$0.jsx(Skeleton.Skeleton,{borderRadius:48,...c,children:require$$0.jsx(Button.Button,{preset:"brand",...E})}):p(E)})]}),l.landscape&&S&&require$$0.jsx(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_LANDSCAPE_MEDIA,children:require$$0.jsxs(style.MediaLandscape,{right:!0,children:[require$$0.jsx(style.Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),m?require$$0.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):require$$0.jsx(style.Media,{src:l.landscape})]})}),l.portrait&&q&&require$$0.jsx(Visibility.Visibility,{...D,sizes:constants.VISIBILITY_PORTRAIT,children:require$$0.jsx(style.MediaPortraitContainer,{bottom:!0,children:require$$0.jsxs(style.MediaPortrait,{children:[require$$0.jsx(style.Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),m?require$$0.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):require$$0.jsx(style.Media,{src:l.portrait})]})})})]})})),{sizes:e=>e.fancy?constants.SIZES_FANCY:constants.SIZES,displayName:'DialogComponent'});exports.SIZES=constants.SIZES,exports.SIZES_FANCY=constants.SIZES_FANCY,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, useLayoutEffect, useRef, useState, useCallback } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Visibility } from 'components/Visibility'\nimport { Skeleton } from 'components/Skeleton'\nimport { Button } from 'components/Button'\nimport { Spacer } from 'components/Spacer'\nimport { concatClassNames } from 'shared/utils/dom'\nimport type { Nullable } from 'shared/types'\nimport { DialogContainer } from './DialogContainer'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport { getCommonSizeProps } from './utils'\nimport {\n  SIZES,\n  SIZES_FANCY,\n  SIZES_CAPTION,\n  SIZES_TITLE,\n  SIZES_SUBTITLE,\n  VISIBILITY_PORTRAIT,\n  VISIBILITY_LANDSCAPE,\n  VISIBILITY_LANDSCAPE_MEDIA,\n} from './constants'\nimport type { DialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n  entries.forEach((entry) => {\n    if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n      entry.target[resizeHandlerSymbol](entry.target)\n    }\n  })\n})\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/DialogComponent/types.ts).\n */\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n  DialogComponentProps,\n  HTMLDivElement\n>(\n  forwardRef((props, ref) => {\n    const {\n      size = 's',\n      iconButtonProps = {},\n      captionProps = {},\n      titleProps = {},\n      subtitleProps = {},\n      draggingIconProps = {},\n      imgSrc = {},\n      skeletonProps = {},\n      fancy,\n      floats,\n      children,\n      caption,\n      title,\n      subtitle,\n      controls,\n      imgLandscapePositionRight,\n      imgPortraitPositionBottom,\n      className,\n      backgroundClassName,\n      scrollFadingDisabled,\n      draggable,\n      loading,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      onGrab,\n      onNudge,\n      ...restProps\n    } = props\n\n    const dialogSizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const sizeProps = getCommonSizeProps(dialogSizeProps)\n\n    const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n    const [scrollTop, setScrollTop] = useState<Nullable<boolean>>(null)\n    const [scrollBottom, setScrollBottom] = useState<Nullable<boolean>>(null)\n\n    const scrollable = useRef<HTMLDivElement | null>(null)\n\n    const handleScrollThresholds = useCallback((e: HTMLDivElement) => {\n      if (e.scrollHeight === e.clientHeight) {\n        setScrollTop(null)\n        setScrollBottom(null)\n      } else {\n        setScrollTop(e.scrollTop <= 0)\n        setScrollBottom(Math.abs(e.scrollHeight - e.clientHeight - e.scrollTop) <= 1)\n      }\n    }, [])\n\n    useLayoutEffect(() => {\n      if (!scrollFadingDisabled && scrollable.current) {\n        scrollable.current[resizeHandlerSymbol] = handleScrollThresholds\n        resizeObserver.observe(scrollable.current)\n      }\n\n      return () => {\n        if (scrollable.current) {\n          resizeObserver.unobserve(scrollable.current)\n        }\n      }\n    }, [handleScrollThresholds, scrollFadingDisabled])\n\n    return (\n      <Styled.Root {...restProps} {...dialogSizeProps} className={rootClassName} fancy={fancy} ref={ref}>\n        {floats && floats(sizeProps)}\n        {fancy && <Styled.FancyBackground className={backgroundClassName} />}\n        {fancy && iconButtonProps.onClick && (\n          <Styled.PositionedIconButton\n            secondary\n            size='xxl'\n            icon='close'\n            inset={{ top: 0, right: 0 }}\n            {...iconButtonProps}\n          />\n        )}\n        {(draggable || (imgSrc.portrait && !imgPortraitPositionBottom) || fancy) && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n            {fancy && <Spacer top={96} />}\n            {draggable && (\n              <Styled.DraggingHandle onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            )}\n            {imgSrc.portrait && !imgPortraitPositionBottom && (\n              <Styled.MediaPortraitContainer top={!fancy}>\n                <Styled.MediaPortrait>\n                  <Styled.Placeholder orientation='portrait' aspectRatio='3:1' />\n                  {loading ? (\n                    <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n                  ) : (\n                    <Styled.Media src={imgSrc.portrait} />\n                  )}\n                </Styled.MediaPortrait>\n              </Styled.MediaPortraitContainer>\n            )}\n          </Visibility>\n        )}\n        {imgSrc.landscape && !imgLandscapePositionRight && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n            <Styled.MediaLandscape>\n              <Styled.Placeholder orientation='landscape' aspectRatio='5:7' />\n              {loading ? (\n                <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n              ) : (\n                <Styled.Media src={imgSrc.landscape} />\n              )}\n            </Styled.MediaLandscape>\n          </Visibility>\n        )}\n        {!fancy && iconButtonProps.onClick && (\n          <Styled.PositionedIconButton size='l' icon='close' inset={{ top: 8, right: 8 }} {...iconButtonProps} />\n        )}\n        <DialogContainer {...dialogSizeProps} fancy={fancy}>\n          {draggable && (\n            <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE}>\n              <Styled.DraggingHandle onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            </Visibility>\n          )}\n          <Styled.Fading visible={scrollTop === false} />\n          <Styled.ScrollableContent\n            ref={scrollable}\n            tabIndex={0}\n            onScroll={(evt) => {\n              if (!scrollFadingDisabled) {\n                handleScrollThresholds(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            {loading ? (\n              <>\n                <Skeleton>\n                  <Text appearance='heading' marginBottom='1.5em' sizes={SIZES_TITLE} {...sizeProps} {...titleProps} />\n                </Skeleton>\n                <Skeleton width='90%'>\n                  <Text\n                    appearance='body'\n                    marginBottom='0.4em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  />\n                </Skeleton>\n                <Skeleton width='70%'>\n                  <Text\n                    appearance='body'\n                    marginBottom='0.4em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  />\n                </Skeleton>\n                <Skeleton width='50%'>\n                  <Text\n                    appearance='body'\n                    marginBottom='0.8em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  />\n                </Skeleton>\n              </>\n            ) : (\n              <>\n                {caption && (\n                  <Text\n                    appearance='body'\n                    color='content-onmain-tertiary'\n                    wordBreak='break-word'\n                    marginBottom='0.8em'\n                    sizes={SIZES_CAPTION}\n                    {...sizeProps}\n                    {...captionProps}\n                  >\n                    {caption}\n                  </Text>\n                )}\n                {title && (\n                  <Text\n                    as='h2'\n                    appearance='heading'\n                    color='content-onmain-primary'\n                    wordBreak='break-word'\n                    marginBottom='0.5em'\n                    sizes={SIZES_TITLE}\n                    {...sizeProps}\n                    {...titleProps}\n                  >\n                    {title}\n                  </Text>\n                )}\n                {subtitle && (\n                  <Text\n                    as='p'\n                    appearance='body'\n                    color='content-onmain-primary'\n                    wordBreak='break-word'\n                    marginBottom='0.8em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  >\n                    {subtitle}\n                  </Text>\n                )}\n                {children}\n              </>\n            )}\n          </Styled.ScrollableContent>\n          <Styled.Fading visible={scrollBottom === false} after />\n          {controls && (\n            <Styled.Controls>\n              {loading ? (\n                <Skeleton borderRadius={48} {...skeletonProps}>\n                  <Button preset='brand' {...sizeProps} />\n                </Skeleton>\n              ) : (\n                controls(sizeProps)\n              )}\n            </Styled.Controls>\n          )}\n        </DialogContainer>\n        {imgSrc.landscape && imgLandscapePositionRight && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n            <Styled.MediaLandscape right>\n              <Styled.Placeholder orientation='landscape' aspectRatio='5:7' />\n              {loading ? (\n                <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n              ) : (\n                <Styled.Media src={imgSrc.landscape} />\n              )}\n            </Styled.MediaLandscape>\n          </Visibility>\n        )}\n        {imgSrc.portrait && imgPortraitPositionBottom && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n            <Styled.MediaPortraitContainer bottom>\n              <Styled.MediaPortrait>\n                <Styled.Placeholder orientation='portrait' aspectRatio='3:1' />\n                {loading ? (\n                  <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n                ) : (\n                  <Styled.Media src={imgSrc.portrait} />\n                )}\n              </Styled.MediaPortrait>\n            </Styled.MediaPortraitContainer>\n          </Visibility>\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\nexport { SIZES, SIZES_FANCY }\n"],"names":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","default","entries","forEach","entry","target","DialogComponent","withMergedProps","forwardRef","props","ref","size","iconButtonProps","captionProps","titleProps","subtitleProps","draggingIconProps","imgSrc","skeletonProps","fancy","floats","children","caption","title","subtitle","controls","imgLandscapePositionRight","imgPortraitPositionBottom","className","backgroundClassName","scrollFadingDisabled","draggable","loading","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","onGrab","onNudge","restProps","dialogSizeProps","sizeProps","getCommonSizeProps","rootClassName","concatClassNames","scrollTop","setScrollTop","useState","scrollBottom","setScrollBottom","scrollable","useRef","handleScrollThresholds","useCallback","e","scrollHeight","clientHeight","Math","abs","useLayoutEffect","current","observe","unobserve","_jsxs","Styled","_jsx","jsx","onClick","secondary","icon","inset","top","right","portrait","jsxs","Visibility","sizes","VISIBILITY_PORTRAIT","Spacer","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","color","orientation","aspectRatio","width","height","borderRadius","src","landscape","VISIBILITY_LANDSCAPE_MEDIA","DialogContainer","VISIBILITY_LANDSCAPE","visible","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","_Fragment","Skeleton","Text","appearance","marginBottom","SIZES_TITLE","SIZES_SUBTITLE","wordBreak","SIZES_CAPTION","as","after","Button","preset","bottom","SIZES_FANCY","SIZES","displayName"],"mappings":"i1BA8BA,MAAMA,oBAAsBC,OAAO,kBAEnC,MAAMC,eAAiB,IAAIC,eAAcC,SAAEC,IACzCA,EAAQC,SAASC,WACJA,EAAMC,OAAOR,sBAAyB,YAC/CO,EAAMC,OAAOR,qBAAqBO,EAAMC,OAC1C,GACA,IAaEC,MAAAA,gBAAyEC,gBAAAA,gBAI7EC,MAAAA,YAAW,CAACC,EAAOC,KACjB,MAAMC,KACJA,EAAO,IAAGC,gBACVA,EAAkB,CAAE,EAAAC,aACpBA,EAAe,CAAE,EAAAC,WACjBA,EAAa,CAAE,EAAAC,cACfA,EAAgB,CAAE,EAAAC,kBAClBA,EAAoB,CAAE,EAAAC,OACtBA,EAAS,CAAE,EAAAC,cACXA,EAAgB,CAAE,EAAAC,MAClBA,EAAKC,OACLA,EAAMC,SACNA,EAAQC,QACRA,EAAOC,MACPA,EAAKC,SACLA,EAAQC,SACRA,EAAQC,0BACRA,EAAyBC,0BACzBA,EAAyBC,UACzBA,EAASC,oBACTA,EAAmBC,qBACnBA,EAAoBC,UACpBA,EAASC,QACTA,EAAOC,QACPA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,OACNA,EAAMC,QACNA,KACGC,GACDhC,EAEJ,MAAMiC,EAAkB,CACtB/B,OACAsB,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMK,EAAYC,yBAAmBF,GAErC,MAAMG,EAAiB1B,EAA2DS,EAAnDkB,IAAAA,iBAAiBlB,EAAWC,GAE3D,MAAOkB,EAAWC,GAAgBC,MAAQA,SAAoB,MAC9D,MAAOC,EAAcC,GAAmBF,MAAQA,SAAoB,MAEpE,MAAMG,EAAaC,aAA8B,MAEjD,MAAMC,EAAyBC,MAAWA,aAAEC,IACtCA,EAAEC,eAAiBD,EAAEE,cACvBV,EAAa,MACbG,EAAgB,QAEhBH,EAAaQ,EAAET,WAAa,GAC5BI,EAAgBQ,KAAKC,IAAIJ,EAAEC,aAAeD,EAAEE,aAAeF,EAAET,YAAc,GAC7E,GACC,IAeH,OAbAc,MAAAA,iBAAgB,MACT/B,GAAwBsB,EAAWU,UACtCV,EAAWU,QAAQjE,qBAAuByD,EAC1CvD,eAAegE,QAAQX,EAAWU,UAG7B,KACDV,EAAWU,SACb/D,eAAeiE,UAAUZ,EAAWU,QACtC,IAED,CAACR,EAAwBxB,IAG1BmC,WAAAA,KAACC,MAAAA,KAAW,IAAKzB,KAAeC,EAAiBd,UAAWiB,EAAe1B,MAAOA,EAAOT,IAAKA,EAAIW,SAC/FD,CAAAA,GAAUA,EAAOuB,GACjBxB,GAASgD,WAAAC,IAACF,sBAAsB,CAACtC,UAAWC,IAC5CV,GAASP,EAAgByD,SACxBF,WAAAA,IAACD,MAAAA,qBAA2B,CAC1BI,WAAS,EACT3D,KAAK,MACL4D,KAAK,QACLC,MAAO,CAAEC,IAAK,EAAGC,MAAO,MACpB9D,KAGNmB,GAAcd,EAAO0D,WAAahD,GAA8BR,IAChE8C,WAAAW,KAACC,sBAAU,IAAKnC,EAAiBoC,MAAOC,UAAoBA,oBAAA1D,SACzDF,CAAAA,GAASgD,WAAAC,IAACY,cAAM,CAACP,IAAK,KACtB1C,GACCoC,WAAAC,IAACF,qBAAqB,CAACe,cAAe1C,EAAOlB,SAC3C8C,WAAAC,IAACF,4BAA4B,CAACgB,SAAU,EAAGC,UAAW3C,EAAQnB,SAC5D8C,WAAAC,IAACgB,UAAI,CAACb,KAAMJ,WAAAA,IAACkB,SAAQpF,YAAKU,KAAM,GAAI2E,MAAM,6BAA8BtE,QAI7EC,EAAO0D,WAAahD,GACnBwC,WAAAA,IAACD,MAAAA,uBAA6B,CAACO,KAAMtD,EAAME,SACzC4C,WAAAW,KAACV,oBAAoB,CAAA7C,SACnB8C,CAAAA,WAAAC,IAACF,kBAAkB,CAACqB,YAAY,WAAWC,YAAY,QACtDxD,EACCmC,WAAAC,IAACF,oBAAoB,CAACuB,MAAM,OAAOC,OAAO,OAAOC,aAAc,KAAOzE,IAEtEiD,WAAAC,IAACF,YAAY,CAAC0B,IAAK3E,EAAO0D,mBAOrC1D,EAAO4E,YAAcnE,GACpByC,WAAAA,IAACU,WAAAA,WAAU,IAAKnC,EAAiBoC,MAAOgB,UAA2BA,2BAAAzE,SACjE4C,WAAAW,KAACV,qBAAqB,CAAA7C,SACpB8C,CAAAA,WAAAC,IAACF,kBAAkB,CAACqB,YAAY,YAAYC,YAAY,QACvDxD,EACCmC,WAAAC,IAACF,oBAAoB,CAACuB,MAAM,OAAOC,OAAO,OAAOC,aAAc,KAAOzE,IAEtEiD,WAAAC,IAACF,YAAY,CAAC0B,IAAK3E,EAAO4E,kBAKhC1E,GAASP,EAAgByD,SACzBF,WAAAA,IAACD,MAAAA,qBAA2B,CAACvD,KAAK,IAAI4D,KAAK,QAAQC,MAAO,CAAEC,IAAK,EAAGC,MAAO,MAAS9D,IAEtFqD,WAAAW,KAACmB,gCAAe,IAAKrD,EAAiBvB,MAAOA,EAAME,SAChDU,CAAAA,GACCoC,WAAAC,IAACS,sBAAU,IAAKnC,EAAiBoC,MAAOkB,UAAqBA,qBAAA3E,SAC3D8C,WAAAC,IAACF,qBAAqB,CAACe,cAAe1C,EAAOlB,SAC3C8C,WAAAC,IAACF,4BAA4B,CAACgB,SAAU,EAAGC,UAAW3C,EAAQnB,SAC5D8C,WAAAC,IAACgB,UAAI,CAACb,KAAMJ,WAAAA,IAACkB,SAAQpF,YAAKU,KAAM,GAAI2E,MAAM,6BAA8BtE,UAKhFmD,WAAAC,IAACF,aAAa,CAAC+B,QAASlD,KAAc,IACtCoB,WAAAC,IAACF,wBAAwB,CACvBxD,IAAK0C,EACL8B,SAAU,EACVgB,SAAWC,IACJrE,GACHwB,EAAuB6C,EAAIC,cAC7B,EAEFjB,UAAYgB,IACNE,YAAYA,aAACC,QAAQC,SAASJ,EAAIK,MACpCL,EAAIM,iBACJN,EAAIC,cAAcM,SAAS,GAAI,KACtBL,YAAYA,aAACM,UAAUJ,SAASJ,EAAIK,OAC7CL,EAAIM,iBACJN,EAAIC,cAAcM,SAAS,EAAG,IAChC,EACArF,SAGA4C,WAAAW,KAAAgC,oBADD5E,EACC,CAAAX,SAAA,CACE8C,WAAAC,IAACyC,kBAAQ,CAAAxF,SACP8C,WAAAC,IAAC0C,UAAI,CAACC,WAAW,UAAUC,aAAa,QAAQlC,MAAOmC,UAAYA,eAAKtE,KAAe7B,MAEzFqD,WAAAC,IAACyC,kBAAQ,CAACpB,MAAM,MAAKpE,SACnB8C,WAAAC,IAAC0C,UAAI,CACHC,WAAW,OACXC,aAAa,QACblC,MAAOoC,UAAeA,kBAClBvE,KACA5B,MAGRoD,WAAAC,IAACyC,kBAAQ,CAACpB,MAAM,MAAKpE,SACnB8C,WAAAC,IAAC0C,UAAI,CACHC,WAAW,OACXC,aAAa,QACblC,MAAOoC,UAAeA,kBAClBvE,KACA5B,MAGRoD,WAAAC,IAACyC,kBAAQ,CAACpB,MAAM,MAAKpE,SACnB8C,WAAAC,IAAC0C,UAAI,CACHC,WAAW,OACXC,aAAa,QACblC,MAAOoC,UAAeA,kBAClBvE,KACA5B,QAKV,CAAAM,SACGC,CAAAA,GACC6C,WAAAC,IAAC0C,UAAI,CACHC,WAAW,OACXzB,MAAM,0BACN6B,UAAU,aACVH,aAAa,QACblC,MAAOsC,UAAcA,iBACjBzE,KACA9B,EAAYQ,SAEfC,IAGJC,GACC4C,WAAAC,IAAC0C,UAAI,CACHO,GAAG,KACHN,WAAW,UACXzB,MAAM,yBACN6B,UAAU,aACVH,aAAa,QACblC,MAAOmC,UAAYA,eACftE,KACA7B,EAAUO,SAEbE,IAGJC,GACC2C,WAAAC,IAAC0C,UAAI,CACHO,GAAG,IACHN,WAAW,OACXzB,MAAM,yBACN6B,UAAU,aACVH,aAAa,QACblC,MAAOoC,UAAeA,kBAClBvE,KACA5B,EAAaM,SAEhBG,IAGJH,OAIP8C,WAAAC,IAACF,aAAa,CAAC+B,QAAS/C,KAAiB,EAAOoE,OAAK,IACpD7F,GACC0C,WAAAC,IAACF,eAAe,CAAA7C,SACbW,EACCmC,WAAAC,IAACyC,kBAAQ,CAAClB,aAAc,MAAQzE,EAAaG,SAC3C8C,WAAAC,IAACmD,cAAM,CAACC,OAAO,WAAY7E,MAG7BlB,EAASkB,QAKhB1B,EAAO4E,WAAanE,GACnByC,WAAAA,IAACU,WAAAA,WAAU,IAAKnC,EAAiBoC,MAAOgB,UAA2BA,2BAAAzE,SACjE4C,WAAAW,KAACV,qBAAqB,CAACQ,OAAK,EAAArD,SAC1B8C,CAAAA,WAAAC,IAACF,kBAAkB,CAACqB,YAAY,YAAYC,YAAY,QACvDxD,EACCmC,WAAAC,IAACF,oBAAoB,CAACuB,MAAM,OAAOC,OAAO,OAAOC,aAAc,KAAOzE,IAEtEiD,WAAAC,IAACF,YAAY,CAAC0B,IAAK3E,EAAO4E,iBAKjC5E,EAAO0D,UAAYhD,GAClBwC,WAAAA,IAACU,WAAAA,WAAU,IAAKnC,EAAiBoC,MAAOC,UAAoBA,oBAAA1D,SAC1D8C,WAAAC,IAACF,6BAA6B,CAACuD,QAAM,EAAApG,SACnC4C,WAAAW,KAACV,oBAAoB,CAAA7C,SACnB8C,CAAAA,WAAAC,IAACF,kBAAkB,CAACqB,YAAY,WAAWC,YAAY,QACtDxD,EACCmC,WAAAC,IAACF,oBAAoB,CAACuB,MAAM,OAAOC,OAAO,OAAOC,aAAc,KAAOzE,IAEtEiD,WAAAC,IAACF,YAAY,CAAC0B,IAAK3E,EAAO0D,oBAMxB,IAGlB,CACEG,MAAQrE,GAAWA,EAAMU,MAAQuG,UAAWA,YAAGC,UAAMA,MACrDC,YApTmB"}
+{"version":3,"file":"DialogComponent.js","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useLayoutEffect, useRef, useState, useCallback } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Visibility } from 'components/Visibility'\nimport { Skeleton } from 'components/Skeleton'\nimport { Button } from 'components/Button'\nimport { Spacer } from 'components/Spacer'\nimport { concatClassNames } from 'shared/utils/dom'\nimport type { Nullable } from 'shared/types'\nimport { DialogContainer } from './DialogContainer'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport { getCommonSizeProps } from './utils'\nimport {\n  SIZES,\n  SIZES_FANCY,\n  SIZES_CAPTION,\n  SIZES_TITLE,\n  SIZES_SUBTITLE,\n  VISIBILITY_PORTRAIT,\n  VISIBILITY_LANDSCAPE,\n  VISIBILITY_LANDSCAPE_MEDIA,\n} from './constants'\nimport type { DialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n  entries.forEach((entry) => {\n    if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n      entry.target[resizeHandlerSymbol](entry.target)\n    }\n  })\n})\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/DialogComponent/types.ts).\n */\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n  DialogComponentProps,\n  HTMLDivElement\n>(\n  forwardRef((props, ref) => {\n    const {\n      size = 's',\n      iconButtonProps = {},\n      captionProps = {},\n      titleProps = {},\n      subtitleProps = {},\n      draggingIconProps = {},\n      imgSrc = {},\n      skeletonProps = {},\n      fancy,\n      floats,\n      children,\n      caption,\n      title,\n      subtitle,\n      controls,\n      imgLandscapePositionRight,\n      imgPortraitPositionBottom,\n      className,\n      backgroundClassName,\n      scrollFadingDisabled,\n      draggable,\n      loading,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      onGrab,\n      onNudge,\n      ...restProps\n    } = props\n\n    const dialogSizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const sizeProps = getCommonSizeProps(dialogSizeProps)\n\n    const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n    const [scrollTop, setScrollTop] = useState<Nullable<boolean>>(null)\n    const [scrollBottom, setScrollBottom] = useState<Nullable<boolean>>(null)\n\n    const scrollable = useRef<HTMLDivElement | null>(null)\n\n    const handleScrollThresholds = useCallback((e: HTMLDivElement) => {\n      if (e.scrollHeight === e.clientHeight) {\n        setScrollTop(null)\n        setScrollBottom(null)\n      } else {\n        setScrollTop(e.scrollTop <= 0)\n        setScrollBottom(Math.abs(e.scrollHeight - e.clientHeight - e.scrollTop) <= 1)\n      }\n    }, [])\n\n    useLayoutEffect(() => {\n      const observerTarget = scrollable.current\n\n      if (!scrollFadingDisabled && observerTarget) {\n        observerTarget[resizeHandlerSymbol] = handleScrollThresholds\n        resizeObserver.observe(observerTarget)\n      }\n\n      return () => {\n        if (observerTarget) {\n          resizeObserver.unobserve(observerTarget)\n        }\n      }\n    }, [handleScrollThresholds, scrollFadingDisabled])\n\n    return (\n      <Styled.Root {...restProps} {...dialogSizeProps} className={rootClassName} fancy={fancy} ref={ref}>\n        {floats && floats(sizeProps)}\n        {fancy && <Styled.FancyBackground className={backgroundClassName} />}\n        {fancy && iconButtonProps.onClick && (\n          <Styled.PositionedIconButton\n            secondary\n            size='xxl'\n            icon='close'\n            inset={{ top: 0, right: 0 }}\n            {...iconButtonProps}\n          />\n        )}\n        {(draggable || (imgSrc.portrait && !imgPortraitPositionBottom) || fancy) && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n            {fancy && <Spacer top={96} />}\n            {draggable && (\n              <Styled.DraggingHandle onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            )}\n            {imgSrc.portrait && !imgPortraitPositionBottom && (\n              <Styled.MediaPortraitContainer top={!fancy}>\n                <Styled.MediaPortrait>\n                  <Styled.Placeholder orientation='portrait' aspectRatio='3:1' />\n                  {loading ? (\n                    <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n                  ) : (\n                    <Styled.Media src={imgSrc.portrait} />\n                  )}\n                </Styled.MediaPortrait>\n              </Styled.MediaPortraitContainer>\n            )}\n          </Visibility>\n        )}\n        {imgSrc.landscape && !imgLandscapePositionRight && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n            <Styled.MediaLandscape>\n              <Styled.Placeholder orientation='landscape' aspectRatio='5:7' />\n              {loading ? (\n                <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n              ) : (\n                <Styled.Media src={imgSrc.landscape} />\n              )}\n            </Styled.MediaLandscape>\n          </Visibility>\n        )}\n        {!fancy && iconButtonProps.onClick && (\n          <Styled.PositionedIconButton size='l' icon='close' inset={{ top: 8, right: 8 }} {...iconButtonProps} />\n        )}\n        <DialogContainer {...dialogSizeProps} fancy={fancy}>\n          {draggable && (\n            <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE}>\n              <Styled.DraggingHandle onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            </Visibility>\n          )}\n          <Styled.Fading visible={scrollTop === false} />\n          <Styled.ScrollableContent\n            ref={scrollable}\n            tabIndex={0}\n            onScroll={(evt) => {\n              if (!scrollFadingDisabled) {\n                handleScrollThresholds(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            {loading ? (\n              <>\n                <Skeleton>\n                  <Text appearance='heading' marginBottom='1.5em' sizes={SIZES_TITLE} {...sizeProps} {...titleProps} />\n                </Skeleton>\n                <Skeleton width='90%'>\n                  <Text\n                    appearance='body'\n                    marginBottom='0.4em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  />\n                </Skeleton>\n                <Skeleton width='70%'>\n                  <Text\n                    appearance='body'\n                    marginBottom='0.4em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  />\n                </Skeleton>\n                <Skeleton width='50%'>\n                  <Text\n                    appearance='body'\n                    marginBottom='0.8em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  />\n                </Skeleton>\n              </>\n            ) : (\n              <>\n                {caption && (\n                  <Text\n                    appearance='body'\n                    color='content-onmain-tertiary'\n                    wordBreak='break-word'\n                    marginBottom='0.8em'\n                    sizes={SIZES_CAPTION}\n                    {...sizeProps}\n                    {...captionProps}\n                  >\n                    {caption}\n                  </Text>\n                )}\n                {title && (\n                  <Text\n                    as='h2'\n                    appearance='heading'\n                    color='content-onmain-primary'\n                    wordBreak='break-word'\n                    marginBottom='0.5em'\n                    sizes={SIZES_TITLE}\n                    {...sizeProps}\n                    {...titleProps}\n                  >\n                    {title}\n                  </Text>\n                )}\n                {subtitle && (\n                  <Text\n                    as='p'\n                    appearance='body'\n                    color='content-onmain-primary'\n                    wordBreak='break-word'\n                    marginBottom='0.8em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  >\n                    {subtitle}\n                  </Text>\n                )}\n                {children}\n              </>\n            )}\n          </Styled.ScrollableContent>\n          <Styled.Fading visible={scrollBottom === false} after />\n          {controls && (\n            <Styled.Controls>\n              {loading ? (\n                <Skeleton borderRadius={48} {...skeletonProps}>\n                  <Button preset='brand' {...sizeProps} />\n                </Skeleton>\n              ) : (\n                controls(sizeProps)\n              )}\n            </Styled.Controls>\n          )}\n        </DialogContainer>\n        {imgSrc.landscape && imgLandscapePositionRight && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n            <Styled.MediaLandscape right>\n              <Styled.Placeholder orientation='landscape' aspectRatio='5:7' />\n              {loading ? (\n                <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n              ) : (\n                <Styled.Media src={imgSrc.landscape} />\n              )}\n            </Styled.MediaLandscape>\n          </Visibility>\n        )}\n        {imgSrc.portrait && imgPortraitPositionBottom && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n            <Styled.MediaPortraitContainer bottom>\n              <Styled.MediaPortrait>\n                <Styled.Placeholder orientation='portrait' aspectRatio='3:1' />\n                {loading ? (\n                  <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n                ) : (\n                  <Styled.Media src={imgSrc.portrait} />\n                )}\n              </Styled.MediaPortrait>\n            </Styled.MediaPortraitContainer>\n          </Visibility>\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\nexport { SIZES, SIZES_FANCY }\n"],"names":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","default","entries","forEach","entry","target","DialogComponent","withMergedProps","forwardRef","props","ref","size","iconButtonProps","captionProps","titleProps","subtitleProps","draggingIconProps","imgSrc","skeletonProps","fancy","floats","children","caption","title","subtitle","controls","imgLandscapePositionRight","imgPortraitPositionBottom","className","backgroundClassName","scrollFadingDisabled","draggable","loading","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","onGrab","onNudge","restProps","dialogSizeProps","sizeProps","getCommonSizeProps","rootClassName","concatClassNames","scrollTop","setScrollTop","useState","scrollBottom","setScrollBottom","scrollable","useRef","handleScrollThresholds","useCallback","e","scrollHeight","clientHeight","Math","abs","useLayoutEffect","observerTarget","current","observe","unobserve","_jsxs","Styled","_jsx","jsx","onClick","secondary","icon","inset","top","right","portrait","jsxs","Visibility","sizes","VISIBILITY_PORTRAIT","Spacer","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","color","orientation","aspectRatio","width","height","borderRadius","src","landscape","VISIBILITY_LANDSCAPE_MEDIA","DialogContainer","VISIBILITY_LANDSCAPE","visible","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","_Fragment","Skeleton","Text","appearance","marginBottom","SIZES_TITLE","SIZES_SUBTITLE","wordBreak","SIZES_CAPTION","as","after","Button","preset","bottom","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}

package/components/DialogComponent/DialogComponent.mjs

@@ -1,2 +1,2 @@
-import{forwardRef,useState,useRef,useCallback,useLayoutEffect}from'react';import ResizeObserver from'../../external/.pnpm/resize-observer-polyfill@1.5.1/node_modules/resize-observer-polyfill/dist/ResizeObserver.mjs';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{concatClassNames}from'../../shared/utils/dom.mjs';import{DialogContainer}from'./DialogContainer.mjs';import SvgDragging from'./images/dragging.svg.mjs';import{Root,FancyBackground,PositionedIconButton,DraggingHandle,DraggingIconContainer,MediaPortraitContainer,MediaPortrait,Placeholder,MediaSkeleton,Media,MediaLandscape,Fading,ScrollableContent,Controls}from'./style.mjs';import{getCommonSizeProps}from'./utils.mjs';import{SIZES_FANCY,SIZES,VISIBILITY_PORTRAIT,VISIBILITY_LANDSCAPE_MEDIA,VISIBILITY_LANDSCAPE,SIZES_TITLE,SIZES_SUBTITLE,SIZES_CAPTION}from'./constants.mjs';import{jsxs,jsx,Fragment}from'react/jsx-runtime';import{Visibility}from'../Visibility/Visibility.mjs';import{Spacer}from'../Spacer/Spacer.mjs';import{Icon}from'../Icon/Icon.mjs';import{Skeleton}from'../Skeleton/Skeleton.mjs';import{Text}from'../Text/Text.mjs';import{Button}from'../Button/Button.mjs';const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const DialogComponent=withMergedProps(forwardRef(((e,r)=>{const{size:o="s",iconButtonProps:i={},captionProps:t={},titleProps:s={},subtitleProps:n={},draggingIconProps:a={},imgSrc:l={},skeletonProps:c={},fancy:d,floats:m,children:g,caption:p,title:S,subtitle:I,controls:x,imgLandscapePositionRight:j,imgPortraitPositionBottom:h,className:b,backgroundClassName:u,scrollFadingDisabled:y,draggable:T,loading:z,sizeXXS:f,sizeXS:P,sizeS:B,sizeM:C,sizeL:E,sizeXL:k,onGrab:D,onNudge:L,...M}=e;const w={size:o,sizeXXS:f,sizeXS:P,sizeS:B,sizeM:C,sizeL:E,sizeXL:k};const R=getCommonSizeProps(w);const _=d?b:concatClassNames(b,u);const[A,v]=useState(null);const[N,V]=useState(null);const Z=useRef(null);const F=useCallback((e=>{e.scrollHeight===e.clientHeight?(v(null),V(null)):(v(e.scrollTop<=0),V(Math.abs(e.scrollHeight-e.clientHeight-e.scrollTop)<=1))}),[]);return useLayoutEffect((()=>(!y&&Z.current&&(Z.current[resizeHandlerSymbol]=F,resizeObserver.observe(Z.current)),()=>{Z.current&&resizeObserver.unobserve(Z.current)})),[F,y]),jsxs(Root,{...M,...w,className:_,fancy:d,ref:r,children:[m&&m(R),d&&jsx(FancyBackground,{className:u}),d&&i.onClick&&jsx(PositionedIconButton,{secondary:!0,size:"xxl",icon:"close",inset:{top:0,right:0},...i}),(T||l.portrait&&!h||d)&&jsxs(Visibility,{...w,sizes:VISIBILITY_PORTRAIT,children:[d&&jsx(Spacer,{top:96}),T&&jsx(DraggingHandle,{onPointerDown:D,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:L,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary",...a})})}),l.portrait&&!h&&jsx(MediaPortraitContainer,{top:!d,children:jsxs(MediaPortrait,{children:[jsx(Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.portrait})]})})]}),l.landscape&&!j&&jsx(Visibility,{...w,sizes:VISIBILITY_LANDSCAPE_MEDIA,children:jsxs(MediaLandscape,{children:[jsx(Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.landscape})]})}),!d&&i.onClick&&jsx(PositionedIconButton,{size:"l",icon:"close",inset:{top:8,right:8},...i}),jsxs(DialogContainer,{...w,fancy:d,children:[T&&jsx(Visibility,{...w,sizes:VISIBILITY_LANDSCAPE,children:jsx(DraggingHandle,{onPointerDown:D,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:L,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary",...a})})})}),jsx(Fading,{visible:A===!1}),jsx(ScrollableContent,{ref:Z,tabIndex:0,onScroll:e=>{y||F(e.currentTarget)},onKeyDown:e=>{keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:jsxs(Fragment,z?{children:[jsx(Skeleton,{children:jsx(Text,{appearance:"heading",marginBottom:"1.5em",sizes:SIZES_TITLE,...R,...s})}),jsx(Skeleton,{width:"90%",children:jsx(Text,{appearance:"body",marginBottom:"0.4em",sizes:SIZES_SUBTITLE,...R,...n})}),jsx(Skeleton,{width:"70%",children:jsx(Text,{appearance:"body",marginBottom:"0.4em",sizes:SIZES_SUBTITLE,...R,...n})}),jsx(Skeleton,{width:"50%",children:jsx(Text,{appearance:"body",marginBottom:"0.8em",sizes:SIZES_SUBTITLE,...R,...n})})]}:{children:[p&&jsx(Text,{appearance:"body",color:"content-onmain-tertiary",wordBreak:"break-word",marginBottom:"0.8em",sizes:SIZES_CAPTION,...R,...t,children:p}),S&&jsx(Text,{as:"h2",appearance:"heading",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.5em",sizes:SIZES_TITLE,...R,...s,children:S}),I&&jsx(Text,{as:"p",appearance:"body",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.8em",sizes:SIZES_SUBTITLE,...R,...n,children:I}),g]})}),jsx(Fading,{visible:N===!1,after:!0}),x&&jsx(Controls,{children:z?jsx(Skeleton,{borderRadius:48,...c,children:jsx(Button,{preset:"brand",...R})}):x(R)})]}),l.landscape&&j&&jsx(Visibility,{...w,sizes:VISIBILITY_LANDSCAPE_MEDIA,children:jsxs(MediaLandscape,{right:!0,children:[jsx(Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.landscape})]})}),l.portrait&&h&&jsx(Visibility,{...w,sizes:VISIBILITY_PORTRAIT,children:jsx(MediaPortraitContainer,{bottom:!0,children:jsxs(MediaPortrait,{children:[jsx(Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.portrait})]})})})]})})),{sizes:e=>e.fancy?SIZES_FANCY:SIZES,displayName:'DialogComponent'});export{DialogComponent,SIZES,SIZES_FANCY};
+import{forwardRef,useState,useRef,useCallback,useLayoutEffect}from'react';import ResizeObserver from'../../external/.pnpm/resize-observer-polyfill@1.5.1/node_modules/resize-observer-polyfill/dist/ResizeObserver.mjs';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{concatClassNames}from'../../shared/utils/dom.mjs';import{DialogContainer}from'./DialogContainer.mjs';import SvgDragging from'./images/dragging.svg.mjs';import{Root,FancyBackground,PositionedIconButton,DraggingHandle,DraggingIconContainer,MediaPortraitContainer,MediaPortrait,Placeholder,MediaSkeleton,Media,MediaLandscape,Fading,ScrollableContent,Controls}from'./style.mjs';import{getCommonSizeProps}from'./utils.mjs';import{SIZES_FANCY,SIZES,VISIBILITY_PORTRAIT,VISIBILITY_LANDSCAPE_MEDIA,VISIBILITY_LANDSCAPE,SIZES_TITLE,SIZES_SUBTITLE,SIZES_CAPTION}from'./constants.mjs';import{jsxs,jsx,Fragment}from'react/jsx-runtime';import{Visibility}from'../Visibility/Visibility.mjs';import{Spacer}from'../Spacer/Spacer.mjs';import{Icon}from'../Icon/Icon.mjs';import{Skeleton}from'../Skeleton/Skeleton.mjs';import{Text}from'../Text/Text.mjs';import{Button}from'../Button/Button.mjs';const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const DialogComponent=withMergedProps(forwardRef(((e,o)=>{const{size:r="s",iconButtonProps:i={},captionProps:t={},titleProps:s={},subtitleProps:n={},draggingIconProps:a={},imgSrc:l={},skeletonProps:c={},fancy:d,floats:m,children:g,caption:p,title:S,subtitle:I,controls:x,imgLandscapePositionRight:j,imgPortraitPositionBottom:h,className:b,backgroundClassName:y,scrollFadingDisabled:u,draggable:T,loading:z,sizeXXS:f,sizeXS:P,sizeS:B,sizeM:C,sizeL:E,sizeXL:k,onGrab:D,onNudge:L,...M}=e;const w={size:r,sizeXXS:f,sizeXS:P,sizeS:B,sizeM:C,sizeL:E,sizeXL:k};const R=getCommonSizeProps(w);const _=d?b:concatClassNames(b,y);const[A,v]=useState(null);const[N,V]=useState(null);const Z=useRef(null);const F=useCallback((e=>{e.scrollHeight===e.clientHeight?(v(null),V(null)):(v(e.scrollTop<=0),V(Math.abs(e.scrollHeight-e.clientHeight-e.scrollTop)<=1))}),[]);return useLayoutEffect((()=>{const e=Z.current;return!u&&e&&(e[resizeHandlerSymbol]=F,resizeObserver.observe(e)),()=>{e&&resizeObserver.unobserve(e)}}),[F,u]),jsxs(Root,{...M,...w,className:_,fancy:d,ref:o,children:[m&&m(R),d&&jsx(FancyBackground,{className:y}),d&&i.onClick&&jsx(PositionedIconButton,{secondary:!0,size:"xxl",icon:"close",inset:{top:0,right:0},...i}),(T||l.portrait&&!h||d)&&jsxs(Visibility,{...w,sizes:VISIBILITY_PORTRAIT,children:[d&&jsx(Spacer,{top:96}),T&&jsx(DraggingHandle,{onPointerDown:D,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:L,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary",...a})})}),l.portrait&&!h&&jsx(MediaPortraitContainer,{top:!d,children:jsxs(MediaPortrait,{children:[jsx(Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.portrait})]})})]}),l.landscape&&!j&&jsx(Visibility,{...w,sizes:VISIBILITY_LANDSCAPE_MEDIA,children:jsxs(MediaLandscape,{children:[jsx(Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.landscape})]})}),!d&&i.onClick&&jsx(PositionedIconButton,{size:"l",icon:"close",inset:{top:8,right:8},...i}),jsxs(DialogContainer,{...w,fancy:d,children:[T&&jsx(Visibility,{...w,sizes:VISIBILITY_LANDSCAPE,children:jsx(DraggingHandle,{onPointerDown:D,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:L,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary",...a})})})}),jsx(Fading,{visible:A===!1}),jsx(ScrollableContent,{ref:Z,tabIndex:0,onScroll:e=>{u||F(e.currentTarget)},onKeyDown:e=>{keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:jsxs(Fragment,z?{children:[jsx(Skeleton,{children:jsx(Text,{appearance:"heading",marginBottom:"1.5em",sizes:SIZES_TITLE,...R,...s})}),jsx(Skeleton,{width:"90%",children:jsx(Text,{appearance:"body",marginBottom:"0.4em",sizes:SIZES_SUBTITLE,...R,...n})}),jsx(Skeleton,{width:"70%",children:jsx(Text,{appearance:"body",marginBottom:"0.4em",sizes:SIZES_SUBTITLE,...R,...n})}),jsx(Skeleton,{width:"50%",children:jsx(Text,{appearance:"body",marginBottom:"0.8em",sizes:SIZES_SUBTITLE,...R,...n})})]}:{children:[p&&jsx(Text,{appearance:"body",color:"content-onmain-tertiary",wordBreak:"break-word",marginBottom:"0.8em",sizes:SIZES_CAPTION,...R,...t,children:p}),S&&jsx(Text,{as:"h2",appearance:"heading",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.5em",sizes:SIZES_TITLE,...R,...s,children:S}),I&&jsx(Text,{as:"p",appearance:"body",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.8em",sizes:SIZES_SUBTITLE,...R,...n,children:I}),g]})}),jsx(Fading,{visible:N===!1,after:!0}),x&&jsx(Controls,{children:z?jsx(Skeleton,{borderRadius:48,...c,children:jsx(Button,{preset:"brand",...R})}):x(R)})]}),l.landscape&&j&&jsx(Visibility,{...w,sizes:VISIBILITY_LANDSCAPE_MEDIA,children:jsxs(MediaLandscape,{right:!0,children:[jsx(Placeholder,{orientation:"landscape",aspectRatio:"5:7"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.landscape})]})}),l.portrait&&h&&jsx(Visibility,{...w,sizes:VISIBILITY_PORTRAIT,children:jsx(MediaPortraitContainer,{bottom:!0,children:jsxs(MediaPortrait,{children:[jsx(Placeholder,{orientation:"portrait",aspectRatio:"3:1"}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...c}):jsx(Media,{src:l.portrait})]})})})]})})),{sizes:e=>e.fancy?SIZES_FANCY:SIZES,displayName:'DialogComponent'});export{DialogComponent,SIZES,SIZES_FANCY};
 //# 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, useLayoutEffect, useRef, useState, useCallback } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Visibility } from 'components/Visibility'\nimport { Skeleton } from 'components/Skeleton'\nimport { Button } from 'components/Button'\nimport { Spacer } from 'components/Spacer'\nimport { concatClassNames } from 'shared/utils/dom'\nimport type { Nullable } from 'shared/types'\nimport { DialogContainer } from './DialogContainer'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport { getCommonSizeProps } from './utils'\nimport {\n  SIZES,\n  SIZES_FANCY,\n  SIZES_CAPTION,\n  SIZES_TITLE,\n  SIZES_SUBTITLE,\n  VISIBILITY_PORTRAIT,\n  VISIBILITY_LANDSCAPE,\n  VISIBILITY_LANDSCAPE_MEDIA,\n} from './constants'\nimport type { DialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n  entries.forEach((entry) => {\n    if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n      entry.target[resizeHandlerSymbol](entry.target)\n    }\n  })\n})\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/DialogComponent/types.ts).\n */\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n  DialogComponentProps,\n  HTMLDivElement\n>(\n  forwardRef((props, ref) => {\n    const {\n      size = 's',\n      iconButtonProps = {},\n      captionProps = {},\n      titleProps = {},\n      subtitleProps = {},\n      draggingIconProps = {},\n      imgSrc = {},\n      skeletonProps = {},\n      fancy,\n      floats,\n      children,\n      caption,\n      title,\n      subtitle,\n      controls,\n      imgLandscapePositionRight,\n      imgPortraitPositionBottom,\n      className,\n      backgroundClassName,\n      scrollFadingDisabled,\n      draggable,\n      loading,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      onGrab,\n      onNudge,\n      ...restProps\n    } = props\n\n    const dialogSizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const sizeProps = getCommonSizeProps(dialogSizeProps)\n\n    const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n    const [scrollTop, setScrollTop] = useState<Nullable<boolean>>(null)\n    const [scrollBottom, setScrollBottom] = useState<Nullable<boolean>>(null)\n\n    const scrollable = useRef<HTMLDivElement | null>(null)\n\n    const handleScrollThresholds = useCallback((e: HTMLDivElement) => {\n      if (e.scrollHeight === e.clientHeight) {\n        setScrollTop(null)\n        setScrollBottom(null)\n      } else {\n        setScrollTop(e.scrollTop <= 0)\n        setScrollBottom(Math.abs(e.scrollHeight - e.clientHeight - e.scrollTop) <= 1)\n      }\n    }, [])\n\n    useLayoutEffect(() => {\n      if (!scrollFadingDisabled && scrollable.current) {\n        scrollable.current[resizeHandlerSymbol] = handleScrollThresholds\n        resizeObserver.observe(scrollable.current)\n      }\n\n      return () => {\n        if (scrollable.current) {\n          resizeObserver.unobserve(scrollable.current)\n        }\n      }\n    }, [handleScrollThresholds, scrollFadingDisabled])\n\n    return (\n      <Styled.Root {...restProps} {...dialogSizeProps} className={rootClassName} fancy={fancy} ref={ref}>\n        {floats && floats(sizeProps)}\n        {fancy && <Styled.FancyBackground className={backgroundClassName} />}\n        {fancy && iconButtonProps.onClick && (\n          <Styled.PositionedIconButton\n            secondary\n            size='xxl'\n            icon='close'\n            inset={{ top: 0, right: 0 }}\n            {...iconButtonProps}\n          />\n        )}\n        {(draggable || (imgSrc.portrait && !imgPortraitPositionBottom) || fancy) && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n            {fancy && <Spacer top={96} />}\n            {draggable && (\n              <Styled.DraggingHandle onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            )}\n            {imgSrc.portrait && !imgPortraitPositionBottom && (\n              <Styled.MediaPortraitContainer top={!fancy}>\n                <Styled.MediaPortrait>\n                  <Styled.Placeholder orientation='portrait' aspectRatio='3:1' />\n                  {loading ? (\n                    <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n                  ) : (\n                    <Styled.Media src={imgSrc.portrait} />\n                  )}\n                </Styled.MediaPortrait>\n              </Styled.MediaPortraitContainer>\n            )}\n          </Visibility>\n        )}\n        {imgSrc.landscape && !imgLandscapePositionRight && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n            <Styled.MediaLandscape>\n              <Styled.Placeholder orientation='landscape' aspectRatio='5:7' />\n              {loading ? (\n                <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n              ) : (\n                <Styled.Media src={imgSrc.landscape} />\n              )}\n            </Styled.MediaLandscape>\n          </Visibility>\n        )}\n        {!fancy && iconButtonProps.onClick && (\n          <Styled.PositionedIconButton size='l' icon='close' inset={{ top: 8, right: 8 }} {...iconButtonProps} />\n        )}\n        <DialogContainer {...dialogSizeProps} fancy={fancy}>\n          {draggable && (\n            <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE}>\n              <Styled.DraggingHandle onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            </Visibility>\n          )}\n          <Styled.Fading visible={scrollTop === false} />\n          <Styled.ScrollableContent\n            ref={scrollable}\n            tabIndex={0}\n            onScroll={(evt) => {\n              if (!scrollFadingDisabled) {\n                handleScrollThresholds(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            {loading ? (\n              <>\n                <Skeleton>\n                  <Text appearance='heading' marginBottom='1.5em' sizes={SIZES_TITLE} {...sizeProps} {...titleProps} />\n                </Skeleton>\n                <Skeleton width='90%'>\n                  <Text\n                    appearance='body'\n                    marginBottom='0.4em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  />\n                </Skeleton>\n                <Skeleton width='70%'>\n                  <Text\n                    appearance='body'\n                    marginBottom='0.4em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  />\n                </Skeleton>\n                <Skeleton width='50%'>\n                  <Text\n                    appearance='body'\n                    marginBottom='0.8em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  />\n                </Skeleton>\n              </>\n            ) : (\n              <>\n                {caption && (\n                  <Text\n                    appearance='body'\n                    color='content-onmain-tertiary'\n                    wordBreak='break-word'\n                    marginBottom='0.8em'\n                    sizes={SIZES_CAPTION}\n                    {...sizeProps}\n                    {...captionProps}\n                  >\n                    {caption}\n                  </Text>\n                )}\n                {title && (\n                  <Text\n                    as='h2'\n                    appearance='heading'\n                    color='content-onmain-primary'\n                    wordBreak='break-word'\n                    marginBottom='0.5em'\n                    sizes={SIZES_TITLE}\n                    {...sizeProps}\n                    {...titleProps}\n                  >\n                    {title}\n                  </Text>\n                )}\n                {subtitle && (\n                  <Text\n                    as='p'\n                    appearance='body'\n                    color='content-onmain-primary'\n                    wordBreak='break-word'\n                    marginBottom='0.8em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  >\n                    {subtitle}\n                  </Text>\n                )}\n                {children}\n              </>\n            )}\n          </Styled.ScrollableContent>\n          <Styled.Fading visible={scrollBottom === false} after />\n          {controls && (\n            <Styled.Controls>\n              {loading ? (\n                <Skeleton borderRadius={48} {...skeletonProps}>\n                  <Button preset='brand' {...sizeProps} />\n                </Skeleton>\n              ) : (\n                controls(sizeProps)\n              )}\n            </Styled.Controls>\n          )}\n        </DialogContainer>\n        {imgSrc.landscape && imgLandscapePositionRight && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n            <Styled.MediaLandscape right>\n              <Styled.Placeholder orientation='landscape' aspectRatio='5:7' />\n              {loading ? (\n                <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n              ) : (\n                <Styled.Media src={imgSrc.landscape} />\n              )}\n            </Styled.MediaLandscape>\n          </Visibility>\n        )}\n        {imgSrc.portrait && imgPortraitPositionBottom && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n            <Styled.MediaPortraitContainer bottom>\n              <Styled.MediaPortrait>\n                <Styled.Placeholder orientation='portrait' aspectRatio='3:1' />\n                {loading ? (\n                  <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n                ) : (\n                  <Styled.Media src={imgSrc.portrait} />\n                )}\n              </Styled.MediaPortrait>\n            </Styled.MediaPortraitContainer>\n          </Visibility>\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\nexport { SIZES, SIZES_FANCY }\n"],"names":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","entries","forEach","entry","target","DialogComponent","withMergedProps","forwardRef","props","ref","size","iconButtonProps","captionProps","titleProps","subtitleProps","draggingIconProps","imgSrc","skeletonProps","fancy","floats","children","caption","title","subtitle","controls","imgLandscapePositionRight","imgPortraitPositionBottom","className","backgroundClassName","scrollFadingDisabled","draggable","loading","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","onGrab","onNudge","restProps","dialogSizeProps","sizeProps","getCommonSizeProps","rootClassName","concatClassNames","scrollTop","setScrollTop","useState","scrollBottom","setScrollBottom","scrollable","useRef","handleScrollThresholds","useCallback","e","scrollHeight","clientHeight","Math","abs","useLayoutEffect","current","observe","unobserve","_jsxs","Styled","_jsx","onClick","secondary","icon","inset","top","right","portrait","Visibility","sizes","VISIBILITY_PORTRAIT","Spacer","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","color","orientation","aspectRatio","width","height","borderRadius","src","landscape","VISIBILITY_LANDSCAPE_MEDIA","DialogContainer","VISIBILITY_LANDSCAPE","visible","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","_Fragment","Skeleton","Text","appearance","marginBottom","SIZES_TITLE","SIZES_SUBTITLE","wordBreak","SIZES_CAPTION","as","after","Button","preset","bottom","SIZES_FANCY","SIZES","displayName"],"mappings":"2rCA8BA,MAAMA,oBAAsBC,OAAO,kBAEnC,MAAMC,eAAiB,IAAIC,gBAAgBC,IACzCA,EAAQC,SAASC,WACJA,EAAMC,OAAOP,sBAAyB,YAC/CM,EAAMC,OAAOP,qBAAqBM,EAAMC,OAC1C,GACA,IAaEC,MAAAA,gBAAyEC,gBAI7EC,YAAW,CAACC,EAAOC,KACjB,MAAMC,KACJA,EAAO,IAAGC,gBACVA,EAAkB,CAAE,EAAAC,aACpBA,EAAe,CAAE,EAAAC,WACjBA,EAAa,CAAE,EAAAC,cACfA,EAAgB,CAAE,EAAAC,kBAClBA,EAAoB,CAAE,EAAAC,OACtBA,EAAS,CAAE,EAAAC,cACXA,EAAgB,CAAE,EAAAC,MAClBA,EAAKC,OACLA,EAAMC,SACNA,EAAQC,QACRA,EAAOC,MACPA,EAAKC,SACLA,EAAQC,SACRA,EAAQC,0BACRA,EAAyBC,0BACzBA,EAAyBC,UACzBA,EAASC,oBACTA,EAAmBC,qBACnBA,EAAoBC,UACpBA,EAASC,QACTA,EAAOC,QACPA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,OACNA,EAAMC,QACNA,KACGC,GACDhC,EAEJ,MAAMiC,EAAkB,CACtB/B,OACAsB,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMK,EAAYC,mBAAmBF,GAErC,MAAMG,EAAiB1B,EAA2DS,EAAnDkB,iBAAiBlB,EAAWC,GAE3D,MAAOkB,EAAWC,GAAgBC,SAA4B,MAC9D,MAAOC,EAAcC,GAAmBF,SAA4B,MAEpE,MAAMG,EAAaC,OAA8B,MAEjD,MAAMC,EAAyBC,aAAaC,IACtCA,EAAEC,eAAiBD,EAAEE,cACvBV,EAAa,MACbG,EAAgB,QAEhBH,EAAaQ,EAAET,WAAa,GAC5BI,EAAgBQ,KAAKC,IAAIJ,EAAEC,aAAeD,EAAEE,aAAeF,EAAET,YAAc,GAC7E,GACC,IAeH,OAbAc,iBAAgB,MACT/B,GAAwBsB,EAAWU,UACtCV,EAAWU,QAAQhE,qBAAuBwD,EAC1CtD,eAAe+D,QAAQX,EAAWU,UAG7B,KACDV,EAAWU,SACb9D,eAAegE,UAAUZ,EAAWU,QACtC,IAED,CAACR,EAAwBxB,IAG1BmC,KAACC,KAAW,IAAKzB,KAAeC,EAAiBd,UAAWiB,EAAe1B,MAAOA,EAAOT,IAAKA,EAAIW,SAC/FD,CAAAA,GAAUA,EAAOuB,GACjBxB,GAASgD,IAACD,gBAAsB,CAACtC,UAAWC,IAC5CV,GAASP,EAAgBwD,SACxBD,IAACD,qBAA2B,CAC1BG,WAAS,EACT1D,KAAK,MACL2D,KAAK,QACLC,MAAO,CAAEC,IAAK,EAAGC,MAAO,MACpB7D,KAGNmB,GAAcd,EAAOyD,WAAa/C,GAA8BR,IAChE8C,KAACU,WAAU,IAAKjC,EAAiBkC,MAAOC,oBAAoBxD,SACzDF,CAAAA,GAASgD,IAACW,OAAM,CAACN,IAAK,KACtBzC,GACCoC,IAACD,eAAqB,CAACa,cAAexC,EAAOlB,SAC3C8C,IAACD,sBAA4B,CAACc,SAAU,EAAGC,UAAWzC,EAAQnB,SAC5D8C,IAACe,KAAI,CAACZ,KAAMH,IAACgB,gBAAaxE,KAAM,GAAIyE,MAAM,6BAA8BpE,QAI7EC,EAAOyD,WAAa/C,GACnBwC,IAACD,uBAA6B,CAACM,KAAMrD,EAAME,SACzC4C,KAACC,cAAoB,CAAA7C,SACnB8C,CAAAA,IAACD,YAAkB,CAACmB,YAAY,WAAWC,YAAY,QACtDtD,EACCmC,IAACD,cAAoB,CAACqB,MAAM,OAAOC,OAAO,OAAOC,aAAc,KAAOvE,IAEtEiD,IAACD,MAAY,CAACwB,IAAKzE,EAAOyD,mBAOrCzD,EAAO0E,YAAcjE,GACpByC,IAACQ,WAAU,IAAKjC,EAAiBkC,MAAOgB,2BAA2BvE,SACjE4C,KAACC,eAAqB,CAAA7C,SACpB8C,CAAAA,IAACD,YAAkB,CAACmB,YAAY,YAAYC,YAAY,QACvDtD,EACCmC,IAACD,cAAoB,CAACqB,MAAM,OAAOC,OAAO,OAAOC,aAAc,KAAOvE,IAEtEiD,IAACD,MAAY,CAACwB,IAAKzE,EAAO0E,kBAKhCxE,GAASP,EAAgBwD,SACzBD,IAACD,qBAA2B,CAACvD,KAAK,IAAI2D,KAAK,QAAQC,MAAO,CAAEC,IAAK,EAAGC,MAAO,MAAS7D,IAEtFqD,KAAC4B,gBAAe,IAAKnD,EAAiBvB,MAAOA,EAAME,SAChDU,CAAAA,GACCoC,IAACQ,WAAU,IAAKjC,EAAiBkC,MAAOkB,qBAAqBzE,SAC3D8C,IAACD,eAAqB,CAACa,cAAexC,EAAOlB,SAC3C8C,IAACD,sBAA4B,CAACc,SAAU,EAAGC,UAAWzC,EAAQnB,SAC5D8C,IAACe,KAAI,CAACZ,KAAMH,IAACgB,gBAAaxE,KAAM,GAAIyE,MAAM,6BAA8BpE,UAKhFmD,IAACD,OAAa,CAAC6B,QAAShD,KAAc,IACtCoB,IAACD,kBAAwB,CACvBxD,IAAK0C,EACL4B,SAAU,EACVgB,SAAWC,IACJnE,GACHwB,EAAuB2C,EAAIC,cAC7B,EAEFjB,UAAYgB,IACNE,aAAaC,QAAQC,SAASJ,EAAIK,MACpCL,EAAIM,iBACJN,EAAIC,cAAcM,SAAS,GAAI,KACtBL,aAAaM,UAAUJ,SAASJ,EAAIK,OAC7CL,EAAIM,iBACJN,EAAIC,cAAcM,SAAS,EAAG,IAChC,EACAnF,SAGA4C,KAAAyC,SADD1E,EACC,CAAAX,SAAA,CACE8C,IAACwC,SAAQ,CAAAtF,SACP8C,IAACyC,KAAI,CAACC,WAAW,UAAUC,aAAa,QAAQlC,MAAOmC,eAAiBpE,KAAe7B,MAEzFqD,IAACwC,SAAQ,CAACpB,MAAM,MAAKlE,SACnB8C,IAACyC,KAAI,CACHC,WAAW,OACXC,aAAa,QACblC,MAAOoC,kBACHrE,KACA5B,MAGRoD,IAACwC,SAAQ,CAACpB,MAAM,MAAKlE,SACnB8C,IAACyC,KAAI,CACHC,WAAW,OACXC,aAAa,QACblC,MAAOoC,kBACHrE,KACA5B,MAGRoD,IAACwC,SAAQ,CAACpB,MAAM,MAAKlE,SACnB8C,IAACyC,KAAI,CACHC,WAAW,OACXC,aAAa,QACblC,MAAOoC,kBACHrE,KACA5B,QAKV,CAAAM,SACGC,CAAAA,GACC6C,IAACyC,KAAI,CACHC,WAAW,OACXzB,MAAM,0BACN6B,UAAU,aACVH,aAAa,QACblC,MAAOsC,iBACHvE,KACA9B,EAAYQ,SAEfC,IAGJC,GACC4C,IAACyC,KAAI,CACHO,GAAG,KACHN,WAAW,UACXzB,MAAM,yBACN6B,UAAU,aACVH,aAAa,QACblC,MAAOmC,eACHpE,KACA7B,EAAUO,SAEbE,IAGJC,GACC2C,IAACyC,KAAI,CACHO,GAAG,IACHN,WAAW,OACXzB,MAAM,yBACN6B,UAAU,aACVH,aAAa,QACblC,MAAOoC,kBACHrE,KACA5B,EAAaM,SAEhBG,IAGJH,OAIP8C,IAACD,OAAa,CAAC6B,QAAS7C,KAAiB,EAAOkE,OAAK,IACpD3F,GACC0C,IAACD,SAAe,CAAA7C,SACbW,EACCmC,IAACwC,SAAQ,CAAClB,aAAc,MAAQvE,EAAaG,SAC3C8C,IAACkD,OAAM,CAACC,OAAO,WAAY3E,MAG7BlB,EAASkB,QAKhB1B,EAAO0E,WAAajE,GACnByC,IAACQ,WAAU,IAAKjC,EAAiBkC,MAAOgB,2BAA2BvE,SACjE4C,KAACC,eAAqB,CAACO,OAAK,EAAApD,SAC1B8C,CAAAA,IAACD,YAAkB,CAACmB,YAAY,YAAYC,YAAY,QACvDtD,EACCmC,IAACD,cAAoB,CAACqB,MAAM,OAAOC,OAAO,OAAOC,aAAc,KAAOvE,IAEtEiD,IAACD,MAAY,CAACwB,IAAKzE,EAAO0E,iBAKjC1E,EAAOyD,UAAY/C,GAClBwC,IAACQ,WAAU,IAAKjC,EAAiBkC,MAAOC,oBAAoBxD,SAC1D8C,IAACD,uBAA6B,CAACqD,QAAM,EAAAlG,SACnC4C,KAACC,cAAoB,CAAA7C,SACnB8C,CAAAA,IAACD,YAAkB,CAACmB,YAAY,WAAWC,YAAY,QACtDtD,EACCmC,IAACD,cAAoB,CAACqB,MAAM,OAAOC,OAAO,OAAOC,aAAc,KAAOvE,IAEtEiD,IAACD,MAAY,CAACwB,IAAKzE,EAAOyD,oBAMxB,IAGlB,CACEE,MAAQnE,GAAWA,EAAMU,MAAQqG,YAAcC,MAC/CC,YApTmB"}
+{"version":3,"file":"DialogComponent.mjs","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useLayoutEffect, useRef, useState, useCallback } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Visibility } from 'components/Visibility'\nimport { Skeleton } from 'components/Skeleton'\nimport { Button } from 'components/Button'\nimport { Spacer } from 'components/Spacer'\nimport { concatClassNames } from 'shared/utils/dom'\nimport type { Nullable } from 'shared/types'\nimport { DialogContainer } from './DialogContainer'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport { getCommonSizeProps } from './utils'\nimport {\n  SIZES,\n  SIZES_FANCY,\n  SIZES_CAPTION,\n  SIZES_TITLE,\n  SIZES_SUBTITLE,\n  VISIBILITY_PORTRAIT,\n  VISIBILITY_LANDSCAPE,\n  VISIBILITY_LANDSCAPE_MEDIA,\n} from './constants'\nimport type { DialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n  entries.forEach((entry) => {\n    if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n      entry.target[resizeHandlerSymbol](entry.target)\n    }\n  })\n})\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/DialogComponent/types.ts).\n */\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n  DialogComponentProps,\n  HTMLDivElement\n>(\n  forwardRef((props, ref) => {\n    const {\n      size = 's',\n      iconButtonProps = {},\n      captionProps = {},\n      titleProps = {},\n      subtitleProps = {},\n      draggingIconProps = {},\n      imgSrc = {},\n      skeletonProps = {},\n      fancy,\n      floats,\n      children,\n      caption,\n      title,\n      subtitle,\n      controls,\n      imgLandscapePositionRight,\n      imgPortraitPositionBottom,\n      className,\n      backgroundClassName,\n      scrollFadingDisabled,\n      draggable,\n      loading,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      onGrab,\n      onNudge,\n      ...restProps\n    } = props\n\n    const dialogSizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const sizeProps = getCommonSizeProps(dialogSizeProps)\n\n    const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n    const [scrollTop, setScrollTop] = useState<Nullable<boolean>>(null)\n    const [scrollBottom, setScrollBottom] = useState<Nullable<boolean>>(null)\n\n    const scrollable = useRef<HTMLDivElement | null>(null)\n\n    const handleScrollThresholds = useCallback((e: HTMLDivElement) => {\n      if (e.scrollHeight === e.clientHeight) {\n        setScrollTop(null)\n        setScrollBottom(null)\n      } else {\n        setScrollTop(e.scrollTop <= 0)\n        setScrollBottom(Math.abs(e.scrollHeight - e.clientHeight - e.scrollTop) <= 1)\n      }\n    }, [])\n\n    useLayoutEffect(() => {\n      const observerTarget = scrollable.current\n\n      if (!scrollFadingDisabled && observerTarget) {\n        observerTarget[resizeHandlerSymbol] = handleScrollThresholds\n        resizeObserver.observe(observerTarget)\n      }\n\n      return () => {\n        if (observerTarget) {\n          resizeObserver.unobserve(observerTarget)\n        }\n      }\n    }, [handleScrollThresholds, scrollFadingDisabled])\n\n    return (\n      <Styled.Root {...restProps} {...dialogSizeProps} className={rootClassName} fancy={fancy} ref={ref}>\n        {floats && floats(sizeProps)}\n        {fancy && <Styled.FancyBackground className={backgroundClassName} />}\n        {fancy && iconButtonProps.onClick && (\n          <Styled.PositionedIconButton\n            secondary\n            size='xxl'\n            icon='close'\n            inset={{ top: 0, right: 0 }}\n            {...iconButtonProps}\n          />\n        )}\n        {(draggable || (imgSrc.portrait && !imgPortraitPositionBottom) || fancy) && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n            {fancy && <Spacer top={96} />}\n            {draggable && (\n              <Styled.DraggingHandle onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            )}\n            {imgSrc.portrait && !imgPortraitPositionBottom && (\n              <Styled.MediaPortraitContainer top={!fancy}>\n                <Styled.MediaPortrait>\n                  <Styled.Placeholder orientation='portrait' aspectRatio='3:1' />\n                  {loading ? (\n                    <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n                  ) : (\n                    <Styled.Media src={imgSrc.portrait} />\n                  )}\n                </Styled.MediaPortrait>\n              </Styled.MediaPortraitContainer>\n            )}\n          </Visibility>\n        )}\n        {imgSrc.landscape && !imgLandscapePositionRight && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n            <Styled.MediaLandscape>\n              <Styled.Placeholder orientation='landscape' aspectRatio='5:7' />\n              {loading ? (\n                <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n              ) : (\n                <Styled.Media src={imgSrc.landscape} />\n              )}\n            </Styled.MediaLandscape>\n          </Visibility>\n        )}\n        {!fancy && iconButtonProps.onClick && (\n          <Styled.PositionedIconButton size='l' icon='close' inset={{ top: 8, right: 8 }} {...iconButtonProps} />\n        )}\n        <DialogContainer {...dialogSizeProps} fancy={fancy}>\n          {draggable && (\n            <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE}>\n              <Styled.DraggingHandle onPointerDown={onGrab}>\n                <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n                  <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n                </Styled.DraggingIconContainer>\n              </Styled.DraggingHandle>\n            </Visibility>\n          )}\n          <Styled.Fading visible={scrollTop === false} />\n          <Styled.ScrollableContent\n            ref={scrollable}\n            tabIndex={0}\n            onScroll={(evt) => {\n              if (!scrollFadingDisabled) {\n                handleScrollThresholds(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            {loading ? (\n              <>\n                <Skeleton>\n                  <Text appearance='heading' marginBottom='1.5em' sizes={SIZES_TITLE} {...sizeProps} {...titleProps} />\n                </Skeleton>\n                <Skeleton width='90%'>\n                  <Text\n                    appearance='body'\n                    marginBottom='0.4em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  />\n                </Skeleton>\n                <Skeleton width='70%'>\n                  <Text\n                    appearance='body'\n                    marginBottom='0.4em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  />\n                </Skeleton>\n                <Skeleton width='50%'>\n                  <Text\n                    appearance='body'\n                    marginBottom='0.8em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  />\n                </Skeleton>\n              </>\n            ) : (\n              <>\n                {caption && (\n                  <Text\n                    appearance='body'\n                    color='content-onmain-tertiary'\n                    wordBreak='break-word'\n                    marginBottom='0.8em'\n                    sizes={SIZES_CAPTION}\n                    {...sizeProps}\n                    {...captionProps}\n                  >\n                    {caption}\n                  </Text>\n                )}\n                {title && (\n                  <Text\n                    as='h2'\n                    appearance='heading'\n                    color='content-onmain-primary'\n                    wordBreak='break-word'\n                    marginBottom='0.5em'\n                    sizes={SIZES_TITLE}\n                    {...sizeProps}\n                    {...titleProps}\n                  >\n                    {title}\n                  </Text>\n                )}\n                {subtitle && (\n                  <Text\n                    as='p'\n                    appearance='body'\n                    color='content-onmain-primary'\n                    wordBreak='break-word'\n                    marginBottom='0.8em'\n                    sizes={SIZES_SUBTITLE}\n                    {...sizeProps}\n                    {...subtitleProps}\n                  >\n                    {subtitle}\n                  </Text>\n                )}\n                {children}\n              </>\n            )}\n          </Styled.ScrollableContent>\n          <Styled.Fading visible={scrollBottom === false} after />\n          {controls && (\n            <Styled.Controls>\n              {loading ? (\n                <Skeleton borderRadius={48} {...skeletonProps}>\n                  <Button preset='brand' {...sizeProps} />\n                </Skeleton>\n              ) : (\n                controls(sizeProps)\n              )}\n            </Styled.Controls>\n          )}\n        </DialogContainer>\n        {imgSrc.landscape && imgLandscapePositionRight && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n            <Styled.MediaLandscape right>\n              <Styled.Placeholder orientation='landscape' aspectRatio='5:7' />\n              {loading ? (\n                <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n              ) : (\n                <Styled.Media src={imgSrc.landscape} />\n              )}\n            </Styled.MediaLandscape>\n          </Visibility>\n        )}\n        {imgSrc.portrait && imgPortraitPositionBottom && (\n          <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n            <Styled.MediaPortraitContainer bottom>\n              <Styled.MediaPortrait>\n                <Styled.Placeholder orientation='portrait' aspectRatio='3:1' />\n                {loading ? (\n                  <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n                ) : (\n                  <Styled.Media src={imgSrc.portrait} />\n                )}\n              </Styled.MediaPortrait>\n            </Styled.MediaPortraitContainer>\n          </Visibility>\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\nexport { SIZES, SIZES_FANCY }\n"],"names":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","entries","forEach","entry","target","DialogComponent","withMergedProps","forwardRef","props","ref","size","iconButtonProps","captionProps","titleProps","subtitleProps","draggingIconProps","imgSrc","skeletonProps","fancy","floats","children","caption","title","subtitle","controls","imgLandscapePositionRight","imgPortraitPositionBottom","className","backgroundClassName","scrollFadingDisabled","draggable","loading","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","onGrab","onNudge","restProps","dialogSizeProps","sizeProps","getCommonSizeProps","rootClassName","concatClassNames","scrollTop","setScrollTop","useState","scrollBottom","setScrollBottom","scrollable","useRef","handleScrollThresholds","useCallback","e","scrollHeight","clientHeight","Math","abs","useLayoutEffect","observerTarget","current","observe","unobserve","_jsxs","Styled","_jsx","onClick","secondary","icon","inset","top","right","portrait","Visibility","sizes","VISIBILITY_PORTRAIT","Spacer","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","color","orientation","aspectRatio","width","height","borderRadius","src","landscape","VISIBILITY_LANDSCAPE_MEDIA","DialogContainer","VISIBILITY_LANDSCAPE","visible","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","_Fragment","Skeleton","Text","appearance","marginBottom","SIZES_TITLE","SIZES_SUBTITLE","wordBreak","SIZES_CAPTION","as","after","Button","preset","bottom","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}

package/components/FormInputLabel/FormInputLabel.js

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var constants=require('./constants.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');var Text=require('../Text/Text.js');const FormInputLabel=withMergedProps.withMergedProps(React.forwardRef(((e,r)=>{const{size:i="m",labelPosition:t="dynamic",iconProps:n={},icon:o,input:s,label:a,labelId:c,text:l,controls:d,addon:p,dropdown:u,active:g,...h}=e;const[m,v]=Array.isArray(o)?o:[o];return require$$0.jsxs(style.Root,{...h,size:i,ref:r,children:[m&&require$$0.jsx(Icon.Icon,{preset:"brand",name:typeof m=='string'?m:void 0,icon:typeof m!='string'?m:void 0,marginRight:12,...n}),require$$0.jsxs(style.InputContainer,{labelPosition:a?t:void 0,labelActive:g,children:[s,a&&require$$0.jsx(style.Label,{id:c,children:a})]}),l&&require$$0.jsx(Text.Text,{size:"inherit",color:"inherit",whiteSpace:"nowrap",marginLeft:12,marginRight:p||v||d?void 0:8,children:l}),p,v&&require$$0.jsx(Icon.Icon,{preset:"brand",name:typeof v=='string'?v:void 0,icon:typeof v!='string'?v:void 0,marginLeft:12,marginRight:d?void 0:4,...n}),d,u&&require$$0.jsx(style.Dropdown,{children:u})]})})),{sizes:constants.SIZES,displayName:"FormInputLabel"});exports.COMPONENT_NAME="FormInputLabel",exports.FormInputLabel=FormInputLabel;
+'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var constants=require('./constants.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');var Text=require('../Text/Text.js');const FormInputLabel=withMergedProps.withMergedProps(React.forwardRef(((e,r)=>{const{size:i="m",labelPosition:t="dynamic",inputPosition:n="center",iconProps:o={},icon:s,input:a,label:c,labelId:l,text:d,controls:p,addon:u,dropdown:g,active:h,...m}=e;const[v,x]=Array.isArray(s)?s:[s];return require$$0.jsxs(style.Root,{...m,size:i,ref:r,children:[v&&require$$0.jsx(Icon.Icon,{preset:"brand",name:typeof v=='string'?v:void 0,icon:typeof v!='string'?v:void 0,marginRight:12,...o}),require$$0.jsxs(style.InputContainer,{position:n,labelPosition:c?t:void 0,labelActive:h,children:[a,c&&require$$0.jsx(style.Label,{id:l,children:c})]}),d&&require$$0.jsx(Text.Text,{size:"inherit",color:"inherit",whiteSpace:"nowrap",marginLeft:12,marginRight:u||x||p?void 0:8,children:d}),u,x&&require$$0.jsx(Icon.Icon,{preset:"brand",name:typeof x=='string'?x:void 0,icon:typeof x!='string'?x:void 0,marginLeft:12,marginRight:p?void 0:4,...o}),p,g&&require$$0.jsx(style.Dropdown,{children:g})]})})),{sizes:constants.SIZES,displayName:"FormInputLabel"});exports.COMPONENT_NAME="FormInputLabel",exports.FormInputLabel=FormInputLabel;
 //# sourceMappingURL=FormInputLabel.js.map

package/components/FormInputLabel/FormInputLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormInputLabel.js","sources":["../../../../src/components/FormInputLabel/FormInputLabel.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { SIZES } from './constants'\nimport * as Styled from './style'\nimport type { FormInputLabelProps } from './types'\n\nconst COMPONENT_NAME = 'FormInputLabel'\n\nconst FormInputLabel: React.ForwardRefExoticComponent<FormInputLabelProps> = withMergedProps<\n  FormInputLabelProps,\n  HTMLDivElement\n>(\n  forwardRef((props, ref) => {\n    const {\n      size = 'm',\n      labelPosition = 'dynamic',\n      iconProps = {},\n      icon,\n      input,\n      label,\n      labelId,\n      text,\n      controls,\n      addon,\n      dropdown,\n      active,\n      ...restProps\n    } = props\n\n    const [before, after] = Array.isArray(icon) ? icon : [icon]\n\n    return (\n      <Styled.Root {...restProps} size={size} ref={ref}>\n        {before && (\n          <Icon\n            preset='brand'\n            name={typeof before === 'string' ? before : undefined}\n            icon={typeof before !== 'string' ? before : undefined}\n            marginRight={12}\n            {...iconProps}\n          />\n        )}\n        <Styled.InputContainer labelPosition={label ? labelPosition : undefined} labelActive={active}>\n          {input}\n          {label && <Styled.Label id={labelId}>{label}</Styled.Label>}\n        </Styled.InputContainer>\n        {text && (\n          <Text\n            size='inherit'\n            color='inherit'\n            whiteSpace='nowrap'\n            marginLeft={12}\n            marginRight={!addon && !after && !controls ? 8 : undefined}\n          >\n            {text}\n          </Text>\n        )}\n        {addon}\n        {after && (\n          <Icon\n            preset='brand'\n            name={typeof after === 'string' ? after : undefined}\n            icon={typeof after !== 'string' ? after : undefined}\n            marginLeft={12}\n            marginRight={!controls ? 4 : undefined}\n            {...iconProps}\n          />\n        )}\n        {controls}\n        {dropdown && <Styled.Dropdown>{dropdown}</Styled.Dropdown>}\n      </Styled.Root>\n    )\n  }),\n  {\n    sizes: SIZES,\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { FormInputLabel, COMPONENT_NAME }\n"],"names":["FormInputLabel","withMergedProps","forwardRef","props","ref","size","labelPosition","iconProps","icon","input","label","labelId","text","controls","addon","dropdown","active","restProps","before","after","Array","isArray","_jsxs","Styled","children","_jsx","jsx","Icon","preset","name","undefined","marginRight","jsxs","labelActive","id","Text","color","whiteSpace","marginLeft","sizes","SIZES","displayName"],"mappings":"iSAUMA,MAAAA,eAAuEC,gBAAAA,gBAI3EC,MAAAA,YAAW,CAACC,EAAOC,KACjB,MAAMC,KACJA,EAAO,IAAGC,cACVA,EAAgB,UAASC,UACzBA,EAAY,CAAE,EAAAC,KACdA,EAAIC,MACJA,EAAKC,MACLA,EAAKC,QACLA,EAAOC,KACPA,EAAIC,SACJA,EAAQC,MACRA,EAAKC,SACLA,EAAQC,OACRA,KACGC,GACDd,EAEJ,MAAOe,EAAQC,GAASC,MAAMC,QAAQb,GAAQA,EAAO,CAACA,GAEtD,OACEc,WAAAA,KAACC,MAAAA,KAAW,IAAKN,EAAWZ,KAAMA,EAAMD,IAAKA,EAAIoB,SAC9CN,CAAAA,GACCO,WAAAC,IAACC,UAAI,CACHC,OAAO,QACPC,YAAaX,GAAW,SAAWA,OAASY,EAC5CtB,YAAaU,GAAW,SAAWA,OAASY,EAC5CC,YAAa,MACTxB,IAGRe,WAAAU,KAACT,qBAAqB,CAACjB,cAAeI,EAAQJ,OAAgBwB,EAAWG,YAAajB,EAAOQ,SAAA,CAC1Ff,EACAC,GAASe,WAAAA,IAACF,MAAAA,MAAY,CAACW,GAAIvB,EAAQa,SAAEd,OAEvCE,GACCa,WAAAC,IAACS,UAAI,CACH9B,KAAK,UACL+B,MAAM,UACNC,WAAW,SACXC,WAAY,GACZP,YAAcjB,GAAUK,GAAUN,OAAeiB,EAAJ,EAAcN,SAE1DZ,IAGJE,EACAK,GACCM,WAAAA,IAACE,KAAAA,KAAI,CACHC,OAAO,QACPC,YAAaV,GAAU,SAAWA,OAAQW,EAC1CtB,YAAaW,GAAU,SAAWA,OAAQW,EAC1CQ,WAAY,GACZP,YAAclB,OAAeiB,EAAJ,KACrBvB,IAGPM,EACAE,GAAYU,WAAAA,IAACF,MAAAA,SAAe,CAAAC,SAAET,MACnB,IAGlB,CACEwB,MAAOC,UAAKA,MACZC,YArEmB,0CAAA"}
+{"version":3,"file":"FormInputLabel.js","sources":["../../../../src/components/FormInputLabel/FormInputLabel.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { SIZES } from './constants'\nimport * as Styled from './style'\nimport type { FormInputLabelProps } from './types'\n\nconst COMPONENT_NAME = 'FormInputLabel'\n\nconst FormInputLabel: React.ForwardRefExoticComponent<FormInputLabelProps> = withMergedProps<\n  FormInputLabelProps,\n  HTMLDivElement\n>(\n  forwardRef((props, ref) => {\n    const {\n      size = 'm',\n      labelPosition = 'dynamic',\n      inputPosition = 'center',\n      iconProps = {},\n      icon,\n      input,\n      label,\n      labelId,\n      text,\n      controls,\n      addon,\n      dropdown,\n      active,\n      ...restProps\n    } = props\n\n    const [before, after] = Array.isArray(icon) ? icon : [icon]\n\n    return (\n      <Styled.Root {...restProps} size={size} ref={ref}>\n        {before && (\n          <Icon\n            preset='brand'\n            name={typeof before === 'string' ? before : undefined}\n            icon={typeof before !== 'string' ? before : undefined}\n            marginRight={12}\n            {...iconProps}\n          />\n        )}\n        <Styled.InputContainer\n          position={inputPosition}\n          labelPosition={label ? labelPosition : undefined}\n          labelActive={active}\n        >\n          {input}\n          {label && <Styled.Label id={labelId}>{label}</Styled.Label>}\n        </Styled.InputContainer>\n        {text && (\n          <Text\n            size='inherit'\n            color='inherit'\n            whiteSpace='nowrap'\n            marginLeft={12}\n            marginRight={!addon && !after && !controls ? 8 : undefined}\n          >\n            {text}\n          </Text>\n        )}\n        {addon}\n        {after && (\n          <Icon\n            preset='brand'\n            name={typeof after === 'string' ? after : undefined}\n            icon={typeof after !== 'string' ? after : undefined}\n            marginLeft={12}\n            marginRight={!controls ? 4 : undefined}\n            {...iconProps}\n          />\n        )}\n        {controls}\n        {dropdown && <Styled.Dropdown>{dropdown}</Styled.Dropdown>}\n      </Styled.Root>\n    )\n  }),\n  {\n    sizes: SIZES,\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { FormInputLabel, COMPONENT_NAME }\n"],"names":["FormInputLabel","withMergedProps","forwardRef","props","ref","size","labelPosition","inputPosition","iconProps","icon","input","label","labelId","text","controls","addon","dropdown","active","restProps","before","after","Array","isArray","_jsxs","Styled","children","_jsx","jsx","Icon","preset","name","undefined","marginRight","jsxs","position","labelActive","id","Text","color","whiteSpace","marginLeft","sizes","SIZES","displayName"],"mappings":"iSAUMA,MAAAA,eAAuEC,gBAAAA,gBAI3EC,MAAAA,YAAW,CAACC,EAAOC,KACjB,MAAMC,KACJA,EAAO,IAAGC,cACVA,EAAgB,UAASC,cACzBA,EAAgB,SAAQC,UACxBA,EAAY,CAAE,EAAAC,KACdA,EAAIC,MACJA,EAAKC,MACLA,EAAKC,QACLA,EAAOC,KACPA,EAAIC,SACJA,EAAQC,MACRA,EAAKC,SACLA,EAAQC,OACRA,KACGC,GACDf,EAEJ,MAAOgB,EAAQC,GAASC,MAAMC,QAAQb,GAAQA,EAAO,CAACA,GAEtD,OACEc,WAAAA,KAACC,MAAAA,KAAW,IAAKN,EAAWb,KAAMA,EAAMD,IAAKA,EAAIqB,SAC9CN,CAAAA,GACCO,WAAAC,IAACC,UAAI,CACHC,OAAO,QACPC,YAAaX,GAAW,SAAWA,OAASY,EAC5CtB,YAAaU,GAAW,SAAWA,OAASY,EAC5CC,YAAa,MACTxB,IAGRe,WAAAU,KAACT,qBAAqB,CACpBU,SAAU3B,EACVD,cAAeK,EAAQL,OAAgByB,EACvCI,YAAalB,EAAOQ,SAAA,CAEnBf,EACAC,GAASe,WAAAA,IAACF,MAAAA,MAAY,CAACY,GAAIxB,EAAQa,SAAEd,OAEvCE,GACCa,WAAAC,IAACU,UAAI,CACHhC,KAAK,UACLiC,MAAM,UACNC,WAAW,SACXC,WAAY,GACZR,YAAcjB,GAAUK,GAAUN,OAAeiB,EAAJ,EAAcN,SAE1DZ,IAGJE,EACAK,GACCM,WAAAA,IAACE,KAAAA,KAAI,CACHC,OAAO,QACPC,YAAaV,GAAU,SAAWA,OAAQW,EAC1CtB,YAAaW,GAAU,SAAWA,OAAQW,EAC1CS,WAAY,GACZR,YAAclB,OAAeiB,EAAJ,KACrBvB,IAGPM,EACAE,GAAYU,WAAAA,IAACF,MAAAA,SAAe,CAAAC,SAAET,MACnB,IAGlB,CACEyB,MAAOC,UAAKA,MACZC,YA1EmB,0CAAA"}

package/components/FormInputLabel/FormInputLabel.mjs

@@ -1,2 +1,2 @@
-import{forwardRef}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{SIZES}from'./constants.mjs';import{Root,InputContainer,Label,Dropdown}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';import{Text}from'../Text/Text.mjs';const COMPONENT_NAME='FormInputLabel';const FormInputLabel=withMergedProps(forwardRef(((o,r)=>{const{size:t="m",labelPosition:e="dynamic",iconProps:i={},icon:n,input:s,label:a,labelId:m,text:p,controls:d,addon:c,dropdown:l,active:f,...x}=o;const[g,h]=Array.isArray(n)?n:[n];return jsxs(Root,{...x,size:t,ref:r,children:[g&&jsx(Icon,{preset:"brand",name:typeof g=='string'?g:void 0,icon:typeof g!='string'?g:void 0,marginRight:12,...i}),jsxs(InputContainer,{labelPosition:a?e:void 0,labelActive:f,children:[s,a&&jsx(Label,{id:m,children:a})]}),p&&jsx(Text,{size:"inherit",color:"inherit",whiteSpace:"nowrap",marginLeft:12,marginRight:c||h||d?void 0:8,children:p}),c,h&&jsx(Icon,{preset:"brand",name:typeof h=='string'?h:void 0,icon:typeof h!='string'?h:void 0,marginLeft:12,marginRight:d?void 0:4,...i}),d,l&&jsx(Dropdown,{children:l})]})})),{sizes:SIZES,displayName:"FormInputLabel"});export{COMPONENT_NAME,FormInputLabel};
+import{forwardRef}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{SIZES}from'./constants.mjs';import{Root,InputContainer,Label,Dropdown}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';import{Text}from'../Text/Text.mjs';const COMPONENT_NAME='FormInputLabel';const FormInputLabel=withMergedProps(forwardRef(((o,r)=>{const{size:i="m",labelPosition:t="dynamic",inputPosition:e="center",iconProps:n={},icon:s,input:a,label:m,labelId:p,text:c,controls:d,addon:l,dropdown:f,active:x,...g}=o;const[h,j]=Array.isArray(s)?s:[s];return jsxs(Root,{...g,size:i,ref:r,children:[h&&jsx(Icon,{preset:"brand",name:typeof h=='string'?h:void 0,icon:typeof h!='string'?h:void 0,marginRight:12,...n}),jsxs(InputContainer,{position:e,labelPosition:m?t:void 0,labelActive:x,children:[a,m&&jsx(Label,{id:p,children:m})]}),c&&jsx(Text,{size:"inherit",color:"inherit",whiteSpace:"nowrap",marginLeft:12,marginRight:l||j||d?void 0:8,children:c}),l,j&&jsx(Icon,{preset:"brand",name:typeof j=='string'?j:void 0,icon:typeof j!='string'?j:void 0,marginLeft:12,marginRight:d?void 0:4,...n}),d,f&&jsx(Dropdown,{children:f})]})})),{sizes:SIZES,displayName:"FormInputLabel"});export{COMPONENT_NAME,FormInputLabel};
 //# sourceMappingURL=FormInputLabel.mjs.map

package/components/FormInputLabel/FormInputLabel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FormInputLabel.mjs","sources":["../../../../src/components/FormInputLabel/FormInputLabel.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { SIZES } from './constants'\nimport * as Styled from './style'\nimport type { FormInputLabelProps } from './types'\n\nconst COMPONENT_NAME = 'FormInputLabel'\n\nconst FormInputLabel: React.ForwardRefExoticComponent<FormInputLabelProps> = withMergedProps<\n  FormInputLabelProps,\n  HTMLDivElement\n>(\n  forwardRef((props, ref) => {\n    const {\n      size = 'm',\n      labelPosition = 'dynamic',\n      iconProps = {},\n      icon,\n      input,\n      label,\n      labelId,\n      text,\n      controls,\n      addon,\n      dropdown,\n      active,\n      ...restProps\n    } = props\n\n    const [before, after] = Array.isArray(icon) ? icon : [icon]\n\n    return (\n      <Styled.Root {...restProps} size={size} ref={ref}>\n        {before && (\n          <Icon\n            preset='brand'\n            name={typeof before === 'string' ? before : undefined}\n            icon={typeof before !== 'string' ? before : undefined}\n            marginRight={12}\n            {...iconProps}\n          />\n        )}\n        <Styled.InputContainer labelPosition={label ? labelPosition : undefined} labelActive={active}>\n          {input}\n          {label && <Styled.Label id={labelId}>{label}</Styled.Label>}\n        </Styled.InputContainer>\n        {text && (\n          <Text\n            size='inherit'\n            color='inherit'\n            whiteSpace='nowrap'\n            marginLeft={12}\n            marginRight={!addon && !after && !controls ? 8 : undefined}\n          >\n            {text}\n          </Text>\n        )}\n        {addon}\n        {after && (\n          <Icon\n            preset='brand'\n            name={typeof after === 'string' ? after : undefined}\n            icon={typeof after !== 'string' ? after : undefined}\n            marginLeft={12}\n            marginRight={!controls ? 4 : undefined}\n            {...iconProps}\n          />\n        )}\n        {controls}\n        {dropdown && <Styled.Dropdown>{dropdown}</Styled.Dropdown>}\n      </Styled.Root>\n    )\n  }),\n  {\n    sizes: SIZES,\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { FormInputLabel, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","FormInputLabel","withMergedProps","forwardRef","props","ref","size","labelPosition","iconProps","icon","input","label","labelId","text","controls","addon","dropdown","active","restProps","before","after","Array","isArray","_jsxs","Styled","children","_jsx","Icon","preset","name","undefined","marginRight","labelActive","id","Text","color","whiteSpace","marginLeft","sizes","SIZES","displayName"],"mappings":"uSAQMA,MAAAA,eAAiB,iBAEjBC,MAAAA,eAAuEC,gBAI3EC,YAAW,CAACC,EAAOC,KACjB,MAAMC,KACJA,EAAO,IAAGC,cACVA,EAAgB,UAASC,UACzBA,EAAY,CAAE,EAAAC,KACdA,EAAIC,MACJA,EAAKC,MACLA,EAAKC,QACLA,EAAOC,KACPA,EAAIC,SACJA,EAAQC,MACRA,EAAKC,SACLA,EAAQC,OACRA,KACGC,GACDd,EAEJ,MAAOe,EAAQC,GAASC,MAAMC,QAAQb,GAAQA,EAAO,CAACA,GAEtD,OACEc,KAACC,KAAW,IAAKN,EAAWZ,KAAMA,EAAMD,IAAKA,EAAIoB,SAC9CN,CAAAA,GACCO,IAACC,KAAI,CACHC,OAAO,QACPC,YAAaV,GAAW,SAAWA,OAASW,EAC5CrB,YAAaU,GAAW,SAAWA,OAASW,EAC5CC,YAAa,MACTvB,IAGRe,KAACC,eAAqB,CAACjB,cAAeI,EAAQJ,OAAgBuB,EAAWE,YAAaf,EAAOQ,SAAA,CAC1Ff,EACAC,GAASe,IAACF,MAAY,CAACS,GAAIrB,EAAQa,SAAEd,OAEvCE,GACCa,IAACQ,KAAI,CACH5B,KAAK,UACL6B,MAAM,UACNC,WAAW,SACXC,WAAY,GACZN,YAAchB,GAAUK,GAAUN,OAAegB,EAAJ,EAAcL,SAE1DZ,IAGJE,EACAK,GACCM,IAACC,KAAI,CACHC,OAAO,QACPC,YAAaT,GAAU,SAAWA,OAAQU,EAC1CrB,YAAaW,GAAU,SAAWA,OAAQU,EAC1CO,WAAY,GACZN,YAAcjB,OAAegB,EAAJ,KACrBtB,IAGPM,EACAE,GAAYU,IAACF,SAAe,CAAAC,SAAET,MACnB,IAGlB,CACEsB,MAAOC,MACPC,YArEmB"}
+{"version":3,"file":"FormInputLabel.mjs","sources":["../../../../src/components/FormInputLabel/FormInputLabel.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { SIZES } from './constants'\nimport * as Styled from './style'\nimport type { FormInputLabelProps } from './types'\n\nconst COMPONENT_NAME = 'FormInputLabel'\n\nconst FormInputLabel: React.ForwardRefExoticComponent<FormInputLabelProps> = withMergedProps<\n  FormInputLabelProps,\n  HTMLDivElement\n>(\n  forwardRef((props, ref) => {\n    const {\n      size = 'm',\n      labelPosition = 'dynamic',\n      inputPosition = 'center',\n      iconProps = {},\n      icon,\n      input,\n      label,\n      labelId,\n      text,\n      controls,\n      addon,\n      dropdown,\n      active,\n      ...restProps\n    } = props\n\n    const [before, after] = Array.isArray(icon) ? icon : [icon]\n\n    return (\n      <Styled.Root {...restProps} size={size} ref={ref}>\n        {before && (\n          <Icon\n            preset='brand'\n            name={typeof before === 'string' ? before : undefined}\n            icon={typeof before !== 'string' ? before : undefined}\n            marginRight={12}\n            {...iconProps}\n          />\n        )}\n        <Styled.InputContainer\n          position={inputPosition}\n          labelPosition={label ? labelPosition : undefined}\n          labelActive={active}\n        >\n          {input}\n          {label && <Styled.Label id={labelId}>{label}</Styled.Label>}\n        </Styled.InputContainer>\n        {text && (\n          <Text\n            size='inherit'\n            color='inherit'\n            whiteSpace='nowrap'\n            marginLeft={12}\n            marginRight={!addon && !after && !controls ? 8 : undefined}\n          >\n            {text}\n          </Text>\n        )}\n        {addon}\n        {after && (\n          <Icon\n            preset='brand'\n            name={typeof after === 'string' ? after : undefined}\n            icon={typeof after !== 'string' ? after : undefined}\n            marginLeft={12}\n            marginRight={!controls ? 4 : undefined}\n            {...iconProps}\n          />\n        )}\n        {controls}\n        {dropdown && <Styled.Dropdown>{dropdown}</Styled.Dropdown>}\n      </Styled.Root>\n    )\n  }),\n  {\n    sizes: SIZES,\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { FormInputLabel, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","FormInputLabel","withMergedProps","forwardRef","props","ref","size","labelPosition","inputPosition","iconProps","icon","input","label","labelId","text","controls","addon","dropdown","active","restProps","before","after","Array","isArray","_jsxs","Styled","children","_jsx","Icon","preset","name","undefined","marginRight","position","labelActive","id","Text","color","whiteSpace","marginLeft","sizes","SIZES","displayName"],"mappings":"uSAQMA,MAAAA,eAAiB,iBAEjBC,MAAAA,eAAuEC,gBAI3EC,YAAW,CAACC,EAAOC,KACjB,MAAMC,KACJA,EAAO,IAAGC,cACVA,EAAgB,UAASC,cACzBA,EAAgB,SAAQC,UACxBA,EAAY,CAAE,EAAAC,KACdA,EAAIC,MACJA,EAAKC,MACLA,EAAKC,QACLA,EAAOC,KACPA,EAAIC,SACJA,EAAQC,MACRA,EAAKC,SACLA,EAAQC,OACRA,KACGC,GACDf,EAEJ,MAAOgB,EAAQC,GAASC,MAAMC,QAAQb,GAAQA,EAAO,CAACA,GAEtD,OACEc,KAACC,KAAW,IAAKN,EAAWb,KAAMA,EAAMD,IAAKA,EAAIqB,SAC9CN,CAAAA,GACCO,IAACC,KAAI,CACHC,OAAO,QACPC,YAAaV,GAAW,SAAWA,OAASW,EAC5CrB,YAAaU,GAAW,SAAWA,OAASW,EAC5CC,YAAa,MACTvB,IAGRe,KAACC,eAAqB,CACpBQ,SAAUzB,EACVD,cAAeK,EAAQL,OAAgBwB,EACvCG,YAAahB,EAAOQ,SAAA,CAEnBf,EACAC,GAASe,IAACF,MAAY,CAACU,GAAItB,EAAQa,SAAEd,OAEvCE,GACCa,IAACS,KAAI,CACH9B,KAAK,UACL+B,MAAM,UACNC,WAAW,SACXC,WAAY,GACZP,YAAchB,GAAUK,GAAUN,OAAegB,EAAJ,EAAcL,SAE1DZ,IAGJE,EACAK,GACCM,IAACC,KAAI,CACHC,OAAO,QACPC,YAAaT,GAAU,SAAWA,OAAQU,EAC1CrB,YAAaW,GAAU,SAAWA,OAAQU,EAC1CQ,WAAY,GACZP,YAAcjB,OAAegB,EAAJ,KACrBtB,IAGPM,EACAE,GAAYU,IAACF,SAAe,CAAAC,SAAET,MACnB,IAGlB,CACEuB,MAAOC,MACPC,YA1EmB"}

package/components/FormInputLabel/constants.js

@@ -1,2 +1,2 @@
-'use strict';exports.SIZES={l:{fontSize:18,paddingTop:4,paddingRight:8,paddingBottom:4,paddingLeft:16,minHeight:56,borderRadius:12},m:{fontSize:16,paddingTop:4,paddingRight:8,paddingBottom:4,paddingLeft:16,minHeight:48,borderRadius:10},s:{fontSize:14,paddingTop:4,paddingRight:6,paddingBottom:4,paddingLeft:14,minHeight:40,borderRadius:8}};
+'use strict';exports.SIZES={l:{fontSize:18,paddingTop:4,paddingRight:8,paddingBottom:4,paddingLeft:16,minHeight:56,borderRadius:12},m:{fontSize:16,paddingTop:4,paddingRight:8,paddingBottom:4,paddingLeft:16,minHeight:48,borderRadius:10},s:{fontSize:14,paddingTop:2,paddingRight:6,paddingBottom:2,paddingLeft:14,minHeight:40,borderRadius:8}};
 //# sourceMappingURL=constants.js.map

package/components/FormInputLabel/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sources":["../../../../src/components/FormInputLabel/constants.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { FormInputLabelSize } from './types'\n\nexport const SIZES: Record<FormInputLabelSize, CSSProperties> = {\n  l: {\n    fontSize: 18,\n    paddingTop: 4,\n    paddingRight: 8,\n    paddingBottom: 4,\n    paddingLeft: 16,\n    minHeight: 56,\n    borderRadius: 12,\n  },\n  m: {\n    fontSize: 16,\n    paddingTop: 4,\n    paddingRight: 8,\n    paddingBottom: 4,\n    paddingLeft: 16,\n    minHeight: 48,\n    borderRadius: 10,\n  },\n  s: {\n    fontSize: 14,\n    paddingTop: 4,\n    paddingRight: 6,\n    paddingBottom: 4,\n    paddingLeft: 14,\n    minHeight: 40,\n    borderRadius: 8,\n  },\n}\n"],"names":["l","fontSize","paddingTop","paddingRight","paddingBottom","paddingLeft","minHeight","borderRadius","m","s"],"mappings":"2BAGgE,CAC9DA,EAAG,CACDC,SAAU,GACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,GACbC,UAAW,GACXC,aAAc,IAEhBC,EAAG,CACDP,SAAU,GACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,GACbC,UAAW,GACXC,aAAc,IAEhBE,EAAG,CACDR,SAAU,GACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,GACbC,UAAW,GACXC,aAAc"}
+{"version":3,"file":"constants.js","sources":["../../../../src/components/FormInputLabel/constants.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { FormInputLabelSize } from './types'\n\nexport const SIZES: Record<FormInputLabelSize, CSSProperties> = {\n  l: {\n    fontSize: 18,\n    paddingTop: 4,\n    paddingRight: 8,\n    paddingBottom: 4,\n    paddingLeft: 16,\n    minHeight: 56,\n    borderRadius: 12,\n  },\n  m: {\n    fontSize: 16,\n    paddingTop: 4,\n    paddingRight: 8,\n    paddingBottom: 4,\n    paddingLeft: 16,\n    minHeight: 48,\n    borderRadius: 10,\n  },\n  s: {\n    fontSize: 14,\n    paddingTop: 2,\n    paddingRight: 6,\n    paddingBottom: 2,\n    paddingLeft: 14,\n    minHeight: 40,\n    borderRadius: 8,\n  },\n}\n"],"names":["l","fontSize","paddingTop","paddingRight","paddingBottom","paddingLeft","minHeight","borderRadius","m","s"],"mappings":"2BAGgE,CAC9DA,EAAG,CACDC,SAAU,GACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,GACbC,UAAW,GACXC,aAAc,IAEhBC,EAAG,CACDP,SAAU,GACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,GACbC,UAAW,GACXC,aAAc,IAEhBE,EAAG,CACDR,SAAU,GACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,GACbC,UAAW,GACXC,aAAc"}

package/components/FormInputLabel/constants.mjs

@@ -1,2 +1,2 @@
-const SIZES={l:{fontSize:18,paddingTop:4,paddingRight:8,paddingBottom:4,paddingLeft:16,minHeight:56,borderRadius:12},m:{fontSize:16,paddingTop:4,paddingRight:8,paddingBottom:4,paddingLeft:16,minHeight:48,borderRadius:10},s:{fontSize:14,paddingTop:4,paddingRight:6,paddingBottom:4,paddingLeft:14,minHeight:40,borderRadius:8}};export{SIZES};
+const SIZES={l:{fontSize:18,paddingTop:4,paddingRight:8,paddingBottom:4,paddingLeft:16,minHeight:56,borderRadius:12},m:{fontSize:16,paddingTop:4,paddingRight:8,paddingBottom:4,paddingLeft:16,minHeight:48,borderRadius:10},s:{fontSize:14,paddingTop:2,paddingRight:6,paddingBottom:2,paddingLeft:14,minHeight:40,borderRadius:8}};export{SIZES};
 //# sourceMappingURL=constants.mjs.map

package/components/FormInputLabel/constants.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"constants.mjs","sources":["../../../../src/components/FormInputLabel/constants.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { FormInputLabelSize } from './types'\n\nexport const SIZES: Record<FormInputLabelSize, CSSProperties> = {\n  l: {\n    fontSize: 18,\n    paddingTop: 4,\n    paddingRight: 8,\n    paddingBottom: 4,\n    paddingLeft: 16,\n    minHeight: 56,\n    borderRadius: 12,\n  },\n  m: {\n    fontSize: 16,\n    paddingTop: 4,\n    paddingRight: 8,\n    paddingBottom: 4,\n    paddingLeft: 16,\n    minHeight: 48,\n    borderRadius: 10,\n  },\n  s: {\n    fontSize: 14,\n    paddingTop: 4,\n    paddingRight: 6,\n    paddingBottom: 4,\n    paddingLeft: 14,\n    minHeight: 40,\n    borderRadius: 8,\n  },\n}\n"],"names":["SIZES","l","fontSize","paddingTop","paddingRight","paddingBottom","paddingLeft","minHeight","borderRadius","m","s"],"mappings":"AAGO,MAAMA,MAAmD,CAC9DC,EAAG,CACDC,SAAU,GACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,GACbC,UAAW,GACXC,aAAc,IAEhBC,EAAG,CACDP,SAAU,GACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,GACbC,UAAW,GACXC,aAAc,IAEhBE,EAAG,CACDR,SAAU,GACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,GACbC,UAAW,GACXC,aAAc"}
+{"version":3,"file":"constants.mjs","sources":["../../../../src/components/FormInputLabel/constants.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { FormInputLabelSize } from './types'\n\nexport const SIZES: Record<FormInputLabelSize, CSSProperties> = {\n  l: {\n    fontSize: 18,\n    paddingTop: 4,\n    paddingRight: 8,\n    paddingBottom: 4,\n    paddingLeft: 16,\n    minHeight: 56,\n    borderRadius: 12,\n  },\n  m: {\n    fontSize: 16,\n    paddingTop: 4,\n    paddingRight: 8,\n    paddingBottom: 4,\n    paddingLeft: 16,\n    minHeight: 48,\n    borderRadius: 10,\n  },\n  s: {\n    fontSize: 14,\n    paddingTop: 2,\n    paddingRight: 6,\n    paddingBottom: 2,\n    paddingLeft: 14,\n    minHeight: 40,\n    borderRadius: 8,\n  },\n}\n"],"names":["SIZES","l","fontSize","paddingTop","paddingRight","paddingBottom","paddingLeft","minHeight","borderRadius","m","s"],"mappings":"AAGO,MAAMA,MAAmD,CAC9DC,EAAG,CACDC,SAAU,GACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,GACbC,UAAW,GACXC,aAAc,IAEhBC,EAAG,CACDP,SAAU,GACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,GACbC,UAAW,GACXC,aAAc,IAEhBE,EAAG,CACDR,SAAU,GACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,GACbC,UAAW,GACXC,aAAc"}

package/components/FormInputLabel/style.js

@@ -1,2 +1,2 @@
-'use strict';var styled=require('styled-components');var tinycolor=require('../../external/.pnpm/tinycolor2@1.4.2/node_modules/tinycolor2/tinycolor.js');var style=require('../../shared/utils/style.js');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveMargin=require('../../mixins/responsive-margin.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const shouldForwardFormInputLabelProp=style.createShouldForwardProp((o=>!['primary','secondary','error','success','disabled','onColored','inline','zIndex'].includes(o)));const template=o=>`\n  color: ${o.color};\n  background-color: ${o.backgroundColor};\n  border-color: ${o.borderColor};\n  &:hover {\n    background-color: ${o.backgroundColorHover};\n  }\n  &:focus-within {\n    background-color: ${o.backgroundColor};\n  }\n  & [data-input-control]::after {\n    color: ${o.backgroundColor}; \n  }\n`;const COLOR_SCHEMA={contrast:{disabled:styled.css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-200'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-200'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-200'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-200'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-primary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:tinycolor.default(o.theme.colors['bg-onmain-primary']).darken(4).toString(),...o.palette})))},secondary:{disabled:styled.css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-100'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-100'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-100'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-100'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-secondary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:tinycolor.default(o.theme.colors['bg-onmain-secondary']).darken(4).toString(),...o.palette})))},primary:{disabled:styled.css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-100'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-100'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-100'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-100'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-primary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:tinycolor.default(o.theme.colors['bg-onmain-primary']).darken(4).toString(),...o.palette})))}};const Dropdown=styled__default.default.div.withConfig({displayName:"FormInputLabel__Dropdown",componentId:"ui__sc-1il4atw-0"})(["box-sizing:border-box;position:absolute;top:100%;margin-top:8px;"]);const Root=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardFormInputLabelProp}).withConfig({displayName:"FormInputLabel__Root",componentId:"ui__sc-1il4atw-1"})([""," "," "," ",""],(o=>{const e='1px';return`\n      box-sizing: border-box;\n      position: relative;\n      isolation: isolate;\n      display: ${o.inline?'inline-flex':'flex'};\n      cursor: ${o.disabled?'not-allowed':'pointer'};\n      align-items: center;\n      min-width: min-content;\n      border: ${e} solid transparent;\n      z-index: ${o.zIndex??'auto'};\n      transition-property: background-color;\n      transition-duration: 150ms;\n      transition-timing-function: ease-in;\n\n      & > ${Dropdown} {\n        right: -${e};\n        left: -${e};\n      }\n\n      &:focus-within {\n        box-shadow: 0 0 0 2px ${o.theme.colors.white}, 0 0 0 4px ${o.theme.colors['border-focus']};\n        outline: 2px solid transparent;\n        outline-offset: 2px;\n      }\n\n      &:hover [data-input-control]::after,\n      &:focus-within [data-input-control]::after {\n        opacity: 0;\n      }\n    `}),(o=>{let e=COLOR_SCHEMA.primary;return o.secondary&&(e=COLOR_SCHEMA.secondary),(o.contrast||o.onColored)&&(e=COLOR_SCHEMA.contrast),o.disabled?e.disabled:o.error?e.error:o.success?e.success:e.default}),responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);const Label=styled__default.default.span.withConfig({displayName:"FormInputLabel__Label",componentId:"ui__sc-1il4atw-2"})(["box-sizing:border-box;position:absolute;left:0;top:50%;transform:translateY(-50%);width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none;transition-property:transform,width;transition-duration:","ms,0ms;transition-delay:0ms,0ms;transition-timing-function:cubic-bezier(0,0,0.48,1);"],125);const InputContainer=styled__default.default.div.withConfig({shouldForwardProp:o=>!['labelPosition','labelActive'].includes(o)}).withConfig({displayName:"FormInputLabel__InputContainer",componentId:"ui__sc-1il4atw-3"})(["box-sizing:border-box;position:relative;display:flex;flex-grow:1;align-self:stretch;cursor:inherit;"," "," ",""],(o=>o.labelPosition==='dynamic'&&`\n      padding-top: 0.8em;\n\n      & input {\n        opacity: ${o.labelActive?1:0};\n      }\n\n       ${o.labelActive&&`& > ${Label} {\n              transition-delay: 0ms, 125ms;\n              transform: scale(0.7) translateX(-21.4%) translateY(-140%);\n              width: 130%;\n            }`}\n    `),(o=>o.labelPosition==='top'&&`\n      padding-top: 0.8em;\n\n      & > ${Label} {\n        transition-delay: 0ms, 125ms;\n        transform: scale(0.7) translateX(-21.4%) translateY(-140%);\n        width: 130%;\n      }\n    `),(o=>o.labelPosition==='center'&&`\n      & input {\n        opacity: ${o.labelActive?1:0};\n      }\n\n      & > ${Label} {\n        opacity: ${o.labelActive?0:1};\n        z-index: ${o.labelActive?-1:'auto'};\n      }\n    `));exports.Dropdown=Dropdown,exports.InputContainer=InputContainer,exports.Label=Label,exports.Root=Root;
+'use strict';var styled=require('styled-components');var tinycolor=require('../../external/.pnpm/tinycolor2@1.4.2/node_modules/tinycolor2/tinycolor.js');var style=require('../../shared/utils/style.js');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveMargin=require('../../mixins/responsive-margin.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const shouldForwardFormInputLabelProp=style.createShouldForwardProp((o=>!['primary','secondary','error','success','disabled','onColored','inline','zIndex','overflow'].includes(o)));const template=o=>`\n  color: ${o.color};\n  background-color: ${o.backgroundColor};\n  border-color: ${o.borderColor};\n  &:hover {\n    background-color: ${o.backgroundColorHover};\n  }\n  &:focus-within {\n    background-color: ${o.backgroundColor};\n  }\n  & [data-input-control]::after {\n    color: ${o.backgroundColor}; \n  }\n`;const COLOR_SCHEMA={contrast:{disabled:styled.css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-200'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-200'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-200'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-200'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-primary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:tinycolor.default(o.theme.colors['bg-onmain-primary']).darken(4).toString(),...o.palette})))},secondary:{disabled:styled.css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-100'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-100'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-100'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-100'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-secondary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:tinycolor.default(o.theme.colors['bg-onmain-secondary']).darken(4).toString(),...o.palette})))},primary:{disabled:styled.css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-100'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-100'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-100'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-100'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-primary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:tinycolor.default(o.theme.colors['bg-onmain-primary']).darken(4).toString(),...o.palette})))}};const Dropdown=styled__default.default.div.withConfig({displayName:"FormInputLabel__Dropdown",componentId:"ui__sc-1il4atw-0"})(["box-sizing:border-box;position:absolute;top:100%;margin-top:8px;"]);const Root=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardFormInputLabelProp}).withConfig({displayName:"FormInputLabel__Root",componentId:"ui__sc-1il4atw-1"})([""," "," "," ",""],(o=>{const e='1px';return`\n      box-sizing: border-box;\n      position: relative;\n      isolation: isolate;\n      display: ${o.inline?'inline-flex':'flex'};\n      cursor: ${o.disabled?'not-allowed':'pointer'};\n      align-items: center;\n      min-width: min-content;\n      border: ${e} solid transparent;\n      z-index: ${o.zIndex??'auto'};\n      overflow: ${o.overflow??'visible'};\n      transition-property: background-color;\n      transition-duration: 150ms;\n      transition-timing-function: ease-in;\n\n      & > ${Dropdown} {\n        right: -${e};\n        left: -${e};\n      }\n\n      &:focus-within {\n        box-shadow: 0 0 0 2px ${o.theme.colors.white}, 0 0 0 4px ${o.theme.colors['border-focus']};\n        outline: 2px solid transparent;\n        outline-offset: 2px;\n      }\n\n      &:hover [data-input-control]::after,\n      &:focus-within [data-input-control]::after {\n        opacity: 0;\n      }\n    `}),(o=>{let e=COLOR_SCHEMA.primary;return o.secondary&&(e=COLOR_SCHEMA.secondary),(o.contrast||o.onColored)&&(e=COLOR_SCHEMA.contrast),o.disabled?e.disabled:o.error?e.error:o.success?e.success:e.default}),responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);const Label=styled__default.default.span.withConfig({displayName:"FormInputLabel__Label",componentId:"ui__sc-1il4atw-2"})(["box-sizing:border-box;position:absolute;left:0;top:0;transform:translateY(0.7em);width:100%;white-space:nowrap;overflow:hidden;line-height:1;text-overflow:ellipsis;pointer-events:none;transition-property:transform,width;transition-duration:","ms,0ms;transition-delay:0ms,0ms;transition-timing-function:cubic-bezier(0,0,0.48,1);"],125);const InputContainer=styled__default.default.div.withConfig({shouldForwardProp:o=>!['position','labelPosition','labelActive'].includes(o)}).withConfig({displayName:"FormInputLabel__InputContainer",componentId:"ui__sc-1il4atw-3"})([""," "," "," ",""],(o=>`\n    box-sizing: border-box;\n    position: relative;\n    display: flex;\n    flex-grow: 1;\n    align-self: ${o.position};\n    cursor: inherit;\n    min-height: 2.4em;\n  `),(o=>o.labelPosition==='dynamic'&&`\n      padding-top: 0.7em;\n\n      & input, & textarea {\n        opacity: ${o.labelActive?1:0};\n      }\n\n       ${o.labelActive&&`& > ${Label} {\n              transition-delay: 0ms, 125ms;\n              transform: scale(0.7) translateX(-21.4%) translateY(0px);\n              width: 130%;\n            }`}\n    `),(o=>o.labelPosition==='top'&&`\n      padding-top: 0.7em;\n\n      & > ${Label} {\n        transition-delay: 0ms, 125ms;\n        transform: scale(0.7) translateX(-21.4%) translateY(0px);\n        width: 130%;\n      }\n    `),(o=>o.labelPosition==='center'&&`\n      & input, & textarea {\n        opacity: ${o.labelActive?1:0};\n      }\n\n      & > ${Label} {\n        opacity: ${o.labelActive?0:1};\n        z-index: ${o.labelActive?-1:'auto'};\n      }\n    `));exports.Dropdown=Dropdown,exports.InputContainer=InputContainer,exports.Label=Label,exports.Root=Root;
 //# sourceMappingURL=style.js.map

package/components/FormInputLabel/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/FormInputLabel/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { CSSColor } from 'shared/types'\nimport type { StyledFormInputLabelProps, FormInputLabelPalette, StyledInputContainerProps } from './types'\n\nconst shouldForwardFormInputLabelProp = createShouldForwardProp(\n  (propKey) =>\n    !['primary', 'secondary', 'error', 'success', 'disabled', 'onColored', 'inline', 'zIndex'].includes(propKey)\n)\n\nconst labelTransitionMS = 125\n\nconst template = (palette: FormInputLabelPalette) => `\n  color: ${palette.color};\n  background-color: ${palette.backgroundColor};\n  border-color: ${palette.borderColor};\n  &:hover {\n    background-color: ${palette.backgroundColorHover};\n  }\n  &:focus-within {\n    background-color: ${palette.backgroundColor};\n  }\n  & [data-input-control]::after {\n    color: ${palette.backgroundColor}; \n  }\n`\n\nconst COLOR_SCHEMA = {\n  contrast: {\n    disabled: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-disabled'],\n          backgroundColor: props.theme.colors['bg-disabled-large'],\n          borderColor: props.theme.colors.transparent,\n          backgroundColorHover: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    error: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-error-200'],\n          borderColor: props.theme.colors['alert-bg-error-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-error-200'],\n          ...props.palette,\n        })}\n    `,\n    success: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-success-200'],\n          borderColor: props.theme.colors['alert-bg-success-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-success-200'],\n          ...props.palette,\n        })}\n    `,\n    default: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['bg-onmain-primary'],\n          borderColor: props.theme.colors['border-onmain-default-large'],\n          backgroundColorHover: tinycolor(props.theme.colors['bg-onmain-primary']).darken(4).toString() as CSSColor,\n          ...props.palette,\n        })}\n    `,\n  },\n  secondary: {\n    disabled: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-disabled'],\n          backgroundColor: props.theme.colors['bg-disabled-large'],\n          borderColor: props.theme.colors.transparent,\n          backgroundColorHover: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    error: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-error-100'],\n          borderColor: props.theme.colors['alert-bg-error-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-error-100'],\n          ...props.palette,\n        })}\n    `,\n    success: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-success-100'],\n          borderColor: props.theme.colors['alert-bg-success-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-success-100'],\n          ...props.palette,\n        })}\n    `,\n    default: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['bg-onmain-secondary'],\n          borderColor: props.theme.colors['border-onmain-default-large'],\n          backgroundColorHover: tinycolor(props.theme.colors['bg-onmain-secondary']).darken(4).toString() as CSSColor,\n          ...props.palette,\n        })}\n    `,\n  },\n  primary: {\n    disabled: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-disabled'],\n          backgroundColor: props.theme.colors['bg-disabled-large'],\n          borderColor: props.theme.colors.transparent,\n          backgroundColorHover: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    error: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-error-100'],\n          borderColor: props.theme.colors['alert-bg-error-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-error-100'],\n          ...props.palette,\n        })}\n    `,\n    success: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-success-100'],\n          borderColor: props.theme.colors['alert-bg-success-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-success-100'],\n          ...props.palette,\n        })}\n    `,\n    default: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['bg-onmain-primary'],\n          borderColor: props.theme.colors['border-onmain-default-large'],\n          backgroundColorHover: tinycolor(props.theme.colors['bg-onmain-primary']).darken(4).toString() as CSSColor,\n          ...props.palette,\n        })}\n    `,\n  },\n}\n\nexport const Dropdown = styled.div`\n  box-sizing: border-box;\n  position: absolute;\n  top: 100%;\n  margin-top: 8px;\n`\n\nexport const Root = styled.div.withConfig<StyledFormInputLabelProps>({\n  shouldForwardProp: shouldForwardFormInputLabelProp,\n})`\n  ${(props) => {\n    const borderWidth = '1px'\n\n    return `\n      box-sizing: border-box;\n      position: relative;\n      isolation: isolate;\n      display: ${props.inline ? 'inline-flex' : 'flex'};\n      cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n      align-items: center;\n      min-width: min-content;\n      border: ${borderWidth} solid transparent;\n      z-index: ${props.zIndex ?? 'auto'};\n      transition-property: background-color;\n      transition-duration: 150ms;\n      transition-timing-function: ease-in;\n\n      & > ${Dropdown} {\n        right: -${borderWidth};\n        left: -${borderWidth};\n      }\n\n      &:focus-within {\n        box-shadow: 0 0 0 2px ${props.theme.colors.white}, 0 0 0 4px ${props.theme.colors['border-focus']};\n        outline: 2px solid transparent;\n        outline-offset: 2px;\n      }\n\n      &:hover [data-input-control]::after,\n      &:focus-within [data-input-control]::after {\n        opacity: 0;\n      }\n    `\n  }}\n  ${(props) => {\n    let schema = COLOR_SCHEMA.primary\n\n    if (props.secondary) schema = COLOR_SCHEMA.secondary\n    if (props.contrast || props.onColored) schema = COLOR_SCHEMA.contrast\n\n    if (props.disabled) return schema.disabled\n    if (props.error) return schema.error\n    if (props.success) return schema.success\n\n    return schema.default\n  }}\n\n  ${responsiveSize}\n  ${responsiveMargin}\n`\n\nexport const Label = styled.span`\n  box-sizing: border-box;\n  position: absolute;\n  left: 0;\n  top: 50%;\n  transform: translateY(-50%);\n  width: 100%;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  pointer-events: none;\n  transition-property: transform, width;\n  transition-duration: ${labelTransitionMS}ms, 0ms;\n  transition-delay: 0ms, 0ms;\n  transition-timing-function: cubic-bezier(0, 0, 0.48, 1);\n`\n\nexport const InputContainer = styled.div.withConfig<StyledInputContainerProps>({\n  shouldForwardProp: (propKey) => !['labelPosition', 'labelActive'].includes(propKey),\n})`\n  box-sizing: border-box;\n  position: relative;\n  display: flex;\n  flex-grow: 1;\n  align-self: stretch;\n  cursor: inherit;\n\n  ${(props) =>\n    props.labelPosition === 'dynamic' &&\n    `\n      padding-top: 0.8em;\n\n      & input {\n        opacity: ${props.labelActive ? 1 : 0};\n      }\n\n       ${\n         props.labelActive &&\n         `& > ${Label} {\n              transition-delay: 0ms, ${labelTransitionMS}ms;\n              transform: scale(0.7) translateX(-21.4%) translateY(-140%);\n              width: 130%;\n            }`\n       }\n    `}\n\n  ${(props) =>\n    props.labelPosition === 'top' &&\n    `\n      padding-top: 0.8em;\n\n      & > ${Label} {\n        transition-delay: 0ms, ${labelTransitionMS}ms;\n        transform: scale(0.7) translateX(-21.4%) translateY(-140%);\n        width: 130%;\n      }\n    `}\n\n  ${(props) =>\n    props.labelPosition === 'center' &&\n    `\n      & input {\n        opacity: ${props.labelActive ? 1 : 0};\n      }\n\n      & > ${Label} {\n        opacity: ${props.labelActive ? 0 : 1};\n        z-index: ${props.labelActive ? -1 : 'auto'};\n      }\n    `}\n`\n"],"names":["shouldForwardFormInputLabelProp","createShouldForwardProp","propKey","includes","template","palette","color","backgroundColor","borderColor","backgroundColorHover","COLOR_SCHEMA","contrast","disabled","css","props","theme","colors","transparent","error","success","default","tinycolor","darken","toString","secondary","primary","Dropdown","styled","div","withConfig","displayName","componentId","Root","shouldForwardProp","borderWidth","inline","zIndex","white","schema","onColored","responsiveSize","responsiveMargin","Label","span","InputContainer","labelPosition","labelActive"],"mappings":"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"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/FormInputLabel/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { CSSColor } from 'shared/types'\nimport type { StyledFormInputLabelProps, FormInputLabelPalette, StyledInputContainerProps } from './types'\n\nconst shouldForwardFormInputLabelProp = createShouldForwardProp(\n  (propKey) =>\n    !['primary', 'secondary', 'error', 'success', 'disabled', 'onColored', 'inline', 'zIndex', 'overflow'].includes(\n      propKey\n    )\n)\n\nconst labelTransitionMS = 125\n\nconst template = (palette: FormInputLabelPalette) => `\n  color: ${palette.color};\n  background-color: ${palette.backgroundColor};\n  border-color: ${palette.borderColor};\n  &:hover {\n    background-color: ${palette.backgroundColorHover};\n  }\n  &:focus-within {\n    background-color: ${palette.backgroundColor};\n  }\n  & [data-input-control]::after {\n    color: ${palette.backgroundColor}; \n  }\n`\n\nconst COLOR_SCHEMA = {\n  contrast: {\n    disabled: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-disabled'],\n          backgroundColor: props.theme.colors['bg-disabled-large'],\n          borderColor: props.theme.colors.transparent,\n          backgroundColorHover: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    error: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-error-200'],\n          borderColor: props.theme.colors['alert-bg-error-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-error-200'],\n          ...props.palette,\n        })}\n    `,\n    success: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-success-200'],\n          borderColor: props.theme.colors['alert-bg-success-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-success-200'],\n          ...props.palette,\n        })}\n    `,\n    default: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['bg-onmain-primary'],\n          borderColor: props.theme.colors['border-onmain-default-large'],\n          backgroundColorHover: tinycolor(props.theme.colors['bg-onmain-primary']).darken(4).toString() as CSSColor,\n          ...props.palette,\n        })}\n    `,\n  },\n  secondary: {\n    disabled: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-disabled'],\n          backgroundColor: props.theme.colors['bg-disabled-large'],\n          borderColor: props.theme.colors.transparent,\n          backgroundColorHover: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    error: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-error-100'],\n          borderColor: props.theme.colors['alert-bg-error-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-error-100'],\n          ...props.palette,\n        })}\n    `,\n    success: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-success-100'],\n          borderColor: props.theme.colors['alert-bg-success-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-success-100'],\n          ...props.palette,\n        })}\n    `,\n    default: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['bg-onmain-secondary'],\n          borderColor: props.theme.colors['border-onmain-default-large'],\n          backgroundColorHover: tinycolor(props.theme.colors['bg-onmain-secondary']).darken(4).toString() as CSSColor,\n          ...props.palette,\n        })}\n    `,\n  },\n  primary: {\n    disabled: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-disabled'],\n          backgroundColor: props.theme.colors['bg-disabled-large'],\n          borderColor: props.theme.colors.transparent,\n          backgroundColorHover: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    error: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-error-100'],\n          borderColor: props.theme.colors['alert-bg-error-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-error-100'],\n          ...props.palette,\n        })}\n    `,\n    success: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-success-100'],\n          borderColor: props.theme.colors['alert-bg-success-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-success-100'],\n          ...props.palette,\n        })}\n    `,\n    default: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['bg-onmain-primary'],\n          borderColor: props.theme.colors['border-onmain-default-large'],\n          backgroundColorHover: tinycolor(props.theme.colors['bg-onmain-primary']).darken(4).toString() as CSSColor,\n          ...props.palette,\n        })}\n    `,\n  },\n}\n\nexport const Dropdown = styled.div`\n  box-sizing: border-box;\n  position: absolute;\n  top: 100%;\n  margin-top: 8px;\n`\n\nexport const Root = styled.div.withConfig<StyledFormInputLabelProps>({\n  shouldForwardProp: shouldForwardFormInputLabelProp,\n})`\n  ${(props) => {\n    const borderWidth = '1px'\n\n    return `\n      box-sizing: border-box;\n      position: relative;\n      isolation: isolate;\n      display: ${props.inline ? 'inline-flex' : 'flex'};\n      cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n      align-items: center;\n      min-width: min-content;\n      border: ${borderWidth} solid transparent;\n      z-index: ${props.zIndex ?? 'auto'};\n      overflow: ${props.overflow ?? 'visible'};\n      transition-property: background-color;\n      transition-duration: 150ms;\n      transition-timing-function: ease-in;\n\n      & > ${Dropdown} {\n        right: -${borderWidth};\n        left: -${borderWidth};\n      }\n\n      &:focus-within {\n        box-shadow: 0 0 0 2px ${props.theme.colors.white}, 0 0 0 4px ${props.theme.colors['border-focus']};\n        outline: 2px solid transparent;\n        outline-offset: 2px;\n      }\n\n      &:hover [data-input-control]::after,\n      &:focus-within [data-input-control]::after {\n        opacity: 0;\n      }\n    `\n  }}\n  ${(props) => {\n    let schema = COLOR_SCHEMA.primary\n\n    if (props.secondary) schema = COLOR_SCHEMA.secondary\n    if (props.contrast || props.onColored) schema = COLOR_SCHEMA.contrast\n\n    if (props.disabled) return schema.disabled\n    if (props.error) return schema.error\n    if (props.success) return schema.success\n\n    return schema.default\n  }}\n\n  ${responsiveSize}\n  ${responsiveMargin}\n`\n\nexport const Label = styled.span`\n  box-sizing: border-box;\n  position: absolute;\n  left: 0;\n  top: 0;\n  transform: translateY(0.7em);\n  width: 100%;\n  white-space: nowrap;\n  overflow: hidden;\n  line-height: 1;\n  text-overflow: ellipsis;\n  pointer-events: none;\n  transition-property: transform, width;\n  transition-duration: ${labelTransitionMS}ms, 0ms;\n  transition-delay: 0ms, 0ms;\n  transition-timing-function: cubic-bezier(0, 0, 0.48, 1);\n`\n\nexport const InputContainer = styled.div.withConfig<StyledInputContainerProps>({\n  shouldForwardProp: (propKey) => !['position', 'labelPosition', 'labelActive'].includes(propKey),\n})`\n  ${(props) => `\n    box-sizing: border-box;\n    position: relative;\n    display: flex;\n    flex-grow: 1;\n    align-self: ${props.position};\n    cursor: inherit;\n    min-height: 2.4em;\n  `}\n\n  ${(props) =>\n    props.labelPosition === 'dynamic' &&\n    `\n      padding-top: 0.7em;\n\n      & input, & textarea {\n        opacity: ${props.labelActive ? 1 : 0};\n      }\n\n       ${\n         props.labelActive &&\n         `& > ${Label} {\n              transition-delay: 0ms, ${labelTransitionMS}ms;\n              transform: scale(0.7) translateX(-21.4%) translateY(0px);\n              width: 130%;\n            }`\n       }\n    `}\n\n  ${(props) =>\n    props.labelPosition === 'top' &&\n    `\n      padding-top: 0.7em;\n\n      & > ${Label} {\n        transition-delay: 0ms, ${labelTransitionMS}ms;\n        transform: scale(0.7) translateX(-21.4%) translateY(0px);\n        width: 130%;\n      }\n    `}\n\n  ${(props) =>\n    props.labelPosition === 'center' &&\n    `\n      & input, & textarea {\n        opacity: ${props.labelActive ? 1 : 0};\n      }\n\n      & > ${Label} {\n        opacity: ${props.labelActive ? 0 : 1};\n        z-index: ${props.labelActive ? -1 : 'auto'};\n      }\n    `}\n`\n"],"names":["shouldForwardFormInputLabelProp","createShouldForwardProp","propKey","includes","template","palette","color","backgroundColor","borderColor","backgroundColorHover","COLOR_SCHEMA","contrast","disabled","css","props","theme","colors","transparent","error","success","default","tinycolor","darken","toString","secondary","primary","Dropdown","styled","div","withConfig","displayName","componentId","Root","shouldForwardProp","borderWidth","inline","zIndex","overflow","white","schema","onColored","responsiveSize","responsiveMargin","Label","span","InputContainer","position","labelPosition","labelActive"],"mappings":"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"}