@skyux/lists 7.18.0 → 7.19.0

package/documentation.json

@@ -6747,12 +6747,12 @@
     {
       "fileName": "repeater-demo.component.spec.ts",
       "filePath": "/projects/lists/documentation/code-examples/repeater/add-remove/repeater-demo.component.spec.ts",
-      "rawContents": "import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';\nimport { ComponentFixture, TestBed } from '@angular/core/testing';\nimport { NoopAnimationsModule } from '@angular/platform-browser/animations';\nimport {\n  SkyRepeaterHarness,\n  SkyRepeaterItemHarness,\n} from '@skyux/lists/testing';\n\nimport { RepeaterDemoComponent } from './repeater-demo.component';\nimport { RepeaterDemoModule } from './repeater-demo.module';\n\ndescribe('Repeater add remove demo', () => {\n  async function setupTest(): Promise<{\n    repeaterHarness: SkyRepeaterHarness | null;\n    repeaterItems: SkyRepeaterItemHarness[] | null;\n    fixture: ComponentFixture<RepeaterDemoComponent>;\n  }> {\n    const fixture = TestBed.createComponent(RepeaterDemoComponent);\n    const loader = TestbedHarnessEnvironment.loader(fixture);\n\n    const repeaterHarness = await loader.getHarness(\n      SkyRepeaterHarness.with({ dataSkyId: 'repeater-demo' })\n    );\n\n    const repeaterItems = await repeaterHarness.getRepeaterItems();\n\n    return { repeaterHarness, repeaterItems, fixture };\n  }\n\n  beforeEach(() => {\n    TestBed.configureTestingModule({\n      imports: [RepeaterDemoModule, NoopAnimationsModule],\n    });\n  });\n\n  it('should allow items to be expanded and collapsed', async () => {\n    const { repeaterItems } = await setupTest();\n    let first = true;\n\n    for (const item of repeaterItems!) {\n      await expectAsync(item.isCollapsible()).toBeResolvedTo(true);\n      // in single expand mode, the first item is expanded by default\n      await expectAsync(item.isExpanded()).toBeResolvedTo(first ? true : false);\n      first = false;\n      await item.collapse();\n      await expectAsync(item.isExpanded()).toBeResolvedTo(false);\n      await item.expand();\n      await expectAsync(item.isExpanded()).toBeResolvedTo(true);\n    }\n  });\n\n  it('should allow items to be reordered', async () => {\n    const { repeaterHarness } = await setupTest();\n\n    const expectedContent = [\n      {\n        title: 'Call Robert Hernandez  Completed',\n        body: 'Robert recently gave a very generous gift.  We should call him to thank him.',\n      },\n      {\n        title: 'Send invitation to Spring Ball  Past due',\n        body: \"The Spring Ball is coming up soon.  Let's get those invitations out!\",\n      },\n    ];\n\n    let repeaterItems = await repeaterHarness?.getRepeaterItems();\n    expect(repeaterItems).toBeDefined();\n    expect(repeaterItems?.length).toBe(2);\n\n    for (const item of repeaterItems!) {\n      await expectAsync(item.isReorderable()).toBeResolvedTo(true);\n    }\n\n    await expectAsync(repeaterItems?.[1].getTitleText()).toBeResolvedTo(\n      expectedContent[1].title\n    );\n    await repeaterItems?.[1].sendToTop();\n\n    repeaterItems = await repeaterHarness?.getRepeaterItems();\n    await expectAsync(repeaterItems?.[1].getTitleText()).toBeResolvedTo(\n      expectedContent[0].title\n    );\n  });\n\n  it('should allow items to be added and removed', async () => {\n    const { repeaterHarness, fixture } = await setupTest();\n\n    let repeaterItems = await repeaterHarness?.getRepeaterItems();\n    expect(repeaterItems).toBeDefined();\n    expect(repeaterItems?.length).toBe(2);\n\n    for (const item of repeaterItems!) {\n      await expectAsync(item.isSelectable()).toBeResolvedTo(true);\n    }\n\n    const addButton = fixture.nativeElement.querySelector(\n      '[data-sky-id=\"add-button\"]'\n    );\n    const removeButton = fixture.nativeElement.querySelector(\n      '[data-sky-id=\"remove-button\"]'\n    );\n\n    addButton.click();\n    fixture.detectChanges();\n\n    repeaterItems = await repeaterHarness?.getRepeaterItems();\n    expect(repeaterItems).toBeDefined();\n    expect(repeaterItems?.length).toBe(3);\n\n    await expectAsync(repeaterItems?.[0].isSelected()).toBeResolvedTo(false);\n    await repeaterItems?.[0].select();\n    await expectAsync(repeaterItems?.[0].isSelected()).toBeResolvedTo(true);\n    await expectAsync(repeaterItems?.[1].isSelected()).toBeResolvedTo(false);\n    await repeaterItems?.[1].select();\n    await expectAsync(repeaterItems?.[1].isSelected()).toBeResolvedTo(true);\n\n    removeButton.click();\n    fixture.detectChanges();\n\n    repeaterItems = await repeaterHarness?.getRepeaterItems();\n    expect(repeaterItems).toBeDefined();\n    expect(repeaterItems?.length).toBe(1);\n  });\n});\n"
+      "rawContents": "import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';\nimport { ComponentFixture, TestBed } from '@angular/core/testing';\nimport { NoopAnimationsModule } from '@angular/platform-browser/animations';\nimport {\n  SkyRepeaterHarness,\n  SkyRepeaterItemHarness,\n} from '@skyux/lists/testing';\n\nimport { RepeaterDemoComponent } from './repeater-demo.component';\nimport { RepeaterDemoModule } from './repeater-demo.module';\n\ndescribe('Repeater add remove demo', () => {\n  async function setupTest(): Promise<{\n    repeaterHarness: SkyRepeaterHarness | null;\n    repeaterItems: SkyRepeaterItemHarness[] | null;\n    fixture: ComponentFixture<RepeaterDemoComponent>;\n  }> {\n    const fixture = TestBed.createComponent(RepeaterDemoComponent);\n    const loader = TestbedHarnessEnvironment.loader(fixture);\n\n    const repeaterHarness = await loader.getHarness(\n      SkyRepeaterHarness.with({ dataSkyId: 'repeater-demo' })\n    );\n\n    const repeaterItems = await repeaterHarness.getRepeaterItems();\n\n    return { repeaterHarness, repeaterItems, fixture };\n  }\n\n  beforeEach(() => {\n    TestBed.configureTestingModule({\n      imports: [RepeaterDemoModule, NoopAnimationsModule],\n    });\n  });\n\n  it('should allow items to be expanded and collapsed', async () => {\n    const { repeaterItems } = await setupTest();\n    let first = true;\n\n    for (const item of repeaterItems!) {\n      await expectAsync(item.isCollapsible()).toBeResolvedTo(true);\n      // in single expand mode, the first item is expanded by default\n      await expectAsync(item.isExpanded()).toBeResolvedTo(first ? true : false);\n      first = false;\n      await item.collapse();\n      await expectAsync(item.isExpanded()).toBeResolvedTo(false);\n      await item.expand();\n      await expectAsync(item.isExpanded()).toBeResolvedTo(true);\n    }\n  });\n\n  it('should allow items to be reordered', async () => {\n    const { repeaterHarness } = await setupTest();\n\n    const expectedContent = [\n      {\n        title: 'Call Robert Hernandez  Completed',\n        body: 'Robert recently gave a very generous gift. We should call him to thank him.',\n      },\n      {\n        title: 'Send invitation to Spring Ball  Past due',\n        body: \"The Spring Ball is coming up soon. Let's get those invitations out!\",\n      },\n      {\n        title: 'Assign prospects  Due tomorrow',\n        body: 'There are 14 new prospects who are not assigned to fundraisers.',\n      },\n      {\n        title: 'Process gift receipts  Due next week',\n        body: 'There are 28 recent gifts that are not receipted.',\n      },\n    ];\n\n    let repeaterItems = await repeaterHarness?.getRepeaterItems();\n    expect(repeaterItems).toBeDefined();\n    expect(repeaterItems?.length).toBe(expectedContent.length);\n\n    if (repeaterItems) {\n      for (const item of repeaterItems) {\n        await expectAsync(item.isReorderable()).toBeResolvedTo(true);\n      }\n\n      await expectAsync(repeaterItems?.[1].getTitleText()).toBeResolvedTo(\n        expectedContent[1].title\n      );\n      await repeaterItems?.[1].sendToTop();\n\n      repeaterItems = await repeaterHarness?.getRepeaterItems();\n      await expectAsync(repeaterItems?.[1].getTitleText()).toBeResolvedTo(\n        expectedContent[0].title\n      );\n    }\n  });\n\n  it('should allow items to be added and removed', async () => {\n    const { repeaterHarness, fixture } = await setupTest();\n\n    let repeaterItems = await repeaterHarness?.getRepeaterItems();\n    expect(repeaterItems).toBeDefined();\n    expect(repeaterItems?.length).toBe(4);\n\n    if (repeaterItems) {\n      for (const item of repeaterItems) {\n        await expectAsync(item.isSelectable()).toBeResolvedTo(true);\n      }\n\n      const addButton = fixture.nativeElement.querySelector(\n        '[data-sky-id=\"add-button\"]'\n      );\n      const removeButton = fixture.nativeElement.querySelector(\n        '[data-sky-id=\"remove-button\"]'\n      );\n\n      addButton.click();\n      fixture.detectChanges();\n\n      repeaterItems = await repeaterHarness?.getRepeaterItems();\n      expect(repeaterItems).toBeDefined();\n      expect(repeaterItems?.length).toBe(5);\n\n      await expectAsync(repeaterItems?.[0].isSelected()).toBeResolvedTo(false);\n      await repeaterItems?.[0].select();\n      await expectAsync(repeaterItems?.[0].isSelected()).toBeResolvedTo(true);\n      await expectAsync(repeaterItems?.[1].isSelected()).toBeResolvedTo(false);\n      await repeaterItems?.[1].select();\n      await expectAsync(repeaterItems?.[1].isSelected()).toBeResolvedTo(true);\n\n      removeButton.click();\n      fixture.detectChanges();\n\n      repeaterItems = await repeaterHarness?.getRepeaterItems();\n      expect(repeaterItems).toBeDefined();\n      expect(repeaterItems?.length).toBe(3);\n    }\n  });\n});\n"
     },
     {
       "fileName": "repeater-demo.component.ts",
       "filePath": "/projects/lists/documentation/code-examples/repeater/add-remove/repeater-demo.component.ts",
-      "rawContents": "import { Component } from '@angular/core';\n\nimport { RepeaterDemoItem } from './repeater-demo-item';\n\nlet nextId = 0;\n\n@Component({\n  selector: 'app-repeater-demo',\n  templateUrl: './repeater-demo.component.html',\n  styleUrls: ['./repeater-demo.component.scss'],\n})\nexport class RepeaterDemoComponent {\n  public items: RepeaterDemoItem[] = [\n    {\n      title: 'Call Robert Hernandez',\n      note: 'Robert recently gave a very generous gift.  We should call him to thank him.',\n      status: 'Completed',\n      isSelected: false,\n    },\n    {\n      title: 'Send invitation to Spring Ball',\n      note: \"The Spring Ball is coming up soon.  Let's get those invitations out!\",\n      status: 'Past due',\n      isSelected: false,\n    },\n  ];\n\n  public addItem(): void {\n    this.items.push({\n      title: 'New reminder ' + ++nextId,\n      note: 'This is a new reminder',\n      status: 'Active',\n      isSelected: false,\n    });\n  }\n\n  public changeItems(tags: RepeaterDemoItem[]): void {\n    console.log('Tags in order ', tags);\n  }\n\n  public onActionClicked(buttonText: string): void {\n    alert(buttonText + ' was clicked!');\n  }\n\n  public removeItems(): void {\n    this.items = this.items.filter((item) => !item.isSelected);\n  }\n}\n"
+      "rawContents": "import { Component } from '@angular/core';\n\nimport { RepeaterDemoItem } from './repeater-demo-item';\n\nlet nextId = 0;\n\n@Component({\n  selector: 'app-repeater-demo',\n  templateUrl: './repeater-demo.component.html',\n  styleUrls: ['./repeater-demo.component.scss'],\n})\nexport class RepeaterDemoComponent {\n  public items: RepeaterDemoItem[] = [\n    {\n      title: 'Call Robert Hernandez',\n      note: 'Robert recently gave a very generous gift. We should call him to thank him.',\n      status: 'Completed',\n      isSelected: false,\n    },\n    {\n      title: 'Send invitation to Spring Ball',\n      note: \"The Spring Ball is coming up soon. Let's get those invitations out!\",\n      status: 'Past due',\n      isSelected: false,\n    },\n    {\n      title: 'Assign prospects',\n      note: 'There are 14 new prospects who are not assigned to fundraisers.',\n      status: 'Due tomorrow',\n      isSelected: false,\n    },\n    {\n      title: 'Process gift receipts',\n      note: 'There are 28 recent gifts that are not receipted.',\n      status: 'Due next week',\n      isSelected: false,\n    },\n  ];\n\n  public addItem(): void {\n    this.items.push({\n      title: 'New reminder ' + ++nextId,\n      note: 'This is a new reminder',\n      status: 'Active',\n      isSelected: false,\n    });\n  }\n\n  public changeItems(tags: RepeaterDemoItem[]): void {\n    console.log('Tags in order ', tags);\n  }\n\n  public onActionClicked(buttonText: string): void {\n    alert(buttonText + ' was clicked!');\n  }\n\n  public removeItems(): void {\n    this.items = this.items.filter((item) => !item.isSelected);\n  }\n}\n"
     },
     {
       "fileName": "repeater-demo.module.ts",
@@ -6772,18 +6772,43 @@
     {
       "fileName": "repeater-demo.component.spec.ts",
       "filePath": "/projects/lists/documentation/code-examples/repeater/basic/repeater-demo.component.spec.ts",
-      "rawContents": "import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';\nimport { ComponentFixture, TestBed } from '@angular/core/testing';\nimport { NoopAnimationsModule } from '@angular/platform-browser/animations';\nimport {\n  SkyRepeaterHarness,\n  SkyRepeaterItemHarness,\n} from '@skyux/lists/testing';\n\nimport { RepeaterDemoComponent } from './repeater-demo.component';\nimport { RepeaterDemoModule } from './repeater-demo.module';\n\ndescribe('Repeater basic demo', () => {\n  async function setupTest(): Promise<{\n    repeaterHarness: SkyRepeaterHarness | null;\n    repeaterItems: SkyRepeaterItemHarness[] | null;\n    fixture: ComponentFixture<RepeaterDemoComponent>;\n  }> {\n    const fixture = TestBed.createComponent(RepeaterDemoComponent);\n    const loader = TestbedHarnessEnvironment.loader(fixture);\n\n    const repeaterHarness = await loader.getHarness(\n      SkyRepeaterHarness.with({ dataSkyId: 'repeater-demo' })\n    );\n\n    const repeaterItems = await repeaterHarness.getRepeaterItems();\n\n    return { repeaterHarness, repeaterItems, fixture };\n  }\n\n  beforeEach(() => {\n    TestBed.configureTestingModule({\n      imports: [RepeaterDemoModule, NoopAnimationsModule],\n    });\n  });\n\n  it('should display the repeater item contents', async () => {\n    const { repeaterItems } = await setupTest();\n\n    const expectedContent = [\n      {\n        title: 'Call Robert Hernandez  Completed',\n        body: 'Robert recently gave a very generous gift.  We should call him to thank him.',\n      },\n      {\n        title: 'Send invitation to Spring Ball  Past due',\n        body: \"The Spring Ball is coming up soon.  Let's get those invitations out!\",\n      },\n    ];\n\n    for (let i = 0; i < repeaterItems!.length; i++) {\n      await expectAsync(repeaterItems![i].getTitleText()).toBeResolvedTo(\n        expectedContent[i].title\n      );\n      await expectAsync(repeaterItems![i].getContentText()).toBeResolvedTo(\n        expectedContent[i].body\n      );\n    }\n  });\n});\n"
+      "rawContents": "import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';\nimport { ComponentFixture, TestBed } from '@angular/core/testing';\nimport { NoopAnimationsModule } from '@angular/platform-browser/animations';\nimport {\n  SkyRepeaterHarness,\n  SkyRepeaterItemHarness,\n} from '@skyux/lists/testing';\n\nimport { RepeaterDemoComponent } from './repeater-demo.component';\nimport { RepeaterDemoModule } from './repeater-demo.module';\n\ndescribe('Repeater basic demo', () => {\n  async function setupTest(): Promise<{\n    repeaterHarness: SkyRepeaterHarness | null;\n    repeaterItems: SkyRepeaterItemHarness[] | null;\n    fixture: ComponentFixture<RepeaterDemoComponent>;\n  }> {\n    const fixture = TestBed.createComponent(RepeaterDemoComponent);\n    const loader = TestbedHarnessEnvironment.loader(fixture);\n\n    const repeaterHarness = await loader.getHarness(\n      SkyRepeaterHarness.with({ dataSkyId: 'repeater-demo' })\n    );\n\n    const repeaterItems = await repeaterHarness.getRepeaterItems();\n\n    return { repeaterHarness, repeaterItems, fixture };\n  }\n\n  beforeEach(() => {\n    TestBed.configureTestingModule({\n      imports: [RepeaterDemoModule, NoopAnimationsModule],\n    });\n  });\n\n  it('should display the repeater item contents', async () => {\n    const { repeaterItems } = await setupTest();\n\n    const expectedContent = [\n      {\n        title: 'Call Robert Hernandez  Completed',\n        body: 'Robert recently gave a very generous gift. We should call him to thank him.',\n      },\n      {\n        title: 'Send invitation to Spring Ball  Past due',\n        body: \"The Spring Ball is coming up soon. Let's get those invitations out!\",\n      },\n      {\n        title: 'Assign prospects  Due tomorrow',\n        body: 'There are 14 new prospects who are not assigned to fundraisers.',\n      },\n      {\n        title: 'Process gift receipts  Due next week',\n        body: 'There are 28 recent gifts that are not receipted.',\n      },\n    ];\n\n    expect(repeaterItems?.length).toBe(expectedContent.length);\n\n    if (repeaterItems) {\n      for (let i = 0; i < repeaterItems.length; i++) {\n        await expectAsync(repeaterItems[i].getTitleText()).toBeResolvedTo(\n          expectedContent[i].title\n        );\n        await expectAsync(repeaterItems[i].getContentText()).toBeResolvedTo(\n          expectedContent[i].body\n        );\n      }\n    }\n  });\n});\n"
     },
     {
       "fileName": "repeater-demo.component.ts",
       "filePath": "/projects/lists/documentation/code-examples/repeater/basic/repeater-demo.component.ts",
-      "rawContents": "import { Component } from '@angular/core';\n\n@Component({\n  selector: 'app-repeater-demo',\n  templateUrl: './repeater-demo.component.html',\n  styleUrls: ['./repeater-demo.component.scss'],\n})\nexport class RepeaterDemoComponent {\n  public items: any[] = [\n    {\n      title: 'Call Robert Hernandez',\n      note: 'Robert recently gave a very generous gift.  We should call him to thank him.',\n      status: 'Completed',\n    },\n    {\n      title: 'Send invitation to Spring Ball',\n      note: \"The Spring Ball is coming up soon.  Let's get those invitations out!\",\n      status: 'Past due',\n    },\n  ];\n\n  public onActionClicked(buttonText: string): void {\n    alert(buttonText + ' was clicked!');\n  }\n}\n"
+      "rawContents": "import { Component } from '@angular/core';\n\n@Component({\n  selector: 'app-repeater-demo',\n  templateUrl: './repeater-demo.component.html',\n  styleUrls: ['./repeater-demo.component.scss'],\n})\nexport class RepeaterDemoComponent {\n  public items: any[] = [\n    {\n      title: 'Call Robert Hernandez',\n      note: 'Robert recently gave a very generous gift. We should call him to thank him.',\n      status: 'Completed',\n    },\n    {\n      title: 'Send invitation to Spring Ball',\n      note: \"The Spring Ball is coming up soon. Let's get those invitations out!\",\n      status: 'Past due',\n    },\n    {\n      title: 'Assign prospects',\n      note: 'There are 14 new prospects who are not assigned to fundraisers.',\n      status: 'Due tomorrow',\n    },\n    {\n      title: 'Process gift receipts',\n      note: 'There are 28 recent gifts that are not receipted.',\n      status: 'Due next week',\n    },\n  ];\n\n  public onActionClicked(buttonText: string): void {\n    alert(buttonText + ' was clicked!');\n  }\n}\n"
     },
     {
       "fileName": "repeater-demo.module.ts",
       "filePath": "/projects/lists/documentation/code-examples/repeater/basic/repeater-demo.module.ts",
       "rawContents": "import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SkyRepeaterModule } from '@skyux/lists';\nimport { SkyDropdownModule } from '@skyux/popovers';\n\nimport { RepeaterDemoComponent } from './repeater-demo.component';\n\n@NgModule({\n  imports: [CommonModule, SkyDropdownModule, SkyRepeaterModule],\n  declarations: [RepeaterDemoComponent],\n  exports: [RepeaterDemoComponent],\n})\nexport class RepeaterDemoModule {}\n"
     },
+    {
+      "fileName": "repeater-demo-item.ts",
+      "filePath": "/projects/lists/documentation/code-examples/repeater/inline-form/repeater-demo-item.ts",
+      "rawContents": "export interface RepeaterDemoItem {\n  id: string;\n  title: string | undefined;\n  note: string | undefined;\n}\n"
+    },
+    {
+      "fileName": "repeater-demo.component.html",
+      "filePath": "/projects/lists/documentation/code-examples/repeater/inline-form/repeater-demo.component.html",
+      "rawContents": "<sky-repeater>\n  <sky-repeater-item\n    *ngFor=\"let item of items\"\n    [inlineFormConfig]=\"inlineFormConfig\"\n    [inlineFormTemplate]=\"inlineFormTemplate\"\n    [showInlineForm]=\"activeInlineFormId === item.id\"\n    (inlineFormClose)=\"onInlineFormClose($event)\"\n  >\n    <sky-repeater-item-title class=\"demo-repeater-flex\">\n      <div class=\"demo-repeater-item-title sky-font-emphasized\">\n        {{ item.title }}\n      </div>\n      <div>\n        <button\n          aria-label=\"Edit\"\n          class=\"sky-btn sky-btn-link sky-btn-link-inline sky-no-focus sky-demo-btn-edit\"\n          type=\"button\"\n          (click)=\"showInlineForm(item)\"\n        >\n          <sky-icon icon=\"pencil\"> </sky-icon>\n        </button>\n      </div>\n    </sky-repeater-item-title>\n\n    <sky-repeater-item-content>\n      {{ item.note }}\n    </sky-repeater-item-content>\n  </sky-repeater-item>\n</sky-repeater>\n\n<ng-template #inlineFormTemplate>\n  <form novalidate [formGroup]=\"myForm\">\n    <div class=\"sky-form-group\">\n      <sky-input-box>\n        <label class=\"sky-control-label\" [for]=\"myTitle.id\"> Title </label>\n        <input\n          class=\"sky-form-control\"\n          formControlName=\"title\"\n          skyId\n          type=\"text\"\n          #myTitle=\"skyId\"\n        />\n      </sky-input-box>\n    </div>\n    <div class=\"sky-form-group\">\n      <sky-input-box>\n        <label class=\"sky-control-label\" [for]=\"myNote.id\"> Note </label>\n        <input\n          class=\"sky-form-control\"\n          formControlName=\"note\"\n          skyId\n          type=\"text\"\n          #myNote=\"skyId\"\n        />\n      </sky-input-box>\n    </div>\n  </form>\n</ng-template>\n"
+    },
+    {
+      "fileName": "repeater-demo.component.scss",
+      "filePath": "/projects/lists/documentation/code-examples/repeater/inline-form/repeater-demo.component.scss",
+      "rawContents": ".demo-repeater-flex {\n  display: flex;\n  flex-wrap: wrap;\n\n  .demo-repeater-item-title {\n    flex-grow: 1;\n  }\n}\n"
+    },
+    {
+      "fileName": "repeater-demo.component.ts",
+      "filePath": "/projects/lists/documentation/code-examples/repeater/inline-form/repeater-demo.component.ts",
+      "rawContents": "import { Component } from '@angular/core';\nimport { FormBuilder, FormControl, FormGroup } from '@angular/forms';\nimport {\n  SkyInlineFormButtonLayout,\n  SkyInlineFormCloseArgs,\n  SkyInlineFormConfig,\n} from '@skyux/inline-form';\n\nimport { RepeaterDemoItem } from './repeater-demo-item';\n\n@Component({\n  selector: 'app-repeater-demo',\n  templateUrl: './repeater-demo.component.html',\n  styleUrls: ['./repeater-demo.component.scss'],\n})\nexport class RepeaterDemoComponent {\n  public activeInlineFormId: string | undefined;\n\n  public inlineFormConfig: SkyInlineFormConfig = {\n    buttonLayout: SkyInlineFormButtonLayout.SaveCancel,\n  };\n\n  public items: RepeaterDemoItem[] = [\n    {\n      id: '1',\n      title: '2019 Spring Gala',\n      note: 'Gala for friends and family',\n    },\n    {\n      id: '2',\n      title: '2019 Special Winter Event',\n      note: 'A special event',\n    },\n    {\n      id: '3',\n      title: '2019 Donor Appreciation Event',\n      note: 'Event for all donors and families',\n    },\n    {\n      id: '4',\n      title: '2020 Spring Gala',\n      note: 'Gala for friends and family',\n    },\n  ];\n\n  public myForm: FormGroup;\n\n  constructor(formBuilder: FormBuilder) {\n    this.myForm = formBuilder.group({\n      id: new FormControl(),\n      title: new FormControl(),\n      note: new FormControl(),\n    });\n  }\n\n  public showInlineForm(item: RepeaterDemoItem): void {\n    this.activeInlineFormId = item.id;\n    this.myForm.patchValue({\n      note: item.note,\n      title: item.title,\n    });\n  }\n\n  public onInlineFormClose(args: SkyInlineFormCloseArgs): void {\n    if (args.reason === 'save') {\n      const found = this.items.find(\n        (item) => item.id === this.activeInlineFormId\n      );\n      if (found) {\n        found.note = this.myForm.get('note')?.value;\n        found.title = this.myForm.get('title')?.value;\n      }\n    }\n\n    this.myForm.patchValue({\n      note: undefined,\n      title: undefined,\n    });\n\n    // Close the active form.\n    this.activeInlineFormId = undefined;\n  }\n}\n"
+    },
+    {
+      "fileName": "repeater-demo.module.ts",
+      "filePath": "/projects/lists/documentation/code-examples/repeater/inline-form/repeater-demo.module.ts",
+      "rawContents": "import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { SkyIdModule } from '@skyux/core';\nimport { SkyInputBoxModule } from '@skyux/forms';\nimport { SkyIconModule } from '@skyux/indicators';\nimport { SkyInlineFormModule } from '@skyux/inline-form';\nimport { SkyRepeaterModule } from '@skyux/lists';\n\nimport { RepeaterDemoComponent } from './repeater-demo.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    SkyIconModule,\n    SkyIdModule,\n    SkyInlineFormModule,\n    SkyInputBoxModule,\n    SkyRepeaterModule,\n  ],\n  exports: [RepeaterDemoComponent],\n  declarations: [RepeaterDemoComponent],\n})\nexport class RepeaterDemoModule {}\n"
+    },
     {
       "fileName": "repeater-demo-item.ts",
       "filePath": "/projects/lists/documentation/code-examples/sort/basic/repeater-demo-item.ts",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skyux/lists",
-  "version": "7.18.0",
+  "version": "7.19.0",
   "author": "Blackbaud, Inc.",
   "keywords": [
     "blackbaud",
@@ -44,15 +44,15 @@
     "@angular/common": "^14.2.11",
     "@angular/core": "^14.2.11",
     "@angular/platform-browser": "^14.2.11",
-    "@skyux-sdk/testing": "7.18.0",
-    "@skyux/animations": "7.18.0",
-    "@skyux/core": "7.18.0",
-    "@skyux/forms": "7.18.0",
-    "@skyux/i18n": "7.18.0",
-    "@skyux/indicators": "7.18.0",
-    "@skyux/inline-form": "7.18.0",
-    "@skyux/popovers": "7.18.0",
-    "@skyux/theme": "7.18.0"
+    "@skyux-sdk/testing": "7.19.0",
+    "@skyux/animations": "7.19.0",
+    "@skyux/core": "7.19.0",
+    "@skyux/forms": "7.19.0",
+    "@skyux/i18n": "7.19.0",
+    "@skyux/indicators": "7.19.0",
+    "@skyux/inline-form": "7.19.0",
+    "@skyux/popovers": "7.19.0",
+    "@skyux/theme": "7.19.0"
   },
   "dependencies": {
     "dom-autoscroller": "2.3.4",