@alfalab/core-components-pattern-lock-v1 3.0.3 → 3.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 (56) hide show
  1. package/components/base-pattern-lock/Component.js.map +1 -1
  2. package/components/base-pattern-lock/index.css +5 -5
  3. package/components/base-pattern-lock/index.module.css.js +1 -1
  4. package/components/base-pattern-lock/index.module.css.js.map +1 -1
  5. package/cssm/components/base-pattern-lock/Component.js.map +1 -1
  6. package/cssm/hooks/use-pattern-lock-cleanup.js.map +1 -1
  7. package/cssm/typings.d.ts +5 -5
  8. package/cssm/utils.d.ts +1 -1
  9. package/cssm/utils.js.map +1 -1
  10. package/desktop/desktop.css +3 -3
  11. package/desktop/desktop.module.css.js +1 -1
  12. package/desktop/desktop.module.css.js.map +1 -1
  13. package/esm/components/base-pattern-lock/Component.js.map +1 -1
  14. package/esm/components/base-pattern-lock/index.css +5 -5
  15. package/esm/components/base-pattern-lock/index.module.css.js +1 -1
  16. package/esm/components/base-pattern-lock/index.module.css.js.map +1 -1
  17. package/esm/desktop/desktop.css +3 -3
  18. package/esm/desktop/desktop.module.css.js +1 -1
  19. package/esm/desktop/desktop.module.css.js.map +1 -1
  20. package/esm/hooks/use-pattern-lock-cleanup.js.map +1 -1
  21. package/esm/mobile/mobile.css +6 -6
  22. package/esm/mobile/mobile.module.css.js +1 -1
  23. package/esm/mobile/mobile.module.css.js.map +1 -1
  24. package/esm/typings.d.ts +5 -5
  25. package/esm/utils.d.ts +1 -1
  26. package/esm/utils.js.map +1 -1
  27. package/hooks/use-pattern-lock-cleanup.js.map +1 -1
  28. package/mobile/mobile.css +6 -6
  29. package/mobile/mobile.module.css.js +1 -1
  30. package/mobile/mobile.module.css.js.map +1 -1
  31. package/modern/components/base-pattern-lock/Component.js.map +1 -1
  32. package/modern/components/base-pattern-lock/index.css +5 -5
  33. package/modern/components/base-pattern-lock/index.module.css.js +1 -1
  34. package/modern/components/base-pattern-lock/index.module.css.js.map +1 -1
  35. package/modern/desktop/desktop.css +3 -3
  36. package/modern/desktop/desktop.module.css.js +1 -1
  37. package/modern/desktop/desktop.module.css.js.map +1 -1
  38. package/modern/hooks/use-pattern-lock-cleanup.js.map +1 -1
  39. package/modern/mobile/mobile.css +6 -6
  40. package/modern/mobile/mobile.module.css.js +1 -1
  41. package/modern/mobile/mobile.module.css.js.map +1 -1
  42. package/modern/typings.d.ts +5 -5
  43. package/modern/utils.d.ts +1 -1
  44. package/modern/utils.js.map +1 -1
  45. package/moderncssm/components/base-pattern-lock/Component.js.map +1 -1
  46. package/moderncssm/hooks/use-pattern-lock-cleanup.js.map +1 -1
  47. package/moderncssm/typings.d.ts +5 -5
  48. package/moderncssm/utils.d.ts +1 -1
  49. package/moderncssm/utils.js.map +1 -1
  50. package/package.json +5 -5
  51. package/src/components/base-pattern-lock/index.module.css +1 -1
  52. package/src/desktop/desktop.module.css +1 -1
  53. package/src/mobile/mobile.module.css +1 -1
  54. package/typings.d.ts +5 -5
  55. package/utils.d.ts +1 -1
  56. package/utils.js.map +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"Component.js","sources":["../../src/components/base-pattern-lock/Component.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useState } from 'react';\nimport {\n ReactCanvasPatternLock,\n type Theme,\n type TPatternLockInstance,\n} from 'react-canvas-pattern-lock';\nimport cn from 'classnames';\n\nimport { ButtonMobile } from '@alfalab/core-components-button/mobile';\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport {\n DEFAULT_EXTRA_BOUNDS,\n OBSERVABLE_TOKENS,\n OBSERVE_OPTIONS,\n THEME_STATE,\n} from '../../consts';\nimport { type CommonPatternLockProps, type PrivatePatternLockProps } from '../../typings';\nimport { getColorByToken, getDefaultObserveTarget, getSizes, getTheme } from '../../utils';\n\nimport commonStyles from './index.module.css';\n\nexport const BasePatternLock = forwardRef<\n TPatternLockInstance,\n CommonPatternLockProps & PrivatePatternLockProps\n>(\n (\n {\n observeTokens = false,\n observerParams = {},\n justifyNodes = 'space-between',\n className,\n error,\n dataTestId,\n forgotCodeBtnText = 'Забыли код?',\n showForgotCodeBtn = false,\n onForgotBtnClick,\n extraBounds = DEFAULT_EXTRA_BOUNDS,\n message,\n messageClassName,\n hover,\n styles = {},\n ...restProps\n },\n ref,\n ) => {\n const [params, setParams] = useState<\n { theme: Theme; width: number; height: number } | undefined\n >();\n\n useEffect(() => {\n const { elementSizes, width, height } = getSizes();\n\n setParams({\n theme: getTheme(elementSizes),\n width,\n height,\n });\n }, []);\n\n useEffect(() => {\n let styleObserver: MutationObserver | null = null;\n\n if (observeTokens) {\n const { options = OBSERVE_OPTIONS, getTarget = getDefaultObserveTarget } =\n observerParams;\n\n styleObserver = new MutationObserver(() =>\n setParams((prevState) => {\n const { width, height, elementSizes } = getSizes();\n\n if (!prevState) {\n return { theme: getTheme(elementSizes), width, height };\n }\n\n const prevBgColor = prevState.theme[THEME_STATE.INITIAL].colors.bg;\n const themeChanged = prevBgColor !== getColorByToken(OBSERVABLE_TOKENS.BG);\n\n if (themeChanged) return { ...prevState, theme: getTheme(elementSizes) };\n\n return prevState;\n }),\n );\n\n styleObserver.observe(getTarget(), options);\n }\n\n return () => styleObserver?.disconnect();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [observeTokens]);\n\n const renderMessage = () => (\n <div\n className={cn(commonStyles.message, messageClassName)}\n data-test-id={getDataTestId(dataTestId, 'message')}\n >\n {message}\n </div>\n );\n\n const renderError = () => (\n <div\n className={cn(commonStyles.message, commonStyles.error, messageClassName)}\n data-test-id={getDataTestId(dataTestId, 'error')}\n >\n {error}\n </div>\n );\n\n return (\n <div\n className={cn(commonStyles.component, styles.component, className, {\n [commonStyles.hidden]: !params,\n })}\n data-test-id={dataTestId}\n >\n {error ? renderError() : renderMessage()}\n\n <ReactCanvasPatternLock\n {...restProps}\n {...params}\n ref={ref}\n rows={3}\n cols={3}\n justifyNodes={justifyNodes}\n extraBounds={extraBounds}\n hover={hover}\n />\n\n {showForgotCodeBtn ? (\n <ButtonMobile\n view='transparent'\n className={cn(commonStyles.forgotBtn, styles.forgotBtn)}\n onClick={onForgotBtnClick}\n dataTestId={getDataTestId(dataTestId, 'forgot-code-btn')}\n >\n {forgotCodeBtnText}\n </ButtonMobile>\n ) : (\n <div\n className={cn(commonStyles.forgotBtn, styles.forgotBtn, {\n [styles.hiddenBtn]: Boolean(styles.hiddenBtn),\n })}\n />\n )}\n </div>\n );\n },\n);\n"],"names":["forwardRef","DEFAULT_EXTRA_BOUNDS","__rest","useState","useEffect","getSizes","getTheme","OBSERVE_OPTIONS","getDefaultObserveTarget","THEME_STATE","getColorByToken","OBSERVABLE_TOKENS","__assign","React","cn","commonStyles","getDataTestId","ReactCanvasPatternLock","ButtonMobile"],"mappings":"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"}
