@alfalab/core-components-pattern-lock-v1 1.1.17 → 2.0.0-snapshot-133b390
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.
- package/Component.responsive.d.ts +3 -5
- package/Component.responsive.js +4 -3
- package/Component.responsive.js.map +1 -0
- package/components/base-pattern-lock/Component.d.ts +3 -5
- package/components/base-pattern-lock/Component.js +7 -8
- package/components/base-pattern-lock/Component.js.map +1 -0
- package/components/base-pattern-lock/index.css +9 -30
- package/components/base-pattern-lock/index.d.ts +1 -1
- package/components/base-pattern-lock/index.js +3 -2
- package/components/base-pattern-lock/index.js.map +1 -0
- package/components/base-pattern-lock/index.module.css.js +8 -0
- package/components/base-pattern-lock/index.module.css.js.map +1 -0
- package/consts.d.ts +6 -7
- package/consts.js +1 -0
- package/consts.js.map +1 -0
- package/cssm/Component.responsive.d.ts +3 -5
- package/cssm/Component.responsive.js +6 -5
- package/cssm/Component.responsive.js.map +1 -0
- package/cssm/components/base-pattern-lock/Component.d.ts +3 -5
- package/cssm/components/base-pattern-lock/Component.js +5 -4
- package/cssm/components/base-pattern-lock/Component.js.map +1 -0
- package/cssm/components/base-pattern-lock/index.d.ts +1 -1
- package/cssm/components/base-pattern-lock/index.js +3 -2
- package/cssm/components/base-pattern-lock/index.js.map +1 -0
- package/cssm/components/base-pattern-lock/index.module.css +4 -24
- package/cssm/consts.d.ts +6 -7
- package/cssm/consts.js +1 -0
- package/cssm/consts.js.map +1 -0
- package/cssm/desktop/Component.desktop.d.ts +3 -5
- package/cssm/desktop/Component.desktop.js +3 -2
- package/cssm/desktop/Component.desktop.js.map +1 -0
- package/cssm/desktop/desktop.module.css +3 -24
- package/cssm/desktop/index.d.ts +2 -2
- package/cssm/desktop/index.js +3 -2
- package/cssm/desktop/index.js.map +1 -0
- package/cssm/hooks/use-pattern-lock-cleanup.d.ts +2 -4
- package/cssm/hooks/use-pattern-lock-cleanup.js +1 -0
- package/cssm/hooks/use-pattern-lock-cleanup.js.map +1 -0
- package/cssm/index.d.ts +3 -3
- package/cssm/index.js +1 -0
- package/cssm/index.js.map +1 -0
- package/cssm/mobile/Component.mobile.d.ts +3 -5
- package/cssm/mobile/Component.mobile.js +3 -2
- package/cssm/mobile/Component.mobile.js.map +1 -0
- package/cssm/mobile/index.d.ts +2 -2
- package/cssm/mobile/index.js +3 -2
- package/cssm/mobile/index.js.map +1 -0
- package/cssm/mobile/mobile.module.css +7 -27
- package/cssm/shared/index.d.ts +2 -2
- package/cssm/shared/index.js +3 -2
- package/cssm/shared/index.js.map +1 -0
- package/cssm/typings.d.ts +6 -6
- package/cssm/typings.js +1 -0
- package/cssm/typings.js.map +1 -0
- package/cssm/utils.d.ts +5 -6
- package/cssm/utils.js +5 -4
- package/cssm/utils.js.map +1 -0
- package/desktop/Component.desktop.d.ts +3 -5
- package/desktop/Component.desktop.js +4 -5
- package/desktop/Component.desktop.js.map +1 -0
- package/desktop/desktop.css +6 -28
- package/desktop/desktop.module.css.js +8 -0
- package/desktop/desktop.module.css.js.map +1 -0
- package/desktop/index.d.ts +2 -2
- package/desktop/index.js +3 -2
- package/desktop/index.js.map +1 -0
- package/esm/Component.responsive.d.ts +3 -5
- package/esm/Component.responsive.js +1 -0
- package/esm/Component.responsive.js.map +1 -0
- package/esm/components/base-pattern-lock/Component.d.ts +3 -5
- package/esm/components/base-pattern-lock/Component.js +3 -4
- package/esm/components/base-pattern-lock/Component.js.map +1 -0
- package/esm/components/base-pattern-lock/index.css +9 -30
- package/esm/components/base-pattern-lock/index.d.ts +1 -1
- package/esm/components/base-pattern-lock/index.js +1 -0
- package/esm/components/base-pattern-lock/index.js.map +1 -0
- package/esm/components/base-pattern-lock/index.module.css.js +6 -0
- package/esm/components/base-pattern-lock/index.module.css.js.map +1 -0
- package/esm/consts.d.ts +6 -7
- package/esm/consts.js +1 -0
- package/esm/consts.js.map +1 -0
- package/esm/desktop/Component.desktop.d.ts +3 -5
- package/esm/desktop/Component.desktop.js +2 -3
- package/esm/desktop/Component.desktop.js.map +1 -0
- package/esm/desktop/desktop.css +6 -28
- package/esm/desktop/desktop.module.css.js +6 -0
- package/esm/desktop/desktop.module.css.js.map +1 -0
- package/esm/desktop/index.d.ts +2 -2
- package/esm/desktop/index.js +1 -0
- package/esm/desktop/index.js.map +1 -0
- package/esm/hooks/use-pattern-lock-cleanup.d.ts +2 -4
- package/esm/hooks/use-pattern-lock-cleanup.js +1 -0
- package/esm/hooks/use-pattern-lock-cleanup.js.map +1 -0
- package/esm/index.d.ts +3 -3
- package/esm/index.js +1 -0
- package/esm/index.js.map +1 -0
- package/esm/mobile/Component.mobile.d.ts +3 -5
- package/esm/mobile/Component.mobile.js +2 -3
- package/esm/mobile/Component.mobile.js.map +1 -0
- package/esm/mobile/index.d.ts +2 -2
- package/esm/mobile/index.js +1 -0
- package/esm/mobile/index.js.map +1 -0
- package/esm/mobile/mobile.css +13 -34
- package/esm/mobile/mobile.module.css.js +6 -0
- package/esm/mobile/mobile.module.css.js.map +1 -0
- package/esm/shared/index.d.ts +2 -2
- package/esm/shared/index.js +1 -0
- package/esm/shared/index.js.map +1 -0
- package/esm/typings.d.ts +6 -6
- package/esm/typings.js +1 -0
- package/esm/typings.js.map +1 -0
- package/esm/utils.d.ts +5 -6
- package/esm/utils.js +2 -1
- package/esm/utils.js.map +1 -0
- package/hooks/use-pattern-lock-cleanup.d.ts +2 -4
- package/hooks/use-pattern-lock-cleanup.js +1 -0
- package/hooks/use-pattern-lock-cleanup.js.map +1 -0
- package/index.d.ts +3 -3
- package/index.js +1 -0
- package/index.js.map +1 -0
- package/mobile/Component.mobile.d.ts +3 -5
- package/mobile/Component.mobile.js +4 -5
- package/mobile/Component.mobile.js.map +1 -0
- package/mobile/index.d.ts +2 -2
- package/mobile/index.js +3 -2
- package/mobile/index.js.map +1 -0
- package/mobile/mobile.css +13 -34
- package/mobile/mobile.module.css.js +8 -0
- package/mobile/mobile.module.css.js.map +1 -0
- package/modern/Component.responsive.d.ts +3 -5
- package/modern/Component.responsive.js +1 -0
- package/modern/Component.responsive.js.map +1 -0
- package/modern/components/base-pattern-lock/Component.d.ts +3 -5
- package/modern/components/base-pattern-lock/Component.js +4 -5
- package/modern/components/base-pattern-lock/Component.js.map +1 -0
- package/modern/components/base-pattern-lock/index.css +9 -30
- package/modern/components/base-pattern-lock/index.d.ts +1 -1
- package/modern/components/base-pattern-lock/index.js +1 -0
- package/modern/components/base-pattern-lock/index.js.map +1 -0
- package/modern/components/base-pattern-lock/index.module.css.js +6 -0
- package/modern/components/base-pattern-lock/index.module.css.js.map +1 -0
- package/modern/consts.d.ts +6 -7
- package/modern/consts.js +1 -0
- package/modern/consts.js.map +1 -0
- package/modern/desktop/Component.desktop.d.ts +3 -5
- package/modern/desktop/Component.desktop.js +2 -3
- package/modern/desktop/Component.desktop.js.map +1 -0
- package/modern/desktop/desktop.css +6 -28
- package/modern/desktop/desktop.module.css.js +6 -0
- package/modern/desktop/desktop.module.css.js.map +1 -0
- package/modern/desktop/index.d.ts +2 -2
- package/modern/desktop/index.js +1 -0
- package/modern/desktop/index.js.map +1 -0
- package/modern/hooks/use-pattern-lock-cleanup.d.ts +2 -4
- package/modern/hooks/use-pattern-lock-cleanup.js +1 -0
- package/modern/hooks/use-pattern-lock-cleanup.js.map +1 -0
- package/modern/index.d.ts +3 -3
- package/modern/index.js +1 -0
- package/modern/index.js.map +1 -0
- package/modern/mobile/Component.mobile.d.ts +3 -5
- package/modern/mobile/Component.mobile.js +2 -3
- package/modern/mobile/Component.mobile.js.map +1 -0
- package/modern/mobile/index.d.ts +2 -2
- package/modern/mobile/index.js +1 -0
- package/modern/mobile/index.js.map +1 -0
- package/modern/mobile/mobile.css +13 -34
- package/modern/mobile/mobile.module.css.js +6 -0
- package/modern/mobile/mobile.module.css.js.map +1 -0
- package/modern/shared/index.d.ts +2 -2
- package/modern/shared/index.js +1 -0
- package/modern/shared/index.js.map +1 -0
- package/modern/typings.d.ts +6 -6
- package/modern/typings.js +1 -0
- package/modern/typings.js.map +1 -0
- package/modern/utils.d.ts +5 -6
- package/modern/utils.js +2 -1
- package/modern/utils.js.map +1 -0
- package/moderncssm/Component.responsive.d.ts +3 -5
- package/moderncssm/Component.responsive.js +1 -0
- package/moderncssm/Component.responsive.js.map +1 -0
- package/moderncssm/components/base-pattern-lock/Component.d.ts +3 -5
- package/moderncssm/components/base-pattern-lock/Component.js +3 -2
- package/moderncssm/components/base-pattern-lock/Component.js.map +1 -0
- package/moderncssm/components/base-pattern-lock/index.d.ts +1 -1
- package/moderncssm/components/base-pattern-lock/index.js +1 -0
- package/moderncssm/components/base-pattern-lock/index.js.map +1 -0
- package/moderncssm/components/base-pattern-lock/index.module.css +0 -1
- package/moderncssm/consts.d.ts +6 -7
- package/moderncssm/consts.js +1 -0
- package/moderncssm/consts.js.map +1 -0
- package/moderncssm/desktop/Component.desktop.d.ts +3 -5
- package/moderncssm/desktop/Component.desktop.js +1 -0
- package/moderncssm/desktop/Component.desktop.js.map +1 -0
- package/moderncssm/desktop/desktop.module.css +0 -1
- package/moderncssm/desktop/index.d.ts +2 -2
- package/moderncssm/desktop/index.js +1 -0
- package/moderncssm/desktop/index.js.map +1 -0
- package/moderncssm/hooks/use-pattern-lock-cleanup.d.ts +2 -4
- package/moderncssm/hooks/use-pattern-lock-cleanup.js +1 -0
- package/moderncssm/hooks/use-pattern-lock-cleanup.js.map +1 -0
- package/moderncssm/index.d.ts +3 -3
- package/moderncssm/index.js +1 -0
- package/moderncssm/index.js.map +1 -0
- package/moderncssm/mobile/Component.mobile.d.ts +3 -5
- package/moderncssm/mobile/Component.mobile.js +1 -0
- package/moderncssm/mobile/Component.mobile.js.map +1 -0
- package/moderncssm/mobile/index.d.ts +2 -2
- package/moderncssm/mobile/index.js +1 -0
- package/moderncssm/mobile/index.js.map +1 -0
- package/moderncssm/mobile/mobile.module.css +0 -1
- package/moderncssm/shared/index.d.ts +2 -2
- package/moderncssm/shared/index.js +1 -0
- package/moderncssm/shared/index.js.map +1 -0
- package/moderncssm/typings.d.ts +6 -6
- package/moderncssm/typings.js +1 -0
- package/moderncssm/typings.js.map +1 -0
- package/moderncssm/utils.d.ts +5 -6
- package/moderncssm/utils.js +2 -1
- package/moderncssm/utils.js.map +1 -0
- package/package.json +6 -6
- package/shared/index.d.ts +2 -2
- package/shared/index.js +3 -2
- package/shared/index.js.map +1 -0
- package/typings.d.ts +6 -6
- package/typings.js +1 -0
- package/typings.js.map +1 -0
- package/utils.d.ts +5 -6
- package/utils.js +1 -0
- package/utils.js.map +1 -0
- package/cssm/vars.css +0 -0
- package/desktop/package.json +0 -3
- package/mobile/package.json +0 -3
- package/moderncssm/vars.css +0 -0
- package/shared/package.json +0 -3
- package/src/desktop/package.json +0 -3
- package/src/mobile/package.json +0 -3
- package/src/shared/package.json +0 -3
|
@@ -1,10 +1,8 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import React from 'react';
|
|
3
|
-
import { TPatternLockInstance } from 'react-canvas-pattern-lock';
|
|
4
|
-
import { PatternLockProps } from
|
|
2
|
+
import type { TPatternLockInstance } from 'react-canvas-pattern-lock';
|
|
3
|
+
import { PatternLockProps } from './typings';
|
|
5
4
|
/**
|
|
6
5
|
* @deprecated
|
|
7
6
|
* Использует PatternLock
|
|
8
7
|
*/
|
|
9
|
-
declare const PatternLockV1: React.ForwardRefExoticComponent<PatternLockProps & React.RefAttributes<TPatternLockInstance>>;
|
|
10
|
-
export { PatternLockV1 };
|
|
8
|
+
export declare const PatternLockV1: React.ForwardRefExoticComponent<PatternLockProps & React.RefAttributes<TPatternLockInstance>>;
|
package/Component.responsive.js
CHANGED
|
@@ -5,8 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var tslib = require('tslib');
|
|
6
6
|
var React = require('react');
|
|
7
7
|
var coreComponentsMq = require('@alfalab/core-components-mq');
|
|
8
|
-
var
|
|
9
|
-
var
|
|
8
|
+
var Component_desktop = require('./desktop/Component.desktop.js');
|
|
9
|
+
var Component_mobile = require('./mobile/Component.mobile.js');
|
|
10
10
|
|
|
11
11
|
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
12
12
|
|
|
@@ -19,8 +19,9 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
|
19
19
|
var PatternLockV1 = React.forwardRef(function (_a, ref) {
|
|
20
20
|
_a.breakpoint; var restProps = tslib.__rest(_a, ["breakpoint"]);
|
|
21
21
|
var isDesktop = coreComponentsMq.useIsDesktop();
|
|
22
|
-
var Component = isDesktop ?
|
|
22
|
+
var Component = isDesktop ? Component_desktop.PatternLockDesktopV1 : Component_mobile.PatternLockMobileV1;
|
|
23
23
|
return React__default.default.createElement(Component, tslib.__assign({ ref: ref }, restProps));
|
|
24
24
|
});
|
|
25
25
|
|
|
26
26
|
exports.PatternLockV1 = PatternLockV1;
|
|
27
|
+
//# sourceMappingURL=Component.responsive.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Component.responsive.js","sources":["src/Component.responsive.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport type { TPatternLockInstance } from 'react-canvas-pattern-lock';\n\nimport { useIsDesktop } from '@alfalab/core-components-mq';\n\nimport { PatternLockDesktopV1 } from './desktop';\nimport { PatternLockMobileV1 } from './mobile';\nimport { PatternLockProps } from './typings';\n\n/**\n * @deprecated\n * Использует PatternLock\n */\nexport const PatternLockV1 = forwardRef<TPatternLockInstance, PatternLockProps>(\n ({ breakpoint, ...restProps }, ref) => {\n const isDesktop = useIsDesktop();\n\n const Component = isDesktop ? PatternLockDesktopV1 : PatternLockMobileV1;\n\n return <Component ref={ref} {...restProps} />;\n },\n);\n"],"names":["forwardRef","__rest","useIsDesktop","PatternLockDesktopV1","PatternLockMobileV1","React","__assign"],"mappings":";;;;;;;;;;;;;;AASA;;;AAGG;IACU,aAAa,GAAGA,gBAAU,CACnC,UAAC,EAA4B,EAAE,GAAG,EAAA;AAA/B,IAAU,EAAA,CAAA,UAAA,CAAA,KAAK,SAAS,GAAAC,YAAA,CAAA,EAAA,EAA1B,cAA4B;AACzB,IAAA,IAAM,SAAS,GAAGC,6BAAY,EAAE;IAEhC,IAAM,SAAS,GAAG,SAAS,GAAGC,sCAAoB,GAAGC,oCAAmB;IAExE,OAAOC,sBAAA,CAAA,aAAA,CAAC,SAAS,EAACC,cAAA,CAAA,EAAA,GAAG,EAAE,GAAG,EAAA,EAAM,SAAS,CAAA,CAAI;AACjD,CAAC;;;;"}
|
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import React from 'react';
|
|
3
|
-
import { TPatternLockInstance } from 'react-canvas-pattern-lock';
|
|
4
|
-
import { CommonPatternLockProps, PrivatePatternLockProps } from
|
|
5
|
-
declare const BasePatternLock: React.ForwardRefExoticComponent<(CommonPatternLockProps & PrivatePatternLockProps) & React.RefAttributes<TPatternLockInstance>>;
|
|
6
|
-
export { BasePatternLock };
|
|
2
|
+
import type { TPatternLockInstance } from 'react-canvas-pattern-lock';
|
|
3
|
+
import type { CommonPatternLockProps, PrivatePatternLockProps } from '../../typings';
|
|
4
|
+
export declare const BasePatternLock: React.ForwardRefExoticComponent<(CommonPatternLockProps & PrivatePatternLockProps) & React.RefAttributes<TPatternLockInstance>>;
|
|
@@ -10,15 +10,13 @@ var mobile = require('@alfalab/core-components-button/mobile');
|
|
|
10
10
|
var coreComponentsShared = require('@alfalab/core-components-shared');
|
|
11
11
|
var consts = require('../../consts.js');
|
|
12
12
|
var utils = require('../../utils.js');
|
|
13
|
+
var index_module = require('./index.module.css.js');
|
|
13
14
|
|
|
14
15
|
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
15
16
|
|
|
16
17
|
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
17
18
|
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
18
19
|
|
|
19
|
-
var commonStyles = {"component":"pattern-lock-v1__component_198nc","hidden":"pattern-lock-v1__hidden_198nc","message":"pattern-lock-v1__message_198nc","error":"pattern-lock-v1__error_198nc","forgotBtn":"pattern-lock-v1__forgotBtn_198nc"};
|
|
20
|
-
require('./index.css')
|
|
21
|
-
|
|
22
20
|
var BasePatternLock = React.forwardRef(function (_a, ref) {
|
|
23
21
|
var _b, _c;
|
|
24
22
|
var _d = _a.observeTokens, observeTokens = _d === void 0 ? false : _d, _e = _a.observerParams, observerParams = _e === void 0 ? {} : _e, _f = _a.justifyNodes, justifyNodes = _f === void 0 ? 'space-between' : _f, className = _a.className, error = _a.error, dataTestId = _a.dataTestId, _g = _a.forgotCodeBtnText, forgotCodeBtnText = _g === void 0 ? 'Забыли код?' : _g, _h = _a.showForgotCodeBtn, showForgotCodeBtn = _h === void 0 ? false : _h, onForgotBtnClick = _a.onForgotBtnClick, _j = _a.extraBounds, extraBounds = _j === void 0 ? consts.DEFAULT_EXTRA_BOUNDS : _j, message = _a.message, messageClassName = _a.messageClassName, hover = _a.hover, _k = _a.styles, styles = _k === void 0 ? {} : _k, restProps = tslib.__rest(_a, ["observeTokens", "observerParams", "justifyNodes", "className", "error", "dataTestId", "forgotCodeBtnText", "showForgotCodeBtn", "onForgotBtnClick", "extraBounds", "message", "messageClassName", "hover", "styles"]);
|
|
@@ -53,16 +51,17 @@ var BasePatternLock = React.forwardRef(function (_a, ref) {
|
|
|
53
51
|
return function () { return styleObserver === null || styleObserver === void 0 ? void 0 : styleObserver.disconnect(); };
|
|
54
52
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
55
53
|
}, [observeTokens]);
|
|
56
|
-
var renderMessage = function () { return (React__default.default.createElement("div", { className: cn__default.default(
|
|
57
|
-
var renderError = function () { return (React__default.default.createElement("div", { className: cn__default.default(
|
|
58
|
-
return (React__default.default.createElement("div", { className: cn__default.default(
|
|
59
|
-
_b[
|
|
54
|
+
var renderMessage = function () { return (React__default.default.createElement("div", { className: cn__default.default(index_module.message, messageClassName), "data-test-id": coreComponentsShared.getDataTestId(dataTestId, 'message') }, message)); };
|
|
55
|
+
var renderError = function () { return (React__default.default.createElement("div", { className: cn__default.default(index_module.message, index_module.error, messageClassName), "data-test-id": coreComponentsShared.getDataTestId(dataTestId, 'error') }, error)); };
|
|
56
|
+
return (React__default.default.createElement("div", { className: cn__default.default(index_module.component, styles.component, className, (_b = {},
|
|
57
|
+
_b[index_module.hidden] = !params,
|
|
60
58
|
_b)), "data-test-id": dataTestId },
|
|
61
59
|
error ? renderError() : renderMessage(),
|
|
62
60
|
React__default.default.createElement(reactCanvasPatternLock.ReactCanvasPatternLock, tslib.__assign({}, restProps, params, { ref: ref, rows: 3, cols: 3, justifyNodes: justifyNodes, extraBounds: extraBounds, hover: hover })),
|
|
63
|
-
showForgotCodeBtn ? (React__default.default.createElement(mobile.ButtonMobile, { view: 'transparent', className: cn__default.default(
|
|
61
|
+
showForgotCodeBtn ? (React__default.default.createElement(mobile.ButtonMobile, { view: 'transparent', className: cn__default.default(index_module.forgotBtn, styles.forgotBtn), onClick: onForgotBtnClick, dataTestId: coreComponentsShared.getDataTestId(dataTestId, 'forgot-code-btn') }, forgotCodeBtnText)) : (React__default.default.createElement("div", { className: cn__default.default(index_module.forgotBtn, styles.forgotBtn, (_c = {},
|
|
64
62
|
_c[styles.hiddenBtn] = Boolean(styles.hiddenBtn),
|
|
65
63
|
_c)) }))));
|
|
66
64
|
});
|
|
67
65
|
|
|
68
66
|
exports.BasePatternLock = BasePatternLock;
|
|
67
|
+
//# sourceMappingURL=Component.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["../../src/components/base-pattern-lock/Component.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useState } from 'react';\nimport type { Theme, TPatternLockInstance } from 'react-canvas-pattern-lock';\nimport { ReactCanvasPatternLock } 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, 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,41 +1,20 @@
|
|
|
1
|
-
|
|
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
|
-
} /* deprecated */ :root {
|
|
1
|
+
:root {
|
|
4
2
|
--color-light-text-negative: #ec2d20;
|
|
5
|
-
--color-light-text-primary: rgba(3, 3, 6, 0.88);
|
|
6
|
-
} :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 */
|
|
7
|
-
} :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 */
|
|
3
|
+
--color-light-text-primary: rgba(3, 3, 6, 0.88);
|
|
8
4
|
} :root {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
/* Up */
|
|
13
|
-
|
|
14
|
-
/* Hard up */
|
|
15
|
-
} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
|
|
16
|
-
|
|
17
|
-
/* новые значения, используйте их */
|
|
18
|
-
} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
|
|
19
|
-
--gap-m: 16px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
|
|
20
|
-
--gap-3xl: 40px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
|
|
21
|
-
|
|
22
|
-
/* новые значения, используйте их */
|
|
23
|
-
|
|
24
|
-
/* no-unit может приводить к проблемам в calc (#1559) */
|
|
25
|
-
/* stylelint-disable-next-line length-zero-no-unit */
|
|
5
|
+
--gap-m: 16px;
|
|
6
|
+
--gap-3xl: 40px;
|
|
26
7
|
--gap-0: 0px;
|
|
27
8
|
--gap-16: var(--gap-m);
|
|
28
9
|
--gap-40: var(--gap-3xl);
|
|
29
10
|
} :root {
|
|
30
|
-
} /* @deprecated */ /* @deprecated */ /* @deprecated */ /* @deprecated */ /* @deprecated */ :root {
|
|
31
11
|
--size-xs-height: 40px;
|
|
32
|
-
}
|
|
33
|
-
} .pattern-lock-v1__component_198nc canvas {
|
|
12
|
+
} .pattern-lock-v1__component_1gy01 canvas {
|
|
34
13
|
display: block;
|
|
35
14
|
margin: var(--gap-0) auto;
|
|
36
|
-
} .pattern-lock-
|
|
15
|
+
} .pattern-lock-v1__hidden_1gy01 {
|
|
37
16
|
visibility: hidden;
|
|
38
|
-
} .pattern-lock-
|
|
17
|
+
} .pattern-lock-v1__message_1gy01 {
|
|
39
18
|
font-size: 16px;
|
|
40
19
|
line-height: 24px;
|
|
41
20
|
font-weight: 400;
|
|
@@ -47,9 +26,9 @@
|
|
|
47
26
|
text-overflow: ellipsis;
|
|
48
27
|
white-space: nowrap;
|
|
49
28
|
color: var(--color-light-text-primary);
|
|
50
|
-
} .pattern-lock-
|
|
29
|
+
} .pattern-lock-v1__error_1gy01 {
|
|
51
30
|
color: var(--color-light-text-negative);
|
|
52
|
-
} .pattern-lock-
|
|
31
|
+
} .pattern-lock-v1__forgotBtn_1gy01 {
|
|
53
32
|
display: block;
|
|
54
33
|
min-height: var(--size-xs-height);
|
|
55
34
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export * from
|
|
1
|
+
export * from './Component';
|
|
@@ -2,8 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var Component = require('./Component.js');
|
|
6
6
|
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
exports.BasePatternLock =
|
|
9
|
+
exports.BasePatternLock = Component.BasePatternLock;
|
|
10
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
require('./index.css');
|
|
4
|
+
|
|
5
|
+
var commonStyles = {"component":"pattern-lock-v1__component_1gy01","hidden":"pattern-lock-v1__hidden_1gy01","message":"pattern-lock-v1__message_1gy01","error":"pattern-lock-v1__error_1gy01","forgotBtn":"pattern-lock-v1__forgotBtn_1gy01"};
|
|
6
|
+
|
|
7
|
+
module.exports = commonStyles;
|
|
8
|
+
//# sourceMappingURL=index.module.css.js.map
|
|
@@ -0,0 +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/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;;;;"}
|
package/consts.d.ts
CHANGED
|
@@ -1,11 +1,10 @@
|
|
|
1
|
-
import { ReactPatternLockProps } from 'react-canvas-pattern-lock';
|
|
2
|
-
import { ObservableTokens } from
|
|
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: {
|
|
1
|
+
import type { ReactPatternLockProps } from 'react-canvas-pattern-lock';
|
|
2
|
+
import type { ObservableTokens } from './typings';
|
|
3
|
+
export declare const OBSERVE_OPTIONS: MutationObserverInit;
|
|
4
|
+
export declare const DEFAULT_EXTRA_BOUNDS: ReactPatternLockProps['extraBounds'];
|
|
5
|
+
export declare const OBSERVABLE_TOKENS: ObservableTokens;
|
|
6
|
+
export declare const THEME_STATE: {
|
|
7
7
|
INITIAL: string;
|
|
8
8
|
SUCCESS: string;
|
|
9
9
|
FAILURE: string;
|
|
10
10
|
};
|
|
11
|
-
export { OBSERVE_OPTIONS, DEFAULT_EXTRA_BOUNDS, OBSERVABLE_TOKENS, THEME_STATE };
|
package/consts.js
CHANGED
package/consts.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"consts.js","sources":["src/consts.ts"],"sourcesContent":["import type { ReactPatternLockProps } from 'react-canvas-pattern-lock';\n\nimport type { ObservableTokens } from './typings';\n\nexport const OBSERVE_OPTIONS: MutationObserverInit = {\n childList: true,\n attributes: false,\n characterData: false,\n subtree: true,\n};\n\nexport const DEFAULT_EXTRA_BOUNDS: ReactPatternLockProps['extraBounds'] = [75, 50, 75, 50];\n\nexport const OBSERVABLE_TOKENS: ObservableTokens = {\n ACCENT_INITIAL: '--color-light-neutral-0-inverted',\n ACCENT_SUCCESS: '--color-light-status-positive',\n ACCENT_FAILURE: '--color-light-status-negative',\n PRIMARY: '--color-light-neutral-500',\n BG: '--color-light-base-bg-primary',\n RING_BG_INITIAL: '--color-light-neutral-translucent-200',\n SELECTED_RING_BG_INITIAL: '--color-light-neutral-translucent-300',\n SELECTED_RING_BG_SUCCESS: '--color-light-status-muted-positive',\n SELECTED_RING_BG_FAILURE: '--color-light-status-muted-negative',\n HOVER_INNER: '--color-light-neutral-500-hover',\n HOVER_OUTER: '--color-light-neutral-translucent-200-hover',\n};\n\nexport const THEME_STATE = {\n INITIAL: 'initial',\n SUCCESS: 'success',\n FAILURE: 'failure',\n};\n"],"names":[],"mappings":";;;;AAIa,IAAA,eAAe,GAAyB;AACjD,IAAA,SAAS,EAAE,IAAI;AACf,IAAA,UAAU,EAAE,KAAK;AACjB,IAAA,aAAa,EAAE,KAAK;AACpB,IAAA,OAAO,EAAE,IAAI;;AAGV,IAAM,oBAAoB,GAAyC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE;AAE5E,IAAA,iBAAiB,GAAqB;AAC/C,IAAA,cAAc,EAAE,kCAAkC;AAClD,IAAA,cAAc,EAAE,+BAA+B;AAC/C,IAAA,cAAc,EAAE,+BAA+B;AAC/C,IAAA,OAAO,EAAE,2BAA2B;AACpC,IAAA,EAAE,EAAE,+BAA+B;AACnC,IAAA,eAAe,EAAE,uCAAuC;AACxD,IAAA,wBAAwB,EAAE,uCAAuC;AACjE,IAAA,wBAAwB,EAAE,qCAAqC;AAC/D,IAAA,wBAAwB,EAAE,qCAAqC;AAC/D,IAAA,WAAW,EAAE,iCAAiC;AAC9C,IAAA,WAAW,EAAE,6CAA6C;;AAGjD,IAAA,WAAW,GAAG;AACvB,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,OAAO,EAAE,SAAS;;;;;;;;"}
|
|
@@ -1,10 +1,8 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import React from 'react';
|
|
3
|
-
import { TPatternLockInstance } from 'react-canvas-pattern-lock';
|
|
4
|
-
import { PatternLockProps } from
|
|
2
|
+
import type { TPatternLockInstance } from 'react-canvas-pattern-lock';
|
|
3
|
+
import { PatternLockProps } from './typings';
|
|
5
4
|
/**
|
|
6
5
|
* @deprecated
|
|
7
6
|
* Использует PatternLock
|
|
8
7
|
*/
|
|
9
|
-
declare const PatternLockV1: React.ForwardRefExoticComponent<PatternLockProps & React.RefAttributes<TPatternLockInstance>>;
|
|
10
|
-
export { PatternLockV1 };
|
|
8
|
+
export declare const PatternLockV1: React.ForwardRefExoticComponent<PatternLockProps & React.RefAttributes<TPatternLockInstance>>;
|
|
@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var tslib = require('tslib');
|
|
6
6
|
var React = require('react');
|
|
7
|
-
var
|
|
8
|
-
var
|
|
9
|
-
var
|
|
7
|
+
var cssm = require('@alfalab/core-components-mq/cssm');
|
|
8
|
+
var Component_desktop = require('./desktop/Component.desktop.js');
|
|
9
|
+
var Component_mobile = require('./mobile/Component.mobile.js');
|
|
10
10
|
|
|
11
11
|
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
12
12
|
|
|
@@ -18,9 +18,10 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
|
18
18
|
*/
|
|
19
19
|
var PatternLockV1 = React.forwardRef(function (_a, ref) {
|
|
20
20
|
_a.breakpoint; var restProps = tslib.__rest(_a, ["breakpoint"]);
|
|
21
|
-
var isDesktop =
|
|
22
|
-
var Component = isDesktop ?
|
|
21
|
+
var isDesktop = cssm.useIsDesktop();
|
|
22
|
+
var Component = isDesktop ? Component_desktop.PatternLockDesktopV1 : Component_mobile.PatternLockMobileV1;
|
|
23
23
|
return React__default.default.createElement(Component, tslib.__assign({ ref: ref }, restProps));
|
|
24
24
|
});
|
|
25
25
|
|
|
26
26
|
exports.PatternLockV1 = PatternLockV1;
|
|
27
|
+
//# sourceMappingURL=Component.responsive.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Component.responsive.js","sources":["../src/Component.responsive.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport type { TPatternLockInstance } from 'react-canvas-pattern-lock';\n\nimport { useIsDesktop } from '@alfalab/core-components-mq';\n\nimport { PatternLockDesktopV1 } from './desktop';\nimport { PatternLockMobileV1 } from './mobile';\nimport { PatternLockProps } from './typings';\n\n/**\n * @deprecated\n * Использует PatternLock\n */\nexport const PatternLockV1 = forwardRef<TPatternLockInstance, PatternLockProps>(\n ({ breakpoint, ...restProps }, ref) => {\n const isDesktop = useIsDesktop();\n\n const Component = isDesktop ? PatternLockDesktopV1 : PatternLockMobileV1;\n\n return <Component ref={ref} {...restProps} />;\n },\n);\n"],"names":["forwardRef","__rest","useIsDesktop","PatternLockDesktopV1","PatternLockMobileV1","React","__assign"],"mappings":";;;;;;;;;;;;;;AASA;;;AAGG;IACU,aAAa,GAAGA,gBAAU,CACnC,UAAC,EAA4B,EAAE,GAAG,EAAA;AAA/B,IAAU,EAAA,CAAA,UAAA,CAAA,KAAK,SAAS,GAAAC,YAAA,CAAA,EAAA,EAA1B,cAA4B;AACzB,IAAA,IAAM,SAAS,GAAGC,iBAAY,EAAE;IAEhC,IAAM,SAAS,GAAG,SAAS,GAAGC,sCAAoB,GAAGC,oCAAmB;IAExE,OAAOC,sBAAA,CAAA,aAAA,CAAC,SAAS,EAACC,cAAA,CAAA,EAAA,GAAG,EAAE,GAAG,EAAA,EAAM,SAAS,CAAA,CAAI;AACjD,CAAC;;;;"}
|
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import React from 'react';
|
|
3
|
-
import { TPatternLockInstance } from 'react-canvas-pattern-lock';
|
|
4
|
-
import { CommonPatternLockProps, PrivatePatternLockProps } from
|
|
5
|
-
declare const BasePatternLock: React.ForwardRefExoticComponent<(CommonPatternLockProps & PrivatePatternLockProps) & React.RefAttributes<TPatternLockInstance>>;
|
|
6
|
-
export { BasePatternLock };
|
|
2
|
+
import type { TPatternLockInstance } from 'react-canvas-pattern-lock';
|
|
3
|
+
import type { CommonPatternLockProps, PrivatePatternLockProps } from '../../typings';
|
|
4
|
+
export declare const BasePatternLock: React.ForwardRefExoticComponent<(CommonPatternLockProps & PrivatePatternLockProps) & React.RefAttributes<TPatternLockInstance>>;
|
|
@@ -7,7 +7,7 @@ var React = require('react');
|
|
|
7
7
|
var reactCanvasPatternLock = require('react-canvas-pattern-lock');
|
|
8
8
|
var cn = require('classnames');
|
|
9
9
|
var mobile = require('@alfalab/core-components-button/cssm/mobile');
|
|
10
|
-
var
|
|
10
|
+
var cssm = require('@alfalab/core-components-shared/cssm');
|
|
11
11
|
var consts = require('../../consts.js');
|
|
12
12
|
var utils = require('../../utils.js');
|
|
13
13
|
var commonStyles = require('./index.module.css');
|
|
@@ -52,16 +52,17 @@ var BasePatternLock = React.forwardRef(function (_a, ref) {
|
|
|
52
52
|
return function () { return styleObserver === null || styleObserver === void 0 ? void 0 : styleObserver.disconnect(); };
|
|
53
53
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
54
54
|
}, [observeTokens]);
|
|
55
|
-
var renderMessage = function () { return (React__default.default.createElement("div", { className: cn__default.default(commonStyles__default.default.message, messageClassName), "data-test-id":
|
|
56
|
-
var renderError = function () { return (React__default.default.createElement("div", { className: cn__default.default(commonStyles__default.default.message, commonStyles__default.default.error, messageClassName), "data-test-id":
|
|
55
|
+
var renderMessage = function () { return (React__default.default.createElement("div", { className: cn__default.default(commonStyles__default.default.message, messageClassName), "data-test-id": cssm.getDataTestId(dataTestId, 'message') }, message)); };
|
|
56
|
+
var renderError = function () { return (React__default.default.createElement("div", { className: cn__default.default(commonStyles__default.default.message, commonStyles__default.default.error, messageClassName), "data-test-id": cssm.getDataTestId(dataTestId, 'error') }, error)); };
|
|
57
57
|
return (React__default.default.createElement("div", { className: cn__default.default(commonStyles__default.default.component, styles.component, className, (_b = {},
|
|
58
58
|
_b[commonStyles__default.default.hidden] = !params,
|
|
59
59
|
_b)), "data-test-id": dataTestId },
|
|
60
60
|
error ? renderError() : renderMessage(),
|
|
61
61
|
React__default.default.createElement(reactCanvasPatternLock.ReactCanvasPatternLock, tslib.__assign({}, restProps, params, { ref: ref, rows: 3, cols: 3, justifyNodes: justifyNodes, extraBounds: extraBounds, hover: hover })),
|
|
62
|
-
showForgotCodeBtn ? (React__default.default.createElement(mobile.ButtonMobile, { view: 'transparent', className: cn__default.default(commonStyles__default.default.forgotBtn, styles.forgotBtn), onClick: onForgotBtnClick, dataTestId:
|
|
62
|
+
showForgotCodeBtn ? (React__default.default.createElement(mobile.ButtonMobile, { view: 'transparent', className: cn__default.default(commonStyles__default.default.forgotBtn, styles.forgotBtn), onClick: onForgotBtnClick, dataTestId: cssm.getDataTestId(dataTestId, 'forgot-code-btn') }, forgotCodeBtnText)) : (React__default.default.createElement("div", { className: cn__default.default(commonStyles__default.default.forgotBtn, styles.forgotBtn, (_c = {},
|
|
63
63
|
_c[styles.hiddenBtn] = Boolean(styles.hiddenBtn),
|
|
64
64
|
_c)) }))));
|
|
65
65
|
});
|
|
66
66
|
|
|
67
67
|
exports.BasePatternLock = BasePatternLock;
|
|
68
|
+
//# sourceMappingURL=Component.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["../../../src/components/base-pattern-lock/Component.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useState } from 'react';\nimport type { Theme, TPatternLockInstance } from 'react-canvas-pattern-lock';\nimport { ReactCanvasPatternLock } 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, 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
|
-
export * from
|
|
1
|
+
export * from './Component';
|
|
@@ -2,8 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var Component = require('./Component.js');
|
|
6
6
|
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
exports.BasePatternLock =
|
|
9
|
+
exports.BasePatternLock = Component.BasePatternLock;
|
|
10
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
|
@@ -1,34 +1,14 @@
|
|
|
1
|
-
:root {
|
|
2
|
-
} /* deprecated */ :root {
|
|
1
|
+
:root {
|
|
3
2
|
--color-light-text-negative: #ec2d20;
|
|
4
|
-
--color-light-text-primary: rgba(3, 3, 6, 0.88);
|
|
5
|
-
} :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 */
|
|
6
|
-
} :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 */
|
|
3
|
+
--color-light-text-primary: rgba(3, 3, 6, 0.88);
|
|
7
4
|
} :root {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
/* Up */
|
|
12
|
-
|
|
13
|
-
/* Hard up */
|
|
14
|
-
} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
|
|
15
|
-
|
|
16
|
-
/* новые значения, используйте их */
|
|
17
|
-
} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
|
|
18
|
-
--gap-m: 16px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
|
|
19
|
-
--gap-3xl: 40px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
|
|
20
|
-
|
|
21
|
-
/* новые значения, используйте их */
|
|
22
|
-
|
|
23
|
-
/* no-unit может приводить к проблемам в calc (#1559) */
|
|
24
|
-
/* stylelint-disable-next-line length-zero-no-unit */
|
|
5
|
+
--gap-m: 16px;
|
|
6
|
+
--gap-3xl: 40px;
|
|
25
7
|
--gap-0: 0px;
|
|
26
8
|
--gap-16: var(--gap-m);
|
|
27
9
|
--gap-40: var(--gap-3xl);
|
|
28
10
|
} :root {
|
|
29
|
-
} /* @deprecated */ /* @deprecated */ /* @deprecated */ /* @deprecated */ /* @deprecated */ :root {
|
|
30
11
|
--size-xs-height: 40px;
|
|
31
|
-
} /* сбрасывает синюю подсветку при нажатии */ :root {
|
|
32
12
|
} .component canvas {
|
|
33
13
|
display: block;
|
|
34
14
|
margin: var(--gap-0) auto;
|
package/cssm/consts.d.ts
CHANGED
|
@@ -1,11 +1,10 @@
|
|
|
1
|
-
import { ReactPatternLockProps } from 'react-canvas-pattern-lock';
|
|
2
|
-
import { ObservableTokens } from
|
|
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: {
|
|
1
|
+
import type { ReactPatternLockProps } from 'react-canvas-pattern-lock';
|
|
2
|
+
import type { ObservableTokens } from './typings';
|
|
3
|
+
export declare const OBSERVE_OPTIONS: MutationObserverInit;
|
|
4
|
+
export declare const DEFAULT_EXTRA_BOUNDS: ReactPatternLockProps['extraBounds'];
|
|
5
|
+
export declare const OBSERVABLE_TOKENS: ObservableTokens;
|
|
6
|
+
export declare const THEME_STATE: {
|
|
7
7
|
INITIAL: string;
|
|
8
8
|
SUCCESS: string;
|
|
9
9
|
FAILURE: string;
|
|
10
10
|
};
|
|
11
|
-
export { OBSERVE_OPTIONS, DEFAULT_EXTRA_BOUNDS, OBSERVABLE_TOKENS, THEME_STATE };
|
package/cssm/consts.js
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"consts.js","sources":["../src/consts.ts"],"sourcesContent":["import type { ReactPatternLockProps } from 'react-canvas-pattern-lock';\n\nimport type { ObservableTokens } from './typings';\n\nexport const OBSERVE_OPTIONS: MutationObserverInit = {\n childList: true,\n attributes: false,\n characterData: false,\n subtree: true,\n};\n\nexport const DEFAULT_EXTRA_BOUNDS: ReactPatternLockProps['extraBounds'] = [75, 50, 75, 50];\n\nexport const OBSERVABLE_TOKENS: ObservableTokens = {\n ACCENT_INITIAL: '--color-light-neutral-0-inverted',\n ACCENT_SUCCESS: '--color-light-status-positive',\n ACCENT_FAILURE: '--color-light-status-negative',\n PRIMARY: '--color-light-neutral-500',\n BG: '--color-light-base-bg-primary',\n RING_BG_INITIAL: '--color-light-neutral-translucent-200',\n SELECTED_RING_BG_INITIAL: '--color-light-neutral-translucent-300',\n SELECTED_RING_BG_SUCCESS: '--color-light-status-muted-positive',\n SELECTED_RING_BG_FAILURE: '--color-light-status-muted-negative',\n HOVER_INNER: '--color-light-neutral-500-hover',\n HOVER_OUTER: '--color-light-neutral-translucent-200-hover',\n};\n\nexport const THEME_STATE = {\n INITIAL: 'initial',\n SUCCESS: 'success',\n FAILURE: 'failure',\n};\n"],"names":[],"mappings":";;;;AAIa,IAAA,eAAe,GAAyB;AACjD,IAAA,SAAS,EAAE,IAAI;AACf,IAAA,UAAU,EAAE,KAAK;AACjB,IAAA,aAAa,EAAE,KAAK;AACpB,IAAA,OAAO,EAAE,IAAI;;AAGV,IAAM,oBAAoB,GAAyC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE;AAE5E,IAAA,iBAAiB,GAAqB;AAC/C,IAAA,cAAc,EAAE,kCAAkC;AAClD,IAAA,cAAc,EAAE,+BAA+B;AAC/C,IAAA,cAAc,EAAE,+BAA+B;AAC/C,IAAA,OAAO,EAAE,2BAA2B;AACpC,IAAA,EAAE,EAAE,+BAA+B;AACnC,IAAA,eAAe,EAAE,uCAAuC;AACxD,IAAA,wBAAwB,EAAE,uCAAuC;AACjE,IAAA,wBAAwB,EAAE,qCAAqC;AAC/D,IAAA,wBAAwB,EAAE,qCAAqC;AAC/D,IAAA,WAAW,EAAE,iCAAiC;AAC9C,IAAA,WAAW,EAAE,6CAA6C;;AAGjD,IAAA,WAAW,GAAG;AACvB,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,OAAO,EAAE,SAAS;;;;;;;;"}
|
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import React from 'react';
|
|
3
|
-
import { TPatternLockInstance } from 'react-canvas-pattern-lock';
|
|
4
|
-
import { CommonPatternLockProps } from
|
|
5
|
-
declare const PatternLockDesktopV1: React.ForwardRefExoticComponent<CommonPatternLockProps & React.RefAttributes<TPatternLockInstance>>;
|
|
6
|
-
export { PatternLockDesktopV1 };
|
|
2
|
+
import type { TPatternLockInstance } from 'react-canvas-pattern-lock';
|
|
3
|
+
import { CommonPatternLockProps } from '../typings';
|
|
4
|
+
export declare const PatternLockDesktopV1: React.ForwardRefExoticComponent<CommonPatternLockProps & React.RefAttributes<TPatternLockInstance>>;
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var tslib = require('tslib');
|
|
6
6
|
var React = require('react');
|
|
7
|
-
var
|
|
7
|
+
var Component = require('../components/base-pattern-lock/Component.js');
|
|
8
8
|
var styles = require('./desktop.module.css');
|
|
9
9
|
|
|
10
10
|
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
@@ -12,6 +12,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
|
|
|
12
12
|
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
13
13
|
var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
|
|
14
14
|
|
|
15
|
-
var PatternLockDesktopV1 = React.forwardRef(function (restProps, ref) { return React__default.default.createElement(
|
|
15
|
+
var PatternLockDesktopV1 = React.forwardRef(function (restProps, ref) { return React__default.default.createElement(Component.BasePatternLock, tslib.__assign({}, restProps, { hover: true, ref: ref, styles: styles__default.default })); });
|
|
16
16
|
|
|
17
17
|
exports.PatternLockDesktopV1 = PatternLockDesktopV1;
|
|
18
|
+
//# sourceMappingURL=Component.desktop.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Component.desktop.js","sources":["../../src/desktop/Component.desktop.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport type { TPatternLockInstance } from 'react-canvas-pattern-lock';\n\nimport { BasePatternLock } from '../components/base-pattern-lock';\nimport { CommonPatternLockProps } from '../typings';\n\nimport styles from './desktop.module.css';\n\nexport const PatternLockDesktopV1 = forwardRef<TPatternLockInstance, CommonPatternLockProps>(\n (restProps, ref) => <BasePatternLock {...restProps} hover={true} ref={ref} styles={styles} />,\n);\n"],"names":["forwardRef","React","BasePatternLock","__assign","styles"],"mappings":";;;;;;;;;;;;;;AAQO,IAAM,oBAAoB,GAAGA,gBAAU,CAC1C,UAAC,SAAS,EAAE,GAAG,EAAA,EAAK,OAAAC,sBAAA,CAAA,aAAA,CAACC,yBAAe,EAAKC,cAAA,CAAA,EAAA,EAAA,SAAS,EAAE,EAAA,KAAK,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,EAAEC,uBAAM,EAAA,CAAA,CAAI,CAAzE,EAAyE;;;;"}
|