@vkontakte/vkui 5.4.1 → 5.4.3

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 (179) hide show
  1. package/README.md +2 -2
  2. package/dist/cjs/components/ActionSheet/ActionSheetDefaultIosCloseItem.js +1 -1
  3. package/dist/cjs/components/ActionSheet/ActionSheetDefaultIosCloseItem.js.map +1 -1
  4. package/dist/cjs/components/ActionSheetItem/ActionSheetItem.js +7 -3
  5. package/dist/cjs/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
  6. package/dist/cjs/components/Banner/Banner.js +3 -3
  7. package/dist/cjs/components/Banner/Banner.js.map +1 -1
  8. package/dist/cjs/components/Cell/CellDragger/CellDragger.d.ts +2 -2
  9. package/dist/cjs/components/Cell/CellDragger/CellDragger.js +9 -5
  10. package/dist/cjs/components/Cell/CellDragger/CellDragger.js.map +1 -1
  11. package/dist/cjs/components/Cell/useDraggable.d.ts +3 -3
  12. package/dist/cjs/components/Cell/useDraggable.js +12 -7
  13. package/dist/cjs/components/Cell/useDraggable.js.map +1 -1
  14. package/dist/cjs/components/ChipsSelect/ChipsSelect.js +3 -20
  15. package/dist/cjs/components/ChipsSelect/ChipsSelect.js.map +1 -1
  16. package/dist/cjs/components/CustomSelect/CustomSelect.js +16 -2
  17. package/dist/cjs/components/CustomSelect/CustomSelect.js.map +1 -1
  18. package/dist/cjs/components/CustomSelectOption/CustomSelectOption.d.ts +1 -1
  19. package/dist/cjs/components/CustomSelectOption/CustomSelectOption.js +4 -2
  20. package/dist/cjs/components/CustomSelectOption/CustomSelectOption.js.map +1 -1
  21. package/dist/cjs/components/HorizontalCell/HorizontalCell.d.ts +11 -1
  22. package/dist/cjs/components/HorizontalCell/HorizontalCell.js +6 -3
  23. package/dist/cjs/components/HorizontalCell/HorizontalCell.js.map +1 -1
  24. package/dist/cjs/components/ImageBase/ImageBase.js +5 -2
  25. package/dist/cjs/components/ImageBase/ImageBase.js.map +1 -1
  26. package/dist/cjs/components/InfoRow/InfoRow.js +3 -2
  27. package/dist/cjs/components/InfoRow/InfoRow.js.map +1 -1
  28. package/dist/cjs/components/ModalPage/ModalPage.js +6 -1
  29. package/dist/cjs/components/ModalPage/ModalPage.js.map +1 -1
  30. package/dist/cjs/components/ModalPageHeader/ModalPageHeader.js +6 -5
  31. package/dist/cjs/components/ModalPageHeader/ModalPageHeader.js.map +1 -1
  32. package/dist/cjs/components/ModalRoot/ModalRoot.js +30 -12
  33. package/dist/cjs/components/ModalRoot/ModalRoot.js.map +1 -1
  34. package/dist/cjs/components/ModalRoot/types.d.ts +0 -1
  35. package/dist/cjs/components/ModalRoot/types.js.map +1 -1
  36. package/dist/cjs/components/ModalRoot/useModalManager.js +0 -1
  37. package/dist/cjs/components/ModalRoot/useModalManager.js.map +1 -1
  38. package/dist/cjs/components/NativeSelect/NativeSelect.js +2 -1
  39. package/dist/cjs/components/NativeSelect/NativeSelect.js.map +1 -1
  40. package/dist/cjs/components/Panel/Panel.js +4 -4
  41. package/dist/cjs/components/Panel/Panel.js.map +1 -1
  42. package/dist/cjs/components/PanelHeader/PanelHeader.d.ts +8 -4
  43. package/dist/cjs/components/PanelHeader/PanelHeader.js +48 -21
  44. package/dist/cjs/components/PanelHeader/PanelHeader.js.map +1 -1
  45. package/dist/cjs/components/TabsItem/TabsItem.js +3 -2
  46. package/dist/cjs/components/TabsItem/TabsItem.js.map +1 -1
  47. package/dist/cjs/components/VisuallyHidden/VisuallyHidden.d.ts +3 -4
  48. package/dist/cjs/components/VisuallyHidden/VisuallyHidden.js.map +1 -1
  49. package/dist/cjs/components/WriteBar/WriteBar.js +14 -2
  50. package/dist/cjs/components/WriteBar/WriteBar.js.map +1 -1
  51. package/dist/cjs/hooks/useTodayDate.js +30 -7
  52. package/dist/cjs/hooks/useTodayDate.js.map +1 -1
  53. package/dist/components/ActionSheet/ActionSheetDefaultIosCloseItem.js +1 -1
  54. package/dist/components/ActionSheet/ActionSheetDefaultIosCloseItem.js.map +1 -1
  55. package/dist/components/ActionSheetItem/ActionSheetItem.js +7 -3
  56. package/dist/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
  57. package/dist/components/Banner/Banner.js +3 -3
  58. package/dist/components/Banner/Banner.js.map +1 -1
  59. package/dist/components/Cell/CellDragger/CellDragger.d.ts +2 -2
  60. package/dist/components/Cell/CellDragger/CellDragger.js +9 -5
  61. package/dist/components/Cell/CellDragger/CellDragger.js.map +1 -1
  62. package/dist/components/Cell/useDraggable.d.ts +3 -3
  63. package/dist/components/Cell/useDraggable.js +12 -7
  64. package/dist/components/Cell/useDraggable.js.map +1 -1
  65. package/dist/components/ChipsSelect/ChipsSelect.js +3 -20
  66. package/dist/components/ChipsSelect/ChipsSelect.js.map +1 -1
  67. package/dist/components/CustomSelect/CustomSelect.js +16 -2
  68. package/dist/components/CustomSelect/CustomSelect.js.map +1 -1
  69. package/dist/components/CustomSelectOption/CustomSelectOption.d.ts +1 -1
  70. package/dist/components/CustomSelectOption/CustomSelectOption.js +4 -2
  71. package/dist/components/CustomSelectOption/CustomSelectOption.js.map +1 -1
  72. package/dist/components/HorizontalCell/HorizontalCell.d.ts +11 -1
  73. package/dist/components/HorizontalCell/HorizontalCell.js +6 -3
  74. package/dist/components/HorizontalCell/HorizontalCell.js.map +1 -1
  75. package/dist/components/ImageBase/ImageBase.js +5 -2
  76. package/dist/components/ImageBase/ImageBase.js.map +1 -1
  77. package/dist/components/InfoRow/InfoRow.js +3 -2
  78. package/dist/components/InfoRow/InfoRow.js.map +1 -1
  79. package/dist/components/ModalPage/ModalPage.js +6 -1
  80. package/dist/components/ModalPage/ModalPage.js.map +1 -1
  81. package/dist/components/ModalPageHeader/ModalPageHeader.js +6 -5
  82. package/dist/components/ModalPageHeader/ModalPageHeader.js.map +1 -1
  83. package/dist/components/ModalRoot/ModalRoot.js +30 -12
  84. package/dist/components/ModalRoot/ModalRoot.js.map +1 -1
  85. package/dist/components/ModalRoot/types.d.ts +0 -1
  86. package/dist/components/ModalRoot/types.js.map +1 -1
  87. package/dist/components/ModalRoot/useModalManager.js +0 -1
  88. package/dist/components/ModalRoot/useModalManager.js.map +1 -1
  89. package/dist/components/NativeSelect/NativeSelect.js +2 -1
  90. package/dist/components/NativeSelect/NativeSelect.js.map +1 -1
  91. package/dist/components/Panel/Panel.js +4 -4
  92. package/dist/components/Panel/Panel.js.map +1 -1
  93. package/dist/components/PanelHeader/PanelHeader.d.ts +8 -4
  94. package/dist/components/PanelHeader/PanelHeader.js +48 -21
  95. package/dist/components/PanelHeader/PanelHeader.js.map +1 -1
  96. package/dist/components/TabsItem/TabsItem.js +3 -2
  97. package/dist/components/TabsItem/TabsItem.js.map +1 -1
  98. package/dist/components/VisuallyHidden/VisuallyHidden.d.ts +3 -4
  99. package/dist/components/VisuallyHidden/VisuallyHidden.js +3 -4
  100. package/dist/components/VisuallyHidden/VisuallyHidden.js.map +1 -1
  101. package/dist/components/WriteBar/WriteBar.js +14 -2
  102. package/dist/components/WriteBar/WriteBar.js.map +1 -1
  103. package/dist/components.css +15 -15
  104. package/dist/components.css.map +1 -1
  105. package/dist/components.js.tmp +275 -140
  106. package/dist/cssm/components/ActionSheet/ActionSheet.module.css +1 -5
  107. package/dist/cssm/components/ActionSheet/ActionSheetDefaultIosCloseItem.js +1 -1
  108. package/dist/cssm/components/ActionSheet/ActionSheetDefaultIosCloseItem.js.map +1 -1
  109. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.js +7 -3
  110. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
  111. package/dist/cssm/components/ActionSheetItem/ActionSheetItem.module.css +7 -6
  112. package/dist/cssm/components/Banner/Banner.js +3 -3
  113. package/dist/cssm/components/Banner/Banner.js.map +1 -1
  114. package/dist/cssm/components/Banner/Banner.module.css +1 -9
  115. package/dist/cssm/components/Cell/CellDragger/CellDragger.d.ts +2 -2
  116. package/dist/cssm/components/Cell/CellDragger/CellDragger.js +8 -5
  117. package/dist/cssm/components/Cell/CellDragger/CellDragger.js.map +1 -1
  118. package/dist/cssm/components/Cell/useDraggable.d.ts +3 -3
  119. package/dist/cssm/components/Cell/useDraggable.js +12 -7
  120. package/dist/cssm/components/Cell/useDraggable.js.map +1 -1
  121. package/dist/cssm/components/ChipsSelect/ChipsSelect.js +3 -17
  122. package/dist/cssm/components/ChipsSelect/ChipsSelect.js.map +1 -1
  123. package/dist/cssm/components/CustomSelect/CustomSelect.js +15 -2
  124. package/dist/cssm/components/CustomSelect/CustomSelect.js.map +1 -1
  125. package/dist/cssm/components/CustomSelectOption/CustomSelectOption.d.ts +1 -1
  126. package/dist/cssm/components/CustomSelectOption/CustomSelectOption.js +2 -1
  127. package/dist/cssm/components/CustomSelectOption/CustomSelectOption.js.map +1 -1
  128. package/dist/cssm/components/FormLayoutGroup/FormLayoutGroup.module.css +0 -1
  129. package/dist/cssm/components/HorizontalCell/HorizontalCell.d.ts +11 -1
  130. package/dist/cssm/components/HorizontalCell/HorizontalCell.js +4 -2
  131. package/dist/cssm/components/HorizontalCell/HorizontalCell.js.map +1 -1
  132. package/dist/cssm/components/HorizontalCell/HorizontalCell.module.css +23 -11
  133. package/dist/cssm/components/ImageBase/ImageBase.js +5 -2
  134. package/dist/cssm/components/ImageBase/ImageBase.js.map +1 -1
  135. package/dist/cssm/components/ImageBase/ImageBase.module.css +13 -2
  136. package/dist/cssm/components/InfoRow/InfoRow.js +3 -2
  137. package/dist/cssm/components/InfoRow/InfoRow.js.map +1 -1
  138. package/dist/cssm/components/MiniInfoCell/MiniInfoCell.module.css +1 -0
  139. package/dist/cssm/components/ModalPage/ModalPage.js +6 -1
  140. package/dist/cssm/components/ModalPage/ModalPage.js.map +1 -1
  141. package/dist/cssm/components/ModalPageHeader/ModalPageHeader.js +6 -5
  142. package/dist/cssm/components/ModalPageHeader/ModalPageHeader.js.map +1 -1
  143. package/dist/cssm/components/ModalRoot/ModalRoot.js +26 -11
  144. package/dist/cssm/components/ModalRoot/ModalRoot.js.map +1 -1
  145. package/dist/cssm/components/ModalRoot/types.d.ts +0 -1
  146. package/dist/cssm/components/ModalRoot/types.js.map +1 -1
  147. package/dist/cssm/components/ModalRoot/useModalManager.js +0 -1
  148. package/dist/cssm/components/ModalRoot/useModalManager.js.map +1 -1
  149. package/dist/cssm/components/NativeSelect/NativeSelect.js +2 -1
  150. package/dist/cssm/components/NativeSelect/NativeSelect.js.map +1 -1
  151. package/dist/cssm/components/Panel/Panel.js +4 -4
  152. package/dist/cssm/components/Panel/Panel.js.map +1 -1
  153. package/dist/cssm/components/PanelHeader/PanelHeader.d.ts +8 -4
  154. package/dist/cssm/components/PanelHeader/PanelHeader.js +45 -19
  155. package/dist/cssm/components/PanelHeader/PanelHeader.js.map +1 -1
  156. package/dist/cssm/components/PanelHeaderContent/PanelHeaderContent.module.css +1 -1
  157. package/dist/cssm/components/PullToRefresh/PullToRefresh.module.css +3 -0
  158. package/dist/cssm/components/TabsItem/TabsItem.js +3 -2
  159. package/dist/cssm/components/TabsItem/TabsItem.js.map +1 -1
  160. package/dist/cssm/components/Typography/Typography.module.css +2 -1
  161. package/dist/cssm/components/VisuallyHidden/VisuallyHidden.d.ts +3 -4
  162. package/dist/cssm/components/VisuallyHidden/VisuallyHidden.js +3 -4
  163. package/dist/cssm/components/VisuallyHidden/VisuallyHidden.js.map +1 -1
  164. package/dist/cssm/components/VisuallyHidden/VisuallyHidden.module.css +9 -5
  165. package/dist/cssm/components/WriteBar/WriteBar.js +15 -2
  166. package/dist/cssm/components/WriteBar/WriteBar.js.map +1 -1
  167. package/dist/cssm/components/WriteBar/WriteBar.module.css +13 -7
  168. package/dist/cssm/components/WriteBarIcon/WriteBarIcon.module.css +9 -1
  169. package/dist/cssm/hooks/useTodayDate.js +31 -8
  170. package/dist/cssm/hooks/useTodayDate.js.map +1 -1
  171. package/dist/cssm/styles/constants.css +3 -2
  172. package/dist/hooks/useTodayDate.js +31 -8
  173. package/dist/hooks/useTodayDate.js.map +1 -1
  174. package/dist/vkui.css +15 -15
  175. package/dist/vkui.css.map +1 -1
  176. package/dist/vkui.js.tmp +275 -140
  177. package/package.json +3 -5
  178. package/docs/assets/assets/vkui-logo-dark.svg +0 -5
  179. package/docs/assets/assets/vkui-logo-light.svg +0 -5
@@ -27,6 +27,7 @@
27
27
  overflow: hidden;
28
28
  text-overflow: ellipsis;
29
29
  white-space: nowrap;
30
+ word-break: break-word;
30
31
  }
31
32
 
