@xsmusices/ui 0.0.0-stage → 1.41.1

package/fesm2022/xsmusices-ui-xs-block.xsstory-GXV6UFJo.mjs

@@ -0,0 +1,165 @@
+import { XSBlockComponent } from './xsmusices-ui.mjs';
+
+const story = {
+    id: 'block',
+    name: 'Block',
+    type: 'component',
+    subtype: 'Base',
+    status: 'active',
+    usage: ['admin', 'app'],
+    updated: '2026-05-21T10:00:00.000Z',
+    created: '2026-05-21T10:00:00.000Z',
+    description: 'Bloque reutilizable con cabecera (título, select opcional, botón de recarga), slots para contenido y estados integrados: loading (skeleton), error (xs-empty-state), empty (xs-empty-state) y content.',
+    component: XSBlockComponent,
+    selector: 'xs-block',
+    slots: [
+        {
+            name: 'content',
+            description: 'Contenido principal del bloque. Se muestra cuando state = "content".',
+        },
+        {
+            name: 'blockHeaderRight',
+            description: 'Contenido adicional en la cabecera, al lado del título.',
+        },
+    ],
+    inputs: [
+        {
+            key: 'title',
+            label: 'Título del bloque',
+            type: 'text',
+            default: '',
+        },
+        {
+            key: 'state',
+            label: 'Estado',
+            type: 'select',
+            options: ['content', 'loading', 'error', 'empty'],
+            default: 'content',
+        },
+        {
+            key: 'emptyMessage',
+            label: 'Mensaje para estado vacío',
+            type: 'text',
+            default: 'No hay datos',
+        },
+        {
+            key: 'errorMessage',
+            label: 'Mensaje para estado error',
+            type: 'text',
+            default: 'Error al cargar los datos',
+        },
+        {
+            key: 'showRefresh',
+            label: 'Mostrar botón de recarga',
+            type: 'boolean',
+            default: true,
+        },
+        {
+            key: 'selectOptions',
+            label: 'Opciones del select',
+            type: 'json',
+            default: [],
+        },
+        {
+            key: 'selectValue',
+            label: 'Valor seleccionado',
+            type: 'text',
+            default: '',
+        },
+        {
+            key: 'titleRouterLink',
+            label: 'RouterLink para el título',
+            type: 'json',
+            default: null,
+        },
+        {
+            key: 'titleHref',
+            label: 'Enlace externo para el título',
+            type: 'text',
+            default: null,
+        },
+        {
+            key: 'loadingTemplate',
+            label: 'Template personalizado de carga',
+            type: 'text',
+            default: null,
+        },
+        {
+            key: 'loadingItems',
+            label: 'Número de items en skeleton de carga',
+            type: 'number',
+            default: 5,
+        },
+        {
+            key: 'emptyDescription',
+            label: 'Descripción para estado vacío',
+            type: 'text',
+            default: '',
+        },
+    ],
+    examples: [
+        {
+            name: 'Estado loading',
+            description: 'Muestra el esqueleto de carga',
+            inputs: {
+                title: 'Cargando...',
+                state: 'loading',
+            },
+        },
+        {
+            name: 'Estado vacío',
+            description: 'Muestra el mensaje de sin datos con xs-empty-state',
+            inputs: {
+                title: 'Sin datos',
+                state: 'empty',
+                emptyMessage: 'No hay actividad disponible',
+            },
+        },
+        {
+            name: 'Estado error',
+            description: 'Muestra el mensaje de error con xs-empty-state',
+            inputs: {
+                title: 'Error',
+                state: 'error',
+                errorMessage: 'No se pudieron cargar los datos',
+            },
+        },
+        {
+            name: 'Con select y refresh',
+            description: 'Cabecera con selector de período y botón de recarga',
+            inputs: {
+                title: 'Estadísticas',
+                state: 'content',
+                selectOptions: [
+                    { label: '7 días', value: '7d' },
+                    { label: '30 días', value: '30d' },
+                    { label: '90 días', value: '90d' },
+                ],
+                selectValue: '30d',
+            },
+        },
+        {
+            name: 'Sin botón de recarga',
+            description: 'Bloque sin el botón de refresh',
+            inputs: {
+                title: 'Info estática',
+                state: 'content',
+                showRefresh: false,
+            },
+        },
+    ],
+    multilanguage: false,
+    notes: [
+        {
+            text: 'Los estados empty y error usan internamente xs-empty-state.',
+            type: 'info',
+        },
+        {
+            text: 'selectOptions es un array de objetos { label, value }. Al seleccionar una opción, selectValue se actualiza con el value.',
+            type: 'info',
+        },
+    ],
+};
+
+export { story };
+//# sourceMappingURL=xsmusices-ui-xs-block.xsstory-GXV6UFJo.mjs.map

