How to use tram-one - 4 common examples

const formatDistance = require('date-fns/distance_in_words_to_now');
const Tram = require('tram-one')
const html = Tram.html()

const nl_status = (status) => {
    switch(status) {
        case "IN_TRANSIT_TO":
            return " headed to";
        case "INCOMING_AT":
            return " at ";
        case "STOPPED_AT":
            return " at ";
    }
}

const nl_direction = (direction_id, line_name) => {

    if(line_name === 'Green') {
        return direction_id? 'eastbound' : 'westbound';

const Tram = require('tram-one')
const html = Tram.html({
  'line-status': require('../elements/line-status'),
  'sms-signup': require('../elements/sms-signup'),
  'simple-text': require('../elements/simple-text'),
  'dash-status': require('../elements/dash-status')
})

const colors = {
  'red': '#da291c',
  'orange': '#ed8b00',
  'green': 'green',
  'blue' : '#003da5'
}

module.exports = (store, actions) => {
  if (store.ticker === null) {
    actions.startTicking(30000);

const Tram = require('tram-one')
const html = Tram.html()
module.exports = (store, actions) => {
  return html`<div style="padding: 10px;">
  
    <p>newtrains.today is my small project that's out there to track where the new trains are. That's it (for now). I'm a fan of public transit, and this site could help me (and you) find the new trains in Boston when they're running. More rides = more fun! :-)</p>
    <p>Want to support this site? Thanks, but please instead consider making a donation to the fine folks over at <a href="https://transitmatters.org/" class="has-text-link">TransitMatters</a>.</p>
    <p style="margin-top: 30px;">This site is powered by the MBTA's <a href="https://mbta.com/developers/v3-api" class="has-text-link">public API</a>, and I'm indebted to my friend <a href="http://jrjurman.com/" class="has-text-link">Jesse Jurman</a> who wrote the <a href="http://tram-one.io/" class="has-text-link">Tram-One JavaScript framework</a> which powers it. I'll never stop learning from that guy.</p>

    <p style="margin-top: 30px;">--<a href="https://prestonmueller.com" class="has-text-link">Preston Mueller</a></p><a href="https://prestonmueller.com" class="has-text-link">
  </a></div><a href="https://prestonmueller.com" class="has-text-link">
  `
}
</a>

const Tram = require('tram-one')
const html = Tram.html({
  'line-status-line': require('../elements/line-status-line')
})

module.exports = (attrs) => {  
  return html`
    <div style="width: 100%; min-height: 300px; margin: 15px 5px 15px 5px; ${attrs.style || ''}" class="box">
    <h4 style="color: ${attrs.color}" class="subtitle is-4">${attrs.line} Line - ${attrs.description}</h4>

      
      
    </div>`
}