1"use strict";(self.webpackChunkxsmusic=self.webpackChunkxsmusic||[]).push([[6951],{6951:(a,o,e)=>{e.r(o),e.d(o,{story:()=>n});const n={id:"button",name:"Button",type:"component",subtype:"Base",status:"active",usage:["admin","app","monitor"],updated:"2026-02-02T18:31:00.000Z",created:"2025-07-18T17:52:33.846Z",description:"Componente Button vers\xe1til con m\xfaltiples variantes, layouts y estados. Soporta iconos, badges, estados de carga y agrupaci\xf3n.",component:e(1747).l$0,selector:"xs-button",inputs:[{key:"label",label:"Texto del bot\xf3n",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","custom","outline"],default:"primary"},{key:"layout",label:"Dise\xf1o y tama\xf1o",type:"select",options:["base","between","iconOnly","iconOnlyHeader","iconOnlyMini","small","mini","badge"],default:"base"},{key:"icon",label:"Icono FontAwesome",type:"json",default:null},{key:"disabled",label:"Deshabilitado",type:"boolean",default:!1},{key:"loading",label:"Estado de carga",type:"boolean",default:!1},{key:"isFull",label:"Ancho completo",type:"boolean",default:!1},{key:"badgeCount",label:"Contador del badge",type:"number",default:void 0},{key:"customClass",label:"Clases CSS personalizadas",type:"text",default:""},{key:"isGrouped",label:"Parte de un grupo",type:"boolean",default:!1},{key:"groupPosition",label:"Posici\xf3n en grupo",type:"select",options:["first","middle","last"],default:void 0,dependsOn:"isGrouped",showWhenValues:[!0]},{key:"borderRadius",label:"Radio del borde",type:"text",default:"rounded-lg"}],examples:[{name:"Bot\xf3n B\xe1sico",description:"Bot\xf3n primario b\xe1sico con texto",inputs:{label:"Guardar"}},{name:"Bot\xf3n con Icono",description:"Bot\xf3n con icono FontAwesome",inputs:{label:"Agregar",icon:{name:"plus"}}},{name:"Bot\xf3n de \xc9xito",description:"Bot\xf3n con variante success",inputs:{label:"Confirmar",variant:"success"}},{name:"Bot\xf3n de Error",description:"Bot\xf3n con variante error",inputs:{label:"Eliminar",variant:"error"}},{name:"Bot\xf3n Deshabilitado",description:"Bot\xf3n en estado deshabilitado",inputs:{label:"Deshabilitado",disabled:!0}},{name:"Bot\xf3n de Carga",description:"Bot\xf3n en estado de carga",inputs:{label:"Cargando...",loading:!0}},{name:"Bot\xf3n Solo Icono",description:"Bot\xf3n que muestra solo un icono",inputs:{layout:"iconOnly",icon:{name:"search"}}},{name:"Bot\xf3n Peque\xf1o",description:"Bot\xf3n con layout peque\xf1o",inputs:{label:"Peque\xf1o",layout:"small"}},{name:"Bot\xf3n Mini",description:"Bot\xf3n con layout mini (estilo badge enano)",inputs:{label:"Mini",layout:"mini"}},{name:"Bot\xf3n Ancho Completo",description:"Bot\xf3n que ocupa todo el ancho disponible",inputs:{label:"Ancho Completo",isFull:!0}},{name:"Bot\xf3n con Badge",description:"Bot\xf3n con contador de badge",inputs:{label:"Notificaciones",layout:"badge",badgeCount:5}},{name:"Bot\xf3n Outline",description:"Bot\xf3n con estilo outline",inputs:{label:"Outline",variant:"outline"}},{name:"Bot\xf3n Custom",description:"Bot\xf3n con clases personalizadas",inputs:{label:"Custom",variant:"custom",customClass:"bg-purple-600 hover:bg-purple-700 text-white"}}],multilanguage:!1,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:96,branches:84,functions:82,lines:97}}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.