Added Left/Right Element and Left/Right Addon Props to input control

[ogheneovo12]

usage

  <InputControl
        inputProps={{ type:"email"}}
        name="email"
        label="Email"
        leftChildren={<MailIcon width="30px" height="30px" />}
     />
     
  < InputControl
        inputProps={{ type: revealPassword ? 'text' : 'password', paddingLeft:"38px" }}
        name="password"
        label="password"
        leftChildren={<LockIcon {...iconProps} />}
        rightChildren={
        revealPassword ? (
            <EyeClose onClick={toggleReveal} {...iconProps} />
            ) : (
            <EyeOpen onClick={toggleReveal} {...iconProps} />
            )
         }
      />
      
    <InputControl
          name="website"
          placeholder="mysite"
          leftChildren={'https://'}
          rightChildren={'.com'}
          useAddon={{ left: true, right: true }}
      />
      

so if rightChildren or leftChildren props is passed to InputControl, the children will be rendered by default using the Chakra InputLeftElement or InputRightElement as their parent component, if addon is specified for either left/right via the useAddon props, InputLeftAddon or InputRightAddon will be used based on what was passed to useAddon.

[netlify]

✅ Deploy Preview for gregarious-marshmallow-00a41c ready!

Name	Link
🔨 Latest commit	2a25e5a
🔍 Latest deploy log	https://app.netlify.com/sites/gregarious-marshmallow-00a41c/deploys/62fbda6abe6898000830e45e
😎 Deploy Preview	https://deploy-preview-155--gregarious-marshmallow-00a41c.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[ogheneovo12]

Can't figure out the fix for the netlify error, if someone can assist in the meantime, will have to come back to this after

[ogheneovo12]

hi @thekaganugur