@alfalab/core-components-pattern-lock 3.0.0 → 3.1.0-snapshot-92b8690

package/dynamic-mixins/typings.d.ts

@@ -0,0 +1,96 @@
+import { MouseEvent } from 'react';
+import { ReactPatternLockProps } from '@alfalab/react-canvas-pattern-lock';
+declare type ConditionalProps = {
+    /**
+     * Показать кнопку "забыли код"
+     * @default "Забыли код?"
+     */
+    showForgotCodeBtn: true;
+    /**
+     * Текст кнопки "забыли код"
+     * @default "Забыли код?"
+     */
+    forgotCodeBtnText?: string;
+    /**
+     * Коллбэк, вызываемый при клике на кнопку "Забыли код"
+     */
+    onForgotBtnClick: (event: MouseEvent<HTMLButtonElement>) => void;
+} | {
+    showForgotCodeBtn?: false;
+    onForgotBtnClick?: never;
+    forgotCodeBtnText?: never;
+};
+export declare type CommonPatternLockProps = {
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Идентификатор для систем автоматизированного тестирования.
+     * Для сообщения используется модификатор -message, ошибки -error,
+     * кнопки "забыли код" -forgot-code-btn
+     */
+    dataTestId?: string;
+    /**
+     * Следить ли за изменениями значений цветовых токенов
+     * @default false
+     */
+    observeTokens?: boolean;
+    /**
+     * Параметры MutationObserver для наблюдения за изменениями режима(css custom properties)
+     */
+    observerParams?: {
+        getTarget?: () => Node;
+        options?: MutationObserverInit;
+    };
+    /**
+     * Дополнительный класс для message/errorMessage
+     */
+    messageClassName?: string;
+    /**
+     * Отключает ввод паттерна
+     * @default false
+     */
+    disabled?: boolean;
+} & Omit<ReactPatternLockProps, 'theme' | 'width' | 'height' | 'rows' | 'cols' | 'hover' | 'justifyNodes'> & ConditionalProps;
+export declare type PrivatePatternLockProps = {
+    /**
+     * Включает ховер-эффект
+     */
+    hover?: boolean;
+    /**
+     * Стили компонента
+     */
+    styles: {
+        [key: string]: string;
+    };
+};
+export declare type PatternLockProps = CommonPatternLockProps & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number;
+    /**
+     * Версия, которая будет использоваться при серверном рендеринге
+     */
+    client?: 'desktop' | 'mobile';
+    /**
+     * Значение по-умолчанию для хука useMatchMedia
+     * @deprecated Используйте client
+     */
+    defaultMatchMediaValue?: boolean | (() => boolean);
+};
+export declare type ObservableTokens = {
+    ACCENT_INITIAL: string;
+    ACCENT_SUCCESS: string;
+    ACCENT_FAILURE: string;
+    RING_BG_INITIAL: string;
+    SELECTED_RING_BG_INITIAL: string;
+    SELECTED_RING_BG_SUCCESS: string;
+    SELECTED_RING_BG_FAILURE: string;
+    PRIMARY: string;
+    HOVER_INNER: string;
+    HOVER_OUTER: string;
+};
+export {};

package/dynamic-mixins/typings.js

@@ -0,0 +1,3 @@
+'use strict';
+
+//# sourceMappingURL=typings.js.map

package/dynamic-mixins/typings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"typings.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dynamic-mixins/utils.d.ts

@@ -0,0 +1,13 @@
+import { Theme, ThemeParams } from '@alfalab/react-canvas-pattern-lock';
+export declare function getDefaultObserveTarget(): HTMLHeadElement;
+export declare function getColorByToken(token: string): string;
+export declare const getSizes: () => {
+    elementSizes: ThemeParams['dimens'];
+    width: number;
+    height: number;
+};
+export declare function getTheme(dimens: ThemeParams['dimens']): Theme;
+export declare function getPatternLockTestIds(dataTestId: string): {
+    patternLock: string;
+    forgotCodeBtn: string;
+};

package/dynamic-mixins/utils.js

