npm - @skyux/lists - Versions diffs - 5.9.5 → 5.10.0 - Mend

@skyux/lists 5.9.5 → 5.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (23) hide show

package/esm2015/lib/modules/repeater/repeater.component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"repeater.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/lists/src/lib/modules/repeater/repeater.component.ts","../../../../../../../../libs/components/lists/src/lib/modules/repeater/repeater.component.html"],"names":[],"mappings":"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","sourcesContent":["import {\n AfterContentInit,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ContentChildren,\n ElementRef,\n EventEmitter,\n Input,\n OnChanges,\n OnDestroy,\n Output,\n QueryList,\n Renderer2,\n SimpleChanges,\n} from '@angular/core';\n\nimport { DragulaService } from 'ng2-dragula';\nimport { Subject } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\n\nimport { SkyRepeaterAdapterService } from './repeater-adapter.service';\nimport { SkyRepeaterItemComponent } from './repeater-item.component';\nimport { SkyRepeaterService } from './repeater.service';\n\nlet uniqueId = 0;\n\n/*\n Creates a container to display repeater items.\n /\n@Component({\n selector: 'sky-repeater',\n styleUrls: ['./repeater.component.scss'],\n templateUrl: './repeater.component.html',\n providers: [SkyRepeaterService, SkyRepeaterAdapterService],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SkyRepeaterComponent\n implements AfterContentInit, OnChanges, OnDestroy\n{\n /\n Specifies the index of the repeater item to visually highlight as active.\n * For example, use this property in conjunction with the\n * [split view component](https://developer.blackbaud.com/skyux/components/split-view)\n * to highlight a repeater item while users edit it. Only one item can be active at a time.\n /\n @Input()\n public activeIndex: number;\n\n /\n Specifies an ARIA label for the repeater list.\n * This sets the repeater list's `aria-label` attribute\n * [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).\n * @default \"List of items\"\n /\n @Input()\n public ariaLabel: string;\n\n /\n Indicates whether users can change the order of items in the repeater list.\n * Each repeater item also has `reorderable` property to indicate whether\n * users can change its order.\n /\n @Input()\n public reorderable = false;\n\n /\n Specifies a layout to determine which repeater items are expanded by default and whether\n * repeater items are expandable and collapsible. Collapsed items display titles only.\n * The valid options are `multiple`, `none`, and `single`.\n * - `multiple` loads repeater items in an expanded state unless `isExpanded` is set to\n * `false` for a repeater item. This layout allows users to expand and collapse\n * as many repeater items as necessary. It is best-suited to repeater items where body\n * content is important but users don't always need to see it.\n * - `none` loads all repeater items in an expanded state and does not allow users to\n * collapse them. This default layout provides the quickest access to the details in the\n * repeater items. It is best-suited to repeater items with concise content\n * that users need to view frequently.\n * - `single` loads one repeater item in an expanded state and collapses all others.\n * The expanded repeater item is the first one where `isExpanded` is set to `true`. This layout\n * allows users to expand one item at a time. It provides the most compact view and is\n * best-suited to repeater items where the most important information is in the titles\n * and users only occasionally need to view the body content.\n * @default \"none\"\n /\n @Input()\n public set expandMode(value: string) {\n this.repeaterService.expandMode = value;\n this._expandMode = value;\n this.updateForExpandMode();\n }\n\n public get expandMode(): string {\n return this._expandMode \|\| 'none';\n }\n\n /\n Fires when the active repeater item changes.\n /\n @Output()\n public activeIndexChange = new EventEmitter<number>();\n\n /\n Fires when users change the order of repeater items.\n * This event emits an ordered array of the `tag` properties that the consumer provides for each repeater item.\n /\n @Output()\n public orderChange = new EventEmitter<any[]>();\n\n @ContentChildren(SkyRepeaterItemComponent)\n public items: QueryList<SkyRepeaterItemComponent>;\n\n public dragulaGroupName: string;\n\n private dragulaUnsubscribe = new Subject<void>();\n\n private ngUnsubscribe = new Subject<void>();\n\n private _expandMode = 'none';\n\n constructor(\n private changeDetector: ChangeDetectorRef,\n private repeaterService: SkyRepeaterService,\n private adapterService: SkyRepeaterAdapterService,\n private dragulaService: DragulaService,\n private elementRef: ElementRef,\n private renderer: Renderer2\n ) {\n this.dragulaGroupName = `sky-repeater-dragula-${++uniqueId}`;\n\n this.repeaterService.itemCollapseStateChange\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe((item: SkyRepeaterItemComponent) => {\n if (this.expandMode === 'single' && item.isExpanded) {\n this.items.forEach((otherItem) => {\n if (\n otherItem !== item &&\n otherItem.isExpanded &&\n otherItem.isCollapsible\n ) {\n otherItem.isExpanded = false;\n }\n });\n }\n });\n\n this.repeaterService.activeItemIndexChange\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe((index: number) => {\n if (index !== this.activeIndex) {\n this.activeIndex = index;\n this.activeIndexChange.emit(index);\n }\n });\n\n this.repeaterService.orderChange\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe(() => {\n this.emitTags();\n });\n\n this.repeaterService.repeaterGroupId = uniqueId;\n\n this.updateForExpandMode();\n\n this.adapterService.setRepeaterHost(this.elementRef);\n\n this.initializeDragAndDrop();\n }\n\n public ngAfterContentInit(): void {\n // If activeIndex has been set on init, call service to activate the appropriate item.\n setTimeout(() => {\n if (this.activeIndex \|\| this.activeIndex === 0) {\n this.repeaterService.activateItemByIndex(this.activeIndex);\n }\n\n if (this.reorderable && !this.everyItemHasTag()) {\n console.warn(\n 'Please supply tag properties for each repeater item when reordering functionality is enabled.'\n );\n }\n });\n\n // HACK: Not updating for expand mode in a timeout causes an error.\n // https://github.com/angular/angular/issues/6005\n this.items.changes.pipe(takeUntil(this.ngUnsubscribe)).subscribe(() => {\n setTimeout(() => {\n if (this.items.last) {\n this.updateForExpandMode(this.items.last);\n this.items.last.reorderable = this.reorderable;\n }\n\n if (this.activeIndex !== undefined) {\n this.repeaterService.activateItemByIndex(this.activeIndex);\n }\n });\n });\n\n setTimeout(() => {\n this.updateForExpandMode();\n\n this.items.forEach((item) => {\n item.reorderable = this.reorderable;\n });\n }, 0);\n }\n\n public ngOnChanges(changes: SimpleChanges): void {\n if (changes['activeIndex']) {\n this.repeaterService.enableActiveState = true;\n if (\n changes['activeIndex'].currentValue !==\n changes['activeIndex'].previousValue\n ) {\n this.repeaterService.activateItemByIndex(this.activeIndex);\n }\n }\n\n if (changes.reorderable) {\n if (this.items) {\n this.items.forEach((item) => (item.reorderable = this.reorderable));\n }\n\n this.changeDetector.markForCheck();\n }\n }\n\n public ngOnDestroy(): void {\n this.ngUnsubscribe.next();\n this.ngUnsubscribe.complete();\n this.destroyDragAndDrop();\n }\n\n private updateForExpandMode(itemAdded?: SkyRepeaterItemComponent): void {\n if (this.items) {\n let foundExpanded = false;\n const isCollapsible = this.expandMode !== 'none';\n const isSingle = this.expandMode === 'single';\n\n // Keep any newly-added expanded item expanded and collapse the rest.\n if (itemAdded && itemAdded.isExpanded) {\n foundExpanded = true;\n }\n\n this.items.forEach((item) => {\n item.isCollapsible = isCollapsible && !!item.hasItemContent;\n\n if (item !== itemAdded && isSingle && item.isExpanded) {\n if (foundExpanded) {\n item.updateForExpanded(false, false);\n }\n\n foundExpanded = true;\n }\n });\n }\n }\n\n private initializeDragAndDrop(): void {\n / Sanity check that we haven't already set up dragging abilities /\n / istanbul ignore else /\n if (!this.dragulaService.find(this.dragulaGroupName)) {\n this.dragulaService.setOptions(this.dragulaGroupName, {\n moves: (\n el: HTMLElement,\n container: HTMLElement,\n handle: HTMLElement\n ) => {\n const target = el.querySelector('.sky-repeater-item-grab-handle');\n return this.reorderable && target && target.contains(handle);\n },\n });\n }\n\n let draggedItemIndex: number;\n\n this.dragulaService.drag\n .pipe(takeUntil(this.dragulaUnsubscribe))\n .subscribe(([groupName, subject]: any[]) => {\n / istanbul ignore else /\n if (groupName === this.dragulaGroupName) {\n this.renderer.addClass(subject, 'sky-repeater-item-dragging');\n draggedItemIndex = this.adapterService.getRepeaterItemIndex(subject);\n }\n });\n\n this.dragulaService.dragend\n .pipe(takeUntil(this.dragulaUnsubscribe))\n .subscribe(([groupName, subject]: any[]) => {\n / istanbul ignore else /\n if (groupName === this.dragulaGroupName) {\n this.renderer.removeClass(subject, 'sky-repeater-item-dragging');\n const newItemIndex =\n this.adapterService.getRepeaterItemIndex(subject);\n\n / sanity check /\n / istanbul ignore else /\n if (draggedItemIndex >= 0) {\n this.repeaterService.reorderItem(draggedItemIndex, newItemIndex);\n draggedItemIndex = undefined;\n }\n\n this.emitTags();\n }\n });\n }\n\n private destroyDragAndDrop(): void {\n this.dragulaUnsubscribe.next();\n this.dragulaUnsubscribe.complete();\n this.dragulaUnsubscribe = undefined;\n\n / Sanity check that we have set up dragging abilities /\n / istanbul ignore else /\n if (this.dragulaService.find(this.dragulaGroupName)) {\n this.dragulaService.destroy(this.dragulaGroupName);\n }\n }\n\n private emitTags(): void {\n const tags = this.repeaterService.items.map((item) => item.tag);\n this.orderChange.emit(tags);\n }\n\n private everyItemHasTag(): boolean {\n / sanity check /\n / istanbul ignore if */\n if (!this.items \|\| this.items.length === 0) {\n return false;\n }\n return this.items.toArray().every((item) => {\n return item.tag !== undefined;\n });\n }\n}\n","<ng-container #repeaterHost>\n <div\n class=\"sky-repeater\"\n role=\"listbox\"\n [attr.aria-label]=\"ariaLabel \|\| ('skyux_repeater_label' \| skyLibResources)\"\n [dragula]=\"dragulaGroupName\"\n >\n <ng-content></ng-content>\n </div>\n</ng-container>\n"]}
1	+ {"version":3,"file":"repeater.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/lists/src/lib/modules/repeater/repeater.component.ts","../../../../../../../../libs/components/lists/src/lib/modules/repeater/repeater.component.html"],"names":[],"mappings":"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","sourcesContent":["import {\n AfterContentInit,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ContentChildren,\n ElementRef,\n EventEmitter,\n Input,\n OnChanges,\n OnDestroy,\n OnInit,\n Output,\n QueryList,\n Renderer2,\n SimpleChanges,\n} from '@angular/core';\n\nimport { DragulaService } from 'ng2-dragula';\nimport { Subject } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\n\nimport { SkyRepeaterAdapterService } from './repeater-adapter.service';\nimport { SkyRepeaterItemRolesType } from './repeater-item-roles.type';\nimport { SkyRepeaterItemComponent } from './repeater-item.component';\nimport { SkyRepeaterRoleType } from './repeater-role.type';\nimport { SkyRepeaterService } from './repeater.service';\n\nlet uniqueId = 0;\n\n/*\n Creates a container to display repeater items.\n /\n@Component({\n selector: 'sky-repeater',\n styleUrls: ['./repeater.component.scss'],\n templateUrl: './repeater.component.html',\n providers: [SkyRepeaterService, SkyRepeaterAdapterService],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SkyRepeaterComponent\n implements AfterContentInit, OnChanges, OnDestroy, OnInit\n{\n /\n Specifies the index of the repeater item to visually highlight as active.\n * For example, use this property in conjunction with the\n * [split view component](https://developer.blackbaud.com/skyux/components/split-view)\n * to highlight a repeater item while users edit it. Only one item can be active at a time.\n /\n @Input()\n public activeIndex: number;\n\n /\n Specifies an ARIA label for the repeater list.\n * This sets the repeater list's `aria-label` attribute\n * [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).\n * @default \"List of items\"\n /\n @Input()\n public ariaLabel: string;\n\n /\n Indicates whether users can change the order of items in the repeater list.\n * Each repeater item also has `reorderable` property to indicate whether\n * users can change its order.\n /\n @Input()\n public reorderable = false;\n\n /\n Specifies a layout to determine which repeater items are expanded by default and whether\n * repeater items are expandable and collapsible. Collapsed items display titles only.\n * The valid options are `multiple`, `none`, and `single`.\n * - `multiple` loads repeater items in an expanded state unless `isExpanded` is set to\n * `false` for a repeater item. This layout allows users to expand and collapse\n * as many repeater items as necessary. It is best-suited to repeater items where body\n * content is important but users don't always need to see it.\n * - `none` loads all repeater items in an expanded state and does not allow users to\n * collapse them. This default layout provides the quickest access to the details in the\n * repeater items. It is best-suited to repeater items with concise content\n * that users need to view frequently.\n * - `single` loads one repeater item in an expanded state and collapses all others.\n * The expanded repeater item is the first one where `isExpanded` is set to `true`. This layout\n * allows users to expand one item at a time. It provides the most compact view and is\n * best-suited to repeater items where the most important information is in the titles\n * and users only occasionally need to view the body content.\n * @default \"none\"\n /\n @Input()\n public set expandMode(value: string) {\n this.repeaterService.expandMode = value;\n this._expandMode = value;\n this.updateForExpandMode();\n }\n\n public get expandMode(): string {\n return this._expandMode \|\| 'none';\n }\n\n /\n Fires when the active repeater item changes.\n /\n @Output()\n public activeIndexChange = new EventEmitter<number>();\n\n /\n Fires when users change the order of repeater items.\n * This event emits an ordered array of the `tag` properties that the consumer provides for each repeater item.\n /\n @Output()\n public orderChange = new EventEmitter<any[]>();\n\n @ContentChildren(SkyRepeaterItemComponent)\n public items: QueryList<SkyRepeaterItemComponent>;\n\n public dragulaGroupName: string;\n\n public role: SkyRepeaterRoleType \| undefined;\n\n private dragulaUnsubscribe = new Subject<void>();\n\n private ngUnsubscribe = new Subject<void>();\n\n private _expandMode = 'none';\n\n constructor(\n private changeDetector: ChangeDetectorRef,\n private repeaterService: SkyRepeaterService,\n private adapterService: SkyRepeaterAdapterService,\n private dragulaService: DragulaService,\n private elementRef: ElementRef,\n private renderer: Renderer2\n ) {\n this.dragulaGroupName = `sky-repeater-dragula-${++uniqueId}`;\n\n this.repeaterService.itemCollapseStateChange\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe((item: SkyRepeaterItemComponent) => {\n if (this.expandMode === 'single' && item.isExpanded) {\n this.items.forEach((otherItem) => {\n if (\n otherItem !== item &&\n otherItem.isExpanded &&\n otherItem.isCollapsible\n ) {\n otherItem.isExpanded = false;\n }\n });\n }\n });\n\n this.repeaterService.activeItemIndexChange\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe((index: number) => {\n if (index !== this.activeIndex) {\n this.activeIndex = index;\n this.activeIndexChange.emit(index);\n }\n });\n\n this.repeaterService.orderChange\n .pipe(takeUntil(this.ngUnsubscribe))\n .subscribe(() => {\n this.emitTags();\n });\n\n this.repeaterService.repeaterGroupId = uniqueId;\n\n this.updateForExpandMode();\n\n this.adapterService.setRepeaterHost(this.elementRef);\n\n this.initializeDragAndDrop();\n }\n\n public ngAfterContentInit(): void {\n // If activeIndex has been set on init, call service to activate the appropriate item.\n setTimeout(() => {\n if (this.activeIndex \|\| this.activeIndex === 0) {\n this.repeaterService.activateItemByIndex(this.activeIndex);\n }\n\n if (this.reorderable && !this.everyItemHasTag()) {\n console.warn(\n 'Please supply tag properties for each repeater item when reordering functionality is enabled.'\n );\n }\n });\n\n // HACK: Not updating for expand mode in a timeout causes an error.\n // https://github.com/angular/angular/issues/6005\n this.items.changes.pipe(takeUntil(this.ngUnsubscribe)).subscribe(() => {\n setTimeout(() => {\n if (this.items.last) {\n this.updateForExpandMode(this.items.last);\n this.items.last.reorderable = this.reorderable;\n }\n\n if (this.activeIndex !== undefined) {\n this.repeaterService.activateItemByIndex(this.activeIndex);\n }\n\n this.updateRole();\n });\n });\n\n setTimeout(() => {\n this.updateForExpandMode();\n\n this.items.forEach((item) => {\n item.reorderable = this.reorderable;\n });\n\n this.updateRole();\n }, 0);\n }\n\n public ngOnChanges(changes: SimpleChanges): void {\n if (changes['activeIndex']) {\n this.repeaterService.enableActiveState = true;\n if (\n changes['activeIndex'].currentValue !==\n changes['activeIndex'].previousValue\n ) {\n this.repeaterService.activateItemByIndex(this.activeIndex);\n }\n }\n\n if (changes.reorderable) {\n if (this.items) {\n this.items.forEach((item) => (item.reorderable = this.reorderable));\n }\n this.updateRole();\n\n this.changeDetector.markForCheck();\n }\n }\n\n public ngOnDestroy(): void {\n this.ngUnsubscribe.next();\n this.ngUnsubscribe.complete();\n this.destroyDragAndDrop();\n }\n\n public ngOnInit(): void {\n this.updateRole();\n }\n\n public onCdkObserveContent(): void {\n this.updateRole();\n }\n\n private updateForExpandMode(itemAdded?: SkyRepeaterItemComponent): void {\n if (this.items) {\n let foundExpanded = false;\n const isCollapsible = this.expandMode !== 'none';\n const isSingle = this.expandMode === 'single';\n\n // Keep any newly-added expanded item expanded and collapse the rest.\n if (itemAdded && itemAdded.isExpanded) {\n foundExpanded = true;\n }\n\n this.items.forEach((item) => {\n item.isCollapsible = isCollapsible && !!item.hasItemContent;\n\n if (item !== itemAdded && isSingle && item.isExpanded) {\n if (foundExpanded) {\n item.updateForExpanded(false, false);\n }\n\n foundExpanded = true;\n }\n });\n\n this.updateRole();\n }\n }\n\n private initializeDragAndDrop(): void {\n / Sanity check that we haven't already set up dragging abilities /\n / istanbul ignore else /\n if (!this.dragulaService.find(this.dragulaGroupName)) {\n this.dragulaService.setOptions(this.dragulaGroupName, {\n moves: (\n el: HTMLElement,\n container: HTMLElement,\n handle: HTMLElement\n ) => {\n const target = el.querySelector('.sky-repeater-item-grab-handle');\n return this.reorderable && target && target.contains(handle);\n },\n });\n }\n\n let draggedItemIndex: number;\n\n this.dragulaService.drag\n .pipe(takeUntil(this.dragulaUnsubscribe))\n .subscribe(([groupName, subject]: any[]) => {\n / istanbul ignore else /\n if (groupName === this.dragulaGroupName) {\n this.renderer.addClass(subject, 'sky-repeater-item-dragging');\n draggedItemIndex = this.adapterService.getRepeaterItemIndex(subject);\n }\n });\n\n this.dragulaService.dragend\n .pipe(takeUntil(this.dragulaUnsubscribe))\n .subscribe(([groupName, subject]: any[]) => {\n / istanbul ignore else /\n if (groupName === this.dragulaGroupName) {\n this.renderer.removeClass(subject, 'sky-repeater-item-dragging');\n const newItemIndex =\n this.adapterService.getRepeaterItemIndex(subject);\n\n / sanity check /\n / istanbul ignore else /\n if (draggedItemIndex >= 0) {\n this.repeaterService.reorderItem(draggedItemIndex, newItemIndex);\n draggedItemIndex = undefined;\n }\n\n this.emitTags();\n }\n });\n }\n\n private destroyDragAndDrop(): void {\n this.dragulaUnsubscribe.next();\n this.dragulaUnsubscribe.complete();\n this.dragulaUnsubscribe = undefined;\n\n / Sanity check that we have set up dragging abilities /\n / istanbul ignore else /\n if (this.dragulaService.find(this.dragulaGroupName)) {\n this.dragulaService.destroy(this.dragulaGroupName);\n }\n }\n\n private emitTags(): void {\n const tags = this.repeaterService.items.map((item) => item.tag);\n this.orderChange.emit(tags);\n }\n\n private everyItemHasTag(): boolean {\n / sanity check /\n / istanbul ignore if */\n if (!this.items \|\| this.items.length === 0) {\n return false;\n }\n return this.items.toArray().every((item) => {\n return item.tag !== undefined;\n });\n }\n\n private updateRole() {\n // Determine a role using a hierarchy based on https://www.w3.org/TR/wai-aria-practices-1.1/\n // 1. If there are one or more interactions in the repeater item projected content, use grid.\n // 2. If there are selectable repeater items and no other interactions, use listbox.\n // 3. If there are no interactions, use list.\n\n // Default to list role.\n let autoRole: SkyRepeaterRoleType = 'list';\n\n const roleMap: Record<SkyRepeaterRoleType, SkyRepeaterItemRolesType> = {\n list: { item: 'listitem', title: undefined, content: undefined },\n listbox: { item: 'option', title: undefined, content: undefined },\n grid: { item: 'row', title: 'rowheader', content: 'gridcell' },\n };\n\n // Based on https://html.spec.whatwg.org/multipage/dom.html#interactive-content\n const interactionSelector = [\n 'a[href]',\n 'audio[controls]',\n 'button',\n 'details',\n 'embed',\n 'iframe',\n 'img[usemap]',\n 'input:not([type=\"hidden\"])',\n 'label',\n 'select',\n 'textarea',\n 'video[controls]',\n '[contenteditable]',\n '.sky-repeater[role=\"grid\"]',\n ]\n .map(\n (selector) =>\n `sky-repeater-item-title ${selector}:not([hidden]), sky-repeater-item-content ${selector}:not([hidden])`\n )\n .concat([`skyux-dropdown`])\n .join(', ');\n\n const hasInteraction =\n this.reorderable \|\|\n this.items?.some((item) => item.isCollapsible) \|\|\n !!(this.elementRef.nativeElement as HTMLElement).querySelector(\n interactionSelector\n );\n\n if (hasInteraction) {\n // If the repeater matches interaction selector https://www.w3.org/TR/wai-aria-practices-1.1/#grid\n autoRole = 'grid';\n } else if (this.items?.some((item) => item.selectable)) {\n // If the only interaction is select https://www.w3.org/TR/wai-aria-practices-1.1/#Listbox\n autoRole = 'listbox';\n }\n\n if (this.role !== autoRole) {\n this.repeaterService.itemRole.next({\n ...roleMap[autoRole],\n });\n this.role = `${autoRole}`;\n this.changeDetector.markForCheck();\n }\n }\n}\n","<ng-container #repeaterHost>\n <div\n class=\"sky-repeater\"\n [attr.role]=\"role\"\n [attr.aria-label]=\"ariaLabel \|\| ('skyux_repeater_label' \| skyLibResources)\"\n [dragula]=\"dragulaGroupName\"\n (cdkObserveContent)=\"onCdkObserveContent()\"\n >\n <ng-content></ng-content>\n </div>\n</ng-container>\n"]}

