@alfalab/core-components-pattern-lock 2.3.1 → 2.4.0

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 (52) hide show
  1. package/components/base-pattern-lock/Component.js +1 -1
  2. package/components/base-pattern-lock/index.css +8 -8
  3. package/desktop/Component.desktop.js +1 -1
  4. package/desktop/desktop.css +4 -4
  5. package/esm/components/base-pattern-lock/Component.js +1 -1
  6. package/esm/components/base-pattern-lock/index.css +8 -8
  7. package/esm/desktop/Component.desktop.js +1 -1
  8. package/esm/desktop/desktop.css +4 -4
  9. package/esm/mobile/Component.mobile.js +1 -1
  10. package/esm/mobile/mobile.css +3 -3
  11. package/mobile/Component.mobile.js +1 -1
  12. package/mobile/mobile.css +3 -3
  13. package/modern/components/base-pattern-lock/Component.js +1 -1
  14. package/modern/components/base-pattern-lock/index.css +8 -8
  15. package/modern/desktop/Component.desktop.js +1 -1
  16. package/modern/desktop/desktop.css +4 -4
  17. package/modern/mobile/Component.mobile.js +1 -1
  18. package/modern/mobile/mobile.css +3 -3
  19. package/moderncssm/Component.responsive.d.ts +6 -0
  20. package/moderncssm/Component.responsive.js +14 -0
  21. package/moderncssm/components/base-pattern-lock/Component.d.ts +6 -0
  22. package/moderncssm/components/base-pattern-lock/Component.js +53 -0
  23. package/moderncssm/components/base-pattern-lock/index.d.ts +1 -0
  24. package/moderncssm/components/base-pattern-lock/index.js +1 -0
  25. package/moderncssm/components/base-pattern-lock/index.module.css +38 -0
  26. package/moderncssm/consts.d.ts +11 -0
  27. package/moderncssm/consts.js +26 -0
  28. package/moderncssm/desktop/Component.desktop.d.ts +6 -0
  29. package/moderncssm/desktop/Component.desktop.js +8 -0
  30. package/moderncssm/desktop/desktop.module.css +14 -0
  31. package/moderncssm/desktop/index.d.ts +2 -0
  32. package/moderncssm/desktop/index.js +1 -0
  33. package/moderncssm/hooks/use-pattern-lock-cleanup.d.ts +6 -0
  34. package/moderncssm/hooks/use-pattern-lock-cleanup.js +14 -0
  35. package/moderncssm/index.d.ts +3 -0
  36. package/moderncssm/index.js +2 -0
  37. package/moderncssm/mobile/Component.mobile.d.ts +6 -0
  38. package/moderncssm/mobile/Component.mobile.js +8 -0
  39. package/moderncssm/mobile/index.d.ts +2 -0
  40. package/moderncssm/mobile/index.js +1 -0
  41. package/moderncssm/mobile/mobile.module.css +11 -0
  42. package/moderncssm/shared/index.d.ts +2 -0
  43. package/moderncssm/shared/index.js +2 -0
  44. package/moderncssm/typings.d.ts +91 -0
  45. package/moderncssm/typings.js +1 -0
  46. package/moderncssm/utils.d.ts +14 -0
  47. package/moderncssm/utils.js +73 -0
  48. package/moderncssm/vars.css +0 -0
  49. package/package.json +4 -4
  50. package/src/components/base-pattern-lock/index.module.css +1 -1
  51. package/src/desktop/desktop.module.css +1 -1
  52. package/src/mobile/mobile.module.css +1 -1
@@ -1,4 +1,4 @@
1
- /* hash: 14cn1 */
1
+ /* hash: 163mc */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -22,11 +22,11 @@
22
22
  } :root {
23
23
  } :root {
24
24
  --pattern-lock-min-width: 304px;
25
- } .pattern-lock__component_mnqr1 {
25
+ } .pattern-lock__component_hz9gm {
26
26
  margin: 0 auto;
27
27
  min-width: var(--pattern-lock-min-width);
28
- } .pattern-lock__forgotBtn_mnqr1 {
28
+ } .pattern-lock__forgotBtn_hz9gm {
29
29
  margin: var(--gap-8) auto 0;
30
- } .pattern-lock__hiddenBtn_mnqr1 {
30
+ } .pattern-lock__hiddenBtn_hz9gm {
31
31
  display: none;
32
32
  }