@@ -0,0 +1,72 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var dynamicMixins = require('@alfalab/core-components-shared/dynamic-mixins');
+var consts = require('./consts.js');
+
+function getDefaultObserveTarget() {
+    return document.head;
+}
+function getColorByToken(token) {
+    return getComputedStyle(document.documentElement).getPropertyValue(token);
+}
+var getSizes = (function () {
+    var COMMON_SIZES = {
+        lineWidth: 6,
+        nodeRing: 0,
+        nodeCore: 12,
+    };
+    var cachedSize;
+    return function () {
+        if (cachedSize) {
+            return cachedSize;
+        }
+        cachedSize = {
+            elementSizes: tslib.__assign(tslib.__assign({}, COMMON_SIZES), { nodeRadius: 32 }),
+            width: 240,
+            height: 240,
+        };
+        return cachedSize;
+    };
+})();
+function getTheme(dimens) {
+    var _a;
+    var baseColors = {
+        primary: getColorByToken(consts.OBSERVABLE_TOKENS.PRIMARY),
+        bg: 'transparent',
+        ringBg: getColorByToken(consts.OBSERVABLE_TOKENS.RING_BG_INITIAL),
+        hover: {
+            inner: getColorByToken(consts.OBSERVABLE_TOKENS.HOVER_INNER),
+            outer: getColorByToken(consts.OBSERVABLE_TOKENS.HOVER_OUTER),
+        },
+    };
+    return _a = {},
+        _a[consts.THEME_STATE.INITIAL] = {
+            colors: tslib.__assign(tslib.__assign({}, baseColors), { accent: getColorByToken(consts.OBSERVABLE_TOKENS.ACCENT_INITIAL), selectedRingBg: getColorByToken(consts.OBSERVABLE_TOKENS.SELECTED_RING_BG_INITIAL) }),
+            dimens: dimens,
+        },
+        _a[consts.THEME_STATE.SUCCESS] = {
+            colors: tslib.__assign(tslib.__assign({}, baseColors), { accent: getColorByToken(consts.OBSERVABLE_TOKENS.ACCENT_SUCCESS), selectedRingBg: getColorByToken(consts.OBSERVABLE_TOKENS.SELECTED_RING_BG_SUCCESS) }),
+            dimens: dimens,
+        },
+        _a[consts.THEME_STATE.FAILURE] = {
+            colors: tslib.__assign(tslib.__assign({}, baseColors), { accent: getColorByToken(consts.OBSERVABLE_TOKENS.ACCENT_FAILURE), selectedRingBg: getColorByToken(consts.OBSERVABLE_TOKENS.SELECTED_RING_BG_FAILURE) }),
+            dimens: dimens,
+        },
+        _a;
+}
+function getPatternLockTestIds(dataTestId) {
+    return {
+        patternLock: dataTestId,
+        forgotCodeBtn: dynamicMixins.getDataTestId(dataTestId, 'forgot-code-btn'),
+    };
+}
+
+exports.getColorByToken = getColorByToken;
+exports.getDefaultObserveTarget = getDefaultObserveTarget;
+exports.getPatternLockTestIds = getPatternLockTestIds;
+exports.getSizes = getSizes;
+exports.getTheme = getTheme;
+//# sourceMappingURL=utils.js.map

