@alfalab/core-components-confirmation 15.0.3 → 15.0.4

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 (153) hide show
  1. package/component.responsive.d.ts +1 -1
  2. package/components/base-confirmation/component.js.map +1 -1
  3. package/components/base-confirmation/index.css +2 -2
  4. package/components/base-confirmation/index.module.css.js +1 -1
  5. package/components/base-confirmation/index.module.css.js.map +1 -1
  6. package/components/countdown-loader/component.d.ts +1 -1
  7. package/components/countdown-loader/index.css +1 -1
  8. package/components/countdown-loader/index.module.css.js +1 -1
  9. package/components/countdown-loader/index.module.css.js.map +1 -1
  10. package/components/header/component.d.ts +1 -1
  11. package/components/header/index.css +1 -1
  12. package/components/header/index.module.css.js +1 -1
  13. package/components/screens/fatal-error/component.d.ts +1 -1
  14. package/components/screens/fatal-error/index.css +6 -6
  15. package/components/screens/fatal-error/index.module.css.js +1 -1
  16. package/components/screens/hint/component.d.ts +1 -1
  17. package/components/screens/hint/index.css +12 -12
  18. package/components/screens/hint/index.module.css.js +1 -1
  19. package/components/screens/initial/component.d.ts +1 -1
  20. package/components/screens/initial/component.js.map +1 -1
  21. package/components/screens/initial/countdown-section.d.ts +1 -1
  22. package/components/screens/initial/countdown-section.js.map +1 -1
  23. package/components/screens/initial/index.css +19 -19
  24. package/components/screens/initial/index.module.css.js +1 -1
  25. package/components/screens/temp-block/component.d.ts +1 -1
  26. package/components/screens/temp-block/component.js.map +1 -1
  27. package/components/screens/temp-block/index.css +8 -8
  28. package/components/screens/temp-block/index.module.css.js +1 -1
  29. package/components/screens/temp-block-over/component.d.ts +1 -1
  30. package/components/screens/temp-block-over/index.css +5 -5
  31. package/components/screens/temp-block-over/index.module.css.js +1 -1
  32. package/context.d.ts +0 -1
  33. package/cssm/component.responsive.d.ts +1 -1
  34. package/cssm/components/base-confirmation/component.js.map +1 -1
  35. package/cssm/components/countdown-loader/component.d.ts +1 -1
  36. package/cssm/components/header/component.d.ts +1 -1
  37. package/cssm/components/screens/fatal-error/component.d.ts +1 -1
  38. package/cssm/components/screens/hint/component.d.ts +1 -1
  39. package/cssm/components/screens/initial/component.d.ts +1 -1
  40. package/cssm/components/screens/initial/component.js.map +1 -1
  41. package/cssm/components/screens/initial/countdown-section.d.ts +1 -1
  42. package/cssm/components/screens/initial/countdown-section.js.map +1 -1
  43. package/cssm/components/screens/temp-block/component.d.ts +1 -1
  44. package/cssm/components/screens/temp-block/component.js.map +1 -1
  45. package/cssm/components/screens/temp-block-over/component.d.ts +1 -1
  46. package/cssm/context.d.ts +0 -1
  47. package/cssm/desktop/component.desktop.d.ts +1 -1
  48. package/cssm/mobile/component.mobile.d.ts +1 -1
  49. package/cssm/types.d.ts +3 -3
  50. package/cssm/utils.d.ts +2 -3
  51. package/cssm/utils.js.map +1 -1
  52. package/desktop/component.desktop.d.ts +1 -1
  53. package/esm/component.responsive.d.ts +1 -1
  54. package/esm/components/base-confirmation/component.js.map +1 -1
  55. package/esm/components/base-confirmation/index.css +2 -2
  56. package/esm/components/base-confirmation/index.module.css.js +1 -1
  57. package/esm/components/base-confirmation/index.module.css.js.map +1 -1
  58. package/esm/components/countdown-loader/component.d.ts +1 -1
  59. package/esm/components/countdown-loader/index.css +1 -1
  60. package/esm/components/countdown-loader/index.module.css.js +1 -1
  61. package/esm/components/countdown-loader/index.module.css.js.map +1 -1
  62. package/esm/components/header/component.d.ts +1 -1
  63. package/esm/components/header/index.css +1 -1
  64. package/esm/components/header/index.module.css.js +1 -1
  65. package/esm/components/screens/fatal-error/component.d.ts +1 -1
  66. package/esm/components/screens/fatal-error/index.css +6 -6
  67. package/esm/components/screens/fatal-error/index.module.css.js +1 -1
  68. package/esm/components/screens/hint/component.d.ts +1 -1
  69. package/esm/components/screens/hint/index.css +12 -12
  70. package/esm/components/screens/hint/index.module.css.js +1 -1
  71. package/esm/components/screens/initial/component.d.ts +1 -1
  72. package/esm/components/screens/initial/component.js.map +1 -1
  73. package/esm/components/screens/initial/countdown-section.d.ts +1 -1
  74. package/esm/components/screens/initial/countdown-section.js.map +1 -1
  75. package/esm/components/screens/initial/index.css +19 -19
  76. package/esm/components/screens/initial/index.module.css.js +1 -1
  77. package/esm/components/screens/temp-block/component.d.ts +1 -1
  78. package/esm/components/screens/temp-block/component.js.map +1 -1
  79. package/esm/components/screens/temp-block/index.css +8 -8
  80. package/esm/components/screens/temp-block/index.module.css.js +1 -1
  81. package/esm/components/screens/temp-block-over/component.d.ts +1 -1
  82. package/esm/components/screens/temp-block-over/index.css +5 -5
  83. package/esm/components/screens/temp-block-over/index.module.css.js +1 -1
  84. package/esm/context.d.ts +0 -1
  85. package/esm/desktop/component.desktop.d.ts +1 -1
  86. package/esm/mobile/component.mobile.d.ts +1 -1
  87. package/esm/types.d.ts +3 -3
  88. package/esm/utils.d.ts +2 -3
  89. package/esm/utils.js.map +1 -1
  90. package/mobile/component.mobile.d.ts +1 -1
  91. package/modern/component.responsive.d.ts +1 -1
  92. package/modern/components/base-confirmation/component.js.map +1 -1
  93. package/modern/components/base-confirmation/index.css +2 -2
  94. package/modern/components/base-confirmation/index.module.css.js +1 -1
  95. package/modern/components/base-confirmation/index.module.css.js.map +1 -1
  96. package/modern/components/countdown-loader/component.d.ts +1 -1
  97. package/modern/components/countdown-loader/index.css +1 -1
  98. package/modern/components/countdown-loader/index.module.css.js +1 -1
  99. package/modern/components/countdown-loader/index.module.css.js.map +1 -1
  100. package/modern/components/header/component.d.ts +1 -1
  101. package/modern/components/header/index.css +1 -1
  102. package/modern/components/header/index.module.css.js +1 -1
  103. package/modern/components/screens/fatal-error/component.d.ts +1 -1
  104. package/modern/components/screens/fatal-error/index.css +6 -6
  105. package/modern/components/screens/fatal-error/index.module.css.js +1 -1
  106. package/modern/components/screens/hint/component.d.ts +1 -1
  107. package/modern/components/screens/hint/index.css +12 -12
  108. package/modern/components/screens/hint/index.module.css.js +1 -1
  109. package/modern/components/screens/initial/component.d.ts +1 -1
  110. package/modern/components/screens/initial/component.js.map +1 -1
  111. package/modern/components/screens/initial/countdown-section.d.ts +1 -1
  112. package/modern/components/screens/initial/countdown-section.js.map +1 -1
  113. package/modern/components/screens/initial/index.css +19 -19
  114. package/modern/components/screens/initial/index.module.css.js +1 -1
  115. package/modern/components/screens/temp-block/component.d.ts +1 -1
  116. package/modern/components/screens/temp-block/component.js.map +1 -1
  117. package/modern/components/screens/temp-block/index.css +8 -8
  118. package/modern/components/screens/temp-block/index.module.css.js +1 -1
  119. package/modern/components/screens/temp-block-over/component.d.ts +1 -1
  120. package/modern/components/screens/temp-block-over/index.css +5 -5
  121. package/modern/components/screens/temp-block-over/index.module.css.js +1 -1
  122. package/modern/context.d.ts +0 -1
  123. package/modern/desktop/component.desktop.d.ts +1 -1
  124. package/modern/mobile/component.mobile.d.ts +1 -1
  125. package/modern/types.d.ts +3 -3
  126. package/modern/utils.d.ts +2 -3
  127. package/modern/utils.js.map +1 -1
  128. package/moderncssm/component.responsive.d.ts +1 -1
  129. package/moderncssm/components/base-confirmation/component.js.map +1 -1
  130. package/moderncssm/components/countdown-loader/component.d.ts +1 -1
  131. package/moderncssm/components/header/component.d.ts +1 -1
  132. package/moderncssm/components/screens/fatal-error/component.d.ts +1 -1
  133. package/moderncssm/components/screens/hint/component.d.ts +1 -1
  134. package/moderncssm/components/screens/initial/component.d.ts +1 -1
  135. package/moderncssm/components/screens/initial/component.js.map +1 -1
  136. package/moderncssm/components/screens/initial/countdown-section.d.ts +1 -1
  137. package/moderncssm/components/screens/initial/countdown-section.js.map +1 -1
  138. package/moderncssm/components/screens/temp-block/component.d.ts +1 -1
  139. package/moderncssm/components/screens/temp-block/component.js.map +1 -1
  140. package/moderncssm/components/screens/temp-block-over/component.d.ts +1 -1
  141. package/moderncssm/context.d.ts +0 -1
  142. package/moderncssm/desktop/component.desktop.d.ts +1 -1
  143. package/moderncssm/mobile/component.mobile.d.ts +1 -1
  144. package/moderncssm/types.d.ts +3 -3
  145. package/moderncssm/utils.d.ts +2 -3
  146. package/moderncssm/utils.js.map +1 -1
  147. package/package.json +8 -8
  148. package/src/components/base-confirmation/index.module.css +1 -1
  149. package/src/components/countdown-loader/index.module.css +1 -1
  150. package/src/vars.css +1 -1
  151. package/types.d.ts +3 -3
  152. package/utils.d.ts +2 -2
  153. package/utils.js.map +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"utils.js","sources":["../src/utils.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { type ConfirmationProps } from './types';\n\n/**\n * Форматирование миллисекунд в hh:mm:ss.\n *\n * @param {Number} ms миллисекунды\n * @returns {String} время в формате mm:ss\n */\nexport function formatMsAsMinutes(ms: number) {\n const totalSeconds = Math.ceil(ms / 1000);\n const totalMinutes = Math.floor(totalSeconds / 60);\n const totalHours = Math.floor(totalMinutes / 60);\n\n const seconds = totalSeconds % 60;\n const paddedSeconds = `00${seconds}`.slice(-2);\n\n if (totalHours > 0) {\n const minutes = totalMinutes % 60;\n\n const paddedMinutes = `00${minutes}`.slice(-2);\n const paddedHours = `00${totalHours}`.slice(-2);\n\n return `${paddedHours}:${paddedMinutes}:${paddedSeconds}`;\n }\n\n const paddedMinutes = `00${totalMinutes}`.slice(-2);\n\n return `${paddedMinutes}:${paddedSeconds}`;\n}\n\ntype UseCountdown = (countdownDuration: number, tick?: number) => [number, () => void, () => void];\n\n/**\n * Возвращает время, которое осталось до истечения таймера в ms\n */\nexport const useCountdown: UseCountdown = (countdownDuration, tick = 1000) => {\n const timerId = useRef(0);\n\n const start = useRef(0);\n\n const [timePassed, setTimePassed] = useState(0);\n\n const stopTimer = useCallback(() => {\n window.clearInterval(timerId.current);\n }, []);\n\n const updateProgress = useCallback(() => {\n const passed = Date.now() - start.current;\n\n if (passed >= countdownDuration) {\n stopTimer();\n\n setTimePassed(countdownDuration);\n } else {\n setTimePassed(passed);\n }\n }, [countdownDuration, stopTimer]);\n\n const startTimer = useCallback(() => {\n stopTimer();\n\n start.current = Date.now();\n\n updateProgress();\n\n timerId.current = window.setInterval(updateProgress, tick);\n }, [stopTimer, updateProgress, tick]);\n\n const timeLeft = countdownDuration - timePassed;\n\n useEffect(\n () => () => {\n stopTimer();\n },\n [stopTimer],\n );\n\n return [timeLeft, startTimer, stopTimer];\n};\n\nexport const ONE_DAY = 24 * 60 * 60 * 1000;\nexport const ONE_MINUTE = 60 * 1000;\n\ntype UseConfirmationParams = {\n state?: ConfirmationProps['state'];\n screen?: ConfirmationProps['screen'];\n blockSmsRetry?: ConfirmationProps['blockSmsRetry'];\n};\n\nexport const useConfirmation = ({ state, screen, blockSmsRetry }: UseConfirmationParams = {}) => {\n const [confirmationState, setConfirmationState] = useState(state ?? 'INITIAL');\n const [confirmationScreen, setConfirmationScreen] = useState(screen ?? 'INITIAL');\n const [confirmationBlockSmsRetry, setConfirmationBlockSmsRetry] = useState(\n blockSmsRetry ?? false,\n );\n\n return {\n confirmationState,\n confirmationScreen,\n confirmationBlockSmsRetry,\n setConfirmationState,\n setConfirmationScreen,\n setConfirmationBlockSmsRetry,\n };\n};\n\nconst NON_NUMBER_OR_PLUS_REGEXP = new RegExp(/[^\\d+]/g);\n\n/**\n * @returns ссылку для набора номера\n */\nexport function getPhoneHref(phone: string): string {\n return `tel:${phone.replace(NON_NUMBER_OR_PLUS_REGEXP, '')}`;\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"utils.js","sources":["../src/utils.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { type ConfirmationProps } from './types';\n\n/**\n * Форматирование миллисекунд в hh:mm:ss.\n *\n * @param {Number} ms миллисекунды\n * @returns {String} время в формате mm:ss\n */\nexport function formatMsAsMinutes(ms: number) {\n const totalSeconds = Math.ceil(ms / 1000);\n const totalMinutes = Math.floor(totalSeconds / 60);\n const totalHours = Math.floor(totalMinutes / 60);\n\n const seconds = totalSeconds % 60;\n const paddedSeconds = `00${seconds}`.slice(-2);\n\n if (totalHours > 0) {\n const minutes = totalMinutes % 60;\n\n const paddedMinutes = `00${minutes}`.slice(-2);\n const paddedHours = `00${totalHours}`.slice(-2);\n\n return `${paddedHours}:${paddedMinutes}:${paddedSeconds}`;\n }\n\n const paddedMinutes = `00${totalMinutes}`.slice(-2);\n\n return `${paddedMinutes}:${paddedSeconds}`;\n}\n\ntype UseCountdown = (countdownDuration: number, tick?: number) => [number, () => void, () => void];\n\n/**\n * Возвращает время, которое осталось до истечения таймера в ms\n */\nexport const useCountdown: UseCountdown = (countdownDuration, tick = 1000) => {\n const timerId = useRef(0);\n\n const start = useRef(0);\n\n const [timePassed, setTimePassed] = useState(0);\n\n const stopTimer = useCallback(() => {\n window.clearInterval(timerId.current);\n }, []);\n\n const updateProgress = useCallback(() => {\n const passed = Date.now() - start.current;\n\n if (passed >= countdownDuration) {\n stopTimer();\n\n setTimePassed(countdownDuration);\n } else {\n setTimePassed(passed);\n }\n }, [countdownDuration, stopTimer]);\n\n const startTimer = useCallback(() => {\n stopTimer();\n\n start.current = Date.now();\n\n updateProgress();\n\n timerId.current = window.setInterval(updateProgress, tick);\n }, [stopTimer, updateProgress, tick]);\n\n const timeLeft = countdownDuration - timePassed;\n\n useEffect(\n () => () => {\n stopTimer();\n },\n [stopTimer],\n );\n\n return [timeLeft, startTimer, stopTimer];\n};\n\nexport const ONE_DAY = 24 * 60 * 60 * 1000;\nexport const ONE_MINUTE = 60 * 1000;\n\ntype UseConfirmationParams = {\n state?: ConfirmationProps['state'];\n screen?: ConfirmationProps['screen'];\n blockSmsRetry?: ConfirmationProps['blockSmsRetry'];\n};\n\nexport const useConfirmation = ({ state, screen, blockSmsRetry }: UseConfirmationParams = {}) => {\n const [confirmationState, setConfirmationState] = useState(state ?? 'INITIAL');\n const [confirmationScreen, setConfirmationScreen] = useState(screen ?? 'INITIAL');\n const [confirmationBlockSmsRetry, setConfirmationBlockSmsRetry] = useState(\n blockSmsRetry ?? false,\n );\n\n return {\n confirmationState,\n confirmationScreen,\n confirmationBlockSmsRetry,\n setConfirmationState,\n setConfirmationScreen,\n setConfirmationBlockSmsRetry,\n };\n};\n\nconst NON_NUMBER_OR_PLUS_REGEXP = new RegExp(/[^\\d+]/g);\n\n/**\n * @returns ссылку для набора номера\n */\nexport function getPhoneHref(phone: string): string {\n return `tel:${phone.replace(NON_NUMBER_OR_PLUS_REGEXP, '')}`;\n}\n"],"names":[],"mappings":"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"}
@@ -1,6 +1,6 @@
1
1
  import { type FC } from 'react';
2
2
  import { type ConfirmationProps } from './types';
3
- export declare type ResponsiveConfirmationProps = Omit<ConfirmationProps, 'confirmationScreens' | 'breakpoint'> & {
3
+ export type ResponsiveConfirmationProps = Omit<ConfirmationProps, 'confirmationScreens' | 'breakpoint'> & {
4
4
  /**
5
5
  * Контрольная точка, с нее начинается desktop версия
6
6
  * @default 1024
@@ -1 +1 @@
1
- {"version":3,"file":"component.js","sources":["../../../src/components/base-confirmation/component.tsx"],"sourcesContent":["import React, { type ComponentType, type FC, useEffect, useMemo } from 'react';\nimport cn from 'classnames';\n\nimport { usePrevious } from '@alfalab/hooks';\n\nimport { ConfirmationContext } from '../../context';\nimport { type ConfirmationProps, defaultTexts, type TConfirmationContext } from '../../types';\nimport { ONE_DAY, ONE_MINUTE, useCountdown } from '../../utils';\nimport { FatalError, Hint, Initial, TempBlock, TempBlockOver } from '../screens';\n\nimport styles from './index.module.css';\n\nconst confirmationScreens: { [key: string]: ComponentType<{ mobile?: boolean }> } = {\n INITIAL: Initial,\n HINT: Hint,\n FATAL_ERROR: FatalError,\n TEMP_BLOCK: TempBlock,\n TEMP_BLOCK_OVER: TempBlockOver,\n};\n\nexport const BaseConfirmation: FC<ConfirmationProps> = ({\n state,\n screen,\n titleTag = 'h3',\n alignContent = 'left',\n children,\n requiredCharAmount = 5,\n countdownDuration = ONE_MINUTE,\n tempBlockDuration = ONE_DAY,\n phone,\n blockSmsRetry,\n dataTestId,\n className,\n maxWidth,\n getScreensMap,\n onInputFinished,\n onChangeState,\n onSmsRetryClick,\n onChangeScreen,\n onFatalErrorOkButtonClick,\n onTempBlockFinished,\n mobile,\n clearCodeOnError = true,\n hideCountdownSection = false,\n breakpoint,\n client,\n initialScreenHintSlot,\n errorVisibleDuration,\n ...restProps\n}) => {\n const [timeLeft, startTimer, stopTimer] = useCountdown(countdownDuration);\n\n const prevState = usePrevious(state);\n\n useEffect(() => {\n startTimer();\n }, [startTimer]);\n\n useEffect(() => {\n /**\n * Перезапускаем таймер после повторного запроса кода\n */\n if (state === 'INITIAL' && prevState === 'CODE_SENDING') {\n startTimer();\n }\n }, [state, prevState, startTimer]);\n\n useEffect(() => {\n /**\n * Останавливаем таймер, если новый экран/состояние не содержит таймер\n */\n if (\n !['INITIAL', 'HINT', 'TEMP_BLOCK', 'TEMP_BLOCK_OVER'].includes(screen) ||\n blockSmsRetry\n ) {\n stopTimer();\n }\n }, [state, screen, blockSmsRetry, stopTimer]);\n\n const handleSmsRetry = () => {\n onChangeState('CODE_SENDING');\n\n onSmsRetryClick();\n };\n\n const handleInputFinished = (code: string) => {\n onChangeState('CODE_CHECKING');\n\n onInputFinished(code);\n };\n\n const handleFatalErrorOkButtonClick = () => {\n if (onFatalErrorOkButtonClick) {\n onFatalErrorOkButtonClick();\n }\n };\n\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n const contextValue: TConfirmationContext = {\n hideCountdownSection,\n alignContent,\n titleTag,\n texts: { ...defaultTexts, ...restProps.texts },\n state,\n screen,\n requiredCharAmount,\n countdownDuration,\n timeLeft,\n tempBlockDuration,\n phone,\n blockSmsRetry,\n breakpoint,\n client,\n onTempBlockFinished,\n onChangeState,\n onChangeScreen,\n clearCodeOnError,\n errorVisibleDuration,\n initialScreenHintSlot,\n onInputFinished: handleInputFinished,\n onSmsRetryClick: handleSmsRetry,\n onFatalErrorOkButtonClick: handleFatalErrorOkButtonClick,\n };\n\n const customScreen = useMemo(() => getScreensMap?.(confirmationScreens), [getScreensMap]);\n\n const screensMap = customScreen || confirmationScreens;\n\n const CurrentScreen = screensMap[screen];\n\n return (\n <ConfirmationContext.Provider value={contextValue}>\n <div\n className={cn(styles.component, className, {\n [styles.center]: alignContent === 'center',\n })}\n style={{ maxWidth }}\n data-test-id={dataTestId}\n >\n {CurrentScreen && <CurrentScreen mobile={mobile} />}\n </div>\n </ConfirmationContext.Provider>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;AAYA,MAAM,mBAAmB,GAA2D;AAChF,IAAA,OAAO,EAAE,OAAO;AAChB,IAAA,IAAI,EAAE,IAAI;AACV,IAAA,WAAW,EAAE,UAAU;AACvB,IAAA,UAAU,EAAE,SAAS;AACrB,IAAA,eAAe,EAAE,aAAa;CACjC;AAEY,MAAA,gBAAgB,GAA0B,CAAC,EACpD,KAAK,EACL,MAAM,EACN,QAAQ,GAAG,IAAI,EACf,YAAY,GAAG,MAAM,EACrB,QAAQ,EACR,kBAAkB,GAAG,CAAC,EACtB,iBAAiB,GAAG,UAAU,EAC9B,iBAAiB,GAAG,OAAO,EAC3B,KAAK,EACL,aAAa,EACb,UAAU,EACV,SAAS,EACT,QAAQ,EACR,aAAa,EACb,eAAe,EACf,aAAa,EACb,eAAe,EACf,cAAc,EACd,yBAAyB,EACzB,mBAAmB,EACnB,MAAM,EACN,gBAAgB,GAAG,IAAI,EACvB,oBAAoB,GAAG,KAAK,EAC5B,UAAU,EACV,MAAM,EACN,qBAAqB,EACrB,oBAAoB,EACpB,GAAG,SAAS,EACf,KAAI;AACD,IAAA,MAAM,CAAC,QAAQ,EAAE,UAAU,EAAE,SAAS,CAAC,GAAG,YAAY,CAAC,iBAAiB,CAAC;AAEzE,IAAA,MAAM,SAAS,GAAG,WAAW,CAAC,KAAK,CAAC;IAEpC,SAAS,CAAC,MAAK;AACX,QAAA,UAAU,EAAE;AAChB,KAAC,EAAE,CAAC,UAAU,CAAC,CAAC;IAEhB,SAAS,CAAC,MAAK;AACX;;AAEG;AACH,QAAA,IAAI,KAAK,KAAK,SAAS,IAAI,SAAS,KAAK,cAAc,EAAE;AACrD,YAAA,UAAU,EAAE;AACf;KACJ,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,UAAU,CAAC,CAAC;IAElC,SAAS,CAAC,MAAK;AACX;;AAEG;AACH,QAAA,IACI,CAAC,CAAC,SAAS,EAAE,MAAM,EAAE,YAAY,EAAE,iBAAiB,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC;AACtE,YAAA,aAAa,EACf;AACE,YAAA,SAAS,EAAE;AACd;KACJ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,aAAa,EAAE,SAAS,CAAC,CAAC;IAE7C,MAAM,cAAc,GAAG,MAAK;QACxB,aAAa,CAAC,cAAc,CAAC;AAE7B,QAAA,eAAe,EAAE;AACrB,KAAC;AAED,IAAA,MAAM,mBAAmB,GAAG,CAAC,IAAY,KAAI;QACzC,aAAa,CAAC,eAAe,CAAC;QAE9B,eAAe,CAAC,IAAI,CAAC;AACzB,KAAC;IAED,MAAM,6BAA6B,GAAG,MAAK;AACvC,QAAA,IAAI,yBAAyB,EAAE;AAC3B,YAAA,yBAAyB,EAAE;AAC9B;AACL,KAAC;;AAGD,IAAA,MAAM,YAAY,GAAyB;QACvC,oBAAoB;QACpB,YAAY;QACZ,QAAQ;QACR,KAAK,EAAE,EAAE,GAAG,YAAY,EAAE,GAAG,SAAS,CAAC,KAAK,EAAE;QAC9C,KAAK;QACL,MAAM;QACN,kBAAkB;QAClB,iBAAiB;QACjB,QAAQ;QACR,iBAAiB;QACjB,KAAK;QACL,aAAa;QACb,UAAU;QACV,MAAM;QACN,mBAAmB;QACnB,aAAa;QACb,cAAc;QACd,gBAAgB;QAChB,oBAAoB;QACpB,qBAAqB;AACrB,QAAA,eAAe,EAAE,mBAAmB;AACpC,QAAA,eAAe,EAAE,cAAc;AAC/B,QAAA,yBAAyB,EAAE,6BAA6B;KAC3D;AAED,IAAA,MAAM,YAAY,GAAG,OAAO,CAAC,MAAM,aAAa,GAAG,mBAAmB,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC;AAEzF,IAAA,MAAM,UAAU,GAAG,YAAY,IAAI,mBAAmB;AAEtD,IAAA,MAAM,aAAa,GAAG,UAAU,CAAC,MAAM,CAAC;IAExC,QACI,oBAAC,mBAAmB,CAAC,QAAQ,EAAC,EAAA,KAAK,EAAE,YAAY,EAAA;QAC7C,KACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,EAAE;AACvC,gBAAA,CAAC,MAAM,CAAC,MAAM,GAAG,YAAY,KAAK,QAAQ;aAC7C,CAAC,EACF,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAA,cAAA,EACL,UAAU,EAEvB,EAAA,aAAa,IAAI,KAAC,CAAA,aAAA,CAAA,aAAa,IAAC,MAAM,EAAE,MAAM,EAAI,CAAA,CACjD,CACqB;AAEvC;;;;"}
1
+ {"version":3,"file":"component.js","sources":["../../../src/components/base-confirmation/component.tsx"],"sourcesContent":["import React, { type ComponentType, type FC, useEffect, useMemo } from 'react';\nimport cn from 'classnames';\n\nimport { usePrevious } from '@alfalab/hooks';\n\nimport { ConfirmationContext } from '../../context';\nimport { type ConfirmationProps, defaultTexts, type TConfirmationContext } from '../../types';\nimport { ONE_DAY, ONE_MINUTE, useCountdown } from '../../utils';\nimport { FatalError, Hint, Initial, TempBlock, TempBlockOver } from '../screens';\n\nimport styles from './index.module.css';\n\nconst confirmationScreens: { [key: string]: ComponentType<{ mobile?: boolean }> } = {\n INITIAL: Initial,\n HINT: Hint,\n FATAL_ERROR: FatalError,\n TEMP_BLOCK: TempBlock,\n TEMP_BLOCK_OVER: TempBlockOver,\n};\n\nexport const BaseConfirmation: FC<ConfirmationProps> = ({\n state,\n screen,\n titleTag = 'h3',\n alignContent = 'left',\n children,\n requiredCharAmount = 5,\n countdownDuration = ONE_MINUTE,\n tempBlockDuration = ONE_DAY,\n phone,\n blockSmsRetry,\n dataTestId,\n className,\n maxWidth,\n getScreensMap,\n onInputFinished,\n onChangeState,\n onSmsRetryClick,\n onChangeScreen,\n onFatalErrorOkButtonClick,\n onTempBlockFinished,\n mobile,\n clearCodeOnError = true,\n hideCountdownSection = false,\n breakpoint,\n client,\n initialScreenHintSlot,\n errorVisibleDuration,\n ...restProps\n}) => {\n const [timeLeft, startTimer, stopTimer] = useCountdown(countdownDuration);\n\n const prevState = usePrevious(state);\n\n useEffect(() => {\n startTimer();\n }, [startTimer]);\n\n useEffect(() => {\n /**\n * Перезапускаем таймер после повторного запроса кода\n */\n if (state === 'INITIAL' && prevState === 'CODE_SENDING') {\n startTimer();\n }\n }, [state, prevState, startTimer]);\n\n useEffect(() => {\n /**\n * Останавливаем таймер, если новый экран/состояние не содержит таймер\n */\n if (\n !['INITIAL', 'HINT', 'TEMP_BLOCK', 'TEMP_BLOCK_OVER'].includes(screen) ||\n blockSmsRetry\n ) {\n stopTimer();\n }\n }, [state, screen, blockSmsRetry, stopTimer]);\n\n const handleSmsRetry = () => {\n onChangeState('CODE_SENDING');\n\n onSmsRetryClick();\n };\n\n const handleInputFinished = (code: string) => {\n onChangeState('CODE_CHECKING');\n\n onInputFinished(code);\n };\n\n const handleFatalErrorOkButtonClick = () => {\n if (onFatalErrorOkButtonClick) {\n onFatalErrorOkButtonClick();\n }\n };\n\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n const contextValue: TConfirmationContext = {\n hideCountdownSection,\n alignContent,\n titleTag,\n texts: { ...defaultTexts, ...restProps.texts },\n state,\n screen,\n requiredCharAmount,\n countdownDuration,\n timeLeft,\n tempBlockDuration,\n phone,\n blockSmsRetry,\n breakpoint,\n client,\n onTempBlockFinished,\n onChangeState,\n onChangeScreen,\n clearCodeOnError,\n errorVisibleDuration,\n initialScreenHintSlot,\n onInputFinished: handleInputFinished,\n onSmsRetryClick: handleSmsRetry,\n onFatalErrorOkButtonClick: handleFatalErrorOkButtonClick,\n };\n\n const customScreen = useMemo(() => getScreensMap?.(confirmationScreens), [getScreensMap]);\n\n const screensMap = customScreen || confirmationScreens;\n\n const CurrentScreen = screensMap[screen];\n\n return (\n <ConfirmationContext.Provider value={contextValue}>\n <div\n className={cn(styles.component, className, {\n [styles.center]: alignContent === 'center',\n })}\n style={{ maxWidth }}\n data-test-id={dataTestId}\n >\n {CurrentScreen && <CurrentScreen mobile={mobile} />}\n </div>\n </ConfirmationContext.Provider>\n );\n};\n"],"names":[],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  import { type FC } from 'react';
2
- declare type Props = {
2
+ type Props = {
3
3
  progress: number;
4
4
  className?: string;
5
5
  };
@@ -1,5 +1,5 @@
1
1
  import { type FC, type ReactNode } from 'react';
2
- export declare type HeaderProps = {
2
+ export type HeaderProps = {
3
3
  /**
4
4
  * Контент шапки
5
5
  */
@@ -1,5 +1,5 @@
1
1
  import { type FC } from 'react';
2
- export declare type FatalErrorProps = {
2
+ export type FatalErrorProps = {
3
3
  /**
4
4
  * Отображать в мобильной версии экран компонента
5
5
  */
@@ -1,5 +1,5 @@
1
1
  import { type FC } from 'react';
2
- export declare type HintProps = {
2
+ export type HintProps = {
3
3
  /**
4
4
  * Отображать в мобильной версии экран компонента
5
5
  */
@@ -1,5 +1,5 @@
1
1
  import { type FC } from 'react';
2
- export declare type InitialProps = {
2
+ export type InitialProps = {
3
3
  /**
4
4
  * Отображать в мобильной версии экран компонента
5
5
  */
@@ -1 +1 @@
1
- {"version":3,"file":"component.js","sources":["../../../../src/components/screens/initial/component.tsx"],"sourcesContent":["import React, { type FC, useCallback, useContext, useEffect, useRef, useState } from 'react';\nimport cn from 'classnames';\n\nimport { ButtonMobile } from '@alfalab/core-components-button/mobile';\nimport { CodeInputDesktop } from '@alfalab/core-components-code-input/desktop';\nimport { CodeInputMobile } from '@alfalab/core-components-code-input/mobile';\nimport {\n type BaseCodeInputProps,\n type CustomInputRef,\n} from '@alfalab/core-components-code-input/shared';\nimport { Link } from '@alfalab/core-components-link';\nimport { TypographyText } from '@alfalab/core-components-typography';\nimport { useLayoutEffect_SAFE_FOR_SSR, usePrevious } from '@alfalab/hooks';\n\nimport { ConfirmationContext } from '../../../context';\nimport { Header } from '../../header';\n\nimport { CountdownSection } from './countdown-section';\n\nimport styles from './index.module.css';\n\nexport type InitialProps = {\n /**\n * Отображать в мобильной версии экран компонента\n */\n mobile?: boolean;\n};\n\nconst CODE_SEND_HINT_VISIBLE_DURATION = 2000;\n\nexport const Initial: FC<InitialProps> = ({ mobile }) => {\n const {\n state,\n alignContent,\n titleTag,\n texts,\n requiredCharAmount,\n timeLeft,\n phone,\n clearCodeOnError,\n hideCountdownSection,\n initialScreenHintSlot,\n errorVisibleDuration,\n onChangeState,\n onInputFinished,\n onChangeScreen,\n onSmsRetryClick,\n } = useContext(ConfirmationContext);\n\n const prevState = usePrevious(state);\n\n const inputRef = useRef<CustomInputRef>(null);\n\n const [codeSendHintVisible, setCodeSendHintVisible] = useState(false);\n\n const timerId = useRef(0);\n\n const handleInputComplete: BaseCodeInputProps['onComplete'] = (code) => {\n onInputFinished(code);\n };\n\n const handleSmsHintLinkClick = () => {\n onChangeScreen('HINT');\n };\n\n const handleInputChange = () => {\n if (state === 'CODE_ERROR') {\n onChangeState('INITIAL');\n }\n };\n\n const handleSmsRetryClick = () => {\n if (inputRef.current) {\n inputRef.current.reset();\n }\n\n onSmsRetryClick();\n };\n\n const handleErrorAnimationEnd = () => {\n if (clearCodeOnError && state !== 'INITIAL') {\n onChangeState('INITIAL');\n }\n };\n\n const clearTimer = useCallback(() => {\n window.clearTimeout(timerId.current);\n }, []);\n\n useEffect(() => {\n if (inputRef.current) {\n inputRef.current.focus();\n }\n\n return () => {\n clearTimer();\n };\n }, [clearTimer]);\n\n useEffect(() => {\n if (!inputRef.current) {\n return;\n }\n\n if (prevState === 'CODE_SENDING' && state !== 'CODE_SENDING') {\n inputRef.current.focus();\n }\n }, [prevState, state, requiredCharAmount]);\n\n useLayoutEffect_SAFE_FOR_SSR(() => {\n if (prevState === 'CODE_SENDING' && state !== 'CODE_SENDING') {\n setCodeSendHintVisible(true);\n\n clearTimer();\n\n timerId.current = window.setTimeout(() => {\n setCodeSendHintVisible(false);\n }, CODE_SEND_HINT_VISIBLE_DURATION);\n }\n }, [prevState, state, clearTimer]);\n\n const getCodeInputError = (): string | boolean => {\n if (state === 'CODE_EXPIRED') {\n return texts.codeErrorExpired || true;\n }\n\n if (state === 'CODE_EXPIRED_ENDED') {\n return texts.codeErrorExpiredEnded || true;\n }\n\n if (state === 'CODE_ERROR') {\n return texts.codeError || true;\n }\n\n return false;\n };\n\n const renderHintButton = () => {\n if (initialScreenHintSlot) {\n return initialScreenHintSlot;\n }\n\n if (mobile) {\n return (\n <ButtonMobile\n onClick={handleSmsHintLinkClick}\n className={styles.smsBtn}\n view='text'\n size={40}\n >\n {texts.linkToHint}\n </ButtonMobile>\n );\n }\n\n return (\n <Link\n onClick={handleSmsHintLinkClick}\n className={styles.smsComeLink}\n view={mobile ? 'primary' : 'secondary'}\n pseudo={true}\n >\n {texts.linkToHint}\n </Link>\n );\n };\n\n const processing = ['CODE_CHECKING', 'CODE_SENDING'].includes(state);\n\n const timePassed = timeLeft === 0;\n\n const ComponentCodeInput = mobile ? CodeInputMobile : CodeInputDesktop;\n\n return (\n <div className={cn(styles.component, styles[alignContent])}>\n <Header mobile={mobile} titleTag={titleTag}>\n {texts.title}\n </Header>\n\n {phone ? (\n <TypographyText\n view='primary-medium'\n color='primary'\n className={cn(styles.phone, {\n [styles.typographyTheme]: !mobile,\n [styles.typographyThemeMobile]: mobile,\n })}\n >\n Отправили на {phone}\n </TypographyText>\n ) : null}\n <ComponentCodeInput\n disabled={processing}\n error={getCodeInputError()}\n ref={inputRef}\n fields={requiredCharAmount}\n className={cn(styles.containerInput, styles.codeInput)}\n onComplete={handleInputComplete}\n onChange={handleInputChange}\n clearCodeOnError={clearCodeOnError}\n errorVisibleDuration={errorVisibleDuration}\n onErrorAnimationEnd={handleErrorAnimationEnd}\n />\n {!hideCountdownSection && (\n <CountdownSection\n processing={processing}\n timePassed={timePassed}\n codeSendHintVisible={codeSendHintVisible}\n handleSmsRetryClick={handleSmsRetryClick}\n mobile={mobile}\n />\n )}\n\n {renderHintButton()}\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"component.js","sources":["../../../../src/components/screens/initial/component.tsx"],"sourcesContent":["import React, { type FC, useCallback, useContext, useEffect, useRef, useState } from 'react';\nimport cn from 'classnames';\n\nimport { ButtonMobile } from '@alfalab/core-components-button/mobile';\nimport { CodeInputDesktop } from '@alfalab/core-components-code-input/desktop';\nimport { CodeInputMobile } from '@alfalab/core-components-code-input/mobile';\nimport {\n type BaseCodeInputProps,\n type CustomInputRef,\n} from '@alfalab/core-components-code-input/shared';\nimport { Link } from '@alfalab/core-components-link';\nimport { TypographyText } from '@alfalab/core-components-typography';\nimport { useLayoutEffect_SAFE_FOR_SSR, usePrevious } from '@alfalab/hooks';\n\nimport { ConfirmationContext } from '../../../context';\nimport { Header } from '../../header';\n\nimport { CountdownSection } from './countdown-section';\n\nimport styles from './index.module.css';\n\nexport type InitialProps = {\n /**\n * Отображать в мобильной версии экран компонента\n */\n mobile?: boolean;\n};\n\nconst CODE_SEND_HINT_VISIBLE_DURATION = 2000;\n\nexport const Initial: FC<InitialProps> = ({ mobile }) => {\n const {\n state,\n alignContent,\n titleTag,\n texts,\n requiredCharAmount,\n timeLeft,\n phone,\n clearCodeOnError,\n hideCountdownSection,\n initialScreenHintSlot,\n errorVisibleDuration,\n onChangeState,\n onInputFinished,\n onChangeScreen,\n onSmsRetryClick,\n } = useContext(ConfirmationContext);\n\n const prevState = usePrevious(state);\n\n const inputRef = useRef<CustomInputRef>(null);\n\n const [codeSendHintVisible, setCodeSendHintVisible] = useState(false);\n\n const timerId = useRef(0);\n\n const handleInputComplete: BaseCodeInputProps['onComplete'] = (code) => {\n onInputFinished(code);\n };\n\n const handleSmsHintLinkClick = () => {\n onChangeScreen('HINT');\n };\n\n const handleInputChange = () => {\n if (state === 'CODE_ERROR') {\n onChangeState('INITIAL');\n }\n };\n\n const handleSmsRetryClick = () => {\n if (inputRef.current) {\n inputRef.current.reset();\n }\n\n onSmsRetryClick();\n };\n\n const handleErrorAnimationEnd = () => {\n if (clearCodeOnError && state !== 'INITIAL') {\n onChangeState('INITIAL');\n }\n };\n\n const clearTimer = useCallback(() => {\n window.clearTimeout(timerId.current);\n }, []);\n\n useEffect(() => {\n if (inputRef.current) {\n inputRef.current.focus();\n }\n\n return () => {\n clearTimer();\n };\n }, [clearTimer]);\n\n useEffect(() => {\n if (!inputRef.current) {\n return;\n }\n\n if (prevState === 'CODE_SENDING' && state !== 'CODE_SENDING') {\n inputRef.current.focus();\n }\n }, [prevState, state, requiredCharAmount]);\n\n useLayoutEffect_SAFE_FOR_SSR(() => {\n if (prevState === 'CODE_SENDING' && state !== 'CODE_SENDING') {\n setCodeSendHintVisible(true);\n\n clearTimer();\n\n timerId.current = window.setTimeout(() => {\n setCodeSendHintVisible(false);\n }, CODE_SEND_HINT_VISIBLE_DURATION);\n }\n }, [prevState, state, clearTimer]);\n\n const getCodeInputError = (): string | boolean => {\n if (state === 'CODE_EXPIRED') {\n return texts.codeErrorExpired || true;\n }\n\n if (state === 'CODE_EXPIRED_ENDED') {\n return texts.codeErrorExpiredEnded || true;\n }\n\n if (state === 'CODE_ERROR') {\n return texts.codeError || true;\n }\n\n return false;\n };\n\n const renderHintButton = () => {\n if (initialScreenHintSlot) {\n return initialScreenHintSlot;\n }\n\n if (mobile) {\n return (\n <ButtonMobile\n onClick={handleSmsHintLinkClick}\n className={styles.smsBtn}\n view='text'\n size={40}\n >\n {texts.linkToHint}\n </ButtonMobile>\n );\n }\n\n return (\n <Link\n onClick={handleSmsHintLinkClick}\n className={styles.smsComeLink}\n view={mobile ? 'primary' : 'secondary'}\n pseudo={true}\n >\n {texts.linkToHint}\n </Link>\n );\n };\n\n const processing = ['CODE_CHECKING', 'CODE_SENDING'].includes(state);\n\n const timePassed = timeLeft === 0;\n\n const ComponentCodeInput = mobile ? CodeInputMobile : CodeInputDesktop;\n\n return (\n <div className={cn(styles.component, styles[alignContent])}>\n <Header mobile={mobile} titleTag={titleTag}>\n {texts.title}\n </Header>\n\n {phone ? (\n <TypographyText\n view='primary-medium'\n color='primary'\n className={cn(styles.phone, {\n [styles.typographyTheme]: !mobile,\n [styles.typographyThemeMobile]: mobile,\n })}\n >\n Отправили на {phone}\n </TypographyText>\n ) : null}\n <ComponentCodeInput\n disabled={processing}\n error={getCodeInputError()}\n ref={inputRef}\n fields={requiredCharAmount}\n className={cn(styles.containerInput, styles.codeInput)}\n onComplete={handleInputComplete}\n onChange={handleInputChange}\n clearCodeOnError={clearCodeOnError}\n errorVisibleDuration={errorVisibleDuration}\n onErrorAnimationEnd={handleErrorAnimationEnd}\n />\n {!hideCountdownSection && (\n <CountdownSection\n processing={processing}\n timePassed={timePassed}\n codeSendHintVisible={codeSendHintVisible}\n handleSmsRetryClick={handleSmsRetryClick}\n mobile={mobile}\n />\n )}\n\n {renderHintButton()}\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  import { type FC } from 'react';
2
- declare type CountdownSectionProps = {
2
+ type CountdownSectionProps = {
3
3
  codeSendHintVisible: boolean;
4
4
  timePassed: boolean;
5
5
  processing: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"countdown-section.js","sources":["../../../../src/components/screens/initial/countdown-section.tsx"],"sourcesContent":["import React, { type FC, Fragment, type ReactNode, useContext } from 'react';\nimport cn from 'classnames';\n\nimport { Button } from '@alfalab/core-components-button';\nimport { Spinner } from '@alfalab/core-components-spinner';\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { ConfirmationContext } from '../../../context';\nimport { formatMsAsMinutes } from '../../../utils';\n\nimport styles from './index.module.css';\n\ntype CountdownSectionProps = {\n codeSendHintVisible: boolean;\n timePassed: boolean;\n processing: boolean;\n mobile?: boolean;\n handleSmsRetryClick: () => void;\n};\n\nexport const CountdownSection: FC<CountdownSectionProps> = ({\n codeSendHintVisible,\n timePassed,\n processing,\n mobile,\n handleSmsRetryClick,\n}) => {\n const { state, texts, timeLeft, blockSmsRetry, breakpoint, client } =\n useContext(ConfirmationContext);\n\n const renderText = (content: ReactNode) => (\n <TypographyText\n className={cn(styles.countdownContainer, {\n [styles.countdownMobile]: mobile,\n [styles.typographyTheme]: !mobile,\n })}\n view={mobile ? 'primary-small' : 'primary-medium'}\n tag='div'\n >\n {content}\n </TypographyText>\n );\n\n if (codeSendHintVisible) return renderText(texts.codeSended);\n\n if (processing) {\n return (\n <div\n className={cn(styles.loaderWrap, styles.countdownContainer, {\n [styles.countdownLoaderMobile]: mobile,\n [styles.typographyTheme]: !mobile,\n })}\n >\n <Spinner preset={24} visible={true} />\n\n <span className={styles.loaderText}>\n {state === 'CODE_CHECKING' ? texts.codeChecking : texts.codeSending}\n </span>\n </div>\n );\n }\n\n if (blockSmsRetry) return renderText(texts.noAttemptsLeft);\n\n if (timePassed) {\n return (\n <Button\n size={mobile ? 40 : 32}\n view='secondary'\n onClick={handleSmsRetryClick}\n className={cn(styles.getCodeButton, { [styles.getCodeButtonMobile]: mobile })}\n breakpoint={breakpoint}\n client={client}\n >\n {texts.buttonRetry}\n </Button>\n );\n }\n\n return renderText(\n <Fragment>\n {texts.countdown}\n {'\\u00A0'}\n <time className={styles.timeCounter}>{formatMsAsMinutes(timeLeft)}</time>\n </Fragment>,\n );\n};\n"],"names":[],"mappings":";;;;;;;;;AAoBa,MAAA,gBAAgB,GAA8B,CAAC,EACxD,mBAAmB,EACnB,UAAU,EACV,UAAU,EACV,MAAM,EACN,mBAAmB,GACtB,KAAI;AACD,IAAA,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,EAAE,GAC/D,UAAU,CAAC,mBAAmB,CAAC;AAEnC,IAAA,MAAM,UAAU,GAAG,CAAC,OAAkB,MAClC,KAAA,CAAA,aAAA,CAAC,cAAc,EAAA,EACX,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,kBAAkB,EAAE;AACrC,YAAA,CAAC,MAAM,CAAC,eAAe,GAAG,MAAM;AAChC,YAAA,CAAC,MAAM,CAAC,eAAe,GAAG,CAAC,MAAM;SACpC,CAAC,EACF,IAAI,EAAE,MAAM,GAAG,eAAe,GAAG,gBAAgB,EACjD,GAAG,EAAC,KAAK,IAER,OAAO,CACK,CACpB;AAED,IAAA,IAAI,mBAAmB;AAAE,QAAA,OAAO,UAAU,CAAC,KAAK,CAAC,UAAU,CAAC;AAE5D,IAAA,IAAI,UAAU,EAAE;AACZ,QAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,UAAU,EAAE,MAAM,CAAC,kBAAkB,EAAE;AACxD,gBAAA,CAAC,MAAM,CAAC,qBAAqB,GAAG,MAAM;AACtC,gBAAA,CAAC,MAAM,CAAC,eAAe,GAAG,CAAC,MAAM;aACpC,CAAC,EAAA;YAEF,KAAC,CAAA,aAAA,CAAA,OAAO,IAAC,MAAM,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAI,CAAA;YAEtC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,UAAU,IAC7B,KAAK,KAAK,eAAe,GAAG,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,WAAW,CAChE,CACL;AAEb;AAED,IAAA,IAAI,aAAa;AAAE,QAAA,OAAO,UAAU,CAAC,KAAK,CAAC,cAAc,CAAC;AAE1D,IAAA,IAAI,UAAU,EAAE;QACZ,QACI,KAAC,CAAA,aAAA,CAAA,MAAM,EACH,EAAA,IAAI,EAAE,MAAM,GAAG,EAAE,GAAG,EAAE,EACtB,IAAI,EAAC,WAAW,EAChB,OAAO,EAAE,mBAAmB,EAC5B,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,aAAa,EAAE,EAAE,CAAC,MAAM,CAAC,mBAAmB,GAAG,MAAM,EAAE,CAAC,EAC7E,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EAEb,EAAA,KAAK,CAAC,WAAW,CACb;AAEhB;IAED,OAAO,UAAU,CACb,KAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,IAAA;AACJ,QAAA,KAAK,CAAC,SAAS;QACf,QAAQ;AACT,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,MAAM,CAAC,WAAW,EAAA,EAAG,iBAAiB,CAAC,QAAQ,CAAC,CAAQ,CAClE,CACd;AACL;;;;"}
1
+ {"version":3,"file":"countdown-section.js","sources":["../../../../src/components/screens/initial/countdown-section.tsx"],"sourcesContent":["import React, { type FC, Fragment, type ReactNode, useContext } from 'react';\nimport cn from 'classnames';\n\nimport { Button } from '@alfalab/core-components-button';\nimport { Spinner } from '@alfalab/core-components-spinner';\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { ConfirmationContext } from '../../../context';\nimport { formatMsAsMinutes } from '../../../utils';\n\nimport styles from './index.module.css';\n\ntype CountdownSectionProps = {\n codeSendHintVisible: boolean;\n timePassed: boolean;\n processing: boolean;\n mobile?: boolean;\n handleSmsRetryClick: () => void;\n};\n\nexport const CountdownSection: FC<CountdownSectionProps> = ({\n codeSendHintVisible,\n timePassed,\n processing,\n mobile,\n handleSmsRetryClick,\n}) => {\n const { state, texts, timeLeft, blockSmsRetry, breakpoint, client } =\n useContext(ConfirmationContext);\n\n const renderText = (content: ReactNode) => (\n <TypographyText\n className={cn(styles.countdownContainer, {\n [styles.countdownMobile]: mobile,\n [styles.typographyTheme]: !mobile,\n })}\n view={mobile ? 'primary-small' : 'primary-medium'}\n tag='div'\n >\n {content}\n </TypographyText>\n );\n\n if (codeSendHintVisible) return renderText(texts.codeSended);\n\n if (processing) {\n return (\n <div\n className={cn(styles.loaderWrap, styles.countdownContainer, {\n [styles.countdownLoaderMobile]: mobile,\n [styles.typographyTheme]: !mobile,\n })}\n >\n <Spinner preset={24} visible={true} />\n\n <span className={styles.loaderText}>\n {state === 'CODE_CHECKING' ? texts.codeChecking : texts.codeSending}\n </span>\n </div>\n );\n }\n\n if (blockSmsRetry) return renderText(texts.noAttemptsLeft);\n\n if (timePassed) {\n return (\n <Button\n size={mobile ? 40 : 32}\n view='secondary'\n onClick={handleSmsRetryClick}\n className={cn(styles.getCodeButton, { [styles.getCodeButtonMobile]: mobile })}\n breakpoint={breakpoint}\n client={client}\n >\n {texts.buttonRetry}\n </Button>\n );\n }\n\n return renderText(\n <Fragment>\n {texts.countdown}\n {'\\u00A0'}\n <time className={styles.timeCounter}>{formatMsAsMinutes(timeLeft)}</time>\n </Fragment>,\n );\n};\n"],"names":[],"mappings":";;;;;;;;;AAoBa,MAAA,gBAAgB,GAA8B,CAAC,EACxD,mBAAmB,EACnB,UAAU,EACV,UAAU,EACV,MAAM,EACN,mBAAmB,GACtB,KAAI;AACD,IAAA,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,EAAE,GAC/D,UAAU,CAAC,mBAAmB,CAAC;AAEnC,IAAA,MAAM,UAAU,GAAG,CAAC,OAAkB,MAClC,KAAA,CAAA,aAAA,CAAC,cAAc,EAAA,EACX,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,kBAAkB,EAAE;AACrC,YAAA,CAAC,MAAM,CAAC,eAAe,GAAG,MAAM;AAChC,YAAA,CAAC,MAAM,CAAC,eAAe,GAAG,CAAC,MAAM;SACpC,CAAC,EACF,IAAI,EAAE,MAAM,GAAG,eAAe,GAAG,gBAAgB,EACjD,GAAG,EAAC,KAAK,IAER,OAAO,CACK,CACpB;AAED,IAAA,IAAI,mBAAmB;AAAE,QAAA,OAAO,UAAU,CAAC,KAAK,CAAC,UAAU,CAAC;IAE5D,IAAI,UAAU,EAAE;AACZ,QAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,UAAU,EAAE,MAAM,CAAC,kBAAkB,EAAE;AACxD,gBAAA,CAAC,MAAM,CAAC,qBAAqB,GAAG,MAAM;AACtC,gBAAA,CAAC,MAAM,CAAC,eAAe,GAAG,CAAC,MAAM;aACpC,CAAC,EAAA;YAEF,KAAC,CAAA,aAAA,CAAA,OAAO,IAAC,MAAM,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAI,CAAA;YAEtC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,UAAU,IAC7B,KAAK,KAAK,eAAe,GAAG,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,WAAW,CAChE,CACL;;AAId,IAAA,IAAI,aAAa;AAAE,QAAA,OAAO,UAAU,CAAC,KAAK,CAAC,cAAc,CAAC;IAE1D,IAAI,UAAU,EAAE;QACZ,QACI,KAAC,CAAA,aAAA,CAAA,MAAM,EACH,EAAA,IAAI,EAAE,MAAM,GAAG,EAAE,GAAG,EAAE,EACtB,IAAI,EAAC,WAAW,EAChB,OAAO,EAAE,mBAAmB,EAC5B,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,aAAa,EAAE,EAAE,CAAC,MAAM,CAAC,mBAAmB,GAAG,MAAM,EAAE,CAAC,EAC7E,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EAEb,EAAA,KAAK,CAAC,WAAW,CACb;;IAIjB,OAAO,UAAU,CACb,KAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,IAAA;AACJ,QAAA,KAAK,CAAC,SAAS;QACf,QAAQ;AACT,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,MAAM,CAAC,WAAW,EAAA,EAAG,iBAAiB,CAAC,QAAQ,CAAC,CAAQ,CAClE,CACd;AACL;;;;"}
@@ -1,5 +1,5 @@
1
1
  import { type FC } from 'react';
2
- export declare type TempBlockProps = {
2
+ export type TempBlockProps = {
3
3
  /**
4
4
  * Отображать в мобильной версии экран компонента
5
5
  */
@@ -1 +1 @@
1
- {"version":3,"file":"component.js","sources":["../../../../src/components/screens/temp-block/component.tsx"],"sourcesContent":["import React, { type FC, useContext, useEffect } from 'react';\nimport cn from 'classnames';\n\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { ConfirmationContext } from '../../../context';\nimport { formatMsAsMinutes, useCountdown } from '../../../utils';\nimport { CountdownLoader } from '../../countdown-loader';\nimport { Header } from '../../header';\n\nimport styles from './index.module.css';\n\nexport type TempBlockProps = {\n /**\n * Отображать в мобильной версии экран компонента\n */\n mobile?: boolean;\n};\n\nexport const TempBlock: FC<TempBlockProps> = ({ mobile }) => {\n const {\n alignContent,\n titleTag,\n texts,\n tempBlockDuration,\n onChangeScreen,\n onTempBlockFinished,\n } = useContext(ConfirmationContext);\n\n const [timeLeft, startTimer] = useCountdown(tempBlockDuration);\n\n useEffect(() => {\n startTimer();\n }, [startTimer]);\n\n useEffect(() => {\n if (timeLeft === 0 && onTempBlockFinished) {\n onTempBlockFinished();\n }\n }, [timeLeft, onChangeScreen, onTempBlockFinished]);\n\n return (\n <div className={cn(styles.component, styles[alignContent])}>\n <Header mobile={mobile} titleTag={titleTag}>\n {texts.tempBlockTitle}\n </Header>\n\n <TypographyText\n view='primary-medium'\n color='primary'\n className={cn(styles.description, {\n [styles.typographyTheme]: !mobile,\n [styles.typographyThemeMobile]: mobile,\n })}\n >\n {texts.tempBlockDescription}\n </TypographyText>\n\n <div className={cn(styles.countdownWrap, { [styles.typographyTheme]: !mobile })}>\n <CountdownLoader\n progress={1 - timeLeft / tempBlockDuration}\n className={styles.loader}\n />\n <time className={styles.timeCounter}>{formatMsAsMinutes(timeLeft)}</time>\n </div>\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;MAmBa,SAAS,GAAuB,CAAC,EAAE,MAAM,EAAE,KAAI;AACxD,IAAA,MAAM,EACF,YAAY,EACZ,QAAQ,EACR,KAAK,EACL,iBAAiB,EACjB,cAAc,EACd,mBAAmB,GACtB,GAAG,UAAU,CAAC,mBAAmB,CAAC;IAEnC,MAAM,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG,YAAY,CAAC,iBAAiB,CAAC;IAE9D,SAAS,CAAC,MAAK;AACX,QAAA,UAAU,EAAE;AAChB,KAAC,EAAE,CAAC,UAAU,CAAC,CAAC;IAEhB,SAAS,CAAC,MAAK;AACX,QAAA,IAAI,QAAQ,KAAK,CAAC,IAAI,mBAAmB,EAAE;AACvC,YAAA,mBAAmB,EAAE;AACxB;KACJ,EAAE,CAAC,QAAQ,EAAE,cAAc,EAAE,mBAAmB,CAAC,CAAC;AAEnD,IAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC,EAAA;AACtD,QAAA,KAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAA,EACrC,KAAK,CAAC,cAAc,CAChB;AAET,QAAA,KAAA,CAAA,aAAA,CAAC,cAAc,EACX,EAAA,IAAI,EAAC,gBAAgB,EACrB,KAAK,EAAC,SAAS,EACf,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE;AAC9B,gBAAA,CAAC,MAAM,CAAC,eAAe,GAAG,CAAC,MAAM;AACjC,gBAAA,CAAC,MAAM,CAAC,qBAAqB,GAAG,MAAM;AACzC,aAAA,CAAC,EAED,EAAA,KAAK,CAAC,oBAAoB,CACd;AAEjB,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,aAAa,EAAE,EAAE,CAAC,MAAM,CAAC,eAAe,GAAG,CAAC,MAAM,EAAE,CAAC,EAAA;AAC3E,YAAA,KAAA,CAAA,aAAA,CAAC,eAAe,EAAA,EACZ,QAAQ,EAAE,CAAC,GAAG,QAAQ,GAAG,iBAAiB,EAC1C,SAAS,EAAE,MAAM,CAAC,MAAM,EAC1B,CAAA;AACF,YAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,MAAM,CAAC,WAAW,EAAG,EAAA,iBAAiB,CAAC,QAAQ,CAAC,CAAQ,CACvE,CACJ;AAEd;;;;"}
1
+ {"version":3,"file":"component.js","sources":["../../../../src/components/screens/temp-block/component.tsx"],"sourcesContent":["import React, { type FC, useContext, useEffect } from 'react';\nimport cn from 'classnames';\n\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { ConfirmationContext } from '../../../context';\nimport { formatMsAsMinutes, useCountdown } from '../../../utils';\nimport { CountdownLoader } from '../../countdown-loader';\nimport { Header } from '../../header';\n\nimport styles from './index.module.css';\n\nexport type TempBlockProps = {\n /**\n * Отображать в мобильной версии экран компонента\n */\n mobile?: boolean;\n};\n\nexport const TempBlock: FC<TempBlockProps> = ({ mobile }) => {\n const {\n alignContent,\n titleTag,\n texts,\n tempBlockDuration,\n onChangeScreen,\n onTempBlockFinished,\n } = useContext(ConfirmationContext);\n\n const [timeLeft, startTimer] = useCountdown(tempBlockDuration);\n\n useEffect(() => {\n startTimer();\n }, [startTimer]);\n\n useEffect(() => {\n if (timeLeft === 0 && onTempBlockFinished) {\n onTempBlockFinished();\n }\n }, [timeLeft, onChangeScreen, onTempBlockFinished]);\n\n return (\n <div className={cn(styles.component, styles[alignContent])}>\n <Header mobile={mobile} titleTag={titleTag}>\n {texts.tempBlockTitle}\n </Header>\n\n <TypographyText\n view='primary-medium'\n color='primary'\n className={cn(styles.description, {\n [styles.typographyTheme]: !mobile,\n [styles.typographyThemeMobile]: mobile,\n })}\n >\n {texts.tempBlockDescription}\n </TypographyText>\n\n <div className={cn(styles.countdownWrap, { [styles.typographyTheme]: !mobile })}>\n <CountdownLoader\n progress={1 - timeLeft / tempBlockDuration}\n className={styles.loader}\n />\n <time className={styles.timeCounter}>{formatMsAsMinutes(timeLeft)}</time>\n </div>\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;MAmBa,SAAS,GAAuB,CAAC,EAAE,MAAM,EAAE,KAAI;AACxD,IAAA,MAAM,EACF,YAAY,EACZ,QAAQ,EACR,KAAK,EACL,iBAAiB,EACjB,cAAc,EACd,mBAAmB,GACtB,GAAG,UAAU,CAAC,mBAAmB,CAAC;IAEnC,MAAM,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG,YAAY,CAAC,iBAAiB,CAAC;IAE9D,SAAS,CAAC,MAAK;AACX,QAAA,UAAU,EAAE;AAChB,KAAC,EAAE,CAAC,UAAU,CAAC,CAAC;IAEhB,SAAS,CAAC,MAAK;AACX,QAAA,IAAI,QAAQ,KAAK,CAAC,IAAI,mBAAmB,EAAE;AACvC,YAAA,mBAAmB,EAAE;;KAE5B,EAAE,CAAC,QAAQ,EAAE,cAAc,EAAE,mBAAmB,CAAC,CAAC;AAEnD,IAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC,EAAA;AACtD,QAAA,KAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAA,EACrC,KAAK,CAAC,cAAc,CAChB;AAET,QAAA,KAAA,CAAA,aAAA,CAAC,cAAc,EACX,EAAA,IAAI,EAAC,gBAAgB,EACrB,KAAK,EAAC,SAAS,EACf,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE;AAC9B,gBAAA,CAAC,MAAM,CAAC,eAAe,GAAG,CAAC,MAAM;AACjC,gBAAA,CAAC,MAAM,CAAC,qBAAqB,GAAG,MAAM;AACzC,aAAA,CAAC,EAED,EAAA,KAAK,CAAC,oBAAoB,CACd;AAEjB,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,aAAa,EAAE,EAAE,CAAC,MAAM,CAAC,eAAe,GAAG,CAAC,MAAM,EAAE,CAAC,EAAA;AAC3E,YAAA,KAAA,CAAA,aAAA,CAAC,eAAe,EAAA,EACZ,QAAQ,EAAE,CAAC,GAAG,QAAQ,GAAG,iBAAiB,EAC1C,SAAS,EAAE,MAAM,CAAC,MAAM,EAC1B,CAAA;AACF,YAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,MAAM,CAAC,WAAW,EAAG,EAAA,iBAAiB,CAAC,QAAQ,CAAC,CAAQ,CACvE,CACJ;AAEd;;;;"}
@@ -1,5 +1,5 @@
1
1
  import { type FC } from 'react';
2
- export declare type TempBlockOverProps = {
2
+ export type TempBlockOverProps = {
3
3
  /**
4
4
  * Отображать в мобильной версии экран компонента
5
5
  */
@@ -1,3 +1,2 @@
1
- /// <reference types="react" />
2
1
  import { type TConfirmationContext } from './types';
3
2
  export declare const ConfirmationContext: import("react").Context<TConfirmationContext>;
@@ -1,4 +1,4 @@
1
1
  import { type FC } from 'react';
2
2
  import { type ConfirmationProps } from '../types';
3
- export declare type DesktopConfirmationProps = Omit<ConfirmationProps, 'mobile' | 'breakpoint'>;
3
+ export type DesktopConfirmationProps = Omit<ConfirmationProps, 'mobile' | 'breakpoint'>;
4
4
  export declare const ConfirmationDesktop: FC<DesktopConfirmationProps>;
@@ -1,4 +1,4 @@
1
1
  import { type FC } from 'react';
2
2
  import { type ConfirmationProps } from '../types';
3
- export declare type MobileConfirmationProps = Omit<ConfirmationProps, 'mobile'>;
3
+ export type MobileConfirmationProps = Omit<ConfirmationProps, 'mobile'>;
4
4
  export declare const ConfirmationMobile: FC<MobileConfirmationProps>;
@@ -118,7 +118,7 @@ export interface ConfirmationProps {
118
118
  */
119
119
  errorVisibleDuration?: number;
120
120
  }
121
- export declare type TConfirmationContext = Required<Pick<ConfirmationProps, 'alignContent' | 'titleTag' | 'texts' | 'state' | 'screen' | 'requiredCharAmount' | 'onInputFinished' | 'countdownDuration' | 'onChangeState' | 'onSmsRetryClick' | 'onChangeScreen' | 'onFatalErrorOkButtonClick' | 'tempBlockDuration' | 'hideCountdownSection'>> & Pick<ConfirmationProps, 'phone' | 'blockSmsRetry' | 'onTempBlockFinished' | 'clearCodeOnError' | 'initialScreenHintSlot' | 'errorVisibleDuration' | 'breakpoint' | 'client'> & {
121
+ export type TConfirmationContext = Required<Pick<ConfirmationProps, 'alignContent' | 'titleTag' | 'texts' | 'state' | 'screen' | 'requiredCharAmount' | 'onInputFinished' | 'countdownDuration' | 'onChangeState' | 'onSmsRetryClick' | 'onChangeScreen' | 'onFatalErrorOkButtonClick' | 'tempBlockDuration' | 'hideCountdownSection'>> & Pick<ConfirmationProps, 'phone' | 'blockSmsRetry' | 'onTempBlockFinished' | 'clearCodeOnError' | 'initialScreenHintSlot' | 'errorVisibleDuration' | 'breakpoint' | 'client'> & {
122
122
  timeLeft: number;
123
123
  };
124
124
  export interface ConfirmationTexts {
@@ -163,8 +163,8 @@ export interface ConfirmationTexts {
163
163
  tempBlockOverDescription?: ReactNode;
164
164
  tempBlockOverButton?: string;
165
165
  }
166
- export declare type ConfirmationScreen = 'INITIAL' | 'HINT' | 'FATAL_ERROR' | 'TEMP_BLOCK' | 'TEMP_BLOCK_OVER';
167
- export declare type ConfirmationState = 'INITIAL' | 'CODE_CHECKING' | 'CODE_SENDING' | 'CODE_ERROR' | 'CODE_EXPIRED' | 'CODE_EXPIRED_ENDED';
166
+ export type ConfirmationScreen = 'INITIAL' | 'HINT' | 'FATAL_ERROR' | 'TEMP_BLOCK' | 'TEMP_BLOCK_OVER';
167
+ export type ConfirmationState = 'INITIAL' | 'CODE_CHECKING' | 'CODE_SENDING' | 'CODE_ERROR' | 'CODE_EXPIRED' | 'CODE_EXPIRED_ENDED';
168
168
  export interface ScreensMap {
169
169
  [key: string]: ComponentType;
170
170
  }
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { type ConfirmationProps } from './types';
3
2
  /**
4
3
  * Форматирование миллисекунд в hh:mm:ss.
@@ -7,14 +6,14 @@ import { type ConfirmationProps } from './types';
7
6
  * @returns {String} время в формате mm:ss
8
7
  */
9
8
  export declare function formatMsAsMinutes(ms: number): string;
10
- declare type UseCountdown = (countdownDuration: number, tick?: number) => [number, () => void, () => void];
9
+ type UseCountdown = (countdownDuration: number, tick?: number) => [number, () => void, () => void];
11
10
  /**
12
11
  * Возвращает время, которое осталось до истечения таймера в ms
13
12
  */
14
13
  export declare const useCountdown: UseCountdown;
15
14
  export declare const ONE_DAY: number;
16
15
  export declare const ONE_MINUTE: number;
17
- declare type UseConfirmationParams = {
16
+ type UseConfirmationParams = {
18
17
  state?: ConfirmationProps['state'];
19
18
  screen?: ConfirmationProps['screen'];
20
19
  blockSmsRetry?: ConfirmationProps['blockSmsRetry'];
@@ -1 +1 @@
1
- {"version":3,"file":"utils.js","sources":["../src/utils.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { type ConfirmationProps } from './types';\n\n/**\n * Форматирование миллисекунд в hh:mm:ss.\n *\n * @param {Number} ms миллисекунды\n * @returns {String} время в формате mm:ss\n */\nexport function formatMsAsMinutes(ms: number) {\n const totalSeconds = Math.ceil(ms / 1000);\n const totalMinutes = Math.floor(totalSeconds / 60);\n const totalHours = Math.floor(totalMinutes / 60);\n\n const seconds = totalSeconds % 60;\n const paddedSeconds = `00${seconds}`.slice(-2);\n\n if (totalHours > 0) {\n const minutes = totalMinutes % 60;\n\n const paddedMinutes = `00${minutes}`.slice(-2);\n const paddedHours = `00${totalHours}`.slice(-2);\n\n return `${paddedHours}:${paddedMinutes}:${paddedSeconds}`;\n }\n\n const paddedMinutes = `00${totalMinutes}`.slice(-2);\n\n return `${paddedMinutes}:${paddedSeconds}`;\n}\n\ntype UseCountdown = (countdownDuration: number, tick?: number) => [number, () => void, () => void];\n\n/**\n * Возвращает время, которое осталось до истечения таймера в ms\n */\nexport const useCountdown: UseCountdown = (countdownDuration, tick = 1000) => {\n const timerId = useRef(0);\n\n const start = useRef(0);\n\n const [timePassed, setTimePassed] = useState(0);\n\n const stopTimer = useCallback(() => {\n window.clearInterval(timerId.current);\n }, []);\n\n const updateProgress = useCallback(() => {\n const passed = Date.now() - start.current;\n\n if (passed >= countdownDuration) {\n stopTimer();\n\n setTimePassed(countdownDuration);\n } else {\n setTimePassed(passed);\n }\n }, [countdownDuration, stopTimer]);\n\n const startTimer = useCallback(() => {\n stopTimer();\n\n start.current = Date.now();\n\n updateProgress();\n\n timerId.current = window.setInterval(updateProgress, tick);\n }, [stopTimer, updateProgress, tick]);\n\n const timeLeft = countdownDuration - timePassed;\n\n useEffect(\n () => () => {\n stopTimer();\n },\n [stopTimer],\n );\n\n return [timeLeft, startTimer, stopTimer];\n};\n\nexport const ONE_DAY = 24 * 60 * 60 * 1000;\nexport const ONE_MINUTE = 60 * 1000;\n\ntype UseConfirmationParams = {\n state?: ConfirmationProps['state'];\n screen?: ConfirmationProps['screen'];\n blockSmsRetry?: ConfirmationProps['blockSmsRetry'];\n};\n\nexport const useConfirmation = ({ state, screen, blockSmsRetry }: UseConfirmationParams = {}) => {\n const [confirmationState, setConfirmationState] = useState(state ?? 'INITIAL');\n const [confirmationScreen, setConfirmationScreen] = useState(screen ?? 'INITIAL');\n const [confirmationBlockSmsRetry, setConfirmationBlockSmsRetry] = useState(\n blockSmsRetry ?? false,\n );\n\n return {\n confirmationState,\n confirmationScreen,\n confirmationBlockSmsRetry,\n setConfirmationState,\n setConfirmationScreen,\n setConfirmationBlockSmsRetry,\n };\n};\n\nconst NON_NUMBER_OR_PLUS_REGEXP = new RegExp(/[^\\d+]/g);\n\n/**\n * @returns ссылку для набора номера\n */\nexport function getPhoneHref(phone: string): string {\n return `tel:${phone.replace(NON_NUMBER_OR_PLUS_REGEXP, '')}`;\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"utils.js","sources":["../src/utils.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { type ConfirmationProps } from './types';\n\n/**\n * Форматирование миллисекунд в hh:mm:ss.\n *\n * @param {Number} ms миллисекунды\n * @returns {String} время в формате mm:ss\n */\nexport function formatMsAsMinutes(ms: number) {\n const totalSeconds = Math.ceil(ms / 1000);\n const totalMinutes = Math.floor(totalSeconds / 60);\n const totalHours = Math.floor(totalMinutes / 60);\n\n const seconds = totalSeconds % 60;\n const paddedSeconds = `00${seconds}`.slice(-2);\n\n if (totalHours > 0) {\n const minutes = totalMinutes % 60;\n\n const paddedMinutes = `00${minutes}`.slice(-2);\n const paddedHours = `00${totalHours}`.slice(-2);\n\n return `${paddedHours}:${paddedMinutes}:${paddedSeconds}`;\n }\n\n const paddedMinutes = `00${totalMinutes}`.slice(-2);\n\n return `${paddedMinutes}:${paddedSeconds}`;\n}\n\ntype UseCountdown = (countdownDuration: number, tick?: number) => [number, () => void, () => void];\n\n/**\n * Возвращает время, которое осталось до истечения таймера в ms\n */\nexport const useCountdown: UseCountdown = (countdownDuration, tick = 1000) => {\n const timerId = useRef(0);\n\n const start = useRef(0);\n\n const [timePassed, setTimePassed] = useState(0);\n\n const stopTimer = useCallback(() => {\n window.clearInterval(timerId.current);\n }, []);\n\n const updateProgress = useCallback(() => {\n const passed = Date.now() - start.current;\n\n if (passed >= countdownDuration) {\n stopTimer();\n\n setTimePassed(countdownDuration);\n } else {\n setTimePassed(passed);\n }\n }, [countdownDuration, stopTimer]);\n\n const startTimer = useCallback(() => {\n stopTimer();\n\n start.current = Date.now();\n\n updateProgress();\n\n timerId.current = window.setInterval(updateProgress, tick);\n }, [stopTimer, updateProgress, tick]);\n\n const timeLeft = countdownDuration - timePassed;\n\n useEffect(\n () => () => {\n stopTimer();\n },\n [stopTimer],\n );\n\n return [timeLeft, startTimer, stopTimer];\n};\n\nexport const ONE_DAY = 24 * 60 * 60 * 1000;\nexport const ONE_MINUTE = 60 * 1000;\n\ntype UseConfirmationParams = {\n state?: ConfirmationProps['state'];\n screen?: ConfirmationProps['screen'];\n blockSmsRetry?: ConfirmationProps['blockSmsRetry'];\n};\n\nexport const useConfirmation = ({ state, screen, blockSmsRetry }: UseConfirmationParams = {}) => {\n const [confirmationState, setConfirmationState] = useState(state ?? 'INITIAL');\n const [confirmationScreen, setConfirmationScreen] = useState(screen ?? 'INITIAL');\n const [confirmationBlockSmsRetry, setConfirmationBlockSmsRetry] = useState(\n blockSmsRetry ?? false,\n );\n\n return {\n confirmationState,\n confirmationScreen,\n confirmationBlockSmsRetry,\n setConfirmationState,\n setConfirmationScreen,\n setConfirmationBlockSmsRetry,\n };\n};\n\nconst NON_NUMBER_OR_PLUS_REGEXP = new RegExp(/[^\\d+]/g);\n\n/**\n * @returns ссылку для набора номера\n */\nexport function getPhoneHref(phone: string): string {\n return `tel:${phone.replace(NON_NUMBER_OR_PLUS_REGEXP, '')}`;\n}\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-confirmation",
3
- "version": "15.0.3",
3
+ "version": "15.0.4",
4
4
  "description": "Sms confirmation component",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -10,12 +10,12 @@
10
10
  "main": "index.js",
11
11
  "module": "./esm/index.js",
12
12
  "dependencies": {
13
- "@alfalab/core-components-button": "^13.1.0",
14
- "@alfalab/core-components-code-input": "^5.0.2",
15
- "@alfalab/core-components-link": "^7.0.1",
16
- "@alfalab/core-components-mq": "^6.0.2",
17
- "@alfalab/core-components-spinner": "^6.0.2",
18
- "@alfalab/core-components-typography": "^6.0.2",
13
+ "@alfalab/core-components-button": "^13.1.1",
14
+ "@alfalab/core-components-code-input": "^5.0.3",
15
+ "@alfalab/core-components-link": "^7.0.2",
16
+ "@alfalab/core-components-mq": "^6.0.3",
17
+ "@alfalab/core-components-spinner": "^6.0.3",
18
+ "@alfalab/core-components-typography": "^6.0.3",
19
19
  "@alfalab/hooks": "^1.13.1",
20
20
  "classnames": "^2.5.1",
21
21
  "tslib": "^2.4.0"
@@ -29,5 +29,5 @@
29
29
  "directory": "dist"
30
30
  },
31
31
  "themesVersion": "15.0.2",
32
- "varsVersion": "11.0.1"
32
+ "varsVersion": "11.0.2"
33
33
  }
@@ -1,4 +1,4 @@
1
- @import '@alfalab/core-components-vars/src/no-typography-index.css';
1
+ @import '@alfalab/core-components-vars/src/index.css';
2
2
 
3
3
  .component {
4
4
  width: 100%;
@@ -1,4 +1,4 @@
1
- @import '@alfalab/core-components-vars/src/no-typography-index.css';
1
+ @import '@alfalab/core-components-vars/src/index.css';
2
2
 
3
3
  .circle {
4
4
  fill: transparent;
package/src/vars.css CHANGED
@@ -1,4 +1,4 @@
1
- @import '@alfalab/core-components-vars/src/no-typography-index.css';
1
+ @import '@alfalab/core-components-vars/src/index.css';
2
2
 
3
3
  :root {
4
4
  /* text */
package/types.d.ts CHANGED
@@ -118,7 +118,7 @@ export interface ConfirmationProps {
118
118
  */
119
119
  errorVisibleDuration?: number;
120
120
  }
121
- export declare type TConfirmationContext = Required<Pick<ConfirmationProps, 'alignContent' | 'titleTag' | 'texts' | 'state' | 'screen' | 'requiredCharAmount' | 'onInputFinished' | 'countdownDuration' | 'onChangeState' | 'onSmsRetryClick' | 'onChangeScreen' | 'onFatalErrorOkButtonClick' | 'tempBlockDuration' | 'hideCountdownSection'>> & Pick<ConfirmationProps, 'phone' | 'blockSmsRetry' | 'onTempBlockFinished' | 'clearCodeOnError' | 'initialScreenHintSlot' | 'errorVisibleDuration' | 'breakpoint' | 'client'> & {
121
+ export type TConfirmationContext = Required<Pick<ConfirmationProps, 'alignContent' | 'titleTag' | 'texts' | 'state' | 'screen' | 'requiredCharAmount' | 'onInputFinished' | 'countdownDuration' | 'onChangeState' | 'onSmsRetryClick' | 'onChangeScreen' | 'onFatalErrorOkButtonClick' | 'tempBlockDuration' | 'hideCountdownSection'>> & Pick<ConfirmationProps, 'phone' | 'blockSmsRetry' | 'onTempBlockFinished' | 'clearCodeOnError' | 'initialScreenHintSlot' | 'errorVisibleDuration' | 'breakpoint' | 'client'> & {
122
122
  timeLeft: number;
123
123
  };
124
124
  export interface ConfirmationTexts {
@@ -163,8 +163,8 @@ export interface ConfirmationTexts {
163
163
  tempBlockOverDescription?: ReactNode;
164
164
  tempBlockOverButton?: string;
165
165
  }
166
- export declare type ConfirmationScreen = 'INITIAL' | 'HINT' | 'FATAL_ERROR' | 'TEMP_BLOCK' | 'TEMP_BLOCK_OVER';
167
- export declare type ConfirmationState = 'INITIAL' | 'CODE_CHECKING' | 'CODE_SENDING' | 'CODE_ERROR' | 'CODE_EXPIRED' | 'CODE_EXPIRED_ENDED';
166
+ export type ConfirmationScreen = 'INITIAL' | 'HINT' | 'FATAL_ERROR' | 'TEMP_BLOCK' | 'TEMP_BLOCK_OVER';
167
+ export type ConfirmationState = 'INITIAL' | 'CODE_CHECKING' | 'CODE_SENDING' | 'CODE_ERROR' | 'CODE_EXPIRED' | 'CODE_EXPIRED_ENDED';
168
168
  export interface ScreensMap {
169
169
  [key: string]: ComponentType;
170
170
  }
package/utils.d.ts CHANGED
@@ -6,14 +6,14 @@ import { type ConfirmationProps } from './types';
6
6
  * @returns {String} время в формате mm:ss
7
7
  */
8
8
  export declare function formatMsAsMinutes(ms: number): string;
9
- declare type UseCountdown = (countdownDuration: number, tick?: number) => [number, () => void, () => void];
9
+ type UseCountdown = (countdownDuration: number, tick?: number) => [number, () => void, () => void];
10
10
  /**
11
11
  * Возвращает время, которое осталось до истечения таймера в ms
12
12
  */
13
13
  export declare const useCountdown: UseCountdown;
14
14
  export declare const ONE_DAY: number;
15
15
  export declare const ONE_MINUTE: number;
16
- declare type UseConfirmationParams = {
16
+ type UseConfirmationParams = {
17
17
  state?: ConfirmationProps['state'];
18
18
  screen?: ConfirmationProps['screen'];
19
19
  blockSmsRetry?: ConfirmationProps['blockSmsRetry'];
package/utils.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"utils.js","sources":["src/utils.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { type ConfirmationProps } from './types';\n\n/**\n * Форматирование миллисекунд в hh:mm:ss.\n *\n * @param {Number} ms миллисекунды\n * @returns {String} время в формате mm:ss\n */\nexport function formatMsAsMinutes(ms: number) {\n const totalSeconds = Math.ceil(ms / 1000);\n const totalMinutes = Math.floor(totalSeconds / 60);\n const totalHours = Math.floor(totalMinutes / 60);\n\n const seconds = totalSeconds % 60;\n const paddedSeconds = `00${seconds}`.slice(-2);\n\n if (totalHours > 0) {\n const minutes = totalMinutes % 60;\n\n const paddedMinutes = `00${minutes}`.slice(-2);\n const paddedHours = `00${totalHours}`.slice(-2);\n\n return `${paddedHours}:${paddedMinutes}:${paddedSeconds}`;\n }\n\n const paddedMinutes = `00${totalMinutes}`.slice(-2);\n\n return `${paddedMinutes}:${paddedSeconds}`;\n}\n\ntype UseCountdown = (countdownDuration: number, tick?: number) => [number, () => void, () => void];\n\n/**\n * Возвращает время, которое осталось до истечения таймера в ms\n */\nexport const useCountdown: UseCountdown = (countdownDuration, tick = 1000) => {\n const timerId = useRef(0);\n\n const start = useRef(0);\n\n const [timePassed, setTimePassed] = useState(0);\n\n const stopTimer = useCallback(() => {\n window.clearInterval(timerId.current);\n }, []);\n\n const updateProgress = useCallback(() => {\n const passed = Date.now() - start.current;\n\n if (passed >= countdownDuration) {\n stopTimer();\n\n setTimePassed(countdownDuration);\n } else {\n setTimePassed(passed);\n }\n }, [countdownDuration, stopTimer]);\n\n const startTimer = useCallback(() => {\n stopTimer();\n\n start.current = Date.now();\n\n updateProgress();\n\n timerId.current = window.setInterval(updateProgress, tick);\n }, [stopTimer, updateProgress, tick]);\n\n const timeLeft = countdownDuration - timePassed;\n\n useEffect(\n () => () => {\n stopTimer();\n },\n [stopTimer],\n );\n\n return [timeLeft, startTimer, stopTimer];\n};\n\nexport const ONE_DAY = 24 * 60 * 60 * 1000;\nexport const ONE_MINUTE = 60 * 1000;\n\ntype UseConfirmationParams = {\n state?: ConfirmationProps['state'];\n screen?: ConfirmationProps['screen'];\n blockSmsRetry?: ConfirmationProps['blockSmsRetry'];\n};\n\nexport const useConfirmation = ({ state, screen, blockSmsRetry }: UseConfirmationParams = {}) => {\n const [confirmationState, setConfirmationState] = useState(state ?? 'INITIAL');\n const [confirmationScreen, setConfirmationScreen] = useState(screen ?? 'INITIAL');\n const [confirmationBlockSmsRetry, setConfirmationBlockSmsRetry] = useState(\n blockSmsRetry ?? false,\n );\n\n return {\n confirmationState,\n confirmationScreen,\n confirmationBlockSmsRetry,\n setConfirmationState,\n setConfirmationScreen,\n setConfirmationBlockSmsRetry,\n };\n};\n\nconst NON_NUMBER_OR_PLUS_REGEXP = new RegExp(/[^\\d+]/g);\n\n/**\n * @returns ссылку для набора номера\n */\nexport function getPhoneHref(phone: string): string {\n return `tel:${phone.replace(NON_NUMBER_OR_PLUS_REGEXP, '')}`;\n}\n"],"names":["useRef","useState","useCallback","useEffect"],"mappings":";;;;;;AAIA;;;;;AAKG;AACG,SAAU,iBAAiB,CAAC,EAAU,EAAA;IACxC,IAAM,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC;IACzC,IAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,GAAG,EAAE,CAAC;IAClD,IAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,GAAG,EAAE,CAAC;AAEhD,IAAA,IAAM,OAAO,GAAG,YAAY,GAAG,EAAE;IACjC,IAAM,aAAa,GAAG,IAAA,CAAA,MAAA,CAAK,OAAO,CAAE,CAAC,KAAK,CAAC,EAAE,CAAC;IAE9C,IAAI,UAAU,GAAG,CAAC,EAAE;AAChB,QAAA,IAAM,OAAO,GAAG,YAAY,GAAG,EAAE;QAEjC,IAAM,eAAa,GAAG,IAAA,CAAA,MAAA,CAAK,OAAO,CAAE,CAAC,KAAK,CAAC,EAAE,CAAC;QAC9C,IAAM,WAAW,GAAG,IAAA,CAAA,MAAA,CAAK,UAAU,CAAE,CAAC,KAAK,CAAC,EAAE,CAAC;AAE/C,QAAA,OAAO,UAAG,WAAW,EAAA,GAAA,CAAA,CAAA,MAAA,CAAI,eAAa,EAAI,GAAA,CAAA,CAAA,MAAA,CAAA,aAAa,CAAE;AAC5D;IAED,IAAM,aAAa,GAAG,IAAA,CAAA,MAAA,CAAK,YAAY,CAAE,CAAC,KAAK,CAAC,EAAE,CAAC;AAEnD,IAAA,OAAO,EAAG,CAAA,MAAA,CAAA,aAAa,EAAI,GAAA,CAAA,CAAA,MAAA,CAAA,aAAa,CAAE;AAC9C;AAIA;;AAEG;AACU,IAAA,YAAY,GAAiB,UAAC,iBAAiB,EAAE,IAAW,EAAA;AAAX,IAAA,IAAA,IAAA,KAAA,MAAA,EAAA,EAAA,IAAW,GAAA,IAAA,CAAA;AACrE,IAAA,IAAM,OAAO,GAAGA,YAAM,CAAC,CAAC,CAAC;AAEzB,IAAA,IAAM,KAAK,GAAGA,YAAM,CAAC,CAAC,CAAC;IAEjB,IAAA,EAAA,GAA8BC,cAAQ,CAAC,CAAC,CAAC,EAAxC,UAAU,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,aAAa,GAAA,EAAA,CAAA,CAAA,CAAe;IAE/C,IAAM,SAAS,GAAGC,iBAAW,CAAC,YAAA;AAC1B,QAAA,MAAM,CAAC,aAAa,CAAC,OAAO,CAAC,OAAO,CAAC;KACxC,EAAE,EAAE,CAAC;IAEN,IAAM,cAAc,GAAGA,iBAAW,CAAC,YAAA;QAC/B,IAAM,MAAM,GAAG,IAAI,CAAC,GAAG,EAAE,GAAG,KAAK,CAAC,OAAO;QAEzC,IAAI,MAAM,IAAI,iBAAiB,EAAE;AAC7B,YAAA,SAAS,EAAE;YAEX,aAAa,CAAC,iBAAiB,CAAC;AACnC;AAAM,aAAA;YACH,aAAa,CAAC,MAAM,CAAC;AACxB;AACL,KAAC,EAAE,CAAC,iBAAiB,EAAE,SAAS,CAAC,CAAC;IAElC,IAAM,UAAU,GAAGA,iBAAW,CAAC,YAAA;AAC3B,QAAA,SAAS,EAAE;AAEX,QAAA,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,EAAE;AAE1B,QAAA,cAAc,EAAE;QAEhB,OAAO,CAAC,OAAO,GAAG,MAAM,CAAC,WAAW,CAAC,cAAc,EAAE,IAAI,CAAC;KAC7D,EAAE,CAAC,SAAS,EAAE,cAAc,EAAE,IAAI,CAAC,CAAC;AAErC,IAAA,IAAM,QAAQ,GAAG,iBAAiB,GAAG,UAAU;IAE/CC,eAAS,CACL,cAAM,OAAA,YAAA;AACF,QAAA,SAAS,EAAE;AACf,KAAC,GAAA,EACD,CAAC,SAAS,CAAC,CACd;AAED,IAAA,OAAO,CAAC,QAAQ,EAAE,UAAU,EAAE,SAAS,CAAC;AAC5C;AAEa,IAAA,OAAO,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG;AACzB,IAAA,UAAU,GAAG,EAAE,GAAG;AAQxB,IAAM,eAAe,GAAG,UAAC,EAA4D,EAAA;QAA5D,EAA0D,GAAA,EAAA,KAAA,MAAA,GAAA,EAAE,GAAA,EAAA,EAA1D,KAAK,GAAA,EAAA,CAAA,KAAA,EAAE,MAAM,GAAA,EAAA,CAAA,MAAA,EAAE,aAAa,GAAA,EAAA,CAAA,aAAA;AACpD,IAAA,IAAA,KAA4CF,cAAQ,CAAC,KAAK,KAAA,IAAA,IAAL,KAAK,KAAL,MAAA,GAAA,KAAK,GAAI,SAAS,CAAC,EAAvE,iBAAiB,QAAA,EAAE,oBAAoB,QAAgC;AACxE,IAAA,IAAA,KAA8CA,cAAQ,CAAC,MAAM,KAAA,IAAA,IAAN,MAAM,KAAN,MAAA,GAAA,MAAM,GAAI,SAAS,CAAC,EAA1E,kBAAkB,QAAA,EAAE,qBAAqB,QAAiC;AAC3E,IAAA,IAAA,KAA4DA,cAAQ,CACtE,aAAa,KAAA,IAAA,IAAb,aAAa,KAAb,MAAA,GAAA,aAAa,GAAI,KAAK,CACzB,EAFM,yBAAyB,QAAA,EAAE,4BAA4B,QAE7D;IAED,OAAO;AACH,QAAA,iBAAiB,EAAA,iBAAA;AACjB,QAAA,kBAAkB,EAAA,kBAAA;AAClB,QAAA,yBAAyB,EAAA,yBAAA;AACzB,QAAA,oBAAoB,EAAA,oBAAA;AACpB,QAAA,qBAAqB,EAAA,qBAAA;AACrB,QAAA,4BAA4B,EAAA,4BAAA;KAC/B;AACL;AAEA,IAAM,yBAAyB,GAAG,IAAI,MAAM,CAAC,SAAS,CAAC;AAEvD;;AAEG;AACG,SAAU,YAAY,CAAC,KAAa,EAAA;IACtC,OAAO,MAAA,CAAA,MAAA,CAAO,KAAK,CAAC,OAAO,CAAC,yBAAyB,EAAE,EAAE,CAAC,CAAE;AAChE;;;;;;;;;"}
1
+ {"version":3,"file":"utils.js","sources":["src/utils.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { type ConfirmationProps } from './types';\n\n/**\n * Форматирование миллисекунд в hh:mm:ss.\n *\n * @param {Number} ms миллисекунды\n * @returns {String} время в формате mm:ss\n */\nexport function formatMsAsMinutes(ms: number) {\n const totalSeconds = Math.ceil(ms / 1000);\n const totalMinutes = Math.floor(totalSeconds / 60);\n const totalHours = Math.floor(totalMinutes / 60);\n\n const seconds = totalSeconds % 60;\n const paddedSeconds = `00${seconds}`.slice(-2);\n\n if (totalHours > 0) {\n const minutes = totalMinutes % 60;\n\n const paddedMinutes = `00${minutes}`.slice(-2);\n const paddedHours = `00${totalHours}`.slice(-2);\n\n return `${paddedHours}:${paddedMinutes}:${paddedSeconds}`;\n }\n\n const paddedMinutes = `00${totalMinutes}`.slice(-2);\n\n return `${paddedMinutes}:${paddedSeconds}`;\n}\n\ntype UseCountdown = (countdownDuration: number, tick?: number) => [number, () => void, () => void];\n\n/**\n * Возвращает время, которое осталось до истечения таймера в ms\n */\nexport const useCountdown: UseCountdown = (countdownDuration, tick = 1000) => {\n const timerId = useRef(0);\n\n const start = useRef(0);\n\n const [timePassed, setTimePassed] = useState(0);\n\n const stopTimer = useCallback(() => {\n window.clearInterval(timerId.current);\n }, []);\n\n const updateProgress = useCallback(() => {\n const passed = Date.now() - start.current;\n\n if (passed >= countdownDuration) {\n stopTimer();\n\n setTimePassed(countdownDuration);\n } else {\n setTimePassed(passed);\n }\n }, [countdownDuration, stopTimer]);\n\n const startTimer = useCallback(() => {\n stopTimer();\n\n start.current = Date.now();\n\n updateProgress();\n\n timerId.current = window.setInterval(updateProgress, tick);\n }, [stopTimer, updateProgress, tick]);\n\n const timeLeft = countdownDuration - timePassed;\n\n useEffect(\n () => () => {\n stopTimer();\n },\n [stopTimer],\n );\n\n return [timeLeft, startTimer, stopTimer];\n};\n\nexport const ONE_DAY = 24 * 60 * 60 * 1000;\nexport const ONE_MINUTE = 60 * 1000;\n\ntype UseConfirmationParams = {\n state?: ConfirmationProps['state'];\n screen?: ConfirmationProps['screen'];\n blockSmsRetry?: ConfirmationProps['blockSmsRetry'];\n};\n\nexport const useConfirmation = ({ state, screen, blockSmsRetry }: UseConfirmationParams = {}) => {\n const [confirmationState, setConfirmationState] = useState(state ?? 'INITIAL');\n const [confirmationScreen, setConfirmationScreen] = useState(screen ?? 'INITIAL');\n const [confirmationBlockSmsRetry, setConfirmationBlockSmsRetry] = useState(\n blockSmsRetry ?? false,\n );\n\n return {\n confirmationState,\n confirmationScreen,\n confirmationBlockSmsRetry,\n setConfirmationState,\n setConfirmationScreen,\n setConfirmationBlockSmsRetry,\n };\n};\n\nconst NON_NUMBER_OR_PLUS_REGEXP = new RegExp(/[^\\d+]/g);\n\n/**\n * @returns ссылку для набора номера\n */\nexport function getPhoneHref(phone: string): string {\n return `tel:${phone.replace(NON_NUMBER_OR_PLUS_REGEXP, '')}`;\n}\n"],"names":["useRef","useState","useCallback","useEffect"],"mappings":"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"}