@foxford/ui 2.72.0 → 2.73.0-beta-73cfef9-20250421

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 (60) hide show
  1. package/components/Dialog/Dialog.js +1 -1
  2. package/components/Dialog/Dialog.js.map +1 -1
  3. package/components/Dialog/Dialog.mjs +1 -1
  4. package/components/Dialog/Dialog.mjs.map +1 -1
  5. package/components/Dialog/{constants.js → positions.js} +1 -1
  6. package/components/Dialog/positions.js.map +1 -0
  7. package/components/Dialog/{constants.mjs → positions.mjs} +1 -1
  8. package/components/Dialog/positions.mjs.map +1 -0
  9. package/components/Dialog/sizes.js +2 -0
  10. package/components/Dialog/sizes.js.map +1 -0
  11. package/components/Dialog/sizes.mjs +2 -0
  12. package/components/Dialog/sizes.mjs.map +1 -0
  13. package/components/DialogComponent/DialogComponent.js +1 -1
  14. package/components/DialogComponent/DialogComponent.js.map +1 -1
  15. package/components/DialogComponent/DialogComponent.mjs +1 -1
  16. package/components/DialogComponent/DialogComponent.mjs.map +1 -1
  17. package/components/DialogComponent/layouts.js +2 -0
  18. package/components/DialogComponent/layouts.js.map +1 -0
  19. package/components/DialogComponent/layouts.mjs +2 -0
  20. package/components/DialogComponent/layouts.mjs.map +1 -0
  21. package/components/DialogComponent/sizes.js +2 -0
  22. package/components/DialogComponent/sizes.js.map +1 -0
  23. package/components/DialogComponent/sizes.mjs +2 -0
  24. package/components/DialogComponent/sizes.mjs.map +1 -0
  25. package/components/DialogComponent/style.js +1 -1
  26. package/components/DialogComponent/style.js.map +1 -1
  27. package/components/DialogComponent/style.mjs +1 -1
  28. package/components/DialogComponent/style.mjs.map +1 -1
  29. package/components/PopoverComponent/PopoverComponent.js +1 -1
  30. package/components/PopoverComponent/PopoverComponent.js.map +1 -1
  31. package/components/PopoverComponent/PopoverComponent.mjs +1 -1
  32. package/components/PopoverComponent/PopoverComponent.mjs.map +1 -1
  33. package/dts/index.d.ts +508 -243
  34. package/package.json +2 -1
  35. package/components/Dialog/constants.js.map +0 -1
  36. package/components/Dialog/constants.mjs.map +0 -1
  37. package/components/DialogComponent/DialogContainer.js +0 -2
  38. package/components/DialogComponent/DialogContainer.js.map +0 -1
  39. package/components/DialogComponent/DialogContainer.mjs +0 -2
  40. package/components/DialogComponent/DialogContainer.mjs.map +0 -1
  41. package/components/DialogComponent/ProgressLineContainer.js +0 -2
  42. package/components/DialogComponent/ProgressLineContainer.js.map +0 -1
  43. package/components/DialogComponent/ProgressLineContainer.mjs +0 -2
  44. package/components/DialogComponent/ProgressLineContainer.mjs.map +0 -1
  45. package/components/DialogComponent/constants.js +0 -2
  46. package/components/DialogComponent/constants.js.map +0 -1
  47. package/components/DialogComponent/constants.mjs +0 -2
  48. package/components/DialogComponent/constants.mjs.map +0 -1
  49. package/components/DialogComponent/utils.js +0 -2
  50. package/components/DialogComponent/utils.js.map +0 -1
  51. package/components/DialogComponent/utils.mjs +0 -2
  52. package/components/DialogComponent/utils.mjs.map +0 -1
  53. package/components/Visibility/Visibility.js +0 -2
  54. package/components/Visibility/Visibility.js.map +0 -1
  55. package/components/Visibility/Visibility.mjs +0 -2
  56. package/components/Visibility/Visibility.mjs.map +0 -1
  57. package/components/Visibility/style.js +0 -2
  58. package/components/Visibility/style.js.map +0 -1
  59. package/components/Visibility/style.mjs +0 -2
  60. package/components/Visibility/style.mjs.map +0 -1
