npm - @foxford/ui - Versions diffs - 2.101.0 → 2.102.0-beta-ea3c5d9-20260330 - Mend

@foxford/ui 2.101.0 → 2.102.0-beta-ea3c5d9-20260330

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (18) hide show

package/components/DialogComponent/DialogComponent.js +1 -1
package/components/DialogComponent/DialogComponent.js.map +1 -1
package/components/DialogComponent/DialogComponent.mjs +1 -1
package/components/DialogComponent/DialogComponent.mjs.map +1 -1
package/components/DialogComponent/sizes.js +1 -1
package/components/DialogComponent/sizes.js.map +1 -1
package/components/DialogComponent/sizes.mjs +1 -1
package/components/DialogComponent/sizes.mjs.map +1 -1
package/components/DialogComponent/style.js +1 -1
package/components/DialogComponent/style.js.map +1 -1
package/components/DialogComponent/style.mjs +1 -1
package/components/DialogComponent/style.mjs.map +1 -1
package/dts/index.d.ts +7 -1
package/hooks/useScrollLock.js +1 -1
package/hooks/useScrollLock.js.map +1 -1
package/hooks/useScrollLock.mjs +1 -1
package/hooks/useScrollLock.mjs.map +1 -1
package/package.json +2 -2

package/components/DialogComponent/DialogComponent.js CHANGED Viewed

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

package/components/DialogComponent/DialogComponent.js.map CHANGED Viewed

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

package/components/DialogComponent/DialogComponent.mjs CHANGED Viewed

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

package/components/DialogComponent/DialogComponent.mjs.map CHANGED Viewed

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

package/components/DialogComponent/sizes.js CHANGED Viewed

@@ -1,2 +1,2 @@
-'use strict';const SIZES={xxl:{width:'100%',minWidth:'min-content',maxWidth:1228,borderRadius:20},xl:{width:'100%',minWidth:'min-content',maxWidth:960,borderRadius:20},l:{width:'100%',minWidth:'min-content',maxWidth:780,borderRadius:20},m:{width:'100%',minWidth:'min-content',maxWidth:560,borderRadius:20},s:{width:'100%',minWidth:'min-content',maxWidth:440,borderRadius:20},xs:{width:'100%',minWidth:'min-content',maxWidth:304,borderRadius:20}};const SIZES_FANCY={xxl:{...SIZES.xxl,borderRadius:0},xl:{...SIZES.xl,borderRadius:0},l:{...SIZES.l,borderRadius:0},m:{...SIZES.m,borderRadius:0},s:{...SIZES.s,borderRadius:0},xs:{...SIZES.xs,borderRadius:0}};exports.SIZES=SIZES,exports.SIZES_CAPTION={xxl:{fontSize:20},xl:{fontSize:18},l:{fontSize:18},m:{fontSize:14},s:{fontSize:14},xs:{fontSize:14}},exports.SIZES_CONTAINER={xxl:{paddingTop:44,paddingBottom:44},xl:{paddingTop:36,paddingBottom:36},l:{paddingTop:32,paddingBottom:32},m:{paddingTop:28,paddingBottom:28},s:{paddingTop:28,paddingBottom:28},xs:{paddingTop:20,paddingBottom:20}},exports.SIZES_CONTENT={xxl:{padding:'4px 44px',margin:'0px 4px'},xl:{padding:'4px 36px',margin:'0px 4px'},l:{padding:'4px 32px',margin:'0px 4px'},m:{padding:'4px 28px',margin:'0px 4px'},s:{padding:'4px 28px',margin:'0px 4px'},xs:{padding:'4px 20px',margin:'0px 4px'}},exports.SIZES_FANCY=SIZES_FANCY,exports.SIZES_FOOTER={xxl:{padding:'12px 48px 4px'},xl:{padding:'12px 40px 4px'},l:{padding:'12px 36px 4px'},m:{padding:'12px 32px 4px'},s:{padding:'12px 32px 4px'},xs:{padding:'12px 24px 4px'}},exports.SIZES_STICKY_HEADER={xxl:{padding:'0px 44px 5px',margin:'0px 4px'},xl:{padding:'0px 36px 5px',margin:'0px 4px'},l:{padding:'0px 32px 5px',margin:'0px 4px'},m:{padding:'0px 28px 5px',margin:'0px 4px'},s:{padding:'0px 28px 5px',margin:'0px 4px'},xs:{padding:'0px 20px 5px',margin:'0px 4px'}},exports.SIZES_SUBTITLE={xxl:{fontSize:24},xl:{fontSize:20},l:{fontSize:20},m:{fontSize:16},s:{fontSize:16},xs:{fontSize:14}},exports.SIZES_TITLE={xxl:{fontSize:32},xl:{fontSize:28},l:{fontSize:24},m:{fontSize:20},s:{fontSize:18},xs:{fontSize:16}};
+'use strict';const SIZES={xxl:{width:'100%',minWidth:'min-content',maxWidth:1228,borderRadius:20},xl:{width:'100%',minWidth:'min-content',maxWidth:960,borderRadius:20},l:{width:'100%',minWidth:'min-content',maxWidth:780,borderRadius:20},m:{width:'100%',minWidth:'min-content',maxWidth:560,borderRadius:20},s:{width:'100%',minWidth:'min-content',maxWidth:440,borderRadius:20},xs:{width:'100%',minWidth:'min-content',maxWidth:304,borderRadius:20}};const SIZES_FANCY={xxl:{...SIZES.xxl,borderRadius:0},xl:{...SIZES.xl,borderRadius:0},l:{...SIZES.l,borderRadius:0},m:{...SIZES.m,borderRadius:0},s:{...SIZES.s,borderRadius:0},xs:{...SIZES.xs,borderRadius:0}};exports.SIZES=SIZES,exports.SIZES_CAPTION={xxl:{fontSize:20},xl:{fontSize:18},l:{fontSize:18},m:{fontSize:14},s:{fontSize:14},xs:{fontSize:14}},exports.SIZES_CONTAINER={xxl:{paddingTop:44,paddingBottom:44},xl:{paddingTop:36,paddingBottom:36},l:{paddingTop:32,paddingBottom:32},m:{paddingTop:28,paddingBottom:28},s:{paddingTop:28,paddingBottom:28},xs:{paddingTop:20,paddingBottom:20}},exports.SIZES_CONTENT={xxl:{padding:'4px 44px'},xl:{padding:'4px 36px'},l:{padding:'4px 32px'},m:{padding:'4px 28px'},s:{padding:'4px 28px'},xs:{padding:'4px 20px'}},exports.SIZES_FANCY=SIZES_FANCY,exports.SIZES_FOOTER={xxl:{padding:'12px 48px 4px'},xl:{padding:'12px 40px 4px'},l:{padding:'12px 36px 4px'},m:{padding:'12px 32px 4px'},s:{padding:'12px 32px 4px'},xs:{padding:'12px 24px 4px'}},exports.SIZES_STICKY_HEADER={xxl:{padding:'0px 44px 5px',margin:'0px 4px'},xl:{padding:'0px 36px 5px',margin:'0px 4px'},l:{padding:'0px 32px 5px',margin:'0px 4px'},m:{padding:'0px 28px 5px',margin:'0px 4px'},s:{padding:'0px 28px 5px',margin:'0px 4px'},xs:{padding:'0px 20px 5px',margin:'0px 4px'}},exports.SIZES_SUBTITLE={xxl:{fontSize:24},xl:{fontSize:20},l:{fontSize:20},m:{fontSize:16},s:{fontSize:16},xs:{fontSize:14}},exports.SIZES_TITLE={xxl:{fontSize:32},xl:{fontSize:28},l:{fontSize:24},m:{fontSize:20},s:{fontSize:18},xs:{fontSize:16}};
 //# sourceMappingURL=sizes.js.map

package/components/DialogComponent/sizes.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sizes.js","sources":["../../../../src/components/DialogComponent/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n xxl: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 1228,\n borderRadius: 20,\n },\n xl: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 960,\n borderRadius: 20,\n },\n l: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 780,\n borderRadius: 20,\n },\n m: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 560,\n borderRadius: 20,\n },\n s: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 440,\n borderRadius: 20,\n },\n xs: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 304,\n borderRadius: 20,\n },\n}\n\nexport const SIZES_FANCY: Record<Size, CSSProperties> = {\n xxl: { ...SIZES.xxl, borderRadius: 0 },\n xl: { ...SIZES.xl, borderRadius: 0 },\n l: { ...SIZES.l, borderRadius: 0 },\n m: { ...SIZES.m, borderRadius: 0 },\n s: { ...SIZES.s, borderRadius: 0 },\n xs: { ...SIZES.xs, borderRadius: 0 },\n}\n\nexport const SIZES_STICKY_HEADER: Record<Size, CSSProperties> = {\n xxl: {\n padding: '0px 44px 5px',\n margin: '0px 4px',\n },\n xl: {\n padding: '0px 36px 5px',\n margin: '0px 4px',\n },\n l: {\n padding: '0px 32px 5px',\n margin: '0px 4px',\n },\n m: {\n padding: '0px 28px 5px',\n margin: '0px 4px',\n },\n s: {\n padding: '0px 28px 5px',\n margin: '0px 4px',\n },\n xs: {\n padding: '0px 20px 5px',\n margin: '0px 4px',\n },\n}\n\nexport const SIZES_CONTAINER: Record<Size, CSSProperties> = {\n xxl: {\n paddingTop: 44,\n paddingBottom: 44,\n },\n xl: {\n paddingTop: 36,\n paddingBottom: 36,\n },\n l: {\n paddingTop: 32,\n paddingBottom: 32,\n },\n m: {\n paddingTop: 28,\n paddingBottom: 28,\n },\n s: {\n paddingTop: 28,\n paddingBottom: 28,\n },\n xs: {\n paddingTop: 20,\n paddingBottom: 20,\n },\n}\n\nexport const SIZES_CONTENT: Record<Size, CSSProperties> = {\n xxl: {\n padding: '4px 44px',\n ~~margin: '0px 4px',\n~~ },\n xl: {\n padding: '4px 36px',\n ~~margin: '0px 4px',\n~~ },\n l: {\n padding: '4px 32px',\n ~~margin: '0px 4px',\n~~ },\n m: {\n padding: '4px 28px',\n ~~margin: '0px 4px',\n~~ },\n s: {\n padding: '4px 28px',\n ~~margin: '0px 4px',\n~~ },\n xs: {\n padding: '4px 20px',\n ~~margin: '0px 4px',\n~~ },\n}\n\nexport const SIZES_FOOTER: Record<Size, CSSProperties> = {\n xxl: { padding: '12px 48px 4px' },\n xl: { padding: '12px 40px 4px' },\n l: { padding: '12px 36px 4px' },\n m: { padding: '12px 32px 4px' },\n s: { padding: '12px 32px 4px' },\n xs: { padding: '12px 24px 4px' },\n}\n\nexport const SIZES_CAPTION: Record<Size, CSSProperties> = {\n xxl: { fontSize: 20 },\n xl: { fontSize: 18 },\n l: { fontSize: 18 },\n m: { fontSize: 14 },\n s: { fontSize: 14 },\n xs: { fontSize: 14 },\n}\n\nexport const SIZES_TITLE: Record<Size, CSSProperties> = {\n xxl: { fontSize: 32 },\n xl: { fontSize: 28 },\n l: { fontSize: 24 },\n m: { fontSize: 20 },\n s: { fontSize: 18 },\n xs: { fontSize: 16 },\n}\n\nexport const SIZES_SUBTITLE: Record<Size, CSSProperties> = {\n xxl: { fontSize: 24 },\n xl: { fontSize: 20 },\n l: { fontSize: 20 },\n m: { fontSize: 16 },\n s: { fontSize: 16 },\n xs: { fontSize: 14 },\n}\n"],"names":["SIZES","xxl","width","minWidth","maxWidth","borderRadius","xl","l","m","s","xs","SIZES_FANCY","fontSize","paddingTop","paddingBottom","padding","margin"],"mappings":"aAGO,MAAMA,MAAqC,CAChDC,IAAK,CACHC,MAAO,OACPC,SAAU,cACVC,SAAU,KACVC,aAAc,IAEhBC,GAAI,CACFJ,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBE,EAAG,CACDL,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBG,EAAG,CACDN,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBI,EAAG,CACDP,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBK,GAAI,CACFR,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,KAIX,MAAMM,YAA2C,CACtDV,IAAK,IAAKD,MAAMC,IAAKI,aAAc,GACnCC,GAAI,IAAKN,MAAMM,GAAID,aAAc,GACjCE,EAAG,IAAKP,MAAMO,EAAGF,aAAc,GAC/BG,EAAG,IAAKR,MAAMQ,EAAGH,aAAc,GAC/BI,EAAG,IAAKT,MAAMS,EAAGJ,aAAc,GAC/BK,GAAI,IAAKV,MAAMU,GAAIL,aAAc,~~8CA6FuB~~,CACxDJ,IAAK,CAAEW,SAAU,IACjBN,GAAI,CAAEM,SAAU,IAChBL,EAAG,CAAEK,SAAU,IACfJ,EAAG,CAAEI,SAAU,IACfH,EAAG,CAAEG,SAAU,IACfF,GAAI,CAAEE,SAAU,~~6BArE0C~~,CAC1DX,IAAK,CACHY,WAAY,GACZC,cAAe,IAEjBR,GAAI,CACFO,WAAY,GACZC,cAAe,IAEjBP,EAAG,CACDM,WAAY,GACZC,cAAe,IAEjBN,EAAG,CACDK,WAAY,GACZC,cAAe,IAEjBL,EAAG,CACDI,WAAY,GACZC,cAAe,IAEjBJ,GAAI,CACFG,WAAY,GACZC,cAAe,2BAIuC,CACxDb,IAAK,CACHc,QAAS,~~WACTC~~,~~OAAQ,WAEVV,~~GAAI,CACFS,QAAS,~~WACTC~~,~~OAAQ,WAEVT,~~EAAG,CACDQ,QAAS,~~WACTC~~,~~OAAQ,WAEVR,~~EAAG,CACDO,QAAS,~~WACTC~~,~~OAAQ,WAEVP,~~EAAG,CACDM,QAAS,~~WACTC~~,~~OAAQ,WAEVN,~~GAAI,CACFK,QAAS,~~WACTC~~,~~OAAQ~~,~~iEAI6C,CACvDf,~~IAAK,CAAEc,QAAS,iBAChBT,GAAI,CAAES,QAAS,iBACfR,EAAG,CAAEQ,QAAS,iBACdP,EAAG,CAAEO,QAAS,iBACdN,EAAG,CAAEM,QAAS,iBACdL,GAAI,CAAEK,QAAS,~~8CAvF~~+C,CAC9Dd,IAAK,CACHc,QAAS,eACTC,OAAQ,WAEVV,GAAI,CACFS,QAAS,eACTC,OAAQ,WAEVT,EAAG,CACDQ,QAAS,eACTC,OAAQ,WAEVR,EAAG,CACDO,QAAS,eACTC,OAAQ,WAEVP,EAAG,CACDM,QAAS,eACTC,OAAQ,WAEVN,GAAI,CACFK,QAAS,eACTC,OAAQ,~~mCAqF~~+C,CACzDf,IAAK,CAAEW,SAAU,IACjBN,GAAI,CAAEM,SAAU,IAChBL,EAAG,CAAEK,SAAU,IACfJ,EAAG,CAAEI,SAAU,IACfH,EAAG,CAAEG,SAAU,IACfF,GAAI,CAAEE,SAAU,yBAfsC,CACtDX,IAAK,CAAEW,SAAU,IACjBN,GAAI,CAAEM,SAAU,IAChBL,EAAG,CAAEK,SAAU,IACfJ,EAAG,CAAEI,SAAU,IACfH,EAAG,CAAEG,SAAU,IACfF,GAAI,CAAEE,SAAU"}
1	+ {"version":3,"file":"sizes.js","sources":["../../../../src/components/DialogComponent/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n xxl: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 1228,\n borderRadius: 20,\n },\n xl: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 960,\n borderRadius: 20,\n },\n l: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 780,\n borderRadius: 20,\n },\n m: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 560,\n borderRadius: 20,\n },\n s: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 440,\n borderRadius: 20,\n },\n xs: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 304,\n borderRadius: 20,\n },\n}\n\nexport const SIZES_FANCY: Record<Size, CSSProperties> = {\n xxl: { ...SIZES.xxl, borderRadius: 0 },\n xl: { ...SIZES.xl, borderRadius: 0 },\n l: { ...SIZES.l, borderRadius: 0 },\n m: { ...SIZES.m, borderRadius: 0 },\n s: { ...SIZES.s, borderRadius: 0 },\n xs: { ...SIZES.xs, borderRadius: 0 },\n}\n\nexport const SIZES_STICKY_HEADER: Record<Size, CSSProperties> = {\n xxl: {\n padding: '0px 44px 5px',\n margin: '0px 4px',\n },\n xl: {\n padding: '0px 36px 5px',\n margin: '0px 4px',\n },\n l: {\n padding: '0px 32px 5px',\n margin: '0px 4px',\n },\n m: {\n padding: '0px 28px 5px',\n margin: '0px 4px',\n },\n s: {\n padding: '0px 28px 5px',\n margin: '0px 4px',\n },\n xs: {\n padding: '0px 20px 5px',\n margin: '0px 4px',\n },\n}\n\nexport const SIZES_CONTAINER: Record<Size, CSSProperties> = {\n xxl: {\n paddingTop: 44,\n paddingBottom: 44,\n },\n xl: {\n paddingTop: 36,\n paddingBottom: 36,\n },\n l: {\n paddingTop: 32,\n paddingBottom: 32,\n },\n m: {\n paddingTop: 28,\n paddingBottom: 28,\n },\n s: {\n paddingTop: 28,\n paddingBottom: 28,\n },\n xs: {\n paddingTop: 20,\n paddingBottom: 20,\n },\n}\n\nexport const SIZES_CONTENT: Record<Size, CSSProperties> = {\n xxl: {\n padding: '4px 44px',\n },\n xl: {\n padding: '4px 36px',\n },\n l: {\n padding: '4px 32px',\n },\n m: {\n padding: '4px 28px',\n },\n s: {\n padding: '4px 28px',\n },\n xs: {\n padding: '4px 20px',\n },\n}\n\nexport const SIZES_FOOTER: Record<Size, CSSProperties> = {\n xxl: { padding: '12px 48px 4px' },\n xl: { padding: '12px 40px 4px' },\n l: { padding: '12px 36px 4px' },\n m: { padding: '12px 32px 4px' },\n s: { padding: '12px 32px 4px' },\n xs: { padding: '12px 24px 4px' },\n}\n\nexport const SIZES_CAPTION: Record<Size, CSSProperties> = {\n xxl: { fontSize: 20 },\n xl: { fontSize: 18 },\n l: { fontSize: 18 },\n m: { fontSize: 14 },\n s: { fontSize: 14 },\n xs: { fontSize: 14 },\n}\n\nexport const SIZES_TITLE: Record<Size, CSSProperties> = {\n xxl: { fontSize: 32 },\n xl: { fontSize: 28 },\n l: { fontSize: 24 },\n m: { fontSize: 20 },\n s: { fontSize: 18 },\n xs: { fontSize: 16 },\n}\n\nexport const SIZES_SUBTITLE: Record<Size, CSSProperties> = {\n xxl: { fontSize: 24 },\n xl: { fontSize: 20 },\n l: { fontSize: 20 },\n m: { fontSize: 16 },\n s: { fontSize: 16 },\n xs: { fontSize: 14 },\n}\n"],"names":["SIZES","xxl","width","minWidth","maxWidth","borderRadius","xl","l","m","s","xs","SIZES_FANCY","fontSize","paddingTop","paddingBottom","padding","margin"],"mappings":"aAGO,MAAMA,MAAqC,CAChDC,IAAK,CACHC,MAAO,OACPC,SAAU,cACVC,SAAU,KACVC,aAAc,IAEhBC,GAAI,CACFJ,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBE,EAAG,CACDL,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBG,EAAG,CACDN,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBI,EAAG,CACDP,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBK,GAAI,CACFR,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,KAIX,MAAMM,YAA2C,CACtDV,IAAK,IAAKD,MAAMC,IAAKI,aAAc,GACnCC,GAAI,IAAKN,MAAMM,GAAID,aAAc,GACjCE,EAAG,IAAKP,MAAMO,EAAGF,aAAc,GAC/BG,EAAG,IAAKR,MAAMQ,EAAGH,aAAc,GAC/BI,EAAG,IAAKT,MAAMS,EAAGJ,aAAc,GAC/BK,GAAI,IAAKV,MAAMU,GAAIL,aAAc,8CAuFuB,CACxDJ,IAAK,CAAEW,SAAU,IACjBN,GAAI,CAAEM,SAAU,IAChBL,EAAG,CAAEK,SAAU,IACfJ,EAAG,CAAEI,SAAU,IACfH,EAAG,CAAEG,SAAU,IACfF,GAAI,CAAEE,SAAU,6BA/D0C,CAC1DX,IAAK,CACHY,WAAY,GACZC,cAAe,IAEjBR,GAAI,CACFO,WAAY,GACZC,cAAe,IAEjBP,EAAG,CACDM,WAAY,GACZC,cAAe,IAEjBN,EAAG,CACDK,WAAY,GACZC,cAAe,IAEjBL,EAAG,CACDI,WAAY,GACZC,cAAe,IAEjBJ,GAAI,CACFG,WAAY,GACZC,cAAe,2BAIuC,CACxDb,IAAK,CACHc,QAAS,YAEXT,GAAI,CACFS,QAAS,YAEXR,EAAG,CACDQ,QAAS,YAEXP,EAAG,CACDO,QAAS,YAEXN,EAAG,CACDM,QAAS,YAEXL,GAAI,CACFK,QAAS,kEAI4C,CACvDd,IAAK,CAAEc,QAAS,iBAChBT,GAAI,CAAES,QAAS,iBACfR,EAAG,CAAEQ,QAAS,iBACdP,EAAG,CAAEO,QAAS,iBACdN,EAAG,CAAEM,QAAS,iBACdL,GAAI,CAAEK,QAAS,8CAjF+C,CAC9Dd,IAAK,CACHc,QAAS,eACTC,OAAQ,WAEVV,GAAI,CACFS,QAAS,eACTC,OAAQ,WAEVT,EAAG,CACDQ,QAAS,eACTC,OAAQ,WAEVR,EAAG,CACDO,QAAS,eACTC,OAAQ,WAEVP,EAAG,CACDM,QAAS,eACTC,OAAQ,WAEVN,GAAI,CACFK,QAAS,eACTC,OAAQ,mCA+E+C,CACzDf,IAAK,CAAEW,SAAU,IACjBN,GAAI,CAAEM,SAAU,IAChBL,EAAG,CAAEK,SAAU,IACfJ,EAAG,CAAEI,SAAU,IACfH,EAAG,CAAEG,SAAU,IACfF,GAAI,CAAEE,SAAU,yBAfsC,CACtDX,IAAK,CAAEW,SAAU,IACjBN,GAAI,CAAEM,SAAU,IAChBL,EAAG,CAAEK,SAAU,IACfJ,EAAG,CAAEI,SAAU,IACfH,EAAG,CAAEG,SAAU,IACfF,GAAI,CAAEE,SAAU"}

