@momo-kits/calculator-keyboard 0.150.2-beta.2 → 0.150.2-beta.20

package/src/index.tsx

@@ -1,21 +1,35 @@
-import React from 'react';
+import React, { useContext } from 'react';
+import { ApplicationContext, Colors } from '@momo-kits/foundation';
 import {
-  type NativeSyntheticEvent,
-  type TextInputChangeEventData,
-  type TextInputProps,
   type ColorValue,
+  findNodeHandle,
+  type NativeSyntheticEvent,
   processColor,
+  requireNativeComponent,
+  type TextInputProps,
   UIManager,
-  findNodeHandle,
 } from 'react-native';
-import { requireNativeComponent } from 'react-native';
 
 const NAME = 'RCTInputCalculator';
 const NativeInput = requireNativeComponent<any>(NAME);
 
+type KeyPressEvent = { nativeEvent: { key: string } };
+
 interface InputCalculatorProps extends TextInputProps {
   text?: string | undefined;
   keyboardColor?: ColorValue;
+  onKeyPress?: (e: KeyPressEvent) => void;
+  customKeyText?: string | undefined;
+  customKeyBackground?: CustomKeyBackground;
+  customKeyState?: CustomKeyState;
+  onCustomKeyEvent?: () => void;
+}
+
+export type CustomKeyBackground = 'primary' | 'default' | string;
+
+export enum CustomKeyState {
+  Default = 'default',
+  Disable = 'disable',
 }
 
 export type InputCalculatorRef = {
@@ -23,19 +37,44 @@ export type InputCalculatorRef = {
   blur: () => void;
 };
 
-const InputCalculator = React.forwardRef<InputCalculatorRef, InputCalculatorProps>(
-  (props, ref) => {
+const InputCalculator = React.forwardRef<
+  InputCalculatorRef,
+  InputCalculatorProps
+>(
+  (
+    {
+      customKeyBackground = 'default',
+      keyboardColor = '',
+      customKeyText,
+      onKeyPress,
+      customKeyState = CustomKeyState.Default,
+      onCustomKeyEvent,
+      ...props
+    },
+    ref,
+  ) => {
+    const { theme } = useContext(ApplicationContext);
     const nativeRef = React.useRef<any>(null);
 
-    const _onChange = (
-      event: NativeSyntheticEvent<TextInputChangeEventData>
-    ) => {
+    const _onChange = (event: NativeSyntheticEvent<any>) => {
       const currentText = event.nativeEvent.text;
-      props.onChange && props.onChange(event);
-      props.onChangeText && props.onChangeText(currentText);
+      props.onChange?.(event);
+      props.onChangeText?.(currentText);
     };
 
     const text = props.text ?? props.defaultValue ?? '';
+    let keyBackground = Colors.black_06;
+    let textKeyColor = Colors.black_20;
+
+    if (customKeyBackground === 'primary') {
+      keyBackground = theme.colors.primary;
+      textKeyColor = Colors.black_01;
+    }
+
+    if (customKeyState === CustomKeyState.Disable) {
+      keyBackground = theme.colors.background.disable;
+      textKeyColor = Colors.black_01;
+    }
 
     React.useImperativeHandle(ref, () => ({
       focus() {
@@ -61,11 +100,17 @@ const InputCalculator = React.forwardRef<InputCalculatorRef, InputCalculatorProp
         {...props}
         ref={nativeRef}
         onChange={_onChange}
+        onKeyPress={onKeyPress}
         value={text}
-        keybardColor={processColor(props.keyboardColor)}
+        keybardColor={processColor(keyboardColor)}
+        customKeyText={customKeyText}
+        customKeyBackground={keyBackground}
+        customKeyTextColor={textKeyColor}
+        customKeyState={customKeyState}
+        onCustomKeyEvent={onCustomKeyEvent}
       />
     );
-  }
+  },
 );
 
 export default InputCalculator;

package/lib/commonjs/index.js

@@ -1,48 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _reactNative = require("react-native");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const NAME = 'RCTInputCalculator';
-const NativeInput = (0, _reactNative.requireNativeComponent)(NAME);
-const InputCalculator = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
-  const nativeRef = _react.default.useRef(null);
-  const _onChange = event => {
-    const currentText = event.nativeEvent.text;
-    props.onChange && props.onChange(event);
-    props.onChangeText && props.onChangeText(currentText);
-  };
-  const text = props.text ?? props.defaultValue ?? '';
-  _react.default.useImperativeHandle(ref, () => ({
-    focus() {
-      const node = (0, _reactNative.findNodeHandle)(nativeRef.current);
-      if (!node) return;
-      const config = _reactNative.UIManager.getViewManagerConfig(NAME);
-      if (config?.Commands?.focus != null) {
-        _reactNative.UIManager.dispatchViewManagerCommand(node, config.Commands.focus, []);
-      }
-    },
-    blur() {
-      const node = (0, _reactNative.findNodeHandle)(nativeRef.current);
-      if (!node) return;
-      const config = _reactNative.UIManager.getViewManagerConfig(NAME);
-      if (config?.Commands?.blur != null) {
-        _reactNative.UIManager.dispatchViewManagerCommand(node, config.Commands.blur, []);
-      }
-    }
-  }));
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(NativeInput, {
-    ...props,
-    ref: nativeRef,
-    onChange: _onChange,
-    value: text,
-    keybardColor: (0, _reactNative.processColor)(props.keyboardColor)
-  });
-});
-var _default = exports.default = InputCalculator;
-//# sourceMappingURL=index.js.map

package/lib/commonjs/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_jsxRuntime","e","__esModule","default","NAME","NativeInput","requireNativeComponent","InputCalculator","React","forwardRef","props","ref","nativeRef","useRef","_onChange","event","currentText","nativeEvent","text","onChange","onChangeText","defaultValue","useImperativeHandle","focus","node","findNodeHandle","current","config","UIManager","getViewManagerConfig","Commands","dispatchViewManagerCommand","blur","jsx","value","keybardColor","processColor","keyboardColor","_default","exports"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAQsB,IAAAE,WAAA,GAAAF,OAAA;AAAA,SAAAD,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAGtB,MAAMG,IAAI,GAAG,oBAAoB;AACjC,MAAMC,WAAW,GAAG,IAAAC,mCAAsB,EAAMF,IAAI,CAAC;AAYrD,MAAMG,eAAe,gBAAGC,cAAK,CAACC,UAAU,CACtC,CAACC,KAAK,EAAEC,GAAG,KAAK;EACd,MAAMC,SAAS,GAAGJ,cAAK,CAACK,MAAM,CAAM,IAAI,CAAC;EAEzC,MAAMC,SAAS,GACbC,KAAqD,IAClD;IACH,MAAMC,WAAW,GAAGD,KAAK,CAACE,WAAW,CAACC,IAAI;IAC1CR,KAAK,CAACS,QAAQ,IAAIT,KAAK,CAACS,QAAQ,CAACJ,KAAK,CAAC;IACvCL,KAAK,CAACU,YAAY,IAAIV,KAAK,CAACU,YAAY,CAACJ,WAAW,CAAC;EACvD,CAAC;EAED,MAAME,IAAI,GAAGR,KAAK,CAACQ,IAAI,IAAIR,KAAK,CAACW,YAAY,IAAI,EAAE;EAEnDb,cAAK,CAACc,mBAAmB,CAACX,GAAG,EAAE,OAAO;IACpCY,KAAKA,CAAA,EAAG;MACN,MAAMC,IAAI,GAAG,IAAAC,2BAAc,EAACb,SAAS,CAACc,OAAO,CAAC;MAC9C,IAAI,CAACF,IAAI,EAAE;MACX,MAAMG,MAAM,GAAGC,sBAAS,CAACC,oBAAoB,CAACzB,IAAI,CAAC;MACnD,IAAIuB,MAAM,EAAEG,QAAQ,EAAEP,KAAK,IAAI,IAAI,EAAE;QACnCK,sBAAS,CAACG,0BAA0B,CAACP,IAAI,EAAEG,MAAM,CAACG,QAAQ,CAACP,KAAK,EAAE,EAAE,CAAC;MACvE;IACF,CAAC;IACDS,IAAIA,CAAA,EAAG;MACL,MAAMR,IAAI,GAAG,IAAAC,2BAAc,EAACb,SAAS,CAACc,OAAO,CAAC;MAC9C,IAAI,CAACF,IAAI,EAAE;MACX,MAAMG,MAAM,GAAGC,sBAAS,CAACC,oBAAoB,CAACzB,IAAI,CAAC;MACnD,IAAIuB,MAAM,EAAEG,QAAQ,EAAEE,IAAI,IAAI,IAAI,EAAE;QAClCJ,sBAAS,CAACG,0BAA0B,CAACP,IAAI,EAAEG,MAAM,CAACG,QAAQ,CAACE,IAAI,EAAE,EAAE,CAAC;MACtE;IACF;EACF,CAAC,CAAC,CAAC;EAEH,oBACE,IAAAhC,WAAA,CAAAiC,GAAA,EAAC5B,WAAW;IAAA,GACNK,KAAK;IACTC,GAAG,EAAEC,SAAU;IACfO,QAAQ,EAAEL,SAAU;IACpBoB,KAAK,EAAEhB,IAAK;IACZiB,YAAY,EAAE,IAAAC,yBAAY,EAAC1B,KAAK,CAAC2B,aAAa;EAAE,CACjD,CAAC;AAEN,CACF,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAApC,OAAA,GAEaI,eAAe","ignoreList":[]}

package/lib/module/index.js

@@ -1,44 +0,0 @@
-"use strict";
-
-import React from 'react';
-import { processColor, UIManager, findNodeHandle } from 'react-native';
-import { requireNativeComponent } from 'react-native';
-import { jsx as _jsx } from "react/jsx-runtime";
-const NAME = 'RCTInputCalculator';
-const NativeInput = requireNativeComponent(NAME);
-const InputCalculator = /*#__PURE__*/React.forwardRef((props, ref) => {
-  const nativeRef = React.useRef(null);
-  const _onChange = event => {
-    const currentText = event.nativeEvent.text;
-    props.onChange && props.onChange(event);
-    props.onChangeText && props.onChangeText(currentText);
-  };
-  const text = props.text ?? props.defaultValue ?? '';
-  React.useImperativeHandle(ref, () => ({
-    focus() {
-      const node = findNodeHandle(nativeRef.current);
-      if (!node) return;
-      const config = UIManager.getViewManagerConfig(NAME);
-      if (config?.Commands?.focus != null) {
-        UIManager.dispatchViewManagerCommand(node, config.Commands.focus, []);
-      }
-    },
-    blur() {
-      const node = findNodeHandle(nativeRef.current);
-      if (!node) return;
-      const config = UIManager.getViewManagerConfig(NAME);
-      if (config?.Commands?.blur != null) {
-        UIManager.dispatchViewManagerCommand(node, config.Commands.blur, []);
-      }
-    }
-  }));
-  return /*#__PURE__*/_jsx(NativeInput, {
-    ...props,
-    ref: nativeRef,
-    onChange: _onChange,
-    value: text,
-    keybardColor: processColor(props.keyboardColor)
-  });
-});
-export default InputCalculator;
-//# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["React","processColor","UIManager","findNodeHandle","requireNativeComponent","jsx","_jsx","NAME","NativeInput","InputCalculator","forwardRef","props","ref","nativeRef","useRef","_onChange","event","currentText","nativeEvent","text","onChange","onChangeText","defaultValue","useImperativeHandle","focus","node","current","config","getViewManagerConfig","Commands","dispatchViewManagerCommand","blur","value","keybardColor","keyboardColor"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAKEC,YAAY,EACZC,SAAS,EACTC,cAAc,QACT,cAAc;AACrB,SAASC,sBAAsB,QAAQ,cAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEtD,MAAMC,IAAI,GAAG,oBAAoB;AACjC,MAAMC,WAAW,GAAGJ,sBAAsB,CAAMG,IAAI,CAAC;AAYrD,MAAME,eAAe,gBAAGT,KAAK,CAACU,UAAU,CACtC,CAACC,KAAK,EAAEC,GAAG,KAAK;EACd,MAAMC,SAAS,GAAGb,KAAK,CAACc,MAAM,CAAM,IAAI,CAAC;EAEzC,MAAMC,SAAS,GACbC,KAAqD,IAClD;IACH,MAAMC,WAAW,GAAGD,KAAK,CAACE,WAAW,CAACC,IAAI;IAC1CR,KAAK,CAACS,QAAQ,IAAIT,KAAK,CAACS,QAAQ,CAACJ,KAAK,CAAC;IACvCL,KAAK,CAACU,YAAY,IAAIV,KAAK,CAACU,YAAY,CAACJ,WAAW,CAAC;EACvD,CAAC;EAED,MAAME,IAAI,GAAGR,KAAK,CAACQ,IAAI,IAAIR,KAAK,CAACW,YAAY,IAAI,EAAE;EAEnDtB,KAAK,CAACuB,mBAAmB,CAACX,GAAG,EAAE,OAAO;IACpCY,KAAKA,CAAA,EAAG;MACN,MAAMC,IAAI,GAAGtB,cAAc,CAACU,SAAS,CAACa,OAAO,CAAC;MAC9C,IAAI,CAACD,IAAI,EAAE;MACX,MAAME,MAAM,GAAGzB,SAAS,CAAC0B,oBAAoB,CAACrB,IAAI,CAAC;MACnD,IAAIoB,MAAM,EAAEE,QAAQ,EAAEL,KAAK,IAAI,IAAI,EAAE;QACnCtB,SAAS,CAAC4B,0BAA0B,CAACL,IAAI,EAAEE,MAAM,CAACE,QAAQ,CAACL,KAAK,EAAE,EAAE,CAAC;MACvE;IACF,CAAC;IACDO,IAAIA,CAAA,EAAG;MACL,MAAMN,IAAI,GAAGtB,cAAc,CAACU,SAAS,CAACa,OAAO,CAAC;MAC9C,IAAI,CAACD,IAAI,EAAE;MACX,MAAME,MAAM,GAAGzB,SAAS,CAAC0B,oBAAoB,CAACrB,IAAI,CAAC;MACnD,IAAIoB,MAAM,EAAEE,QAAQ,EAAEE,IAAI,IAAI,IAAI,EAAE;QAClC7B,SAAS,CAAC4B,0BAA0B,CAACL,IAAI,EAAEE,MAAM,CAACE,QAAQ,CAACE,IAAI,EAAE,EAAE,CAAC;MACtE;IACF;EACF,CAAC,CAAC,CAAC;EAEH,oBACEzB,IAAA,CAACE,WAAW;IAAA,GACNG,KAAK;IACTC,GAAG,EAAEC,SAAU;IACfO,QAAQ,EAAEL,SAAU;IACpBiB,KAAK,EAAEb,IAAK;IACZc,YAAY,EAAEhC,YAAY,CAACU,KAAK,CAACuB,aAAa;EAAE,CACjD,CAAC;AAEN,CACF,CAAC;AAED,eAAezB,eAAe","ignoreList":[]}

package/lib/typescript/commonjs/package.json

@@ -1 +0,0 @@
-{"type":"commonjs"}

package/lib/typescript/commonjs/src/index.d.ts

@@ -1,13 +0,0 @@
-import React from 'react';
-import { type TextInputProps, type ColorValue } from 'react-native';
-interface InputCalculatorProps extends TextInputProps {
-    text?: string | undefined;
-    keyboardColor?: ColorValue;
-}
-export type InputCalculatorRef = {
-    focus: () => void;
-    blur: () => void;
-};
-declare const InputCalculator: React.ForwardRefExoticComponent<InputCalculatorProps & React.RefAttributes<InputCalculatorRef>>;
-export default InputCalculator;
-//# sourceMappingURL=index.d.ts.map

package/lib/typescript/commonjs/src/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAGL,KAAK,cAAc,EACnB,KAAK,UAAU,EAIhB,MAAM,cAAc,CAAC;AAMtB,UAAU,oBAAqB,SAAQ,cAAc;IACnD,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,aAAa,CAAC,EAAE,UAAU,CAAC;CAC5B;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB,CAAC;AAEF,QAAA,MAAM,eAAe,iGA2CpB,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/lib/typescript/module/package.json

@@ -1 +0,0 @@
-{"type":"module"}

package/lib/typescript/module/src/index.d.ts

@@ -1,13 +0,0 @@
-import React from 'react';
-import { type TextInputProps, type ColorValue } from 'react-native';
-interface InputCalculatorProps extends TextInputProps {
-    text?: string | undefined;
-    keyboardColor?: ColorValue;
-}
-export type InputCalculatorRef = {
-    focus: () => void;
-    blur: () => void;
-};
-declare const InputCalculator: React.ForwardRefExoticComponent<InputCalculatorProps & React.RefAttributes<InputCalculatorRef>>;
-export default InputCalculator;
-//# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/src/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAGL,KAAK,cAAc,EACnB,KAAK,UAAU,EAIhB,MAAM,cAAc,CAAC;AAMtB,UAAU,oBAAqB,SAAQ,cAAc;IACnD,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,aAAa,CAAC,EAAE,UAAU,CAAC;CAC5B;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB,CAAC;AAEF,QAAA,MAAM,eAAe,iGA2CpB,CAAC;AAEF,eAAe,eAAe,CAAC"}