package/fesm2022/xsmusices-ui-xs-block.xsstory-GXV6UFJo.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"xsmusices-ui-xs-block.xsstory-GXV6UFJo.mjs","sources":["../../../projects/xs-ui/src/lib/components/base/block/xs-block.xsstory.ts"],"sourcesContent":["import { StoryMeta } from '../../../story.types';\nimport {\n  XSBlockComponent,\n  XSBlockState,\n} from './xs-block.component';\n\nexport const story: StoryMeta = {\n  id: 'block',\n  name: 'Block',\n  type: 'component',\n  subtype: 'Base',\n  status: 'active',\n  usage: ['admin', 'app'],\n  updated: '2026-05-21T10:00:00.000Z',\n  created: '2026-05-21T10:00:00.000Z',\n  description:\n    'Bloque reutilizable con cabecera (título, select opcional, botón de recarga), slots para contenido y estados integrados: loading (skeleton), error (xs-empty-state), empty (xs-empty-state) y content.',\n  component: XSBlockComponent,\n  selector: 'xs-block',\n  slots: [\n    {\n      name: 'content',\n      description:\n        'Contenido principal del bloque. Se muestra cuando state = \"content\".',\n    },\n    {\n      name: 'blockHeaderRight',\n      description:\n        'Contenido adicional en la cabecera, al lado del título.',\n    },\n  ],\n  inputs: [\n    {\n      key: 'title',\n      label: 'Título del bloque',\n      type: 'text',\n      default: '',\n    },\n    {\n      key: 'state',\n      label: 'Estado',\n      type: 'select',\n      options: ['content', 'loading', 'error', 'empty'],\n      default: 'content',\n    },\n    {\n      key: 'emptyMessage',\n      label: 'Mensaje para estado vacío',\n      type: 'text',\n      default: 'No hay datos',\n    },\n    {\n      key: 'errorMessage',\n      label: 'Mensaje para estado error',\n      type: 'text',\n      default: 'Error al cargar los datos',\n    },\n    {\n      key: 'showRefresh',\n      label: 'Mostrar botón de recarga',\n      type: 'boolean',\n      default: true,\n    },\n    {\n      key: 'selectOptions',\n      label: 'Opciones del select',\n      type: 'json',\n      default: [],\n    },\n    {\n      key: 'selectValue',\n      label: 'Valor seleccionado',\n      type: 'text',\n      default: '',\n    },\n    {\n      key: 'titleRouterLink',\n      label: 'RouterLink para el título',\n      type: 'json',\n      default: null,\n    },\n    {\n      key: 'titleHref',\n      label: 'Enlace externo para el título',\n      type: 'text',\n      default: null,\n    },\n    {\n      key: 'loadingTemplate',\n      label: 'Template personalizado de carga',\n      type: 'text',\n      default: null,\n    },\n    {\n      key: 'loadingItems',\n      label: 'Número de items en skeleton de carga',\n      type: 'number',\n      default: 5,\n    },\n    {\n      key: 'emptyDescription',\n      label: 'Descripción para estado vacío',\n      type: 'text',\n      default: '',\n    },\n  ],\n  examples: [\n    {\n      name: 'Estado loading',\n      description: 'Muestra el esqueleto de carga',\n      inputs: {\n        title: 'Cargando...',\n        state: 'loading' as XSBlockState,\n      },\n    },\n    {\n      name: 'Estado vacío',\n      description:\n        'Muestra el mensaje de sin datos con xs-empty-state',\n      inputs: {\n        title: 'Sin datos',\n        state: 'empty' as XSBlockState,\n        emptyMessage: 'No hay actividad disponible',\n      },\n    },\n    {\n      name: 'Estado error',\n      description:\n        'Muestra el mensaje de error con xs-empty-state',\n      inputs: {\n        title: 'Error',\n        state: 'error' as XSBlockState,\n        errorMessage: 'No se pudieron cargar los datos',\n      },\n    },\n    {\n      name: 'Con select y refresh',\n      description:\n        'Cabecera con selector de período y botón de recarga',\n      inputs: {\n        title: 'Estadísticas',\n        state: 'content' as XSBlockState,\n        selectOptions: [\n          { label: '7 días', value: '7d' },\n          { label: '30 días', value: '30d' },\n          { label: '90 días', value: '90d' },\n        ],\n        selectValue: '30d',\n      },\n    },\n    {\n      name: 'Sin botón de recarga',\n      description: 'Bloque sin el botón de refresh',\n      inputs: {\n        title: 'Info estática',\n        state: 'content' as XSBlockState,\n        showRefresh: false,\n      },\n    },\n  ],\n  multilanguage: false,\n  notes: [\n    {\n      text: 'Los estados empty y error usan internamente xs-empty-state.',\n      type: 'info',\n    },\n    {\n      text: 'selectOptions es un array de objetos { label, value }. Al seleccionar una opción, selectValue se actualiza con el value.',\n      type: 'info',\n    },\n  ],\n};\n"],"names":[],"mappings":"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"}