package/components/DialogComponent/sizes.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-const SIZES={xxl:{width:'100%',minWidth:'min-content',maxWidth:1228,borderRadius:20},xl:{width:'100%',minWidth:'min-content',maxWidth:960,borderRadius:20},l:{width:'100%',minWidth:'min-content',maxWidth:780,borderRadius:20},m:{width:'100%',minWidth:'min-content',maxWidth:560,borderRadius:20},s:{width:'100%',minWidth:'min-content',maxWidth:440,borderRadius:20},xs:{width:'100%',minWidth:'min-content',maxWidth:304,borderRadius:20}};const SIZES_FANCY={xxl:{...SIZES.xxl,borderRadius:0},xl:{...SIZES.xl,borderRadius:0},l:{...SIZES.l,borderRadius:0},m:{...SIZES.m,borderRadius:0},s:{...SIZES.s,borderRadius:0},xs:{...SIZES.xs,borderRadius:0}};const SIZES_STICKY_HEADER={xxl:{padding:'0px 44px 5px',margin:'0px 4px'},xl:{padding:'0px 36px 5px',margin:'0px 4px'},l:{padding:'0px 32px 5px',margin:'0px 4px'},m:{padding:'0px 28px 5px',margin:'0px 4px'},s:{padding:'0px 28px 5px',margin:'0px 4px'},xs:{padding:'0px 20px 5px',margin:'0px 4px'}};const SIZES_CONTAINER={xxl:{paddingTop:44,paddingBottom:44},xl:{paddingTop:36,paddingBottom:36},l:{paddingTop:32,paddingBottom:32},m:{paddingTop:28,paddingBottom:28},s:{paddingTop:28,paddingBottom:28},xs:{paddingTop:20,paddingBottom:20}};const SIZES_CONTENT={xxl:{padding:'4px 44px',margin:'0px 4px'},xl:{padding:'4px 36px',margin:'0px 4px'},l:{padding:'4px 32px',margin:'0px 4px'},m:{padding:'4px 28px',margin:'0px 4px'},s:{padding:'4px 28px',margin:'0px 4px'},xs:{padding:'4px 20px',margin:'0px 4px'}};const SIZES_FOOTER={xxl:{padding:'12px 48px 4px'},xl:{padding:'12px 40px 4px'},l:{padding:'12px 36px 4px'},m:{padding:'12px 32px 4px'},s:{padding:'12px 32px 4px'},xs:{padding:'12px 24px 4px'}};const SIZES_CAPTION={xxl:{fontSize:20},xl:{fontSize:18},l:{fontSize:18},m:{fontSize:14},s:{fontSize:14},xs:{fontSize:14}};const SIZES_TITLE={xxl:{fontSize:32},xl:{fontSize:28},l:{fontSize:24},m:{fontSize:20},s:{fontSize:18},xs:{fontSize:16}};const SIZES_SUBTITLE={xxl:{fontSize:24},xl:{fontSize:20},l:{fontSize:20},m:{fontSize:16},s:{fontSize:16},xs:{fontSize:14}};export{SIZES,SIZES_CAPTION,SIZES_CONTAINER,SIZES_CONTENT,SIZES_FANCY,SIZES_FOOTER,SIZES_STICKY_HEADER,SIZES_SUBTITLE,SIZES_TITLE};
+const SIZES={xxl:{width:'100%',minWidth:'min-content',maxWidth:1228,borderRadius:20},xl:{width:'100%',minWidth:'min-content',maxWidth:960,borderRadius:20},l:{width:'100%',minWidth:'min-content',maxWidth:780,borderRadius:20},m:{width:'100%',minWidth:'min-content',maxWidth:560,borderRadius:20},s:{width:'100%',minWidth:'min-content',maxWidth:440,borderRadius:20},xs:{width:'100%',minWidth:'min-content',maxWidth:304,borderRadius:20}};const SIZES_FANCY={xxl:{...SIZES.xxl,borderRadius:0},xl:{...SIZES.xl,borderRadius:0},l:{...SIZES.l,borderRadius:0},m:{...SIZES.m,borderRadius:0},s:{...SIZES.s,borderRadius:0},xs:{...SIZES.xs,borderRadius:0}};const SIZES_STICKY_HEADER={xxl:{padding:'0px 44px 5px',margin:'0px 4px'},xl:{padding:'0px 36px 5px',margin:'0px 4px'},l:{padding:'0px 32px 5px',margin:'0px 4px'},m:{padding:'0px 28px 5px',margin:'0px 4px'},s:{padding:'0px 28px 5px',margin:'0px 4px'},xs:{padding:'0px 20px 5px',margin:'0px 4px'}};const SIZES_CONTAINER={xxl:{paddingTop:44,paddingBottom:44},xl:{paddingTop:36,paddingBottom:36},l:{paddingTop:32,paddingBottom:32},m:{paddingTop:28,paddingBottom:28},s:{paddingTop:28,paddingBottom:28},xs:{paddingTop:20,paddingBottom:20}};const SIZES_CONTENT={xxl:{padding:'4px 44px'},xl:{padding:'4px 36px'},l:{padding:'4px 32px'},m:{padding:'4px 28px'},s:{padding:'4px 28px'},xs:{padding:'4px 20px'}};const SIZES_FOOTER={xxl:{padding:'12px 48px 4px'},xl:{padding:'12px 40px 4px'},l:{padding:'12px 36px 4px'},m:{padding:'12px 32px 4px'},s:{padding:'12px 32px 4px'},xs:{padding:'12px 24px 4px'}};const SIZES_CAPTION={xxl:{fontSize:20},xl:{fontSize:18},l:{fontSize:18},m:{fontSize:14},s:{fontSize:14},xs:{fontSize:14}};const SIZES_TITLE={xxl:{fontSize:32},xl:{fontSize:28},l:{fontSize:24},m:{fontSize:20},s:{fontSize:18},xs:{fontSize:16}};const SIZES_SUBTITLE={xxl:{fontSize:24},xl:{fontSize:20},l:{fontSize:20},m:{fontSize:16},s:{fontSize:16},xs:{fontSize:14}};export{SIZES,SIZES_CAPTION,SIZES_CONTAINER,SIZES_CONTENT,SIZES_FANCY,SIZES_FOOTER,SIZES_STICKY_HEADER,SIZES_SUBTITLE,SIZES_TITLE};
 //# sourceMappingURL=sizes.mjs.map

package/components/DialogComponent/sizes.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sizes.mjs","sources":["../../../../src/components/DialogComponent/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n xxl: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 1228,\n borderRadius: 20,\n },\n xl: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 960,\n borderRadius: 20,\n },\n l: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 780,\n borderRadius: 20,\n },\n m: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 560,\n borderRadius: 20,\n },\n s: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 440,\n borderRadius: 20,\n },\n xs: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 304,\n borderRadius: 20,\n },\n}\n\nexport const SIZES_FANCY: Record<Size, CSSProperties> = {\n xxl: { ...SIZES.xxl, borderRadius: 0 },\n xl: { ...SIZES.xl, borderRadius: 0 },\n l: { ...SIZES.l, borderRadius: 0 },\n m: { ...SIZES.m, borderRadius: 0 },\n s: { ...SIZES.s, borderRadius: 0 },\n xs: { ...SIZES.xs, borderRadius: 0 },\n}\n\nexport const SIZES_STICKY_HEADER: Record<Size, CSSProperties> = {\n xxl: {\n padding: '0px 44px 5px',\n margin: '0px 4px',\n },\n xl: {\n padding: '0px 36px 5px',\n margin: '0px 4px',\n },\n l: {\n padding: '0px 32px 5px',\n margin: '0px 4px',\n },\n m: {\n padding: '0px 28px 5px',\n margin: '0px 4px',\n },\n s: {\n padding: '0px 28px 5px',\n margin: '0px 4px',\n },\n xs: {\n padding: '0px 20px 5px',\n margin: '0px 4px',\n },\n}\n\nexport const SIZES_CONTAINER: Record<Size, CSSProperties> = {\n xxl: {\n paddingTop: 44,\n paddingBottom: 44,\n },\n xl: {\n paddingTop: 36,\n paddingBottom: 36,\n },\n l: {\n paddingTop: 32,\n paddingBottom: 32,\n },\n m: {\n paddingTop: 28,\n paddingBottom: 28,\n },\n s: {\n paddingTop: 28,\n paddingBottom: 28,\n },\n xs: {\n paddingTop: 20,\n paddingBottom: 20,\n },\n}\n\nexport const SIZES_CONTENT: Record<Size, CSSProperties> = {\n xxl: {\n padding: '4px 44px',\n ~~margin: '0px 4px',\n~~ },\n xl: {\n padding: '4px 36px',\n ~~margin: '0px 4px',\n~~ },\n l: {\n padding: '4px 32px',\n ~~margin: '0px 4px',\n~~ },\n m: {\n padding: '4px 28px',\n ~~margin: '0px 4px',\n~~ },\n s: {\n padding: '4px 28px',\n ~~margin: '0px 4px',\n~~ },\n xs: {\n padding: '4px 20px',\n ~~margin: '0px 4px',\n~~ },\n}\n\nexport const SIZES_FOOTER: Record<Size, CSSProperties> = {\n xxl: { padding: '12px 48px 4px' },\n xl: { padding: '12px 40px 4px' },\n l: { padding: '12px 36px 4px' },\n m: { padding: '12px 32px 4px' },\n s: { padding: '12px 32px 4px' },\n xs: { padding: '12px 24px 4px' },\n}\n\nexport const SIZES_CAPTION: Record<Size, CSSProperties> = {\n xxl: { fontSize: 20 },\n xl: { fontSize: 18 },\n l: { fontSize: 18 },\n m: { fontSize: 14 },\n s: { fontSize: 14 },\n xs: { fontSize: 14 },\n}\n\nexport const SIZES_TITLE: Record<Size, CSSProperties> = {\n xxl: { fontSize: 32 },\n xl: { fontSize: 28 },\n l: { fontSize: 24 },\n m: { fontSize: 20 },\n s: { fontSize: 18 },\n xs: { fontSize: 16 },\n}\n\nexport const SIZES_SUBTITLE: Record<Size, CSSProperties> = {\n xxl: { fontSize: 24 },\n xl: { fontSize: 20 },\n l: { fontSize: 20 },\n m: { fontSize: 16 },\n s: { fontSize: 16 },\n xs: { fontSize: 14 },\n}\n"],"names":["SIZES","xxl","width","minWidth","maxWidth","borderRadius","xl","l","m","s","xs","SIZES_FANCY","SIZES_STICKY_HEADER","padding","margin","SIZES_CONTAINER","paddingTop","paddingBottom","SIZES_CONTENT","SIZES_FOOTER","SIZES_CAPTION","fontSize","SIZES_TITLE","SIZES_SUBTITLE"],"mappings":"AAGO,MAAMA,MAAqC,CAChDC,IAAK,CACHC,MAAO,OACPC,SAAU,cACVC,SAAU,KACVC,aAAc,IAEhBC,GAAI,CACFJ,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBE,EAAG,CACDL,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBG,EAAG,CACDN,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBI,EAAG,CACDP,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBK,GAAI,CACFR,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,KAIX,MAAMM,YAA2C,CACtDV,IAAK,IAAKD,MAAMC,IAAKI,aAAc,GACnCC,GAAI,IAAKN,MAAMM,GAAID,aAAc,GACjCE,EAAG,IAAKP,MAAMO,EAAGF,aAAc,GAC/BG,EAAG,IAAKR,MAAMQ,EAAGH,aAAc,GAC/BI,EAAG,IAAKT,MAAMS,EAAGJ,aAAc,GAC/BK,GAAI,IAAKV,MAAMU,GAAIL,aAAc,IAG5B,MAAMO,oBAAmD,CAC9DX,IAAK,CACHY,QAAS,eACTC,OAAQ,WAEVR,GAAI,CACFO,QAAS,eACTC,OAAQ,WAEVP,EAAG,CACDM,QAAS,eACTC,OAAQ,WAEVN,EAAG,CACDK,QAAS,eACTC,OAAQ,WAEVL,EAAG,CACDI,QAAS,eACTC,OAAQ,WAEVJ,GAAI,CACFG,QAAS,eACTC,OAAQ,YAIL,MAAMC,gBAA+C,CAC1Dd,IAAK,CACHe,WAAY,GACZC,cAAe,IAEjBX,GAAI,CACFU,WAAY,GACZC,cAAe,IAEjBV,EAAG,CACDS,WAAY,GACZC,cAAe,IAEjBT,EAAG,CACDQ,WAAY,GACZC,cAAe,IAEjBR,EAAG,CACDO,WAAY,GACZC,cAAe,IAEjBP,GAAI,CACFM,WAAY,GACZC,cAAe,KAIZ,MAAMC,cAA6C,CACxDjB,IAAK,CACHY,QAAS,~~WACTC~~,~~OAAQ,WAEVR,~~GAAI,CACFO,QAAS,~~WACTC~~,~~OAAQ,WAEVP,~~EAAG,CACDM,QAAS,~~WACTC~~,~~OAAQ,WAEVN,~~EAAG,CACDK,QAAS,~~WACTC~~,~~OAAQ,WAEVL,~~EAAG,CACDI,QAAS,~~WACTC~~,~~OAAQ,WAEVJ,~~GAAI,CACFG,QAAS,~~WACTC~~,~~OAAQ~~,~~YAIL,MAAMK,~~aAA4C,CACvDlB,IAAK,CAAEY,QAAS,iBAChBP,GAAI,CAAEO,QAAS,iBACfN,EAAG,CAAEM,QAAS,iBACdL,EAAG,CAAEK,QAAS,iBACdJ,EAAG,CAAEI,QAAS,iBACdH,GAAI,CAAEG,QAAS,kBAGV,MAAMO,cAA6C,CACxDnB,IAAK,CAAEoB,SAAU,IACjBf,GAAI,CAAEe,SAAU,IAChBd,EAAG,CAAEc,SAAU,IACfb,EAAG,CAAEa,SAAU,IACfZ,EAAG,CAAEY,SAAU,IACfX,GAAI,CAAEW,SAAU,KAGX,MAAMC,YAA2C,CACtDrB,IAAK,CAAEoB,SAAU,IACjBf,GAAI,CAAEe,SAAU,IAChBd,EAAG,CAAEc,SAAU,IACfb,EAAG,CAAEa,SAAU,IACfZ,EAAG,CAAEY,SAAU,IACfX,GAAI,CAAEW,SAAU,KAGX,MAAME,eAA8C,CACzDtB,IAAK,CAAEoB,SAAU,IACjBf,GAAI,CAAEe,SAAU,IAChBd,EAAG,CAAEc,SAAU,IACfb,EAAG,CAAEa,SAAU,IACfZ,EAAG,CAAEY,SAAU,IACfX,GAAI,CAAEW,SAAU"}
1	+ {"version":3,"file":"sizes.mjs","sources":["../../../../src/components/DialogComponent/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n xxl: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 1228,\n borderRadius: 20,\n },\n xl: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 960,\n borderRadius: 20,\n },\n l: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 780,\n borderRadius: 20,\n },\n m: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 560,\n borderRadius: 20,\n },\n s: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 440,\n borderRadius: 20,\n },\n xs: {\n width: '100%',\n minWidth: 'min-content',\n maxWidth: 304,\n borderRadius: 20,\n },\n}\n\nexport const SIZES_FANCY: Record<Size, CSSProperties> = {\n xxl: { ...SIZES.xxl, borderRadius: 0 },\n xl: { ...SIZES.xl, borderRadius: 0 },\n l: { ...SIZES.l, borderRadius: 0 },\n m: { ...SIZES.m, borderRadius: 0 },\n s: { ...SIZES.s, borderRadius: 0 },\n xs: { ...SIZES.xs, borderRadius: 0 },\n}\n\nexport const SIZES_STICKY_HEADER: Record<Size, CSSProperties> = {\n xxl: {\n padding: '0px 44px 5px',\n margin: '0px 4px',\n },\n xl: {\n padding: '0px 36px 5px',\n margin: '0px 4px',\n },\n l: {\n padding: '0px 32px 5px',\n margin: '0px 4px',\n },\n m: {\n padding: '0px 28px 5px',\n margin: '0px 4px',\n },\n s: {\n padding: '0px 28px 5px',\n margin: '0px 4px',\n },\n xs: {\n padding: '0px 20px 5px',\n margin: '0px 4px',\n },\n}\n\nexport const SIZES_CONTAINER: Record<Size, CSSProperties> = {\n xxl: {\n paddingTop: 44,\n paddingBottom: 44,\n },\n xl: {\n paddingTop: 36,\n paddingBottom: 36,\n },\n l: {\n paddingTop: 32,\n paddingBottom: 32,\n },\n m: {\n paddingTop: 28,\n paddingBottom: 28,\n },\n s: {\n paddingTop: 28,\n paddingBottom: 28,\n },\n xs: {\n paddingTop: 20,\n paddingBottom: 20,\n },\n}\n\nexport const SIZES_CONTENT: Record<Size, CSSProperties> = {\n xxl: {\n padding: '4px 44px',\n },\n xl: {\n padding: '4px 36px',\n },\n l: {\n padding: '4px 32px',\n },\n m: {\n padding: '4px 28px',\n },\n s: {\n padding: '4px 28px',\n },\n xs: {\n padding: '4px 20px',\n },\n}\n\nexport const SIZES_FOOTER: Record<Size, CSSProperties> = {\n xxl: { padding: '12px 48px 4px' },\n xl: { padding: '12px 40px 4px' },\n l: { padding: '12px 36px 4px' },\n m: { padding: '12px 32px 4px' },\n s: { padding: '12px 32px 4px' },\n xs: { padding: '12px 24px 4px' },\n}\n\nexport const SIZES_CAPTION: Record<Size, CSSProperties> = {\n xxl: { fontSize: 20 },\n xl: { fontSize: 18 },\n l: { fontSize: 18 },\n m: { fontSize: 14 },\n s: { fontSize: 14 },\n xs: { fontSize: 14 },\n}\n\nexport const SIZES_TITLE: Record<Size, CSSProperties> = {\n xxl: { fontSize: 32 },\n xl: { fontSize: 28 },\n l: { fontSize: 24 },\n m: { fontSize: 20 },\n s: { fontSize: 18 },\n xs: { fontSize: 16 },\n}\n\nexport const SIZES_SUBTITLE: Record<Size, CSSProperties> = {\n xxl: { fontSize: 24 },\n xl: { fontSize: 20 },\n l: { fontSize: 20 },\n m: { fontSize: 16 },\n s: { fontSize: 16 },\n xs: { fontSize: 14 },\n}\n"],"names":["SIZES","xxl","width","minWidth","maxWidth","borderRadius","xl","l","m","s","xs","SIZES_FANCY","SIZES_STICKY_HEADER","padding","margin","SIZES_CONTAINER","paddingTop","paddingBottom","SIZES_CONTENT","SIZES_FOOTER","SIZES_CAPTION","fontSize","SIZES_TITLE","SIZES_SUBTITLE"],"mappings":"AAGO,MAAMA,MAAqC,CAChDC,IAAK,CACHC,MAAO,OACPC,SAAU,cACVC,SAAU,KACVC,aAAc,IAEhBC,GAAI,CACFJ,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBE,EAAG,CACDL,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBG,EAAG,CACDN,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBI,EAAG,CACDP,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,IAEhBK,GAAI,CACFR,MAAO,OACPC,SAAU,cACVC,SAAU,IACVC,aAAc,KAIX,MAAMM,YAA2C,CACtDV,IAAK,IAAKD,MAAMC,IAAKI,aAAc,GACnCC,GAAI,IAAKN,MAAMM,GAAID,aAAc,GACjCE,EAAG,IAAKP,MAAMO,EAAGF,aAAc,GAC/BG,EAAG,IAAKR,MAAMQ,EAAGH,aAAc,GAC/BI,EAAG,IAAKT,MAAMS,EAAGJ,aAAc,GAC/BK,GAAI,IAAKV,MAAMU,GAAIL,aAAc,IAG5B,MAAMO,oBAAmD,CAC9DX,IAAK,CACHY,QAAS,eACTC,OAAQ,WAEVR,GAAI,CACFO,QAAS,eACTC,OAAQ,WAEVP,EAAG,CACDM,QAAS,eACTC,OAAQ,WAEVN,EAAG,CACDK,QAAS,eACTC,OAAQ,WAEVL,EAAG,CACDI,QAAS,eACTC,OAAQ,WAEVJ,GAAI,CACFG,QAAS,eACTC,OAAQ,YAIL,MAAMC,gBAA+C,CAC1Dd,IAAK,CACHe,WAAY,GACZC,cAAe,IAEjBX,GAAI,CACFU,WAAY,GACZC,cAAe,IAEjBV,EAAG,CACDS,WAAY,GACZC,cAAe,IAEjBT,EAAG,CACDQ,WAAY,GACZC,cAAe,IAEjBR,EAAG,CACDO,WAAY,GACZC,cAAe,IAEjBP,GAAI,CACFM,WAAY,GACZC,cAAe,KAIZ,MAAMC,cAA6C,CACxDjB,IAAK,CACHY,QAAS,YAEXP,GAAI,CACFO,QAAS,YAEXN,EAAG,CACDM,QAAS,YAEXL,EAAG,CACDK,QAAS,YAEXJ,EAAG,CACDI,QAAS,YAEXH,GAAI,CACFG,QAAS,aAIN,MAAMM,aAA4C,CACvDlB,IAAK,CAAEY,QAAS,iBAChBP,GAAI,CAAEO,QAAS,iBACfN,EAAG,CAAEM,QAAS,iBACdL,EAAG,CAAEK,QAAS,iBACdJ,EAAG,CAAEI,QAAS,iBACdH,GAAI,CAAEG,QAAS,kBAGV,MAAMO,cAA6C,CACxDnB,IAAK,CAAEoB,SAAU,IACjBf,GAAI,CAAEe,SAAU,IAChBd,EAAG,CAAEc,SAAU,IACfb,EAAG,CAAEa,SAAU,IACfZ,EAAG,CAAEY,SAAU,IACfX,GAAI,CAAEW,SAAU,KAGX,MAAMC,YAA2C,CACtDrB,IAAK,CAAEoB,SAAU,IACjBf,GAAI,CAAEe,SAAU,IAChBd,EAAG,CAAEc,SAAU,IACfb,EAAG,CAAEa,SAAU,IACfZ,EAAG,CAAEY,SAAU,IACfX,GAAI,CAAEW,SAAU,KAGX,MAAME,eAA8C,CACzDtB,IAAK,CAAEoB,SAAU,IACjBf,GAAI,CAAEe,SAAU,IAChBd,EAAG,CAAEc,SAAU,IACfb,EAAG,CAAEa,SAAU,IACfZ,EAAG,CAAEY,SAAU,IACfX,GAAI,CAAEW,SAAU"}

