diff --git a/src/demo/app/app.module.ts b/src/demo/app/app.module.ts
index 47ea861a..322e40fe 100644
--- a/src/demo/app/app.module.ts
+++ b/src/demo/app/app.module.ts
@@ -50,6 +50,7 @@ import { GridDemoComponent } from './grid/grid.component';
import { CardDemoComponent } from './card/card.component';
import { SliderDemoComponent } from './slider/slider.component';
+
// Template
import { ListadoSidebarComponent } from './templates/listado-sidebar/listado-sidebar';
import { SidebarDetalleComponent } from './templates/listado-sidebar/sidebar/detalle/sidebar-detalle.component';
@@ -79,6 +80,9 @@ import { RecursosListadoComponent } from './templates/modulos/internacion/listad
import { RecursoDetalleComponent } from './templates/modulos/internacion/sidebar/detalle/recurso-detalle.component';
+import { PlexGroupComponent } from './../../lib/group/group.component';
+import { PlexGroupItemComponent } from './../../lib/group/group-item.component';
+
@NgModule({
declarations: [
AppComponent,
@@ -146,7 +150,9 @@ import { RecursoDetalleComponent } from './templates/modulos/internacion/sidebar
AlignDemoComponent,
InternacionComponent,
RecursosListadoComponent,
- RecursoDetalleComponent
+ RecursoDetalleComponent,
+ PlexGroupComponent,
+ PlexGroupItemComponent
],
entryComponents: [
HeaderPacienteComponent
diff --git a/src/lib/css/plex-group.scss b/src/lib/css/plex-group.scss
new file mode 100644
index 00000000..71b42418
--- /dev/null
+++ b/src/lib/css/plex-group.scss
@@ -0,0 +1,42 @@
+$tags: 1, 2, 3, 4;
+
+@each $tag in $tags {
+ .spacing-#{$tag} {
+ plex-button {
+ margin-right: $tag * 4 + px;
+
+ &:last-child {
+ margin-right: 0
+ }
+ }
+ }
+}
+
+plex-group {
+ .group-dropdown {
+ display: none;
+
+ &.display {
+ display: block;
+ }
+ }
+
+ plex-badge {
+ margin-right: 5px;
+ :last-child {
+ margin-right: 0;
+ }
+ }
+
+ .group-item {
+ display: flex;
+ padding: 5px 10px;
+ cursor: pointer;
+ color: $text-dark;
+
+ &:hover {
+ color: $blue;
+ text-decoration: none;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/lib/group/group-item.component.ts b/src/lib/group/group-item.component.ts
new file mode 100644
index 00000000..faf00c35
--- /dev/null
+++ b/src/lib/group/group-item.component.ts
@@ -0,0 +1,17 @@
+import { Component, Input } from '@angular/core';
+
+@Component({
+ selector: 'plex-group-item',
+ template: `
+
+