package/fesm2022/xsmusices-ui-xs-breadcrumbs.xsstory-CNyBeURd.mjs

@@ -0,0 +1,44 @@
+import { XSBreadcrumbsComponent } from './xsmusices-ui.mjs';
+
+const story = {
+    id: 'breadcrumbs',
+    name: 'Breadcrumbs',
+    type: 'component',
+    subtype: 'UI',
+    status: 'active',
+    usage: [],
+    updatedDate: '2026-02-10T12:45:00.000Z',
+    createdDate: '2026-01-16',
+    description: 'Componente de navegación breadcrumbs con diseño moderno glassmorphism. Muestra la jerarquía de navegación actual con soporte para provider dinámico.',
+    component: XSBreadcrumbsComponent,
+    selector: 'xs-breadcrumbs',
+    inputs: [
+        {
+            key: 'breadcrumbs',
+            label: 'Breadcrumbs manuales',
+            type: 'json',
+            default: '[]',
+        },
+        {
+            key: 'provider',
+            label: 'Provider personalizado',
+            type: 'json',
+            default: 'undefined',
+        },
+    ],
+    examples: [
+        {
+            name: 'Breadcrumbs automáticos',
+            description: 'Usa el provider global para generar breadcrumbs automáticamente',
+            template: `<xs-breadcrumbs></xs-breadcrumbs>`,
+        },
+        {
+            name: 'Breadcrumbs manuales',
+            description: 'Proporciona breadcrumbs manualmente',
+            template: `<xs-breadcrumbs [breadcrumbs]="manualBreadcrumbs"></xs-breadcrumbs>`,
+        },
+    ],
+};
+
+export { story };
+//# sourceMappingURL=xsmusices-ui-xs-breadcrumbs.xsstory-CNyBeURd.mjs.map

