Idea 1

El componente debería de funcionar atraves de un arreglo.

frutas = ["Manzana", "Pera", "Piña", "Pepino"];

<labgrilla #frutas [list]="frutas" (selectItem)="SelectItemEmit($event)"></labgrilla>

Además se requiere que sea posible seleccionar un item atraves de las flechas del teclado.

• El item en el cual estamos posicionados debería de resaltar entre los demás.
• La selección sera atraves de la tecla enter o el click derecho del ratón.
  

Responsive Design
Este componente debe de ser responsivo.

• Si mi pantalla de navegador es mayor a 1200px deberia mostrarse 12 items por fila.
• Si mi pantalla de navegador es menor a 1201px y mayor a 1000px deberia mostrarse 10 items por fila.
• Si mi pantalla de navegador es menor a 1001px y mayor a 800px deberia mostrarse 8 items por fila.
• Si mi pantalla de navegador es menor a 801px y mayor a 600px deberia mostrarse 6 items por fila.
• Si mi pantalla de navegador es menor a 601px y mayor a 500px deberia mostrarse 5 items por fila.
• Si mi pantalla de navegador es menor a 501px y mayor a 400px deberia mostrarse 4 items por fila.
• Si mi pantalla de navegador es menor a 401px y mayor a 300px deberia mostrarse 3 items por fila.
• Si mi pantalla de navegador es menor a 301px y mayor a 200px deberia mostrarse 2 items por fila.

Comienza localizando el componente labgrilla y sus puntos de entrada existentes list y selectItem. Comprueba cómo renderiza actualmente los elementos el componente y, después, verifica que estén cubiertos la entrada de arrays, la selección y el resaltado mediante el teclado, la selección con Enter o clic derecho, y los breakpoints responsive de items-per-row indicados.