We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. Weβll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Compiled code contain jsx code <Label label='aaaa'/>
jsx
<Label label='aaaa'/>
Typescript version 5.1.0-beta
Playground link with problem code
Playground link with work code
import * as React from 'react'; const Label: React.FC<{ label: string; }> = props => <label>{props.label}</label>; interface BindProps<T = any, K extends keyof T = any> { bObject: T; bKey: K; bLabel?: string | React.ReactNode; } function bind<T, K extends keyof T>(bObject: T, bKey: K, bLabel?: string | React.ReactNode): BindProps<T, K> { return { bObject, bKey, bLabel }; } function withBind<P extends object, V extends keyof P, C extends keyof P>( Component: React.ComponentType<P>, pick: (value: P[V], onChange: (value: P[V]) => void) => Pick<P, V | C> ) { return class extends React.Component<Omit<P, V | C> & BindProps> { private onChange = () => { }; render() { const { bObject, bKey, bLabel, ...rest } = this.props; const props = { ...pick(bObject[bKey], this.onChange), ...rest } as P; const element = <Component {...props} />; if (bLabel === undefined) { return element; } return ( <> {typeof bLabel === 'string' ? <Label label={bLabel} /> : bLabel} {element} </> ); } } } interface TextInputProps { value: string; onChange: React.ChangeEventHandler<HTMLInputElement>; } const TextInput: React.FC<TextInputProps> = props => <input type='text' {...props} />; export const BTextInput = withBind<TextInputProps, 'value', 'onChange'>(TextInput, (value, onChange) => { return { value, onChange: e => onChange(e.currentTarget.value) }; }); const obj = { text: '' }; <BTextInput {...bind(obj, 'text', <Label label='aaaa' />)} />;
React.createElement(exports.BTextInput, Object.assign({}, bind(obj, 'text', <Label label='aaaa'/>)));
React.createElement(exports.BTextInput, Object.assign({}, bind(obj, 'text', React.createElement(Label, { label: 'aaaa' }))));
The text was updated successfully, but these errors were encountered:
Simpler:
// Not transformed const n1 = <div {...<span />} />; // Transformed const n2 = <div {...(() => {})} />;
This is specific to when we need to call Object.assign or __assign to emit the spread. When the emit uses a native JS spread, then we don't see this
Object.assign
__assign
Sorry, something went wrong.
Once merged, can the fix be cherry picked into a 5.1.x release? This seems like a regression currently in 5.1.2-rc.
There's a minor variation of this that's not fixed in 5.1.6 or the latest nightly
<div {...{ prop: <span /> }} />
React.createElement
Fixed the variation in the linked issue/PR
rbuckton
Successfully merging a pull request may close this issue.
Bug Report
Compiled code contain
jsx
code<Label label='aaaa'/>
π Search Terms
π Version & Regression Information
Typescript version 5.1.0-beta
β― Playground Link
Playground link with problem code
Playground link with work code
π» Code
π Actual behavior
π Expected behavior
The text was updated successfully, but these errors were encountered: