cruddle - npm Package Compare versions

Comparing version 0.4.0 to 0.5.0

CHANGELOG.md

@@ -0,1 +1,9 @@
+# 0.5.0
+
+* Fix missing decorators
+* Add list modes
+* Add `plural` and `singular` to the `BaseDefinition` interface
+* Move all list sub-states into a new `ListState` interface, which is passed around
+  instead of the sub-states
+
 # 0.3.0
@@ -2,0 +10,0 @@

dist/components/delete.js

 "use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
 var core_1 = require("@angular/core");
@@ -30,21 +21,16 @@ /**
 }());
-__decorate([
-    core_1.Input(),
-    __metadata("design:type", Object)
-], DeleteComponent.prototype, "def", void 0);
-__decorate([
-    core_1.Input(),
-    __metadata("design:type", Object)
-], DeleteComponent.prototype, "data", void 0);
-__decorate([
-    core_1.Output(),
-    __metadata("design:type", Object)
-], DeleteComponent.prototype, "error", void 0);
-DeleteComponent = __decorate([
-    core_1.Component({
-        selector: 'cruddle-delete',
-        template: "\n    <div class=\"cruddle-delete\">\n      <ng-content></ng-content>\n    </div>\n  "
-    })
-], DeleteComponent);
+DeleteComponent.decorators = [
+    { type: core_1.Component, args: [{
+                selector: 'cruddle-delete',
+                template: "\n    <div class=\"cruddle-delete\">\n      <ng-content></ng-content>\n    </div>\n  "
+            },] },
+];
+/** @nocollapse */
+DeleteComponent.ctorParameters = function () { return []; };
+DeleteComponent.propDecorators = {
+    'def': [{ type: core_1.Input },],
+    'data': [{ type: core_1.Input },],
+    'error': [{ type: core_1.Output },],
+};
 exports.DeleteComponent = DeleteComponent;
 //# sourceMappingURL=delete.js.map

dist/components/form.js

 "use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
 var core_1 = require("@angular/core");
@@ -33,21 +24,16 @@ /**
 }());
-__decorate([
-    core_1.Input(),
-    __metadata("design:type", Object)
-], FormComponent.prototype, "def", void 0);
-__decorate([
-    core_1.Input(),
-    __metadata("design:type", Object)
-], FormComponent.prototype, "data", void 0);
-__decorate([
-    core_1.Output(),
-    __metadata("design:type", Object)
-], FormComponent.prototype, "error", void 0);
-FormComponent = __decorate([
-    core_1.Component({
-        selector: 'cruddle-form',
-        template: "\n    <div class=\"cruddle-form\">\n      <ng-content></ng-content>\n    </div>\n  "
-    })
-], FormComponent);
+FormComponent.decorators = [
+    { type: core_1.Component, args: [{
+                selector: 'cruddle-form',
+                template: "\n    <div class=\"cruddle-form\">\n      <ng-content></ng-content>\n    </div>\n  "
+            },] },
+];
+/** @nocollapse */
+FormComponent.ctorParameters = function () { return []; };
+FormComponent.propDecorators = {
+    'def': [{ type: core_1.Input },],
+    'data': [{ type: core_1.Input },],
+    'error': [{ type: core_1.Output },],
+};
 exports.FormComponent = FormComponent;
 //# sourceMappingURL=form.js.map

dist/components/list.d.ts

 import { EventEmitter } from '@angular/core';
 import { ModelProperties, Property } from 'modelsafe';
-import { ListDefinition, SortState, FilterState, PagingState, SortOrder } from '../definitions/list';
+import { ListDefinition, ListState, ListMode, FilterState, SortOrder } from '../definitions/list';
 /**
@@ -12,8 +12,4 @@ * The Cruddle list component that handles the list screen.
     data: any[];
-    /** Any sorting to apply to the list. */
-    sorting: SortState[];
-    /** Any filters to apply to the list. */
-    filters: FilterState[];
-    /** The pagination state for the list. */
-    paging: PagingState;
+    /** The state of the list. */
+    state: ListState;
     /** Emits errors during refreshing the list. */
@@ -26,3 +22,3 @@ error: EventEmitter<{}>;
      *
-     * @param refresh Whether or not to refresh the lsit after. Defaults to true.
+     * @param refresh Whether or not to refresh the list after. Defaults to true.
      */
@@ -33,3 +29,3 @@ clearSorting(refresh?: boolean): void;
      *
-     * @param refresh Whether or not to refresh the lsit after. Defaults to true.
+     * @param refresh Whether or not to refresh the list after. Defaults to true.
      */
@@ -43,3 +39,3 @@ clearFiltering(refresh?: boolean): void;
      * @param order The sort order. Defaults to ascending.
-     * @param refresh Whether or not to refresh the lsit after. Defaults to true.
+     * @param refresh Whether or not to refresh the list after. Defaults to true.
      */
@@ -84,2 +80,10 @@ sort(map: (props: ModelProperties<any>) => Property<any>, order?: SortOrder, refresh?: boolean): void;
     /**
+     * Set the current view mode of the list.
+     *
+     * @param mode The view mode ID. This should correspond to a mode
+     *             ID on the list definition.
+     * @param refresh Whether or not to refresh the list after. Defaults to true.
+     */
+    setMode(mode: ListMode, refresh?: boolean): void;
+    /**
      * Move to the next page.
@@ -107,2 +111,7 @@ * This will do nothing if paging information has not been provided.
     refresh(): void;
+    /**
+     * Refresh the visible properties on the screen
+     * from the list state.
+     */
+    refreshVisibility(): void;
 }

dist/components/list.js

@@ -10,11 +10,2 @@ "use strict";
 };
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
 var _ = require("lodash");
@@ -34,8 +25,4 @@ var core_1 = require("@angular/core");
     ListComponent.prototype.ngOnInit = function () {
-        if (!Array.isArray(this.sorting)) {
-            this.sorting = [];
-        }
-        if (!Array.isArray(this.filters)) {
-            this.filters = [];
-        }
+        this.state = __assign({ filters: [], sorting: [], visible: [] }, this.state);
+        this.refreshVisibility();
     };
@@ -45,7 +32,8 @@ /**
      *
-     * @param refresh Whether or not to refresh the lsit after. Defaults to true.
+     * @param refresh Whether or not to refresh the list after. Defaults to true.
      */
     ListComponent.prototype.clearSorting = function (refresh) {
         if (refresh === void 0) { refresh = true; }
-        this.sorting = [];
+        this.state.sorting = [];
+        this.refreshVisibility();
         if (refresh) {
@@ -58,7 +46,8 @@ this.refresh();
      *
-     * @param refresh Whether or not to refresh the lsit after. Defaults to true.
+     * @param refresh Whether or not to refresh the list after. Defaults to true.
      */
     ListComponent.prototype.clearFiltering = function (refresh) {
         if (refresh === void 0) { refresh = true; }
-        this.filters = [];
+        this.state.filters = [];
+        this.refreshVisibility();
         if (refresh) {
@@ -74,3 +63,3 @@ this.refresh();
      * @param order The sort order. Defaults to ascending.
-     * @param refresh Whether or not to refresh the lsit after. Defaults to true.
+     * @param refresh Whether or not to refresh the list after. Defaults to true.
      */
@@ -81,7 +70,8 @@ ListComponent.prototype.sort = function (map, order, refresh) {
         var prop = map(props);
-        var sorting = _.filter(this.sorting, function (s) { return s.prop.toString() !== prop.toString(); });
+        var sorting = _.filter(this.state.sorting, function (s) { return s.prop.toString() !== prop.toString(); });
         if (!order) {
             order = list_1.SortOrder.ASC;
         }
-        this.sorting.push({ prop: prop, order: order });
+        this.state.sorting = sorting.concat([{ prop: prop, order: order }]);
+        this.refreshVisibility();
         if (refresh) {
@@ -105,3 +95,4 @@ this.refresh();
         var prop = map(props);
-        this.filters.push(__assign({ prop: prop }, filter));
+        this.state.filters.push(__assign({ prop: prop }, filter));
+        this.refreshVisibility();
         if (refresh) {
@@ -123,3 +114,4 @@ this.refresh();
         if (refresh === void 0) { refresh = true; }
-        this.filters = _.without(this.filters, filter);
+        this.state.filters = _.without(this.state.filters, filter);
+        this.refreshVisibility();
         if (refresh) {
@@ -135,3 +127,3 @@ this.refresh();
     ListComponent.prototype.hasPaging = function () {
-        return this.paging && typeof (this.paging) === 'object';
+        return this.state.paging && typeof (this.state.paging) === 'object';
     };
@@ -148,5 +140,6 @@ /**
         if (this.hasPaging()) {
-            var paging = this.paging;
+            var paging = this.state.paging;
             paging.page = Math.max(Math.min(page, paging.numPages), 1);
         }
+        this.refreshVisibility();
         if (refresh) {
@@ -157,2 +150,17 @@ this.refresh();
     /**
+     * Set the current view mode of the list.
+     *
+     * @param mode The view mode ID. This should correspond to a mode
+     *             ID on the list definition.
+     * @param refresh Whether or not to refresh the list after. Defaults to true.
+     */
+    ListComponent.prototype.setMode = function (mode, refresh) {
+        if (refresh === void 0) { refresh = true; }
+        this.state.mode = mode.id;
+        this.refreshVisibility();
+        if (refresh) {
+            this.refresh();
+        }
+    };
+    /**
      * Move to the next page.
@@ -166,3 +174,3 @@ * This will do nothing if paging information has not been provided.
         if (this.hasPaging()) {
-            var paging = this.paging;
+            var paging = this.state.paging;
             this.setPage(paging.page + 1, refresh);
@@ -180,3 +188,3 @@ }
         if (this.hasPaging()) {
-            var paging = this.paging;
+            var paging = this.state.paging;
             this.setPage(paging.page - 1, refresh);
@@ -196,3 +204,3 @@ }
         this.def
-            .refresh(this.filters, this.sorting, this.paging)
+            .refresh(this.state)
             .then(function (data) {
@@ -205,35 +213,26 @@ self.data = data;
     };
+    /**
+     * Refresh the visible properties on the screen
+     * from the list state.
+     */
+    ListComponent.prototype.refreshVisibility = function () {
+        this.state.visible = this.def.visible(this.state, modelsafe_1.getProperties(this.def.model));
+    };
     return ListComponent;
 }());
-__decorate([
-    core_1.Input(),
-    __metadata("design:type", Object)
-], ListComponent.prototype, "def", void 0);
-__decorate([
-    core_1.Input(),
-    __metadata("design:type", Array)
-], ListComponent.prototype, "data", void 0);
-__decorate([
-    core_1.Input(),
-    __metadata("design:type", Array)
-], ListComponent.prototype, "sorting", void 0);
-__decorate([
-    core_1.Input(),
-    __metadata("design:type", Array)
-], ListComponent.prototype, "filters", void 0);
-__decorate([
-    core_1.Input(),
-    __metadata("design:type", Object)
-], ListComponent.prototype, "paging", void 0);
-__decorate([
-    core_1.Output(),
-    __metadata("design:type", Object)
-], ListComponent.prototype, "error", void 0);
-ListComponent = __decorate([
-    core_1.Component({
-        selector: 'cruddle-list',
-        template: "\n    <div class=\"cruddle-list\">\n      <ng-content></ng-content>\n    </div>\n  "
-    })
-], ListComponent);
+ListComponent.decorators = [
+    { type: core_1.Component, args: [{
+                selector: 'cruddle-list',
+                template: "\n    <div class=\"cruddle-list\">\n      <ng-content></ng-content>\n    </div>\n  "
+            },] },
+];
+/** @nocollapse */
+ListComponent.ctorParameters = function () { return []; };
+ListComponent.propDecorators = {
+    'def': [{ type: core_1.Input },],
+    'data': [{ type: core_1.Input },],
+    'state': [{ type: core_1.Input },],
+    'error': [{ type: core_1.Output },],
+};
 exports.ListComponent = ListComponent;
 //# sourceMappingURL=list.js.map

dist/components/list.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":3,"metadata":{"ListComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"cruddle-list","template":"\n    <div class=\"cruddle-list\">\n      <ng-content></ng-content>\n    </div>\n  "}]}],"members":{"def":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"sorting":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"filters":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"paging":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"error":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"ngOnInit":[{"__symbolic":"method"}],"clearSorting":[{"__symbolic":"method"}],"clearFiltering":[{"__symbolic":"method"}],"sort":[{"__symbolic":"method"}],"addFilter":[{"__symbolic":"method"}],"removeFilter":[{"__symbolic":"method"}],"hasPaging":[{"__symbolic":"method"}],"setPage":[{"__symbolic":"method"}],"nextPage":[{"__symbolic":"method"}],"previousPage":[{"__symbolic":"method"}],"refresh":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"ListComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"cruddle-list","template":"\n    <div class=\"cruddle-list\">\n      <ng-content></ng-content>\n    </div>\n  "}]}],"members":{"def":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"sorting":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"filters":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"paging":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"error":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"ngOnInit":[{"__symbolic":"method"}],"clearSorting":[{"__symbolic":"method"}],"clearFiltering":[{"__symbolic":"method"}],"sort":[{"__symbolic":"method"}],"addFilter":[{"__symbolic":"method"}],"removeFilter":[{"__symbolic":"method"}],"hasPaging":[{"__symbolic":"method"}],"setPage":[{"__symbolic":"method"}],"nextPage":[{"__symbolic":"method"}],"previousPage":[{"__symbolic":"method"}],"refresh":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":3,"metadata":{"ListComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"cruddle-list","template":"\n    <div class=\"cruddle-list\">\n      <ng-content></ng-content>\n    </div>\n  "}]}],"members":{"def":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"state":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"error":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"ngOnInit":[{"__symbolic":"method"}],"clearSorting":[{"__symbolic":"method"}],"clearFiltering":[{"__symbolic":"method"}],"sort":[{"__symbolic":"method"}],"addFilter":[{"__symbolic":"method"}],"removeFilter":[{"__symbolic":"method"}],"hasPaging":[{"__symbolic":"method"}],"setPage":[{"__symbolic":"method"}],"setMode":[{"__symbolic":"method"}],"nextPage":[{"__symbolic":"method"}],"previousPage":[{"__symbolic":"method"}],"refresh":[{"__symbolic":"method"}],"refreshVisibility":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"ListComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"cruddle-list","template":"\n    <div class=\"cruddle-list\">\n      <ng-content></ng-content>\n    </div>\n  "}]}],"members":{"def":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"state":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"error":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"ngOnInit":[{"__symbolic":"method"}],"clearSorting":[{"__symbolic":"method"}],"clearFiltering":[{"__symbolic":"method"}],"sort":[{"__symbolic":"method"}],"addFilter":[{"__symbolic":"method"}],"removeFilter":[{"__symbolic":"method"}],"hasPaging":[{"__symbolic":"method"}],"setPage":[{"__symbolic":"method"}],"setMode":[{"__symbolic":"method"}],"nextPage":[{"__symbolic":"method"}],"previousPage":[{"__symbolic":"method"}],"refresh":[{"__symbolic":"method"}],"refreshVisibility":[{"__symbolic":"method"}]}}}}]

