[RAC] inputRef is undefined in Textfield

[mehdibha]

Provide a general summary of the issue here

Textfield is providing an InputContext but when consuming it, the inputRef is undefined
I am consuming it like this

const { ref } = useSlottedContext(InputContext)

const Demo = ()=> {
  return (
    <TextField>
      <Input />
      <Btn />
    </TextField>
}

const Btn = () => {
  const inputCtx = useSlottedContext(InputContext)
  return (
    <Button onPress={()=>{console.log(inputCtx?.ref?.current))>Log</Button>
}

🤔 Expected Behavior?

Expecting to ref to return the actual ref of the Ìnput in the TextField component

😯 Current Behavior

Currently the ref is undefined

💁 Possible Solution

No response

🔦 Context

No response

🖥️ Steps to Reproduce

https://codesandbox.io/p/sandbox/rac-textfield-input-ref-issue-d93cvl

Version

1.2

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

Windows

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

[snowystinger]

It doesn't look like we are sending a ref you'd be able to access in the way you expect anyways. Can I ask more about what you're trying to accomplish? Could you do something along these lines instead?

let CustomContext = createContext({ ref: null });
const Field = (props) => {
  let inputRef = useRef(null);
  return (
    <CustomContext.Provider value={{ ref: inputRef }}>
      <TextField defaultValue="with textfield">
        <Input ref={inputRef} />
        <LogButton />
      </TextField>
    </CustomContext.Provider>
  );
};

const LogButton = (props) => {
  let { ref } = useContext(CustomContext);
  return (
    <Button
      onPress={() => {
        console.log(ref?.current);
      }}
    >
      Log ref
    </Button>
  );
};