package/components/DialogComponent/style.js CHANGED Viewed

@@ -1,2 +1,2 @@
-'use strict';var styled=require('styled-components');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveLayout=require('../../mixins/responsive-layout.js');var focus=require('../../mixins/focus.js');var style=require('../../shared/utils/style.js');var maskRectangle=require('./images/mask-rectangle.svg.js');var maskSlope=require('./images/mask-slope.svg.js');var Spacer=require('../Spacer/Spacer.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const filterLayoutProps=o=>!['layout','layoutXXS','layoutXS','layoutS','layoutM','layoutL','layoutXL','layouts'].includes(o);const shouldForwardDialogComponentProp=style.createShouldForwardProp((o=>!['dragging','fancy','zIndex'].includes(o)),filterLayoutProps);const filterCommonProps=style.createShouldForwardProp((o=>!['scrollable'].includes(o)));const Fading=styled__default.default.div.withConfig({shouldForwardProp:o=>!['visible','after'].includes(o)}).withConfig({displayName:"DialogComponent__Fading",componentId:"ui__sc-1dlvioj-0"})(["box-sizing:border-box;position:relative;flex-shrink:0;width:100%;z-index:1;&::before,&::after{transition-property:opacity;transition-duration:150ms;transition-timing-function:ease-in;pointer-events:none;}",""],(o=>o.after?`\n          &::after {\n            content: '';\n            display: block;\n            position: absolute;\n            height: 35px;\n            bottom: 100%;\n            right: 4px; \n            left: 4px;\n            margin-bottom: -1px;\n            background-image: linear-gradient(0deg, currentcolor, transparent);\n            opacity: ${o.visible?1:0};\n          }\n            `:`\n          &::before {\n            content: '';\n            display: block;\n            position: absolute;\n            height: 35px;\n            top: 100%;\n            right: 4px;\n            left: 4px;\n            margin-top: -1px;\n            background-image: linear-gradient(180deg, currentcolor, transparent);\n            opacity: ${o.visible?1:0};\n          }\n      `));const FancyBackground=styled__default.default.div.withConfig({displayName:"DialogComponent__FancyBackground",componentId:"ui__sc-1dlvioj-1"})(["box-sizing:border-box;position:absolute;top:0;right:0;bottom:0;left:0;mask-image:url(","),url(",");mask-repeat:no-repeat,no-repeat;mask-size:100% 32px,cover;mask-position:0 56px,0 87px;border-radius:inherit;"],maskSlope.default,maskRectangle.default);const template_default=o=>`\n    color: ${o.color};\n    background-color: ${o.backgroundColor};\n    box-shadow: 0 6px 20px 1px ${o.shadowColor};\n    ${Fading} {\n      color: ${o.backgroundColor};\n    }\n  `,template_fancy=o=>`\n    color: ${o.color};\n    ${FancyBackground} {\n      background-color: ${o.backgroundColor};\n    }\n    ${Fading} {\n      color: ${o.backgroundColor};\n    }\n  `;const Root=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardDialogComponentProp}).withConfig({displayName:"DialogComponent__Root",componentId:"ui__sc-1dlvioj-2"})(["box-sizing:border-box;display:flex;position:relative;isolation:isolate;"," "," "," "," ",""],(o=>(o.fancy?template_fancy:template_default)({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-onmain-primary'],shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette})),(o=>o.dragging&&`\n      box-shadow: 0 0 0 2px ${o.theme.colors.white}, 0 0 0 4px ${o.theme.colors['border-focus']};\n      `),(o=>typeof o.zIndex=='number'&&`z-index: ${o.zIndex};`),responsiveSize.responsiveSize,responsiveLayout.responsiveLayout);const Body=styled__default.default.div.withConfig({displayName:"DialogComponent__Body",componentId:"ui__sc-1dlvioj-3"})(["box-sizing:border-box;position:relative;display:flex;flex-direction:column;overflow:hidden;flex-grow:1;"]);const StickyHeader=styled__default.default.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__StickyHeader",componentId:"ui__sc-1dlvioj-4"})(["",""],responsiveSize.responsiveSize);const Container=styled__default.default.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__Container",componentId:"ui__sc-1dlvioj-5"})(["box-sizing:border-box;display:flex;flex-direction:column;overflow:hidden;flex-grow:1;",""],responsiveSize.responsiveSize);const Content=styled__default.default.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__Content",componentId:"ui__sc-1dlvioj-6"})(["box-sizing:border-box;flex-grow:1;"," "," ",""],(o=>`\n     overflow: ${o.scrollable?'auto':'hidden'};\n     overscroll-behavior: ${o.scrollable?'contain':'auto'};\n  `),focus.focus,responsiveSize.responsiveSize);const Footer=styled__default.default.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__Footer",componentId:"ui__sc-1dlvioj-7"})(["box-sizing:border-box;flex-shrink:0;",""],responsiveSize.responsiveSize);const DraggingHandle=styled__default.default.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__DraggingHandle",componentId:"ui__sc-1dlvioj-8"})(["box-sizing:border-box;position:absolute;top:0;left:0;width:100%;display:flex;justify-content:center;padding-top:10px;padding-bottom:10px;cursor:grab;touch-action:none;z-index:2;",""],responsiveLayout.responsiveLayout);const DraggingIconContainer=styled__default.default.div.withConfig({displayName:"DialogComponent__DraggingIconContainer",componentId:"ui__sc-1dlvioj-9"})(["box-sizing:border-box;display:flex;padding:3px 12px;border-radius:12px;& > *{height:0.25em;}"," ",""],(o=>`\n      background-color: ${o.theme.colors['bg-onmain-tertiary']};\n    `),focus.focus);const Media=styled__default.default.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__Media",componentId:"ui__sc-1dlvioj-10"})(["box-sizing:border-box;overflow:hidden;flex-shrink:0;",""],responsiveLayout.responsiveLayout);const Img=styled__default.default.div.withConfig({shouldForwardProp:o=>o!=='src'}).withConfig({displayName:"DialogComponent__Img",componentId:"ui__sc-1dlvioj-11"})(["box-sizing:border-box;",""],(o=>o.src&&`\n      background-image: url(${o.src});\n      background-repeat: no-repeat;\n      background-position: 50%;\n      background-size: cover;\n    `));const LayoutSpacer=styled__default.default(Spacer.Spacer).withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__LayoutSpacer",componentId:"ui__sc-1dlvioj-12"})(["",""],responsiveLayout.responsiveLayout);const ButtonPosition=styled__default.default.div.withConfig({displayName:"DialogComponent__ButtonPosition",componentId:"ui__sc-1dlvioj-13"})(["box-sizing:border-box;position:absolute;top:0;right:0;z-index:3;"]);const ProgressPosition=styled__default.default.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__ProgressPosition",componentId:"ui__sc-1dlvioj-14"})(["box-sizing:border-box;position:absolute;z-index:2;",""],responsiveLayout.responsiveLayout);exports.Body=Body,exports.ButtonPosition=ButtonPosition,exports.Container=Container,exports.Content=Content,exports.DraggingHandle=DraggingHandle,exports.DraggingIconContainer=DraggingIconContainer,exports.Fading=Fading,exports.FancyBackground=FancyBackground,exports.Footer=Footer,exports.Img=Img,exports.LayoutSpacer=LayoutSpacer,exports.Media=Media,exports.ProgressPosition=ProgressPosition,exports.Root=Root,exports.StickyHeader=StickyHeader;
+'use strict';var styled=require('styled-components');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveLayout=require('../../mixins/responsive-layout.js');var focus=require('../../mixins/focus.js');var style=require('../../shared/utils/style.js');var maskRectangle=require('./images/mask-rectangle.svg.js');var maskSlope=require('./images/mask-slope.svg.js');var Spacer=require('../Spacer/Spacer.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const filterLayoutProps=o=>!['layout','layoutXXS','layoutXS','layoutS','layoutM','layoutL','layoutXL','layouts'].includes(o);const shouldForwardDialogComponentProp=style.createShouldForwardProp((o=>!['dragging','fancy','zIndex'].includes(o)),filterLayoutProps);const filterCommonProps=style.createShouldForwardProp();const Fading=styled__default.default.div.withConfig({shouldForwardProp:o=>!['visible','after'].includes(o)}).withConfig({displayName:"DialogComponent__Fading",componentId:"ui__sc-1dlvioj-0"})(["box-sizing:border-box;position:relative;flex-shrink:0;width:100%;z-index:1;&::before,&::after{transition-property:opacity;transition-duration:150ms;transition-timing-function:ease-in;pointer-events:none;}",""],(o=>o.after?`\n          &::after {\n            content: '';\n            display: block;\n            position: absolute;\n            height: 35px;\n            bottom: 100%;\n            right: 4px; \n            left: 4px;\n            margin-bottom: -1px;\n            background-image: linear-gradient(0deg, currentcolor, transparent);\n            opacity: ${o.visible?1:0};\n          }\n            `:`\n          &::before {\n            content: '';\n            display: block;\n            position: absolute;\n            height: 35px;\n            top: 100%;\n            right: 4px;\n            left: 4px;\n            margin-top: -1px;\n            background-image: linear-gradient(180deg, currentcolor, transparent);\n            opacity: ${o.visible?1:0};\n          }\n      `));const FancyBackground=styled__default.default.div.withConfig({displayName:"DialogComponent__FancyBackground",componentId:"ui__sc-1dlvioj-1"})(["box-sizing:border-box;position:absolute;top:0;right:0;bottom:0;left:0;mask-image:url(","),url(",");mask-repeat:no-repeat,no-repeat;mask-size:100% 32px,cover;mask-position:0 56px,0 87px;border-radius:inherit;"],maskSlope.default,maskRectangle.default);const template_default=o=>`\n    color: ${o.color};\n    background-color: ${o.backgroundColor};\n    box-shadow: 0 6px 20px 1px ${o.shadowColor};\n    ${Fading} {\n      color: ${o.backgroundColor};\n    }\n  `,template_fancy=o=>`\n    color: ${o.color};\n    ${FancyBackground} {\n      background-color: ${o.backgroundColor};\n    }\n    ${Fading} {\n      color: ${o.backgroundColor};\n    }\n  `;const Root=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardDialogComponentProp}).withConfig({displayName:"DialogComponent__Root",componentId:"ui__sc-1dlvioj-2"})(["box-sizing:border-box;display:flex;position:relative;isolation:isolate;"," "," "," "," ",""],(o=>(o.fancy?template_fancy:template_default)({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-onmain-primary'],shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette})),(o=>o.dragging&&`\n      box-shadow: 0 0 0 2px ${o.theme.colors.white}, 0 0 0 4px ${o.theme.colors['border-focus']};\n      `),(o=>typeof o.zIndex=='number'&&`z-index: ${o.zIndex};`),responsiveSize.responsiveSize,responsiveLayout.responsiveLayout);const Body=styled__default.default.div.withConfig({displayName:"DialogComponent__Body",componentId:"ui__sc-1dlvioj-3"})(["box-sizing:border-box;position:relative;display:flex;flex-direction:column;overflow:hidden;flex-grow:1;"]);const StickyHeader=styled__default.default.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__StickyHeader",componentId:"ui__sc-1dlvioj-4"})(["",""],responsiveSize.responsiveSize);const Container=styled__default.default.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__Container",componentId:"ui__sc-1dlvioj-5"})(["box-sizing:border-box;display:flex;flex-direction:column;overflow:hidden;flex-grow:1;",""],responsiveSize.responsiveSize);const ContentScrollArea=styled__default.default.div.withConfig({shouldForwardProp:o=>!['scrollable'].includes(o)}).withConfig({displayName:"DialogComponent__ContentScrollArea",componentId:"ui__sc-1dlvioj-6"})(["box-sizing:border-box;flex-grow:1;margin:0 4px;overflow:auto;"," ",""],(o=>`\n    overscroll-behavior: ${o.scrollable?'contain':'auto'};\n  `),focus.focus);const Content=styled__default.default.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__Content",componentId:"ui__sc-1dlvioj-7"})(["box-sizing:border-box;",""],responsiveSize.responsiveSize);const Footer=styled__default.default.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__Footer",componentId:"ui__sc-1dlvioj-8"})(["box-sizing:border-box;flex-shrink:0;",""],responsiveSize.responsiveSize);const DraggingHandle=styled__default.default.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__DraggingHandle",componentId:"ui__sc-1dlvioj-9"})(["box-sizing:border-box;position:absolute;top:0;left:0;width:100%;display:flex;justify-content:center;padding-top:10px;padding-bottom:10px;cursor:grab;touch-action:none;z-index:2;",""],responsiveLayout.responsiveLayout);const DraggingIconContainer=styled__default.default.div.withConfig({displayName:"DialogComponent__DraggingIconContainer",componentId:"ui__sc-1dlvioj-10"})(["box-sizing:border-box;display:flex;padding:3px 12px;border-radius:12px;& > *{height:0.25em;}"," ",""],(o=>`\n      background-color: ${o.theme.colors['bg-onmain-tertiary']};\n    `),focus.focus);const Media=styled__default.default.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__Media",componentId:"ui__sc-1dlvioj-11"})(["box-sizing:border-box;overflow:hidden;flex-shrink:0;",""],responsiveLayout.responsiveLayout);const Img=styled__default.default.div.withConfig({shouldForwardProp:o=>o!=='src'}).withConfig({displayName:"DialogComponent__Img",componentId:"ui__sc-1dlvioj-12"})(["box-sizing:border-box;",""],(o=>o.src&&`\n      background-image: url(${o.src});\n      background-repeat: no-repeat;\n      background-position: 50%;\n      background-size: cover;\n    `));const LayoutSpacer=styled__default.default(Spacer.Spacer).withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__LayoutSpacer",componentId:"ui__sc-1dlvioj-13"})(["",""],responsiveLayout.responsiveLayout);const ButtonPosition=styled__default.default.div.withConfig({displayName:"DialogComponent__ButtonPosition",componentId:"ui__sc-1dlvioj-14"})(["box-sizing:border-box;position:absolute;top:0;right:0;z-index:3;"]);const ProgressPosition=styled__default.default.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__ProgressPosition",componentId:"ui__sc-1dlvioj-15"})(["box-sizing:border-box;position:absolute;z-index:2;",""],responsiveLayout.responsiveLayout);exports.Body=Body,exports.ButtonPosition=ButtonPosition,exports.Container=Container,exports.Content=Content,exports.ContentScrollArea=ContentScrollArea,exports.DraggingHandle=DraggingHandle,exports.DraggingIconContainer=DraggingIconContainer,exports.Fading=Fading,exports.FancyBackground=FancyBackground,exports.Footer=Footer,exports.Img=Img,exports.LayoutSpacer=LayoutSpacer,exports.Media=Media,exports.ProgressPosition=ProgressPosition,exports.Root=Root,exports.StickyHeader=StickyHeader;
 //# sourceMappingURL=style.js.map

