@vkontakte/vkui 7.1.2 → 7.1.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 (129) hide show
  1. package/dist/components/Alert/Alert.js +5 -5
  2. package/dist/components/Alert/Alert.js.map +1 -1
  3. package/dist/components/CarouselBase/CarouselBase.d.ts.map +1 -1
  4. package/dist/components/CarouselBase/CarouselBase.js +1 -4
  5. package/dist/components/CarouselBase/CarouselBase.js.map +1 -1
  6. package/dist/components/FormItem/FormItem.d.ts.map +1 -1
  7. package/dist/components/FormItem/FormItem.js +1 -0
  8. package/dist/components/FormItem/FormItem.js.map +1 -1
  9. package/dist/components/HorizontalScroll/HorizontalScroll.d.ts +1 -1
  10. package/dist/components/HorizontalScroll/HorizontalScroll.d.ts.map +1 -1
  11. package/dist/components/HorizontalScroll/HorizontalScroll.js +17 -18
  12. package/dist/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  13. package/dist/components/ModalCard/ModalCardInternal.d.ts +1 -1
  14. package/dist/components/ModalCard/ModalCardInternal.d.ts.map +1 -1
  15. package/dist/components/ModalCard/ModalCardInternal.js +4 -3
  16. package/dist/components/ModalCard/ModalCardInternal.js.map +1 -1
  17. package/dist/components/ModalCard/types.d.ts +7 -0
  18. package/dist/components/ModalCard/types.d.ts.map +1 -1
  19. package/dist/components/ModalCard/types.js.map +1 -1
  20. package/dist/components/ModalPage/ModalPageInternal.d.ts +1 -1
  21. package/dist/components/ModalPage/ModalPageInternal.d.ts.map +1 -1
  22. package/dist/components/ModalPage/ModalPageInternal.js +4 -3
  23. package/dist/components/ModalPage/ModalPageInternal.js.map +1 -1
  24. package/dist/components/ModalPage/types.d.ts +7 -0
  25. package/dist/components/ModalPage/types.d.ts.map +1 -1
  26. package/dist/components/ModalPage/types.js.map +1 -1
  27. package/dist/components/OnboardingTooltip/OnboardingTooltip.d.ts +7 -2
  28. package/dist/components/OnboardingTooltip/OnboardingTooltip.d.ts.map +1 -1
  29. package/dist/components/OnboardingTooltip/OnboardingTooltip.js +32 -13
  30. package/dist/components/OnboardingTooltip/OnboardingTooltip.js.map +1 -1
  31. package/dist/components/Pagination/Pagination.d.ts +6 -0
  32. package/dist/components/Pagination/Pagination.d.ts.map +1 -1
  33. package/dist/components/Pagination/Pagination.js +5 -3
  34. package/dist/components/Pagination/Pagination.js.map +1 -1
  35. package/dist/components/Pagination/PaginationPage/PaginationPageButton.d.ts.map +1 -1
  36. package/dist/components/Pagination/PaginationPage/PaginationPageButton.js +4 -4
  37. package/dist/components/Pagination/PaginationPage/PaginationPageButton.js.map +1 -1
  38. package/dist/components/Removable/Removable.d.ts +5 -1
  39. package/dist/components/Removable/Removable.d.ts.map +1 -1
  40. package/dist/components/Removable/Removable.js +4 -3
  41. package/dist/components/Removable/Removable.js.map +1 -1
  42. package/dist/components/TabbarItem/TabbarItem.d.ts +1 -1
  43. package/dist/components/TabbarItem/TabbarItem.d.ts.map +1 -1
  44. package/dist/components/TabbarItem/TabbarItem.js +16 -4
  45. package/dist/components/TabbarItem/TabbarItem.js.map +1 -1
  46. package/dist/components/TooltipBase/TooltipBase.d.ts +6 -1
  47. package/dist/components/TooltipBase/TooltipBase.d.ts.map +1 -1
  48. package/dist/components/TooltipBase/TooltipBase.js +3 -1
  49. package/dist/components/TooltipBase/TooltipBase.js.map +1 -1
  50. package/dist/components.css +1 -1
  51. package/dist/components.css.map +1 -1
  52. package/dist/cssm/components/Alert/Alert.js +5 -5
  53. package/dist/cssm/components/Alert/Alert.js.map +1 -1
  54. package/dist/cssm/components/CarouselBase/CarouselBase.js +1 -4
  55. package/dist/cssm/components/CarouselBase/CarouselBase.js.map +1 -1
  56. package/dist/cssm/components/FormItem/FormItem.js +1 -0
  57. package/dist/cssm/components/FormItem/FormItem.js.map +1 -1
  58. package/dist/cssm/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.module.css +1 -0
  59. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js +18 -14
  60. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  61. package/dist/cssm/components/IconButton/IconButton.module.css +6 -0
  62. package/dist/cssm/components/ModalCard/ModalCardInternal.js +2 -2
  63. package/dist/cssm/components/ModalCard/ModalCardInternal.js.map +1 -1
  64. package/dist/cssm/components/ModalCard/types.js.map +1 -1
  65. package/dist/cssm/components/ModalPage/ModalPageInternal.js +2 -2
  66. package/dist/cssm/components/ModalPage/ModalPageInternal.js.map +1 -1
  67. package/dist/cssm/components/ModalPage/types.js.map +1 -1
  68. package/dist/cssm/components/OnboardingTooltip/OnboardingTooltip.js +21 -7
  69. package/dist/cssm/components/OnboardingTooltip/OnboardingTooltip.js.map +1 -1
  70. package/dist/cssm/components/OnboardingTooltip/OnboardingTooltip.module.css +15 -0
  71. package/dist/cssm/components/Pagination/Pagination.js +4 -2
  72. package/dist/cssm/components/Pagination/Pagination.js.map +1 -1
  73. package/dist/cssm/components/Pagination/PaginationPage/PaginationPageButton.js +4 -4
  74. package/dist/cssm/components/Pagination/PaginationPage/PaginationPageButton.js.map +1 -1
  75. package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.module.css +6 -0
  76. package/dist/cssm/components/Removable/Removable.js +2 -2
  77. package/dist/cssm/components/Removable/Removable.js.map +1 -1
  78. package/dist/cssm/components/Removable/Removable.module.css +3 -0
  79. package/dist/cssm/components/Search/Search.module.css +1 -0
  80. package/dist/cssm/components/SimpleCell/SimpleCell.module.css +2 -0
  81. package/dist/cssm/components/SubnavigationButton/SubnavigationButton.module.css +1 -0
  82. package/dist/cssm/components/TabbarItem/TabbarItem.js +13 -3
  83. package/dist/cssm/components/TabbarItem/TabbarItem.js.map +1 -1
  84. package/dist/cssm/components/TooltipBase/TooltipBase.js +2 -1
  85. package/dist/cssm/components/TooltipBase/TooltipBase.js.map +1 -1
  86. package/dist/cssm/components/TooltipBase/TooltipBase.module.css +1 -0
  87. package/dist/cssm/hooks/useFocusTrap.js +1 -1
  88. package/dist/cssm/hooks/useFocusTrap.js.map +1 -1
  89. package/dist/cssm/types.js.map +1 -1
  90. package/dist/hooks/useFocusTrap.js +1 -1
  91. package/dist/hooks/useFocusTrap.js.map +1 -1
  92. package/dist/types.d.ts +1 -1
  93. package/dist/types.d.ts.map +1 -1
  94. package/dist/types.js.map +1 -1
  95. package/dist/vkui.css +1 -1
  96. package/dist/vkui.css.map +1 -1
  97. package/package.json +1 -1
  98. package/src/components/Alert/Alert.tsx +5 -5
  99. package/src/components/CarouselBase/CarouselBase.tsx +1 -6
  100. package/src/components/FormItem/FormItem.tsx +1 -0
  101. package/src/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.module.css +1 -0
  102. package/src/components/HorizontalScroll/HorizontalScroll.tsx +21 -15
  103. package/src/components/IconButton/IconButton.module.css +5 -0
  104. package/src/components/ModalCard/ModalCardInternal.tsx +5 -1
  105. package/src/components/ModalCard/types.ts +7 -0
  106. package/src/components/ModalPage/ModalPageInternal.tsx +2 -1
  107. package/src/components/ModalPage/types.ts +7 -0
  108. package/src/components/OnboardingTooltip/OnboardingTooltip.module.css +13 -0
  109. package/src/components/OnboardingTooltip/OnboardingTooltip.tsx +36 -8
  110. package/src/components/Pagination/Pagination.tsx +19 -5
  111. package/src/components/Pagination/PaginationPage/PaginationPageButton.tsx +3 -3
  112. package/src/components/PanelHeaderButton/PanelHeaderButton.module.css +5 -0
  113. package/src/components/Removable/Removable.module.css +3 -0
  114. package/src/components/Removable/Removable.tsx +12 -1
  115. package/src/components/Search/Search.module.css +1 -0
  116. package/src/components/SimpleCell/SimpleCell.module.css +2 -0
  117. package/src/components/SubnavigationButton/SubnavigationButton.module.css +1 -0
  118. package/src/components/TabbarItem/TabbarItem.tsx +18 -1
  119. package/src/components/TooltipBase/TooltipBase.module.css +1 -0
  120. package/src/components/TooltipBase/TooltipBase.tsx +7 -1
  121. package/src/hooks/useFocusTrap.ts +1 -1
  122. package/src/types.ts +2 -1
  123. package/dist/components/Pagination/utils.d.ts +0 -2
  124. package/dist/components/Pagination/utils.d.ts.map +0 -1
  125. package/dist/components/Pagination/utils.js +0 -5
  126. package/dist/components/Pagination/utils.js.map +0 -1
  127. package/dist/cssm/components/Pagination/utils.js +0 -5
  128. package/dist/cssm/components/Pagination/utils.js.map +0 -1
  129. package/src/components/Pagination/utils.ts +0 -3
@@ -115,17 +115,17 @@ import { AlertDescription, AlertTitle } from "./AlertTypography.js";
115
115
  })
116
116
  ]
117
117
  }),
118
+ isDismissButtonVisible && dismissButtonMode === 'outside' && /*#__PURE__*/ _jsx(ModalDismissButton, {
119
+ onClick: close,
120
+ "data-testid": dismissButtonTestId,
121
+ children: dismissLabel
122
+ }),
118
123
  /*#__PURE__*/ _jsx(AlertActions, {
119
124
  actions: actions,
120
125
  actionsAlign: actionsAlign,
121
126
  actionsLayout: actionsLayout,
122
127
  renderAction: renderAction,
123
128
  onItemClick: onItemClick
124
- }),
125
- isDismissButtonVisible && dismissButtonMode === 'outside' && /*#__PURE__*/ _jsx(ModalDismissButton, {
126
- onClick: close,
127
- "data-testid": dismissButtonTestId,
128
- children: dismissLabel
129
129
  })
130
130
  ]