package/dynamic-mixins/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../src/utils.ts"],"sourcesContent":["import { getDataTestId } from '@alfalab/core-components-shared';\nimport { Theme, ThemeParams } from '@alfalab/react-canvas-pattern-lock';\n\nimport { OBSERVABLE_TOKENS, THEME_STATE } from './consts';\n\nexport function getDefaultObserveTarget() {\n    return document.head;\n}\n\nexport function getColorByToken(token: string) {\n    return getComputedStyle(document.documentElement).getPropertyValue(token);\n}\n\nexport const getSizes = (() => {\n    const COMMON_SIZES = {\n        lineWidth: 6,\n        nodeRing: 0,\n        nodeCore: 12,\n    };\n\n    let cachedSize: { elementSizes: ThemeParams['dimens']; width: number; height: number };\n\n    return () => {\n        if (cachedSize) {\n            return cachedSize;\n        }\n\n        cachedSize = {\n            elementSizes: { ...COMMON_SIZES, nodeRadius: 32 },\n            width: 240,\n            height: 240,\n        };\n\n        return cachedSize;\n    };\n})();\n\nexport function getTheme(dimens: ThemeParams['dimens']): Theme {\n    const baseColors = {\n        primary: getColorByToken(OBSERVABLE_TOKENS.PRIMARY),\n        bg: 'transparent',\n        ringBg: getColorByToken(OBSERVABLE_TOKENS.RING_BG_INITIAL),\n        hover: {\n            inner: getColorByToken(OBSERVABLE_TOKENS.HOVER_INNER),\n            outer: getColorByToken(OBSERVABLE_TOKENS.HOVER_OUTER),\n        },\n    };\n\n    return {\n        [THEME_STATE.INITIAL]: {\n            colors: {\n                ...baseColors,\n                accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_INITIAL),\n                selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_INITIAL),\n            },\n            dimens,\n        },\n        [THEME_STATE.SUCCESS]: {\n            colors: {\n                ...baseColors,\n                accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_SUCCESS),\n                selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_SUCCESS),\n            },\n            dimens,\n        },\n        [THEME_STATE.FAILURE]: {\n            colors: {\n                ...baseColors,\n                accent: getColorByToken(OBSERVABLE_TOKENS.ACCENT_FAILURE),\n                selectedRingBg: getColorByToken(OBSERVABLE_TOKENS.SELECTED_RING_BG_FAILURE),\n            },\n            dimens,\n        },\n    };\n}\n\nexport function getPatternLockTestIds(dataTestId: string) {\n    return {\n        patternLock: dataTestId,\n        forgotCodeBtn: getDataTestId(dataTestId, 'forgot-code-btn'),\n    };\n}\n"],"names":["OBSERVABLE_TOKENS","THEME_STATE","__assign","getDataTestId"],"mappings":";;;;;;;;SAKgB,uBAAuB,GAAA;IACnC,OAAO,QAAQ,CAAC,IAAI;AACxB;AAEM,SAAU,eAAe,CAAC,KAAa,EAAA;IACzC,OAAO,gBAAgB,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC,gBAAgB,CAAC,KAAK,CAAC;AAC7E;AAEO,IAAM,QAAQ,GAAG,CAAC,YAAA;AACrB,IAAA,IAAM,YAAY,GAAG;AACjB,QAAA,SAAS,EAAE,CAAC;AACZ,QAAA,QAAQ,EAAE,CAAC;AACX,QAAA,QAAQ,EAAE,EAAE;KACf;AAED,IAAA,IAAI,UAAkF;IAEtF,OAAO,YAAA;AACH,QAAA,IAAI,UAAU,EAAE;AACZ,YAAA,OAAO,UAAU;AACpB;AAED,QAAA,UAAU,GAAG;AACT,YAAA,YAAY,oCAAO,YAAY,CAAA,EAAA,EAAE,UAAU,EAAE,EAAE,EAAE,CAAA;AACjD,YAAA,KAAK,EAAE,GAAG;AACV,YAAA,MAAM,EAAE,GAAG;SACd;AAED,QAAA,OAAO,UAAU;AACrB,KAAC;AACL,CAAC;AAEK,SAAU,QAAQ,CAAC,MAA6B,EAAA;;AAClD,IAAA,IAAM,UAAU,GAAG;AACf,QAAA,OAAO,EAAE,eAAe,CAACA,wBAAiB,CAAC,OAAO,CAAC;AACnD,QAAA,EAAE,EAAE,aAAa;AACjB,QAAA,MAAM,EAAE,eAAe,CAACA,wBAAiB,CAAC,eAAe,CAAC;AAC1D,QAAA,KAAK,EAAE;AACH,YAAA,KAAK,EAAE,eAAe,CAACA,wBAAiB,CAAC,WAAW,CAAC;AACrD,YAAA,KAAK,EAAE,eAAe,CAACA,wBAAiB,CAAC,WAAW,CAAC;AACxD,SAAA;KACJ;AAED,IAAA,OAAA,EAAA,GAAA,EAAA;QACI,EAAC,CAAAC,kBAAW,CAAC,OAAO,CAAG,GAAA;YACnB,MAAM,EAAAC,cAAA,CAAAA,cAAA,CAAA,EAAA,EACC,UAAU,CACb,EAAA,EAAA,MAAM,EAAE,eAAe,CAACF,wBAAiB,CAAC,cAAc,CAAC,EACzD,cAAc,EAAE,eAAe,CAACA,wBAAiB,CAAC,wBAAwB,CAAC,EAC9E,CAAA;AACD,YAAA,MAAM,EAAA,MAAA;AACT,SAAA;QACD,EAAC,CAAAC,kBAAW,CAAC,OAAO,CAAG,GAAA;YACnB,MAAM,EAAAC,cAAA,CAAAA,cAAA,CAAA,EAAA,EACC,UAAU,CACb,EAAA,EAAA,MAAM,EAAE,eAAe,CAACF,wBAAiB,CAAC,cAAc,CAAC,EACzD,cAAc,EAAE,eAAe,CAACA,wBAAiB,CAAC,wBAAwB,CAAC,EAC9E,CAAA;AACD,YAAA,MAAM,EAAA,MAAA;AACT,SAAA;QACD,EAAC,CAAAC,kBAAW,CAAC,OAAO,CAAG,GAAA;YACnB,MAAM,EAAAC,cAAA,CAAAA,cAAA,CAAA,EAAA,EACC,UAAU,CACb,EAAA,EAAA,MAAM,EAAE,eAAe,CAACF,wBAAiB,CAAC,cAAc,CAAC,EACzD,cAAc,EAAE,eAAe,CAACA,wBAAiB,CAAC,wBAAwB,CAAC,EAC9E,CAAA;AACD,YAAA,MAAM,EAAA,MAAA;AACT,SAAA;AACH,QAAA,EAAA;AACN;AAEM,SAAU,qBAAqB,CAAC,UAAkB,EAAA;IACpD,OAAO;AACH,QAAA,WAAW,EAAE,UAAU;AACvB,QAAA,aAAa,EAAEG,2BAAa,CAAC,UAAU,EAAE,iBAAiB,CAAC;KAC9D;AACL;;;;;;;;"}

package/esm/components/base-pattern-lock/index.css

@@ -8,29 +8,29 @@
     --pattern-lock-min-width: 304px;
     --pattern-lock-min-height: 272px;
     --pattern-lock-with-forgot-btn-min-height: 336px;