package/components/DialogComponent/style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"style.js","sources":["../../../../src/components/DialogComponent/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveLayout } from 'mixins/responsive-layout'\nimport { focus } from 'mixins/focus'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { Spacer } from 'components/Spacer'\nimport type {\n ResponsiveSizeProps,\n ResponsiveSizeInterpolationProps,\n ResponsiveLayoutInterpolationProps,\n} from 'shared/interfaces'\nimport maskRectangle from './images/mask-rectangle.svg'\nimport maskSlope from './images/mask-slope.svg'\nimport type {\n StyledDialogComponentProps,\n DialogComponentPalette,\n StyledDialogContentProps,\n Size,\n Layout,\n} from './types'\n\nconst filterLayoutProps = (propKey: string) =>\n !['layout', 'layoutXXS', 'layoutXS', 'layoutS', 'layoutM', 'layoutL', 'layoutXL', 'layouts'].includes(propKey)\n\nconst shouldForwardDialogComponentProp = createShouldForwardProp(\n (propKey) => !['dragging', 'fancy', 'zIndex'].includes(propKey),\n filterLayoutProps\n)\n\nconst filterCommonProps = createShouldForwardProp((propKey: string) => !['scrollable'].includes(propKey))\n\nexport const Fading = styled.div.withConfig<{\n visible: boolean\n after?: boolean\n}>({\n shouldForwardProp: (propKey) => !['visible', 'after'].includes(propKey),\n})`\n box-sizing: border-box;\n position: relative;\n flex-shrink: 0;\n width: 100%;\n z-index: 1;\n\n &::before,\n &::after {\n transition-property: opacity;\n transition-duration: 150ms;\n transition-timing-function: ease-in;\n pointer-events: none;\n }\n\n ${(props) =>\n props.after\n ? `\n &::after {\n content: '';\n display: block;\n position: absolute;\n height: 35px;\n bottom: 100%;\n right: 4px; \n left: 4px;\n margin-bottom: -1px;\n background-image: linear-gradient(0deg, currentcolor, transparent);\n opacity: ${props.visible ? 1 : 0};\n }\n `\n : `\n &::before {\n content: '';\n display: block;\n position: absolute;\n height: 35px;\n top: 100%;\n right: 4px;\n left: 4px;\n margin-top: -1px;\n background-image: linear-gradient(180deg, currentcolor, transparent);\n opacity: ${props.visible ? 1 : 0};\n }\n `}\n`\n\nexport const FancyBackground = styled.div`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n mask-image: url(${maskSlope}), url(${maskRectangle});\n mask-repeat: no-repeat, no-repeat;\n mask-size:\n 100% 32px,\n cover;\n mask-position:\n 0 56px,\n 0 87px;\n border-radius: inherit;\n`\n\nconst template = {\n default: (palette: DialogComponentPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n box-shadow: 0 6px 20px 1px ${palette.shadowColor};\n ${Fading} {\n color: ${palette.backgroundColor};\n }\n `,\n fancy: (palette: DialogComponentPalette) => `\n color: ${palette.color};\n ${FancyBackground} {\n background-color: ${palette.backgroundColor};\n }\n ${Fading} {\n color: ${palette.backgroundColor};\n }\n `,\n}\n\nexport const Root = styled.div.withConfig<StyledDialogComponentProps>({\n shouldForwardProp: shouldForwardDialogComponentProp,\n})`\n box-sizing: border-box;\n display: flex;\n position: relative;\n isolation: isolate;\n\n ${(props) =>\n (props.fancy ? template.fancy : template.default)({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-onmain-primary'],\n shadowColor: props.theme.colors['bg-oncolor-hover'],\n ...props.palette,\n })}\n\n ${(props) =>\n props.dragging &&\n `\n box-shadow: 0 0 0 2px ${props.theme.colors.white}, 0 0 0 4px ${props.theme.colors['border-focus']};\n `}\n \n ${(props) => typeof props.zIndex === 'number' && `z-index: ${props.zIndex};`}\n\n ${responsiveSize}\n ${responsiveLayout}\n`\n\nexport const Body = styled.div`\n box-sizing: border-box;\n position: relative;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n flex-grow: 1;\n`\n\nexport const StickyHeader = styled.div.withConfig<\n ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>\n>({\n shouldForwardProp: filterCommonProps,\n})`\n ${responsiveSize}\n`\n\nexport const Container = styled.div.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>(\n {\n shouldForwardProp: filterCommonProps,\n }\n)`\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n flex-grow: 1;\n\n ${responsiveSize}\n`\n\nexport const Content = styled.div.withConfig<StyledDialogContentProps>({\n shouldForwardProp: filterCommonProps,\n})`\n box-sizing: border-box;\n flex-grow: 1;\n\n ${(props) => `\n overflow: ${props.scrollable ? 'auto' : 'hidden'};\n overscroll-behavior: ${props.scrollable ? 'contain' : 'auto'};\n `}\n\n ${focus}\n ${responsiveSize}\n`\n\nexport const Footer = styled.div.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>({\n shouldForwardProp: filterCommonProps,\n})`\n box-sizing: border-box;\n flex-shrink: 0;\n\n ${responsiveSize}\n`\n\nexport const DraggingHandle = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n display: flex;\n justify-content: center;\n padding-top: 10px;\n padding-bottom: 10px;\n cursor: grab;\n touch-action: none;\n z-index: 2;\n\n ${responsiveLayout}\n`\n\nexport const DraggingIconContainer = styled.div`\n box-sizing: border-box;\n display: flex;\n padding: 3px 12px;\n border-radius: 12px;\n\n & > * {\n height: 0.25em;\n }\n\n ${(props) => `\n background-color: ${props.theme.colors['bg-onmain-tertiary']};\n `}\n\n ${focus}\n`\n\nexport const Media = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n overflow: hidden;\n flex-shrink: 0;\n\n ${responsiveLayout}\n`\n\nexport const Img = styled.div.withConfig<{ src?: string }>({\n shouldForwardProp: (propKey) => propKey !== 'src',\n})`\n box-sizing: border-box;\n\n ${(props) =>\n props.src &&\n `\n background-image: url(${props.src});\n background-repeat: no-repeat;\n background-position: 50%;\n background-size: cover;\n `}\n`\n\nexport const LayoutSpacer = styled(Spacer).withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n ${responsiveLayout}\n`\n\nexport const ButtonPosition = styled.div`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n right: 0;\n z-index: 3;\n`\n\nexport const ProgressPosition = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n position: absolute;\n z-index: 2;\n\n ${responsiveLayout}\n`\n"],"names":["filterLayoutProps","propKey","includes","shouldForwardDialogComponentProp","createShouldForwardProp","filterCommonProps","Fading","styled","div","withConfig","shouldForwardProp","displayName","componentId","props","after","visible","FancyBackground","maskSlope","maskRectangle","template","palette","color","backgroundColor","shadowColor","Root","fancy","theme","colors","dragging","white","zIndex","responsiveSize","responsiveLayout","Body","StickyHeader","Container","Content","scrollable","focus","Footer","DraggingHandle","DraggingIconContainer","Media","Img","src","LayoutSpacer","Spacer","ButtonPosition","ProgressPosition"],"mappings":"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"}
1	+ {"version":3,"file":"style.js","sources":["../../../../src/components/DialogComponent/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveLayout } from 'mixins/responsive-layout'\nimport { focus } from 'mixins/focus'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { Spacer } from 'components/Spacer'\nimport type {\n ResponsiveSizeProps,\n ResponsiveSizeInterpolationProps,\n ResponsiveLayoutInterpolationProps,\n} from 'shared/interfaces'\nimport maskRectangle from './images/mask-rectangle.svg'\nimport maskSlope from './images/mask-slope.svg'\nimport type {\n StyledDialogComponentProps,\n DialogComponentPalette,\n StyledDialogContentProps,\n Size,\n Layout,\n} from './types'\n\nconst filterLayoutProps = (propKey: string) =>\n !['layout', 'layoutXXS', 'layoutXS', 'layoutS', 'layoutM', 'layoutL', 'layoutXL', 'layouts'].includes(propKey)\n\nconst shouldForwardDialogComponentProp = createShouldForwardProp(\n (propKey) => !['dragging', 'fancy', 'zIndex'].includes(propKey),\n filterLayoutProps\n)\n\nconst filterCommonProps = createShouldForwardProp()\n\nexport const Fading = styled.div.withConfig<{\n visible: boolean\n after?: boolean\n}>({\n shouldForwardProp: (propKey) => !['visible', 'after'].includes(propKey),\n})`\n box-sizing: border-box;\n position: relative;\n flex-shrink: 0;\n width: 100%;\n z-index: 1;\n\n &::before,\n &::after {\n transition-property: opacity;\n transition-duration: 150ms;\n transition-timing-function: ease-in;\n pointer-events: none;\n }\n\n ${(props) =>\n props.after\n ? `\n &::after {\n content: '';\n display: block;\n position: absolute;\n height: 35px;\n bottom: 100%;\n right: 4px; \n left: 4px;\n margin-bottom: -1px;\n background-image: linear-gradient(0deg, currentcolor, transparent);\n opacity: ${props.visible ? 1 : 0};\n }\n `\n : `\n &::before {\n content: '';\n display: block;\n position: absolute;\n height: 35px;\n top: 100%;\n right: 4px;\n left: 4px;\n margin-top: -1px;\n background-image: linear-gradient(180deg, currentcolor, transparent);\n opacity: ${props.visible ? 1 : 0};\n }\n `}\n`\n\nexport const FancyBackground = styled.div`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n mask-image: url(${maskSlope}), url(${maskRectangle});\n mask-repeat: no-repeat, no-repeat;\n mask-size:\n 100% 32px,\n cover;\n mask-position:\n 0 56px,\n 0 87px;\n border-radius: inherit;\n`\n\nconst template = {\n default: (palette: DialogComponentPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n box-shadow: 0 6px 20px 1px ${palette.shadowColor};\n ${Fading} {\n color: ${palette.backgroundColor};\n }\n `,\n fancy: (palette: DialogComponentPalette) => `\n color: ${palette.color};\n ${FancyBackground} {\n background-color: ${palette.backgroundColor};\n }\n ${Fading} {\n color: ${palette.backgroundColor};\n }\n `,\n}\n\nexport const Root = styled.div.withConfig<StyledDialogComponentProps>({\n shouldForwardProp: shouldForwardDialogComponentProp,\n})`\n box-sizing: border-box;\n display: flex;\n position: relative;\n isolation: isolate;\n\n ${(props) =>\n (props.fancy ? template.fancy : template.default)({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-onmain-primary'],\n shadowColor: props.theme.colors['bg-oncolor-hover'],\n ...props.palette,\n })}\n\n ${(props) =>\n props.dragging &&\n `\n box-shadow: 0 0 0 2px ${props.theme.colors.white}, 0 0 0 4px ${props.theme.colors['border-focus']};\n `}\n \n ${(props) => typeof props.zIndex === 'number' && `z-index: ${props.zIndex};`}\n\n ${responsiveSize}\n ${responsiveLayout}\n`\n\nexport const Body = styled.div`\n box-sizing: border-box;\n position: relative;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n flex-grow: 1;\n`\n\nexport const StickyHeader = styled.div.withConfig<\n ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>\n>({\n shouldForwardProp: filterCommonProps,\n})`\n ${responsiveSize}\n`\n\nexport const Container = styled.div.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>(\n {\n shouldForwardProp: filterCommonProps,\n }\n)`\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n flex-grow: 1;\n\n ${responsiveSize}\n`\n\nexport const ContentScrollArea = styled.div.withConfig<{ scrollable: boolean }>({\n shouldForwardProp: (propKey: string) => !['scrollable'].includes(propKey),\n})`\n box-sizing: border-box;\n flex-grow: 1;\n margin: 0 4px;\n overflow: auto;\n\n ${(props) => `\n overscroll-behavior: ${props.scrollable ? 'contain' : 'auto'};\n `}\n\n ${focus}\n`\n\nexport const Content = styled.div.withConfig<StyledDialogContentProps>({\n shouldForwardProp: filterCommonProps,\n})`\n box-sizing: border-box;\n\n ${responsiveSize}\n`\n\nexport const Footer = styled.div.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>({\n shouldForwardProp: filterCommonProps,\n})`\n box-sizing: border-box;\n flex-shrink: 0;\n\n ${responsiveSize}\n`\n\nexport const DraggingHandle = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n display: flex;\n justify-content: center;\n padding-top: 10px;\n padding-bottom: 10px;\n cursor: grab;\n touch-action: none;\n z-index: 2;\n\n ${responsiveLayout}\n`\n\nexport const DraggingIconContainer = styled.div`\n box-sizing: border-box;\n display: flex;\n padding: 3px 12px;\n border-radius: 12px;\n\n & > * {\n height: 0.25em;\n }\n\n ${(props) => `\n background-color: ${props.theme.colors['bg-onmain-tertiary']};\n `}\n\n ${focus}\n`\n\nexport const Media = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n overflow: hidden;\n flex-shrink: 0;\n\n ${responsiveLayout}\n`\n\nexport const Img = styled.div.withConfig<{ src?: string }>({\n shouldForwardProp: (propKey) => propKey !== 'src',\n})`\n box-sizing: border-box;\n\n ${(props) =>\n props.src &&\n `\n background-image: url(${props.src});\n background-repeat: no-repeat;\n background-position: 50%;\n background-size: cover;\n `}\n`\n\nexport const LayoutSpacer = styled(Spacer).withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n ${responsiveLayout}\n`\n\nexport const ButtonPosition = styled.div`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n right: 0;\n z-index: 3;\n`\n\nexport const ProgressPosition = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n position: absolute;\n z-index: 2;\n\n ${responsiveLayout}\n`\n"],"names":["filterLayoutProps","propKey","includes","shouldForwardDialogComponentProp","createShouldForwardProp","filterCommonProps","Fading","styled","div","withConfig","shouldForwardProp","displayName","componentId","props","after","visible","FancyBackground","maskSlope","maskRectangle","template","palette","color","backgroundColor","shadowColor","Root","fancy","theme","colors","dragging","white","zIndex","responsiveSize","responsiveLayout","Body","StickyHeader","Container","ContentScrollArea","scrollable","focus","Content","Footer","DraggingHandle","DraggingIconContainer","Media","Img","src","LayoutSpacer","Spacer","ButtonPosition","ProgressPosition"],"mappings":"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"}

