Generated by XState Viz: https://xstate.js.org/viz

machine.js

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions
  // - XState (all XState exports)
  
  const fetchMachine = Machine({
  id: "User Permissions Row",
  initial: "inProject",
  context: {
    Role: "Member",
    Create: false,
    Read: true,
    Update: false,
    Share: false,
    inProject: true,
  },
  states: {
    inProject: {
      initial: 'Permissions',
      states: {
        Permissions: {
          type: 'parallel',
          states: {
            Create: {
              initial: 'revoked',
              states: {
                granted: { type: 'final' },
                revoked: { type: 'final' },
              },
              on: {
                TOGGLE: [{
                  target: '.granted',
                  cond: 'isRevoked',
                }, { target: '.revoked' }]
              }
            },
            Read: {
              initial: 'granted',
              states: {
                granted: { type: 'final' },
                revoked: { type: 'final' },
              }
            },
            Update: {
              initial: 'revoked',
              states: {
                granted: { type: 'final' },
                revoked: { type: 'final' },
              },
              on: {
                TOGGLE: [{
                  target: '.granted',
                  cond: 'isRevoked',
                }, { target: '.revoked' }]
              }
            },
            Share: {
              initial: 'revoked',
              states: {
                granted: { type: 'final' },
                revoked: { type: 'final' },
              },
              on: {
                TOGGLE: [{
                  target: '.granted',
                  cond: 'isRevoked',
                }, { target: '.revoked' }]
              }
            },
          },
          on: {
            REMOVE: {
              target: "#User Permissions Row.removed",
              actions: assign({
                inProject: (context, event) => false,
              }),
            },
            SET_LEADER_ROLE: {
              target: [
                '#User Permissions Row.inProject',
                '#User Permissions Row.inProject.Permissions.Create.granted',
                '#User Permissions Row.inProject.Permissions.Update.granted',
                '#User Permissions Row.inProject.Permissions.Share.granted',
                '#User Permissions Row.inProject.checkboxes.Create.disabled',
                '#User Permissions Row.inProject.checkboxes.Update.disabled',
                '#User Permissions Row.inProject.checkboxes.Share.disabled',
              ],
            },
            SET_MEMBER_ROLE: {
              target: [
                '#User Permissions Row.inProject',
                '#User Permissions Row.inProject.Permissions.Create.revoked',
                '#User Permissions Row.inProject.Permissions.Update.revoked',
                '#User Permissions Row.inProject.Permissions.Share.revoked',
                '#User Permissions Row.inProject.checkboxes.Create.enabled',
                '#User Permissions Row.inProject.checkboxes.Update.enabled',
                '#User Permissions Row.inProject.checkboxes.Share.enabled',
              ],
            },
          },
        },
        checkboxes: {
          type: 'parallel',
          states: {
            Create: {
              initial: 'enabled',
              states: {
                enabled: {
                  type: 'final',
                },
                disabled: {
                  type: 'final'
                }
              },
              on: {
                SET_LEADER: {
                  
                }
              }
            },
            Read: {
              initial: 'disabled',
              states: {
                enabled: {
                  type: 'final',
                },
                disabled: {
                  type: 'final'
                }
              }
            },
            Update: {
              initial: 'enabled',
              states: {
                enabled: {
                  type: 'final',
                },
                disabled: {
                  type: 'final'
                }
              }
            },
            Share: {
              initial: 'enabled',
              states: {
                enabled: {
                  type: 'final',
                },
                disabled: {
                  type: 'final'
                }
              }
            },
          },
        },
      },
    },
    removed: {
      type: "final",
    },
  },
  guards: {
    createCheckboxIsEnabled: context => context.isEnabled,
    updateCheckboxIsEnabled: context => context.isEnabled,
    shareCheckboxIsEnabled: context => context.isEnabled,
  }
});