-} .pattern-lock__component_a0jbp {
+} .pattern-lock__component_1b7wm {
     display: flex;
     flex-direction: column;
     align-items: center;
     box-sizing: border-box;
     min-height: var(--pattern-lock-min-height)
-} .pattern-lock__component_a0jbp canvas {
+} .pattern-lock__component_1b7wm canvas {
         display: block;
         margin: var(--gap-0) auto;
-    } .pattern-lock__component_a0jbp .pattern-lock__canvasContainer_a0jbp {
+    } .pattern-lock__component_1b7wm .pattern-lock__canvasContainer_1b7wm {
         box-sizing: border-box;
         padding: var(--gap-16) var(--gap-16);
         min-width: var(--pattern-lock-min-width);
         min-height: var(--pattern-lock-min-height)
-    } .pattern-lock__component_a0jbp .pattern-lock__canvasContainer_a0jbp .pattern-lock__canvasInner_a0jbp {
+    } .pattern-lock__component_1b7wm .pattern-lock__canvasContainer_1b7wm .pattern-lock__canvasInner_1b7wm {
             box-sizing: border-box;
             padding: var(--gap-0) var(--gap-16);
             min-width: var(--pattern-lock-min-height);
-        } .pattern-lock__component_a0jbp.pattern-lock__disabled_a0jbp {
+        } .pattern-lock__component_1b7wm.pattern-lock__disabled_1b7wm {
         pointer-events: none;
-    } .pattern-lock__withForgotBtn_a0jbp {
+    } .pattern-lock__withForgotBtn_1b7wm {
     min-height: var(--pattern-lock-with-forgot-btn-min-height);
-} .pattern-lock__forgotBtn_a0jbp {
+} .pattern-lock__forgotBtn_1b7wm {
     display: block;
     min-height: var(--size-xs-height);
 }

package/esm/components/base-pattern-lock/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-var commonStyles = {"component":"pattern-lock__component_a0jbp","canvasContainer":"pattern-lock__canvasContainer_a0jbp","canvasInner":"pattern-lock__canvasInner_a0jbp","disabled":"pattern-lock__disabled_a0jbp","withForgotBtn":"pattern-lock__withForgotBtn_a0jbp","forgotBtn":"pattern-lock__forgotBtn_a0jbp"};
+var commonStyles = {"component":"pattern-lock__component_1b7wm","canvasContainer":"pattern-lock__canvasContainer_1b7wm","canvasInner":"pattern-lock__canvasInner_1b7wm","disabled":"pattern-lock__disabled_1b7wm","withForgotBtn":"pattern-lock__withForgotBtn_1b7wm","forgotBtn":"pattern-lock__forgotBtn_1b7wm"};
 
 export { commonStyles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/base-pattern-lock/index.module.css.js.map

@@ -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    display: flex;\n    flex-direction: column;\n    align-items: center;\n    box-sizing: border-box;\n    min-height: var(--pattern-lock-min-height);\n\n    & canvas {\n        display: block;\n        margin: var(--gap-0) auto;\n    }\n\n    & .canvasContainer {\n        box-sizing: border-box;\n        padding: var(--gap-16) var(--gap-16);\n        min-width: var(--pattern-lock-min-width);\n        min-height: var(--pattern-lock-min-height);\n\n        & .canvasInner {\n            box-sizing: border-box;\n            padding: var(--gap-0) var(--gap-16);\n            min-width: var(--pattern-lock-min-height);\n        }\n    }\n\n    &.disabled {\n        pointer-events: none;\n    }\n}\n\n.withForgotBtn {\n    min-height: var(--pattern-lock-with-forgot-btn-min-height);\n}\n\n.forgotBtn {\n    display: block;\n    min-height: var(--size-xs-height);\n}\n"],"names":[],"mappings":";;AAEgB,mBAAe,CAAC,WAAW,CAAC,+BAA+B,CAAC,iBAAiB,CAAC,qCAAqC,CAAC,aAAa,CAAC,iCAAiC,CAAC,UAAU,CAAC,8BAA8B,CAAC,eAAe,CAAC,mCAAmC,CAAC,WAAW,CAAC,+BAA+B,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/base-pattern-lock/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';\n@import '../../vars.css';\n\n.component {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    box-sizing: border-box;\n    min-height: var(--pattern-lock-min-height);\n\n    & canvas {\n        display: block;\n        margin: var(--gap-0) auto;\n    }\n\n    & .canvasContainer {\n        box-sizing: border-box;\n        padding: var(--gap-16) var(--gap-16);\n        min-width: var(--pattern-lock-min-width);\n        min-height: var(--pattern-lock-min-height);\n\n        & .canvasInner {\n            box-sizing: border-box;\n            padding: var(--gap-0) var(--gap-16);\n            min-width: var(--pattern-lock-min-height);\n        }\n    }\n\n    &.disabled {\n        pointer-events: none;\n    }\n}\n\n.withForgotBtn {\n    min-height: var(--pattern-lock-with-forgot-btn-min-height);\n}\n\n.forgotBtn {\n    display: block;\n    min-height: var(--size-xs-height);\n}\n"],"names":[],"mappings":";;AAEgB,mBAAe,CAAC,WAAW,CAAC,+BAA+B,CAAC,iBAAiB,CAAC,qCAAqC,CAAC,aAAa,CAAC,iCAAiC,CAAC,UAAU,CAAC,8BAA8B,CAAC,eAAe,CAAC,mCAAmC,CAAC,WAAW,CAAC,+BAA+B,CAAC;;;;"}

package/esm/desktop/desktop.css

