How to use the gui.Container function in gui

height: 1000,
          }}
        >
          {ITEMS.map(i =&gt; <label>)}
        
      
      <label> */}
    
  )
}

// Create a window and a root container:
const win = gui.Window.create({})
win.setContentSize({ width: 400, height: 250 })

const contentView = gui.Container.create()
contentView.setStyle({ flexDirection: 'row' })
win.setContentView(contentView)
win.center()
win.activate()

// Create your react elements and render them:
render(, contentView)

// Start your app
if (!process.versions.yode) {
  gui.MessageLoop.run()
  process.exit(0)
}
</label></label>

this.replyEntry.setText('1\n2\n3\n4\n5')
    this.maxReplyEntryHeight = this.replyEntry.getTextBounds().height
    this.replyEntry.setText('')
    this.replyEntry.setStyle({height: this.minReplyEntryHeight})
    // Handle input events.
    this.replyEntry.onTextChange = this._adjustEntryHeight.bind(this)
    this.replyEntry.shouldInsertNewLine = this._handleEnter.bind(this)
    this.replyBox.addChildView(this.replyEntry)

    // Loading indicator.
    this.loadingIndicator = gui.GifPlayer.create()
    this.loadingIndicator.setStyle({width: 40, height: 40})
    const gifPath = fs.realpathSync(path.join(__dirname, 'chat', 'loading@2x.gif'))
    this.loadingIndicator.setImage(gui.Image.createFromPath(gifPath))
    this.loadingIndicator.setAnimating(true)
    this.loadingIndicatorWrapper = gui.Container.create()
    this.loadingIndicatorWrapper.setBackgroundColor(theme.chatBox.backgroundColor)
    this.loadingIndicatorWrapper.addChildView(this.loadingIndicator)
    this.loadingIndicatorWrapper.setVisible(false)
    this.loadingIndicatorWrapper.setStyle({
      flex: 1,
      alignItems: 'center',
      justifyContent: 'center'
    })
    this.view.addChildView(this.loadingIndicatorWrapper)

    mainWindow.window.onFocus = this._notifyDisplaying.bind(this)
    mainWindow.window.onBlur = this._notifyNotDisplaying.bind(this)
  }

this.accountHeader = new AccountHeader()
    this.view.addChildView(this.accountHeader.view)

    this.channelsListScroll = gui.Scroll.create()
    this.channelsListScroll.setStyle({flex: 1})
    if (process.platform === 'win32') {
      // On Windows there is no overlay scrollbar.
      this.channelsListScroll.setScrollbarPolicy('never', 'never')
    } else {
      // Force using overlay scrollbar.
      this.channelsListScroll.setOverlayScrollbar(true)
      this.channelsListScroll.setScrollbarPolicy('never', 'automatic')
    }
    this.view.addChildView(this.channelsListScroll)

    this.channelsList = gui.Container.create()
    this.channelsList.setStyle({paddingBottom: 15})
    this.channelsListScroll.setContentView(this.channelsList)

    this.channelTitle = new ChannelTitle('Channels')
    this.channelTitle.view.setStyle({marginLeft: 10})
    this.channelTitle.view.onMouseUp = () => mainWindow.showAllChannels(this.account)

    this.dmsTitle = new ChannelTitle('Direct Messages')
    this.dmsTitle.view.setStyle({marginTop: 15, marginLeft: 10})
    this.dmsTitle.view.onMouseUp = () => mainWindow.showAllUsers(this.account)
  }

constructor() {
    this.channel = null
    this.channelTitle = ''

    this.view = gui.Container.create()
    this.view.setStyle({height: theme.channelHeader.height})
    this.view.setBackgroundColor(theme.channelHeader.backgroundColor)
    this.view.onDraw = this.draw.bind(this)
  }

