@salutejs/plasma-new-hope 0.327.0-canary.1973.15679545656.0 → 0.327.0-canary.1973.15733948288.0

package/cjs/utils/constants.js

@@ -20,7 +20,19 @@ var screenGroupBreakpoints = {
   medium: '35rem',
   large: '60rem'
 };
+var ONLY_DIGITS_PATTERN = '^\\d+$';
+var ONLY_CHARS_PATTERN = '^[a-zA-Z]+$';
+var ONLY_DIGITS_AND_CHARS_PATTERN = '^[a-zA-Z0-9]+$';
+var FORBIDDEN_KEYS = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Delete', 'Tab'];
+var BACKSPACE_KEY = 'Backspace';
+var ANIMATION_TIMEOUT = 300;
 
+exports.ANIMATION_TIMEOUT = ANIMATION_TIMEOUT;
+exports.BACKSPACE_KEY = BACKSPACE_KEY;
+exports.FORBIDDEN_KEYS = FORBIDDEN_KEYS;
+exports.ONLY_CHARS_PATTERN = ONLY_CHARS_PATTERN;
+exports.ONLY_DIGITS_AND_CHARS_PATTERN = ONLY_DIGITS_AND_CHARS_PATTERN;
+exports.ONLY_DIGITS_PATTERN = ONLY_DIGITS_PATTERN;
 exports.keyCodes = keyCodes;
 exports.screenGroupBreakpoints = screenGroupBreakpoints;
 //# sourceMappingURL=constants.js.map

package/cjs/utils/constants.js.map

@@ -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;;;;;"}
+{"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

@@ -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":";;;;AAgBaA,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;;;;;"}
+{"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;;;;;"}

package/cjs/utils/initialValuesHelper.js.map

@@ -0,0 +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;;;;;;"}

package/emotion/cjs/components/CodeField/CodeField.js

@@ -202,21 +202,15 @@ var codeFieldRoot = exports.codeFieldRoot = function codeFieldRoot(Root) {
         onFullCodeEnter(fullCode);
       }
     }, []);
