tmlangley

const ResultsMachine = Machine(
	{
		id: 'resultsMachine',
		initial: 'waiting',
		context: {
			responseData: null,
			filterParams: null,
			error: '',
		},
		states: {

tmlangley

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions

tmlangley

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions

tmlangley

const defaultComparison = (context, event) => context.filterData !== event.value;


const createFilterMachine = (id, applyTransformer, compareFn = defaultComparison) => Machine({
	id,
	context: {
		filterData: null,
		valueChanged: false,
	},
	initial: 'idle',

tmlangley

const createFilterMachine = (id, applyTransformer) => Machine({
  id,
  context: {
    filterData: {}
  },
  initial: 'idle',
  states: {
    idle: {
      on: {
        OPEN: 'editing',

tmlangley

const FiltersMachine = Machine({
  id: 'filters',
  initial: 'loading',
  context: {
    results: [],
    filterParams: []
  },
  states: {
    loading: {
      initial: 'fetchingAllFilterOptions',

tmlangley

const ResultsMachine = Machine({
  id: 'resultsMachine',
  initial: 'defaultContent',
  states: {
    defaultContent: {
      on: {
        REFINING_FILTERS: 'loading'
      }
    },
    loading: {

tmlangley

const FiltersMachine = Machine({
  id: 'filters',
  initial: 'loading',
  context: {
    results: [],
    filterParams: []
  },
  states: {
    loading: {
      initial: 'fetchingAllFilterOptions',

tmlangley

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions

tmlangley

link custom UI

myCal = new ButterCal({
	defaultUI: false
});

myCal.linkUI({
	nextMonth: document.querySelector('.next-month'),
	prevMonth: document.querySelector('.prev-month'),