131
131
  }))
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon20Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { type UseFocusTrapProps } from '../../hooks/useFocusTrap';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useCSSKeyframesAnimationController } from '../../lib/animation';\nimport { stopPropagation } from '../../lib/utils';\nimport type {\n AlignType,\n AnchorHTMLAttributesOnly,\n HasDataAttribute,\n HasRootRef,\n} from '../../types';\nimport type { AppRootPortalProps } from '../AppRoot/AppRootPortal';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport type { ButtonProps } from '../Button/Button';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { IconButton } from '../IconButton/IconButton';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport type { AlertActionProps } from './AlertAction';\nimport { AlertActions } from './AlertActions';\nimport { AlertDescription, AlertTitle } from './AlertTypography';\nimport styles from './Alert.module.css';\n\ntype AlertActionMode = 'cancel' | 'destructive' | 'default';\n\nexport interface AlertActionInterface\n extends Pick<ButtonProps, 'Component'>,\n AnchorHTMLAttributesOnly,\n HasDataAttribute {\n title: string;\n /**\n * Обработчик клика на опцию. Если свойство `autoCloseDisabled` включено,\n * то в аргументы `action` передаётся объект с функцией close,\n * вызвав которую можно закрыть `action` вручную.\n */\n action?: (args?: { close?: VoidFunction }) => void;\n /**\n * По умолчанию клик на опцию вызывает переданную в `Alert` функцию `onClose`, данное свойство\n * позволяет отключить такое поведение\n */\n autoCloseDisabled?: boolean;\n mode: AlertActionMode;\n}\n\nexport interface AlertProps\n extends Omit<React.HTMLAttributes<HTMLElement>, 'title'>,\n Pick<UseFocusTrapProps, 'restoreFocus'>,\n HasRootRef<HTMLDivElement> {\n actionsLayout?: 'vertical' | 'horizontal';\n actionsAlign?: AlignType;\n actions?: AlertActionInterface[];\n renderAction?: (props: AlertActionProps) => React.ReactNode;\n title?: React.ReactNode;\n description?: React.ReactNode;\n onClose: VoidFunction;\n /**\n * Текст кнопки закрытия. Делает ее доступной для ассистивных технологий\n */\n dismissLabel?: string;\n /**\n * Расположение кнопки закрытия (внутри и вне `popout'a`)\n * Доступно только в `compact`-режиме, не отображается на `iOS`\n */\n dismissButtonMode?: 'inside' | 'outside';\n /**\n * Передает атрибут `data-testid` для кнопки закрытия\n */\n dismissButtonTestId?: string;\n usePortal?: AppRootPortalProps['usePortal'];\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Alert\n */\nexport const Alert = ({\n actions,\n actionsLayout = 'horizontal',\n children,\n className,\n style,\n title,\n description,\n onClose,\n dismissLabel = 'Закрыть предупреждение',\n renderAction,\n actionsAlign,\n dismissButtonMode = 'outside',\n dismissButtonTestId,\n getRootRef,\n usePortal,\n ...restProps\n}: AlertProps): React.ReactNode => {\n const generatedId = React.useId();\n\n const titleId = `vkui-alert-${generatedId}-title`;\n const descriptionId = `vkui-alert-${generatedId}-description`;\n\n const platform = usePlatform();\n const { isDesktop } = useAdaptivityWithJSMediaQueries();\n\n const [closing, setClosing] = React.useState(false);\n const itemActionCallbackRef = React.useRef(noop);\n const [animationState, animationHandlers] = useCSSKeyframesAnimationController(\n closing ? 'exit' : 'enter',\n {\n onExited() {\n itemActionCallbackRef.current();\n itemActionCallbackRef.current = noop;\n onClose();\n },\n },\n );\n const isDismissButtonVisible = isDesktop && platform !== 'ios';\n const elementRef = React.useRef<HTMLDivElement>(null);\n\n const close = React.useCallback(() => {\n setClosing(true);\n }, []);\n\n const onItemClick = React.useCallback(\n (item: AlertActionInterface) => {\n const { action: itemAction, autoCloseDisabled = false } = item;\n\n if (autoCloseDisabled) {\n itemAction && itemAction({ close });\n } else {\n if (itemAction) {\n itemActionCallbackRef.current = itemAction;\n }\n setClosing(true);\n }\n },\n [close],\n );\n\n useScrollLock();\n\n return (\n <AppRootPortal usePortal={usePortal}>\n <PopoutWrapper\n className={className}\n closing={closing}\n style={style}\n onClick={close}\n getRootRef={getRootRef}\n >\n <FocusTrap\n {...restProps}\n {...animationHandlers}\n getRootRef={elementRef}\n onClick={stopPropagation}\n onClose={close}\n autoFocus={animationState === 'entered'}\n className={classNames(\n styles.host,\n platform === 'ios' && styles.ios,\n platform === 'vkcom' && styles.vkcom,\n closing ? styles.closing : styles.opening,\n isDesktop && styles.desktop,\n )}\n role=\"alertdialog\"\n aria-modal\n aria-labelledby={titleId}\n aria-describedby={descriptionId}\n >\n <div\n className={classNames(\n styles.content,\n dismissButtonMode === 'inside' && styles.contentWithButton,\n )}\n >\n {hasReactNode(title) && <AlertTitle id={titleId}>{title}</AlertTitle>}\n {hasReactNode(description) && (\n <AlertDescription id={descriptionId}>{description}</AlertDescription>\n )}\n {children}\n {isDismissButtonVisible && dismissButtonMode === 'inside' && (\n <IconButton\n label={dismissLabel}\n className={classNames(styles.dismiss, 'vkuiInternalAlert__dismiss')}\n onClick={close}\n hoverMode=\"opacity\"\n activeMode=\"opacity\"\n data-testid={dismissButtonTestId}\n >\n <Icon20Cancel />\n </IconButton>\n )}\n </div>\n <AlertActions\n actions={actions}\n actionsAlign={actionsAlign}\n actionsLayout={actionsLayout}\n renderAction={renderAction}\n onItemClick={onItemClick}\n />\n {isDismissButtonVisible && dismissButtonMode === 'outside' && (\n <ModalDismissButton onClick={close} data-testid={dismissButtonTestId}>\n {dismissLabel}\n </ModalDismissButton>\n )}\n </FocusTrap>\n </PopoutWrapper>\n </AppRootPortal>\n );\n};\n"],"names":["React","Icon20Cancel","classNames","hasReactNode","noop","useAdaptivityWithJSMediaQueries","usePlatform","useCSSKeyframesAnimationController","stopPropagation","AppRootPortal","useScrollLock","FocusTrap","IconButton","ModalDismissButton","PopoutWrapper","AlertActions","AlertDescription","AlertTitle","Alert","actions","actionsLayout","children","className","style","title","description","onClose","dismissLabel","renderAction","actionsAlign","dismissButtonMode","dismissButtonTestId","getRootRef","usePortal","restProps","generatedId","useId","titleId","descriptionId","platform","isDesktop","closing","setClosing","useState","itemActionCallbackRef","useRef","animationState","animationHandlers","onExited","current","isDismissButtonVisible","elementRef","close","useCallback","onItemClick","item","action","itemAction","autoCloseDisabled","onClick","autoFocus","role","aria-modal","aria-labelledby","aria-describedby","div","id","label","hoverMode","activeMode","data-testid"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,mBAAmB;AAChD,SAASC,UAAU,EAAEC,YAAY,EAAEC,IAAI,QAAQ,kBAAkB;AACjE,SAASC,+BAA+B,QAAQ,iDAA8C;AAE9F,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,kCAAkC,QAAQ,+BAAsB;AACzE,SAASC,eAAe,QAAQ,qBAAkB;AAQlD,SAASC,aAAa,QAAQ,8BAA2B;AACzD,SAASC,aAAa,QAAQ,8BAA2B;AAEzD,SAASC,SAAS,QAAQ,4BAAyB;AACnD,SAASC,UAAU,QAAQ,8BAA2B;AACtD,SAASC,kBAAkB,QAAQ,8CAA2C;AAC9E,SAASC,aAAa,QAAQ,oCAAiC;AAE/D,SAASC,YAAY,QAAQ,oBAAiB;AAC9C,SAASC,gBAAgB,EAAEC,UAAU,QAAQ,uBAAoB;AAmDjE;;CAEC,GACD,OAAO,MAAMC,QAAQ;QAAC,EACpBC,OAAO,EACPC,gBAAgB,YAAY,EAC5BC,QAAQ,EACRC,SAAS,EACTC,KAAK,EACLC,KAAK,EACLC,WAAW,EACXC,OAAO,EACPC,eAAe,wBAAwB,EACvCC,YAAY,EACZC,YAAY,EACZC,oBAAoB,SAAS,EAC7BC,mBAAmB,EACnBC,UAAU,EACVC,SAAS,EAEE,WADRC;QAfHf;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,cAAcnC,MAAMoC,KAAK;IAE/B,MAAMC,UAAU,CAAC,WAAW,EAAEF,YAAY,MAAM,CAAC;IACjD,MAAMG,gBAAgB,CAAC,WAAW,EAAEH,YAAY,YAAY,CAAC;IAE7D,MAAMI,WAAWjC;IACjB,MAAM,EAAEkC,SAAS,EAAE,GAAGnC;IAEtB,MAAM,CAACoC,SAASC,WAAW,GAAG1C,MAAM2C,QAAQ,CAAC;IAC7C,MAAMC,wBAAwB5C,MAAM6C,MAAM,CAACzC;IAC3C,MAAM,CAAC0C,gBAAgBC,kBAAkB,GAAGxC,mCAC1CkC,UAAU,SAAS,SACnB;QACEO;YACEJ,sBAAsBK,OAAO;YAC7BL,sBAAsBK,OAAO,GAAG7C;YAChCsB;QACF;IACF;IAEF,MAAMwB,yBAAyBV,aAAaD,aAAa;IACzD,MAAMY,aAAanD,MAAM6C,MAAM,CAAiB;IAEhD,MAAMO,QAAQpD,MAAMqD,WAAW,CAAC;QAC9BX,WAAW;IACb,GAAG,EAAE;IAEL,MAAMY,cAActD,MAAMqD,WAAW,CACnC,CAACE;QACC,MAAM,EAAEC,QAAQC,UAAU,EAAEC,oBAAoB,KAAK,EAAE,GAAGH;QAE1D,IAAIG,mBAAmB;YACrBD,cAAcA,WAAW;gBAAEL;YAAM;QACnC,OAAO;YACL,IAAIK,YAAY;gBACdb,sBAAsBK,OAAO,GAAGQ;YAClC;YACAf,WAAW;QACb;IACF,GACA;QAACU;KAAM;IAGT1C;IAEA,qBACE,KAACD;QAAcwB,WAAWA;kBACxB,cAAA,KAACnB;YACCQ,WAAWA;YACXmB,SAASA;YACTlB,OAAOA;YACPoC,SAASP;YACTpB,YAAYA;sBAEZ,cAAA,MAACrB,mDACKuB,WACAa;gBACJf,YAAYmB;gBACZQ,SAASnD;gBACTkB,SAAS0B;gBACTQ,WAAWd,mBAAmB;gBAC9BxB,WAAWpB,8BAETqC,aAAa,2BACbA,aAAa,+BACbE,uDACAD;gBAEFqB,MAAK;gBACLC,YAAU;gBACVC,mBAAiB1B;gBACjB2B,oBAAkB1B;;kCAElB,MAAC2B;wBACC3C,WAAWpB,iCAET4B,sBAAsB;;4BAGvB3B,aAAaqB,wBAAU,KAACP;gCAAWiD,IAAI7B;0CAAUb;;4BACjDrB,aAAasB,8BACZ,KAACT;gCAAiBkD,IAAI5B;0CAAgBb;;4BAEvCJ;4BACA6B,0BAA0BpB,sBAAsB,0BAC/C,KAAClB;gCACCuD,OAAOxC;gCACPL,WAAWpB,iCAA2B;gCACtCyD,SAASP;gCACTgB,WAAU;gCACVC,YAAW;gCACXC,eAAavC;0CAEb,cAAA,KAAC9B;;;;kCAIP,KAACc;wBACCI,SAASA;wBACTU,cAAcA;wBACdT,eAAeA;wBACfQ,cAAcA;wBACd0B,aAAaA;;oBAEdJ,0BAA0BpB,sBAAsB,2BAC/C,KAACjB;wBAAmB8C,SAASP;wBAAOkB,eAAavC;kCAC9CJ;;;;;;AAOf,EAAE"}
1
+ {"version":3,"sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon20Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { type UseFocusTrapProps } from '../../hooks/useFocusTrap';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useCSSKeyframesAnimationController } from '../../lib/animation';\nimport { stopPropagation } from '../../lib/utils';\nimport type {\n AlignType,\n AnchorHTMLAttributesOnly,\n HasDataAttribute,\n HasRootRef,\n} from '../../types';\nimport type { AppRootPortalProps } from '../AppRoot/AppRootPortal';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport type { ButtonProps } from '../Button/Button';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { IconButton } from '../IconButton/IconButton';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport type { AlertActionProps } from './AlertAction';\nimport { AlertActions } from './AlertActions';\nimport { AlertDescription, AlertTitle } from './AlertTypography';\nimport styles from './Alert.module.css';\n\ntype AlertActionMode = 'cancel' | 'destructive' | 'default';\n\nexport interface AlertActionInterface\n extends Pick<ButtonProps, 'Component'>,\n AnchorHTMLAttributesOnly,\n HasDataAttribute {\n title: string;\n /**\n * Обработчик клика на опцию. Если свойство `autoCloseDisabled` включено,\n * то в аргументы `action` передаётся объект с функцией close,\n * вызвав которую можно закрыть `action` вручную.\n */\n action?: (args?: { close?: VoidFunction }) => void;\n /**\n * По умолчанию клик на опцию вызывает переданную в `Alert` функцию `onClose`, данное свойство\n * позволяет отключить такое поведение\n */\n autoCloseDisabled?: boolean;\n mode: AlertActionMode;\n}\n\nexport interface AlertProps\n extends Omit<React.HTMLAttributes<HTMLElement>, 'title'>,\n Pick<UseFocusTrapProps, 'restoreFocus'>,\n HasRootRef<HTMLDivElement> {\n actionsLayout?: 'vertical' | 'horizontal';\n actionsAlign?: AlignType;\n actions?: AlertActionInterface[];\n renderAction?: (props: AlertActionProps) => React.ReactNode;\n title?: React.ReactNode;\n description?: React.ReactNode;\n onClose: VoidFunction;\n /**\n * Текст кнопки закрытия. Делает ее доступной для ассистивных технологий\n */\n dismissLabel?: string;\n /**\n * Расположение кнопки закрытия (внутри и вне `popout'a`)\n * Доступно только в `compact`-режиме, не отображается на `iOS`\n */\n dismissButtonMode?: 'inside' | 'outside';\n /**\n * Передает атрибут `data-testid` для кнопки закрытия\n */\n dismissButtonTestId?: string;\n usePortal?: AppRootPortalProps['usePortal'];\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Alert\n */\nexport const Alert = ({\n actions,\n actionsLayout = 'horizontal',\n children,\n className,\n style,\n title,\n description,\n onClose,\n dismissLabel = 'Закрыть предупреждение',\n renderAction,\n actionsAlign,\n dismissButtonMode = 'outside',\n dismissButtonTestId,\n getRootRef,\n usePortal,\n ...restProps\n}: AlertProps): React.ReactNode => {\n const generatedId = React.useId();\n\n const titleId = `vkui-alert-${generatedId}-title`;\n const descriptionId = `vkui-alert-${generatedId}-description`;\n\n const platform = usePlatform();\n const { isDesktop } = useAdaptivityWithJSMediaQueries();\n\n const [closing, setClosing] = React.useState(false);\n const itemActionCallbackRef = React.useRef(noop);\n const [animationState, animationHandlers] = useCSSKeyframesAnimationController(\n closing ? 'exit' : 'enter',\n {\n onExited() {\n itemActionCallbackRef.current();\n itemActionCallbackRef.current = noop;\n onClose();\n },\n },\n );\n const isDismissButtonVisible = isDesktop && platform !== 'ios';\n const elementRef = React.useRef<HTMLDivElement>(null);\n\n const close = React.useCallback(() => {\n setClosing(true);\n }, []);\n\n const onItemClick = React.useCallback(\n (item: AlertActionInterface) => {\n const { action: itemAction, autoCloseDisabled = false } = item;\n\n if (autoCloseDisabled) {\n itemAction && itemAction({ close });\n } else {\n if (itemAction) {\n itemActionCallbackRef.current = itemAction;\n }\n setClosing(true);\n }\n },\n [close],\n );\n\n useScrollLock();\n\n return (\n <AppRootPortal usePortal={usePortal}>\n <PopoutWrapper\n className={className}\n closing={closing}\n style={style}\n onClick={close}\n getRootRef={getRootRef}\n >\n <FocusTrap\n {...restProps}\n {...animationHandlers}\n getRootRef={elementRef}\n onClick={stopPropagation}\n onClose={close}\n autoFocus={animationState === 'entered'}\n className={classNames(\n styles.host,\n platform === 'ios' && styles.ios,\n platform === 'vkcom' && styles.vkcom,\n closing ? styles.closing : styles.opening,\n isDesktop && styles.desktop,\n )}\n role=\"alertdialog\"\n aria-modal\n aria-labelledby={titleId}\n aria-describedby={descriptionId}\n >\n <div\n className={classNames(\n styles.content,\n dismissButtonMode === 'inside' && styles.contentWithButton,\n )}\n >\n {hasReactNode(title) && <AlertTitle id={titleId}>{title}</AlertTitle>}\n {hasReactNode(description) && (\n <AlertDescription id={descriptionId}>{description}</AlertDescription>\n )}\n {children}\n {isDismissButtonVisible && dismissButtonMode === 'inside' && (\n <IconButton\n label={dismissLabel}\n className={classNames(styles.dismiss, 'vkuiInternalAlert__dismiss')}\n onClick={close}\n hoverMode=\"opacity\"\n activeMode=\"opacity\"\n data-testid={dismissButtonTestId}\n >\n <Icon20Cancel />\n </IconButton>\n )}\n </div>\n {isDismissButtonVisible && dismissButtonMode === 'outside' && (\n <ModalDismissButton onClick={close} data-testid={dismissButtonTestId}>\n {dismissLabel}\n </ModalDismissButton>\n )}\n <AlertActions\n actions={actions}\n actionsAlign={actionsAlign}\n actionsLayout={actionsLayout}\n renderAction={renderAction}\n onItemClick={onItemClick}\n />\n </FocusTrap>\n </PopoutWrapper>\n </AppRootPortal>\n );\n};\n"],"names":["React","Icon20Cancel","classNames","hasReactNode","noop","useAdaptivityWithJSMediaQueries","usePlatform","useCSSKeyframesAnimationController","stopPropagation","AppRootPortal","useScrollLock","FocusTrap","IconButton","ModalDismissButton","PopoutWrapper","AlertActions","AlertDescription","AlertTitle","Alert","actions","actionsLayout","children","className","style","title","description","onClose","dismissLabel","renderAction","actionsAlign","dismissButtonMode","dismissButtonTestId","getRootRef","usePortal","restProps","generatedId","useId","titleId","descriptionId","platform","isDesktop","closing","setClosing","useState","itemActionCallbackRef","useRef","animationState","animationHandlers","onExited","current","isDismissButtonVisible","elementRef","close","useCallback","onItemClick","item","action","itemAction","autoCloseDisabled","onClick","autoFocus","role","aria-modal","aria-labelledby","aria-describedby","div","id","label","hoverMode","activeMode","data-testid"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"CarouselBase.d.ts","sourceRoot":"","sources":["../../../src/components/CarouselBase/CarouselBase.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAsB/B,OAAO,EACL,KAAK,gBAAgB,EAItB,MAAM,SAAS,CAAC;AAKjB,eAAO,MAAM,YAAY,gSAwBtB,gBAAgB,KAAG,KAAK,CAAC,SAkc3B,CAAC"}
1
+ {"version":3,"file":"CarouselBase.d.ts","sourceRoot":"","sources":["../../../src/components/CarouselBase/CarouselBase.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAsB/B,OAAO,EACL,KAAK,gBAAgB,EAItB,MAAM,SAAS,CAAC;AAKjB,eAAO,MAAM,YAAY,gSAwBtB,gBAAgB,KAAG,KAAK,CAAC,SA6b3B,CAAC"}
@@ -265,10 +265,7 @@ export const CarouselBase = (_param)=>{
265
265
  };
266
266
  const simpleSlideChangePerform = ()=>{
267
267
  const { snaps } = slidesManager.current;
268
- const startPoint = shiftXCurrentRef.current;
269
- const endPoint = snaps[slideIndex];
270
- const distance = endPoint - startPoint;
271
- addToAnimationQueue(getAnimateFunction((progress)=>transformCssStyles(startPoint + distance * progress)));
268
+ requestTransform(snaps[slideIndex], true);
272
269
  };
273
270
  useIsomorphicLayoutEffect(function performSlideChange() {
274
271
  if (!initialized.current) {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/CarouselBase/CarouselBase.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useMutationObserver } from '../../hooks/useMutationObserver';\nimport { useResizeObserver } from '../../hooks/useResizeObserver';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { type CustomTouchEvent } from '../Touch/Touch';\nimport { Bullets } from './Bullets';\nimport { CarouselViewPort } from './CarouselViewPort';\nimport { ScrollArrows } from './ScrollArrows';\nimport {\n ANIMATION_DURATION,\n CONTROL_ELEMENTS_STATE,\n SLIDE_THRESHOLD,\n SLIDES_MANAGER_STATE,\n} from './constants';\nimport { calcMax, calcMin, calculateIndent, getLoopPoints, getTargetIndex } from './helpers';\nimport { useSlideAnimation } from './hooks';\nimport {\n type BaseGalleryProps,\n type ControlElementsState,\n type GallerySlidesState,\n type SlidesManagerState,\n} from './types';\nimport styles from './CarouselBase.module.css';\n\nconst warn = warnOnce('Gallery');\n\nexport const CarouselBase = ({\n bullets = false,\n getRootRef,\n children,\n slideWidth = '100%',\n slideIndex = 0,\n dragDisabled = false,\n resizeSource = 'window',\n onDragStart,\n onDragEnd,\n onChange,\n onPrevClick,\n onNextClick,\n align = 'left',\n showArrows,\n getRef,\n arrowSize,\n arrowAreaHeight,\n slideTestId,\n bulletTestId,\n nextArrowTestId,\n prevArrowTestId,\n looped = false,\n ...restProps\n}: BaseGalleryProps): React.ReactNode => {\n const slidesStore = React.useRef<Record<string, HTMLDivElement | null>>({});\n const slidesManager = React.useRef<SlidesManagerState>(SLIDES_MANAGER_STATE);\n\n const rootRef = useExternRef(getRootRef);\n const viewportRef = useExternRef(getRef);\n const layerRef = React.useRef<HTMLDivElement>(null);\n const animationFrameRef = React.useRef<ReturnType<typeof requestAnimationFrame> | null>(null);\n const shiftXCurrentRef = React.useRef<number>(0);\n const shiftXDeltaRef = React.useRef<number>(0);\n const initialized = React.useRef<boolean>(false);\n const { addToAnimationQueue, getAnimateFunction, startAnimation } = useSlideAnimation();\n const isDragging = React.useRef(false);\n\n const [controlElementsState, setControlElementsState] =\n React.useState<ControlElementsState>(CONTROL_ELEMENTS_STATE);\n\n const hasPointer = useAdaptivityHasPointer();\n\n const isCenterAlign = align === 'center';\n\n /*\n * Считает отступ слоя галереи во время драга\n * Используется только для looped=false галереи\n * так как только у нее есть пределы по краям\n */\n const calculateDragIndent = () => {\n const localMax = slidesManager.current.max ?? 0;\n const localMin = slidesManager.current.min ?? 0;\n const indent = shiftXCurrentRef.current + shiftXDeltaRef.current;\n\n if (indent > localMax) {\n return localMax + Number((indent - localMax) / 3);\n } else if (indent < localMin) {\n return localMin + Number((indent - localMin) / 3);\n }\n\n return indent;\n };\n\n const calculateCanSlideLeft = () => {\n if (looped) {\n return !slidesManager.current.isFullyVisible;\n }\n return !slidesManager.current.isFullyVisible && shiftXCurrentRef.current < 0;\n };\n\n const calculateCanSlideRight = () => {\n if (looped) {\n return !slidesManager.current.isFullyVisible;\n }\n return (\n !slidesManager.current.isFullyVisible &&\n // we can't move right when gallery layer fully scrolled right, if gallery aligned by left side\n ((align === 'left' &&\n slidesManager.current.containerWidth - shiftXCurrentRef.current <\n (slidesManager.current.layerWidth ?? 0)) ||\n // otherwise we need to check current slide index (align = right or align = center)\n (align !== 'left' && slideIndex < slidesManager.current.slides.length - 1))\n );\n };\n\n const transformCssStyles = (shiftX: number, animation = false) => {\n shiftX = Math.round(shiftX);\n if (looped) {\n slidesManager.current.loopPoints.forEach((loopPoint) => {\n const { target, index } = loopPoint;\n const slide = slidesStore.current[index];\n if (slide) {\n slide.style.transform = `translate3d(${target(shiftX)}px, 0, 0)`;\n }\n });\n } else {\n Object.values(slidesStore.current).forEach((slide) => {\n if (slide) {\n slide.style.transform = '';\n }\n });\n }\n\n if (layerRef.current) {\n const indent = isDragging.current && !looped ? calculateDragIndent() : shiftX;\n\n layerRef.current.style.transform = `translate3d(${indent}px, 0, 0)`;\n layerRef.current.style.transition = animation\n ? `transform ${ANIMATION_DURATION}ms cubic-bezier(.1, 0, .25, 1)`\n : '';\n }\n };\n\n const requestTransform = (shiftX: number, animation = false) => {\n const { snaps, contentSize, slides } = slidesManager.current;\n\n if (animationFrameRef.current !== null) {\n cancelAnimationFrame(animationFrameRef.current);\n }\n animationFrameRef.current = requestAnimationFrame(() => {\n if (looped && shiftX > snaps[0]) {\n shiftXCurrentRef.current = -contentSize + snaps[0];\n shiftX = shiftXCurrentRef.current + shiftXDeltaRef.current;\n }\n const lastPoint = slides[slides.length - 1].width + slides[slides.length - 1].coordX;\n\n if (looped && shiftX <= -lastPoint) {\n shiftXCurrentRef.current = Math.abs(shiftXDeltaRef.current) + snaps[0];\n }\n transformCssStyles(shiftX, animation);\n });\n };\n\n const initializeSlides = () => {\n if (!rootRef.current || !viewportRef.current) {\n return;\n }\n let localSlides =\n React.Children.map(children, (_item, i): GallerySlidesState => {\n const elem = slidesStore.current[i] || { offsetLeft: 0, offsetWidth: 0 };\n return { coordX: elem.offsetLeft, width: elem.offsetWidth };\n }) || [];\n\n if (localSlides.length === 0) {\n initialized.current = false;\n return;\n }\n\n const containerWidth = rootRef.current.offsetWidth;\n const viewportOffsetWidth = viewportRef.current.offsetWidth;\n const layerWidth = localSlides.reduce((val, slide) => slide.width + val, 0);\n\n if (process.env.NODE_ENV === 'development' && looped) {\n let remainingWidth = containerWidth;\n let slideIndex = 0;\n\n while (remainingWidth > 0 && slideIndex < localSlides.length) {\n remainingWidth -= localSlides[slideIndex].width;\n slideIndex++;\n }\n if (remainingWidth <= 0 && slideIndex === localSlides.length) {\n warn(\n 'Ширины слайдов недостаточно для корректной работы свойства \"looped\". Пожалуйста, сделайте её больше.',\n );\n }\n }\n\n const currentSlideOffsetOnCenterAlignment =\n (containerWidth - (localSlides[slideIndex]?.width ?? 0)) / 2;\n const isFullyVisible =\n align === 'center'\n ? layerWidth + currentSlideOffsetOnCenterAlignment <= containerWidth\n : layerWidth <= containerWidth;\n\n const onlyOneSlide = localSlides.length === 1;\n\n slidesManager.current = {\n ...slidesManager.current,\n layerWidth,\n containerWidth,\n viewportOffsetWidth,\n slides: localSlides,\n isFullyVisible,\n max:\n looped || onlyOneSlide\n ? null\n : calcMax({\n slides: localSlides,\n containerWidth,\n isCenterAlign,\n }),\n min:\n looped || onlyOneSlide\n ? null\n : calcMin({\n containerWidth,\n layerWidth,\n slides: localSlides,\n viewportOffsetWidth,\n isFullyVisible,\n align,\n }),\n };\n const snaps = localSlides.map((_, index) =>\n calculateIndent(index, slidesManager.current, isCenterAlign, looped),\n );\n\n let contentSize = -snaps[snaps.length - 1] + localSlides[localSlides.length - 1].width;\n if (align === 'center') {\n contentSize += snaps[0];\n }\n\n slidesManager.current.snaps = snaps;\n slidesManager.current.contentSize = contentSize;\n // Если галерея не зациклена и слайд всего один, то рассчитывать loopPoints тоже не надо\n if (looped && !onlyOneSlide && !isFullyVisible) {\n slidesManager.current.loopPoints = getLoopPoints(slidesManager.current, containerWidth);\n }\n\n shiftXCurrentRef.current = snaps[slideIndex];\n initialized.current = true;\n\n setControlElementsState({\n canSlideLeft: calculateCanSlideLeft(),\n canSlideRight: calculateCanSlideRight(),\n isDraggable: !(dragDisabled || slidesManager.current.isFullyVisible),\n });\n requestTransform(shiftXCurrentRef.current);\n };\n\n const onResize = () => {\n if (initialized.current) {\n initializeSlides();\n }\n };\n const { window } = useDOM();\n useResizeObserver(resizeSource === 'element' ? rootRef : window, onResize);\n\n const loopedSlideChangePerform = () => {\n const { snaps, slides } = slidesManager.current;\n const indent = snaps[slideIndex];\n let startPoint = shiftXCurrentRef.current;\n\n /**\n * Переключаемся с последнего элемента на первый\n * Для корректной анимации мы прокручиваем последний слайд на всю длину (shiftX) \"вперед\"\n * В конце анимации при отрисовке следующего кадра задаем всем слайдам начальные значения\n */\n if (indent === snaps[0] && shiftXCurrentRef.current <= snaps[snaps.length - 1]) {\n const distance =\n Math.abs(snaps[snaps.length - 1]) + slides[slides.length - 1].width + startPoint;\n\n addToAnimationQueue(\n getAnimateFunction((progress) => {\n const shiftX = startPoint + progress * distance * -1;\n\n transformCssStyles(shiftX);\n\n if (shiftX <= snaps[snaps.length - 1] - slides[slides.length - 1].width) {\n requestAnimationFrame(() => {\n shiftXCurrentRef.current = indent;\n transformCssStyles(snaps[0]);\n });\n }\n }),\n );\n /**\n * Переключаемся с первого слайда на последний\n * Для корректной анимации сначала задаем первым видимым слайдам смещение\n * В следующем кадре начинаем анимация прокрутки \"назад\"\n */\n } else if (indent === snaps[snaps.length - 1] && shiftXCurrentRef.current === snaps[0]) {\n startPoint = indent - slides[slides.length - 1].width;\n\n addToAnimationQueue(() => {\n requestAnimationFrame(() => {\n const shiftX = indent - slides[slides.length - 1].width;\n transformCssStyles(shiftX);\n\n getAnimateFunction((progress) => {\n transformCssStyles(startPoint + progress * slides[slides.length - 1].width);\n })();\n });\n });\n /**\n * Если не обработаны `corner`-кейсы выше, то просто проигрываем анимацию смещения\n */\n } else {\n addToAnimationQueue(() => {\n const distance = Math.abs(indent - startPoint);\n let direction = startPoint <= indent ? 1 : -1;\n\n getAnimateFunction((progress) => {\n const shiftX = startPoint + progress * distance * direction;\n transformCssStyles(shiftX);\n })();\n });\n }\n };\n\n const simpleSlideChangePerform = () => {\n const { snaps } = slidesManager.current;\n const startPoint = shiftXCurrentRef.current;\n const endPoint = snaps[slideIndex];\n const distance = endPoint - startPoint;\n addToAnimationQueue(\n getAnimateFunction((progress) => transformCssStyles(startPoint + distance * progress)),\n );\n };\n\n useIsomorphicLayoutEffect(\n function performSlideChange() {\n if (!initialized.current) {\n return;\n }\n const { snaps } = slidesManager.current;\n const indent = snaps[slideIndex];\n\n if (looped) {\n loopedSlideChangePerform();\n } else {\n simpleSlideChangePerform();\n }\n\n startAnimation();\n\n shiftXCurrentRef.current = indent;\n\n setControlElementsState((v) => ({\n ...v,\n canSlideLeft: calculateCanSlideLeft(),\n canSlideRight: calculateCanSlideRight(),\n }));\n },\n [slideIndex],\n );\n\n useIsomorphicLayoutEffect(\n function updateIsDraggable() {\n setControlElementsState((v) => ({\n ...v,\n isDraggable: !(dragDisabled || slidesManager.current.isFullyVisible),\n }));\n },\n [dragDisabled],\n );\n\n useMutationObserver(layerRef, initializeSlides);\n\n useIsomorphicLayoutEffect(initializeSlides, [align, slideWidth, looped]);\n\n const calculateMinDeltaXToSlide = () => {\n return slidesManager.current.slides[slideIndex].width * SLIDE_THRESHOLD;\n };\n\n const slideLeft = (event: React.MouseEvent) => {\n if (slideIndex > 0) {\n shiftXCurrentRef.current += calculateMinDeltaXToSlide();\n }\n onChange?.(\n (slideIndex - 1 + slidesManager.current.slides.length) % slidesManager.current.slides.length,\n );\n onPrevClick?.(event);\n };\n\n const slideRight = (event: React.MouseEvent) => {\n if (slideIndex < slidesManager.current.slides.length - 1) {\n shiftXCurrentRef.current -= calculateMinDeltaXToSlide();\n }\n onChange?.((slideIndex + 1) % slidesManager.current.slides.length);\n onNextClick?.(event);\n };\n\n const onStart = (e: CustomTouchEvent) => {\n e.originalEvent.stopPropagation();\n if (controlElementsState.isDraggable) {\n onDragStart?.(e);\n shiftXCurrentRef.current = slidesManager.current.snaps[slideIndex];\n shiftXDeltaRef.current = 0;\n }\n };\n\n const onMoveX = (e: CustomTouchEvent) => {\n if (controlElementsState.isDraggable) {\n e.originalEvent.preventDefault();\n\n if (e.isSlideX) {\n isDragging.current = true;\n if (shiftXDeltaRef.current !== e.shiftX) {\n shiftXDeltaRef.current = e.shiftX;\n requestTransform(shiftXCurrentRef.current + shiftXDeltaRef.current);\n }\n }\n }\n };\n\n const onEnd = (e: CustomTouchEvent) => {\n if (controlElementsState.isDraggable) {\n isDragging.current = false;\n let targetIndex = slideIndex;\n if (e.isSlide) {\n targetIndex = getTargetIndex({\n slides: slidesManager.current.slides,\n slideIndex,\n currentShiftX: shiftXCurrentRef.current,\n currentShiftXDelta: shiftXDeltaRef.current,\n max: slidesManager.current.max,\n looped,\n });\n }\n onDragEnd?.(e, targetIndex);\n\n if (targetIndex !== slideIndex) {\n shiftXCurrentRef.current = shiftXCurrentRef.current + shiftXDeltaRef.current;\n onChange?.(targetIndex);\n } else {\n const initialShiftX = slidesManager.current.snaps[targetIndex];\n requestTransform(initialShiftX, true);\n }\n }\n };\n\n const setSlideRef = (slideRef: HTMLDivElement | null, slideIndex: number) => {\n slidesStore.current[slideIndex] = slideRef;\n };\n\n const { isDraggable, canSlideRight, canSlideLeft } = controlElementsState;\n\n return (\n <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles.host,\n slideWidth === 'custom' && styles.customWidth,\n isDraggable && styles.draggable,\n )}\n getRootRef={rootRef}\n >\n <CarouselViewPort\n slideWidth={slideWidth}\n slideTestId={slideTestId}\n onStart={onStart}\n onMoveX={onMoveX}\n onEnd={onEnd}\n getRootRef={viewportRef}\n layerRef={layerRef}\n setSlideRef={setSlideRef}\n >\n {children}\n </CarouselViewPort>\n\n {bullets && (\n <Bullets\n bullets={bullets}\n slideIndex={slideIndex}\n count={React.Children.count(children)}\n bulletTestId={bulletTestId}\n />\n )}\n <ScrollArrows\n hasPointer={hasPointer}\n canSlideLeft={canSlideLeft}\n canSlideRight={canSlideRight}\n onSlideRight={slideRight}\n onSlideLeft={slideLeft}\n showArrows={showArrows}\n arrowSize={arrowSize}\n arrowAreaHeight={arrowAreaHeight}\n prevArrowTestId={prevArrowTestId}\n nextArrowTestId={nextArrowTestId}\n />\n </RootComponent>\n );\n};\n"],"names":["React","classNames","useAdaptivityHasPointer","useExternRef","useMutationObserver","useResizeObserver","useDOM","useIsomorphicLayoutEffect","warnOnce","RootComponent","Bullets","CarouselViewPort","ScrollArrows","ANIMATION_DURATION","CONTROL_ELEMENTS_STATE","SLIDE_THRESHOLD","SLIDES_MANAGER_STATE","calcMax","calcMin","calculateIndent","getLoopPoints","getTargetIndex","useSlideAnimation","warn","CarouselBase","bullets","getRootRef","children","slideWidth","slideIndex","dragDisabled","resizeSource","onDragStart","onDragEnd","onChange","onPrevClick","onNextClick","align","showArrows","getRef","arrowSize","arrowAreaHeight","slideTestId","bulletTestId","nextArrowTestId","prevArrowTestId","looped","restProps","slidesStore","useRef","slidesManager","rootRef","viewportRef","layerRef","animationFrameRef","shiftXCurrentRef","shiftXDeltaRef","initialized","addToAnimationQueue","getAnimateFunction","startAnimation","isDragging","controlElementsState","setControlElementsState","useState","hasPointer","isCenterAlign","calculateDragIndent","localMax","current","max","localMin","min","indent","Number","calculateCanSlideLeft","isFullyVisible","calculateCanSlideRight","containerWidth","layerWidth","slides","length","transformCssStyles","shiftX","animation","Math","round","loopPoints","forEach","loopPoint","target","index","slide","style","transform","Object","values","transition","requestTransform","snaps","contentSize","cancelAnimationFrame","requestAnimationFrame","lastPoint","width","coordX","abs","initializeSlides","localSlides","Children","map","_item","i","elem","offsetLeft","offsetWidth","viewportOffsetWidth","reduce","val","process","env","NODE_ENV","remainingWidth","currentSlideOffsetOnCenterAlignment","onlyOneSlide","_","canSlideLeft","canSlideRight","isDraggable","onResize","window","loopedSlideChangePerform","startPoint","distance","progress","direction","simpleSlideChangePerform","endPoint","performSlideChange","v","updateIsDraggable","calculateMinDeltaXToSlide","slideLeft","event","slideRight","onStart","e","originalEvent","stopPropagation","onMoveX","preventDefault","isSlideX","onEnd","targetIndex","isSlide","currentShiftX","currentShiftXDelta","initialShiftX","setSlideRef","slideRef","baseClassName","count","onSlideRight","onSlideLeft"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../src/components/CarouselBase/CarouselBase.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useMutationObserver } from '../../hooks/useMutationObserver';\nimport { useResizeObserver } from '../../hooks/useResizeObserver';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { type CustomTouchEvent } from '../Touch/Touch';\nimport { Bullets } from './Bullets';\nimport { CarouselViewPort } from './CarouselViewPort';\nimport { ScrollArrows } from './ScrollArrows';\nimport {\n ANIMATION_DURATION,\n CONTROL_ELEMENTS_STATE,\n SLIDE_THRESHOLD,\n SLIDES_MANAGER_STATE,\n} from './constants';\nimport { calcMax, calcMin, calculateIndent, getLoopPoints, getTargetIndex } from './helpers';\nimport { useSlideAnimation } from './hooks';\nimport {\n type BaseGalleryProps,\n type ControlElementsState,\n type GallerySlidesState,\n type SlidesManagerState,\n} from './types';\nimport styles from './CarouselBase.module.css';\n\nconst warn = warnOnce('Gallery');\n\nexport const CarouselBase = ({\n bullets = false,\n getRootRef,\n children,\n slideWidth = '100%',\n slideIndex = 0,\n dragDisabled = false,\n resizeSource = 'window',\n onDragStart,\n onDragEnd,\n onChange,\n onPrevClick,\n onNextClick,\n align = 'left',\n showArrows,\n getRef,\n arrowSize,\n arrowAreaHeight,\n slideTestId,\n bulletTestId,\n nextArrowTestId,\n prevArrowTestId,\n looped = false,\n ...restProps\n}: BaseGalleryProps): React.ReactNode => {\n const slidesStore = React.useRef<Record<string, HTMLDivElement | null>>({});\n const slidesManager = React.useRef<SlidesManagerState>(SLIDES_MANAGER_STATE);\n\n const rootRef = useExternRef(getRootRef);\n const viewportRef = useExternRef(getRef);\n const layerRef = React.useRef<HTMLDivElement>(null);\n const animationFrameRef = React.useRef<ReturnType<typeof requestAnimationFrame> | null>(null);\n const shiftXCurrentRef = React.useRef<number>(0);\n const shiftXDeltaRef = React.useRef<number>(0);\n const initialized = React.useRef<boolean>(false);\n const { addToAnimationQueue, getAnimateFunction, startAnimation } = useSlideAnimation();\n const isDragging = React.useRef(false);\n\n const [controlElementsState, setControlElementsState] =\n React.useState<ControlElementsState>(CONTROL_ELEMENTS_STATE);\n\n const hasPointer = useAdaptivityHasPointer();\n\n const isCenterAlign = align === 'center';\n\n /*\n * Считает отступ слоя галереи во время драга\n * Используется только для looped=false галереи\n * так как только у нее есть пределы по краям\n */\n const calculateDragIndent = () => {\n const localMax = slidesManager.current.max ?? 0;\n const localMin = slidesManager.current.min ?? 0;\n const indent = shiftXCurrentRef.current + shiftXDeltaRef.current;\n\n if (indent > localMax) {\n return localMax + Number((indent - localMax) / 3);\n } else if (indent < localMin) {\n return localMin + Number((indent - localMin) / 3);\n }\n\n return indent;\n };\n\n const calculateCanSlideLeft = () => {\n if (looped) {\n return !slidesManager.current.isFullyVisible;\n }\n return !slidesManager.current.isFullyVisible && shiftXCurrentRef.current < 0;\n };\n\n const calculateCanSlideRight = () => {\n if (looped) {\n return !slidesManager.current.isFullyVisible;\n }\n return (\n !slidesManager.current.isFullyVisible &&\n // we can't move right when gallery layer fully scrolled right, if gallery aligned by left side\n ((align === 'left' &&\n slidesManager.current.containerWidth - shiftXCurrentRef.current <\n (slidesManager.current.layerWidth ?? 0)) ||\n // otherwise we need to check current slide index (align = right or align = center)\n (align !== 'left' && slideIndex < slidesManager.current.slides.length - 1))\n );\n };\n\n const transformCssStyles = (shiftX: number, animation = false) => {\n shiftX = Math.round(shiftX);\n if (looped) {\n slidesManager.current.loopPoints.forEach((loopPoint) => {\n const { target, index } = loopPoint;\n const slide = slidesStore.current[index];\n if (slide) {\n slide.style.transform = `translate3d(${target(shiftX)}px, 0, 0)`;\n }\n });\n } else {\n Object.values(slidesStore.current).forEach((slide) => {\n if (slide) {\n slide.style.transform = '';\n }\n });\n }\n\n if (layerRef.current) {\n const indent = isDragging.current && !looped ? calculateDragIndent() : shiftX;\n\n layerRef.current.style.transform = `translate3d(${indent}px, 0, 0)`;\n layerRef.current.style.transition = animation\n ? `transform ${ANIMATION_DURATION}ms cubic-bezier(.1, 0, .25, 1)`\n : '';\n }\n };\n\n const requestTransform = (shiftX: number, animation = false) => {\n const { snaps, contentSize, slides } = slidesManager.current;\n\n if (animationFrameRef.current !== null) {\n cancelAnimationFrame(animationFrameRef.current);\n }\n animationFrameRef.current = requestAnimationFrame(() => {\n if (looped && shiftX > snaps[0]) {\n shiftXCurrentRef.current = -contentSize + snaps[0];\n shiftX = shiftXCurrentRef.current + shiftXDeltaRef.current;\n }\n const lastPoint = slides[slides.length - 1].width + slides[slides.length - 1].coordX;\n\n if (looped && shiftX <= -lastPoint) {\n shiftXCurrentRef.current = Math.abs(shiftXDeltaRef.current) + snaps[0];\n }\n transformCssStyles(shiftX, animation);\n });\n };\n\n const initializeSlides = () => {\n if (!rootRef.current || !viewportRef.current) {\n return;\n }\n let localSlides =\n React.Children.map(children, (_item, i): GallerySlidesState => {\n const elem = slidesStore.current[i] || { offsetLeft: 0, offsetWidth: 0 };\n return { coordX: elem.offsetLeft, width: elem.offsetWidth };\n }) || [];\n\n if (localSlides.length === 0) {\n initialized.current = false;\n return;\n }\n\n const containerWidth = rootRef.current.offsetWidth;\n const viewportOffsetWidth = viewportRef.current.offsetWidth;\n const layerWidth = localSlides.reduce((val, slide) => slide.width + val, 0);\n\n if (process.env.NODE_ENV === 'development' && looped) {\n let remainingWidth = containerWidth;\n let slideIndex = 0;\n\n while (remainingWidth > 0 && slideIndex < localSlides.length) {\n remainingWidth -= localSlides[slideIndex].width;\n slideIndex++;\n }\n if (remainingWidth <= 0 && slideIndex === localSlides.length) {\n warn(\n 'Ширины слайдов недостаточно для корректной работы свойства \"looped\". Пожалуйста, сделайте её больше.',\n );\n }\n }\n\n const currentSlideOffsetOnCenterAlignment =\n (containerWidth - (localSlides[slideIndex]?.width ?? 0)) / 2;\n const isFullyVisible =\n align === 'center'\n ? layerWidth + currentSlideOffsetOnCenterAlignment <= containerWidth\n : layerWidth <= containerWidth;\n\n const onlyOneSlide = localSlides.length === 1;\n\n slidesManager.current = {\n ...slidesManager.current,\n layerWidth,\n containerWidth,\n viewportOffsetWidth,\n slides: localSlides,\n isFullyVisible,\n max:\n looped || onlyOneSlide\n ? null\n : calcMax({\n slides: localSlides,\n containerWidth,\n isCenterAlign,\n }),\n min:\n looped || onlyOneSlide\n ? null\n : calcMin({\n containerWidth,\n layerWidth,\n slides: localSlides,\n viewportOffsetWidth,\n isFullyVisible,\n align,\n }),\n };\n const snaps = localSlides.map((_, index) =>\n calculateIndent(index, slidesManager.current, isCenterAlign, looped),\n );\n\n let contentSize = -snaps[snaps.length - 1] + localSlides[localSlides.length - 1].width;\n if (align === 'center') {\n contentSize += snaps[0];\n }\n\n slidesManager.current.snaps = snaps;\n slidesManager.current.contentSize = contentSize;\n // Если галерея не зациклена и слайд всего один, то рассчитывать loopPoints тоже не надо\n if (looped && !onlyOneSlide && !isFullyVisible) {\n slidesManager.current.loopPoints = getLoopPoints(slidesManager.current, containerWidth);\n }\n\n shiftXCurrentRef.current = snaps[slideIndex];\n initialized.current = true;\n\n setControlElementsState({\n canSlideLeft: calculateCanSlideLeft(),\n canSlideRight: calculateCanSlideRight(),\n isDraggable: !(dragDisabled || slidesManager.current.isFullyVisible),\n });\n requestTransform(shiftXCurrentRef.current);\n };\n\n const onResize = () => {\n if (initialized.current) {\n initializeSlides();\n }\n };\n const { window } = useDOM();\n useResizeObserver(resizeSource === 'element' ? rootRef : window, onResize);\n\n const loopedSlideChangePerform = () => {\n const { snaps, slides } = slidesManager.current;\n const indent = snaps[slideIndex];\n let startPoint = shiftXCurrentRef.current;\n\n /**\n * Переключаемся с последнего элемента на первый\n * Для корректной анимации мы прокручиваем последний слайд на всю длину (shiftX) \"вперед\"\n * В конце анимации при отрисовке следующего кадра задаем всем слайдам начальные значения\n */\n if (indent === snaps[0] && shiftXCurrentRef.current <= snaps[snaps.length - 1]) {\n const distance =\n Math.abs(snaps[snaps.length - 1]) + slides[slides.length - 1].width + startPoint;\n\n addToAnimationQueue(\n getAnimateFunction((progress) => {\n const shiftX = startPoint + progress * distance * -1;\n\n transformCssStyles(shiftX);\n\n if (shiftX <= snaps[snaps.length - 1] - slides[slides.length - 1].width) {\n requestAnimationFrame(() => {\n shiftXCurrentRef.current = indent;\n transformCssStyles(snaps[0]);\n });\n }\n }),\n );\n /**\n * Переключаемся с первого слайда на последний\n * Для корректной анимации сначала задаем первым видимым слайдам смещение\n * В следующем кадре начинаем анимация прокрутки \"назад\"\n */\n } else if (indent === snaps[snaps.length - 1] && shiftXCurrentRef.current === snaps[0]) {\n startPoint = indent - slides[slides.length - 1].width;\n\n addToAnimationQueue(() => {\n requestAnimationFrame(() => {\n const shiftX = indent - slides[slides.length - 1].width;\n transformCssStyles(shiftX);\n\n getAnimateFunction((progress) => {\n transformCssStyles(startPoint + progress * slides[slides.length - 1].width);\n })();\n });\n });\n /**\n * Если не обработаны `corner`-кейсы выше, то просто проигрываем анимацию смещения\n */\n } else {\n addToAnimationQueue(() => {\n const distance = Math.abs(indent - startPoint);\n let direction = startPoint <= indent ? 1 : -1;\n\n getAnimateFunction((progress) => {\n const shiftX = startPoint + progress * distance * direction;\n transformCssStyles(shiftX);\n })();\n });\n }\n };\n\n const simpleSlideChangePerform = () => {\n const { snaps } = slidesManager.current;\n requestTransform(snaps[slideIndex], true);\n };\n\n useIsomorphicLayoutEffect(\n function performSlideChange() {\n if (!initialized.current) {\n return;\n }\n const { snaps } = slidesManager.current;\n const indent = snaps[slideIndex];\n\n if (looped) {\n loopedSlideChangePerform();\n } else {\n simpleSlideChangePerform();\n }\n\n startAnimation();\n\n shiftXCurrentRef.current = indent;\n\n setControlElementsState((v) => ({\n ...v,\n canSlideLeft: calculateCanSlideLeft(),\n canSlideRight: calculateCanSlideRight(),\n }));\n },\n [slideIndex],\n );\n\n useIsomorphicLayoutEffect(\n function updateIsDraggable() {\n setControlElementsState((v) => ({\n ...v,\n isDraggable: !(dragDisabled || slidesManager.current.isFullyVisible),\n }));\n },\n [dragDisabled],\n );\n\n useMutationObserver(layerRef, initializeSlides);\n\n useIsomorphicLayoutEffect(initializeSlides, [align, slideWidth, looped]);\n\n const calculateMinDeltaXToSlide = () => {\n return slidesManager.current.slides[slideIndex].width * SLIDE_THRESHOLD;\n };\n\n const slideLeft = (event: React.MouseEvent) => {\n if (slideIndex > 0) {\n shiftXCurrentRef.current += calculateMinDeltaXToSlide();\n }\n onChange?.(\n (slideIndex - 1 + slidesManager.current.slides.length) % slidesManager.current.slides.length,\n );\n onPrevClick?.(event);\n };\n\n const slideRight = (event: React.MouseEvent) => {\n if (slideIndex < slidesManager.current.slides.length - 1) {\n shiftXCurrentRef.current -= calculateMinDeltaXToSlide();\n }\n onChange?.((slideIndex + 1) % slidesManager.current.slides.length);\n onNextClick?.(event);\n };\n\n const onStart = (e: CustomTouchEvent) => {\n e.originalEvent.stopPropagation();\n if (controlElementsState.isDraggable) {\n onDragStart?.(e);\n shiftXCurrentRef.current = slidesManager.current.snaps[slideIndex];\n shiftXDeltaRef.current = 0;\n }\n };\n\n const onMoveX = (e: CustomTouchEvent) => {\n if (controlElementsState.isDraggable) {\n e.originalEvent.preventDefault();\n\n if (e.isSlideX) {\n isDragging.current = true;\n if (shiftXDeltaRef.current !== e.shiftX) {\n shiftXDeltaRef.current = e.shiftX;\n requestTransform(shiftXCurrentRef.current + shiftXDeltaRef.current);\n }\n }\n }\n };\n\n const onEnd = (e: CustomTouchEvent) => {\n if (controlElementsState.isDraggable) {\n isDragging.current = false;\n let targetIndex = slideIndex;\n if (e.isSlide) {\n targetIndex = getTargetIndex({\n slides: slidesManager.current.slides,\n slideIndex,\n currentShiftX: shiftXCurrentRef.current,\n currentShiftXDelta: shiftXDeltaRef.current,\n max: slidesManager.current.max,\n looped,\n });\n }\n onDragEnd?.(e, targetIndex);\n\n if (targetIndex !== slideIndex) {\n shiftXCurrentRef.current = shiftXCurrentRef.current + shiftXDeltaRef.current;\n onChange?.(targetIndex);\n } else {\n const initialShiftX = slidesManager.current.snaps[targetIndex];\n requestTransform(initialShiftX, true);\n }\n }\n };\n\n const setSlideRef = (slideRef: HTMLDivElement | null, slideIndex: number) => {\n slidesStore.current[slideIndex] = slideRef;\n };\n\n const { isDraggable, canSlideRight, canSlideLeft } = controlElementsState;\n\n return (\n <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles.host,\n slideWidth === 'custom' && styles.customWidth,\n isDraggable && styles.draggable,\n )}\n getRootRef={rootRef}\n >\n <CarouselViewPort\n slideWidth={slideWidth}\n slideTestId={slideTestId}\n onStart={onStart}\n onMoveX={onMoveX}\n onEnd={onEnd}\n getRootRef={viewportRef}\n layerRef={layerRef}\n setSlideRef={setSlideRef}\n >\n {children}\n </CarouselViewPort>\n\n {bullets && (\n <Bullets\n bullets={bullets}\n slideIndex={slideIndex}\n count={React.Children.count(children)}\n bulletTestId={bulletTestId}\n />\n )}\n <ScrollArrows\n hasPointer={hasPointer}\n canSlideLeft={canSlideLeft}\n canSlideRight={canSlideRight}\n onSlideRight={slideRight}\n onSlideLeft={slideLeft}\n showArrows={showArrows}\n arrowSize={arrowSize}\n arrowAreaHeight={arrowAreaHeight}\n prevArrowTestId={prevArrowTestId}\n nextArrowTestId={nextArrowTestId}\n />\n </RootComponent>\n );\n};\n"],"names":["React","classNames","useAdaptivityHasPointer","useExternRef","useMutationObserver","useResizeObserver","useDOM","useIsomorphicLayoutEffect","warnOnce","RootComponent","Bullets","CarouselViewPort","ScrollArrows","ANIMATION_DURATION","CONTROL_ELEMENTS_STATE","SLIDE_THRESHOLD","SLIDES_MANAGER_STATE","calcMax","calcMin","calculateIndent","getLoopPoints","getTargetIndex","useSlideAnimation","warn","CarouselBase","bullets","getRootRef","children","slideWidth","slideIndex","dragDisabled","resizeSource","onDragStart","onDragEnd","onChange","onPrevClick","onNextClick","align","showArrows","getRef","arrowSize","arrowAreaHeight","slideTestId","bulletTestId","nextArrowTestId","prevArrowTestId","looped","restProps","slidesStore","useRef","slidesManager","rootRef","viewportRef","layerRef","animationFrameRef","shiftXCurrentRef","shiftXDeltaRef","initialized","addToAnimationQueue","getAnimateFunction","startAnimation","isDragging","controlElementsState","setControlElementsState","useState","hasPointer","isCenterAlign","calculateDragIndent","localMax","current","max","localMin","min","indent","Number","calculateCanSlideLeft","isFullyVisible","calculateCanSlideRight","containerWidth","layerWidth","slides","length","transformCssStyles","shiftX","animation","Math","round","loopPoints","forEach","loopPoint","target","index","slide","style","transform","Object","values","transition","requestTransform","snaps","contentSize","cancelAnimationFrame","requestAnimationFrame","lastPoint","width","coordX","abs","initializeSlides","localSlides","Children","map","_item","i","elem","offsetLeft","offsetWidth","viewportOffsetWidth","reduce","val","process","env","NODE_ENV","remainingWidth","currentSlideOffsetOnCenterAlignment","onlyOneSlide","_","canSlideLeft","canSlideRight","isDraggable","onResize","window","loopedSlideChangePerform","startPoint","distance","progress","direction","simpleSlideChangePerform","performSlideChange","v","updateIsDraggable","calculateMinDeltaXToSlide","slideLeft","event","slideRight","onStart","e","originalEvent","stopPropagation","onMoveX","preventDefault","isSlideX","onEnd","targetIndex","isSlide","currentShiftX","currentShiftXDelta","initialShiftX","setSlideRef","slideRef","baseClassName","count","onSlideRight","onSlideLeft"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"FormItem.d.ts","sourceRoot":"","sources":["../../../src/components/FormItem/FormItem.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC5D,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAGxE,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAclE,MAAM,WAAW,aACf,SAAQ,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,EAC1C,UAAU,CAAC,WAAW,CAAC,EACvB,YAAY,EACZ,cAAc;IAChB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;OAIG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IACjC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,OAAO,CAAC;IACvC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC/B;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAAC,GAAG;IAC/C,GAAG,EAAE,OAAO,WAAW,CAAC;IACxB,QAAQ,EAAE,OAAO,gBAAgB,CAAC;IAClC,QAAQ,EAAE,OAAO,gBAAgB,CAAC;CAoFnC,CAAC"}
1
+ {"version":3,"file":"FormItem.d.ts","sourceRoot":"","sources":["../../../src/components/FormItem/FormItem.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC5D,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAGxE,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAclE,MAAM,WAAW,aACf,SAAQ,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,EAC1C,UAAU,CAAC,WAAW,CAAC,EACvB,YAAY,EACZ,cAAc;IAChB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;OAIG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IACjC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,OAAO,CAAC;IACvC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC/B;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAAC,GAAG;IAC/C,GAAG,EAAE,OAAO,WAAW,CAAC;IACxB,QAAQ,EAAE,OAAO,gBAAgB,CAAC;IAClC,QAAQ,EAAE,OAAO,gBAAgB,CAAC;CAqFnC,CAAC"}
@@ -84,6 +84,7 @@ const stylesStatus = {
84
84
  },
85
85
  removePlaceholder: removePlaceholder,
86
86
  indent: removable === 'indent',
87
+ noPadding: noPadding,
87
88
  children: /*#__PURE__*/ _jsx("div", {
88
89
  className: classNames("vkuiFormItem__removable", 'vkuiInternalFormItem__removable'),
89
90
  children: wrappedChildren
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/FormItem/FormItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, hasReactNode, isPrimitiveReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport type { HasComponent, HasRootRef } from '../../types';\nimport { Removable, type RemovableProps } from '../Removable/Removable';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { FormItemTop } from './FormItemTop/FormItemTop';\nimport { FormItemTopAside } from './FormItemTop/FormItemTopAside';\nimport { FormItemTopLabel } from './FormItemTop/FormItemTopLabel';\nimport { FormItemContext } from './context';\nimport styles from './FormItem.module.css';\n\nconst sizeYClassNames = {\n none: classNames(styles.sizeYNone, 'vkuiInternalFormItem--sizeY-none'),\n compact: classNames(styles.sizeYCompact, 'vkuiInternalFormItem--sizeY-compact'),\n};\n\nconst stylesStatus = {\n error: classNames(styles.statusError, 'vkuiInternalFormItem--status-error'),\n valid: classNames(styles.statusValid, 'vkuiInternalFormItem--status-valid'),\n};\n\nexport interface FormItemProps\n extends React.AllHTMLAttributes<HTMLElement>,\n HasRootRef<HTMLElement>,\n HasComponent,\n RemovableProps {\n top?: React.ReactNode;\n topId?: string;\n /**\n * Многострочный вывод заголовка. По умолчанию текст не переносится при переполнении.\n */\n topMultiline?: boolean;\n /**\n * Позволяет поменять тег используемый для top\n * Если оставить пустым, то тег top будет span.\n * Если оставить пустым и использовать htmlFor, то тег top будет label.\n */\n topComponent?: React.ElementType;\n bottom?: React.ReactNode;\n /**\n * Передаётся при использовании `bottom`.\n *\n * Должен совпадать с `aria-describedby`, который передаётся в компонент, отвечающий за пользовательский ввод.\n */\n bottomId?: string;\n status?: 'default' | 'error' | 'valid';\n /**\n * Дает возможность удалить `FormItem`. Рекомендуется использовать только для `Input` или `Select`.\n *\n * Режим `indent` предназначен для визуального отступа\n */\n removable?: boolean | 'indent';\n /**\n * Удаляет внешние отступы вокруг компонента\n * @since 5.8.0\n */\n noPadding?: boolean;\n /**\n * Помечает поле обязательным\n */\n required?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormItem\n */\nexport const FormItem: React.FC<FormItemProps> & {\n Top: typeof FormItemTop;\n TopLabel: typeof FormItemTopLabel;\n TopAside: typeof FormItemTopAside;\n} = ({\n children,\n top,\n topId,\n topMultiline = false,\n topComponent: topComponentProp,\n bottom,\n status = 'default',\n removable,\n onRemove,\n removePlaceholder = 'Удалить',\n getRootRef,\n htmlFor,\n bottomId,\n noPadding,\n required = false,\n ...restProps\n}: FormItemProps) => {\n const rootEl = useExternRef(getRootRef);\n const { sizeY = 'none' } = useAdaptivity();\n\n const wrappedChildren = (\n <React.Fragment>\n {isPrimitiveReactNode(top) ? (\n <FormItemTop>\n <FormItemTopLabel htmlFor={htmlFor} Component={topComponentProp} id={topId}>\n {top}\n </FormItemTopLabel>\n </FormItemTop>\n ) : hasReactNode(top) ? (\n top\n ) : null}\n {children}\n {hasReactNode(bottom) && (\n <Footnote\n className={styles.bottom}\n id={bottomId}\n role={status === 'error' ? 'alert' : undefined}\n >\n {bottom}\n </Footnote>\n )}\n </React.Fragment>\n );\n\n const context = React.useMemo(() => ({ required, topMultiline }), [required, topMultiline]);\n\n return (\n <RootComponent\n {...restProps}\n getRootRef={rootEl}\n baseClassName={classNames(\n styles.host,\n !noPadding && styles.withPadding,\n 'vkuiInternalFormItem',\n status !== 'default' && stylesStatus[status],\n sizeY !== 'regular' && sizeYClassNames[sizeY],\n hasReactNode(top) && classNames(styles.withTop, 'vkuiInternalFormItem--withTop'),\n removable && classNames(styles.withRemovable, 'vkuiInternalFormItem--removable'),\n )}\n >\n <FormItemContext.Provider value={context}>\n {removable ? (\n <Removable\n align=\"start\"\n onRemove={(e) => {\n if (rootEl?.current) {\n onRemove?.(e, rootEl.current);\n }\n }}\n removePlaceholder={removePlaceholder}\n indent={removable === 'indent'}\n >\n <div className={classNames(styles.removable, 'vkuiInternalFormItem__removable')}>\n {wrappedChildren}\n </div>\n </Removable>\n ) : (\n wrappedChildren\n )}\n </FormItemContext.Provider>\n </RootComponent>\n );\n};\n\nFormItem.displayName = 'FormItem';\n\nFormItem.Top = FormItemTop;\nFormItem.Top.displayName = 'FormItem.Top';\n\nFormItem.TopLabel = FormItemTopLabel;\nFormItem.TopLabel.displayName = 'FormItem.TopLabel';\n\nFormItem.TopAside = FormItemTopAside;\nFormItem.TopAside.displayName = 'FormItem.TopAside';\n"],"names":["React","classNames","hasReactNode","isPrimitiveReactNode","useAdaptivity","useExternRef","Removable","RootComponent","Footnote","FormItemTop","FormItemTopAside","FormItemTopLabel","FormItemContext","sizeYClassNames","none","compact","stylesStatus","error","valid","FormItem","children","top","topId","topMultiline","topComponent","topComponentProp","bottom","status","removable","onRemove","removePlaceholder","getRootRef","htmlFor","bottomId","noPadding","required","restProps","rootEl","sizeY","wrappedChildren","Fragment","Component","id","className","role","undefined","context","useMemo","baseClassName","Provider","value","align","e","current","indent","div","displayName","Top","TopLabel","TopAside"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,EAAEC,oBAAoB,QAAQ,kBAAkB;AACjF,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,YAAY,QAAQ,8BAA2B;AAExD,SAASC,SAAS,QAA6B,4BAAyB;AACxE,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,WAAW,QAAQ,+BAA4B;AACxD,SAASC,gBAAgB,QAAQ,oCAAiC;AAClE,SAASC,gBAAgB,QAAQ,oCAAiC;AAClE,SAASC,eAAe,QAAQ,eAAY;AAG5C,MAAMC,kBAAkB;IACtBC,MAAMb,sCAA6B;IACnCc,SAASd,yCAAgC;AAC3C;AAEA,MAAMe,eAAe;IACnBC,OAAOhB,wCAA+B;IACtCiB,OAAOjB,wCAA+B;AACxC;AA4CA;;CAEC,GACD,OAAO,MAAMkB,WAIT;QAAC,EACHC,QAAQ,EACRC,GAAG,EACHC,KAAK,EACLC,eAAe,KAAK,EACpBC,cAAcC,gBAAgB,EAC9BC,MAAM,EACNC,SAAS,SAAS,EAClBC,SAAS,EACTC,QAAQ,EACRC,oBAAoB,SAAS,EAC7BC,UAAU,EACVC,OAAO,EACPC,QAAQ,EACRC,SAAS,EACTC,WAAW,KAAK,EAEF,WADXC;QAfHhB;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,SAAShC,aAAa0B;IAC5B,MAAM,EAAEO,QAAQ,MAAM,EAAE,GAAGlC;IAE3B,MAAMmC,gCACJ,MAACvC,MAAMwC,QAAQ;;YACZrC,qBAAqBkB,qBACpB,KAACZ;0BACC,cAAA,KAACE;oBAAiBqB,SAASA;oBAASS,WAAWhB;oBAAkBiB,IAAIpB;8BAClED;;iBAGHnB,aAAamB,OACfA,MACE;YACHD;YACAlB,aAAawB,yBACZ,KAAClB;gBACCmC,SAAS;gBACTD,IAAIT;gBACJW,MAAMjB,WAAW,UAAU,UAAUkB;0BAEpCnB;;;;IAMT,MAAMoB,UAAU9C,MAAM+C,OAAO,CAAC,IAAO,CAAA;YAAEZ;YAAUZ;QAAa,CAAA,GAAI;QAACY;QAAUZ;KAAa;IAE1F,qBACE,KAAChB,uDACK6B;QACJL,YAAYM;QACZW,eAAe/C,iCAEb,CAACiC,0CACD,wBACAP,WAAW,aAAaX,YAAY,CAACW,OAAO,EAC5CW,UAAU,aAAazB,eAAe,CAACyB,MAAM,EAC7CpC,aAAamB,QAAQpB,oCAA2B,kCAChD2B,aAAa3B,0CAAiC;kBAGhD,cAAA,KAACW,gBAAgBqC,QAAQ;YAACC,OAAOJ;sBAC9BlB,0BACC,KAACtB;gBACC6C,OAAM;gBACNtB,UAAU,CAACuB;oBACT,IAAIf,mBAAAA,6BAAAA,OAAQgB,OAAO,EAAE;wBACnBxB,qBAAAA,+BAAAA,SAAWuB,GAAGf,OAAOgB,OAAO;oBAC9B;gBACF;gBACAvB,mBAAmBA;gBACnBwB,QAAQ1B,cAAc;0BAEtB,cAAA,KAAC2B;oBAAIZ,WAAW1C,sCAA6B;8BAC1CsC;;iBAILA;;;AAKV,EAAE;AAEFpB,SAASqC,WAAW,GAAG;AAEvBrC,SAASsC,GAAG,GAAGhD;AACfU,SAASsC,GAAG,CAACD,WAAW,GAAG;AAE3BrC,SAASuC,QAAQ,GAAG/C;AACpBQ,SAASuC,QAAQ,CAACF,WAAW,GAAG;AAEhCrC,SAASwC,QAAQ,GAAGjD;AACpBS,SAASwC,QAAQ,CAACH,WAAW,GAAG"}
1
+ {"version":3,"sources":["../../../src/components/FormItem/FormItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, hasReactNode, isPrimitiveReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport type { HasComponent, HasRootRef } from '../../types';\nimport { Removable, type RemovableProps } from '../Removable/Removable';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { FormItemTop } from './FormItemTop/FormItemTop';\nimport { FormItemTopAside } from './FormItemTop/FormItemTopAside';\nimport { FormItemTopLabel } from './FormItemTop/FormItemTopLabel';\nimport { FormItemContext } from './context';\nimport styles from './FormItem.module.css';\n\nconst sizeYClassNames = {\n none: classNames(styles.sizeYNone, 'vkuiInternalFormItem--sizeY-none'),\n compact: classNames(styles.sizeYCompact, 'vkuiInternalFormItem--sizeY-compact'),\n};\n\nconst stylesStatus = {\n error: classNames(styles.statusError, 'vkuiInternalFormItem--status-error'),\n valid: classNames(styles.statusValid, 'vkuiInternalFormItem--status-valid'),\n};\n\nexport interface FormItemProps\n extends React.AllHTMLAttributes<HTMLElement>,\n HasRootRef<HTMLElement>,\n HasComponent,\n RemovableProps {\n top?: React.ReactNode;\n topId?: string;\n /**\n * Многострочный вывод заголовка. По умолчанию текст не переносится при переполнении.\n */\n topMultiline?: boolean;\n /**\n * Позволяет поменять тег используемый для top\n * Если оставить пустым, то тег top будет span.\n * Если оставить пустым и использовать htmlFor, то тег top будет label.\n */\n topComponent?: React.ElementType;\n bottom?: React.ReactNode;\n /**\n * Передаётся при использовании `bottom`.\n *\n * Должен совпадать с `aria-describedby`, который передаётся в компонент, отвечающий за пользовательский ввод.\n */\n bottomId?: string;\n status?: 'default' | 'error' | 'valid';\n /**\n * Дает возможность удалить `FormItem`. Рекомендуется использовать только для `Input` или `Select`.\n *\n * Режим `indent` предназначен для визуального отступа\n */\n removable?: boolean | 'indent';\n /**\n * Удаляет внешние отступы вокруг компонента\n * @since 5.8.0\n */\n noPadding?: boolean;\n /**\n * Помечает поле обязательным\n */\n required?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FormItem\n */\nexport const FormItem: React.FC<FormItemProps> & {\n Top: typeof FormItemTop;\n TopLabel: typeof FormItemTopLabel;\n TopAside: typeof FormItemTopAside;\n} = ({\n children,\n top,\n topId,\n topMultiline = false,\n topComponent: topComponentProp,\n bottom,\n status = 'default',\n removable,\n onRemove,\n removePlaceholder = 'Удалить',\n getRootRef,\n htmlFor,\n bottomId,\n noPadding,\n required = false,\n ...restProps\n}: FormItemProps) => {\n const rootEl = useExternRef(getRootRef);\n const { sizeY = 'none' } = useAdaptivity();\n\n const wrappedChildren = (\n <React.Fragment>\n {isPrimitiveReactNode(top) ? (\n <FormItemTop>\n <FormItemTopLabel htmlFor={htmlFor} Component={topComponentProp} id={topId}>\n {top}\n </FormItemTopLabel>\n </FormItemTop>\n ) : hasReactNode(top) ? (\n top\n ) : null}\n {children}\n {hasReactNode(bottom) && (\n <Footnote\n className={styles.bottom}\n id={bottomId}\n role={status === 'error' ? 'alert' : undefined}\n >\n {bottom}\n </Footnote>\n )}\n </React.Fragment>\n );\n\n const context = React.useMemo(() => ({ required, topMultiline }), [required, topMultiline]);\n\n return (\n <RootComponent\n {...restProps}\n getRootRef={rootEl}\n baseClassName={classNames(\n styles.host,\n !noPadding && styles.withPadding,\n 'vkuiInternalFormItem',\n status !== 'default' && stylesStatus[status],\n sizeY !== 'regular' && sizeYClassNames[sizeY],\n hasReactNode(top) && classNames(styles.withTop, 'vkuiInternalFormItem--withTop'),\n removable && classNames(styles.withRemovable, 'vkuiInternalFormItem--removable'),\n )}\n >\n <FormItemContext.Provider value={context}>\n {removable ? (\n <Removable\n align=\"start\"\n onRemove={(e) => {\n if (rootEl?.current) {\n onRemove?.(e, rootEl.current);\n }\n }}\n removePlaceholder={removePlaceholder}\n indent={removable === 'indent'}\n noPadding={noPadding}\n >\n <div className={classNames(styles.removable, 'vkuiInternalFormItem__removable')}>\n {wrappedChildren}\n </div>\n </Removable>\n ) : (\n wrappedChildren\n )}\n </FormItemContext.Provider>\n </RootComponent>\n );\n};\n\nFormItem.displayName = 'FormItem';\n\nFormItem.Top = FormItemTop;\nFormItem.Top.displayName = 'FormItem.Top';\n\nFormItem.TopLabel = FormItemTopLabel;\nFormItem.TopLabel.displayName = 'FormItem.TopLabel';\n\nFormItem.TopAside = FormItemTopAside;\nFormItem.TopAside.displayName = 'FormItem.TopAside';\n"],"names":["React","classNames","hasReactNode","isPrimitiveReactNode","useAdaptivity","useExternRef","Removable","RootComponent","Footnote","FormItemTop","FormItemTopAside","FormItemTopLabel","FormItemContext","sizeYClassNames","none","compact","stylesStatus","error","valid","FormItem","children","top","topId","topMultiline","topComponent","topComponentProp","bottom","status","removable","onRemove","removePlaceholder","getRootRef","htmlFor","bottomId","noPadding","required","restProps","rootEl","sizeY","wrappedChildren","Fragment","Component","id","className","role","undefined","context","useMemo","baseClassName","Provider","value","align","e","current","indent","div","displayName","Top","TopLabel","TopAside"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,EAAEC,oBAAoB,QAAQ,kBAAkB;AACjF,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,YAAY,QAAQ,8BAA2B;AAExD,SAASC,SAAS,QAA6B,4BAAyB;AACxE,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,WAAW,QAAQ,+BAA4B;AACxD,SAASC,gBAAgB,QAAQ,oCAAiC;AAClE,SAASC,gBAAgB,QAAQ,oCAAiC;AAClE,SAASC,eAAe,QAAQ,eAAY;AAG5C,MAAMC,kBAAkB;IACtBC,MAAMb,sCAA6B;IACnCc,SAASd,yCAAgC;AAC3C;AAEA,MAAMe,eAAe;IACnBC,OAAOhB,wCAA+B;IACtCiB,OAAOjB,wCAA+B;AACxC;AA4CA;;CAEC,GACD,OAAO,MAAMkB,WAIT;QAAC,EACHC,QAAQ,EACRC,GAAG,EACHC,KAAK,EACLC,eAAe,KAAK,EACpBC,cAAcC,gBAAgB,EAC9BC,MAAM,EACNC,SAAS,SAAS,EAClBC,SAAS,EACTC,QAAQ,EACRC,oBAAoB,SAAS,EAC7BC,UAAU,EACVC,OAAO,EACPC,QAAQ,EACRC,SAAS,EACTC,WAAW,KAAK,EAEF,WADXC;QAfHhB;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,SAAShC,aAAa0B;IAC5B,MAAM,EAAEO,QAAQ,MAAM,EAAE,GAAGlC;IAE3B,MAAMmC,gCACJ,MAACvC,MAAMwC,QAAQ;;YACZrC,qBAAqBkB,qBACpB,KAACZ;0BACC,cAAA,KAACE;oBAAiBqB,SAASA;oBAASS,WAAWhB;oBAAkBiB,IAAIpB;8BAClED;;iBAGHnB,aAAamB,OACfA,MACE;YACHD;YACAlB,aAAawB,yBACZ,KAAClB;gBACCmC,SAAS;gBACTD,IAAIT;gBACJW,MAAMjB,WAAW,UAAU,UAAUkB;0BAEpCnB;;;;IAMT,MAAMoB,UAAU9C,MAAM+C,OAAO,CAAC,IAAO,CAAA;YAAEZ;YAAUZ;QAAa,CAAA,GAAI;QAACY;QAAUZ;KAAa;IAE1F,qBACE,KAAChB,uDACK6B;QACJL,YAAYM;QACZW,eAAe/C,iCAEb,CAACiC,0CACD,wBACAP,WAAW,aAAaX,YAAY,CAACW,OAAO,EAC5CW,UAAU,aAAazB,eAAe,CAACyB,MAAM,EAC7CpC,aAAamB,QAAQpB,oCAA2B,kCAChD2B,aAAa3B,0CAAiC;kBAGhD,cAAA,KAACW,gBAAgBqC,QAAQ;YAACC,OAAOJ;sBAC9BlB,0BACC,KAACtB;gBACC6C,OAAM;gBACNtB,UAAU,CAACuB;oBACT,IAAIf,mBAAAA,6BAAAA,OAAQgB,OAAO,EAAE;wBACnBxB,qBAAAA,+BAAAA,SAAWuB,GAAGf,OAAOgB,OAAO;oBAC9B;gBACF;gBACAvB,mBAAmBA;gBACnBwB,QAAQ1B,cAAc;gBACtBM,WAAWA;0BAEX,cAAA,KAACqB;oBAAIZ,WAAW1C,sCAA6B;8BAC1CsC;;iBAILA;;;AAKV,EAAE;AAEFpB,SAASqC,WAAW,GAAG;AAEvBrC,SAASsC,GAAG,GAAGhD;AACfU,SAASsC,GAAG,CAACD,WAAW,GAAG;AAE3BrC,SAASuC,QAAQ,GAAG/C;AACpBQ,SAASuC,QAAQ,CAACF,WAAW,GAAG;AAEhCrC,SAASwC,QAAQ,GAAGjD;AACpBS,SAASwC,QAAQ,CAACH,WAAW,GAAG"}
@@ -35,5 +35,5 @@ export interface HorizontalScrollProps extends HTMLAttributesWithRootRef<HTMLDiv
35
35
  /**
36
36
  * @see https://vkcom.github.io/VKUI/#/HorizontalScroll
37
37
  */
38
- export declare const HorizontalScroll: ({ children, getScrollToLeft, getScrollToRight, showArrows, arrowSize, arrowOffsetY, scrollAnimationDuration, getRef, scrollOnAnyWheel, prevButtonTestId, nextButtonTestId, getRootRef, ...restProps }: HorizontalScrollProps) => React.ReactNode;
38
+ export declare const HorizontalScroll: ({ children, getScrollToLeft, getScrollToRight, showArrows, arrowSize, arrowOffsetY, scrollAnimationDuration, getRef, scrollOnAnyWheel, prevButtonTestId, nextButtonTestId, ...restProps }: HorizontalScrollProps) => React.ReactNode;
39
39
  //# sourceMappingURL=HorizontalScroll.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"HorizontalScroll.d.ts","sourceRoot":"","sources":["../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,KAAK,EAAE,MAAM,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAErE,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAmBhF,MAAM,MAAM,qBAAqB,GAAG,CAAC,eAAe,EAAE,MAAM,KAAK,MAAM,CAAC;AAExE,MAAM,WAAW,qBACf,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAC/C,MAAM,CAAC,cAAc,CAAC;IACxB;;OAEG;IACH,eAAe,CAAC,EAAE,qBAAqB,CAAC;IACxC;;OAEG;IACH,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;IACzC,SAAS,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACrC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,UAAU,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAChC,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAsGD;;GAEG;AACH,eAAO,MAAM,gBAAgB,0MAc1B,qBAAqB,KAAG,KAAK,CAAC,SAmIhC,CAAC"}
1
+ {"version":3,"file":"HorizontalScroll.d.ts","sourceRoot":"","sources":["../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,KAAK,EAAE,MAAM,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAErE,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAmBhF,MAAM,MAAM,qBAAqB,GAAG,CAAC,eAAe,EAAE,MAAM,KAAK,MAAM,CAAC;AAExE,MAAM,WAAW,qBACf,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAC/C,MAAM,CAAC,cAAc,CAAC;IACxB;;OAEG;IACH,eAAe,CAAC,EAAE,qBAAqB,CAAC;IACxC;;OAEG;IACH,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;IACzC,SAAS,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACrC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,UAAU,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAChC,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAsGD;;GAEG;AACH,eAAO,MAAM,gBAAgB,8LAa1B,qBAAqB,KAAG,KAAK,CAAC,SA0IhC,CAAC"}
@@ -81,7 +81,7 @@ function doScroll({ scrollElement, getScrollPosition, animationQueue, onScrollTo
81
81
  /**
82
82
  * @see https://vkcom.github.io/VKUI/#/HorizontalScroll
83
83
  */ export const HorizontalScroll = (_param)=>{
84
- var { children, getScrollToLeft, getScrollToRight, showArrows = true, arrowSize = 'm', arrowOffsetY, scrollAnimationDuration = SCROLL_ONE_FRAME_TIME, getRef, scrollOnAnyWheel = false, prevButtonTestId, nextButtonTestId, getRootRef } = _param, restProps = _object_without_properties(_param, [
84
+ var { children, getScrollToLeft, getScrollToRight, showArrows = true, arrowSize = 'm', arrowOffsetY, scrollAnimationDuration = SCROLL_ONE_FRAME_TIME, getRef, scrollOnAnyWheel = false, prevButtonTestId, nextButtonTestId } = _param, restProps = _object_without_properties(_param, [
85
85
  "children",
86
86
  "getScrollToLeft",
87
87
  "getScrollToRight",
@@ -92,8 +92,7 @@ function doScroll({ scrollElement, getScrollPosition, animationQueue, onScrollTo
92
92
  "getRef",
93
93
  "scrollOnAnyWheel",
94
94
  "prevButtonTestId",
95
- "nextButtonTestId",
96
- "getRootRef"
95
+ "nextButtonTestId"
97
96
  ]);
98
97
  const [canScrollLeft, setCanScrollLeft] = React.useState(false);
99
98
  const [canScrollRight, setCanScrollRight] = React.useState(false);
@@ -103,7 +102,6 @@ function doScroll({ scrollElement, getScrollPosition, animationQueue, onScrollTo
103
102
  const setCanScrollEnd = direction === 'ltr' ? setCanScrollRight : setCanScrollLeft;
104
103
  const isCustomScrollingRef = React.useRef(false);
105
104
  const scrollerRef = useExternRef(getRef, directionRef);
106
- const rootRef = useExternRef(getRootRef);
107
105
  const animationQueue = React.useRef([]);
108
106
  const hasPointer = useAdaptivityHasPointer();
109
107
  const scrollTo = React.useCallback((getScrollPosition)=>{
@@ -165,38 +163,40 @@ function doScroll({ scrollElement, getScrollPosition, animationQueue, onScrollTo
165
163
  children
166
164
  ]);
167
165
  useIsomorphicLayoutEffect(function addWheelEventHandler() {
168
- var _rootRef_current;
169
- if (!rootRef.current) {
166
+ const scrollEl = scrollerRef.current;
167
+ if (!scrollEl) {
170
168
  return noop;
171
169
  }
172
170
  /**
173
171
  * Прокрутка с помощью любого колеса мыши
174
172
  */ const onWheel = (e)=>{
175
- const left = e.deltaX + (scrollOnAnyWheel ? e.deltaY : 0);
176
173
  scrollerRef.current.scrollBy({
177
- left,
174
+ left: e.deltaX + e.deltaY,
178
175
  behavior: 'auto'
179
176
  });
180
- if (e.deltaY && scrollOnAnyWheel) {
181
- e.preventDefault();
182
- }
177
+ e.preventDefault();
183
178
  };
184
179
  const listenerOptions = {
185
180
  passive: false
186
181
  };
187
- (_rootRef_current = rootRef.current) === null || _rootRef_current === void 0 ? void 0 : _rootRef_current.addEventListener('wheel', onWheel, listenerOptions);
188
- // @ts-expect-error: TS2769 В интерфейсе EventListenerOptions для wheel нет passive свойства
182
+ if (scrollOnAnyWheel) {
183
+ scrollEl.addEventListener('wheel', onWheel, listenerOptions);
184
+ }
185
+ scrollEl.addEventListener('scroll', calculateArrowsVisibility, listenerOptions);
189
186
  return ()=>{
190
- var _rootRef_current;
191
- return (_rootRef_current = rootRef.current) === null || _rootRef_current === void 0 ? void 0 : _rootRef_current.removeEventListener('wheel', onWheel, listenerOptions);
187
+ if (scrollOnAnyWheel) {
188
+ // @ts-expect-error: TS2769 В интерфейсе EventListenerOptions для wheel нет passive свойства
189
+ scrollEl.removeEventListener('wheel', onWheel, listenerOptions);
190
+ }
191
+ // @ts-expect-error: TS2769 В интерфейсе EventListenerOptions для scroll нет passive свойства
192
+ scrollEl.removeEventListener('scroll', calculateArrowsVisibility, listenerOptions);
192
193
  };
193
194
  }, [
194
- rootRef,
195
195
  scrollOnAnyWheel,
196
+ calculateArrowsVisibility,
196
197
  scrollerRef
197
198
  ]);
198
199
  return /*#__PURE__*/ _jsxs(RootComponent, _object_spread_props(_object_spread({}, restProps), {
199
- getRootRef: rootRef,
200
200
  baseClassName: classNames("vkuiHorizontalScroll__host", 'vkuiInternalHorizontalScroll', showArrows === 'always' && "vkuiHorizontalScroll__withConstArrows"),
201
201
  onMouseEnter: calculateArrowsVisibility,
202
202
  children: [
@@ -223,7 +223,6 @@ function doScroll({ scrollElement, getScrollPosition, animationQueue, onScrollTo
223
223
  /*#__PURE__*/ _jsx("div", {
224
224
  className: "vkuiHorizontalScroll__in",
225
225
  ref: scrollerRef,
226
- onScroll: calculateArrowsVisibility,
227
226
  children: /*#__PURE__*/ _jsx("div", {
228
227
  className: "vkuiHorizontalScroll__inWrapper",
229
228
  children: children
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useDirection } from '../../hooks/useDirection';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { easeInOutSine } from '../../lib/fx';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport type { HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ScrollArrow, type ScrollArrowProps } from '../ScrollArrow/ScrollArrow';\nimport styles from './HorizontalScroll.module.css';\n\ninterface ScrollContext {\n scrollElement: HTMLElement | null;\n scrollAnimationDuration: number;\n animationQueue: VoidFunction[];\n getScrollPosition: (currentPosition: number) => number;\n onScrollToEndBorder: VoidFunction;\n onScrollEnd: VoidFunction;\n onScrollStart: VoidFunction;\n /**\n * Начальная ширина прокрутки.\n * В некоторых случаях может отличаться от текущей ширины прокрутки из-за transforms: translate\n */\n initialScrollWidth: number;\n textDirection: 'ltr' | 'rtl';\n}\n\nexport type ScrollPositionHandler = (currentPosition: number) => number;\n\nexport interface HorizontalScrollProps\n extends HTMLAttributesWithRootRef<HTMLDivElement>,\n HasRef<HTMLDivElement> {\n /**\n * Функция для расчета величины прокрутки при клике на левую стрелку.\n */\n getScrollToLeft?: ScrollPositionHandler;\n /**\n * Функция для расчета величины прокрутки при клике на правую стрелку.\n */\n getScrollToRight?: ScrollPositionHandler;\n arrowSize?: ScrollArrowProps['size'];\n /**\n * Смещает иконки кнопок навигации по вертикали.\n */\n arrowOffsetY?: number | string;\n showArrows?: boolean | 'always';\n scrollAnimationDuration?: number;\n /**\n * Добавляет возможность прокручивать контент на любое колесо мыши.\n * По умолчанию прокручивается как любой горизонтальный контент через shift.\n */\n scrollOnAnyWheel?: boolean;\n /**\n * Передает атрибут `data-testid` для кнопки прокрутки горизонтального скролла в направлении предыдущего элемента\n */\n prevButtonTestId?: string;\n /**\n * Передает атрибут `data-testid` для кнопки прокрутки горизонтального скролла в направлении следующего элемента\n */\n nextButtonTestId?: string;\n}\n\n/**\n * timing method\n */\nfunction now() {\n return performance && performance.now ? performance.now() : Date.now();\n}\n\n/**\n * Округление к большему по модулю\n *\n * ## Пример\n *\n * ```ts\n * import { strict as assert } from 'node:assert';\n *\n * assert.equal(roundingAwayFromZero(5.1), 6)\n * assert.equal(roundingAwayFromZero(-5.1), -6)\n * ```\n */\nfunction roundingAwayFromZero(value: number): number {\n return value > 0 ? Math.ceil(value) : Math.floor(value);\n}\n\n/**\n * Округляем el.scrollLeft\n * https://github.com/VKCOM/VKUI/pull/2445\n */\nconst roundUpElementScrollLeft = (el: HTMLElement) => roundingAwayFromZero(el.scrollLeft);\n\n/**\n * Код анимации скрола, на основе полифила: https://github.com/iamdustan/smoothscroll\n * Константа взята из полифила (468), на дизайн-ревью уточнили до 250\n * @var {number} SCROLL_ONE_FRAME_TIME время анимации скролла\n */\nconst SCROLL_ONE_FRAME_TIME = 250;\n\nfunction doScroll({\n scrollElement,\n getScrollPosition,\n animationQueue,\n onScrollToEndBorder,\n onScrollEnd,\n onScrollStart,\n initialScrollWidth,\n scrollAnimationDuration,\n textDirection,\n}: ScrollContext) {\n if (!scrollElement || !getScrollPosition) {\n return;\n }\n\n /**\n * крайнее значение сдвига\n */\n const extremeScrollLeft =\n (textDirection === 'ltr' ? 1 : -1) * (initialScrollWidth - scrollElement.offsetWidth);\n\n let startScrollLeft = roundUpElementScrollLeft(scrollElement);\n let endScrollLeft = getScrollPosition(startScrollLeft);\n\n onScrollStart();\n\n /**\n * Если окончание прокрутки вышло за ноль\n */\n if (startScrollLeft * endScrollLeft < 0) {\n endScrollLeft = 0;\n }\n\n if (Math.abs(endScrollLeft) >= Math.abs(extremeScrollLeft)) {\n onScrollToEndBorder();\n endScrollLeft = extremeScrollLeft;\n }\n\n const startTime = now();\n\n (function scroll() {\n const time = now();\n const elapsed = Math.min((time - startTime) / scrollAnimationDuration, 1);\n\n const value = easeInOutSine(elapsed);\n\n const currentScrollLeft = startScrollLeft + (endScrollLeft - startScrollLeft) * value;\n scrollElement.scrollLeft = roundingAwayFromZero(currentScrollLeft);\n\n const scrollEnd =\n textDirection === 'ltr' ? Math.max(0, endScrollLeft) : Math.min(0, endScrollLeft);\n if (roundUpElementScrollLeft(scrollElement) !== scrollEnd && elapsed !== 1) {\n requestAnimationFrame(scroll);\n return;\n }\n\n onScrollEnd();\n animationQueue.shift();\n if (animationQueue.length > 0) {\n animationQueue[0]();\n }\n })();\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalScroll\n */\nexport const HorizontalScroll = ({\n children,\n getScrollToLeft,\n getScrollToRight,\n showArrows = true,\n arrowSize = 'm',\n arrowOffsetY,\n scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n getRef,\n scrollOnAnyWheel = false,\n prevButtonTestId,\n nextButtonTestId,\n getRootRef,\n ...restProps\n}: HorizontalScrollProps): React.ReactNode => {\n const [canScrollLeft, setCanScrollLeft] = React.useState(false);\n const [canScrollRight, setCanScrollRight] = React.useState(false);\n const [directionRef, textDirection] = useDirection<HTMLDivElement>();\n const direction = textDirection || 'ltr';\n const setCanScrollStart = direction === 'ltr' ? setCanScrollLeft : setCanScrollRight;\n const setCanScrollEnd = direction === 'ltr' ? setCanScrollRight : setCanScrollLeft;\n\n const isCustomScrollingRef = React.useRef(false);\n\n const scrollerRef = useExternRef(getRef, directionRef);\n\n const rootRef = useExternRef(getRootRef);\n\n const animationQueue = React.useRef<VoidFunction[]>([]);\n\n const hasPointer = useAdaptivityHasPointer();\n\n const scrollTo = React.useCallback(\n (getScrollPosition: ScrollPositionHandler) => {\n const scrollElement = scrollerRef.current;\n\n animationQueue.current.push(() =>\n doScroll({\n scrollElement,\n getScrollPosition,\n animationQueue: animationQueue.current,\n onScrollToEndBorder: () => setCanScrollEnd(false),\n onScrollEnd: () => (isCustomScrollingRef.current = false),\n onScrollStart: () => (isCustomScrollingRef.current = true),\n initialScrollWidth: scrollElement?.firstElementChild?.scrollWidth || 0,\n scrollAnimationDuration,\n textDirection: direction,\n }),\n );\n if (animationQueue.current.length === 1) {\n animationQueue.current[0]();\n }\n },\n [scrollerRef, scrollAnimationDuration, direction, setCanScrollEnd],\n );\n\n const scrollToLeft = React.useCallback(() => {\n const getScrollPosition =\n getScrollToLeft ?? ((i: number) => i - scrollerRef.current!.offsetWidth);\n scrollTo(getScrollPosition);\n }, [getScrollToLeft, scrollTo, scrollerRef]);\n\n const scrollToRight = React.useCallback(() => {\n const getScrollPosition =\n getScrollToRight ?? ((i: number) => i + scrollerRef.current!.offsetWidth);\n scrollTo(getScrollPosition);\n }, [getScrollToRight, scrollTo, scrollerRef]);\n\n const calculateArrowsVisibility = React.useCallback(() => {\n if (showArrows && hasPointer && scrollerRef.current && !isCustomScrollingRef.current) {\n const scrollElement = scrollerRef.current;\n\n setCanScrollStart(scrollElement.scrollLeft !== 0);\n setCanScrollEnd(\n Math.abs(roundUpElementScrollLeft(scrollElement)) + scrollElement.offsetWidth <\n scrollElement.scrollWidth,\n );\n }\n }, [showArrows, hasPointer, scrollerRef, setCanScrollStart, setCanScrollEnd]);\n\n React.useEffect(calculateArrowsVisibility, [calculateArrowsVisibility, children]);\n\n useIsomorphicLayoutEffect(\n function addWheelEventHandler() {\n if (!rootRef.current) {\n return noop;\n }\n /**\n * Прокрутка с помощью любого колеса мыши\n */\n const onWheel = (e: WheelEvent) => {\n const left = e.deltaX + (scrollOnAnyWheel ? e.deltaY : 0);\n scrollerRef.current!.scrollBy({ left, behavior: 'auto' });\n if (e.deltaY && scrollOnAnyWheel) {\n e.preventDefault();\n }\n };\n const listenerOptions = { passive: false };\n rootRef.current?.addEventListener('wheel', onWheel, listenerOptions);\n // @ts-expect-error: TS2769 В интерфейсе EventListenerOptions для wheel нет passive свойства\n return () => rootRef.current?.removeEventListener('wheel', onWheel, listenerOptions);\n },\n [rootRef, scrollOnAnyWheel, scrollerRef],\n );\n\n return (\n <RootComponent\n {...restProps}\n getRootRef={rootRef}\n baseClassName={classNames(\n styles.host,\n 'vkuiInternalHorizontalScroll',\n showArrows === 'always' && styles.withConstArrows,\n )}\n onMouseEnter={calculateArrowsVisibility}\n >\n {showArrows && (hasPointer || hasPointer === undefined) && canScrollLeft && (\n <ScrollArrow\n data-testid={prevButtonTestId}\n size={arrowSize}\n offsetY={arrowOffsetY}\n direction=\"left\"\n aria-hidden\n tabIndex={-1}\n className={classNames(styles.arrow, styles.arrowLeft)}\n onClick={scrollToLeft}\n />\n )}\n {showArrows && (hasPointer || hasPointer === undefined) && canScrollRight && (\n <ScrollArrow\n data-testid={nextButtonTestId}\n size={arrowSize}\n offsetY={arrowOffsetY}\n direction=\"right\"\n aria-hidden\n tabIndex={-1}\n className={classNames(styles.arrow, styles.arrowRight)}\n onClick={scrollToRight}\n />\n )}\n <div className={styles.in} ref={scrollerRef} onScroll={calculateArrowsVisibility}>\n <div className={styles.inWrapper}>{children}</div>\n </div>\n </RootComponent>\n );\n};\n"],"names":["React","classNames","noop","useAdaptivityHasPointer","useDirection","useExternRef","easeInOutSine","useIsomorphicLayoutEffect","RootComponent","ScrollArrow","now","performance","Date","roundingAwayFromZero","value","Math","ceil","floor","roundUpElementScrollLeft","el","scrollLeft","SCROLL_ONE_FRAME_TIME","doScroll","scrollElement","getScrollPosition","animationQueue","onScrollToEndBorder","onScrollEnd","onScrollStart","initialScrollWidth","scrollAnimationDuration","textDirection","extremeScrollLeft","offsetWidth","startScrollLeft","endScrollLeft","abs","startTime","scroll","time","elapsed","min","currentScrollLeft","scrollEnd","max","requestAnimationFrame","shift","length","HorizontalScroll","children","getScrollToLeft","getScrollToRight","showArrows","arrowSize","arrowOffsetY","getRef","scrollOnAnyWheel","prevButtonTestId","nextButtonTestId","getRootRef","restProps","canScrollLeft","setCanScrollLeft","useState","canScrollRight","setCanScrollRight","directionRef","direction","setCanScrollStart","setCanScrollEnd","isCustomScrollingRef","useRef","scrollerRef","rootRef","hasPointer","scrollTo","useCallback","current","push","firstElementChild","scrollWidth","scrollToLeft","i","scrollToRight","calculateArrowsVisibility","useEffect","addWheelEventHandler","onWheel","e","left","deltaX","deltaY","scrollBy","behavior","preventDefault","listenerOptions","passive","addEventListener","removeEventListener","baseClassName","onMouseEnter","undefined","data-testid","size","offsetY","aria-hidden","tabIndex","className","onClick","div","ref","onScroll"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useDirection } from '../../hooks/useDirection';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { easeInOutSine } from '../../lib/fx';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport type { HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ScrollArrow, type ScrollArrowProps } from '../ScrollArrow/ScrollArrow';\nimport styles from './HorizontalScroll.module.css';\n\ninterface ScrollContext {\n scrollElement: HTMLElement | null;\n scrollAnimationDuration: number;\n animationQueue: VoidFunction[];\n getScrollPosition: (currentPosition: number) => number;\n onScrollToEndBorder: VoidFunction;\n onScrollEnd: VoidFunction;\n onScrollStart: VoidFunction;\n /**\n * Начальная ширина прокрутки.\n * В некоторых случаях может отличаться от текущей ширины прокрутки из-за transforms: translate\n */\n initialScrollWidth: number;\n textDirection: 'ltr' | 'rtl';\n}\n\nexport type ScrollPositionHandler = (currentPosition: number) => number;\n\nexport interface HorizontalScrollProps\n extends HTMLAttributesWithRootRef<HTMLDivElement>,\n HasRef<HTMLDivElement> {\n /**\n * Функция для расчета величины прокрутки при клике на левую стрелку.\n */\n getScrollToLeft?: ScrollPositionHandler;\n /**\n * Функция для расчета величины прокрутки при клике на правую стрелку.\n */\n getScrollToRight?: ScrollPositionHandler;\n arrowSize?: ScrollArrowProps['size'];\n /**\n * Смещает иконки кнопок навигации по вертикали.\n */\n arrowOffsetY?: number | string;\n showArrows?: boolean | 'always';\n scrollAnimationDuration?: number;\n /**\n * Добавляет возможность прокручивать контент на любое колесо мыши.\n * По умолчанию прокручивается как любой горизонтальный контент через shift.\n */\n scrollOnAnyWheel?: boolean;\n /**\n * Передает атрибут `data-testid` для кнопки прокрутки горизонтального скролла в направлении предыдущего элемента\n */\n prevButtonTestId?: string;\n /**\n * Передает атрибут `data-testid` для кнопки прокрутки горизонтального скролла в направлении следующего элемента\n */\n nextButtonTestId?: string;\n}\n\n/**\n * timing method\n */\nfunction now() {\n return performance && performance.now ? performance.now() : Date.now();\n}\n\n/**\n * Округление к большему по модулю\n *\n * ## Пример\n *\n * ```ts\n * import { strict as assert } from 'node:assert';\n *\n * assert.equal(roundingAwayFromZero(5.1), 6)\n * assert.equal(roundingAwayFromZero(-5.1), -6)\n * ```\n */\nfunction roundingAwayFromZero(value: number): number {\n return value > 0 ? Math.ceil(value) : Math.floor(value);\n}\n\n/**\n * Округляем el.scrollLeft\n * https://github.com/VKCOM/VKUI/pull/2445\n */\nconst roundUpElementScrollLeft = (el: HTMLElement) => roundingAwayFromZero(el.scrollLeft);\n\n/**\n * Код анимации скрола, на основе полифила: https://github.com/iamdustan/smoothscroll\n * Константа взята из полифила (468), на дизайн-ревью уточнили до 250\n * @var {number} SCROLL_ONE_FRAME_TIME время анимации скролла\n */\nconst SCROLL_ONE_FRAME_TIME = 250;\n\nfunction doScroll({\n scrollElement,\n getScrollPosition,\n animationQueue,\n onScrollToEndBorder,\n onScrollEnd,\n onScrollStart,\n initialScrollWidth,\n scrollAnimationDuration,\n textDirection,\n}: ScrollContext) {\n if (!scrollElement || !getScrollPosition) {\n return;\n }\n\n /**\n * крайнее значение сдвига\n */\n const extremeScrollLeft =\n (textDirection === 'ltr' ? 1 : -1) * (initialScrollWidth - scrollElement.offsetWidth);\n\n let startScrollLeft = roundUpElementScrollLeft(scrollElement);\n let endScrollLeft = getScrollPosition(startScrollLeft);\n\n onScrollStart();\n\n /**\n * Если окончание прокрутки вышло за ноль\n */\n if (startScrollLeft * endScrollLeft < 0) {\n endScrollLeft = 0;\n }\n\n if (Math.abs(endScrollLeft) >= Math.abs(extremeScrollLeft)) {\n onScrollToEndBorder();\n endScrollLeft = extremeScrollLeft;\n }\n\n const startTime = now();\n\n (function scroll() {\n const time = now();\n const elapsed = Math.min((time - startTime) / scrollAnimationDuration, 1);\n\n const value = easeInOutSine(elapsed);\n\n const currentScrollLeft = startScrollLeft + (endScrollLeft - startScrollLeft) * value;\n scrollElement.scrollLeft = roundingAwayFromZero(currentScrollLeft);\n\n const scrollEnd =\n textDirection === 'ltr' ? Math.max(0, endScrollLeft) : Math.min(0, endScrollLeft);\n if (roundUpElementScrollLeft(scrollElement) !== scrollEnd && elapsed !== 1) {\n requestAnimationFrame(scroll);\n return;\n }\n\n onScrollEnd();\n animationQueue.shift();\n if (animationQueue.length > 0) {\n animationQueue[0]();\n }\n })();\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalScroll\n */\nexport const HorizontalScroll = ({\n children,\n getScrollToLeft,\n getScrollToRight,\n showArrows = true,\n arrowSize = 'm',\n arrowOffsetY,\n scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n getRef,\n scrollOnAnyWheel = false,\n prevButtonTestId,\n nextButtonTestId,\n ...restProps\n}: HorizontalScrollProps): React.ReactNode => {\n const [canScrollLeft, setCanScrollLeft] = React.useState(false);\n const [canScrollRight, setCanScrollRight] = React.useState(false);\n const [directionRef, textDirection] = useDirection<HTMLDivElement>();\n const direction = textDirection || 'ltr';\n const setCanScrollStart = direction === 'ltr' ? setCanScrollLeft : setCanScrollRight;\n const setCanScrollEnd = direction === 'ltr' ? setCanScrollRight : setCanScrollLeft;\n\n const isCustomScrollingRef = React.useRef(false);\n\n const scrollerRef = useExternRef(getRef, directionRef);\n\n const animationQueue = React.useRef<VoidFunction[]>([]);\n\n const hasPointer = useAdaptivityHasPointer();\n\n const scrollTo = React.useCallback(\n (getScrollPosition: ScrollPositionHandler) => {\n const scrollElement = scrollerRef.current;\n\n animationQueue.current.push(() =>\n doScroll({\n scrollElement,\n getScrollPosition,\n animationQueue: animationQueue.current,\n onScrollToEndBorder: () => setCanScrollEnd(false),\n onScrollEnd: () => (isCustomScrollingRef.current = false),\n onScrollStart: () => (isCustomScrollingRef.current = true),\n initialScrollWidth: scrollElement?.firstElementChild?.scrollWidth || 0,\n scrollAnimationDuration,\n textDirection: direction,\n }),\n );\n if (animationQueue.current.length === 1) {\n animationQueue.current[0]();\n }\n },\n [scrollerRef, scrollAnimationDuration, direction, setCanScrollEnd],\n );\n\n const scrollToLeft = React.useCallback(() => {\n const getScrollPosition =\n getScrollToLeft ?? ((i: number) => i - scrollerRef.current!.offsetWidth);\n scrollTo(getScrollPosition);\n }, [getScrollToLeft, scrollTo, scrollerRef]);\n\n const scrollToRight = React.useCallback(() => {\n const getScrollPosition =\n getScrollToRight ?? ((i: number) => i + scrollerRef.current!.offsetWidth);\n scrollTo(getScrollPosition);\n }, [getScrollToRight, scrollTo, scrollerRef]);\n\n const calculateArrowsVisibility = React.useCallback(() => {\n if (showArrows && hasPointer && scrollerRef.current && !isCustomScrollingRef.current) {\n const scrollElement = scrollerRef.current;\n\n setCanScrollStart(scrollElement.scrollLeft !== 0);\n setCanScrollEnd(\n Math.abs(roundUpElementScrollLeft(scrollElement)) + scrollElement.offsetWidth <\n scrollElement.scrollWidth,\n );\n }\n }, [showArrows, hasPointer, scrollerRef, setCanScrollStart, setCanScrollEnd]);\n\n React.useEffect(calculateArrowsVisibility, [calculateArrowsVisibility, children]);\n\n useIsomorphicLayoutEffect(\n function addWheelEventHandler() {\n const scrollEl = scrollerRef.current;\n if (!scrollEl) {\n return noop;\n }\n /**\n * Прокрутка с помощью любого колеса мыши\n */\n const onWheel = (e: WheelEvent) => {\n scrollerRef.current!.scrollBy({ left: e.deltaX + e.deltaY, behavior: 'auto' });\n e.preventDefault();\n };\n\n const listenerOptions = { passive: false };\n\n if (scrollOnAnyWheel) {\n scrollEl.addEventListener('wheel', onWheel, listenerOptions);\n }\n scrollEl.addEventListener('scroll', calculateArrowsVisibility, listenerOptions);\n\n return () => {\n if (scrollOnAnyWheel) {\n // @ts-expect-error: TS2769 В интерфейсе EventListenerOptions для wheel нет passive свойства\n scrollEl.removeEventListener('wheel', onWheel, listenerOptions);\n }\n // @ts-expect-error: TS2769 В интерфейсе EventListenerOptions для scroll нет passive свойства\n scrollEl.removeEventListener('scroll', calculateArrowsVisibility, listenerOptions);\n };\n },\n [scrollOnAnyWheel, calculateArrowsVisibility, scrollerRef],\n );\n\n return (\n <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles.host,\n 'vkuiInternalHorizontalScroll',\n showArrows === 'always' && styles.withConstArrows,\n )}\n onMouseEnter={calculateArrowsVisibility}\n >\n {showArrows && (hasPointer || hasPointer === undefined) && canScrollLeft && (\n <ScrollArrow\n data-testid={prevButtonTestId}\n size={arrowSize}\n offsetY={arrowOffsetY}\n direction=\"left\"\n aria-hidden\n tabIndex={-1}\n className={classNames(styles.arrow, styles.arrowLeft)}\n onClick={scrollToLeft}\n />\n )}\n {showArrows && (hasPointer || hasPointer === undefined) && canScrollRight && (\n <ScrollArrow\n data-testid={nextButtonTestId}\n size={arrowSize}\n offsetY={arrowOffsetY}\n direction=\"right\"\n aria-hidden\n tabIndex={-1}\n className={classNames(styles.arrow, styles.arrowRight)}\n onClick={scrollToRight}\n />\n )}\n <div className={styles.in} ref={scrollerRef}>\n <div className={styles.inWrapper}>{children}</div>\n </div>\n </RootComponent>\n );\n};\n"],"names":["React","classNames","noop","useAdaptivityHasPointer","useDirection","useExternRef","easeInOutSine","useIsomorphicLayoutEffect","RootComponent","ScrollArrow","now","performance","Date","roundingAwayFromZero","value","Math","ceil","floor","roundUpElementScrollLeft","el","scrollLeft","SCROLL_ONE_FRAME_TIME","doScroll","scrollElement","getScrollPosition","animationQueue","onScrollToEndBorder","onScrollEnd","onScrollStart","initialScrollWidth","scrollAnimationDuration","textDirection","extremeScrollLeft","offsetWidth","startScrollLeft","endScrollLeft","abs","startTime","scroll","time","elapsed","min","currentScrollLeft","scrollEnd","max","requestAnimationFrame","shift","length","HorizontalScroll","children","getScrollToLeft","getScrollToRight","showArrows","arrowSize","arrowOffsetY","getRef","scrollOnAnyWheel","prevButtonTestId","nextButtonTestId","restProps","canScrollLeft","setCanScrollLeft","useState","canScrollRight","setCanScrollRight","directionRef","direction","setCanScrollStart","setCanScrollEnd","isCustomScrollingRef","useRef","scrollerRef","hasPointer","scrollTo","useCallback","current","push","firstElementChild","scrollWidth","scrollToLeft","i","scrollToRight","calculateArrowsVisibility","useEffect","addWheelEventHandler","scrollEl","onWheel","e","scrollBy","left","deltaX","deltaY","behavior","preventDefault","listenerOptions","passive","addEventListener","removeEventListener","baseClassName","onMouseEnter","undefined","data-testid","size","offsetY","aria-hidden","tabIndex","className","onClick","div","ref"],"mappings":"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"}
@@ -9,5 +9,5 @@ export interface ModalCardInternalProps extends Omit<ModalCardProps, 'nav' | 'ke
9
9
  *
10
10
  * @private
11
11
  */
12
- export declare const ModalCardInternal: ({ icon, title, titleComponent, description, descriptionComponent, children, actions, size, open, style: styleProp, className, preventClose, ModalOverlay, modalOverlayTestId, modalDismissButtonTestId, getRootRef, dismissButtonMode, dismissLabel, noFocusToDialog, onOpen, onOpened, onClose, onClosed, ...restProps }: ModalCardInternalProps) => ReactNode;
12
+ export declare const ModalCardInternal: ({ icon, title, titleComponent, description, descriptionComponent, children, actions, size, open, style: styleProp, className, preventClose, ModalOverlay, modalOverlayTestId, modalDismissButtonTestId, getRootRef, dismissButtonMode, dismissLabel, noFocusToDialog, onOpen, onOpened, onClose, onClosed, disableFocusTrap, ...restProps }: ModalCardInternalProps) => ReactNode;
13
13
  //# sourceMappingURL=ModalCardInternal.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ModalCardInternal.d.ts","sourceRoot":"","sources":["../../../src/components/ModalCard/ModalCardInternal.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAsB,KAAK,SAAS,EAAe,MAAM,OAAO,CAAC;AAa5F,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,8BAA8B,CAAC;AACtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAoB9C,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,KAAK,GAAG,aAAa,CAAC;IACzF,YAAY,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;CACjD;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,8TAyB3B,sBAAsB,KAAG,SAsG3B,CAAC"}
1
+ {"version":3,"file":"ModalCardInternal.d.ts","sourceRoot":"","sources":["../../../src/components/ModalCard/ModalCardInternal.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAsB,KAAK,SAAS,EAAe,MAAM,OAAO,CAAC;AAa5F,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,8BAA8B,CAAC;AACtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAoB9C,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,KAAK,GAAG,aAAa,CAAC;IACzF,YAAY,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;CACjD;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,gVA0B3B,sBAAsB,KAAG,SAyG3B,CAAC"}
@@ -35,7 +35,7 @@ const transitionStateClassNames = {
35
35
  *
36
36
  * @private
37
37
  */ export const ModalCardInternal = (_param)=>{
38
- var { icon, title, titleComponent, description, descriptionComponent, children, actions, size, open, style: styleProp, className, preventClose, ModalOverlay = ModalOverlayDefault, modalOverlayTestId, modalDismissButtonTestId, getRootRef, dismissButtonMode, dismissLabel, noFocusToDialog, onOpen, onOpened, onClose = noop, onClosed } = _param, restProps = _object_without_properties(_param, [
38
+ var { icon, title, titleComponent, description, descriptionComponent, children, actions, size, open, style: styleProp, className, preventClose, ModalOverlay = ModalOverlayDefault, modalOverlayTestId, modalDismissButtonTestId, getRootRef, dismissButtonMode, dismissLabel, noFocusToDialog, onOpen, onOpened, onClose = noop, onClosed, disableFocusTrap } = _param, restProps = _object_without_properties(_param, [
39
39
  "icon",
40
40
  "title",
41
41
  "titleComponent",
@@ -58,7 +58,8 @@ const transitionStateClassNames = {
58
58
  "onOpen",
59
59
  "onOpened",
60
60
  "onClose",
61
- "onClosed"
61
+ "onClosed",
62
+ "disableFocusTrap"
62
63
  ]);
63
64
  const platform = usePlatform();
64
65
  const [transitionState, { ref, onTransitionEnd }] = useCSSTransition(open, {
@@ -111,7 +112,7 @@ const transitionStateClassNames = {
111
112
  useScrollLock(!hidden);
112
113
  useFocusTrap(ref, {
113
114
  autoFocus: !noFocusToDialog,
114
- disabled: !opened || hidden
115
+ disabled: !opened || hidden || disableFocusTrap
115
116
  });
116
117
  return /*#__PURE__*/ _jsxs(ModalOutlet, {
117
118
  hidden: hidden,