Current behavior

// todo.state.ts

@State<string[]>({
  name: 'todo',
  defaults: []
})
export class TodoState {
 ...
}

@State<TodoStateModel>({
  name: 'todos',
  defaults: {
    todo: [],
    pizza: { model: undefined }
  },
  children: [TodoState]
})
export class TodosState {
  ...
}


// app.module.ts

@NgModule({
  imports: [ NgxsModule.forRoot([TodosState, TodoState]) ]
})
export class AppModule {}

Expected behavior

// todo.state.ts

@State<string[]>({
  name: 'todo',
  defaults: []
})
export class TodoState {
 ...
}

@State<TodoStateModel>({
  name: 'todos',
  defaults: {
    todo: [],
    pizza: { model: undefined }
  },
  children: [TodoState], // default -> providedIn: 'ngxsRoot' for TodoState
  providedIn: 'ngxsRoot'
})
export class TodosState {
  ...
}


// app.module.ts

@NgModule({
  imports: [ NgxsModule.forRoot() ]
})
export class AppModule {}

What is the motivation / use case for changing the behavior?

/**
 * Options that can be provided to the store.
 */
export interface StoreOptions<T> {
  /**
   * Name of the state. Required.
   */
  name: string;

  /**
   * Default values for the state. If not provided, uses empty object.
   */
  defaults?: T;

  /**
   * Sub states for the given state.
   */
  children?: any[];

  /**
   * Define states in your root module
   * */
  providedIn?: Type<any> | 'ngxsRoot' | null;
}