diff --git a/src/app/components/simple-list-w-actions/SimpleListItem.ts b/src/app/components/simple-list-w-actions/SimpleListItem.ts new file mode 100644 index 0000000..b116656 --- /dev/null +++ b/src/app/components/simple-list-w-actions/SimpleListItem.ts @@ -0,0 +1,5 @@ +import { SimpleListItemAction } from "./SimpleListItemAction"; + +export class SimpleListItem { + constructor(public id: string, public text: string = '', public actions: SimpleListItemAction[] = []) {} +} \ No newline at end of file diff --git a/src/app/components/simple-list-w-actions/SimpleListItemAction.ts b/src/app/components/simple-list-w-actions/SimpleListItemAction.ts new file mode 100644 index 0000000..d37b7b6 --- /dev/null +++ b/src/app/components/simple-list-w-actions/SimpleListItemAction.ts @@ -0,0 +1,3 @@ +export class SimpleListItemAction { + constructor(public icon: string, public action: string) {} +} \ No newline at end of file diff --git a/src/app/components/simple-list-w-actions/simple-list-w-actions.html b/src/app/components/simple-list-w-actions/simple-list-w-actions.html new file mode 100644 index 0000000..76d85de --- /dev/null +++ b/src/app/components/simple-list-w-actions/simple-list-w-actions.html @@ -0,0 +1,17 @@ + + @for (item of items(); track item.id) { + + {{ item.text }} + @if (item.actions; as actions) { +
+ @for (action of actions; track action.action) { + + } +
+ } +
+ + } +
diff --git a/src/app/components/simple-list-w-actions/simple-list-w-actions.scss b/src/app/components/simple-list-w-actions/simple-list-w-actions.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/components/simple-list-w-actions/simple-list-w-actions.spec.ts b/src/app/components/simple-list-w-actions/simple-list-w-actions.spec.ts new file mode 100644 index 0000000..e41fd1c --- /dev/null +++ b/src/app/components/simple-list-w-actions/simple-list-w-actions.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SimpleListWActions } from './simple-list-w-actions'; + +describe('SimpleListWActions', () => { + let component: SimpleListWActions; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [SimpleListWActions] + }) + .compileComponents(); + + fixture = TestBed.createComponent(SimpleListWActions); + component = fixture.componentInstance; + await fixture.whenStable(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/components/simple-list-w-actions/simple-list-w-actions.ts b/src/app/components/simple-list-w-actions/simple-list-w-actions.ts new file mode 100644 index 0000000..2e0928b --- /dev/null +++ b/src/app/components/simple-list-w-actions/simple-list-w-actions.ts @@ -0,0 +1,16 @@ +import { Component, input, output } from '@angular/core'; +import { MatIconButton } from '@angular/material/button'; +import { MatIcon } from '@angular/material/icon'; +import { MatDivider, MatListModule } from '@angular/material/list'; +import { SimpleListItem } from './SimpleListItem'; + +@Component({ + selector: 'app-simple-list-w-actions', + imports: [MatListModule, MatIcon, MatDivider, MatIconButton], + templateUrl: './simple-list-w-actions.html', + styleUrl: './simple-list-w-actions.scss', +}) +export class SimpleListWActions { + readonly action = output<{action: string, subject: string}>() + readonly items = input([]) +}