-    (0, _react.useEffect)(function () {
-      inputRefs.current = inputRefs.current.slice(0, codeLength);
-    }, [codeLength]);
-    (0, _react.useEffect)(function () {
-      if (autoFocus && !disabled) {
-        var _inputRefs$current$la;
-        var lastActiveIndex = getLastActiveIndex();
-        (_inputRefs$current$la = inputRefs.current[lastActiveIndex]) === null || _inputRefs$current$la === void 0 || _inputRefs$current$la.focus();
-      }
-    }, [autoFocus]);
-    (0, _hooks.useDidMountEffect)(function () {
-      if (handleFullCodeEnter && originalValue.length === codeLength) {
-        handleFullCodeEnter(originalValue);
-      }
-    }, [originalValue, handleFullCodeEnter]);
+    (0, _hooks.useCodeHook)({
+      inputRefs: inputRefs,
+      codeLength: codeLength,
+      disabled: disabled,
+      autoFocus: autoFocus,
+      originalValue: originalValue,
+      getLastActiveIndex: getLastActiveIndex,
+      handleFullCodeEnter: handleFullCodeEnter
+    });
     (0, _hooks.useDidMountEffect)(function () {
       if (isError) {
         (0, _utils2.handleCodeError)({

package/emotion/cjs/components/CodeInput/CodeInput.js

@@ -9,7 +9,7 @@ var _react = /*#__PURE__*/_interopRequireWildcard(/*#__PURE__*/require("react"))
 var _classnames = /*#__PURE__*/_interopRequireDefault(/*#__PURE__*/require("classnames"));
 var _hooks = /*#__PURE__*/require("../../hooks");
 var _utils = /*#__PURE__*/require("../../utils");
-var _constants = /*#__PURE__*/require("./utils/constants");
+var _constants = /*#__PURE__*/require("../../utils/constants");
 var _utils2 = /*#__PURE__*/require("./utils");
 var _CodeInput = /*#__PURE__*/require("./CodeInput.tokens");
 var _CodeInput2 = /*#__PURE__*/require("./CodeInput.styles");
@@ -208,21 +208,15 @@ var codeInputRoot = exports.codeInputRoot = function codeInputRoot(Root) {
         onFullCodeEnter(fullCode);
       }
     }, []);
-    (0, _react.useEffect)(function () {
-      inputRefs.current = inputRefs.current.slice(0, codeLength);
-    }, [codeLength]);
-    (0, _react.useEffect)(function () {
-      if (autoFocus && !disabled) {
-        var _inputRefs$current$la;
-        var lastActiveIndex = getLastActiveIndex();
-        (_inputRefs$current$la = inputRefs.current[lastActiveIndex]) === null || _inputRefs$current$la === void 0 || _inputRefs$current$la.focus();
-      }
-    }, [autoFocus]);
-    (0, _hooks.useDidMountEffect)(function () {
-      if (handleFullCodeEnter && originalValue.length === codeLength) {
-        handleFullCodeEnter(originalValue);
-      }
-    }, [originalValue, handleFullCodeEnter]);
+    (0, _hooks.useCodeHook)({
+      inputRefs: inputRefs,
+      codeLength: codeLength,
+      disabled: disabled,
+      autoFocus: autoFocus,
+      originalValue: originalValue,
+      getLastActiveIndex: getLastActiveIndex,
+      handleFullCodeEnter: handleFullCodeEnter
+    });
     (0, _hooks.useDidMountEffect)(function () {
       if (isError) {
         (0, _utils2.handleCodeError)({

package/emotion/cjs/components/CodeInput/utils/handleCodeError.js

@@ -5,8 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.handleCodeError = void 0;
 var _CodeInput = /*#__PURE__*/require("../CodeInput.tokens");
-var _constants = /*#__PURE__*/require("./constants");
-var _initialValuesHelper = /*#__PURE__*/require("./initialValuesHelper");
+var _utils = /*#__PURE__*/require("../../../utils");
+var _constants = /*#__PURE__*/require("../../../utils/constants");
 function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
 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."); }
 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) {
       (_captionRef$current2 = captionRef.current) === null || _captionRef$current2 === void 0 || _captionRef$current2.classList.add(_CodeInput.classes.captionError);
       setTimeout(function () {
         var _inputRefs$current$, _inputContainerRef$cu2;
-        codeSetter((0, _initialValuesHelper.getCodeValue)(codeLength, ''));
+        codeSetter((0, _utils.getCodeValue)(codeLength, ''));
         (_inputRefs$current$ = inputRefs.current[0]) === null || _inputRefs$current$ === void 0 || _inputRefs$current$.focus();
         (_inputContainerRef$cu2 = inputContainerRef.current) === null || _inputContainerRef$cu2 === void 0 || _inputContainerRef$cu2.classList.remove(_CodeInput.classes.codeError, _CodeInput.classes.codeErrorAnimation, _CodeInput.classes.codeErrorFade);
       }, _constants.ANIMATION_TIMEOUT);

package/emotion/cjs/components/CodeInput/utils/handleItemError.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.handleItemError = void 0;
 var _CodeInput = /*#__PURE__*/require("../CodeInput.tokens");
-var _constants = /*#__PURE__*/require("./constants");
+var _constants = /*#__PURE__*/require("../../../utils/constants");
 var handleItemError = exports.handleItemError = function handleItemError(_ref) {
   var _inputContainerRef$cu;
   var currentSymbol = _ref.currentSymbol,

package/emotion/cjs/components/CodeInput/utils/index.js

@@ -6,19 +6,19 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "getCodeValue", {
   enumerable: true,
   get: function get() {
-    return _initialValuesHelper.getCodeValue;
+    return _utils.getCodeValue;
   }
 });
 Object.defineProperty(exports, "getFieldPattern", {
   enumerable: true,
   get: function get() {
-    return _initialValuesHelper.getFieldPattern;
+    return _utils.getFieldPattern;
   }
 });
 Object.defineProperty(exports, "getPlaceholderValue", {
   enumerable: true,
   get: function get() {
-    return _initialValuesHelper.getPlaceholderValue;
+    return _utils.getPlaceholderValue;
   }
 });
 Object.defineProperty(exports, "handleCodeError", {
@@ -33,6 +33,6 @@ Object.defineProperty(exports, "handleItemError", {
     return _handleItemError.handleItemError;
   }
 });
-var _initialValuesHelper = /*#__PURE__*/require("./initialValuesHelper");
+var _utils = /*#__PURE__*/require("../../../utils");
 var _handleItemError = /*#__PURE__*/require("./handleItemError");
 var _handleCodeError = /*#__PURE__*/require("./handleCodeError");

package/emotion/cjs/components/CodeInput/variations/_size/base.js

@@ -22,4 +22,4 @@ var getIconMediaQueries = function getIconMediaQueries() {
     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            ");
   }).join('\n');
 };
-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,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvQ29kZUlucHV0L3ZhcmlhdGlvbnMvX3NpemUvYmFzZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQnVCIiwiZmlsZSI6Ii4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvQ29kZUlucHV0L3ZhcmlhdGlvbnMvX3NpemUvYmFzZS50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuaW1wb3J0IHsgQ2FwdGlvbldyYXBwZXIsIENvZGVHcm91cCwgQ29kZVdyYXBwZXIsIEl0ZW1JbnB1dCB9IGZyb20gJy4uLy4uL0NvZGVJbnB1dC5zdHlsZXMnO1xuaW1wb3J0IHsgdG9rZW5zLCBwcml2YXRlVG9rZW5zIH0gZnJvbSAnLi4vLi4vQ29kZUlucHV0LnRva2Vucyc7XG5pbXBvcnQgeyBzY3JlZW5Hcm91cEJyZWFrcG9pbnRzIH0gZnJvbSAnLi4vLi4vLi4vLi4vdXRpbHMvY29uc3RhbnRzJztcbmltcG9ydCB7IFRva2Vuc1R5cGUgfSBmcm9tICcuLi8uLi91dGlscy90eXBlcyc7XG5cbmNvbnN0IGdldEljb25NZWRpYVF1ZXJpZXMgPSAoKSA9PiB7XG4gICAgcmV0dXJuIE9iamVjdC5lbnRyaWVzKHNjcmVlbkdyb3VwQnJlYWtwb2ludHMpXG4gICAgICAgIC5tYXAoKFtuYW1lLCBtaW5XaWR0aF0pID0+IHtcbiAgICAgICAgICAgIHJldHVybiBgXG4gICAgICAgICAgICAgICAgQG1lZGlhIChtaW4td2lkdGg6ICR7bWluV2lkdGh9KSB7XG4gICAgICAgICAgICAgICAgICAgICR7cHJpdmF0ZVRva2Vucy5mb250U2l6ZX06IHZhcigke3Rva2Vuc1tgJHtuYW1lfUZvbnRTaXplYCBhcyBUb2tlbnNUeXBlXX0pO1xuICAgICAgICAgICAgICAgICAgICAke3ByaXZhdGVUb2tlbnMubGluZUhlaWdodH06IHZhcigke3Rva2Vuc1tgJHtuYW1lfUNvZGVJdGVtSGVpZ2h0YCBhcyBUb2tlbnNUeXBlXX0pO1xuICAgICAgICAgICAgICAgICAgICAke3ByaXZhdGVUb2tlbnMuaXRlbVdpZHRofTogdmFyKCR7dG9rZW5zW2Ake25hbWV9Q29kZUl0ZW1XaWR0aGAgYXMgVG9rZW5zVHlwZV19KTtcbiAgICAgICAgICAgICAgICAgICAgJHtwcml2YXRlVG9rZW5zLml0ZW1IZWlnaHR9OiB2YXIoJHt0b2tlbnNbYCR7bmFtZX1MaW5lSGVpZ2h0YCBhcyBUb2tlbnNUeXBlXX0pO1xuICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGA7XG4gICAgICAgIH0pXG4gICAgICAgIC5qb2luKCdcXG4nKTtcbn07XG5cbmV4cG9ydCBjb25zdCBiYXNlID0gY3NzYFxuICAgICR7Z2V0SWNvbk1lZGlhUXVlcmllcygpfVxuICAgIGdhcDogdmFyKCR7dG9rZW5zLmNhcHRpb25HYXB9KTtcblxuICAgICR7Q29kZVdyYXBwZXJ9LCAke0NvZGVHcm91cH0ge1xuICAgICAgICBnYXA6IHZhcigke3Rva2Vucy5jb2RlSXRlbXNHYXB9KTtcbiAgICB9XG5cbiAgICAke0l0ZW1JbnB1dH0ge1xuICAgICAgICBmb250LXNpemU6IHZhcigke3ByaXZhdGVUb2tlbnMuZm9udFNpemV9KTtcbiAgICAgICAgZm9udC1mYW1pbHk6IHZhcigke3Rva2Vucy5mb250RmFtaWx5fSk7XG4gICAgICAgIGZvbnQtc3R5bGU6IHZhcigke3Rva2Vucy5mb250U3R5bGV9KTtcbiAgICAgICAgZm9udC13ZWlnaHQ6IHZhcigke3Rva2Vucy5mb250V2VpZ2h0fSk7XG4gICAgICAgIGxldHRlci1zcGFjaW5nOiB2YXIoJHt0b2tlbnMubGV0dGVyU3BhY2luZ30pO1xuICAgICAgICBsaW5lLWhlaWdodDogdmFyKCR7cHJpdmF0ZVRva2Vucy5saW5lSGVpZ2h0fSk7XG4gICAgICAgIHdpZHRoOiB2YXIoJHtwcml2YXRlVG9rZW5zLml0ZW1XaWR0aH0pO1xuICAgICAgICBoZWlnaHQ6IHZhcigke3ByaXZhdGVUb2tlbnMuaXRlbUhlaWdodH0pO1xuICAgIH1cblxuICAgICR7Q2FwdGlvbldyYXBwZXJ9IHtcbiAgICAgICAgZm9udC1mYW1pbHk6IHZhcigke3Rva2Vucy5jYXB0aW9uRm9udEZhbWlseX0pO1xuICAgICAgICBmb250LXNpemU6IHZhcigke3Rva2Vucy5jYXB0aW9uRm9udFNpemV9KTtcbiAgICAgICAgZm9udC1zdHlsZTogdmFyKCR7dG9rZW5zLmNhcHRpb25Gb250U3R5bGV9KTtcbiAgICAgICAgZm9udC13ZWlnaHQ6IHZhcigke3Rva2Vucy5jYXB0aW9uRm9udFdlaWdodH0pO1xuICAgICAgICBsZXR0ZXItc3BhY2luZzogdmFyKCR7dG9rZW5zLmNhcHRpb25MZXR0ZXJTcGFjaW5nfSk7XG4gICAgICAgIGxpbmUtaGVpZ2h0OiB2YXIoJHt0b2tlbnMuY2FwdGlvbkxpbmVIZWlnaHR9KTtcbiAgICB9XG5gO1xuIl19 */"));
+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= */"));

package/emotion/cjs/hooks/index.js

@@ -3,6 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "useCodeHook", {
+  enumerable: true,
+  get: function get() {
+    return _useCodeHook.useCodeHook;
+  }
+});
 Object.defineProperty(exports, "useDidMountEffect", {
   enumerable: true,
   get: function get() {
@@ -58,4 +64,5 @@ var _useForceUpdate = /*#__PURE__*/require("./useForceUpdate");
 var _useDidMountEffect = /*#__PURE__*/require("./useDidMountEffect");
 var _useDidMountLayoutEffect = /*#__PURE__*/require("./useDidMountLayoutEffect");
 var _useOutsideClick = /*#__PURE__*/require("./useOutsideClick");
-var _useIsomorphicLayoutEffect = /*#__PURE__*/require("./useIsomorphicLayoutEffect");
+var _useIsomorphicLayoutEffect = /*#__PURE__*/require("./useIsomorphicLayoutEffect");
+var _useCodeHook = /*#__PURE__*/require("./useCodeHook");

package/emotion/cjs/hooks/useCodeHook.js

@@ -0,0 +1,32 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useCodeHook = void 0;
+var _react = /*#__PURE__*/require("react");
+var _ = /*#__PURE__*/require(".");
+var useCodeHook = exports.useCodeHook = function useCodeHook(_ref) {
+  var inputRefs = _ref.inputRefs,
+    codeLength = _ref.codeLength,
+    disabled = _ref.disabled,
+    autoFocus = _ref.autoFocus,
+    originalValue = _ref.originalValue,
+    getLastActiveIndex = _ref.getLastActiveIndex,
+    handleFullCodeEnter = _ref.handleFullCodeEnter;
+  (0, _react.useEffect)(function () {
+    inputRefs.current = inputRefs.current.slice(0, codeLength);
+  }, [codeLength]);
+  (0, _react.useEffect)(function () {
+    if (autoFocus && !disabled) {
+      var _inputRefs$current$la;
+      var lastActiveIndex = getLastActiveIndex();
+      (_inputRefs$current$la = inputRefs.current[lastActiveIndex]) === null || _inputRefs$current$la === void 0 || _inputRefs$current$la.focus();
+    }
+  }, [autoFocus]);
+  (0, _.useDidMountEffect)(function () {
+    if (handleFullCodeEnter && originalValue.length === codeLength) {
+      handleFullCodeEnter(originalValue);
+    }
+  }, [originalValue, handleFullCodeEnter]);
+};

package/emotion/cjs/utils/constants.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.screenGroupBreakpoints = exports.keyCodes = void 0;
+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;
 var keyCodes = exports.keyCodes = {
   PageUp: 33,
   PageDown: 34,
@@ -21,4 +21,10 @@ var screenGroupBreakpoints = exports.screenGroupBreakpoints = {
   small: '0',
   medium: '35rem',
   large: '60rem'
-};
+};
+var ONLY_DIGITS_PATTERN = exports.ONLY_DIGITS_PATTERN = '^\\d+$';
+var ONLY_CHARS_PATTERN = exports.ONLY_CHARS_PATTERN = '^[a-zA-Z]+$';
+var ONLY_DIGITS_AND_CHARS_PATTERN = exports.ONLY_DIGITS_AND_CHARS_PATTERN = '^[a-zA-Z0-9]+$';
+var FORBIDDEN_KEYS = exports.FORBIDDEN_KEYS = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Delete', 'Tab'];
+var BACKSPACE_KEY = exports.BACKSPACE_KEY = 'Backspace';
+var ANIMATION_TIMEOUT = exports.ANIMATION_TIMEOUT = 300;

package/emotion/cjs/utils/index.js

@@ -131,6 +131,18 @@ Object.keys(_getPopoverPlacement).forEach(function (key) {
     }
   });
 });
+var _initialValuesHelper = /*#__PURE__*/require("./initialValuesHelper");
+Object.keys(_initialValuesHelper).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _initialValuesHelper[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _initialValuesHelper[key];
+    }
+  });
+});
 var _noop = /*#__PURE__*/require("./noop");
 var _getHeightAsNumber = /*#__PURE__*/require("./getHeightAsNumber");
 var _createConditionalComponent = /*#__PURE__*/require("./createConditionalComponent");

package/emotion/es/components/CodeField/CodeField.js

@@ -17,10 +17,11 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 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; }
 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; }
