I have a requirement where I need to disable the predictive suggestions and autocorrect of the iPad keyboard.

The image is for show purpose, not an actual image from my project, but need to hide the same highlighted suggestion bar, I am using an inputBase of material UI to type over SVG

Tried with all the solutions available like autoCorrect='off' autoComplete='off' autoCapitalize='off' & spellCheck = 'false'.

Please let me know if there's any way to hide the suggestions bar other than on the client side.

 <InputBase
            classes={{
              root: classes.inputRoot,
              input: classes.input,
            }}
            type="text"
            autoFocus
            value={title}
            inputProps={{
              maxLength: 50,
              spellCheck: 'false',
              'data-gramm': false,
              autoCapitalize: 'false',
              autoCorrect: 'false',
            }}
            onChange={
              (event: React
                .ChangeEvent<HTMLInputElement>) => setTitle(
                event.target.value,
              )
            }
            autoComplete="off"
            spellCheck="false"
            autoCorrect="off"
            autoCapitalize="off"
          />