dist/components/read.js

 "use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
 var core_1 = require("@angular/core");
@@ -20,17 +11,15 @@ /**
 }());
-__decorate([
-    core_1.Input(),
-    __metadata("design:type", Object)
-], ReadComponent.prototype, "def", void 0);
-__decorate([
-    core_1.Input(),
-    __metadata("design:type", Object)
-], ReadComponent.prototype, "data", void 0);
-ReadComponent = __decorate([
-    core_1.Component({
-        selector: 'cruddle-read',
-        template: "\n    <div class=\"cruddle-read\">\n      <ng-content></ng-content>\n    </div>\n  "
-    })
-], ReadComponent);
+ReadComponent.decorators = [
+    { type: core_1.Component, args: [{
+                selector: 'cruddle-read',
+                template: "\n    <div class=\"cruddle-read\">\n      <ng-content></ng-content>\n    </div>\n  "
+            },] },
+];
+/** @nocollapse */
+ReadComponent.ctorParameters = function () { return []; };
+ReadComponent.propDecorators = {
+    'def': [{ type: core_1.Input },],
+    'data': [{ type: core_1.Input },],
+};
 exports.ReadComponent = ReadComponent;
 //# sourceMappingURL=read.js.map

dist/definitions/base.d.ts

@@ -85,2 +85,6 @@ import { Property, Model, ModelConstructor, AttributeType, AssociationType } from 'modelsafe';
     model: ModelConstructor<T>;
+    /** The plural form of the model name, in lower camel-case. */
+    plural: string;
+    /** The singular form of the model name, in lower camel-case. */
+    singular: string;
     /**
@@ -87,0 +91,0 @@ * The actions that can be done on the model.

dist/definitions/list.d.ts

@@ -12,2 +12,14 @@ import { Model, ModelProperties, Property } from 'modelsafe';
 export declare const DESC: SortOrder;
+/** A view mode for the list. */
+export interface ListMode {
+    /**
+     * The ID of the view mode.
+     * This is what is actually stored on the list state.
+     */
+    id: string;
+    /** The style of the view mode. */
+    style: string;
+    /** The label of the view mode. */
+    label: string;
+}
 /** The state of sorting a property on a list. */
@@ -45,2 +57,20 @@ export interface SortState {
 }
+/** The total state of the list. */
+export interface ListState {
+    /** The filter state of the list. */
+    filters: FilterState[];
+    /** The sorting state of the list. */
+    sorting: SortState[];
+    /** The pagination state of the list. */
+    paging?: PagingState;
+    /**
+     * Properties of the relevant model that have been
+     * selected to be visible. If the list definition
+     * has no custom `visible` function, this will default
+     * to all fields.
+     */
+    visible: Property<any>[];
+    /** The current list view mode. */
+    mode?: string;
+}
 /**
@@ -52,6 +82,12 @@ * The definition of a list component.
 export interface ListDefinition<T extends Model> extends BaseDefinition<T> {
+    /** The list view modes. */
+    modes: ListMode[];
     /** The callback for refreshing the list data from the current list state. */
-    refresh(filters: FilterState[], sorting: SortState[], paging: PagingState): Promise<T[]>;
-    /** Select the properties that should be visible on the list. */
-    visible(props: ModelProperties<T>): [Property<any>];
+    refresh(state: ListState): Promise<T[]>;
+    /**
+     * Select the properties that should be visible on the list
+     * based off the list state. This is automatically called whenever
+     * the list state changes.
+     */
+    visible?(state: ListState, props: ModelProperties<T>): [Property<any>];
 }

dist/helpers.js

@@ -10,2 +10,4 @@ "use strict";
 };
+var _ = require("lodash");
+var inflection_1 = require("inflection");
 var modelsafe_1 = require("modelsafe");
@@ -27,2 +29,5 @@ var metadata_1 = require("./metadata");
     Definitions.base = function (model, overrides) {
+        var options = modelsafe_1.getModelOptions(model);
+        var singular = inflection_1.singularize(_.camelCase(options.name));
+        var plural = inflection_1.pluralize(_.camelCase(options.name));
         var props = modelsafe_1.getProperties(model);
@@ -64,2 +69,4 @@ var attrs = [];
         return __assign({ model: model,
+            singular: singular,
+            plural: plural,
             attrs: attrs,
@@ -110,3 +117,7 @@ assocs: assocs, actions: [], contextualActions: [] }, overrides);
         var base = Definitions.base(model, overrides);
-        return __assign({}, base, overrides);
+        return __assign({}, base, { modes: [], 
+            /** The default visibility selector. It displays everything. */
+            visible: function (state, props) {
+                return _.values(props);
+            } }, overrides);
     };
@@ -113,0 +124,0 @@ return Definitions;

dist/metadata.d.ts

@@ -56,1 +56,24 @@ import 'reflect-metadata';
 export declare function getFilterable(ctor: Function, key: string | symbol): boolean;
+/**
+ * A decorator for attribute labels.
+ * By default attribute labels are the same as their key,
+ * which isn't very user-friendly. Labels can be manually
+ * provided using this decorator.
+ *
+ * @param value The attribute label.
+ */
+export declare function label(value: string): (ctor: Object, key: string | symbol) => void;
+/**
+ * A decorator for attribute sortability.
+ * By default attributes are not sortable.
+ *
+ * @param value Whether the attribute is sortable.
+ */
+export declare function sortable(value: boolean): (ctor: Object, key: string | symbol) => void;
+/**
+ * A decorator for attribute filterability.
+ * By default attributes are not filterable.
+ *
+ * @param value Whether the attribute is sortable.
+ */
+export declare function filterable(value: boolean): (ctor: Object, key: string | symbol) => void;

dist/metadata.js

@@ -75,2 +75,34 @@ "use strict";
 exports.getFilterable = getFilterable;
+/**
+ * A decorator for attribute labels.
+ * By default attribute labels are the same as their key,
+ * which isn't very user-friendly. Labels can be manually
+ * provided using this decorator.
+ *
+ * @param value The attribute label.
+ */
+function label(value) {
+    return function (ctor, key) { return defineLabel(ctor, key, value); };
+}
+exports.label = label;
+/**
+ * A decorator for attribute sortability.
+ * By default attributes are not sortable.
+ *
+ * @param value Whether the attribute is sortable.
+ */
+function sortable(value) {
+    return function (ctor, key) { return defineSortable(ctor, key, value); };
+}
+exports.sortable = sortable;
+/**
+ * A decorator for attribute filterability.
+ * By default attributes are not filterable.
+ *
+ * @param value Whether the attribute is sortable.
+ */
+function filterable(value) {
+    return function (ctor, key) { return defineFilterable(ctor, key, value); };
+}
+exports.filterable = filterable;
 //# sourceMappingURL=metadata.js.map

dist/metadata.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":3,"metadata":{"MODEL_ATTR_LABEL_META_KEY":"cruddle:label","MODEL_ATTR_SORTABLE_META_KEY":"cruddle:sortable","MODEL_ATTR_FILTERABLE_META_KEY":"cruddle:filterable","defineLabel":{"__symbolic":"function"},"defineFilterable":{"__symbolic":"function"},"defineSortable":{"__symbolic":"function"},"getLabel":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"Reflect"},"member":"getMetadata"},"arguments":["cruddle:label",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}},"getSortable":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"Reflect"},"member":"getMetadata"},"arguments":["cruddle:sortable",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}},"getFilterable":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"Reflect"},"member":"getMetadata"},"arguments":["cruddle:filterable",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}}}},{"__symbolic":"module","version":1,"metadata":{"MODEL_ATTR_LABEL_META_KEY":"cruddle:label","MODEL_ATTR_SORTABLE_META_KEY":"cruddle:sortable","MODEL_ATTR_FILTERABLE_META_KEY":"cruddle:filterable","defineLabel":{"__symbolic":"function"},"defineFilterable":{"__symbolic":"function"},"defineSortable":{"__symbolic":"function"},"getLabel":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"Reflect"},"member":"getMetadata"},"arguments":["cruddle:label",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}},"getSortable":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"Reflect"},"member":"getMetadata"},"arguments":["cruddle:sortable",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}},"getFilterable":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"Reflect"},"member":"getMetadata"},"arguments":["cruddle:filterable",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}}}}]
+[{"__symbolic":"module","version":3,"metadata":{"MODEL_ATTR_LABEL_META_KEY":"cruddle:label","MODEL_ATTR_SORTABLE_META_KEY":"cruddle:sortable","MODEL_ATTR_FILTERABLE_META_KEY":"cruddle:filterable","defineLabel":{"__symbolic":"function"},"defineFilterable":{"__symbolic":"function"},"defineSortable":{"__symbolic":"function"},"getLabel":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"Reflect"},"member":"getMetadata"},"arguments":["cruddle:label",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}},"getSortable":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"Reflect"},"member":"getMetadata"},"arguments":["cruddle:sortable",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}},"getFilterable":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"Reflect"},"member":"getMetadata"},"arguments":["cruddle:filterable",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}},"label":{"__symbolic":"function","parameters":["value"],"value":{"__symbolic":"error","message":"Function call not supported","line":86,"character":9}},"sortable":{"__symbolic":"function","parameters":["value"],"value":{"__symbolic":"error","message":"Function call not supported","line":96,"character":9}},"filterable":{"__symbolic":"function","parameters":["value"],"value":{"__symbolic":"error","message":"Function call not supported","line":106,"character":9}}}},{"__symbolic":"module","version":1,"metadata":{"MODEL_ATTR_LABEL_META_KEY":"cruddle:label","MODEL_ATTR_SORTABLE_META_KEY":"cruddle:sortable","MODEL_ATTR_FILTERABLE_META_KEY":"cruddle:filterable","defineLabel":{"__symbolic":"function"},"defineFilterable":{"__symbolic":"function"},"defineSortable":{"__symbolic":"function"},"getLabel":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"Reflect"},"member":"getMetadata"},"arguments":["cruddle:label",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}},"getSortable":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"Reflect"},"member":"getMetadata"},"arguments":["cruddle:sortable",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}},"getFilterable":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"Reflect"},"member":"getMetadata"},"arguments":["cruddle:filterable",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}},"label":{"__symbolic":"function","parameters":["value"],"value":{"__symbolic":"error","message":"Function call not supported","line":86,"character":9}},"sortable":{"__symbolic":"function","parameters":["value"],"value":{"__symbolic":"error","message":"Function call not supported","line":96,"character":9}},"filterable":{"__symbolic":"function","parameters":["value"],"value":{"__symbolic":"error","message":"Function call not supported","line":106,"character":9}}}}]

dist/module.js

 "use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
 var core_1 = require("@angular/core");
@@ -24,20 +18,22 @@ var common_1 = require("@angular/common");
 }());
-CruddleModule = __decorate([
-    core_1.NgModule({
-        imports: [common_1.CommonModule],
-        declarations: [
-            delete_1.DeleteComponent,
-            form_1.FormComponent,
-            list_1.ListComponent,
-            read_1.ReadComponent
-        ],
-        exports: [
-            delete_1.DeleteComponent,
-            form_1.FormComponent,
-            list_1.ListComponent,
-            read_1.ReadComponent
-        ]
-    })
-], CruddleModule);
+CruddleModule.decorators = [
+    { type: core_1.NgModule, args: [{
+                imports: [common_1.CommonModule],
+                declarations: [
+                    delete_1.DeleteComponent,
+                    form_1.FormComponent,
+                    list_1.ListComponent,
+                    read_1.ReadComponent
+                ],
+                exports: [
+                    delete_1.DeleteComponent,
+                    form_1.FormComponent,
+                    list_1.ListComponent,
+                    read_1.ReadComponent
+                ]
+            },] },
+];
+/** @nocollapse */
+CruddleModule.ctorParameters = function () { return []; };
 exports.CruddleModule = CruddleModule;
 //# sourceMappingURL=module.js.map