@@ -1,7 +1,7 @@
1
1
  import React, { forwardRef } from 'react';
2
2
  import { BasePatternLock } from '../components/base-pattern-lock/Component.js';
3
3
 
4
- const styles = {"component":"pattern-lock__component_1a1vu","forgotBtn":"pattern-lock__forgotBtn_1a1vu"};
4
+ const styles = {"component":"pattern-lock__component_1qqnn","forgotBtn":"pattern-lock__forgotBtn_1qqnn"};
5
5
  require('./mobile.css')
6
6
 
7
7
  const PatternLockMobile = forwardRef((restProps, ref) => React.createElement(BasePatternLock, { ...restProps, ref: ref, styles: styles }));
@@ -1,4 +1,4 @@
1
- /* hash: 1wli2 */
1
+ /* hash: 1bg7z */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -22,9 +22,9 @@
22
22
  } :root {
23
23
  } :root {
24
24
  --pattern-lock-min-width: 304px;
25
- } .pattern-lock__component_1a1vu {
25
+ } .pattern-lock__component_1qqnn {
26
26
  margin: 0 auto;
27
27
  min-width: var(--pattern-lock-min-width);
28
- } .pattern-lock__forgotBtn_1a1vu {
28
+ } .pattern-lock__forgotBtn_1qqnn {
29
29
  margin: var(--gap-8) auto 0;
30
30
  }
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ import React from 'react';
3
+ import { TPatternLockInstance } from '@alfalab/react-canvas-pattern-lock';
4
+ import { PatternLockProps } from "./typings";
5
+ declare const PatternLock: React.ForwardRefExoticComponent<PatternLockProps & React.RefAttributes<TPatternLockInstance>>;
6
+ export { PatternLock };
@@ -0,0 +1,14 @@
1
+ import React, { forwardRef } from 'react';
2
+ import { useMatchMedia } from '@alfalab/core-components-mq/moderncssm';
3
+ import { PatternLockDesktop } from './desktop/Component.desktop.js';
4
+ import { PatternLockMobile } from './mobile/Component.mobile.js';
5
+
6
+ const PatternLock = forwardRef(({ breakpoint = 1024, defaultMatchMediaValue, ...restProps }, ref) => {
7
+ const query = `(min-width: ${breakpoint}px)`;
8
+ const [isDesktop] = useMatchMedia(query, defaultMatchMediaValue);
9
+ const Component = isDesktop ? PatternLockDesktop : PatternLockMobile;
10
+ return React.createElement(Component, { ref: ref, ...restProps });
11
+ });
12
+ PatternLock.displayName = 'PatternLock';
13
+
14
+ export { PatternLock };
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ import React from 'react';
3
+ import { TPatternLockInstance } from '@alfalab/react-canvas-pattern-lock';
4
+ import { CommonPatternLockProps, PrivatePatternLockProps } from "../../typings";
5
+ declare const BasePatternLock: React.ForwardRefExoticComponent<(CommonPatternLockProps & PrivatePatternLockProps) & React.RefAttributes<TPatternLockInstance>>;
6
+ export { BasePatternLock };
@@ -0,0 +1,53 @@
1
+ import React, { forwardRef, useState, useEffect } from 'react';
2
+ import cn from 'classnames';
3
+ import { ButtonMobile } from '@alfalab/core-components-button/moderncssm/mobile';
4
+ import { getDataTestId } from '@alfalab/core-components-shared/moderncssm';
5
+ import { ReactCanvasPatternLock } from '@alfalab/react-canvas-pattern-lock';
6
+ import { THEME_STATE, DEFAULT_EXTRA_BOUNDS, OBSERVE_OPTIONS, OBSERVABLE_TOKENS } from '../../consts.js';
7
+ import { getTheme, getColorByToken, getSizes, getDefaultObserveTarget } from '../../utils.js';
8
+ import commonStyles from './index.module.css';
9
+
10
+ const BasePatternLock = forwardRef(({ observeTokens = false, observerParams = {}, className, dataTestId, forgotCodeBtnText = 'Забыли код?', showForgotCodeBtn = false, onForgotBtnClick, extraBounds = DEFAULT_EXTRA_BOUNDS, messageClassName, hover, styles = {}, disabled = false, ...restProps }, ref) => {
11
+ const [params, setParams] = useState();
12
+ useEffect(() => {
13
+ const { elementSizes, width, height } = getSizes();
14
+ setParams({
15
+ theme: getTheme(elementSizes),
16
+ width,
17
+ height,
18
+ });
19
+ }, []);
20
+ useEffect(() => {
21
+ let styleObserver = null;
22
+ if (observeTokens) {
23
+ const { options = OBSERVE_OPTIONS, getTarget = getDefaultObserveTarget } = observerParams;
24
+ styleObserver = new MutationObserver(() => setParams((prevState) => {
25
+ const { width, height, elementSizes } = getSizes();
26
+ if (!prevState) {
27
+ return { theme: getTheme(elementSizes), width, height };
28
+ }
29
+ const prevBgColor = prevState.theme[THEME_STATE.INITIAL].colors.primary;
30
+ const themeChanged = prevBgColor !== getColorByToken(OBSERVABLE_TOKENS.PRIMARY);
31
+ if (themeChanged)
32
+ return { ...prevState, theme: getTheme(elementSizes) };
33
+ return prevState;
34
+ }));
35
+ styleObserver.observe(getTarget(), options);
36
+ }
37
+ return () => styleObserver?.disconnect();
38
+ // eslint-disable-next-line react-hooks/exhaustive-deps
39
+ }, [observeTokens]);
40
+ return (React.createElement("div", { className: cn(commonStyles.component, styles.component, className, {
41
+ [commonStyles.hidden]: !params,
42
+ [commonStyles.withForgotBtn]: showForgotCodeBtn,
43
+ [commonStyles.disabled]: disabled,
44
+ }), "data-test-id": dataTestId },
45
+ React.createElement("div", { className: commonStyles.canvasContainer },
46
+ React.createElement("div", { className: commonStyles.canvasInner },
47
+ React.createElement(ReactCanvasPatternLock, { ...restProps, ...params, ref: ref, rows: 3, cols: 3, justifyNodes: 'space-between', extraBounds: extraBounds, hover: hover }))),
48
+ showForgotCodeBtn && (React.createElement(ButtonMobile, { view: 'transparent', className: cn(commonStyles.forgotBtn, styles.forgotBtn), onClick: onForgotBtnClick, dataTestId: getDataTestId(dataTestId, 'forgot-code-btn') }, forgotCodeBtnText))));
49
+ });
50
+ BasePatternLock.displayName = 'BasePatternLock';
51
+ ReactCanvasPatternLock.displayName = 'ReactCanvasPatternLock';
52
+
53
+ export { BasePatternLock };
@@ -0,0 +1 @@
1
+ export * from "./Component";
@@ -0,0 +1 @@
1
+ export { BasePatternLock } from './Component.js';
@@ -0,0 +1,38 @@
1
+ /* */
2
+ :root {
3
+ --pattern-lock-min-width: 304px;
4
+ --pattern-lock-min-height: 272px;
5
+ --pattern-lock-with-forgot-btn-min-height: 336px;
6
+ }
7
+ .component {
8
+ display: flex;
9
+ flex-direction: column;
10
+ align-items: center;
11
+ box-sizing: border-box;
12
+ min-height: var(--pattern-lock-min-height)
13
+ }
14
+ .component canvas {
15
+ display: block;
16
+ margin: 0 auto;
17
+ }
18
+ .component .canvasContainer {
19
+ box-sizing: border-box;
20
+ padding: var(--gap-16) var(--gap-16);
21
+ min-width: var(--pattern-lock-min-width);
22
+ min-height: var(--pattern-lock-min-height)
23
+ }
24
+ .component .canvasContainer .canvasInner {
25
+ box-sizing: border-box;
26
+ padding: 0 var(--gap-16);
27
+ min-width: var(--pattern-lock-min-height);
28
+ }
29
+ .component.disabled {
30
+ pointer-events: none;
31
+ }
32
+ .withForgotBtn {
33
+ min-height: var(--pattern-lock-with-forgot-btn-min-height);
34
+ }
35
+ .forgotBtn {
36
+ display: block;
37
+ min-height: var(--size-xs-height);
38
+ }
@@ -0,0 +1,11 @@
1
+ import { ReactPatternLockProps } from '@alfalab/react-canvas-pattern-lock';
2
+ import { ObservableTokens } from "./typings";
3
+ declare const OBSERVE_OPTIONS: MutationObserverInit;
4
+ declare const DEFAULT_EXTRA_BOUNDS: ReactPatternLockProps['extraBounds'];
5
+ declare const OBSERVABLE_TOKENS: ObservableTokens;
6
+ declare const THEME_STATE: {
7
+ INITIAL: string;
8
+ SUCCESS: string;
9
+ FAILURE: string;
10
+ };
11
+ export { OBSERVE_OPTIONS, DEFAULT_EXTRA_BOUNDS, OBSERVABLE_TOKENS, THEME_STATE };
@@ -0,0 +1,26 @@
1
+ const OBSERVE_OPTIONS = {
2
+ childList: true,
3
+ attributes: false,
4
+ characterData: false,
5
+ subtree: true,
6
+ };
7
+ const DEFAULT_EXTRA_BOUNDS = [75, 50, 75, 50];
8
+ const OBSERVABLE_TOKENS = {
9
+ ACCENT_INITIAL: '--color-light-neutral-0-inverted',
10
+ ACCENT_SUCCESS: '--color-light-status-positive',
11
+ ACCENT_FAILURE: '--color-light-status-negative',
12
+ PRIMARY: '--color-light-neutral-500',
13
+ RING_BG_INITIAL: '--color-light-neutral-translucent-200',
14
+ SELECTED_RING_BG_INITIAL: '--color-light-neutral-translucent-200-hover',
15
+ SELECTED_RING_BG_SUCCESS: '--color-light-status-muted-positive',
16
+ SELECTED_RING_BG_FAILURE: '--color-light-status-muted-negative',
17
+ HOVER_INNER: '--color-light-neutral-500-hover',
18
+ HOVER_OUTER: '--color-light-neutral-translucent-200-hover',
19
+ };
20
+ const THEME_STATE = {
21
+ INITIAL: 'initial',
22
+ SUCCESS: 'success',
23
+ FAILURE: 'failure',
24
+ };
25
+
26
+ export { DEFAULT_EXTRA_BOUNDS, OBSERVABLE_TOKENS, OBSERVE_OPTIONS, THEME_STATE };
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ import React from 'react';
3
+ import { TPatternLockInstance } from '@alfalab/react-canvas-pattern-lock';
4
+ import { CommonPatternLockProps } from "../typings";
5
+ declare const PatternLockDesktop: React.ForwardRefExoticComponent<CommonPatternLockProps & React.RefAttributes<TPatternLockInstance>>;
6
+ export { PatternLockDesktop };
@@ -0,0 +1,8 @@
1
+ import React, { forwardRef } from 'react';
2
+ import { BasePatternLock } from '../components/base-pattern-lock/Component.js';
3
+ import styles from './desktop.module.css';
4
+
5
+ const PatternLockDesktop = forwardRef((restProps, ref) => React.createElement(BasePatternLock, { ...restProps, hover: true, ref: ref, styles: styles }));
6
+ PatternLockDesktop.displayName = 'PatternLockDesktop';
7
+
8
+ export { PatternLockDesktop };
@@ -0,0 +1,14 @@
1
+ /* */
2
+ :root {
3
+ --pattern-lock-min-width: 304px;
4
+ }
5
+ .component {
6
+ margin: 0 auto;
7
+ min-width: var(--pattern-lock-min-width);
8
+ }
9
+ .forgotBtn {
10
+ margin: var(--gap-8) auto 0;
11
+ }
12
+ .hiddenBtn {
13
+ display: none;
14
+ }
@@ -0,0 +1,2 @@
1
+ export { PatternLockDesktop } from "./Component.desktop";
2
+ export type { CommonPatternLockProps as PatternLockDesktopProps } from "../typings";
@@ -0,0 +1 @@
1
+ export { PatternLockDesktop } from './Component.desktop.js';
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ import { TPatternLockInstance } from '@alfalab/react-canvas-pattern-lock';
3
+ declare const usePatternLockCleanup: (patternLockRef: React.MutableRefObject<TPatternLockInstance | null>) => {
4
+ clear: void;
5
+ };
6
+ export { usePatternLockCleanup };
@@ -0,0 +1,14 @@
1
+ import { useMemo } from 'react';
2
+
3
+ const usePatternLockCleanup = (patternLockRef) => {
4
+ const clear = useMemo(() => {
5
+ if (patternLockRef.current) {
6
+ patternLockRef.current.setInitialState();
7
+ }
8
+ }, [patternLockRef]);
9
+ return {
10
+ clear,
11
+ };
12
+ };
13
+
14
+ export { usePatternLockCleanup };
@@ -0,0 +1,3 @@
1
+ export type { PatternLockProps } from "./typings";
2
+ export * from "./Component.responsive";
3
+ export { THEME_STATE } from "./consts";
@@ -0,0 +1,2 @@
1
+ export { PatternLock } from './Component.responsive.js';
2
+ export { THEME_STATE } from './consts.js';
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ import React from 'react';
3
+ import { TPatternLockInstance } from '@alfalab/react-canvas-pattern-lock';
4
+ import { CommonPatternLockProps } from "../typings";
5
+ declare const PatternLockMobile: React.ForwardRefExoticComponent<CommonPatternLockProps & React.RefAttributes<TPatternLockInstance>>;
6
+ export { PatternLockMobile };
@@ -0,0 +1,8 @@
1
+ import React, { forwardRef } from 'react';
2
+ import { BasePatternLock } from '../components/base-pattern-lock/Component.js';
3
+ import styles from './mobile.module.css';
4
+
5
+ const PatternLockMobile = forwardRef((restProps, ref) => React.createElement(BasePatternLock, { ...restProps, ref: ref, styles: styles }));
6
+ PatternLockMobile.displayName = 'PatternLockMobile';
7
+
8
+ export { PatternLockMobile };
@@ -0,0 +1,2 @@
1
+ export { PatternLockMobile } from "./Component.mobile";
2
+ export type { CommonPatternLockProps as PatternLockMobileProps } from "../typings";
@@ -0,0 +1 @@
1
+ export { PatternLockMobile } from './Component.mobile.js';
@@ -0,0 +1,11 @@
1
+ /* */
2
+ :root {
3
+ --pattern-lock-min-width: 304px;
4
+ }
5
+ .component {
6
+ margin: 0 auto;
7
+ min-width: var(--pattern-lock-min-width);
8
+ }
9
+ .forgotBtn {
10
+ margin: var(--gap-8) auto 0;
11
+ }
@@ -0,0 +1,2 @@
1
+ export { getPatternLockTestIds } from "../utils";
2
+ export { usePatternLockCleanup } from "../hooks/use-pattern-lock-cleanup";
@@ -0,0 +1,2 @@
1
+ export { getPatternLockTestIds } from '../utils.js';
2
+ export { usePatternLockCleanup } from '../hooks/use-pattern-lock-cleanup.js';
@@ -0,0 +1,91 @@
1
+ import { MouseEvent } from 'react';
2
+ import { ReactPatternLockProps } from '@alfalab/react-canvas-pattern-lock';
3
+ type ConditionalProps = {
4
+ /**
5
+ * Показать кнопку "забыли код"
6
+ * @default "Забыли код?"
7
+ */
8
+ showForgotCodeBtn: true;
9
+ /**
10
+ * Текст кнопки "забыли код"
11
+ * @default "Забыли код?"
12
+ */
13
+ forgotCodeBtnText?: string;
14
+ /**
15
+ * Коллбэк, вызываемый при клике на кнопку "Забыли код"
16
+ */
17
+ onForgotBtnClick: (event: MouseEvent<HTMLButtonElement>) => void;
18
+ } | {
19
+ showForgotCodeBtn?: false;
20
+ onForgotBtnClick?: never;
21
+ forgotCodeBtnText?: never;
22
+ };
23
+ type CommonPatternLockProps = {
24
+ /**
25
+ * Дополнительный класс
26
+ */
27
+ className?: string;
28
+ /**
29
+ * Идентификатор для систем автоматизированного тестирования.
30
+ * Для сообщения используется модификатор -message, ошибки -error,
31
+ * кнопки "забыли код" -forgot-code-btn
32
+ */
33
+ dataTestId?: string;
34
+ /**
35
+ * Следить ли за изменениями значений цветовых токенов
36
+ * @default false
37
+ */
38
+ observeTokens?: boolean;
39
+ /**
40
+ * Параметры MutationObserver для наблюдения за изменениями режима(css custom properties)
41
+ */
42
+ observerParams?: {
43
+ getTarget?: () => Node;
44
+ options?: MutationObserverInit;
45
+ };
46
+ /**
47
+ * Дополнительный класс для message/errorMessage
48
+ */
49
+ messageClassName?: string;
50
+ /**
51
+ * Отключает ввод паттерна
52
+ * @default false
53
+ */
54
+ disabled?: boolean;
55
+ } & Omit<ReactPatternLockProps, 'theme' | 'width' | 'height' | 'rows' | 'cols' | 'hover' | 'justifyNodes'> & ConditionalProps;
56
+ type PrivatePatternLockProps = {
57
+ /**
58
+ * Включает ховер-эффект
59
+ */
60
+ hover?: boolean;
61
+ /**
62
+ * Стили компонента
63
+ */
64
+ styles: {
65
+ [key: string]: string;
66
+ };
67
+ };
68
+ type PatternLockProps = CommonPatternLockProps & {
69
+ /**
70
+ * Контрольная точка, с нее начинается desktop версия
71
+ * @default 1024
72
+ */
73
+ breakpoint?: number;
74
+ /**
75
+ * Значение по-умолчанию для хука useMatchMedia
76
+ */
77
+ defaultMatchMediaValue?: boolean | (() => boolean);
78
+ };
79
+ type ObservableTokens = {
80
+ ACCENT_INITIAL: string;
81
+ ACCENT_SUCCESS: string;
82
+ ACCENT_FAILURE: string;
83
+ RING_BG_INITIAL: string;
84
+ SELECTED_RING_BG_INITIAL: string;
85
+ SELECTED_RING_BG_SUCCESS: string;
86
+ SELECTED_RING_BG_FAILURE: string;
87
+ PRIMARY: string;
88
+ HOVER_INNER: string;
89
+ HOVER_OUTER: string;
90
+ };
91
+ export { CommonPatternLockProps, PrivatePatternLockProps, PatternLockProps, ObservableTokens };
@@ -0,0 +1 @@
1
+
@@ -0,0 +1,14 @@
1
+ import { Theme, ThemeParams } from '@alfalab/react-canvas-pattern-lock';
2
+ declare function getDefaultObserveTarget(): HTMLHeadElement;
3
+ declare function getColorByToken(token: string): string;
4
+ declare const getSizes: () => {
5
+ elementSizes: ThemeParams['dimens'];
6
+ width: number;
7
+ height: number;
8
+ };
9
+ declare function getTheme(dimens: ThemeParams['dimens']): Theme;
10
+ declare function getPatternLockTestIds(dataTestId: string): {
11
+ patternLock: string;
12
+ forgotCodeBtn: string;
13
+ };
14
+ export { getDefaultObserveTarget, getColorByToken, getSizes, getTheme, getPatternLockTestIds };
@@ -0,0 +1,73 @@
1
+ import { getDataTestId } from '@alfalab/core-components-shared/moderncssm';
2
+ import { OBSERVABLE_TOKENS, THEME_STATE } from './consts.js';
3
+
4
+ function getDefaultObserveTarget() {
5
+ return document.head;
6
+ }
7
+ function getColorByToken(token) {
8
+ return getComputedStyle(document.documentElement).getPropertyValue(token);
9
+ }
10
+ const getSizes = (() => {
11
+ const COMMON_SIZES = {
12
+ lineWidth: 6,
13
+ nodeRing: 0,
14
+ nodeCore: 12,
15
+ };
16
+ let cachedSize;
17
+ return () => {
18
+ if (cachedSize) {
19
+ return cachedSize;
20
+ }
21
+ cachedSize = {
22
+ elementSizes: { ...COMMON_SIZES, nodeRadius: 32 },
23
+ width: 240,
24
+ height: 240,
25
+ };
26
+ return cachedSize;
27
+ };
28
+ })();
29
+ function getTheme(dimens) {
30
+ const baseColors = {
31
+ primary: getColorByToken(OBSERVABLE_TOKENS.PRIMARY),
32
+ bg: 'transparent',
33
+ ringBg: getColorByToken(OBSERVABLE_TOKENS.RING_BG_INITIAL),
34
+ hover: {
35
+ inner: getColorByToken(OBSERVABLE_TOKENS.HOVER_INNER),
36
+ outer: getColorByToken(OBSERVABLE_TOKENS.HOVER_OUTER),
37
+ },
38
+ };
39
+ return {
40
+ [THEME_STATE.INITIAL]: {
41
+ colors: {
42
+ ...baseColors,
43
+ accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_INITIAL),
44
+ selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_INITIAL),
45
+ },
46
+ dimens,
47
+ },
48
+ [THEME_STATE.SUCCESS]: {
49
+ colors: {
50
+ ...baseColors,
51
+ accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_SUCCESS),
52
+ selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_SUCCESS),
53
+ },
54
+ dimens,
55
+ },
56
+ [THEME_STATE.FAILURE]: {
57
+ colors: {
58
+ ...baseColors,
59
+ accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_FAILURE),
60
+ selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_FAILURE),
61
+ },
62
+ dimens,
63
+ },
64
+ };
65
+ }
66
+ function getPatternLockTestIds(dataTestId) {
67
+ return {
68
+ patternLock: dataTestId,
69
+ forgotCodeBtn: getDataTestId(dataTestId, 'forgot-code-btn'),
70
+ };
71
+ }
72
+
73
+ export { getColorByToken, getDefaultObserveTarget, getPatternLockTestIds, getSizes, getTheme };
File without changes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-pattern-lock",
3
- "version": "2.3.1",
3
+ "version": "2.4.0",
4
4
  "description": "Pattern lock",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -15,13 +15,13 @@
15
15
  "react-dom": "^16.9.0 || ^17.0.1 || ^18.0.0"
16
16
  },
17
17
  "dependencies": {
18
- "@alfalab/core-components-button": "^11.5.5",
18
+ "@alfalab/core-components-button": "^11.6.0",
19
19
  "@alfalab/core-components-shared": "^0.12.0",
20
20
  "@alfalab/core-components-mq": "^4.3.0",
21
21
  "@alfalab/react-canvas-pattern-lock": "^2.0.7",
22
22
  "classnames": "^2.3.1",
23
23
  "tslib": "^2.4.0"
24
24
  },
25
- "themesVersion": "13.0.2",
26
- "varsVersion": "9.11.1"
25
+ "themesVersion": "13.1.0",
26
+ "varsVersion": "9.12.0"
27
27
  }
@@ -1,4 +1,4 @@
1
- @import '@alfalab/core-components-themes/src/default.css';
1
+ @import '@alfalab/core-components-vars/src/index.css';
2
2
  @import '../../vars.css';
3
3
 
4
4
  .component {