@draftbit/core 47.5.3-e5bb2e.2 → 47.5.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (79) hide show
  1. package/lib/commonjs/components/MediaPlayer/MediaPlaybackWrapper.js +1 -1
  2. package/lib/commonjs/components/MediaPlayer/VideoPlayer/VideoPlayer.js +1 -1
  3. package/lib/commonjs/components/SectionList/SectionList.js +1 -1
  4. package/lib/commonjs/components/SwipeableItem/SwipeableItem.js +1 -1
  5. package/lib/commonjs/components/TabView/TabView.js +1 -1
  6. package/lib/commonjs/index.js +1 -1
  7. package/lib/commonjs/utilities.js +1 -1
  8. package/lib/typescript/src/components/MediaPlayer/MediaPlaybackWrapper.js +11 -1
  9. package/lib/typescript/src/components/MediaPlayer/MediaPlaybackWrapper.js.map +1 -1
  10. package/lib/typescript/src/components/MediaPlayer/MediaPlayerCommon.d.ts +2 -0
  11. package/lib/typescript/src/components/MediaPlayer/MediaPlayerCommon.js.map +1 -1
  12. package/lib/typescript/src/components/MediaPlayer/VideoPlayer/VideoPlayer.js +3 -1
  13. package/lib/typescript/src/components/MediaPlayer/VideoPlayer/VideoPlayer.js.map +1 -1
  14. package/lib/typescript/src/components/SectionList/SectionList.js +2 -1
  15. package/lib/typescript/src/components/SectionList/SectionList.js.map +1 -1
  16. package/lib/typescript/src/components/SwipeableItem/SwipeableItem.js +5 -4
  17. package/lib/typescript/src/components/SwipeableItem/SwipeableItem.js.map +1 -1
  18. package/lib/typescript/src/components/TabView/TabView.d.ts +1 -0
  19. package/lib/typescript/src/components/TabView/TabView.js +5 -4
  20. package/lib/typescript/src/components/TabView/TabView.js.map +1 -1
  21. package/lib/typescript/src/index.d.ts +0 -1
  22. package/lib/typescript/src/index.js +0 -1
  23. package/lib/typescript/src/index.js.map +1 -1
  24. package/lib/typescript/src/utilities.d.ts +2 -0
  25. package/lib/typescript/src/utilities.js +13 -0
  26. package/lib/typescript/src/utilities.js.map +1 -1
  27. package/lib/typescript/tsconfig.tsbuildinfo +1 -1
  28. package/package.json +3 -4
  29. package/src/components/MediaPlayer/MediaPlaybackWrapper.js +11 -1
  30. package/src/components/MediaPlayer/MediaPlaybackWrapper.js.map +1 -1
  31. package/src/components/MediaPlayer/MediaPlaybackWrapper.tsx +13 -1
  32. package/src/components/MediaPlayer/MediaPlayerCommon.js.map +1 -1
  33. package/src/components/MediaPlayer/MediaPlayerCommon.ts +2 -0
  34. package/src/components/MediaPlayer/VideoPlayer/VideoPlayer.js +3 -1
  35. package/src/components/MediaPlayer/VideoPlayer/VideoPlayer.js.map +1 -1
  36. package/src/components/MediaPlayer/VideoPlayer/VideoPlayer.tsx +2 -0
  37. package/src/components/SectionList/SectionList.js +2 -1
  38. package/src/components/SectionList/SectionList.js.map +1 -1
  39. package/src/components/SectionList/SectionList.tsx +4 -2
  40. package/src/components/SwipeableItem/SwipeableItem.js +5 -4
  41. package/src/components/SwipeableItem/SwipeableItem.js.map +1 -1
  42. package/src/components/SwipeableItem/SwipeableItem.tsx +13 -3
  43. package/src/components/TabView/TabView.js +5 -4
  44. package/src/components/TabView/TabView.js.map +1 -1
  45. package/src/components/TabView/TabView.tsx +14 -4
  46. package/src/index.js +0 -1
  47. package/src/index.js.map +1 -1
  48. package/src/index.tsx +0 -5
  49. package/src/utilities.js +13 -0
  50. package/src/utilities.js.map +1 -1
  51. package/src/utilities.ts +19 -0
  52. package/lib/commonjs/components/CodeInput/CodeInput.js +0 -1
  53. package/lib/commonjs/components/CodeInput/CodeInputCell.js +0 -1
  54. package/lib/commonjs/components/CodeInput/CodeInputText.js +0 -1
  55. package/lib/commonjs/components/CodeInput/index.js +0 -1
  56. package/lib/typescript/src/components/CodeInput/CodeInput.d.ts +0 -18
  57. package/lib/typescript/src/components/CodeInput/CodeInput.js +0 -30
  58. package/lib/typescript/src/components/CodeInput/CodeInput.js.map +0 -1
  59. package/lib/typescript/src/components/CodeInput/CodeInputCell.d.ts +0 -16
  60. package/lib/typescript/src/components/CodeInput/CodeInputCell.js +0 -43
  61. package/lib/typescript/src/components/CodeInput/CodeInputCell.js.map +0 -1
  62. package/lib/typescript/src/components/CodeInput/CodeInputText.d.ts +0 -13
  63. package/lib/typescript/src/components/CodeInput/CodeInputText.js +0 -14
  64. package/lib/typescript/src/components/CodeInput/CodeInputText.js.map +0 -1
  65. package/lib/typescript/src/components/CodeInput/index.d.ts +0 -3
  66. package/lib/typescript/src/components/CodeInput/index.js +0 -4
  67. package/lib/typescript/src/components/CodeInput/index.js.map +0 -1
  68. package/src/components/CodeInput/CodeInput.js +0 -30
  69. package/src/components/CodeInput/CodeInput.js.map +0 -1
  70. package/src/components/CodeInput/CodeInput.tsx +0 -94
  71. package/src/components/CodeInput/CodeInputCell.js +0 -43
  72. package/src/components/CodeInput/CodeInputCell.js.map +0 -1
  73. package/src/components/CodeInput/CodeInputCell.tsx +0 -73
  74. package/src/components/CodeInput/CodeInputText.js +0 -14
  75. package/src/components/CodeInput/CodeInputText.js.map +0 -1
  76. package/src/components/CodeInput/CodeInputText.tsx +0 -37
  77. package/src/components/CodeInput/index.js +0 -4
  78. package/src/components/CodeInput/index.js.map +0 -1
  79. package/src/components/CodeInput/index.tsx +0 -3