1
+ {"version":3,"file":"Component.js","sources":["../../src/components/base-pattern-lock/Component.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useState } from 'react';\nimport {\n ReactCanvasPatternLock,\n type Theme,\n type TPatternLockInstance,\n} from 'react-canvas-pattern-lock';\nimport cn from 'classnames';\n\nimport { ButtonMobile } from '@alfalab/core-components-button/mobile';\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport {\n DEFAULT_EXTRA_BOUNDS,\n OBSERVABLE_TOKENS,\n OBSERVE_OPTIONS,\n THEME_STATE,\n} from '../../consts';\nimport { type CommonPatternLockProps, type PrivatePatternLockProps } from '../../typings';\nimport { getColorByToken, getDefaultObserveTarget, getSizes, getTheme } from '../../utils';\n\nimport commonStyles from './index.module.css';\n\nexport const BasePatternLock = forwardRef<\n TPatternLockInstance,\n CommonPatternLockProps & PrivatePatternLockProps\n>(\n (\n {\n observeTokens = false,\n observerParams = {},\n justifyNodes = 'space-between',\n className,\n error,\n dataTestId,\n forgotCodeBtnText = 'Забыли код?',\n showForgotCodeBtn = false,\n onForgotBtnClick,\n extraBounds = DEFAULT_EXTRA_BOUNDS,\n message,\n messageClassName,\n hover,\n styles = {},\n ...restProps\n },\n ref,\n ) => {\n const [params, setParams] = useState<\n { theme: Theme; width: number; height: number } | undefined\n >();\n\n useEffect(() => {\n const { elementSizes, width, height } = getSizes();\n\n setParams({\n theme: getTheme(elementSizes),\n width,\n height,\n });\n }, []);\n\n useEffect(() => {\n let styleObserver: MutationObserver | null = null;\n\n if (observeTokens) {\n const { options = OBSERVE_OPTIONS, getTarget = getDefaultObserveTarget } =\n observerParams;\n\n styleObserver = new MutationObserver(() =>\n setParams((prevState) => {\n const { width, height, elementSizes } = getSizes();\n\n if (!prevState) {\n return { theme: getTheme(elementSizes), width, height };\n }\n\n const prevBgColor = prevState.theme[THEME_STATE.INITIAL].colors.bg;\n const themeChanged = prevBgColor !== getColorByToken(OBSERVABLE_TOKENS.BG);\n\n if (themeChanged) return { ...prevState, theme: getTheme(elementSizes) };\n\n return prevState;\n }),\n );\n\n styleObserver.observe(getTarget(), options);\n }\n\n return () => styleObserver?.disconnect();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [observeTokens]);\n\n const renderMessage = () => (\n <div\n className={cn(commonStyles.message, messageClassName)}\n data-test-id={getDataTestId(dataTestId, 'message')}\n >\n {message}\n </div>\n );\n\n const renderError = () => (\n <div\n className={cn(commonStyles.message, commonStyles.error, messageClassName)}\n data-test-id={getDataTestId(dataTestId, 'error')}\n >\n {error}\n </div>\n );\n\n return (\n <div\n className={cn(commonStyles.component, styles.component, className, {\n [commonStyles.hidden]: !params,\n })}\n data-test-id={dataTestId}\n >\n {error ? renderError() : renderMessage()}\n\n <ReactCanvasPatternLock\n {...restProps}\n {...params}\n ref={ref}\n rows={3}\n cols={3}\n justifyNodes={justifyNodes}\n extraBounds={extraBounds}\n hover={hover}\n />\n\n {showForgotCodeBtn ? (\n <ButtonMobile\n view='transparent'\n className={cn(commonStyles.forgotBtn, styles.forgotBtn)}\n onClick={onForgotBtnClick}\n dataTestId={getDataTestId(dataTestId, 'forgot-code-btn')}\n >\n {forgotCodeBtnText}\n </ButtonMobile>\n ) : (\n <div\n className={cn(commonStyles.forgotBtn, styles.forgotBtn, {\n [styles.hiddenBtn]: Boolean(styles.hiddenBtn),\n })}\n />\n )}\n </div>\n );\n },\n);\n"],"names":["forwardRef","DEFAULT_EXTRA_BOUNDS","__rest","useState","useEffect","getSizes","getTheme","OBSERVE_OPTIONS","getDefaultObserveTarget","THEME_STATE","getColorByToken","OBSERVABLE_TOKENS","__assign","React","cn","commonStyles","getDataTestId","ReactCanvasPatternLock","ButtonMobile"],"mappings":"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"}
@@ -16,14 +16,14 @@
16
16
  :root {
17
17
  --size-xs-height: 40px;
18
18
  }