package/fesm2022/xsmusices-ui-xs-breadcrumbs.xsstory-CNyBeURd.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"xsmusices-ui-xs-breadcrumbs.xsstory-CNyBeURd.mjs","sources":["../../../projects/xs-ui/src/lib/components/ui/breadcrumbs/xs-breadcrumbs.xsstory.ts"],"sourcesContent":["import { StoryMeta } from '../../../story.types';\nimport { XSBreadcrumbsComponent } from './xs-breadcrumbs.component';\n\nexport const story: StoryMeta = {\n  id: 'breadcrumbs',\n  name: 'Breadcrumbs',\n  type: 'component',\n  subtype: 'UI',\n  status: 'active',\n  usage: [],\n  updatedDate: '2026-02-10T12:45:00.000Z',\n  createdDate: '2026-01-16',\n  description:\n    'Componente de navegación breadcrumbs con diseño moderno glassmorphism. Muestra la jerarquía de navegación actual con soporte para provider dinámico.',\n  component: XSBreadcrumbsComponent,\n  selector: 'xs-breadcrumbs',\n  inputs: [\n    {\n      key: 'breadcrumbs',\n      label: 'Breadcrumbs manuales',\n      type: 'json',\n      default: '[]',\n    },\n    {\n      key: 'provider',\n      label: 'Provider personalizado',\n      type: 'json',\n      default: 'undefined',\n    },\n  ],\n  examples: [\n    {\n      name: 'Breadcrumbs automáticos',\n      description:\n        'Usa el provider global para generar breadcrumbs automáticamente',\n      template: `<xs-breadcrumbs></xs-breadcrumbs>`,\n    },\n    {\n      name: 'Breadcrumbs manuales',\n      description: 'Proporciona breadcrumbs manualmente',\n      template: `<xs-breadcrumbs [breadcrumbs]=\"manualBreadcrumbs\"></xs-breadcrumbs>`,\n    },\n  ],\n};\n"],"names":[],"mappings":";;AAGO,MAAM,KAAK,GAAc;AAC9B,IAAA,EAAE,EAAE,aAAa;AACjB,IAAA,IAAI,EAAE,aAAa;AACnB,IAAA,IAAI,EAAE,WAAW;AACjB,IAAA,OAAO,EAAE,IAAI;AACb,IAAA,MAAM,EAAE,QAAQ;AAChB,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,WAAW,EAAE,0BAA0B;AACvC,IAAA,WAAW,EAAE,YAAY;AACzB,IAAA,WAAW,EACT,sJAAsJ;AACxJ,IAAA,SAAS,EAAE,sBAAsB;AACjC,IAAA,QAAQ,EAAE,gBAAgB;AAC1B,IAAA,MAAM,EAAE;AACN,QAAA;AACE,YAAA,GAAG,EAAE,aAAa;AAClB,YAAA,KAAK,EAAE,sBAAsB;AAC7B,YAAA,IAAI,EAAE,MAAM;AACZ,YAAA,OAAO,EAAE,IAAI;AACd,SAAA;AACD,QAAA;AACE,YAAA,GAAG,EAAE,UAAU;AACf,YAAA,KAAK,EAAE,wBAAwB;AAC/B,YAAA,IAAI,EAAE,MAAM;AACZ,YAAA,OAAO,EAAE,WAAW;AACrB,SAAA;AACF,KAAA;AACD,IAAA,QAAQ,EAAE;AACR,QAAA;AACE,YAAA,IAAI,EAAE,yBAAyB;AAC/B,YAAA,WAAW,EACT,iEAAiE;AACnE,YAAA,QAAQ,EAAE,CAAA,iCAAA,CAAmC;AAC9C,SAAA;AACD,QAAA;AACE,YAAA,IAAI,EAAE,sBAAsB;AAC5B,YAAA,WAAW,EAAE,qCAAqC;AAClD,YAAA,QAAQ,EAAE,CAAA,mEAAA,CAAqE;AAChF,SAAA;AACF,KAAA;;;;;"}

package/fesm2022/xsmusices-ui-xs-button.xsstory-DqECZuZF.mjs