@@ -4,11 +4,11 @@
     --gap-8: var(--gap-xs);
 } :root {
     --pattern-lock-min-width: 304px;
-} .pattern-lock__component_1f01r {
+} .pattern-lock__component_185ye {
     margin: var(--gap-0) auto;
     min-width: var(--pattern-lock-min-width);
-} .pattern-lock__forgotBtn_1f01r {
+} .pattern-lock__forgotBtn_185ye {
     margin: var(--gap-8) auto var(--gap-0);
-} .pattern-lock__hiddenBtn_1f01r {
+} .pattern-lock__hiddenBtn_185ye {
     display: none;
 }

package/esm/desktop/desktop.module.css.js

@@ -1,6 +1,6 @@
 import './desktop.css';
 
-var styles = {"component":"pattern-lock__component_1f01r","forgotBtn":"pattern-lock__forgotBtn_1f01r","hiddenBtn":"pattern-lock__hiddenBtn_1f01r"};
+var styles = {"component":"pattern-lock__component_185ye","forgotBtn":"pattern-lock__forgotBtn_185ye","hiddenBtn":"pattern-lock__hiddenBtn_185ye"};
 
 export { styles as default };
 //# sourceMappingURL=desktop.module.css.js.map

package/esm/desktop/desktop.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"desktop.module.css.js","sources":["../src/desktop/desktop.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../vars.css';\n\n.component {\n    margin: var(--gap-0) auto;\n    min-width: var(--pattern-lock-min-width);\n}\n\n.forgotBtn {\n    margin: var(--gap-8) auto var(--gap-0);\n}\n\n.hiddenBtn {\n    display: none;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,+BAA+B,CAAC,WAAW,CAAC,+BAA+B,CAAC,WAAW,CAAC,+BAA+B,CAAC;;;;"}
+{"version":3,"file":"desktop.module.css.js","sources":["../src/desktop/desktop.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';\n@import '../vars.css';\n\n.component {\n    margin: var(--gap-0) auto;\n    min-width: var(--pattern-lock-min-width);\n}\n\n.forgotBtn {\n    margin: var(--gap-8) auto var(--gap-0);\n}\n\n.hiddenBtn {\n    display: none;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,+BAA+B,CAAC,WAAW,CAAC,+BAA+B,CAAC,WAAW,CAAC,+BAA+B,CAAC;;;;"}

package/esm/mobile/mobile.css

@@ -4,9 +4,9 @@
     --gap-8: var(--gap-xs);
 } :root {
     --pattern-lock-min-width: 304px;
-} .pattern-lock__component_fini3 {
+} .pattern-lock__component_9mgyp {
     margin: var(--gap-0) auto;
     min-width: var(--pattern-lock-min-width);
-} .pattern-lock__forgotBtn_fini3 {
+} .pattern-lock__forgotBtn_9mgyp {
     margin: var(--gap-8) auto var(--gap-0);
 }

package/esm/mobile/mobile.module.css.js

@@ -1,6 +1,6 @@
 import './mobile.css';
 
-var styles = {"component":"pattern-lock__component_fini3","forgotBtn":"pattern-lock__forgotBtn_fini3"};
+var styles = {"component":"pattern-lock__component_9mgyp","forgotBtn":"pattern-lock__forgotBtn_9mgyp"};
 
 export { styles as default };
 //# sourceMappingURL=mobile.module.css.js.map

package/esm/mobile/mobile.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"mobile.module.css.js","sources":["../src/mobile/mobile.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../vars.css';\n\n.component {\n    margin: var(--gap-0) auto;\n    min-width: var(--pattern-lock-min-width);\n}\n\n.forgotBtn {\n    margin: var(--gap-8) auto var(--gap-0);\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,+BAA+B,CAAC,WAAW,CAAC,+BAA+B,CAAC;;;;"}
+{"version":3,"file":"mobile.module.css.js","sources":["../src/mobile/mobile.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';\n@import '../vars.css';\n\n.component {\n    margin: var(--gap-0) auto;\n    min-width: var(--pattern-lock-min-width);\n}\n\n.forgotBtn {\n    margin: var(--gap-8) auto var(--gap-0);\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,+BAA+B,CAAC,WAAW,CAAC,+BAA+B,CAAC;;;;"}

package/mobile/mobile.css

@@ -4,9 +4,9 @@
     --gap-8: var(--gap-xs);
 } :root {
     --pattern-lock-min-width: 304px;
-} .pattern-lock__component_fini3 {
+} .pattern-lock__component_9mgyp {
     margin: var(--gap-0) auto;
     min-width: var(--pattern-lock-min-width);
-} .pattern-lock__forgotBtn_fini3 {
+} .pattern-lock__forgotBtn_9mgyp {
     margin: var(--gap-8) auto var(--gap-0);
 }

package/mobile/mobile.module.css.js

@@ -2,7 +2,7 @@
 
 require('./mobile.css');
 