constructor(mainWindow) {
    this.mainWindow = mainWindow
    this.channels = []

    this.view = gui.Container.create()
    this.view.setMouseDownCanMoveWindow(false)
    this.view.setBackgroundColor('#FFF')
    this.view.setStyle({flex: 1, padding: 20})

    this.entry = gui.Entry.create()
    this.entry.setStyle({width: '100%', marginBottom: 20})
    this.entry.onTextChange = this.onTextChange.bind(this)
    this.view.addChildView(this.entry)

    this.scroll = gui.Scroll.create()
    this.scroll.setStyle({flex: 1})
    this.scroll.setScrollbarPolicy('never', 'automatic')
    this.contentView = gui.Container.create()
    this.contentView.onDraw = this.draw.bind(this)
    this.scroll.setContentView(this.contentView)
    this.view.addChildView(this.scroll)

constructor() {
    this.window = gui.Window.create({})
    this.window.setTitle(require('../../package.json').build.productName)
    const contentView = gui.Container.create()
    contentView.setStyle({flexDirection: 'row'})
    this.window.setContentView(contentView)
    this.accountsPanel = new AccountsPanel(this)
    contentView.addChildView(this.accountsPanel.view)
    this.channelsPanel = new ChannelsPanel(this)
    contentView.addChildView(this.channelsPanel.view)

    this.chatBox = new ChatBox(this)
    contentView.addChildView(this.chatBox.view)

    this.channelsSearcher = new ChannelsSearcher(this)
    this.channelsSearcher.view.setVisible(false)
    contentView.addChildView(this.channelsSearcher.view)

    this.selectedAccount = null
    this.subscription = {

createRow(contentView) {
    const row = gui.Container.create()
    row.setStyle({flexDirection: 'row', marginBottom: 5})
    contentView.addChildView(row)
    return row
  }

this.channels = []

    this.view = gui.Container.create()
    this.view.setMouseDownCanMoveWindow(false)
    this.view.setBackgroundColor('#FFF')
    this.view.setStyle({flex: 1, padding: 20})

    this.entry = gui.Entry.create()
    this.entry.setStyle({width: '100%', marginBottom: 20})
    this.entry.onTextChange = this.onTextChange.bind(this)
    this.view.addChildView(this.entry)

    this.scroll = gui.Scroll.create()
    this.scroll.setStyle({flex: 1})
    this.scroll.setScrollbarPolicy('never', 'automatic')
    this.contentView = gui.Container.create()
    this.contentView.onDraw = this.draw.bind(this)
    this.scroll.setContentView(this.contentView)
    this.view.addChildView(this.scroll)

    this.hoverItem = null
    this.contentView.onMouseMove = this.onMouse.bind(this)
    this.contentView.onMouseEnter = this.onMouse.bind(this)
    this.contentView.onMouseLeave = this.onMouse.bind(this)
    this.contentView.onMouseUp = this.onClick.bind(this)
  }

this.account = account
    this.active = false
    this.subscription = {
      onUpdateInfo: account.onUpdateInfo.add(this.updateInfo.bind(this)),
      onUpdateChannels: account.onUpdateChannels.add(this.updateChannels.bind(this)),
      onUpdateReadState: account.onUpdateReadState.add(this.update.bind(this)),
    }

    this.image = null
    this.textAttributes = {
      font: gui.Font.create('Helvetica', 35, 'normal', 'normal'),
      color: '#FFF',
      align: 'center',
      valign: 'center',
    }
    this.view = gui.Container.create()
    this.view.setMouseDownCanMoveWindow(false)
    this.view.setStyle({
      marginTop: 14,
      width: 68,
      height: 40,
    })
    this.view.onMouseUp = () => mainWindow.selectAccount(account)
    this.view.onDraw = this.draw.bind(this)

    this.updateInfo()
  }

constructor(mainWindow) {
    this.mainWindow = mainWindow
    this.accountButtons = []

    if (process.platform == 'darwin') {
      this.view = gui.Vibrant.create()
      this.view.setMaterial('dark')
    } else {
      this.view = gui.Container.create()
      this.view.setBackgroundColor(ACCOUNTS_PANEL_BACKGROUND)
    }
    this.view.setStyle({
      flexDirection: 'column',
      width: 68,
      alignItems: 'center',
    })
    this.addButton = this.createAddButton()
    this.view.addChildView(this.addButton)
  }