@@ -1,2 +1,2 @@
1
- 'use strict';var React=require('react');var ReactModal=require('react-modal');var withMergedProps=require('../../hocs/withMergedProps.js');var withTranslation=require('../../hocs/withTranslation.js');var misc=require('../../shared/utils/misc.js');var constants$1=require('./constants.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var DialogComponent=require('../DialogComponent/DialogComponent.js');var constants=require('../DialogComponent/constants.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var ReactModal__default=_interopDefault(ReactModal);const TranslationDialogComponent=withTranslation.withTranslation(React.forwardRef(((e,o)=>{const{positions:n={},translated:s,...a}=e;const t=s?{}:misc.deepmerge(constants$1.POSITIONS,n);return jsxRuntime.jsx(style.PositionedDialogComponent,{...a,positions:t,ref:o})})));const Dialog=Object.assign(withMergedProps.withMergedProps((e=>{const{size:o="s",position:n="center",role:s="dialog",open:a,preventScrollAfterClose:t,closeTimeoutMS:r,portalClassName:l,className:i,bodyOpenClassName:c,htmlOpenClassName:u,overlayClassName:d,shouldCloseOnOverlayClick:p,shouldCloseOnEsc:C,shouldReturnFocusAfterClose:m,parentSelector:g,overlayRef:D,contentRef:f,palette:v,overlayBlur:y,overlayDisabled:M,zIndex:h,onAfterOpen:w,onAfterClose:N,onRequestClose:R,...O}=e;const j=O.draggable||M;return jsxRuntime.jsx(ReactModal__default.default,{isOpen:a,ariaHideApp:!1,preventScroll:t,closeTimeoutMS:r,portalClassName:l,className:i,bodyOpenClassName:c,htmlOpenClassName:u,overlayClassName:d,shouldCloseOnOverlayClick:p,shouldCloseOnEsc:C,shouldReturnFocusAfterClose:m,parentSelector:g,overlayRef:D,contentRef:f,onAfterOpen:w,onAfterClose:N,onRequestClose:R,contentElement:e=>{const{ref:a,className:t,tabIndex:r,onKeyDown:l,onMouseDown:i,onMouseUp:c,onClick:u}=e;return jsxRuntime.jsx(TranslationDialogComponent,{...O,ref:a,size:o,role:s,className:t,tabIndex:r,position:n,"aria-modal":!O.draggable&&!M,palette:{color:v.color,backgroundColor:v.backgroundColor,shadowColor:v.shadowColor},zIndex:j?h:void 0,onKeyDown:e=>{O.onKeyDown&&O.onKeyDown(e),l&&l(e)},onMouseDown:e=>{O.onMouseDown&&O.onMouseDown(e),i&&i(e)},onMouseUp:e=>{O.onMouseUp&&O.onMouseUp(e),c&&c(e)},onClick:e=>{O.onClick&&O.onClick(e),u&&u(e)}})},overlayElement:(e,o)=>{const{ref:n,className:s,onClick:a,onMouseDown:t}=e;return j?o:jsxRuntime.jsx(style.DialogOverlay,{ref:n,className:s,blur:y,palette:{backgroundColor:v.overlayBackgroundColor},zIndex:h,onClick:a,onMouseDown:t,children:o})}})}),{sizes:e=>e.fancy?constants.SIZES_FANCY:constants.SIZES,displayName:"Dialog"}),{Component:DialogComponent.DialogComponent});exports.COMPONENT_NAME="Dialog",exports.Dialog=Dialog;
1
+ 'use strict';var React=require('react');var ReactModal=require('react-modal');var withMergedProps=require('../../hocs/withMergedProps.js');var withTranslation=require('../../hocs/withTranslation.js');var misc=require('../../shared/utils/misc.js');var sizes=require('./sizes.js');var positions=require('./positions.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var DialogComponent=require('../DialogComponent/DialogComponent.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var ReactModal__default=_interopDefault(ReactModal);const TranslationDialogComponent=withTranslation.withTranslation(React.forwardRef(((e,o)=>{const{positions:s={},translated:n,...a}=e;const r=n?{}:misc.deepmerge(positions.POSITIONS,s);return jsxRuntime.jsx(style.PositionedDialogComponent,{...a,positions:r,ref:o})})));const Dialog=Object.assign(withMergedProps.withMergedProps((e=>{const{size:o="s",position:s="center",role:n="dialog",open:a,preventScrollAfterClose:r,closeTimeoutMS:l,portalClassName:t,className:i,bodyOpenClassName:c,htmlOpenClassName:u,overlayClassName:p,shouldCloseOnOverlayClick:d,shouldCloseOnEsc:C,shouldReturnFocusAfterClose:m,parentSelector:g,overlayRef:D,contentRef:f,palette:v,overlayBlur:y,overlayDisabled:M,zIndex:h,onAfterOpen:w,onAfterClose:N,onRequestClose:R,...O}=e;const j=O.draggable||M;return jsxRuntime.jsx(ReactModal__default.default,{isOpen:a,ariaHideApp:!1,preventScroll:r,closeTimeoutMS:l,portalClassName:t,className:i,bodyOpenClassName:c,htmlOpenClassName:u,overlayClassName:p,shouldCloseOnOverlayClick:d,shouldCloseOnEsc:C,shouldReturnFocusAfterClose:m,parentSelector:g,overlayRef:D,contentRef:f,onAfterOpen:w,onAfterClose:N,onRequestClose:R,contentElement:e=>{const{ref:a,className:r,tabIndex:l,onKeyDown:t,onMouseDown:i,onMouseUp:c,onClick:u}=e;return jsxRuntime.jsx(TranslationDialogComponent,{...O,ref:a,size:o,role:n,className:r,tabIndex:l,position:s,"aria-modal":!O.draggable&&!M,palette:{color:v.color,backgroundColor:v.backgroundColor,shadowColor:v.shadowColor},zIndex:j?h:void 0,onKeyDown:e=>{O.onKeyDown&&O.onKeyDown(e),t&&t(e)},onMouseDown:e=>{O.onMouseDown&&O.onMouseDown(e),i&&i(e)},onMouseUp:e=>{O.onMouseUp&&O.onMouseUp(e),c&&c(e)},onClick:e=>{O.onClick&&O.onClick(e),u&&u(e)}})},overlayElement:(e,o)=>{const{ref:s,className:n,onClick:a,onMouseDown:r}=e;return j?o:jsxRuntime.jsx(style.DialogOverlay,{ref:s,className:n,blur:y,palette:{backgroundColor:v.overlayBackgroundColor},zIndex:h,onClick:a,onMouseDown:r,children:o})}})}),{sizes:e=>e.fancy?sizes.SIZES_FANCY:sizes.SIZES,displayName:"Dialog"}),{Component:DialogComponent.DialogComponent});exports.COMPONENT_NAME="Dialog",exports.Dialog=Dialog;
2
2
  //# sourceMappingURL=Dialog.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.js","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport ReactModal from 'react-modal'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { withTranslation } from 'hocs/withTranslation'\nimport { DialogComponent, SIZES, SIZES_FANCY } from 'components/DialogComponent'\nimport { deepmerge } from 'shared/utils/misc'\nimport { POSITIONS } from './constants'\nimport * as Styled from './style'\nimport type { DialogProps, TranslationDialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'Dialog'\n\nconst TranslationDialogComponent = withTranslation<HTMLDivElement, TranslationDialogComponentProps>(\n forwardRef((props, ref) => {\n const { positions = {}, translated, ...restProps } = props\n\n const dialogPositions = translated ? {} : deepmerge(POSITIONS, positions)\n\n return <Styled.PositionedDialogComponent {...restProps} positions={dialogPositions} ref={ref} />\n })\n)\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Поддерживаются пропсы определения размеров и позиции в зависимости от ширины вьюпорта.\n *\n * Компонент основан на [\"react-modal\"](https://www.npmjs.com/package/react-modal).\n *\n * Получить доступ к компоненту, не подключенному к библиотеке, можно через Dialog.Component.\n *\n * Полный интерфейс Dialog можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Dialog/types.ts), интерфейс Dialog.Component [тут](https://github.com/foxford/ui/blob/master/src/components/DialogComponent/types.ts).\n *\n */\nconst Dialog: React.ForwardRefExoticComponent<DialogProps> & { Component: typeof DialogComponent } = Object.assign(\n withMergedProps<DialogProps, HTMLDivElement>(\n (props) => {\n const {\n size = 's',\n position = 'center',\n role = 'dialog',\n open,\n preventScrollAfterClose,\n closeTimeoutMS,\n portalClassName,\n className,\n bodyOpenClassName,\n htmlOpenClassName,\n overlayClassName,\n shouldCloseOnOverlayClick,\n shouldCloseOnEsc,\n shouldReturnFocusAfterClose,\n parentSelector,\n overlayRef,\n contentRef,\n palette,\n overlayBlur,\n overlayDisabled,\n zIndex,\n onAfterOpen,\n onAfterClose,\n onRequestClose,\n ...dialogProps\n } = props\n\n const overlayElementDisabled = dialogProps.draggable || overlayDisabled\n\n return (\n <ReactModal\n isOpen={open}\n ariaHideApp={false}\n preventScroll={preventScrollAfterClose}\n closeTimeoutMS={closeTimeoutMS}\n portalClassName={portalClassName}\n className={className}\n bodyOpenClassName={bodyOpenClassName}\n htmlOpenClassName={htmlOpenClassName}\n overlayClassName={overlayClassName}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldCloseOnEsc={shouldCloseOnEsc}\n shouldReturnFocusAfterClose={shouldReturnFocusAfterClose}\n parentSelector={parentSelector}\n overlayRef={overlayRef}\n contentRef={contentRef}\n onAfterOpen={onAfterOpen}\n onAfterClose={onAfterClose}\n onRequestClose={onRequestClose}\n contentElement={(contentProps) => {\n const { ref, className, tabIndex, onKeyDown, onMouseDown, onMouseUp, onClick } = contentProps\n\n return (\n <TranslationDialogComponent\n {...dialogProps}\n ref={ref}\n size={size}\n role={role}\n className={className}\n tabIndex={tabIndex}\n position={position}\n aria-modal={!dialogProps.draggable && !overlayDisabled}\n palette={{\n color: palette.color,\n backgroundColor: palette.backgroundColor,\n shadowColor: palette.shadowColor,\n }}\n zIndex={overlayElementDisabled ? zIndex : undefined}\n onKeyDown={(evt) => {\n if (dialogProps.onKeyDown) dialogProps.onKeyDown(evt)\n if (onKeyDown) onKeyDown(evt)\n }}\n onMouseDown={(evt) => {\n if (dialogProps.onMouseDown) dialogProps.onMouseDown(evt)\n if (onMouseDown) onMouseDown(evt)\n }}\n onMouseUp={(evt) => {\n if (dialogProps.onMouseUp) dialogProps.onMouseUp(evt)\n if (onMouseUp) onMouseUp(evt)\n }}\n onClick={(evt) => {\n if (dialogProps.onClick) dialogProps.onClick(evt)\n if (onClick) onClick(evt)\n }}\n />\n )\n }}\n overlayElement={(overlayProps, contentElement) => {\n const { ref, className, onClick, onMouseDown } = overlayProps\n\n return overlayElementDisabled ? (\n contentElement\n ) : (\n <Styled.DialogOverlay\n ref={ref}\n className={className}\n blur={overlayBlur}\n palette={{\n backgroundColor: palette.overlayBackgroundColor,\n }}\n zIndex={zIndex}\n onClick={onClick}\n onMouseDown={onMouseDown}\n >\n {contentElement}\n </Styled.DialogOverlay>\n )\n }}\n />\n )\n },\n {\n sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n displayName: COMPONENT_NAME,\n }\n ),\n {\n Component: DialogComponent,\n }\n)\n\nexport { Dialog }\n\nexport { COMPONENT_NAME }\n"],"names":["TranslationDialogComponent","withTranslation","forwardRef","props","ref","positions","translated","restProps","dialogPositions","deepmerge","POSITIONS","_jsx","Styled","Dialog","Object","assign","withMergedProps","size","position","role","open","preventScrollAfterClose","closeTimeoutMS","portalClassName","className","bodyOpenClassName","htmlOpenClassName","overlayClassName","shouldCloseOnOverlayClick","shouldCloseOnEsc","shouldReturnFocusAfterClose","parentSelector","overlayRef","contentRef","palette","overlayBlur","overlayDisabled","zIndex","onAfterOpen","onAfterClose","onRequestClose","dialogProps","overlayElementDisabled","draggable","ReactModal","isOpen","ariaHideApp","preventScroll","contentElement","contentProps","tabIndex","onKeyDown","onMouseDown","onMouseUp","onClick","color","backgroundColor","shadowColor","undefined","evt","overlayElement","overlayProps","jsx","blur","overlayBackgroundColor","children","sizes","fancy","SIZES_FANCY","SIZES","displayName","Component","DialogComponent"],"mappings":"gmBAYA,MAAMA,2BAA6BC,gBAAAA,gBACjCC,MAAAA,YAAW,CAACC,EAAOC,KACjB,MAAMC,UAAEA,EAAY,CAAE,EAAAC,WAAEA,KAAeC,GAAcJ,EAErD,MAAMK,EAAkBF,EAAa,CAAA,EAAKG,KAAAA,UAAUC,YAAAA,UAAWL,GAE/D,OAAOM,WAAAA,IAACC,MAAAA,0BAAgC,IAAKL,EAAWF,UAAWG,EAAiBJ,IAAKA,GAAO,KAiB9FS,MAAAA,OAA+FC,OAAOC,OAC1GC,gBAAAA,iBACGb,IACC,MAAMc,KACJA,EAAO,IAAGC,SACVA,EAAW,SAAQC,KACnBA,EAAO,SAAQC,KACfA,EAAIC,wBACJA,EAAuBC,eACvBA,EAAcC,gBACdA,EAAeC,UACfA,EAASC,kBACTA,EAAiBC,kBACjBA,EAAiBC,iBACjBA,EAAgBC,0BAChBA,EAAyBC,iBACzBA,EAAgBC,4BAChBA,EAA2BC,eAC3BA,EAAcC,WACdA,EAAUC,WACVA,EAAUC,QACVA,EAAOC,YACPA,EAAWC,gBACXA,EAAeC,OACfA,EAAMC,YACNA,EAAWC,aACXA,EAAYC,eACZA,KACGC,GACDtC,EAEJ,MAAMuC,EAAyBD,EAAYE,WAAaP,EAExD,OACEzB,WAAAA,IAACiC,oBAAAA,QAAU,CACTC,OAAQzB,EACR0B,aAAa,EACbC,cAAe1B,EACfC,eAAgBA,EAChBC,gBAAiBA,EACjBC,UAAWA,EACXC,kBAAmBA,EACnBC,kBAAmBA,EACnBC,iBAAkBA,EAClBC,0BAA2BA,EAC3BC,iBAAkBA,EAClBC,4BAA6BA,EAC7BC,eAAgBA,EAChBC,WAAYA,EACZC,WAAYA,EACZK,YAAaA,EACbC,aAAcA,EACdC,eAAgBA,EAChBQ,eAAiBC,IACf,MAAM7C,IAAEA,EAAGoB,UAAEA,EAAS0B,SAAEA,EAAQC,UAAEA,EAASC,YAAEA,EAAWC,UAAEA,EAASC,QAAEA,GAAYL,EAEjF,OACEtC,WAAAA,IAACX,2BAA0B,IACrByC,EACJrC,IAAKA,EACLa,KAAMA,EACNE,KAAMA,EACNK,UAAWA,EACX0B,SAAUA,EACVhC,SAAUA,EACV,cAAauB,EAAYE,YAAcP,EACvCF,QAAS,CACPqB,MAAOrB,EAAQqB,MACfC,gBAAiBtB,EAAQsB,gBACzBC,YAAavB,EAAQuB,aAEvBpB,OAAQK,EAAyBL,OAASqB,EAC1CP,UAAYQ,IACNlB,EAAYU,WAAWV,EAAYU,UAAUQ,GAC7CR,GAAWA,EAAUQ,EAAI,EAE/BP,YAAcO,IACRlB,EAAYW,aAAaX,EAAYW,YAAYO,GACjDP,GAAaA,EAAYO,EAAI,EAEnCN,UAAYM,IACNlB,EAAYY,WAAWZ,EAAYY,UAAUM,GAC7CN,GAAWA,EAAUM,EAAI,EAE/BL,QAAUK,IACJlB,EAAYa,SAASb,EAAYa,QAAQK,GACzCL,GAASA,EAAQK,EAAI,GAE3B,EAGNC,eAAgBA,CAACC,EAAcb,KAC7B,MAAM5C,IAAEA,EAAGoB,UAAEA,EAAS8B,QAAEA,EAAOF,YAAEA,GAAgBS,EAEjD,OAAOnB,EACLM,EAEArC,WAAAmD,IAAClD,oBAAoB,CACnBR,IAAKA,EACLoB,UAAWA,EACXuC,KAAM5B,EACND,QAAS,CACPsB,gBAAiBtB,EAAQ8B,wBAE3B3B,OAAQA,EACRiB,QAASA,EACTF,YAAaA,EAAYa,SAExBjB,GAEJ,GAEH,GAGN,CACEkB,MAAQ/D,GAAWA,EAAMgE,MAAQC,UAAWA,YAAGC,UAAMA,MACrDC,YA9IiB,WAiJrB,CACEC,UAAWC,gBAAAA,yCAlJQ"}
1
+ {"version":3,"file":"Dialog.js","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport ReactModal from 'react-modal'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { withTranslation } from 'hocs/withTranslation'\nimport { DialogComponent } from 'components/DialogComponent'\nimport { deepmerge } from 'shared/utils/misc'\nimport { SIZES, SIZES_FANCY } from './sizes'\nimport { POSITIONS } from './positions'\nimport * as Styled from './style'\nimport type { DialogProps, TranslationDialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'Dialog'\n\nconst TranslationDialogComponent = withTranslation<HTMLDivElement, TranslationDialogComponentProps>(\n forwardRef((props, ref) => {\n const { positions = {}, translated, ...restProps } = props\n\n const dialogPositions = translated ? {} : deepmerge(POSITIONS, positions)\n\n return <Styled.PositionedDialogComponent {...restProps} positions={dialogPositions} ref={ref} />\n })\n)\n\n/**\n *\n * Компонент для отображения контента поверх основного интерфейса.\n *\n * Поддерживаются все нативные атрибуты \\<div\\> элемента.\n */\nconst Dialog: React.ForwardRefExoticComponent<DialogProps> & { Component: typeof DialogComponent } = Object.assign(\n withMergedProps<DialogProps, HTMLDivElement>(\n (props) => {\n const {\n size = 's',\n position = 'center',\n role = 'dialog',\n open,\n preventScrollAfterClose,\n closeTimeoutMS,\n portalClassName,\n className,\n bodyOpenClassName,\n htmlOpenClassName,\n overlayClassName,\n shouldCloseOnOverlayClick,\n shouldCloseOnEsc,\n shouldReturnFocusAfterClose,\n parentSelector,\n overlayRef,\n contentRef,\n palette,\n overlayBlur,\n overlayDisabled,\n zIndex,\n onAfterOpen,\n onAfterClose,\n onRequestClose,\n ...dialogProps\n } = props\n\n const overlayElementDisabled = dialogProps.draggable || overlayDisabled\n\n return (\n <ReactModal\n isOpen={open}\n ariaHideApp={false}\n preventScroll={preventScrollAfterClose}\n closeTimeoutMS={closeTimeoutMS}\n portalClassName={portalClassName}\n className={className}\n bodyOpenClassName={bodyOpenClassName}\n htmlOpenClassName={htmlOpenClassName}\n overlayClassName={overlayClassName}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldCloseOnEsc={shouldCloseOnEsc}\n shouldReturnFocusAfterClose={shouldReturnFocusAfterClose}\n parentSelector={parentSelector}\n overlayRef={overlayRef}\n contentRef={contentRef}\n onAfterOpen={onAfterOpen}\n onAfterClose={onAfterClose}\n onRequestClose={onRequestClose}\n contentElement={(contentProps) => {\n const { ref, className, tabIndex, onKeyDown, onMouseDown, onMouseUp, onClick } = contentProps\n\n return (\n <TranslationDialogComponent\n {...dialogProps}\n ref={ref}\n size={size}\n role={role}\n className={className}\n tabIndex={tabIndex}\n position={position}\n aria-modal={!dialogProps.draggable && !overlayDisabled}\n palette={{\n color: palette.color,\n backgroundColor: palette.backgroundColor,\n shadowColor: palette.shadowColor,\n }}\n zIndex={overlayElementDisabled ? zIndex : undefined}\n onKeyDown={(evt) => {\n if (dialogProps.onKeyDown) dialogProps.onKeyDown(evt)\n if (onKeyDown) onKeyDown(evt)\n }}\n onMouseDown={(evt) => {\n if (dialogProps.onMouseDown) dialogProps.onMouseDown(evt)\n if (onMouseDown) onMouseDown(evt)\n }}\n onMouseUp={(evt) => {\n if (dialogProps.onMouseUp) dialogProps.onMouseUp(evt)\n if (onMouseUp) onMouseUp(evt)\n }}\n onClick={(evt) => {\n if (dialogProps.onClick) dialogProps.onClick(evt)\n if (onClick) onClick(evt)\n }}\n />\n )\n }}\n overlayElement={(overlayProps, contentElement) => {\n const { ref, className, onClick, onMouseDown } = overlayProps\n\n return overlayElementDisabled ? (\n contentElement\n ) : (\n <Styled.DialogOverlay\n ref={ref}\n className={className}\n blur={overlayBlur}\n palette={{\n backgroundColor: palette.overlayBackgroundColor,\n }}\n zIndex={zIndex}\n onClick={onClick}\n onMouseDown={onMouseDown}\n >\n {contentElement}\n </Styled.DialogOverlay>\n )\n }}\n />\n )\n },\n {\n sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n displayName: COMPONENT_NAME,\n }\n ),\n {\n Component: DialogComponent,\n }\n)\n\nexport { Dialog }\n\nexport { COMPONENT_NAME }\n"],"names":["TranslationDialogComponent","withTranslation","forwardRef","props","ref","positions","translated","restProps","dialogPositions","deepmerge","POSITIONS","_jsx","Styled","Dialog","Object","assign","withMergedProps","size","position","role","open","preventScrollAfterClose","closeTimeoutMS","portalClassName","className","bodyOpenClassName","htmlOpenClassName","overlayClassName","shouldCloseOnOverlayClick","shouldCloseOnEsc","shouldReturnFocusAfterClose","parentSelector","overlayRef","contentRef","palette","overlayBlur","overlayDisabled","zIndex","onAfterOpen","onAfterClose","onRequestClose","dialogProps","overlayElementDisabled","draggable","ReactModal","isOpen","ariaHideApp","preventScroll","contentElement","contentProps","tabIndex","onKeyDown","onMouseDown","onMouseUp","onClick","color","backgroundColor","shadowColor","undefined","evt","overlayElement","overlayProps","jsx","blur","overlayBackgroundColor","children","sizes","fancy","SIZES_FANCY","SIZES","displayName","Component","DialogComponent"],"mappings":"qkBAaA,MAAMA,2BAA6BC,gBAAAA,gBACjCC,MAAAA,YAAW,CAACC,EAAOC,KACjB,MAAQC,UAAAA,EAAY,CAAE,EAAAC,WAAEA,KAAeC,GAAcJ,EAErD,MAAMK,EAAkBF,EAAa,CAAA,EAAKG,KAAAA,UAAUC,UAAAA,UAAWL,GAE/D,OAAOM,WAAAA,IAACC,MAAAA,0BAAgC,IAAKL,EAAWF,UAAWG,EAAiBJ,IAAKA,GAAO,KAU9FS,MAAAA,OAA+FC,OAAOC,OAC1GC,gBAAAA,iBACGb,IACC,MAAMc,KACJA,EAAO,IAAGC,SACVA,EAAW,SAAQC,KACnBA,EAAO,SAAQC,KACfA,EAAIC,wBACJA,EAAuBC,eACvBA,EAAcC,gBACdA,EAAeC,UACfA,EAASC,kBACTA,EAAiBC,kBACjBA,EAAiBC,iBACjBA,EAAgBC,0BAChBA,EAAyBC,iBACzBA,EAAgBC,4BAChBA,EAA2BC,eAC3BA,EAAcC,WACdA,EAAUC,WACVA,EAAUC,QACVA,EAAOC,YACPA,EAAWC,gBACXA,EAAeC,OACfA,EAAMC,YACNA,EAAWC,aACXA,EAAYC,eACZA,KACGC,GACDtC,EAEJ,MAAMuC,EAAyBD,EAAYE,WAAaP,EAExD,OACEzB,WAAAA,IAACiC,oBAAAA,QAAU,CACTC,OAAQzB,EACR0B,aAAa,EACbC,cAAe1B,EACfC,eAAgBA,EAChBC,gBAAiBA,EACjBC,UAAWA,EACXC,kBAAmBA,EACnBC,kBAAmBA,EACnBC,iBAAkBA,EAClBC,0BAA2BA,EAC3BC,iBAAkBA,EAClBC,4BAA6BA,EAC7BC,eAAgBA,EAChBC,WAAYA,EACZC,WAAYA,EACZK,YAAaA,EACbC,aAAcA,EACdC,eAAgBA,EAChBQ,eAAiBC,IACf,MAAM7C,IAAEA,EAAGoB,UAAEA,EAAS0B,SAAEA,EAAQC,UAAEA,EAASC,YAAEA,EAAWC,UAAEA,EAASC,QAAEA,GAAYL,EAEjF,OACEtC,WAAAA,IAACX,2BAA0B,IACrByC,EACJrC,IAAKA,EACLa,KAAMA,EACNE,KAAMA,EACNK,UAAWA,EACX0B,SAAUA,EACVhC,SAAUA,EACV,cAAauB,EAAYE,YAAcP,EACvCF,QAAS,CACPqB,MAAOrB,EAAQqB,MACfC,gBAAiBtB,EAAQsB,gBACzBC,YAAavB,EAAQuB,aAEvBpB,OAAQK,EAAyBL,OAASqB,EAC1CP,UAAYQ,IACNlB,EAAYU,WAAWV,EAAYU,UAAUQ,GAC7CR,GAAWA,EAAUQ,EAAI,EAE/BP,YAAcO,IACRlB,EAAYW,aAAaX,EAAYW,YAAYO,GACjDP,GAAaA,EAAYO,EAAI,EAEnCN,UAAYM,IACNlB,EAAYY,WAAWZ,EAAYY,UAAUM,GAC7CN,GAAWA,EAAUM,EAAI,EAE/BL,QAAUK,IACJlB,EAAYa,SAASb,EAAYa,QAAQK,GACzCL,GAASA,EAAQK,EAAI,GAE3B,EAGNC,eAAgBA,CAACC,EAAcb,KAC7B,MAAM5C,IAAEA,EAAGoB,UAAEA,EAAS8B,QAAEA,EAAOF,YAAEA,GAAgBS,EAEjD,OAAOnB,EACLM,EAEArC,WAAAmD,IAAClD,oBAAoB,CACnBR,IAAKA,EACLoB,UAAWA,EACXuC,KAAM5B,EACND,QAAS,CACPsB,gBAAiBtB,EAAQ8B,wBAE3B3B,OAAQA,EACRiB,QAASA,EACTF,YAAaA,EAAYa,SAExBjB,GAEJ,GAEH,GAGN,CACEkB,MAAQ/D,GAAWA,EAAMgE,MAAQC,MAAWA,YAAGC,MAAMA,MACrDC,YAvIiB,WA0IrB,CACEC,UAAWC,gBAAAA,yCA3IQ"}
@@ -1,2 +1,2 @@
1
- import{forwardRef}from'react';import ReactModal from'react-modal';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{withTranslation}from'../../hocs/withTranslation.mjs';import{deepmerge}from'../../shared/utils/misc.mjs';import{POSITIONS}from'./constants.mjs';import{DialogOverlay,PositionedDialogComponent}from'./style.mjs';import{jsx}from'react/jsx-runtime';import{DialogComponent}from'../DialogComponent/DialogComponent.mjs';import{SIZES_FANCY,SIZES}from'../DialogComponent/constants.mjs';const COMPONENT_NAME='Dialog';const TranslationDialogComponent=withTranslation(forwardRef(((o,e)=>{const{positions:n={},translated:s,...l}=o;const a=s?{}:deepmerge(POSITIONS,n);return jsx(PositionedDialogComponent,{...l,positions:a,ref:e})})));const Dialog=Object.assign(withMergedProps((o=>{const{size:e="s",position:n="center",role:s="dialog",open:l,preventScrollAfterClose:a,closeTimeoutMS:r,portalClassName:t,className:i,bodyOpenClassName:m,htmlOpenClassName:c,overlayClassName:p,shouldCloseOnOverlayClick:C,shouldCloseOnEsc:d,shouldReturnFocusAfterClose:u,parentSelector:f,overlayRef:g,contentRef:D,palette:N,overlayBlur:O,overlayDisabled:y,zIndex:M,onAfterOpen:h,onAfterClose:w,onRequestClose:S,...v}=o;const j=v.draggable||y;return jsx(ReactModal,{isOpen:l,ariaHideApp:!1,preventScroll:a,closeTimeoutMS:r,portalClassName:t,className:i,bodyOpenClassName:m,htmlOpenClassName:c,overlayClassName:p,shouldCloseOnOverlayClick:C,shouldCloseOnEsc:d,shouldReturnFocusAfterClose:u,parentSelector:f,overlayRef:g,contentRef:D,onAfterOpen:h,onAfterClose:w,onRequestClose:S,contentElement:o=>{const{ref:l,className:a,tabIndex:r,onKeyDown:t,onMouseDown:i,onMouseUp:m,onClick:c}=o;return jsx(TranslationDialogComponent,{...v,ref:l,size:e,role:s,className:a,tabIndex:r,position:n,"aria-modal":!v.draggable&&!y,palette:{color:N.color,backgroundColor:N.backgroundColor,shadowColor:N.shadowColor},zIndex:j?M:void 0,onKeyDown:o=>{v.onKeyDown&&v.onKeyDown(o),t&&t(o)},onMouseDown:o=>{v.onMouseDown&&v.onMouseDown(o),i&&i(o)},onMouseUp:o=>{v.onMouseUp&&v.onMouseUp(o),m&&m(o)},onClick:o=>{v.onClick&&v.onClick(o),c&&c(o)}})},overlayElement:(o,e)=>{const{ref:n,className:s,onClick:l,onMouseDown:a}=o;return j?e:jsx(DialogOverlay,{ref:n,className:s,blur:O,palette:{backgroundColor:N.overlayBackgroundColor},zIndex:M,onClick:l,onMouseDown:a,children:e})}})}),{sizes:o=>o.fancy?SIZES_FANCY:SIZES,displayName:"Dialog"}),{Component:DialogComponent});export{COMPONENT_NAME,Dialog};
1
+ import{forwardRef}from'react';import ReactModal from'react-modal';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{withTranslation}from'../../hocs/withTranslation.mjs';import{deepmerge}from'../../shared/utils/misc.mjs';import{SIZES_FANCY,SIZES}from'./sizes.mjs';import{POSITIONS}from'./positions.mjs';import{DialogOverlay,PositionedDialogComponent}from'./style.mjs';import{jsx}from'react/jsx-runtime';import{DialogComponent}from'../DialogComponent/DialogComponent.mjs';const COMPONENT_NAME='Dialog';const TranslationDialogComponent=withTranslation(forwardRef(((o,e)=>{const{positions:n={},translated:s,...l}=o;const r=s?{}:deepmerge(POSITIONS,n);return jsx(PositionedDialogComponent,{...l,positions:r,ref:e})})));const Dialog=Object.assign(withMergedProps((o=>{const{size:e="s",position:n="center",role:s="dialog",open:l,preventScrollAfterClose:r,closeTimeoutMS:a,portalClassName:t,className:i,bodyOpenClassName:m,htmlOpenClassName:c,overlayClassName:p,shouldCloseOnOverlayClick:C,shouldCloseOnEsc:d,shouldReturnFocusAfterClose:u,parentSelector:f,overlayRef:g,contentRef:D,palette:N,overlayBlur:O,overlayDisabled:y,zIndex:M,onAfterOpen:h,onAfterClose:w,onRequestClose:S,...v}=o;const j=v.draggable||y;return jsx(ReactModal,{isOpen:l,ariaHideApp:!1,preventScroll:r,closeTimeoutMS:a,portalClassName:t,className:i,bodyOpenClassName:m,htmlOpenClassName:c,overlayClassName:p,shouldCloseOnOverlayClick:C,shouldCloseOnEsc:d,shouldReturnFocusAfterClose:u,parentSelector:f,overlayRef:g,contentRef:D,onAfterOpen:h,onAfterClose:w,onRequestClose:S,contentElement:o=>{const{ref:l,className:r,tabIndex:a,onKeyDown:t,onMouseDown:i,onMouseUp:m,onClick:c}=o;return jsx(TranslationDialogComponent,{...v,ref:l,size:e,role:s,className:r,tabIndex:a,position:n,"aria-modal":!v.draggable&&!y,palette:{color:N.color,backgroundColor:N.backgroundColor,shadowColor:N.shadowColor},zIndex:j?M:void 0,onKeyDown:o=>{v.onKeyDown&&v.onKeyDown(o),t&&t(o)},onMouseDown:o=>{v.onMouseDown&&v.onMouseDown(o),i&&i(o)},onMouseUp:o=>{v.onMouseUp&&v.onMouseUp(o),m&&m(o)},onClick:o=>{v.onClick&&v.onClick(o),c&&c(o)}})},overlayElement:(o,e)=>{const{ref:n,className:s,onClick:l,onMouseDown:r}=o;return j?e:jsx(DialogOverlay,{ref:n,className:s,blur:O,palette:{backgroundColor:N.overlayBackgroundColor},zIndex:M,onClick:l,onMouseDown:r,children:e})}})}),{sizes:o=>o.fancy?SIZES_FANCY:SIZES,displayName:"Dialog"}),{Component:DialogComponent});export{COMPONENT_NAME,Dialog};
2
2
  //# sourceMappingURL=Dialog.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.mjs","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport ReactModal from 'react-modal'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { withTranslation } from 'hocs/withTranslation'\nimport { DialogComponent, SIZES, SIZES_FANCY } from 'components/DialogComponent'\nimport { deepmerge } from 'shared/utils/misc'\nimport { POSITIONS } from './constants'\nimport * as Styled from './style'\nimport type { DialogProps, TranslationDialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'Dialog'\n\nconst TranslationDialogComponent = withTranslation<HTMLDivElement, TranslationDialogComponentProps>(\n forwardRef((props, ref) => {\n const { positions = {}, translated, ...restProps } = props\n\n const dialogPositions = translated ? {} : deepmerge(POSITIONS, positions)\n\n return <Styled.PositionedDialogComponent {...restProps} positions={dialogPositions} ref={ref} />\n })\n)\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Поддерживаются пропсы определения размеров и позиции в зависимости от ширины вьюпорта.\n *\n * Компонент основан на [\"react-modal\"](https://www.npmjs.com/package/react-modal).\n *\n * Получить доступ к компоненту, не подключенному к библиотеке, можно через Dialog.Component.\n *\n * Полный интерфейс Dialog можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Dialog/types.ts), интерфейс Dialog.Component [тут](https://github.com/foxford/ui/blob/master/src/components/DialogComponent/types.ts).\n *\n */\nconst Dialog: React.ForwardRefExoticComponent<DialogProps> & { Component: typeof DialogComponent } = Object.assign(\n withMergedProps<DialogProps, HTMLDivElement>(\n (props) => {\n const {\n size = 's',\n position = 'center',\n role = 'dialog',\n open,\n preventScrollAfterClose,\n closeTimeoutMS,\n portalClassName,\n className,\n bodyOpenClassName,\n htmlOpenClassName,\n overlayClassName,\n shouldCloseOnOverlayClick,\n shouldCloseOnEsc,\n shouldReturnFocusAfterClose,\n parentSelector,\n overlayRef,\n contentRef,\n palette,\n overlayBlur,\n overlayDisabled,\n zIndex,\n onAfterOpen,\n onAfterClose,\n onRequestClose,\n ...dialogProps\n } = props\n\n const overlayElementDisabled = dialogProps.draggable || overlayDisabled\n\n return (\n <ReactModal\n isOpen={open}\n ariaHideApp={false}\n preventScroll={preventScrollAfterClose}\n closeTimeoutMS={closeTimeoutMS}\n portalClassName={portalClassName}\n className={className}\n bodyOpenClassName={bodyOpenClassName}\n htmlOpenClassName={htmlOpenClassName}\n overlayClassName={overlayClassName}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldCloseOnEsc={shouldCloseOnEsc}\n shouldReturnFocusAfterClose={shouldReturnFocusAfterClose}\n parentSelector={parentSelector}\n overlayRef={overlayRef}\n contentRef={contentRef}\n onAfterOpen={onAfterOpen}\n onAfterClose={onAfterClose}\n onRequestClose={onRequestClose}\n contentElement={(contentProps) => {\n const { ref, className, tabIndex, onKeyDown, onMouseDown, onMouseUp, onClick } = contentProps\n\n return (\n <TranslationDialogComponent\n {...dialogProps}\n ref={ref}\n size={size}\n role={role}\n className={className}\n tabIndex={tabIndex}\n position={position}\n aria-modal={!dialogProps.draggable && !overlayDisabled}\n palette={{\n color: palette.color,\n backgroundColor: palette.backgroundColor,\n shadowColor: palette.shadowColor,\n }}\n zIndex={overlayElementDisabled ? zIndex : undefined}\n onKeyDown={(evt) => {\n if (dialogProps.onKeyDown) dialogProps.onKeyDown(evt)\n if (onKeyDown) onKeyDown(evt)\n }}\n onMouseDown={(evt) => {\n if (dialogProps.onMouseDown) dialogProps.onMouseDown(evt)\n if (onMouseDown) onMouseDown(evt)\n }}\n onMouseUp={(evt) => {\n if (dialogProps.onMouseUp) dialogProps.onMouseUp(evt)\n if (onMouseUp) onMouseUp(evt)\n }}\n onClick={(evt) => {\n if (dialogProps.onClick) dialogProps.onClick(evt)\n if (onClick) onClick(evt)\n }}\n />\n )\n }}\n overlayElement={(overlayProps, contentElement) => {\n const { ref, className, onClick, onMouseDown } = overlayProps\n\n return overlayElementDisabled ? (\n contentElement\n ) : (\n <Styled.DialogOverlay\n ref={ref}\n className={className}\n blur={overlayBlur}\n palette={{\n backgroundColor: palette.overlayBackgroundColor,\n }}\n zIndex={zIndex}\n onClick={onClick}\n onMouseDown={onMouseDown}\n >\n {contentElement}\n </Styled.DialogOverlay>\n )\n }}\n />\n )\n },\n {\n sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n displayName: COMPONENT_NAME,\n }\n ),\n {\n Component: DialogComponent,\n }\n)\n\nexport { Dialog }\n\nexport { COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","TranslationDialogComponent","withTranslation","forwardRef","props","ref","positions","translated","restProps","dialogPositions","deepmerge","POSITIONS","_jsx","Styled","Dialog","Object","assign","withMergedProps","size","position","role","open","preventScrollAfterClose","closeTimeoutMS","portalClassName","className","bodyOpenClassName","htmlOpenClassName","overlayClassName","shouldCloseOnOverlayClick","shouldCloseOnEsc","shouldReturnFocusAfterClose","parentSelector","overlayRef","contentRef","palette","overlayBlur","overlayDisabled","zIndex","onAfterOpen","onAfterClose","onRequestClose","dialogProps","overlayElementDisabled","draggable","ReactModal","isOpen","ariaHideApp","preventScroll","contentElement","contentProps","tabIndex","onKeyDown","onMouseDown","onMouseUp","onClick","color","backgroundColor","shadowColor","undefined","evt","overlayElement","overlayProps","blur","overlayBackgroundColor","children","sizes","fancy","SIZES_FANCY","SIZES","displayName","Component","DialogComponent"],"mappings":"4fAUMA,MAAAA,eAAiB,SAEvB,MAAMC,2BAA6BC,gBACjCC,YAAW,CAACC,EAAOC,KACjB,MAAMC,UAAEA,EAAY,CAAE,EAAAC,WAAEA,KAAeC,GAAcJ,EAErD,MAAMK,EAAkBF,EAAa,CAAA,EAAKG,UAAUC,UAAWL,GAE/D,OAAOM,IAACC,0BAAgC,IAAKL,EAAWF,UAAWG,EAAiBJ,IAAKA,GAAO,KAiB9FS,MAAAA,OAA+FC,OAAOC,OAC1GC,iBACGb,IACC,MAAMc,KACJA,EAAO,IAAGC,SACVA,EAAW,SAAQC,KACnBA,EAAO,SAAQC,KACfA,EAAIC,wBACJA,EAAuBC,eACvBA,EAAcC,gBACdA,EAAeC,UACfA,EAASC,kBACTA,EAAiBC,kBACjBA,EAAiBC,iBACjBA,EAAgBC,0BAChBA,EAAyBC,iBACzBA,EAAgBC,4BAChBA,EAA2BC,eAC3BA,EAAcC,WACdA,EAAUC,WACVA,EAAUC,QACVA,EAAOC,YACPA,EAAWC,gBACXA,EAAeC,OACfA,EAAMC,YACNA,EAAWC,aACXA,EAAYC,eACZA,KACGC,GACDtC,EAEJ,MAAMuC,EAAyBD,EAAYE,WAAaP,EAExD,OACEzB,IAACiC,WAAU,CACTC,OAAQzB,EACR0B,aAAa,EACbC,cAAe1B,EACfC,eAAgBA,EAChBC,gBAAiBA,EACjBC,UAAWA,EACXC,kBAAmBA,EACnBC,kBAAmBA,EACnBC,iBAAkBA,EAClBC,0BAA2BA,EAC3BC,iBAAkBA,EAClBC,4BAA6BA,EAC7BC,eAAgBA,EAChBC,WAAYA,EACZC,WAAYA,EACZK,YAAaA,EACbC,aAAcA,EACdC,eAAgBA,EAChBQ,eAAiBC,IACf,MAAM7C,IAAEA,EAAGoB,UAAEA,EAAS0B,SAAEA,EAAQC,UAAEA,EAASC,YAAEA,EAAWC,UAAEA,EAASC,QAAEA,GAAYL,EAEjF,OACEtC,IAACX,2BAA0B,IACrByC,EACJrC,IAAKA,EACLa,KAAMA,EACNE,KAAMA,EACNK,UAAWA,EACX0B,SAAUA,EACVhC,SAAUA,EACV,cAAauB,EAAYE,YAAcP,EACvCF,QAAS,CACPqB,MAAOrB,EAAQqB,MACfC,gBAAiBtB,EAAQsB,gBACzBC,YAAavB,EAAQuB,aAEvBpB,OAAQK,EAAyBL,OAASqB,EAC1CP,UAAYQ,IACNlB,EAAYU,WAAWV,EAAYU,UAAUQ,GAC7CR,GAAWA,EAAUQ,EAAI,EAE/BP,YAAcO,IACRlB,EAAYW,aAAaX,EAAYW,YAAYO,GACjDP,GAAaA,EAAYO,EAAI,EAEnCN,UAAYM,IACNlB,EAAYY,WAAWZ,EAAYY,UAAUM,GAC7CN,GAAWA,EAAUM,EAAI,EAE/BL,QAAUK,IACJlB,EAAYa,SAASb,EAAYa,QAAQK,GACzCL,GAASA,EAAQK,EAAI,GAE3B,EAGNC,eAAgBA,CAACC,EAAcb,KAC7B,MAAM5C,IAAEA,EAAGoB,UAAEA,EAAS8B,QAAEA,EAAOF,YAAEA,GAAgBS,EAEjD,OAAOnB,EACLM,EAEArC,IAACC,cAAoB,CACnBR,IAAKA,EACLoB,UAAWA,EACXsC,KAAM3B,EACND,QAAS,CACPsB,gBAAiBtB,EAAQ6B,wBAE3B1B,OAAQA,EACRiB,QAASA,EACTF,YAAaA,EAAYY,SAExBhB,GAEJ,GAEH,GAGN,CACEiB,MAAQ9D,GAAWA,EAAM+D,MAAQC,YAAcC,MAC/CC,YA9IiB,WAiJrB,CACEC,UAAWC"}
1
+ {"version":3,"file":"Dialog.mjs","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport ReactModal from 'react-modal'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { withTranslation } from 'hocs/withTranslation'\nimport { DialogComponent } from 'components/DialogComponent'\nimport { deepmerge } from 'shared/utils/misc'\nimport { SIZES, SIZES_FANCY } from './sizes'\nimport { POSITIONS } from './positions'\nimport * as Styled from './style'\nimport type { DialogProps, TranslationDialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'Dialog'\n\nconst TranslationDialogComponent = withTranslation<HTMLDivElement, TranslationDialogComponentProps>(\n forwardRef((props, ref) => {\n const { positions = {}, translated, ...restProps } = props\n\n const dialogPositions = translated ? {} : deepmerge(POSITIONS, positions)\n\n return <Styled.PositionedDialogComponent {...restProps} positions={dialogPositions} ref={ref} />\n })\n)\n\n/**\n *\n * Компонент для отображения контента поверх основного интерфейса.\n *\n * Поддерживаются все нативные атрибуты \\<div\\> элемента.\n */\nconst Dialog: React.ForwardRefExoticComponent<DialogProps> & { Component: typeof DialogComponent } = Object.assign(\n withMergedProps<DialogProps, HTMLDivElement>(\n (props) => {\n const {\n size = 's',\n position = 'center',\n role = 'dialog',\n open,\n preventScrollAfterClose,\n closeTimeoutMS,\n portalClassName,\n className,\n bodyOpenClassName,\n htmlOpenClassName,\n overlayClassName,\n shouldCloseOnOverlayClick,\n shouldCloseOnEsc,\n shouldReturnFocusAfterClose,\n parentSelector,\n overlayRef,\n contentRef,\n palette,\n overlayBlur,\n overlayDisabled,\n zIndex,\n onAfterOpen,\n onAfterClose,\n onRequestClose,\n ...dialogProps\n } = props\n\n const overlayElementDisabled = dialogProps.draggable || overlayDisabled\n\n return (\n <ReactModal\n isOpen={open}\n ariaHideApp={false}\n preventScroll={preventScrollAfterClose}\n closeTimeoutMS={closeTimeoutMS}\n portalClassName={portalClassName}\n className={className}\n bodyOpenClassName={bodyOpenClassName}\n htmlOpenClassName={htmlOpenClassName}\n overlayClassName={overlayClassName}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n shouldCloseOnEsc={shouldCloseOnEsc}\n shouldReturnFocusAfterClose={shouldReturnFocusAfterClose}\n parentSelector={parentSelector}\n overlayRef={overlayRef}\n contentRef={contentRef}\n onAfterOpen={onAfterOpen}\n onAfterClose={onAfterClose}\n onRequestClose={onRequestClose}\n contentElement={(contentProps) => {\n const { ref, className, tabIndex, onKeyDown, onMouseDown, onMouseUp, onClick } = contentProps\n\n return (\n <TranslationDialogComponent\n {...dialogProps}\n ref={ref}\n size={size}\n role={role}\n className={className}\n tabIndex={tabIndex}\n position={position}\n aria-modal={!dialogProps.draggable && !overlayDisabled}\n palette={{\n color: palette.color,\n backgroundColor: palette.backgroundColor,\n shadowColor: palette.shadowColor,\n }}\n zIndex={overlayElementDisabled ? zIndex : undefined}\n onKeyDown={(evt) => {\n if (dialogProps.onKeyDown) dialogProps.onKeyDown(evt)\n if (onKeyDown) onKeyDown(evt)\n }}\n onMouseDown={(evt) => {\n if (dialogProps.onMouseDown) dialogProps.onMouseDown(evt)\n if (onMouseDown) onMouseDown(evt)\n }}\n onMouseUp={(evt) => {\n if (dialogProps.onMouseUp) dialogProps.onMouseUp(evt)\n if (onMouseUp) onMouseUp(evt)\n }}\n onClick={(evt) => {\n if (dialogProps.onClick) dialogProps.onClick(evt)\n if (onClick) onClick(evt)\n }}\n />\n )\n }}\n overlayElement={(overlayProps, contentElement) => {\n const { ref, className, onClick, onMouseDown } = overlayProps\n\n return overlayElementDisabled ? (\n contentElement\n ) : (\n <Styled.DialogOverlay\n ref={ref}\n className={className}\n blur={overlayBlur}\n palette={{\n backgroundColor: palette.overlayBackgroundColor,\n }}\n zIndex={zIndex}\n onClick={onClick}\n onMouseDown={onMouseDown}\n >\n {contentElement}\n </Styled.DialogOverlay>\n )\n }}\n />\n )\n },\n {\n sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n displayName: COMPONENT_NAME,\n }\n ),\n {\n Component: DialogComponent,\n }\n)\n\nexport { Dialog }\n\nexport { COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","TranslationDialogComponent","withTranslation","forwardRef","props","ref","positions","translated","restProps","dialogPositions","deepmerge","POSITIONS","_jsx","Styled","Dialog","Object","assign","withMergedProps","size","position","role","open","preventScrollAfterClose","closeTimeoutMS","portalClassName","className","bodyOpenClassName","htmlOpenClassName","overlayClassName","shouldCloseOnOverlayClick","shouldCloseOnEsc","shouldReturnFocusAfterClose","parentSelector","overlayRef","contentRef","palette","overlayBlur","overlayDisabled","zIndex","onAfterOpen","onAfterClose","onRequestClose","dialogProps","overlayElementDisabled","draggable","ReactModal","isOpen","ariaHideApp","preventScroll","contentElement","contentProps","tabIndex","onKeyDown","onMouseDown","onMouseUp","onClick","color","backgroundColor","shadowColor","undefined","evt","overlayElement","overlayProps","blur","overlayBackgroundColor","children","sizes","fancy","SIZES_FANCY","SIZES","displayName","Component","DialogComponent"],"mappings":"ueAWMA,MAAAA,eAAiB,SAEvB,MAAMC,2BAA6BC,gBACjCC,YAAW,CAACC,EAAOC,KACjB,MAAMC,UAAEA,EAAY,CAAE,EAAAC,WAAEA,KAAeC,GAAcJ,EAErD,MAAMK,EAAkBF,EAAa,CAAA,EAAKG,UAAUC,UAAWL,GAE/D,OAAOM,IAACC,0BAAgC,IAAKL,EAAWF,UAAWG,EAAiBJ,IAAKA,GAAO,KAU9FS,MAAAA,OAA+FC,OAAOC,OAC1GC,iBACGb,IACC,MAAMc,KACJA,EAAO,IAAGC,SACVA,EAAW,SAAQC,KACnBA,EAAO,SAAQC,KACfA,EAAIC,wBACJA,EAAuBC,eACvBA,EAAcC,gBACdA,EAAeC,UACfA,EAASC,kBACTA,EAAiBC,kBACjBA,EAAiBC,iBACjBA,EAAgBC,0BAChBA,EAAyBC,iBACzBA,EAAgBC,4BAChBA,EAA2BC,eAC3BA,EAAcC,WACdA,EAAUC,WACVA,EAAUC,QACVA,EAAOC,YACPA,EAAWC,gBACXA,EAAeC,OACfA,EAAMC,YACNA,EAAWC,aACXA,EAAYC,eACZA,KACGC,GACDtC,EAEJ,MAAMuC,EAAyBD,EAAYE,WAAaP,EAExD,OACEzB,IAACiC,WAAU,CACTC,OAAQzB,EACR0B,aAAa,EACbC,cAAe1B,EACfC,eAAgBA,EAChBC,gBAAiBA,EACjBC,UAAWA,EACXC,kBAAmBA,EACnBC,kBAAmBA,EACnBC,iBAAkBA,EAClBC,0BAA2BA,EAC3BC,iBAAkBA,EAClBC,4BAA6BA,EAC7BC,eAAgBA,EAChBC,WAAYA,EACZC,WAAYA,EACZK,YAAaA,EACbC,aAAcA,EACdC,eAAgBA,EAChBQ,eAAiBC,IACf,MAAM7C,IAAEA,EAAGoB,UAAEA,EAAS0B,SAAEA,EAAQC,UAAEA,EAASC,YAAEA,EAAWC,UAAEA,EAASC,QAAEA,GAAYL,EAEjF,OACEtC,IAACX,2BAA0B,IACrByC,EACJrC,IAAKA,EACLa,KAAMA,EACNE,KAAMA,EACNK,UAAWA,EACX0B,SAAUA,EACVhC,SAAUA,EACV,cAAauB,EAAYE,YAAcP,EACvCF,QAAS,CACPqB,MAAOrB,EAAQqB,MACfC,gBAAiBtB,EAAQsB,gBACzBC,YAAavB,EAAQuB,aAEvBpB,OAAQK,EAAyBL,OAASqB,EAC1CP,UAAYQ,IACNlB,EAAYU,WAAWV,EAAYU,UAAUQ,GAC7CR,GAAWA,EAAUQ,EAAI,EAE/BP,YAAcO,IACRlB,EAAYW,aAAaX,EAAYW,YAAYO,GACjDP,GAAaA,EAAYO,EAAI,EAEnCN,UAAYM,IACNlB,EAAYY,WAAWZ,EAAYY,UAAUM,GAC7CN,GAAWA,EAAUM,EAAI,EAE/BL,QAAUK,IACJlB,EAAYa,SAASb,EAAYa,QAAQK,GACzCL,GAASA,EAAQK,EAAI,GAE3B,EAGNC,eAAgBA,CAACC,EAAcb,KAC7B,MAAM5C,IAAEA,EAAGoB,UAAEA,EAAS8B,QAAEA,EAAOF,YAAEA,GAAgBS,EAEjD,OAAOnB,EACLM,EAEArC,IAACC,cAAoB,CACnBR,IAAKA,EACLoB,UAAWA,EACXsC,KAAM3B,EACND,QAAS,CACPsB,gBAAiBtB,EAAQ6B,wBAE3B1B,OAAQA,EACRiB,QAASA,EACTF,YAAaA,EAAYY,SAExBhB,GAEJ,GAEH,GAGN,CACEiB,MAAQ9D,GAAWA,EAAM+D,MAAQC,YAAcC,MAC/CC,YAvIiB,WA0IrB,CACEC,UAAWC"}
@@ -1,2 +1,2 @@
1
1
  'use strict';exports.POSITIONS={center:{top:'50%',right:'auto',bottom:'auto',left:'50%',transform:'translate(-50%, -50%)'},'top-center':{top:'5vh',right:'auto',bottom:'auto',left:'50%',transform:'translate(-50%, 0px)'},'bottom-left':{top:'auto',right:'auto',bottom:'5vh',left:'5vh',transform:'translate(0px, 0px)'},'bottom-right':{top:'auto',right:'5vh',bottom:'5vh',left:'auto',transform:'translate(0px, 0px)'},'bottom-center':{top:'auto',right:'auto',bottom:'0px',left:'50%',transform:'translate(-50%, 0px)'}};
