// Local-state input that doesn't lose focus even if parent rerenders mid-typing.
// Syncs to parent on every change, but reads its own value from local state.
function LocalInput({ value, onChange, style, ...rest }) {
  const [v, setV] = React.useState(value || '');
  const lastExternal = React.useRef(value);
  React.useEffect(() => {
    // Only sync from outside if external value actually changed (e.g. switching offer)
    if (value !== lastExternal.current) {
      setV(value || '');
      lastExternal.current = value;
    }
  }, [value]);
  return (
    <input
      value={v}
      onChange={e => {
        const nv = e.target.value;
        setV(nv);
        lastExternal.current = nv;
        onChange(nv);
      }}
      style={style}
      {...rest}
    />
  );
}
function LocalTextarea({ value, onChange, style, ...rest }) {
  const [v, setV] = React.useState(value || '');
  const lastExternal = React.useRef(value);
  React.useEffect(() => {
    if (value !== lastExternal.current) {
      setV(value || '');
      lastExternal.current = value;
    }
  }, [value]);
  return (
    <textarea
      value={v}
      onChange={e => {
        const nv = e.target.value;
        setV(nv);
        lastExternal.current = nv;
        onChange(nv);
      }}
      style={style}
      {...rest}
    />
  );
}
window.LocalInput = LocalInput;
window.LocalTextarea = LocalTextarea;