32
33
  .MiniInfoCell--textWrap-short .MiniInfoCell__content {
@@ -29,8 +29,13 @@ const warn = warnOnce('ModalPage');
29
29
  const platform = usePlatform();
30
30
  const orientation = useOrientationChange();
31
31
  const { sizeX , isDesktop } = useAdaptivityWithJSMediaQueries();
32
- React.useEffect(updateModalHeight, [
32
+ React.useEffect(()=>{
33
+ if (dynamicContentHeight) {
34
+ updateModalHeight();
35
+ }
36
+ }, [
33
37
  children,
38
+ dynamicContentHeight,
34
39
  orientation,
35
40
  updateModalHeight
36
41
  ]);
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/ModalPage/ModalPage.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useId } from '../../hooks/useId';\nimport { useOrientationChange } from '../../hooks/useOrientationChange';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { Platform } from '../../lib/platform';\nimport { multiRef } from '../../lib/utils';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { ModalRootContext, useModalRegistry } from '../ModalRoot/ModalRootContext';\nimport { ModalType } from '../ModalRoot/types';\nimport { ModalPageContext } from './ModalPageContext';\nimport styles from './ModalPage.module.css';\n\nconst sizeClassName = {\n s: styles['ModalPage--size-s'],\n m: styles['ModalPage--size-m'],\n l: styles['ModalPage--size-l'],\n};\n\nexport interface ModalPageProps extends React.HTMLAttributes<HTMLDivElement>, NavIdProps {\n /**\n * Шапка модальной страницы, `<ModalPageHeader />`\n */\n header?: React.ReactNode;\n /**\n * Задаёт контенту максимальную ширину для десктопной версии.\n */\n size?: 's' | 'm' | 'l' | number;\n /**\n * Будет вызвано при начале открытия модалки.\n */\n onOpen?: VoidFunction;\n /**\n * Будет вызвано при окончательном открытии модалки.\n */\n onOpened?: VoidFunction;\n /**\n * Будет вызвано при начале закрытия модалки.\n */\n onClose?: VoidFunction;\n /**\n * Будет вызвано при окончательном закрытии модалки.\n */\n onClosed?: VoidFunction;\n /**\n * Процент, на который изначально будет открыта модальная страница. При `settlingHeight={100}` модальная страница раскрывается на всю высоту.\n */\n settlingHeight?: number;\n /**\n * Если высота контента в модальной странице может поменяться, нужно установить это свойство\n */\n dynamicContentHeight?: boolean;\n getModalContentRef?: React.Ref<HTMLDivElement>;\n /**\n * Скрывает кнопку закрытия (актуально для iOS, т.к. можно отрисовать кнопку закрытия внутри модалки)\n */\n hideCloseButton?: boolean;\n}\n\nconst warn = warnOnce('ModalPage');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalPage\n */\nexport const ModalPage = ({\n children,\n header,\n size: sizeProp = 's',\n onOpen,\n onOpened,\n onClose,\n onClosed,\n settlingHeight, // 75\n dynamicContentHeight,\n getModalContentRef,\n nav,\n id: idProp,\n hideCloseButton = false,\n className,\n ...restProps\n}: ModalPageProps) => {\n const generatingId = useId();\n const id = idProp || generatingId;\n\n const { updateModalHeight } = React.useContext(ModalRootContext);\n\n const platform = usePlatform();\n const orientation = useOrientationChange();\n const { sizeX, isDesktop } = useAdaptivityWithJSMediaQueries();\n\n React.useEffect(updateModalHeight, [children, orientation, updateModalHeight]);\n\n const isCloseButtonShown = !hideCloseButton && isDesktop;\n const size = isDesktop ? sizeProp : 's';\n\n const modalContext = React.useContext(ModalRootContext);\n const { refs } = useModalRegistry(getNavId({ nav, id }, warn), ModalType.PAGE);\n\n const contextValue = React.useMemo(() => ({ labelId: `${id}-label` }), [id]);\n\n return (\n <ModalPageContext.Provider value={contextValue}>\n <div\n {...restProps}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={contextValue.labelId}\n id={id}\n className={classNames(\n styles['ModalPage'],\n platform === Platform.IOS && styles['ModalPage--ios'],\n isDesktop && styles['ModalPage--desktop'],\n sizeX === SizeType.REGULAR && 'vkuiInternalModalPage--sizeX-regular',\n typeof size === 'string' && sizeClassName[size],\n className,\n )}\n >\n <div\n className={styles['ModalPage__in-wrap']}\n style={{\n maxWidth: typeof size === 'number' ? size : undefined,\n }}\n ref={refs.innerElement}\n >\n <div className={styles['ModalPage__in']}>\n <div className={styles['ModalPage__header']} ref={refs.headerElement}>\n {header}\n </div>\n\n <div className={styles['ModalPage__content-wrap']}>\n <div\n className={styles['ModalPage__content']}\n ref={multiRef<HTMLDivElement>(refs.contentElement, getModalContentRef)}\n >\n <div className={styles['ModalPage__content-in']}>{children}</div>\n </div>\n </div>\n {isCloseButtonShown && <ModalDismissButton onClick={onClose || modalContext.onClose} />}\n </div>\n </div>\n </div>\n </ModalPageContext.Provider>\n );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","useId","useOrientationChange","usePlatform","SizeType","getNavId","Platform","multiRef","warnOnce","ModalDismissButton","ModalRootContext","useModalRegistry","ModalType","ModalPageContext","styles","sizeClassName","s","m","l","warn","ModalPage","children","header","size","sizeProp","onOpen","onOpened","onClose","onClosed","settlingHeight","dynamicContentHeight","getModalContentRef","nav","id","idProp","hideCloseButton","className","restProps","generatingId","updateModalHeight","useContext","platform","orientation","sizeX","isDesktop","useEffect","isCloseButtonShown","modalContext","refs","PAGE","contextValue","useMemo","labelId","Provider","value","div","role","aria-modal","aria-labelledby","IOS","REGULAR","style","maxWidth","undefined","ref","innerElement","headerElement","contentElement","onClick"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../../src/components/ModalPage/ModalPage.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useId } from '../../hooks/useId';\nimport { useOrientationChange } from '../../hooks/useOrientationChange';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { Platform } from '../../lib/platform';\nimport { multiRef } from '../../lib/utils';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { ModalRootContext, useModalRegistry } from '../ModalRoot/ModalRootContext';\nimport { ModalType } from '../ModalRoot/types';\nimport { ModalPageContext } from './ModalPageContext';\nimport styles from './ModalPage.module.css';\n\nconst sizeClassName = {\n s: styles['ModalPage--size-s'],\n m: styles['ModalPage--size-m'],\n l: styles['ModalPage--size-l'],\n};\n\nexport interface ModalPageProps extends React.HTMLAttributes<HTMLDivElement>, NavIdProps {\n /**\n * Шапка модальной страницы, `<ModalPageHeader />`\n */\n header?: React.ReactNode;\n /**\n * Задаёт контенту максимальную ширину для десктопной версии.\n */\n size?: 's' | 'm' | 'l' | number;\n /**\n * Будет вызвано при начале открытия модалки.\n */\n onOpen?: VoidFunction;\n /**\n * Будет вызвано при окончательном открытии модалки.\n */\n onOpened?: VoidFunction;\n /**\n * Будет вызвано при начале закрытия модалки.\n */\n onClose?: VoidFunction;\n /**\n * Будет вызвано при окончательном закрытии модалки.\n */\n onClosed?: VoidFunction;\n /**\n * Процент, на который изначально будет открыта модальная страница. При `settlingHeight={100}` модальная страница раскрывается на всю высоту.\n */\n settlingHeight?: number;\n /**\n * Если высота контента в модальной странице может поменяться, нужно установить это свойство\n */\n dynamicContentHeight?: boolean;\n getModalContentRef?: React.Ref<HTMLDivElement>;\n /**\n * Скрывает кнопку закрытия (актуально для iOS, т.к. можно отрисовать кнопку закрытия внутри модалки)\n */\n hideCloseButton?: boolean;\n}\n\nconst warn = warnOnce('ModalPage');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalPage\n */\nexport const ModalPage = ({\n children,\n header,\n size: sizeProp = 's',\n onOpen,\n onOpened,\n onClose,\n onClosed,\n settlingHeight, // 75\n dynamicContentHeight,\n getModalContentRef,\n nav,\n id: idProp,\n hideCloseButton = false,\n className,\n ...restProps\n}: ModalPageProps) => {\n const generatingId = useId();\n const id = idProp || generatingId;\n\n const { updateModalHeight } = React.useContext(ModalRootContext);\n\n const platform = usePlatform();\n const orientation = useOrientationChange();\n const { sizeX, isDesktop } = useAdaptivityWithJSMediaQueries();\n\n React.useEffect(() => {\n if (dynamicContentHeight) {\n updateModalHeight();\n }\n }, [children, dynamicContentHeight, orientation, updateModalHeight]);\n\n const isCloseButtonShown = !hideCloseButton && isDesktop;\n const size = isDesktop ? sizeProp : 's';\n\n const modalContext = React.useContext(ModalRootContext);\n const { refs } = useModalRegistry(getNavId({ nav, id }, warn), ModalType.PAGE);\n\n const contextValue = React.useMemo(() => ({ labelId: `${id}-label` }), [id]);\n\n return (\n <ModalPageContext.Provider value={contextValue}>\n <div\n {...restProps}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={contextValue.labelId}\n id={id}\n className={classNames(\n styles['ModalPage'],\n platform === Platform.IOS && styles['ModalPage--ios'],\n isDesktop && styles['ModalPage--desktop'],\n sizeX === SizeType.REGULAR && 'vkuiInternalModalPage--sizeX-regular',\n typeof size === 'string' && sizeClassName[size],\n className,\n )}\n >\n <div\n className={styles['ModalPage__in-wrap']}\n style={{\n maxWidth: typeof size === 'number' ? size : undefined,\n }}\n ref={refs.innerElement}\n >\n <div className={styles['ModalPage__in']}>\n <div className={styles['ModalPage__header']} ref={refs.headerElement}>\n {header}\n </div>\n\n <div className={styles['ModalPage__content-wrap']}>\n <div\n className={styles['ModalPage__content']}\n ref={multiRef<HTMLDivElement>(refs.contentElement, getModalContentRef)}\n >\n <div className={styles['ModalPage__content-in']}>{children}</div>\n </div>\n </div>\n {isCloseButtonShown && <ModalDismissButton onClick={onClose || modalContext.onClose} />}\n </div>\n </div>\n </div>\n </ModalPageContext.Provider>\n );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","useId","useOrientationChange","usePlatform","SizeType","getNavId","Platform","multiRef","warnOnce","ModalDismissButton","ModalRootContext","useModalRegistry","ModalType","ModalPageContext","styles","sizeClassName","s","m","l","warn","ModalPage","children","header","size","sizeProp","onOpen","onOpened","onClose","onClosed","settlingHeight","dynamicContentHeight","getModalContentRef","nav","id","idProp","hideCloseButton","className","restProps","generatingId","updateModalHeight","useContext","platform","orientation","sizeX","isDesktop","useEffect","isCloseButtonShown","modalContext","refs","PAGE","contextValue","useMemo","labelId","Provider","value","div","role","aria-modal","aria-labelledby","IOS","REGULAR","style","maxWidth","undefined","ref","innerElement","headerElement","contentElement","onClick"],"mappings":"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"}
@@ -22,11 +22,12 @@ import styles from './ModalPageHeader.module.css';
22
22
  ...restProps,
23
23
  fixed: false,
24
24
  separator: false,
25
- transparent: true
26
- }, /*#__PURE__*/ React.createElement(PanelHeader.Content, {
27
- Component: "h2",
28
- id: labelId
29
- }, children)), hasSeparator && /*#__PURE__*/ React.createElement(Separator, {
25
+ transparent: true,
26
+ typographyProps: {
27
+ Component: 'h2',
28
+ id: labelId
29
+ }
30
+ }, children), hasSeparator && /*#__PURE__*/ React.createElement(Separator, {
30
31
  wide: true
31
32
  }));
32
33
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRef } from '../../types';\nimport { ModalPageContext } from '../ModalPage/ModalPageContext';\nimport { PanelHeader, PanelHeaderProps } from '../PanelHeader/PanelHeader';\nimport { Separator } from '../Separator/Separator';\nimport styles from './ModalPageHeader.module.css';\n\nexport interface ModalPageHeaderProps\n extends React.HTMLAttributes<HTMLDivElement>,\n Omit<PanelHeaderProps, 'fixed' | 'shadow'>,\n HasRef<HTMLDivElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalPageHeader\n */\nexport const ModalPageHeader = ({\n children,\n separator = true,\n getRef,\n className,\n ...restProps\n}: ModalPageHeaderProps) => {\n const platform = usePlatform();\n const hasSeparator = separator && platform === Platform.VKCOM;\n const { isDesktop } = useAdaptivityWithJSMediaQueries();\n const { labelId } = React.useContext(ModalPageContext);\n\n return (\n <div\n className={classNames(\n styles['ModalPageHeader'],\n platform !== Platform.VKCOM && styles['ModalPageHeader--withGaps'],\n isDesktop && styles['ModalPageHeader--desktop'],\n )}\n ref={getRef}\n >\n <PanelHeader\n className={classNames('vkuiInternalModalPageHeader__in', className)}\n {...restProps}\n fixed={false}\n separator={false}\n transparent\n >\n <PanelHeader.Content Component=\"h2\" id={labelId}>\n {children}\n </PanelHeader.Content>\n </PanelHeader>\n {hasSeparator && <Separator wide />}\n </div>\n );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","usePlatform","Platform","ModalPageContext","PanelHeader","Separator","styles","ModalPageHeader","children","separator","getRef","className","restProps","platform","hasSeparator","VKCOM","isDesktop","labelId","useContext","div","ref","fixed","transparent","Content","Component","id","wide"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,8CAA8C;AAC9F,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAE9C,SAASC,gBAAgB,QAAQ,gCAAgC;AACjE,SAASC,WAAW,QAA0B,6BAA6B;AAC3E,SAASC,SAAS,QAAQ,yBAAyB;AACnD,OAAOC,YAAY,+BAA+B;AAOlD;;CAEC,GACD,OAAO,MAAMC,kBAAkB,CAAC,EAC9BC,SAAQ,EACRC,WAAY,IAAI,CAAA,EAChBC,OAAM,EACNC,UAAS,EACT,GAAGC,WACkB,GAAK;IAC1B,MAAMC,WAAWZ;IACjB,MAAMa,eAAeL,aAAaI,aAAaX,SAASa,KAAK;IAC7D,MAAM,EAAEC,UAAS,EAAE,GAAGhB;IACtB,MAAM,EAAEiB,QAAO,EAAE,GAAGnB,MAAMoB,UAAU,CAACf;IAErC,qBACE,oBAACgB;QACCR,WAAWZ,WACTO,MAAM,CAAC,kBAAkB,EACzBO,aAAaX,SAASa,KAAK,IAAIT,MAAM,CAAC,4BAA4B,EAClEU,aAAaV,MAAM,CAAC,2BAA2B;QAEjDc,KAAKV;qBAEL,oBAACN;QACCO,WAAWZ,WAAW,mCAAmCY;QACxD,GAAGC,SAAS;QACbS,OAAO,KAAK;QACZZ,WAAW,KAAK;QAChBa,aAAAA,IAAW;qBAEX,oBAAClB,YAAYmB,OAAO;QAACC,WAAU;QAAKC,IAAIR;OACrCT,YAGJM,8BAAgB,oBAACT;QAAUqB,MAAAA,IAAI;;AAGtC,EAAE"}
1
+ {"version":3,"sources":["../../../../src/components/ModalPageHeader/ModalPageHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRef } from '../../types';\nimport { ModalPageContext } from '../ModalPage/ModalPageContext';\nimport { PanelHeader, PanelHeaderProps } from '../PanelHeader/PanelHeader';\nimport { Separator } from '../Separator/Separator';\nimport styles from './ModalPageHeader.module.css';\n\nexport interface ModalPageHeaderProps\n extends React.HTMLAttributes<HTMLDivElement>,\n Omit<PanelHeaderProps, 'fixed' | 'shadow'>,\n HasRef<HTMLDivElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalPageHeader\n */\nexport const ModalPageHeader = ({\n children,\n separator = true,\n getRef,\n className,\n ...restProps\n}: ModalPageHeaderProps) => {\n const platform = usePlatform();\n const hasSeparator = separator && platform === Platform.VKCOM;\n const { isDesktop } = useAdaptivityWithJSMediaQueries();\n const { labelId } = React.useContext(ModalPageContext);\n\n return (\n <div\n className={classNames(\n styles['ModalPageHeader'],\n platform !== Platform.VKCOM && styles['ModalPageHeader--withGaps'],\n isDesktop && styles['ModalPageHeader--desktop'],\n )}\n ref={getRef}\n >\n <PanelHeader\n className={classNames('vkuiInternalModalPageHeader__in', className)}\n {...restProps}\n fixed={false}\n separator={false}\n transparent\n typographyProps={{\n Component: 'h2',\n id: labelId,\n }}\n >\n {children}\n </PanelHeader>\n {hasSeparator && <Separator wide />}\n </div>\n );\n};\n"],"names":["React","classNames","useAdaptivityWithJSMediaQueries","usePlatform","Platform","ModalPageContext","PanelHeader","Separator","styles","ModalPageHeader","children","separator","getRef","className","restProps","platform","hasSeparator","VKCOM","isDesktop","labelId","useContext","div","ref","fixed","transparent","typographyProps","Component","id","wide"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,+BAA+B,QAAQ,8CAA8C;AAC9F,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAE9C,SAASC,gBAAgB,QAAQ,gCAAgC;AACjE,SAASC,WAAW,QAA0B,6BAA6B;AAC3E,SAASC,SAAS,QAAQ,yBAAyB;AACnD,OAAOC,YAAY,+BAA+B;AAOlD;;CAEC,GACD,OAAO,MAAMC,kBAAkB,CAAC,EAC9BC,SAAQ,EACRC,WAAY,IAAI,CAAA,EAChBC,OAAM,EACNC,UAAS,EACT,GAAGC,WACkB,GAAK;IAC1B,MAAMC,WAAWZ;IACjB,MAAMa,eAAeL,aAAaI,aAAaX,SAASa,KAAK;IAC7D,MAAM,EAAEC,UAAS,EAAE,GAAGhB;IACtB,MAAM,EAAEiB,QAAO,EAAE,GAAGnB,MAAMoB,UAAU,CAACf;IAErC,qBACE,oBAACgB;QACCR,WAAWZ,WACTO,MAAM,CAAC,kBAAkB,EACzBO,aAAaX,SAASa,KAAK,IAAIT,MAAM,CAAC,4BAA4B,EAClEU,aAAaV,MAAM,CAAC,2BAA2B;QAEjDc,KAAKV;qBAEL,oBAACN;QACCO,WAAWZ,WAAW,mCAAmCY;QACxD,GAAGC,SAAS;QACbS,OAAO,KAAK;QACZZ,WAAW,KAAK;QAChBa,aAAAA,IAAW;QACXC,iBAAiB;YACfC,WAAW;YACXC,IAAIR;QACN;OAECT,WAEFM,8BAAgB,oBAACT;QAAUqB,MAAAA,IAAI;;AAGtC,EAAE"}
@@ -34,7 +34,8 @@ class ModalRootTouchComponent extends React.Component {
34
34
  super(props);
35
35
  this.state = {
36
36
  touchDown: false,
37
- dragging: false
37
+ dragging: false,
38
+ modalOpenedLog: []
38
39
  };
39
40
  this.maskElementRef = /*#__PURE__*/ React.createRef();
40
41
  this.modalRootContext = {
@@ -65,14 +66,12 @@ class ModalRootTouchComponent extends React.Component {
65
66
  return React.Children.toArray(this.props.children);
66
67
  }
67
68
  componentDidMount() {
68
- // Отслеживаем изменение размеров viewport (Необходимо для iOS)
69
- if (this.props.platform === Platform.IOS) {
70
- this.window?.addEventListener('resize', this.updateModalTranslate, false);
71
- }
69
+ // Отслеживаем изменение размеров viewport
70
+ this.window?.addEventListener('resize', this.updateModalHeight, false);
72
71
  }
73
72
  componentWillUnmount() {
74
73
  this.toggleDocumentScrolling(true);
75
- this.window.removeEventListener('resize', this.updateModalTranslate, false);
74
+ this.window.removeEventListener('resize', this.updateModalHeight, false);
76
75
  }
77
76
  componentDidUpdate(prevProps) {
78
77
  // transition phase 2: animate exiting modal
@@ -136,10 +135,6 @@ class ModalRootTouchComponent extends React.Component {
136
135
  }
137
136
  return false;
138
137
  };
139
- updateModalTranslate = ()=>{
140
- const modalState = this.props.getModalState(this.props.activeModal);
141
- modalState && this.animateTranslate(modalState, modalState.translateY);
142
- };
143
138
  checkPageContentHeight() {
144
139
  const modalState = this.props.getModalState(this.props.activeModal);
145
140
  if (modalState?.type === ModalType.PAGE && modalState?.modalElement) {
@@ -165,7 +160,7 @@ class ModalRootTouchComponent extends React.Component {
165
160
  }
166
161
  updateModalHeight = ()=>{
167
162
  const modalState = this.props.getModalState(this.props.activeModal);
168
- if (modalState && modalState.type === ModalType.PAGE && modalState.dynamicContentHeight) {
163
+ if (modalState && modalState.type === ModalType.PAGE) {
169
164
  if (this.props.enteringModal) {
170
165
  this.waitTransitionFinish(modalState, ()=>{
171
166
  requestAnimationFrame(()=>this.checkPageContentHeight());
@@ -185,6 +180,14 @@ class ModalRootTouchComponent extends React.Component {
185
180
  id && warn(`closeActiveModal: модальное окно (страница) ${id} не существует`, 'error');
186
181
  return;
187
182
  }
183
+ if (!this.state.modalOpenedLog.length) {
184
+ this.setState((prevState)=>({
185
+ modalOpenedLog: [
186
+ ...prevState.modalOpenedLog,
187
+ id
188
+ ]
189
+ }));
190
+ }
188
191
  const nextModalState = this.props.getModalState(this.props.activeModal);
189
192
  const nextIsPage = !!nextModalState && nextModalState.type === ModalType.PAGE;
190
193
  const prevIsPage = !!prevModalState && prevModalState.type === ModalType.PAGE;
@@ -194,6 +197,18 @@ class ModalRootTouchComponent extends React.Component {
194
197
  if (!nextModalState) {
195
198
  // NOTE: was only for clean exit
196
199
  this.setMaskOpacity(prevModalState, 0);
200
+ this.setState({
201
+ modalOpenedLog: []
202
+ });
203
+ prevModalState.translateY = undefined;
204
+ } else if (nextModalState.id && !this.state.modalOpenedLog.includes(nextModalState.id)) {
205
+ nextModalState.translateY = undefined;
206
+ this.setState((prevState)=>({
207
+ modalOpenedLog: [
208
+ ...prevState.modalOpenedLog,
209
+ nextModalState.id
210
+ ]
211
+ }));
197
212
  }
198
213
  }
199
214
  onTouchMove = (e)=>{
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/ModalRoot/ModalRoot.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { clamp } from '../../helpers/math';\nimport { withContext } from '../../hoc/withContext';\nimport { withPlatform } from '../../hoc/withPlatform';\nimport { DOMProps, withDOM } from '../../lib/dom';\nimport { getNavId } from '../../lib/getNavId';\nimport { Platform } from '../../lib/platform';\nimport { setTransformStyle } from '../../lib/styles';\nimport { transitionEvent } from '../../lib/supportEvents';\nimport { rubber } from '../../lib/touch';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ConfigProviderContext, WebviewType } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Touch, TouchEvent } from '../Touch/Touch';\nimport TouchRootContext from '../Touch/TouchContext';\nimport { ModalRootContext, ModalRootContextInterface } from './ModalRootContext';\nimport { MODAL_PAGE_DEFAULT_PERCENT_HEIGHT } from './constants';\nimport { ModalRootWithDOMProps, ModalsStateEntry, ModalType, TranslateRange } from './types';\nimport { ModalTransitionProps, withModalManager } from './useModalManager';\nimport styles from './ModalRoot.module.css';\n\nconst warn = warnOnce('ModalRoot');\n\nfunction numberInRange(number: number, range: TranslateRange | undefined) {\n if (!range) {\n return false;\n }\n return number >= range[0] && number <= range[1];\n}\n\nfunction rangeTranslate(number: number) {\n return clamp(number, 0, 98);\n}\n\ninterface ModalRootState {\n touchDown?: boolean;\n dragging?: boolean;\n}\n\nclass ModalRootTouchComponent extends React.Component<\n ModalRootWithDOMProps & DOMProps & ModalTransitionProps,\n ModalRootState\n> {\n constructor(props: ModalRootWithDOMProps & ModalTransitionProps) {\n super(props);\n this.state = {\n touchDown: false,\n dragging: false,\n };\n\n this.maskElementRef = React.createRef();\n\n this.modalRootContext = {\n updateModalHeight: this.updateModalHeight,\n registerModal: ({ id, ...data }) => Object.assign(this.props.getModalState(id) ?? {}, data),\n onClose: () => this.props.onExit(),\n isInsideModal: true,\n };\n\n this.frameIds = {};\n }\n\n private documentScrolling = false;\n private readonly maskElementRef: React.RefObject<HTMLDivElement>;\n private readonly viewportRef = React.createRef<HTMLDivElement>();\n private maskAnimationFrame: number | undefined = undefined;\n private readonly modalRootContext: ModalRootContextInterface;\n private readonly frameIds: {\n [index: string]: number;\n };\n private restoreFocusTo: HTMLElement | undefined | null = undefined;\n\n get timeout(): number {\n return this.props.platform === Platform.IOS ? 400 : 320;\n }\n\n get document(): Document {\n return this.props.document as Document;\n }\n\n get window(): Window {\n return this.props.window as Window;\n }\n\n getModals() {\n return React.Children.toArray(this.props.children) as React.ReactElement[];\n }\n\n componentDidMount() {\n // Отслеживаем изменение размеров viewport (Необходимо для iOS)\n if (this.props.platform === Platform.IOS) {\n this.window?.addEventListener('resize', this.updateModalTranslate, false);\n }\n }\n\n componentWillUnmount() {\n this.toggleDocumentScrolling(true);\n this.window.removeEventListener('resize', this.updateModalTranslate, false);\n }\n\n componentDidUpdate(prevProps: ModalRootWithDOMProps & ModalTransitionProps) {\n // transition phase 2: animate exiting modal\n if (this.props.exitingModal && this.props.exitingModal !== prevProps.exitingModal) {\n this.closeModal(this.props.exitingModal);\n }\n\n // transition phase 3: animate entering modal\n if (this.props.enteringModal && this.props.enteringModal !== prevProps.enteringModal) {\n const { enteringModal } = this.props;\n const enteringState = this.props.getModalState(enteringModal);\n this.props.onEnter();\n this.waitTransitionFinish(enteringState, () => {\n if (enteringState?.innerElement) {\n enteringState.innerElement.style.transitionDelay = '';\n }\n this.props.onEntered(enteringModal);\n });\n\n if (enteringState?.innerElement) {\n enteringState.innerElement.style.transitionDelay = this.props.delayEnter\n ? `${this.timeout}ms`\n : '';\n this.animateTranslate(enteringState, enteringState.translateY);\n }\n }\n\n // focus restoration\n if (this.props.activeModal && !prevProps.activeModal) {\n this.restoreFocusTo = this.document.activeElement as HTMLElement;\n }\n if (!this.props.activeModal && !this.props.exitingModal && this.restoreFocusTo) {\n this.restoreFocusTo.focus();\n this.restoreFocusTo = null;\n }\n\n this.toggleDocumentScrolling(!this.props.activeModal && !this.props.exitingModal);\n }\n\n /* Отключает скролл документа */\n toggleDocumentScrolling(enabled: boolean) {\n if (this.documentScrolling === enabled) {\n return;\n }\n this.documentScrolling = enabled;\n\n if (enabled) {\n // Здесь нужен последний аргумент с такими же параметрами, потому что\n // некоторые браузеры на странных вендорах типа Meizu не удаляют обработчик.\n // https://github.com/VKCOM/VKUI/issues/444\n this.window.removeEventListener('touchmove', this.preventTouch, {\n // @ts-expect-error: TS2769 В интерфейсе EventListenerOptions нет поля passive\n passive: false,\n });\n } else {\n this.window.addEventListener('touchmove', this.preventTouch, {\n passive: false,\n });\n }\n }\n\n preventTouch = (event: any) => {\n if (!event) {\n return false;\n }\n while (event.originalEvent) {\n event = event.originalEvent;\n }\n if (event.preventDefault) {\n event.preventDefault();\n }\n return false;\n };\n\n updateModalTranslate = () => {\n const modalState = this.props.getModalState(this.props.activeModal);\n modalState && this.animateTranslate(modalState, modalState.translateY);\n };\n\n checkPageContentHeight() {\n const modalState = this.props.getModalState(this.props.activeModal);\n\n if (modalState?.type === ModalType.PAGE && modalState?.modalElement) {\n const prevModalState = { ...modalState };\n initPageModal(modalState);\n const currentModalState = { ...modalState };\n\n let needAnimate = false;\n\n if (prevModalState.expandable === currentModalState.expandable) {\n if (prevModalState.translateYFrom !== currentModalState.translateYFrom) {\n needAnimate = true;\n }\n } else {\n needAnimate = true;\n }\n\n if (needAnimate) {\n this.animateTranslate(modalState, modalState.translateY);\n }\n }\n }\n\n updateModalHeight = () => {\n const modalState = this.props.getModalState(this.props.activeModal);\n\n if (modalState && modalState.type === ModalType.PAGE && modalState.dynamicContentHeight) {\n if (this.props.enteringModal) {\n this.waitTransitionFinish(modalState, () => {\n requestAnimationFrame(() => this.checkPageContentHeight());\n });\n } else {\n requestAnimationFrame(() => this.checkPageContentHeight());\n }\n }\n };\n\n closeModal(id: string) {\n // Сбрасываем состояния, которые могут помешать закрытию модального окна\n this.setState({ touchDown: false });\n\n const prevModalState = this.props.getModalState(id);\n\n if (!prevModalState) {\n id && warn(`closeActiveModal: модальное окно (страница) ${id} не существует`, 'error');\n return;\n }\n\n const nextModalState = this.props.getModalState(this.props.activeModal);\n const nextIsPage = !!nextModalState && nextModalState.type === ModalType.PAGE;\n\n const prevIsPage = !!prevModalState && prevModalState.type === ModalType.PAGE;\n this.waitTransitionFinish(prevModalState, () => this.props.onExited(id));\n const exitTranslate =\n prevIsPage &&\n nextIsPage &&\n (prevModalState.translateY ?? 0) <= (nextModalState?.translateYFrom ?? 0) &&\n !this.props.isBack\n ? (nextModalState?.translateYFrom ?? 0) + 10\n : 100;\n this.animateTranslate(prevModalState, exitTranslate);\n\n if (!nextModalState) {\n // NOTE: was only for clean exit\n this.setMaskOpacity(prevModalState, 0);\n }\n }\n\n onTouchMove = (e: TouchEvent) => {\n if (this.props.exitingModal) {\n return;\n }\n const modalState = this.props.getModalState(this.props.activeModal);\n if (!modalState) {\n return;\n }\n\n if (modalState.type === ModalType.PAGE) {\n return this.onPageTouchMove(e, modalState);\n }\n\n if (modalState.type === ModalType.CARD) {\n return this.onCardTouchMove(e, modalState);\n }\n };\n\n onPageTouchMove(event: TouchEvent, modalState: ModalsStateEntry) {\n const { shiftY, originalEvent } = event;\n const target = originalEvent.target as HTMLElement;\n\n if (!event.isY) {\n if (this.viewportRef.current?.contains(target)) {\n originalEvent.preventDefault();\n }\n return;\n }\n\n if (!modalState.innerElement?.contains(target)) {\n return originalEvent.preventDefault();\n }\n\n originalEvent.stopPropagation();\n\n const { expandable, contentScrolled, collapsed, expanded } = modalState;\n\n if (!this.state.touchDown) {\n modalState.touchStartContentScrollTop = modalState.contentElement?.scrollTop ?? 0;\n this.setState({ touchDown: true });\n }\n\n if (contentScrolled) {\n return;\n }\n\n if (modalState.touchMovePositive === null) {\n modalState.touchMovePositive = shiftY > 0;\n }\n\n if (\n !modalState.expandable ||\n collapsed ||\n (expanded && modalState.touchMovePositive && modalState.touchStartContentScrollTop === 0) ||\n modalState.headerElement?.contains(target)\n ) {\n originalEvent.preventDefault();\n\n if ((!expandable && shiftY < 0) || !this.window) {\n return;\n }\n\n !this.state.dragging && this.setState({ dragging: true });\n\n const shiftYPercent = (shiftY / this.window.innerHeight) * 100;\n const shiftYCurrent = rubber(shiftYPercent, 72, 0.8, this.props.platform !== Platform.IOS);\n\n modalState.touchShiftYPercent = shiftYPercent;\n modalState.translateYCurrent = rangeTranslate((modalState.translateY ?? 0) + shiftYCurrent);\n\n this.animateTranslate(modalState, modalState.translateYCurrent);\n this.setMaskOpacity(modalState);\n }\n }\n\n onCardTouchMove(event: TouchEvent, modalState: ModalsStateEntry) {\n const { originalEvent, shiftY } = event;\n const target = originalEvent.target as HTMLElement;\n if (modalState.innerElement?.contains(target)) {\n if (!this.state.touchDown) {\n this.setState({ touchDown: true, dragging: true });\n }\n\n const shiftYPercent = (shiftY / modalState.innerElement.offsetHeight) * 100;\n const shiftYCurrent = rubber(shiftYPercent, 72, 1.2, this.props.platform !== Platform.IOS);\n\n modalState.touchShiftYPercent = shiftYPercent;\n modalState.translateYCurrent = Math.max(0, (modalState.translateY ?? 0) + shiftYCurrent);\n\n this.animateTranslate(modalState, modalState.translateYCurrent);\n this.setMaskOpacity(modalState);\n }\n }\n\n onTouchEnd = (e: TouchEvent) => {\n const modalState = this.props.getModalState(this.props.activeModal);\n\n if (modalState?.type === ModalType.PAGE) {\n return this.onPageTouchEnd(e, modalState);\n }\n\n if (modalState?.type === ModalType.CARD) {\n return this.onCardTouchEnd(e, modalState);\n }\n };\n\n onPageTouchEnd(event: TouchEvent, modalState: ModalsStateEntry) {\n const { startY, shiftY } = event;\n\n modalState.contentScrolled = false;\n modalState.touchMovePositive = null;\n\n let setStateCallback;\n\n if (this.state.dragging && this.window) {\n const shiftYEndPercent = ((startY + shiftY) / this.window.innerHeight) * 100;\n\n let translateY = modalState.translateYCurrent ?? 0;\n const expectTranslateY =\n (translateY / event.duration) *\n 240 *\n 0.6 *\n ((modalState.touchShiftYPercent ?? 0) < 0 ? -1 : 1);\n translateY = rangeTranslate(translateY + expectTranslateY);\n\n if (modalState.settlingHeight !== 100) {\n if (numberInRange(translateY, modalState.expandedRange)) {\n translateY = modalState.expandedRange?.[0] ?? 0;\n } else if (numberInRange(translateY, modalState.collapsedRange)) {\n translateY = modalState.translateYFrom ?? 0;\n } else if (numberInRange(translateY, modalState.hiddenRange)) {\n translateY = 100;\n } else {\n translateY = modalState.translateYFrom ?? 0;\n }\n } else {\n if (numberInRange(translateY, [0, 25])) {\n translateY = 0;\n } else {\n translateY = 100;\n }\n }\n\n if (translateY !== 100 && shiftYEndPercent >= 75) {\n translateY = 100;\n }\n\n modalState.translateY = translateY;\n modalState.translateYCurrent = translateY;\n modalState.collapsed = translateY > 0 && translateY < shiftYEndPercent;\n modalState.expanded = translateY === 0;\n modalState.hidden = translateY === 100;\n\n if (modalState.hidden) {\n this.props.onExit();\n }\n\n setStateCallback = () => {\n if (!modalState.hidden) {\n this.animateTranslate(modalState, modalState.translateY);\n }\n\n this.setMaskOpacity(modalState);\n };\n }\n\n this.setState(\n {\n touchDown: false,\n dragging: false,\n },\n setStateCallback,\n );\n }\n\n onCardTouchEnd({ duration }: TouchEvent, modalState: ModalsStateEntry) {\n let setStateCallback;\n\n if (this.state.dragging) {\n let translateY = modalState.translateYCurrent ?? 0;\n\n const expectTranslateY =\n (translateY / duration) * 240 * 0.6 * ((modalState.touchShiftYPercent ?? 0) < 0 ? -1 : 1);\n translateY = Math.max(0, translateY + expectTranslateY);\n\n if (translateY >= 30) {\n translateY = 100;\n } else {\n translateY = 0;\n }\n\n modalState.translateY = translateY;\n modalState.hidden = translateY === 100;\n\n if (modalState.hidden) {\n this.props.onExit();\n }\n\n setStateCallback = () => {\n if (!modalState.hidden) {\n this.animateTranslate(modalState, modalState.translateY);\n }\n\n this.setMaskOpacity(modalState);\n };\n }\n\n this.setState(\n {\n touchDown: false,\n dragging: false,\n },\n setStateCallback,\n );\n }\n\n onScroll = (e: React.SyntheticEvent) => {\n const activeModal = this.props.activeModal;\n\n const target = e.target as HTMLElement;\n\n if (!activeModal) {\n return;\n }\n const modalState = this.props.getModalState(activeModal);\n if (modalState?.type === ModalType.PAGE && modalState?.contentElement?.contains(target)) {\n modalState.contentScrolled = true;\n\n if (modalState.contentScrollStopTimeout) {\n clearTimeout(modalState.contentScrollStopTimeout);\n }\n\n modalState.contentScrollStopTimeout = setTimeout(() => {\n if (modalState.contentScrolled) {\n modalState.contentScrolled = false;\n }\n }, 250);\n }\n };\n\n waitTransitionFinish(modalState: ModalsStateEntry | undefined, eventHandler: () => void) {\n if (transitionEvent.supported) {\n const onceHandler = () => {\n modalState?.innerElement?.removeEventListener(transitionEvent.name as string, onceHandler);\n eventHandler();\n };\n\n modalState?.innerElement?.addEventListener(transitionEvent.name as string, onceHandler);\n } else {\n setTimeout(eventHandler, this.timeout);\n }\n }\n\n /**\n * Анимирует сдвиг модалки\n *\n * @param {ModalsStateEntry} modalState\n * @param {number} percent Процент сдвига: 0 – полностью открыта, 100 – полностью закрыта\n */\n animateTranslate(modalState: ModalsStateEntry, percent: number | undefined) {\n const frameId = `animateTranslateFrame${modalState.id}`;\n\n cancelAnimationFrame(this.frameIds[frameId]);\n\n this.frameIds[frameId] = requestAnimationFrame(() => {\n setTransformStyle(modalState.innerElement, `translate3d(0, ${percent}%, 0)`);\n });\n }\n\n /* Устанавливает прозрачность для полупрозрачной подложки */\n setMaskOpacity(modalState: ModalsStateEntry, forceOpacity: number | null = null) {\n if (forceOpacity === null && this.props.history?.[0] !== modalState.id) {\n return;\n }\n if (this.maskAnimationFrame) {\n cancelAnimationFrame(this.maskAnimationFrame);\n }\n this.maskAnimationFrame = requestAnimationFrame(() => {\n if (this.maskElementRef.current) {\n const { translateY = 0, translateYCurrent = 0 } = modalState;\n\n const opacity =\n forceOpacity === null\n ? 1 - (translateYCurrent - translateY) / (100 - translateY) || 0\n : forceOpacity;\n this.maskElementRef.current.style.opacity = clamp(opacity, 0, 100).toString();\n }\n });\n }\n\n render() {\n const { activeModal, exitingModal, enteringModal } = this.props;\n const { touchDown, dragging } = this.state;\n\n if (!activeModal && !exitingModal) {\n return null;\n }\n\n return (\n <TouchRootContext.Provider value={true}>\n <ModalRootContext.Provider value={this.modalRootContext}>\n <Touch\n className={classNames(\n styles['ModalRoot'],\n this.props.configProvider?.webviewType === WebviewType.VKAPPS &&\n styles['ModalRoot--vkapps'],\n touchDown &&\n classNames(styles['ModalRoot--touched'], 'vkuiInternalModalRoot--touched'),\n !!(enteringModal || exitingModal) &&\n classNames(styles['ModalRoot--switching'], 'vkuiInternalModalRoot--switching'),\n )}\n onMove={this.onTouchMove}\n onEnd={this.onTouchEnd}\n onScroll={this.onScroll}\n >\n <div\n className={styles['ModalRoot__mask']}\n onClick={this.props.onExit}\n ref={this.maskElementRef}\n />\n <div className={styles['ModalRoot__viewport']} ref={this.viewportRef}>\n {this.getModals().map((Modal) => {\n const modalId = getNavId(Modal.props, warn);\n const _modalState = this.props.getModalState(modalId);\n if ((modalId !== activeModal && modalId !== exitingModal) || !_modalState) {\n return null;\n }\n const modalState = { ..._modalState };\n\n const isPage = modalState.type === ModalType.PAGE;\n const key = `modal-${modalId}`;\n\n return (\n <FocusTrap\n key={key}\n getRootRef={(e) => {\n const modalState = this.props.getModalState(modalId);\n if (modalState) {\n modalState.modalElement = e;\n }\n }}\n onClose={this.props.onExit}\n timeout={this.timeout}\n className={classNames(\n styles['ModalRoot__modal'],\n\n dragging && 'vkuiInternalModalRoot__modal--dragging',\n\n isPage && modalState.expandable && 'vkuiInternalModalRoot__modal--expandable',\n isPage && modalState.collapsed && 'vkuiInternalModalRoot__modal--collapsed',\n )}\n restoreFocus={false}\n >\n {Modal}\n </FocusTrap>\n );\n })}\n </div>\n </Touch>\n </ModalRootContext.Provider>\n </TouchRootContext.Provider>\n );\n }\n}\n\nexport const ModalRootTouch = withContext(\n withPlatform(\n withDOM<ModalRootWithDOMProps>(withModalManager(initModal)(ModalRootTouchComponent)),\n ),\n ConfigProviderContext,\n 'configProvider',\n);\n\n/**\n * Инициализирует модалку перед анимацией открытия\n */\nfunction initModal(modalState: ModalsStateEntry) {\n switch (modalState.type) {\n case ModalType.PAGE:\n modalState.settlingHeight = modalState.settlingHeight || MODAL_PAGE_DEFAULT_PERCENT_HEIGHT;\n return initPageModal(modalState);\n case ModalType.CARD:\n return initCardModal(modalState);\n default:\n process.env.NODE_ENV === 'development' &&\n warn(`initActiveModal: modalState.type=\"${modalState.type}\" не поддерживается`, 'error');\n }\n}\n\nfunction initPageModal(modalState: ModalsStateEntry) {\n const { contentElement } = modalState;\n const contentHeight = (contentElement?.firstElementChild as HTMLElement).offsetHeight;\n\n let prevTranslateY = modalState.translateY;\n\n modalState.expandable =\n contentHeight > (contentElement?.clientHeight ?? 0) || modalState.settlingHeight === 100;\n\n let collapsed = false;\n let expanded = false;\n let translateYFrom;\n let translateY;\n let expandedRange: TranslateRange;\n let collapsedRange: TranslateRange;\n let hiddenRange: TranslateRange;\n\n if (modalState.expandable) {\n translateYFrom = 100 - (modalState.settlingHeight ?? 0);\n\n const shiftHalf = translateYFrom / 2;\n const visiblePart = 100 - translateYFrom;\n\n expandedRange = [0, shiftHalf];\n collapsedRange = [shiftHalf, translateYFrom + visiblePart / 4];\n hiddenRange = [translateYFrom + visiblePart / 4, 100];\n\n collapsed = translateYFrom > 0;\n expanded = translateYFrom <= 0;\n translateY = translateYFrom;\n } else {\n const headerHeight = modalState.headerElement?.offsetHeight ?? 0;\n const height = contentHeight + headerHeight;\n\n translateYFrom =\n 100 - (height / (modalState.innerElement?.parentElement?.offsetHeight ?? 0)) * 100;\n translateY = translateYFrom;\n\n expandedRange = [translateY, translateY + 25];\n collapsedRange = [translateY + 25, translateY + 25];\n hiddenRange = [translateY + 25, translateY + 100];\n }\n\n // Если модалка может открываться на весь экран, и новый сдвиг больше предыдущего, то откроем её на весь экран\n if (\n (modalState.expandable && translateY > (prevTranslateY ?? 100)) ||\n modalState.settlingHeight === 100\n ) {\n translateY = 0;\n }\n\n // Если модалка уже раскрыта обновляем состояния\n if (translateY === 0) {\n expanded = true;\n collapsed = false;\n }\n\n modalState.expandedRange = expandedRange;\n modalState.collapsedRange = collapsedRange;\n modalState.hiddenRange = hiddenRange;\n modalState.translateY = translateY;\n modalState.translateYFrom = translateYFrom;\n modalState.collapsed = collapsed;\n modalState.expanded = expanded;\n}\n\nfunction initCardModal(modalState: ModalsStateEntry) {\n modalState.translateY = 0;\n}\n"],"names":["React","classNames","clamp","withContext","withPlatform","withDOM","getNavId","Platform","setTransformStyle","transitionEvent","rubber","warnOnce","ConfigProviderContext","WebviewType","FocusTrap","Touch","TouchRootContext","ModalRootContext","MODAL_PAGE_DEFAULT_PERCENT_HEIGHT","ModalType","withModalManager","styles","warn","numberInRange","number","range","rangeTranslate","ModalRootTouchComponent","Component","constructor","props","state","touchDown","dragging","maskElementRef","createRef","modalRootContext","updateModalHeight","registerModal","id","data","Object","assign","getModalState","onClose","onExit","isInsideModal","frameIds","documentScrolling","viewportRef","maskAnimationFrame","undefined","restoreFocusTo","timeout","platform","IOS","document","window","getModals","Children","toArray","children","componentDidMount","addEventListener","updateModalTranslate","componentWillUnmount","toggleDocumentScrolling","removeEventListener","componentDidUpdate","prevProps","exitingModal","closeModal","enteringModal","enteringState","onEnter","waitTransitionFinish","innerElement","style","transitionDelay","onEntered","delayEnter","animateTranslate","translateY","activeModal","activeElement","focus","enabled","preventTouch","passive","event","originalEvent","preventDefault","modalState","checkPageContentHeight","type","PAGE","modalElement","prevModalState","initPageModal","currentModalState","needAnimate","expandable","translateYFrom","dynamicContentHeight","requestAnimationFrame","setState","nextModalState","nextIsPage","prevIsPage","onExited","exitTranslate","isBack","setMaskOpacity","onTouchMove","e","onPageTouchMove","CARD","onCardTouchMove","shiftY","target","isY","current","contains","stopPropagation","contentScrolled","collapsed","expanded","touchStartContentScrollTop","contentElement","scrollTop","touchMovePositive","headerElement","shiftYPercent","innerHeight","shiftYCurrent","touchShiftYPercent","translateYCurrent","offsetHeight","Math","max","onTouchEnd","onPageTouchEnd","onCardTouchEnd","startY","setStateCallback","shiftYEndPercent","expectTranslateY","duration","settlingHeight","expandedRange","collapsedRange","hiddenRange","hidden","onScroll","contentScrollStopTimeout","clearTimeout","setTimeout","eventHandler","supported","onceHandler","name","percent","frameId","cancelAnimationFrame","forceOpacity","history","opacity","toString","render","Provider","value","className","configProvider","webviewType","VKAPPS","onMove","onEnd","div","onClick","ref","map","Modal","modalId","_modalState","isPage","key","getRootRef","restoreFocus","ModalRootTouch","initModal","initCardModal","process","env","NODE_ENV","contentHeight","firstElementChild","prevTranslateY","clientHeight","shiftHalf","visiblePart","headerHeight","height","parentElement"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../../src/components/ModalRoot/ModalRoot.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { clamp } from '../../helpers/math';\nimport { withContext } from '../../hoc/withContext';\nimport { withPlatform } from '../../hoc/withPlatform';\nimport { DOMProps, withDOM } from '../../lib/dom';\nimport { getNavId } from '../../lib/getNavId';\nimport { Platform } from '../../lib/platform';\nimport { setTransformStyle } from '../../lib/styles';\nimport { transitionEvent } from '../../lib/supportEvents';\nimport { rubber } from '../../lib/touch';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ConfigProviderContext, WebviewType } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Touch, TouchEvent } from '../Touch/Touch';\nimport TouchRootContext from '../Touch/TouchContext';\nimport { ModalRootContext, ModalRootContextInterface } from './ModalRootContext';\nimport { MODAL_PAGE_DEFAULT_PERCENT_HEIGHT } from './constants';\nimport { ModalRootWithDOMProps, ModalsStateEntry, ModalType, TranslateRange } from './types';\nimport { ModalTransitionProps, withModalManager } from './useModalManager';\nimport styles from './ModalRoot.module.css';\n\nconst warn = warnOnce('ModalRoot');\n\nfunction numberInRange(number: number, range: TranslateRange | undefined) {\n if (!range) {\n return false;\n }\n return number >= range[0] && number <= range[1];\n}\n\nfunction rangeTranslate(number: number) {\n return clamp(number, 0, 98);\n}\n\ninterface ModalRootState {\n touchDown?: boolean;\n dragging?: boolean;\n modalOpenedLog: string[];\n}\n\nclass ModalRootTouchComponent extends React.Component<\n ModalRootWithDOMProps & DOMProps & ModalTransitionProps,\n ModalRootState\n> {\n constructor(props: ModalRootWithDOMProps & ModalTransitionProps) {\n super(props);\n this.state = {\n touchDown: false,\n dragging: false,\n modalOpenedLog: [],\n };\n\n this.maskElementRef = React.createRef();\n\n this.modalRootContext = {\n updateModalHeight: this.updateModalHeight,\n registerModal: ({ id, ...data }) => Object.assign(this.props.getModalState(id) ?? {}, data),\n onClose: () => this.props.onExit(),\n isInsideModal: true,\n };\n\n this.frameIds = {};\n }\n\n private documentScrolling = false;\n private readonly maskElementRef: React.RefObject<HTMLDivElement>;\n private readonly viewportRef = React.createRef<HTMLDivElement>();\n private maskAnimationFrame: number | undefined = undefined;\n private readonly modalRootContext: ModalRootContextInterface;\n private readonly frameIds: {\n [index: string]: number;\n };\n private restoreFocusTo: HTMLElement | undefined | null = undefined;\n\n get timeout(): number {\n return this.props.platform === Platform.IOS ? 400 : 320;\n }\n\n get document(): Document {\n return this.props.document as Document;\n }\n\n get window(): Window {\n return this.props.window as Window;\n }\n\n getModals() {\n return React.Children.toArray(this.props.children) as React.ReactElement[];\n }\n\n componentDidMount() {\n // Отслеживаем изменение размеров viewport\n this.window?.addEventListener('resize', this.updateModalHeight, false);\n }\n\n componentWillUnmount() {\n this.toggleDocumentScrolling(true);\n this.window.removeEventListener('resize', this.updateModalHeight, false);\n }\n\n componentDidUpdate(prevProps: ModalRootWithDOMProps & ModalTransitionProps) {\n // transition phase 2: animate exiting modal\n if (this.props.exitingModal && this.props.exitingModal !== prevProps.exitingModal) {\n this.closeModal(this.props.exitingModal);\n }\n\n // transition phase 3: animate entering modal\n if (this.props.enteringModal && this.props.enteringModal !== prevProps.enteringModal) {\n const { enteringModal } = this.props;\n const enteringState = this.props.getModalState(enteringModal);\n this.props.onEnter();\n this.waitTransitionFinish(enteringState, () => {\n if (enteringState?.innerElement) {\n enteringState.innerElement.style.transitionDelay = '';\n }\n this.props.onEntered(enteringModal);\n });\n\n if (enteringState?.innerElement) {\n enteringState.innerElement.style.transitionDelay = this.props.delayEnter\n ? `${this.timeout}ms`\n : '';\n this.animateTranslate(enteringState, enteringState.translateY);\n }\n }\n\n // focus restoration\n if (this.props.activeModal && !prevProps.activeModal) {\n this.restoreFocusTo = this.document.activeElement as HTMLElement;\n }\n if (!this.props.activeModal && !this.props.exitingModal && this.restoreFocusTo) {\n this.restoreFocusTo.focus();\n this.restoreFocusTo = null;\n }\n\n this.toggleDocumentScrolling(!this.props.activeModal && !this.props.exitingModal);\n }\n\n /* Отключает скролл документа */\n toggleDocumentScrolling(enabled: boolean) {\n if (this.documentScrolling === enabled) {\n return;\n }\n this.documentScrolling = enabled;\n\n if (enabled) {\n // Здесь нужен последний аргумент с такими же параметрами, потому что\n // некоторые браузеры на странных вендорах типа Meizu не удаляют обработчик.\n // https://github.com/VKCOM/VKUI/issues/444\n this.window.removeEventListener('touchmove', this.preventTouch, {\n // @ts-expect-error: TS2769 В интерфейсе EventListenerOptions нет поля passive\n passive: false,\n });\n } else {\n this.window.addEventListener('touchmove', this.preventTouch, {\n passive: false,\n });\n }\n }\n\n preventTouch = (event: any) => {\n if (!event) {\n return false;\n }\n while (event.originalEvent) {\n event = event.originalEvent;\n }\n if (event.preventDefault) {\n event.preventDefault();\n }\n return false;\n };\n\n checkPageContentHeight() {\n const modalState = this.props.getModalState(this.props.activeModal);\n\n if (modalState?.type === ModalType.PAGE && modalState?.modalElement) {\n const prevModalState = { ...modalState };\n initPageModal(modalState);\n const currentModalState = { ...modalState };\n\n let needAnimate = false;\n\n if (prevModalState.expandable === currentModalState.expandable) {\n if (prevModalState.translateYFrom !== currentModalState.translateYFrom) {\n needAnimate = true;\n }\n } else {\n needAnimate = true;\n }\n\n if (needAnimate) {\n this.animateTranslate(modalState, modalState.translateY);\n }\n }\n }\n\n updateModalHeight = () => {\n const modalState = this.props.getModalState(this.props.activeModal);\n\n if (modalState && modalState.type === ModalType.PAGE) {\n if (this.props.enteringModal) {\n this.waitTransitionFinish(modalState, () => {\n requestAnimationFrame(() => this.checkPageContentHeight());\n });\n } else {\n requestAnimationFrame(() => this.checkPageContentHeight());\n }\n }\n };\n\n closeModal(id: string) {\n // Сбрасываем состояния, которые могут помешать закрытию модального окна\n this.setState({ touchDown: false });\n\n const prevModalState = this.props.getModalState(id);\n\n if (!prevModalState) {\n id && warn(`closeActiveModal: модальное окно (страница) ${id} не существует`, 'error');\n return;\n }\n if (!this.state.modalOpenedLog.length) {\n this.setState((prevState) => ({\n modalOpenedLog: [...prevState.modalOpenedLog, id],\n }));\n }\n const nextModalState = this.props.getModalState(this.props.activeModal);\n const nextIsPage = !!nextModalState && nextModalState.type === ModalType.PAGE;\n\n const prevIsPage = !!prevModalState && prevModalState.type === ModalType.PAGE;\n this.waitTransitionFinish(prevModalState, () => this.props.onExited(id));\n const exitTranslate =\n prevIsPage &&\n nextIsPage &&\n (prevModalState.translateY ?? 0) <= (nextModalState?.translateYFrom ?? 0) &&\n !this.props.isBack\n ? (nextModalState?.translateYFrom ?? 0) + 10\n : 100;\n this.animateTranslate(prevModalState, exitTranslate);\n\n if (!nextModalState) {\n // NOTE: was only for clean exit\n this.setMaskOpacity(prevModalState, 0);\n this.setState({ modalOpenedLog: [] });\n prevModalState.translateY = undefined;\n } else if (nextModalState.id && !this.state.modalOpenedLog.includes(nextModalState.id)) {\n nextModalState.translateY = undefined;\n this.setState((prevState) => ({\n modalOpenedLog: [...prevState.modalOpenedLog, nextModalState.id!],\n }));\n }\n }\n\n onTouchMove = (e: TouchEvent) => {\n if (this.props.exitingModal) {\n return;\n }\n const modalState = this.props.getModalState(this.props.activeModal);\n if (!modalState) {\n return;\n }\n\n if (modalState.type === ModalType.PAGE) {\n return this.onPageTouchMove(e, modalState);\n }\n\n if (modalState.type === ModalType.CARD) {\n return this.onCardTouchMove(e, modalState);\n }\n };\n\n onPageTouchMove(event: TouchEvent, modalState: ModalsStateEntry) {\n const { shiftY, originalEvent } = event;\n const target = originalEvent.target as HTMLElement;\n\n if (!event.isY) {\n if (this.viewportRef.current?.contains(target)) {\n originalEvent.preventDefault();\n }\n return;\n }\n\n if (!modalState.innerElement?.contains(target)) {\n return originalEvent.preventDefault();\n }\n\n originalEvent.stopPropagation();\n\n const { expandable, contentScrolled, collapsed, expanded } = modalState;\n\n if (!this.state.touchDown) {\n modalState.touchStartContentScrollTop = modalState.contentElement?.scrollTop ?? 0;\n this.setState({ touchDown: true });\n }\n\n if (contentScrolled) {\n return;\n }\n\n if (modalState.touchMovePositive === null) {\n modalState.touchMovePositive = shiftY > 0;\n }\n\n if (\n !modalState.expandable ||\n collapsed ||\n (expanded && modalState.touchMovePositive && modalState.touchStartContentScrollTop === 0) ||\n modalState.headerElement?.contains(target)\n ) {\n originalEvent.preventDefault();\n\n if ((!expandable && shiftY < 0) || !this.window) {\n return;\n }\n\n !this.state.dragging && this.setState({ dragging: true });\n\n const shiftYPercent = (shiftY / this.window.innerHeight) * 100;\n const shiftYCurrent = rubber(shiftYPercent, 72, 0.8, this.props.platform !== Platform.IOS);\n\n modalState.touchShiftYPercent = shiftYPercent;\n modalState.translateYCurrent = rangeTranslate((modalState.translateY ?? 0) + shiftYCurrent);\n\n this.animateTranslate(modalState, modalState.translateYCurrent);\n this.setMaskOpacity(modalState);\n }\n }\n\n onCardTouchMove(event: TouchEvent, modalState: ModalsStateEntry) {\n const { originalEvent, shiftY } = event;\n const target = originalEvent.target as HTMLElement;\n if (modalState.innerElement?.contains(target)) {\n if (!this.state.touchDown) {\n this.setState({ touchDown: true, dragging: true });\n }\n\n const shiftYPercent = (shiftY / modalState.innerElement.offsetHeight) * 100;\n const shiftYCurrent = rubber(shiftYPercent, 72, 1.2, this.props.platform !== Platform.IOS);\n\n modalState.touchShiftYPercent = shiftYPercent;\n modalState.translateYCurrent = Math.max(0, (modalState.translateY ?? 0) + shiftYCurrent);\n\n this.animateTranslate(modalState, modalState.translateYCurrent);\n this.setMaskOpacity(modalState);\n }\n }\n\n onTouchEnd = (e: TouchEvent) => {\n const modalState = this.props.getModalState(this.props.activeModal);\n\n if (modalState?.type === ModalType.PAGE) {\n return this.onPageTouchEnd(e, modalState);\n }\n\n if (modalState?.type === ModalType.CARD) {\n return this.onCardTouchEnd(e, modalState);\n }\n };\n\n onPageTouchEnd(event: TouchEvent, modalState: ModalsStateEntry) {\n const { startY, shiftY } = event;\n\n modalState.contentScrolled = false;\n modalState.touchMovePositive = null;\n\n let setStateCallback;\n\n if (this.state.dragging && this.window) {\n const shiftYEndPercent = ((startY + shiftY) / this.window.innerHeight) * 100;\n\n let translateY = modalState.translateYCurrent ?? 0;\n const expectTranslateY =\n (translateY / event.duration) *\n 240 *\n 0.6 *\n ((modalState.touchShiftYPercent ?? 0) < 0 ? -1 : 1);\n translateY = rangeTranslate(translateY + expectTranslateY);\n\n if (modalState.settlingHeight !== 100) {\n if (numberInRange(translateY, modalState.expandedRange)) {\n translateY = modalState.expandedRange?.[0] ?? 0;\n } else if (numberInRange(translateY, modalState.collapsedRange)) {\n translateY = modalState.translateYFrom ?? 0;\n } else if (numberInRange(translateY, modalState.hiddenRange)) {\n translateY = 100;\n } else {\n translateY = modalState.translateYFrom ?? 0;\n }\n } else {\n if (numberInRange(translateY, [0, 25])) {\n translateY = 0;\n } else {\n translateY = 100;\n }\n }\n\n if (translateY !== 100 && shiftYEndPercent >= 75) {\n translateY = 100;\n }\n\n modalState.translateY = translateY;\n modalState.translateYCurrent = translateY;\n modalState.collapsed = translateY > 0 && translateY < shiftYEndPercent;\n modalState.expanded = translateY === 0;\n modalState.hidden = translateY === 100;\n\n if (modalState.hidden) {\n this.props.onExit();\n }\n\n setStateCallback = () => {\n if (!modalState.hidden) {\n this.animateTranslate(modalState, modalState.translateY);\n }\n\n this.setMaskOpacity(modalState);\n };\n }\n\n this.setState(\n {\n touchDown: false,\n dragging: false,\n },\n setStateCallback,\n );\n }\n\n onCardTouchEnd({ duration }: TouchEvent, modalState: ModalsStateEntry) {\n let setStateCallback;\n\n if (this.state.dragging) {\n let translateY = modalState.translateYCurrent ?? 0;\n\n const expectTranslateY =\n (translateY / duration) * 240 * 0.6 * ((modalState.touchShiftYPercent ?? 0) < 0 ? -1 : 1);\n translateY = Math.max(0, translateY + expectTranslateY);\n\n if (translateY >= 30) {\n translateY = 100;\n } else {\n translateY = 0;\n }\n\n modalState.translateY = translateY;\n modalState.hidden = translateY === 100;\n\n if (modalState.hidden) {\n this.props.onExit();\n }\n\n setStateCallback = () => {\n if (!modalState.hidden) {\n this.animateTranslate(modalState, modalState.translateY);\n }\n\n this.setMaskOpacity(modalState);\n };\n }\n\n this.setState(\n {\n touchDown: false,\n dragging: false,\n },\n setStateCallback,\n );\n }\n\n onScroll = (e: React.SyntheticEvent) => {\n const activeModal = this.props.activeModal;\n\n const target = e.target as HTMLElement;\n\n if (!activeModal) {\n return;\n }\n const modalState = this.props.getModalState(activeModal);\n if (modalState?.type === ModalType.PAGE && modalState?.contentElement?.contains(target)) {\n modalState.contentScrolled = true;\n\n if (modalState.contentScrollStopTimeout) {\n clearTimeout(modalState.contentScrollStopTimeout);\n }\n\n modalState.contentScrollStopTimeout = setTimeout(() => {\n if (modalState.contentScrolled) {\n modalState.contentScrolled = false;\n }\n }, 250);\n }\n };\n\n waitTransitionFinish(modalState: ModalsStateEntry | undefined, eventHandler: () => void) {\n if (transitionEvent.supported) {\n const onceHandler = () => {\n modalState?.innerElement?.removeEventListener(transitionEvent.name as string, onceHandler);\n eventHandler();\n };\n\n modalState?.innerElement?.addEventListener(transitionEvent.name as string, onceHandler);\n } else {\n setTimeout(eventHandler, this.timeout);\n }\n }\n\n /**\n * Анимирует сдвиг модалки\n *\n * @param {ModalsStateEntry} modalState\n * @param {number} percent Процент сдвига: 0 – полностью открыта, 100 – полностью закрыта\n */\n animateTranslate(modalState: ModalsStateEntry, percent: number | undefined) {\n const frameId = `animateTranslateFrame${modalState.id}`;\n\n cancelAnimationFrame(this.frameIds[frameId]);\n\n this.frameIds[frameId] = requestAnimationFrame(() => {\n setTransformStyle(modalState.innerElement, `translate3d(0, ${percent}%, 0)`);\n });\n }\n\n /* Устанавливает прозрачность для полупрозрачной подложки */\n setMaskOpacity(modalState: ModalsStateEntry, forceOpacity: number | null = null) {\n if (forceOpacity === null && this.props.history?.[0] !== modalState.id) {\n return;\n }\n if (this.maskAnimationFrame) {\n cancelAnimationFrame(this.maskAnimationFrame);\n }\n this.maskAnimationFrame = requestAnimationFrame(() => {\n if (this.maskElementRef.current) {\n const { translateY = 0, translateYCurrent = 0 } = modalState;\n\n const opacity =\n forceOpacity === null\n ? 1 - (translateYCurrent - translateY) / (100 - translateY) || 0\n : forceOpacity;\n this.maskElementRef.current.style.opacity = clamp(opacity, 0, 100).toString();\n }\n });\n }\n\n render() {\n const { activeModal, exitingModal, enteringModal } = this.props;\n const { touchDown, dragging } = this.state;\n\n if (!activeModal && !exitingModal) {\n return null;\n }\n\n return (\n <TouchRootContext.Provider value={true}>\n <ModalRootContext.Provider value={this.modalRootContext}>\n <Touch\n className={classNames(\n styles['ModalRoot'],\n this.props.configProvider?.webviewType === WebviewType.VKAPPS &&\n styles['ModalRoot--vkapps'],\n touchDown &&\n classNames(styles['ModalRoot--touched'], 'vkuiInternalModalRoot--touched'),\n !!(enteringModal || exitingModal) &&\n classNames(styles['ModalRoot--switching'], 'vkuiInternalModalRoot--switching'),\n )}\n onMove={this.onTouchMove}\n onEnd={this.onTouchEnd}\n onScroll={this.onScroll}\n >\n <div\n className={styles['ModalRoot__mask']}\n onClick={this.props.onExit}\n ref={this.maskElementRef}\n />\n <div className={styles['ModalRoot__viewport']} ref={this.viewportRef}>\n {this.getModals().map((Modal) => {\n const modalId = getNavId(Modal.props, warn);\n const _modalState = this.props.getModalState(modalId);\n if ((modalId !== activeModal && modalId !== exitingModal) || !_modalState) {\n return null;\n }\n const modalState = { ..._modalState };\n\n const isPage = modalState.type === ModalType.PAGE;\n const key = `modal-${modalId}`;\n\n return (\n <FocusTrap\n key={key}\n getRootRef={(e) => {\n const modalState = this.props.getModalState(modalId);\n if (modalState) {\n modalState.modalElement = e;\n }\n }}\n onClose={this.props.onExit}\n timeout={this.timeout}\n className={classNames(\n styles['ModalRoot__modal'],\n\n dragging && 'vkuiInternalModalRoot__modal--dragging',\n\n isPage && modalState.expandable && 'vkuiInternalModalRoot__modal--expandable',\n isPage && modalState.collapsed && 'vkuiInternalModalRoot__modal--collapsed',\n )}\n restoreFocus={false}\n >\n {Modal}\n </FocusTrap>\n );\n })}\n </div>\n </Touch>\n </ModalRootContext.Provider>\n </TouchRootContext.Provider>\n );\n }\n}\n\nexport const ModalRootTouch = withContext(\n withPlatform(\n withDOM<ModalRootWithDOMProps>(withModalManager(initModal)(ModalRootTouchComponent)),\n ),\n ConfigProviderContext,\n 'configProvider',\n);\n\n/**\n * Инициализирует модалку перед анимацией открытия\n */\nfunction initModal(modalState: ModalsStateEntry) {\n switch (modalState.type) {\n case ModalType.PAGE:\n modalState.settlingHeight = modalState.settlingHeight || MODAL_PAGE_DEFAULT_PERCENT_HEIGHT;\n return initPageModal(modalState);\n case ModalType.CARD:\n return initCardModal(modalState);\n default:\n process.env.NODE_ENV === 'development' &&\n warn(`initActiveModal: modalState.type=\"${modalState.type}\" не поддерживается`, 'error');\n }\n}\n\nfunction initPageModal(modalState: ModalsStateEntry) {\n const { contentElement } = modalState;\n const contentHeight = (contentElement?.firstElementChild as HTMLElement).offsetHeight;\n\n let prevTranslateY = modalState.translateY;\n\n modalState.expandable =\n contentHeight > (contentElement?.clientHeight ?? 0) || modalState.settlingHeight === 100;\n\n let collapsed = false;\n let expanded = false;\n let translateYFrom;\n let translateY;\n let expandedRange: TranslateRange;\n let collapsedRange: TranslateRange;\n let hiddenRange: TranslateRange;\n\n if (modalState.expandable) {\n translateYFrom = 100 - (modalState.settlingHeight ?? 0);\n\n const shiftHalf = translateYFrom / 2;\n const visiblePart = 100 - translateYFrom;\n\n expandedRange = [0, shiftHalf];\n collapsedRange = [shiftHalf, translateYFrom + visiblePart / 4];\n hiddenRange = [translateYFrom + visiblePart / 4, 100];\n\n collapsed = translateYFrom > 0;\n expanded = translateYFrom <= 0;\n translateY = translateYFrom;\n } else {\n const headerHeight = modalState.headerElement?.offsetHeight ?? 0;\n const height = contentHeight + headerHeight;\n\n translateYFrom =\n 100 - (height / (modalState.innerElement?.parentElement?.offsetHeight ?? 0)) * 100;\n translateY = translateYFrom;\n\n expandedRange = [translateY, translateY + 25];\n collapsedRange = [translateY + 25, translateY + 25];\n hiddenRange = [translateY + 25, translateY + 100];\n }\n\n // Если модалка может открываться на весь экран, и новый сдвиг больше предыдущего, то откроем её на весь экран\n if (\n (modalState.expandable && translateY > (prevTranslateY ?? 100)) ||\n modalState.settlingHeight === 100\n ) {\n translateY = 0;\n }\n\n // Если модалка уже раскрыта обновляем состояния\n if (translateY === 0) {\n expanded = true;\n collapsed = false;\n }\n\n modalState.expandedRange = expandedRange;\n modalState.collapsedRange = collapsedRange;\n modalState.hiddenRange = hiddenRange;\n modalState.translateY = translateY;\n modalState.translateYFrom = translateYFrom;\n modalState.collapsed = collapsed;\n modalState.expanded = expanded;\n}\n\nfunction initCardModal(modalState: ModalsStateEntry) {\n modalState.translateY = 0;\n}\n"],"names":["React","classNames","clamp","withContext","withPlatform","withDOM","getNavId","Platform","setTransformStyle","transitionEvent","rubber","warnOnce","ConfigProviderContext","WebviewType","FocusTrap","Touch","TouchRootContext","ModalRootContext","MODAL_PAGE_DEFAULT_PERCENT_HEIGHT","ModalType","withModalManager","styles","warn","numberInRange","number","range","rangeTranslate","ModalRootTouchComponent","Component","constructor","props","state","touchDown","dragging","modalOpenedLog","maskElementRef","createRef","modalRootContext","updateModalHeight","registerModal","id","data","Object","assign","getModalState","onClose","onExit","isInsideModal","frameIds","documentScrolling","viewportRef","maskAnimationFrame","undefined","restoreFocusTo","timeout","platform","IOS","document","window","getModals","Children","toArray","children","componentDidMount","addEventListener","componentWillUnmount","toggleDocumentScrolling","removeEventListener","componentDidUpdate","prevProps","exitingModal","closeModal","enteringModal","enteringState","onEnter","waitTransitionFinish","innerElement","style","transitionDelay","onEntered","delayEnter","animateTranslate","translateY","activeModal","activeElement","focus","enabled","preventTouch","passive","event","originalEvent","preventDefault","checkPageContentHeight","modalState","type","PAGE","modalElement","prevModalState","initPageModal","currentModalState","needAnimate","expandable","translateYFrom","requestAnimationFrame","setState","length","prevState","nextModalState","nextIsPage","prevIsPage","onExited","exitTranslate","isBack","setMaskOpacity","includes","onTouchMove","e","onPageTouchMove","CARD","onCardTouchMove","shiftY","target","isY","current","contains","stopPropagation","contentScrolled","collapsed","expanded","touchStartContentScrollTop","contentElement","scrollTop","touchMovePositive","headerElement","shiftYPercent","innerHeight","shiftYCurrent","touchShiftYPercent","translateYCurrent","offsetHeight","Math","max","onTouchEnd","onPageTouchEnd","onCardTouchEnd","startY","setStateCallback","shiftYEndPercent","expectTranslateY","duration","settlingHeight","expandedRange","collapsedRange","hiddenRange","hidden","onScroll","contentScrollStopTimeout","clearTimeout","setTimeout","eventHandler","supported","onceHandler","name","percent","frameId","cancelAnimationFrame","forceOpacity","history","opacity","toString","render","Provider","value","className","configProvider","webviewType","VKAPPS","onMove","onEnd","div","onClick","ref","map","Modal","modalId","_modalState","isPage","key","getRootRef","restoreFocus","ModalRootTouch","initModal","initCardModal","process","env","NODE_ENV","contentHeight","firstElementChild","prevTranslateY","clientHeight","shiftHalf","visiblePart","headerHeight","height","parentElement"],"mappings":"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"}
@@ -35,7 +35,6 @@ export interface ModalsStateEntry extends ModalElements {
35
35
  onClosed?: VoidFunction;
36
36
  type?: ModalType;
37
37
  settlingHeight?: number;
38
- dynamicContentHeight?: boolean;
39
38
  expandable?: boolean;
40
39
  /**
41
40
  * Процент текущего сдвига модалки
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/ModalRoot/types.ts"],"sourcesContent":["import { DOMContextInterface } from '../../lib/dom';\nimport { HasChildren, HasPlatform } from '../../types';\nimport { ConfigProviderContextInterface } from '../ConfigProvider/ConfigProviderContext';\n\nexport enum ModalType {\n PAGE = 'page',\n CARD = 'card',\n}\n\nexport type TranslateRange = [number, number];\n\nexport type ModalsState = { [index: string]: ModalsStateEntry };\n\nexport interface ModalElements {\n modalElement?: HTMLElement | null;\n innerElement?: HTMLElement | null;\n headerElement?: HTMLElement | null;\n contentElement?: HTMLElement | null;\n}\n\nexport interface ModalsStateEntry extends ModalElements {\n id: string | null;\n /**\n * Событие начала открытия модалки.\n */\n onOpen?: VoidFunction;\n /**\n * Событие открытия модалки.\n */\n onOpened?: VoidFunction;\n /**\n * Событие начала закрытия модалки.\n */\n onClose?: VoidFunction;\n /**\n * Событие закрытия модалки.\n */\n onClosed?: VoidFunction;\n type?: ModalType;\n\n settlingHeight?: number;\n dynamicContentHeight?: boolean;\n expandable?: boolean;\n\n /**\n * Процент текущего сдвига модалки\n */\n translateY?: number;\n /**\n * Процент сдвига модалки в изначальном состоянии\n */\n translateYFrom?: number;\n /**\n * Процент сдвига модалки во время взаимодействия с ней (потянуть, чтобы открыть или закрыть)\n */\n translateYCurrent?: number;\n\n touchStartContentScrollTop?: number;\n touchMovePositive?: boolean | null;\n touchShiftYPercent?: number;\n\n expanded?: boolean;\n collapsed?: boolean;\n hidden?: boolean;\n\n contentScrolled?: boolean;\n contentScrollStopTimeout?: ReturnType<typeof setTimeout>;\n\n expandedRange?: TranslateRange;\n collapsedRange?: TranslateRange;\n hiddenRange?: TranslateRange;\n}\n\nexport interface ModalRootProps extends HasChildren {\n activeModal?: string | null;\n\n /**\n * Будет вызвано при начале открытия активной модалки с её id\n */\n onOpen?(modalId: string): void;\n\n /**\n * Будет вызвано при окончательном открытии активной модалки с её id\n */\n onOpened?(modalId: string): void;\n\n /**\n * Будет вызвано при начале закрытия активной модалки с её id\n */\n onClose?(modalId: string): void;\n\n /**\n * Будет вызвано при окончательном закрытии активной модалки с её id\n */\n onClosed?(modalId: string): void;\n}\n\nexport interface ModalRootWithDOMProps extends HasPlatform, ModalRootProps, DOMContextInterface {\n /**\n * @ignore\n */\n configProvider?: ConfigProviderContextInterface;\n}\n"],"names":["ModalType","PAGE","CARD"],"mappings":"WAIO;UAAKA,SAAS;IAATA,UACVC,UAAO;IADGD,UAEVE,UAAO;GAFGF,cAAAA"}
1
+ {"version":3,"sources":["../../../../src/components/ModalRoot/types.ts"],"sourcesContent":["import { DOMContextInterface } from '../../lib/dom';\nimport { HasChildren, HasPlatform } from '../../types';\nimport { ConfigProviderContextInterface } from '../ConfigProvider/ConfigProviderContext';\n\nexport enum ModalType {\n PAGE = 'page',\n CARD = 'card',\n}\n\nexport type TranslateRange = [number, number];\n\nexport type ModalsState = { [index: string]: ModalsStateEntry };\n\nexport interface ModalElements {\n modalElement?: HTMLElement | null;\n innerElement?: HTMLElement | null;\n headerElement?: HTMLElement | null;\n contentElement?: HTMLElement | null;\n}\n\nexport interface ModalsStateEntry extends ModalElements {\n id: string | null;\n /**\n * Событие начала открытия модалки.\n */\n onOpen?: VoidFunction;\n /**\n * Событие открытия модалки.\n */\n onOpened?: VoidFunction;\n /**\n * Событие начала закрытия модалки.\n */\n onClose?: VoidFunction;\n /**\n * Событие закрытия модалки.\n */\n onClosed?: VoidFunction;\n type?: ModalType;\n\n settlingHeight?: number;\n expandable?: boolean;\n\n /**\n * Процент текущего сдвига модалки\n */\n translateY?: number;\n /**\n * Процент сдвига модалки в изначальном состоянии\n */\n translateYFrom?: number;\n /**\n * Процент сдвига модалки во время взаимодействия с ней (потянуть, чтобы открыть или закрыть)\n */\n translateYCurrent?: number;\n\n touchStartContentScrollTop?: number;\n touchMovePositive?: boolean | null;\n touchShiftYPercent?: number;\n\n expanded?: boolean;\n collapsed?: boolean;\n hidden?: boolean;\n\n contentScrolled?: boolean;\n contentScrollStopTimeout?: ReturnType<typeof setTimeout>;\n\n expandedRange?: TranslateRange;\n collapsedRange?: TranslateRange;\n hiddenRange?: TranslateRange;\n}\n\nexport interface ModalRootProps extends HasChildren {\n activeModal?: string | null;\n\n /**\n * Будет вызвано при начале открытия активной модалки с её id\n */\n onOpen?(modalId: string): void;\n\n /**\n * Будет вызвано при окончательном открытии активной модалки с её id\n */\n onOpened?(modalId: string): void;\n\n /**\n * Будет вызвано при начале закрытия активной модалки с её id\n */\n onClose?(modalId: string): void;\n\n /**\n * Будет вызвано при окончательном закрытии активной модалки с её id\n */\n onClosed?(modalId: string): void;\n}\n\nexport interface ModalRootWithDOMProps extends HasPlatform, ModalRootProps, DOMContextInterface {\n /**\n * @ignore\n */\n configProvider?: ConfigProviderContextInterface;\n}\n"],"names":["ModalType","PAGE","CARD"],"mappings":"WAIO;UAAKA,SAAS;IAATA,UACVC,UAAO;IADGD,UAEVE,UAAO;GAFGF,cAAAA"}
@@ -76,7 +76,6 @@ export function modalTransitionReducer(state, action) {
76
76
  state.onOpened = Modal.props.onOpened;
77
77
  state.onClose = Modal.props.onClose;
78
78
  state.onClosed = Modal.props.onClosed;
79
- state.dynamicContentHeight = !!modalProps.dynamicContentHeight;
80
79
  // ModalPage props
81
80
  if (typeof modalProps.settlingHeight === 'number') {
82
81
  state.settlingHeight = modalProps.settlingHeight;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/ModalRoot/useModalManager.tsx"],"sourcesContent":["import * as React from 'react';\nimport { isFunction, noop } from '@vkontakte/vkjs';\nimport { getNavId } from '../../lib/getNavId';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HasChildren } from '../../types';\nimport { ModalsState, ModalsStateEntry, ModalType } from './types';\n\ninterface ModalTransitionState {\n activeModal?: string | null;\n enteringModal?: string | null;\n exitingModal?: string | null;\n history?: string[];\n isBack?: boolean | null;\n}\n\nexport interface ModalTransitionProps extends ModalTransitionState {\n onEnter: VoidFunction;\n onEntered: (id: string | null) => void;\n onExit: VoidFunction;\n onExited: (id: string | null) => void;\n getModalState: (id: string | undefined | null) => ModalsStateEntry | undefined;\n delayEnter: boolean;\n}\n\nfunction getModals(children: React.ReactNode | React.ReactNode[]) {\n return React.Children.toArray(children) as React.ReactElement[];\n}\n\nconst warn = warnOnce('ModalRoot');\n\nexport function modalTransitionReducer(\n state: ModalTransitionState,\n action: {\n type: 'setActive' | 'entered' | 'exited' | 'inited';\n id: string | null;\n },\n): ModalTransitionState {\n if (action.type === 'setActive' && action.id !== state.activeModal) {\n const nextModal = action.id;\n // preserve exiting modal if switching mid-transition\n const prevModal = state.exitingModal || state.activeModal;\n let history = state.history ? [...state.history] : [];\n const isBack = Boolean(nextModal && history.includes(nextModal));\n\n if (nextModal === null) {\n history = [];\n } else if (isBack) {\n history = history.splice(0, history.indexOf(nextModal) + 1);\n } else {\n history.push(nextModal);\n }\n\n return {\n activeModal: nextModal,\n // not entering yet\n enteringModal: null,\n exitingModal: prevModal,\n history,\n isBack,\n };\n }\n if (action.type === 'entered' && action.id === state.enteringModal) {\n return { ...state, enteringModal: null };\n }\n if (action.type === 'exited' && action.id === state.exitingModal) {\n return { ...state, exitingModal: null };\n }\n if (action.type === 'inited' && action.id === state.activeModal) {\n return { ...state, enteringModal: action.id };\n }\n return state;\n}\n\n/**\n * Реализует переход модалок. При смене activeModal m1 -> m2:\n * 1. activeModal: m1, exitingModal: null, enteringModal: null, триггер перехода\n * 2. activeModal: m2, exitingModal: m1, enteringModal: null, рендерим m2 чтобы прошел init, начинаем анимацию выхода\n * одновременный переход между ModalPage:\n * 3a. activeModal: m2, exitingModal: m1, enteringModal: m2\n * 4a. exitingModal и enteringModal переходят в null в порядке завершения анимации\n * ИЛИ дожидаемся скрытия ModalCard\n * 3b. activeModal: m2, exitingModal: null, enteringModal: m2\n * 4b. enteringModal переходит в null после завершения анимации\n * 5. activeModal: m2, exitingModal: null, enteringModal: null, переход закончен\n */\nexport function useModalManager(\n activeModal: string | null | undefined,\n children: React.ReactNode | React.ReactNode[],\n onOpen: (id: string) => void = noop,\n onOpened: (id: string) => void = noop,\n onClose: (id: string) => void = noop,\n onClosed: (id: string) => void = noop,\n initModal: (state: ModalsStateEntry) => void = noop,\n): ModalTransitionProps {\n const modalsState = React.useRef<ModalsState>({}).current;\n getModals(children).forEach((Modal) => {\n const modalProps = Modal.props;\n const id = getNavId(modalProps, warn);\n const state: ModalsStateEntry = (id !== undefined && modalsState[id]) || {\n id: id ?? null,\n };\n\n state.onOpen = Modal.props.onOpen;\n state.onOpened = Modal.props.onOpened;\n state.onClose = Modal.props.onClose;\n state.onClosed = Modal.props.onClosed;\n state.dynamicContentHeight = !!modalProps.dynamicContentHeight;\n // ModalPage props\n if (typeof modalProps.settlingHeight === 'number') {\n state.settlingHeight = modalProps.settlingHeight;\n }\n\n if (state.id !== null) {\n modalsState[state.id] = state;\n }\n });\n\n const isMissing = activeModal && !modalsState[activeModal];\n const safeActiveModal = isMissing ? null : activeModal;\n const [transitionState, dispatchTransition] = React.useReducer(modalTransitionReducer, {\n activeModal: safeActiveModal,\n enteringModal: null,\n exitingModal: null,\n history: safeActiveModal ? [safeActiveModal] : [],\n isBack: false,\n });\n\n // Map props to state, render activeModal for init\n useIsomorphicLayoutEffect(() => {\n // ignore non-existent activeModal\n if (process.env.NODE_ENV === 'development' && isMissing) {\n warn(`Переход невозможен - модальное окно (страница) ${activeModal} не существует`, 'error');\n }\n dispatchTransition({ type: 'setActive', id: safeActiveModal ?? null });\n }, [activeModal]);\n\n // Init activeModal & set enteringModal\n useIsomorphicLayoutEffect(() => {\n if (transitionState.activeModal) {\n initModal(modalsState[transitionState.activeModal]);\n dispatchTransition({ type: 'inited', id: transitionState.activeModal });\n }\n }, [transitionState.activeModal]);\n\n const isCard = (id: string | null | undefined) =>\n id != null && modalsState[id]?.type === ModalType.CARD;\n const onEntered = React.useCallback(\n (id: string | null) => {\n if (id) {\n const modalState = modalsState[id];\n\n if (isFunction(modalState.onOpened)) {\n modalState.onOpened();\n } else if (isFunction(onOpened)) {\n onOpened(id);\n }\n }\n\n dispatchTransition({ type: 'entered', id });\n },\n [modalsState, onOpened],\n );\n const onExited = React.useCallback(\n (id: string | null) => {\n if (id) {\n const modalState = modalsState[id];\n\n if (isFunction(modalState.onClosed)) {\n modalState.onClosed();\n } else if (isFunction(onClosed)) {\n onClosed(id);\n }\n }\n\n dispatchTransition({ type: 'exited', id });\n },\n [modalsState, onClosed],\n );\n const delayEnter = Boolean(\n transitionState.exitingModal && (isCard(activeModal) || isCard(transitionState.exitingModal)),\n );\n const getModalState = React.useCallback(\n (id: string | undefined | null) => (id ? modalsState[id] : undefined),\n [modalsState],\n );\n\n function onEnter() {\n const modalState = transitionState.activeModal && modalsState[transitionState.activeModal];\n if (modalState) {\n if (isFunction(modalState.onOpen)) {\n modalState.onOpen();\n } else if (isFunction(onOpen) && modalState.id) {\n onOpen(modalState.id);\n }\n }\n }\n\n function onExit() {\n const modalState = transitionState.activeModal && modalsState[transitionState.activeModal];\n if (modalState) {\n if (isFunction(modalState.onClose)) {\n modalState.onClose();\n } else if (isFunction(onClose) && modalState.id) {\n onClose(modalState.id);\n }\n }\n }\n\n return {\n onEnter,\n onEntered,\n onExit,\n onExited,\n ...transitionState,\n delayEnter,\n getModalState,\n };\n}\n\ntype WithModalManager<Props extends ModalTransitionProps> = HasChildren &\n Omit<Props, keyof ModalTransitionProps> & {\n activeModal?: string | null;\n };\n\nexport function withModalManager(initModal: (a: ModalsStateEntry) => void = noop) {\n return function <Props extends ModalTransitionProps>(\n Wrapped: React.ComponentType<Props>,\n ): React.ComponentType<WithModalManager<Props>> {\n return function WithModalManager(props) {\n const transitionManager = useModalManager(\n props.activeModal,\n props.children,\n (props as any).onOpen,\n (props as any).onOpened,\n (props as any).onClose,\n (props as any).onClosed,\n initModal,\n );\n return <Wrapped {...(props as any)} {...transitionManager} />;\n };\n };\n}\n"],"names":["React","isFunction","noop","getNavId","useIsomorphicLayoutEffect","warnOnce","ModalType","getModals","children","Children","toArray","warn","modalTransitionReducer","state","action","type","id","activeModal","nextModal","prevModal","exitingModal","history","isBack","Boolean","includes","splice","indexOf","push","enteringModal","useModalManager","onOpen","onOpened","onClose","onClosed","initModal","modalsState","useRef","current","forEach","Modal","modalProps","props","undefined","dynamicContentHeight","settlingHeight","isMissing","safeActiveModal","transitionState","dispatchTransition","useReducer","process","env","NODE_ENV","isCard","CARD","onEntered","useCallback","modalState","onExited","delayEnter","getModalState","onEnter","onExit","withModalManager","Wrapped","WithModalManager","transitionManager"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../../src/components/ModalRoot/useModalManager.tsx"],"sourcesContent":["import * as React from 'react';\nimport { isFunction, noop } from '@vkontakte/vkjs';\nimport { getNavId } from '../../lib/getNavId';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HasChildren } from '../../types';\nimport { ModalsState, ModalsStateEntry, ModalType } from './types';\n\ninterface ModalTransitionState {\n activeModal?: string | null;\n enteringModal?: string | null;\n exitingModal?: string | null;\n history?: string[];\n isBack?: boolean | null;\n}\n\nexport interface ModalTransitionProps extends ModalTransitionState {\n onEnter: VoidFunction;\n onEntered: (id: string | null) => void;\n onExit: VoidFunction;\n onExited: (id: string | null) => void;\n getModalState: (id: string | undefined | null) => ModalsStateEntry | undefined;\n delayEnter: boolean;\n}\n\nfunction getModals(children: React.ReactNode | React.ReactNode[]) {\n return React.Children.toArray(children) as React.ReactElement[];\n}\n\nconst warn = warnOnce('ModalRoot');\n\nexport function modalTransitionReducer(\n state: ModalTransitionState,\n action: {\n type: 'setActive' | 'entered' | 'exited' | 'inited';\n id: string | null;\n },\n): ModalTransitionState {\n if (action.type === 'setActive' && action.id !== state.activeModal) {\n const nextModal = action.id;\n // preserve exiting modal if switching mid-transition\n const prevModal = state.exitingModal || state.activeModal;\n let history = state.history ? [...state.history] : [];\n const isBack = Boolean(nextModal && history.includes(nextModal));\n\n if (nextModal === null) {\n history = [];\n } else if (isBack) {\n history = history.splice(0, history.indexOf(nextModal) + 1);\n } else {\n history.push(nextModal);\n }\n\n return {\n activeModal: nextModal,\n // not entering yet\n enteringModal: null,\n exitingModal: prevModal,\n history,\n isBack,\n };\n }\n if (action.type === 'entered' && action.id === state.enteringModal) {\n return { ...state, enteringModal: null };\n }\n if (action.type === 'exited' && action.id === state.exitingModal) {\n return { ...state, exitingModal: null };\n }\n if (action.type === 'inited' && action.id === state.activeModal) {\n return { ...state, enteringModal: action.id };\n }\n return state;\n}\n\n/**\n * Реализует переход модалок. При смене activeModal m1 -> m2:\n * 1. activeModal: m1, exitingModal: null, enteringModal: null, триггер перехода\n * 2. activeModal: m2, exitingModal: m1, enteringModal: null, рендерим m2 чтобы прошел init, начинаем анимацию выхода\n * одновременный переход между ModalPage:\n * 3a. activeModal: m2, exitingModal: m1, enteringModal: m2\n * 4a. exitingModal и enteringModal переходят в null в порядке завершения анимации\n * ИЛИ дожидаемся скрытия ModalCard\n * 3b. activeModal: m2, exitingModal: null, enteringModal: m2\n * 4b. enteringModal переходит в null после завершения анимации\n * 5. activeModal: m2, exitingModal: null, enteringModal: null, переход закончен\n */\nexport function useModalManager(\n activeModal: string | null | undefined,\n children: React.ReactNode | React.ReactNode[],\n onOpen: (id: string) => void = noop,\n onOpened: (id: string) => void = noop,\n onClose: (id: string) => void = noop,\n onClosed: (id: string) => void = noop,\n initModal: (state: ModalsStateEntry) => void = noop,\n): ModalTransitionProps {\n const modalsState = React.useRef<ModalsState>({}).current;\n getModals(children).forEach((Modal) => {\n const modalProps = Modal.props;\n const id = getNavId(modalProps, warn);\n const state: ModalsStateEntry = (id !== undefined && modalsState[id]) || {\n id: id ?? null,\n };\n\n state.onOpen = Modal.props.onOpen;\n state.onOpened = Modal.props.onOpened;\n state.onClose = Modal.props.onClose;\n state.onClosed = Modal.props.onClosed;\n // ModalPage props\n if (typeof modalProps.settlingHeight === 'number') {\n state.settlingHeight = modalProps.settlingHeight;\n }\n\n if (state.id !== null) {\n modalsState[state.id] = state;\n }\n });\n\n const isMissing = activeModal && !modalsState[activeModal];\n const safeActiveModal = isMissing ? null : activeModal;\n const [transitionState, dispatchTransition] = React.useReducer(modalTransitionReducer, {\n activeModal: safeActiveModal,\n enteringModal: null,\n exitingModal: null,\n history: safeActiveModal ? [safeActiveModal] : [],\n isBack: false,\n });\n\n // Map props to state, render activeModal for init\n useIsomorphicLayoutEffect(() => {\n // ignore non-existent activeModal\n if (process.env.NODE_ENV === 'development' && isMissing) {\n warn(`Переход невозможен - модальное окно (страница) ${activeModal} не существует`, 'error');\n }\n dispatchTransition({ type: 'setActive', id: safeActiveModal ?? null });\n }, [activeModal]);\n\n // Init activeModal & set enteringModal\n useIsomorphicLayoutEffect(() => {\n if (transitionState.activeModal) {\n initModal(modalsState[transitionState.activeModal]);\n dispatchTransition({ type: 'inited', id: transitionState.activeModal });\n }\n }, [transitionState.activeModal]);\n\n const isCard = (id: string | null | undefined) =>\n id != null && modalsState[id]?.type === ModalType.CARD;\n const onEntered = React.useCallback(\n (id: string | null) => {\n if (id) {\n const modalState = modalsState[id];\n\n if (isFunction(modalState.onOpened)) {\n modalState.onOpened();\n } else if (isFunction(onOpened)) {\n onOpened(id);\n }\n }\n\n dispatchTransition({ type: 'entered', id });\n },\n [modalsState, onOpened],\n );\n const onExited = React.useCallback(\n (id: string | null) => {\n if (id) {\n const modalState = modalsState[id];\n\n if (isFunction(modalState.onClosed)) {\n modalState.onClosed();\n } else if (isFunction(onClosed)) {\n onClosed(id);\n }\n }\n\n dispatchTransition({ type: 'exited', id });\n },\n [modalsState, onClosed],\n );\n const delayEnter = Boolean(\n transitionState.exitingModal && (isCard(activeModal) || isCard(transitionState.exitingModal)),\n );\n const getModalState = React.useCallback(\n (id: string | undefined | null) => (id ? modalsState[id] : undefined),\n [modalsState],\n );\n\n function onEnter() {\n const modalState = transitionState.activeModal && modalsState[transitionState.activeModal];\n if (modalState) {\n if (isFunction(modalState.onOpen)) {\n modalState.onOpen();\n } else if (isFunction(onOpen) && modalState.id) {\n onOpen(modalState.id);\n }\n }\n }\n\n function onExit() {\n const modalState = transitionState.activeModal && modalsState[transitionState.activeModal];\n if (modalState) {\n if (isFunction(modalState.onClose)) {\n modalState.onClose();\n } else if (isFunction(onClose) && modalState.id) {\n onClose(modalState.id);\n }\n }\n }\n\n return {\n onEnter,\n onEntered,\n onExit,\n onExited,\n ...transitionState,\n delayEnter,\n getModalState,\n };\n}\n\ntype WithModalManager<Props extends ModalTransitionProps> = HasChildren &\n Omit<Props, keyof ModalTransitionProps> & {\n activeModal?: string | null;\n };\n\nexport function withModalManager(initModal: (a: ModalsStateEntry) => void = noop) {\n return function <Props extends ModalTransitionProps>(\n Wrapped: React.ComponentType<Props>,\n ): React.ComponentType<WithModalManager<Props>> {\n return function WithModalManager(props) {\n const transitionManager = useModalManager(\n props.activeModal,\n props.children,\n (props as any).onOpen,\n (props as any).onOpened,\n (props as any).onClose,\n (props as any).onClosed,\n initModal,\n );\n return <Wrapped {...(props as any)} {...transitionManager} />;\n };\n };\n}\n"],"names":["React","isFunction","noop","getNavId","useIsomorphicLayoutEffect","warnOnce","ModalType","getModals","children","Children","toArray","warn","modalTransitionReducer","state","action","type","id","activeModal","nextModal","prevModal","exitingModal","history","isBack","Boolean","includes","splice","indexOf","push","enteringModal","useModalManager","onOpen","onOpened","onClose","onClosed","initModal","modalsState","useRef","current","forEach","Modal","modalProps","props","undefined","settlingHeight","isMissing","safeActiveModal","transitionState","dispatchTransition","useReducer","process","env","NODE_ENV","isCard","CARD","onEntered","useCallback","modalState","onExited","delayEnter","getModalState","onEnter","onExit","withModalManager","Wrapped","WithModalManager","transitionManager"],"mappings":"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"}
@@ -55,7 +55,8 @@ const sizeYClassNames = {
55
55
  }, placeholder && /*#__PURE__*/ React.createElement("option", {
56
56
  value: ""
57
57
  }, placeholder), children), /*#__PURE__*/ React.createElement("div", {
58
- className: styles['Select__container']
58
+ className: styles['Select__container'],
59
+ "aria-hidden": true
59
60
  }, /*#__PURE__*/ React.createElement(SelectTypography, {
60
61
  className: styles['Select__title'],
61
62
  selectType: selectType
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/NativeSelect/NativeSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { HasAlign, HasRef, HasRootRef } from '../../types';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport type { SelectType } from '../Select/Select';\nimport { SelectTypography } from '../SelectTypography/SelectTypography';\nimport styles from '../Select/Select.module.css';\n\nconst sizeYClassNames = {\n none: styles['Select--sizeY-none'],\n [SizeType.COMPACT]: styles['Select--sizeY-compact'],\n};\n\nexport interface NativeSelectProps\n extends React.SelectHTMLAttributes<HTMLSelectElement>,\n HasRef<HTMLSelectElement>,\n HasRootRef<HTMLLabelElement>,\n HasAlign,\n Pick<FormFieldProps, 'before' | 'status'> {\n placeholder?: string;\n multiline?: boolean;\n selectType?: SelectType;\n /**\n * Иконка раскрывающегося списка\n */\n icon?: React.ReactNode;\n}\n\nexport interface SelectState {\n value?: React.SelectHTMLAttributes<HTMLSelectElement>['value'];\n title?: string;\n notSelected?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/NativeSelect\n */\nconst NativeSelect = ({\n style,\n defaultValue = '',\n align,\n placeholder,\n children,\n className,\n getRef,\n getRootRef,\n disabled,\n multiline,\n selectType = 'default',\n status,\n icon = <DropdownIcon />,\n before,\n onChange: onChangeProp,\n value: valueProp,\n ...restProps\n}: NativeSelectProps) => {\n const [title, setTitle] = React.useState('');\n const [empty, setEmpty] = React.useState(false);\n const [value, onChange] = useEnsuredControl({\n defaultValue,\n disabled,\n onChange: onChangeProp,\n value: valueProp,\n });\n const selectRef = useExternRef(getRef);\n const { sizeY = 'none' } = useAdaptivity();\n\n useIsomorphicLayoutEffect(() => {\n const selectedOption = selectRef.current?.options[selectRef.current.selectedIndex];\n if (selectedOption) {\n setTitle(selectedOption.text);\n setEmpty(selectedOption.value === '' && placeholder != null);\n }\n }, [value, children]);\n\n return (\n <FormField\n Component=\"label\"\n className={classNames(\n styles['Select'],\n 'vkuiInternalNativeSelect',\n before && styles['Select--hasBefore'],\n empty && styles['Select--empty'],\n multiline && styles['Select--multiline'],\n align === 'center' && styles['Select--align-center'],\n align === 'right' && styles['Select--align-right'],\n sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n className,\n )}\n style={style}\n getRootRef={getRootRef}\n disabled={disabled}\n before={before}\n after={icon}\n status={status}\n >\n <select\n {...restProps}\n disabled={disabled}\n className={styles['Select__el']}\n onChange={onChange}\n value={value}\n ref={selectRef}\n >\n {placeholder && <option value=\"\">{placeholder}</option>}\n {children}\n </select>\n <div className={styles['Select__container']}>\n <SelectTypography className={styles['Select__title']} selectType={selectType}>\n {title}\n </SelectTypography>\n </div>\n </FormField>\n );\n};\n\nexport { NativeSelect };\n"],"names":["React","classNames","useAdaptivity","useEnsuredControl","useExternRef","SizeType","useIsomorphicLayoutEffect","DropdownIcon","FormField","SelectTypography","styles","sizeYClassNames","none","COMPACT","NativeSelect","style","defaultValue","align","placeholder","children","className","getRef","getRootRef","disabled","multiline","selectType","status","icon","before","onChange","onChangeProp","value","valueProp","restProps","title","setTitle","useState","empty","setEmpty","selectRef","sizeY","selectedOption","current","options","selectedIndex","text","Component","REGULAR","after","select","ref","option","div"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,iBAAiB,QAAQ,gCAAgC;AAClE,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,yBAAyB,QAAQ,sCAAsC;AAEhF,SAASC,YAAY,QAAQ,+BAA+B;AAC5D,SAASC,SAAS,QAAwB,yBAAyB;AAEnE,SAASC,gBAAgB,QAAQ,uCAAuC;AACxE,OAAOC,YAAY,8BAA8B;AAEjD,MAAMC,kBAAkB;IACtBC,MAAMF,MAAM,CAAC,qBAAqB;IAClC,CAACL,SAASQ,OAAO,CAAC,EAAEH,MAAM,CAAC,wBAAwB;AACrD;AAuBA;;CAEC,GACD,MAAMI,eAAe,CAAC,EACpBC,MAAK,EACLC,cAAe,GAAE,EACjBC,MAAK,EACLC,YAAW,EACXC,SAAQ,EACRC,UAAS,EACTC,OAAM,EACNC,WAAU,EACVC,SAAQ,EACRC,UAAS,EACTC,YAAa,UAAS,EACtBC,OAAM,EACNC,oBAAO,oBAACpB,oBAAe,EACvBqB,OAAM,EACNC,UAAUC,aAAY,EACtBC,OAAOC,UAAS,EAChB,GAAGC,WACe,GAAK;IACvB,MAAM,CAACC,OAAOC,SAAS,GAAGnC,MAAMoC,QAAQ,CAAC;IACzC,MAAM,CAACC,OAAOC,SAAS,GAAGtC,MAAMoC,QAAQ,CAAC,KAAK;IAC9C,MAAM,CAACL,OAAOF,SAAS,GAAG1B,kBAAkB;QAC1Ca;QACAO;QACAM,UAAUC;QACVC,OAAOC;IACT;IACA,MAAMO,YAAYnC,aAAaiB;IAC/B,MAAM,EAAEmB,OAAQ,OAAM,EAAE,GAAGtC;IAE3BI,0BAA0B,IAAM;QAC9B,MAAMmC,iBAAiBF,UAAUG,OAAO,EAAEC,OAAO,CAACJ,UAAUG,OAAO,CAACE,aAAa,CAAC;QAClF,IAAIH,gBAAgB;YAClBN,SAASM,eAAeI,IAAI;YAC5BP,SAASG,eAAeV,KAAK,KAAK,MAAMb,eAAe,IAAI;QAC7D,CAAC;IACH,GAAG;QAACa;QAAOZ;KAAS;IAEpB,qBACE,oBAACX;QACCsC,WAAU;QACV1B,WAAWnB,WACTS,MAAM,CAAC,SAAS,EAChB,4BACAkB,UAAUlB,MAAM,CAAC,oBAAoB,EACrC2B,SAAS3B,MAAM,CAAC,gBAAgB,EAChCc,aAAad,MAAM,CAAC,oBAAoB,EACxCO,UAAU,YAAYP,MAAM,CAAC,uBAAuB,EACpDO,UAAU,WAAWP,MAAM,CAAC,sBAAsB,EAClD8B,UAAUnC,SAAS0C,OAAO,IAAIpC,eAAe,CAAC6B,MAAM,EACpDpB;QAEFL,OAAOA;QACPO,YAAYA;QACZC,UAAUA;QACVK,QAAQA;QACRoB,OAAOrB;QACPD,QAAQA;qBAER,oBAACuB;QACE,GAAGhB,SAAS;QACbV,UAAUA;QACVH,WAAWV,MAAM,CAAC,aAAa;QAC/BmB,UAAUA;QACVE,OAAOA;QACPmB,KAAKX;OAEJrB,6BAAe,oBAACiC;QAAOpB,OAAM;OAAIb,cACjCC,yBAEH,oBAACiC;QAAIhC,WAAWV,MAAM,CAAC,oBAAoB;qBACzC,oBAACD;QAAiBW,WAAWV,MAAM,CAAC,gBAAgB;QAAEe,YAAYA;OAC/DS;AAKX;AAEA,SAASpB,YAAY,GAAG"}
1
+ {"version":3,"sources":["../../../../src/components/NativeSelect/NativeSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { HasAlign, HasRef, HasRootRef } from '../../types';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport type { SelectType } from '../Select/Select';\nimport { SelectTypography } from '../SelectTypography/SelectTypography';\nimport styles from '../Select/Select.module.css';\n\nconst sizeYClassNames = {\n none: styles['Select--sizeY-none'],\n [SizeType.COMPACT]: styles['Select--sizeY-compact'],\n};\n\nexport interface NativeSelectProps\n extends React.SelectHTMLAttributes<HTMLSelectElement>,\n HasRef<HTMLSelectElement>,\n HasRootRef<HTMLLabelElement>,\n HasAlign,\n Pick<FormFieldProps, 'before' | 'status'> {\n placeholder?: string;\n multiline?: boolean;\n selectType?: SelectType;\n /**\n * Иконка раскрывающегося списка\n */\n icon?: React.ReactNode;\n}\n\nexport interface SelectState {\n value?: React.SelectHTMLAttributes<HTMLSelectElement>['value'];\n title?: string;\n notSelected?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/NativeSelect\n */\nconst NativeSelect = ({\n style,\n defaultValue = '',\n align,\n placeholder,\n children,\n className,\n getRef,\n getRootRef,\n disabled,\n multiline,\n selectType = 'default',\n status,\n icon = <DropdownIcon />,\n before,\n onChange: onChangeProp,\n value: valueProp,\n ...restProps\n}: NativeSelectProps) => {\n const [title, setTitle] = React.useState('');\n const [empty, setEmpty] = React.useState(false);\n const [value, onChange] = useEnsuredControl({\n defaultValue,\n disabled,\n onChange: onChangeProp,\n value: valueProp,\n });\n const selectRef = useExternRef(getRef);\n const { sizeY = 'none' } = useAdaptivity();\n\n useIsomorphicLayoutEffect(() => {\n const selectedOption = selectRef.current?.options[selectRef.current.selectedIndex];\n if (selectedOption) {\n setTitle(selectedOption.text);\n setEmpty(selectedOption.value === '' && placeholder != null);\n }\n }, [value, children]);\n\n return (\n <FormField\n Component=\"label\"\n className={classNames(\n styles['Select'],\n 'vkuiInternalNativeSelect',\n before && styles['Select--hasBefore'],\n empty && styles['Select--empty'],\n multiline && styles['Select--multiline'],\n align === 'center' && styles['Select--align-center'],\n align === 'right' && styles['Select--align-right'],\n sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n className,\n )}\n style={style}\n getRootRef={getRootRef}\n disabled={disabled}\n before={before}\n after={icon}\n status={status}\n >\n <select\n {...restProps}\n disabled={disabled}\n className={styles['Select__el']}\n onChange={onChange}\n value={value}\n ref={selectRef}\n >\n {placeholder && <option value=\"\">{placeholder}</option>}\n {children}\n </select>\n <div className={styles['Select__container']} aria-hidden>\n <SelectTypography className={styles['Select__title']} selectType={selectType}>\n {title}\n </SelectTypography>\n </div>\n </FormField>\n );\n};\n\nexport { NativeSelect };\n"],"names":["React","classNames","useAdaptivity","useEnsuredControl","useExternRef","SizeType","useIsomorphicLayoutEffect","DropdownIcon","FormField","SelectTypography","styles","sizeYClassNames","none","COMPACT","NativeSelect","style","defaultValue","align","placeholder","children","className","getRef","getRootRef","disabled","multiline","selectType","status","icon","before","onChange","onChangeProp","value","valueProp","restProps","title","setTitle","useState","empty","setEmpty","selectRef","sizeY","selectedOption","current","options","selectedIndex","text","Component","REGULAR","after","select","ref","option","div","aria-hidden"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,iBAAiB,QAAQ,gCAAgC;AAClE,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,yBAAyB,QAAQ,sCAAsC;AAEhF,SAASC,YAAY,QAAQ,+BAA+B;AAC5D,SAASC,SAAS,QAAwB,yBAAyB;AAEnE,SAASC,gBAAgB,QAAQ,uCAAuC;AACxE,OAAOC,YAAY,8BAA8B;AAEjD,MAAMC,kBAAkB;IACtBC,MAAMF,MAAM,CAAC,qBAAqB;IAClC,CAACL,SAASQ,OAAO,CAAC,EAAEH,MAAM,CAAC,wBAAwB;AACrD;AAuBA;;CAEC,GACD,MAAMI,eAAe,CAAC,EACpBC,MAAK,EACLC,cAAe,GAAE,EACjBC,MAAK,EACLC,YAAW,EACXC,SAAQ,EACRC,UAAS,EACTC,OAAM,EACNC,WAAU,EACVC,SAAQ,EACRC,UAAS,EACTC,YAAa,UAAS,EACtBC,OAAM,EACNC,oBAAO,oBAACpB,oBAAe,EACvBqB,OAAM,EACNC,UAAUC,aAAY,EACtBC,OAAOC,UAAS,EAChB,GAAGC,WACe,GAAK;IACvB,MAAM,CAACC,OAAOC,SAAS,GAAGnC,MAAMoC,QAAQ,CAAC;IACzC,MAAM,CAACC,OAAOC,SAAS,GAAGtC,MAAMoC,QAAQ,CAAC,KAAK;IAC9C,MAAM,CAACL,OAAOF,SAAS,GAAG1B,kBAAkB;QAC1Ca;QACAO;QACAM,UAAUC;QACVC,OAAOC;IACT;IACA,MAAMO,YAAYnC,aAAaiB;IAC/B,MAAM,EAAEmB,OAAQ,OAAM,EAAE,GAAGtC;IAE3BI,0BAA0B,IAAM;QAC9B,MAAMmC,iBAAiBF,UAAUG,OAAO,EAAEC,OAAO,CAACJ,UAAUG,OAAO,CAACE,aAAa,CAAC;QAClF,IAAIH,gBAAgB;YAClBN,SAASM,eAAeI,IAAI;YAC5BP,SAASG,eAAeV,KAAK,KAAK,MAAMb,eAAe,IAAI;QAC7D,CAAC;IACH,GAAG;QAACa;QAAOZ;KAAS;IAEpB,qBACE,oBAACX;QACCsC,WAAU;QACV1B,WAAWnB,WACTS,MAAM,CAAC,SAAS,EAChB,4BACAkB,UAAUlB,MAAM,CAAC,oBAAoB,EACrC2B,SAAS3B,MAAM,CAAC,gBAAgB,EAChCc,aAAad,MAAM,CAAC,oBAAoB,EACxCO,UAAU,YAAYP,MAAM,CAAC,uBAAuB,EACpDO,UAAU,WAAWP,MAAM,CAAC,sBAAsB,EAClD8B,UAAUnC,SAAS0C,OAAO,IAAIpC,eAAe,CAAC6B,MAAM,EACpDpB;QAEFL,OAAOA;QACPO,YAAYA;QACZC,UAAUA;QACVK,QAAQA;QACRoB,OAAOrB;QACPD,QAAQA;qBAER,oBAACuB;QACE,GAAGhB,SAAS;QACbV,UAAUA;QACVH,WAAWV,MAAM,CAAC,aAAa;QAC/BmB,UAAUA;QACVE,OAAOA;QACPmB,KAAKX;OAEJrB,6BAAe,oBAACiC;QAAOpB,OAAM;OAAIb,cACjCC,yBAEH,oBAACiC;QAAIhC,WAAWV,MAAM,CAAC,oBAAoB;QAAE2C,eAAAA,IAAW;qBACtD,oBAAC5C;QAAiBW,WAAWV,MAAM,CAAC,gBAAgB;QAAEe,YAAYA;OAC/DS;AAKX;AAEA,SAASpB,YAAY,GAAG"}
@@ -24,13 +24,13 @@ const sizeXClassNames = {
24
24
  }, /*#__PURE__*/ React.createElement(Touch, {
25
25
  Component: TooltipContainer,
26
26
  className: classNames(styles['Panel__in'], 'vkuiInternalPanel__in')
27
- }, platform === Platform.IOS && /*#__PURE__*/ React.createElement("div", {
28
- className: "vkuiInternalPanel__fade"
29
- }), /*#__PURE__*/ React.createElement("div", {
27
+ }, /*#__PURE__*/ React.createElement("div", {
30
28
  className: styles['Panel__in-before']
31
29
  }), centered ? /*#__PURE__*/ React.createElement("div", {
32
30
  className: styles['Panel__centered']
33
- }, children) : children, /*#__PURE__*/ React.createElement("div", {
31
+ }, children) : children, platform === Platform.IOS && /*#__PURE__*/ React.createElement("div", {
32
+ className: "vkuiInternalPanel__fade"
33
+ }), /*#__PURE__*/ React.createElement("div", {
34
34
  className: styles['Panel__in-after']
35
35
  })));
36
36
  };