react-input-emoji 5.6.11 → 5.7.1

package/dist/index.js

@@ -943,7 +943,7 @@ var _excluded = ["placeholder", "style", "tabIndex", "className", "onChange"];
  * @property {(event: React.ClipboardEvent) => void} onCopy
  * @property {(event: React.ClipboardEvent) => void} onPaste
  * @property {string} placeholder
- * @property {React.CSSProperties} style
+ * @property {{borderRadius?: number; color?: string; borderColor?: string; fontSize?: number; fontFamily?: string; background: string; placeholderColor?: string;}} style
  * @property {number} tabIndex
  * @property {string} className
  * @property {(html: string) => void} onChange
@@ -1030,6 +1030,24 @@ var TextInput = function TextInput(_ref, ref) {
     };
   });
 
+  /** @type {React.CSSProperties} */
+  var placeholderStyle = React.useMemo(function () {
+    var placeholderStyle = {};
+    if (style.placeholderColor) {
+      placeholderStyle.color = style.placeholderColor;
+    }
+    return placeholderStyle;
+  }, [style === null || style === void 0 ? void 0 : style.placeholderColor]);
+
+  /** @type {React.CSSProperties} */
+  var inputStyle = React.useMemo(function () {
+    var inputStyle = {};
+    if (style.color) {
+      inputStyle.color = style.color;
+    }
+    return inputStyle;
+  }, [style === null || style === void 0 ? void 0 : style.color]);
+
   /** @type {React.MutableRefObject<HTMLDivElement | null>} */
   var placeholderRef = React.useRef(null);
   /** @type {React.MutableRefObject<HTMLDivElement | null>} */
@@ -1093,7 +1111,8 @@ var TextInput = function TextInput(_ref, ref) {
     onClick: handleClick
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     ref: placeholderRef,
-    className: "react-input-emoji--placeholder"
+    className: "react-input-emoji--placeholder",
+    style: placeholderStyle
   }, placeholder), /*#__PURE__*/React__default["default"].createElement("div", {
     ref: textInputRef,
     onKeyDown: handleKeyDown,
@@ -1104,7 +1123,8 @@ var TextInput = function TextInput(_ref, ref) {
     onBlur: props.onBlur,
     onCopy: props.onCopy,
     onPaste: props.onPaste,
-    "data-testid": "react-input-emoji--input"
+    "data-testid": "react-input-emoji--input",
+    style: inputStyle
   })));
 };
 var TextInputWithRef = /*#__PURE__*/React.forwardRef(TextInput);
@@ -4497,6 +4517,8 @@ function usePollute() {
  * @property {boolean=} cleanOnEnter
  * @property {(text: string) => void=} onEnter
  * @property {string=} placeholder
+ * @property {string=} placeholderColor
+ * @property {string=} color
  * @property {(size: {width: number, height: number}) => void=} onResize
  * @property {() => void=} onClick
  * @property {() => void=} onFocus
@@ -4513,6 +4535,7 @@ function usePollute() {
  * @property {string=} borderColor
  * @property {number=} fontSize
  * @property {string=} fontFamily
+ * @property {string=} background
  * @property {{id: string; name: string; emojis: {id: string; name: string; keywords: string[], skins: {src: string}[]}}[]=} customEmojis
  * @property {import('./types/types').Languages=} language
  * @property {(text: string) => Promise<MetionUser[]>=} searchMention
@@ -4552,7 +4575,10 @@ function InputEmoji(props, ref) {
     borderRadius = props.borderRadius,
     borderColor = props.borderColor,
     fontSize = props.fontSize,
-    fontFamily = props.fontFamily;
+    fontFamily = props.fontFamily,
+    background = props.background,
+    placeholderColor = props.placeholderColor,
+    color = props.color;
 
   /** @type {React.MutableRefObject<import('./text-input').Ref | null>} */
   var textInputRef = React.useRef(null);
@@ -4721,7 +4747,10 @@ function InputEmoji(props, ref) {
       borderRadius: borderRadius,
       borderColor: borderColor,
       fontSize: fontSize,
-      fontFamily: fontFamily
+      fontFamily: fontFamily,
+      background: background,
+      placeholderColor: placeholderColor,
+      color: color
     },
     tabIndex: tabIndex,
     className: inputClass,
@@ -4746,8 +4775,10 @@ InputEmojiWithRef.defaultProps = {
   placeholder: "Type a message",
   borderRadius: 21,
   borderColor: "#EAEAEA",
+  color: "black",
   fontSize: 15,
   fontFamily: "sans-serif",
+  background: "white",
   tabIndex: 0,
   shouldReturn: false,
   customEmojis: [],