-var styles = {"component":"pattern-lock__component_fini3","forgotBtn":"pattern-lock__forgotBtn_fini3"};
+var styles = {"component":"pattern-lock__component_9mgyp","forgotBtn":"pattern-lock__forgotBtn_9mgyp"};
 
 module.exports = styles;
 //# sourceMappingURL=mobile.module.css.js.map

package/mobile/mobile.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"mobile.module.css.js","sources":["../src/mobile/mobile.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../vars.css';\n\n.component {\n    margin: var(--gap-0) auto;\n    min-width: var(--pattern-lock-min-width);\n}\n\n.forgotBtn {\n    margin: var(--gap-8) auto var(--gap-0);\n}\n"],"names":[],"mappings":";;;;AAEgB,aAAe,CAAC,WAAW,CAAC,+BAA+B,CAAC,WAAW,CAAC,+BAA+B,CAAC;;;;"}
+{"version":3,"file":"mobile.module.css.js","sources":["../src/mobile/mobile.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';\n@import '../vars.css';\n\n.component {\n    margin: var(--gap-0) auto;\n    min-width: var(--pattern-lock-min-width);\n}\n\n.forgotBtn {\n    margin: var(--gap-8) auto var(--gap-0);\n}\n"],"names":[],"mappings":";;;;AAEgB,aAAe,CAAC,WAAW,CAAC,+BAA+B,CAAC,WAAW,CAAC,+BAA+B,CAAC;;;;"}

package/modern/components/base-pattern-lock/index.css

@@ -8,29 +8,29 @@
     --pattern-lock-min-width: 304px;
     --pattern-lock-min-height: 272px;
     --pattern-lock-with-forgot-btn-min-height: 336px;
-} .pattern-lock__component_a0jbp {
+} .pattern-lock__component_1b7wm {
     display: flex;
     flex-direction: column;
     align-items: center;
     box-sizing: border-box;
     min-height: var(--pattern-lock-min-height)
-} .pattern-lock__component_a0jbp canvas {
+} .pattern-lock__component_1b7wm canvas {
         display: block;
         margin: var(--gap-0) auto;
-    } .pattern-lock__component_a0jbp .pattern-lock__canvasContainer_a0jbp {
+    } .pattern-lock__component_1b7wm .pattern-lock__canvasContainer_1b7wm {
         box-sizing: border-box;
         padding: var(--gap-16) var(--gap-16);
         min-width: var(--pattern-lock-min-width);
         min-height: var(--pattern-lock-min-height)
-    } .pattern-lock__component_a0jbp .pattern-lock__canvasContainer_a0jbp .pattern-lock__canvasInner_a0jbp {
+    } .pattern-lock__component_1b7wm .pattern-lock__canvasContainer_1b7wm .pattern-lock__canvasInner_1b7wm {
             box-sizing: border-box;
             padding: var(--gap-0) var(--gap-16);
             min-width: var(--pattern-lock-min-height);
-        } .pattern-lock__component_a0jbp.pattern-lock__disabled_a0jbp {
+        } .pattern-lock__component_1b7wm.pattern-lock__disabled_1b7wm {
         pointer-events: none;
-    } .pattern-lock__withForgotBtn_a0jbp {
+    } .pattern-lock__withForgotBtn_1b7wm {
     min-height: var(--pattern-lock-with-forgot-btn-min-height);
-} .pattern-lock__forgotBtn_a0jbp {
+} .pattern-lock__forgotBtn_1b7wm {
     display: block;
     min-height: var(--size-xs-height);
 }

package/modern/components/base-pattern-lock/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-const commonStyles = {"component":"pattern-lock__component_a0jbp","canvasContainer":"pattern-lock__canvasContainer_a0jbp","canvasInner":"pattern-lock__canvasInner_a0jbp","disabled":"pattern-lock__disabled_a0jbp","withForgotBtn":"pattern-lock__withForgotBtn_a0jbp","forgotBtn":"pattern-lock__forgotBtn_a0jbp"};
+const commonStyles = {"component":"pattern-lock__component_1b7wm","canvasContainer":"pattern-lock__canvasContainer_1b7wm","canvasInner":"pattern-lock__canvasInner_1b7wm","disabled":"pattern-lock__disabled_1b7wm","withForgotBtn":"pattern-lock__withForgotBtn_1b7wm","forgotBtn":"pattern-lock__forgotBtn_1b7wm"};
 
 export { commonStyles as default };
 //# sourceMappingURL=index.module.css.js.map

package/modern/components/base-pattern-lock/index.module.css.js.map