package.json

 {
   "name": "cruddle",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "main": "dist/index.js",
@@ -23,2 +23,3 @@ "bugs": "https://github.com/creativecuriositystudio/cruddle/issues",
   "scripts": {
+    "prepush": "npm run lint",
     "prepublish": "ngc",
@@ -34,13 +35,13 @@ "build": "ngc",
   "peerDependencies": {
-    "@angular/core": "^2.0.0 || ^4.0.0-rc.2",
+    "@angular/core": "^4.0.0-rc.2",
     "modelsafe": "^0.3.0"
   },
   "devDependencies": {
-    "@angular/common": "^2.3.1",
-    "@angular/compiler": "^2.3.1",
-    "@angular/compiler-cli": "^2.3.1",
-    "@angular/core": "^2.3.1",
-    "@angular/platform-browser": "^2.3.1",
-    "@angular/platform-browser-dynamic": "^2.3.1",
-    "@angular/platform-server": "^2.3.1",
+    "@angular/common": "4.0.0-rc.2",
+    "@angular/compiler": "4.0.0-rc.2",
+    "@angular/compiler-cli": "4.0.0-rc.2",
+    "@angular/core": "4.0.0-rc.2",
+    "@angular/platform-browser": "4.0.0-rc.2",
+    "@angular/platform-browser-dynamic": "4.0.0-rc.2",
+    "@angular/platform-server": "4.0.0-rc.2",
     "@types/chai": "^3.4.35",
@@ -51,5 +52,6 @@ "@types/mocha": "^2.2.33",
     "compodoc": "0.0.41",
+    "husky": "^0.13.2",
     "mocha": "^3.2.0",
     "modelsafe": "^0.3.0",
-    "reflect-metadata": "^0.1.3",
+    "reflect-metadata": "^0.1.8",
     "rxjs": "^5.0.0",
@@ -63,5 +65,7 @@ "ts-node": "^2.1.0",
   "dependencies": {
+    "@types/inflection": "^1.5.28",
     "@types/lodash": "^4.14.53",
+    "inflection": "^1.12.0",
     "lodash": "^4.17.4"
   }
 }

src/components/delete.ngfactory.ts

 /**
- * @fileoverview This file is generated by the Angular 2 template compiler.
+ * @fileoverview This file is generated by the Angular template compiler.
  * Do not edit.
@@ -8,124 +8,39 @@ * @suppress {suspiciousCode,uselessCode,missingProperties}
 
-import * as import0 from './delete';
-import * as import1 from '@angular/core/src/change_detection/change_detection_util';
-import * as import2 from '@angular/core/src/linker/view';
-import * as import3 from '@angular/core/src/linker/view_utils';
-import * as import4 from '@angular/core/src/render/api';
-import * as import5 from '@angular/core/src/metadata/view';
-import * as import6 from '@angular/core/src/linker/view_type';
-import * as import7 from '@angular/core/src/change_detection/constants';
-import * as import8 from '@angular/core/src/linker/component_factory';
-export class Wrapper_DeleteComponent {
-  /*private*/ _eventHandler:Function;
-  context:import0.DeleteComponent;
-  /*private*/ _changed:boolean;
-  /*private*/ _expr_0:any;
-  /*private*/ _expr_1:any;
-  subscription0:any;
-  constructor() {
-    this._changed = false;
-    this.context = new import0.DeleteComponent();
-    this._expr_0 = import1.UNINITIALIZED;
-    this._expr_1 = import1.UNINITIALIZED;
-  }
-  ngOnDetach(view:import2.AppView<any>,componentView:import2.AppView<any>,el:any):void {
-  }
-  ngOnDestroy():void {
-    (this.subscription0 && this.subscription0.unsubscribe());
-  }
-  check_def(currValue:any,throwOnChange:boolean,forceUpdate:boolean):void {
-    if ((forceUpdate || import3.checkBinding(throwOnChange,this._expr_0,currValue))) {
-      this._changed = true;
-      this.context.def = currValue;
-      this._expr_0 = currValue;
-    }
-  }
-  check_data(currValue:any,throwOnChange:boolean,forceUpdate:boolean):void {
-    if ((forceUpdate || import3.checkBinding(throwOnChange,this._expr_1,currValue))) {
-      this._changed = true;
-      this.context.data = currValue;
-      this._expr_1 = currValue;
-    }
-  }
-  ngDoCheck(view:import2.AppView<any>,el:any,throwOnChange:boolean):boolean {
-    var changed:any = this._changed;
-    this._changed = false;
-    return changed;
-  }
-  checkHost(view:import2.AppView<any>,componentView:import2.AppView<any>,el:any,throwOnChange:boolean):void {
-  }
-  handleEvent(eventName:string,$event:any):boolean {
-    var result:boolean = true;
-    return result;
-  }
-  subscribe(view:import2.AppView<any>,_eventHandler:any,emit0:boolean):void {
-    this._eventHandler = _eventHandler;
-    if (emit0) { (this.subscription0 = this.context.error.subscribe(_eventHandler.bind(view,'error'))); }
-  }
+import * as import0 from '@angular/core';
+import * as import1 from './delete';
+const styles_DeleteComponent:any[] = ([] as any[]);
+export const RenderType_DeleteComponent:import0.RendererTypeV2 = import0.ɵcrt({
+  encapsulation: 2,
+  styles: styles_DeleteComponent,
+  data: {}
 }
-var renderType_DeleteComponent_Host:import4.RenderComponentType = import3.createRenderComponentType('',0,import5.ViewEncapsulation.None,([] as any[]),{});
-class View_DeleteComponent_Host0 extends import2.AppView<any> {
-  _el_0:any;
-  compView_0:import2.AppView<import0.DeleteComponent>;
-  _DeleteComponent_0_3:Wrapper_DeleteComponent;
-  constructor(viewUtils:import3.ViewUtils,parentView:import2.AppView<any>,parentIndex:number,parentElement:any) {
-    super(View_DeleteComponent_Host0,renderType_DeleteComponent_Host,import6.ViewType.HOST,viewUtils,parentView,parentIndex,parentElement,import7.ChangeDetectorStatus.CheckAlways);
-  }
-  createInternal(rootSelector:string):import8.ComponentRef<any> {
-    this._el_0 = import3.selectOrCreateRenderHostElement(this.renderer,'cruddle-delete',import3.EMPTY_INLINE_ARRAY,rootSelector,(null as any));
-    this.compView_0 = new View_DeleteComponent0(this.viewUtils,this,0,this._el_0);
-    this._DeleteComponent_0_3 = new Wrapper_DeleteComponent();
-    this.compView_0.create(this._DeleteComponent_0_3.context);
-    this.init(this._el_0,((<any>this.renderer).directRenderer? (null as any): [this._el_0]),(null as any));
-    return new import8.ComponentRef_<any>(0,this,this._el_0,this._DeleteComponent_0_3.context);
-  }
-  injectorGetInternal(token:any,requestNodeIndex:number,notFoundResult:any):any {
-    if (((token === import0.DeleteComponent) && (0 === requestNodeIndex))) { return this._DeleteComponent_0_3.context; }
-    return notFoundResult;
-  }
-  detectChangesInternal(throwOnChange:boolean):void {
-    this._DeleteComponent_0_3.ngDoCheck(this,this._el_0,throwOnChange);
-    this.compView_0.internalDetectChanges(throwOnChange);
-  }
-  destroyInternal():void {
-    this.compView_0.destroy();
-    this._DeleteComponent_0_3.ngOnDestroy();
-  }
-  visitRootNodesInternal(cb:any,ctx:any):void {
-    cb(this._el_0,ctx);
-  }
-  visitProjectableNodesInternal(nodeIndex:number,ngContentIndex:number,cb:any,ctx:any):void {
-    if (((nodeIndex == 0) && (ngContentIndex == 0))) {  }
-  }
+);
+export function View_DeleteComponent_0():import0.ɵViewDefinition {
+  return import0.ɵvid(0,[
+    import0.ɵted((null as any),['\n    ']),
+      import0.ɵeld(0,(null as any),(null as any),3,'div',[[
+        'class',
+        'cruddle-delete'
+      ]
+    ],(null as any),(null as any),(null as any),(null as any),(null as any)),
+    import0.ɵted((null as any),['\n      ']),
+    import0.ɵncd((null as any),0),
+    import0.ɵted((null as any),['\n    ']),
+    import0.ɵted((null as any),['\n  '])
+  ]
+  ,(null as any),(null as any));
 }
-export const DeleteComponentNgFactory:import8.ComponentFactory<import0.DeleteComponent> = new import8.ComponentFactory<import0.DeleteComponent>('cruddle-delete',View_DeleteComponent_Host0,import0.DeleteComponent);
-const styles_DeleteComponent:any[] = ([] as any[]);
-var renderType_DeleteComponent:import4.RenderComponentType = import3.createRenderComponentType('',1,import5.ViewEncapsulation.None,styles_DeleteComponent,{});
-export class View_DeleteComponent0 extends import2.AppView<import0.DeleteComponent> {
-  _text_0:any;
-  _el_1:any;
-  _text_2:any;
-  _text_3:any;
-  _text_4:any;
-  constructor(viewUtils:import3.ViewUtils,parentView:import2.AppView<any>,parentIndex:number,parentElement:any) {
-    super(View_DeleteComponent0,renderType_DeleteComponent,import6.ViewType.COMPONENT,viewUtils,parentView,parentIndex,parentElement,import7.ChangeDetectorStatus.CheckAlways);
-  }
-  createInternal(rootSelector:string):import8.ComponentRef<any> {
-    const parentRenderNode:any = this.renderer.createViewRoot(this.parentElement);
-    this._text_0 = this.renderer.createText(parentRenderNode,'\n    ',(null as any));
-    this._el_1 = import3.createRenderElement(this.renderer,parentRenderNode,'div',new import3.InlineArray2(2,'class','cruddle-delete'),(null as any));
-    this._text_2 = this.renderer.createText(this._el_1,'\n      ',(null as any));
-    this.projectNodes(this._el_1,0);
-    this._text_3 = this.renderer.createText(this._el_1,'\n    ',(null as any));
-    this._text_4 = this.renderer.createText(parentRenderNode,'\n  ',(null as any));
-    this.init((null as any),((<any>this.renderer).directRenderer? (null as any): [
-      this._text_0,
-      this._el_1,
-      this._text_2,
-      this._text_3,
-      this._text_4
-    ]
-    ),(null as any));
-    return (null as any);
-  }
-}
+const RenderType_DeleteComponent_Host:import0.RendererTypeV2 = import0.ɵcrt({
+  encapsulation: 2,
+  styles: ([] as any[]),
+  data: {}
+}
+);
+function View_DeleteComponent_Host_0():import0.ɵViewDefinition {
+  return import0.ɵvid(0,[
+    import0.ɵeld(0,(null as any),(null as any),1,'cruddle-delete',([] as any[]),(null as any),(null as any),(null as any),View_DeleteComponent_0,RenderType_DeleteComponent),
+    import0.ɵdid(24576,(null as any),0,import1.DeleteComponent,([] as any[]),(null as any),(null as any))
+  ]
+  ,(null as any),(null as any));
+}
+export const DeleteComponentNgFactory:import0.ComponentFactory<import1.DeleteComponent> = import0.ɵccf('cruddle-delete',import1.DeleteComponent,View_DeleteComponent_Host_0);

src/components/delete.ngsummary.json

@@ -1,1 +0,1 @@
-{"summaries":[{"symbol":{"__symbol":0},"metadata":{"__symbolic":"class"},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0},"diDeps":[],"lifecycleHooks":[]},"isComponent":true,"selector":"cruddle-delete","inputs":{"def":"def","data":"data"},"outputs":{"error":"error"},"hostListeners":{},"hostProperties":{},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[],"entryComponents":[],"changeDetection":1,"template":{"animations":[],"ngContentSelectors":["*"],"encapsulation":2}}}],"symbols":[{"__symbol":0,"name":"DeleteComponent","filePath":"/home/zack/dev/cruddle/src/components/delete.d.ts"}]}
+{"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class"},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[]},"isComponent":true,"selector":"cruddle-delete","inputs":{"def":"def","data":"data"},"outputs":{"error":"error"},"hostListeners":{},"hostProperties":{},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[],"viewQueries":[],"entryComponents":[],"changeDetection":1,"template":{"animations":[],"ngContentSelectors":["*"],"encapsulation":2},"componentViewType":{"__symbol":1,"members":[]},"rendererType":{"__symbol":2,"members":[]},"componentFactory":{"__symbol":3,"members":[]}}}],"symbols":[{"__symbol":0,"name":"DeleteComponent","filePath":"/home/zack/dev/cruddle/src/components/delete.d.ts"},{"__symbol":1,"name":"View_DeleteComponent_0","filePath":"/home/zack/dev/cruddle/src/components/delete.ngfactory.d.ts"},{"__symbol":2,"name":"RenderType_DeleteComponent","filePath":"/home/zack/dev/cruddle/src/components/delete.ngfactory.d.ts"},{"__symbol":3,"name":"DeleteComponentNgFactory","filePath":"/home/zack/dev/cruddle/src/components/delete.ngfactory.d.ts"}]}

