wlee221

module.exports = {
  chainWebpack: config => {
    config.module
      .rule('vue')
      .use('vue-loader')
      .tap(options => {
        options.compilerOptions = {
          ...(options.compilerOptions || {}),
          isCustomElement: tag => tag.startsWith('amplify-')
        };

wlee221

vueCompilerOptions: {
  isCustomElement: tag => tag.startsWith('amplify-')
}

wlee221

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

wlee221

<AmplifyAuthContainer>
  <AmplifyAuthenticator usernameAlias="email">
    <AmplifySignIn
      slot="sign-in"
      headerText="My Custom Sign In"
      usernameAlias="email"
      formFields={[
        {
          type: 'email',
          label: 'Custom Email Label',

wlee221

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

wlee221

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

wlee221

import { Component, State, Prop, h, Host, Element, forceUpdate } from '@stencil/core';
import {
	AuthState,
	CognitoUserInterface,
	FederatedConfig,
	UsernameAliasStrings,
	AuthStateHandler,
} from '../../common/types/auth-types';
import {
	AUTH_CHANNEL,

wlee221

Machine(
  {
    id: 'signUp',
    initial: "edit",
    exit: ["clearFormValues", "clearError"],
    states: {
      edit: {
        id: "edit",
        initial: "noError",
        type: "parallel",

wlee221

Machine(
  {
    id: 'signUp',
    initial: "edit",
    exit: ["clearFormValues", "clearError"],
    states: {
      edit: {
        on: {
          SUMBIT: "submit"
        }

wlee221

const fetchMachine = Machine({
  id: "signUp",
  initial: "edit",
  type: 'parallel',
  states: {
    validation: {
      initial: 'pending',
      states: {
        pending: {
          invoke: {