How to use the tabris.Page function in tabris

import {Button, Composite, NavigationView, Page, SearchAction, TextView, contentView, device} from 'tabris';

// Create an action on NavigationView to perform a search with dynamic proposals

const PROPOSALS = ['baseball', 'batman', 'battleship', 'bangkok', 'bangladesh', 'banana'];

const navigationView = new NavigationView({
  left: 0, top: 0, right: 0, bottom: 0
}).appendTo(contentView);

const page = new Page({
  title: 'Search action'
}).appendTo(navigationView);

const searchBox = new Composite({
  centerX: 0, centerY: 0
}).appendTo(page);

const textView = new TextView().appendTo(searchBox);

const action = new SearchAction({
  title: 'Search',
  image: {
    src: device.platform === 'iOS' ? 'resources/search-black-24dp@3x.png' : 'resources/search-white-24dp@3x.png',
    scale: 3
  }
}).onSelect(({target}) => target.text = '')

TextInput,
    TextView,
    ToggleButton,
    ProgressBar,
    Video,
    WebView,
    WidgetCollection,
    app,
    App,
    device,
    Device,
    ui,
    UI,
} from "tabris";

var page: Page = new Page();

function test_events() {
  var listener = () => console.log("triggered");
  var widget = new Composite();
  widget.on("foo", listener);
  widget.trigger("foo", "details");
  widget.off("foo", listener);
  widget.off("foo");
  widget.off(null, listener);
  widget.off();
}

function test_Action() {
  var widget: Action = new Action();
  widget.set("foo", 23);
  widget.set({

import {Page, Composite} from 'tabris';

let widget: Page = new Page();
widget.appendTo(new Composite());
widget.insertBefore(new Composite());
widget.insertAfter(new Composite());

/*Expected
(4,
not assignable to parameter
(5,
not assignable to parameter
(6,
not assignable to parameter
*/

function showPopover() {
  const popover = new Popover({width: 300, height: 400, anchor: button})
    .on('close', () => console.log('Popover closed'))
    .open();
  const navigationView = new NavigationView({
    layoutData: {left: 0, right: 0, top: 0, bottom: 0},
    navigationAction: new Action({
      title: 'Close',
      image: {
        src: device.platform === 'iOS' ? 'resources/close-black-24dp@3x.png' : 'resources/close-white-24dp@3x.png',
        scale: 3
      }
    }).on('select', () => popover.close())
  }).appendTo(popover.contentView);
  const page = new Page({title: 'Popover'}).appendTo(navigationView);
  new TextView({centerX: 0, centerY: 0, text: 'Hello popover'}).appendTo(page);
}

_openPluginInfoPage() {
    contentView.find('NavigationView').first().append(
      new Page({title: 'Plugin Info'}).append(
        new WebView({
          left: 0, top: 0, right: 0, bottom: 0,
          url: 'https://www.npmjs.com/package/' + this.pluginId
        })
      )
    );
  }

function createPage(title) {
  const page = new Page({
    title: title || 'Initial Page'
  }).appendTo(navigationView);
  new Button({
    left: 16, top: 16, right: 16,
    text: 'Create another page'
  }).on('select', () => createPage('Page ' + (++pageCount)))
    .appendTo(page);
  new Button({
    left: 16, top: 'prev() 16', right: 16,
    text: 'Go back'
  }).on('select', () => page.dispose())
    .appendTo(page);
  new Button({
    left: 16, top: 'prev() 16', right: 16,
    text: 'Go to initial page'
  }).on('select', () => {

function pageSnippet(parent) {
  dimen(parent, large, medium);
  const navigationView = new NavigationView({
    left: 16, right: 16, top: 16, bottom: 16,
    elevation: 8,
    background: 'white'
  }).appendTo(parent);
  new Page({title: 'Tabris.js'}).appendTo(navigationView).append(new TextView({centerX: 0, centerY: 0, text: 'Page'}));
}

function createPage(navigationView, title) {
  const text = title || 'Page ' + (navigationView.pages().length + 1);
  const page = new Page({
    title: text,
    background: '#eeeeee'
  }).appendTo(navigationView);
  const controls = new Composite({
    centerX: 0, centerY: 0
  }).appendTo(page);
  new TextView({
    centerX: 0,
    text
  }).appendTo(controls);
  new Button({
    top: 'prev() 16', centerX: 0,
    text: 'Add Page'
  }).onSelect(() => createPage(navigationView))
    .appendTo(controls);
  new Button({

function createPage(config: {title: string, icon: string}) {
  const page = new Page({title: config.title});
  page.image = config.icon;
  new Button({
    left: 20, right: 20, top: 20,
    text: 'Create page in drawer'
  }).on('select', () => {
    PAGE_CONFIGS.push({title: 'Another Page', icon: 'resources/page.png'});
    pageSelector.insert(PAGE_CONFIGS.length - 1);
  }).appendTo(page);
  return page;
}

'think it so very much out of the way to hear the Rabbit say to itself, ‘Oh ' +
  'dear! Oh dear! I shall be late!’ (when she thought it over afterwards, it ' +
  'occurred to her that she ought to have wondered at this, but at the time ' +
  'it all seemed quite natural); but when the Rabbit actually took a watch ' +
  'out of its waistcoat-pocket, and looked at it, and then hurried on, Alice ' +
  'started to her feet, for it flashed across her mind that she had never ' +
  'before seen a rabbit with either a waistcoat-pocket, or a watch to take ' +
  'out of it, and burning with curiosity, she ran across the field after it, ' +
  'and fortunately was just in time to see it pop down a large rabbit-hole ' +
  'under the hedge.';

let trayState = 'down';
let trayHeight;
let dragOffset;

const page = new Page({
  title: 'Tray',
  autoDispose: false
});

new TextView({
  left: MARGIN, right: MARGIN, top: MARGIN,
  text: TEXT,
  textColor: '#777'
}).appendTo(page);

const shade = new Composite({
  left: 0, right: 0, top: 0, bottom: 0,
  background: 'black',
  opacity: 0
}).appendTo(page);