alexvcasillas

const Wrapper = styled.div`
  display: inline-block;
  animation-duration: ${({ duration }) => (duration ? `${duration}s` : '1s')};
  animation-name: ${({ animation }) =>
    animation ? animation : 'no-animation'};
  animation-fill-mode: forwards;
  animation-iteration-count: ${({ iteration }) =>
    iteration ? iteration : '1'};

  &:hover {

alexvcasillas

import React from 'react';
import styled from 'styled-components';
import * as Animations from './animations';

const Wrapper = styled.div`
  pointer-events: none;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;

alexvcasillas

React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely forgot to export your component from the file it's defined in.

alexvcasillas

import { types } from 'mobx-state-tree';

const ItemUI = types.model(
  'ItemUI',
  {
    id: types.identifier(),
    position: types.optional(types.frozen, { x: 0, y: 0 }),
    text: types.string,
    width: types.string,
    height: types.string,

alexvcasillas

import { types } from 'mobx-state-tree';

const UserStore = types
  .model('UserStore', {
    id: types.optional(types.identifier(), 'user-id'),
    name: types.optional(types.string, ''),
    lastName: types.optional(types.string, ''),
    email: types.optional(types.string, '')
  })
  .views(self => ({

alexvcasillas

// CommonChunkPlugin Configuration
new webpack.optimize.CommonsChunkPlugin({
name: 'vendors',
filename: '[hash].vendors.js',
minChunks: function(module, count) {
  // this assumes your vendor imports exist in the node_modules directory
  // and appears at least in two files
  console.log(`Module: ${module.resource} ${count} times`); // DEBUG Purposes
  return (
    module.context &&

alexvcasillas

// USER STORE: user.logIn(...args) will be called within AccessStore action

import { types } from 'mobx-state-tree';

const User = types.model(
  'User',
  {
    key: types.maybe(types.string),
    name: types.optional(types.string, ''),
    lastName: types.optional(types.string, ''),

alexvcasillas

import { types } from 'mobx-state-tree';

// USER MODEL THAT COULD BE USED/IMPORTED ANYWHERE IN THE APP
const User = types.model(
  {
    name: types.string,
    lastName: types.string,
    get fullName(){
      return `${this.name} ${this.lastName}`;
  },

alexvcasillas

// Aditional Non MOBX-STATE-TREE Related Code
...

// Import our Stores Here
import LanguageStore from './stores/language';

const languageStore = LanguageStore.create({});

const store = {
  language: languageStore

alexvcasillas

/**
 * ERROR THROWN
 **/
D:\react-apps\3RMXi\examples\mobx-state-tree-github-repos-demo\node_modules\mobx-state-tree\lib\uti…:14 Uncaught (in promise) Error: [mobx-state-tree] This object has died and is no longer part of a state tree. It cannot be used anymore. The object (of type 'frozen[]') used to live at '/repos'. It is possible to access the last snapshot of this object using 'getSnapshot', or to create a fresh copy using 'clone'. If you want to remove an object from the tree without killing it, use 'detach' instead.
    at invariant (D:\react-apps\3RMXi\examples\mobx-state-tree-github-repos-demo\node_modules\mobx-state-tree\lib\uti…:14)
    at Object.fail (D:\react-apps\3RMXi\examples\mobx-state-tree-github-repos-demo\node_modules\mobx-state-tree\lib\uti…:6)
    at ObservableArray.get (D:\react-apps\3RMXi\examples\mobx-state-tree-github-repos-demo\node_modules\mobx-state-tree\lib\cor…:120)
    at g (D:\react-apps\3RMXi\examples\mobx-state-tree-github-repos-demo\node_modules\mobx-react-devtools\ind…:1)