RangeError: Maximum call stack size exceeded

Whenever I push/set an object GlobalArray(API for YArray) inside another GlobalArray or GlobalMap(API for YMap), I get the following error

RangeError: Maximum call stack size exceeded

      1301 |    * @param {undefined|null|number|bigint|boolean|string|Object<string,any>|Array<any>|Uint8Array} data
      1302 |    */
    > 1303 |   const writeAny = (encoder, data) => {
           |                    ^
      1304 |     switch (typeof data) {
      1305 |       case 'string':
      1306 |         // TYPE 119: STRING

      at writeAny (src/yjs.js:1303:20)
      at writeAny (src/yjs.js:1353:13)
      at writeAny (src/yjs.js:1353:13)
      at writeAny (src/yjs.js:1353:13)
      at writeAny (src/yjs.js:1353:13)

It doesnt happen when I push GlobalMap inside GlobalArray.

GlobalArray simplified

const doc = GLOBALDOC; // One YDoc for all API's
const yArray = doc.getArray(name);

GlobalArray push API

globalArray.push = val => {
    doc.transact(
      () => {
        yArray.push([val]);
      },
      {event: 'push', newValue: val},
    );
  };

GlobalMap simplified

const doc = GLOBALDOC; // One YDoc for all API's
const yMap = doc.getMap(name);

GlobalMap set API simplified

globalMap.set = (key, val) => {
    ymap.set(key, val);
  };```