@@ -0,0 +1,263 @@
+import { XSButtonComponent } from './xsmusices-ui.mjs';
+
+const story = {
+    id: 'button',
+    name: 'Button',
+    type: 'component',
+    subtype: 'Base',
+    status: 'active',
+    usage: ['admin', 'app', 'monitor'],
+    updated: '2026-04-26T15:45:46.112Z',
+    created: '2025-07-18T17:52:33.846Z',
+    description: 'Componente Button versátil con múltiples variantes, layouts y estados. Soporta iconos, badges, estados de carga y agrupación.',
+    component: XSButtonComponent,
+    selector: 'xs-button',
+    inputs: [
+        {
+            key: 'label',
+            label: 'Texto del botón',
+            type: 'text',
+            default: '',
+        },
+        {
+            key: 'type',
+            label: 'Tipo HTML',
+            type: 'select',
+            options: ['button', 'submit'],
+            default: 'button',
+        },
+        {
+            key: 'variant',
+            label: 'Variante visual',
+            type: 'select',
+            options: [
+                'primary',
+                'secondary',
+                'tertiary',
+                'error',
+                'success',
+                'warning',
+                'info',
+                'selected',
+                'profile',
+                'custom',
+                'outline',
+            ],
+            default: 'primary',
+        },
+        {
+            key: 'layout',
+            label: 'Diseño y tamaño',
+            type: 'select',
+            options: [
+                'base',
+                'between',
+                'iconOnly',
+                'iconOnlyHeader',
+                'iconOnlyMini',
+                'small',
+                'mini',
+                'badge',
+                'profile',
+            ],
+            default: 'base',
+        },
+        {
+            key: 'icon',
+            label: 'Icono FontAwesome',
+            type: 'json',
+            default: null,
+        },
+        {
+            key: 'disabled',
+            label: 'Deshabilitado',
+            type: 'boolean',
+            default: false,
+        },
+        {
+            key: 'loading',
+            label: 'Estado de carga',
+            type: 'boolean',
+            default: false,
+        },
+        {
+            key: 'isFull',
+            label: 'Ancho completo',
+            type: 'boolean',
+            default: false,
+        },
+        {
+            key: 'badgeCount',
+            label: 'Contador del badge',
+            type: 'number',
+            default: undefined,
+        },
+        {
+            key: 'customClass',
+            label: 'Clases CSS personalizadas',
+            type: 'text',
+            default: '',
+        },
+        {
+            key: 'isGrouped',
+            label: 'Parte de un grupo',
+            type: 'boolean',
+            default: false,
+        },
+        {
+            key: 'groupPosition',
+            label: 'Posición en grupo',
+            type: 'select',
+            options: ['first', 'middle', 'last'],
+            default: undefined,
+            dependsOn: 'isGrouped',
+            showWhenValues: [true],
+        },
+        {
+            key: 'borderRadius',
+            label: 'Radio del borde',
+            type: 'text',
+            default: 'rounded-xl',
+        },
+    ],
+    examples: [
+        {
+            name: 'Botón Básico',
+            description: 'Botón primario básico con texto',
+            inputs: {
+                label: 'Guardar',
+            },
+        },
+        {
+            name: 'Botón con Icono',
+            description: 'Botón con icono FontAwesome',
+            inputs: {
+                label: 'Agregar',
+                icon: { name: 'plus' },
+            },
+        },
+        {
+            name: 'Botón de Éxito',
+            description: 'Botón con variante success',
+            inputs: {
+                label: 'Confirmar',
+                variant: 'success',
+            },
+        },
+        {
+            name: 'Botón de Error',
+            description: 'Botón con variante error',
+            inputs: {
+                label: 'Eliminar',
+                variant: 'error',
+            },
+        },
+        {
+            name: 'Botón Deshabilitado',
+            description: 'Botón en estado deshabilitado',
+            inputs: {
+                label: 'Deshabilitado',
+                disabled: true,
+            },
+        },
+        {
+            name: 'Botón de Carga',
+            description: 'Botón en estado de carga',
+            inputs: {
+                label: 'Cargando...',
+                loading: true,
+            },
+        },
+        {
+            name: 'Botón Solo Icono',
+            description: 'Botón que muestra solo un icono',
+            inputs: {
+                layout: 'iconOnly',
+                icon: { name: 'search' },
+            },
+        },
+        {
+            name: 'Botón Pequeño',
+            description: 'Botón con layout pequeño',
+            inputs: {
+                label: 'Pequeño',
+                layout: 'small',
+            },
+        },
+        {
+            name: 'Botón Mini',
+            description: 'Botón con layout mini (estilo badge enano)',
+            inputs: {
+                label: 'Mini',
+                layout: 'mini',
+            },
+        },
+        {
+            name: 'Botón Ancho Completo',
+            description: 'Botón que ocupa todo el ancho disponible',
+            inputs: {
+                label: 'Ancho Completo',
+                isFull: true,
+            },
+        },
+        {
+            name: 'Botón con Badge',
+            description: 'Botón con contador de badge',
+            inputs: {
+                label: 'Notificaciones',
+                layout: 'badge',
+                badgeCount: 5,
+            },
+        },
+        {
+            name: 'Botón de Perfil',
+            description: 'Botón estilo perfil con layout perfil y variante profile',
+            inputs: {
+                label: 'Ir al perfil',
+                variant: 'profile',
+                layout: 'profile',
+            },
+        },
+        {
+            name: 'Botón Outline',
+            description: 'Botón con estilo outline',
+            inputs: {
+                label: 'Outline',
+                variant: 'outline',
+            },
+        },
+        {
+            name: 'Botón Custom',
+            description: 'Botón con clases personalizadas',
+            inputs: {
+                label: 'Custom',
+                variant: 'custom',
+                customClass: 'bg-purple-600 hover:bg-purple-700 text-white',
+            },
+        },
+    ],
+    multilanguage: false,
+    notes: [
+        {
+            text: 'El componente soporta iconos de FontAwesome. Puedes pasar el nombre del icono como string o un objeto con propiedades adicionales.',
+            type: 'info',
+        },
+        {
+            text: 'Los botones con loading=true no emiten eventos de click.',
+            type: 'warning',
+        },
+        {
+            text: 'Para botones agrupados, usa isGrouped=true y groupPosition para controlar los bordes redondeados.',
+            type: 'info',
+        },
+    ],
+    coverage: {
+        "statements": 99,
+        "branches": 89,
+        "functions": 100,
+        "lines": 99
+    },
+};
+
+export { story };
+//# sourceMappingURL=xsmusices-ui-xs-button.xsstory-DqECZuZF.mjs.map

