@salutejs/plasma-new-hope 0.327.0-canary.1973.15677961605.0 → 0.327.0-canary.1973.15733948288.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.
- package/cjs/components/CodeField/CodeField.js +10 -15
- package/cjs/components/CodeField/CodeField.js.map +1 -1
- package/cjs/components/CodeInput/CodeInput.js +13 -21
- package/cjs/components/CodeInput/CodeInput.js.map +1 -1
- package/cjs/components/CodeInput/CodeInput.tokens.js.map +1 -1
- package/cjs/components/CodeInput/utils/handleCodeError.js +2 -2
- package/cjs/components/CodeInput/utils/handleCodeError.js.map +1 -1
- package/cjs/components/CodeInput/utils/handleItemError.js +1 -1
- package/cjs/components/CodeInput/utils/handleItemError.js.map +1 -1
- package/cjs/components/CodeInput/variations/_size/base.js.map +1 -1
- package/cjs/hooks/useCodeHook.js +34 -0
- package/cjs/hooks/useCodeHook.js.map +1 -0
- package/cjs/index.js +6 -0
- package/cjs/index.js.map +1 -1
- package/cjs/utils/constants.js +12 -0
- package/cjs/utils/constants.js.map +1 -1
- package/cjs/utils/index.js.map +1 -1
- package/cjs/utils/initialValuesHelper.js.map +1 -0
- package/emotion/cjs/components/CodeField/CodeField.js +9 -15
- package/emotion/cjs/components/CodeInput/CodeInput.js +11 -20
- package/emotion/cjs/components/CodeInput/utils/handleCodeError.js +3 -3
- package/emotion/cjs/components/CodeInput/utils/handleItemError.js +1 -1
- package/emotion/cjs/components/CodeInput/utils/index.js +4 -4
- package/emotion/cjs/components/CodeInput/variations/_size/base.js +1 -1
- package/emotion/cjs/hooks/index.js +8 -1
- package/emotion/cjs/hooks/useCodeHook.js +32 -0
- package/emotion/cjs/utils/constants.js +8 -2
- package/emotion/cjs/utils/index.js +12 -0
- package/emotion/es/components/CodeField/CodeField.js +11 -16
- package/emotion/es/components/CodeInput/CodeInput.js +13 -21
- package/emotion/es/components/CodeInput/utils/handleCodeError.js +2 -2
- package/emotion/es/components/CodeInput/utils/handleItemError.js +1 -1
- package/emotion/es/components/CodeInput/utils/index.js +1 -1
- package/emotion/es/components/CodeInput/variations/_size/base.js +1 -1
- package/emotion/es/hooks/index.js +2 -1
- package/emotion/es/hooks/useCodeHook.js +26 -0
- package/emotion/es/utils/constants.js +7 -1
- package/emotion/es/utils/index.js +1 -0
- package/es/components/CodeField/CodeField.js +11 -16
- package/es/components/CodeField/CodeField.js.map +1 -1
- package/es/components/CodeInput/CodeInput.js +14 -22
- package/es/components/CodeInput/CodeInput.js.map +1 -1
- package/es/components/CodeInput/CodeInput.tokens.js.map +1 -1
- package/es/components/CodeInput/utils/handleCodeError.js +2 -2
- package/es/components/CodeInput/utils/handleCodeError.js.map +1 -1
- package/es/components/CodeInput/utils/handleItemError.js +1 -1
- package/es/components/CodeInput/utils/handleItemError.js.map +1 -1
- package/es/components/CodeInput/variations/_size/base.js.map +1 -1
- package/es/hooks/useCodeHook.js +30 -0
- package/es/hooks/useCodeHook.js.map +1 -0
- package/es/index.js +2 -0
- package/es/index.js.map +1 -1
- package/es/utils/constants.js +7 -1
- package/es/utils/constants.js.map +1 -1
- package/es/utils/index.js.map +1 -1
- package/es/utils/initialValuesHelper.js.map +1 -0
- package/package.json +2 -2
- package/styled-components/cjs/components/CodeField/CodeField.js +9 -15
- package/styled-components/cjs/components/CodeInput/CodeInput.js +11 -20
- package/styled-components/cjs/components/CodeInput/utils/handleCodeError.js +3 -3
- package/styled-components/cjs/components/CodeInput/utils/handleItemError.js +1 -1
- package/styled-components/cjs/components/CodeInput/utils/index.js +4 -4
- package/styled-components/cjs/hooks/index.js +8 -1
- package/styled-components/cjs/hooks/useCodeHook.js +32 -0
- package/styled-components/cjs/utils/constants.js +8 -2
- package/styled-components/cjs/utils/index.js +12 -0
- package/styled-components/es/components/CodeField/CodeField.js +11 -16
- package/styled-components/es/components/CodeInput/CodeInput.js +13 -21
- package/styled-components/es/components/CodeInput/utils/handleCodeError.js +2 -2
- package/styled-components/es/components/CodeInput/utils/handleItemError.js +1 -1
- package/styled-components/es/components/CodeInput/utils/index.js +1 -1
- package/styled-components/es/hooks/index.js +2 -1
- package/styled-components/es/hooks/useCodeHook.js +26 -0
- package/styled-components/es/utils/constants.js +7 -1
- package/styled-components/es/utils/index.js +1 -0
- package/types/components/CodeField/CodeField.d.ts.map +1 -1
- package/types/components/CodeInput/CodeInput.d.ts +0 -2
- package/types/components/CodeInput/CodeInput.d.ts.map +1 -1
- package/types/components/CodeInput/CodeInput.tokens.d.ts +1 -0
- package/types/components/CodeInput/CodeInput.tokens.d.ts.map +1 -1
- package/types/components/CodeInput/CodeInput.types.d.ts +2 -6
- package/types/components/CodeInput/CodeInput.types.d.ts.map +1 -1
- package/types/components/CodeInput/utils/handleCodeError.d.ts.map +1 -1
- package/types/components/CodeInput/utils/handleItemError.d.ts.map +1 -1
- package/types/components/CodeInput/utils/index.d.ts +1 -1
- package/types/components/CodeInput/utils/index.d.ts.map +1 -1
- package/types/components/CodeInput/variations/_size/base.d.ts.map +1 -1
- package/types/hooks/index.d.ts +1 -0
- package/types/hooks/index.d.ts.map +1 -1
- package/types/hooks/useCodeHook.d.ts +13 -0
- package/types/hooks/useCodeHook.d.ts.map +1 -0
- package/types/utils/constants.d.ts +6 -0
- package/types/utils/constants.d.ts.map +1 -1
- package/types/utils/index.d.ts +1 -0
- package/types/utils/index.d.ts.map +1 -1
- package/types/utils/initialValuesHelper.d.ts.map +1 -0
- package/cjs/components/CodeInput/utils/constants.js +0 -14
- package/cjs/components/CodeInput/utils/constants.js.map +0 -1
- package/cjs/components/CodeInput/utils/initialValuesHelper.js.map +0 -1
- package/emotion/cjs/components/CodeInput/utils/constants.js +0 -12
- package/emotion/cjs/components/CodeInput/utils/types.js +0 -5
- package/emotion/es/components/CodeInput/utils/constants.js +0 -6
- package/emotion/es/components/CodeInput/utils/types.js +0 -1
- package/es/components/CodeInput/utils/constants.js +0 -7
- package/es/components/CodeInput/utils/constants.js.map +0 -1
- package/es/components/CodeInput/utils/initialValuesHelper.js.map +0 -1
- package/styled-components/cjs/components/CodeInput/utils/constants.js +0 -12
- package/styled-components/cjs/components/CodeInput/utils/types.js +0 -5
- package/styled-components/es/components/CodeInput/utils/constants.js +0 -6
- package/styled-components/es/components/CodeInput/utils/types.js +0 -1
- package/types/components/CodeInput/utils/constants.d.ts +0 -7
- package/types/components/CodeInput/utils/constants.d.ts.map +0 -1
- package/types/components/CodeInput/utils/initialValuesHelper.d.ts.map +0 -1
- package/types/components/CodeInput/utils/types.d.ts +0 -11
- package/types/components/CodeInput/utils/types.d.ts.map +0 -1
- /package/cjs/{components/CodeInput/utils → utils}/initialValuesHelper.js +0 -0
- /package/emotion/cjs/{components/CodeInput/utils → utils}/initialValuesHelper.js +0 -0
- /package/emotion/es/{components/CodeInput/utils → utils}/initialValuesHelper.js +0 -0
- /package/es/{components/CodeInput/utils → utils}/initialValuesHelper.js +0 -0
- /package/styled-components/cjs/{components/CodeInput/utils → utils}/initialValuesHelper.js +0 -0
- /package/styled-components/es/{components/CodeInput/utils → utils}/initialValuesHelper.js +0 -0
- /package/types/{components/CodeInput/utils → utils}/initialValuesHelper.d.ts +0 -0
package/cjs/index.js
CHANGED
@@ -27,6 +27,7 @@ var useDidMountEffect = require('./hooks/useDidMountEffect.js');
|
|
27
27
|
var useDidMountLayoutEffect = require('./hooks/useDidMountLayoutEffect.js');
|
28
28
|
var useOutsideClick = require('./hooks/useOutsideClick.js');
|
29
29
|
var useIsomorphicLayoutEffect = require('./hooks/useIsomorphicLayoutEffect.js');
|
30
|
+
var useCodeHook = require('./hooks/useCodeHook.js');
|
30
31
|
var canUseDOM = require('./utils/canUseDOM.js');
|
31
32
|
var extractTextFrom = require('./utils/extractTextFrom.js');
|
32
33
|
var getSizeValueFromProp = require('./utils/getSizeValueFromProp.js');
|
@@ -40,6 +41,7 @@ var getHeightAsNumber = require('./utils/getHeightAsNumber.js');
|
|
40
41
|
var createConditionalComponent = require('./utils/createConditionalComponent.js');
|
41
42
|
var fixedForwardRef = require('./utils/fixedForwardRef.js');
|
42
43
|
var getPopoverPlacement = require('./utils/getPopoverPlacement.js');
|
44
|
+
var initialValuesHelper = require('./utils/initialValuesHelper.js');
|
43
45
|
var constants = require('./utils/constants.js');
|
44
46
|
var Button = require('./components/Button/Button.js');
|
45
47
|
var Button_tokens = require('./components/Button/Button.tokens.js');
|
@@ -343,6 +345,7 @@ exports.useDidMountEffect = useDidMountEffect.useDidMountEffect;
|
|
343
345
|
exports.useDidMountLayoutEffect = useDidMountLayoutEffect.useDidMountLayoutEffect;
|
344
346
|
exports.useOutsideClick = useOutsideClick.useOutsideClick;
|
345
347
|
exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect.useIsomorphicLayoutEffect;
|
348
|
+
exports.useCodeHook = useCodeHook.useCodeHook;
|
346
349
|
exports.canUseDOM = canUseDOM.canUseDOM;
|
347
350
|
exports.extractTextFrom = extractTextFrom.extractTextFrom;
|
348
351
|
exports.getSizeValueFromProp = getSizeValueFromProp.getSizeValueFromProp;
|
@@ -359,6 +362,9 @@ exports.createConditionalComponent = createConditionalComponent.createConditiona
|
|
359
362
|
exports.fixedForwardRef = fixedForwardRef.fixedForwardRef;
|
360
363
|
exports.getPlacement = getPopoverPlacement.getPlacement;
|
361
364
|
exports.getPlacements = getPopoverPlacement.getPlacements;
|
365
|
+
exports.getCodeValue = initialValuesHelper.getCodeValue;
|
366
|
+
exports.getFieldPattern = initialValuesHelper.getFieldPattern;
|
367
|
+
exports.getPlaceholderValue = initialValuesHelper.getPlaceholderValue;
|
362
368
|
exports.constants = constants;
|
363
369
|
exports.buttonConfig = Button.buttonConfig;
|
364
370
|
exports.buttonRoot = Button.buttonRoot;
|
package/cjs/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/cjs/utils/constants.js
CHANGED
@@ -20,7 +20,19 @@ var screenGroupBreakpoints = {
|
|
20
20
|
medium: '35rem',
|
21
21
|
large: '60rem'
|
22
22
|
};
|
23
|
+
var ONLY_DIGITS_PATTERN = '^\\d+$';
|
24
|
+
var ONLY_CHARS_PATTERN = '^[a-zA-Z]+$';
|
25
|
+
var ONLY_DIGITS_AND_CHARS_PATTERN = '^[a-zA-Z0-9]+$';
|
26
|
+
var FORBIDDEN_KEYS = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Delete', 'Tab'];
|
27
|
+
var BACKSPACE_KEY = 'Backspace';
|
28
|
+
var ANIMATION_TIMEOUT = 300;
|
23
29
|
|
30
|
+
exports.ANIMATION_TIMEOUT = ANIMATION_TIMEOUT;
|
31
|
+
exports.BACKSPACE_KEY = BACKSPACE_KEY;
|
32
|
+
exports.FORBIDDEN_KEYS = FORBIDDEN_KEYS;
|
33
|
+
exports.ONLY_CHARS_PATTERN = ONLY_CHARS_PATTERN;
|
34
|
+
exports.ONLY_DIGITS_AND_CHARS_PATTERN = ONLY_DIGITS_AND_CHARS_PATTERN;
|
35
|
+
exports.ONLY_DIGITS_PATTERN = ONLY_DIGITS_PATTERN;
|
24
36
|
exports.keyCodes = keyCodes;
|
25
37
|
exports.screenGroupBreakpoints = screenGroupBreakpoints;
|
26
38
|
//# sourceMappingURL=constants.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"constants.js","sources":["../../src/utils/constants.ts"],"sourcesContent":["export const keyCodes = {\n PageUp: 33,\n PageDown: 34,\n Home: 36,\n End: 35,\n Left: 37,\n Right: 39,\n Up: 38,\n Down: 40,\n Enter: 13,\n Space: 32,\n Escape: 27,\n};\n\nexport const screenGroupBreakpoints = {\n small: '0',\n medium: '35rem',\n large: '60rem',\n};\n"],"names":["keyCodes","PageUp","PageDown","Home","End","Left","Right","Up","Down","Enter","Space","Escape","screenGroupBreakpoints","small","medium","large"],"mappings":";;;;AAAO,IAAMA,QAAQ,GAAG;AACpBC,EAAAA,MAAM,EAAE,EAAE;AACVC,EAAAA,QAAQ,EAAE,EAAE;AACZC,EAAAA,IAAI,EAAE,EAAE;AACRC,EAAAA,GAAG,EAAE,EAAE;AACPC,EAAAA,IAAI,EAAE,EAAE;AACRC,EAAAA,KAAK,EAAE,EAAE;AACTC,EAAAA,EAAE,EAAE,EAAE;AACNC,EAAAA,IAAI,EAAE,EAAE;AACRC,EAAAA,KAAK,EAAE,EAAE;AACTC,EAAAA,KAAK,EAAE,EAAE;AACTC,EAAAA,MAAM,EAAE,EAAA;AACZ,EAAC;AAEM,IAAMC,sBAAsB,GAAG;AAClCC,EAAAA,KAAK,EAAE,GAAG;AACVC,EAAAA,MAAM,EAAE,OAAO;AACfC,EAAAA,KAAK,EAAE,OAAA;AACX
|
1
|
+
{"version":3,"file":"constants.js","sources":["../../src/utils/constants.ts"],"sourcesContent":["export const keyCodes = {\n PageUp: 33,\n PageDown: 34,\n Home: 36,\n End: 35,\n Left: 37,\n Right: 39,\n Up: 38,\n Down: 40,\n Enter: 13,\n Space: 32,\n Escape: 27,\n};\n\nexport const screenGroupBreakpoints = {\n small: '0',\n medium: '35rem',\n large: '60rem',\n};\n\nexport const ONLY_DIGITS_PATTERN = '^\\\\d+$';\nexport const ONLY_CHARS_PATTERN = '^[a-zA-Z]+$';\nexport const ONLY_DIGITS_AND_CHARS_PATTERN = '^[a-zA-Z0-9]+$';\n\nexport const FORBIDDEN_KEYS = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Delete', 'Tab'];\nexport const BACKSPACE_KEY = 'Backspace';\n\nexport const ANIMATION_TIMEOUT = 300;\n"],"names":["keyCodes","PageUp","PageDown","Home","End","Left","Right","Up","Down","Enter","Space","Escape","screenGroupBreakpoints","small","medium","large","ONLY_DIGITS_PATTERN","ONLY_CHARS_PATTERN","ONLY_DIGITS_AND_CHARS_PATTERN","FORBIDDEN_KEYS","BACKSPACE_KEY","ANIMATION_TIMEOUT"],"mappings":";;;;AAAO,IAAMA,QAAQ,GAAG;AACpBC,EAAAA,MAAM,EAAE,EAAE;AACVC,EAAAA,QAAQ,EAAE,EAAE;AACZC,EAAAA,IAAI,EAAE,EAAE;AACRC,EAAAA,GAAG,EAAE,EAAE;AACPC,EAAAA,IAAI,EAAE,EAAE;AACRC,EAAAA,KAAK,EAAE,EAAE;AACTC,EAAAA,EAAE,EAAE,EAAE;AACNC,EAAAA,IAAI,EAAE,EAAE;AACRC,EAAAA,KAAK,EAAE,EAAE;AACTC,EAAAA,KAAK,EAAE,EAAE;AACTC,EAAAA,MAAM,EAAE,EAAA;AACZ,EAAC;AAEM,IAAMC,sBAAsB,GAAG;AAClCC,EAAAA,KAAK,EAAE,GAAG;AACVC,EAAAA,MAAM,EAAE,OAAO;AACfC,EAAAA,KAAK,EAAE,OAAA;AACX,EAAC;AAEM,IAAMC,mBAAmB,GAAG,SAAQ;AACpC,IAAMC,kBAAkB,GAAG,cAAa;AACxC,IAAMC,6BAA6B,GAAG,iBAAgB;AAEhDC,IAAAA,cAAc,GAAG,CAAC,WAAW,EAAE,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,KAAK,EAAC;AAC3F,IAAMC,aAAa,GAAG,YAAW;AAEjC,IAAMC,iBAAiB,GAAG;;;;;;;;;;;"}
|
package/cjs/utils/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/utils/index.ts"],"sourcesContent":["import { CSSProperties } from '@linaria/core';\n\nexport { canUseDOM } from './canUseDOM';\nexport { extractTextFrom } from './extractTextFrom';\nexport { getSizeValueFromProp } from './getSizeValueFromProp';\nexport { IS_REACT_18, safeUseId } from './react';\nexport { isNumber } from './isNumber';\nexport { mergeRefs, setRefList } from './setRefList';\nexport { isEmpty } from './isEmpty';\nexport { createEvent } from './createEvent';\nexport * as constants from './constants';\nexport * from './getPopoverPlacement';\nexport { noop } from './noop';\nexport { getHeightAsNumber } from './getHeightAsNumber';\nexport { createConditionalComponent } from './createConditionalComponent';\n\nexport const cx = (...classes: (string | boolean | undefined)[]) => classes.filter((classItem) => classItem).join(' ');\n\nexport const composableStyle = (s: TemplateStringsArray, ...expr: Array<string | number | CSSProperties>): string => {\n let res = '';\n for (let i = 0; i < Math.max(s.length, expr.length); ++i) {\n res += s[i] ?? '';\n res += expr[i] ?? '';\n }\n\n return res;\n};\n\nexport { fixedForwardRef } from './fixedForwardRef';\n"],"names":["cx","_len","arguments","length","classes","Array","_key","filter","classItem","join","composableStyle","s","res","i","Math","max","_s$i","_ref","undefined"],"mappings":";;;;
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/utils/index.ts"],"sourcesContent":["import { CSSProperties } from '@linaria/core';\n\nexport { canUseDOM } from './canUseDOM';\nexport { extractTextFrom } from './extractTextFrom';\nexport { getSizeValueFromProp } from './getSizeValueFromProp';\nexport { IS_REACT_18, safeUseId } from './react';\nexport { isNumber } from './isNumber';\nexport { mergeRefs, setRefList } from './setRefList';\nexport { isEmpty } from './isEmpty';\nexport { createEvent } from './createEvent';\nexport * as constants from './constants';\nexport * from './getPopoverPlacement';\nexport * from './initialValuesHelper';\nexport { noop } from './noop';\nexport { getHeightAsNumber } from './getHeightAsNumber';\nexport { createConditionalComponent } from './createConditionalComponent';\n\nexport const cx = (...classes: (string | boolean | undefined)[]) => classes.filter((classItem) => classItem).join(' ');\n\nexport const composableStyle = (s: TemplateStringsArray, ...expr: Array<string | number | CSSProperties>): string => {\n let res = '';\n for (let i = 0; i < Math.max(s.length, expr.length); ++i) {\n res += s[i] ?? '';\n res += expr[i] ?? '';\n }\n\n return res;\n};\n\nexport { fixedForwardRef } from './fixedForwardRef';\n"],"names":["cx","_len","arguments","length","classes","Array","_key","filter","classItem","join","composableStyle","s","res","i","Math","max","_s$i","_ref","undefined"],"mappings":";;;;AAiBaA,IAAAA,EAAE,GAAG,SAALA,EAAEA,GAAA;AAAA,EAAA,KAAA,IAAAC,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAOC,OAAO,GAAAC,IAAAA,KAAA,CAAAJ,IAAA,GAAAK,IAAA,GAAA,CAAA,EAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA,EAAA,EAAA;AAAPF,IAAAA,OAAO,CAAAE,IAAA,CAAAJ,GAAAA,SAAA,CAAAI,IAAA,CAAA,CAAA;AAAA,GAAA;AAAA,EAAA,OAAuCF,OAAO,CAACG,MAAM,CAAC,UAACC,SAAS,EAAA;AAAA,IAAA,OAAKA,SAAS,CAAA;AAAA,GAAA,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC,CAAA;AAAA,EAAA;IAEzGC,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,CAAuB,EAA8D;EACjH,IAAIC,GAAG,GAAG,EAAE,CAAA;EACZ,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGC,IAAI,CAACC,GAAG,CAACJ,CAAC,CAACR,MAAM,EAAAD,SAAA,CAAAC,MAAA,IAAA,CAAA,GAAA,CAAA,GAAAD,SAAA,CAAAC,MAAA,GAAA,CAAa,CAAC,EAAE,EAAEU,CAAC,EAAE;IAAA,IAAAG,IAAA,EAAAC,IAAA,CAAA;AACtDL,IAAAA,GAAG,IAAAI,CAAAA,IAAA,GAAIL,CAAC,CAACE,CAAC,CAAC,MAAA,IAAA,IAAAG,IAAA,KAAA,KAAA,CAAA,GAAAA,IAAA,GAAI,EAAE,CAAA;IACjBJ,GAAG,IAAA,CAAAK,IAAA,GAASJ,CAAC,YAAAX,SAAA,CAAAC,MAAA,IAADU,CAAC,OAAAK,SAAA,GAAAhB,SAAA,CAADW,CAAC,mBAAAI,IAAA,KAAA,KAAA,CAAA,GAAAA,IAAA,GAAK,EAAE,CAAA;AACxB,GAAA;AAEA,EAAA,OAAOL,GAAG,CAAA;AACd;;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"initialValuesHelper.js","sources":["../../src/utils/initialValuesHelper.ts"],"sourcesContent":["export const getFieldPattern = (allowedSymbols: RegExp | string) => {\n if (!allowedSymbols) {\n return null;\n }\n\n if (typeof allowedSymbols === 'string') {\n return new RegExp(allowedSymbols, 'g');\n }\n\n return allowedSymbols;\n};\n\nexport const getCodeValue = (codeLength: number, value: string): Array<string> => {\n if (!value.length) {\n return new Array(codeLength).fill('');\n }\n\n return value.slice(0, codeLength).split('');\n};\n\nexport const getPlaceholderValue = (codeLength: number, placeholder?: string): null | string[] => {\n if (!placeholder || typeof placeholder !== 'string') {\n return null;\n }\n\n if (placeholder.length === 1) {\n return Array(codeLength).fill(placeholder);\n }\n\n return placeholder.slice(0, codeLength).split('');\n};\n"],"names":["getFieldPattern","allowedSymbols","RegExp","getCodeValue","codeLength","value","length","Array","fill","slice","split","getPlaceholderValue","placeholder"],"mappings":";;;;IAAaA,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,cAA+B,EAAK;EAChE,IAAI,CAACA,cAAc,EAAE;AACjB,IAAA,OAAO,IAAI,CAAA;AACf,GAAA;AAEA,EAAA,IAAI,OAAOA,cAAc,KAAK,QAAQ,EAAE;AACpC,IAAA,OAAO,IAAIC,MAAM,CAACD,cAAc,EAAE,GAAG,CAAC,CAAA;AAC1C,GAAA;AAEA,EAAA,OAAOA,cAAc,CAAA;AACzB,EAAC;AAEM,IAAME,YAAY,GAAG,SAAfA,YAAYA,CAAIC,UAAkB,EAAEC,KAAa,EAAoB;AAC9E,EAAA,IAAI,CAACA,KAAK,CAACC,MAAM,EAAE;IACf,OAAO,IAAIC,KAAK,CAACH,UAAU,CAAC,CAACI,IAAI,CAAC,EAAE,CAAC,CAAA;AACzC,GAAA;AAEA,EAAA,OAAOH,KAAK,CAACI,KAAK,CAAC,CAAC,EAAEL,UAAU,CAAC,CAACM,KAAK,CAAC,EAAE,CAAC,CAAA;AAC/C,EAAC;AAEM,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAIP,UAAkB,EAAEQ,WAAoB,EAAsB;AAC9F,EAAA,IAAI,CAACA,WAAW,IAAI,OAAOA,WAAW,KAAK,QAAQ,EAAE;AACjD,IAAA,OAAO,IAAI,CAAA;AACf,GAAA;AAEA,EAAA,IAAIA,WAAW,CAACN,MAAM,KAAK,CAAC,EAAE;IAC1B,OAAOC,KAAK,CAACH,UAAU,CAAC,CAACI,IAAI,CAACI,WAAW,CAAC,CAAA;AAC9C,GAAA;AAEA,EAAA,OAAOA,WAAW,CAACH,KAAK,CAAC,CAAC,EAAEL,UAAU,CAAC,CAACM,KAAK,CAAC,EAAE,CAAC,CAAA;AACrD;;;;;;"}
|
@@ -202,21 +202,15 @@ var codeFieldRoot = exports.codeFieldRoot = function codeFieldRoot(Root) {
|
|
202
202
|
onFullCodeEnter(fullCode);
|
203
203
|
}
|
204
204
|
}, []);
|
205
|
-
(0,
|
206
|
-
inputRefs
|
207
|
-
|
208
|
-
|
209
|
-
|
210
|
-
|
211
|
-
|
212
|
-
|
213
|
-
|
214
|
-
}, [autoFocus]);
|
215
|
-
(0, _hooks.useDidMountEffect)(function () {
|
216
|
-
if (handleFullCodeEnter && originalValue.length === codeLength) {
|
217
|
-
handleFullCodeEnter(originalValue);
|
218
|
-
}
|
219
|
-
}, [originalValue, handleFullCodeEnter]);
|
205
|
+
(0, _hooks.useCodeHook)({
|
206
|
+
inputRefs: inputRefs,
|
207
|
+
codeLength: codeLength,
|
208
|
+
disabled: disabled,
|
209
|
+
autoFocus: autoFocus,
|
210
|
+
originalValue: originalValue,
|
211
|
+
getLastActiveIndex: getLastActiveIndex,
|
212
|
+
handleFullCodeEnter: handleFullCodeEnter
|
213
|
+
});
|
220
214
|
(0, _hooks.useDidMountEffect)(function () {
|
221
215
|
if (isError) {
|
222
216
|
(0, _utils2.handleCodeError)({
|
@@ -9,7 +9,7 @@ var _react = /*#__PURE__*/_interopRequireWildcard(/*#__PURE__*/require("react"))
|
|
9
9
|
var _classnames = /*#__PURE__*/_interopRequireDefault(/*#__PURE__*/require("classnames"));
|
10
10
|
var _hooks = /*#__PURE__*/require("../../hooks");
|
11
11
|
var _utils = /*#__PURE__*/require("../../utils");
|
12
|
-
var _constants = /*#__PURE__*/require("
|
12
|
+
var _constants = /*#__PURE__*/require("../../utils/constants");
|
13
13
|
var _utils2 = /*#__PURE__*/require("./utils");
|
14
14
|
var _CodeInput = /*#__PURE__*/require("./CodeInput.tokens");
|
15
15
|
var _CodeInput2 = /*#__PURE__*/require("./CodeInput.styles");
|
@@ -17,7 +17,7 @@ var _base = /*#__PURE__*/require("./variations/_view/base");
|
|
17
17
|
var _base2 = /*#__PURE__*/require("./variations/_size/base");
|
18
18
|
var _base3 = /*#__PURE__*/require("./variations/_disabled/base");
|
19
19
|
var _Separator;
|
20
|
-
var _excluded = ["className", "value", "placeholder", "autoFocus", "codeLength", "caption", "captionAlign", "width", "view", "size", "
|
20
|
+
var _excluded = ["className", "value", "placeholder", "autoFocus", "codeLength", "caption", "captionAlign", "width", "view", "size", "hidden", "disabled", "isError", "allowedSymbols", "itemErrorBehavior", "codeErrorBehavior", "autoComplete", "setIsError", "onChange", "onFullCodeEnter"];
|
21
21
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
22
22
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
23
23
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
@@ -51,8 +51,6 @@ var codeInputRoot = exports.codeInputRoot = function codeInputRoot(Root) {
|
|
51
51
|
width = _ref.width,
|
52
52
|
view = _ref.view,
|
53
53
|
size = _ref.size,
|
54
|
-
_ref$screen = _ref.screen,
|
55
|
-
screen = _ref$screen === void 0 ? 'medium' : _ref$screen,
|
56
54
|
hidden = _ref.hidden,
|
57
55
|
disabled = _ref.disabled,
|
58
56
|
isError = _ref.isError,
|
@@ -210,21 +208,15 @@ var codeInputRoot = exports.codeInputRoot = function codeInputRoot(Root) {
|
|
210
208
|
onFullCodeEnter(fullCode);
|
211
209
|
}
|
212
210
|
}, []);
|
213
|
-
(0,
|
214
|
-
inputRefs
|
215
|
-
|
216
|
-
|
217
|
-
|
218
|
-
|
219
|
-
|
220
|
-
|
221
|
-
|
222
|
-
}, [autoFocus]);
|
223
|
-
(0, _hooks.useDidMountEffect)(function () {
|
224
|
-
if (handleFullCodeEnter && originalValue.length === codeLength) {
|
225
|
-
handleFullCodeEnter(originalValue);
|
226
|
-
}
|
227
|
-
}, [originalValue, handleFullCodeEnter]);
|
211
|
+
(0, _hooks.useCodeHook)({
|
212
|
+
inputRefs: inputRefs,
|
213
|
+
codeLength: codeLength,
|
214
|
+
disabled: disabled,
|
215
|
+
autoFocus: autoFocus,
|
216
|
+
originalValue: originalValue,
|
217
|
+
getLastActiveIndex: getLastActiveIndex,
|
218
|
+
handleFullCodeEnter: handleFullCodeEnter
|
219
|
+
});
|
228
220
|
(0, _hooks.useDidMountEffect)(function () {
|
229
221
|
if (isError) {
|
230
222
|
(0, _utils2.handleCodeError)({
|
@@ -244,7 +236,6 @@ var codeInputRoot = exports.codeInputRoot = function codeInputRoot(Root) {
|
|
244
236
|
view: view,
|
245
237
|
size: size,
|
246
238
|
disabled: disabled,
|
247
|
-
screen: screen,
|
248
239
|
onClick: handleClick,
|
249
240
|
className: (0, _classnames["default"])(className, _defineProperty({}, _CodeInput.classes.captionAlignLeft, captionAlign === 'left'))
|
250
241
|
}, rest), /*#__PURE__*/_react["default"].createElement(_CodeInput2.CodeWrapper, {
|
@@ -5,8 +5,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
});
|
6
6
|
exports.handleCodeError = void 0;
|
7
7
|
var _CodeInput = /*#__PURE__*/require("../CodeInput.tokens");
|
8
|
-
var
|
9
|
-
var
|
8
|
+
var _utils = /*#__PURE__*/require("../../../utils");
|
9
|
+
var _constants = /*#__PURE__*/require("../../../utils/constants");
|
10
10
|
function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
|
11
11
|
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
12
12
|
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
@@ -50,7 +50,7 @@ var handleCodeError = exports.handleCodeError = function handleCodeError(_ref) {
|
|
50
50
|
(_captionRef$current2 = captionRef.current) === null || _captionRef$current2 === void 0 || _captionRef$current2.classList.add(_CodeInput.classes.captionError);
|
51
51
|
setTimeout(function () {
|
52
52
|
var _inputRefs$current$, _inputContainerRef$cu2;
|
53
|
-
codeSetter((0,
|
53
|
+
codeSetter((0, _utils.getCodeValue)(codeLength, ''));
|
54
54
|
(_inputRefs$current$ = inputRefs.current[0]) === null || _inputRefs$current$ === void 0 || _inputRefs$current$.focus();
|
55
55
|
(_inputContainerRef$cu2 = inputContainerRef.current) === null || _inputContainerRef$cu2 === void 0 || _inputContainerRef$cu2.classList.remove(_CodeInput.classes.codeError, _CodeInput.classes.codeErrorAnimation, _CodeInput.classes.codeErrorFade);
|
56
56
|
}, _constants.ANIMATION_TIMEOUT);
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
});
|
6
6
|
exports.handleItemError = void 0;
|
7
7
|
var _CodeInput = /*#__PURE__*/require("../CodeInput.tokens");
|
8
|
-
var _constants = /*#__PURE__*/require("
|
8
|
+
var _constants = /*#__PURE__*/require("../../../utils/constants");
|
9
9
|
var handleItemError = exports.handleItemError = function handleItemError(_ref) {
|
10
10
|
var _inputContainerRef$cu;
|
11
11
|
var currentSymbol = _ref.currentSymbol,
|
@@ -6,19 +6,19 @@ Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
Object.defineProperty(exports, "getCodeValue", {
|
7
7
|
enumerable: true,
|
8
8
|
get: function get() {
|
9
|
-
return
|
9
|
+
return _utils.getCodeValue;
|
10
10
|
}
|
11
11
|
});
|
12
12
|
Object.defineProperty(exports, "getFieldPattern", {
|
13
13
|
enumerable: true,
|
14
14
|
get: function get() {
|
15
|
-
return
|
15
|
+
return _utils.getFieldPattern;
|
16
16
|
}
|
17
17
|
});
|
18
18
|
Object.defineProperty(exports, "getPlaceholderValue", {
|
19
19
|
enumerable: true,
|
20
20
|
get: function get() {
|
21
|
-
return
|
21
|
+
return _utils.getPlaceholderValue;
|
22
22
|
}
|
23
23
|
});
|
24
24
|
Object.defineProperty(exports, "handleCodeError", {
|
@@ -33,6 +33,6 @@ Object.defineProperty(exports, "handleItemError", {
|
|
33
33
|
return _handleItemError.handleItemError;
|
34
34
|
}
|
35
35
|
});
|
36
|
-
var
|
36
|
+
var _utils = /*#__PURE__*/require("../../../utils");
|
37
37
|
var _handleItemError = /*#__PURE__*/require("./handleItemError");
|
38
38
|
var _handleCodeError = /*#__PURE__*/require("./handleCodeError");
|
@@ -22,4 +22,4 @@ var getIconMediaQueries = function getIconMediaQueries() {
|
|
22
22
|
return "\n @media (min-width: ".concat(minWidth, ") {\n ").concat(_CodeInput2.privateTokens.fontSize, ": var(").concat(_CodeInput2.tokens["".concat(name, "FontSize")], ");\n ").concat(_CodeInput2.privateTokens.lineHeight, ": var(").concat(_CodeInput2.tokens["".concat(name, "CodeItemHeight")], ");\n ").concat(_CodeInput2.privateTokens.itemWidth, ": var(").concat(_CodeInput2.tokens["".concat(name, "CodeItemWidth")], ");\n ").concat(_CodeInput2.privateTokens.itemHeight, ": var(").concat(_CodeInput2.tokens["".concat(name, "LineHeight")], ");\n }\n ");
|
23
23
|
}).join('\n');
|
24
24
|
};
|
25
|
-
var base = exports.base = /*#__PURE__*/(0, _react.css)(/*#__PURE__*/getIconMediaQueries(), " gap:var(", _CodeInput2.tokens.captionGap, ");", _CodeInput.CodeWrapper, ",", _CodeInput.CodeGroup, "{gap:var(", _CodeInput2.tokens.codeItemsGap, ");}", _CodeInput.ItemInput, "{font-size:var(", _CodeInput2.privateTokens.fontSize, ");font-family:var(", _CodeInput2.tokens.fontFamily, ");font-style:var(", _CodeInput2.tokens.fontStyle, ");font-weight:var(", _CodeInput2.tokens.fontWeight, ");letter-spacing:var(", _CodeInput2.tokens.letterSpacing, ");line-height:var(", _CodeInput2.privateTokens.lineHeight, ");width:var(", _CodeInput2.privateTokens.itemWidth, ");height:var(", _CodeInput2.privateTokens.itemHeight, ");}", _CodeInput.CaptionWrapper, "{font-family:var(", _CodeInput2.tokens.captionFontFamily, ");font-size:var(", _CodeInput2.tokens.captionFontSize, ");font-style:var(", _CodeInput2.tokens.captionFontStyle, ");font-weight:var(", _CodeInput2.tokens.captionFontWeight, ");letter-spacing:var(", _CodeInput2.tokens.captionLetterSpacing, ");line-height:var(", _CodeInput2.tokens.captionLineHeight, ");};label:plasma-new-hope__base;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
25
|
+
var base = exports.base = /*#__PURE__*/(0, _react.css)(/*#__PURE__*/getIconMediaQueries(), " gap:var(", _CodeInput2.tokens.captionGap, ");", _CodeInput.CodeWrapper, ",", _CodeInput.CodeGroup, "{gap:var(", _CodeInput2.tokens.codeItemsGap, ");}", _CodeInput.ItemInput, "{font-size:var(", _CodeInput2.privateTokens.fontSize, ");font-family:var(", _CodeInput2.tokens.fontFamily, ");font-style:var(", _CodeInput2.tokens.fontStyle, ");font-weight:var(", _CodeInput2.tokens.fontWeight, ");letter-spacing:var(", _CodeInput2.tokens.letterSpacing, ");line-height:var(", _CodeInput2.privateTokens.lineHeight, ");width:var(", _CodeInput2.privateTokens.itemWidth, ");height:var(", _CodeInput2.privateTokens.itemHeight, ");}", _CodeInput.CaptionWrapper, "{font-family:var(", _CodeInput2.tokens.captionFontFamily, ");font-size:var(", _CodeInput2.tokens.captionFontSize, ");font-style:var(", _CodeInput2.tokens.captionFontStyle, ");font-weight:var(", _CodeInput2.tokens.captionFontWeight, ");letter-spacing:var(", _CodeInput2.tokens.captionLetterSpacing, ");line-height:var(", _CodeInput2.tokens.captionLineHeight, ");};label:plasma-new-hope__base;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvQ29kZUlucHV0L3ZhcmlhdGlvbnMvX3NpemUvYmFzZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxQnVCIiwiZmlsZSI6Ii4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvQ29kZUlucHV0L3ZhcmlhdGlvbnMvX3NpemUvYmFzZS50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuaW1wb3J0IHsgQ2FwdGlvbldyYXBwZXIsIENvZGVHcm91cCwgQ29kZVdyYXBwZXIsIEl0ZW1JbnB1dCB9IGZyb20gJy4uLy4uL0NvZGVJbnB1dC5zdHlsZXMnO1xuaW1wb3J0IHsgdG9rZW5zLCBwcml2YXRlVG9rZW5zLCBUb2tlbnNUeXBlIH0gZnJvbSAnLi4vLi4vQ29kZUlucHV0LnRva2Vucyc7XG5pbXBvcnQgeyBzY3JlZW5Hcm91cEJyZWFrcG9pbnRzIH0gZnJvbSAnLi4vLi4vLi4vLi4vdXRpbHMvY29uc3RhbnRzJztcblxuY29uc3QgZ2V0SWNvbk1lZGlhUXVlcmllcyA9ICgpID0+IHtcbiAgICByZXR1cm4gT2JqZWN0LmVudHJpZXMoc2NyZWVuR3JvdXBCcmVha3BvaW50cylcbiAgICAgICAgLm1hcCgoW25hbWUsIG1pbldpZHRoXSkgPT4ge1xuICAgICAgICAgICAgcmV0dXJuIGBcbiAgICAgICAgICAgICAgICBAbWVkaWEgKG1pbi13aWR0aDogJHttaW5XaWR0aH0pIHtcbiAgICAgICAgICAgICAgICAgICAgJHtwcml2YXRlVG9rZW5zLmZvbnRTaXplfTogdmFyKCR7dG9rZW5zW2Ake25hbWV9Rm9udFNpemVgIGFzIFRva2Vuc1R5cGVdfSk7XG4gICAgICAgICAgICAgICAgICAgICR7cHJpdmF0ZVRva2Vucy5saW5lSGVpZ2h0fTogdmFyKCR7dG9rZW5zW2Ake25hbWV9Q29kZUl0ZW1IZWlnaHRgIGFzIFRva2Vuc1R5cGVdfSk7XG4gICAgICAgICAgICAgICAgICAgICR7cHJpdmF0ZVRva2Vucy5pdGVtV2lkdGh9OiB2YXIoJHt0b2tlbnNbYCR7bmFtZX1Db2RlSXRlbVdpZHRoYCBhcyBUb2tlbnNUeXBlXX0pO1xuICAgICAgICAgICAgICAgICAgICAke3ByaXZhdGVUb2tlbnMuaXRlbUhlaWdodH06IHZhcigke3Rva2Vuc1tgJHtuYW1lfUxpbmVIZWlnaHRgIGFzIFRva2Vuc1R5cGVdfSk7XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgYDtcbiAgICAgICAgfSlcbiAgICAgICAgLmpvaW4oJ1xcbicpO1xufTtcblxuZXhwb3J0IGNvbnN0IGJhc2UgPSBjc3NgXG4gICAgJHtnZXRJY29uTWVkaWFRdWVyaWVzKCl9XG4gICAgZ2FwOiB2YXIoJHt0b2tlbnMuY2FwdGlvbkdhcH0pO1xuXG4gICAgJHtDb2RlV3JhcHBlcn0sICR7Q29kZUdyb3VwfSB7XG4gICAgICAgIGdhcDogdmFyKCR7dG9rZW5zLmNvZGVJdGVtc0dhcH0pO1xuICAgIH1cblxuICAgICR7SXRlbUlucHV0fSB7XG4gICAgICAgIGZvbnQtc2l6ZTogdmFyKCR7cHJpdmF0ZVRva2Vucy5mb250U2l6ZX0pO1xuICAgICAgICBmb250LWZhbWlseTogdmFyKCR7dG9rZW5zLmZvbnRGYW1pbHl9KTtcbiAgICAgICAgZm9udC1zdHlsZTogdmFyKCR7dG9rZW5zLmZvbnRTdHlsZX0pO1xuICAgICAgICBmb250LXdlaWdodDogdmFyKCR7dG9rZW5zLmZvbnRXZWlnaHR9KTtcbiAgICAgICAgbGV0dGVyLXNwYWNpbmc6IHZhcigke3Rva2Vucy5sZXR0ZXJTcGFjaW5nfSk7XG4gICAgICAgIGxpbmUtaGVpZ2h0OiB2YXIoJHtwcml2YXRlVG9rZW5zLmxpbmVIZWlnaHR9KTtcbiAgICAgICAgd2lkdGg6IHZhcigke3ByaXZhdGVUb2tlbnMuaXRlbVdpZHRofSk7XG4gICAgICAgIGhlaWdodDogdmFyKCR7cHJpdmF0ZVRva2Vucy5pdGVtSGVpZ2h0fSk7XG4gICAgfVxuXG4gICAgJHtDYXB0aW9uV3JhcHBlcn0ge1xuICAgICAgICBmb250LWZhbWlseTogdmFyKCR7dG9rZW5zLmNhcHRpb25Gb250RmFtaWx5fSk7XG4gICAgICAgIGZvbnQtc2l6ZTogdmFyKCR7dG9rZW5zLmNhcHRpb25Gb250U2l6ZX0pO1xuICAgICAgICBmb250LXN0eWxlOiB2YXIoJHt0b2tlbnMuY2FwdGlvbkZvbnRTdHlsZX0pO1xuICAgICAgICBmb250LXdlaWdodDogdmFyKCR7dG9rZW5zLmNhcHRpb25Gb250V2VpZ2h0fSk7XG4gICAgICAgIGxldHRlci1zcGFjaW5nOiB2YXIoJHt0b2tlbnMuY2FwdGlvbkxldHRlclNwYWNpbmd9KTtcbiAgICAgICAgbGluZS1oZWlnaHQ6IHZhcigke3Rva2Vucy5jYXB0aW9uTGluZUhlaWdodH0pO1xuICAgIH1cbmA7XG4iXX0= */"));
|
@@ -3,6 +3,12 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
+
Object.defineProperty(exports, "useCodeHook", {
|
7
|
+
enumerable: true,
|
8
|
+
get: function get() {
|
9
|
+
return _useCodeHook.useCodeHook;
|
10
|
+
}
|
11
|
+
});
|
6
12
|
Object.defineProperty(exports, "useDidMountEffect", {
|
7
13
|
enumerable: true,
|
8
14
|
get: function get() {
|
@@ -58,4 +64,5 @@ var _useForceUpdate = /*#__PURE__*/require("./useForceUpdate");
|
|
58
64
|
var _useDidMountEffect = /*#__PURE__*/require("./useDidMountEffect");
|
59
65
|
var _useDidMountLayoutEffect = /*#__PURE__*/require("./useDidMountLayoutEffect");
|
60
66
|
var _useOutsideClick = /*#__PURE__*/require("./useOutsideClick");
|
61
|
-
var _useIsomorphicLayoutEffect = /*#__PURE__*/require("./useIsomorphicLayoutEffect");
|
67
|
+
var _useIsomorphicLayoutEffect = /*#__PURE__*/require("./useIsomorphicLayoutEffect");
|
68
|
+
var _useCodeHook = /*#__PURE__*/require("./useCodeHook");
|
@@ -0,0 +1,32 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.useCodeHook = void 0;
|
7
|
+
var _react = /*#__PURE__*/require("react");
|
8
|
+
var _ = /*#__PURE__*/require(".");
|
9
|
+
var useCodeHook = exports.useCodeHook = function useCodeHook(_ref) {
|
10
|
+
var inputRefs = _ref.inputRefs,
|
11
|
+
codeLength = _ref.codeLength,
|
12
|
+
disabled = _ref.disabled,
|
13
|
+
autoFocus = _ref.autoFocus,
|
14
|
+
originalValue = _ref.originalValue,
|
15
|
+
getLastActiveIndex = _ref.getLastActiveIndex,
|
16
|
+
handleFullCodeEnter = _ref.handleFullCodeEnter;
|
17
|
+
(0, _react.useEffect)(function () {
|
18
|
+
inputRefs.current = inputRefs.current.slice(0, codeLength);
|
19
|
+
}, [codeLength]);
|
20
|
+
(0, _react.useEffect)(function () {
|
21
|
+
if (autoFocus && !disabled) {
|
22
|
+
var _inputRefs$current$la;
|
23
|
+
var lastActiveIndex = getLastActiveIndex();
|
24
|
+
(_inputRefs$current$la = inputRefs.current[lastActiveIndex]) === null || _inputRefs$current$la === void 0 || _inputRefs$current$la.focus();
|
25
|
+
}
|
26
|
+
}, [autoFocus]);
|
27
|
+
(0, _.useDidMountEffect)(function () {
|
28
|
+
if (handleFullCodeEnter && originalValue.length === codeLength) {
|
29
|
+
handleFullCodeEnter(originalValue);
|
30
|
+
}
|
31
|
+
}, [originalValue, handleFullCodeEnter]);
|
32
|
+
};
|
@@ -3,7 +3,7 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.screenGroupBreakpoints = exports.keyCodes = void 0;
|
6
|
+
exports.screenGroupBreakpoints = exports.keyCodes = exports.ONLY_DIGITS_PATTERN = exports.ONLY_DIGITS_AND_CHARS_PATTERN = exports.ONLY_CHARS_PATTERN = exports.FORBIDDEN_KEYS = exports.BACKSPACE_KEY = exports.ANIMATION_TIMEOUT = void 0;
|
7
7
|
var keyCodes = exports.keyCodes = {
|
8
8
|
PageUp: 33,
|
9
9
|
PageDown: 34,
|
@@ -21,4 +21,10 @@ var screenGroupBreakpoints = exports.screenGroupBreakpoints = {
|
|
21
21
|
small: '0',
|
22
22
|
medium: '35rem',
|
23
23
|
large: '60rem'
|
24
|
-
};
|
24
|
+
};
|
25
|
+
var ONLY_DIGITS_PATTERN = exports.ONLY_DIGITS_PATTERN = '^\\d+$';
|
26
|
+
var ONLY_CHARS_PATTERN = exports.ONLY_CHARS_PATTERN = '^[a-zA-Z]+$';
|
27
|
+
var ONLY_DIGITS_AND_CHARS_PATTERN = exports.ONLY_DIGITS_AND_CHARS_PATTERN = '^[a-zA-Z0-9]+$';
|
28
|
+
var FORBIDDEN_KEYS = exports.FORBIDDEN_KEYS = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Delete', 'Tab'];
|
29
|
+
var BACKSPACE_KEY = exports.BACKSPACE_KEY = 'Backspace';
|
30
|
+
var ANIMATION_TIMEOUT = exports.ANIMATION_TIMEOUT = 300;
|
@@ -131,6 +131,18 @@ Object.keys(_getPopoverPlacement).forEach(function (key) {
|
|
131
131
|
}
|
132
132
|
});
|
133
133
|
});
|
134
|
+
var _initialValuesHelper = /*#__PURE__*/require("./initialValuesHelper");
|
135
|
+
Object.keys(_initialValuesHelper).forEach(function (key) {
|
136
|
+
if (key === "default" || key === "__esModule") return;
|
137
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
138
|
+
if (key in exports && exports[key] === _initialValuesHelper[key]) return;
|
139
|
+
Object.defineProperty(exports, key, {
|
140
|
+
enumerable: true,
|
141
|
+
get: function get() {
|
142
|
+
return _initialValuesHelper[key];
|
143
|
+
}
|
144
|
+
});
|
145
|
+
});
|
134
146
|
var _noop = /*#__PURE__*/require("./noop");
|
135
147
|
var _getHeightAsNumber = /*#__PURE__*/require("./getHeightAsNumber");
|
136
148
|
var _createConditionalComponent = /*#__PURE__*/require("./createConditionalComponent");
|
@@ -17,10 +17,11 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
|
|
17
17
|
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
18
18
|
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
19
19
|
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
20
|
-
import React, { forwardRef, Fragment, useCallback,
|
20
|
+
import React, { forwardRef, Fragment, useCallback, useRef, useState } from 'react';
|
21
21
|
import cls from 'classnames';
|
22
22
|
import { useDidMountEffect } from "../../hooks";
|
23
23
|
import { getSizeValueFromProp } from "../../utils";
|
24
|
+
import { useCodeHook } from "../../hooks";
|
24
25
|
import { BACKSPACE_KEY, FORBIDDEN_KEYS, ONLY_DIGITS_PATTERN } from "./utils/constants";
|
25
26
|
import { getCodeValue, getFieldPattern, getPlaceholderValue, handleCodeError, handleItemError } from "./utils";
|
26
27
|
import { classes } from "./CodeField.tokens";
|
@@ -193,21 +194,15 @@ export var codeFieldRoot = function codeFieldRoot(Root) {
|
|
193
194
|
onFullCodeEnter(fullCode);
|
194
195
|
}
|
195
196
|
}, []);
|
196
|
-
|
197
|
-
inputRefs
|
198
|
-
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
205
|
-
}, [autoFocus]);
|
206
|
-
useDidMountEffect(function () {
|
207
|
-
if (handleFullCodeEnter && originalValue.length === codeLength) {
|
208
|
-
handleFullCodeEnter(originalValue);
|
209
|
-
}
|
210
|
-
}, [originalValue, handleFullCodeEnter]);
|
197
|
+
useCodeHook({
|
198
|
+
inputRefs: inputRefs,
|
199
|
+
codeLength: codeLength,
|
200
|
+
disabled: disabled,
|
201
|
+
autoFocus: autoFocus,
|
202
|
+
originalValue: originalValue,
|
203
|
+
getLastActiveIndex: getLastActiveIndex,
|
204
|
+
handleFullCodeEnter: handleFullCodeEnter
|
205
|
+
});
|
211
206
|
useDidMountEffect(function () {
|
212
207
|
if (isError) {
|
213
208
|
handleCodeError({
|
@@ -1,6 +1,6 @@
|
|
1
1
|
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
2
2
|
var _Separator;
|
3
|
-
var _excluded = ["className", "value", "placeholder", "autoFocus", "codeLength", "caption", "captionAlign", "width", "view", "size", "
|
3
|
+
var _excluded = ["className", "value", "placeholder", "autoFocus", "codeLength", "caption", "captionAlign", "width", "view", "size", "hidden", "disabled", "isError", "allowedSymbols", "itemErrorBehavior", "codeErrorBehavior", "autoComplete", "setIsError", "onChange", "onFullCodeEnter"];
|
4
4
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
5
5
|
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
6
6
|
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
@@ -17,11 +17,12 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
|
|
17
17
|
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
18
18
|
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
19
19
|
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
20
|
-
import React, { forwardRef, Fragment, useCallback,
|
20
|
+
import React, { forwardRef, Fragment, useCallback, useRef, useState } from 'react';
|
21
21
|
import cls from 'classnames';
|
22
22
|
import { useDidMountEffect } from "../../hooks";
|
23
23
|
import { getSizeValueFromProp } from "../../utils";
|
24
|
-
import { BACKSPACE_KEY, FORBIDDEN_KEYS, ONLY_DIGITS_PATTERN } from "
|
24
|
+
import { BACKSPACE_KEY, FORBIDDEN_KEYS, ONLY_DIGITS_PATTERN } from "../../utils/constants";
|
25
|
+
import { useCodeHook } from "../../hooks";
|
25
26
|
import { getCodeValue, getFieldPattern, getPlaceholderValue, handleCodeError, handleItemError } from "./utils";
|
26
27
|
import { classes } from "./CodeInput.tokens";
|
27
28
|
import { base, CaptionWrapper, CodeGroup, CodeWrapper, ItemInput, Separator, ItemWrapper, ItemCircle } from "./CodeInput.styles";
|
@@ -42,8 +43,6 @@ export var codeInputRoot = function codeInputRoot(Root) {
|
|
42
43
|
width = _ref.width,
|
43
44
|
view = _ref.view,
|
44
45
|
size = _ref.size,
|
45
|
-
_ref$screen = _ref.screen,
|
46
|
-
screen = _ref$screen === void 0 ? 'medium' : _ref$screen,
|
47
46
|
hidden = _ref.hidden,
|
48
47
|
disabled = _ref.disabled,
|
49
48
|
isError = _ref.isError,
|
@@ -201,21 +200,15 @@ export var codeInputRoot = function codeInputRoot(Root) {
|
|
201
200
|
onFullCodeEnter(fullCode);
|
202
201
|
}
|
203
202
|
}, []);
|
204
|
-
|
205
|
-
inputRefs
|
206
|
-
|
207
|
-
|
208
|
-
|
209
|
-
|
210
|
-
|
211
|
-
|
212
|
-
|
213
|
-
}, [autoFocus]);
|
214
|
-
useDidMountEffect(function () {
|
215
|
-
if (handleFullCodeEnter && originalValue.length === codeLength) {
|
216
|
-
handleFullCodeEnter(originalValue);
|
217
|
-
}
|
218
|
-
}, [originalValue, handleFullCodeEnter]);
|
203
|
+
useCodeHook({
|
204
|
+
inputRefs: inputRefs,
|
205
|
+
codeLength: codeLength,
|
206
|
+
disabled: disabled,
|
207
|
+
autoFocus: autoFocus,
|
208
|
+
originalValue: originalValue,
|
209
|
+
getLastActiveIndex: getLastActiveIndex,
|
210
|
+
handleFullCodeEnter: handleFullCodeEnter
|
211
|
+
});
|
219
212
|
useDidMountEffect(function () {
|
220
213
|
if (isError) {
|
221
214
|
handleCodeError({
|
@@ -235,7 +228,6 @@ export var codeInputRoot = function codeInputRoot(Root) {
|
|
235
228
|
view: view,
|
236
229
|
size: size,
|
237
230
|
disabled: disabled,
|
238
|
-
screen: screen,
|
239
231
|
onClick: handleClick,
|
240
232
|
className: cls(className, _defineProperty({}, classes.captionAlignLeft, captionAlign === 'left'))
|
241
233
|
}, rest), /*#__PURE__*/React.createElement(CodeWrapper, {
|
@@ -5,8 +5,8 @@ function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Sym
|
|
5
5
|
function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
|
6
6
|
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
7
7
|
import { classes } from "../CodeInput.tokens";
|
8
|
-
import {
|
9
|
-
import {
|
8
|
+
import { getCodeValue } from "../../../utils";
|
9
|
+
import { ANIMATION_TIMEOUT } from "../../../utils/constants";
|
10
10
|
export var handleCodeError = function handleCodeError(_ref) {
|
11
11
|
var _captionRef$current, _captionRef$current2;
|
12
12
|
var codeLength = _ref.codeLength,
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import { classes } from "../CodeInput.tokens";
|
2
|
-
import { ANIMATION_TIMEOUT } from "
|
2
|
+
import { ANIMATION_TIMEOUT } from "../../../utils/constants";
|
3
3
|
export var handleItemError = function handleItemError(_ref) {
|
4
4
|
var _inputContainerRef$cu;
|
5
5
|
var currentSymbol = _ref.currentSymbol,
|
@@ -1,3 +1,3 @@
|
|
1
|
-
export { getFieldPattern, getPlaceholderValue, getCodeValue } from "
|
1
|
+
export { getFieldPattern, getPlaceholderValue, getCodeValue } from "../../../utils";
|
2
2
|
export { handleItemError } from "./handleItemError";
|
3
3
|
export { handleCodeError } from "./handleCodeError";
|
@@ -16,4 +16,4 @@ var getIconMediaQueries = function getIconMediaQueries() {
|
|
16
16
|
return "\n @media (min-width: ".concat(minWidth, ") {\n ").concat(privateTokens.fontSize, ": var(").concat(tokens["".concat(name, "FontSize")], ");\n ").concat(privateTokens.lineHeight, ": var(").concat(tokens["".concat(name, "CodeItemHeight")], ");\n ").concat(privateTokens.itemWidth, ": var(").concat(tokens["".concat(name, "CodeItemWidth")], ");\n ").concat(privateTokens.itemHeight, ": var(").concat(tokens["".concat(name, "LineHeight")], ");\n }\n ");
|
17
17
|
}).join('\n');
|
18
18
|
};
|
19
|
-
export var base = /*#__PURE__*/css(/*#__PURE__*/getIconMediaQueries(), " gap:var(", tokens.captionGap, ");", CodeWrapper, ",", CodeGroup, "{gap:var(", tokens.codeItemsGap, ");}", ItemInput, "{font-size:var(", privateTokens.fontSize, ");font-family:var(", tokens.fontFamily, ");font-style:var(", tokens.fontStyle, ");font-weight:var(", tokens.fontWeight, ");letter-spacing:var(", tokens.letterSpacing, ");line-height:var(", privateTokens.lineHeight, ");width:var(", privateTokens.itemWidth, ");height:var(", privateTokens.itemHeight, ");}", CaptionWrapper, "{font-family:var(", tokens.captionFontFamily, ");font-size:var(", tokens.captionFontSize, ");font-style:var(", tokens.captionFontStyle, ");font-weight:var(", tokens.captionFontWeight, ");letter-spacing:var(", tokens.captionLetterSpacing, ");line-height:var(", tokens.captionLineHeight, ");};label:plasma-new-hope__base;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
19
|
+
export var base = /*#__PURE__*/css(/*#__PURE__*/getIconMediaQueries(), " gap:var(", tokens.captionGap, ");", CodeWrapper, ",", CodeGroup, "{gap:var(", tokens.codeItemsGap, ");}", ItemInput, "{font-size:var(", privateTokens.fontSize, ");font-family:var(", tokens.fontFamily, ");font-style:var(", tokens.fontStyle, ");font-weight:var(", tokens.fontWeight, ");letter-spacing:var(", tokens.letterSpacing, ");line-height:var(", privateTokens.lineHeight, ");width:var(", privateTokens.itemWidth, ");height:var(", privateTokens.itemHeight, ");}", CaptionWrapper, "{font-family:var(", tokens.captionFontFamily, ");font-size:var(", tokens.captionFontSize, ");font-style:var(", tokens.captionFontStyle, ");font-weight:var(", tokens.captionFontWeight, ");letter-spacing:var(", tokens.captionLetterSpacing, ");line-height:var(", tokens.captionLineHeight, ");};label:plasma-new-hope__base;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvQ29kZUlucHV0L3ZhcmlhdGlvbnMvX3NpemUvYmFzZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxQnVCIiwiZmlsZSI6Ii4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvQ29kZUlucHV0L3ZhcmlhdGlvbnMvX3NpemUvYmFzZS50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuaW1wb3J0IHsgQ2FwdGlvbldyYXBwZXIsIENvZGVHcm91cCwgQ29kZVdyYXBwZXIsIEl0ZW1JbnB1dCB9IGZyb20gJy4uLy4uL0NvZGVJbnB1dC5zdHlsZXMnO1xuaW1wb3J0IHsgdG9rZW5zLCBwcml2YXRlVG9rZW5zLCBUb2tlbnNUeXBlIH0gZnJvbSAnLi4vLi4vQ29kZUlucHV0LnRva2Vucyc7XG5pbXBvcnQgeyBzY3JlZW5Hcm91cEJyZWFrcG9pbnRzIH0gZnJvbSAnLi4vLi4vLi4vLi4vdXRpbHMvY29uc3RhbnRzJztcblxuY29uc3QgZ2V0SWNvbk1lZGlhUXVlcmllcyA9ICgpID0+IHtcbiAgICByZXR1cm4gT2JqZWN0LmVudHJpZXMoc2NyZWVuR3JvdXBCcmVha3BvaW50cylcbiAgICAgICAgLm1hcCgoW25hbWUsIG1pbldpZHRoXSkgPT4ge1xuICAgICAgICAgICAgcmV0dXJuIGBcbiAgICAgICAgICAgICAgICBAbWVkaWEgKG1pbi13aWR0aDogJHttaW5XaWR0aH0pIHtcbiAgICAgICAgICAgICAgICAgICAgJHtwcml2YXRlVG9rZW5zLmZvbnRTaXplfTogdmFyKCR7dG9rZW5zW2Ake25hbWV9Rm9udFNpemVgIGFzIFRva2Vuc1R5cGVdfSk7XG4gICAgICAgICAgICAgICAgICAgICR7cHJpdmF0ZVRva2Vucy5saW5lSGVpZ2h0fTogdmFyKCR7dG9rZW5zW2Ake25hbWV9Q29kZUl0ZW1IZWlnaHRgIGFzIFRva2Vuc1R5cGVdfSk7XG4gICAgICAgICAgICAgICAgICAgICR7cHJpdmF0ZVRva2Vucy5pdGVtV2lkdGh9OiB2YXIoJHt0b2tlbnNbYCR7bmFtZX1Db2RlSXRlbVdpZHRoYCBhcyBUb2tlbnNUeXBlXX0pO1xuICAgICAgICAgICAgICAgICAgICAke3ByaXZhdGVUb2tlbnMuaXRlbUhlaWdodH06IHZhcigke3Rva2Vuc1tgJHtuYW1lfUxpbmVIZWlnaHRgIGFzIFRva2Vuc1R5cGVdfSk7XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgYDtcbiAgICAgICAgfSlcbiAgICAgICAgLmpvaW4oJ1xcbicpO1xufTtcblxuZXhwb3J0IGNvbnN0IGJhc2UgPSBjc3NgXG4gICAgJHtnZXRJY29uTWVkaWFRdWVyaWVzKCl9XG4gICAgZ2FwOiB2YXIoJHt0b2tlbnMuY2FwdGlvbkdhcH0pO1xuXG4gICAgJHtDb2RlV3JhcHBlcn0sICR7Q29kZUdyb3VwfSB7XG4gICAgICAgIGdhcDogdmFyKCR7dG9rZW5zLmNvZGVJdGVtc0dhcH0pO1xuICAgIH1cblxuICAgICR7SXRlbUlucHV0fSB7XG4gICAgICAgIGZvbnQtc2l6ZTogdmFyKCR7cHJpdmF0ZVRva2Vucy5mb250U2l6ZX0pO1xuICAgICAgICBmb250LWZhbWlseTogdmFyKCR7dG9rZW5zLmZvbnRGYW1pbHl9KTtcbiAgICAgICAgZm9udC1zdHlsZTogdmFyKCR7dG9rZW5zLmZvbnRTdHlsZX0pO1xuICAgICAgICBmb250LXdlaWdodDogdmFyKCR7dG9rZW5zLmZvbnRXZWlnaHR9KTtcbiAgICAgICAgbGV0dGVyLXNwYWNpbmc6IHZhcigke3Rva2Vucy5sZXR0ZXJTcGFjaW5nfSk7XG4gICAgICAgIGxpbmUtaGVpZ2h0OiB2YXIoJHtwcml2YXRlVG9rZW5zLmxpbmVIZWlnaHR9KTtcbiAgICAgICAgd2lkdGg6IHZhcigke3ByaXZhdGVUb2tlbnMuaXRlbVdpZHRofSk7XG4gICAgICAgIGhlaWdodDogdmFyKCR7cHJpdmF0ZVRva2Vucy5pdGVtSGVpZ2h0fSk7XG4gICAgfVxuXG4gICAgJHtDYXB0aW9uV3JhcHBlcn0ge1xuICAgICAgICBmb250LWZhbWlseTogdmFyKCR7dG9rZW5zLmNhcHRpb25Gb250RmFtaWx5fSk7XG4gICAgICAgIGZvbnQtc2l6ZTogdmFyKCR7dG9rZW5zLmNhcHRpb25Gb250U2l6ZX0pO1xuICAgICAgICBmb250LXN0eWxlOiB2YXIoJHt0b2tlbnMuY2FwdGlvbkZvbnRTdHlsZX0pO1xuICAgICAgICBmb250LXdlaWdodDogdmFyKCR7dG9rZW5zLmNhcHRpb25Gb250V2VpZ2h0fSk7XG4gICAgICAgIGxldHRlci1zcGFjaW5nOiB2YXIoJHt0b2tlbnMuY2FwdGlvbkxldHRlclNwYWNpbmd9KTtcbiAgICAgICAgbGluZS1oZWlnaHQ6IHZhcigke3Rva2Vucy5jYXB0aW9uTGluZUhlaWdodH0pO1xuICAgIH1cbmA7XG4iXX0= */"));
|
@@ -5,4 +5,5 @@ export { useForceUpdate } from "./useForceUpdate";
|
|
5
5
|
export { useDidMountEffect } from "./useDidMountEffect";
|
6
6
|
export { useDidMountLayoutEffect } from "./useDidMountLayoutEffect";
|
7
7
|
export { useOutsideClick } from "./useOutsideClick";
|
8
|
-
export { useIsomorphicLayoutEffect } from "./useIsomorphicLayoutEffect";
|
8
|
+
export { useIsomorphicLayoutEffect } from "./useIsomorphicLayoutEffect";
|
9
|
+
export { useCodeHook } from "./useCodeHook";
|
@@ -0,0 +1,26 @@
|
|
1
|
+
import { useEffect } from 'react';
|
2
|
+
import { useDidMountEffect } from '.';
|
3
|
+
export var useCodeHook = function useCodeHook(_ref) {
|
4
|
+
var inputRefs = _ref.inputRefs,
|
5
|
+
codeLength = _ref.codeLength,
|
6
|
+
disabled = _ref.disabled,
|
7
|
+
autoFocus = _ref.autoFocus,
|
8
|
+
originalValue = _ref.originalValue,
|
9
|
+
getLastActiveIndex = _ref.getLastActiveIndex,
|
10
|
+
handleFullCodeEnter = _ref.handleFullCodeEnter;
|
11
|
+
useEffect(function () {
|
12
|
+
inputRefs.current = inputRefs.current.slice(0, codeLength);
|
13
|
+
}, [codeLength]);
|
14
|
+
useEffect(function () {
|
15
|
+
if (autoFocus && !disabled) {
|
16
|
+
var _inputRefs$current$la;
|
17
|
+
var lastActiveIndex = getLastActiveIndex();
|
18
|
+
(_inputRefs$current$la = inputRefs.current[lastActiveIndex]) === null || _inputRefs$current$la === void 0 || _inputRefs$current$la.focus();
|
19
|
+
}
|
20
|
+
}, [autoFocus]);
|
21
|
+
useDidMountEffect(function () {
|
22
|
+
if (handleFullCodeEnter && originalValue.length === codeLength) {
|
23
|
+
handleFullCodeEnter(originalValue);
|
24
|
+
}
|
25
|
+
}, [originalValue, handleFullCodeEnter]);
|
26
|
+
};
|
@@ -15,4 +15,10 @@ export var screenGroupBreakpoints = {
|
|
15
15
|
small: '0',
|
16
16
|
medium: '35rem',
|
17
17
|
large: '60rem'
|
18
|
-
};
|
18
|
+
};
|
19
|
+
export var ONLY_DIGITS_PATTERN = '^\\d+$';
|
20
|
+
export var ONLY_CHARS_PATTERN = '^[a-zA-Z]+$';
|
21
|
+
export var ONLY_DIGITS_AND_CHARS_PATTERN = '^[a-zA-Z0-9]+$';
|
22
|
+
export var FORBIDDEN_KEYS = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Delete', 'Tab'];
|
23
|
+
export var BACKSPACE_KEY = 'Backspace';
|
24
|
+
export var ANIMATION_TIMEOUT = 300;
|
@@ -9,6 +9,7 @@ export { createEvent } from "./createEvent";
|
|
9
9
|
import * as _constants from "./constants";
|
10
10
|
export { _constants as constants };
|
11
11
|
export * from "./getPopoverPlacement";
|
12
|
+
export * from "./initialValuesHelper";
|
12
13
|
export { noop } from "./noop";
|
13
14
|
export { getHeightAsNumber } from "./getHeightAsNumber";
|
14
15
|
export { createConditionalComponent } from "./createConditionalComponent";
|