@@ -1 +0,0 @@
1
- {"version":3,"file":"CodeInput.js","sourceRoot":"","sources":["../../../../../src/components/CodeInput/CodeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIL,IAAI,GACL,MAAM,cAAc,CAAC;AACtB,OAAO,SAA6B,MAAM,cAAc,CAAC;AACzD,OAAO,EACL,SAAS,EACT,mBAAmB,GACpB,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAiBvD,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAChC,CACE,EACE,WAAW,EACX,SAAS,GAAG,CAAC,EACb,gBAAgB,GAAG,IAAI,EACvB,UAAU,GAAG,IAAI,EACjB,UAAU,EACV,KAAK,EACL,YAAY,EACZ,KAAK,EACL,GAAG,IAAI,EACR,EACD,GAAG,EACH,EAAE;IACF,MAAM,eAAe,GAAG,KAAK,CAAC,MAAM,CAAkB,IAAI,CAAC,CAAC;IAE5D,+DAA+D;IAC/D,MAAM,YAAY,GAAG,GAAG;QACtB,CAAC,CAAE,GAAwC;QAC3C,CAAC,CAAC,eAAe,CAAC;IAEpB,mNAAmN;IACnN,MAAM,CAAC,cAAc,EAAE,eAAe,CAAC,GAAG,mBAAmB,CAAC;QAC5D,KAAK;QACL,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAG,IAAI,CAAC;KACzC,CAAC,CAAC;IAEH,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;;QACnB,IAAI,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,MAAK,SAAS,EAAE;YAC/B,IAAI,UAAU,EAAE;gBACd,MAAA,YAAY,CAAC,OAAO,0CAAE,IAAI,EAAE,CAAC;aAC9B;YACD,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,KAAK,CAAC,CAAC;SACtB;QACD,uDAAuD;IACzD,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,CAAC,CAAC,CAAC;IAEjD,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,YAAY,KACb,CAAC,gBAAgB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,EAC5C,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EAC1B,SAAS,EAAE,KAAK,EAChB,cAAc,EAAE,SAAS,EACzB,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,CAC5C,oBAAC,IAAI,IACH,GAAG,EAAE,KAAK,EACV,QAAQ,EAAE,gBAAgB,CAAC,CAAC,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,EAC/D,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,IAEjB,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAG,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,KAAI,CACxD,oBAAC,oBAAoB,IAAC,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,GAAI,CAClE,CACI,CACR,KACG,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -1,16 +0,0 @@
1
- import React from "react";
2
- import { StyleProp, ViewStyle } from "react-native";
3
- import type { Theme } from "../../styles/DefaultTheme";
4
- interface CodeInputCellProps {
5
- style?: StyleProp<ViewStyle>;
6
- }
7
- declare const CodeInputCell: React.FC<React.PropsWithChildren<CodeInputCellProps>>;
8
- interface DefaultCodeInputCellProps {
9
- cellValue: string;
10
- isFocused: boolean;
11
- theme: Theme;
12
- }
13
- export declare const DefaultCodeInputCell: React.ComponentType<import("@draftbit/react-theme-provider").$Without<DefaultCodeInputCellProps, "theme"> & {
14
- theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;
15
- }> & import("@draftbit/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<DefaultCodeInputCellProps> & (({ cellValue, isFocused, theme }: DefaultCodeInputCellProps) => JSX.Element), {}>;
16
- export default CodeInputCell;
@@ -1,43 +0,0 @@
1
- import React from "react";
2
- import { View, StyleSheet } from "react-native";
3
- import { withTheme } from "../../theming";
4
- import CodeInputText from "./CodeInputText";
5
- const CodeInputCell = ({ style, children, }) => {
6
- return React.createElement(View, { style: [styles.cell, style], children: children });
7
- };
8
- export const DefaultCodeInputCell = withTheme(({ cellValue, isFocused, theme }) => {
9
- return (React.createElement(View, { testID: "default-code-input-cell", style: [
10
- styles.cell,
11
- styles.defaultCellContainer,
12
- {
13
- borderWidth: isFocused ? 2 : 1,
14
- borderColor: isFocused
15
- ? theme.colors.primary
16
- : theme.colors.disabled,
17
- },
18
- ] },
19
- React.createElement(CodeInputText, { style: [
20
- styles.defaultCellText,
21
- {
22
- color: theme.colors.strong,
23
- },
24
- ], isFocused: isFocused }, cellValue)));
25
- });
26
- const styles = StyleSheet.create({
27
- cell: { marginStart: 5, marginEnd: 5 },
28
- defaultCellContainer: {
29
- padding: 5,
30
- backgroundColor: "transparent",
31
- borderRadius: 5,
32
- justifyContent: "center",
33
- alignItems: "center",
34
- aspectRatio: 1,
35
- maxWidth: 70,
36
- maxHeight: 70,
37
- },
38
- defaultCellText: {
39
- fontSize: 25,
40
- },
41
- });
42
- export default CodeInputCell;
43
- //# sourceMappingURL=CodeInputCell.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"CodeInputCell.js","sourceRoot":"","sources":["../../../../../src/components/CodeInput/CodeInputCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAwB,IAAI,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAEtE,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAM5C,MAAM,aAAa,GAA0D,CAAC,EAC5E,KAAK,EACL,QAAQ,GACT,EAAE,EAAE;IACH,OAAO,oBAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAAC;AACnE,CAAC,CAAC;AAQF,MAAM,CAAC,MAAM,oBAAoB,GAAG,SAAS,CAC3C,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,KAAK,EAA6B,EAAE,EAAE;IAC7D,OAAO,CACL,oBAAC,IAAI,IACH,MAAM,EAAC,yBAAyB,EAChC,KAAK,EAAE;YACL,MAAM,CAAC,IAAI;YACX,MAAM,CAAC,oBAAoB;YAC3B;gBACE,WAAW,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;gBAC9B,WAAW,EAAE,SAAS;oBACpB,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO;oBACtB,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ;aAC1B;SACF;QAED,oBAAC,aAAa,IACZ,KAAK,EAAE;gBACL,MAAM,CAAC,eAAe;gBACtB;oBACE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM;iBAC3B;aACF,EACD,SAAS,EAAE,SAAS,IAEnB,SAAS,CACI,CACX,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,IAAI,EAAE,EAAE,WAAW,EAAE,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE;IACtC,oBAAoB,EAAE;QACpB,OAAO,EAAE,CAAC;QACV,eAAe,EAAE,aAAa;QAC9B,YAAY,EAAE,CAAC;QACf,cAAc,EAAE,QAAQ;QACxB,UAAU,EAAE,QAAQ;QACpB,WAAW,EAAE,CAAC;QACd,QAAQ,EAAE,EAAE;QACZ,SAAS,EAAE,EAAE;KACd;IACD,eAAe,EAAE;QACf,QAAQ,EAAE,EAAE;KACb;CACF,CAAC,CAAC;AAEH,eAAe,aAAa,CAAC"}
@@ -1,13 +0,0 @@
1
- import React from "react";
2
- import { TextProps } from "react-native";
3
- import type { Theme } from "../../styles/DefaultTheme";
4
- interface CodeInputTextProps extends TextProps {
5
- cursorBlinkDuration?: number;
6
- cursorText?: string;
7
- isFocused?: boolean;
8
- theme: Theme;
9
- }
10
- declare const _default: React.ComponentType<import("@draftbit/react-theme-provider").$Without<CodeInputTextProps, "theme"> & {
11
- theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;
12
- }> & import("@draftbit/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<CodeInputTextProps> & React.FC<CodeInputTextProps>, {}>;
13
- export default _default;
@@ -1,14 +0,0 @@
1
- import React from "react";
2
- import { Text } from "react-native";
3
- import { withTheme } from "../../theming";
4
- import { Cursor } from "react-native-confirmation-code-field";
5
- /**
6
- * Text component that can conditionally render a blinking cursor when focused and empty
7
- * Meant to be used within a CodeInputCell component
8
- */
9
- const CodeInputText = ({ isFocused, cursorBlinkDuration, cursorText, style, theme, children, ...rest }) => {
10
- return (React.createElement(Text, { style: [{ color: theme.colors.strong }, style], ...rest }, children ||
11
- (isFocused ? (React.createElement(Cursor, { cursorSymbol: cursorText, delay: cursorBlinkDuration })) : null)));
12
- };
13
- export default withTheme(CodeInputText);
14
- //# sourceMappingURL=CodeInputText.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"CodeInputText.js","sourceRoot":"","sources":["../../../../../src/components/CodeInput/CodeInputText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAa,MAAM,cAAc,CAAC;AAE/C,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAS9D;;;GAGG;AACH,MAAM,aAAa,GAAiC,CAAC,EACnD,SAAS,EACT,mBAAmB,EACnB,UAAU,EACV,KAAK,EACL,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,EAAE;IACH,OAAO,CACL,oBAAC,IAAI,IAAC,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,KAAK,CAAC,KAAM,IAAI,IAC3D,QAAQ;QACP,CAAC,SAAS,CAAC,CAAC,CAAC,CACX,oBAAC,MAAM,IAAC,YAAY,EAAE,UAAU,EAAE,KAAK,EAAE,mBAAmB,GAAI,CACjE,CAAC,CAAC,CAAC,IAAI,CAAC,CACN,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC,aAAa,CAAC,CAAC"}
@@ -1,3 +0,0 @@
1
- export { default as CodeInput } from "./CodeInput";
2
- export { default as CodeInputCell } from "./CodeInputCell";
3
- export { default as CodeInputText } from "./CodeInputText";
@@ -1,4 +0,0 @@
1
- export { default as CodeInput } from "./CodeInput";
2
- export { default as CodeInputCell } from "./CodeInputCell";
3
- export { default as CodeInputText } from "./CodeInputText";
4
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/CodeInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC"}
@@ -1,30 +0,0 @@
1
- import React from "react";
2
- import { View, } from "react-native";
3
- import TextInput from "../TextInput";
4
- import { CodeField, useClearByFocusCell, } from "react-native-confirmation-code-field";
5
- import { DefaultCodeInputCell } from "./CodeInputCell";
6
- const CodeInput = React.forwardRef(({ onInputFull, cellCount = 4, clearOnCellFocus = true, blurOnFull = true, renderItem, value, onChangeText, style, ...rest }, ref) => {
7
- const newCodeInputRef = React.useRef(null);
8
- // Use the provided ref or default to new ref when not provided
9
- const codeInputRef = ref
10
- ? ref
11
- : newCodeInputRef;
12
- // Clears input of a cell when focused, configured as explained here (https://github.com/retyui/react-native-confirmation-code-field/blob/master/API.md#useclearbyfocuscellvalue-string-setvalue-text-string--void)
13
- const [codeFieldProps, getCellOnLayout] = useClearByFocusCell({
14
- value,
15
- setValue: (text) => onChangeText === null || onChangeText === void 0 ? void 0 : onChangeText(text),
16
- });
17
- React.useEffect(() => {
18
- var _a;
19
- if ((value === null || value === void 0 ? void 0 : value.length) === cellCount) {
20
- if (blurOnFull) {
21
- (_a = codeInputRef.current) === null || _a === void 0 ? void 0 : _a.blur();
22
- }
23
- onInputFull === null || onInputFull === void 0 ? void 0 : onInputFull(value);
24
- }
25
- // eslint-disable-next-line react-hooks/exhaustive-deps
26
- }, [value, cellCount, blurOnFull, codeInputRef]);
27
- return (React.createElement(CodeField, { ref: codeInputRef, ...(clearOnCellFocus ? codeFieldProps : {}), value: value, onChangeText: onChangeText, rootStyle: style, InputComponent: TextInput, cellCount: cellCount, renderCell: ({ symbol, index, isFocused }) => (React.createElement(View, { key: index, onLayout: clearOnCellFocus ? getCellOnLayout(index) : undefined, style: { flex: 1 } }, (renderItem === null || renderItem === void 0 ? void 0 : renderItem({ cellValue: symbol, index, isFocused })) || (React.createElement(DefaultCodeInputCell, { cellValue: symbol, isFocused: isFocused })))), ...rest }));
28
- });
29
- export default CodeInput;
30
- //# sourceMappingURL=CodeInput.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"CodeInput.js","sourceRoot":"","sources":["CodeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIL,IAAI,GACL,MAAM,cAAc,CAAC;AACtB,OAAO,SAA6B,MAAM,cAAc,CAAC;AACzD,OAAO,EACL,SAAS,EACT,mBAAmB,GACpB,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAiBvD,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAChC,CACE,EACE,WAAW,EACX,SAAS,GAAG,CAAC,EACb,gBAAgB,GAAG,IAAI,EACvB,UAAU,GAAG,IAAI,EACjB,UAAU,EACV,KAAK,EACL,YAAY,EACZ,KAAK,EACL,GAAG,IAAI,EACR,EACD,GAAG,EACH,EAAE;IACF,MAAM,eAAe,GAAG,KAAK,CAAC,MAAM,CAAkB,IAAI,CAAC,CAAC;IAE5D,+DAA+D;IAC/D,MAAM,YAAY,GAAG,GAAG;QACtB,CAAC,CAAE,GAAwC;QAC3C,CAAC,CAAC,eAAe,CAAC;IAEpB,mNAAmN;IACnN,MAAM,CAAC,cAAc,EAAE,eAAe,CAAC,GAAG,mBAAmB,CAAC;QAC5D,KAAK;QACL,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAG,IAAI,CAAC;KACzC,CAAC,CAAC;IAEH,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;;QACnB,IAAI,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,MAAK,SAAS,EAAE;YAC/B,IAAI,UAAU,EAAE;gBACd,MAAA,YAAY,CAAC,OAAO,0CAAE,IAAI,EAAE,CAAC;aAC9B;YACD,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,KAAK,CAAC,CAAC;SACtB;QACD,uDAAuD;IACzD,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,CAAC,CAAC,CAAC;IAEjD,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,YAAY,KACb,CAAC,gBAAgB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,EAC5C,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EAC1B,SAAS,EAAE,KAAK,EAChB,cAAc,EAAE,SAAS,EACzB,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,CAC5C,oBAAC,IAAI,IACH,GAAG,EAAE,KAAK,EACV,QAAQ,EAAE,gBAAgB,CAAC,CAAC,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,EAC/D,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,IAEjB,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAG,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,KAAI,CACxD,oBAAC,oBAAoB,IAAC,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,GAAI,CAClE,CACI,CACR,KACG,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -1,94 +0,0 @@
1
- import React from "react";
2
- import {
3
- StyleProp,
4
- ViewStyle,
5
- TextInput as NativeTextInput,
6
- View,
7
- } from "react-native";
8
- import TextInput, { TextInputProps } from "../TextInput";
9
- import {
10
- CodeField,
11
- useClearByFocusCell,
12
- } from "react-native-confirmation-code-field";
13
- import { DefaultCodeInputCell } from "./CodeInputCell";
14
-
15
- interface CellItem {
16
- cellValue: string;
17
- index: number;
18
- isFocused: boolean;
19
- }
20
-
21
- interface CodeInputProps extends TextInputProps {
22
- onInputFull?: (value: string) => void;
23
- cellCount?: number;
24
- clearOnCellFocus?: boolean;
25
- blurOnFull?: boolean;
26
- renderItem?: ({ cellValue, index, isFocused }: CellItem) => JSX.Element;
27
- style?: StyleProp<ViewStyle>;
28
- }
29
-
30
- const CodeInput = React.forwardRef<NativeTextInput, CodeInputProps>(
31
- (
32
- {
33
- onInputFull,
34
- cellCount = 4,
35
- clearOnCellFocus = true,
36
- blurOnFull = true,
37
- renderItem,
38
- value,
39
- onChangeText,
40
- style,
41
- ...rest
42
- },
43
- ref
44
- ) => {
45
- const newCodeInputRef = React.useRef<NativeTextInput>(null);
46
-
47
- // Use the provided ref or default to new ref when not provided
48
- const codeInputRef = ref
49
- ? (ref as React.RefObject<NativeTextInput>)
50
- : newCodeInputRef;
51
-
52
- // Clears input of a cell when focused, configured as explained here (https://github.com/retyui/react-native-confirmation-code-field/blob/master/API.md#useclearbyfocuscellvalue-string-setvalue-text-string--void)
53
- const [codeFieldProps, getCellOnLayout] = useClearByFocusCell({
54
- value,
55
- setValue: (text) => onChangeText?.(text),
56
- });
57
-
58
- React.useEffect(() => {
59
- if (value?.length === cellCount) {
60
- if (blurOnFull) {
61
- codeInputRef.current?.blur();
62
- }
63
- onInputFull?.(value);
64
- }
65
- // eslint-disable-next-line react-hooks/exhaustive-deps
66
- }, [value, cellCount, blurOnFull, codeInputRef]);
67
-
68
- return (
69
- <CodeField
70
- ref={codeInputRef}
71
- {...(clearOnCellFocus ? codeFieldProps : {})}
72
- value={value}
73
- onChangeText={onChangeText}
74
- rootStyle={style}
75
- InputComponent={TextInput}
76
- cellCount={cellCount}
77
- renderCell={({ symbol, index, isFocused }) => (
78
- <View
79
- key={index}
80
- onLayout={clearOnCellFocus ? getCellOnLayout(index) : undefined}
81
- style={{ flex: 1 }}
82
- >
83
- {renderItem?.({ cellValue: symbol, index, isFocused }) || (
84
- <DefaultCodeInputCell cellValue={symbol} isFocused={isFocused} />
85
- )}
86
- </View>
87
- )}
88
- {...rest}
89
- />
90
- );
91
- }
92
- );
93
-
94
- export default CodeInput;
@@ -1,43 +0,0 @@
1
- import React from "react";
2
- import { View, StyleSheet } from "react-native";
3
- import { withTheme } from "../../theming";
4
- import CodeInputText from "./CodeInputText";
5
- const CodeInputCell = ({ style, children, }) => {
6
- return React.createElement(View, { style: [styles.cell, style], children: children });
7
- };
8
- export const DefaultCodeInputCell = withTheme(({ cellValue, isFocused, theme }) => {
9
- return (React.createElement(View, { testID: "default-code-input-cell", style: [
10
- styles.cell,
11
- styles.defaultCellContainer,
12
- {
13
- borderWidth: isFocused ? 2 : 1,
14
- borderColor: isFocused
15
- ? theme.colors.primary
16
- : theme.colors.disabled,
17
- },
18
- ] },
19
- React.createElement(CodeInputText, { style: [
20
- styles.defaultCellText,
21
- {
22
- color: theme.colors.strong,
23
- },
24
- ], isFocused: isFocused }, cellValue)));
25
- });
26
- const styles = StyleSheet.create({
27
- cell: { marginStart: 5, marginEnd: 5 },
28
- defaultCellContainer: {
29
- padding: 5,
30
- backgroundColor: "transparent",
31
- borderRadius: 5,
32
- justifyContent: "center",
33
- alignItems: "center",
34
- aspectRatio: 1,
35
- maxWidth: 70,
36
- maxHeight: 70,
37
- },
38
- defaultCellText: {
39
- fontSize: 25,
40
- },
41
- });
42
- export default CodeInputCell;
43
- //# sourceMappingURL=CodeInputCell.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"CodeInputCell.js","sourceRoot":"","sources":["CodeInputCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAwB,IAAI,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAEtE,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAM5C,MAAM,aAAa,GAA0D,CAAC,EAC5E,KAAK,EACL,QAAQ,GACT,EAAE,EAAE;IACH,OAAO,oBAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAAC;AACnE,CAAC,CAAC;AAQF,MAAM,CAAC,MAAM,oBAAoB,GAAG,SAAS,CAC3C,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,KAAK,EAA6B,EAAE,EAAE;IAC7D,OAAO,CACL,oBAAC,IAAI,IACH,MAAM,EAAC,yBAAyB,EAChC,KAAK,EAAE;YACL,MAAM,CAAC,IAAI;YACX,MAAM,CAAC,oBAAoB;YAC3B;gBACE,WAAW,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;gBAC9B,WAAW,EAAE,SAAS;oBACpB,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO;oBACtB,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ;aAC1B;SACF;QAED,oBAAC,aAAa,IACZ,KAAK,EAAE;gBACL,MAAM,CAAC,eAAe;gBACtB;oBACE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM;iBAC3B;aACF,EACD,SAAS,EAAE,SAAS,IAEnB,SAAS,CACI,CACX,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,IAAI,EAAE,EAAE,WAAW,EAAE,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE;IACtC,oBAAoB,EAAE;QACpB,OAAO,EAAE,CAAC;QACV,eAAe,EAAE,aAAa;QAC9B,YAAY,EAAE,CAAC;QACf,cAAc,EAAE,QAAQ;QACxB,UAAU,EAAE,QAAQ;QACpB,WAAW,EAAE,CAAC;QACd,QAAQ,EAAE,EAAE;QACZ,SAAS,EAAE,EAAE;KACd;IACD,eAAe,EAAE;QACf,QAAQ,EAAE,EAAE;KACb;CACF,CAAC,CAAC;AAEH,eAAe,aAAa,CAAC"}
@@ -1,73 +0,0 @@
1
- import React from "react";
2
- import { StyleProp, ViewStyle, View, StyleSheet } from "react-native";
3
- import type { Theme } from "../../styles/DefaultTheme";
4
- import { withTheme } from "../../theming";
5
- import CodeInputText from "./CodeInputText";
6
-
7
- interface CodeInputCellProps {
8
- style?: StyleProp<ViewStyle>;
9
- }
10
-
11
- const CodeInputCell: React.FC<React.PropsWithChildren<CodeInputCellProps>> = ({
12
- style,
13
- children,
14
- }) => {
15
- return <View style={[styles.cell, style]} children={children} />;
16
- };
17
-
18
- interface DefaultCodeInputCellProps {
19
- cellValue: string;
20
- isFocused: boolean;
21
- theme: Theme;
22
- }
23
-
24
- export const DefaultCodeInputCell = withTheme(
25
- ({ cellValue, isFocused, theme }: DefaultCodeInputCellProps) => {
26
- return (
27
- <View
28
- testID="default-code-input-cell"
29
- style={[
30
- styles.cell,
31
- styles.defaultCellContainer,
32
- {
33
- borderWidth: isFocused ? 2 : 1,
34
- borderColor: isFocused
35
- ? theme.colors.primary
36
- : theme.colors.disabled,
37
- },
38
- ]}
39
- >
40
- <CodeInputText
41
- style={[
42
- styles.defaultCellText,
43
- {
44
- color: theme.colors.strong,
45
- },
46
- ]}
47
- isFocused={isFocused}
48
- >
49
- {cellValue}
50
- </CodeInputText>
51
- </View>
52
- );
53
- }
54
- );
55
-
56
- const styles = StyleSheet.create({
57
- cell: { marginStart: 5, marginEnd: 5 },
58
- defaultCellContainer: {
59
- padding: 5,
60
- backgroundColor: "transparent",
61
- borderRadius: 5,
62
- justifyContent: "center",
63
- alignItems: "center",
64
- aspectRatio: 1,
65
- maxWidth: 70,
66
- maxHeight: 70,
67
- },
68
- defaultCellText: {
69
- fontSize: 25,
70
- },
71
- });
72
-
73
- export default CodeInputCell;
@@ -1,14 +0,0 @@
1
- import React from "react";
2
- import { Text } from "react-native";
3
- import { withTheme } from "../../theming";
4
- import { Cursor } from "react-native-confirmation-code-field";
5
- /**
6
- * Text component that can conditionally render a blinking cursor when focused and empty
7
- * Meant to be used within a CodeInputCell component
8
- */
9
- const CodeInputText = ({ isFocused, cursorBlinkDuration, cursorText, style, theme, children, ...rest }) => {
10
- return (React.createElement(Text, { style: [{ color: theme.colors.strong }, style], ...rest }, children ||
11
- (isFocused ? (React.createElement(Cursor, { cursorSymbol: cursorText, delay: cursorBlinkDuration })) : null)));
12
- };
13
- export default withTheme(CodeInputText);
14
- //# sourceMappingURL=CodeInputText.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"CodeInputText.js","sourceRoot":"","sources":["CodeInputText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAa,MAAM,cAAc,CAAC;AAE/C,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAS9D;;;GAGG;AACH,MAAM,aAAa,GAAiC,CAAC,EACnD,SAAS,EACT,mBAAmB,EACnB,UAAU,EACV,KAAK,EACL,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,EAAE;IACH,OAAO,CACL,oBAAC,IAAI,IAAC,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,KAAK,CAAC,KAAM,IAAI,IAC3D,QAAQ;QACP,CAAC,SAAS,CAAC,CAAC,CAAC,CACX,oBAAC,MAAM,IAAC,YAAY,EAAE,UAAU,EAAE,KAAK,EAAE,mBAAmB,GAAI,CACjE,CAAC,CAAC,CAAC,IAAI,CAAC,CACN,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC,aAAa,CAAC,CAAC"}
@@ -1,37 +0,0 @@
1
- import React from "react";
2
- import { Text, TextProps } from "react-native";
3
- import type { Theme } from "../../styles/DefaultTheme";
4
- import { withTheme } from "../../theming";
5
- import { Cursor } from "react-native-confirmation-code-field";
6
-
7
- interface CodeInputTextProps extends TextProps {
8
- cursorBlinkDuration?: number;
9
- cursorText?: string;
10
- isFocused?: boolean;
11
- theme: Theme;
12
- }
13
-
14
- /**
15
- * Text component that can conditionally render a blinking cursor when focused and empty
16
- * Meant to be used within a CodeInputCell component
17
- */
18
- const CodeInputText: React.FC<CodeInputTextProps> = ({
19
- isFocused,
20
- cursorBlinkDuration,
21
- cursorText,
22
- style,
23
- theme,
24
- children,
25
- ...rest
26
- }) => {
27
- return (
28
- <Text style={[{ color: theme.colors.strong }, style]} {...rest}>
29
- {children ||
30
- (isFocused ? (
31
- <Cursor cursorSymbol={cursorText} delay={cursorBlinkDuration} />
32
- ) : null)}
33
- </Text>
34
- );
35
- };
36
-
37
- export default withTheme(CodeInputText);
@@ -1,4 +0,0 @@
1
- export { default as CodeInput } from "./CodeInput";
2
- export { default as CodeInputCell } from "./CodeInputCell";
3
- export { default as CodeInputText } from "./CodeInputText";
4
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC"}
@@ -1,3 +0,0 @@
1
- export { default as CodeInput } from "./CodeInput";
2
- export { default as CodeInputCell } from "./CodeInputCell";
3
- export { default as CodeInputText } from "./CodeInputText";