package/fesm2022/xsmusices-ui-xs-button.xsstory-DqECZuZF.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"xsmusices-ui-xs-button.xsstory-DqECZuZF.mjs","sources":["../../../projects/xs-ui/src/lib/components/base/button/xs-button.xsstory.ts"],"sourcesContent":["import { StoryMeta } from '../../../story.types';\nimport { XSButtonComponent } from './xs-button.component';\n\nexport const story: StoryMeta = {\n  id: 'button',\n  name: 'Button',\n  type: 'component',\n  subtype: 'Base',\n  status: 'active',\n  usage: ['admin', 'app', 'monitor'],\n  updated: '2026-04-26T15:45:46.112Z',\n  created: '2025-07-18T17:52:33.846Z',\n  description:\n    'Componente Button versátil con múltiples variantes, layouts y estados. Soporta iconos, badges, estados de carga y agrupación.',\n  component: XSButtonComponent,\n  selector: 'xs-button',\n  inputs: [\n    {\n      key: 'label',\n      label: 'Texto del botón',\n      type: 'text',\n      default: '',\n    },\n    {\n      key: 'type',\n      label: 'Tipo HTML',\n      type: 'select',\n      options: ['button', 'submit'],\n      default: 'button',\n    },\n    {\n      key: 'variant',\n      label: 'Variante visual',\n      type: 'select',\n      options: [\n        'primary',\n        'secondary',\n        'tertiary',\n        'error',\n        'success',\n        'warning',\n        'info',\n        'selected',\n        'profile',\n        'custom',\n        'outline',\n      ],\n      default: 'primary',\n    },\n    {\n      key: 'layout',\n      label: 'Diseño y tamaño',\n      type: 'select',\n      options: [\n        'base',\n        'between',\n        'iconOnly',\n        'iconOnlyHeader',\n        'iconOnlyMini',\n        'small',\n        'mini',\n        'badge',\n        'profile',\n      ],\n      default: 'base',\n    },\n    {\n      key: 'icon',\n      label: 'Icono FontAwesome',\n      type: 'json',\n      default: null,\n    },\n    {\n      key: 'disabled',\n      label: 'Deshabilitado',\n      type: 'boolean',\n      default: false,\n    },\n    {\n      key: 'loading',\n      label: 'Estado de carga',\n      type: 'boolean',\n      default: false,\n    },\n    {\n      key: 'isFull',\n      label: 'Ancho completo',\n      type: 'boolean',\n      default: false,\n    },\n    {\n      key: 'badgeCount',\n      label: 'Contador del badge',\n      type: 'number',\n      default: undefined,\n    },\n    {\n      key: 'customClass',\n      label: 'Clases CSS personalizadas',\n      type: 'text',\n      default: '',\n    },\n    {\n      key: 'isGrouped',\n      label: 'Parte de un grupo',\n      type: 'boolean',\n      default: false,\n    },\n    {\n      key: 'groupPosition',\n      label: 'Posición en grupo',\n      type: 'select',\n      options: ['first', 'middle', 'last'],\n      default: undefined,\n      dependsOn: 'isGrouped',\n      showWhenValues: [true],\n    },\n    {\n      key: 'borderRadius',\n      label: 'Radio del borde',\n      type: 'text',\n      default: 'rounded-xl',\n    },\n  ],\n  examples: [\n    {\n      name: 'Botón Básico',\n      description: 'Botón primario básico con texto',\n      inputs: {\n        label: 'Guardar',\n      },\n    },\n    {\n      name: 'Botón con Icono',\n      description: 'Botón con icono FontAwesome',\n      inputs: {\n        label: 'Agregar',\n        icon: { name: 'plus' },\n      },\n    },\n    {\n      name: 'Botón de Éxito',\n      description: 'Botón con variante success',\n      inputs: {\n        label: 'Confirmar',\n        variant: 'success',\n      },\n    },\n    {\n      name: 'Botón de Error',\n      description: 'Botón con variante error',\n      inputs: {\n        label: 'Eliminar',\n        variant: 'error',\n      },\n    },\n    {\n      name: 'Botón Deshabilitado',\n      description: 'Botón en estado deshabilitado',\n      inputs: {\n        label: 'Deshabilitado',\n        disabled: true,\n      },\n    },\n    {\n      name: 'Botón de Carga',\n      description: 'Botón en estado de carga',\n      inputs: {\n        label: 'Cargando...',\n        loading: true,\n      },\n    },\n    {\n      name: 'Botón Solo Icono',\n      description: 'Botón que muestra solo un icono',\n      inputs: {\n        layout: 'iconOnly',\n        icon: { name: 'search' },\n      },\n    },\n    {\n      name: 'Botón Pequeño',\n      description: 'Botón con layout pequeño',\n      inputs: {\n        label: 'Pequeño',\n        layout: 'small',\n      },\n    },\n    {\n      name: 'Botón Mini',\n      description: 'Botón con layout mini (estilo badge enano)',\n      inputs: {\n        label: 'Mini',\n        layout: 'mini',\n      },\n    },\n    {\n      name: 'Botón Ancho Completo',\n      description: 'Botón que ocupa todo el ancho disponible',\n      inputs: {\n        label: 'Ancho Completo',\n        isFull: true,\n      },\n    },\n    {\n      name: 'Botón con Badge',\n      description: 'Botón con contador de badge',\n      inputs: {\n        label: 'Notificaciones',\n        layout: 'badge',\n        badgeCount: 5,\n      },\n    },\n    {\n      name: 'Botón de Perfil',\n      description:\n        'Botón estilo perfil con layout perfil y variante profile',\n      inputs: {\n        label: 'Ir al perfil',\n        variant: 'profile',\n        layout: 'profile',\n      },\n    },\n    {\n      name: 'Botón Outline',\n      description: 'Botón con estilo outline',\n      inputs: {\n        label: 'Outline',\n        variant: 'outline',\n      },\n    },\n    {\n      name: 'Botón Custom',\n      description: 'Botón con clases personalizadas',\n      inputs: {\n        label: 'Custom',\n        variant: 'custom',\n        customClass:\n          'bg-purple-600 hover:bg-purple-700 text-white',\n      },\n    },\n  ],\n  multilanguage: false,\n  notes: [\n    {\n      text: 'El componente soporta iconos de FontAwesome. Puedes pasar el nombre del icono como string o un objeto con propiedades adicionales.',\n      type: 'info',\n    },\n    {\n      text: 'Los botones con loading=true no emiten eventos de click.',\n      type: 'warning',\n    },\n    {\n      text: 'Para botones agrupados, usa isGrouped=true y groupPosition para controlar los bordes redondeados.',\n      type: 'info',\n    },\n  ],\n  coverage: {\n  \"statements\": 99,\n  \"branches\": 89,\n  \"functions\": 100,\n  \"lines\": 99\n},\n};\n"],"names":[],"mappings":"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"}