2
- //# sourceMappingURL=constants.js.map
2
+ //# sourceMappingURL=positions.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"positions.js","sources":["../../../../src/components/Dialog/positions.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Position } from './types'\n\nexport const POSITIONS: Record<Position, CSSProperties> = {\n center: {\n top: '50%',\n right: 'auto',\n bottom: 'auto',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n },\n 'top-center': {\n top: '5vh',\n right: 'auto',\n bottom: 'auto',\n left: '50%',\n transform: 'translate(-50%, 0px)',\n },\n 'bottom-left': {\n top: 'auto',\n right: 'auto',\n bottom: '5vh',\n left: '5vh',\n transform: 'translate(0px, 0px)',\n },\n 'bottom-right': {\n top: 'auto',\n right: '5vh',\n bottom: '5vh',\n left: 'auto',\n transform: 'translate(0px, 0px)',\n },\n 'bottom-center': {\n top: 'auto',\n right: 'auto',\n bottom: '0px',\n left: '50%',\n transform: 'translate(-50%, 0px)',\n },\n}\n"],"names":["center","top","right","bottom","left","transform"],"mappings":"+BAG0D,CACxDA,OAAQ,CACNC,IAAK,MACLC,MAAO,OACPC,OAAQ,OACRC,KAAM,MACNC,UAAW,yBAEb,aAAc,CACZJ,IAAK,MACLC,MAAO,OACPC,OAAQ,OACRC,KAAM,MACNC,UAAW,wBAEb,cAAe,CACbJ,IAAK,OACLC,MAAO,OACPC,OAAQ,MACRC,KAAM,MACNC,UAAW,uBAEb,eAAgB,CACdJ,IAAK,OACLC,MAAO,MACPC,OAAQ,MACRC,KAAM,OACNC,UAAW,uBAEb,gBAAiB,CACfJ,IAAK,OACLC,MAAO,OACPC,OAAQ,MACRC,KAAM,MACNC,UAAW"}
@@ -1,2 +1,2 @@
1
1
  const POSITIONS={center:{top:'50%',right:'auto',bottom:'auto',left:'50%',transform:'translate(-50%, -50%)'},'top-center':{top:'5vh',right:'auto',bottom:'auto',left:'50%',transform:'translate(-50%, 0px)'},'bottom-left':{top:'auto',right:'auto',bottom:'5vh',left:'5vh',transform:'translate(0px, 0px)'},'bottom-right':{top:'auto',right:'5vh',bottom:'5vh',left:'auto',transform:'translate(0px, 0px)'},'bottom-center':{top:'auto',right:'auto',bottom:'0px',left:'50%',transform:'translate(-50%, 0px)'}};export{POSITIONS};
