The style focus doesn't work for LmInput in NextJs about tamagui-kitchen-sink HOT 8 CLOSED

I don't know why, but when I tested passing it via props it didn't work, then it worked on the project I'm working on. I must have done something wrong the first time.

from tamagui-kitchen-sink.

Is this on Tamagui core element Input already the case? Then it would be ideal to open a ticket in that repo

from tamagui-kitchen-sink.

Otherwise, did you try adding the props directly within the component?

const specialProps = {
  backgroundColor: 'violet',
  borderColor: 'blue',
  color: 'red',
  focusStyle: {
    backgroundColor: 'green',
    borderColor: 'purple',
    color: 'yellow',
  },
}
<TamaguiInput 
  {...specialProps}
/>

from tamagui-kitchen-sink.

Is this on Tamagui core element Input already the case? Then it would be ideal to open a ticket in that repo

This works in the Input from Tamagui core. The repository I created has an example with Input.

Otherwise, did you try adding the props directly within the component?

const specialProps = {
  backgroundColor: 'violet',
  borderColor: 'blue',
  color: 'red',
  focusStyle: {
    backgroundColor: 'green',
    borderColor: 'purple',
    color: 'yellow',
  },
}
<TamaguiInput 
  {...specialProps}
/>

That didn't work either.

from tamagui-kitchen-sink.

@dohomi Another problem that happened is that I am not able to use styled in the LmInputRhf component

from tamagui-kitchen-sink.

Both components - LmInput and LmInputRhf - are complex components. I don't think styled would be supported unless a refactor will be done, probably with the new context API introduced by Tamagui some weeks ago. I would need to see how to do it but currently won't have the time for it.

from tamagui-kitchen-sink.

Both components - LmInput and LmInputRhf - are complex components. I don't think styled would be supported unless a refactor will be done, probably with the new context API introduced by Tamagui some weeks ago. I would need to see how to do it but currently won't have the time for it.

I understand. Anyway, thank you very much for the help and for the package.

from tamagui-kitchen-sink.

Have a look at this two examples:
https://tamagui-extras.vercel.app/?path=/story/form-input--custom-focus-colors
https://tamagui-extras.vercel.app/?path=/story/form-react-hook-form--form-as-render-function

Both work perfectly fine with component props. Hope this fixes your issue.

from tamagui-kitchen-sink.