src/components/form.ngfactory.ts

 /**
- * @fileoverview This file is generated by the Angular 2 template compiler.
+ * @fileoverview This file is generated by the Angular template compiler.
  * Do not edit.
@@ -8,124 +8,39 @@ * @suppress {suspiciousCode,uselessCode,missingProperties}
 
-import * as import0 from './form';
-import * as import1 from '@angular/core/src/change_detection/change_detection_util';
-import * as import2 from '@angular/core/src/linker/view';
-import * as import3 from '@angular/core/src/linker/view_utils';
-import * as import4 from '@angular/core/src/render/api';
-import * as import5 from '@angular/core/src/metadata/view';
-import * as import6 from '@angular/core/src/linker/view_type';
-import * as import7 from '@angular/core/src/change_detection/constants';
-import * as import8 from '@angular/core/src/linker/component_factory';
-export class Wrapper_FormComponent {
-  /*private*/ _eventHandler:Function;
-  context:import0.FormComponent;
-  /*private*/ _changed:boolean;
-  /*private*/ _expr_0:any;
-  /*private*/ _expr_1:any;
-  subscription0:any;
-  constructor() {
-    this._changed = false;
-    this.context = new import0.FormComponent();
-    this._expr_0 = import1.UNINITIALIZED;
-    this._expr_1 = import1.UNINITIALIZED;
-  }
-  ngOnDetach(view:import2.AppView<any>,componentView:import2.AppView<any>,el:any):void {
-  }
-  ngOnDestroy():void {
-    (this.subscription0 && this.subscription0.unsubscribe());
-  }
-  check_def(currValue:any,throwOnChange:boolean,forceUpdate:boolean):void {
-    if ((forceUpdate || import3.checkBinding(throwOnChange,this._expr_0,currValue))) {
-      this._changed = true;
-      this.context.def = currValue;
-      this._expr_0 = currValue;
-    }
-  }
-  check_data(currValue:any,throwOnChange:boolean,forceUpdate:boolean):void {
-    if ((forceUpdate || import3.checkBinding(throwOnChange,this._expr_1,currValue))) {
-      this._changed = true;
-      this.context.data = currValue;
-      this._expr_1 = currValue;
-    }
-  }
-  ngDoCheck(view:import2.AppView<any>,el:any,throwOnChange:boolean):boolean {
-    var changed:any = this._changed;
-    this._changed = false;
-    return changed;
-  }
-  checkHost(view:import2.AppView<any>,componentView:import2.AppView<any>,el:any,throwOnChange:boolean):void {
-  }
-  handleEvent(eventName:string,$event:any):boolean {
-    var result:boolean = true;
-    return result;
-  }
-  subscribe(view:import2.AppView<any>,_eventHandler:any,emit0:boolean):void {
-    this._eventHandler = _eventHandler;
-    if (emit0) { (this.subscription0 = this.context.error.subscribe(_eventHandler.bind(view,'error'))); }
-  }
+import * as import0 from '@angular/core';
+import * as import1 from './form';
+const styles_FormComponent:any[] = ([] as any[]);
+export const RenderType_FormComponent:import0.RendererTypeV2 = import0.ɵcrt({
+  encapsulation: 2,
+  styles: styles_FormComponent,
+  data: {}
 }
-var renderType_FormComponent_Host:import4.RenderComponentType = import3.createRenderComponentType('',0,import5.ViewEncapsulation.None,([] as any[]),{});
-class View_FormComponent_Host0 extends import2.AppView<any> {
-  _el_0:any;
-  compView_0:import2.AppView<import0.FormComponent>;
-  _FormComponent_0_3:Wrapper_FormComponent;
-  constructor(viewUtils:import3.ViewUtils,parentView:import2.AppView<any>,parentIndex:number,parentElement:any) {
-    super(View_FormComponent_Host0,renderType_FormComponent_Host,import6.ViewType.HOST,viewUtils,parentView,parentIndex,parentElement,import7.ChangeDetectorStatus.CheckAlways);
-  }
-  createInternal(rootSelector:string):import8.ComponentRef<any> {
-    this._el_0 = import3.selectOrCreateRenderHostElement(this.renderer,'cruddle-form',import3.EMPTY_INLINE_ARRAY,rootSelector,(null as any));
-    this.compView_0 = new View_FormComponent0(this.viewUtils,this,0,this._el_0);
-    this._FormComponent_0_3 = new Wrapper_FormComponent();
-    this.compView_0.create(this._FormComponent_0_3.context);
-    this.init(this._el_0,((<any>this.renderer).directRenderer? (null as any): [this._el_0]),(null as any));
-    return new import8.ComponentRef_<any>(0,this,this._el_0,this._FormComponent_0_3.context);
-  }
-  injectorGetInternal(token:any,requestNodeIndex:number,notFoundResult:any):any {
-    if (((token === import0.FormComponent) && (0 === requestNodeIndex))) { return this._FormComponent_0_3.context; }
-    return notFoundResult;
-  }
-  detectChangesInternal(throwOnChange:boolean):void {
-    this._FormComponent_0_3.ngDoCheck(this,this._el_0,throwOnChange);
-    this.compView_0.internalDetectChanges(throwOnChange);
-  }
-  destroyInternal():void {
-    this.compView_0.destroy();
-    this._FormComponent_0_3.ngOnDestroy();
-  }
-  visitRootNodesInternal(cb:any,ctx:any):void {
-    cb(this._el_0,ctx);
-  }
-  visitProjectableNodesInternal(nodeIndex:number,ngContentIndex:number,cb:any,ctx:any):void {
-    if (((nodeIndex == 0) && (ngContentIndex == 0))) {  }
-  }
+);
+export function View_FormComponent_0():import0.ɵViewDefinition {
+  return import0.ɵvid(0,[
+    import0.ɵted((null as any),['\n    ']),
+      import0.ɵeld(0,(null as any),(null as any),3,'div',[[
+        'class',
+        'cruddle-form'
+      ]
+    ],(null as any),(null as any),(null as any),(null as any),(null as any)),
+    import0.ɵted((null as any),['\n      ']),
+    import0.ɵncd((null as any),0),
+    import0.ɵted((null as any),['\n    ']),
+    import0.ɵted((null as any),['\n  '])
+  ]
+  ,(null as any),(null as any));
 }
-export const FormComponentNgFactory:import8.ComponentFactory<import0.FormComponent> = new import8.ComponentFactory<import0.FormComponent>('cruddle-form',View_FormComponent_Host0,import0.FormComponent);
-const styles_FormComponent:any[] = ([] as any[]);
-var renderType_FormComponent:import4.RenderComponentType = import3.createRenderComponentType('',1,import5.ViewEncapsulation.None,styles_FormComponent,{});
-export class View_FormComponent0 extends import2.AppView<import0.FormComponent> {
-  _text_0:any;
-  _el_1:any;
-  _text_2:any;
-  _text_3:any;
-  _text_4:any;
-  constructor(viewUtils:import3.ViewUtils,parentView:import2.AppView<any>,parentIndex:number,parentElement:any) {
-    super(View_FormComponent0,renderType_FormComponent,import6.ViewType.COMPONENT,viewUtils,parentView,parentIndex,parentElement,import7.ChangeDetectorStatus.CheckAlways);
-  }
-  createInternal(rootSelector:string):import8.ComponentRef<any> {
-    const parentRenderNode:any = this.renderer.createViewRoot(this.parentElement);
-    this._text_0 = this.renderer.createText(parentRenderNode,'\n    ',(null as any));
-    this._el_1 = import3.createRenderElement(this.renderer,parentRenderNode,'div',new import3.InlineArray2(2,'class','cruddle-form'),(null as any));
-    this._text_2 = this.renderer.createText(this._el_1,'\n      ',(null as any));
-    this.projectNodes(this._el_1,0);
-    this._text_3 = this.renderer.createText(this._el_1,'\n    ',(null as any));
-    this._text_4 = this.renderer.createText(parentRenderNode,'\n  ',(null as any));
-    this.init((null as any),((<any>this.renderer).directRenderer? (null as any): [
-      this._text_0,
-      this._el_1,
-      this._text_2,
-      this._text_3,
-      this._text_4
-    ]
-    ),(null as any));
-    return (null as any);
-  }
-}
+const RenderType_FormComponent_Host:import0.RendererTypeV2 = import0.ɵcrt({
+  encapsulation: 2,
+  styles: ([] as any[]),
+  data: {}
+}
+);
+function View_FormComponent_Host_0():import0.ɵViewDefinition {
+  return import0.ɵvid(0,[
+    import0.ɵeld(0,(null as any),(null as any),1,'cruddle-form',([] as any[]),(null as any),(null as any),(null as any),View_FormComponent_0,RenderType_FormComponent),
+    import0.ɵdid(24576,(null as any),0,import1.FormComponent,([] as any[]),(null as any),(null as any))
+  ]
+  ,(null as any),(null as any));
+}
+export const FormComponentNgFactory:import0.ComponentFactory<import1.FormComponent> = import0.ɵccf('cruddle-form',import1.FormComponent,View_FormComponent_Host_0);

src/components/form.ngsummary.json

@@ -1,1 +0,1 @@
-{"summaries":[{"symbol":{"__symbol":0},"metadata":{"__symbolic":"class"},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0},"diDeps":[],"lifecycleHooks":[]},"isComponent":true,"selector":"cruddle-form","inputs":{"def":"def","data":"data"},"outputs":{"error":"error"},"hostListeners":{},"hostProperties":{},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[],"entryComponents":[],"changeDetection":1,"template":{"animations":[],"ngContentSelectors":["*"],"encapsulation":2}}}],"symbols":[{"__symbol":0,"name":"FormComponent","filePath":"/home/zack/dev/cruddle/src/components/form.d.ts"}]}
+{"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class"},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[]},"isComponent":true,"selector":"cruddle-form","inputs":{"def":"def","data":"data"},"outputs":{"error":"error"},"hostListeners":{},"hostProperties":{},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[],"viewQueries":[],"entryComponents":[],"changeDetection":1,"template":{"animations":[],"ngContentSelectors":["*"],"encapsulation":2},"componentViewType":{"__symbol":1,"members":[]},"rendererType":{"__symbol":2,"members":[]},"componentFactory":{"__symbol":3,"members":[]}}}],"symbols":[{"__symbol":0,"name":"FormComponent","filePath":"/home/zack/dev/cruddle/src/components/form.d.ts"},{"__symbol":1,"name":"View_FormComponent_0","filePath":"/home/zack/dev/cruddle/src/components/form.ngfactory.d.ts"},{"__symbol":2,"name":"RenderType_FormComponent","filePath":"/home/zack/dev/cruddle/src/components/form.ngfactory.d.ts"},{"__symbol":3,"name":"FormComponentNgFactory","filePath":"/home/zack/dev/cruddle/src/components/form.ngfactory.d.ts"}]}

src/components/index.ngsummary.json

@@ -1,1 +0,1 @@
-{"summaries":[{"symbol":{"__symbol":0},"metadata":{"__symbol":1}},{"symbol":{"__symbol":2},"metadata":{"__symbol":3}},{"symbol":{"__symbol":4},"metadata":{"__symbol":5}},{"symbol":{"__symbol":6},"metadata":{"__symbol":7}}],"symbols":[{"__symbol":0,"name":"DeleteComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":1,"name":"DeleteComponent","filePath":"/home/zack/dev/cruddle/src/components/delete.d.ts"},{"__symbol":2,"name":"FormComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":3,"name":"FormComponent","filePath":"/home/zack/dev/cruddle/src/components/form.d.ts"},{"__symbol":4,"name":"ListComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":5,"name":"ListComponent","filePath":"/home/zack/dev/cruddle/src/components/list.d.ts"},{"__symbol":6,"name":"ReadComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":7,"name":"ReadComponent","filePath":"/home/zack/dev/cruddle/src/components/read.d.ts"}]}
+{"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbol":1,"members":[]}},{"symbol":{"__symbol":2,"members":[]},"metadata":{"__symbol":3,"members":[]}},{"symbol":{"__symbol":4,"members":[]},"metadata":{"__symbol":5,"members":[]}},{"symbol":{"__symbol":6,"members":[]},"metadata":{"__symbol":7,"members":[]}}],"symbols":[{"__symbol":0,"name":"DeleteComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":1,"name":"DeleteComponent","filePath":"/home/zack/dev/cruddle/src/components/delete.d.ts"},{"__symbol":2,"name":"FormComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":3,"name":"FormComponent","filePath":"/home/zack/dev/cruddle/src/components/form.d.ts"},{"__symbol":4,"name":"ListComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":5,"name":"ListComponent","filePath":"/home/zack/dev/cruddle/src/components/list.d.ts"},{"__symbol":6,"name":"ReadComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":7,"name":"ReadComponent","filePath":"/home/zack/dev/cruddle/src/components/read.d.ts"}]}