package/fesm2022/xsmusices-ui-xs-buttons-group.xsstory-H1pcuFtx.mjs

@@ -0,0 +1,97 @@
+import { XSButtonsGroupComponent } from './xsmusices-ui.mjs';
+
+const story = {
+    id: 'buttons-group',
+    name: 'Buttons Group',
+    type: 'component',
+    subtype: 'Base',
+    status: 'active',
+    usage: [],
+    updated: '2026-01-16T11:57:36.415Z',
+    created: '2025-08-15T21:04:25.954Z',
+    description: 'Componente contenedor para crear grupos de botones con estilos conectados. Facilita la creación de barras de herramientas y controles segmentados.',
+    component: XSButtonsGroupComponent,
+    selector: 'xs-buttons-group',
+    inputs: [
+        {
+            key: 'buttonsInput',
+            label: 'Botones (Array)',
+            type: 'json',
+            default: [],
+        },
+        {
+            key: 'buttonClick',
+            label: 'Función de Click',
+            type: 'json',
+            default: undefined,
+        },
+    ],
+    examples: [
+        {
+            name: 'Grupo Básico con Array',
+            description: 'Grupo de botones creado desde un array de configuración',
+            inputs: {
+                buttonsInput: [
+                    { label: 'Guardar', variant: 'success' },
+                    { label: 'Cancelar', variant: 'secondary' },
+                    { label: 'Eliminar', variant: 'error' },
+                ],
+            },
+        },
+        {
+            name: 'Grupo con Iconos',
+            description: 'Botones agrupados con iconos FontAwesome',
+            inputs: {
+                buttonsInput: [
+                    { label: 'Editar', icon: { name: 'edit' } },
+                    { label: 'Copiar', icon: { name: 'copy' } },
+                    {
+                        label: 'Eliminar',
+                        icon: { name: 'trash' },
+                        variant: 'error',
+                    },
+                ],
+            },
+        },
+        {
+            name: 'Grupo con Contenido Proyectado',
+            description: 'Usando ng-content para botones personalizados',
+            inputs: {},
+        },
+        {
+            name: 'Grupo con Estados',
+            description: 'Botones con diferentes estados (disabled, loading)',
+            inputs: {
+                buttonsInput: [
+                    { label: 'Activo' },
+                    { label: 'Cargando', loading: true },
+                    { label: 'Deshabilitado', disabled: true },
+                ],
+            },
+        },
+    ],
+    multilanguage: false,
+    notes: [
+        {
+            text: 'Los botones se conectan automáticamente con bordes y radios apropiados.',
+            type: 'info',
+        },
+        {
+            text: 'Soporta tanto configuración declarativa (buttonsInput) como proyección de contenido (ng-content).',
+            type: 'info',
+        },
+        {
+            text: 'Para eventos de click, usa buttonClickOutput o configura buttonClick.',
+            type: 'info',
+        },
+    ],
+    coverage: {
+        "statements": 97,
+        "branches": 100,
+        "functions": 92,
+        "lines": 97
+    },
+};
+
+export { story };
+//# sourceMappingURL=xsmusices-ui-xs-buttons-group.xsstory-H1pcuFtx.mjs.map

