Como implementar a transição dos widgets ao layout móvel

Ao inicializar o widget, você poderá especificar qual versão deve ser usada por padrão. Para fazer isso, use o parâmetro isMobile do método window.metaframe.create.

Para trocar entre os layouts móvel e desktop do Metaframe dependendo da resolução da tela do dispositivo, use o método window.metaframe.setIsMobile.

Exemplo de código para trocar ao layout móvel do Metaframe com resoluções de tela de 1.000 px ou menos:

const mediaQuery = window.matchMedia("(max-width: 1000px)");

function handleMetaframeLayoutChange(e) {
 window.metaframe.setIsMobile(e.matches);
}

handleMetaframeLayoutChange(mediaQuery);
mediaQuery.addEventListener('change', handleMetaframeLayoutChange)