How to use the skatejs.withContext function in skatejs

To help you get started, we’ve selected a few skatejs examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github skatejs / skatejs / site / pages / mixins / __samples__ / with-context.js View on Github external
import { withContext } from 'skatejs';

class WithContext extends withContext() {
  context = {
    background: 'white',
    color: 'black',
    margin: '10px 0',
    padding: '10px'
  };
  connectedCallback() {
    this.attachShadow({ mode: 'open' }).innerHTML = `
      
      
        ...and shadow DOM!
      
    `;
  }
}
github skatejs / skatejs / site / pages / mixins / __samples__ / with-context.js View on Github external
background: 'white',
    color: 'black',
    margin: '10px 0',
    padding: '10px'
  };
  connectedCallback() {
    this.attachShadow({ mode: 'open' }).innerHTML = `
      
      
        ...and shadow DOM!
      
    `;
  }
}

class WithContextDescendant extends withContext() {
  connectedCallback() {
    const { background, color, margin, padding } = this.context;
    this.attachShadow({ mode: 'open' }).innerHTML = `
      <style>
        :host {
          background: ${background};
          color: ${color};
          display: block;
          margin: ${margin};
          padding: ${padding};
        }
      </style>
      
    `;
  }
}