package/fesm2022/xsmusices-ui-xs-buttons-group.xsstory-H1pcuFtx.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"xsmusices-ui-xs-buttons-group.xsstory-H1pcuFtx.mjs","sources":["../../../projects/xs-ui/src/lib/components/base/buttons-group/xs-buttons-group.xsstory.ts"],"sourcesContent":["import { StoryMeta } from '../../../story.types';\nimport { XSButtonsGroupComponent } from './xs-buttons-group.component';\n\nexport const story: StoryMeta = {\n  id: 'buttons-group',\n  name: 'Buttons Group',\n  type: 'component',\n  subtype: 'Base',\n  status: 'active',\n  usage: [],\n  updated: '2026-01-16T11:57:36.415Z',\n  created: '2025-08-15T21:04:25.954Z',\n  description:\n    'Componente contenedor para crear grupos de botones con estilos conectados. Facilita la creación de barras de herramientas y controles segmentados.',\n  component: XSButtonsGroupComponent,\n  selector: 'xs-buttons-group',\n  inputs: [\n    {\n      key: 'buttonsInput',\n      label: 'Botones (Array)',\n      type: 'json',\n      default: [],\n    },\n    {\n      key: 'buttonClick',\n      label: 'Función de Click',\n      type: 'json',\n      default: undefined,\n    },\n  ],\n  examples: [\n    {\n      name: 'Grupo Básico con Array',\n      description:\n        'Grupo de botones creado desde un array de configuración',\n      inputs: {\n        buttonsInput: [\n          { label: 'Guardar', variant: 'success' },\n          { label: 'Cancelar', variant: 'secondary' },\n          { label: 'Eliminar', variant: 'error' },\n        ],\n      },\n    },\n    {\n      name: 'Grupo con Iconos',\n      description: 'Botones agrupados con iconos FontAwesome',\n      inputs: {\n        buttonsInput: [\n          { label: 'Editar', icon: { name: 'edit' } },\n          { label: 'Copiar', icon: { name: 'copy' } },\n          {\n            label: 'Eliminar',\n            icon: { name: 'trash' },\n            variant: 'error',\n          },\n        ],\n      },\n    },\n    {\n      name: 'Grupo con Contenido Proyectado',\n      description:\n        'Usando ng-content para botones personalizados',\n      inputs: {},\n    },\n    {\n      name: 'Grupo con Estados',\n      description:\n        'Botones con diferentes estados (disabled, loading)',\n      inputs: {\n        buttonsInput: [\n          { label: 'Activo' },\n          { label: 'Cargando', loading: true },\n          { label: 'Deshabilitado', disabled: true },\n        ],\n      },\n    },\n  ],\n  multilanguage: false,\n  notes: [\n    {\n      text: 'Los botones se conectan automáticamente con bordes y radios apropiados.',\n      type: 'info',\n    },\n    {\n      text: 'Soporta tanto configuración declarativa (buttonsInput) como proyección de contenido (ng-content).',\n      type: 'info',\n    },\n    {\n      text: 'Para eventos de click, usa buttonClickOutput o configura buttonClick.',\n      type: 'info',\n    },\n  ],\n  coverage: {\n  \"statements\": 97,\n  \"branches\": 100,\n  \"functions\": 92,\n  \"lines\": 97\n},\n};\n"],"names":[],"mappings":"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"}