src/components/list.ngfactory.ts

 /**
- * @fileoverview This file is generated by the Angular 2 template compiler.
+ * @fileoverview This file is generated by the Angular template compiler.
  * Do not edit.
@@ -8,152 +8,41 @@ * @suppress {suspiciousCode,uselessCode,missingProperties}
 
-import * as import0 from './list';
-import * as import1 from '@angular/core/src/change_detection/change_detection_util';
-import * as import2 from '@angular/core/src/linker/view';
-import * as import3 from '@angular/core/src/linker/view_utils';
-import * as import4 from '@angular/core/src/render/api';
-import * as import5 from '@angular/core/src/metadata/view';
-import * as import6 from '@angular/core/src/linker/view_type';
-import * as import7 from '@angular/core/src/change_detection/constants';
-import * as import8 from '@angular/core/src/linker/component_factory';
-export class Wrapper_ListComponent {
-  /*private*/ _eventHandler:Function;
-  context:import0.ListComponent;
-  /*private*/ _changed:boolean;
-  /*private*/ _expr_0:any;
-  /*private*/ _expr_1:any;
-  /*private*/ _expr_2:any;
-  /*private*/ _expr_3:any;
-  /*private*/ _expr_4:any;
-  subscription0:any;
-  constructor() {
-    this._changed = false;
-    this.context = new import0.ListComponent();
-    this._expr_0 = import1.UNINITIALIZED;
-    this._expr_1 = import1.UNINITIALIZED;
-    this._expr_2 = import1.UNINITIALIZED;
-    this._expr_3 = import1.UNINITIALIZED;
-    this._expr_4 = import1.UNINITIALIZED;
-  }
-  ngOnDetach(view:import2.AppView<any>,componentView:import2.AppView<any>,el:any):void {
-  }
-  ngOnDestroy():void {
-    (this.subscription0 && this.subscription0.unsubscribe());
-  }
-  check_def(currValue:any,throwOnChange:boolean,forceUpdate:boolean):void {
-    if ((forceUpdate || import3.checkBinding(throwOnChange,this._expr_0,currValue))) {
-      this._changed = true;
-      this.context.def = currValue;
-      this._expr_0 = currValue;
-    }
-  }
-  check_data(currValue:any,throwOnChange:boolean,forceUpdate:boolean):void {
-    if ((forceUpdate || import3.checkBinding(throwOnChange,this._expr_1,currValue))) {
-      this._changed = true;
-      this.context.data = currValue;
-      this._expr_1 = currValue;
-    }
-  }
-  check_sorting(currValue:any,throwOnChange:boolean,forceUpdate:boolean):void {
-    if ((forceUpdate || import3.checkBinding(throwOnChange,this._expr_2,currValue))) {
-      this._changed = true;
-      this.context.sorting = currValue;
-      this._expr_2 = currValue;
-    }
-  }
-  check_filters(currValue:any,throwOnChange:boolean,forceUpdate:boolean):void {
-    if ((forceUpdate || import3.checkBinding(throwOnChange,this._expr_3,currValue))) {
-      this._changed = true;
-      this.context.filters = currValue;
-      this._expr_3 = currValue;
-    }
-  }
-  check_paging(currValue:any,throwOnChange:boolean,forceUpdate:boolean):void {
-    if ((forceUpdate || import3.checkBinding(throwOnChange,this._expr_4,currValue))) {
-      this._changed = true;
-      this.context.paging = currValue;
-      this._expr_4 = currValue;
-    }
-  }
-  ngDoCheck(view:import2.AppView<any>,el:any,throwOnChange:boolean):boolean {
-    var changed:any = this._changed;
-    this._changed = false;
-    if (!throwOnChange) { if ((view.numberOfChecks === 0)) { this.context.ngOnInit(); } }
-    return changed;
-  }
-  checkHost(view:import2.AppView<any>,componentView:import2.AppView<any>,el:any,throwOnChange:boolean):void {
-  }
-  handleEvent(eventName:string,$event:any):boolean {
-    var result:boolean = true;
-    return result;
-  }
-  subscribe(view:import2.AppView<any>,_eventHandler:any,emit0:boolean):void {
-    this._eventHandler = _eventHandler;
-    if (emit0) { (this.subscription0 = this.context.error.subscribe(_eventHandler.bind(view,'error'))); }
-  }
+import * as import0 from '@angular/core';
+import * as import1 from './list';
+const styles_ListComponent:any[] = ([] as any[]);
+export const RenderType_ListComponent:import0.RendererTypeV2 = import0.ɵcrt({
+  encapsulation: 2,
+  styles: styles_ListComponent,
+  data: {}
 }
-var renderType_ListComponent_Host:import4.RenderComponentType = import3.createRenderComponentType('',0,import5.ViewEncapsulation.None,([] as any[]),{});
-class View_ListComponent_Host0 extends import2.AppView<any> {
-  _el_0:any;
-  compView_0:import2.AppView<import0.ListComponent>;
-  _ListComponent_0_3:Wrapper_ListComponent;
-  constructor(viewUtils:import3.ViewUtils,parentView:import2.AppView<any>,parentIndex:number,parentElement:any) {
-    super(View_ListComponent_Host0,renderType_ListComponent_Host,import6.ViewType.HOST,viewUtils,parentView,parentIndex,parentElement,import7.ChangeDetectorStatus.CheckAlways);
-  }
-  createInternal(rootSelector:string):import8.ComponentRef<any> {
-    this._el_0 = import3.selectOrCreateRenderHostElement(this.renderer,'cruddle-list',import3.EMPTY_INLINE_ARRAY,rootSelector,(null as any));
-    this.compView_0 = new View_ListComponent0(this.viewUtils,this,0,this._el_0);
-    this._ListComponent_0_3 = new Wrapper_ListComponent();
-    this.compView_0.create(this._ListComponent_0_3.context);
-    this.init(this._el_0,((<any>this.renderer).directRenderer? (null as any): [this._el_0]),(null as any));
-    return new import8.ComponentRef_<any>(0,this,this._el_0,this._ListComponent_0_3.context);
-  }
-  injectorGetInternal(token:any,requestNodeIndex:number,notFoundResult:any):any {
-    if (((token === import0.ListComponent) && (0 === requestNodeIndex))) { return this._ListComponent_0_3.context; }
-    return notFoundResult;
-  }
-  detectChangesInternal(throwOnChange:boolean):void {
-    this._ListComponent_0_3.ngDoCheck(this,this._el_0,throwOnChange);
-    this.compView_0.internalDetectChanges(throwOnChange);
-  }
-  destroyInternal():void {
-    this.compView_0.destroy();
-    this._ListComponent_0_3.ngOnDestroy();
-  }
-  visitRootNodesInternal(cb:any,ctx:any):void {
-    cb(this._el_0,ctx);
-  }
-  visitProjectableNodesInternal(nodeIndex:number,ngContentIndex:number,cb:any,ctx:any):void {
-    if (((nodeIndex == 0) && (ngContentIndex == 0))) {  }
-  }
+);
+export function View_ListComponent_0():import0.ɵViewDefinition {
+  return import0.ɵvid(0,[
+    import0.ɵted((null as any),['\n    ']),
+      import0.ɵeld(0,(null as any),(null as any),3,'div',[[
+        'class',
+        'cruddle-list'
+      ]
+    ],(null as any),(null as any),(null as any),(null as any),(null as any)),
+    import0.ɵted((null as any),['\n      ']),
+    import0.ɵncd((null as any),0),
+    import0.ɵted((null as any),['\n    ']),
+    import0.ɵted((null as any),['\n  '])
+  ]
+  ,(null as any),(null as any));
 }
-export const ListComponentNgFactory:import8.ComponentFactory<import0.ListComponent> = new import8.ComponentFactory<import0.ListComponent>('cruddle-list',View_ListComponent_Host0,import0.ListComponent);
-const styles_ListComponent:any[] = ([] as any[]);
-var renderType_ListComponent:import4.RenderComponentType = import3.createRenderComponentType('',1,import5.ViewEncapsulation.None,styles_ListComponent,{});
-export class View_ListComponent0 extends import2.AppView<import0.ListComponent> {
-  _text_0:any;
-  _el_1:any;
-  _text_2:any;
-  _text_3:any;
-  _text_4:any;
-  constructor(viewUtils:import3.ViewUtils,parentView:import2.AppView<any>,parentIndex:number,parentElement:any) {
-    super(View_ListComponent0,renderType_ListComponent,import6.ViewType.COMPONENT,viewUtils,parentView,parentIndex,parentElement,import7.ChangeDetectorStatus.CheckAlways);
-  }
-  createInternal(rootSelector:string):import8.ComponentRef<any> {
-    const parentRenderNode:any = this.renderer.createViewRoot(this.parentElement);
-    this._text_0 = this.renderer.createText(parentRenderNode,'\n    ',(null as any));
-    this._el_1 = import3.createRenderElement(this.renderer,parentRenderNode,'div',new import3.InlineArray2(2,'class','cruddle-list'),(null as any));
-    this._text_2 = this.renderer.createText(this._el_1,'\n      ',(null as any));
-    this.projectNodes(this._el_1,0);
-    this._text_3 = this.renderer.createText(this._el_1,'\n    ',(null as any));
-    this._text_4 = this.renderer.createText(parentRenderNode,'\n  ',(null as any));
-    this.init((null as any),((<any>this.renderer).directRenderer? (null as any): [
-      this._text_0,
-      this._el_1,
-      this._text_2,
-      this._text_3,
-      this._text_4
-    ]
-    ),(null as any));
-    return (null as any);
-  }
-}
+const RenderType_ListComponent_Host:import0.RendererTypeV2 = import0.ɵcrt({
+  encapsulation: 2,
+  styles: ([] as any[]),
+  data: {}
+}
+);
+function View_ListComponent_Host_0():import0.ɵViewDefinition {
+  return import0.ɵvid(0,[
+    import0.ɵeld(0,(null as any),(null as any),1,'cruddle-list',([] as any[]),(null as any),(null as any),(null as any),View_ListComponent_0,RenderType_ListComponent),
+    import0.ɵdid(57344,(null as any),0,import1.ListComponent,([] as any[]),(null as any),(null as any))
+  ]
+  ,(check,view) => {
+    check(view,1,0);
+  },(null as any));
+}
+export const ListComponentNgFactory:import0.ComponentFactory<import1.ListComponent> = import0.ɵccf('cruddle-list',import1.ListComponent,View_ListComponent_Host_0);

src/components/list.ngsummary.json

@@ -1,1 +0,1 @@
-{"summaries":[{"symbol":{"__symbol":0},"metadata":{"__symbolic":"class"},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0},"diDeps":[],"lifecycleHooks":[0]},"isComponent":true,"selector":"cruddle-list","inputs":{"def":"def","data":"data","sorting":"sorting","filters":"filters","paging":"paging"},"outputs":{"error":"error"},"hostListeners":{},"hostProperties":{},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[],"entryComponents":[],"changeDetection":1,"template":{"animations":[],"ngContentSelectors":["*"],"encapsulation":2}}}],"symbols":[{"__symbol":0,"name":"ListComponent","filePath":"/home/zack/dev/cruddle/src/components/list.d.ts"}]}
+{"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class"},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[0]},"isComponent":true,"selector":"cruddle-list","inputs":{"def":"def","data":"data","state":"state"},"outputs":{"error":"error"},"hostListeners":{},"hostProperties":{},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[],"viewQueries":[],"entryComponents":[],"changeDetection":1,"template":{"animations":[],"ngContentSelectors":["*"],"encapsulation":2},"componentViewType":{"__symbol":1,"members":[]},"rendererType":{"__symbol":2,"members":[]},"componentFactory":{"__symbol":3,"members":[]}}}],"symbols":[{"__symbol":0,"name":"ListComponent","filePath":"/home/zack/dev/cruddle/src/components/list.d.ts"},{"__symbol":1,"name":"View_ListComponent_0","filePath":"/home/zack/dev/cruddle/src/components/list.ngfactory.d.ts"},{"__symbol":2,"name":"RenderType_ListComponent","filePath":"/home/zack/dev/cruddle/src/components/list.ngfactory.d.ts"},{"__symbol":3,"name":"ListComponentNgFactory","filePath":"/home/zack/dev/cruddle/src/components/list.ngfactory.d.ts"}]}

src/components/list.ts

@@ -5,4 +5,4 @@ import * as _ from 'lodash';
 
-import { ListDefinition, SortState, FilterState,
-         PagingState, SortOrder } from '../definitions/list';
+import { ListDefinition, ListState, ListMode,
+         FilterState, SortOrder } from '../definitions/list';
 
@@ -27,11 +27,5 @@ /**
 
-  /** Any sorting to apply to the list. */
-  @Input() sorting: SortState[];
+  /** The state of the list. */
+  @Input() state: ListState;
 
-  /** Any filters to apply to the list. */
-  @Input() filters: FilterState[];
-
-  /** The pagination state for the list. */
-  @Input() paging: PagingState;
-
   /** Emits errors during refreshing the list. */
@@ -42,9 +36,11 @@ @Output() error = new EventEmitter();
   ngOnInit() {
-    if (!Array.isArray(this.sorting)) {
-      this.sorting = [];
-    }
+    this.state = {
+      filters: [],
+      sorting: [],
+      visible: [],
 
-    if (!Array.isArray(this.filters)) {
-      this.filters = [];
-    }
+      ... this.state
+    };
+
+    this.refreshVisibility();
   }
@@ -55,6 +51,7 @@
    *
