@skyux/list-builder 7.0.0-beta.12 → 7.0.0-beta.13

package/documentation.json

@@ -6798,101 +6798,5 @@
       }
     ]
   },
-  "codeExamples": [
-    {
-      "fileName": "list-filters-demo.component.html",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-filters/inline-filters/list-filters-demo.component.html",
-      "rawContents": "<sky-list [data]=\"items\">\n  <sky-list-toolbar>\n    <sky-list-filter-inline>\n      <sky-list-filter-inline-item\n        defaultValue=\"any\"\n        name=\"fruitType\"\n        value=\"any\"\n        [filter]=\"fruitTypeFilterFunction\"\n      >\n        <ng-template let-filter=\"filter\">\n          <label class=\"sky-control-label\" [for]=\"fruitTypeSelect.id\">\n            Fruit type\n          </label>\n          <select\n            skyId\n            [ngModel]=\"filter.value\"\n            (ngModelChange)=\"filter.changed($event)\"\n            #fruitTypeSelect=\"skyId\"\n          >\n            <option value=\"any\">Any fruit</option>\n            <option value=\"citrus\">Citrus</option>\n            <option value=\"berry\">Berry</option>\n          </select>\n        </ng-template>\n      </sky-list-filter-inline-item>\n      <sky-list-filter-inline-item\n        name=\"hideOrange\"\n        [filter]=\"hideOrangeFilterFunction\"\n      >\n        <ng-template let-filter=\"filter\">\n          <sky-checkbox\n            [ngModel]=\"filter.value\"\n            (ngModelChange)=\"filter.changed($event)\"\n          >\n            <sky-checkbox-label> Hide orange fruits </sky-checkbox-label>\n          </sky-checkbox>\n        </ng-template>\n      </sky-list-filter-inline-item>\n    </sky-list-filter-inline>\n  </sky-list-toolbar>\n  <sky-list-view-grid>\n    <sky-grid-column field=\"name\" heading=\"Name\"> </sky-grid-column>\n    <sky-grid-column field=\"description\" heading=\"Description\">\n    </sky-grid-column>\n  </sky-list-view-grid>\n</sky-list>\n"
-    },
-    {
-      "fileName": "list-filters-demo.component.ts",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-filters/inline-filters/list-filters-demo.component.ts",
-      "rawContents": "import { Component } from '@angular/core';\nimport { ListItemModel } from '@skyux/list-builder-common';\n\nimport { Observable, of } from 'rxjs';\n\n@Component({\n  selector: 'app-list-filters-demo',\n  templateUrl: './list-filters-demo.component.html',\n})\nexport class ListFiltersDemoComponent {\n  public items: Observable<any> = of([\n    {\n      id: 0,\n      name: 'Orange',\n      description: 'A round, orange fruit.',\n      type: 'citrus',\n      color: 'orange',\n    },\n    {\n      id: 1,\n      name: 'Mango',\n      description: \"Delicious in smoothies, but don't eat the skin.\",\n      type: 'other',\n      color: 'orange',\n    },\n    {\n      id: 2,\n      name: 'Lime',\n      description: 'A sour, green fruit used in many drinks.',\n      type: 'citrus',\n      color: 'green',\n    },\n    {\n      id: 3,\n      name: 'Strawberry',\n      description: 'A red fruit that goes well with shortcake.',\n      type: 'berry',\n      color: 'red',\n    },\n    {\n      id: 4,\n      name: 'Blueberry',\n      description: 'A small, blue fruit often found in muffins.',\n      type: 'berry',\n      color: 'blue',\n    },\n  ]);\n\n  public fruitTypeFilterFunction(\n    item: ListItemModel,\n    filterValue: any\n  ): boolean {\n    return filterValue === 'any' || filterValue === item.data.type;\n  }\n\n  public hideOrangeFilterFunction(\n    item: ListItemModel,\n    filterValue: any\n  ): boolean {\n    return !filterValue || (filterValue && item.data.color !== 'orange');\n  }\n}\n"
-    },
-    {
-      "fileName": "list-filters-demo.module.ts",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-filters/inline-filters/list-filters-demo.module.ts",
-      "rawContents": "import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { SkyIdModule } from '@skyux/core';\nimport { SkyCheckboxModule } from '@skyux/forms';\nimport {\n  SkyListFiltersModule,\n  SkyListModule,\n  SkyListToolbarModule,\n} from '@skyux/list-builder';\nimport { SkyListViewGridModule } from '@skyux/list-builder-view-grids';\nimport { SkyFilterModule } from '@skyux/lists';\n\nimport { ListFiltersDemoComponent } from './list-filters-demo.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    FormsModule,\n    SkyCheckboxModule,\n    SkyFilterModule,\n    SkyIdModule,\n    SkyListFiltersModule,\n    SkyListModule,\n    SkyListToolbarModule,\n    SkyListViewGridModule,\n  ],\n  declarations: [ListFiltersDemoComponent],\n  exports: [ListFiltersDemoComponent],\n})\nexport class ListFiltersDemoModule {}\n"
-    },
-    {
-      "fileName": "list-filters-demo-modal-context.ts",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-filters/modal-filters/list-filters-demo-modal-context.ts",
-      "rawContents": "export class ListFiltersDemoModalContext {\n  public appliedFilters: any[];\n}\n"
-    },
-    {
-      "fileName": "list-filters-demo-modal.component.html",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-filters/modal-filters/list-filters-demo-modal.component.html",
-      "rawContents": "<sky-modal>\n  <sky-modal-header>\n    {{ headerText }}\n  </sky-modal-header>\n  <sky-modal-content>\n    <label class=\"sky-control-label\" [for]=\"fruitTypeSelect.id\">\n      Fruit type\n    </label>\n    <select\n      class=\"sky-form-control\"\n      skyId\n      [(ngModel)]=\"fruitType\"\n      #fruitTypeSelect=\"skyId\"\n    >\n      <option value=\"any\">Any fruit</option>\n      <option value=\"citrus\">Citrus</option>\n      <option value=\"berry\">Berry</option>\n    </select>\n    <div style=\"margin-top: 15px\">\n      <sky-checkbox [(ngModel)]=\"hideOrange\">\n        <sky-checkbox-label> Hide orange fruits </sky-checkbox-label>\n      </sky-checkbox>\n    </div>\n  </sky-modal-content>\n  <sky-modal-footer>\n    <button\n      class=\"sky-btn sky-btn-primary\"\n      type=\"button\"\n      (click)=\"applyFilters()\"\n    >\n      Apply\n    </button>\n    <button\n      class=\"sky-btn sky-btn-link\"\n      type=\"button\"\n      (click)=\"clearAllFilters()\"\n    >\n      Clear filters\n    </button>\n    <button class=\"sky-btn sky-btn-link\" type=\"button\" (click)=\"cancel()\">\n      Cancel\n    </button>\n  </sky-modal-footer>\n</sky-modal>\n"
-    },
-    {
-      "fileName": "list-filters-demo-modal.component.ts",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-filters/modal-filters/list-filters-demo-modal.component.ts",
-      "rawContents": "import { Component } from '@angular/core';\nimport { ListFilterModel } from '@skyux/list-builder';\nimport { ListItemModel } from '@skyux/list-builder-common';\nimport { SkyModalInstance } from '@skyux/modals';\n\nimport { ListFiltersDemoModalContext } from './list-filters-demo-modal-context';\n\n@Component({\n  selector: 'app-demo-filter-modal-form',\n  templateUrl: './list-filters-demo-modal.component.html',\n})\nexport class ListFilterDemoModalComponent {\n  public fruitType = 'any';\n\n  public hideOrange: boolean;\n\n  public headerText = 'Filters';\n\n  constructor(\n    public context: ListFiltersDemoModalContext,\n    public instance: SkyModalInstance\n  ) {\n    if (\n      this.context &&\n      this.context.appliedFilters &&\n      this.context.appliedFilters.length > 0\n    ) {\n      this.setFormFilters(this.context.appliedFilters);\n    } else {\n      this.clearAllFilters();\n    }\n  }\n\n  public applyFilters(): void {\n    const result = this.getAppliedFiltersArray();\n    this.instance.save(result);\n  }\n\n  public cancel(): void {\n    this.instance.cancel();\n  }\n\n  public clearAllFilters(): void {\n    this.hideOrange = false;\n    this.fruitType = 'any';\n  }\n\n  private fruitTypeFilterFunction(\n    item: ListItemModel,\n    filterValue: any\n  ): boolean {\n    return filterValue === item.data.type;\n  }\n\n  private getAppliedFiltersArray(): ListFilterModel[] {\n    const appliedFilters: ListFilterModel[] = [];\n    if (this.fruitType !== 'any') {\n      appliedFilters.push(\n        new ListFilterModel({\n          name: 'fruitType',\n          value: this.fruitType,\n          label: this.fruitType,\n          filterFunction: this.fruitTypeFilterFunction,\n        })\n      );\n    }\n\n    if (this.hideOrange) {\n      appliedFilters.push(\n        new ListFilterModel({\n          name: 'hideOrange',\n          value: true,\n          label: 'hide orange fruits',\n          filterFunction: this.hideOrangeFilterFunction,\n        })\n      );\n    }\n\n    return appliedFilters;\n  }\n\n  private hideOrangeFilterFunction(\n    item: ListItemModel,\n    filterValue: any\n  ): boolean {\n    return !filterValue || (filterValue && item.data.color !== 'orange');\n  }\n\n  private setFormFilters(appliedFilters: any[]): void {\n    for (let i = 0; i < appliedFilters.length; i++) {\n      if (appliedFilters[i].name === 'fruitType') {\n        this.fruitType = appliedFilters[i].value;\n      }\n\n      if (appliedFilters[i].name === 'hideOrange') {\n        this.hideOrange = appliedFilters[i].value;\n      }\n    }\n  }\n}\n"
-    },
-    {
-      "fileName": "list-filters-demo.component.html",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-filters/modal-filters/list-filters-demo.component.html",
-      "rawContents": "<sky-list\n  [appliedFilters]=\"listFilters\"\n  [data]=\"items\"\n  (appliedFiltersChange)=\"modalFilters = $event\"\n>\n  <sky-list-toolbar [searchEnabled]=\"false\">\n    <sky-list-filter-button>\n      <sky-filter-button\n        (filterButtonClick)=\"openFilterModal()\"\n        [showButtonText]=\"true\"\n      >\n      </sky-filter-button>\n    </sky-list-filter-button>\n    <sky-list-filter-summary (summaryItemClick)=\"openFilterModal()\">\n    </sky-list-filter-summary>\n  </sky-list-toolbar>\n  <sky-list-view-grid>\n    <sky-grid-column field=\"name\" heading=\"Name\"> </sky-grid-column>\n    <sky-grid-column field=\"description\" heading=\"Description\">\n    </sky-grid-column>\n  </sky-list-view-grid>\n</sky-list>\n"
-    },
-    {
-      "fileName": "list-filters-demo.component.ts",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-filters/modal-filters/list-filters-demo.component.ts",
-      "rawContents": "import { Component } from '@angular/core';\nimport { ListFilterModel } from '@skyux/list-builder';\nimport { SkyModalCloseArgs, SkyModalService } from '@skyux/modals';\n\nimport { of } from 'rxjs';\n\nimport { ListFiltersDemoModalContext } from './list-filters-demo-modal-context';\nimport { ListFilterDemoModalComponent } from './list-filters-demo-modal.component';\n\n@Component({\n  selector: 'app-list-filters-demo',\n  templateUrl: './list-filters-demo.component.html',\n})\nexport class ListFiltersDemoComponent {\n  public items = of([\n    {\n      id: 0,\n      name: 'Orange',\n      description: 'A round, orange fruit.',\n      type: 'citrus',\n      color: 'orange',\n    },\n    {\n      id: 1,\n      name: 'Mango',\n      description: \"Delicious in smoothies, but don't eat the skin.\",\n      type: 'other',\n      color: 'orange',\n    },\n    {\n      id: 2,\n      name: 'Lime',\n      description: 'A sour, green fruit used in many drinks.',\n      type: 'citrus',\n      color: 'green',\n    },\n    {\n      id: 3,\n      name: 'Strawberry',\n      description: 'A red fruit that goes well with shortcake.',\n      type: 'berry',\n      color: 'red',\n    },\n    {\n      id: 4,\n      name: 'Blueberry',\n      description: 'A small, blue fruit often found in muffins.',\n      type: 'berry',\n      color: 'blue',\n    },\n  ]);\n\n  public listFilters: ListFilterModel[] = [];\n\n  public modalFilters: ListFilterModel[] = [];\n\n  constructor(private modalService: SkyModalService) {}\n\n  public openFilterModal(): void {\n    const instance = this.modalService.open(ListFilterDemoModalComponent, [\n      {\n        provide: ListFiltersDemoModalContext,\n        useValue: {\n          appliedFilters: this.modalFilters,\n        },\n      },\n    ]);\n\n    instance.closed.subscribe((result: SkyModalCloseArgs) => {\n      if (result.reason === 'save') {\n        this.listFilters = result.data.slice();\n      }\n    });\n  }\n}\n"
-    },
-    {
-      "fileName": "list-filters-demo.module.ts",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-filters/modal-filters/list-filters-demo.module.ts",
-      "rawContents": "import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { SkyIdModule } from '@skyux/core';\nimport { SkyCheckboxModule } from '@skyux/forms';\nimport {\n  SkyListFiltersModule,\n  SkyListModule,\n  SkyListToolbarModule,\n} from '@skyux/list-builder';\nimport { SkyListViewGridModule } from '@skyux/list-builder-view-grids';\nimport { SkyFilterModule } from '@skyux/lists';\nimport { SkyModalModule } from '@skyux/modals';\n\nimport { ListFilterDemoModalComponent } from './list-filters-demo-modal.component';\nimport { ListFiltersDemoComponent } from './list-filters-demo.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    FormsModule,\n    SkyCheckboxModule,\n    SkyFilterModule,\n    SkyIdModule,\n    SkyListFiltersModule,\n    SkyListModule,\n    SkyListToolbarModule,\n    SkyListViewGridModule,\n    SkyModalModule,\n  ],\n  declarations: [ListFiltersDemoComponent, ListFilterDemoModalComponent],\n  exports: [ListFiltersDemoComponent],\n})\nexport class ListFiltersDemoModule {}\n"
-    },
-    {
-      "fileName": "list-paging-demo.component.html",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-paging/basic/list-paging-demo.component.html",
-      "rawContents": "<sky-list [data]=\"data\">\n  <sky-list-view-grid #grid>\n    <sky-grid-column field=\"name\" heading=\"Name\"> </sky-grid-column>\n    <sky-grid-column field=\"email\" heading=\"Email\"> </sky-grid-column>\n    <sky-grid-column field=\"amount\" heading=\"Amount\"> </sky-grid-column>\n  </sky-list-view-grid>\n  <sky-list-paging pageSize=\"5\"></sky-list-paging>\n</sky-list>\n"
-    },
-    {
-      "fileName": "list-paging-demo.component.scss",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-paging/basic/list-paging-demo.component.scss",
-      "rawContents": "@use 'libs/components/theme/src/lib/styles/mixins' as mixins;\n\n::ng-deep .sky-grid-table {\n  @include mixins.sky-border(dark, top);\n}\n"
-    },
-    {
-      "fileName": "list-paging-demo.component.ts",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-paging/basic/list-paging-demo.component.ts",
-      "rawContents": "import { Component } from '@angular/core';\n\n@Component({\n  selector: 'app-list-paging-demo',\n  templateUrl: './list-paging-demo.component.html',\n  styleUrls: ['./list-paging-demo.component.scss'],\n})\nexport class ListPagingDemoComponent {\n  public data: any[] = [\n    {\n      id: '1',\n      name: 'Niels Bohr',\n      email: 'niels.bohr@example.com',\n      amount: 170.75,\n      status: 'Paid',\n    },\n    {\n      id: '2',\n      name: 'Ada Lovelace',\n      email: 'ada.lovelace@example.com',\n      amount: 114.13,\n      status: 'Paid',\n    },\n    {\n      id: '3',\n      name: 'Marie Curie',\n      email: 'marie.curie@example.com',\n      amount: 111,\n      status: 'Past due',\n    },\n    {\n      id: '4',\n      name: 'Barbara McClintock',\n      email: 'barbara.mcclintock@example.com',\n      amount: 84.63,\n      status: 'Paid',\n    },\n    {\n      id: '5',\n      name: 'Michael Faraday',\n      email: 'michael.faraday@example.com',\n      amount: 83.97,\n      status: 'Paid',\n    },\n    {\n      id: '6',\n      name: 'Enrico Fermi',\n      email: 'enrico.fermi@example.com',\n      amount: 74.5,\n      status: 'Past due',\n    },\n    {\n      id: '7',\n      name: 'Mae C. Jemison',\n      email: 'mae.jemison@example.com',\n      amount: 70.86,\n      status: 'Paid',\n    },\n    {\n      id: '8',\n      name: 'Nikola Tesla',\n      email: 'nikola.tesla@example.com',\n      amount: 15.0,\n      status: 'Paid',\n    },\n    {\n      id: '9',\n      name: 'Hubert J. Farnsworth',\n      email: 'hubert.j.farnsworth@example.com',\n      amount: 999.99,\n      status: 'Past Due',\n    },\n  ];\n}\n"
-    },
-    {
-      "fileName": "list-paging-demo.module.ts",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-paging/basic/list-paging-demo.module.ts",
-      "rawContents": "import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SkyListModule, SkyListPagingModule } from '@skyux/list-builder';\nimport { SkyListViewGridModule } from '@skyux/list-builder-view-grids';\n\nimport { ListPagingDemoComponent } from './list-paging-demo.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    SkyListModule,\n    SkyListPagingModule,\n    SkyListViewGridModule,\n  ],\n  declarations: [ListPagingDemoComponent],\n  exports: [ListPagingDemoComponent],\n})\nexport class ListPagingDemoModule {}\n"
-    },
-    {
-      "fileName": "list-toolbar-demo.component.html",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-toolbar/basic/list-toolbar-demo.component.html",
-      "rawContents": "<sky-list [data]=\"data\">\n  <sky-list-toolbar>\n    <sky-list-toolbar-item id=\"custom-item\" index=\"0\" location=\"left\">\n      <ng-template>\n        <sky-dropdown buttonStyle=\"primary\">\n          <sky-dropdown-button (click)=\"onAddButtonClicked()\">\n            <sky-icon icon=\"plus-circle\"></sky-icon>\n            Add\n          </sky-dropdown-button>\n        </sky-dropdown>\n      </ng-template>\n    </sky-list-toolbar-item>\n    <sky-list-filter-button>\n      <sky-filter-button\n        [showButtonText]=\"true\"\n        (filterButtonClick)=\"onFilterButtonClicked()\"\n      >\n      </sky-filter-button>\n    </sky-list-filter-button>\n    <sky-list-filter-summary (summaryItemClick)=\"onSummaryItemClick()\">\n    </sky-list-filter-summary>\n    <sky-list-toolbar-sort\n      field=\"column2\"\n      label=\"Fruit name (A - Z)\"\n      type=\"string\"\n      [descending]=\"false\"\n    >\n    </sky-list-toolbar-sort>\n    <sky-list-toolbar-sort\n      field=\"column2\"\n      label=\"Fruit name (Z - A)\"\n      type=\"string\"\n      [descending]=\"true\"\n    >\n    </sky-list-toolbar-sort>\n    <sky-list-column-selector-action [gridView]=\"grid\">\n    </sky-list-column-selector-action>\n    <sky-list-secondary-actions>\n      <sky-list-secondary-action>\n        <button type=\"button\">Option</button>\n      </sky-list-secondary-action>\n    </sky-list-secondary-actions>\n    <sky-list-toolbar-view-actions>\n      <form novalidate [formGroup]=\"myForm\">\n        <sky-radio-group formControlName=\"myView\">\n          <div class=\"sky-switch-icon-group\">\n            <sky-radio\n              *ngFor=\"let view of views\"\n              [icon]=\"view.icon\"\n              [label]=\"view.label\"\n              [value]=\"view.name\"\n            >\n            </sky-radio>\n          </div>\n        </sky-radio-group>\n      </form>\n    </sky-list-toolbar-view-actions>\n  </sky-list-toolbar>\n  <sky-list-view-grid #grid>\n    <sky-grid-column field=\"name\" heading=\"Name\"> </sky-grid-column>\n    <sky-grid-column field=\"email\" heading=\"Email\"> </sky-grid-column>\n    <sky-grid-column field=\"amount\" heading=\"Amount\"> </sky-grid-column>\n  </sky-list-view-grid>\n</sky-list>\n"
-    },
-    {
-      "fileName": "list-toolbar-demo.component.ts",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-toolbar/basic/list-toolbar-demo.component.ts",
-      "rawContents": "import { Component, OnInit } from '@angular/core';\nimport { FormBuilder, FormGroup } from '@angular/forms';\n\n@Component({\n  selector: 'app-list-toolbar-demo',\n  templateUrl: './list-toolbar-demo.component.html',\n})\nexport class ListToolbarDemoComponent implements OnInit {\n  public data: any[] = [\n    {\n      id: '1',\n      name: 'Niels Bohr',\n      email: 'niels.bohr@example.com',\n      amount: 170.75,\n      status: 'Paid',\n    },\n    {\n      id: '2',\n      name: 'Ada Lovelace',\n      email: 'ada.lovelace@example.com',\n      amount: 114.13,\n      status: 'Paid',\n    },\n    {\n      id: '3',\n      name: 'Marie Curie',\n      email: 'marie.curie@example.com',\n      amount: 111,\n      status: 'Past due',\n    },\n    {\n      id: '4',\n      name: 'Barbara McClintock',\n      email: 'barbara.mcclintock@example.com',\n      amount: 84.63,\n      status: 'Paid',\n    },\n    {\n      id: '5',\n      name: 'Michael Faraday',\n      email: 'michael.faraday@example.com',\n      amount: 83.97,\n      status: 'Paid',\n    },\n    {\n      id: '6',\n      name: 'Enrico Fermi',\n      email: 'enrico.fermi@example.com',\n      amount: 74.5,\n      status: 'Past due',\n    },\n    {\n      id: '7',\n      name: 'Mae C. Jemison',\n      email: 'mae.jemison@example.com',\n      amount: 70.86,\n      status: 'Paid',\n    },\n    {\n      id: '8',\n      name: 'Nikola Tesla',\n      email: 'nikola.tesla@example.com',\n      amount: 15.0,\n      status: 'Paid',\n    },\n    {\n      id: '9',\n      name: 'Hubert J. Farnsworth',\n      email: 'hubert.j.farnsworth@example.com',\n      amount: 999.99,\n      status: 'Past Due',\n    },\n  ];\n\n  public myForm: FormGroup;\n\n  public views: any[] = [\n    { icon: 'table', label: 'Table', name: 'table' },\n    { icon: 'list', label: 'List', name: 'list' },\n    { icon: 'th-large', label: 'Cards', name: 'cards' },\n    { icon: 'map-marker', label: 'Map', name: 'map' },\n  ];\n\n  constructor(private formBuilder: FormBuilder) {}\n\n  public ngOnInit(): void {\n    this.myForm = this.formBuilder.group({\n      myView: this.views[0].name,\n    });\n  }\n\n  public onAddButtonClicked(): void {\n    alert('Add button clicked');\n  }\n\n  public onFilterButtonClicked(): void {\n    alert('Filter button clicked');\n  }\n\n  public onSummaryItemClick(): void {\n    alert('Filter summary item clicked');\n  }\n}\n"
-    },
-    {
-      "fileName": "list-toolbar-demo.module.ts",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-toolbar/basic/list-toolbar-demo.module.ts",
-      "rawContents": "import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\nimport { SkyRadioModule } from '@skyux/forms';\nimport { SkyIconModule } from '@skyux/indicators';\nimport {\n  SkyListFiltersModule,\n  SkyListModule,\n  SkyListSecondaryActionsModule,\n  SkyListToolbarModule,\n} from '@skyux/list-builder';\nimport { SkyListViewGridModule } from '@skyux/list-builder-view-grids';\nimport { SkyFilterModule } from '@skyux/lists';\nimport { SkyDropdownModule } from '@skyux/popovers';\n\nimport { ListToolbarDemoComponent } from './list-toolbar-demo.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    FormsModule,\n    SkyDropdownModule,\n    SkyFilterModule,\n    SkyIconModule,\n    SkyListFiltersModule,\n    SkyListModule,\n    SkyListSecondaryActionsModule,\n    SkyListToolbarModule,\n    SkyListViewGridModule,\n    SkyRadioModule,\n    ReactiveFormsModule,\n  ],\n  declarations: [ListToolbarDemoComponent],\n  exports: [ListToolbarDemoComponent],\n})\nexport class ListToolbarDemoModule {}\n"
-    },
-    {
-      "fileName": "list-toolbar-demo.component.html",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-toolbar/custom/list-toolbar-demo.component.html",
-      "rawContents": "<sky-list [data]=\"data\">\n  <sky-list-toolbar>\n    <sky-list-toolbar-item id=\"custom-item\" location=\"left\">\n      <ng-template>\n        <button class=\"sky-btn sky-btn-default\" (click)=\"onLeftButtonClicked()\">\n          Left\n        </button>\n      </ng-template>\n    </sky-list-toolbar-item>\n    <sky-list-toolbar-item id=\"custom-item2\" index=\"1\" location=\"center\">\n      <ng-template>\n        <button\n          class=\"sky-btn sky-btn-default\"\n          (click)=\"onCenterButtonClicked()\"\n        >\n          Center\n        </button>\n      </ng-template>\n    </sky-list-toolbar-item>\n  </sky-list-toolbar>\n  <sky-list-view-grid #grid>\n    <sky-grid-column field=\"name\" heading=\"Name\"> </sky-grid-column>\n    <sky-grid-column field=\"email\" heading=\"Email\"> </sky-grid-column>\n    <sky-grid-column field=\"amount\" heading=\"Amount\"> </sky-grid-column>\n  </sky-list-view-grid>\n</sky-list>\n"
-    },
-    {
-      "fileName": "list-toolbar-demo.component.ts",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-toolbar/custom/list-toolbar-demo.component.ts",
-      "rawContents": "import { Component } from '@angular/core';\n\n@Component({\n  selector: 'app-list-toolbar-demo',\n  templateUrl: './list-toolbar-demo.component.html',\n})\nexport class ListToolbarDemoComponent {\n  public data: any[] = [\n    {\n      id: '1',\n      name: 'Niels Bohr',\n      email: 'niels.bohr@example.com',\n      amount: 170.75,\n      status: 'Paid',\n    },\n    {\n      id: '2',\n      name: 'Ada Lovelace',\n      email: 'ada.lovelace@example.com',\n      amount: 114.13,\n      status: 'Paid',\n    },\n    {\n      id: '3',\n      name: 'Marie Curie',\n      email: 'marie.curie@example.com',\n      amount: 111,\n      status: 'Past due',\n    },\n    {\n      id: '4',\n      name: 'Barbara McClintock',\n      email: 'barbara.mcclintock@example.com',\n      amount: 84.63,\n      status: 'Paid',\n    },\n    {\n      id: '5',\n      name: 'Michael Faraday',\n      email: 'michael.faraday@example.com',\n      amount: 83.97,\n      status: 'Paid',\n    },\n    {\n      id: '6',\n      name: 'Enrico Fermi',\n      email: 'enrico.fermi@example.com',\n      amount: 74.5,\n      status: 'Past due',\n    },\n    {\n      id: '7',\n      name: 'Mae C. Jemison',\n      email: 'mae.jemison@example.com',\n      amount: 70.86,\n      status: 'Paid',\n    },\n    {\n      id: '8',\n      name: 'Nikola Tesla',\n      email: 'nikola.tesla@example.com',\n      amount: 15.0,\n      status: 'Paid',\n    },\n    {\n      id: '9',\n      name: 'Hubert J. Farnsworth',\n      email: 'hubert.j.farnsworth@example.com',\n      amount: 999.99,\n      status: 'Past Due',\n    },\n  ];\n\n  public onCenterButtonClicked(): void {\n    alert('Center button clicked!');\n  }\n\n  public onLeftButtonClicked(): void {\n    alert('Left button clicked!');\n  }\n}\n"
-    },
-    {
-      "fileName": "list-toolbar-demo.module.ts",
-      "filePath": "/projects/list-builder/documentation/code-examples/list-toolbar/custom/list-toolbar-demo.module.ts",
-      "rawContents": "import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SkyListModule, SkyListToolbarModule } from '@skyux/list-builder';\nimport { SkyListViewGridModule } from '@skyux/list-builder-view-grids';\n\nimport { ListToolbarDemoComponent } from './list-toolbar-demo.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    SkyListModule,\n    SkyListToolbarModule,\n    SkyListViewGridModule,\n  ],\n  declarations: [ListToolbarDemoComponent],\n  exports: [ListToolbarDemoComponent],\n})\nexport class ListToolbarDemoModule {}\n"
-    }
-  ]
+  "codeExamples": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skyux/list-builder",
-  "version": "7.0.0-beta.12",
+  "version": "7.0.0-beta.13",
   "author": "Blackbaud, Inc.",
   "keywords": [
     "blackbaud",
@@ -34,15 +34,15 @@
   "peerDependencies": {
     "@angular/common": "^14.2.0",
     "@angular/core": "^14.2.0",
-    "@skyux/core": "7.0.0-beta.12",
-    "@skyux/forms": "7.0.0-beta.12",
-    "@skyux/i18n": "7.0.0-beta.12",
-    "@skyux/indicators": "7.0.0-beta.12",
-    "@skyux/layout": "7.0.0-beta.12",
-    "@skyux/list-builder-common": "7.0.0-beta.12",
-    "@skyux/lists": "7.0.0-beta.12",
-    "@skyux/lookup": "7.0.0-beta.12",
-    "@skyux/popovers": "7.0.0-beta.12"
+    "@skyux/core": "7.0.0-beta.13",
+    "@skyux/forms": "7.0.0-beta.13",
+    "@skyux/i18n": "7.0.0-beta.13",
+    "@skyux/indicators": "7.0.0-beta.13",
+    "@skyux/layout": "7.0.0-beta.13",
+    "@skyux/list-builder-common": "7.0.0-beta.13",
+    "@skyux/lists": "7.0.0-beta.13",
+    "@skyux/lookup": "7.0.0-beta.13",
+    "@skyux/popovers": "7.0.0-beta.13"
   },
   "dependencies": {
     "tslib": "^2.3.1"