2
- //# sourceMappingURL=constants.mjs.map
2
+ //# sourceMappingURL=positions.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"positions.mjs","sources":["../../../../src/components/Dialog/positions.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Position } from './types'\n\nexport const POSITIONS: Record<Position, CSSProperties> = {\n center: {\n top: '50%',\n right: 'auto',\n bottom: 'auto',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n },\n 'top-center': {\n top: '5vh',\n right: 'auto',\n bottom: 'auto',\n left: '50%',\n transform: 'translate(-50%, 0px)',\n },\n 'bottom-left': {\n top: 'auto',\n right: 'auto',\n bottom: '5vh',\n left: '5vh',\n transform: 'translate(0px, 0px)',\n },\n 'bottom-right': {\n top: 'auto',\n right: '5vh',\n bottom: '5vh',\n left: 'auto',\n transform: 'translate(0px, 0px)',\n },\n 'bottom-center': {\n top: 'auto',\n right: 'auto',\n bottom: '0px',\n left: '50%',\n transform: 'translate(-50%, 0px)',\n },\n}\n"],"names":["POSITIONS","center","top","right","bottom","left","transform"],"mappings":"AAGO,MAAMA,UAA6C,CACxDC,OAAQ,CACNC,IAAK,MACLC,MAAO,OACPC,OAAQ,OACRC,KAAM,MACNC,UAAW,yBAEb,aAAc,CACZJ,IAAK,MACLC,MAAO,OACPC,OAAQ,OACRC,KAAM,MACNC,UAAW,wBAEb,cAAe,CACbJ,IAAK,OACLC,MAAO,OACPC,OAAQ,MACRC,KAAM,MACNC,UAAW,uBAEb,eAAgB,CACdJ,IAAK,OACLC,MAAO,MACPC,OAAQ,MACRC,KAAM,OACNC,UAAW,uBAEb,gBAAiB,CACfJ,IAAK,OACLC,MAAO,OACPC,OAAQ,MACRC,KAAM,MACNC,UAAW"}
@@ -0,0 +1,2 @@
1
+ 'use strict';var sizes=require('../DialogComponent/sizes.js');const SIZES={xxl:{...sizes.SIZES.xxl,width:'100vw'},xl:{...sizes.SIZES.xl,width:'100vw'},l:{...sizes.SIZES.l,width:'100vw'},m:{...sizes.SIZES.m,width:'100vw'},s:{...sizes.SIZES.s,width:'100vw'},xs:{...sizes.SIZES.xs,width:'100vw'}};const SIZES_FANCY={xxl:{...sizes.SIZES_FANCY.xxl,width:'100vw'},xl:{...sizes.SIZES_FANCY.xl,width:'100vw'},l:{...sizes.SIZES_FANCY.l,width:'100vw'},m:{...sizes.SIZES_FANCY.m,width:'100vw'},s:{...sizes.SIZES_FANCY.s,width:'100vw'},xs:{...sizes.SIZES_FANCY.xs,width:'100vw'}};exports.SIZES=SIZES,exports.SIZES_FANCY=SIZES_FANCY;
2
+ //# sourceMappingURL=sizes.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"sizes.js","sources":["../../../../src/components/Dialog/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport {\n SIZES as SIZES_DIALOG_COMPONENT,\n SIZES_FANCY as SIZES_FANCY_DIALOG_COMPONENT,\n} from 'components/DialogComponent'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n xxl: { ...SIZES_DIALOG_COMPONENT.xxl, width: '100vw' },\n xl: { ...SIZES_DIALOG_COMPONENT.xl, width: '100vw' },\n l: { ...SIZES_DIALOG_COMPONENT.l, width: '100vw' },\n m: { ...SIZES_DIALOG_COMPONENT.m, width: '100vw' },\n s: { ...SIZES_DIALOG_COMPONENT.s, width: '100vw' },\n xs: { ...SIZES_DIALOG_COMPONENT.xs, width: '100vw' },\n}\n\nexport const SIZES_FANCY: Record<Size, CSSProperties> = {\n xxl: { ...SIZES_FANCY_DIALOG_COMPONENT.xxl, width: '100vw' },\n xl: { ...SIZES_FANCY_DIALOG_COMPONENT.xl, width: '100vw' },\n l: { ...SIZES_FANCY_DIALOG_COMPONENT.l, width: '100vw' },\n m: { ...SIZES_FANCY_DIALOG_COMPONENT.m, width: '100vw' },\n s: { ...SIZES_FANCY_DIALOG_COMPONENT.s, width: '100vw' },\n xs: { ...SIZES_FANCY_DIALOG_COMPONENT.xs, width: '100vw' },\n}\n"],"names":["SIZES","xxl","SIZES_DIALOG_COMPONENT","width","xl","l","m","s","xs","SIZES_FANCY","SIZES_FANCY_DIALOG_COMPONENT"],"mappings":"8DAOO,MAAMA,MAAqC,CAChDC,IAAK,IAAKC,MAAsBF,MAACC,IAAKE,MAAO,SAC7CC,GAAI,IAAKF,MAAsBF,MAACI,GAAID,MAAO,SAC3CE,EAAG,IAAKH,MAAsBF,MAACK,EAAGF,MAAO,SACzCG,EAAG,IAAKJ,MAAsBF,MAACM,EAAGH,MAAO,SACzCI,EAAG,IAAKL,MAAsBF,MAACO,EAAGJ,MAAO,SACzCK,GAAI,IAAKN,MAAsBF,MAACQ,GAAIL,MAAO,UAGtC,MAAMM,YAA2C,CACtDR,IAAK,IAAKS,MAA4BD,YAACR,IAAKE,MAAO,SACnDC,GAAI,IAAKM,MAA4BD,YAACL,GAAID,MAAO,SACjDE,EAAG,IAAKK,MAA4BD,YAACJ,EAAGF,MAAO,SAC/CG,EAAG,IAAKI,MAA4BD,YAACH,EAAGH,MAAO,SAC/CI,EAAG,IAAKG,MAA4BD,YAACF,EAAGJ,MAAO,SAC/CK,GAAI,IAAKE,MAA4BD,YAACD,GAAIL,MAAO"}
@@ -0,0 +1,2 @@
1
+ import{SIZES as SIZES$1,SIZES_FANCY as SIZES_FANCY$1}from'../DialogComponent/sizes.mjs';const SIZES={xxl:{...SIZES$1.xxl,width:'100vw'},xl:{...SIZES$1.xl,width:'100vw'},l:{...SIZES$1.l,width:'100vw'},m:{...SIZES$1.m,width:'100vw'},s:{...SIZES$1.s,width:'100vw'},xs:{...SIZES$1.xs,width:'100vw'}};const SIZES_FANCY={xxl:{...SIZES_FANCY$1.xxl,width:'100vw'},xl:{...SIZES_FANCY$1.xl,width:'100vw'},l:{...SIZES_FANCY$1.l,width:'100vw'},m:{...SIZES_FANCY$1.m,width:'100vw'},s:{...SIZES_FANCY$1.s,width:'100vw'},xs:{...SIZES_FANCY$1.xs,width:'100vw'}};export{SIZES,SIZES_FANCY};
2
+ //# sourceMappingURL=sizes.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"sizes.mjs","sources":["../../../../src/components/Dialog/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport {\n SIZES as SIZES_DIALOG_COMPONENT,\n SIZES_FANCY as SIZES_FANCY_DIALOG_COMPONENT,\n} from 'components/DialogComponent'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n xxl: { ...SIZES_DIALOG_COMPONENT.xxl, width: '100vw' },\n xl: { ...SIZES_DIALOG_COMPONENT.xl, width: '100vw' },\n l: { ...SIZES_DIALOG_COMPONENT.l, width: '100vw' },\n m: { ...SIZES_DIALOG_COMPONENT.m, width: '100vw' },\n s: { ...SIZES_DIALOG_COMPONENT.s, width: '100vw' },\n xs: { ...SIZES_DIALOG_COMPONENT.xs, width: '100vw' },\n}\n\nexport const SIZES_FANCY: Record<Size, CSSProperties> = {\n xxl: { ...SIZES_FANCY_DIALOG_COMPONENT.xxl, width: '100vw' },\n xl: { ...SIZES_FANCY_DIALOG_COMPONENT.xl, width: '100vw' },\n l: { ...SIZES_FANCY_DIALOG_COMPONENT.l, width: '100vw' },\n m: { ...SIZES_FANCY_DIALOG_COMPONENT.m, width: '100vw' },\n s: { ...SIZES_FANCY_DIALOG_COMPONENT.s, width: '100vw' },\n xs: { ...SIZES_FANCY_DIALOG_COMPONENT.xs, width: '100vw' },\n}\n"],"names":["SIZES","xxl","SIZES_DIALOG_COMPONENT","width","xl","l","m","s","xs","SIZES_FANCY","SIZES_FANCY_DIALOG_COMPONENT"],"mappings":"wFAOO,MAAMA,MAAqC,CAChDC,IAAK,IAAKC,QAAuBD,IAAKE,MAAO,SAC7CC,GAAI,IAAKF,QAAuBE,GAAID,MAAO,SAC3CE,EAAG,IAAKH,QAAuBG,EAAGF,MAAO,SACzCG,EAAG,IAAKJ,QAAuBI,EAAGH,MAAO,SACzCI,EAAG,IAAKL,QAAuBK,EAAGJ,MAAO,SACzCK,GAAI,IAAKN,QAAuBM,GAAIL,MAAO,UAGtC,MAAMM,YAA2C,CACtDR,IAAK,IAAKS,cAA6BT,IAAKE,MAAO,SACnDC,GAAI,IAAKM,cAA6BN,GAAID,MAAO,SACjDE,EAAG,IAAKK,cAA6BL,EAAGF,MAAO,SAC/CG,EAAG,IAAKI,cAA6BJ,EAAGH,MAAO,SAC/CI,EAAG,IAAKG,cAA6BH,EAAGJ,MAAO,SAC/CK,GAAI,IAAKE,cAA6BF,GAAIL,MAAO"}
@@ -1,2 +1,2 @@
1
- 'use strict';var React=require('react');var ResizeObserver=require('resize-observer-polyfill');var withMergedProps=require('../../hocs/withMergedProps.js');var constants$1=require('../../shared/constants.js');var dom=require('../../shared/utils/dom.js');var DialogContainer=require('./DialogContainer.js');var ProgressLineContainer=require('./ProgressLineContainer.js');var dragging=require('./images/dragging.svg.js');var style=require('./style.js');var utils=require('./utils.js');var constants=require('./constants.js');var jsxRuntime=require('react/jsx-runtime');var Visibility=require('../Visibility/Visibility.js');var Spacer=require('../Spacer/Spacer.js');var Icon=require('../Icon/Icon.js');var ProgressLine=require('../ProgressLine/ProgressLine.js');var Skeleton=require('../Skeleton/Skeleton.js');var Text=require('../Text/Text.js');var Button=require('../Button/Button.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var ResizeObserver__default=_interopDefault(ResizeObserver);const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver__default.default((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const DialogComponent=withMergedProps.withMergedProps(React.forwardRef(((e,s)=>{const{size:t="s",iconButtonProps:i={},captionProps:n={},titleProps:r={},subtitleProps:o={},draggingIconProps:a={},imgSrc:l={},imgAspectRatio:c={},skeletonProps:x={},progressLineProps:d={},fancy:j,floats:u,children:m,caption:g,title:R,subtitle:p,controls:y,imgLandscapePositionRight:S,imgPortraitPositionBottom:h,className:I,backgroundClassName:b,scrollFadingDisabled:z,draggable:P,loading:T,progressLine:L,sizeXXS:v,sizeXS:f,sizeS:k,sizeM:C,sizeL:B,sizeXL:D,onGrab:w,onNudge:E,..._}=e;const M={size:t,sizeXXS:v,sizeXS:f,sizeS:k,sizeM:C,sizeL:B,sizeXL:D};const V=utils.getCommonSizeProps(M);const q=j?I:dom.concatClassNames(I,b);const[A,N]=React.useState(null);const[Z,O]=React.useState(null);const H=React.useRef(null);const Y=React.useCallback((e=>{e.scrollHeight===e.clientHeight?(N(null),O(null)):(N(e.scrollTop<=0),O(Math.abs(e.scrollHeight-e.clientHeight-e.scrollTop)<=1))}),[]);return React.useLayoutEffect((()=>{const e=H.current;return!z&&e&&(e[resizeHandlerSymbol]=Y,resizeObserver.observe(e)),()=>{e&&resizeObserver.unobserve(e)}}),[Y,z]),jsxRuntime.jsxs(style.Root,{..._,...M,className:q,fancy:j,ref:s,children:[u&&u(V),j&&jsxRuntime.jsx(style.FancyBackground,{className:b}),j&&i.onClick&&jsxRuntime.jsx(style.PositionedIconButton,{secondary:!0,size:"xxl",icon:"close",inset:{top:0,right:0},...i}),(P||l.portrait&&!h||j)&&jsxRuntime.jsxs(Visibility.Visibility,{...M,sizes:constants.VISIBILITY_PORTRAIT,children:[j&&jsxRuntime.jsx(Spacer.Spacer,{top:96}),P&&jsxRuntime.jsx(style.DraggingHandle,{onPointerDown:w,children:jsxRuntime.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:E,children:jsxRuntime.jsx(Icon.Icon,{icon:jsxRuntime.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary",...a})})}),l.portrait&&!h&&jsxRuntime.jsx(style.MediaPortraitContainer,{top:!j,children:jsxRuntime.jsxs(style.MediaPortrait,{children:[jsxRuntime.jsx(style.Placeholder,{orientation:"portrait",aspectRatio:c.portrait??'3:1'}),T?jsxRuntime.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...x}):jsxRuntime.jsx(style.Media,{src:l.portrait})]})})]}),l.landscape&&!S&&jsxRuntime.jsx(Visibility.Visibility,{...M,sizes:constants.VISIBILITY_LANDSCAPE_MEDIA,children:jsxRuntime.jsxs(style.MediaLandscape,{children:[jsxRuntime.jsx(style.Placeholder,{orientation:"landscape",aspectRatio:c.landscape??'5:7'}),T?jsxRuntime.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...x}):jsxRuntime.jsx(style.Media,{src:l.landscape})]})}),!j&&i.onClick&&jsxRuntime.jsx(style.PositionedIconButton,{size:"l",icon:"close",inset:{top:8,right:8},...i}),jsxRuntime.jsxs(DialogContainer.DialogContainer,{...M,fancy:j,children:[L&&!T&&jsxRuntime.jsx(Visibility.Visibility,{...M,sizes:constants.VISIBILITY_PORTRAIT,children:j||l.portrait&&!h?jsxRuntime.jsx(style.PositionedProgressLine,{size:"xs",...d,inset:{top:0,right:0,left:0}}):jsxRuntime.jsx(ProgressLineContainer.ProgressLineContainer,{...M,inset:{top:0,right:0,left:0},children:jsxRuntime.jsx(ProgressLine.ProgressLine,{size:"xs",...d})})}),(L&&!T||P)&&jsxRuntime.jsxs(Visibility.Visibility,{...M,sizes:constants.VISIBILITY_LANDSCAPE,children:[L&&!T&&jsxRuntime.jsx(ProgressLineContainer.ProgressLineContainer,{...M,inset:j?{right:0,bottom:0,left:0}:{top:0,right:0,left:0},children:jsxRuntime.jsx(ProgressLine.ProgressLine,{size:"xs",...d})}),P&&jsxRuntime.jsx(style.DraggingHandle,{onPointerDown:w,children:jsxRuntime.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:E,children:jsxRuntime.jsx(Icon.Icon,{icon:jsxRuntime.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary",...a})})})]}),!z&&jsxRuntime.jsx(style.Fading,{visible:A===!1}),jsxRuntime.jsx(style.ScrollableContent,{ref:H,tabIndex:0,onScroll:e=>{z||Y(e.currentTarget)},onKeyDown:e=>{constants$1.keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):constants$1.keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:jsxRuntime.jsxs(jsxRuntime.Fragment,T?{children:[jsxRuntime.jsx(Skeleton.Skeleton,{children:jsxRuntime.jsx(Text.Text,{appearance:"heading",marginBottom:"1.5em",sizes:constants.SIZES_TITLE,...V,...r})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"90%",children:jsxRuntime.jsx(Text.Text,{appearance:"body",marginBottom:"0.4em",sizes:constants.SIZES_SUBTITLE,...V,...o})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"70%",children:jsxRuntime.jsx(Text.Text,{appearance:"body",marginBottom:"0.4em",sizes:constants.SIZES_SUBTITLE,...V,...o})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"50%",children:jsxRuntime.jsx(Text.Text,{appearance:"body",marginBottom:"0.8em",sizes:constants.SIZES_SUBTITLE,...V,...o})})]}:{children:[g&&jsxRuntime.jsx(Text.Text,{appearance:"body",color:"content-onmain-tertiary",wordBreak:"break-word",marginBottom:"0.8em",sizes:constants.SIZES_CAPTION,...V,...n,children:g}),R&&jsxRuntime.jsx(Text.Text,{as:"h2",appearance:"heading",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.5em",sizes:constants.SIZES_TITLE,...V,...r,children:R}),p&&jsxRuntime.jsx(Text.Text,{as:"p",appearance:"body",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.8em",sizes:constants.SIZES_SUBTITLE,...V,...o,children:p}),typeof m=='function'?m(V):m]})}),!z&&jsxRuntime.jsx(style.Fading,{visible:Z===!1,after:!0}),y&&jsxRuntime.jsx(style.Controls,{children:T?jsxRuntime.jsx(Skeleton.Skeleton,{borderRadius:48,...x,children:jsxRuntime.jsx(Button.Button,{preset:"brand",...V})}):y(V)})]}),l.landscape&&S&&jsxRuntime.jsx(Visibility.Visibility,{...M,sizes:constants.VISIBILITY_LANDSCAPE_MEDIA,children:jsxRuntime.jsxs(style.MediaLandscape,{right:!0,children:[jsxRuntime.jsx(style.Placeholder,{orientation:"landscape",aspectRatio:c.landscape??'5:7'}),T?jsxRuntime.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...x}):jsxRuntime.jsx(style.Media,{src:l.landscape})]})}),l.portrait&&h&&jsxRuntime.jsx(Visibility.Visibility,{...M,sizes:constants.VISIBILITY_PORTRAIT,children:jsxRuntime.jsx(style.MediaPortraitContainer,{bottom:!0,children:jsxRuntime.jsxs(style.MediaPortrait,{children:[jsxRuntime.jsx(style.Placeholder,{orientation:"portrait",aspectRatio:c.portrait??'3:1'}),T?jsxRuntime.jsx(style.MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...x}):jsxRuntime.jsx(style.Media,{src:l.portrait})]})})})]})})),{sizes:e=>e.fancy?constants.SIZES_FANCY:constants.SIZES,displayName:'DialogComponent'});exports.SIZES=constants.SIZES,exports.SIZES_FANCY=constants.SIZES_FANCY,exports.DialogComponent=DialogComponent;
1
+ 'use strict';var React=require('react');var ResizeObserver=require('resize-observer-polyfill');var withMergedProps=require('../../hocs/withMergedProps.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 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');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var ResizeObserver__default=_interopDefault(ResizeObserver);const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver__default.default((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const DialogComponent=withMergedProps.withMergedProps(React.forwardRef(((e,t)=>{const{size:s="s",layout:n="vertical",sizeXXS:i,sizeXS:o,sizeS:r,sizeM:a,sizeL:l,sizeXL:c,layoutXXS:u,layoutXS:m,layoutS:x,layoutM:d,layoutL:y,layoutXL:j,root:R,floats:g,media:S,body:p,caption:h,title:z,subtitle:T,children:I,footer:f,closeButton:b,progressLine:A,fancy:E,imgSrcVertical:v,imgSrcHorizontal:_,scrollable:L,scrollFading:O,draggable:k,loading:w,className:C,backgroundClassName:N,onGrab:B,onNudge:D,...P}=e;const V={size:s,sizeXXS:i,sizeXS:o,sizeS:r,sizeM:a,sizeL:l,sizeXL:c};const X={layout:n,layoutXXS:u,layoutXS:m,layoutS:x,layoutM:d,layoutL:y,layoutXL:j};const M={...V,appearance:'body',color:'content-onmain-tertiary',wordBreak:'break-word',marginBottom:'0.8em',sizes:sizes.SIZES_CAPTION};const q={...V,as:'h2',appearance:'heading',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.5em',sizes:sizes.SIZES_TITLE};const H={...V,as:'p',appearance:'body',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.8em',sizes:sizes.SIZES_SUBTITLE};const Y=E?{icon:'close',size:'xxl',secondary:!0}:{icon:'close',size:'l',marginTop:8,marginRight:8};const Z={size:'xs'};const F=E?C:dom.concatClassNames(C,N);const U=L&&O;const[K,G]=React.useState(null);const[J,Q]=React.useState(null);const[W,$]=React.useState(null);const ee=React.useCallback((e=>{e.scrollHeight===e.clientHeight?(G(null),Q(null)):(G(e.scrollTop<=0),Q(Math.abs(e.scrollHeight-e.clientHeight-e.scrollTop)<=1))}),[]);return React.useLayoutEffect((()=>(W&&U&&(W[resizeHandlerSymbol]=ee,resizeObserver.observe(W)),()=>{W&&resizeObserver.unobserve(W)})),[W,U,ee]),jsxRuntime.jsxs(style.Root,{...P,...V,...X,layouts:E?layouts.LAYOUTS_FANCY:layouts.LAYOUTS,className:F,fancy:E,ref:t,children:[E&&jsxRuntime.jsx(style.FancyBackground,{className:N}),React.isValidElement(R)?R:typeof R=='function'?R({captionProps:M,titleProps:q,subtitleProps:H,closeButtonProps:Y,progressLineProps:Z,onGrab:B,onNudge:D}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[g,k&&jsxRuntime.jsx(style.DraggingHandle,{...X,layouts:layouts.VISIBILITY_VERTICAL,onPointerDown:B,children:jsxRuntime.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:D,children:jsxRuntime.jsx(Icon.Icon,{icon:jsxRuntime.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary"})})}),b&&jsxRuntime.jsx(style.ButtonPosition,{children:React.isValidElement(b)?b:typeof b=='function'?b(Y):null}),(w||S||v)&&jsxRuntime.jsx(style.Media,{...X,layouts:E?layouts.LAYOUTS_FANCY_MEDIA_VERTICAL:layouts.LAYOUTS_MEDIA_VERTICAL,children:w?jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"3:1",width:"100%",children:jsxRuntime.jsx(Skeleton.Skeleton,{borderRadius:0})}):React.isValidElement(S)?S:jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"3:1",width:"100%",children:jsxRuntime.jsx(style.Img,{src:v})})}),(w||S||_)&&jsxRuntime.jsx(style.Media,{...X,layouts:layouts.LAYOUTS_MEDIA_HORIZONTAL,children:w?jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"5:7",height:"100%",children:jsxRuntime.jsx(Skeleton.Skeleton,{borderRadius:0})}):React.isValidElement(S)?S:jsxRuntime.jsx(AspectRatio.AspectRatio,{ratio:"5:7",height:"100%",children:jsxRuntime.jsx(style.Img,{src:_})})}),jsxRuntime.jsxs(style.Body,{children:[A&&!w&&jsxRuntime.jsx(style.ProgressPosition,{...X,layouts:E?layouts.LAYOUTS_FANCY_PROGRESS:layouts.LAYOUTS_PROGRESS,children:React.isValidElement(A)?A:typeof A=='function'?A(Z):null}),k&&jsxRuntime.jsx(style.DraggingHandle,{...X,layouts:layouts.VISIBILITY_HORIZONTAL,onPointerDown:B,children:jsxRuntime.jsx(style.DraggingIconContainer,{tabIndex:0,onKeyDown:D,children:jsxRuntime.jsx(Icon.Icon,{icon:jsxRuntime.jsx(dragging.default,{}),size:34,color:"content-onmain-tertiary"})})}),E&&jsxRuntime.jsx(style.LayoutSpacer,{...X,layouts:layouts.VISIBILITY_HORIZONTAL,paddingTop:76}),w?jsxRuntime.jsx(style.Container,{...V,sizes:sizes.SIZES_CONTAINER,children:jsxRuntime.jsxs(style.Content,{...V,sizes:sizes.SIZES_CONTENT,children:[jsxRuntime.jsx(Skeleton.Skeleton,{children:jsxRuntime.jsx(Text.Text,{...q,marginBottom:"1.5em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"90%",children:jsxRuntime.jsx(Text.Text,{...H,marginBottom:"0.4em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"70%",children:jsxRuntime.jsx(Text.Text,{...H,marginBottom:"0.4em"})}),jsxRuntime.jsx(Skeleton.Skeleton,{width:"50%",children:jsxRuntime.jsx(Text.Text,{...H,marginBottom:"0.8em"})})]})}):React.isValidElement(p)?p:typeof p=='function'?p({captionProps:M,titleProps:q,subtitleProps:H}):jsxRuntime.jsxs(style.Container,{...V,sizes:sizes.SIZES_CONTAINER,children:[U&&jsxRuntime.jsx(style.Fading,{visible:K===!1}),jsxRuntime.jsxs(style.Content,{...V,sizes:sizes.SIZES_CONTENT,ref:e=>{$(e)},scrollable:L,tabIndex:L?0:void 0,onScroll:e=>{U&&ee(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:[React.isValidElement(h)?h:typeof h=='function'?h(M):typeof h=='string'||typeof h=='number'?jsxRuntime.jsx(Text.Text,{...M,children:h}):null,React.isValidElement(z)?z:typeof z=='function'?z(q):typeof z=='string'||typeof z=='number'?jsxRuntime.jsx(Text.Text,{...q,children:z}):null,React.isValidElement(T)?T:typeof T=='function'?T(H):typeof T=='string'||typeof T=='number'?jsxRuntime.jsx(Text.Text,{...H,children:T}):null,I]}),U&&jsxRuntime.jsx(style.Fading,{visible:J===!1,after:!0}),f&&jsxRuntime.jsx(style.Footer,{...V,sizes:sizes.SIZES_FOOTER,children:f})]})]})]})]})})),{sizes:e=>e.fancy?sizes.SIZES_FANCY:sizes.SIZES,displayName:'DialogComponent'});exports.DialogComponent=DialogComponent;
2
2
  //# sourceMappingURL=DialogComponent.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DialogComponent.js","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useLayoutEffect, useRef, useState, useCallback } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Visibility } from 'components/Visibility'\nimport { Skeleton } from 'components/Skeleton'\nimport { Button } from 'components/Button'\nimport { Spacer } from 'components/Spacer'\nimport { ProgressLine } from 'components/ProgressLine'\nimport { concatClassNames } from 'shared/utils/dom'\nimport type { Nullable } from 'shared/types'\nimport { DialogContainer } from './DialogContainer'\nimport { ProgressLineContainer } from './ProgressLineContainer'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport { getCommonSizeProps } from './utils'\nimport {\n SIZES,\n SIZES_FANCY,\n SIZES_CAPTION,\n SIZES_TITLE,\n SIZES_SUBTITLE,\n VISIBILITY_PORTRAIT,\n VISIBILITY_LANDSCAPE,\n VISIBILITY_LANDSCAPE_MEDIA,\n} from './constants'\nimport type { DialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n entries.forEach((entry) => {\n if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n entry.target[resizeHandlerSymbol](entry.target)\n }\n })\n})\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/DialogComponent/types.ts).\n */\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n DialogComponentProps,\n HTMLDivElement\n>(\n forwardRef((props, ref) => {\n const {\n size = 's',\n iconButtonProps = {},\n captionProps = {},\n titleProps = {},\n subtitleProps = {},\n draggingIconProps = {},\n imgSrc = {},\n imgAspectRatio = {},\n skeletonProps = {},\n progressLineProps = {},\n fancy,\n floats,\n children,\n caption,\n title,\n subtitle,\n controls,\n imgLandscapePositionRight,\n imgPortraitPositionBottom,\n className,\n backgroundClassName,\n scrollFadingDisabled,\n draggable,\n loading,\n progressLine,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n onGrab,\n onNudge,\n ...restProps\n } = props\n\n const dialogSizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const sizeProps = getCommonSizeProps(dialogSizeProps)\n\n const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n const [scrollTop, setScrollTop] = useState<Nullable<boolean>>(null)\n const [scrollBottom, setScrollBottom] = useState<Nullable<boolean>>(null)\n\n const scrollable = useRef<HTMLDivElement | null>(null)\n\n const handleScrollThresholds = useCallback((e: HTMLDivElement) => {\n if (e.scrollHeight === e.clientHeight) {\n setScrollTop(null)\n setScrollBottom(null)\n } else {\n setScrollTop(e.scrollTop <= 0)\n setScrollBottom(Math.abs(e.scrollHeight - e.clientHeight - e.scrollTop) <= 1)\n }\n }, [])\n\n useLayoutEffect(() => {\n const observerTarget = scrollable.current\n\n if (!scrollFadingDisabled && observerTarget) {\n observerTarget[resizeHandlerSymbol] = handleScrollThresholds\n resizeObserver.observe(observerTarget)\n }\n\n return () => {\n if (observerTarget) {\n resizeObserver.unobserve(observerTarget)\n }\n }\n }, [handleScrollThresholds, scrollFadingDisabled])\n\n return (\n <Styled.Root {...restProps} {...dialogSizeProps} className={rootClassName} fancy={fancy} ref={ref}>\n {floats && floats(sizeProps)}\n {fancy && <Styled.FancyBackground className={backgroundClassName} />}\n {fancy && iconButtonProps.onClick && (\n <Styled.PositionedIconButton\n secondary\n size='xxl'\n icon='close'\n inset={{ top: 0, right: 0 }}\n {...iconButtonProps}\n />\n )}\n {(draggable || (imgSrc.portrait && !imgPortraitPositionBottom) || fancy) && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n {fancy && <Spacer top={96} />}\n {draggable && (\n <Styled.DraggingHandle onPointerDown={onGrab}>\n <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n </Styled.DraggingIconContainer>\n </Styled.DraggingHandle>\n )}\n {imgSrc.portrait && !imgPortraitPositionBottom && (\n <Styled.MediaPortraitContainer top={!fancy}>\n <Styled.MediaPortrait>\n <Styled.Placeholder orientation='portrait' aspectRatio={imgAspectRatio.portrait ?? '3:1'} />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.portrait} />\n )}\n </Styled.MediaPortrait>\n </Styled.MediaPortraitContainer>\n )}\n </Visibility>\n )}\n {imgSrc.landscape && !imgLandscapePositionRight && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n <Styled.MediaLandscape>\n <Styled.Placeholder orientation='landscape' aspectRatio={imgAspectRatio.landscape ?? '5:7'} />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.landscape} />\n )}\n </Styled.MediaLandscape>\n </Visibility>\n )}\n {!fancy && iconButtonProps.onClick && (\n <Styled.PositionedIconButton size='l' icon='close' inset={{ top: 8, right: 8 }} {...iconButtonProps} />\n )}\n <DialogContainer {...dialogSizeProps} fancy={fancy}>\n {progressLine && !loading && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n {fancy || (imgSrc.portrait && !imgPortraitPositionBottom) ? (\n <Styled.PositionedProgressLine size='xs' {...progressLineProps} inset={{ top: 0, right: 0, left: 0 }} />\n ) : (\n <ProgressLineContainer {...dialogSizeProps} inset={{ top: 0, right: 0, left: 0 }}>\n <ProgressLine size='xs' {...progressLineProps} />\n </ProgressLineContainer>\n )}\n </Visibility>\n )}\n {((progressLine && !loading) || draggable) && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE}>\n {progressLine && !loading && (\n <ProgressLineContainer\n {...dialogSizeProps}\n inset={fancy ? { right: 0, bottom: 0, left: 0 } : { top: 0, right: 0, left: 0 }}\n >\n <ProgressLine size='xs' {...progressLineProps} />\n </ProgressLineContainer>\n )}\n {draggable && (\n <Styled.DraggingHandle onPointerDown={onGrab}>\n <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n </Styled.DraggingIconContainer>\n </Styled.DraggingHandle>\n )}\n </Visibility>\n )}\n {!scrollFadingDisabled && <Styled.Fading visible={scrollTop === false} />}\n <Styled.ScrollableContent\n ref={scrollable}\n tabIndex={0}\n onScroll={(evt) => {\n if (!scrollFadingDisabled) {\n handleScrollThresholds(evt.currentTarget)\n }\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.ArrowUp.validate(evt.key)) {\n evt.preventDefault()\n evt.currentTarget.scrollBy(0, -13)\n } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n evt.preventDefault()\n evt.currentTarget.scrollBy(0, 13)\n }\n }}\n >\n {loading ? (\n <>\n <Skeleton>\n <Text appearance='heading' marginBottom='1.5em' sizes={SIZES_TITLE} {...sizeProps} {...titleProps} />\n </Skeleton>\n <Skeleton width='90%'>\n <Text\n appearance='body'\n marginBottom='0.4em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n />\n </Skeleton>\n <Skeleton width='70%'>\n <Text\n appearance='body'\n marginBottom='0.4em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n />\n </Skeleton>\n <Skeleton width='50%'>\n <Text\n appearance='body'\n marginBottom='0.8em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n />\n </Skeleton>\n </>\n ) : (\n <>\n {caption && (\n <Text\n appearance='body'\n color='content-onmain-tertiary'\n wordBreak='break-word'\n marginBottom='0.8em'\n sizes={SIZES_CAPTION}\n {...sizeProps}\n {...captionProps}\n >\n {caption}\n </Text>\n )}\n {title && (\n <Text\n as='h2'\n appearance='heading'\n color='content-onmain-primary'\n wordBreak='break-word'\n marginBottom='0.5em'\n sizes={SIZES_TITLE}\n {...sizeProps}\n {...titleProps}\n >\n {title}\n </Text>\n )}\n {subtitle && (\n <Text\n as='p'\n appearance='body'\n color='content-onmain-primary'\n wordBreak='break-word'\n marginBottom='0.8em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n >\n {subtitle}\n </Text>\n )}\n {typeof children === 'function' ? children(sizeProps) : children}\n </>\n )}\n </Styled.ScrollableContent>\n {!scrollFadingDisabled && <Styled.Fading visible={scrollBottom === false} after />}\n {controls && (\n <Styled.Controls>\n {loading ? (\n <Skeleton borderRadius={48} {...skeletonProps}>\n <Button preset='brand' {...sizeProps} />\n </Skeleton>\n ) : (\n controls(sizeProps)\n )}\n </Styled.Controls>\n )}\n </DialogContainer>\n {imgSrc.landscape && imgLandscapePositionRight && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n <Styled.MediaLandscape right>\n <Styled.Placeholder orientation='landscape' aspectRatio={imgAspectRatio.landscape ?? '5:7'} />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.landscape} />\n )}\n </Styled.MediaLandscape>\n </Visibility>\n )}\n {imgSrc.portrait && imgPortraitPositionBottom && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n <Styled.MediaPortraitContainer bottom>\n <Styled.MediaPortrait>\n <Styled.Placeholder orientation='portrait' aspectRatio={imgAspectRatio.portrait ?? '3:1'} />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.portrait} />\n )}\n </Styled.MediaPortrait>\n </Styled.MediaPortraitContainer>\n </Visibility>\n )}\n </Styled.Root>\n )\n }),\n {\n sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { DialogComponent }\n\nexport { SIZES, SIZES_FANCY }\n"],"names":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","default","entries","forEach","entry","target","DialogComponent","withMergedProps","forwardRef","props","ref","size","iconButtonProps","captionProps","titleProps","subtitleProps","draggingIconProps","imgSrc","imgAspectRatio","skeletonProps","progressLineProps","fancy","floats","children","caption","title","subtitle","controls","imgLandscapePositionRight","imgPortraitPositionBottom","className","backgroundClassName","scrollFadingDisabled","draggable","loading","progressLine","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","onGrab","onNudge","restProps","dialogSizeProps","sizeProps","getCommonSizeProps","rootClassName","concatClassNames","scrollTop","setScrollTop","useState","scrollBottom","setScrollBottom","scrollable","useRef","handleScrollThresholds","useCallback","e","scrollHeight","clientHeight","Math","abs","useLayoutEffect","observerTarget","current","observe","unobserve","_jsxs","Styled","_jsx","jsx","onClick","secondary","icon","inset","top","right","portrait","jsxs","Visibility","sizes","VISIBILITY_PORTRAIT","Spacer","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","color","orientation","aspectRatio","width","height","borderRadius","src","landscape","VISIBILITY_LANDSCAPE_MEDIA","DialogContainer","left","ProgressLineContainer","ProgressLine","VISIBILITY_LANDSCAPE","bottom","visible","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","_Fragment","Skeleton","Text","appearance","marginBottom","SIZES_TITLE","SIZES_SUBTITLE","wordBreak","SIZES_CAPTION","as","after","Button","preset","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}
1
+ {"version":3,"file":"DialogComponent.js","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useLayoutEffect, useState, useCallback, isValidElement } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { 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 type { Nullable } from 'shared/types'\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} 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'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n entries.forEach((entry) => {\n if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n entry.target[resizeHandlerSymbol](entry.target)\n }\n })\n})\n\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n DialogComponentProps,\n HTMLDivElement\n>(\n forwardRef((props, ref) => {\n const {\n size = 's',\n layout = 'vertical',\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 caption,\n title,\n subtitle,\n children,\n footer,\n closeButton,\n progressLine,\n fancy,\n imgSrcVertical,\n imgSrcHorizontal,\n scrollable,\n scrollFading,\n draggable,\n loading,\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 [scrollTop, setScrollTop] = useState<Nullable<boolean>>(null)\n const [scrollBottom, setScrollBottom] = useState<Nullable<boolean>>(null)\n\n const [contentRef, setContentRef] = useState<HTMLDivElement | null>(null)\n\n const handleScrollThresholds = useCallback((e: HTMLDivElement) => {\n if (e.scrollHeight === e.clientHeight) {\n setScrollTop(null)\n setScrollBottom(null)\n } else {\n setScrollTop(e.scrollTop <= 0)\n setScrollBottom(Math.abs(e.scrollHeight - e.clientHeight - e.scrollTop) <= 1)\n }\n }, [])\n\n useLayoutEffect(() => {\n if (contentRef && scrollFadingEnabled) {\n contentRef[resizeHandlerSymbol] = handleScrollThresholds\n resizeObserver.observe(contentRef)\n }\n\n return () => {\n if (contentRef) {\n resizeObserver.unobserve(contentRef)\n }\n }\n }, [contentRef, scrollFadingEnabled, handleScrollThresholds])\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} />}\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 )}\n {closeButton && (\n <Styled.ButtonPosition>\n {isValidElement(closeButton)\n ? closeButton\n : typeof closeButton === 'function'\n ? closeButton(closeButtonProps)\n : null}\n </Styled.ButtonPosition>\n )}\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 )}\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 )}\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 )}\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 )}\n {fancy && <Styled.LayoutSpacer {...layoutProps} layouts={VISIBILITY_HORIZONTAL} paddingTop={76} />}\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 {scrollFadingEnabled && <Styled.Fading visible={scrollTop === false} />}\n <Styled.Content\n {...sizeProps}\n sizes={SIZES_CONTENT}\n ref={(ref) => {\n setContentRef(ref)\n }}\n scrollable={scrollable}\n tabIndex={scrollable ? 0 : undefined}\n onScroll={(evt) => {\n if (scrollFadingEnabled) {\n handleScrollThresholds(evt.currentTarget)\n }\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.ArrowUp.validate(evt.key)) {\n evt.preventDefault()\n evt.currentTarget.scrollBy(0, -13)\n } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n evt.preventDefault()\n evt.currentTarget.scrollBy(0, 13)\n }\n }}\n >\n {isValidElement(caption) ? (\n caption\n ) : typeof caption === 'function' ? (\n caption(captionProps)\n ) : typeof caption === 'string' || typeof caption === 'number' ? (\n <Text {...captionProps}>{caption}</Text>\n ) : null}\n {isValidElement(title) ? (\n title\n ) : typeof title === 'function' ? (\n title(titleProps)\n ) : typeof title === 'string' || typeof title === 'number' ? (\n <Text {...titleProps}>{title}</Text>\n ) : null}\n {isValidElement(subtitle) ? (\n subtitle\n ) : typeof subtitle === 'function' ? (\n subtitle(subtitleProps)\n ) : typeof subtitle === 'string' || typeof subtitle === 'number' ? (\n <Text {...subtitleProps}>{subtitle}</Text>\n ) : null}\n {children}\n </Styled.Content>\n {scrollFadingEnabled && <Styled.Fading visible={scrollBottom === false} after />}\n {footer && (\n <Styled.Footer {...sizeProps} sizes={SIZES_FOOTER}>\n {footer}\n </Styled.Footer>\n )}\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":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","default","entries","forEach","entry","target","DialogComponent","withMergedProps","forwardRef","props","ref","size","layout","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","layoutXXS","layoutXS","layoutS","layoutM","layoutL","layoutXL","root","floats","media","body","caption","title","subtitle","children","footer","closeButton","progressLine","fancy","imgSrcVertical","imgSrcHorizontal","scrollable","scrollFading","draggable","loading","className","backgroundClassName","onGrab","onNudge","restProps","sizeProps","layoutProps","captionProps","appearance","color","wordBreak","marginBottom","sizes","SIZES_CAPTION","titleProps","as","SIZES_TITLE","subtitleProps","SIZES_SUBTITLE","closeButtonProps","icon","secondary","marginTop","marginRight","progressLineProps","rootClassName","concatClassNames","scrollFadingEnabled","scrollTop","setScrollTop","useState","scrollBottom","setScrollBottom","contentRef","setContentRef","handleScrollThresholds","useCallback","e","scrollHeight","clientHeight","Math","abs","useLayoutEffect","observe","unobserve","_jsxs","Styled","layouts","LAYOUTS_FANCY","LAYOUTS","_jsx","jsx","isValidElement","jsxs","_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","visible","undefined","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","after","SIZES_FOOTER","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{forwardRef,useState,useRef,useCallback,useLayoutEffect}from'react';import ResizeObserver from'resize-observer-polyfill';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{concatClassNames}from'../../shared/utils/dom.mjs';import{DialogContainer}from'./DialogContainer.mjs';import{ProgressLineContainer}from'./ProgressLineContainer.mjs';import SvgDragging from'./images/dragging.svg.mjs';import{Root,FancyBackground,PositionedIconButton,DraggingHandle,DraggingIconContainer,MediaPortraitContainer,MediaPortrait,Placeholder,MediaSkeleton,Media,MediaLandscape,PositionedProgressLine,Fading,ScrollableContent,Controls}from'./style.mjs';import{getCommonSizeProps}from'./utils.mjs';import{SIZES_FANCY,SIZES,VISIBILITY_PORTRAIT,VISIBILITY_LANDSCAPE_MEDIA,VISIBILITY_LANDSCAPE,SIZES_TITLE,SIZES_SUBTITLE,SIZES_CAPTION}from'./constants.mjs';import{jsxs,jsx,Fragment}from'react/jsx-runtime';import{Visibility}from'../Visibility/Visibility.mjs';import{Spacer}from'../Spacer/Spacer.mjs';import{Icon}from'../Icon/Icon.mjs';import{ProgressLine}from'../ProgressLine/ProgressLine.mjs';import{Skeleton}from'../Skeleton/Skeleton.mjs';import{Text}from'../Text/Text.mjs';import{Button}from'../Button/Button.mjs';const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const DialogComponent=withMergedProps(forwardRef(((e,r)=>{const{size:i="s",iconButtonProps:o={},captionProps:s={},titleProps:t={},subtitleProps:n={},draggingIconProps:a={},imgSrc:l={},imgAspectRatio:c={},skeletonProps:d={},progressLineProps:m={},fancy:g,floats:p,children:S,caption:I,title:x,subtitle:j,controls:h,imgLandscapePositionRight:b,imgPortraitPositionBottom:P,className:y,backgroundClassName:T,scrollFadingDisabled:f,draggable:u,loading:z,progressLine:L,sizeXXS:C,sizeXS:B,sizeS:E,sizeM:k,sizeL:D,sizeXL:M,onGrab:w,onNudge:R,...A}=e;const _={size:i,sizeXXS:C,sizeXS:B,sizeS:E,sizeM:k,sizeL:D,sizeXL:M};const v=getCommonSizeProps(_);const N=g?y:concatClassNames(y,T);const[V,Z]=useState(null);const[Y,F]=useState(null);const H=useRef(null);const O=useCallback((e=>{e.scrollHeight===e.clientHeight?(Z(null),F(null)):(Z(e.scrollTop<=0),F(Math.abs(e.scrollHeight-e.clientHeight-e.scrollTop)<=1))}),[]);return useLayoutEffect((()=>{const e=H.current;return!f&&e&&(e[resizeHandlerSymbol]=O,resizeObserver.observe(e)),()=>{e&&resizeObserver.unobserve(e)}}),[O,f]),jsxs(Root,{...A,..._,className:N,fancy:g,ref:r,children:[p&&p(v),g&&jsx(FancyBackground,{className:T}),g&&o.onClick&&jsx(PositionedIconButton,{secondary:!0,size:"xxl",icon:"close",inset:{top:0,right:0},...o}),(u||l.portrait&&!P||g)&&jsxs(Visibility,{..._,sizes:VISIBILITY_PORTRAIT,children:[g&&jsx(Spacer,{top:96}),u&&jsx(DraggingHandle,{onPointerDown:w,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:R,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary",...a})})}),l.portrait&&!P&&jsx(MediaPortraitContainer,{top:!g,children:jsxs(MediaPortrait,{children:[jsx(Placeholder,{orientation:"portrait",aspectRatio:c.portrait??'3:1'}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...d}):jsx(Media,{src:l.portrait})]})})]}),l.landscape&&!b&&jsx(Visibility,{..._,sizes:VISIBILITY_LANDSCAPE_MEDIA,children:jsxs(MediaLandscape,{children:[jsx(Placeholder,{orientation:"landscape",aspectRatio:c.landscape??'5:7'}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...d}):jsx(Media,{src:l.landscape})]})}),!g&&o.onClick&&jsx(PositionedIconButton,{size:"l",icon:"close",inset:{top:8,right:8},...o}),jsxs(DialogContainer,{..._,fancy:g,children:[L&&!z&&jsx(Visibility,{..._,sizes:VISIBILITY_PORTRAIT,children:g||l.portrait&&!P?jsx(PositionedProgressLine,{size:"xs",...m,inset:{top:0,right:0,left:0}}):jsx(ProgressLineContainer,{..._,inset:{top:0,right:0,left:0},children:jsx(ProgressLine,{size:"xs",...m})})}),(L&&!z||u)&&jsxs(Visibility,{..._,sizes:VISIBILITY_LANDSCAPE,children:[L&&!z&&jsx(ProgressLineContainer,{..._,inset:g?{right:0,bottom:0,left:0}:{top:0,right:0,left:0},children:jsx(ProgressLine,{size:"xs",...m})}),u&&jsx(DraggingHandle,{onPointerDown:w,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:R,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary",...a})})})]}),!f&&jsx(Fading,{visible:V===!1}),jsx(ScrollableContent,{ref:H,tabIndex:0,onScroll:e=>{f||O(e.currentTarget)},onKeyDown:e=>{keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:jsxs(Fragment,z?{children:[jsx(Skeleton,{children:jsx(Text,{appearance:"heading",marginBottom:"1.5em",sizes:SIZES_TITLE,...v,...t})}),jsx(Skeleton,{width:"90%",children:jsx(Text,{appearance:"body",marginBottom:"0.4em",sizes:SIZES_SUBTITLE,...v,...n})}),jsx(Skeleton,{width:"70%",children:jsx(Text,{appearance:"body",marginBottom:"0.4em",sizes:SIZES_SUBTITLE,...v,...n})}),jsx(Skeleton,{width:"50%",children:jsx(Text,{appearance:"body",marginBottom:"0.8em",sizes:SIZES_SUBTITLE,...v,...n})})]}:{children:[I&&jsx(Text,{appearance:"body",color:"content-onmain-tertiary",wordBreak:"break-word",marginBottom:"0.8em",sizes:SIZES_CAPTION,...v,...s,children:I}),x&&jsx(Text,{as:"h2",appearance:"heading",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.5em",sizes:SIZES_TITLE,...v,...t,children:x}),j&&jsx(Text,{as:"p",appearance:"body",color:"content-onmain-primary",wordBreak:"break-word",marginBottom:"0.8em",sizes:SIZES_SUBTITLE,...v,...n,children:j}),typeof S=='function'?S(v):S]})}),!f&&jsx(Fading,{visible:Y===!1,after:!0}),h&&jsx(Controls,{children:z?jsx(Skeleton,{borderRadius:48,...d,children:jsx(Button,{preset:"brand",...v})}):h(v)})]}),l.landscape&&b&&jsx(Visibility,{..._,sizes:VISIBILITY_LANDSCAPE_MEDIA,children:jsxs(MediaLandscape,{right:!0,children:[jsx(Placeholder,{orientation:"landscape",aspectRatio:c.landscape??'5:7'}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...d}):jsx(Media,{src:l.landscape})]})}),l.portrait&&P&&jsx(Visibility,{..._,sizes:VISIBILITY_PORTRAIT,children:jsx(MediaPortraitContainer,{bottom:!0,children:jsxs(MediaPortrait,{children:[jsx(Placeholder,{orientation:"portrait",aspectRatio:c.portrait??'3:1'}),z?jsx(MediaSkeleton,{width:"100%",height:"100%",borderRadius:0,...d}):jsx(Media,{src:l.portrait})]})})})]})})),{sizes:e=>e.fancy?SIZES_FANCY:SIZES,displayName:'DialogComponent'});export{DialogComponent,SIZES,SIZES_FANCY};
1
+ import{forwardRef,useState,useCallback,useLayoutEffect,isValidElement}from'react';import ResizeObserver from'resize-observer-polyfill';import{withMergedProps}from'../../hocs/withMergedProps.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,Fading,Footer}from'./style.mjs';import{SIZES_FANCY,SIZES,SIZES_CONTAINER,SIZES_CONTENT,SIZES_FOOTER,SIZES_CAPTION,SIZES_TITLE,SIZES_SUBTITLE}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{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';const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const DialogComponent=withMergedProps(forwardRef(((e,o)=>{const{size:t="s",layout:s="vertical",sizeXXS:n,sizeXS:r,sizeS:i,sizeM:a,sizeL:l,sizeXL:c,layoutXXS:m,layoutXS:d,layoutS:S,layoutM:g,layoutL:u,layoutXL:I,root:y,floats:p,media:T,body:x,caption:E,title:j,subtitle:f,children:h,footer:A,closeButton:L,progressLine:O,fancy:b,imgSrcVertical:_,imgSrcHorizontal:z,scrollable:R,scrollFading:C,draggable:N,loading:B,className:Y,backgroundClassName:D,onGrab:k,onNudge:w,...P}=e;const Z={size:t,sizeXXS:n,sizeXS:r,sizeS:i,sizeM:a,sizeL:l,sizeXL:c};const V={layout:s,layoutXXS:m,layoutXS:d,layoutS:S,layoutM:g,layoutL:u,layoutXL:I};const v={...Z,appearance:'body',color:'content-onmain-tertiary',wordBreak:'break-word',marginBottom:'0.8em',sizes:SIZES_CAPTION};const F={...Z,as:'h2',appearance:'heading',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.5em',sizes:SIZES_TITLE};const H={...Z,as:'p',appearance:'body',color:'content-onmain-primary',wordBreak:'break-word',marginBottom:'0.8em',sizes:SIZES_SUBTITLE};const M=b?{icon:'close',size:'xxl',secondary:!0}:{icon:'close',size:'l',marginTop:8,marginRight:8};const U={size:'xs'};const X=b?Y:concatClassNames(Y,D);const G=R&&C;const[K,q]=useState(null);const[J,Q]=useState(null);const[W,$]=useState(null);const ee=useCallback((e=>{e.scrollHeight===e.clientHeight?(q(null),Q(null)):(q(e.scrollTop<=0),Q(Math.abs(e.scrollHeight-e.clientHeight-e.scrollTop)<=1))}),[]);return useLayoutEffect((()=>(W&&G&&(W[resizeHandlerSymbol]=ee,resizeObserver.observe(W)),()=>{W&&resizeObserver.unobserve(W)})),[W,G,ee]),jsxs(Root,{...P,...Z,...V,layouts:b?LAYOUTS_FANCY:LAYOUTS,className:X,fancy:b,ref:o,children:[b&&jsx(FancyBackground,{className:D}),isValidElement(y)?y:typeof y=='function'?y({captionProps:v,titleProps:F,subtitleProps:H,closeButtonProps:M,progressLineProps:U,onGrab:k,onNudge:w}):jsxs(Fragment,{children:[p,N&&jsx(DraggingHandle,{...V,layouts:VISIBILITY_VERTICAL,onPointerDown:k,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:w,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary"})})}),L&&jsx(ButtonPosition,{children:isValidElement(L)?L:typeof L=='function'?L(M):null}),(B||T||_)&&jsx(Media,{...V,layouts:b?LAYOUTS_FANCY_MEDIA_VERTICAL:LAYOUTS_MEDIA_VERTICAL,children:B?jsx(AspectRatio,{ratio:"3:1",width:"100%",children:jsx(Skeleton,{borderRadius:0})}):isValidElement(T)?T:jsx(AspectRatio,{ratio:"3:1",width:"100%",children:jsx(Img,{src:_})})}),(B||T||z)&&jsx(Media,{...V,layouts:LAYOUTS_MEDIA_HORIZONTAL,children:B?jsx(AspectRatio,{ratio:"5:7",height:"100%",children:jsx(Skeleton,{borderRadius:0})}):isValidElement(T)?T:jsx(AspectRatio,{ratio:"5:7",height:"100%",children:jsx(Img,{src:z})})}),jsxs(Body,{children:[O&&!B&&jsx(ProgressPosition,{...V,layouts:b?LAYOUTS_FANCY_PROGRESS:LAYOUTS_PROGRESS,children:isValidElement(O)?O:typeof O=='function'?O(U):null}),N&&jsx(DraggingHandle,{...V,layouts:VISIBILITY_HORIZONTAL,onPointerDown:k,children:jsx(DraggingIconContainer,{tabIndex:0,onKeyDown:w,children:jsx(Icon,{icon:jsx(SvgDragging,{}),size:34,color:"content-onmain-tertiary"})})}),b&&jsx(LayoutSpacer,{...V,layouts:VISIBILITY_HORIZONTAL,paddingTop:76}),B?jsx(Container,{...Z,sizes:SIZES_CONTAINER,children:jsxs(Content,{...Z,sizes:SIZES_CONTENT,children:[jsx(Skeleton,{children:jsx(Text,{...F,marginBottom:"1.5em"})}),jsx(Skeleton,{width:"90%",children:jsx(Text,{...H,marginBottom:"0.4em"})}),jsx(Skeleton,{width:"70%",children:jsx(Text,{...H,marginBottom:"0.4em"})}),jsx(Skeleton,{width:"50%",children:jsx(Text,{...H,marginBottom:"0.8em"})})]})}):isValidElement(x)?x:typeof x=='function'?x({captionProps:v,titleProps:F,subtitleProps:H}):jsxs(Container,{...Z,sizes:SIZES_CONTAINER,children:[G&&jsx(Fading,{visible:K===!1}),jsxs(Content,{...Z,sizes:SIZES_CONTENT,ref:e=>{$(e)},scrollable:R,tabIndex:R?0:void 0,onScroll:e=>{G&&ee(e.currentTarget)},onKeyDown:e=>{keyboardKeys.ArrowUp.validate(e.key)?(e.preventDefault(),e.currentTarget.scrollBy(0,-13)):keyboardKeys.ArrowDown.validate(e.key)&&(e.preventDefault(),e.currentTarget.scrollBy(0,13))},children:[isValidElement(E)?E:typeof E=='function'?E(v):typeof E=='string'||typeof E=='number'?jsx(Text,{...v,children:E}):null,isValidElement(j)?j:typeof j=='function'?j(F):typeof j=='string'||typeof j=='number'?jsx(Text,{...F,children:j}):null,isValidElement(f)?f:typeof f=='function'?f(H):typeof f=='string'||typeof f=='number'?jsx(Text,{...H,children:f}):null,h]}),G&&jsx(Fading,{visible:J===!1,after:!0}),A&&jsx(Footer,{...Z,sizes:SIZES_FOOTER,children:A})]})]})]})]})})),{sizes:e=>e.fancy?SIZES_FANCY:SIZES,displayName:'DialogComponent'});export{DialogComponent};
2
2
  //# sourceMappingURL=DialogComponent.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"DialogComponent.mjs","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useLayoutEffect, useRef, useState, useCallback } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { Visibility } from 'components/Visibility'\nimport { Skeleton } from 'components/Skeleton'\nimport { Button } from 'components/Button'\nimport { Spacer } from 'components/Spacer'\nimport { ProgressLine } from 'components/ProgressLine'\nimport { concatClassNames } from 'shared/utils/dom'\nimport type { Nullable } from 'shared/types'\nimport { DialogContainer } from './DialogContainer'\nimport { ProgressLineContainer } from './ProgressLineContainer'\nimport Dragging from './images/dragging.svg?module'\nimport * as Styled from './style'\nimport { getCommonSizeProps } from './utils'\nimport {\n SIZES,\n SIZES_FANCY,\n SIZES_CAPTION,\n SIZES_TITLE,\n SIZES_SUBTITLE,\n VISIBILITY_PORTRAIT,\n VISIBILITY_LANDSCAPE,\n VISIBILITY_LANDSCAPE_MEDIA,\n} from './constants'\nimport type { DialogComponentProps } from './types'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n entries.forEach((entry) => {\n if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n entry.target[resizeHandlerSymbol](entry.target)\n }\n })\n})\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/DialogComponent/types.ts).\n */\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n DialogComponentProps,\n HTMLDivElement\n>(\n forwardRef((props, ref) => {\n const {\n size = 's',\n iconButtonProps = {},\n captionProps = {},\n titleProps = {},\n subtitleProps = {},\n draggingIconProps = {},\n imgSrc = {},\n imgAspectRatio = {},\n skeletonProps = {},\n progressLineProps = {},\n fancy,\n floats,\n children,\n caption,\n title,\n subtitle,\n controls,\n imgLandscapePositionRight,\n imgPortraitPositionBottom,\n className,\n backgroundClassName,\n scrollFadingDisabled,\n draggable,\n loading,\n progressLine,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n onGrab,\n onNudge,\n ...restProps\n } = props\n\n const dialogSizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const sizeProps = getCommonSizeProps(dialogSizeProps)\n\n const rootClassName = !fancy ? concatClassNames(className, backgroundClassName) : className\n\n const [scrollTop, setScrollTop] = useState<Nullable<boolean>>(null)\n const [scrollBottom, setScrollBottom] = useState<Nullable<boolean>>(null)\n\n const scrollable = useRef<HTMLDivElement | null>(null)\n\n const handleScrollThresholds = useCallback((e: HTMLDivElement) => {\n if (e.scrollHeight === e.clientHeight) {\n setScrollTop(null)\n setScrollBottom(null)\n } else {\n setScrollTop(e.scrollTop <= 0)\n setScrollBottom(Math.abs(e.scrollHeight - e.clientHeight - e.scrollTop) <= 1)\n }\n }, [])\n\n useLayoutEffect(() => {\n const observerTarget = scrollable.current\n\n if (!scrollFadingDisabled && observerTarget) {\n observerTarget[resizeHandlerSymbol] = handleScrollThresholds\n resizeObserver.observe(observerTarget)\n }\n\n return () => {\n if (observerTarget) {\n resizeObserver.unobserve(observerTarget)\n }\n }\n }, [handleScrollThresholds, scrollFadingDisabled])\n\n return (\n <Styled.Root {...restProps} {...dialogSizeProps} className={rootClassName} fancy={fancy} ref={ref}>\n {floats && floats(sizeProps)}\n {fancy && <Styled.FancyBackground className={backgroundClassName} />}\n {fancy && iconButtonProps.onClick && (\n <Styled.PositionedIconButton\n secondary\n size='xxl'\n icon='close'\n inset={{ top: 0, right: 0 }}\n {...iconButtonProps}\n />\n )}\n {(draggable || (imgSrc.portrait && !imgPortraitPositionBottom) || fancy) && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n {fancy && <Spacer top={96} />}\n {draggable && (\n <Styled.DraggingHandle onPointerDown={onGrab}>\n <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n </Styled.DraggingIconContainer>\n </Styled.DraggingHandle>\n )}\n {imgSrc.portrait && !imgPortraitPositionBottom && (\n <Styled.MediaPortraitContainer top={!fancy}>\n <Styled.MediaPortrait>\n <Styled.Placeholder orientation='portrait' aspectRatio={imgAspectRatio.portrait ?? '3:1'} />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.portrait} />\n )}\n </Styled.MediaPortrait>\n </Styled.MediaPortraitContainer>\n )}\n </Visibility>\n )}\n {imgSrc.landscape && !imgLandscapePositionRight && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n <Styled.MediaLandscape>\n <Styled.Placeholder orientation='landscape' aspectRatio={imgAspectRatio.landscape ?? '5:7'} />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.landscape} />\n )}\n </Styled.MediaLandscape>\n </Visibility>\n )}\n {!fancy && iconButtonProps.onClick && (\n <Styled.PositionedIconButton size='l' icon='close' inset={{ top: 8, right: 8 }} {...iconButtonProps} />\n )}\n <DialogContainer {...dialogSizeProps} fancy={fancy}>\n {progressLine && !loading && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n {fancy || (imgSrc.portrait && !imgPortraitPositionBottom) ? (\n <Styled.PositionedProgressLine size='xs' {...progressLineProps} inset={{ top: 0, right: 0, left: 0 }} />\n ) : (\n <ProgressLineContainer {...dialogSizeProps} inset={{ top: 0, right: 0, left: 0 }}>\n <ProgressLine size='xs' {...progressLineProps} />\n </ProgressLineContainer>\n )}\n </Visibility>\n )}\n {((progressLine && !loading) || draggable) && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE}>\n {progressLine && !loading && (\n <ProgressLineContainer\n {...dialogSizeProps}\n inset={fancy ? { right: 0, bottom: 0, left: 0 } : { top: 0, right: 0, left: 0 }}\n >\n <ProgressLine size='xs' {...progressLineProps} />\n </ProgressLineContainer>\n )}\n {draggable && (\n <Styled.DraggingHandle onPointerDown={onGrab}>\n <Styled.DraggingIconContainer tabIndex={0} onKeyDown={onNudge}>\n <Icon icon={<Dragging />} size={34} color='content-onmain-tertiary' {...draggingIconProps} />\n </Styled.DraggingIconContainer>\n </Styled.DraggingHandle>\n )}\n </Visibility>\n )}\n {!scrollFadingDisabled && <Styled.Fading visible={scrollTop === false} />}\n <Styled.ScrollableContent\n ref={scrollable}\n tabIndex={0}\n onScroll={(evt) => {\n if (!scrollFadingDisabled) {\n handleScrollThresholds(evt.currentTarget)\n }\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.ArrowUp.validate(evt.key)) {\n evt.preventDefault()\n evt.currentTarget.scrollBy(0, -13)\n } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n evt.preventDefault()\n evt.currentTarget.scrollBy(0, 13)\n }\n }}\n >\n {loading ? (\n <>\n <Skeleton>\n <Text appearance='heading' marginBottom='1.5em' sizes={SIZES_TITLE} {...sizeProps} {...titleProps} />\n </Skeleton>\n <Skeleton width='90%'>\n <Text\n appearance='body'\n marginBottom='0.4em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n />\n </Skeleton>\n <Skeleton width='70%'>\n <Text\n appearance='body'\n marginBottom='0.4em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n />\n </Skeleton>\n <Skeleton width='50%'>\n <Text\n appearance='body'\n marginBottom='0.8em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n />\n </Skeleton>\n </>\n ) : (\n <>\n {caption && (\n <Text\n appearance='body'\n color='content-onmain-tertiary'\n wordBreak='break-word'\n marginBottom='0.8em'\n sizes={SIZES_CAPTION}\n {...sizeProps}\n {...captionProps}\n >\n {caption}\n </Text>\n )}\n {title && (\n <Text\n as='h2'\n appearance='heading'\n color='content-onmain-primary'\n wordBreak='break-word'\n marginBottom='0.5em'\n sizes={SIZES_TITLE}\n {...sizeProps}\n {...titleProps}\n >\n {title}\n </Text>\n )}\n {subtitle && (\n <Text\n as='p'\n appearance='body'\n color='content-onmain-primary'\n wordBreak='break-word'\n marginBottom='0.8em'\n sizes={SIZES_SUBTITLE}\n {...sizeProps}\n {...subtitleProps}\n >\n {subtitle}\n </Text>\n )}\n {typeof children === 'function' ? children(sizeProps) : children}\n </>\n )}\n </Styled.ScrollableContent>\n {!scrollFadingDisabled && <Styled.Fading visible={scrollBottom === false} after />}\n {controls && (\n <Styled.Controls>\n {loading ? (\n <Skeleton borderRadius={48} {...skeletonProps}>\n <Button preset='brand' {...sizeProps} />\n </Skeleton>\n ) : (\n controls(sizeProps)\n )}\n </Styled.Controls>\n )}\n </DialogContainer>\n {imgSrc.landscape && imgLandscapePositionRight && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_LANDSCAPE_MEDIA}>\n <Styled.MediaLandscape right>\n <Styled.Placeholder orientation='landscape' aspectRatio={imgAspectRatio.landscape ?? '5:7'} />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.landscape} />\n )}\n </Styled.MediaLandscape>\n </Visibility>\n )}\n {imgSrc.portrait && imgPortraitPositionBottom && (\n <Visibility {...dialogSizeProps} sizes={VISIBILITY_PORTRAIT}>\n <Styled.MediaPortraitContainer bottom>\n <Styled.MediaPortrait>\n <Styled.Placeholder orientation='portrait' aspectRatio={imgAspectRatio.portrait ?? '3:1'} />\n {loading ? (\n <Styled.MediaSkeleton width='100%' height='100%' borderRadius={0} {...skeletonProps} />\n ) : (\n <Styled.Media src={imgSrc.portrait} />\n )}\n </Styled.MediaPortrait>\n </Styled.MediaPortraitContainer>\n </Visibility>\n )}\n </Styled.Root>\n )\n }),\n {\n sizes: (props) => (props.fancy ? SIZES_FANCY : SIZES),\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { DialogComponent }\n\nexport { SIZES, SIZES_FANCY }\n"],"names":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","entries","forEach","entry","target","DialogComponent","withMergedProps","forwardRef","props","ref","size","iconButtonProps","captionProps","titleProps","subtitleProps","draggingIconProps","imgSrc","imgAspectRatio","skeletonProps","progressLineProps","fancy","floats","children","caption","title","subtitle","controls","imgLandscapePositionRight","imgPortraitPositionBottom","className","backgroundClassName","scrollFadingDisabled","draggable","loading","progressLine","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","onGrab","onNudge","restProps","dialogSizeProps","sizeProps","getCommonSizeProps","rootClassName","concatClassNames","scrollTop","setScrollTop","useState","scrollBottom","setScrollBottom","scrollable","useRef","handleScrollThresholds","useCallback","e","scrollHeight","clientHeight","Math","abs","useLayoutEffect","observerTarget","current","observe","unobserve","_jsxs","Styled","_jsx","onClick","secondary","icon","inset","top","right","portrait","Visibility","sizes","VISIBILITY_PORTRAIT","Spacer","onPointerDown","tabIndex","onKeyDown","Icon","Dragging","color","orientation","aspectRatio","width","height","borderRadius","src","landscape","VISIBILITY_LANDSCAPE_MEDIA","DialogContainer","left","ProgressLineContainer","ProgressLine","VISIBILITY_LANDSCAPE","bottom","visible","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","_Fragment","Skeleton","Text","appearance","marginBottom","SIZES_TITLE","SIZES_SUBTITLE","wordBreak","SIZES_CAPTION","as","after","Button","preset","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}
1
+ {"version":3,"file":"DialogComponent.mjs","sources":["../../../../src/components/DialogComponent/DialogComponent.tsx"],"sourcesContent":["import { forwardRef, useLayoutEffect, useState, useCallback, isValidElement } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { keyboardKeys } from 'shared/constants'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { 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 type { Nullable } from 'shared/types'\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} 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'\n\nconst COMPONENT_NAME = 'DialogComponent'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n entries.forEach((entry) => {\n if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n entry.target[resizeHandlerSymbol](entry.target)\n }\n })\n})\n\nconst DialogComponent: React.ForwardRefExoticComponent<DialogComponentProps> = withMergedProps<\n DialogComponentProps,\n HTMLDivElement\n>(\n forwardRef((props, ref) => {\n const {\n size = 's',\n layout = 'vertical',\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 caption,\n title,\n subtitle,\n children,\n footer,\n closeButton,\n progressLine,\n fancy,\n imgSrcVertical,\n imgSrcHorizontal,\n scrollable,\n scrollFading,\n draggable,\n loading,\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 [scrollTop, setScrollTop] = useState<Nullable<boolean>>(null)\n const [scrollBottom, setScrollBottom] = useState<Nullable<boolean>>(null)\n\n const [contentRef, setContentRef] = useState<HTMLDivElement | null>(null)\n\n const handleScrollThresholds = useCallback((e: HTMLDivElement) => {\n if (e.scrollHeight === e.clientHeight) {\n setScrollTop(null)\n setScrollBottom(null)\n } else {\n setScrollTop(e.scrollTop <= 0)\n setScrollBottom(Math.abs(e.scrollHeight - e.clientHeight - e.scrollTop) <= 1)\n }\n }, [])\n\n useLayoutEffect(() => {\n if (contentRef && scrollFadingEnabled) {\n contentRef[resizeHandlerSymbol] = handleScrollThresholds\n resizeObserver.observe(contentRef)\n }\n\n return () => {\n if (contentRef) {\n resizeObserver.unobserve(contentRef)\n }\n }\n }, [contentRef, scrollFadingEnabled, handleScrollThresholds])\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} />}\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 )}\n {closeButton && (\n <Styled.ButtonPosition>\n {isValidElement(closeButton)\n ? closeButton\n : typeof closeButton === 'function'\n ? closeButton(closeButtonProps)\n : null}\n </Styled.ButtonPosition>\n )}\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 )}\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 )}\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 )}\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 )}\n {fancy && <Styled.LayoutSpacer {...layoutProps} layouts={VISIBILITY_HORIZONTAL} paddingTop={76} />}\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 {scrollFadingEnabled && <Styled.Fading visible={scrollTop === false} />}\n <Styled.Content\n {...sizeProps}\n sizes={SIZES_CONTENT}\n ref={(ref) => {\n setContentRef(ref)\n }}\n scrollable={scrollable}\n tabIndex={scrollable ? 0 : undefined}\n onScroll={(evt) => {\n if (scrollFadingEnabled) {\n handleScrollThresholds(evt.currentTarget)\n }\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.ArrowUp.validate(evt.key)) {\n evt.preventDefault()\n evt.currentTarget.scrollBy(0, -13)\n } else if (keyboardKeys.ArrowDown.validate(evt.key)) {\n evt.preventDefault()\n evt.currentTarget.scrollBy(0, 13)\n }\n }}\n >\n {isValidElement(caption) ? (\n caption\n ) : typeof caption === 'function' ? (\n caption(captionProps)\n ) : typeof caption === 'string' || typeof caption === 'number' ? (\n <Text {...captionProps}>{caption}</Text>\n ) : null}\n {isValidElement(title) ? (\n title\n ) : typeof title === 'function' ? (\n title(titleProps)\n ) : typeof title === 'string' || typeof title === 'number' ? (\n <Text {...titleProps}>{title}</Text>\n ) : null}\n {isValidElement(subtitle) ? (\n subtitle\n ) : typeof subtitle === 'function' ? (\n subtitle(subtitleProps)\n ) : typeof subtitle === 'string' || typeof subtitle === 'number' ? (\n <Text {...subtitleProps}>{subtitle}</Text>\n ) : null}\n {children}\n </Styled.Content>\n {scrollFadingEnabled && <Styled.Fading visible={scrollBottom === false} after />}\n {footer && (\n <Styled.Footer {...sizeProps} sizes={SIZES_FOOTER}>\n {footer}\n </Styled.Footer>\n )}\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":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","entries","forEach","entry","target","DialogComponent","withMergedProps","forwardRef","props","ref","size","layout","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","layoutXXS","layoutXS","layoutS","layoutM","layoutL","layoutXL","root","floats","media","body","caption","title","subtitle","children","footer","closeButton","progressLine","fancy","imgSrcVertical","imgSrcHorizontal","scrollable","scrollFading","draggable","loading","className","backgroundClassName","onGrab","onNudge","restProps","sizeProps","layoutProps","captionProps","appearance","color","wordBreak","marginBottom","sizes","SIZES_CAPTION","titleProps","as","SIZES_TITLE","subtitleProps","SIZES_SUBTITLE","closeButtonProps","icon","secondary","marginTop","marginRight","progressLineProps","rootClassName","concatClassNames","scrollFadingEnabled","scrollTop","setScrollTop","useState","scrollBottom","setScrollBottom","contentRef","setContentRef","handleScrollThresholds","useCallback","e","scrollHeight","clientHeight","Math","abs","useLayoutEffect","observe","unobserve","_jsxs","Styled","layouts","LAYOUTS_FANCY","LAYOUTS","_jsx","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","visible","undefined","onScroll","evt","currentTarget","keyboardKeys","ArrowUp","validate","key","preventDefault","scrollBy","ArrowDown","after","SIZES_FOOTER","SIZES_FANCY","SIZES","displayName"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ 'use strict';const LAYOUTS={vertical:{flexDirection:'column'},horizontal:{flexDirection:'row'},'vertical-reverse':{flexDirection:'column-reverse'},'horizontal-reverse':{flexDirection:'row-reverse'}};const LAYOUTS_FANCY={vertical:{...LAYOUTS.vertical,paddingTop:96},horizontal:{...LAYOUTS.horizontal,paddingTop:0},'vertical-reverse':{...LAYOUTS['vertical-reverse'],paddingTop:96},'horizontal-reverse':{...LAYOUTS['horizontal-reverse'],paddingTop:0}};exports.LAYOUTS=LAYOUTS,exports.LAYOUTS_FANCY=LAYOUTS_FANCY,exports.LAYOUTS_FANCY_MEDIA_VERTICAL={vertical:{borderBottomRightRadius:0,borderBottomLeftRadius:0},horizontal:{display:'none'},'vertical-reverse':{borderBottomRightRadius:'inherit',borderBottomLeftRadius:'inherit'},'horizontal-reverse':{display:'none'}},exports.LAYOUTS_FANCY_PROGRESS={vertical:{top:0,right:0,bottom:'auto',left:0},horizontal:{top:'auto',right:0,bottom:0,left:0},'vertical-reverse':{top:0,right:0,bottom:'auto',left:0},'horizontal-reverse':{top:'auto',right:0,bottom:0,left:0}},exports.LAYOUTS_MEDIA_HORIZONTAL={vertical:{display:'none'},horizontal:{height:'100%',borderTopLeftRadius:'inherit',borderBottomLeftRadius:'inherit',borderTopRightRadius:0,borderBottomRightRadius:0},'vertical-reverse':{display:'none'},'horizontal-reverse':{height:'100%',borderTopLeftRadius:0,borderBottomLeftRadius:0,borderTopRightRadius:'inherit',borderBottomRightRadius:'inherit'}},exports.LAYOUTS_MEDIA_VERTICAL={vertical:{borderTopRightRadius:'inherit',borderTopLeftRadius:'inherit',borderBottomRightRadius:0,borderBottomLeftRadius:0},horizontal:{display:'none'},'vertical-reverse':{borderTopRightRadius:0,borderTopLeftRadius:0,borderBottomRightRadius:'inherit',borderBottomLeftRadius:'inherit'},'horizontal-reverse':{display:'none'}},exports.LAYOUTS_PROGRESS={vertical:{top:0,right:0,left:0},horizontal:{top:0,right:0,left:0},'vertical-reverse':{top:0,right:0,left:0},'horizontal-reverse':{top:0,right:0,left:0}},exports.VISIBILITY_HORIZONTAL={vertical:{display:'none'},horizontal:{},'vertical-reverse':{display:'none'},'horizontal-reverse':{}},exports.VISIBILITY_VERTICAL={vertical:{},horizontal:{display:'none'},'vertical-reverse':{},'horizontal-reverse':{display:'none'}};
2
+ //# sourceMappingURL=layouts.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"layouts.js","sources":["../../../../src/components/DialogComponent/layouts.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Layout } from './types'\n\nexport const LAYOUTS: Record<Layout, CSSProperties> = {\n vertical: {\n flexDirection: 'column',\n },\n horizontal: {\n flexDirection: 'row',\n },\n 'vertical-reverse': {\n flexDirection: 'column-reverse',\n },\n 'horizontal-reverse': {\n flexDirection: 'row-reverse',\n },\n}\n\nexport const LAYOUTS_FANCY: Record<Layout, CSSProperties> = {\n vertical: {\n ...LAYOUTS.vertical,\n paddingTop: 96,\n },\n horizontal: {\n ...LAYOUTS.horizontal,\n paddingTop: 0,\n },\n 'vertical-reverse': {\n ...LAYOUTS['vertical-reverse'],\n paddingTop: 96,\n },\n 'horizontal-reverse': {\n ...LAYOUTS['horizontal-reverse'],\n paddingTop: 0,\n },\n}\n\nexport const LAYOUTS_MEDIA_VERTICAL: Record<Layout, CSSProperties> = {\n vertical: {\n borderTopRightRadius: 'inherit',\n borderTopLeftRadius: 'inherit',\n borderBottomRightRadius: 0,\n borderBottomLeftRadius: 0,\n },\n horizontal: {\n display: 'none',\n },\n 'vertical-reverse': {\n borderTopRightRadius: 0,\n borderTopLeftRadius: 0,\n borderBottomRightRadius: 'inherit',\n borderBottomLeftRadius: 'inherit',\n },\n 'horizontal-reverse': {\n display: 'none',\n },\n}\n\nexport const LAYOUTS_FANCY_MEDIA_VERTICAL: Record<Layout, CSSProperties> = {\n vertical: {\n borderBottomRightRadius: 0,\n borderBottomLeftRadius: 0,\n },\n horizontal: {\n display: 'none',\n },\n 'vertical-reverse': {\n borderBottomRightRadius: 'inherit',\n borderBottomLeftRadius: 'inherit',\n },\n 'horizontal-reverse': {\n display: 'none',\n },\n}\n\nexport const LAYOUTS_MEDIA_HORIZONTAL: Record<Layout, CSSProperties> = {\n vertical: {\n display: 'none',\n },\n horizontal: {\n height: '100%',\n borderTopLeftRadius: 'inherit',\n borderBottomLeftRadius: 'inherit',\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n },\n 'vertical-reverse': {\n display: 'none',\n },\n 'horizontal-reverse': {\n height: '100%',\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n borderTopRightRadius: 'inherit',\n borderBottomRightRadius: 'inherit',\n },\n}\n\nexport const LAYOUTS_PROGRESS: Record<Layout, CSSProperties> = {\n vertical: { top: 0, right: 0, left: 0 },\n horizontal: { top: 0, right: 0, left: 0 },\n 'vertical-reverse': { top: 0, right: 0, left: 0 },\n 'horizontal-reverse': { top: 0, right: 0, left: 0 },\n}\n\nexport const LAYOUTS_FANCY_PROGRESS: Record<Layout, CSSProperties> = {\n vertical: { top: 0, right: 0, bottom: 'auto', left: 0 },\n horizontal: { top: 'auto', right: 0, bottom: 0, left: 0 },\n 'vertical-reverse': { top: 0, right: 0, bottom: 'auto', left: 0 },\n 'horizontal-reverse': { top: 'auto', right: 0, bottom: 0, left: 0 },\n}\n\nexport const VISIBILITY_VERTICAL: Record<Layout, CSSProperties> = {\n vertical: {},\n horizontal: { display: 'none' },\n 'vertical-reverse': {},\n 'horizontal-reverse': { display: 'none' },\n}\n\nexport const VISIBILITY_HORIZONTAL: Record<Layout, CSSProperties> = {\n vertical: { display: 'none' },\n horizontal: {},\n 'vertical-reverse': { display: 'none' },\n 'horizontal-reverse': {},\n}\n"],"names":["LAYOUTS","vertical","flexDirection","horizontal","LAYOUTS_FANCY","paddingTop","borderBottomRightRadius","borderBottomLeftRadius","display","top","right","bottom","left","height","borderTopLeftRadius","borderTopRightRadius"],"mappings":"aAGO,MAAMA,QAAyC,CACpDC,SAAU,CACRC,cAAe,UAEjBC,WAAY,CACVD,cAAe,OAEjB,mBAAoB,CAClBA,cAAe,kBAEjB,qBAAsB,CACpBA,cAAe,gBAIZ,MAAME,cAA+C,CAC1DH,SAAU,IACLD,QAAQC,SACXI,WAAY,IAEdF,WAAY,IACPH,QAAQG,WACXE,WAAY,GAEd,mBAAoB,IACfL,QAAQ,oBACXK,WAAY,IAEd,qBAAsB,IACjBL,QAAQ,sBACXK,WAAY,qGAyB2D,CACzEJ,SAAU,CACRK,wBAAyB,EACzBC,uBAAwB,GAE1BJ,WAAY,CACVK,QAAS,QAEX,mBAAoB,CAClBF,wBAAyB,UACzBC,uBAAwB,WAE1B,qBAAsB,CACpBC,QAAS,wCAkCwD,CACnEP,SAAU,CAAEQ,IAAK,EAAGC,MAAO,EAAGC,OAAQ,OAAQC,KAAM,GACpDT,WAAY,CAAEM,IAAK,OAAQC,MAAO,EAAGC,OAAQ,EAAGC,KAAM,GACtD,mBAAoB,CAAEH,IAAK,EAAGC,MAAO,EAAGC,OAAQ,OAAQC,KAAM,GAC9D,qBAAsB,CAAEH,IAAK,OAAQC,MAAO,EAAGC,OAAQ,EAAGC,KAAM,qCAlCK,CACrEX,SAAU,CACRO,QAAS,QAEXL,WAAY,CACVU,OAAQ,OACRC,oBAAqB,UACrBP,uBAAwB,UACxBQ,qBAAsB,EACtBT,wBAAyB,GAE3B,mBAAoB,CAClBE,QAAS,QAEX,qBAAsB,CACpBK,OAAQ,OACRC,oBAAqB,EACrBP,uBAAwB,EACxBQ,qBAAsB,UACtBT,wBAAyB,2CAzDwC,CACnEL,SAAU,CACRc,qBAAsB,UACtBD,oBAAqB,UACrBR,wBAAyB,EACzBC,uBAAwB,GAE1BJ,WAAY,CACVK,QAAS,QAEX,mBAAoB,CAClBO,qBAAsB,EACtBD,oBAAqB,EACrBR,wBAAyB,UACzBC,uBAAwB,WAE1B,qBAAsB,CACpBC,QAAS,kCA4CkD,CAC7DP,SAAU,CAAEQ,IAAK,EAAGC,MAAO,EAAGE,KAAM,GACpCT,WAAY,CAAEM,IAAK,EAAGC,MAAO,EAAGE,KAAM,GACtC,mBAAoB,CAAEH,IAAK,EAAGC,MAAO,EAAGE,KAAM,GAC9C,qBAAsB,CAAEH,IAAK,EAAGC,MAAO,EAAGE,KAAM,kCAiBkB,CAClEX,SAAU,CAAEO,QAAS,QACrBL,WAAY,CAAE,EACd,mBAAoB,CAAEK,QAAS,QAC/B,qBAAsB,CAAC,+BAXyC,CAChEP,SAAU,CAAE,EACZE,WAAY,CAAEK,QAAS,QACvB,mBAAoB,CAAE,EACtB,qBAAsB,CAAEA,QAAS"}
@@ -0,0 +1,2 @@
1
+ const LAYOUTS={vertical:{flexDirection:'column'},horizontal:{flexDirection:'row'},'vertical-reverse':{flexDirection:'column-reverse'},'horizontal-reverse':{flexDirection:'row-reverse'}};const LAYOUTS_FANCY={vertical:{...LAYOUTS.vertical,paddingTop:96},horizontal:{...LAYOUTS.horizontal,paddingTop:0},'vertical-reverse':{...LAYOUTS['vertical-reverse'],paddingTop:96},'horizontal-reverse':{...LAYOUTS['horizontal-reverse'],paddingTop:0}};const LAYOUTS_MEDIA_VERTICAL={vertical:{borderTopRightRadius:'inherit',borderTopLeftRadius:'inherit',borderBottomRightRadius:0,borderBottomLeftRadius:0},horizontal:{display:'none'},'vertical-reverse':{borderTopRightRadius:0,borderTopLeftRadius:0,borderBottomRightRadius:'inherit',borderBottomLeftRadius:'inherit'},'horizontal-reverse':{display:'none'}};const LAYOUTS_FANCY_MEDIA_VERTICAL={vertical:{borderBottomRightRadius:0,borderBottomLeftRadius:0},horizontal:{display:'none'},'vertical-reverse':{borderBottomRightRadius:'inherit',borderBottomLeftRadius:'inherit'},'horizontal-reverse':{display:'none'}};const LAYOUTS_MEDIA_HORIZONTAL={vertical:{display:'none'},horizontal:{height:'100%',borderTopLeftRadius:'inherit',borderBottomLeftRadius:'inherit',borderTopRightRadius:0,borderBottomRightRadius:0},'vertical-reverse':{display:'none'},'horizontal-reverse':{height:'100%',borderTopLeftRadius:0,borderBottomLeftRadius:0,borderTopRightRadius:'inherit',borderBottomRightRadius:'inherit'}};const LAYOUTS_PROGRESS={vertical:{top:0,right:0,left:0},horizontal:{top:0,right:0,left:0},'vertical-reverse':{top:0,right:0,left:0},'horizontal-reverse':{top:0,right:0,left:0}};const LAYOUTS_FANCY_PROGRESS={vertical:{top:0,right:0,bottom:'auto',left:0},horizontal:{top:'auto',right:0,bottom:0,left:0},'vertical-reverse':{top:0,right:0,bottom:'auto',left:0},'horizontal-reverse':{top:'auto',right:0,bottom:0,left:0}};const VISIBILITY_VERTICAL={vertical:{},horizontal:{display:'none'},'vertical-reverse':{},'horizontal-reverse':{display:'none'}};const VISIBILITY_HORIZONTAL={vertical:{display:'none'},horizontal:{},'vertical-reverse':{display:'none'},'horizontal-reverse':{}};export{LAYOUTS,LAYOUTS_FANCY,LAYOUTS_FANCY_MEDIA_VERTICAL,LAYOUTS_FANCY_PROGRESS,LAYOUTS_MEDIA_HORIZONTAL,LAYOUTS_MEDIA_VERTICAL,LAYOUTS_PROGRESS,VISIBILITY_HORIZONTAL,VISIBILITY_VERTICAL};
2
+ //# sourceMappingURL=layouts.mjs.map