package/esm2015/lib/modules/repeater/repeater.module.js CHANGED Viewed

@@ -1,3 +1,4 @@
+import { ObserversModule } from '@angular/cdk/observers';
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { SkyCheckboxModule } from '@skyux/forms';
@@ -20,6 +21,7 @@ SkyRepeaterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versi
         SkyRepeaterItemContextMenuComponent,
         SkyRepeaterItemTitleComponent], imports: [CommonModule,
         DragulaModule,
+        ObserversModule,
         SkyChevronModule,
         SkyCheckboxModule,
         SkyIconModule,
@@ -32,6 +34,7 @@ SkyRepeaterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versi
 SkyRepeaterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyRepeaterModule, imports: [[
             CommonModule,
             DragulaModule,
+            ObserversModule,
             SkyChevronModule,
             SkyCheckboxModule,
             SkyIconModule,
@@ -51,6 +54,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     imports: [
                         CommonModule,
                         DragulaModule,
+                        ObserversModule,
                         SkyChevronModule,
                         SkyCheckboxModule,
                         SkyIconModule,

package/esm2015/lib/modules/repeater/repeater.module.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"repeater.module.js","sourceRoot":"","sources":["../../../../../../../../libs/components/lists/src/lib/modules/repeater/repeater.module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AACpE,OAAO,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAEzD,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,OAAO,EAAE,uBAAuB,EAAE,MAAM,sCAAsC,CAAC;AAE/E,OAAO,EAAE,+BAA+B,EAAE,MAAM,mCAAmC,CAAC;AACpF,OAAO,EAAE,mCAAmC,EAAE,MAAM,wCAAwC,CAAC;AAC7F,OAAO,EAAE,6BAA6B,EAAE,MAAM,iCAAiC,CAAC;AAChF,OAAO,EAAE,wBAAwB,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;;~~AA2B5D~~,MAAM,OAAO,iBAAiB;;+GAAjB,iBAAiB;gHAAjB,iBAAiB,~~iBAvB1B~~,oBAAoB;QACpB,wBAAwB;QACxB,+BAA+B;QAC/B,mCAAmC;QACnC,6BAA6B,aAG7B,YAAY;QACZ,aAAa;QACb,gBAAgB;QAChB,iBAAiB;QACjB,aAAa;QACb,mBAAmB;QACnB,uBAAuB,aAGvB,oBAAoB;QACpB,wBAAwB;QACxB,+BAA+B;QAC/B,mCAAmC;QACnC,6BAA6B;gHAGpB,iBAAiB,~~YAjBnB~~;YACP,YAAY;YACZ,aAAa;YACb,gBAAgB;YAChB,iBAAiB;YACjB,aAAa;YACb,mBAAmB;YACnB,uBAAuB;SACxB;4FASU,iBAAiB;~~kBAzB7B~~,QAAQ;mBAAC;oBACR,YAAY,EAAE;wBACZ,oBAAoB;wBACpB,wBAAwB;wBACxB,+BAA+B;wBAC/B,mCAAmC;wBACnC,6BAA6B;qBAC9B;oBACD,OAAO,EAAE;wBACP,YAAY;wBACZ,aAAa;wBACb,gBAAgB;wBAChB,iBAAiB;wBACjB,aAAa;wBACb,mBAAmB;wBACnB,uBAAuB;qBACxB;oBACD,OAAO,EAAE;wBACP,oBAAoB;wBACpB,wBAAwB;wBACxB,+BAA+B;wBAC/B,mCAAmC;wBACnC,6BAA6B;qBAC9B;iBACF","sourcesContent":["import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SkyCheckboxModule } from '@skyux/forms';\nimport { SkyChevronModule, SkyIconModule } from '@skyux/indicators';\nimport { SkyInlineFormModule } from '@skyux/inline-form';\n\nimport { DragulaModule } from 'ng2-dragula';\n\nimport { SkyListsResourcesModule } from '../shared/sky-lists-resources.module';\n\nimport { SkyRepeaterItemContentComponent } from './repeater-item-content.component';\nimport { SkyRepeaterItemContextMenuComponent } from './repeater-item-context-menu.component';\nimport { SkyRepeaterItemTitleComponent } from './repeater-item-title.component';\nimport { SkyRepeaterItemComponent } from './repeater-item.component';\nimport { SkyRepeaterComponent } from './repeater.component';\n\n@NgModule({\n declarations: [\n SkyRepeaterComponent,\n SkyRepeaterItemComponent,\n SkyRepeaterItemContentComponent,\n SkyRepeaterItemContextMenuComponent,\n SkyRepeaterItemTitleComponent,\n ],\n imports: [\n CommonModule,\n DragulaModule,\n SkyChevronModule,\n SkyCheckboxModule,\n SkyIconModule,\n SkyInlineFormModule,\n SkyListsResourcesModule,\n ],\n exports: [\n SkyRepeaterComponent,\n SkyRepeaterItemComponent,\n SkyRepeaterItemContentComponent,\n SkyRepeaterItemContextMenuComponent,\n SkyRepeaterItemTitleComponent,\n ],\n})\nexport class SkyRepeaterModule {}\n"]}
1	+ {"version":3,"file":"repeater.module.js","sourceRoot":"","sources":["../../../../../../../../libs/components/lists/src/lib/modules/repeater/repeater.module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AACpE,OAAO,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAEzD,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,OAAO,EAAE,uBAAuB,EAAE,MAAM,sCAAsC,CAAC;AAE/E,OAAO,EAAE,+BAA+B,EAAE,MAAM,mCAAmC,CAAC;AACpF,OAAO,EAAE,mCAAmC,EAAE,MAAM,wCAAwC,CAAC;AAC7F,OAAO,EAAE,6BAA6B,EAAE,MAAM,iCAAiC,CAAC;AAChF,OAAO,EAAE,wBAAwB,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;;AA4B5D,MAAM,OAAO,iBAAiB;;+GAAjB,iBAAiB;gHAAjB,iBAAiB,iBAxB1B,oBAAoB;QACpB,wBAAwB;QACxB,+BAA+B;QAC/B,mCAAmC;QACnC,6BAA6B,aAG7B,YAAY;QACZ,aAAa;QACb,eAAe;QACf,gBAAgB;QAChB,iBAAiB;QACjB,aAAa;QACb,mBAAmB;QACnB,uBAAuB,aAGvB,oBAAoB;QACpB,wBAAwB;QACxB,+BAA+B;QAC/B,mCAAmC;QACnC,6BAA6B;gHAGpB,iBAAiB,YAlBnB;YACP,YAAY;YACZ,aAAa;YACb,eAAe;YACf,gBAAgB;YAChB,iBAAiB;YACjB,aAAa;YACb,mBAAmB;YACnB,uBAAuB;SACxB;4FASU,iBAAiB;kBA1B7B,QAAQ;mBAAC;oBACR,YAAY,EAAE;wBACZ,oBAAoB;wBACpB,wBAAwB;wBACxB,+BAA+B;wBAC/B,mCAAmC;wBACnC,6BAA6B;qBAC9B;oBACD,OAAO,EAAE;wBACP,YAAY;wBACZ,aAAa;wBACb,eAAe;wBACf,gBAAgB;wBAChB,iBAAiB;wBACjB,aAAa;wBACb,mBAAmB;wBACnB,uBAAuB;qBACxB;oBACD,OAAO,EAAE;wBACP,oBAAoB;wBACpB,wBAAwB;wBACxB,+BAA+B;wBAC/B,mCAAmC;wBACnC,6BAA6B;qBAC9B;iBACF","sourcesContent":["import { ObserversModule } from '@angular/cdk/observers';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SkyCheckboxModule } from '@skyux/forms';\nimport { SkyChevronModule, SkyIconModule } from '@skyux/indicators';\nimport { SkyInlineFormModule } from '@skyux/inline-form';\n\nimport { DragulaModule } from 'ng2-dragula';\n\nimport { SkyListsResourcesModule } from '../shared/sky-lists-resources.module';\n\nimport { SkyRepeaterItemContentComponent } from './repeater-item-content.component';\nimport { SkyRepeaterItemContextMenuComponent } from './repeater-item-context-menu.component';\nimport { SkyRepeaterItemTitleComponent } from './repeater-item-title.component';\nimport { SkyRepeaterItemComponent } from './repeater-item.component';\nimport { SkyRepeaterComponent } from './repeater.component';\n\n@NgModule({\n declarations: [\n SkyRepeaterComponent,\n SkyRepeaterItemComponent,\n SkyRepeaterItemContentComponent,\n SkyRepeaterItemContextMenuComponent,\n SkyRepeaterItemTitleComponent,\n ],\n imports: [\n CommonModule,\n DragulaModule,\n ObserversModule,\n SkyChevronModule,\n SkyCheckboxModule,\n SkyIconModule,\n SkyInlineFormModule,\n SkyListsResourcesModule,\n ],\n exports: [\n SkyRepeaterComponent,\n SkyRepeaterItemComponent,\n SkyRepeaterItemContentComponent,\n SkyRepeaterItemContextMenuComponent,\n SkyRepeaterItemTitleComponent,\n ],\n})\nexport class SkyRepeaterModule {}\n"]}

package/esm2015/lib/modules/repeater/repeater.service.js CHANGED Viewed

@@ -11,6 +11,11 @@ export class SkyRepeaterService {
         this.enableActiveState = false;
         this.itemCollapseStateChange = new EventEmitter();
         this.items = [];
+        this.itemRole = new BehaviorSubject({
+            content: undefined,
+            item: undefined,
+            title: undefined,
+        });
         this.orderChange = new BehaviorSubject(undefined);
     }
     ngOnDestroy() {
@@ -21,7 +26,7 @@ export class SkyRepeaterService {
     activateItem(item) {
         if (this.enableActiveState) {
             /* istanbul ignore else */
-            if (item) {
+            if (item && !item.disabled) {
                 const index = this.items.findIndex((i) => i === item);
                 this.activeItemIndexChange.next(index);
                 this.activeItemChange.next(item);
@@ -36,7 +41,7 @@ export class SkyRepeaterService {
             }
             else {
                 const activeItem = this.items[index];
-                if (activeItem) {
+                if (activeItem && !activeItem.disabled) {
                     this.activeItemChange.next(activeItem);
                 }
             }

package/esm2015/lib/modules/repeater/repeater.service.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"repeater.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/lists/src/lib/modules/repeater/repeater.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,UAAU,EAAa,MAAM,eAAe,CAAC;AAEpE,OAAO,EAAE,eAAe,EAAE,MAAM,MAAM,CAAC;;~~AAIvC~~;;GAEG;AAEH,MAAM,OAAO,kBAAkB;IAD/B;QAES,qBAAgB,GAAG,IAAI,eAAe,CAC3C,SAAS,CACV,CAAC;QAEK,0BAAqB,GAAG,IAAI,eAAe,CAAS,SAAS,CAAC,CAAC;QAE/D,sBAAiB,GAAG,KAAK,CAAC;QAI1B,4BAAuB,GAAG,IAAI,YAAY,EAA4B,CAAC;QAEvE,UAAK,GAA+B,EAAE,CAAC;~~QAEvC~~,gBAAW,GAAG,IAAI,eAAe,CAAO,SAAS,CAAC,CAAC;KA6D3D;IAzDQ,WAAW;QAChB,IAAI,CAAC,gBAAgB,CAAC,QAAQ,EAAE,CAAC;QACjC,IAAI,CAAC,uBAAuB,CAAC,QAAQ,EAAE,CAAC;QACxC,IAAI,CAAC,WAAW,CAAC,QAAQ,EAAE,CAAC;IAC9B,CAAC;IAEM,YAAY,CAAC,IAA8B;QAChD,IAAI,IAAI,CAAC,iBAAiB,EAAE;YAC1B,0BAA0B;YAC1B,IAAI,IAAI,EAAE;~~gBACR~~,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC;gBACtD,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBACvC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;aAClC;SACF;IACH,CAAC;IAEM,mBAAmB,CAAC,KAAa;QACtC,0BAA0B;QAC1B,IAAI,IAAI,CAAC,iBAAiB,EAAE;YAC1B,IAAI,KAAK,KAAK,SAAS,EAAE;gBACvB,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;aACvC;iBAAM;gBACL,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;gBACrC,IAAI,UAAU,EAAE;~~oBACd~~,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;iBACxC;aACF;SACF;IACH,CAAC;IAEM,YAAY,CAAC,IAA8B;QAChD,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACxB,CAAC;IAEM,cAAc,CAAC,IAA8B;QAClD,MAAM,oBAAoB,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;QACtD,IAAI,oBAAoB,GAAG,CAAC,CAAC,EAAE;YAC7B,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,oBAAoB,EAAE,CAAC,CAAC,CAAC;SAC5C;IACH,CAAC;IAEM,yBAAyB,CAAC,IAA8B;QAC7D,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC1C,CAAC;IAEM,YAAY,CAAC,IAA8B;QAChD,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;IAClC,CAAC;IAEM,mBAAmB;QACxB,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;IAC1B,CAAC;IAEM,WAAW,CAAC,QAAgB,EAAE,QAAgB;QACnD,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACpE,CAAC;;~~gHA3EU~~,kBAAkB;oHAAlB,kBAAkB;4FAAlB,kBAAkB;kBAD9B,UAAU","sourcesContent":["import { EventEmitter, Injectable, OnDestroy } from '@angular/core';\n\nimport { BehaviorSubject } from 'rxjs';\n\nimport { SkyRepeaterItemComponent } from './repeater-item.component';\n\n/*\n @internal\n /\n@Injectable()\nexport class SkyRepeaterService implements OnDestroy {\n public activeItemChange = new BehaviorSubject<SkyRepeaterItemComponent>(\n undefined\n );\n\n public activeItemIndexChange = new BehaviorSubject<number>(undefined);\n\n public enableActiveState = false;\n\n public expandMode: string;\n\n public itemCollapseStateChange = new EventEmitter<SkyRepeaterItemComponent>();\n\n public items: SkyRepeaterItemComponent[] = [];\n\n public orderChange = new BehaviorSubject<void>(undefined);\n\n public repeaterGroupId: number;\n\n public ngOnDestroy(): void {\n this.activeItemChange.complete();\n this.itemCollapseStateChange.complete();\n this.orderChange.complete();\n }\n\n public activateItem(item: SkyRepeaterItemComponent): void {\n if (this.enableActiveState) {\n / istanbul ignore else /\n if (item) {\n const index = this.items.findIndex((i) => i === item);\n this.activeItemIndexChange.next(index);\n this.activeItemChange.next(item);\n }\n }\n }\n\n public activateItemByIndex(index: number): void {\n / istanbul ignore else */\n if (this.enableActiveState) {\n if (index === undefined) {\n this.activeItemChange.next(undefined);\n } else {\n const activeItem = this.items[index];\n if (activeItem) {\n this.activeItemChange.next(activeItem);\n }\n }\n }\n }\n\n public registerItem(item: SkyRepeaterItemComponent): void {\n this.items.push(item);\n }\n\n public unregisterItem(item: SkyRepeaterItemComponent): void {\n const indexOfDestroyedItem = this.items.indexOf(item);\n if (indexOfDestroyedItem > -1) {\n this.items.splice(indexOfDestroyedItem, 1);\n }\n }\n\n public onItemCollapseStateChange(item: SkyRepeaterItemComponent): void {\n this.itemCollapseStateChange.emit(item);\n }\n\n public getItemIndex(item: SkyRepeaterItemComponent): number {\n return this.items.indexOf(item);\n }\n\n public registerOrderChange(): void {\n this.orderChange.next();\n }\n\n public reorderItem(oldIndex: number, newIndex: number): void {\n this.items.splice(newIndex, 0, this.items.splice(oldIndex, 1)[0]);\n }\n}\n"]}
1	+ {"version":3,"file":"repeater.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/lists/src/lib/modules/repeater/repeater.service.ts"],"names":[],"mappings":"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","sourcesContent":["import { EventEmitter, Injectable, OnDestroy } from '@angular/core';\n\nimport { BehaviorSubject } from 'rxjs';\n\nimport { SkyRepeaterItemRolesType } from './repeater-item-roles.type';\nimport { SkyRepeaterItemComponent } from './repeater-item.component';\n\n/*\n @internal\n /\n@Injectable()\nexport class SkyRepeaterService implements OnDestroy {\n public activeItemChange = new BehaviorSubject<SkyRepeaterItemComponent>(\n undefined\n );\n\n public activeItemIndexChange = new BehaviorSubject<number>(undefined);\n\n public enableActiveState = false;\n\n public expandMode: string;\n\n public itemCollapseStateChange = new EventEmitter<SkyRepeaterItemComponent>();\n\n public items: SkyRepeaterItemComponent[] = [];\n\n public readonly itemRole = new BehaviorSubject<SkyRepeaterItemRolesType>({\n content: undefined,\n item: undefined,\n title: undefined,\n });\n\n public orderChange = new BehaviorSubject<void>(undefined);\n\n public repeaterGroupId: number;\n\n public ngOnDestroy(): void {\n this.activeItemChange.complete();\n this.itemCollapseStateChange.complete();\n this.orderChange.complete();\n }\n\n public activateItem(item: SkyRepeaterItemComponent): void {\n if (this.enableActiveState) {\n / istanbul ignore else /\n if (item && !item.disabled) {\n const index = this.items.findIndex((i) => i === item);\n this.activeItemIndexChange.next(index);\n this.activeItemChange.next(item);\n }\n }\n }\n\n public activateItemByIndex(index: number): void {\n / istanbul ignore else */\n if (this.enableActiveState) {\n if (index === undefined) {\n this.activeItemChange.next(undefined);\n } else {\n const activeItem = this.items[index];\n if (activeItem && !activeItem.disabled) {\n this.activeItemChange.next(activeItem);\n }\n }\n }\n }\n\n public registerItem(item: SkyRepeaterItemComponent): void {\n this.items.push(item);\n }\n\n public unregisterItem(item: SkyRepeaterItemComponent): void {\n const indexOfDestroyedItem = this.items.indexOf(item);\n if (indexOfDestroyedItem > -1) {\n this.items.splice(indexOfDestroyedItem, 1);\n }\n }\n\n public onItemCollapseStateChange(item: SkyRepeaterItemComponent): void {\n this.itemCollapseStateChange.emit(item);\n }\n\n public getItemIndex(item: SkyRepeaterItemComponent): number {\n return this.items.indexOf(item);\n }\n\n public registerOrderChange(): void {\n this.orderChange.next();\n }\n\n public reorderItem(oldIndex: number, newIndex: number): void {\n this.items.splice(newIndex, 0, this.items.splice(oldIndex, 1)[0]);\n }\n}\n"]}

package/fesm2015/skyux-lists.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import * as i2 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { NgModule, EventEmitter, Component, ChangeDetectionStrategy, Input, Output, Injectable, ElementRef, ViewEncapsulation, ContentChild, HostBinding, ViewChild, ContentChildren } from '@angular/core';
+import { NgModule, EventEmitter, Component, ChangeDetectionStrategy, Input, Output, Injectable, ElementRef, ViewEncapsulation, HostBinding, ContentChild, ViewChild, ContentChildren, HostListener } from '@angular/core';
 import * as i1 from '@skyux/indicators';
 import { SkyIconModule, SkyTokensModule, SkyWaitModule, SkyChevronModule } from '@skyux/indicators';
 import * as i3 from '@skyux/theme';
@@ -12,6 +12,8 @@ import { Subject, fromEvent, BehaviorSubject, forkJoin } from 'rxjs';
 import { takeUntil, filter, map } from 'rxjs/operators';
 import * as i1$1 from '@skyux/core';
 import { SkyIdModule } from '@skyux/core';
+import * as i4$2 from '@angular/cdk/observers';
+import { ObserversModule } from '@angular/cdk/observers';
 import * as i6 from '@skyux/forms';
 import { SkyCheckboxModule } from '@skyux/forms';
 import * as i4$1 from '@skyux/inline-form';
@@ -719,6 +721,11 @@ class SkyRepeaterService {
         this.enableActiveState = false;
         this.itemCollapseStateChange = new EventEmitter();
         this.items = [];
+        this.itemRole = new BehaviorSubject({
+            content: undefined,
+            item: undefined,
+            title: undefined,
+        });
         this.orderChange = new BehaviorSubject(undefined);
     }
     ngOnDestroy() {
@@ -729,7 +736,7 @@ class SkyRepeaterService {
     activateItem(item) {
         if (this.enableActiveState) {
             /* istanbul ignore else */
-            if (item) {
+            if (item && !item.disabled) {
                 const index = this.items.findIndex((i) => i === item);
                 this.activeItemIndexChange.next(index);
                 this.activeItemChange.next(item);
@@ -744,7 +751,7 @@ class SkyRepeaterService {
             }
             else {
                 const activeItem = this.items[index];
-                if (activeItem) {
+                if (activeItem && !activeItem.disabled) {
                     this.activeItemChange.next(activeItem);
                 }
             }
@@ -891,6 +898,7 @@ class SkyRepeaterItemComponent {
         this.keyboardReorderingEnabled = false;
         this.ngUnsubscribe = new Subject();
         this._isCollapsible = true;
+        this._isDisabled = false;
         this._isExpanded = true;
         this._isSelected = false;
         this.slideForExpanded(false);
@@ -908,6 +916,42 @@ class SkyRepeaterItemComponent {
             this.reorderMovedText = translatedStrings[4];
             this.reorderButtonLabel = this.reorderInstructions;
         });
+        this.itemRole$ = this.repeaterService.itemRole.asObservable();
+    }
+    /**
+     * Make the first, non-disabled item tab-focusable.
+     * - Disabled items should not be focusable per [W3C](https://www.w3.org/TR/wai-aria-practices-1.1/#kbd_disabled_controls).
+     * - One item per list/grid/listbox should be tab focusable per [W3C](https://www.w3.org/TR/wai-aria-practices-1.1/#grid).
+     */
+    get tabindex() {
+        return this.repeaterService.items.filter((item) => !item.disabled)[0] ===
+            this
+            ? 0
+            : -1;
+    }
+    /**
+     * Whether to exclude an item when cycling through.
+     */
+    set disabled(value) {
+        if (this._isDisabled !== value) {
+            if (value) {
+                this.isSelected = false;
+                this._isDisabled = true;
+            }
+            else {
+                this._isDisabled = false;
+            }
+            if (this.isActive) {
+                this.repeaterService.activateItemByIndex(undefined);
+            }
+            if (this.elementRef.nativeElement.matches(':focus-within')) {
+                this.elementRef.nativeElement.ownerDocument.activeElement.blur();
+            }
+            this.changeDetector.markForCheck();
+        }
+    }
+    get disabled() {
+        return this._isDisabled;
     }
     /**
      * Indicates whether the repeater item is expanded.
@@ -925,7 +969,7 @@ class SkyRepeaterItemComponent {
      * @default false
      */
     set isSelected(value) {
-        if (value !== this._isSelected) {
+        if (!this.disabled && value !== this._isSelected) {
             this._isSelected = value;
             this.isSelectedChange.emit(this._isSelected);
         }
@@ -974,6 +1018,73 @@ class SkyRepeaterItemComponent {
         this.ngUnsubscribe.complete();
         this.repeaterService.unregisterItem(this);
     }
+    onKeydown($event) {
+        if ([' ', 'Enter', 'Home', 'End', 'ArrowUp', 'ArrowDown'].includes($event.key)) {
+            if ($event.target.matches('input, textarea, select, option, [contenteditable], [contenteditable] *')) {
+                return;
+            }
+            $event.preventDefault();
+            $event.stopPropagation();
+            let activateItem = undefined;
+            /* istanbul ignore else */
+            if ([' ', 'Enter'].includes($event.key)) {
+                if (this.selectable) {
+                    this.isSelected = !this.isSelected;
+                }
+                activateItem = this;
+            }
+            /* istanbul ignore else */
+            if (['Home', 'End'].includes($event.key)) {
+                const items = this.repeaterService.items.filter((item) => !item.disabled);
+                if ($event.key === 'Home') {
+                    activateItem = items.shift();
+                }
+                else {
+                    activateItem = items.pop();
+                }
+            }
+            /* istanbul ignore else */
+            if (['ArrowUp', 'ArrowDown'].includes($event.key)) {
+                const currentIndex = this.repeaterService.items.findIndex((item) => item === this);
+                let sliceFrom;
+                let sliceTo;
+                if ($event.key === 'ArrowUp') {
+                    sliceFrom = 0;
+                    sliceTo = currentIndex;
+                }
+                else {
+                    sliceFrom = currentIndex + 1;
+                    sliceTo = undefined;
+                }
+                const items = this.repeaterService.items
+                    .slice(sliceFrom, sliceTo)
+                    .filter((item) => !item.disabled);
+                activateItem = $event.key === 'ArrowUp' ? items.pop() : items.shift();
+                if (!activateItem) {
+                    // Wrap around.
+                    if ($event.key === 'ArrowDown') {
+                        sliceFrom = 0;
+                        sliceTo = currentIndex;
+                    }
+                    else {
+                        sliceFrom = currentIndex + 1;
+                        sliceTo = undefined;
+                    }
+                    const items = this.repeaterService.items
+                        .slice(sliceFrom, sliceTo)
+                        .filter((item) => !item.disabled);
+                    activateItem = $event.key === 'ArrowUp' ? items.pop() : items.shift();
+                }
+            }
+            /* istanbul ignore else */
+            if (activateItem && !activateItem.isActive) {
+                this.repeaterService.activateItem(activateItem);
+                if (!activateItem.elementRef.nativeElement.matches(':focus-within')) {
+                    activateItem.elementRef.nativeElement.focus();
+                }
+            }
+        }
+    }
     headerClick() {
         if (this.isCollapsible) {
             this.updateForExpanded(!this.isExpanded, true);
@@ -1081,29 +1192,6 @@ class SkyRepeaterItemComponent {
         this.reorderButtonLabel = this.reorderInstructions;
         this.reorderState = undefined;
     }
-    onItemKeyDown(event) {
-        /*istanbul ignore else */
-        if (event.key) {
-            switch (event.key.toLowerCase()) {
-                case ' ':
-                case 'enter':
-                    /* istanbul ignore else */
-                    /* Sanity check */
-                    // Space/enter should never execute unless focused on the parent item element.
-                    if (event.target === this.itemRef.nativeElement) {
-                        if (this.selectable) {
-                            this.isSelected = !this.isSelected;
-                        }
-                        this.repeaterService.activateItem(this);
-                        event.preventDefault();
-                    }
-                    break;
-                /* istanbul ignore next */
-                default:
-                    break;
-            }
-        }
-    }
     slideForExpanded(animate) {
         this.slideDirection = this.isExpanded ? 'down' : 'up';
     }
@@ -1156,7 +1244,7 @@ class SkyRepeaterItemComponent {
     }
 }
 SkyRepeaterItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyRepeaterItemComponent, deps: [{ token: SkyRepeaterService }, { token: i0.ChangeDetectorRef }, { token: SkyRepeaterAdapterService }, { token: i0.ElementRef }, { token: i4.SkyLibResourcesService }], target: i0.ɵɵFactoryTarget.Component });
-SkyRepeaterItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyRepeaterItemComponent, selector: "sky-repeater-item", inputs: { itemName: "itemName", inlineFormConfig: "inlineFormConfig", inlineFormTemplate: "inlineFormTemplate", isExpanded: "isExpanded", isSelected: "isSelected", reorderable: "reorderable", selectable: "selectable", showInlineForm: "showInlineForm", tag: "tag" }, outputs: { collapse: "collapse", expand: "expand", inlineFormClose: "inlineFormClose", isSelectedChange: "isSelectedChange" }, host: { properties: { "class": "this.repeaterGroupClass" } }, queries: [{ propertyName: "contextMenu", first: true, predicate: SkyRepeaterItemContextMenuComponent, descendants: true, read: ElementRef }, { propertyName: "repeaterItemContentComponents", predicate: SkyRepeaterItemContentComponent }], viewQueries: [{ propertyName: "grabHandle", first: true, predicate: ["grabHandle"], descendants: true, read: ElementRef }, { propertyName: "itemContentRef", first: true, predicate: ["itemContentRef"], descendants: true, read: ElementRef }, { propertyName: "itemHeaderRef", first: true, predicate: ["itemHeaderRef"], descendants: true, read: ElementRef }, { propertyName: "itemRef", first: true, predicate: ["itemRef"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n  class=\"sky-repeater-item sky-padding-even-default\"\n  role=\"option\"\n  [attr.aria-label]=\"itemName\"\n  [attr.aria-selected]=\"selectable ? isSelected : null\"\n  [ngClass]=\"{\n    'sky-repeater-item-active': isActive,\n    'sky-repeater-item-collapsible': isCollapsible,\n    'sky-repeater-item-selected': isSelected\n  }\"\n  (click)=\"onRepeaterItemClick($event)\"\n  (keydown)=\"onItemKeyDown($event)\"\n  #itemRef\n>\n  <div #inlineDelete>\n    <ng-content select=\"sky-inline-delete\"></ng-content>\n  </div>\n\n  <ng-container *ngIf=\"inlineFormTemplate\">\n    <sky-inline-form\n      [config]=\"inlineFormConfig\"\n      [showForm]=\"showInlineForm\"\n      [template]=\"inlineFormTemplate\"\n      (close)=\"onInlineFormClose($event)\"\n    >\n      <ng-container *ngTemplateOutlet=\"skyRepeaterItemLeft\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"skyRepeaterItemRight\"></ng-container>\n    </sky-inline-form>\n  </ng-container>\n\n  <ng-container *ngIf=\"!inlineFormTemplate\">\n    <ng-container *ngTemplateOutlet=\"skyRepeaterItemLeft\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"skyRepeaterItemRight\"></ng-container>\n  </ng-container>\n</div>\n\n<ng-template #skyRepeaterItemLeft>\n  <div class=\"sky-repeater-item-left\">\n    <ng-container *ngIf=\"reorderable\">\n      <span\n        aria-live=\"assertive\"\n        class=\"sky-screen-reader-only\"\n        [id]=\"contentId + '-reorder-state'\"\n      >\n        {{ reorderState }}\n      </span>\n      <span\n        class=\"sky-screen-reader-only\"\n        [id]=\"contentId + '-reorder-instructions'\"\n        >{{ reorderButtonLabel }}</span\n      >\n      <button\n        class=\"sky-btn sky-tile-tools-control sky-repeater-item-grab-handle\"\n        type=\"button\"\n        [attr.aria-describedby]=\"contentId + '-reorder-instructions'\"\n        [attr.aria-label]=\"\n          itemName\n            ? ('skyux_repeater_item_reorder_label' | skyLibResources: itemName)\n            : ('skyux_repeater_item_reorder_label_default' | skyLibResources)\n        \"\n        (blur)=\"onReorderHandleBlur($event)\"\n        (keydown)=\"onReorderHandleKeyDown($event)\"\n        #grabHandle\n      >\n        <sky-icon icon=\"arrows-v\"></sky-icon>\n      </button>\n    </ng-container>\n    <sky-checkbox\n      *ngIf=\"selectable\"\n      class=\"sky-repeater-item-checkbox\"\n      [checked]=\"isSelected\"\n      [label]=\"\n        itemName\n          ? ('skyux_repeater_item_checkbox_label' | skyLibResources: itemName)\n          : ('skyux_repeater_item_checkbox_label_default' | skyLibResources)\n      \"\n      (change)=\"onCheckboxChange($event)\"\n    >\n    </sky-checkbox>\n    <div\n      class=\"sky-repeater-item-context-menu\"\n      [hidden]=\"contextMenuEl.children.length === 0\"\n      #contextMenuEl\n    >\n      <ng-content select=\"sky-repeater-item-context-menu\"></ng-content>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #skyRepeaterItemRight>\n  <div class=\"sky-repeater-item-right\" #itemHeaderRef>\n    <div\n      class=\"sky-repeater-item-header\"\n      [hidden]=\"titleRef.children.length === 0\"\n      (click)=\"headerClick()\"\n    >\n      <div class=\"sky-repeater-item-title sky-emphasized\" #titleRef>\n        <ng-content select=\"sky-repeater-item-title\"></ng-content>\n      </div>\n      <button\n        *ngIf=\"reorderable\"\n        class=\"sky-btn sky-btn-link sky-repeater-item-reorder-top\"\n        type=\"button\"\n        [attr.aria-label]=\"\n          itemName\n            ? ('skyux_repeater_item_reorder_top_label'\n              | skyLibResources: itemName)\n            : ('skyux_repeater_item_reorder_top_label_default'\n              | skyLibResources)\n        \"\n        (click)=\"moveToTop($event)\"\n      >\n        <sky-icon icon=\"arrow-circle-up\"></sky-icon>\n        {{ 'skyux_repeater_item_reorder_top' | skyLibResources }}\n      </button>\n      <div *ngIf=\"isCollapsible\" class=\"sky-repeater-item-chevron\">\n        <sky-chevron\n          [ariaControls]=\"contentId\"\n          [ariaLabel]=\"\n            itemName\n              ? ('skyux_repeater_item_expand' | skyLibResources: itemName)\n              : ('skyux_repeater_item_expand_default' | skyLibResources)\n          \"\n          [direction]=\"isExpanded ? 'up' : 'down'\"\n          (directionChange)=\"chevronDirectionChange($event)\"\n        >\n        </sky-chevron>\n      </div>\n      <!-- Used for when the chevron is hidden to ensure that the right side is the same height as the left.-->\n      <div\n        *ngIf=\"!isCollapsible && !contextMenu\"\n        class=\"sky-repeater-item-chevron-placeholder\"\n      ></div>\n      <!-- Used to ensure that the right side is the same height as the left.-->\n      <div\n        *ngIf=\"contextMenu\"\n        class=\"sky-repeater-item-chevron-placeholder-with-context\"\n      ></div>\n    </div>\n    <div\n      class=\"sky-repeater-item-content\"\n      [id]=\"contentId\"\n      [@skyAnimationSlide]=\"slideDirection\"\n      #itemContentRef\n    >\n      <ng-content select=\"sky-repeater-item-content\"></ng-content>\n    </div>\n  </div>\n</ng-template>\n", styles: ["sky-repeater-item .sky-repeater-item{display:flex;border-bottom:1px dotted #cdcfd2;padding-top:0;position:relative;transition:box-shadow .15s;align-items:flex-start}sky-repeater-item .sky-repeater-item sky-inline-form{display:block;width:100%}sky-repeater-item .sky-repeater-item sky-inline-form>:first-child,sky-repeater-item .sky-repeater-item sky-inline-form .sky-slide-dissolve-first,sky-repeater-item .sky-repeater-item sky-inline-form .sky-slide-dissolve-last{display:flex;flex:1 0 auto;width:100%}sky-repeater-item .sky-repeater-item sky-inline-form .sky-slide-dissolve-last{padding-top:10px}sky-repeater-item .sky-repeater-item.sky-repeater-item-active{background-color:#eeeeef;color:#212327;padding-left:6px;border-left:4px solid #00b4f1}sky-repeater-item .sky-repeater-item.sky-repeater-item-active .sky-inline-delete{margin-left:-4px;width:calc(100% + 4px)}sky-repeater-item .sky-repeater-item-left{display:flex;padding-top:10px;align-items:center}sky-repeater-item .sky-repeater-item-left sky-checkbox{display:flex}sky-repeater-item .sky-repeater-item-right{max-width:100%;flex-grow:1;align-self:center}sky-repeater-item .sky-repeater-item-header{align-items:center;display:flex;padding-top:10px}sky-repeater-item .sky-repeater-item-chevron{margin-left:10px}sky-repeater-item .sky-repeater-item-chevron-placeholder{height:24px}sky-repeater-item .sky-repeater-item-chevron-placeholder-with-context{height:29px}sky-repeater-item .sky-repeater-item-context-menu{padding:0 10px 0 0}sky-repeater-item .sky-repeater-item-checkbox{padding:0 5px 0 0}sky-repeater-item .sky-repeater-item-selected{background-color:#f1eef6;transition:background-color .15s}sky-repeater-item .sky-repeater-item-title{margin:0;flex-grow:1;line-height:1.1;color:#212327}sky-repeater-item sky-repeater-item-content{display:block;margin:10px 0 0}sky-repeater-item .sky-repeater-item-collapsible .sky-repeater-item-header{cursor:pointer}sky-repeater-item .sky-repeater-item-collapsible .sky-repeater-item-content{padding-right:34px}sky-repeater-item .sky-repeater-item-collapsed .sky-repeater-item-content{display:none}sky-repeater-item .sky-repeater-item-grab-handle{color:#cdcfd2;cursor:pointer;border:0;width:24px;height:24px;cursor:grab;cursor:-moz-grab;padding:0;margin-right:10px}sky-repeater-item .sky-repeater-item-grab-handle:hover{color:#979ba2;transition:color .15s}sky-repeater-item.sky-repeater-item-dragging.gu-mirror{opacity:initial;-ms-filter:initial;filter:initial;background-color:#fff;box-shadow:0 0 5px #0000004d}sky-repeater-item.sky-repeater-item-dragging.gu-transit .sky-repeater-item{background-color:#d8d8d8}sky-repeater-item.sky-repeater-item-dragging.gu-transit .sky-repeater-item .sky-repeater-item-left,sky-repeater-item.sky-repeater-item-dragging.gu-transit .sky-repeater-item .sky-repeater-item-right{visibility:hidden}sky-repeater-item.sky-repeater-item-dragging .sky-repeater-item-grab-handle{cursor:grabbing;cursor:-webkit-grabbing}.sky-theme-modern sky-repeater-item .sky-repeater-item{padding-bottom:20px}.sky-theme-modern sky-repeater-item .sky-repeater-item.sky-repeater-item-active{background-color:transparent;border-left-color:#1870b8}.sky-theme-modern sky-repeater-item .sky-repeater-item:focus,.sky-theme-modern sky-repeater-item .sky-repeater-item:active:focus{outline:solid 2px #1870B8;outline-offset:-2px}.sky-theme-modern sky-repeater-item .sky-repeater-item:focus:not(:active){box-shadow:0 1px 8px #0000004d}.sky-theme-modern sky-repeater-item .sky-repeater-item-header[hidden]+.sky-repeater-item-content sky-repeater-item-content{margin:20px 0 0}.sky-theme-modern sky-repeater-item .sky-repeater-item-header,.sky-theme-modern sky-repeater-item .sky-repeater-item-left{padding-top:20px}.sky-theme-modern sky-repeater-item sky-inline-form .sky-slide-dissolve-last{padding-top:20px}.sky-theme-modern.sky-theme-mode-dark sky-repeater-item .sky-repeater-item{border-bottom-color:#686c73}.sky-theme-modern.sky-theme-mode-dark sky-repeater-item .sky-repeater-item.sky-repeater-item-active{color:#fbfcfe}.sky-theme-modern.sky-theme-mode-dark sky-repeater-item .sky-repeater-item-title{color:#fbfcfe}\n"], components: [{ type: i4$1.λ1, selector: "sky-inline-form", inputs: ["config", "template", "showForm"], outputs: ["close"] }, { type: i1.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { type: i6.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "icon", "checkboxType", "checked", "required"], outputs: ["change", "checkedChange", "disabledChange"] }, { type: i1.λ2, selector: "sky-chevron", inputs: ["ariaControls", "ariaLabel", "direction", "disabled"], outputs: ["directionChange"] }], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "skyLibResources": i4.SkyLibResourcesPipe }, animations: [skyAnimationSlide], encapsulation: i0.ViewEncapsulation.None });
+SkyRepeaterItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyRepeaterItemComponent, selector: "sky-repeater-item", inputs: { disabled: "disabled", itemName: "itemName", inlineFormConfig: "inlineFormConfig", inlineFormTemplate: "inlineFormTemplate", isExpanded: "isExpanded", isSelected: "isSelected", reorderable: "reorderable", selectable: "selectable", showInlineForm: "showInlineForm", tag: "tag" }, outputs: { collapse: "collapse", expand: "expand", inlineFormClose: "inlineFormClose", isSelectedChange: "isSelectedChange" }, host: { listeners: { "keydown": "onKeydown($event)" }, properties: { "tabindex": "this.tabindex", "class": "this.repeaterGroupClass" } }, queries: [{ propertyName: "contextMenu", first: true, predicate: SkyRepeaterItemContextMenuComponent, descendants: true, read: ElementRef }, { propertyName: "repeaterItemContentComponents", predicate: SkyRepeaterItemContentComponent }], viewQueries: [{ propertyName: "grabHandle", first: true, predicate: ["grabHandle"], descendants: true, read: ElementRef }, { propertyName: "itemContentRef", first: true, predicate: ["itemContentRef"], descendants: true, read: ElementRef }, { propertyName: "itemHeaderRef", first: true, predicate: ["itemHeaderRef"], descendants: true, read: ElementRef }, { propertyName: "itemRef", first: true, predicate: ["itemRef"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n  class=\"sky-repeater-item sky-padding-even-default\"\n  [attr.aria-label]=\"itemName\"\n  [attr.aria-selected]=\"selectable ? isSelected : undefined\"\n  [attr.role]=\"(itemRole$ | async).item\"\n  [ngClass]=\"{\n    'sky-repeater-item-active': isActive,\n    'sky-repeater-item-collapsible': isCollapsible,\n    'sky-repeater-item-selected': isSelected\n  }\"\n  (click)=\"onRepeaterItemClick($event)\"\n  #itemRef\n>\n  <div #inlineDelete>\n    <ng-content select=\"sky-inline-delete\"></ng-content>\n  </div>\n\n  <ng-container *ngIf=\"inlineFormTemplate\">\n    <sky-inline-form\n      [config]=\"inlineFormConfig\"\n      [showForm]=\"showInlineForm\"\n      [template]=\"inlineFormTemplate\"\n      (close)=\"onInlineFormClose($event)\"\n    >\n      <ng-container *ngTemplateOutlet=\"skyRepeaterItemLeft\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"skyRepeaterItemRight\"></ng-container>\n    </sky-inline-form>\n  </ng-container>\n\n  <ng-container *ngIf=\"!inlineFormTemplate\">\n    <ng-container *ngTemplateOutlet=\"skyRepeaterItemLeft\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"skyRepeaterItemRight\"></ng-container>\n  </ng-container>\n</div>\n\n<ng-template #skyRepeaterItemLeft>\n  <div class=\"sky-repeater-item-left\">\n    <ng-container *ngIf=\"reorderable\">\n      <span\n        aria-live=\"assertive\"\n        class=\"sky-screen-reader-only\"\n        [id]=\"contentId + '-reorder-state'\"\n      >\n        {{ reorderState }}\n      </span>\n      <span\n        class=\"sky-screen-reader-only\"\n        [id]=\"contentId + '-reorder-instructions'\"\n        >{{ reorderButtonLabel }}</span\n      >\n      <button\n        class=\"sky-btn sky-tile-tools-control sky-repeater-item-grab-handle\"\n        type=\"button\"\n        [attr.aria-describedby]=\"contentId + '-reorder-instructions'\"\n        [attr.aria-label]=\"\n          itemName\n            ? ('skyux_repeater_item_reorder_label' | skyLibResources: itemName)\n            : ('skyux_repeater_item_reorder_label_default' | skyLibResources)\n        \"\n        (blur)=\"onReorderHandleBlur($event)\"\n        (keydown)=\"onReorderHandleKeyDown($event)\"\n        #grabHandle\n      >\n        <sky-icon icon=\"arrows-v\"></sky-icon>\n      </button>\n    </ng-container>\n    <sky-checkbox\n      *ngIf=\"selectable\"\n      class=\"sky-repeater-item-checkbox\"\n      [checked]=\"isSelected\"\n      [label]=\"\n        itemName\n          ? ('skyux_repeater_item_checkbox_label' | skyLibResources: itemName)\n          : ('skyux_repeater_item_checkbox_label_default' | skyLibResources)\n      \"\n      (change)=\"onCheckboxChange($event)\"\n    >\n    </sky-checkbox>\n    <div\n      class=\"sky-repeater-item-context-menu\"\n      [hidden]=\"contextMenuEl.children.length === 0\"\n      #contextMenuEl\n    >\n      <ng-content select=\"sky-repeater-item-context-menu\"></ng-content>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #skyRepeaterItemRight>\n  <div class=\"sky-repeater-item-right\" #itemHeaderRef>\n    <div\n      class=\"sky-repeater-item-header\"\n      [hidden]=\"titleRef.children.length === 0\"\n      (click)=\"headerClick()\"\n    >\n      <div\n        class=\"sky-repeater-item-title sky-emphasized\"\n        #titleRef\n        [attr.role]=\"(itemRole$ | async).title\"\n      >\n        <ng-content select=\"sky-repeater-item-title\"></ng-content>\n      </div>\n      <button\n        *ngIf=\"reorderable\"\n        class=\"sky-btn sky-btn-link sky-repeater-item-reorder-top\"\n        type=\"button\"\n        [attr.aria-label]=\"\n          itemName\n            ? ('skyux_repeater_item_reorder_top_label'\n              | skyLibResources: itemName)\n            : ('skyux_repeater_item_reorder_top_label_default'\n              | skyLibResources)\n        \"\n        (click)=\"moveToTop($event)\"\n      >\n        <sky-icon icon=\"arrow-circle-up\"></sky-icon>\n        {{ 'skyux_repeater_item_reorder_top' | skyLibResources }}\n      </button>\n      <div *ngIf=\"isCollapsible\" class=\"sky-repeater-item-chevron\">\n        <sky-chevron\n          [ariaControls]=\"contentId\"\n          [ariaLabel]=\"\n            itemName\n              ? ('skyux_repeater_item_expand' | skyLibResources: itemName)\n              : ('skyux_repeater_item_expand_default' | skyLibResources)\n          \"\n          [direction]=\"isExpanded ? 'up' : 'down'\"\n          (directionChange)=\"chevronDirectionChange($event)\"\n        >\n        </sky-chevron>\n      </div>\n      <!-- Used for when the chevron is hidden to ensure that the right side is the same height as the left.-->\n      <div\n        *ngIf=\"!isCollapsible && !contextMenu\"\n        class=\"sky-repeater-item-chevron-placeholder\"\n      ></div>\n      <!-- Used to ensure that the right side is the same height as the left.-->\n      <div\n        *ngIf=\"contextMenu\"\n        class=\"sky-repeater-item-chevron-placeholder-with-context\"\n      ></div>\n    </div>\n    <div\n      class=\"sky-repeater-item-content\"\n      [id]=\"contentId\"\n      [@skyAnimationSlide]=\"slideDirection\"\n      #itemContentRef\n      [attr.role]=\"(itemRole$ | async).content\"\n    >\n      <ng-content select=\"sky-repeater-item-content\"></ng-content>\n    </div>\n  </div>\n</ng-template>\n", styles: ["sky-repeater-item .sky-repeater-item{display:flex;border-bottom:1px dotted #cdcfd2;padding-top:0;position:relative;transition:box-shadow .15s;align-items:flex-start}sky-repeater-item .sky-repeater-item sky-inline-form{display:block;width:100%}sky-repeater-item .sky-repeater-item sky-inline-form>:first-child,sky-repeater-item .sky-repeater-item sky-inline-form .sky-slide-dissolve-first,sky-repeater-item .sky-repeater-item sky-inline-form .sky-slide-dissolve-last{display:flex;flex:1 0 auto;width:100%}sky-repeater-item .sky-repeater-item sky-inline-form .sky-slide-dissolve-last{padding-top:10px}sky-repeater-item .sky-repeater-item.sky-repeater-item-active{background-color:#eeeeef;color:#212327;padding-left:6px;border-left:4px solid #00b4f1}sky-repeater-item .sky-repeater-item.sky-repeater-item-active .sky-inline-delete{margin-left:-4px;width:calc(100% + 4px)}sky-repeater-item .sky-repeater-item-left{display:flex;padding-top:10px;align-items:center}sky-repeater-item .sky-repeater-item-left sky-checkbox{display:flex}sky-repeater-item .sky-repeater-item-right{max-width:100%;flex-grow:1;align-self:center}sky-repeater-item .sky-repeater-item-header{align-items:center;display:flex;padding-top:10px}sky-repeater-item .sky-repeater-item-chevron{margin-left:10px}sky-repeater-item .sky-repeater-item-chevron-placeholder{height:24px}sky-repeater-item .sky-repeater-item-chevron-placeholder-with-context{height:29px}sky-repeater-item .sky-repeater-item-context-menu{padding:0 10px 0 0}sky-repeater-item .sky-repeater-item-checkbox{padding:0 5px 0 0}sky-repeater-item .sky-repeater-item-selected{background-color:#f1eef6;transition:background-color .15s}sky-repeater-item .sky-repeater-item-title{margin:0;flex-grow:1;line-height:1.1;color:#212327}sky-repeater-item sky-repeater-item-content{display:block;margin:10px 0 0}sky-repeater-item .sky-repeater-item-collapsible .sky-repeater-item-header{cursor:pointer}sky-repeater-item .sky-repeater-item-collapsible .sky-repeater-item-content{padding-right:34px}sky-repeater-item .sky-repeater-item-collapsed .sky-repeater-item-content{display:none}sky-repeater-item .sky-repeater-item-grab-handle{color:#cdcfd2;cursor:pointer;border:0;width:24px;height:24px;cursor:grab;cursor:-moz-grab;padding:0;margin-right:10px}sky-repeater-item .sky-repeater-item-grab-handle:hover{color:#979ba2;transition:color .15s}sky-repeater-item.sky-repeater-item-dragging.gu-mirror{opacity:initial;-ms-filter:initial;filter:initial;background-color:#fff;box-shadow:0 0 5px #0000004d}sky-repeater-item.sky-repeater-item-dragging.gu-transit .sky-repeater-item{background-color:#d8d8d8}sky-repeater-item.sky-repeater-item-dragging.gu-transit .sky-repeater-item .sky-repeater-item-left,sky-repeater-item.sky-repeater-item-dragging.gu-transit .sky-repeater-item .sky-repeater-item-right{visibility:hidden}sky-repeater-item.sky-repeater-item-dragging .sky-repeater-item-grab-handle{cursor:grabbing;cursor:-webkit-grabbing}.sky-theme-modern sky-repeater-item .sky-repeater-item{padding-bottom:20px}.sky-theme-modern sky-repeater-item .sky-repeater-item.sky-repeater-item-active{background-color:transparent;border-left-color:#1870b8}.sky-theme-modern sky-repeater-item .sky-repeater-item:focus,.sky-theme-modern sky-repeater-item .sky-repeater-item:active:focus{outline:solid 2px #1870B8;outline-offset:-2px}.sky-theme-modern sky-repeater-item .sky-repeater-item:focus:not(:active){box-shadow:0 1px 8px #0000004d}.sky-theme-modern sky-repeater-item .sky-repeater-item-header[hidden]+.sky-repeater-item-content sky-repeater-item-content{margin:20px 0 0}.sky-theme-modern sky-repeater-item .sky-repeater-item-header,.sky-theme-modern sky-repeater-item .sky-repeater-item-left{padding-top:20px}.sky-theme-modern sky-repeater-item sky-inline-form .sky-slide-dissolve-last{padding-top:20px}.sky-theme-modern.sky-theme-mode-dark sky-repeater-item .sky-repeater-item{border-bottom-color:#686c73}.sky-theme-modern.sky-theme-mode-dark sky-repeater-item .sky-repeater-item.sky-repeater-item-active{color:#fbfcfe}.sky-theme-modern.sky-theme-mode-dark sky-repeater-item .sky-repeater-item-title{color:#fbfcfe}\n"], components: [{ type: i4$1.λ1, selector: "sky-inline-form", inputs: ["config", "template", "showForm"], outputs: ["close"] }, { type: i1.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { type: i6.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "icon", "checkboxType", "checked", "required"], outputs: ["change", "checkedChange", "disabledChange"] }, { type: i1.λ2, selector: "sky-chevron", inputs: ["ariaControls", "ariaLabel", "direction", "disabled"], outputs: ["directionChange"] }], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i2.AsyncPipe, "skyLibResources": i4.SkyLibResourcesPipe }, animations: [skyAnimationSlide], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyRepeaterItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -1166,7 +1254,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     animations: [skyAnimationSlide],
                     encapsulation: ViewEncapsulation.None,
                 }]
-        }], ctorParameters: function () { return [{ type: SkyRepeaterService }, { type: i0.ChangeDetectorRef }, { type: SkyRepeaterAdapterService }, { type: i0.ElementRef }, { type: i4.SkyLibResourcesService }]; }, propDecorators: { itemName: [{
+        }], ctorParameters: function () { return [{ type: SkyRepeaterService }, { type: i0.ChangeDetectorRef }, { type: SkyRepeaterAdapterService }, { type: i0.ElementRef }, { type: i4.SkyLibResourcesService }]; }, propDecorators: { tabindex: [{
+                type: HostBinding
+            }], disabled: [{
+                type: Input
+            }], itemName: [{
                 type: Input
             }], inlineFormConfig: [{
                 type: Input
@@ -1213,6 +1305,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             }], repeaterItemContentComponents: [{
                 type: ContentChildren,
                 args: [SkyRepeaterItemContentComponent]
+            }], onKeydown: [{
+                type: HostListener,
+                args: ['keydown', ['$event']]
             }] } });
 let uniqueId = 0;
@@ -1325,6 +1420,7 @@ class SkyRepeaterComponent {
                 if (this.activeIndex !== undefined) {
                     this.repeaterService.activateItemByIndex(this.activeIndex);
                 }
+                this.updateRole();
             });
         });
         setTimeout(() => {
@@ -1332,6 +1428,7 @@ class SkyRepeaterComponent {
             this.items.forEach((item) => {
                 item.reorderable = this.reorderable;
             });
+            this.updateRole();
         }, 0);
     }
     ngOnChanges(changes) {
@@ -1346,6 +1443,7 @@ class SkyRepeaterComponent {
             if (this.items) {
                 this.items.forEach((item) => (item.reorderable = this.reorderable));
             }
+            this.updateRole();
             this.changeDetector.markForCheck();
         }
     }
@@ -1354,6 +1452,12 @@ class SkyRepeaterComponent {
         this.ngUnsubscribe.complete();
         this.destroyDragAndDrop();
     }
+    ngOnInit() {
+        this.updateRole();
+    }
+    onCdkObserveContent() {
+        this.updateRole();
+    }
     updateForExpandMode(itemAdded) {
         if (this.items) {
             let foundExpanded = false;
@@ -1372,6 +1476,7 @@ class SkyRepeaterComponent {
                     foundExpanded = true;
                 }
             });
+            this.updateRole();
         }
     }
     initializeDragAndDrop() {
@@ -1436,9 +1541,59 @@ class SkyRepeaterComponent {
             return item.tag !== undefined;
         });
     }
+    updateRole() {
+        // Determine a role using a hierarchy based on https://www.w3.org/TR/wai-aria-practices-1.1/
+        //   1. If there are one or more interactions in the repeater item projected content, use grid.
+        //   2. If there are selectable repeater items and no other interactions, use listbox.
+        //   3. If there are no interactions, use list.
+        var _a, _b;
+        // Default to list role.
+        let autoRole = 'list';
+        const roleMap = {
+            list: { item: 'listitem', title: undefined, content: undefined },
+            listbox: { item: 'option', title: undefined, content: undefined },
+            grid: { item: 'row', title: 'rowheader', content: 'gridcell' },
+        };
+        // Based on https://html.spec.whatwg.org/multipage/dom.html#interactive-content
+        const interactionSelector = [
+            'a[href]',
+            'audio[controls]',
+            'button',
+            'details',
+            'embed',
+            'iframe',
+            'img[usemap]',
+            'input:not([type="hidden"])',
+            'label',
+            'select',
+            'textarea',
+            'video[controls]',
+            '[contenteditable]',
+            '.sky-repeater[role="grid"]',
+        ]
+            .map((selector) => `sky-repeater-item-title ${selector}:not([hidden]), sky-repeater-item-content ${selector}:not([hidden])`)
+            .concat([`skyux-dropdown`])
+            .join(', ');
+        const hasInteraction = this.reorderable ||
+            ((_a = this.items) === null || _a === void 0 ? void 0 : _a.some((item) => item.isCollapsible)) ||
+            !!this.elementRef.nativeElement.querySelector(interactionSelector);
+        if (hasInteraction) {
+            // If the repeater matches interaction selector https://www.w3.org/TR/wai-aria-practices-1.1/#grid
+            autoRole = 'grid';
+        }
+        else if ((_b = this.items) === null || _b === void 0 ? void 0 : _b.some((item) => item.selectable)) {
+            // If the only interaction is select https://www.w3.org/TR/wai-aria-practices-1.1/#Listbox
+            autoRole = 'listbox';
+        }
+        if (this.role !== autoRole) {
+            this.repeaterService.itemRole.next(Object.assign({}, roleMap[autoRole]));
+            this.role = `${autoRole}`;
+            this.changeDetector.markForCheck();
+        }
+    }
 }
 SkyRepeaterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyRepeaterComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: SkyRepeaterService }, { token: SkyRepeaterAdapterService }, { token: i3$1.DragulaService }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-SkyRepeaterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyRepeaterComponent, selector: "sky-repeater", inputs: { activeIndex: "activeIndex", ariaLabel: "ariaLabel", reorderable: "reorderable", expandMode: "expandMode" }, outputs: { activeIndexChange: "activeIndexChange", orderChange: "orderChange" }, providers: [SkyRepeaterService, SkyRepeaterAdapterService], queries: [{ propertyName: "items", predicate: SkyRepeaterItemComponent }], usesOnChanges: true, ngImport: i0, template: "<ng-container #repeaterHost>\n  <div\n    class=\"sky-repeater\"\n    role=\"listbox\"\n    [attr.aria-label]=\"ariaLabel || ('skyux_repeater_label' | skyLibResources)\"\n    [dragula]=\"dragulaGroupName\"\n  >\n    <ng-content></ng-content>\n  </div>\n</ng-container>\n", styles: [".sky-repeater{padding:0}\n"], directives: [{ type: i3$1.DragulaDirective, selector: "[dragula]", inputs: ["dragula", "dragulaModel", "dragulaOptions"] }], pipes: { "skyLibResources": i4.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+SkyRepeaterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyRepeaterComponent, selector: "sky-repeater", inputs: { activeIndex: "activeIndex", ariaLabel: "ariaLabel", reorderable: "reorderable", expandMode: "expandMode" }, outputs: { activeIndexChange: "activeIndexChange", orderChange: "orderChange" }, providers: [SkyRepeaterService, SkyRepeaterAdapterService], queries: [{ propertyName: "items", predicate: SkyRepeaterItemComponent }], usesOnChanges: true, ngImport: i0, template: "<ng-container #repeaterHost>\n  <div\n    class=\"sky-repeater\"\n    [attr.role]=\"role\"\n    [attr.aria-label]=\"ariaLabel || ('skyux_repeater_label' | skyLibResources)\"\n    [dragula]=\"dragulaGroupName\"\n    (cdkObserveContent)=\"onCdkObserveContent()\"\n  >\n    <ng-content></ng-content>\n  </div>\n</ng-container>\n", styles: [".sky-repeater{padding:0}\n"], directives: [{ type: i3$1.DragulaDirective, selector: "[dragula]", inputs: ["dragula", "dragulaModel", "dragulaOptions"] }, { type: i4$2.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }], pipes: { "skyLibResources": i4.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyRepeaterComponent, decorators: [{
             type: Component,
             args: [{
@@ -1474,6 +1629,7 @@ SkyRepeaterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versi
         SkyRepeaterItemContextMenuComponent,
         SkyRepeaterItemTitleComponent], imports: [CommonModule,
         DragulaModule,
+        ObserversModule,
         SkyChevronModule,
         SkyCheckboxModule,
         SkyIconModule,
@@ -1486,6 +1642,7 @@ SkyRepeaterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versi
 SkyRepeaterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyRepeaterModule, imports: [[
             CommonModule,
             DragulaModule,
+            ObserversModule,
             SkyChevronModule,
             SkyCheckboxModule,
             SkyIconModule,
@@ -1505,6 +1662,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     imports: [
                         CommonModule,
                         DragulaModule,
+                        ObserversModule,
                         SkyChevronModule,
                         SkyCheckboxModule,
                         SkyIconModule,