@@ -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    display: flex;\n    flex-direction: column;\n    align-items: center;\n    box-sizing: border-box;\n    min-height: var(--pattern-lock-min-height);\n\n    & canvas {\n        display: block;\n        margin: var(--gap-0) auto;\n    }\n\n    & .canvasContainer {\n        box-sizing: border-box;\n        padding: var(--gap-16) var(--gap-16);\n        min-width: var(--pattern-lock-min-width);\n        min-height: var(--pattern-lock-min-height);\n\n        & .canvasInner {\n            box-sizing: border-box;\n            padding: var(--gap-0) var(--gap-16);\n            min-width: var(--pattern-lock-min-height);\n        }\n    }\n\n    &.disabled {\n        pointer-events: none;\n    }\n}\n\n.withForgotBtn {\n    min-height: var(--pattern-lock-with-forgot-btn-min-height);\n}\n\n.forgotBtn {\n    display: block;\n    min-height: var(--size-xs-height);\n}\n"],"names":[],"mappings":";;AAEgB,qBAAe,CAAC,WAAW,CAAC,+BAA+B,CAAC,iBAAiB,CAAC,qCAAqC,CAAC,aAAa,CAAC,iCAAiC,CAAC,UAAU,CAAC,8BAA8B,CAAC,eAAe,CAAC,mCAAmC,CAAC,WAAW,CAAC,+BAA+B,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/base-pattern-lock/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';\n@import '../../vars.css';\n\n.component {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    box-sizing: border-box;\n    min-height: var(--pattern-lock-min-height);\n\n    & canvas {\n        display: block;\n        margin: var(--gap-0) auto;\n    }\n\n    & .canvasContainer {\n        box-sizing: border-box;\n        padding: var(--gap-16) var(--gap-16);\n        min-width: var(--pattern-lock-min-width);\n        min-height: var(--pattern-lock-min-height);\n\n        & .canvasInner {\n            box-sizing: border-box;\n            padding: var(--gap-0) var(--gap-16);\n            min-width: var(--pattern-lock-min-height);\n        }\n    }\n\n    &.disabled {\n        pointer-events: none;\n    }\n}\n\n.withForgotBtn {\n    min-height: var(--pattern-lock-with-forgot-btn-min-height);\n}\n\n.forgotBtn {\n    display: block;\n    min-height: var(--size-xs-height);\n}\n"],"names":[],"mappings":";;AAEgB,qBAAe,CAAC,WAAW,CAAC,+BAA+B,CAAC,iBAAiB,CAAC,qCAAqC,CAAC,aAAa,CAAC,iCAAiC,CAAC,UAAU,CAAC,8BAA8B,CAAC,eAAe,CAAC,mCAAmC,CAAC,WAAW,CAAC,+BAA+B,CAAC;;;;"}

package/modern/desktop/desktop.css

@@ -4,11 +4,11 @@
     --gap-8: var(--gap-xs);
 } :root {
     --pattern-lock-min-width: 304px;
-} .pattern-lock__component_1f01r {
+} .pattern-lock__component_185ye {
     margin: var(--gap-0) auto;
     min-width: var(--pattern-lock-min-width);
-} .pattern-lock__forgotBtn_1f01r {
+} .pattern-lock__forgotBtn_185ye {
     margin: var(--gap-8) auto var(--gap-0);
-} .pattern-lock__hiddenBtn_1f01r {
+} .pattern-lock__hiddenBtn_185ye {
     display: none;
 }

package/modern/desktop/desktop.module.css.js

@@ -1,6 +1,6 @@
 import './desktop.css';
 
-const styles = {"component":"pattern-lock__component_1f01r","forgotBtn":"pattern-lock__forgotBtn_1f01r","hiddenBtn":"pattern-lock__hiddenBtn_1f01r"};
+const styles = {"component":"pattern-lock__component_185ye","forgotBtn":"pattern-lock__forgotBtn_185ye","hiddenBtn":"pattern-lock__hiddenBtn_185ye"};
 
 export { styles as default };
 //# sourceMappingURL=desktop.module.css.js.map

package/modern/desktop/desktop.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"desktop.module.css.js","sources":["../src/desktop/desktop.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../vars.css';\n\n.component {\n    margin: var(--gap-0) auto;\n    min-width: var(--pattern-lock-min-width);\n}\n\n.forgotBtn {\n    margin: var(--gap-8) auto var(--gap-0);\n}\n\n.hiddenBtn {\n    display: none;\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,+BAA+B,CAAC,WAAW,CAAC,+BAA+B,CAAC,WAAW,CAAC,+BAA+B,CAAC;;;;"}
+{"version":3,"file":"desktop.module.css.js","sources":["../src/desktop/desktop.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';\n@import '../vars.css';\n\n.component {\n    margin: var(--gap-0) auto;\n    min-width: var(--pattern-lock-min-width);\n}\n\n.forgotBtn {\n    margin: var(--gap-8) auto var(--gap-0);\n}\n\n.hiddenBtn {\n    display: none;\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,+BAA+B,CAAC,WAAW,CAAC,+BAA+B,CAAC,WAAW,CAAC,+BAA+B,CAAC;;;;"}

package/modern/mobile/mobile.css

@@ -4,9 +4,9 @@
     --gap-8: var(--gap-xs);
 } :root {
     --pattern-lock-min-width: 304px;
-} .pattern-lock__component_fini3 {
+} .pattern-lock__component_9mgyp {
     margin: var(--gap-0) auto;
     min-width: var(--pattern-lock-min-width);
-} .pattern-lock__forgotBtn_fini3 {
+} .pattern-lock__forgotBtn_9mgyp {
     margin: var(--gap-8) auto var(--gap-0);
 }

package/modern/mobile/mobile.module.css.js

@@ -1,6 +1,6 @@
 import './mobile.css';
 