-   * @param refresh Whether or not to refresh the lsit after. Defaults to true.
+   * @param refresh Whether or not to refresh the list after. Defaults to true.
    */
   clearSorting(refresh: boolean = true) {
-    this.sorting = [];
+    this.state.sorting = [];
+    this.refreshVisibility();
 
@@ -69,6 +66,7 @@ if (refresh) {
    *
-   * @param refresh Whether or not to refresh the lsit after. Defaults to true.
+   * @param refresh Whether or not to refresh the list after. Defaults to true.
    */
   clearFiltering(refresh: boolean = true) {
-    this.filters = [];
+    this.state.filters = [];
+    this.refreshVisibility();
 
@@ -86,8 +84,8 @@ if (refresh) {
    * @param order The sort order. Defaults to ascending.
-   * @param refresh Whether or not to refresh the lsit after. Defaults to true.
+   * @param refresh Whether or not to refresh the list after. Defaults to true.
    */
-  sort(map: (props: ModelProperties<any>) => Property<any>, order?: SortOrder, refresh: boolean  = true) {
+  sort(map: (props: ModelProperties<any>) => Property<any>, order?: SortOrder, refresh: boolean = true) {
     let props = getProperties(this.def.model);
     let prop = map(props);
-    let sorting = _.filter(this.sorting, s => s.prop.toString() !== prop.toString());
+    let sorting = _.filter(this.state.sorting, s => s.prop.toString() !== prop.toString());
 
@@ -98,3 +96,4 @@ if (!order) {
 
-    this.sorting.push({ prop, order });
+    this.state.sorting = sorting.concat([{ prop, order }]);
+    this.refreshVisibility();
 
@@ -120,3 +119,4 @@ if (refresh) {
 
-    this.filters.push({ prop, ... filter as FilterState });
+    this.state.filters.push({ prop, ... filter as FilterState });
+    this.refreshVisibility();
 
@@ -139,3 +139,4 @@ if (refresh) {
   removeFilter(filter: FilterState, refresh: boolean = true) {
-    this.filters = _.without(this.filters, filter);
+    this.state.filters = _.without(this.state.filters, filter);
+    this.refreshVisibility();
 
@@ -153,3 +154,3 @@ if (refresh) {
   hasPaging(): boolean {
-    return this.paging && typeof (this.paging) === 'object';
+    return this.state.paging && typeof (this.state.paging) === 'object';
   }
@@ -166,3 +167,3 @@
     if (this.hasPaging()) {
-      let paging = this.paging;
+      let paging = this.state.paging;
 
@@ -172,2 +173,4 @@ paging.page = Math.max(Math.min(page, paging.numPages), 1);
 
+    this.refreshVisibility();
+
     if (refresh) {
@@ -179,2 +182,18 @@ this.refresh();
   /**
+   * Set the current view mode of the list.
+   *
+   * @param mode The view mode ID. This should correspond to a mode
+   *             ID on the list definition.
+   * @param refresh Whether or not to refresh the list after. Defaults to true.
+   */
+  setMode(mode: ListMode, refresh: boolean = true) {
+    this.state.mode = mode.id;
+    this.refreshVisibility();
+
+    if (refresh) {
+      this.refresh();
+    }
+  }
+
+  /**
    * Move to the next page.
@@ -187,3 +206,3 @@ * This will do nothing if paging information has not been provided.
     if (this.hasPaging()) {
-      let paging = this.paging;
+      let paging = this.state.paging;
 
@@ -202,3 +221,3 @@ this.setPage(paging.page + 1, refresh);
     if (this.hasPaging()) {
-      let paging = this.paging;
+      let paging = this.state.paging;
 
@@ -221,3 +240,3 @@ this.setPage(paging.page - 1, refresh);
     this.def
-      .refresh(this.filters, this.sorting, this.paging)
+      .refresh(this.state)
       .then(data => {
@@ -230,2 +249,10 @@ self.data = data;
   }
+
+  /**
+   * Refresh the visible properties on the screen
+   * from the list state.
+   */
+  refreshVisibility() {
+    this.state.visible = this.def.visible(this.state, getProperties(this.def.model));
+  }
 }

src/components/read.ngfactory.ts

 /**
- * @fileoverview This file is generated by the Angular 2 template compiler.
+ * @fileoverview This file is generated by the Angular template compiler.
  * Do not edit.
@@ -8,120 +8,39 @@ * @suppress {suspiciousCode,uselessCode,missingProperties}
 
-import * as import0 from './read';
-import * as import1 from '@angular/core/src/change_detection/change_detection_util';
-import * as import2 from '@angular/core/src/linker/view';
-import * as import3 from '@angular/core/src/linker/view_utils';
-import * as import4 from '@angular/core/src/render/api';
-import * as import5 from '@angular/core/src/metadata/view';
-import * as import6 from '@angular/core/src/linker/view_type';
-import * as import7 from '@angular/core/src/change_detection/constants';
-import * as import8 from '@angular/core/src/linker/component_factory';
-export class Wrapper_ReadComponent {
-  /*private*/ _eventHandler:Function;
-  context:import0.ReadComponent;
-  /*private*/ _changed:boolean;
-  /*private*/ _expr_0:any;
-  /*private*/ _expr_1:any;
-  constructor() {
-    this._changed = false;
-    this.context = new import0.ReadComponent();
-    this._expr_0 = import1.UNINITIALIZED;
-    this._expr_1 = import1.UNINITIALIZED;
-  }
-  ngOnDetach(view:import2.AppView<any>,componentView:import2.AppView<any>,el:any):void {
-  }
-  ngOnDestroy():void {
-  }
-  check_def(currValue:any,throwOnChange:boolean,forceUpdate:boolean):void {
-    if ((forceUpdate || import3.checkBinding(throwOnChange,this._expr_0,currValue))) {
-      this._changed = true;
-      this.context.def = currValue;
-      this._expr_0 = currValue;
-    }
-  }
-  check_data(currValue:any,throwOnChange:boolean,forceUpdate:boolean):void {
-    if ((forceUpdate || import3.checkBinding(throwOnChange,this._expr_1,currValue))) {
-      this._changed = true;
-      this.context.data = currValue;
-      this._expr_1 = currValue;
-    }
-  }
-  ngDoCheck(view:import2.AppView<any>,el:any,throwOnChange:boolean):boolean {
-    var changed:any = this._changed;
-    this._changed = false;
-    return changed;
-  }
-  checkHost(view:import2.AppView<any>,componentView:import2.AppView<any>,el:any,throwOnChange:boolean):void {
-  }
-  handleEvent(eventName:string,$event:any):boolean {
-    var result:boolean = true;
-    return result;
-  }
-  subscribe(view:import2.AppView<any>,_eventHandler:any):void {
-    this._eventHandler = _eventHandler;
-  }
+import * as import0 from '@angular/core';
+import * as import1 from './read';
+const styles_ReadComponent:any[] = ([] as any[]);
+export const RenderType_ReadComponent:import0.RendererTypeV2 = import0.ɵcrt({
+  encapsulation: 2,
+  styles: styles_ReadComponent,
+  data: {}
 }
-var renderType_ReadComponent_Host:import4.RenderComponentType = import3.createRenderComponentType('',0,import5.ViewEncapsulation.None,([] as any[]),{});
-class View_ReadComponent_Host0 extends import2.AppView<any> {
-  _el_0:any;
-  compView_0:import2.AppView<import0.ReadComponent>;
-  _ReadComponent_0_3:Wrapper_ReadComponent;
-  constructor(viewUtils:import3.ViewUtils,parentView:import2.AppView<any>,parentIndex:number,parentElement:any) {
-    super(View_ReadComponent_Host0,renderType_ReadComponent_Host,import6.ViewType.HOST,viewUtils,parentView,parentIndex,parentElement,import7.ChangeDetectorStatus.CheckAlways);
-  }
-  createInternal(rootSelector:string):import8.ComponentRef<any> {
-    this._el_0 = import3.selectOrCreateRenderHostElement(this.renderer,'cruddle-read',import3.EMPTY_INLINE_ARRAY,rootSelector,(null as any));
-    this.compView_0 = new View_ReadComponent0(this.viewUtils,this,0,this._el_0);
-    this._ReadComponent_0_3 = new Wrapper_ReadComponent();
-    this.compView_0.create(this._ReadComponent_0_3.context);
-    this.init(this._el_0,((<any>this.renderer).directRenderer? (null as any): [this._el_0]),(null as any));
-    return new import8.ComponentRef_<any>(0,this,this._el_0,this._ReadComponent_0_3.context);
-  }
-  injectorGetInternal(token:any,requestNodeIndex:number,notFoundResult:any):any {
-    if (((token === import0.ReadComponent) && (0 === requestNodeIndex))) { return this._ReadComponent_0_3.context; }
-    return notFoundResult;
-  }
-  detectChangesInternal(throwOnChange:boolean):void {
-    this._ReadComponent_0_3.ngDoCheck(this,this._el_0,throwOnChange);
-    this.compView_0.internalDetectChanges(throwOnChange);
-  }
-  destroyInternal():void {
-    this.compView_0.destroy();
-  }
-  visitRootNodesInternal(cb:any,ctx:any):void {
-    cb(this._el_0,ctx);
-  }
-  visitProjectableNodesInternal(nodeIndex:number,ngContentIndex:number,cb:any,ctx:any):void {
-    if (((nodeIndex == 0) && (ngContentIndex == 0))) {  }
-  }
+);
+export function View_ReadComponent_0():import0.ɵViewDefinition {
+  return import0.ɵvid(0,[
+    import0.ɵted((null as any),['\n    ']),
+      import0.ɵeld(0,(null as any),(null as any),3,'div',[[
+        'class',
+        'cruddle-read'
+      ]
+    ],(null as any),(null as any),(null as any),(null as any),(null as any)),
+    import0.ɵted((null as any),['\n      ']),
+    import0.ɵncd((null as any),0),
+    import0.ɵted((null as any),['\n    ']),
+    import0.ɵted((null as any),['\n  '])
+  ]
+  ,(null as any),(null as any));
 }
-export const ReadComponentNgFactory:import8.ComponentFactory<import0.ReadComponent> = new import8.ComponentFactory<import0.ReadComponent>('cruddle-read',View_ReadComponent_Host0,import0.ReadComponent);
-const styles_ReadComponent:any[] = ([] as any[]);
-var renderType_ReadComponent:import4.RenderComponentType = import3.createRenderComponentType('',1,import5.ViewEncapsulation.None,styles_ReadComponent,{});
-export class View_ReadComponent0 extends import2.AppView<import0.ReadComponent> {
-  _text_0:any;
-  _el_1:any;
-  _text_2:any;
-  _text_3:any;
-  _text_4:any;
-  constructor(viewUtils:import3.ViewUtils,parentView:import2.AppView<any>,parentIndex:number,parentElement:any) {
-    super(View_ReadComponent0,renderType_ReadComponent,import6.ViewType.COMPONENT,viewUtils,parentView,parentIndex,parentElement,import7.ChangeDetectorStatus.CheckAlways);
-  }
-  createInternal(rootSelector:string):import8.ComponentRef<any> {
-    const parentRenderNode:any = this.renderer.createViewRoot(this.parentElement);
-    this._text_0 = this.renderer.createText(parentRenderNode,'\n    ',(null as any));
-    this._el_1 = import3.createRenderElement(this.renderer,parentRenderNode,'div',new import3.InlineArray2(2,'class','cruddle-read'),(null as any));
-    this._text_2 = this.renderer.createText(this._el_1,'\n      ',(null as any));
-    this.projectNodes(this._el_1,0);
-    this._text_3 = this.renderer.createText(this._el_1,'\n    ',(null as any));
-    this._text_4 = this.renderer.createText(parentRenderNode,'\n  ',(null as any));
-    this.init((null as any),((<any>this.renderer).directRenderer? (null as any): [
-      this._text_0,
-      this._el_1,
-      this._text_2,
-      this._text_3,
-      this._text_4
-    ]
-    ),(null as any));
-    return (null as any);
-  }
-}
+const RenderType_ReadComponent_Host:import0.RendererTypeV2 = import0.ɵcrt({
+  encapsulation: 2,
+  styles: ([] as any[]),
+  data: {}
+}
+);
+function View_ReadComponent_Host_0():import0.ɵViewDefinition {
+  return import0.ɵvid(0,[
+    import0.ɵeld(0,(null as any),(null as any),1,'cruddle-read',([] as any[]),(null as any),(null as any),(null as any),View_ReadComponent_0,RenderType_ReadComponent),
+    import0.ɵdid(24576,(null as any),0,import1.ReadComponent,([] as any[]),(null as any),(null as any))
+  ]
+  ,(null as any),(null as any));
+}
+export const ReadComponentNgFactory:import0.ComponentFactory<import1.ReadComponent> = import0.ɵccf('cruddle-read',import1.ReadComponent,View_ReadComponent_Host_0);

src/components/read.ngsummary.json

@@ -1,1 +0,1 @@
-{"summaries":[{"symbol":{"__symbol":0},"metadata":{"__symbolic":"class"},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0},"diDeps":[],"lifecycleHooks":[]},"isComponent":true,"selector":"cruddle-read","inputs":{"def":"def","data":"data"},"outputs":{},"hostListeners":{},"hostProperties":{},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[],"entryComponents":[],"changeDetection":1,"template":{"animations":[],"ngContentSelectors":["*"],"encapsulation":2}}}],"symbols":[{"__symbol":0,"name":"ReadComponent","filePath":"/home/zack/dev/cruddle/src/components/read.d.ts"}]}
+{"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class"},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[]},"isComponent":true,"selector":"cruddle-read","inputs":{"def":"def","data":"data"},"outputs":{},"hostListeners":{},"hostProperties":{},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[],"viewQueries":[],"entryComponents":[],"changeDetection":1,"template":{"animations":[],"ngContentSelectors":["*"],"encapsulation":2},"componentViewType":{"__symbol":1,"members":[]},"rendererType":{"__symbol":2,"members":[]},"componentFactory":{"__symbol":3,"members":[]}}}],"symbols":[{"__symbol":0,"name":"ReadComponent","filePath":"/home/zack/dev/cruddle/src/components/read.d.ts"},{"__symbol":1,"name":"View_ReadComponent_0","filePath":"/home/zack/dev/cruddle/src/components/read.ngfactory.d.ts"},{"__symbol":2,"name":"RenderType_ReadComponent","filePath":"/home/zack/dev/cruddle/src/components/read.ngfactory.d.ts"},{"__symbol":3,"name":"ReadComponentNgFactory","filePath":"/home/zack/dev/cruddle/src/components/read.ngfactory.d.ts"}]}

src/definitions/base.ts

@@ -100,2 +100,8 @@ import { Property, Model, ModelConstructor,
 
+  /** The plural form of the model name, in lower camel-case. */
+  plural: string;
+
+  /** The singular form of the model name, in lower camel-case. */
+  singular: string;
+
   /**
@@ -102,0 +108,0 @@ * The actions that can be done on the model.

src/definitions/index.ngsummary.json

@@ -1,1 +0,1 @@
-{"summaries":[{"symbol":{"__symbol":0},"metadata":{"__symbol":1}},{"symbol":{"__symbol":2},"metadata":{"__symbol":3}},{"symbol":{"__symbol":4},"metadata":{"__symbol":5}}],"symbols":[{"__symbol":0,"name":"SortOrder","filePath":"/home/zack/dev/cruddle/src/definitions/index.d.ts"},{"__symbol":1,"name":"SortOrder","filePath":"/home/zack/dev/cruddle/src/definitions/list.d.ts"},{"__symbol":2,"name":"ASC","filePath":"/home/zack/dev/cruddle/src/definitions/index.d.ts"},{"__symbol":3,"name":"ASC","filePath":"/home/zack/dev/cruddle/src/definitions/list.d.ts"},{"__symbol":4,"name":"DESC","filePath":"/home/zack/dev/cruddle/src/definitions/index.d.ts"},{"__symbol":5,"name":"DESC","filePath":"/home/zack/dev/cruddle/src/definitions/list.d.ts"}]}
+{"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbol":1,"members":[]}},{"symbol":{"__symbol":2,"members":[]},"metadata":{"__symbol":3,"members":[]}},{"symbol":{"__symbol":4,"members":[]},"metadata":{"__symbol":5,"members":[]}}],"symbols":[{"__symbol":0,"name":"SortOrder","filePath":"/home/zack/dev/cruddle/src/definitions/index.d.ts"},{"__symbol":1,"name":"SortOrder","filePath":"/home/zack/dev/cruddle/src/definitions/list.d.ts"},{"__symbol":2,"name":"ASC","filePath":"/home/zack/dev/cruddle/src/definitions/index.d.ts"},{"__symbol":3,"name":"ASC","filePath":"/home/zack/dev/cruddle/src/definitions/list.d.ts"},{"__symbol":4,"name":"DESC","filePath":"/home/zack/dev/cruddle/src/definitions/index.d.ts"},{"__symbol":5,"name":"DESC","filePath":"/home/zack/dev/cruddle/src/definitions/list.d.ts"}]}

src/definitions/list.ngsummary.json

@@ -1,1 +0,1 @@
-{"summaries":[{"symbol":{"__symbol":0},"metadata":{"ASC":0,"DESC":1}},{"symbol":{"__symbol":1},"metadata":{"__symbolic":"select","expression":{"__symbol":0},"member":"ASC"}},{"symbol":{"__symbol":2},"metadata":{"__symbolic":"select","expression":{"__symbol":0},"member":"DESC"}}],"symbols":[{"__symbol":0,"name":"SortOrder","filePath":"/home/zack/dev/cruddle/src/definitions/list.d.ts"},{"__symbol":1,"name":"ASC","filePath":"/home/zack/dev/cruddle/src/definitions/list.d.ts"},{"__symbol":2,"name":"DESC","filePath":"/home/zack/dev/cruddle/src/definitions/list.d.ts"}]}
+{"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"ASC":0,"DESC":1}},{"symbol":{"__symbol":1,"members":[]},"metadata":{"__symbolic":"select","expression":{"__symbol":0,"members":[]},"member":"ASC"}},{"symbol":{"__symbol":2,"members":[]},"metadata":{"__symbolic":"select","expression":{"__symbol":0,"members":[]},"member":"DESC"}}],"symbols":[{"__symbol":0,"name":"SortOrder","filePath":"/home/zack/dev/cruddle/src/definitions/list.d.ts"},{"__symbol":1,"name":"ASC","filePath":"/home/zack/dev/cruddle/src/definitions/list.d.ts"},{"__symbol":2,"name":"DESC","filePath":"/home/zack/dev/cruddle/src/definitions/list.d.ts"}]}

src/definitions/list.ts

@@ -18,2 +18,17 @@ import * as _ from 'lodash';
 
+/** A view mode for the list. */
+export interface ListMode {
+  /**
+   * The ID of the view mode.
+   * This is what is actually stored on the list state.
+   */
+  id: string;
+
+  /** The style of the view mode. */
+  style: string;
+
+  /** The label of the view mode. */
+  label: string;
+}
+
 /** The state of sorting a property on a list. */
@@ -60,2 +75,25 @@ export interface SortState {
 
+/** The total state of the list. */
+export interface ListState {
+  /** The filter state of the list. */
+  filters: FilterState[];
+
+  /** The sorting state of the list. */
+  sorting: SortState[];
+
+  /** The pagination state of the list. */
+  paging?: PagingState;
+
+  /**
+   * Properties of the relevant model that have been
+   * selected to be visible. If the list definition
+   * has no custom `visible` function, this will default
+   * to all fields.
+   */
+  visible: Property<any>[];
+
+  /** The current list view mode. */
+  mode?: string;
+}
+
 /**
@@ -67,7 +105,14 @@ * The definition of a list component.
 export interface ListDefinition<T extends Model> extends BaseDefinition<T> {
+  /** The list view modes. */
+  modes: ListMode[];
+
   /** The callback for refreshing the list data from the current list state. */
-  refresh(filters: FilterState[], sorting: SortState[], paging: PagingState): Promise<T[]>;
+  refresh(state: ListState): Promise<T[]>;
 
-  /** Select the properties that should be visible on the list. */
-  visible(props: ModelProperties<T>): [Property<any>];
+  /**
+   * Select the properties that should be visible on the list
+   * based off the list state. This is automatically called whenever
+   * the list state changes.
+   */
+  visible?(state: ListState, props: ModelProperties<T>): [Property<any>];
 }

src/helpers.ngsummary.json

@@ -1,1 +0,1 @@
-{"summaries":[{"symbol":{"__symbol":0},"metadata":{"__symbolic":"class"}}],"symbols":[{"__symbol":0,"name":"Definitions","filePath":"/home/zack/dev/cruddle/src/helpers.d.ts"}]}
+{"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class"}}],"symbols":[{"__symbol":0,"name":"Definitions","filePath":"/home/zack/dev/cruddle/src/helpers.d.ts"}]}

src/helpers.ts

@@ -1,5 +0,8 @@
-import { getProperties, Model, ModelConstructor, Property, Attribute, Association } from 'modelsafe';
+import * as _ from 'lodash';
+import { pluralize, singularize } from 'inflection';
+import { getProperties, getModelOptions, Model, ModelConstructor, ModelProperties,
+         Property, Attribute, Association } from 'modelsafe';
 
 import { BaseDefinition, DeleteDefinition, FormDefinition,
-         ListDefinition, ReadDefinition } from './definitions';
+         ListDefinition, ReadDefinition, ListState } from './definitions';
 import { getLabel, getFilterable, getSortable } from './metadata';
@@ -19,2 +22,5 @@
   protected static base<T extends Model>(model: ModelConstructor<T>, overrides?: Partial<BaseDefinition<T>>): BaseDefinition<T> {
+    let options = getModelOptions(model);
+    let singular = singularize(_.camelCase(options.name));
+    let plural = pluralize(_.camelCase(options.name));
     let props = getProperties(model);
@@ -64,2 +70,4 @@ let attrs = [];
       model,
+      singular,
+      plural,
       attrs,
@@ -135,2 +143,10 @@ assocs,
       ... base,
+
+      modes: [],
+
+      /** The default visibility selector. It displays everything. */
+      visible(state: ListState, props: ModelProperties<T>): Property<any>[] {
+        return _.values(props);
+      },
+
       ... overrides
@@ -137,0 +153,0 @@ } as ListDefinition<T>;

src/index.ngsummary.json

@@ -1,1 +0,1 @@
-{"summaries":[{"symbol":{"__symbol":0},"metadata":{"__symbol":1}},{"symbol":{"__symbol":2},"metadata":{"__symbol":3}},{"symbol":{"__symbol":4},"metadata":{"__symbol":5}},{"symbol":{"__symbol":6},"metadata":{"__symbol":7}},{"symbol":{"__symbol":8},"metadata":{"__symbol":9}},{"symbol":{"__symbol":10},"metadata":{"__symbol":11}},{"symbol":{"__symbol":12},"metadata":{"__symbol":13}},{"symbol":{"__symbol":14},"metadata":{"__symbol":15}},{"symbol":{"__symbol":16},"metadata":{"__symbol":17}},{"symbol":{"__symbol":18},"metadata":{"__symbol":19}},{"symbol":{"__symbol":20},"metadata":{"__symbol":21}},{"symbol":{"__symbol":22},"metadata":{"__symbol":23}},{"symbol":{"__symbol":24},"metadata":{"__symbol":25}},{"symbol":{"__symbol":26},"metadata":{"__symbol":27}},{"symbol":{"__symbol":28},"metadata":{"__symbol":29}},{"symbol":{"__symbol":30},"metadata":{"__symbol":31}},{"symbol":{"__symbol":32},"metadata":{"__symbol":33}},{"symbol":{"__symbol":34},"metadata":{"__symbol":35}}],"symbols":[{"__symbol":0,"name":"DeleteComponent","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":1,"name":"DeleteComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":2,"name":"FormComponent","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":3,"name":"FormComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":4,"name":"ListComponent","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":5,"name":"ListComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":6,"name":"ReadComponent","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":7,"name":"ReadComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":8,"name":"SortOrder","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":9,"name":"SortOrder","filePath":"/home/zack/dev/cruddle/src/definitions/index.d.ts"},{"__symbol":10,"name":"ASC","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":11,"name":"ASC","filePath":"/home/zack/dev/cruddle/src/definitions/index.d.ts"},{"__symbol":12,"name":"DESC","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":13,"name":"DESC","filePath":"/home/zack/dev/cruddle/src/definitions/index.d.ts"},{"__symbol":14,"name":"Definitions","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":15,"name":"Definitions","filePath":"/home/zack/dev/cruddle/src/helpers.d.ts"},{"__symbol":16,"name":"MODEL_ATTR_LABEL_META_KEY","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":17,"name":"MODEL_ATTR_LABEL_META_KEY","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":18,"name":"MODEL_ATTR_SORTABLE_META_KEY","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":19,"name":"MODEL_ATTR_SORTABLE_META_KEY","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":20,"name":"MODEL_ATTR_FILTERABLE_META_KEY","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":21,"name":"MODEL_ATTR_FILTERABLE_META_KEY","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":22,"name":"defineLabel","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":23,"name":"defineLabel","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":24,"name":"defineFilterable","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":25,"name":"defineFilterable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":26,"name":"defineSortable","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":27,"name":"defineSortable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":28,"name":"getLabel","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":29,"name":"getLabel","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":30,"name":"getSortable","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":31,"name":"getSortable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":32,"name":"getFilterable","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":33,"name":"getFilterable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":34,"name":"CruddleModule","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":35,"name":"CruddleModule","filePath":"/home/zack/dev/cruddle/src/module.d.ts"}]}
+{"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbol":1,"members":[]}},{"symbol":{"__symbol":2,"members":[]},"metadata":{"__symbol":3,"members":[]}},{"symbol":{"__symbol":4,"members":[]},"metadata":{"__symbol":5,"members":[]}},{"symbol":{"__symbol":6,"members":[]},"metadata":{"__symbol":7,"members":[]}},{"symbol":{"__symbol":8,"members":[]},"metadata":{"__symbol":9,"members":[]}},{"symbol":{"__symbol":10,"members":[]},"metadata":{"__symbol":11,"members":[]}},{"symbol":{"__symbol":12,"members":[]},"metadata":{"__symbol":13,"members":[]}},{"symbol":{"__symbol":14,"members":[]},"metadata":{"__symbol":15,"members":[]}},{"symbol":{"__symbol":16,"members":[]},"metadata":{"__symbol":17,"members":[]}},{"symbol":{"__symbol":18,"members":[]},"metadata":{"__symbol":19,"members":[]}},{"symbol":{"__symbol":20,"members":[]},"metadata":{"__symbol":21,"members":[]}},{"symbol":{"__symbol":22,"members":[]},"metadata":{"__symbol":23,"members":[]}},{"symbol":{"__symbol":24,"members":[]},"metadata":{"__symbol":25,"members":[]}},{"symbol":{"__symbol":26,"members":[]},"metadata":{"__symbol":27,"members":[]}},{"symbol":{"__symbol":28,"members":[]},"metadata":{"__symbol":29,"members":[]}},{"symbol":{"__symbol":30,"members":[]},"metadata":{"__symbol":31,"members":[]}},{"symbol":{"__symbol":32,"members":[]},"metadata":{"__symbol":33,"members":[]}},{"symbol":{"__symbol":34,"members":[]},"metadata":{"__symbol":35,"members":[]}},{"symbol":{"__symbol":36,"members":[]},"metadata":{"__symbol":37,"members":[]}},{"symbol":{"__symbol":38,"members":[]},"metadata":{"__symbol":39,"members":[]}},{"symbol":{"__symbol":40,"members":[]},"metadata":{"__symbol":41,"members":[]}}],"symbols":[{"__symbol":0,"name":"DeleteComponent","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":1,"name":"DeleteComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":2,"name":"FormComponent","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":3,"name":"FormComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":4,"name":"ListComponent","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":5,"name":"ListComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":6,"name":"ReadComponent","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":7,"name":"ReadComponent","filePath":"/home/zack/dev/cruddle/src/components/index.d.ts"},{"__symbol":8,"name":"SortOrder","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":9,"name":"SortOrder","filePath":"/home/zack/dev/cruddle/src/definitions/index.d.ts"},{"__symbol":10,"name":"ASC","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":11,"name":"ASC","filePath":"/home/zack/dev/cruddle/src/definitions/index.d.ts"},{"__symbol":12,"name":"DESC","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":13,"name":"DESC","filePath":"/home/zack/dev/cruddle/src/definitions/index.d.ts"},{"__symbol":14,"name":"Definitions","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":15,"name":"Definitions","filePath":"/home/zack/dev/cruddle/src/helpers.d.ts"},{"__symbol":16,"name":"MODEL_ATTR_LABEL_META_KEY","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":17,"name":"MODEL_ATTR_LABEL_META_KEY","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":18,"name":"MODEL_ATTR_SORTABLE_META_KEY","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":19,"name":"MODEL_ATTR_SORTABLE_META_KEY","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":20,"name":"MODEL_ATTR_FILTERABLE_META_KEY","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":21,"name":"MODEL_ATTR_FILTERABLE_META_KEY","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":22,"name":"defineLabel","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":23,"name":"defineLabel","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":24,"name":"defineFilterable","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":25,"name":"defineFilterable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":26,"name":"defineSortable","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":27,"name":"defineSortable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":28,"name":"getLabel","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":29,"name":"getLabel","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":30,"name":"getSortable","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":31,"name":"getSortable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":32,"name":"getFilterable","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":33,"name":"getFilterable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":34,"name":"label","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":35,"name":"label","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":36,"name":"sortable","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":37,"name":"sortable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":38,"name":"filterable","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":39,"name":"filterable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":40,"name":"CruddleModule","filePath":"/home/zack/dev/cruddle/src/index.d.ts"},{"__symbol":41,"name":"CruddleModule","filePath":"/home/zack/dev/cruddle/src/module.d.ts"}]}