package/components/DialogComponent/style.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import styled from'styled-components';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveLayout}from'../../mixins/responsive-layout.mjs';import{focus}from'../../mixins/focus.mjs';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import maskRectangle from'./images/mask-rectangle.svg.mjs';import maskSlope from'./images/mask-slope.svg.mjs';import{Spacer}from'../Spacer/Spacer.mjs';const filterLayoutProps=o=>!['layout','layoutXXS','layoutXS','layoutS','layoutM','layoutL','layoutXL','layouts'].includes(o);const shouldForwardDialogComponentProp=createShouldForwardProp((o=>!['dragging','fancy','zIndex'].includes(o)),filterLayoutProps);const filterCommonProps=createShouldForwardProp((o=>!['scrollable'].includes(o)));const Fading=styled.div.withConfig({shouldForwardProp:o=>!['visible','after'].includes(o)}).withConfig({displayName:"DialogComponent__Fading",componentId:"ui__sc-1dlvioj-0"})(["box-sizing:border-box;position:relative;flex-shrink:0;width:100%;z-index:1;&::before,&::after{transition-property:opacity;transition-duration:150ms;transition-timing-function:ease-in;pointer-events:none;}",""],(o=>o.after?`\n          &::after {\n            content: '';\n            display: block;\n            position: absolute;\n            height: 35px;\n            bottom: 100%;\n            right: 4px; \n            left: 4px;\n            margin-bottom: -1px;\n            background-image: linear-gradient(0deg, currentcolor, transparent);\n            opacity: ${o.visible?1:0};\n          }\n            `:`\n          &::before {\n            content: '';\n            display: block;\n            position: absolute;\n            height: 35px;\n            top: 100%;\n            right: 4px;\n            left: 4px;\n            margin-top: -1px;\n            background-image: linear-gradient(180deg, currentcolor, transparent);\n            opacity: ${o.visible?1:0};\n          }\n      `));const FancyBackground=styled.div.withConfig({displayName:"DialogComponent__FancyBackground",componentId:"ui__sc-1dlvioj-1"})(["box-sizing:border-box;position:absolute;top:0;right:0;bottom:0;left:0;mask-image:url(","),url(",");mask-repeat:no-repeat,no-repeat;mask-size:100% 32px,cover;mask-position:0 56px,0 87px;border-radius:inherit;"],maskSlope,maskRectangle);const template_default=o=>`\n    color: ${o.color};\n    background-color: ${o.backgroundColor};\n    box-shadow: 0 6px 20px 1px ${o.shadowColor};\n    ${Fading} {\n      color: ${o.backgroundColor};\n    }\n  `,template_fancy=o=>`\n    color: ${o.color};\n    ${FancyBackground} {\n      background-color: ${o.backgroundColor};\n    }\n    ${Fading} {\n      color: ${o.backgroundColor};\n    }\n  `;const Root=styled.div.withConfig({shouldForwardProp:shouldForwardDialogComponentProp}).withConfig({displayName:"DialogComponent__Root",componentId:"ui__sc-1dlvioj-2"})(["box-sizing:border-box;display:flex;position:relative;isolation:isolate;"," "," "," "," ",""],(o=>(o.fancy?template_fancy:template_default)({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-onmain-primary'],shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette})),(o=>o.dragging&&`\n      box-shadow: 0 0 0 2px ${o.theme.colors.white}, 0 0 0 4px ${o.theme.colors['border-focus']};\n      `),(o=>typeof o.zIndex=='number'&&`z-index: ${o.zIndex};`),responsiveSize,responsiveLayout);const Body=styled.div.withConfig({displayName:"DialogComponent__Body",componentId:"ui__sc-1dlvioj-3"})(["box-sizing:border-box;position:relative;display:flex;flex-direction:column;overflow:hidden;flex-grow:1;"]);const StickyHeader=styled.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__StickyHeader",componentId:"ui__sc-1dlvioj-4"})(["",""],responsiveSize);const Container=styled.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__Container",componentId:"ui__sc-1dlvioj-5"})(["box-sizing:border-box;display:flex;flex-direction:column;overflow:hidden;flex-grow:1;",""],responsiveSize);const Content=styled.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__Content",componentId:"ui__sc-1dlvioj-6"})(["box-sizing:border-box;flex-grow:1;"," "," ",""],(o=>`\n     overflow: ${o.scrollable?'auto':'hidden'};\n     overscroll-behavior: ${o.scrollable?'contain':'auto'};\n  `),focus,responsiveSize);const Footer=styled.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__Footer",componentId:"ui__sc-1dlvioj-7"})(["box-sizing:border-box;flex-shrink:0;",""],responsiveSize);const DraggingHandle=styled.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__DraggingHandle",componentId:"ui__sc-1dlvioj-8"})(["box-sizing:border-box;position:absolute;top:0;left:0;width:100%;display:flex;justify-content:center;padding-top:10px;padding-bottom:10px;cursor:grab;touch-action:none;z-index:2;",""],responsiveLayout);const DraggingIconContainer=styled.div.withConfig({displayName:"DialogComponent__DraggingIconContainer",componentId:"ui__sc-1dlvioj-9"})(["box-sizing:border-box;display:flex;padding:3px 12px;border-radius:12px;& > *{height:0.25em;}"," ",""],(o=>`\n      background-color: ${o.theme.colors['bg-onmain-tertiary']};\n    `),focus);const Media=styled.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__Media",componentId:"ui__sc-1dlvioj-10"})(["box-sizing:border-box;overflow:hidden;flex-shrink:0;",""],responsiveLayout);const Img=styled.div.withConfig({shouldForwardProp:o=>o!=='src'}).withConfig({displayName:"DialogComponent__Img",componentId:"ui__sc-1dlvioj-11"})(["box-sizing:border-box;",""],(o=>o.src&&`\n      background-image: url(${o.src});\n      background-repeat: no-repeat;\n      background-position: 50%;\n      background-size: cover;\n    `));const LayoutSpacer=styled(Spacer).withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__LayoutSpacer",componentId:"ui__sc-1dlvioj-12"})(["",""],responsiveLayout);const ButtonPosition=styled.div.withConfig({displayName:"DialogComponent__ButtonPosition",componentId:"ui__sc-1dlvioj-13"})(["box-sizing:border-box;position:absolute;top:0;right:0;z-index:3;"]);const ProgressPosition=styled.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__ProgressPosition",componentId:"ui__sc-1dlvioj-14"})(["box-sizing:border-box;position:absolute;z-index:2;",""],responsiveLayout);export{Body,ButtonPosition,Container,Content,DraggingHandle,DraggingIconContainer,Fading,FancyBackground,Footer,Img,LayoutSpacer,Media,ProgressPosition,Root,StickyHeader};
+import styled from'styled-components';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveLayout}from'../../mixins/responsive-layout.mjs';import{focus}from'../../mixins/focus.mjs';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import maskRectangle from'./images/mask-rectangle.svg.mjs';import maskSlope from'./images/mask-slope.svg.mjs';import{Spacer}from'../Spacer/Spacer.mjs';const filterLayoutProps=o=>!['layout','layoutXXS','layoutXS','layoutS','layoutM','layoutL','layoutXL','layouts'].includes(o);const shouldForwardDialogComponentProp=createShouldForwardProp((o=>!['dragging','fancy','zIndex'].includes(o)),filterLayoutProps);const filterCommonProps=createShouldForwardProp();const Fading=styled.div.withConfig({shouldForwardProp:o=>!['visible','after'].includes(o)}).withConfig({displayName:"DialogComponent__Fading",componentId:"ui__sc-1dlvioj-0"})(["box-sizing:border-box;position:relative;flex-shrink:0;width:100%;z-index:1;&::before,&::after{transition-property:opacity;transition-duration:150ms;transition-timing-function:ease-in;pointer-events:none;}",""],(o=>o.after?`\n          &::after {\n            content: '';\n            display: block;\n            position: absolute;\n            height: 35px;\n            bottom: 100%;\n            right: 4px; \n            left: 4px;\n            margin-bottom: -1px;\n            background-image: linear-gradient(0deg, currentcolor, transparent);\n            opacity: ${o.visible?1:0};\n          }\n            `:`\n          &::before {\n            content: '';\n            display: block;\n            position: absolute;\n            height: 35px;\n            top: 100%;\n            right: 4px;\n            left: 4px;\n            margin-top: -1px;\n            background-image: linear-gradient(180deg, currentcolor, transparent);\n            opacity: ${o.visible?1:0};\n          }\n      `));const FancyBackground=styled.div.withConfig({displayName:"DialogComponent__FancyBackground",componentId:"ui__sc-1dlvioj-1"})(["box-sizing:border-box;position:absolute;top:0;right:0;bottom:0;left:0;mask-image:url(","),url(",");mask-repeat:no-repeat,no-repeat;mask-size:100% 32px,cover;mask-position:0 56px,0 87px;border-radius:inherit;"],maskSlope,maskRectangle);const template_default=o=>`\n    color: ${o.color};\n    background-color: ${o.backgroundColor};\n    box-shadow: 0 6px 20px 1px ${o.shadowColor};\n    ${Fading} {\n      color: ${o.backgroundColor};\n    }\n  `,template_fancy=o=>`\n    color: ${o.color};\n    ${FancyBackground} {\n      background-color: ${o.backgroundColor};\n    }\n    ${Fading} {\n      color: ${o.backgroundColor};\n    }\n  `;const Root=styled.div.withConfig({shouldForwardProp:shouldForwardDialogComponentProp}).withConfig({displayName:"DialogComponent__Root",componentId:"ui__sc-1dlvioj-2"})(["box-sizing:border-box;display:flex;position:relative;isolation:isolate;"," "," "," "," ",""],(o=>(o.fancy?template_fancy:template_default)({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-onmain-primary'],shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette})),(o=>o.dragging&&`\n      box-shadow: 0 0 0 2px ${o.theme.colors.white}, 0 0 0 4px ${o.theme.colors['border-focus']};\n      `),(o=>typeof o.zIndex=='number'&&`z-index: ${o.zIndex};`),responsiveSize,responsiveLayout);const Body=styled.div.withConfig({displayName:"DialogComponent__Body",componentId:"ui__sc-1dlvioj-3"})(["box-sizing:border-box;position:relative;display:flex;flex-direction:column;overflow:hidden;flex-grow:1;"]);const StickyHeader=styled.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__StickyHeader",componentId:"ui__sc-1dlvioj-4"})(["",""],responsiveSize);const Container=styled.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__Container",componentId:"ui__sc-1dlvioj-5"})(["box-sizing:border-box;display:flex;flex-direction:column;overflow:hidden;flex-grow:1;",""],responsiveSize);const ContentScrollArea=styled.div.withConfig({shouldForwardProp:o=>!['scrollable'].includes(o)}).withConfig({displayName:"DialogComponent__ContentScrollArea",componentId:"ui__sc-1dlvioj-6"})(["box-sizing:border-box;flex-grow:1;margin:0 4px;overflow:auto;"," ",""],(o=>`\n    overscroll-behavior: ${o.scrollable?'contain':'auto'};\n  `),focus);const Content=styled.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__Content",componentId:"ui__sc-1dlvioj-7"})(["box-sizing:border-box;",""],responsiveSize);const Footer=styled.div.withConfig({shouldForwardProp:filterCommonProps}).withConfig({displayName:"DialogComponent__Footer",componentId:"ui__sc-1dlvioj-8"})(["box-sizing:border-box;flex-shrink:0;",""],responsiveSize);const DraggingHandle=styled.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__DraggingHandle",componentId:"ui__sc-1dlvioj-9"})(["box-sizing:border-box;position:absolute;top:0;left:0;width:100%;display:flex;justify-content:center;padding-top:10px;padding-bottom:10px;cursor:grab;touch-action:none;z-index:2;",""],responsiveLayout);const DraggingIconContainer=styled.div.withConfig({displayName:"DialogComponent__DraggingIconContainer",componentId:"ui__sc-1dlvioj-10"})(["box-sizing:border-box;display:flex;padding:3px 12px;border-radius:12px;& > *{height:0.25em;}"," ",""],(o=>`\n      background-color: ${o.theme.colors['bg-onmain-tertiary']};\n    `),focus);const Media=styled.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__Media",componentId:"ui__sc-1dlvioj-11"})(["box-sizing:border-box;overflow:hidden;flex-shrink:0;",""],responsiveLayout);const Img=styled.div.withConfig({shouldForwardProp:o=>o!=='src'}).withConfig({displayName:"DialogComponent__Img",componentId:"ui__sc-1dlvioj-12"})(["box-sizing:border-box;",""],(o=>o.src&&`\n      background-image: url(${o.src});\n      background-repeat: no-repeat;\n      background-position: 50%;\n      background-size: cover;\n    `));const LayoutSpacer=styled(Spacer).withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__LayoutSpacer",componentId:"ui__sc-1dlvioj-13"})(["",""],responsiveLayout);const ButtonPosition=styled.div.withConfig({displayName:"DialogComponent__ButtonPosition",componentId:"ui__sc-1dlvioj-14"})(["box-sizing:border-box;position:absolute;top:0;right:0;z-index:3;"]);const ProgressPosition=styled.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"DialogComponent__ProgressPosition",componentId:"ui__sc-1dlvioj-15"})(["box-sizing:border-box;position:absolute;z-index:2;",""],responsiveLayout);export{Body,ButtonPosition,Container,Content,ContentScrollArea,DraggingHandle,DraggingIconContainer,Fading,FancyBackground,Footer,Img,LayoutSpacer,Media,ProgressPosition,Root,StickyHeader};
 //# sourceMappingURL=style.mjs.map

package/components/DialogComponent/style.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"style.mjs","sources":["../../../../src/components/DialogComponent/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveLayout } from 'mixins/responsive-layout'\nimport { focus } from 'mixins/focus'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { Spacer } from 'components/Spacer'\nimport type {\n ResponsiveSizeProps,\n ResponsiveSizeInterpolationProps,\n ResponsiveLayoutInterpolationProps,\n} from 'shared/interfaces'\nimport maskRectangle from './images/mask-rectangle.svg'\nimport maskSlope from './images/mask-slope.svg'\nimport type {\n StyledDialogComponentProps,\n DialogComponentPalette,\n StyledDialogContentProps,\n Size,\n Layout,\n} from './types'\n\nconst filterLayoutProps = (propKey: string) =>\n !['layout', 'layoutXXS', 'layoutXS', 'layoutS', 'layoutM', 'layoutL', 'layoutXL', 'layouts'].includes(propKey)\n\nconst shouldForwardDialogComponentProp = createShouldForwardProp(\n (propKey) => !['dragging', 'fancy', 'zIndex'].includes(propKey),\n filterLayoutProps\n)\n\nconst filterCommonProps = createShouldForwardProp((propKey: string) => !['scrollable'].includes(propKey))\n\nexport const Fading = styled.div.withConfig<{\n visible: boolean\n after?: boolean\n}>({\n shouldForwardProp: (propKey) => !['visible', 'after'].includes(propKey),\n})`\n box-sizing: border-box;\n position: relative;\n flex-shrink: 0;\n width: 100%;\n z-index: 1;\n\n &::before,\n &::after {\n transition-property: opacity;\n transition-duration: 150ms;\n transition-timing-function: ease-in;\n pointer-events: none;\n }\n\n ${(props) =>\n props.after\n ? `\n &::after {\n content: '';\n display: block;\n position: absolute;\n height: 35px;\n bottom: 100%;\n right: 4px; \n left: 4px;\n margin-bottom: -1px;\n background-image: linear-gradient(0deg, currentcolor, transparent);\n opacity: ${props.visible ? 1 : 0};\n }\n `\n : `\n &::before {\n content: '';\n display: block;\n position: absolute;\n height: 35px;\n top: 100%;\n right: 4px;\n left: 4px;\n margin-top: -1px;\n background-image: linear-gradient(180deg, currentcolor, transparent);\n opacity: ${props.visible ? 1 : 0};\n }\n `}\n`\n\nexport const FancyBackground = styled.div`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n mask-image: url(${maskSlope}), url(${maskRectangle});\n mask-repeat: no-repeat, no-repeat;\n mask-size:\n 100% 32px,\n cover;\n mask-position:\n 0 56px,\n 0 87px;\n border-radius: inherit;\n`\n\nconst template = {\n default: (palette: DialogComponentPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n box-shadow: 0 6px 20px 1px ${palette.shadowColor};\n ${Fading} {\n color: ${palette.backgroundColor};\n }\n `,\n fancy: (palette: DialogComponentPalette) => `\n color: ${palette.color};\n ${FancyBackground} {\n background-color: ${palette.backgroundColor};\n }\n ${Fading} {\n color: ${palette.backgroundColor};\n }\n `,\n}\n\nexport const Root = styled.div.withConfig<StyledDialogComponentProps>({\n shouldForwardProp: shouldForwardDialogComponentProp,\n})`\n box-sizing: border-box;\n display: flex;\n position: relative;\n isolation: isolate;\n\n ${(props) =>\n (props.fancy ? template.fancy : template.default)({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-onmain-primary'],\n shadowColor: props.theme.colors['bg-oncolor-hover'],\n ...props.palette,\n })}\n\n ${(props) =>\n props.dragging &&\n `\n box-shadow: 0 0 0 2px ${props.theme.colors.white}, 0 0 0 4px ${props.theme.colors['border-focus']};\n `}\n \n ${(props) => typeof props.zIndex === 'number' && `z-index: ${props.zIndex};`}\n\n ${responsiveSize}\n ${responsiveLayout}\n`\n\nexport const Body = styled.div`\n box-sizing: border-box;\n position: relative;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n flex-grow: 1;\n`\n\nexport const StickyHeader = styled.div.withConfig<\n ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>\n>({\n shouldForwardProp: filterCommonProps,\n})`\n ${responsiveSize}\n`\n\nexport const Container = styled.div.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>(\n {\n shouldForwardProp: filterCommonProps,\n }\n)`\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n flex-grow: 1;\n\n ${responsiveSize}\n`\n\nexport const Content = styled.div.withConfig<StyledDialogContentProps>({\n shouldForwardProp: filterCommonProps,\n})`\n box-sizing: border-box;\n flex-grow: 1;\n\n ${(props) => `\n overflow: ${props.scrollable ? 'auto' : 'hidden'};\n overscroll-behavior: ${props.scrollable ? 'contain' : 'auto'};\n `}\n\n ${focus}\n ${responsiveSize}\n`\n\nexport const Footer = styled.div.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>({\n shouldForwardProp: filterCommonProps,\n})`\n box-sizing: border-box;\n flex-shrink: 0;\n\n ${responsiveSize}\n`\n\nexport const DraggingHandle = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n display: flex;\n justify-content: center;\n padding-top: 10px;\n padding-bottom: 10px;\n cursor: grab;\n touch-action: none;\n z-index: 2;\n\n ${responsiveLayout}\n`\n\nexport const DraggingIconContainer = styled.div`\n box-sizing: border-box;\n display: flex;\n padding: 3px 12px;\n border-radius: 12px;\n\n & > * {\n height: 0.25em;\n }\n\n ${(props) => `\n background-color: ${props.theme.colors['bg-onmain-tertiary']};\n `}\n\n ${focus}\n`\n\nexport const Media = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n overflow: hidden;\n flex-shrink: 0;\n\n ${responsiveLayout}\n`\n\nexport const Img = styled.div.withConfig<{ src?: string }>({\n shouldForwardProp: (propKey) => propKey !== 'src',\n})`\n box-sizing: border-box;\n\n ${(props) =>\n props.src &&\n `\n background-image: url(${props.src});\n background-repeat: no-repeat;\n background-position: 50%;\n background-size: cover;\n `}\n`\n\nexport const LayoutSpacer = styled(Spacer).withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n ${responsiveLayout}\n`\n\nexport const ButtonPosition = styled.div`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n right: 0;\n z-index: 3;\n`\n\nexport const ProgressPosition = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n position: absolute;\n z-index: 2;\n\n ${responsiveLayout}\n`\n"],"names":["filterLayoutProps","propKey","includes","shouldForwardDialogComponentProp","createShouldForwardProp","filterCommonProps","Fading","styled","div","withConfig","shouldForwardProp","displayName","componentId","props","after","visible","FancyBackground","maskSlope","maskRectangle","template","palette","color","backgroundColor","shadowColor","Root","fancy","theme","colors","dragging","white","zIndex","responsiveSize","responsiveLayout","Body","StickyHeader","Container","Content","scrollable","focus","Footer","DraggingHandle","DraggingIconContainer","Media","Img","src","LayoutSpacer","Spacer","ButtonPosition","ProgressPosition"],"mappings":"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"}
1	+ {"version":3,"file":"style.mjs","sources":["../../../../src/components/DialogComponent/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveLayout } from 'mixins/responsive-layout'\nimport { focus } from 'mixins/focus'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { Spacer } from 'components/Spacer'\nimport type {\n ResponsiveSizeProps,\n ResponsiveSizeInterpolationProps,\n ResponsiveLayoutInterpolationProps,\n} from 'shared/interfaces'\nimport maskRectangle from './images/mask-rectangle.svg'\nimport maskSlope from './images/mask-slope.svg'\nimport type {\n StyledDialogComponentProps,\n DialogComponentPalette,\n StyledDialogContentProps,\n Size,\n Layout,\n} from './types'\n\nconst filterLayoutProps = (propKey: string) =>\n !['layout', 'layoutXXS', 'layoutXS', 'layoutS', 'layoutM', 'layoutL', 'layoutXL', 'layouts'].includes(propKey)\n\nconst shouldForwardDialogComponentProp = createShouldForwardProp(\n (propKey) => !['dragging', 'fancy', 'zIndex'].includes(propKey),\n filterLayoutProps\n)\n\nconst filterCommonProps = createShouldForwardProp()\n\nexport const Fading = styled.div.withConfig<{\n visible: boolean\n after?: boolean\n}>({\n shouldForwardProp: (propKey) => !['visible', 'after'].includes(propKey),\n})`\n box-sizing: border-box;\n position: relative;\n flex-shrink: 0;\n width: 100%;\n z-index: 1;\n\n &::before,\n &::after {\n transition-property: opacity;\n transition-duration: 150ms;\n transition-timing-function: ease-in;\n pointer-events: none;\n }\n\n ${(props) =>\n props.after\n ? `\n &::after {\n content: '';\n display: block;\n position: absolute;\n height: 35px;\n bottom: 100%;\n right: 4px; \n left: 4px;\n margin-bottom: -1px;\n background-image: linear-gradient(0deg, currentcolor, transparent);\n opacity: ${props.visible ? 1 : 0};\n }\n `\n : `\n &::before {\n content: '';\n display: block;\n position: absolute;\n height: 35px;\n top: 100%;\n right: 4px;\n left: 4px;\n margin-top: -1px;\n background-image: linear-gradient(180deg, currentcolor, transparent);\n opacity: ${props.visible ? 1 : 0};\n }\n `}\n`\n\nexport const FancyBackground = styled.div`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n mask-image: url(${maskSlope}), url(${maskRectangle});\n mask-repeat: no-repeat, no-repeat;\n mask-size:\n 100% 32px,\n cover;\n mask-position:\n 0 56px,\n 0 87px;\n border-radius: inherit;\n`\n\nconst template = {\n default: (palette: DialogComponentPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n box-shadow: 0 6px 20px 1px ${palette.shadowColor};\n ${Fading} {\n color: ${palette.backgroundColor};\n }\n `,\n fancy: (palette: DialogComponentPalette) => `\n color: ${palette.color};\n ${FancyBackground} {\n background-color: ${palette.backgroundColor};\n }\n ${Fading} {\n color: ${palette.backgroundColor};\n }\n `,\n}\n\nexport const Root = styled.div.withConfig<StyledDialogComponentProps>({\n shouldForwardProp: shouldForwardDialogComponentProp,\n})`\n box-sizing: border-box;\n display: flex;\n position: relative;\n isolation: isolate;\n\n ${(props) =>\n (props.fancy ? template.fancy : template.default)({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-onmain-primary'],\n shadowColor: props.theme.colors['bg-oncolor-hover'],\n ...props.palette,\n })}\n\n ${(props) =>\n props.dragging &&\n `\n box-shadow: 0 0 0 2px ${props.theme.colors.white}, 0 0 0 4px ${props.theme.colors['border-focus']};\n `}\n \n ${(props) => typeof props.zIndex === 'number' && `z-index: ${props.zIndex};`}\n\n ${responsiveSize}\n ${responsiveLayout}\n`\n\nexport const Body = styled.div`\n box-sizing: border-box;\n position: relative;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n flex-grow: 1;\n`\n\nexport const StickyHeader = styled.div.withConfig<\n ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>\n>({\n shouldForwardProp: filterCommonProps,\n})`\n ${responsiveSize}\n`\n\nexport const Container = styled.div.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>(\n {\n shouldForwardProp: filterCommonProps,\n }\n)`\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n flex-grow: 1;\n\n ${responsiveSize}\n`\n\nexport const ContentScrollArea = styled.div.withConfig<{ scrollable: boolean }>({\n shouldForwardProp: (propKey: string) => !['scrollable'].includes(propKey),\n})`\n box-sizing: border-box;\n flex-grow: 1;\n margin: 0 4px;\n overflow: auto;\n\n ${(props) => `\n overscroll-behavior: ${props.scrollable ? 'contain' : 'auto'};\n `}\n\n ${focus}\n`\n\nexport const Content = styled.div.withConfig<StyledDialogContentProps>({\n shouldForwardProp: filterCommonProps,\n})`\n box-sizing: border-box;\n\n ${responsiveSize}\n`\n\nexport const Footer = styled.div.withConfig<ResponsiveSizeInterpolationProps<Size, Size, ResponsiveSizeProps<Size>>>({\n shouldForwardProp: filterCommonProps,\n})`\n box-sizing: border-box;\n flex-shrink: 0;\n\n ${responsiveSize}\n`\n\nexport const DraggingHandle = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n display: flex;\n justify-content: center;\n padding-top: 10px;\n padding-bottom: 10px;\n cursor: grab;\n touch-action: none;\n z-index: 2;\n\n ${responsiveLayout}\n`\n\nexport const DraggingIconContainer = styled.div`\n box-sizing: border-box;\n display: flex;\n padding: 3px 12px;\n border-radius: 12px;\n\n & > * {\n height: 0.25em;\n }\n\n ${(props) => `\n background-color: ${props.theme.colors['bg-onmain-tertiary']};\n `}\n\n ${focus}\n`\n\nexport const Media = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n overflow: hidden;\n flex-shrink: 0;\n\n ${responsiveLayout}\n`\n\nexport const Img = styled.div.withConfig<{ src?: string }>({\n shouldForwardProp: (propKey) => propKey !== 'src',\n})`\n box-sizing: border-box;\n\n ${(props) =>\n props.src &&\n `\n background-image: url(${props.src});\n background-repeat: no-repeat;\n background-position: 50%;\n background-size: cover;\n `}\n`\n\nexport const LayoutSpacer = styled(Spacer).withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n ${responsiveLayout}\n`\n\nexport const ButtonPosition = styled.div`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n right: 0;\n z-index: 3;\n`\n\nexport const ProgressPosition = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n position: absolute;\n z-index: 2;\n\n ${responsiveLayout}\n`\n"],"names":["filterLayoutProps","propKey","includes","shouldForwardDialogComponentProp","createShouldForwardProp","filterCommonProps","Fading","styled","div","withConfig","shouldForwardProp","displayName","componentId","props","after","visible","FancyBackground","maskSlope","maskRectangle","template","palette","color","backgroundColor","shadowColor","Root","fancy","theme","colors","dragging","white","zIndex","responsiveSize","responsiveLayout","Body","StickyHeader","Container","ContentScrollArea","scrollable","focus","Content","Footer","DraggingHandle","DraggingIconContainer","Media","Img","src","LayoutSpacer","Spacer","ButtonPosition","ProgressPosition"],"mappings":"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"}

package/dts/index.d.ts CHANGED Viewed

@@ -7940,7 +7940,13 @@ type ScrollLockParams = {
     /**
      * Контейнер, в котором разрешена прокрутка на iOS при заблокированном скролле страницы.
      */
-    iosAllowedScrollContainer?: HTMLElement;
+    iosAllowedScrollContainer?: DomTarget;
+    /**
+     * Элемент, на котором блокируется скролл.
+     *
+     * @default 'document.documentElement'
+     */
+    target?: DomTarget;
 };
 declare function useScrollLock(params: ScrollLockParams): void;

package/hooks/useScrollLock.js CHANGED Viewed

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');const TOUCH_EVENT_OPTIONS={capture:!0,passive:!1};const supportsScrollbarGutter=typeof CSS!='undefined'&&typeof CSS.supports=='function'&&CSS.supports('scrollbar-gutter: stable');const isIosDevice=typeof window!='undefined'&&window.navigator?.userAgent&&(/iP(ad|hone|od)/.test(window.navigator.userAgent)||window.navigator.userAgent.includes('Macintosh')&&window.navigator.maxTouchPoints>1);const iosScrollableBlocks=[];let iosActiveScrollElement=null;let iosTouchStartY=null;let touchStartHandler=null;let touchMoveHandler=null;function getScrollLockCount(){return Number(document.documentElement.dataset.scrollLockCount||0)}function setScrollLockCount(t){document.documentElement.dataset.scrollLockCount=t.toString()}function applyScrollLockStyles(){const t=document.documentElement;if(t.dataset.prevOverflow=t.style.overflow||'',supportsScrollbarGutter&&!isIosDevice)t.style.scrollbarGutter='stable';else{const e=window.innerWidth-document.documentElement.clientWidth;if(t.dataset.prevPaddingRight=t.style.paddingRight||'',e>0){const o=parseInt(window.getComputedStyle(t).paddingRight||'0',10);t.style.paddingRight=`${o+e}px`}}t.style.overflow='hidden'}function resetScrollLockStyles(){const t=document.documentElement;t.style.overflow=t.dataset.prevOverflow||'',t.style.paddingRight=t.dataset.prevPaddingRight||'',delete t.dataset.prevOverflow,delete t.dataset.prevPaddingRight}function isScrollable(t){const e=getComputedStyle(t);return(e.overflowY==='auto'||e.overflowY==='scroll')&&t.scrollHeight>t.clientHeight}function findScrollableParent(t,e){let o=t;for(;o&&o!==e.parentElement;){if(isScrollable(o))return o;o=o.parentElement}return isScrollable(e)?e:null}exports.useScrollLock=t=>{const{locked:e,iosAllowedScrollContainer:o=document.documentElement}=t;React.useEffect((()=>{if(e)return isIosDevice?((t=>{iosScrollableBlocks.push(t);const e=getScrollLockCount();e===0&&(applyScrollLockStyles(),touchMoveHandler||touchStartHandler||(touchStartHandler=t=>{const e=t.target;if(!(e instanceof HTMLElement))return iosActiveScrollElement=null,void(iosTouchStartY=null);iosTouchStartY=t.touches[0]?.clientY??null,iosActiveScrollElement=null;for(const t of iosScrollableBlocks)if(t.contains(e)){const o=findScrollableParent(e,t);if(o){iosActiveScrollElement=o;break}}},touchMoveHandler=t=>{const e=t.touches[0];if(!e||t.touches.length===2||(t=>{if(!(t&&t instanceof HTMLElement))return!1;const e=t.ownerDocument?.defaultView?.getSelection();return!(!e||e.isCollapsed||!e.containsNode(t,!0))||'selectionStart'in t&&'selectionEnd'in t&&Number(t.selectionStart)<Number(t.selectionEnd)&&t.ownerDocument?.activeElement===t})(t.target))return;if(!t.cancelable)return;if(!iosActiveScrollElement||iosTouchStartY===null)return void t.preventDefault();const o=e.clientY-Number(iosTouchStartY);(iosActiveScrollElement.scrollTop<=0&&o>0||iosActiveScrollElement.scrollTop+iosActiveScrollElement.clientHeight>=iosActiveScrollElement.scrollHeight&&o<0)&&t.preventDefault()},document.addEventListener('touchstart',touchStartHandler,TOUCH_EVENT_OPTIONS),document.addEventListener('touchmove',touchMoveHandler,TOUCH_EVENT_OPTIONS))),setScrollLockCount(e+1)})(o),()=>{(()=>{iosScrollableBlocks.pop();const t=getScrollLockCount();const e=Math.max(0,t-1);setScrollLockCount(e),e===0&&(resetScrollLockStyles(),touchStartHandler&&(document.removeEventListener('touchstart',touchStartHandler,TOUCH_EVENT_OPTIONS),touchStartHandler=null),touchMoveHandler&&(document.removeEventListener('touchmove',touchMoveHandler,TOUCH_EVENT_OPTIONS),touchMoveHandler=null),iosActiveScrollElement=null,iosTouchStartY=null)})()}):((()=>{const t=getScrollLockCount();t===0&&applyScrollLockStyles(),setScrollLockCount(t+1)})(),()=>{(()=>{const t=getScrollLockCount();if(t<=0)return;const e=t-1;setScrollLockCount(e),e===0&&resetScrollLockStyles()})()})}),[o,e])};
+'use strict';var React=require('react');var getDomTargets=require('../shared/utils/getDomTargets.js');const TOUCH_EVENT_OPTIONS={capture:!0,passive:!1};const supportsScrollbarGutter=typeof CSS!='undefined'&&typeof CSS.supports=='function'&&CSS.supports('scrollbar-gutter: stable');const isIosDevice=typeof window!='undefined'&&window.navigator?.userAgent&&(/iP(ad|hone|od)/.test(window.navigator.userAgent)||window.navigator.userAgent.includes('Macintosh')&&window.navigator.maxTouchPoints>1);const iosScrollableBlocks=[];let iosActiveScrollElement=null;let iosTouchStartY=null;let touchStartHandler=null;let touchMoveHandler=null;function getScrollLockCount(){return Number(document.documentElement.dataset.scrollLockCount||0)}function setScrollLockCount(t){document.documentElement.dataset.scrollLockCount=t.toString()}function applyScrollLockStyles(){const t=document.documentElement;if(t.dataset.prevOverflow=t.style.overflow||'',supportsScrollbarGutter&&!isIosDevice)t.style.scrollbarGutter='stable';else{const e=window.innerWidth-document.documentElement.clientWidth;if(t.dataset.prevPaddingRight=t.style.paddingRight||'',e>0){const o=parseFloat(getComputedStyle(t).paddingRight)||0;t.style.paddingRight=`${o+e}px`}}t.style.overflow='hidden'}function resetScrollLockStyles(){const t=document.documentElement;t.style.overflow=t.dataset.prevOverflow||'',t.style.paddingRight=t.dataset.prevPaddingRight||'',delete t.dataset.prevOverflow,delete t.dataset.prevPaddingRight}function isScrollable(t){const e=getComputedStyle(t);return(e.overflowY==='auto'||e.overflowY==='scroll')&&t.scrollHeight>t.clientHeight}function findScrollableParent(t,e){let o=t;for(;o&&o!==e.parentElement;){if(isScrollable(o))return o;o=o.parentElement}return isScrollable(e)?e:null}function unlockTargetScroll(t){t.dataset.prevOverflow!==void 0&&(t.style.overflow=t.dataset.prevOverflow),t.dataset.prevPaddingRight!==void 0&&(t.style.paddingRight=t.dataset.prevPaddingRight),delete t.dataset.prevOverflow,delete t.dataset.prevPaddingRight,supportsScrollbarGutter&&(t.style.scrollbarGutter='')}exports.useScrollLock=t=>{const{locked:e,iosAllowedScrollContainer:o=document.documentElement,target:l}=t;const r=l===void 0||l===document.documentElement||l===document.body;React.useEffect((()=>{if(!l||r)return;const t=getDomTargets.getDomTargets(l)[0];return e?(t=>{const e=getComputedStyle(t);t.dataset.prevOverflow===void 0&&(t.dataset.prevOverflow=e.overflow||''),t.dataset.prevPaddingRight===void 0&&(t.dataset.prevPaddingRight=e.paddingRight||'');const o=(parseFloat(e.borderLeftWidth)||0)+(parseFloat(e.borderRightWidth)||0);const l=e.overflow;t.style.overflow='scroll';const r=t.offsetWidth-t.clientWidth-o;if(t.style.overflow=l,supportsScrollbarGutter)t.style.scrollbarGutter='stable';else if(r>0){const e=parseFloat(t.dataset.prevPaddingRight)||0;t.style.paddingRight=`${e+r}px`}t.style.overflow='hidden'})(t):t.dataset.prevOverflow!==void 0&&unlockTargetScroll(t),()=>{unlockTargetScroll(t)}}),[l,e,r]),React.useEffect((()=>{if(e&&r)return isIosDevice?((t=>{iosScrollableBlocks.push(t);const e=getScrollLockCount();e===0&&(applyScrollLockStyles(),touchMoveHandler||touchStartHandler||(touchStartHandler=t=>{const e=t.target;if(!(e instanceof HTMLElement))return iosActiveScrollElement=null,void(iosTouchStartY=null);iosTouchStartY=t.touches[0]?.clientY??null,iosActiveScrollElement=null;for(const t of iosScrollableBlocks)if(t.contains(e)){const o=findScrollableParent(e,t);if(o){iosActiveScrollElement=o;break}}},touchMoveHandler=t=>{const e=t.touches[0];if(!e||t.touches.length===2||(t=>{if(!(t&&t instanceof HTMLElement))return!1;const e=t.ownerDocument?.defaultView?.getSelection();return!(!e||e.isCollapsed||!e.containsNode(t,!0))||'selectionStart'in t&&'selectionEnd'in t&&Number(t.selectionStart)<Number(t.selectionEnd)&&t.ownerDocument?.activeElement===t})(t.target))return;if(!t.cancelable)return;if(!iosActiveScrollElement||iosTouchStartY===null)return void t.preventDefault();const o=e.clientY-Number(iosTouchStartY);(iosActiveScrollElement.scrollTop<=0&&o>0||iosActiveScrollElement.scrollTop+iosActiveScrollElement.clientHeight>=iosActiveScrollElement.scrollHeight&&o<0)&&t.preventDefault()},document.addEventListener('touchstart',touchStartHandler,TOUCH_EVENT_OPTIONS),document.addEventListener('touchmove',touchMoveHandler,TOUCH_EVENT_OPTIONS))),setScrollLockCount(e+1)})(getDomTargets.getDomTargets(o)[0]),()=>{(()=>{iosScrollableBlocks.pop();const t=getScrollLockCount();const e=Math.max(0,t-1);setScrollLockCount(e),e===0&&(resetScrollLockStyles(),touchStartHandler&&(document.removeEventListener('touchstart',touchStartHandler,TOUCH_EVENT_OPTIONS),touchStartHandler=null),touchMoveHandler&&(document.removeEventListener('touchmove',touchMoveHandler,TOUCH_EVENT_OPTIONS),touchMoveHandler=null),iosActiveScrollElement=null,iosTouchStartY=null)})()}):((()=>{const t=getScrollLockCount();t===0&&applyScrollLockStyles(),setScrollLockCount(t+1)})(),()=>{(()=>{const t=getScrollLockCount();if(t<=0)return;const e=t-1;setScrollLockCount(e),e===0&&resetScrollLockStyles()})()})}),[o,r,e])};
 //# sourceMappingURL=useScrollLock.js.map

package/hooks/useScrollLock.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useScrollLock.js","sources":["../../../src/hooks/useScrollLock.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport type { Nullable } from 'shared/types'\n\ntype ScrollLockParams = {\n /*\n Блокировать скролл.\n /\n locked: boolean\n /\n Контейнер, в котором разрешена прокрутка на iOS при заблокированном скролле страницы.\n */\n iosAllowedScrollContainer?: HTMLElement\n}\n\nconst TOUCH_EVENT_OPTIONS = { capture: true, passive: false }\nconst DATA_SCROLL_LOCK_COUNT = 'scrollLockCount'\nconst DATA_PREV_OVERFLOW = 'prevOverflow'\nconst DATA_PREV_PADDING_RIGHT = 'prevPaddingRight'\n\nconst supportsScrollbarGutter =\n typeof CSS !== 'undefined' && typeof CSS.supports === 'function' && CSS.supports('scrollbar-gutter: stable')\nconst isIosDevice =\n typeof window !== 'undefined' &&\n window.navigator?.userAgent &&\n (/iP(ad\|hone\|od)/.test(window.navigator.userAgent) \|\|\n (window.navigator.userAgent.includes('Macintosh') && window.navigator.maxTouchPoints > 1))\n\nconst iosScrollableBlocks: HTMLElement[] = []\nlet iosActiveScrollElement: Nullable<HTMLElement> = null\nlet iosTouchStartY: Nullable<number> = null\nlet touchStartHandler: Nullable<(event: TouchEvent) => void> = null\nlet touchMoveHandler: Nullable<(event: TouchEvent) => void> = null\n\nfunction getScrollLockCount(): number {\n return Number(document.documentElement.dataset[DATA_SCROLL_LOCK_COUNT] \|\| 0)\n}\n\nfunction setScrollLockCount(count: number) {\n document.documentElement.dataset[DATA_SCROLL_LOCK_COUNT] = count.toString()\n}\n\nfunction applyScrollLockStyles() {\n const root = document.documentElement\n root.dataset[DATA_PREV_OVERFLOW] = root.style.overflow \|\| ''\n\n if (supportsScrollbarGutter && !isIosDevice) {\n root.style.scrollbarGutter = 'stable'\n } else {\n const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth\n root.dataset[DATA_PREV_PADDING_RIGHT] = root.style.paddingRight \|\| ''\n if (scrollbarWidth > 0) {\n const currentPaddingRight = parseInt(window.getComputedStyle(root).paddingRight \|\| '0', 10)\n root.style.paddingRight = `${currentPaddingRight + scrollbarWidth}px`\n }\n }\n root.style.overflow = 'hidden'\n}\n\nfunction resetScrollLockStyles() {\n const root = document.documentElement\n root.style.overflow = root.dataset[DATA_PREV_OVERFLOW] \|\| ''\n root.style.paddingRight = root.dataset[DATA_PREV_PADDING_RIGHT] \|\| ''\n delete root.dataset[DATA_PREV_OVERFLOW]\n delete root.dataset[DATA_PREV_PADDING_RIGHT]\n}\n\nfunction lockScroll() {\n const count = getScrollLockCount()\n if (count === 0) {\n applyScrollLockStyles()\n }\n setScrollLockCount(count + 1)\n}\n\nfunction unlockScroll() {\n const currentCount = getScrollLockCount()\n if (currentCount <= 0) {\n return\n }\n\n const nextCount = currentCount - 1\n setScrollLockCount(nextCount)\n if (nextCount === 0) {\n resetScrollLockStyles()\n }\n}\n\nfunction isScrollable(element: HTMLElement): boolean {\n const style = getComputedStyle(element)\n const overflowY = style.overflowY === 'auto' \|\| style.overflowY === 'scroll'\n\n return overflowY && element.scrollHeight > element.clientHeight\n}\n\nfunction findScrollableParent(startElement: HTMLElement, root: HTMLElement): Nullable<HTMLElement> {\n let element: Nullable<HTMLElement> = startElement\n\n while (element && element !== root.parentElement) {\n if (isScrollable(element)) {\n return element\n }\n\n element = element.parentElement\n }\n\n if (isScrollable(root)) {\n return root\n }\n\n return null\n}\n\nfunction isTouchMoveAllowed(target: Nullable<EventTarget>): boolean {\n if (!target \|\| !(target instanceof HTMLElement)) {\n return false\n }\n\n const selection = target.ownerDocument?.defaultView?.getSelection()\n if (selection && !selection.isCollapsed && selection.containsNode(target, true)) {\n return true\n }\n\n if (\n 'selectionStart' in target &&\n 'selectionEnd' in target &&\n Number(target.selectionStart) < Number(target.selectionEnd) &&\n target.ownerDocument?.activeElement === target\n ) {\n return true\n }\n\n return false\n}\n\nfunction addIOSEvents() {\n if (touchMoveHandler \|\| touchStartHandler) {\n return\n }\n\n touchStartHandler = (event: TouchEvent) => {\n const target = event.target\n if (!(target instanceof HTMLElement)) {\n iosActiveScrollElement = null\n iosTouchStartY = null\n\n return\n }\n\n iosTouchStartY = event.touches[0]?.clientY ?? null\n iosActiveScrollElement = null\n for (const block of iosScrollableBlocks) {\n if (block.contains(target)) {\n const scrollElement = findScrollableParent(target, block)\n if (scrollElement) {\n iosActiveScrollElement = scrollElement\n break\n }\n }\n }\n }\n\n touchMoveHandler = (event: TouchEvent) => {\n const touch = event.touches[0]\n if (!touch \|\| event.touches.length === 2 \|\| isTouchMoveAllowed(event.target)) {\n return\n }\n\n if (!event.cancelable) {\n return\n }\n\n if (!iosActiveScrollElement \|\| iosTouchStartY === null) {\n event.preventDefault()\n\n return\n }\n\n const currentY = touch.clientY\n const deltaY = currentY - Number(iosTouchStartY)\n const atTop = iosActiveScrollElement.scrollTop <= 0\n const atBottom =\n iosActiveScrollElement.scrollTop + iosActiveScrollElement.clientHeight >= iosActiveScrollElement.scrollHeight\n if ((atTop && deltaY > 0) \|\| (atBottom && deltaY < 0)) {\n event.preventDefault()\n }\n }\n\n document.addEventListener('touchstart', touchStartHandler, TOUCH_EVENT_OPTIONS)\n document.addEventListener('touchmove', touchMoveHandler, TOUCH_EVENT_OPTIONS)\n}\n\nfunction removeIOSEvents() {\n if (touchStartHandler) {\n document.removeEventListener('touchstart', touchStartHandler, TOUCH_EVENT_OPTIONS)\n touchStartHandler = null\n }\n if (touchMoveHandler) {\n document.removeEventListener('touchmove', touchMoveHandler, TOUCH_EVENT_OPTIONS)\n touchMoveHandler = null\n }\n iosActiveScrollElement = null\n iosTouchStartY = null\n}\n\nfunction lockScrollIOS(scrollableContainer: HTMLElement) {\n iosScrollableBlocks.push(scrollableContainer)\n const count = getScrollLockCount()\n if (count === 0) {\n applyScrollLockStyles()\n addIOSEvents()\n }\n setScrollLockCount(count + 1)\n}\n\nfunction unlockScrollIOS() {\n iosScrollableBlocks.pop()\n const count = getScrollLockCount()\n const nexCount = Math.max(0, count - 1)\n setScrollLockCount(nexCount)\n if (nexCount === 0) {\n resetScrollLockStyles()\n removeIOSEvents()\n }\n}\n\nfunction useScrollLock(params: ScrollLockParams) {\n const { locked, iosAllowedScrollContainer = document.documentElement } = params\n\n useEffect(() => {\n if (!locked) {\n return\n }\n\n if (isIosDevice) {\n lockScrollIOS(iosAllowedScrollContainer)\n\n return () => {\n unlockScrollIOS()\n }\n }\n\n lockScroll()\n\n return () => {\n unlockScroll()\n }\n }, [iosAllowedScrollContainer, locked])\n}\n\nexport { useScrollLock }\n"],"names":["TOUCH_EVENT_OPTIONS","capture","passive","supportsScrollbarGutter","CSS","supports","isIosDevice","window","navigator","userAgent","test","includes","maxTouchPoints","iosScrollableBlocks","iosActiveScrollElement","iosTouchStartY","touchStartHandler","touchMoveHandler","getScrollLockCount","Number","document","documentElement","dataset","setScrollLockCount","count","toString","applyScrollLockStyles","root","style","overflow","scrollbarGutter","scrollbarWidth","innerWidth","clientWidth","paddingRight","currentPaddingRight","parseInt","getComputedStyle","resetScrollLockStyles","isScrollable","element","overflowY","scrollHeight","clientHeight","findScrollableParent","startElement","parentElement","params","locked","iosAllowedScrollContainer","useEffect","scrollableContainer","push","event","target","HTMLElement","touches","clientY","block","contains","scrollElement","touch","length","selection","ownerDocument","defaultView","getSelection","isCollapsed","containsNode","selectionStart","selectionEnd","activeElement","isTouchMoveAllowed","cancelable","preventDefault","deltaY","scrollTop","addEventListener","lockScrollIOS","pop","nexCount","Math","max","removeEventListener","unlockScrollIOS","lockScroll","currentCount","nextCount","unlockScroll"],"mappings":"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"}
1	+ {"version":3,"file":"useScrollLock.js","sources":["../../../src/hooks/useScrollLock.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport type { DomTarget, Nullable } from 'shared/types'\nimport { getDomTargets } from 'shared/utils/getDomTargets'\n\ntype ScrollLockParams = {\n /*\n Блокировать скролл.\n /\n locked: boolean\n /\n Контейнер, в котором разрешена прокрутка на iOS при заблокированном скролле страницы.\n /\n iosAllowedScrollContainer?: DomTarget\n /\n Элемент, на котором блокируется скролл.\n \n @default 'document.documentElement'\n */\n target?: DomTarget\n}\n\nconst TOUCH_EVENT_OPTIONS = { capture: true, passive: false }\nconst DATA_SCROLL_LOCK_COUNT = 'scrollLockCount'\nconst DATA_PREV_OVERFLOW = 'prevOverflow'\nconst DATA_PREV_PADDING_RIGHT = 'prevPaddingRight'\n\nconst supportsScrollbarGutter =\n typeof CSS !== 'undefined' && typeof CSS.supports === 'function' && CSS.supports('scrollbar-gutter: stable')\nconst isIosDevice =\n typeof window !== 'undefined' &&\n window.navigator?.userAgent &&\n (/iP(ad\|hone\|od)/.test(window.navigator.userAgent) \|\|\n (window.navigator.userAgent.includes('Macintosh') && window.navigator.maxTouchPoints > 1))\n\nconst iosScrollableBlocks: HTMLElement[] = []\nlet iosActiveScrollElement: Nullable<HTMLElement> = null\nlet iosTouchStartY: Nullable<number> = null\nlet touchStartHandler: Nullable<(event: TouchEvent) => void> = null\nlet touchMoveHandler: Nullable<(event: TouchEvent) => void> = null\n\nfunction getScrollLockCount(): number {\n return Number(document.documentElement.dataset[DATA_SCROLL_LOCK_COUNT] \|\| 0)\n}\n\nfunction setScrollLockCount(count: number) {\n document.documentElement.dataset[DATA_SCROLL_LOCK_COUNT] = count.toString()\n}\n\nfunction applyScrollLockStyles() {\n const root = document.documentElement\n root.dataset[DATA_PREV_OVERFLOW] = root.style.overflow \|\| ''\n\n if (supportsScrollbarGutter && !isIosDevice) {\n root.style.scrollbarGutter = 'stable'\n } else {\n const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth\n root.dataset[DATA_PREV_PADDING_RIGHT] = root.style.paddingRight \|\| ''\n if (scrollbarWidth > 0) {\n const currentPaddingRight = parseFloat(getComputedStyle(root).paddingRight) \|\| 0\n root.style.paddingRight = `${currentPaddingRight + scrollbarWidth}px`\n }\n }\n root.style.overflow = 'hidden'\n}\n\nfunction resetScrollLockStyles() {\n const root = document.documentElement\n root.style.overflow = root.dataset[DATA_PREV_OVERFLOW] \|\| ''\n root.style.paddingRight = root.dataset[DATA_PREV_PADDING_RIGHT] \|\| ''\n delete root.dataset[DATA_PREV_OVERFLOW]\n delete root.dataset[DATA_PREV_PADDING_RIGHT]\n}\n\nfunction lockScroll() {\n const count = getScrollLockCount()\n if (count === 0) {\n applyScrollLockStyles()\n }\n setScrollLockCount(count + 1)\n}\n\nfunction unlockScroll() {\n const currentCount = getScrollLockCount()\n if (currentCount <= 0) {\n return\n }\n\n const nextCount = currentCount - 1\n setScrollLockCount(nextCount)\n if (nextCount === 0) {\n resetScrollLockStyles()\n }\n}\n\nfunction isScrollable(element: HTMLElement): boolean {\n const style = getComputedStyle(element)\n const overflowY = style.overflowY === 'auto' \|\| style.overflowY === 'scroll'\n\n return overflowY && element.scrollHeight > element.clientHeight\n}\n\nfunction findScrollableParent(startElement: HTMLElement, root: HTMLElement): Nullable<HTMLElement> {\n let element: Nullable<HTMLElement> = startElement\n\n while (element && element !== root.parentElement) {\n if (isScrollable(element)) {\n return element\n }\n\n element = element.parentElement\n }\n\n if (isScrollable(root)) {\n return root\n }\n\n return null\n}\n\nfunction isTouchMoveAllowed(target: Nullable<EventTarget>): boolean {\n if (!target \|\| !(target instanceof HTMLElement)) {\n return false\n }\n\n const selection = target.ownerDocument?.defaultView?.getSelection()\n if (selection && !selection.isCollapsed && selection.containsNode(target, true)) {\n return true\n }\n\n if (\n 'selectionStart' in target &&\n 'selectionEnd' in target &&\n Number(target.selectionStart) < Number(target.selectionEnd) &&\n target.ownerDocument?.activeElement === target\n ) {\n return true\n }\n\n return false\n}\n\nfunction addIOSEvents() {\n if (touchMoveHandler \|\| touchStartHandler) {\n return\n }\n\n touchStartHandler = (event: TouchEvent) => {\n const target = event.target\n if (!(target instanceof HTMLElement)) {\n iosActiveScrollElement = null\n iosTouchStartY = null\n\n return\n }\n\n iosTouchStartY = event.touches[0]?.clientY ?? null\n iosActiveScrollElement = null\n for (const block of iosScrollableBlocks) {\n if (block.contains(target)) {\n const scrollElement = findScrollableParent(target, block)\n if (scrollElement) {\n iosActiveScrollElement = scrollElement\n break\n }\n }\n }\n }\n\n touchMoveHandler = (event: TouchEvent) => {\n const touch = event.touches[0]\n if (!touch \|\| event.touches.length === 2 \|\| isTouchMoveAllowed(event.target)) {\n return\n }\n\n if (!event.cancelable) {\n return\n }\n\n if (!iosActiveScrollElement \|\| iosTouchStartY === null) {\n event.preventDefault()\n\n return\n }\n\n const currentY = touch.clientY\n const deltaY = currentY - Number(iosTouchStartY)\n const atTop = iosActiveScrollElement.scrollTop <= 0\n const atBottom =\n iosActiveScrollElement.scrollTop + iosActiveScrollElement.clientHeight >= iosActiveScrollElement.scrollHeight\n if ((atTop && deltaY > 0) \|\| (atBottom && deltaY < 0)) {\n event.preventDefault()\n }\n }\n\n document.addEventListener('touchstart', touchStartHandler, TOUCH_EVENT_OPTIONS)\n document.addEventListener('touchmove', touchMoveHandler, TOUCH_EVENT_OPTIONS)\n}\n\nfunction removeIOSEvents() {\n if (touchStartHandler) {\n document.removeEventListener('touchstart', touchStartHandler, TOUCH_EVENT_OPTIONS)\n touchStartHandler = null\n }\n if (touchMoveHandler) {\n document.removeEventListener('touchmove', touchMoveHandler, TOUCH_EVENT_OPTIONS)\n touchMoveHandler = null\n }\n iosActiveScrollElement = null\n iosTouchStartY = null\n}\n\nfunction lockScrollIOS(scrollableContainer: HTMLElement) {\n iosScrollableBlocks.push(scrollableContainer)\n const count = getScrollLockCount()\n if (count === 0) {\n applyScrollLockStyles()\n addIOSEvents()\n }\n setScrollLockCount(count + 1)\n}\n\nfunction unlockScrollIOS() {\n iosScrollableBlocks.pop()\n const count = getScrollLockCount()\n const nexCount = Math.max(0, count - 1)\n setScrollLockCount(nexCount)\n if (nexCount === 0) {\n resetScrollLockStyles()\n removeIOSEvents()\n }\n}\n\nfunction lockTargetScroll(element: HTMLElement) {\n const style = getComputedStyle(element)\n if (element.dataset[DATA_PREV_OVERFLOW] === undefined) {\n element.dataset[DATA_PREV_OVERFLOW] = style.overflow \|\| ''\n }\n if (element.dataset[DATA_PREV_PADDING_RIGHT] === undefined) {\n element.dataset[DATA_PREV_PADDING_RIGHT] = style.paddingRight \|\| ''\n }\n\n const borderLeft = parseFloat(style.borderLeftWidth) \|\| 0\n const borderRight = parseFloat(style.borderRightWidth) \|\| 0\n const borderWidth = borderLeft + borderRight\n const originalOverflow = style.overflow\n element.style.overflow = 'scroll'\n const scrollbarWidth = element.offsetWidth - element.clientWidth - borderWidth\n element.style.overflow = originalOverflow\n if (supportsScrollbarGutter) {\n element.style.scrollbarGutter = 'stable'\n } else if (scrollbarWidth > 0) {\n const currentPaddingRight = parseFloat(element.dataset[DATA_PREV_PADDING_RIGHT]) \|\| 0\n element.style.paddingRight = `${currentPaddingRight + scrollbarWidth}px`\n }\n element.style.overflow = 'hidden'\n}\n\nfunction unlockTargetScroll(element: HTMLElement) {\n if (element.dataset[DATA_PREV_OVERFLOW] !== undefined) {\n element.style.overflow = element.dataset[DATA_PREV_OVERFLOW]\n }\n if (element.dataset[DATA_PREV_PADDING_RIGHT] !== undefined) {\n element.style.paddingRight = element.dataset[DATA_PREV_PADDING_RIGHT]\n }\n delete element.dataset[DATA_PREV_OVERFLOW]\n delete element.dataset[DATA_PREV_PADDING_RIGHT]\n if (supportsScrollbarGutter) {\n element.style.scrollbarGutter = ''\n }\n}\n\nfunction useScrollLock(params: ScrollLockParams) {\n const { locked, iosAllowedScrollContainer = document.documentElement, target } = params\n\n const isRootTarget = target === undefined \|\| target === document.documentElement \|\| target === document.body\n\n useEffect(() => {\n if (!target \|\| isRootTarget) {\n return\n }\n\n const domTarget = getDomTargets(target)[0]\n\n if (locked) {\n lockTargetScroll(domTarget)\n } else {\n if (domTarget.dataset[DATA_PREV_OVERFLOW] !== undefined) {\n unlockTargetScroll(domTarget)\n }\n }\n\n return () => {\n unlockTargetScroll(domTarget)\n }\n }, [target, locked, isRootTarget])\n\n useEffect(() => {\n if (!locked \|\| !isRootTarget) {\n return\n }\n\n if (isIosDevice) {\n const domContainer = getDomTargets(iosAllowedScrollContainer)[0]\n lockScrollIOS(domContainer)\n\n return () => {\n unlockScrollIOS()\n }\n }\n\n lockScroll()\n\n return () => {\n unlockScroll()\n }\n }, [iosAllowedScrollContainer, isRootTarget, locked])\n}\n\nexport { useScrollLock }\n"],"names":["TOUCH_EVENT_OPTIONS","capture","passive","supportsScrollbarGutter","CSS","supports","isIosDevice","window","navigator","userAgent","test","includes","maxTouchPoints","iosScrollableBlocks","iosActiveScrollElement","iosTouchStartY","touchStartHandler","touchMoveHandler","getScrollLockCount","Number","document","documentElement","dataset","setScrollLockCount","count","toString","applyScrollLockStyles","root","style","overflow","scrollbarGutter","scrollbarWidth","innerWidth","clientWidth","paddingRight","currentPaddingRight","parseFloat","getComputedStyle","resetScrollLockStyles","isScrollable","element","overflowY","scrollHeight","clientHeight","findScrollableParent","startElement","parentElement","unlockTargetScroll","undefined","params","locked","iosAllowedScrollContainer","target","isRootTarget","body","useEffect","domTarget","getDomTargets","borderWidth","borderLeftWidth","borderRightWidth","originalOverflow","offsetWidth","lockTargetScroll","scrollableContainer","push","event","HTMLElement","touches","clientY","block","contains","scrollElement","touch","length","selection","ownerDocument","defaultView","getSelection","isCollapsed","containsNode","selectionStart","selectionEnd","activeElement","isTouchMoveAllowed","cancelable","preventDefault","deltaY","scrollTop","addEventListener","lockScrollIOS","pop","nexCount","Math","max","removeEventListener","unlockScrollIOS","lockScroll","currentCount","nextCount","unlockScroll"],"mappings":"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"}

package/hooks/useScrollLock.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{useEffect}from'react';const TOUCH_EVENT_OPTIONS={capture:!0,passive:!1};const supportsScrollbarGutter=typeof CSS!='undefined'&&typeof CSS.supports=='function'&&CSS.supports('scrollbar-gutter: stable');const isIosDevice=typeof window!='undefined'&&window.navigator?.userAgent&&(/iP(ad|hone|od)/.test(window.navigator.userAgent)||window.navigator.userAgent.includes('Macintosh')&&window.navigator.maxTouchPoints>1);const iosScrollableBlocks=[];let iosActiveScrollElement=null;let iosTouchStartY=null;let touchStartHandler=null;let touchMoveHandler=null;function getScrollLockCount(){return Number(document.documentElement.dataset.scrollLockCount||0)}function setScrollLockCount(t){document.documentElement.dataset.scrollLockCount=t.toString()}function applyScrollLockStyles(){const t=document.documentElement;if(t.dataset.prevOverflow=t.style.overflow||'',supportsScrollbarGutter&&!isIosDevice)t.style.scrollbarGutter='stable';else{const e=window.innerWidth-document.documentElement.clientWidth;if(t.dataset.prevPaddingRight=t.style.paddingRight||'',e>0){const o=parseInt(window.getComputedStyle(t).paddingRight||'0',10);t.style.paddingRight=`${o+e}px`}}t.style.overflow='hidden'}function resetScrollLockStyles(){const t=document.documentElement;t.style.overflow=t.dataset.prevOverflow||'',t.style.paddingRight=t.dataset.prevPaddingRight||'',delete t.dataset.prevOverflow,delete t.dataset.prevPaddingRight}function isScrollable(t){const e=getComputedStyle(t);return(e.overflowY==='auto'||e.overflowY==='scroll')&&t.scrollHeight>t.clientHeight}function findScrollableParent(t,e){let o=t;for(;o&&o!==e.parentElement;){if(isScrollable(o))return o;o=o.parentElement}return isScrollable(e)?e:null}function useScrollLock(t){const{locked:e,iosAllowedScrollContainer:o=document.documentElement}=t;useEffect((()=>{if(e)return isIosDevice?((t=>{iosScrollableBlocks.push(t);const e=getScrollLockCount();e===0&&(applyScrollLockStyles(),touchMoveHandler||touchStartHandler||(touchStartHandler=t=>{const e=t.target;if(!(e instanceof HTMLElement))return iosActiveScrollElement=null,void(iosTouchStartY=null);iosTouchStartY=t.touches[0]?.clientY??null,iosActiveScrollElement=null;for(const t of iosScrollableBlocks)if(t.contains(e)){const o=findScrollableParent(e,t);if(o){iosActiveScrollElement=o;break}}},touchMoveHandler=t=>{const e=t.touches[0];if(!e||t.touches.length===2||(t=>{if(!(t&&t instanceof HTMLElement))return!1;const e=t.ownerDocument?.defaultView?.getSelection();return!(!e||e.isCollapsed||!e.containsNode(t,!0))||'selectionStart'in t&&'selectionEnd'in t&&Number(t.selectionStart)<Number(t.selectionEnd)&&t.ownerDocument?.activeElement===t})(t.target))return;if(!t.cancelable)return;if(!iosActiveScrollElement||iosTouchStartY===null)return void t.preventDefault();const o=e.clientY-Number(iosTouchStartY);(iosActiveScrollElement.scrollTop<=0&&o>0||iosActiveScrollElement.scrollTop+iosActiveScrollElement.clientHeight>=iosActiveScrollElement.scrollHeight&&o<0)&&t.preventDefault()},document.addEventListener('touchstart',touchStartHandler,TOUCH_EVENT_OPTIONS),document.addEventListener('touchmove',touchMoveHandler,TOUCH_EVENT_OPTIONS))),setScrollLockCount(e+1)})(o),()=>{(()=>{iosScrollableBlocks.pop();const t=getScrollLockCount();const e=Math.max(0,t-1);setScrollLockCount(e),e===0&&(resetScrollLockStyles(),touchStartHandler&&(document.removeEventListener('touchstart',touchStartHandler,TOUCH_EVENT_OPTIONS),touchStartHandler=null),touchMoveHandler&&(document.removeEventListener('touchmove',touchMoveHandler,TOUCH_EVENT_OPTIONS),touchMoveHandler=null),iosActiveScrollElement=null,iosTouchStartY=null)})()}):((()=>{const t=getScrollLockCount();t===0&&applyScrollLockStyles(),setScrollLockCount(t+1)})(),()=>{(()=>{const t=getScrollLockCount();if(t<=0)return;const e=t-1;setScrollLockCount(e),e===0&&resetScrollLockStyles()})()})}),[o,e])}export{useScrollLock};
+import{useEffect}from'react';import{getDomTargets}from'../shared/utils/getDomTargets.mjs';const TOUCH_EVENT_OPTIONS={capture:!0,passive:!1};const supportsScrollbarGutter=typeof CSS!='undefined'&&typeof CSS.supports=='function'&&CSS.supports('scrollbar-gutter: stable');const isIosDevice=typeof window!='undefined'&&window.navigator?.userAgent&&(/iP(ad|hone|od)/.test(window.navigator.userAgent)||window.navigator.userAgent.includes('Macintosh')&&window.navigator.maxTouchPoints>1);const iosScrollableBlocks=[];let iosActiveScrollElement=null;let iosTouchStartY=null;let touchStartHandler=null;let touchMoveHandler=null;function getScrollLockCount(){return Number(document.documentElement.dataset.scrollLockCount||0)}function setScrollLockCount(t){document.documentElement.dataset.scrollLockCount=t.toString()}function applyScrollLockStyles(){const t=document.documentElement;if(t.dataset.prevOverflow=t.style.overflow||'',supportsScrollbarGutter&&!isIosDevice)t.style.scrollbarGutter='stable';else{const e=window.innerWidth-document.documentElement.clientWidth;if(t.dataset.prevPaddingRight=t.style.paddingRight||'',e>0){const o=parseFloat(getComputedStyle(t).paddingRight)||0;t.style.paddingRight=`${o+e}px`}}t.style.overflow='hidden'}function resetScrollLockStyles(){const t=document.documentElement;t.style.overflow=t.dataset.prevOverflow||'',t.style.paddingRight=t.dataset.prevPaddingRight||'',delete t.dataset.prevOverflow,delete t.dataset.prevPaddingRight}function isScrollable(t){const e=getComputedStyle(t);return(e.overflowY==='auto'||e.overflowY==='scroll')&&t.scrollHeight>t.clientHeight}function findScrollableParent(t,e){let o=t;for(;o&&o!==e.parentElement;){if(isScrollable(o))return o;o=o.parentElement}return isScrollable(e)?e:null}function unlockTargetScroll(t){t.dataset.prevOverflow!==void 0&&(t.style.overflow=t.dataset.prevOverflow),t.dataset.prevPaddingRight!==void 0&&(t.style.paddingRight=t.dataset.prevPaddingRight),delete t.dataset.prevOverflow,delete t.dataset.prevPaddingRight,supportsScrollbarGutter&&(t.style.scrollbarGutter='')}function useScrollLock(t){const{locked:e,iosAllowedScrollContainer:o=document.documentElement,target:l}=t;const r=l===void 0||l===document.documentElement||l===document.body;useEffect((()=>{if(!l||r)return;const t=getDomTargets(l)[0];return e?(t=>{const e=getComputedStyle(t);t.dataset.prevOverflow===void 0&&(t.dataset.prevOverflow=e.overflow||''),t.dataset.prevPaddingRight===void 0&&(t.dataset.prevPaddingRight=e.paddingRight||'');const o=(parseFloat(e.borderLeftWidth)||0)+(parseFloat(e.borderRightWidth)||0);const l=e.overflow;t.style.overflow='scroll';const r=t.offsetWidth-t.clientWidth-o;if(t.style.overflow=l,supportsScrollbarGutter)t.style.scrollbarGutter='stable';else if(r>0){const e=parseFloat(t.dataset.prevPaddingRight)||0;t.style.paddingRight=`${e+r}px`}t.style.overflow='hidden'})(t):t.dataset.prevOverflow!==void 0&&unlockTargetScroll(t),()=>{unlockTargetScroll(t)}}),[l,e,r]),useEffect((()=>{if(e&&r)return isIosDevice?((t=>{iosScrollableBlocks.push(t);const e=getScrollLockCount();e===0&&(applyScrollLockStyles(),touchMoveHandler||touchStartHandler||(touchStartHandler=t=>{const e=t.target;if(!(e instanceof HTMLElement))return iosActiveScrollElement=null,void(iosTouchStartY=null);iosTouchStartY=t.touches[0]?.clientY??null,iosActiveScrollElement=null;for(const t of iosScrollableBlocks)if(t.contains(e)){const o=findScrollableParent(e,t);if(o){iosActiveScrollElement=o;break}}},touchMoveHandler=t=>{const e=t.touches[0];if(!e||t.touches.length===2||(t=>{if(!(t&&t instanceof HTMLElement))return!1;const e=t.ownerDocument?.defaultView?.getSelection();return!(!e||e.isCollapsed||!e.containsNode(t,!0))||'selectionStart'in t&&'selectionEnd'in t&&Number(t.selectionStart)<Number(t.selectionEnd)&&t.ownerDocument?.activeElement===t})(t.target))return;if(!t.cancelable)return;if(!iosActiveScrollElement||iosTouchStartY===null)return void t.preventDefault();const o=e.clientY-Number(iosTouchStartY);(iosActiveScrollElement.scrollTop<=0&&o>0||iosActiveScrollElement.scrollTop+iosActiveScrollElement.clientHeight>=iosActiveScrollElement.scrollHeight&&o<0)&&t.preventDefault()},document.addEventListener('touchstart',touchStartHandler,TOUCH_EVENT_OPTIONS),document.addEventListener('touchmove',touchMoveHandler,TOUCH_EVENT_OPTIONS))),setScrollLockCount(e+1)})(getDomTargets(o)[0]),()=>{(()=>{iosScrollableBlocks.pop();const t=getScrollLockCount();const e=Math.max(0,t-1);setScrollLockCount(e),e===0&&(resetScrollLockStyles(),touchStartHandler&&(document.removeEventListener('touchstart',touchStartHandler,TOUCH_EVENT_OPTIONS),touchStartHandler=null),touchMoveHandler&&(document.removeEventListener('touchmove',touchMoveHandler,TOUCH_EVENT_OPTIONS),touchMoveHandler=null),iosActiveScrollElement=null,iosTouchStartY=null)})()}):((()=>{const t=getScrollLockCount();t===0&&applyScrollLockStyles(),setScrollLockCount(t+1)})(),()=>{(()=>{const t=getScrollLockCount();if(t<=0)return;const e=t-1;setScrollLockCount(e),e===0&&resetScrollLockStyles()})()})}),[o,r,e])}export{useScrollLock};
 //# sourceMappingURL=useScrollLock.mjs.map

package/hooks/useScrollLock.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useScrollLock.mjs","sources":["../../../src/hooks/useScrollLock.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport type { Nullable } from 'shared/types'\n\ntype ScrollLockParams = {\n /*\n Блокировать скролл.\n /\n locked: boolean\n /\n Контейнер, в котором разрешена прокрутка на iOS при заблокированном скролле страницы.\n */\n iosAllowedScrollContainer?: HTMLElement\n}\n\nconst TOUCH_EVENT_OPTIONS = { capture: true, passive: false }\nconst DATA_SCROLL_LOCK_COUNT = 'scrollLockCount'\nconst DATA_PREV_OVERFLOW = 'prevOverflow'\nconst DATA_PREV_PADDING_RIGHT = 'prevPaddingRight'\n\nconst supportsScrollbarGutter =\n typeof CSS !== 'undefined' && typeof CSS.supports === 'function' && CSS.supports('scrollbar-gutter: stable')\nconst isIosDevice =\n typeof window !== 'undefined' &&\n window.navigator?.userAgent &&\n (/iP(ad\|hone\|od)/.test(window.navigator.userAgent) \|\|\n (window.navigator.userAgent.includes('Macintosh') && window.navigator.maxTouchPoints > 1))\n\nconst iosScrollableBlocks: HTMLElement[] = []\nlet iosActiveScrollElement: Nullable<HTMLElement> = null\nlet iosTouchStartY: Nullable<number> = null\nlet touchStartHandler: Nullable<(event: TouchEvent) => void> = null\nlet touchMoveHandler: Nullable<(event: TouchEvent) => void> = null\n\nfunction getScrollLockCount(): number {\n return Number(document.documentElement.dataset[DATA_SCROLL_LOCK_COUNT] \|\| 0)\n}\n\nfunction setScrollLockCount(count: number) {\n document.documentElement.dataset[DATA_SCROLL_LOCK_COUNT] = count.toString()\n}\n\nfunction applyScrollLockStyles() {\n const root = document.documentElement\n root.dataset[DATA_PREV_OVERFLOW] = root.style.overflow \|\| ''\n\n if (supportsScrollbarGutter && !isIosDevice) {\n root.style.scrollbarGutter = 'stable'\n } else {\n const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth\n root.dataset[DATA_PREV_PADDING_RIGHT] = root.style.paddingRight \|\| ''\n if (scrollbarWidth > 0) {\n const currentPaddingRight = parseInt(window.getComputedStyle(root).paddingRight \|\| '0', 10)\n root.style.paddingRight = `${currentPaddingRight + scrollbarWidth}px`\n }\n }\n root.style.overflow = 'hidden'\n}\n\nfunction resetScrollLockStyles() {\n const root = document.documentElement\n root.style.overflow = root.dataset[DATA_PREV_OVERFLOW] \|\| ''\n root.style.paddingRight = root.dataset[DATA_PREV_PADDING_RIGHT] \|\| ''\n delete root.dataset[DATA_PREV_OVERFLOW]\n delete root.dataset[DATA_PREV_PADDING_RIGHT]\n}\n\nfunction lockScroll() {\n const count = getScrollLockCount()\n if (count === 0) {\n applyScrollLockStyles()\n }\n setScrollLockCount(count + 1)\n}\n\nfunction unlockScroll() {\n const currentCount = getScrollLockCount()\n if (currentCount <= 0) {\n return\n }\n\n const nextCount = currentCount - 1\n setScrollLockCount(nextCount)\n if (nextCount === 0) {\n resetScrollLockStyles()\n }\n}\n\nfunction isScrollable(element: HTMLElement): boolean {\n const style = getComputedStyle(element)\n const overflowY = style.overflowY === 'auto' \|\| style.overflowY === 'scroll'\n\n return overflowY && element.scrollHeight > element.clientHeight\n}\n\nfunction findScrollableParent(startElement: HTMLElement, root: HTMLElement): Nullable<HTMLElement> {\n let element: Nullable<HTMLElement> = startElement\n\n while (element && element !== root.parentElement) {\n if (isScrollable(element)) {\n return element\n }\n\n element = element.parentElement\n }\n\n if (isScrollable(root)) {\n return root\n }\n\n return null\n}\n\nfunction isTouchMoveAllowed(target: Nullable<EventTarget>): boolean {\n if (!target \|\| !(target instanceof HTMLElement)) {\n return false\n }\n\n const selection = target.ownerDocument?.defaultView?.getSelection()\n if (selection && !selection.isCollapsed && selection.containsNode(target, true)) {\n return true\n }\n\n if (\n 'selectionStart' in target &&\n 'selectionEnd' in target &&\n Number(target.selectionStart) < Number(target.selectionEnd) &&\n target.ownerDocument?.activeElement === target\n ) {\n return true\n }\n\n return false\n}\n\nfunction addIOSEvents() {\n if (touchMoveHandler \|\| touchStartHandler) {\n return\n }\n\n touchStartHandler = (event: TouchEvent) => {\n const target = event.target\n if (!(target instanceof HTMLElement)) {\n iosActiveScrollElement = null\n iosTouchStartY = null\n\n return\n }\n\n iosTouchStartY = event.touches[0]?.clientY ?? null\n iosActiveScrollElement = null\n for (const block of iosScrollableBlocks) {\n if (block.contains(target)) {\n const scrollElement = findScrollableParent(target, block)\n if (scrollElement) {\n iosActiveScrollElement = scrollElement\n break\n }\n }\n }\n }\n\n touchMoveHandler = (event: TouchEvent) => {\n const touch = event.touches[0]\n if (!touch \|\| event.touches.length === 2 \|\| isTouchMoveAllowed(event.target)) {\n return\n }\n\n if (!event.cancelable) {\n return\n }\n\n if (!iosActiveScrollElement \|\| iosTouchStartY === null) {\n event.preventDefault()\n\n return\n }\n\n const currentY = touch.clientY\n const deltaY = currentY - Number(iosTouchStartY)\n const atTop = iosActiveScrollElement.scrollTop <= 0\n const atBottom =\n iosActiveScrollElement.scrollTop + iosActiveScrollElement.clientHeight >= iosActiveScrollElement.scrollHeight\n if ((atTop && deltaY > 0) \|\| (atBottom && deltaY < 0)) {\n event.preventDefault()\n }\n }\n\n document.addEventListener('touchstart', touchStartHandler, TOUCH_EVENT_OPTIONS)\n document.addEventListener('touchmove', touchMoveHandler, TOUCH_EVENT_OPTIONS)\n}\n\nfunction removeIOSEvents() {\n if (touchStartHandler) {\n document.removeEventListener('touchstart', touchStartHandler, TOUCH_EVENT_OPTIONS)\n touchStartHandler = null\n }\n if (touchMoveHandler) {\n document.removeEventListener('touchmove', touchMoveHandler, TOUCH_EVENT_OPTIONS)\n touchMoveHandler = null\n }\n iosActiveScrollElement = null\n iosTouchStartY = null\n}\n\nfunction lockScrollIOS(scrollableContainer: HTMLElement) {\n iosScrollableBlocks.push(scrollableContainer)\n const count = getScrollLockCount()\n if (count === 0) {\n applyScrollLockStyles()\n addIOSEvents()\n }\n setScrollLockCount(count + 1)\n}\n\nfunction unlockScrollIOS() {\n iosScrollableBlocks.pop()\n const count = getScrollLockCount()\n const nexCount = Math.max(0, count - 1)\n setScrollLockCount(nexCount)\n if (nexCount === 0) {\n resetScrollLockStyles()\n removeIOSEvents()\n }\n}\n\nfunction useScrollLock(params: ScrollLockParams) {\n const { locked, iosAllowedScrollContainer = document.documentElement } = params\n\n useEffect(() => {\n if (!locked) {\n return\n }\n\n if (isIosDevice) {\n lockScrollIOS(iosAllowedScrollContainer)\n\n return () => {\n unlockScrollIOS()\n }\n }\n\n lockScroll()\n\n return () => {\n unlockScroll()\n }\n }, [iosAllowedScrollContainer, locked])\n}\n\nexport { useScrollLock }\n"],"names":["TOUCH_EVENT_OPTIONS","capture","passive","supportsScrollbarGutter","CSS","supports","isIosDevice","window","navigator","userAgent","test","includes","maxTouchPoints","iosScrollableBlocks","iosActiveScrollElement","iosTouchStartY","touchStartHandler","touchMoveHandler","getScrollLockCount","Number","document","documentElement","dataset","setScrollLockCount","count","toString","applyScrollLockStyles","root","style","overflow","scrollbarGutter","scrollbarWidth","innerWidth","clientWidth","paddingRight","currentPaddingRight","parseInt","getComputedStyle","resetScrollLockStyles","isScrollable","element","overflowY","scrollHeight","clientHeight","findScrollableParent","startElement","parentElement","useScrollLock","params","locked","iosAllowedScrollContainer","useEffect","scrollableContainer","push","event","target","HTMLElement","touches","clientY","block","contains","scrollElement","touch","length","selection","ownerDocument","defaultView","getSelection","isCollapsed","containsNode","selectionStart","selectionEnd","activeElement","isTouchMoveAllowed","cancelable","preventDefault","deltaY","scrollTop","addEventListener","lockScrollIOS","pop","nexCount","Math","max","removeEventListener","unlockScrollIOS","lockScroll","currentCount","nextCount","unlockScroll"],"mappings":"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"}
1	+ {"version":3,"file":"useScrollLock.mjs","sources":["../../../src/hooks/useScrollLock.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport type { DomTarget, Nullable } from 'shared/types'\nimport { getDomTargets } from 'shared/utils/getDomTargets'\n\ntype ScrollLockParams = {\n /*\n Блокировать скролл.\n /\n locked: boolean\n /\n Контейнер, в котором разрешена прокрутка на iOS при заблокированном скролле страницы.\n /\n iosAllowedScrollContainer?: DomTarget\n /\n Элемент, на котором блокируется скролл.\n \n @default 'document.documentElement'\n */\n target?: DomTarget\n}\n\nconst TOUCH_EVENT_OPTIONS = { capture: true, passive: false }\nconst DATA_SCROLL_LOCK_COUNT = 'scrollLockCount'\nconst DATA_PREV_OVERFLOW = 'prevOverflow'\nconst DATA_PREV_PADDING_RIGHT = 'prevPaddingRight'\n\nconst supportsScrollbarGutter =\n typeof CSS !== 'undefined' && typeof CSS.supports === 'function' && CSS.supports('scrollbar-gutter: stable')\nconst isIosDevice =\n typeof window !== 'undefined' &&\n window.navigator?.userAgent &&\n (/iP(ad\|hone\|od)/.test(window.navigator.userAgent) \|\|\n (window.navigator.userAgent.includes('Macintosh') && window.navigator.maxTouchPoints > 1))\n\nconst iosScrollableBlocks: HTMLElement[] = []\nlet iosActiveScrollElement: Nullable<HTMLElement> = null\nlet iosTouchStartY: Nullable<number> = null\nlet touchStartHandler: Nullable<(event: TouchEvent) => void> = null\nlet touchMoveHandler: Nullable<(event: TouchEvent) => void> = null\n\nfunction getScrollLockCount(): number {\n return Number(document.documentElement.dataset[DATA_SCROLL_LOCK_COUNT] \|\| 0)\n}\n\nfunction setScrollLockCount(count: number) {\n document.documentElement.dataset[DATA_SCROLL_LOCK_COUNT] = count.toString()\n}\n\nfunction applyScrollLockStyles() {\n const root = document.documentElement\n root.dataset[DATA_PREV_OVERFLOW] = root.style.overflow \|\| ''\n\n if (supportsScrollbarGutter && !isIosDevice) {\n root.style.scrollbarGutter = 'stable'\n } else {\n const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth\n root.dataset[DATA_PREV_PADDING_RIGHT] = root.style.paddingRight \|\| ''\n if (scrollbarWidth > 0) {\n const currentPaddingRight = parseFloat(getComputedStyle(root).paddingRight) \|\| 0\n root.style.paddingRight = `${currentPaddingRight + scrollbarWidth}px`\n }\n }\n root.style.overflow = 'hidden'\n}\n\nfunction resetScrollLockStyles() {\n const root = document.documentElement\n root.style.overflow = root.dataset[DATA_PREV_OVERFLOW] \|\| ''\n root.style.paddingRight = root.dataset[DATA_PREV_PADDING_RIGHT] \|\| ''\n delete root.dataset[DATA_PREV_OVERFLOW]\n delete root.dataset[DATA_PREV_PADDING_RIGHT]\n}\n\nfunction lockScroll() {\n const count = getScrollLockCount()\n if (count === 0) {\n applyScrollLockStyles()\n }\n setScrollLockCount(count + 1)\n}\n\nfunction unlockScroll() {\n const currentCount = getScrollLockCount()\n if (currentCount <= 0) {\n return\n }\n\n const nextCount = currentCount - 1\n setScrollLockCount(nextCount)\n if (nextCount === 0) {\n resetScrollLockStyles()\n }\n}\n\nfunction isScrollable(element: HTMLElement): boolean {\n const style = getComputedStyle(element)\n const overflowY = style.overflowY === 'auto' \|\| style.overflowY === 'scroll'\n\n return overflowY && element.scrollHeight > element.clientHeight\n}\n\nfunction findScrollableParent(startElement: HTMLElement, root: HTMLElement): Nullable<HTMLElement> {\n let element: Nullable<HTMLElement> = startElement\n\n while (element && element !== root.parentElement) {\n if (isScrollable(element)) {\n return element\n }\n\n element = element.parentElement\n }\n\n if (isScrollable(root)) {\n return root\n }\n\n return null\n}\n\nfunction isTouchMoveAllowed(target: Nullable<EventTarget>): boolean {\n if (!target \|\| !(target instanceof HTMLElement)) {\n return false\n }\n\n const selection = target.ownerDocument?.defaultView?.getSelection()\n if (selection && !selection.isCollapsed && selection.containsNode(target, true)) {\n return true\n }\n\n if (\n 'selectionStart' in target &&\n 'selectionEnd' in target &&\n Number(target.selectionStart) < Number(target.selectionEnd) &&\n target.ownerDocument?.activeElement === target\n ) {\n return true\n }\n\n return false\n}\n\nfunction addIOSEvents() {\n if (touchMoveHandler \|\| touchStartHandler) {\n return\n }\n\n touchStartHandler = (event: TouchEvent) => {\n const target = event.target\n if (!(target instanceof HTMLElement)) {\n iosActiveScrollElement = null\n iosTouchStartY = null\n\n return\n }\n\n iosTouchStartY = event.touches[0]?.clientY ?? null\n iosActiveScrollElement = null\n for (const block of iosScrollableBlocks) {\n if (block.contains(target)) {\n const scrollElement = findScrollableParent(target, block)\n if (scrollElement) {\n iosActiveScrollElement = scrollElement\n break\n }\n }\n }\n }\n\n touchMoveHandler = (event: TouchEvent) => {\n const touch = event.touches[0]\n if (!touch \|\| event.touches.length === 2 \|\| isTouchMoveAllowed(event.target)) {\n return\n }\n\n if (!event.cancelable) {\n return\n }\n\n if (!iosActiveScrollElement \|\| iosTouchStartY === null) {\n event.preventDefault()\n\n return\n }\n\n const currentY = touch.clientY\n const deltaY = currentY - Number(iosTouchStartY)\n const atTop = iosActiveScrollElement.scrollTop <= 0\n const atBottom =\n iosActiveScrollElement.scrollTop + iosActiveScrollElement.clientHeight >= iosActiveScrollElement.scrollHeight\n if ((atTop && deltaY > 0) \|\| (atBottom && deltaY < 0)) {\n event.preventDefault()\n }\n }\n\n document.addEventListener('touchstart', touchStartHandler, TOUCH_EVENT_OPTIONS)\n document.addEventListener('touchmove', touchMoveHandler, TOUCH_EVENT_OPTIONS)\n}\n\nfunction removeIOSEvents() {\n if (touchStartHandler) {\n document.removeEventListener('touchstart', touchStartHandler, TOUCH_EVENT_OPTIONS)\n touchStartHandler = null\n }\n if (touchMoveHandler) {\n document.removeEventListener('touchmove', touchMoveHandler, TOUCH_EVENT_OPTIONS)\n touchMoveHandler = null\n }\n iosActiveScrollElement = null\n iosTouchStartY = null\n}\n\nfunction lockScrollIOS(scrollableContainer: HTMLElement) {\n iosScrollableBlocks.push(scrollableContainer)\n const count = getScrollLockCount()\n if (count === 0) {\n applyScrollLockStyles()\n addIOSEvents()\n }\n setScrollLockCount(count + 1)\n}\n\nfunction unlockScrollIOS() {\n iosScrollableBlocks.pop()\n const count = getScrollLockCount()\n const nexCount = Math.max(0, count - 1)\n setScrollLockCount(nexCount)\n if (nexCount === 0) {\n resetScrollLockStyles()\n removeIOSEvents()\n }\n}\n\nfunction lockTargetScroll(element: HTMLElement) {\n const style = getComputedStyle(element)\n if (element.dataset[DATA_PREV_OVERFLOW] === undefined) {\n element.dataset[DATA_PREV_OVERFLOW] = style.overflow \|\| ''\n }\n if (element.dataset[DATA_PREV_PADDING_RIGHT] === undefined) {\n element.dataset[DATA_PREV_PADDING_RIGHT] = style.paddingRight \|\| ''\n }\n\n const borderLeft = parseFloat(style.borderLeftWidth) \|\| 0\n const borderRight = parseFloat(style.borderRightWidth) \|\| 0\n const borderWidth = borderLeft + borderRight\n const originalOverflow = style.overflow\n element.style.overflow = 'scroll'\n const scrollbarWidth = element.offsetWidth - element.clientWidth - borderWidth\n element.style.overflow = originalOverflow\n if (supportsScrollbarGutter) {\n element.style.scrollbarGutter = 'stable'\n } else if (scrollbarWidth > 0) {\n const currentPaddingRight = parseFloat(element.dataset[DATA_PREV_PADDING_RIGHT]) \|\| 0\n element.style.paddingRight = `${currentPaddingRight + scrollbarWidth}px`\n }\n element.style.overflow = 'hidden'\n}\n\nfunction unlockTargetScroll(element: HTMLElement) {\n if (element.dataset[DATA_PREV_OVERFLOW] !== undefined) {\n element.style.overflow = element.dataset[DATA_PREV_OVERFLOW]\n }\n if (element.dataset[DATA_PREV_PADDING_RIGHT] !== undefined) {\n element.style.paddingRight = element.dataset[DATA_PREV_PADDING_RIGHT]\n }\n delete element.dataset[DATA_PREV_OVERFLOW]\n delete element.dataset[DATA_PREV_PADDING_RIGHT]\n if (supportsScrollbarGutter) {\n element.style.scrollbarGutter = ''\n }\n}\n\nfunction useScrollLock(params: ScrollLockParams) {\n const { locked, iosAllowedScrollContainer = document.documentElement, target } = params\n\n const isRootTarget = target === undefined \|\| target === document.documentElement \|\| target === document.body\n\n useEffect(() => {\n if (!target \|\| isRootTarget) {\n return\n }\n\n const domTarget = getDomTargets(target)[0]\n\n if (locked) {\n lockTargetScroll(domTarget)\n } else {\n if (domTarget.dataset[DATA_PREV_OVERFLOW] !== undefined) {\n unlockTargetScroll(domTarget)\n }\n }\n\n return () => {\n unlockTargetScroll(domTarget)\n }\n }, [target, locked, isRootTarget])\n\n useEffect(() => {\n if (!locked \|\| !isRootTarget) {\n return\n }\n\n if (isIosDevice) {\n const domContainer = getDomTargets(iosAllowedScrollContainer)[0]\n lockScrollIOS(domContainer)\n\n return () => {\n unlockScrollIOS()\n }\n }\n\n lockScroll()\n\n return () => {\n unlockScroll()\n }\n }, [iosAllowedScrollContainer, isRootTarget, locked])\n}\n\nexport { useScrollLock }\n"],"names":["TOUCH_EVENT_OPTIONS","capture","passive","supportsScrollbarGutter","CSS","supports","isIosDevice","window","navigator","userAgent","test","includes","maxTouchPoints","iosScrollableBlocks","iosActiveScrollElement","iosTouchStartY","touchStartHandler","touchMoveHandler","getScrollLockCount","Number","document","documentElement","dataset","setScrollLockCount","count","toString","applyScrollLockStyles","root","style","overflow","scrollbarGutter","scrollbarWidth","innerWidth","clientWidth","paddingRight","currentPaddingRight","parseFloat","getComputedStyle","resetScrollLockStyles","isScrollable","element","overflowY","scrollHeight","clientHeight","findScrollableParent","startElement","parentElement","unlockTargetScroll","undefined","useScrollLock","params","locked","iosAllowedScrollContainer","target","isRootTarget","body","useEffect","domTarget","getDomTargets","borderWidth","borderLeftWidth","borderRightWidth","originalOverflow","offsetWidth","lockTargetScroll","scrollableContainer","push","event","HTMLElement","touches","clientY","block","contains","scrollElement","touch","length","selection","ownerDocument","defaultView","getSelection","isCollapsed","containsNode","selectionStart","selectionEnd","activeElement","isTouchMoveAllowed","cancelable","preventDefault","deltaY","scrollTop","addEventListener","lockScrollIOS","pop","nexCount","Math","max","removeEventListener","unlockScrollIOS","lockScroll","currentCount","nextCount","unlockScroll"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@foxford/ui",
-  "version": "2.101.0",
+  "version": "2.102.0-beta-ea3c5d9-20260330",
   "description": "UI components and utilities",
   "bugs": {
     "url": "https://github.com/foxford/ui/issues"
@@ -63,6 +63,6 @@
     "shared",
     "theme"
   ],
-  "sha": "6f3b4a5",
+  "sha": "ea3c5d9",
   "scripts": {}
 }