vue3 and typescript reactive function change the type of inner object

I am using vue3 and typescript, this is my code:

   const data = reactive({
      bytes : new Uint8Array(),
    })

my confusion is that
when mouse hover on data, its type is:

const data: {
    bytes: {
        [x: number]: number;
        readonly BYTES_PER_ELEMENT: number;
        readonly buffer: {
            readonly byteLength: number;
            slice: (begin: number, end?: number | undefined) => ArrayBuffer;
            readonly [Symbol.toStringTag]: string;
        } | {
            ...;
        };
        ... 30 more ...;
        readonly [Symbol.toStringTag]: "Uint8Array";
    };
}

but when mouse hover on bytes, its type is:

(property) bytes: Uint8Array

is that the reactive function change the type of the bytes? And how can I fix it?