19
- .pattern-lock-v1__component_4r3ax canvas {
19
+ .pattern-lock-v1__component_17etv canvas {
20
20
  display: block;
21
21
  margin: var(--gap-0) auto;
22
22
  }
23
- .pattern-lock-v1__hidden_4r3ax {
23
+ .pattern-lock-v1__hidden_17etv {
24
24
  visibility: hidden;
25
25
  }
26
- .pattern-lock-v1__message_4r3ax {
26
+ .pattern-lock-v1__message_17etv {
27
27
  font-size: 16px;
28
28
  line-height: 24px;
29
29
  font-weight: 400;
@@ -37,10 +37,10 @@
37
37
  white-space: nowrap;
38
38
  color: var(--color-light-text-primary);
39
39
  }
40
- .pattern-lock-v1__error_4r3ax {
40
+ .pattern-lock-v1__error_17etv {
41
41
  color: var(--color-light-text-negative);
42
42
  }
43
- .pattern-lock-v1__forgotBtn_4r3ax {
43
+ .pattern-lock-v1__forgotBtn_17etv {
44
44
  display: block;
45
45
  min-height: var(--size-xs-height);
46
46
  }
@@ -2,7 +2,7 @@
2
2
 
3
3
  require('./index.css');
4
4
 
5
- var commonStyles = {"component":"pattern-lock-v1__component_4r3ax","hidden":"pattern-lock-v1__hidden_4r3ax","message":"pattern-lock-v1__message_4r3ax","error":"pattern-lock-v1__error_4r3ax","forgotBtn":"pattern-lock-v1__forgotBtn_4r3ax"};
5
+ var commonStyles = {"component":"pattern-lock-v1__component_17etv","hidden":"pattern-lock-v1__hidden_17etv","message":"pattern-lock-v1__message_17etv","error":"pattern-lock-v1__error_17etv","forgotBtn":"pattern-lock-v1__forgotBtn_17etv"};
6
6
 
7
7
  module.exports = commonStyles;
8
8
  //# sourceMappingURL=index.module.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.module.css.js","sources":["../../src/components/base-pattern-lock/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../../vars.css';\n\n.component {\n & canvas {\n display: block;\n margin: var(--gap-0) auto;\n }\n}\n\n.hidden {\n visibility: hidden;\n}\n\n.message {\n @mixin paragraph_primary_medium;\n\n text-align: center;\n padding: var(--gap-0) var(--gap-16) var(--gap-40);\n min-height: 24px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--color-light-text-primary);\n}\n\n.error {\n color: var(--color-light-text-negative);\n}\n\n.forgotBtn {\n display: block;\n min-height: var(--size-xs-height);\n}\n"],"names":[],"mappings":";;;;AAEgB,mBAAe,CAAC,WAAW,CAAC,kCAAkC,CAAC,QAAQ,CAAC,+BAA+B,CAAC,SAAS,CAAC,gCAAgC,CAAC,OAAO,CAAC,8BAA8B,CAAC,WAAW,CAAC,kCAAkC,CAAC;;;;"}
1
+ {"version":3,"file":"index.module.css.js","sources":["../../src/components/base-pattern-lock/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../../vars.css';\n\n.component {\n & canvas {\n display: block;\n margin: var(--gap-0) auto;\n }\n}\n\n.hidden {\n visibility: hidden;\n}\n\n.message {\n @mixin paragraph_primary_medium;\n\n text-align: center;\n padding: var(--gap-0) var(--gap-16) var(--gap-40);\n min-height: 24px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--color-light-text-primary);\n}\n\n.error {\n color: var(--color-light-text-negative);\n}\n\n.forgotBtn {\n display: block;\n min-height: var(--size-xs-height);\n}\n"],"names":[],"mappings":";;;;AAEgB,mBAAe,CAAC,WAAW,CAAC,kCAAkC,CAAC,QAAQ,CAAC,+BAA+B,CAAC,SAAS,CAAC,gCAAgC,CAAC,OAAO,CAAC,8BAA8B,CAAC,WAAW,CAAC,kCAAkC,CAAC;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Component.js","sources":["../../../src/components/base-pattern-lock/Component.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useState } from 'react';\nimport {\n ReactCanvasPatternLock,\n type Theme,\n type TPatternLockInstance,\n} from 'react-canvas-pattern-lock';\nimport cn from 'classnames';\n\nimport { ButtonMobile } from '@alfalab/core-components-button/mobile';\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport {\n DEFAULT_EXTRA_BOUNDS,\n OBSERVABLE_TOKENS,\n OBSERVE_OPTIONS,\n THEME_STATE,\n} from '../../consts';\nimport { type CommonPatternLockProps, type PrivatePatternLockProps } from '../../typings';\nimport { getColorByToken, getDefaultObserveTarget, getSizes, getTheme } from '../../utils';\n\nimport commonStyles from './index.module.css';\n\nexport const BasePatternLock = forwardRef<\n TPatternLockInstance,\n CommonPatternLockProps & PrivatePatternLockProps\n>(\n (\n {\n observeTokens = false,\n observerParams = {},\n justifyNodes = 'space-between',\n className,\n error,\n dataTestId,\n forgotCodeBtnText = 'Забыли код?',\n showForgotCodeBtn = false,\n onForgotBtnClick,\n extraBounds = DEFAULT_EXTRA_BOUNDS,\n message,\n messageClassName,\n hover,\n styles = {},\n ...restProps\n },\n ref,\n ) => {\n const [params, setParams] = useState<\n { theme: Theme; width: number; height: number } | undefined\n >();\n\n useEffect(() => {\n const { elementSizes, width, height } = getSizes();\n\n setParams({\n theme: getTheme(elementSizes),\n width,\n height,\n });\n }, []);\n\n useEffect(() => {\n let styleObserver: MutationObserver | null = null;\n\n if (observeTokens) {\n const { options = OBSERVE_OPTIONS, getTarget = getDefaultObserveTarget } =\n observerParams;\n\n styleObserver = new MutationObserver(() =>\n setParams((prevState) => {\n const { width, height, elementSizes } = getSizes();\n\n if (!prevState) {\n return { theme: getTheme(elementSizes), width, height };\n }\n\n const prevBgColor = prevState.theme[THEME_STATE.INITIAL].colors.bg;\n const themeChanged = prevBgColor !== getColorByToken(OBSERVABLE_TOKENS.BG);\n\n if (themeChanged) return { ...prevState, theme: getTheme(elementSizes) };\n\n return prevState;\n }),\n );\n\n styleObserver.observe(getTarget(), options);\n }\n\n return () => styleObserver?.disconnect();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [observeTokens]);\n\n const renderMessage = () => (\n <div\n className={cn(commonStyles.message, messageClassName)}\n data-test-id={getDataTestId(dataTestId, 'message')}\n >\n {message}\n </div>\n );\n\n const renderError = () => (\n <div\n className={cn(commonStyles.message, commonStyles.error, messageClassName)}\n data-test-id={getDataTestId(dataTestId, 'error')}\n >\n {error}\n </div>\n );\n\n return (\n <div\n className={cn(commonStyles.component, styles.component, className, {\n [commonStyles.hidden]: !params,\n })}\n data-test-id={dataTestId}\n >\n {error ? renderError() : renderMessage()}\n\n <ReactCanvasPatternLock\n {...restProps}\n {...params}\n ref={ref}\n rows={3}\n cols={3}\n justifyNodes={justifyNodes}\n extraBounds={extraBounds}\n hover={hover}\n />\n\n {showForgotCodeBtn ? (\n <ButtonMobile\n view='transparent'\n className={cn(commonStyles.forgotBtn, styles.forgotBtn)}\n onClick={onForgotBtnClick}\n dataTestId={getDataTestId(dataTestId, 'forgot-code-btn')}\n >\n {forgotCodeBtnText}\n </ButtonMobile>\n ) : (\n <div\n className={cn(commonStyles.forgotBtn, styles.forgotBtn, {\n [styles.hiddenBtn]: Boolean(styles.hiddenBtn),\n })}\n />\n )}\n </div>\n );\n },\n);\n"],"names":["forwardRef","DEFAULT_EXTRA_BOUNDS","__rest","useState","useEffect","getSizes","getTheme","OBSERVE_OPTIONS","getDefaultObserveTarget","THEME_STATE","getColorByToken","OBSERVABLE_TOKENS","__assign","React","cn","commonStyles","getDataTestId","ReactCanvasPatternLock","ButtonMobile"],"mappings":"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"}
1
+ {"version":3,"file":"Component.js","sources":["../../../src/components/base-pattern-lock/Component.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useState } from 'react';\nimport {\n ReactCanvasPatternLock,\n type Theme,\n type TPatternLockInstance,\n} from 'react-canvas-pattern-lock';\nimport cn from 'classnames';\n\nimport { ButtonMobile } from '@alfalab/core-components-button/mobile';\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport {\n DEFAULT_EXTRA_BOUNDS,\n OBSERVABLE_TOKENS,\n OBSERVE_OPTIONS,\n THEME_STATE,\n} from '../../consts';\nimport { type CommonPatternLockProps, type PrivatePatternLockProps } from '../../typings';\nimport { getColorByToken, getDefaultObserveTarget, getSizes, getTheme } from '../../utils';\n\nimport commonStyles from './index.module.css';\n\nexport const BasePatternLock = forwardRef<\n TPatternLockInstance,\n CommonPatternLockProps & PrivatePatternLockProps\n>(\n (\n {\n observeTokens = false,\n observerParams = {},\n justifyNodes = 'space-between',\n className,\n error,\n dataTestId,\n forgotCodeBtnText = 'Забыли код?',\n showForgotCodeBtn = false,\n onForgotBtnClick,\n extraBounds = DEFAULT_EXTRA_BOUNDS,\n message,\n messageClassName,\n hover,\n styles = {},\n ...restProps\n },\n ref,\n ) => {\n const [params, setParams] = useState<\n { theme: Theme; width: number; height: number } | undefined\n >();\n\n useEffect(() => {\n const { elementSizes, width, height } = getSizes();\n\n setParams({\n theme: getTheme(elementSizes),\n width,\n height,\n });\n }, []);\n\n useEffect(() => {\n let styleObserver: MutationObserver | null = null;\n\n if (observeTokens) {\n const { options = OBSERVE_OPTIONS, getTarget = getDefaultObserveTarget } =\n observerParams;\n\n styleObserver = new MutationObserver(() =>\n setParams((prevState) => {\n const { width, height, elementSizes } = getSizes();\n\n if (!prevState) {\n return { theme: getTheme(elementSizes), width, height };\n }\n\n const prevBgColor = prevState.theme[THEME_STATE.INITIAL].colors.bg;\n const themeChanged = prevBgColor !== getColorByToken(OBSERVABLE_TOKENS.BG);\n\n if (themeChanged) return { ...prevState, theme: getTheme(elementSizes) };\n\n return prevState;\n }),\n );\n\n styleObserver.observe(getTarget(), options);\n }\n\n return () => styleObserver?.disconnect();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [observeTokens]);\n\n const renderMessage = () => (\n <div\n className={cn(commonStyles.message, messageClassName)}\n data-test-id={getDataTestId(dataTestId, 'message')}\n >\n {message}\n </div>\n );\n\n const renderError = () => (\n <div\n className={cn(commonStyles.message, commonStyles.error, messageClassName)}\n data-test-id={getDataTestId(dataTestId, 'error')}\n >\n {error}\n </div>\n );\n\n return (\n <div\n className={cn(commonStyles.component, styles.component, className, {\n [commonStyles.hidden]: !params,\n })}\n data-test-id={dataTestId}\n >\n {error ? renderError() : renderMessage()}\n\n <ReactCanvasPatternLock\n {...restProps}\n {...params}\n ref={ref}\n rows={3}\n cols={3}\n justifyNodes={justifyNodes}\n extraBounds={extraBounds}\n hover={hover}\n />\n\n {showForgotCodeBtn ? (\n <ButtonMobile\n view='transparent'\n className={cn(commonStyles.forgotBtn, styles.forgotBtn)}\n onClick={onForgotBtnClick}\n dataTestId={getDataTestId(dataTestId, 'forgot-code-btn')}\n >\n {forgotCodeBtnText}\n </ButtonMobile>\n ) : (\n <div\n className={cn(commonStyles.forgotBtn, styles.forgotBtn, {\n [styles.hiddenBtn]: Boolean(styles.hiddenBtn),\n })}\n />\n )}\n </div>\n );\n },\n);\n"],"names":["forwardRef","DEFAULT_EXTRA_BOUNDS","__rest","useState","useEffect","getSizes","getTheme","OBSERVE_OPTIONS","getDefaultObserveTarget","THEME_STATE","getColorByToken","OBSERVABLE_TOKENS","__assign","React","cn","commonStyles","getDataTestId","ReactCanvasPatternLock","ButtonMobile"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"use-pattern-lock-cleanup.js","sources":["../../src/hooks/use-pattern-lock-cleanup.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { type TPatternLockInstance } from 'react-canvas-pattern-lock';\n\nexport const usePatternLockCleanup = (\n patternLockRef: React.MutableRefObject<TPatternLockInstance | null>,\n) => {\n const clear = useMemo(() => {\n if (patternLockRef.current) {\n patternLockRef.current.setInitialState();\n }\n }, [patternLockRef]);\n\n return {\n clear,\n };\n};\n"],"names":["useMemo"],"mappings":";;;;;;AAGO,IAAM,qBAAqB,GAAG,UACjC,cAAmE,EAAA;IAEnE,IAAM,KAAK,GAAGA,aAAO,CAAC,YAAA;QAClB,IAAI,cAAc,CAAC,OAAO,EAAE;AACxB,YAAA,cAAc,CAAC,OAAO,CAAC,eAAe,EAAE;AAC3C;AACL,KAAC,EAAE,CAAC,cAAc,CAAC,CAAC;IAEpB,OAAO;AACH,QAAA,KAAK,EAAA,KAAA;KACR;AACL;;;;"}
1
+ {"version":3,"file":"use-pattern-lock-cleanup.js","sources":["../../src/hooks/use-pattern-lock-cleanup.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { type TPatternLockInstance } from 'react-canvas-pattern-lock';\n\nexport const usePatternLockCleanup = (\n patternLockRef: React.MutableRefObject<TPatternLockInstance | null>,\n) => {\n const clear = useMemo(() => {\n if (patternLockRef.current) {\n patternLockRef.current.setInitialState();\n }\n }, [patternLockRef]);\n\n return {\n clear,\n };\n};\n"],"names":["useMemo"],"mappings":";;;;;;AAGO,IAAM,qBAAqB,GAAG,UACjC,cAAmE,EAAA;IAEnE,IAAM,KAAK,GAAGA,aAAO,CAAC,YAAA;AAClB,QAAA,IAAI,cAAc,CAAC,OAAO,EAAE;AACxB,YAAA,cAAc,CAAC,OAAO,CAAC,eAAe,EAAE;;AAEhD,KAAC,EAAE,CAAC,cAAc,CAAC,CAAC;IAEpB,OAAO;AACH,QAAA,KAAK,EAAA,KAAA;KACR;AACL;;;;"}
package/cssm/typings.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { type MouseEvent, type ReactNode } from 'react';
2
2
  import { type ReactPatternLockProps } from 'react-canvas-pattern-lock';
3
- declare type ConditionalProps = {
3
+ type ConditionalProps = {
4
4
  /**
5
5
  * Показать кнопку "забыли код"
6
6
  * @default "Забыли код?"
@@ -20,7 +20,7 @@ declare type ConditionalProps = {
20
20
  onForgotBtnClick?: never;
21
21
  forgotCodeBtnText?: never;
22
22
  };
23
- export declare type CommonPatternLockProps = {
23
+ export type CommonPatternLockProps = {
24
24
  /**
25
25
  * Дополнительный класс
26
26
  */
@@ -56,7 +56,7 @@ export declare type CommonPatternLockProps = {
56
56
  */
57
57
  messageClassName?: string;
58
58
  } & Omit<ReactPatternLockProps, 'theme' | 'width' | 'height' | 'rows' | 'cols' | 'hover'> & ConditionalProps;
59
- export declare type PrivatePatternLockProps = {
59
+ export type PrivatePatternLockProps = {
60
60
  /**
61
61
  * Включает ховер-эффект
62
62
  */
@@ -68,14 +68,14 @@ export declare type PrivatePatternLockProps = {
68
68
  [key: string]: string;
69
69
  };
70
70
  };
71
- export declare type PatternLockProps = CommonPatternLockProps & {
71
+ export type PatternLockProps = CommonPatternLockProps & {
72
72
  /**
73
73
  * Контрольная точка, с нее начинается desktop версия
74
74
  * @default 1024
75
75
  */
76
76
  breakpoint?: number;
77
77
  };
78
- export declare type ObservableTokens = {
78
+ export type ObservableTokens = {
79
79
  ACCENT_INITIAL: string;
80
80
  ACCENT_SUCCESS: string;
81
81
  ACCENT_FAILURE: string;
package/cssm/utils.d.ts CHANGED
@@ -2,7 +2,7 @@ import { type Theme, type ThemeParams } from 'react-canvas-pattern-lock';
2
2
  export declare function getDefaultObserveTarget(): HTMLHeadElement;
3
3
  export declare function getColorByToken(token: string): string;
4
4
  export declare const getSizes: () => {
5
- elementSizes: ThemeParams['dimens'];
5
+ elementSizes: ThemeParams["dimens"];
6
6
  width: number;
7
7
  height: number;
8
8
  };
package/cssm/utils.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"utils.js","sources":["../src/utils.ts"],"sourcesContent":["import { type Theme, type ThemeParams } from 'react-canvas-pattern-lock';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { OBSERVABLE_TOKENS, THEME_STATE } from './consts';\n\nexport function getDefaultObserveTarget() {\n return document.head;\n}\n\nexport function getColorByToken(token: string) {\n return getComputedStyle(document.documentElement).getPropertyValue(token);\n}\n\nexport const getSizes = (() => {\n const COMMON_SIZES = {\n lineWidth: 6,\n nodeRing: 0,\n nodeCore: 12,\n };\n\n let cachedSize: { elementSizes: ThemeParams['dimens']; width: number; height: number };\n\n return () => {\n if (cachedSize) {\n return cachedSize;\n }\n\n if (window.matchMedia('(min-width: 600px)').matches) {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 32 },\n width: 240,\n height: 240,\n };\n } else if (window.matchMedia('(min-width: 390px)').matches) {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 43 },\n width: 322,\n height: 322,\n };\n } else if (window.matchMedia('(min-width: 360px)').matches) {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 38 },\n width: 292,\n height: 292,\n };\n } else {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 32 },\n width: 240,\n height: 240,\n };\n }\n\n return cachedSize;\n };\n})();\n\nexport function getTheme(dimens: ThemeParams['dimens']): Theme {\n const baseColors = {\n primary: getColorByToken(OBSERVABLE_TOKENS.PRIMARY),\n bg: getColorByToken(OBSERVABLE_TOKENS.BG),\n ringBg: getColorByToken(OBSERVABLE_TOKENS.RING_BG_INITIAL),\n hover: {\n inner: getColorByToken(OBSERVABLE_TOKENS.HOVER_INNER),\n outer: getColorByToken(OBSERVABLE_TOKENS.HOVER_OUTER),\n },\n };\n\n return {\n [THEME_STATE.INITIAL]: {\n colors: {\n ...baseColors,\n accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_INITIAL),\n selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_INITIAL),\n },\n dimens,\n },\n [THEME_STATE.SUCCESS]: {\n colors: {\n ...baseColors,\n accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_SUCCESS),\n selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_SUCCESS),\n },\n dimens,\n },\n [THEME_STATE.FAILURE]: {\n colors: {\n ...baseColors,\n accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_FAILURE),\n selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_FAILURE),\n },\n dimens,\n },\n };\n}\n\nexport function getPatternLockTestIds(dataTestId: string) {\n return {\n patternLock: dataTestId,\n forgotCodeBtn: getDataTestId(dataTestId, 'forgot-code-btn'),\n error: getDataTestId(dataTestId, 'error'),\n message: getDataTestId(dataTestId, 'message'),\n };\n}\n"],"names":["OBSERVABLE_TOKENS","THEME_STATE","__assign","getDataTestId"],"mappings":"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"}
1
+ {"version":3,"file":"utils.js","sources":["../src/utils.ts"],"sourcesContent":["import { type Theme, type ThemeParams } from 'react-canvas-pattern-lock';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { OBSERVABLE_TOKENS, THEME_STATE } from './consts';\n\nexport function getDefaultObserveTarget() {\n return document.head;\n}\n\nexport function getColorByToken(token: string) {\n return getComputedStyle(document.documentElement).getPropertyValue(token);\n}\n\nexport const getSizes = (() => {\n const COMMON_SIZES = {\n lineWidth: 6,\n nodeRing: 0,\n nodeCore: 12,\n };\n\n let cachedSize: { elementSizes: ThemeParams['dimens']; width: number; height: number };\n\n return () => {\n if (cachedSize) {\n return cachedSize;\n }\n\n if (window.matchMedia('(min-width: 600px)').matches) {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 32 },\n width: 240,\n height: 240,\n };\n } else if (window.matchMedia('(min-width: 390px)').matches) {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 43 },\n width: 322,\n height: 322,\n };\n } else if (window.matchMedia('(min-width: 360px)').matches) {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 38 },\n width: 292,\n height: 292,\n };\n } else {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 32 },\n width: 240,\n height: 240,\n };\n }\n\n return cachedSize;\n };\n})();\n\nexport function getTheme(dimens: ThemeParams['dimens']): Theme {\n const baseColors = {\n primary: getColorByToken(OBSERVABLE_TOKENS.PRIMARY),\n bg: getColorByToken(OBSERVABLE_TOKENS.BG),\n ringBg: getColorByToken(OBSERVABLE_TOKENS.RING_BG_INITIAL),\n hover: {\n inner: getColorByToken(OBSERVABLE_TOKENS.HOVER_INNER),\n outer: getColorByToken(OBSERVABLE_TOKENS.HOVER_OUTER),\n },\n };\n\n return {\n [THEME_STATE.INITIAL]: {\n colors: {\n ...baseColors,\n accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_INITIAL),\n selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_INITIAL),\n },\n dimens,\n },\n [THEME_STATE.SUCCESS]: {\n colors: {\n ...baseColors,\n accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_SUCCESS),\n selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_SUCCESS),\n },\n dimens,\n },\n [THEME_STATE.FAILURE]: {\n colors: {\n ...baseColors,\n accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_FAILURE),\n selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_FAILURE),\n },\n dimens,\n },\n };\n}\n\nexport function getPatternLockTestIds(dataTestId: string) {\n return {\n patternLock: dataTestId,\n forgotCodeBtn: getDataTestId(dataTestId, 'forgot-code-btn'),\n error: getDataTestId(dataTestId, 'error'),\n message: getDataTestId(dataTestId, 'message'),\n };\n}\n"],"names":["OBSERVABLE_TOKENS","THEME_STATE","__assign","getDataTestId"],"mappings":"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"}
@@ -8,13 +8,13 @@
8
8
  :root {
9
9
  --pattern-lock-v1-desktop-max-width: 240px;
10
10
  }
11
- .pattern-lock-v1__component_lc86i {
11
+ .pattern-lock-v1__component_175lf {
12
12
  max-width: var(--pattern-lock-v1-desktop-max-width);
13
13
  margin: var(--gap-8) var(--gap-0) var(--gap-24) var(--gap-0);
14
14
  }
15
- .pattern-lock-v1__forgotBtn_lc86i {
15
+ .pattern-lock-v1__forgotBtn_175lf {
16
16
  margin: var(--gap-24) auto var(--gap-0);
17
17
  }
18
- .pattern-lock-v1__hiddenBtn_lc86i {
18
+ .pattern-lock-v1__hiddenBtn_175lf {
19
19
  display: none;
20
20
  }
@@ -2,7 +2,7 @@
2
2
 
3
3
  require('./desktop.css');
4
4
 
5
- var styles = {"component":"pattern-lock-v1__component_lc86i","forgotBtn":"pattern-lock-v1__forgotBtn_lc86i","hiddenBtn":"pattern-lock-v1__hiddenBtn_lc86i"};
5
+ var styles = {"component":"pattern-lock-v1__component_175lf","forgotBtn":"pattern-lock-v1__forgotBtn_175lf","hiddenBtn":"pattern-lock-v1__hiddenBtn_175lf"};
6
6
 
7
7
  module.exports = styles;
8
8
  //# sourceMappingURL=desktop.module.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"desktop.module.css.js","sources":["../src/desktop/desktop.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../vars.css';\n\n.component {\n max-width: var(--pattern-lock-v1-desktop-max-width);\n margin: var(--gap-8) var(--gap-0) var(--gap-24) var(--gap-0);\n}\n\n.forgotBtn {\n margin: var(--gap-24) auto var(--gap-0);\n}\n\n.hiddenBtn {\n display: none;\n}\n"],"names":[],"mappings":";;;;AAEgB,aAAe,CAAC,WAAW,CAAC,kCAAkC,CAAC,WAAW,CAAC,kCAAkC,CAAC,WAAW,CAAC,kCAAkC,CAAC;;;;"}
1
+ {"version":3,"file":"desktop.module.css.js","sources":["../src/desktop/desktop.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../vars.css';\n\n.component {\n max-width: var(--pattern-lock-v1-desktop-max-width);\n margin: var(--gap-8) var(--gap-0) var(--gap-24) var(--gap-0);\n}\n\n.forgotBtn {\n margin: var(--gap-24) auto var(--gap-0);\n}\n\n.hiddenBtn {\n display: none;\n}\n"],"names":[],"mappings":";;;;AAEgB,aAAe,CAAC,WAAW,CAAC,kCAAkC,CAAC,WAAW,CAAC,kCAAkC,CAAC,WAAW,CAAC,kCAAkC,CAAC;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Component.js","sources":["../../../src/components/base-pattern-lock/Component.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useState } from 'react';\nimport {\n ReactCanvasPatternLock,\n type Theme,\n type TPatternLockInstance,\n} from 'react-canvas-pattern-lock';\nimport cn from 'classnames';\n\nimport { ButtonMobile } from '@alfalab/core-components-button/mobile';\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport {\n DEFAULT_EXTRA_BOUNDS,\n OBSERVABLE_TOKENS,\n OBSERVE_OPTIONS,\n THEME_STATE,\n} from '../../consts';\nimport { type CommonPatternLockProps, type PrivatePatternLockProps } from '../../typings';\nimport { getColorByToken, getDefaultObserveTarget, getSizes, getTheme } from '../../utils';\n\nimport commonStyles from './index.module.css';\n\nexport const BasePatternLock = forwardRef<\n TPatternLockInstance,\n CommonPatternLockProps & PrivatePatternLockProps\n>(\n (\n {\n observeTokens = false,\n observerParams = {},\n justifyNodes = 'space-between',\n className,\n error,\n dataTestId,\n forgotCodeBtnText = 'Забыли код?',\n showForgotCodeBtn = false,\n onForgotBtnClick,\n extraBounds = DEFAULT_EXTRA_BOUNDS,\n message,\n messageClassName,\n hover,\n styles = {},\n ...restProps\n },\n ref,\n ) => {\n const [params, setParams] = useState<\n { theme: Theme; width: number; height: number } | undefined\n >();\n\n useEffect(() => {\n const { elementSizes, width, height } = getSizes();\n\n setParams({\n theme: getTheme(elementSizes),\n width,\n height,\n });\n }, []);\n\n useEffect(() => {\n let styleObserver: MutationObserver | null = null;\n\n if (observeTokens) {\n const { options = OBSERVE_OPTIONS, getTarget = getDefaultObserveTarget } =\n observerParams;\n\n styleObserver = new MutationObserver(() =>\n setParams((prevState) => {\n const { width, height, elementSizes } = getSizes();\n\n if (!prevState) {\n return { theme: getTheme(elementSizes), width, height };\n }\n\n const prevBgColor = prevState.theme[THEME_STATE.INITIAL].colors.bg;\n const themeChanged = prevBgColor !== getColorByToken(OBSERVABLE_TOKENS.BG);\n\n if (themeChanged) return { ...prevState, theme: getTheme(elementSizes) };\n\n return prevState;\n }),\n );\n\n styleObserver.observe(getTarget(), options);\n }\n\n return () => styleObserver?.disconnect();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [observeTokens]);\n\n const renderMessage = () => (\n <div\n className={cn(commonStyles.message, messageClassName)}\n data-test-id={getDataTestId(dataTestId, 'message')}\n >\n {message}\n </div>\n );\n\n const renderError = () => (\n <div\n className={cn(commonStyles.message, commonStyles.error, messageClassName)}\n data-test-id={getDataTestId(dataTestId, 'error')}\n >\n {error}\n </div>\n );\n\n return (\n <div\n className={cn(commonStyles.component, styles.component, className, {\n [commonStyles.hidden]: !params,\n })}\n data-test-id={dataTestId}\n >\n {error ? renderError() : renderMessage()}\n\n <ReactCanvasPatternLock\n {...restProps}\n {...params}\n ref={ref}\n rows={3}\n cols={3}\n justifyNodes={justifyNodes}\n extraBounds={extraBounds}\n hover={hover}\n />\n\n {showForgotCodeBtn ? (\n <ButtonMobile\n view='transparent'\n className={cn(commonStyles.forgotBtn, styles.forgotBtn)}\n onClick={onForgotBtnClick}\n dataTestId={getDataTestId(dataTestId, 'forgot-code-btn')}\n >\n {forgotCodeBtnText}\n </ButtonMobile>\n ) : (\n <div\n className={cn(commonStyles.forgotBtn, styles.forgotBtn, {\n [styles.hiddenBtn]: Boolean(styles.hiddenBtn),\n })}\n />\n )}\n </div>\n );\n },\n);\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Component.js","sources":["../../../src/components/base-pattern-lock/Component.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useState } from 'react';\nimport {\n ReactCanvasPatternLock,\n type Theme,\n type TPatternLockInstance,\n} from 'react-canvas-pattern-lock';\nimport cn from 'classnames';\n\nimport { ButtonMobile } from '@alfalab/core-components-button/mobile';\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport {\n DEFAULT_EXTRA_BOUNDS,\n OBSERVABLE_TOKENS,\n OBSERVE_OPTIONS,\n THEME_STATE,\n} from '../../consts';\nimport { type CommonPatternLockProps, type PrivatePatternLockProps } from '../../typings';\nimport { getColorByToken, getDefaultObserveTarget, getSizes, getTheme } from '../../utils';\n\nimport commonStyles from './index.module.css';\n\nexport const BasePatternLock = forwardRef<\n TPatternLockInstance,\n CommonPatternLockProps & PrivatePatternLockProps\n>(\n (\n {\n observeTokens = false,\n observerParams = {},\n justifyNodes = 'space-between',\n className,\n error,\n dataTestId,\n forgotCodeBtnText = 'Забыли код?',\n showForgotCodeBtn = false,\n onForgotBtnClick,\n extraBounds = DEFAULT_EXTRA_BOUNDS,\n message,\n messageClassName,\n hover,\n styles = {},\n ...restProps\n },\n ref,\n ) => {\n const [params, setParams] = useState<\n { theme: Theme; width: number; height: number } | undefined\n >();\n\n useEffect(() => {\n const { elementSizes, width, height } = getSizes();\n\n setParams({\n theme: getTheme(elementSizes),\n width,\n height,\n });\n }, []);\n\n useEffect(() => {\n let styleObserver: MutationObserver | null = null;\n\n if (observeTokens) {\n const { options = OBSERVE_OPTIONS, getTarget = getDefaultObserveTarget } =\n observerParams;\n\n styleObserver = new MutationObserver(() =>\n setParams((prevState) => {\n const { width, height, elementSizes } = getSizes();\n\n if (!prevState) {\n return { theme: getTheme(elementSizes), width, height };\n }\n\n const prevBgColor = prevState.theme[THEME_STATE.INITIAL].colors.bg;\n const themeChanged = prevBgColor !== getColorByToken(OBSERVABLE_TOKENS.BG);\n\n if (themeChanged) return { ...prevState, theme: getTheme(elementSizes) };\n\n return prevState;\n }),\n );\n\n styleObserver.observe(getTarget(), options);\n }\n\n return () => styleObserver?.disconnect();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [observeTokens]);\n\n const renderMessage = () => (\n <div\n className={cn(commonStyles.message, messageClassName)}\n data-test-id={getDataTestId(dataTestId, 'message')}\n >\n {message}\n </div>\n );\n\n const renderError = () => (\n <div\n className={cn(commonStyles.message, commonStyles.error, messageClassName)}\n data-test-id={getDataTestId(dataTestId, 'error')}\n >\n {error}\n </div>\n );\n\n return (\n <div\n className={cn(commonStyles.component, styles.component, className, {\n [commonStyles.hidden]: !params,\n })}\n data-test-id={dataTestId}\n >\n {error ? renderError() : renderMessage()}\n\n <ReactCanvasPatternLock\n {...restProps}\n {...params}\n ref={ref}\n rows={3}\n cols={3}\n justifyNodes={justifyNodes}\n extraBounds={extraBounds}\n hover={hover}\n />\n\n {showForgotCodeBtn ? (\n <ButtonMobile\n view='transparent'\n className={cn(commonStyles.forgotBtn, styles.forgotBtn)}\n onClick={onForgotBtnClick}\n dataTestId={getDataTestId(dataTestId, 'forgot-code-btn')}\n >\n {forgotCodeBtnText}\n </ButtonMobile>\n ) : (\n <div\n className={cn(commonStyles.forgotBtn, styles.forgotBtn, {\n [styles.hiddenBtn]: Boolean(styles.hiddenBtn),\n })}\n />\n )}\n </div>\n );\n },\n);\n"],"names":[],"mappings":"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"}
@@ -16,14 +16,14 @@
16
16
  :root {
17
17
  --size-xs-height: 40px;
18
18
  }
19
- .pattern-lock-v1__component_4r3ax canvas {
19
+ .pattern-lock-v1__component_17etv canvas {
20
20
  display: block;
21
21
  margin: var(--gap-0) auto;
22
22
  }
23
- .pattern-lock-v1__hidden_4r3ax {
23
+ .pattern-lock-v1__hidden_17etv {
24
24
  visibility: hidden;
25
25
  }
26
- .pattern-lock-v1__message_4r3ax {
26
+ .pattern-lock-v1__message_17etv {
27
27
  font-size: 16px;
28
28
  line-height: 24px;
29
29
  font-weight: 400;
@@ -37,10 +37,10 @@
37
37
  white-space: nowrap;
38
38
  color: var(--color-light-text-primary);
39
39
  }
40
- .pattern-lock-v1__error_4r3ax {
40
+ .pattern-lock-v1__error_17etv {
41
41
  color: var(--color-light-text-negative);
42
42
  }
43
- .pattern-lock-v1__forgotBtn_4r3ax {
43
+ .pattern-lock-v1__forgotBtn_17etv {
44
44
  display: block;
45
45
  min-height: var(--size-xs-height);
46
46
  }
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- var commonStyles = {"component":"pattern-lock-v1__component_4r3ax","hidden":"pattern-lock-v1__hidden_4r3ax","message":"pattern-lock-v1__message_4r3ax","error":"pattern-lock-v1__error_4r3ax","forgotBtn":"pattern-lock-v1__forgotBtn_4r3ax"};
3
+ var commonStyles = {"component":"pattern-lock-v1__component_17etv","hidden":"pattern-lock-v1__hidden_17etv","message":"pattern-lock-v1__message_17etv","error":"pattern-lock-v1__error_17etv","forgotBtn":"pattern-lock-v1__forgotBtn_17etv"};
4
4
 
5
5
  export { commonStyles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.module.css.js","sources":["../../src/components/base-pattern-lock/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../../vars.css';\n\n.component {\n & canvas {\n display: block;\n margin: var(--gap-0) auto;\n }\n}\n\n.hidden {\n visibility: hidden;\n}\n\n.message {\n @mixin paragraph_primary_medium;\n\n text-align: center;\n padding: var(--gap-0) var(--gap-16) var(--gap-40);\n min-height: 24px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--color-light-text-primary);\n}\n\n.error {\n color: var(--color-light-text-negative);\n}\n\n.forgotBtn {\n display: block;\n min-height: var(--size-xs-height);\n}\n"],"names":[],"mappings":";;AAEgB,mBAAe,CAAC,WAAW,CAAC,kCAAkC,CAAC,QAAQ,CAAC,+BAA+B,CAAC,SAAS,CAAC,gCAAgC,CAAC,OAAO,CAAC,8BAA8B,CAAC,WAAW,CAAC,kCAAkC,CAAC;;;;"}
1
+ {"version":3,"file":"index.module.css.js","sources":["../../src/components/base-pattern-lock/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../../vars.css';\n\n.component {\n & canvas {\n display: block;\n margin: var(--gap-0) auto;\n }\n}\n\n.hidden {\n visibility: hidden;\n}\n\n.message {\n @mixin paragraph_primary_medium;\n\n text-align: center;\n padding: var(--gap-0) var(--gap-16) var(--gap-40);\n min-height: 24px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--color-light-text-primary);\n}\n\n.error {\n color: var(--color-light-text-negative);\n}\n\n.forgotBtn {\n display: block;\n min-height: var(--size-xs-height);\n}\n"],"names":[],"mappings":";;AAEgB,mBAAe,CAAC,WAAW,CAAC,kCAAkC,CAAC,QAAQ,CAAC,+BAA+B,CAAC,SAAS,CAAC,gCAAgC,CAAC,OAAO,CAAC,8BAA8B,CAAC,WAAW,CAAC,kCAAkC,CAAC;;;;"}
@@ -8,13 +8,13 @@
8
8
  :root {
9
9
  --pattern-lock-v1-desktop-max-width: 240px;
10
10
  }
11
- .pattern-lock-v1__component_lc86i {
11
+ .pattern-lock-v1__component_175lf {
12
12
  max-width: var(--pattern-lock-v1-desktop-max-width);
13
13
  margin: var(--gap-8) var(--gap-0) var(--gap-24) var(--gap-0);
14
14
  }
15
- .pattern-lock-v1__forgotBtn_lc86i {
15
+ .pattern-lock-v1__forgotBtn_175lf {
16
16
  margin: var(--gap-24) auto var(--gap-0);
17
17
  }
18
- .pattern-lock-v1__hiddenBtn_lc86i {
18
+ .pattern-lock-v1__hiddenBtn_175lf {
19
19
  display: none;
20
20
  }
@@ -1,6 +1,6 @@
1
1
  import './desktop.css';
2
2
 
3
- var styles = {"component":"pattern-lock-v1__component_lc86i","forgotBtn":"pattern-lock-v1__forgotBtn_lc86i","hiddenBtn":"pattern-lock-v1__hiddenBtn_lc86i"};
3
+ var styles = {"component":"pattern-lock-v1__component_175lf","forgotBtn":"pattern-lock-v1__forgotBtn_175lf","hiddenBtn":"pattern-lock-v1__hiddenBtn_175lf"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=desktop.module.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"desktop.module.css.js","sources":["../src/desktop/desktop.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../vars.css';\n\n.component {\n max-width: var(--pattern-lock-v1-desktop-max-width);\n margin: var(--gap-8) var(--gap-0) var(--gap-24) var(--gap-0);\n}\n\n.forgotBtn {\n margin: var(--gap-24) auto var(--gap-0);\n}\n\n.hiddenBtn {\n display: none;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,kCAAkC,CAAC,WAAW,CAAC,kCAAkC,CAAC,WAAW,CAAC,kCAAkC,CAAC;;;;"}
1
+ {"version":3,"file":"desktop.module.css.js","sources":["../src/desktop/desktop.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../vars.css';\n\n.component {\n max-width: var(--pattern-lock-v1-desktop-max-width);\n margin: var(--gap-8) var(--gap-0) var(--gap-24) var(--gap-0);\n}\n\n.forgotBtn {\n margin: var(--gap-24) auto var(--gap-0);\n}\n\n.hiddenBtn {\n display: none;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,kCAAkC,CAAC,WAAW,CAAC,kCAAkC,CAAC,WAAW,CAAC,kCAAkC,CAAC;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"use-pattern-lock-cleanup.js","sources":["../../src/hooks/use-pattern-lock-cleanup.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { type TPatternLockInstance } from 'react-canvas-pattern-lock';\n\nexport const usePatternLockCleanup = (\n patternLockRef: React.MutableRefObject<TPatternLockInstance | null>,\n) => {\n const clear = useMemo(() => {\n if (patternLockRef.current) {\n patternLockRef.current.setInitialState();\n }\n }, [patternLockRef]);\n\n return {\n clear,\n };\n};\n"],"names":[],"mappings":";;AAGO,IAAM,qBAAqB,GAAG,UACjC,cAAmE,EAAA;IAEnE,IAAM,KAAK,GAAG,OAAO,CAAC,YAAA;QAClB,IAAI,cAAc,CAAC,OAAO,EAAE;AACxB,YAAA,cAAc,CAAC,OAAO,CAAC,eAAe,EAAE;AAC3C;AACL,KAAC,EAAE,CAAC,cAAc,CAAC,CAAC;IAEpB,OAAO;AACH,QAAA,KAAK,EAAA,KAAA;KACR;AACL;;;;"}
1
+ {"version":3,"file":"use-pattern-lock-cleanup.js","sources":["../../src/hooks/use-pattern-lock-cleanup.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { type TPatternLockInstance } from 'react-canvas-pattern-lock';\n\nexport const usePatternLockCleanup = (\n patternLockRef: React.MutableRefObject<TPatternLockInstance | null>,\n) => {\n const clear = useMemo(() => {\n if (patternLockRef.current) {\n patternLockRef.current.setInitialState();\n }\n }, [patternLockRef]);\n\n return {\n clear,\n };\n};\n"],"names":[],"mappings":";;AAGO,IAAM,qBAAqB,GAAG,UACjC,cAAmE,EAAA;IAEnE,IAAM,KAAK,GAAG,OAAO,CAAC,YAAA;AAClB,QAAA,IAAI,cAAc,CAAC,OAAO,EAAE;AACxB,YAAA,cAAc,CAAC,OAAO,CAAC,eAAe,EAAE;;AAEhD,KAAC,EAAE,CAAC,cAAc,CAAC,CAAC;IAEpB,OAAO;AACH,QAAA,KAAK,EAAA,KAAA;KACR;AACL;;;;"}
@@ -18,29 +18,29 @@
18
18
  :root {
19
19
  --pattern-lock-v1-max-width: 500px;
20
20
  }
21
- .pattern-lock-v1__component_1pncu {
21
+ .pattern-lock-v1__component_ubooh {
22
22
  max-width: var(--pattern-lock-v1-max-width);
23
23
  margin: var(--gap-8) var(--gap-0) var(--gap-24) var(--gap-0);
24
24
  }
25
- .pattern-lock-v1__forgotBtn_1pncu {
25
+ .pattern-lock-v1__forgotBtn_ubooh {
26
26
  margin: var(--gap-24) auto var(--gap-0);
27
27
  }
28
28
  @media screen and (min-width: 360px) {
29
- .pattern-lock-v1__forgotBtn_1pncu {
29
+ .pattern-lock-v1__forgotBtn_ubooh {
30
30
  margin-top: var(--gap-32);
31
31
  min-height: var(--size-s-height);
32
32
  }
33
33
 
34
- .pattern-lock-v1__component_1pncu {
34
+ .pattern-lock-v1__component_ubooh {
35
35
  margin-bottom: var(--gap-12);
36
36
  }
37
37
  }
38
38
  @media screen and (min-width: 390px) {
39
- .pattern-lock-v1__forgotBtn_1pncu {
39
+ .pattern-lock-v1__forgotBtn_ubooh {
40
40
  min-height: var(--size-m-height);
41
41
  }
42
42
 
43
- .pattern-lock-v1__component_1pncu {
43
+ .pattern-lock-v1__component_ubooh {
44
44
  margin-bottom: var(--gap-20);
45
45
  }
46
46
  }
@@ -1,6 +1,6 @@
1
1
  import './mobile.css';
2
2
 
3
- var styles = {"component":"pattern-lock-v1__component_1pncu","forgotBtn":"pattern-lock-v1__forgotBtn_1pncu"};
3
+ var styles = {"component":"pattern-lock-v1__component_ubooh","forgotBtn":"pattern-lock-v1__forgotBtn_ubooh"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=mobile.module.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"mobile.module.css.js","sources":["../src/mobile/mobile.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../vars.css';\n\n.component {\n max-width: var(--pattern-lock-v1-max-width);\n margin: var(--gap-8) var(--gap-0) var(--gap-24) var(--gap-0);\n}\n\n.forgotBtn {\n margin: var(--gap-24) auto var(--gap-0);\n}\n\n@media screen and (min-width: 360px) {\n .forgotBtn {\n margin-top: var(--gap-32);\n min-height: var(--size-s-height);\n }\n\n .component {\n margin-bottom: var(--gap-12);\n }\n}\n\n@media screen and (min-width: 390px) {\n .forgotBtn {\n min-height: var(--size-m-height);\n }\n\n .component {\n margin-bottom: var(--gap-20);\n }\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,kCAAkC,CAAC,WAAW,CAAC,kCAAkC,CAAC;;;;"}
1
+ {"version":3,"file":"mobile.module.css.js","sources":["../src/mobile/mobile.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../vars.css';\n\n.component {\n max-width: var(--pattern-lock-v1-max-width);\n margin: var(--gap-8) var(--gap-0) var(--gap-24) var(--gap-0);\n}\n\n.forgotBtn {\n margin: var(--gap-24) auto var(--gap-0);\n}\n\n@media screen and (min-width: 360px) {\n .forgotBtn {\n margin-top: var(--gap-32);\n min-height: var(--size-s-height);\n }\n\n .component {\n margin-bottom: var(--gap-12);\n }\n}\n\n@media screen and (min-width: 390px) {\n .forgotBtn {\n min-height: var(--size-m-height);\n }\n\n .component {\n margin-bottom: var(--gap-20);\n }\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,kCAAkC,CAAC,WAAW,CAAC,kCAAkC,CAAC;;;;"}
package/esm/typings.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { type MouseEvent, type ReactNode } from 'react';
2
2
  import { type ReactPatternLockProps } from 'react-canvas-pattern-lock';
3
- declare type ConditionalProps = {
3
+ type ConditionalProps = {
4
4
  /**
5
5
  * Показать кнопку "забыли код"
6
6
  * @default "Забыли код?"
@@ -20,7 +20,7 @@ declare type ConditionalProps = {
20
20
  onForgotBtnClick?: never;
21
21
  forgotCodeBtnText?: never;
22
22
  };
23
- export declare type CommonPatternLockProps = {
23
+ export type CommonPatternLockProps = {
24
24
  /**
25
25
  * Дополнительный класс
26
26
  */
@@ -56,7 +56,7 @@ export declare type CommonPatternLockProps = {
56
56
  */
57
57
  messageClassName?: string;
58
58
  } & Omit<ReactPatternLockProps, 'theme' | 'width' | 'height' | 'rows' | 'cols' | 'hover'> & ConditionalProps;
59
- export declare type PrivatePatternLockProps = {
59
+ export type PrivatePatternLockProps = {
60
60
  /**
61
61
  * Включает ховер-эффект
62
62
  */
@@ -68,14 +68,14 @@ export declare type PrivatePatternLockProps = {
68
68
  [key: string]: string;
69
69
  };
70
70
  };
71
- export declare type PatternLockProps = CommonPatternLockProps & {
71
+ export type PatternLockProps = CommonPatternLockProps & {
72
72
  /**
73
73
  * Контрольная точка, с нее начинается desktop версия
74
74
  * @default 1024
75
75
  */
76
76
  breakpoint?: number;
77
77
  };
78
- export declare type ObservableTokens = {
78
+ export type ObservableTokens = {
79
79
  ACCENT_INITIAL: string;
80
80
  ACCENT_SUCCESS: string;
81
81
  ACCENT_FAILURE: string;
package/esm/utils.d.ts CHANGED
@@ -2,7 +2,7 @@ import { type Theme, type ThemeParams } from 'react-canvas-pattern-lock';
2
2
  export declare function getDefaultObserveTarget(): HTMLHeadElement;
3
3
  export declare function getColorByToken(token: string): string;
4
4
  export declare const getSizes: () => {
5
- elementSizes: ThemeParams['dimens'];
5
+ elementSizes: ThemeParams["dimens"];
6
6
  width: number;
7
7
  height: number;
8
8
  };
package/esm/utils.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"utils.js","sources":["../src/utils.ts"],"sourcesContent":["import { type Theme, type ThemeParams } from 'react-canvas-pattern-lock';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { OBSERVABLE_TOKENS, THEME_STATE } from './consts';\n\nexport function getDefaultObserveTarget() {\n return document.head;\n}\n\nexport function getColorByToken(token: string) {\n return getComputedStyle(document.documentElement).getPropertyValue(token);\n}\n\nexport const getSizes = (() => {\n const COMMON_SIZES = {\n lineWidth: 6,\n nodeRing: 0,\n nodeCore: 12,\n };\n\n let cachedSize: { elementSizes: ThemeParams['dimens']; width: number; height: number };\n\n return () => {\n if (cachedSize) {\n return cachedSize;\n }\n\n if (window.matchMedia('(min-width: 600px)').matches) {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 32 },\n width: 240,\n height: 240,\n };\n } else if (window.matchMedia('(min-width: 390px)').matches) {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 43 },\n width: 322,\n height: 322,\n };\n } else if (window.matchMedia('(min-width: 360px)').matches) {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 38 },\n width: 292,\n height: 292,\n };\n } else {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 32 },\n width: 240,\n height: 240,\n };\n }\n\n return cachedSize;\n };\n})();\n\nexport function getTheme(dimens: ThemeParams['dimens']): Theme {\n const baseColors = {\n primary: getColorByToken(OBSERVABLE_TOKENS.PRIMARY),\n bg: getColorByToken(OBSERVABLE_TOKENS.BG),\n ringBg: getColorByToken(OBSERVABLE_TOKENS.RING_BG_INITIAL),\n hover: {\n inner: getColorByToken(OBSERVABLE_TOKENS.HOVER_INNER),\n outer: getColorByToken(OBSERVABLE_TOKENS.HOVER_OUTER),\n },\n };\n\n return {\n [THEME_STATE.INITIAL]: {\n colors: {\n ...baseColors,\n accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_INITIAL),\n selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_INITIAL),\n },\n dimens,\n },\n [THEME_STATE.SUCCESS]: {\n colors: {\n ...baseColors,\n accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_SUCCESS),\n selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_SUCCESS),\n },\n dimens,\n },\n [THEME_STATE.FAILURE]: {\n colors: {\n ...baseColors,\n accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_FAILURE),\n selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_FAILURE),\n },\n dimens,\n },\n };\n}\n\nexport function getPatternLockTestIds(dataTestId: string) {\n return {\n patternLock: dataTestId,\n forgotCodeBtn: getDataTestId(dataTestId, 'forgot-code-btn'),\n error: getDataTestId(dataTestId, 'error'),\n message: getDataTestId(dataTestId, 'message'),\n };\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"utils.js","sources":["../src/utils.ts"],"sourcesContent":["import { type Theme, type ThemeParams } from 'react-canvas-pattern-lock';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { OBSERVABLE_TOKENS, THEME_STATE } from './consts';\n\nexport function getDefaultObserveTarget() {\n return document.head;\n}\n\nexport function getColorByToken(token: string) {\n return getComputedStyle(document.documentElement).getPropertyValue(token);\n}\n\nexport const getSizes = (() => {\n const COMMON_SIZES = {\n lineWidth: 6,\n nodeRing: 0,\n nodeCore: 12,\n };\n\n let cachedSize: { elementSizes: ThemeParams['dimens']; width: number; height: number };\n\n return () => {\n if (cachedSize) {\n return cachedSize;\n }\n\n if (window.matchMedia('(min-width: 600px)').matches) {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 32 },\n width: 240,\n height: 240,\n };\n } else if (window.matchMedia('(min-width: 390px)').matches) {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 43 },\n width: 322,\n height: 322,\n };\n } else if (window.matchMedia('(min-width: 360px)').matches) {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 38 },\n width: 292,\n height: 292,\n };\n } else {\n cachedSize = {\n elementSizes: { ...COMMON_SIZES, nodeRadius: 32 },\n width: 240,\n height: 240,\n };\n }\n\n return cachedSize;\n };\n})();\n\nexport function getTheme(dimens: ThemeParams['dimens']): Theme {\n const baseColors = {\n primary: getColorByToken(OBSERVABLE_TOKENS.PRIMARY),\n bg: getColorByToken(OBSERVABLE_TOKENS.BG),\n ringBg: getColorByToken(OBSERVABLE_TOKENS.RING_BG_INITIAL),\n hover: {\n inner: getColorByToken(OBSERVABLE_TOKENS.HOVER_INNER),\n outer: getColorByToken(OBSERVABLE_TOKENS.HOVER_OUTER),\n },\n };\n\n return {\n [THEME_STATE.INITIAL]: {\n colors: {\n ...baseColors,\n accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_INITIAL),\n selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_INITIAL),\n },\n dimens,\n },\n [THEME_STATE.SUCCESS]: {\n colors: {\n ...baseColors,\n accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_SUCCESS),\n selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_SUCCESS),\n },\n dimens,\n },\n [THEME_STATE.FAILURE]: {\n colors: {\n ...baseColors,\n accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_FAILURE),\n selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_FAILURE),\n },\n dimens,\n },\n };\n}\n\nexport function getPatternLockTestIds(dataTestId: string) {\n return {\n patternLock: dataTestId,\n forgotCodeBtn: getDataTestId(dataTestId, 'forgot-code-btn'),\n error: getDataTestId(dataTestId, 'error'),\n message: getDataTestId(dataTestId, 'message'),\n };\n}\n"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"use-pattern-lock-cleanup.js","sources":["../src/hooks/use-pattern-lock-cleanup.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { type TPatternLockInstance } from 'react-canvas-pattern-lock';\n\nexport const usePatternLockCleanup = (\n patternLockRef: React.MutableRefObject<TPatternLockInstance | null>,\n) => {\n const clear = useMemo(() => {\n if (patternLockRef.current) {\n patternLockRef.current.setInitialState();\n }\n }, [patternLockRef]);\n\n return {\n clear,\n };\n};\n"],"names":["useMemo"],"mappings":";;;;;;AAGO,IAAM,qBAAqB,GAAG,UACjC,cAAmE,EAAA;IAEnE,IAAM,KAAK,GAAGA,aAAO,CAAC,YAAA;QAClB,IAAI,cAAc,CAAC,OAAO,EAAE;AACxB,YAAA,cAAc,CAAC,OAAO,CAAC,eAAe,EAAE;AAC3C;AACL,KAAC,EAAE,CAAC,cAAc,CAAC,CAAC;IAEpB,OAAO;AACH,QAAA,KAAK,EAAA,KAAA;KACR;AACL;;;;"}
1
+ {"version":3,"file":"use-pattern-lock-cleanup.js","sources":["../src/hooks/use-pattern-lock-cleanup.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { type TPatternLockInstance } from 'react-canvas-pattern-lock';\n\nexport const usePatternLockCleanup = (\n patternLockRef: React.MutableRefObject<TPatternLockInstance | null>,\n) => {\n const clear = useMemo(() => {\n if (patternLockRef.current) {\n patternLockRef.current.setInitialState();\n }\n }, [patternLockRef]);\n\n return {\n clear,\n };\n};\n"],"names":["useMemo"],"mappings":";;;;;;AAGO,IAAM,qBAAqB,GAAG,UACjC,cAAmE,EAAA;IAEnE,IAAM,KAAK,GAAGA,aAAO,CAAC,YAAA;AAClB,QAAA,IAAI,cAAc,CAAC,OAAO,EAAE;AACxB,YAAA,cAAc,CAAC,OAAO,CAAC,eAAe,EAAE;;AAEhD,KAAC,EAAE,CAAC,cAAc,CAAC,CAAC;IAEpB,OAAO;AACH,QAAA,KAAK,EAAA,KAAA;KACR;AACL;;;;"}
package/mobile/mobile.css CHANGED
@@ -18,29 +18,29 @@
18
18
  :root {
19
19
  --pattern-lock-v1-max-width: 500px;
20
20
  }
21
- .pattern-lock-v1__component_1pncu {
21
+ .pattern-lock-v1__component_ubooh {
22
22
  max-width: var(--pattern-lock-v1-max-width);
23
23
  margin: var(--gap-8) var(--gap-0) var(--gap-24) var(--gap-0);
24
24
  }
25
- .pattern-lock-v1__forgotBtn_1pncu {
25
+ .pattern-lock-v1__forgotBtn_ubooh {
26
26
  margin: var(--gap-24) auto var(--gap-0);
27
27
  }
28
28
  @media screen and (min-width: 360px) {
29
- .pattern-lock-v1__forgotBtn_1pncu {
29
+ .pattern-lock-v1__forgotBtn_ubooh {
30
30
  margin-top: var(--gap-32);
31
31
  min-height: var(--size-s-height);
32
32
  }
33
33
 
34
- .pattern-lock-v1__component_1pncu {
34
+ .pattern-lock-v1__component_ubooh {
35
35
  margin-bottom: var(--gap-12);
36
36
  }
37
37
  }
38
38
  @media screen and (min-width: 390px) {
39
- .pattern-lock-v1__forgotBtn_1pncu {
39
+ .pattern-lock-v1__forgotBtn_ubooh {
40
40
  min-height: var(--size-m-height);
41
41
  }
42
42
 
43
- .pattern-lock-v1__component_1pncu {
43
+ .pattern-lock-v1__component_ubooh {
44
44
  margin-bottom: var(--gap-20);
45
45
  }
46
46
  }
@@ -2,7 +2,7 @@
2
2
 
3
3
  require('./mobile.css');
4
4
 
5
- var styles = {"component":"pattern-lock-v1__component_1pncu","forgotBtn":"pattern-lock-v1__forgotBtn_1pncu"};
5
+ var styles = {"component":"pattern-lock-v1__component_ubooh","forgotBtn":"pattern-lock-v1__forgotBtn_ubooh"};
6
6
 
7
7
  module.exports = styles;
8
8
  //# sourceMappingURL=mobile.module.css.js.map