src/metadata.ngsummary.json

@@ -1,1 +0,1 @@
-{"summaries":[{"symbol":{"__symbol":0},"metadata":"cruddle:label"},{"symbol":{"__symbol":1},"metadata":"cruddle:sortable"},{"symbol":{"__symbol":2},"metadata":"cruddle:filterable"},{"symbol":{"__symbol":3},"metadata":{"__symbolic":"function"}},{"symbol":{"__symbol":4},"metadata":{"__symbolic":"function"}},{"symbol":{"__symbol":5},"metadata":{"__symbolic":"function"}},{"symbol":{"__symbol":6},"metadata":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbol":7},"member":"getMetadata"},"arguments":["cruddle:label",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}}},{"symbol":{"__symbol":8},"metadata":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbol":7},"member":"getMetadata"},"arguments":["cruddle:sortable",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}}},{"symbol":{"__symbol":9},"metadata":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbol":7},"member":"getMetadata"},"arguments":["cruddle:filterable",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}}}],"symbols":[{"__symbol":0,"name":"MODEL_ATTR_LABEL_META_KEY","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":1,"name":"MODEL_ATTR_SORTABLE_META_KEY","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":2,"name":"MODEL_ATTR_FILTERABLE_META_KEY","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":3,"name":"defineLabel","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":4,"name":"defineFilterable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":5,"name":"defineSortable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":6,"name":"getLabel","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":7,"name":"Reflect","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":8,"name":"getSortable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":9,"name":"getFilterable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"}]}
+{"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":"cruddle:label"},{"symbol":{"__symbol":1,"members":[]},"metadata":"cruddle:sortable"},{"symbol":{"__symbol":2,"members":[]},"metadata":"cruddle:filterable"},{"symbol":{"__symbol":3,"members":[]},"metadata":{"__symbolic":"function"}},{"symbol":{"__symbol":4,"members":[]},"metadata":{"__symbolic":"function"}},{"symbol":{"__symbol":5,"members":[]},"metadata":{"__symbolic":"function"}},{"symbol":{"__symbol":6,"members":[]},"metadata":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","member":"getMetadata"},"arguments":["cruddle:label",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}}},{"symbol":{"__symbol":7,"members":[]},"metadata":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","member":"getMetadata"},"arguments":["cruddle:sortable",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}}},{"symbol":{"__symbol":8,"members":[]},"metadata":{"__symbolic":"function","parameters":["ctor","key"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","member":"getMetadata"},"arguments":["cruddle:filterable",{"__symbolic":"select","expression":{"__symbolic":"reference","name":"ctor"},"member":"prototype"},{"__symbolic":"reference","name":"key"}]}}},{"symbol":{"__symbol":9,"members":[]},"metadata":{"__symbolic":"function","parameters":["value"],"value":{"__symbolic":"error","message":"Function call not supported","line":86,"character":9}}},{"symbol":{"__symbol":10,"members":[]},"metadata":{"__symbolic":"function","parameters":["value"],"value":{"__symbolic":"error","message":"Function call not supported","line":96,"character":9}}},{"symbol":{"__symbol":11,"members":[]},"metadata":{"__symbolic":"function","parameters":["value"],"value":{"__symbolic":"error","message":"Function call not supported","line":106,"character":9}}}],"symbols":[{"__symbol":0,"name":"MODEL_ATTR_LABEL_META_KEY","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":1,"name":"MODEL_ATTR_SORTABLE_META_KEY","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":2,"name":"MODEL_ATTR_FILTERABLE_META_KEY","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":3,"name":"defineLabel","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":4,"name":"defineFilterable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":5,"name":"defineSortable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":6,"name":"getLabel","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":7,"name":"getSortable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":8,"name":"getFilterable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":9,"name":"label","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":10,"name":"sortable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"},{"__symbol":11,"name":"filterable","filePath":"/home/zack/dev/cruddle/src/metadata.d.ts"}]}

src/metadata.ts

@@ -77,1 +77,33 @@ import 'reflect-metadata';
 }
+
+/**
+ * A decorator for attribute labels.
+ * By default attribute labels are the same as their key,
+ * which isn't very user-friendly. Labels can be manually
+ * provided using this decorator.
+ *
+ * @param value The attribute label.
+ */
+export function label(value: string) {
+  return (ctor: Object, key: string | symbol) => defineLabel(ctor, key, value);
+}
+
+/**
+ * A decorator for attribute sortability.
+ * By default attributes are not sortable.
+ *
+ * @param value Whether the attribute is sortable.
+ */
+export function sortable(value: boolean) {
+  return (ctor: Object, key: string | symbol) => defineSortable(ctor, key, value);
+}
+
+/**
+ * A decorator for attribute filterability.
+ * By default attributes are not filterable.
+ *
+ * @param value Whether the attribute is sortable.
+ */
+export function filterable(value: boolean) {
+  return (ctor: Object, key: string | symbol) => defineFilterable(ctor, key, value);
+}

src/module.ngfactory.ts

 /**
- * @fileoverview This file is generated by the Angular 2 template compiler.
+ * @fileoverview This file is generated by the Angular template compiler.
  * Do not edit.
@@ -8,17 +8,14 @@ * @suppress {suspiciousCode,uselessCode,missingProperties}
 
-import * as import0 from '@angular/core/src/linker/ng_module_factory';
+import * as import0 from '@angular/core';
 import * as import1 from './module';
-import * as import2 from '@angular/common/src/common_module';
-import * as import3 from '@angular/common/src/localization';
-import * as import4 from '@angular/core/src/di/injector';
-import * as import5 from '@angular/core/src/i18n/tokens';
-class CruddleModuleInjector extends import0.NgModuleInjector<import1.CruddleModule> {
+import * as import2 from '@angular/common';
+class CruddleModuleInjector extends import0.ɵNgModuleInjector<import1.CruddleModule> {
   _CommonModule_0:import2.CommonModule;
   _CruddleModule_1:import1.CruddleModule;
-  __NgLocalization_2:import3.NgLocaleLocalization;
-  constructor(parent:import4.Injector) {
+  __NgLocalization_2:import2.NgLocaleLocalization;
+  constructor(parent:import0.Injector) {
     super(parent,([] as any[]),([] as any[]));
   }
-  get _NgLocalization_2():import3.NgLocaleLocalization {
-    if ((this.__NgLocalization_2 == null)) { (this.__NgLocalization_2 = new import3.NgLocaleLocalization(this.parent.get(import5.LOCALE_ID))); }
+  get _NgLocalization_2():import2.NgLocaleLocalization {
+    if ((this.__NgLocalization_2 == null)) { (this.__NgLocalization_2 = new import2.NgLocaleLocalization(this.parent.get(import0.LOCALE_ID))); }
     return this.__NgLocalization_2;
@@ -34,3 +31,3 @@ }
     if ((token === import1.CruddleModule)) { return this._CruddleModule_1; }
-    if ((token === import3.NgLocalization)) { return this._NgLocalization_2; }
+    if ((token === import2.NgLocalization)) { return this._NgLocalization_2; }
     return notFoundResult;
@@ -41,2 +38,2 @@ }
 }
-export const CruddleModuleNgFactory:import0.NgModuleFactory<import1.CruddleModule> = new import0.NgModuleFactory(CruddleModuleInjector,import1.CruddleModule);
+export const CruddleModuleNgFactory:import0.NgModuleFactory<import1.CruddleModule> = new import0.NgModuleFactory<any>(CruddleModuleInjector,import1.CruddleModule);

src/module.ngsummary.json

@@ -1,1 +0,1 @@
-{"summaries":[{"symbol":{"__symbol":0},"metadata":{"__symbolic":"class"},"type":{"summaryKind":2,"type":{"reference":{"__symbol":0},"diDeps":[],"lifecycleHooks":[]},"entryComponents":[],"providers":[{"provider":{"token":{"identifier":{"reference":{"__symbol":1}}},"useClass":{"reference":{"__symbol":2},"diDeps":[{"isAttribute":false,"isHost":false,"isSelf":false,"isSkipSelf":false,"isOptional":false,"token":{"identifier":{"reference":{"__symbol":3}}}}],"lifecycleHooks":[]},"useFactory":null,"useExisting":null,"deps":[{"isAttribute":false,"isHost":false,"isSelf":false,"isSkipSelf":false,"isOptional":false,"token":{"identifier":{"reference":{"__symbol":3}}}}],"multi":false},"module":{"reference":{"__symbol":4},"diDeps":[],"lifecycleHooks":[]}}],"modules":[{"reference":{"__symbol":4},"diDeps":[],"lifecycleHooks":[]},{"reference":{"__symbol":0},"diDeps":[],"lifecycleHooks":[]}],"exportedDirectives":[{"reference":{"__symbol":5}},{"reference":{"__symbol":6}},{"reference":{"__symbol":7}},{"reference":{"__symbol":8}}],"exportedPipes":[]}}],"symbols":[{"__symbol":0,"name":"CruddleModule","filePath":"/home/zack/dev/cruddle/src/module.d.ts"},{"__symbol":1,"name":"NgLocalization","filePath":"/home/zack/dev/cruddle/node_modules/@angular/common/src/localization.d.ts"},{"__symbol":2,"name":"NgLocaleLocalization","filePath":"/home/zack/dev/cruddle/node_modules/@angular/common/src/localization.d.ts"},{"__symbol":3,"name":"LOCALE_ID","filePath":"/home/zack/dev/cruddle/node_modules/@angular/core/src/i18n/tokens.d.ts"},{"__symbol":4,"name":"CommonModule","filePath":"/home/zack/dev/cruddle/node_modules/@angular/common/src/common_module.d.ts"},{"__symbol":5,"name":"DeleteComponent","filePath":"/home/zack/dev/cruddle/src/components/delete.d.ts"},{"__symbol":6,"name":"FormComponent","filePath":"/home/zack/dev/cruddle/src/components/form.d.ts"},{"__symbol":7,"name":"ListComponent","filePath":"/home/zack/dev/cruddle/src/components/list.d.ts"},{"__symbol":8,"name":"ReadComponent","filePath":"/home/zack/dev/cruddle/src/components/read.d.ts"}]}
+{"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class"},"type":{"summaryKind":2,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[]},"entryComponents":[],"providers":[{"provider":{"token":{"identifier":{"reference":{"__symbol":1,"members":[]}}},"useClass":{"reference":{"__symbol":2,"members":[]},"diDeps":[{"isAttribute":false,"isHost":false,"isSelf":false,"isSkipSelf":false,"isOptional":false,"token":{"identifier":{"reference":{"__symbol":3,"members":[]}}}}],"lifecycleHooks":[]},"useFactory":null,"useExisting":null,"deps":[{"isAttribute":false,"isHost":false,"isSelf":false,"isSkipSelf":false,"isOptional":false,"token":{"identifier":{"reference":{"__symbol":3,"members":[]}}}}],"multi":false},"module":{"reference":{"__symbol":4,"members":[]},"diDeps":[],"lifecycleHooks":[]}}],"modules":[{"reference":{"__symbol":4,"members":[]},"diDeps":[],"lifecycleHooks":[]},{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[]}],"exportedDirectives":[{"reference":{"__symbol":5,"members":[]}},{"reference":{"__symbol":6,"members":[]}},{"reference":{"__symbol":7,"members":[]}},{"reference":{"__symbol":8,"members":[]}}],"exportedPipes":[]}}],"symbols":[{"__symbol":0,"name":"CruddleModule","filePath":"/home/zack/dev/cruddle/src/module.d.ts"},{"__symbol":1,"name":"NgLocalization","filePath":"/home/zack/dev/cruddle/node_modules/@angular/common/typings/common.d.ts"},{"__symbol":2,"name":"NgLocaleLocalization","filePath":"/home/zack/dev/cruddle/node_modules/@angular/common/typings/common.d.ts"},{"__symbol":3,"name":"LOCALE_ID","filePath":"/home/zack/dev/cruddle/node_modules/@angular/core/typings/core.d.ts"},{"__symbol":4,"name":"CommonModule","filePath":"/home/zack/dev/cruddle/node_modules/@angular/common/typings/common.d.ts"},{"__symbol":5,"name":"DeleteComponent","filePath":"/home/zack/dev/cruddle/src/components/delete.d.ts"},{"__symbol":6,"name":"FormComponent","filePath":"/home/zack/dev/cruddle/src/components/form.d.ts"},{"__symbol":7,"name":"ListComponent","filePath":"/home/zack/dev/cruddle/src/components/list.d.ts"},{"__symbol":8,"name":"ReadComponent","filePath":"/home/zack/dev/cruddle/src/components/read.d.ts"}]}

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

361391

increased by62.97%

Number of package files

113

increased by16.49%

Lines of code

2918

increased by22.66%

Worsened metrics

Dependency count

6

increased by50%

Dev dependency count

22

increased by4.76%

Dependency changes

• + Added@types/inflection@^1.5.28

• + Addedinflection@^1.12.0

• + Added@types/inflection@1.13.2(transitive)

• + Addedinflection@1.13.4(transitive)