react-pin-input icon indicating copy to clipboard operation
react-pin-input copied to clipboard

PinInput cannot be used as JSX element

Open brunobouwman opened this issue 2 years ago • 2 comments

Everytime I add a new package I get this error regarding the PinInput module. Anyone has got a clue about what could be happening?

brunobouwman avatar Apr 18 '22 19:04 brunobouwman

@brunobouwman Sorry for the delayed response. Can you provide more details on the React version and whether you are using Typescript?

arunghosh avatar Jun 13 '22 11:06 arunghosh

@arunghosh I'm also running into this problem when I re-export a themed PinInput in my private package It throws an error saying the type is invalid image

My bundle

import ReactPinInput from 'react-pin-input';

const MyComp = ()=>{
// my component code
return /* @__PURE__ */ React.createElement(Wrapper$2, {
    currentIndex,
    hasError: error
  }, /* @__PURE__ */ React.createElement(ReactPinInput, {
    type: "numeric",
    length: 4,
    inputMode: "number",
    inputStyle: {
      width: "52px",
      height: "52px",
      borderRadius: "2px",
      margin: "0 16px 0 0",
      fontSize: "36px",
      lineHeight: "40px",
      textAlign: "center",
      border: `1px solid ${error ? theme.colors.errorColor : theme.colors.inputBorderColor}`
    },
    inputFocusStyle: {
      border: `1px solid ${error ? theme.colors.errorColor : theme.colors.activeColor}`
    },
    disabled,
    onChange: setCurrentValue,
    onComplete,
    initialValue: value,
    ref: inputRef,
    focus: true
  }));
}

marklai1998 avatar Jul 26 '22 02:07 marklai1998