-const styles = {"component":"pattern-lock__component_fini3","forgotBtn":"pattern-lock__forgotBtn_fini3"};
+const styles = {"component":"pattern-lock__component_9mgyp","forgotBtn":"pattern-lock__forgotBtn_9mgyp"};
 
 export { styles as default };
 //# sourceMappingURL=mobile.module.css.js.map

package/modern/mobile/mobile.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"mobile.module.css.js","sources":["../src/mobile/mobile.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../vars.css';\n\n.component {\n    margin: var(--gap-0) auto;\n    min-width: var(--pattern-lock-min-width);\n}\n\n.forgotBtn {\n    margin: var(--gap-8) auto var(--gap-0);\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,+BAA+B,CAAC,WAAW,CAAC,+BAA+B,CAAC;;;;"}
+{"version":3,"file":"mobile.module.css.js","sources":["../src/mobile/mobile.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';\n@import '../vars.css';\n\n.component {\n    margin: var(--gap-0) auto;\n    min-width: var(--pattern-lock-min-width);\n}\n\n.forgotBtn {\n    margin: var(--gap-8) auto var(--gap-0);\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,+BAA+B,CAAC,WAAW,CAAC,+BAA+B,CAAC;;;;"}

package/moderncssm/components/base-pattern-lock/index.module.css

@@ -3,6 +3,7 @@
     --pattern-lock-min-height: 272px;
     --pattern-lock-with-forgot-btn-min-height: 336px;
 }
+
 .component {
     display: flex;
     flex-direction: column;
@@ -10,27 +11,33 @@
     box-sizing: border-box;
     min-height: var(--pattern-lock-min-height)
 }
+
 .component canvas {
         display: block;
         margin: var(--gap-0) auto;
     }
+
 .component .canvasContainer {
         box-sizing: border-box;
         padding: var(--gap-16) var(--gap-16);
         min-width: var(--pattern-lock-min-width);
         min-height: var(--pattern-lock-min-height)
     }
+
 .component .canvasContainer .canvasInner {
             box-sizing: border-box;
             padding: var(--gap-0) var(--gap-16);
             min-width: var(--pattern-lock-min-height);
         }
+
 .component.disabled {
         pointer-events: none;
     }
+
 .withForgotBtn {
     min-height: var(--pattern-lock-with-forgot-btn-min-height);
 }
+
 .forgotBtn {
     display: block;
     min-height: var(--size-xs-height);

package/moderncssm/desktop/desktop.module.css

@@ -1,13 +1,16 @@
 :root {
     --pattern-lock-min-width: 304px;
 }
+
 .component {
     margin: var(--gap-0) auto;
     min-width: var(--pattern-lock-min-width);
 }
+
 .forgotBtn {
     margin: var(--gap-8) auto var(--gap-0);
 }
+
 .hiddenBtn {
     display: none;
 }

package/moderncssm/mobile/mobile.module.css

@@ -1,10 +1,12 @@
 :root {
     --pattern-lock-min-width: 304px;
 }
+
 .component {
     margin: var(--gap-0) auto;
     min-width: var(--pattern-lock-min-width);
 }
+
 .forgotBtn {
     margin: var(--gap-8) auto var(--gap-0);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alfalab/core-components-pattern-lock",
-    "version": "3.0.0",
+    "version": "3.1.0-snapshot-92b8690",
     "description": "Pattern lock",
     "keywords": [],
     "license": "MIT",
@@ -10,9 +10,9 @@
     "main": "index.js",
     "module": "./esm/index.js",
     "dependencies": {
-        "@alfalab/core-components-button": "^12.0.0",
-        "@alfalab/core-components-mq": "^5.0.0",
-        "@alfalab/core-components-shared": "^1.0.0",
+        "@alfalab/core-components-button": "12.1.0-snapshot-92b8690",
+        "@alfalab/core-components-mq": "5.1.0-snapshot-92b8690",
+        "@alfalab/core-components-shared": "1.1.0-snapshot-92b8690",
         "@alfalab/react-canvas-pattern-lock": "^2.0.7",
         "classnames": "^2.5.1",
         "tslib": "^2.4.0"
@@ -25,6 +25,6 @@
         "access": "public",
         "directory": "dist"
     },
-    "themesVersion": "14.0.0",
-    "varsVersion": "10.0.0"
+    "themesVersion": "14.1.0-snapshot-92b8690",
+    "varsVersion": "10.1.0-snapshot-92b8690"
 }

package/src/components/base-pattern-lock/index.module.css

@@ -1,4 +1,4 @@
-@import '@alfalab/core-components-vars/src/index.css';
+@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';
 @import '../../vars.css';
 
 .component {

package/src/desktop/desktop.module.css

@@ -1,4 +1,4 @@
-@import '@alfalab/core-components-vars/src/index.css';
+@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';
 @import '../vars.css';
 
 .component {

package/src/mobile/mobile.module.css

@@ -1,4 +1,4 @@
-@import '@alfalab/core-components-vars/src/index.css';
+@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';
 @import '../vars.css';
 
 .component {