-import React, { forwardRef, Fragment, useCallback, useEffect, useRef, useState } from 'react';
+import React, { forwardRef, Fragment, useCallback, useRef, useState } from 'react';
 import cls from 'classnames';
 import { useDidMountEffect } from "../../hooks";
 import { getSizeValueFromProp } from "../../utils";
+import { useCodeHook } from "../../hooks";
 import { BACKSPACE_KEY, FORBIDDEN_KEYS, ONLY_DIGITS_PATTERN } from "./utils/constants";
 import { getCodeValue, getFieldPattern, getPlaceholderValue, handleCodeError, handleItemError } from "./utils";
 import { classes } from "./CodeField.tokens";
@@ -193,21 +194,15 @@ export var codeFieldRoot = function codeFieldRoot(Root) {
         onFullCodeEnter(fullCode);
       }
     }, []);
-    useEffect(function () {
-      inputRefs.current = inputRefs.current.slice(0, codeLength);
-    }, [codeLength]);
-    useEffect(function () {
-      if (autoFocus && !disabled) {
-        var _inputRefs$current$la;
-        var lastActiveIndex = getLastActiveIndex();
-        (_inputRefs$current$la = inputRefs.current[lastActiveIndex]) === null || _inputRefs$current$la === void 0 || _inputRefs$current$la.focus();
-      }
-    }, [autoFocus]);
-    useDidMountEffect(function () {
-      if (handleFullCodeEnter && originalValue.length === codeLength) {
-        handleFullCodeEnter(originalValue);
-      }
-    }, [originalValue, handleFullCodeEnter]);
+    useCodeHook({
+      inputRefs: inputRefs,
+      codeLength: codeLength,
+      disabled: disabled,
+      autoFocus: autoFocus,
+      originalValue: originalValue,
+      getLastActiveIndex: getLastActiveIndex,
+      handleFullCodeEnter: handleFullCodeEnter
+    });
     useDidMountEffect(function () {
       if (isError) {
         handleCodeError({

package/emotion/es/components/CodeInput/CodeInput.js

@@ -17,11 +17,12 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 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; }
 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; }
-import React, { forwardRef, Fragment, useCallback, useEffect, useRef, useState } from 'react';
+import React, { forwardRef, Fragment, useCallback, useRef, useState } from 'react';
 import cls from 'classnames';
 import { useDidMountEffect } from "../../hooks";
 import { getSizeValueFromProp } from "../../utils";
-import { BACKSPACE_KEY, FORBIDDEN_KEYS, ONLY_DIGITS_PATTERN } from "./utils/constants";
+import { BACKSPACE_KEY, FORBIDDEN_KEYS, ONLY_DIGITS_PATTERN } from "../../utils/constants";
+import { useCodeHook } from "../../hooks";
 import { getCodeValue, getFieldPattern, getPlaceholderValue, handleCodeError, handleItemError } from "./utils";
 import { classes } from "./CodeInput.tokens";
 import { base, CaptionWrapper, CodeGroup, CodeWrapper, ItemInput, Separator, ItemWrapper, ItemCircle } from "./CodeInput.styles";
@@ -199,21 +200,15 @@ export var codeInputRoot = function codeInputRoot(Root) {
         onFullCodeEnter(fullCode);
       }
     }, []);
-    useEffect(function () {
-      inputRefs.current = inputRefs.current.slice(0, codeLength);
-    }, [codeLength]);
-    useEffect(function () {
-      if (autoFocus && !disabled) {
-        var _inputRefs$current$la;
-        var lastActiveIndex = getLastActiveIndex();
-        (_inputRefs$current$la = inputRefs.current[lastActiveIndex]) === null || _inputRefs$current$la === void 0 || _inputRefs$current$la.focus();
-      }
-    }, [autoFocus]);
-    useDidMountEffect(function () {
-      if (handleFullCodeEnter && originalValue.length === codeLength) {
-        handleFullCodeEnter(originalValue);
-      }
-    }, [originalValue, handleFullCodeEnter]);
+    useCodeHook({
+      inputRefs: inputRefs,
+      codeLength: codeLength,
+      disabled: disabled,
+      autoFocus: autoFocus,
+      originalValue: originalValue,
+      getLastActiveIndex: getLastActiveIndex,
+      handleFullCodeEnter: handleFullCodeEnter
+    });
     useDidMountEffect(function () {
       if (isError) {
         handleCodeError({

package/emotion/es/components/CodeInput/utils/handleCodeError.js

@@ -5,8 +5,8 @@ function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Sym
 function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
 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; }
 import { classes } from "../CodeInput.tokens";
-import { ANIMATION_TIMEOUT } from "./constants";
-import { getCodeValue } from "./initialValuesHelper";
+import { getCodeValue } from "../../../utils";
+import { ANIMATION_TIMEOUT } from "../../../utils/constants";
 export var handleCodeError = function handleCodeError(_ref) {
   var _captionRef$current, _captionRef$current2;
   var codeLength = _ref.codeLength,

package/emotion/es/components/CodeInput/utils/handleItemError.js

@@ -1,5 +1,5 @@
 import { classes } from "../CodeInput.tokens";
-import { ANIMATION_TIMEOUT } from "./constants";
+import { ANIMATION_TIMEOUT } from "../../../utils/constants";
 export var handleItemError = function handleItemError(_ref) {
   var _inputContainerRef$cu;
   var currentSymbol = _ref.currentSymbol,

package/emotion/es/components/CodeInput/utils/index.js

@@ -1,3 +1,3 @@
-export { getFieldPattern, getPlaceholderValue, getCodeValue } from "./initialValuesHelper";
+export { getFieldPattern, getPlaceholderValue, getCodeValue } from "../../../utils";
 export { handleItemError } from "./handleItemError";
 export { handleCodeError } from "./handleCodeError";

package/emotion/es/components/CodeInput/variations/_size/base.js

@@ -16,4 +16,4 @@ var getIconMediaQueries = function getIconMediaQueries() {
     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            ");
   }).join('\n');
 };
-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,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvQ29kZUlucHV0L3ZhcmlhdGlvbnMvX3NpemUvYmFzZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQnVCIiwiZmlsZSI6Ii4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvQ29kZUlucHV0L3ZhcmlhdGlvbnMvX3NpemUvYmFzZS50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuaW1wb3J0IHsgQ2FwdGlvbldyYXBwZXIsIENvZGVHcm91cCwgQ29kZVdyYXBwZXIsIEl0ZW1JbnB1dCB9IGZyb20gJy4uLy4uL0NvZGVJbnB1dC5zdHlsZXMnO1xuaW1wb3J0IHsgdG9rZW5zLCBwcml2YXRlVG9rZW5zIH0gZnJvbSAnLi4vLi4vQ29kZUlucHV0LnRva2Vucyc7XG5pbXBvcnQgeyBzY3JlZW5Hcm91cEJyZWFrcG9pbnRzIH0gZnJvbSAnLi4vLi4vLi4vLi4vdXRpbHMvY29uc3RhbnRzJztcbmltcG9ydCB7IFRva2Vuc1R5cGUgfSBmcm9tICcuLi8uLi91dGlscy90eXBlcyc7XG5cbmNvbnN0IGdldEljb25NZWRpYVF1ZXJpZXMgPSAoKSA9PiB7XG4gICAgcmV0dXJuIE9iamVjdC5lbnRyaWVzKHNjcmVlbkdyb3VwQnJlYWtwb2ludHMpXG4gICAgICAgIC5tYXAoKFtuYW1lLCBtaW5XaWR0aF0pID0+IHtcbiAgICAgICAgICAgIHJldHVybiBgXG4gICAgICAgICAgICAgICAgQG1lZGlhIChtaW4td2lkdGg6ICR7bWluV2lkdGh9KSB7XG4gICAgICAgICAgICAgICAgICAgICR7cHJpdmF0ZVRva2Vucy5mb250U2l6ZX06IHZhcigke3Rva2Vuc1tgJHtuYW1lfUZvbnRTaXplYCBhcyBUb2tlbnNUeXBlXX0pO1xuICAgICAgICAgICAgICAgICAgICAke3ByaXZhdGVUb2tlbnMubGluZUhlaWdodH06IHZhcigke3Rva2Vuc1tgJHtuYW1lfUNvZGVJdGVtSGVpZ2h0YCBhcyBUb2tlbnNUeXBlXX0pO1xuICAgICAgICAgICAgICAgICAgICAke3ByaXZhdGVUb2tlbnMuaXRlbVdpZHRofTogdmFyKCR7dG9rZW5zW2Ake25hbWV9Q29kZUl0ZW1XaWR0aGAgYXMgVG9rZW5zVHlwZV19KTtcbiAgICAgICAgICAgICAgICAgICAgJHtwcml2YXRlVG9rZW5zLml0ZW1IZWlnaHR9OiB2YXIoJHt0b2tlbnNbYCR7bmFtZX1MaW5lSGVpZ2h0YCBhcyBUb2tlbnNUeXBlXX0pO1xuICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGA7XG4gICAgICAgIH0pXG4gICAgICAgIC5qb2luKCdcXG4nKTtcbn07XG5cbmV4cG9ydCBjb25zdCBiYXNlID0gY3NzYFxuICAgICR7Z2V0SWNvbk1lZGlhUXVlcmllcygpfVxuICAgIGdhcDogdmFyKCR7dG9rZW5zLmNhcHRpb25HYXB9KTtcblxuICAgICR7Q29kZVdyYXBwZXJ9LCAke0NvZGVHcm91cH0ge1xuICAgICAgICBnYXA6IHZhcigke3Rva2Vucy5jb2RlSXRlbXNHYXB9KTtcbiAgICB9XG5cbiAgICAke0l0ZW1JbnB1dH0ge1xuICAgICAgICBmb250LXNpemU6IHZhcigke3ByaXZhdGVUb2tlbnMuZm9udFNpemV9KTtcbiAgICAgICAgZm9udC1mYW1pbHk6IHZhcigke3Rva2Vucy5mb250RmFtaWx5fSk7XG4gICAgICAgIGZvbnQtc3R5bGU6IHZhcigke3Rva2Vucy5mb250U3R5bGV9KTtcbiAgICAgICAgZm9udC13ZWlnaHQ6IHZhcigke3Rva2Vucy5mb250V2VpZ2h0fSk7XG4gICAgICAgIGxldHRlci1zcGFjaW5nOiB2YXIoJHt0b2tlbnMubGV0dGVyU3BhY2luZ30pO1xuICAgICAgICBsaW5lLWhlaWdodDogdmFyKCR7cHJpdmF0ZVRva2Vucy5saW5lSGVpZ2h0fSk7XG4gICAgICAgIHdpZHRoOiB2YXIoJHtwcml2YXRlVG9rZW5zLml0ZW1XaWR0aH0pO1xuICAgICAgICBoZWlnaHQ6IHZhcigke3ByaXZhdGVUb2tlbnMuaXRlbUhlaWdodH0pO1xuICAgIH1cblxuICAgICR7Q2FwdGlvbldyYXBwZXJ9IHtcbiAgICAgICAgZm9udC1mYW1pbHk6IHZhcigke3Rva2Vucy5jYXB0aW9uRm9udEZhbWlseX0pO1xuICAgICAgICBmb250LXNpemU6IHZhcigke3Rva2Vucy5jYXB0aW9uRm9udFNpemV9KTtcbiAgICAgICAgZm9udC1zdHlsZTogdmFyKCR7dG9rZW5zLmNhcHRpb25Gb250U3R5bGV9KTtcbiAgICAgICAgZm9udC13ZWlnaHQ6IHZhcigke3Rva2Vucy5jYXB0aW9uRm9udFdlaWdodH0pO1xuICAgICAgICBsZXR0ZXItc3BhY2luZzogdmFyKCR7dG9rZW5zLmNhcHRpb25MZXR0ZXJTcGFjaW5nfSk7XG4gICAgICAgIGxpbmUtaGVpZ2h0OiB2YXIoJHt0b2tlbnMuY2FwdGlvbkxpbmVIZWlnaHR9KTtcbiAgICB9XG5gO1xuIl19 */"));
+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= */"));

package/emotion/es/hooks/index.js

@@ -5,4 +5,5 @@ export { useForceUpdate } from "./useForceUpdate";
 export { useDidMountEffect } from "./useDidMountEffect";
 export { useDidMountLayoutEffect } from "./useDidMountLayoutEffect";
 export { useOutsideClick } from "./useOutsideClick";
-export { useIsomorphicLayoutEffect } from "./useIsomorphicLayoutEffect";
+export { useIsomorphicLayoutEffect } from "./useIsomorphicLayoutEffect";
+export { useCodeHook } from "./useCodeHook";

package/emotion/es/hooks/useCodeHook.js

@@ -0,0 +1,26 @@
+import { useEffect } from 'react';
+import { useDidMountEffect } from '.';
+export var useCodeHook = function useCodeHook(_ref) {
+  var inputRefs = _ref.inputRefs,
+    codeLength = _ref.codeLength,
+    disabled = _ref.disabled,
+    autoFocus = _ref.autoFocus,
+    originalValue = _ref.originalValue,
+    getLastActiveIndex = _ref.getLastActiveIndex,
+    handleFullCodeEnter = _ref.handleFullCodeEnter;
+  useEffect(function () {
+    inputRefs.current = inputRefs.current.slice(0, codeLength);
+  }, [codeLength]);
+  useEffect(function () {
+    if (autoFocus && !disabled) {
+      var _inputRefs$current$la;
+      var lastActiveIndex = getLastActiveIndex();
+      (_inputRefs$current$la = inputRefs.current[lastActiveIndex]) === null || _inputRefs$current$la === void 0 || _inputRefs$current$la.focus();
+    }
+  }, [autoFocus]);
+  useDidMountEffect(function () {
+    if (handleFullCodeEnter && originalValue.length === codeLength) {
+      handleFullCodeEnter(originalValue);
+    }
+  }, [originalValue, handleFullCodeEnter]);
+};

package/emotion/es/utils/constants.js

@@ -15,4 +15,10 @@ export var screenGroupBreakpoints = {
   small: '0',
   medium: '35rem',
   large: '60rem'
-};
+};
+export var ONLY_DIGITS_PATTERN = '^\\d+$';
+export var ONLY_CHARS_PATTERN = '^[a-zA-Z]+$';
+export var ONLY_DIGITS_AND_CHARS_PATTERN = '^[a-zA-Z0-9]+$';
+export var FORBIDDEN_KEYS = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Delete', 'Tab'];
+export var BACKSPACE_KEY = 'Backspace';
+export var ANIMATION_TIMEOUT = 300;

package/emotion/es/utils/index.js

@@ -9,6 +9,7 @@ export { createEvent } from "./createEvent";
 import * as _constants from "./constants";
 export { _constants as constants };
 export * from "./getPopoverPlacement";
+export * from "./initialValuesHelper";
 export { noop } from "./noop";
 export { getHeightAsNumber } from "./getHeightAsNumber";
 export { createConditionalComponent } from "./createConditionalComponent";

package/es/components/CodeField/CodeField.js

@@ -1,5 +1,5 @@
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends, defineProperty as _defineProperty, toConsumableArray as _toConsumableArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import React, { forwardRef, useState, useRef, useCallback, useEffect, Fragment } from 'react';
+import React, { forwardRef, useState, useRef, useCallback, Fragment } from 'react';
 import cls from 'classnames';
 import { FORBIDDEN_KEYS, BACKSPACE_KEY, ONLY_DIGITS_PATTERN } from './utils/constants.js';
 import { classes } from './CodeField.tokens.js';
@@ -9,6 +9,7 @@ import { base as base$2 } from './variations/_size/base.js';
 import { base as base$3 } from './variations/_shape/base.js';
 import { base as base$4 } from './variations/_disabled/base.js';
 import { getCodeValue, getPlaceholderValue, getFieldPattern } from './utils/initialValuesHelper.js';
+import { useCodeHook } from '../../hooks/useCodeHook.js';
 import { useDidMountEffect } from '../../hooks/useDidMountEffect.js';
 import { handleCodeError } from './utils/handleCodeError.js';
 import { getSizeValueFromProp } from '../../utils/getSizeValueFromProp.js';
@@ -180,21 +181,15 @@ var codeFieldRoot = function codeFieldRoot(Root) {
         onFullCodeEnter(fullCode);
       }
     }, []);
-    useEffect(function () {
-      inputRefs.current = inputRefs.current.slice(0, codeLength);
-    }, [codeLength]);
-    useEffect(function () {
-      if (autoFocus && !disabled) {
-        var _inputRefs$current$la;
-        var lastActiveIndex = getLastActiveIndex();
-        (_inputRefs$current$la = inputRefs.current[lastActiveIndex]) === null || _inputRefs$current$la === void 0 || _inputRefs$current$la.focus();
-      }
-    }, [autoFocus]);
-    useDidMountEffect(function () {
-      if (handleFullCodeEnter && originalValue.length === codeLength) {
-        handleFullCodeEnter(originalValue);
-      }
-    }, [originalValue, handleFullCodeEnter]);
+    useCodeHook({
+      inputRefs: inputRefs,
+      codeLength: codeLength,
+      disabled: disabled,
+      autoFocus: autoFocus,
+      originalValue: originalValue,
+      getLastActiveIndex: getLastActiveIndex,
+      handleFullCodeEnter: handleFullCodeEnter
+    });
     useDidMountEffect(function () {
       if (isError) {
         handleCodeError({