[{"data":1,"prerenderedAt":2375},["Reactive",2],{"content-query-WLGYp2i2Hw":3},{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"_empty":6,"title":8,"description":9,"body":10,"_type":2371,"_id":2372,"_source":2373,"_file":2374,"_extension":263},"/docs/components/button-group","components",false,"","Button Group - Inkline","Group multiple buttons together on a single line using a button group.",{"type":11,"children":12,"toc":2356},"root",[13,22,28,49,233,240,279,712,718,730,891,897,909,1073,1079,1095,1534,1540,1550,1719,1725,1742,1927,1933,1944,2143,2149,2160,2321,2327,2331,2337,2341,2347,2351],{"type":14,"tag":15,"props":16,"children":18},"element","h1",{"id":17},"button-group",[19],{"type":20,"value":21},"text","Button Group",{"type":14,"tag":23,"props":24,"children":26},"h2",{"id":25},"group-multiple-buttons-together-on-a-single-line-using-a-button-group",[27],{"type":20,"value":9},{"type":14,"tag":29,"props":30,"children":31},"p",{},[32,34,40,42,47],{"type":20,"value":33},"You can group a series of ",{"type":14,"tag":35,"props":36,"children":37},"code-inline",{},[38],{"type":20,"value":39},"\u003CIButton>",{"type":20,"value":41}," components inside a ",{"type":14,"tag":35,"props":43,"children":44},{},[45],{"type":20,"value":46},"\u003CIButtonGroup>",{"type":20,"value":48}," to display them inline, conveying additional meaning.",{"type":14,"tag":50,"props":51,"children":52},"content-tabs",{},[53,62],{"type":14,"tag":54,"props":55,"children":56},"template",{"v-slot:preview":7},[57],{"type":14,"tag":58,"props":59,"children":61},"content-preview",{"src":60},"/components/IButtonGroup/examples/basic",[],{"type":14,"tag":54,"props":63,"children":64},{"v-slot:vue":7},[65],{"type":14,"tag":66,"props":67,"children":72},"code",{"className":68,"code":70,"language":71,"meta":7},[69],"language-vue","\u003Ctemplate>\n    \u003CIButtonGroup>\n        \u003CIButton>Left\u003C/IButton>\n        \u003CIButton>Middle\u003C/IButton>\n        \u003CIButton>Right\u003C/IButton>\n    \u003C/IButtonGroup>\n\u003C/template>\n\n","vue",[73],{"type":14,"tag":74,"props":75,"children":76},"pre",{},[77],{"type":14,"tag":66,"props":78,"children":79},{"__ignoreMap":7},[80,102,121,148,173,198,215],{"type":14,"tag":81,"props":82,"children":85},"span",{"class":83,"line":84},"line",1,[86,92,97],{"type":14,"tag":81,"props":87,"children":89},{"class":88},"ct-553616",[90],{"type":20,"value":91},"\u003C",{"type":14,"tag":81,"props":93,"children":95},{"class":94},"ct-914029",[96],{"type":20,"value":54},{"type":14,"tag":81,"props":98,"children":99},{"class":88},[100],{"type":20,"value":101},">\n",{"type":14,"tag":81,"props":103,"children":105},{"class":83,"line":104},2,[106,111,117],{"type":14,"tag":81,"props":107,"children":108},{"class":88},[109],{"type":20,"value":110},"    \u003C",{"type":14,"tag":81,"props":112,"children":114},{"class":113},"ct-028869",[115],{"type":20,"value":116},"IButtonGroup",{"type":14,"tag":81,"props":118,"children":119},{"class":88},[120],{"type":20,"value":101},{"type":14,"tag":81,"props":122,"children":124},{"class":83,"line":123},3,[125,130,135,140,144],{"type":14,"tag":81,"props":126,"children":127},{"class":88},[128],{"type":20,"value":129},"        \u003C",{"type":14,"tag":81,"props":131,"children":132},{"class":113},[133],{"type":20,"value":134},"IButton",{"type":14,"tag":81,"props":136,"children":137},{"class":88},[138],{"type":20,"value":139},">Left\u003C/",{"type":14,"tag":81,"props":141,"children":142},{"class":113},[143],{"type":20,"value":134},{"type":14,"tag":81,"props":145,"children":146},{"class":88},[147],{"type":20,"value":101},{"type":14,"tag":81,"props":149,"children":151},{"class":83,"line":150},4,[152,156,160,165,169],{"type":14,"tag":81,"props":153,"children":154},{"class":88},[155],{"type":20,"value":129},{"type":14,"tag":81,"props":157,"children":158},{"class":113},[159],{"type":20,"value":134},{"type":14,"tag":81,"props":161,"children":162},{"class":88},[163],{"type":20,"value":164},">Middle\u003C/",{"type":14,"tag":81,"props":166,"children":167},{"class":113},[168],{"type":20,"value":134},{"type":14,"tag":81,"props":170,"children":171},{"class":88},[172],{"type":20,"value":101},{"type":14,"tag":81,"props":174,"children":176},{"class":83,"line":175},5,[177,181,185,190,194],{"type":14,"tag":81,"props":178,"children":179},{"class":88},[180],{"type":20,"value":129},{"type":14,"tag":81,"props":182,"children":183},{"class":113},[184],{"type":20,"value":134},{"type":14,"tag":81,"props":186,"children":187},{"class":88},[188],{"type":20,"value":189},">Right\u003C/",{"type":14,"tag":81,"props":191,"children":192},{"class":113},[193],{"type":20,"value":134},{"type":14,"tag":81,"props":195,"children":196},{"class":88},[197],{"type":20,"value":101},{"type":14,"tag":81,"props":199,"children":201},{"class":83,"line":200},6,[202,207,211],{"type":14,"tag":81,"props":203,"children":204},{"class":88},[205],{"type":20,"value":206},"    \u003C/",{"type":14,"tag":81,"props":208,"children":209},{"class":113},[210],{"type":20,"value":116},{"type":14,"tag":81,"props":212,"children":213},{"class":88},[214],{"type":20,"value":101},{"type":14,"tag":81,"props":216,"children":218},{"class":83,"line":217},7,[219,224,228],{"type":14,"tag":81,"props":220,"children":221},{"class":88},[222],{"type":20,"value":223},"\u003C/",{"type":14,"tag":81,"props":225,"children":226},{"class":94},[227],{"type":20,"value":54},{"type":14,"tag":81,"props":229,"children":230},{"class":88},[231],{"type":20,"value":232},">",{"type":14,"tag":234,"props":235,"children":237},"h3",{"id":236},"size-variants",[238],{"type":20,"value":239},"Size Variants",{"type":14,"tag":29,"props":241,"children":242},{},[243,245,250,252,257,259,264,266,271,273,277],{"type":20,"value":244},"You're able to use the ",{"type":14,"tag":35,"props":246,"children":247},{},[248],{"type":20,"value":249},"size",{"type":20,"value":251}," modifier to control the size of your button group, using one of the available sizes: ",{"type":14,"tag":35,"props":253,"children":254},{},[255],{"type":20,"value":256},"sm",{"type":20,"value":258},", ",{"type":14,"tag":35,"props":260,"children":261},{},[262],{"type":20,"value":263},"md",{"type":20,"value":265},", and ",{"type":14,"tag":35,"props":267,"children":268},{},[269],{"type":20,"value":270},"lg",{"type":20,"value":272},". The default size is set to ",{"type":14,"tag":35,"props":274,"children":275},{},[276],{"type":20,"value":263},{"type":20,"value":278},".",{"type":14,"tag":50,"props":280,"children":281},{},[282,289],{"type":14,"tag":54,"props":283,"children":284},{"v-slot:preview":7},[285],{"type":14,"tag":58,"props":286,"children":288},{"src":287},"/components/IButtonGroup/examples/size-variants",[],{"type":14,"tag":54,"props":290,"children":291},{"v-slot:vue":7},[292],{"type":14,"tag":66,"props":293,"children":296},{"className":294,"code":295,"language":71,"meta":7},[69],"\u003Ctemplate>\n    \u003CIButtonGroup size=\"sm\">\n        \u003CIButton>Left\u003C/IButton>\n        \u003CIButton>Middle\u003C/IButton>\n        \u003CIButton>Right\u003C/IButton>\n    \u003C/IButtonGroup>\n\n    \u003CIButtonGroup size=\"md\">\n        \u003CIButton>Left\u003C/IButton>\n        \u003CIButton>Middle\u003C/IButton>\n        \u003CIButton>Right\u003C/IButton>\n    \u003C/IButtonGroup>\n\n    \u003CIButtonGroup size=\"lg\">\n        \u003CIButton>Left\u003C/IButton>\n        \u003CIButton>Middle\u003C/IButton>\n        \u003CIButton>Right\u003C/IButton>\n    \u003C/IButtonGroup>\n\u003C/template>\n\n",[297],{"type":14,"tag":74,"props":298,"children":299},{},[300],{"type":14,"tag":66,"props":301,"children":302},{"__ignoreMap":7},[303,318,354,377,400,423,438,446,479,503,527,551,567,575,608,632,656,680,696],{"type":14,"tag":81,"props":304,"children":305},{"class":83,"line":84},[306,310,314],{"type":14,"tag":81,"props":307,"children":308},{"class":88},[309],{"type":20,"value":91},{"type":14,"tag":81,"props":311,"children":312},{"class":94},[313],{"type":20,"value":54},{"type":14,"tag":81,"props":315,"children":316},{"class":88},[317],{"type":20,"value":101},{"type":14,"tag":81,"props":319,"children":320},{"class":83,"line":104},[321,325,329,334,339,344,350],{"type":14,"tag":81,"props":322,"children":323},{"class":88},[324],{"type":20,"value":110},{"type":14,"tag":81,"props":326,"children":327},{"class":113},[328],{"type":20,"value":116},{"type":14,"tag":81,"props":330,"children":331},{"class":88},[332],{"type":20,"value":333}," ",{"type":14,"tag":81,"props":335,"children":337},{"class":336},"ct-762058",[338],{"type":20,"value":249},{"type":14,"tag":81,"props":340,"children":341},{"class":88},[342],{"type":20,"value":343},"=",{"type":14,"tag":81,"props":345,"children":347},{"class":346},"ct-952708",[348],{"type":20,"value":349},"\"sm\"",{"type":14,"tag":81,"props":351,"children":352},{"class":88},[353],{"type":20,"value":101},{"type":14,"tag":81,"props":355,"children":356},{"class":83,"line":123},[357,361,365,369,373],{"type":14,"tag":81,"props":358,"children":359},{"class":88},[360],{"type":20,"value":129},{"type":14,"tag":81,"props":362,"children":363},{"class":113},[364],{"type":20,"value":134},{"type":14,"tag":81,"props":366,"children":367},{"class":88},[368],{"type":20,"value":139},{"type":14,"tag":81,"props":370,"children":371},{"class":113},[372],{"type":20,"value":134},{"type":14,"tag":81,"props":374,"children":375},{"class":88},[376],{"type":20,"value":101},{"type":14,"tag":81,"props":378,"children":379},{"class":83,"line":150},[380,384,388,392,396],{"type":14,"tag":81,"props":381,"children":382},{"class":88},[383],{"type":20,"value":129},{"type":14,"tag":81,"props":385,"children":386},{"class":113},[387],{"type":20,"value":134},{"type":14,"tag":81,"props":389,"children":390},{"class":88},[391],{"type":20,"value":164},{"type":14,"tag":81,"props":393,"children":394},{"class":113},[395],{"type":20,"value":134},{"type":14,"tag":81,"props":397,"children":398},{"class":88},[399],{"type":20,"value":101},{"type":14,"tag":81,"props":401,"children":402},{"class":83,"line":175},[403,407,411,415,419],{"type":14,"tag":81,"props":404,"children":405},{"class":88},[406],{"type":20,"value":129},{"type":14,"tag":81,"props":408,"children":409},{"class":113},[410],{"type":20,"value":134},{"type":14,"tag":81,"props":412,"children":413},{"class":88},[414],{"type":20,"value":189},{"type":14,"tag":81,"props":416,"children":417},{"class":113},[418],{"type":20,"value":134},{"type":14,"tag":81,"props":420,"children":421},{"class":88},[422],{"type":20,"value":101},{"type":14,"tag":81,"props":424,"children":425},{"class":83,"line":200},[426,430,434],{"type":14,"tag":81,"props":427,"children":428},{"class":88},[429],{"type":20,"value":206},{"type":14,"tag":81,"props":431,"children":432},{"class":113},[433],{"type":20,"value":116},{"type":14,"tag":81,"props":435,"children":436},{"class":88},[437],{"type":20,"value":101},{"type":14,"tag":81,"props":439,"children":440},{"class":83,"line":217},[441],{"type":14,"tag":81,"props":442,"children":443},{},[444],{"type":20,"value":445},"\n",{"type":14,"tag":81,"props":447,"children":449},{"class":83,"line":448},8,[450,454,458,462,466,470,475],{"type":14,"tag":81,"props":451,"children":452},{"class":88},[453],{"type":20,"value":110},{"type":14,"tag":81,"props":455,"children":456},{"class":113},[457],{"type":20,"value":116},{"type":14,"tag":81,"props":459,"children":460},{"class":88},[461],{"type":20,"value":333},{"type":14,"tag":81,"props":463,"children":464},{"class":336},[465],{"type":20,"value":249},{"type":14,"tag":81,"props":467,"children":468},{"class":88},[469],{"type":20,"value":343},{"type":14,"tag":81,"props":471,"children":472},{"class":346},[473],{"type":20,"value":474},"\"md\"",{"type":14,"tag":81,"props":476,"children":477},{"class":88},[478],{"type":20,"value":101},{"type":14,"tag":81,"props":480,"children":482},{"class":83,"line":481},9,[483,487,491,495,499],{"type":14,"tag":81,"props":484,"children":485},{"class":88},[486],{"type":20,"value":129},{"type":14,"tag":81,"props":488,"children":489},{"class":113},[490],{"type":20,"value":134},{"type":14,"tag":81,"props":492,"children":493},{"class":88},[494],{"type":20,"value":139},{"type":14,"tag":81,"props":496,"children":497},{"class":113},[498],{"type":20,"value":134},{"type":14,"tag":81,"props":500,"children":501},{"class":88},[502],{"type":20,"value":101},{"type":14,"tag":81,"props":504,"children":506},{"class":83,"line":505},10,[507,511,515,519,523],{"type":14,"tag":81,"props":508,"children":509},{"class":88},[510],{"type":20,"value":129},{"type":14,"tag":81,"props":512,"children":513},{"class":113},[514],{"type":20,"value":134},{"type":14,"tag":81,"props":516,"children":517},{"class":88},[518],{"type":20,"value":164},{"type":14,"tag":81,"props":520,"children":521},{"class":113},[522],{"type":20,"value":134},{"type":14,"tag":81,"props":524,"children":525},{"class":88},[526],{"type":20,"value":101},{"type":14,"tag":81,"props":528,"children":530},{"class":83,"line":529},11,[531,535,539,543,547],{"type":14,"tag":81,"props":532,"children":533},{"class":88},[534],{"type":20,"value":129},{"type":14,"tag":81,"props":536,"children":537},{"class":113},[538],{"type":20,"value":134},{"type":14,"tag":81,"props":540,"children":541},{"class":88},[542],{"type":20,"value":189},{"type":14,"tag":81,"props":544,"children":545},{"class":113},[546],{"type":20,"value":134},{"type":14,"tag":81,"props":548,"children":549},{"class":88},[550],{"type":20,"value":101},{"type":14,"tag":81,"props":552,"children":554},{"class":83,"line":553},12,[555,559,563],{"type":14,"tag":81,"props":556,"children":557},{"class":88},[558],{"type":20,"value":206},{"type":14,"tag":81,"props":560,"children":561},{"class":113},[562],{"type":20,"value":116},{"type":14,"tag":81,"props":564,"children":565},{"class":88},[566],{"type":20,"value":101},{"type":14,"tag":81,"props":568,"children":570},{"class":83,"line":569},13,[571],{"type":14,"tag":81,"props":572,"children":573},{},[574],{"type":20,"value":445},{"type":14,"tag":81,"props":576,"children":578},{"class":83,"line":577},14,[579,583,587,591,595,599,604],{"type":14,"tag":81,"props":580,"children":581},{"class":88},[582],{"type":20,"value":110},{"type":14,"tag":81,"props":584,"children":585},{"class":113},[586],{"type":20,"value":116},{"type":14,"tag":81,"props":588,"children":589},{"class":88},[590],{"type":20,"value":333},{"type":14,"tag":81,"props":592,"children":593},{"class":336},[594],{"type":20,"value":249},{"type":14,"tag":81,"props":596,"children":597},{"class":88},[598],{"type":20,"value":343},{"type":14,"tag":81,"props":600,"children":601},{"class":346},[602],{"type":20,"value":603},"\"lg\"",{"type":14,"tag":81,"props":605,"children":606},{"class":88},[607],{"type":20,"value":101},{"type":14,"tag":81,"props":609,"children":611},{"class":83,"line":610},15,[612,616,620,624,628],{"type":14,"tag":81,"props":613,"children":614},{"class":88},[615],{"type":20,"value":129},{"type":14,"tag":81,"props":617,"children":618},{"class":113},[619],{"type":20,"value":134},{"type":14,"tag":81,"props":621,"children":622},{"class":88},[623],{"type":20,"value":139},{"type":14,"tag":81,"props":625,"children":626},{"class":113},[627],{"type":20,"value":134},{"type":14,"tag":81,"props":629,"children":630},{"class":88},[631],{"type":20,"value":101},{"type":14,"tag":81,"props":633,"children":635},{"class":83,"line":634},16,[636,640,644,648,652],{"type":14,"tag":81,"props":637,"children":638},{"class":88},[639],{"type":20,"value":129},{"type":14,"tag":81,"props":641,"children":642},{"class":113},[643],{"type":20,"value":134},{"type":14,"tag":81,"props":645,"children":646},{"class":88},[647],{"type":20,"value":164},{"type":14,"tag":81,"props":649,"children":650},{"class":113},[651],{"type":20,"value":134},{"type":14,"tag":81,"props":653,"children":654},{"class":88},[655],{"type":20,"value":101},{"type":14,"tag":81,"props":657,"children":659},{"class":83,"line":658},17,[660,664,668,672,676],{"type":14,"tag":81,"props":661,"children":662},{"class":88},[663],{"type":20,"value":129},{"type":14,"tag":81,"props":665,"children":666},{"class":113},[667],{"type":20,"value":134},{"type":14,"tag":81,"props":669,"children":670},{"class":88},[671],{"type":20,"value":189},{"type":14,"tag":81,"props":673,"children":674},{"class":113},[675],{"type":20,"value":134},{"type":14,"tag":81,"props":677,"children":678},{"class":88},[679],{"type":20,"value":101},{"type":14,"tag":81,"props":681,"children":683},{"class":83,"line":682},18,[684,688,692],{"type":14,"tag":81,"props":685,"children":686},{"class":88},[687],{"type":20,"value":206},{"type":14,"tag":81,"props":689,"children":690},{"class":113},[691],{"type":20,"value":116},{"type":14,"tag":81,"props":693,"children":694},{"class":88},[695],{"type":20,"value":101},{"type":14,"tag":81,"props":697,"children":699},{"class":83,"line":698},19,[700,704,708],{"type":14,"tag":81,"props":701,"children":702},{"class":88},[703],{"type":20,"value":223},{"type":14,"tag":81,"props":705,"children":706},{"class":94},[707],{"type":20,"value":54},{"type":14,"tag":81,"props":709,"children":710},{"class":88},[711],{"type":20,"value":232},{"type":14,"tag":234,"props":713,"children":715},{"id":714},"block-variant",[716],{"type":20,"value":717},"Block Variant",{"type":14,"tag":29,"props":719,"children":720},{},[721,723,728],{"type":20,"value":722},"You can create block button groups that span the full width of a parent by adding the ",{"type":14,"tag":35,"props":724,"children":725},{},[726],{"type":20,"value":727},"block",{"type":20,"value":729}," property.",{"type":14,"tag":50,"props":731,"children":732},{},[733,740],{"type":14,"tag":54,"props":734,"children":735},{"v-slot:preview":7},[736],{"type":14,"tag":58,"props":737,"children":739},{"src":738},"/components/IButtonGroup/examples/block",[],{"type":14,"tag":54,"props":741,"children":742},{"v-slot:vue":7},[743],{"type":14,"tag":66,"props":744,"children":747},{"className":745,"code":746,"language":71,"meta":7},[69],"\u003Ctemplate>\n    \u003CIButtonGroup block>\n        \u003CIButton>Left\u003C/IButton>\n        \u003CIButton>Middle\u003C/IButton>\n        \u003CIButton>Right\u003C/IButton>\n    \u003C/IButtonGroup>\n\u003C/template>\n\n",[748],{"type":14,"tag":74,"props":749,"children":750},{},[751],{"type":14,"tag":66,"props":752,"children":753},{"__ignoreMap":7},[754,769,792,815,838,861,876],{"type":14,"tag":81,"props":755,"children":756},{"class":83,"line":84},[757,761,765],{"type":14,"tag":81,"props":758,"children":759},{"class":88},[760],{"type":20,"value":91},{"type":14,"tag":81,"props":762,"children":763},{"class":94},[764],{"type":20,"value":54},{"type":14,"tag":81,"props":766,"children":767},{"class":88},[768],{"type":20,"value":101},{"type":14,"tag":81,"props":770,"children":771},{"class":83,"line":104},[772,776,780,784,788],{"type":14,"tag":81,"props":773,"children":774},{"class":88},[775],{"type":20,"value":110},{"type":14,"tag":81,"props":777,"children":778},{"class":113},[779],{"type":20,"value":116},{"type":14,"tag":81,"props":781,"children":782},{"class":88},[783],{"type":20,"value":333},{"type":14,"tag":81,"props":785,"children":786},{"class":336},[787],{"type":20,"value":727},{"type":14,"tag":81,"props":789,"children":790},{"class":88},[791],{"type":20,"value":101},{"type":14,"tag":81,"props":793,"children":794},{"class":83,"line":123},[795,799,803,807,811],{"type":14,"tag":81,"props":796,"children":797},{"class":88},[798],{"type":20,"value":129},{"type":14,"tag":81,"props":800,"children":801},{"class":113},[802],{"type":20,"value":134},{"type":14,"tag":81,"props":804,"children":805},{"class":88},[806],{"type":20,"value":139},{"type":14,"tag":81,"props":808,"children":809},{"class":113},[810],{"type":20,"value":134},{"type":14,"tag":81,"props":812,"children":813},{"class":88},[814],{"type":20,"value":101},{"type":14,"tag":81,"props":816,"children":817},{"class":83,"line":150},[818,822,826,830,834],{"type":14,"tag":81,"props":819,"children":820},{"class":88},[821],{"type":20,"value":129},{"type":14,"tag":81,"props":823,"children":824},{"class":113},[825],{"type":20,"value":134},{"type":14,"tag":81,"props":827,"children":828},{"class":88},[829],{"type":20,"value":164},{"type":14,"tag":81,"props":831,"children":832},{"class":113},[833],{"type":20,"value":134},{"type":14,"tag":81,"props":835,"children":836},{"class":88},[837],{"type":20,"value":101},{"type":14,"tag":81,"props":839,"children":840},{"class":83,"line":175},[841,845,849,853,857],{"type":14,"tag":81,"props":842,"children":843},{"class":88},[844],{"type":20,"value":129},{"type":14,"tag":81,"props":846,"children":847},{"class":113},[848],{"type":20,"value":134},{"type":14,"tag":81,"props":850,"children":851},{"class":88},[852],{"type":20,"value":189},{"type":14,"tag":81,"props":854,"children":855},{"class":113},[856],{"type":20,"value":134},{"type":14,"tag":81,"props":858,"children":859},{"class":88},[860],{"type":20,"value":101},{"type":14,"tag":81,"props":862,"children":863},{"class":83,"line":200},[864,868,872],{"type":14,"tag":81,"props":865,"children":866},{"class":88},[867],{"type":20,"value":206},{"type":14,"tag":81,"props":869,"children":870},{"class":113},[871],{"type":20,"value":116},{"type":14,"tag":81,"props":873,"children":874},{"class":88},[875],{"type":20,"value":101},{"type":14,"tag":81,"props":877,"children":878},{"class":83,"line":217},[879,883,887],{"type":14,"tag":81,"props":880,"children":881},{"class":88},[882],{"type":20,"value":223},{"type":14,"tag":81,"props":884,"children":885},{"class":94},[886],{"type":20,"value":54},{"type":14,"tag":81,"props":888,"children":889},{"class":88},[890],{"type":20,"value":232},{"type":14,"tag":234,"props":892,"children":894},{"id":893},"vertical-basic-example",[895],{"type":20,"value":896},"Vertical Basic Example",{"type":14,"tag":29,"props":898,"children":899},{},[900,902,907],{"type":20,"value":901},"Using the ",{"type":14,"tag":35,"props":903,"children":904},{},[905],{"type":20,"value":906},"vertical",{"type":20,"value":908}," property, you can stack a set of buttons vertically rather than horizontally.",{"type":14,"tag":50,"props":910,"children":911},{},[912,919],{"type":14,"tag":54,"props":913,"children":914},{"v-slot:preview":7},[915],{"type":14,"tag":58,"props":916,"children":918},{"src":917},"/components/IButtonGroup/examples/vertical",[],{"type":14,"tag":54,"props":920,"children":921},{"v-slot:vue":7},[922],{"type":14,"tag":66,"props":923,"children":926},{"className":924,"code":925,"language":71,"meta":7},[69],"\u003Ctemplate>\n    \u003CIButtonGroup vertical>\n        \u003CIButton>Button 1\u003C/IButton>\n        \u003CIButton>Button 2\u003C/IButton>\n        \u003CIButton>Button 3\u003C/IButton>\n    \u003C/IButtonGroup>\n\u003C/template>\n\n",[927],{"type":14,"tag":74,"props":928,"children":929},{},[930],{"type":14,"tag":66,"props":931,"children":932},{"__ignoreMap":7},[933,948,971,995,1019,1043,1058],{"type":14,"tag":81,"props":934,"children":935},{"class":83,"line":84},[936,940,944],{"type":14,"tag":81,"props":937,"children":938},{"class":88},[939],{"type":20,"value":91},{"type":14,"tag":81,"props":941,"children":942},{"class":94},[943],{"type":20,"value":54},{"type":14,"tag":81,"props":945,"children":946},{"class":88},[947],{"type":20,"value":101},{"type":14,"tag":81,"props":949,"children":950},{"class":83,"line":104},[951,955,959,963,967],{"type":14,"tag":81,"props":952,"children":953},{"class":88},[954],{"type":20,"value":110},{"type":14,"tag":81,"props":956,"children":957},{"class":113},[958],{"type":20,"value":116},{"type":14,"tag":81,"props":960,"children":961},{"class":88},[962],{"type":20,"value":333},{"type":14,"tag":81,"props":964,"children":965},{"class":336},[966],{"type":20,"value":906},{"type":14,"tag":81,"props":968,"children":969},{"class":88},[970],{"type":20,"value":101},{"type":14,"tag":81,"props":972,"children":973},{"class":83,"line":123},[974,978,982,987,991],{"type":14,"tag":81,"props":975,"children":976},{"class":88},[977],{"type":20,"value":129},{"type":14,"tag":81,"props":979,"children":980},{"class":113},[981],{"type":20,"value":134},{"type":14,"tag":81,"props":983,"children":984},{"class":88},[985],{"type":20,"value":986},">Button 1\u003C/",{"type":14,"tag":81,"props":988,"children":989},{"class":113},[990],{"type":20,"value":134},{"type":14,"tag":81,"props":992,"children":993},{"class":88},[994],{"type":20,"value":101},{"type":14,"tag":81,"props":996,"children":997},{"class":83,"line":150},[998,1002,1006,1011,1015],{"type":14,"tag":81,"props":999,"children":1000},{"class":88},[1001],{"type":20,"value":129},{"type":14,"tag":81,"props":1003,"children":1004},{"class":113},[1005],{"type":20,"value":134},{"type":14,"tag":81,"props":1007,"children":1008},{"class":88},[1009],{"type":20,"value":1010},">Button 2\u003C/",{"type":14,"tag":81,"props":1012,"children":1013},{"class":113},[1014],{"type":20,"value":134},{"type":14,"tag":81,"props":1016,"children":1017},{"class":88},[1018],{"type":20,"value":101},{"type":14,"tag":81,"props":1020,"children":1021},{"class":83,"line":175},[1022,1026,1030,1035,1039],{"type":14,"tag":81,"props":1023,"children":1024},{"class":88},[1025],{"type":20,"value":129},{"type":14,"tag":81,"props":1027,"children":1028},{"class":113},[1029],{"type":20,"value":134},{"type":14,"tag":81,"props":1031,"children":1032},{"class":88},[1033],{"type":20,"value":1034},">Button 3\u003C/",{"type":14,"tag":81,"props":1036,"children":1037},{"class":113},[1038],{"type":20,"value":134},{"type":14,"tag":81,"props":1040,"children":1041},{"class":88},[1042],{"type":20,"value":101},{"type":14,"tag":81,"props":1044,"children":1045},{"class":83,"line":200},[1046,1050,1054],{"type":14,"tag":81,"props":1047,"children":1048},{"class":88},[1049],{"type":20,"value":206},{"type":14,"tag":81,"props":1051,"children":1052},{"class":113},[1053],{"type":20,"value":116},{"type":14,"tag":81,"props":1055,"children":1056},{"class":88},[1057],{"type":20,"value":101},{"type":14,"tag":81,"props":1059,"children":1060},{"class":83,"line":217},[1061,1065,1069],{"type":14,"tag":81,"props":1062,"children":1063},{"class":88},[1064],{"type":20,"value":223},{"type":14,"tag":81,"props":1066,"children":1067},{"class":94},[1068],{"type":20,"value":54},{"type":14,"tag":81,"props":1070,"children":1071},{"class":88},[1072],{"type":20,"value":232},{"type":14,"tag":234,"props":1074,"children":1076},{"id":1075},"vertical-size-variants",[1077],{"type":20,"value":1078},"Vertical Size Variants",{"type":14,"tag":29,"props":1080,"children":1081},{},[1082,1084,1088,1090,1094],{"type":20,"value":1083},"Just like horizontal button groups, the size of vertical button groups can also be controlled using the ",{"type":14,"tag":35,"props":1085,"children":1086},{},[1087],{"type":20,"value":249},{"type":20,"value":1089}," modifier. The default size is set to ",{"type":14,"tag":35,"props":1091,"children":1092},{},[1093],{"type":20,"value":263},{"type":20,"value":278},{"type":14,"tag":50,"props":1096,"children":1097},{},[1098,1105],{"type":14,"tag":54,"props":1099,"children":1100},{"v-slot:preview":7},[1101],{"type":14,"tag":58,"props":1102,"children":1104},{"src":1103},"/components/IButtonGroup/examples/vertical-size-variants",[],{"type":14,"tag":54,"props":1106,"children":1107},{"v-slot:vue":7},[1108],{"type":14,"tag":66,"props":1109,"children":1112},{"className":1110,"code":1111,"language":71,"meta":7},[69],"\u003Ctemplate>\n    \u003CIButtonGroup vertical size=\"sm\">\n        \u003CIButton>Top\u003C/IButton>\n        \u003CIButton>Middle\u003C/IButton>\n        \u003CIButton>Bottom\u003C/IButton>\n    \u003C/IButtonGroup>\n\n    \u003CIButtonGroup vertical size=\"md\">\n        \u003CIButton>Top\u003C/IButton>\n        \u003CIButton>Middle\u003C/IButton>\n        \u003CIButton>Bottom\u003C/IButton>\n    \u003C/IButtonGroup>\n\n    \u003CIButtonGroup vertical size=\"lg\">\n        \u003CIButton>Top\u003C/IButton>\n        \u003CIButton>Middle\u003C/IButton>\n        \u003CIButton>Bottom\u003C/IButton>\n    \u003C/IButtonGroup>\n\u003C/template>\n\n",[1113],{"type":14,"tag":74,"props":1114,"children":1115},{},[1116],{"type":14,"tag":66,"props":1117,"children":1118},{"__ignoreMap":7},[1119,1134,1173,1197,1220,1244,1259,1266,1305,1328,1351,1374,1389,1396,1435,1458,1481,1504,1519],{"type":14,"tag":81,"props":1120,"children":1121},{"class":83,"line":84},[1122,1126,1130],{"type":14,"tag":81,"props":1123,"children":1124},{"class":88},[1125],{"type":20,"value":91},{"type":14,"tag":81,"props":1127,"children":1128},{"class":94},[1129],{"type":20,"value":54},{"type":14,"tag":81,"props":1131,"children":1132},{"class":88},[1133],{"type":20,"value":101},{"type":14,"tag":81,"props":1135,"children":1136},{"class":83,"line":104},[1137,1141,1145,1149,1153,1157,1161,1165,1169],{"type":14,"tag":81,"props":1138,"children":1139},{"class":88},[1140],{"type":20,"value":110},{"type":14,"tag":81,"props":1142,"children":1143},{"class":113},[1144],{"type":20,"value":116},{"type":14,"tag":81,"props":1146,"children":1147},{"class":88},[1148],{"type":20,"value":333},{"type":14,"tag":81,"props":1150,"children":1151},{"class":336},[1152],{"type":20,"value":906},{"type":14,"tag":81,"props":1154,"children":1155},{"class":88},[1156],{"type":20,"value":333},{"type":14,"tag":81,"props":1158,"children":1159},{"class":336},[1160],{"type":20,"value":249},{"type":14,"tag":81,"props":1162,"children":1163},{"class":88},[1164],{"type":20,"value":343},{"type":14,"tag":81,"props":1166,"children":1167},{"class":346},[1168],{"type":20,"value":349},{"type":14,"tag":81,"props":1170,"children":1171},{"class":88},[1172],{"type":20,"value":101},{"type":14,"tag":81,"props":1174,"children":1175},{"class":83,"line":123},[1176,1180,1184,1189,1193],{"type":14,"tag":81,"props":1177,"children":1178},{"class":88},[1179],{"type":20,"value":129},{"type":14,"tag":81,"props":1181,"children":1182},{"class":113},[1183],{"type":20,"value":134},{"type":14,"tag":81,"props":1185,"children":1186},{"class":88},[1187],{"type":20,"value":1188},">Top\u003C/",{"type":14,"tag":81,"props":1190,"children":1191},{"class":113},[1192],{"type":20,"value":134},{"type":14,"tag":81,"props":1194,"children":1195},{"class":88},[1196],{"type":20,"value":101},{"type":14,"tag":81,"props":1198,"children":1199},{"class":83,"line":150},[1200,1204,1208,1212,1216],{"type":14,"tag":81,"props":1201,"children":1202},{"class":88},[1203],{"type":20,"value":129},{"type":14,"tag":81,"props":1205,"children":1206},{"class":113},[1207],{"type":20,"value":134},{"type":14,"tag":81,"props":1209,"children":1210},{"class":88},[1211],{"type":20,"value":164},{"type":14,"tag":81,"props":1213,"children":1214},{"class":113},[1215],{"type":20,"value":134},{"type":14,"tag":81,"props":1217,"children":1218},{"class":88},[1219],{"type":20,"value":101},{"type":14,"tag":81,"props":1221,"children":1222},{"class":83,"line":175},[1223,1227,1231,1236,1240],{"type":14,"tag":81,"props":1224,"children":1225},{"class":88},[1226],{"type":20,"value":129},{"type":14,"tag":81,"props":1228,"children":1229},{"class":113},[1230],{"type":20,"value":134},{"type":14,"tag":81,"props":1232,"children":1233},{"class":88},[1234],{"type":20,"value":1235},">Bottom\u003C/",{"type":14,"tag":81,"props":1237,"children":1238},{"class":113},[1239],{"type":20,"value":134},{"type":14,"tag":81,"props":1241,"children":1242},{"class":88},[1243],{"type":20,"value":101},{"type":14,"tag":81,"props":1245,"children":1246},{"class":83,"line":200},[1247,1251,1255],{"type":14,"tag":81,"props":1248,"children":1249},{"class":88},[1250],{"type":20,"value":206},{"type":14,"tag":81,"props":1252,"children":1253},{"class":113},[1254],{"type":20,"value":116},{"type":14,"tag":81,"props":1256,"children":1257},{"class":88},[1258],{"type":20,"value":101},{"type":14,"tag":81,"props":1260,"children":1261},{"class":83,"line":217},[1262],{"type":14,"tag":81,"props":1263,"children":1264},{},[1265],{"type":20,"value":445},{"type":14,"tag":81,"props":1267,"children":1268},{"class":83,"line":448},[1269,1273,1277,1281,1285,1289,1293,1297,1301],{"type":14,"tag":81,"props":1270,"children":1271},{"class":88},[1272],{"type":20,"value":110},{"type":14,"tag":81,"props":1274,"children":1275},{"class":113},[1276],{"type":20,"value":116},{"type":14,"tag":81,"props":1278,"children":1279},{"class":88},[1280],{"type":20,"value":333},{"type":14,"tag":81,"props":1282,"children":1283},{"class":336},[1284],{"type":20,"value":906},{"type":14,"tag":81,"props":1286,"children":1287},{"class":88},[1288],{"type":20,"value":333},{"type":14,"tag":81,"props":1290,"children":1291},{"class":336},[1292],{"type":20,"value":249},{"type":14,"tag":81,"props":1294,"children":1295},{"class":88},[1296],{"type":20,"value":343},{"type":14,"tag":81,"props":1298,"children":1299},{"class":346},[1300],{"type":20,"value":474},{"type":14,"tag":81,"props":1302,"children":1303},{"class":88},[1304],{"type":20,"value":101},{"type":14,"tag":81,"props":1306,"children":1307},{"class":83,"line":481},[1308,1312,1316,1320,1324],{"type":14,"tag":81,"props":1309,"children":1310},{"class":88},[1311],{"type":20,"value":129},{"type":14,"tag":81,"props":1313,"children":1314},{"class":113},[1315],{"type":20,"value":134},{"type":14,"tag":81,"props":1317,"children":1318},{"class":88},[1319],{"type":20,"value":1188},{"type":14,"tag":81,"props":1321,"children":1322},{"class":113},[1323],{"type":20,"value":134},{"type":14,"tag":81,"props":1325,"children":1326},{"class":88},[1327],{"type":20,"value":101},{"type":14,"tag":81,"props":1329,"children":1330},{"class":83,"line":505},[1331,1335,1339,1343,1347],{"type":14,"tag":81,"props":1332,"children":1333},{"class":88},[1334],{"type":20,"value":129},{"type":14,"tag":81,"props":1336,"children":1337},{"class":113},[1338],{"type":20,"value":134},{"type":14,"tag":81,"props":1340,"children":1341},{"class":88},[1342],{"type":20,"value":164},{"type":14,"tag":81,"props":1344,"children":1345},{"class":113},[1346],{"type":20,"value":134},{"type":14,"tag":81,"props":1348,"children":1349},{"class":88},[1350],{"type":20,"value":101},{"type":14,"tag":81,"props":1352,"children":1353},{"class":83,"line":529},[1354,1358,1362,1366,1370],{"type":14,"tag":81,"props":1355,"children":1356},{"class":88},[1357],{"type":20,"value":129},{"type":14,"tag":81,"props":1359,"children":1360},{"class":113},[1361],{"type":20,"value":134},{"type":14,"tag":81,"props":1363,"children":1364},{"class":88},[1365],{"type":20,"value":1235},{"type":14,"tag":81,"props":1367,"children":1368},{"class":113},[1369],{"type":20,"value":134},{"type":14,"tag":81,"props":1371,"children":1372},{"class":88},[1373],{"type":20,"value":101},{"type":14,"tag":81,"props":1375,"children":1376},{"class":83,"line":553},[1377,1381,1385],{"type":14,"tag":81,"props":1378,"children":1379},{"class":88},[1380],{"type":20,"value":206},{"type":14,"tag":81,"props":1382,"children":1383},{"class":113},[1384],{"type":20,"value":116},{"type":14,"tag":81,"props":1386,"children":1387},{"class":88},[1388],{"type":20,"value":101},{"type":14,"tag":81,"props":1390,"children":1391},{"class":83,"line":569},[1392],{"type":14,"tag":81,"props":1393,"children":1394},{},[1395],{"type":20,"value":445},{"type":14,"tag":81,"props":1397,"children":1398},{"class":83,"line":577},[1399,1403,1407,1411,1415,1419,1423,1427,1431],{"type":14,"tag":81,"props":1400,"children":1401},{"class":88},[1402],{"type":20,"value":110},{"type":14,"tag":81,"props":1404,"children":1405},{"class":113},[1406],{"type":20,"value":116},{"type":14,"tag":81,"props":1408,"children":1409},{"class":88},[1410],{"type":20,"value":333},{"type":14,"tag":81,"props":1412,"children":1413},{"class":336},[1414],{"type":20,"value":906},{"type":14,"tag":81,"props":1416,"children":1417},{"class":88},[1418],{"type":20,"value":333},{"type":14,"tag":81,"props":1420,"children":1421},{"class":336},[1422],{"type":20,"value":249},{"type":14,"tag":81,"props":1424,"children":1425},{"class":88},[1426],{"type":20,"value":343},{"type":14,"tag":81,"props":1428,"children":1429},{"class":346},[1430],{"type":20,"value":603},{"type":14,"tag":81,"props":1432,"children":1433},{"class":88},[1434],{"type":20,"value":101},{"type":14,"tag":81,"props":1436,"children":1437},{"class":83,"line":610},[1438,1442,1446,1450,1454],{"type":14,"tag":81,"props":1439,"children":1440},{"class":88},[1441],{"type":20,"value":129},{"type":14,"tag":81,"props":1443,"children":1444},{"class":113},[1445],{"type":20,"value":134},{"type":14,"tag":81,"props":1447,"children":1448},{"class":88},[1449],{"type":20,"value":1188},{"type":14,"tag":81,"props":1451,"children":1452},{"class":113},[1453],{"type":20,"value":134},{"type":14,"tag":81,"props":1455,"children":1456},{"class":88},[1457],{"type":20,"value":101},{"type":14,"tag":81,"props":1459,"children":1460},{"class":83,"line":634},[1461,1465,1469,1473,1477],{"type":14,"tag":81,"props":1462,"children":1463},{"class":88},[1464],{"type":20,"value":129},{"type":14,"tag":81,"props":1466,"children":1467},{"class":113},[1468],{"type":20,"value":134},{"type":14,"tag":81,"props":1470,"children":1471},{"class":88},[1472],{"type":20,"value":164},{"type":14,"tag":81,"props":1474,"children":1475},{"class":113},[1476],{"type":20,"value":134},{"type":14,"tag":81,"props":1478,"children":1479},{"class":88},[1480],{"type":20,"value":101},{"type":14,"tag":81,"props":1482,"children":1483},{"class":83,"line":658},[1484,1488,1492,1496,1500],{"type":14,"tag":81,"props":1485,"children":1486},{"class":88},[1487],{"type":20,"value":129},{"type":14,"tag":81,"props":1489,"children":1490},{"class":113},[1491],{"type":20,"value":134},{"type":14,"tag":81,"props":1493,"children":1494},{"class":88},[1495],{"type":20,"value":1235},{"type":14,"tag":81,"props":1497,"children":1498},{"class":113},[1499],{"type":20,"value":134},{"type":14,"tag":81,"props":1501,"children":1502},{"class":88},[1503],{"type":20,"value":101},{"type":14,"tag":81,"props":1505,"children":1506},{"class":83,"line":682},[1507,1511,1515],{"type":14,"tag":81,"props":1508,"children":1509},{"class":88},[1510],{"type":20,"value":206},{"type":14,"tag":81,"props":1512,"children":1513},{"class":113},[1514],{"type":20,"value":116},{"type":14,"tag":81,"props":1516,"children":1517},{"class":88},[1518],{"type":20,"value":101},{"type":14,"tag":81,"props":1520,"children":1521},{"class":83,"line":698},[1522,1526,1530],{"type":14,"tag":81,"props":1523,"children":1524},{"class":88},[1525],{"type":20,"value":223},{"type":14,"tag":81,"props":1527,"children":1528},{"class":94},[1529],{"type":20,"value":54},{"type":14,"tag":81,"props":1531,"children":1532},{"class":88},[1533],{"type":20,"value":232},{"type":14,"tag":234,"props":1535,"children":1537},{"id":1536},"vertical-block",[1538],{"type":20,"value":1539},"Vertical Block",{"type":14,"tag":29,"props":1541,"children":1542},{},[1543,1545,1549],{"type":20,"value":1544},"Just like horizontal block button groups, you can also set vertical button groups to span full width of its parent by adding the ",{"type":14,"tag":35,"props":1546,"children":1547},{},[1548],{"type":20,"value":727},{"type":20,"value":729},{"type":14,"tag":50,"props":1551,"children":1552},{},[1553,1560],{"type":14,"tag":54,"props":1554,"children":1555},{"v-slot:preview":7},[1556],{"type":14,"tag":58,"props":1557,"children":1559},{"src":1558},"/components/IButtonGroup/examples/vertical-block",[],{"type":14,"tag":54,"props":1561,"children":1562},{"v-slot:vue":7},[1563],{"type":14,"tag":66,"props":1564,"children":1567},{"className":1565,"code":1566,"language":71,"meta":7},[69],"\u003Ctemplate>\n    \u003CIButtonGroup block vertical>\n        \u003CIButton>Left\u003C/IButton>\n        \u003CIButton>Middle\u003C/IButton>\n        \u003CIButton>Right\u003C/IButton>\n    \u003C/IButtonGroup>\n\u003C/template>\n\n",[1568],{"type":14,"tag":74,"props":1569,"children":1570},{},[1571],{"type":14,"tag":66,"props":1572,"children":1573},{"__ignoreMap":7},[1574,1589,1620,1643,1666,1689,1704],{"type":14,"tag":81,"props":1575,"children":1576},{"class":83,"line":84},[1577,1581,1585],{"type":14,"tag":81,"props":1578,"children":1579},{"class":88},[1580],{"type":20,"value":91},{"type":14,"tag":81,"props":1582,"children":1583},{"class":94},[1584],{"type":20,"value":54},{"type":14,"tag":81,"props":1586,"children":1587},{"class":88},[1588],{"type":20,"value":101},{"type":14,"tag":81,"props":1590,"children":1591},{"class":83,"line":104},[1592,1596,1600,1604,1608,1612,1616],{"type":14,"tag":81,"props":1593,"children":1594},{"class":88},[1595],{"type":20,"value":110},{"type":14,"tag":81,"props":1597,"children":1598},{"class":113},[1599],{"type":20,"value":116},{"type":14,"tag":81,"props":1601,"children":1602},{"class":88},[1603],{"type":20,"value":333},{"type":14,"tag":81,"props":1605,"children":1606},{"class":336},[1607],{"type":20,"value":727},{"type":14,"tag":81,"props":1609,"children":1610},{"class":88},[1611],{"type":20,"value":333},{"type":14,"tag":81,"props":1613,"children":1614},{"class":336},[1615],{"type":20,"value":906},{"type":14,"tag":81,"props":1617,"children":1618},{"class":88},[1619],{"type":20,"value":101},{"type":14,"tag":81,"props":1621,"children":1622},{"class":83,"line":123},[1623,1627,1631,1635,1639],{"type":14,"tag":81,"props":1624,"children":1625},{"class":88},[1626],{"type":20,"value":129},{"type":14,"tag":81,"props":1628,"children":1629},{"class":113},[1630],{"type":20,"value":134},{"type":14,"tag":81,"props":1632,"children":1633},{"class":88},[1634],{"type":20,"value":139},{"type":14,"tag":81,"props":1636,"children":1637},{"class":113},[1638],{"type":20,"value":134},{"type":14,"tag":81,"props":1640,"children":1641},{"class":88},[1642],{"type":20,"value":101},{"type":14,"tag":81,"props":1644,"children":1645},{"class":83,"line":150},[1646,1650,1654,1658,1662],{"type":14,"tag":81,"props":1647,"children":1648},{"class":88},[1649],{"type":20,"value":129},{"type":14,"tag":81,"props":1651,"children":1652},{"class":113},[1653],{"type":20,"value":134},{"type":14,"tag":81,"props":1655,"children":1656},{"class":88},[1657],{"type":20,"value":164},{"type":14,"tag":81,"props":1659,"children":1660},{"class":113},[1661],{"type":20,"value":134},{"type":14,"tag":81,"props":1663,"children":1664},{"class":88},[1665],{"type":20,"value":101},{"type":14,"tag":81,"props":1667,"children":1668},{"class":83,"line":175},[1669,1673,1677,1681,1685],{"type":14,"tag":81,"props":1670,"children":1671},{"class":88},[1672],{"type":20,"value":129},{"type":14,"tag":81,"props":1674,"children":1675},{"class":113},[1676],{"type":20,"value":134},{"type":14,"tag":81,"props":1678,"children":1679},{"class":88},[1680],{"type":20,"value":189},{"type":14,"tag":81,"props":1682,"children":1683},{"class":113},[1684],{"type":20,"value":134},{"type":14,"tag":81,"props":1686,"children":1687},{"class":88},[1688],{"type":20,"value":101},{"type":14,"tag":81,"props":1690,"children":1691},{"class":83,"line":200},[1692,1696,1700],{"type":14,"tag":81,"props":1693,"children":1694},{"class":88},[1695],{"type":20,"value":206},{"type":14,"tag":81,"props":1697,"children":1698},{"class":113},[1699],{"type":20,"value":116},{"type":14,"tag":81,"props":1701,"children":1702},{"class":88},[1703],{"type":20,"value":101},{"type":14,"tag":81,"props":1705,"children":1706},{"class":83,"line":217},[1707,1711,1715],{"type":14,"tag":81,"props":1708,"children":1709},{"class":88},[1710],{"type":20,"value":223},{"type":14,"tag":81,"props":1712,"children":1713},{"class":94},[1714],{"type":20,"value":54},{"type":14,"tag":81,"props":1716,"children":1717},{"class":88},[1718],{"type":20,"value":232},{"type":14,"tag":234,"props":1720,"children":1722},{"id":1721},"nested",[1723],{"type":20,"value":1724},"Nested",{"type":14,"tag":29,"props":1726,"children":1727},{},[1728,1730,1734,1736,1740],{"type":20,"value":1729},"When placing a ",{"type":14,"tag":35,"props":1731,"children":1732},{},[1733],{"type":20,"value":46},{"type":20,"value":1735}," inside another ",{"type":14,"tag":35,"props":1737,"children":1738},{},[1739],{"type":20,"value":46},{"type":20,"value":1741},", you'll get a mixed series of buttons that will render seamlessly.",{"type":14,"tag":50,"props":1743,"children":1744},{},[1745,1752],{"type":14,"tag":54,"props":1746,"children":1747},{"v-slot:preview":7},[1748],{"type":14,"tag":58,"props":1749,"children":1751},{"src":1750},"/components/IButtonGroup/examples/nested",[],{"type":14,"tag":54,"props":1753,"children":1754},{"v-slot:vue":7},[1755],{"type":14,"tag":66,"props":1756,"children":1759},{"className":1757,"code":1758,"language":71,"meta":7},[69],"\u003Ctemplate>\n    \u003CIButtonGroup>\n        \u003CIButton>Button 1\u003C/IButton>\n        \u003CIButtonGroup>\n            \u003CIButton>Button 2\u003C/IButton>\n            \u003CIButton>Button 3\u003C/IButton>\n        \u003C/IButtonGroup>\n    \u003C/IButtonGroup>\n\u003C/template>\n\n",[1760],{"type":14,"tag":74,"props":1761,"children":1762},{},[1763],{"type":14,"tag":66,"props":1764,"children":1765},{"__ignoreMap":7},[1766,1781,1796,1819,1834,1858,1881,1897,1912],{"type":14,"tag":81,"props":1767,"children":1768},{"class":83,"line":84},[1769,1773,1777],{"type":14,"tag":81,"props":1770,"children":1771},{"class":88},[1772],{"type":20,"value":91},{"type":14,"tag":81,"props":1774,"children":1775},{"class":94},[1776],{"type":20,"value":54},{"type":14,"tag":81,"props":1778,"children":1779},{"class":88},[1780],{"type":20,"value":101},{"type":14,"tag":81,"props":1782,"children":1783},{"class":83,"line":104},[1784,1788,1792],{"type":14,"tag":81,"props":1785,"children":1786},{"class":88},[1787],{"type":20,"value":110},{"type":14,"tag":81,"props":1789,"children":1790},{"class":113},[1791],{"type":20,"value":116},{"type":14,"tag":81,"props":1793,"children":1794},{"class":88},[1795],{"type":20,"value":101},{"type":14,"tag":81,"props":1797,"children":1798},{"class":83,"line":123},[1799,1803,1807,1811,1815],{"type":14,"tag":81,"props":1800,"children":1801},{"class":88},[1802],{"type":20,"value":129},{"type":14,"tag":81,"props":1804,"children":1805},{"class":113},[1806],{"type":20,"value":134},{"type":14,"tag":81,"props":1808,"children":1809},{"class":88},[1810],{"type":20,"value":986},{"type":14,"tag":81,"props":1812,"children":1813},{"class":113},[1814],{"type":20,"value":134},{"type":14,"tag":81,"props":1816,"children":1817},{"class":88},[1818],{"type":20,"value":101},{"type":14,"tag":81,"props":1820,"children":1821},{"class":83,"line":150},[1822,1826,1830],{"type":14,"tag":81,"props":1823,"children":1824},{"class":88},[1825],{"type":20,"value":129},{"type":14,"tag":81,"props":1827,"children":1828},{"class":113},[1829],{"type":20,"value":116},{"type":14,"tag":81,"props":1831,"children":1832},{"class":88},[1833],{"type":20,"value":101},{"type":14,"tag":81,"props":1835,"children":1836},{"class":83,"line":175},[1837,1842,1846,1850,1854],{"type":14,"tag":81,"props":1838,"children":1839},{"class":88},[1840],{"type":20,"value":1841},"            \u003C",{"type":14,"tag":81,"props":1843,"children":1844},{"class":113},[1845],{"type":20,"value":134},{"type":14,"tag":81,"props":1847,"children":1848},{"class":88},[1849],{"type":20,"value":1010},{"type":14,"tag":81,"props":1851,"children":1852},{"class":113},[1853],{"type":20,"value":134},{"type":14,"tag":81,"props":1855,"children":1856},{"class":88},[1857],{"type":20,"value":101},{"type":14,"tag":81,"props":1859,"children":1860},{"class":83,"line":200},[1861,1865,1869,1873,1877],{"type":14,"tag":81,"props":1862,"children":1863},{"class":88},[1864],{"type":20,"value":1841},{"type":14,"tag":81,"props":1866,"children":1867},{"class":113},[1868],{"type":20,"value":134},{"type":14,"tag":81,"props":1870,"children":1871},{"class":88},[1872],{"type":20,"value":1034},{"type":14,"tag":81,"props":1874,"children":1875},{"class":113},[1876],{"type":20,"value":134},{"type":14,"tag":81,"props":1878,"children":1879},{"class":88},[1880],{"type":20,"value":101},{"type":14,"tag":81,"props":1882,"children":1883},{"class":83,"line":217},[1884,1889,1893],{"type":14,"tag":81,"props":1885,"children":1886},{"class":88},[1887],{"type":20,"value":1888},"        \u003C/",{"type":14,"tag":81,"props":1890,"children":1891},{"class":113},[1892],{"type":20,"value":116},{"type":14,"tag":81,"props":1894,"children":1895},{"class":88},[1896],{"type":20,"value":101},{"type":14,"tag":81,"props":1898,"children":1899},{"class":83,"line":448},[1900,1904,1908],{"type":14,"tag":81,"props":1901,"children":1902},{"class":88},[1903],{"type":20,"value":206},{"type":14,"tag":81,"props":1905,"children":1906},{"class":113},[1907],{"type":20,"value":116},{"type":14,"tag":81,"props":1909,"children":1910},{"class":88},[1911],{"type":20,"value":101},{"type":14,"tag":81,"props":1913,"children":1914},{"class":83,"line":481},[1915,1919,1923],{"type":14,"tag":81,"props":1916,"children":1917},{"class":88},[1918],{"type":20,"value":223},{"type":14,"tag":81,"props":1920,"children":1921},{"class":94},[1922],{"type":20,"value":54},{"type":14,"tag":81,"props":1924,"children":1925},{"class":88},[1926],{"type":20,"value":232},{"type":14,"tag":234,"props":1928,"children":1930},{"id":1929},"nested-block",[1931],{"type":20,"value":1932},"Nested Block",{"type":14,"tag":29,"props":1934,"children":1935},{},[1936,1938,1942],{"type":20,"value":1937},"You can also nest ",{"type":14,"tag":35,"props":1939,"children":1940},{},[1941],{"type":20,"value":727},{"type":20,"value":1943}," button groups.",{"type":14,"tag":50,"props":1945,"children":1946},{},[1947,1954],{"type":14,"tag":54,"props":1948,"children":1949},{"v-slot:preview":7},[1950],{"type":14,"tag":58,"props":1951,"children":1953},{"src":1952},"/components/IButtonGroup/examples/nested-block",[],{"type":14,"tag":54,"props":1955,"children":1956},{"v-slot:vue":7},[1957],{"type":14,"tag":66,"props":1958,"children":1961},{"className":1959,"code":1960,"language":71,"meta":7},[69],"\u003Ctemplate>\n    \u003CIButtonGroup block>\n        \u003CIButton>Button 1\u003C/IButton>\n        \u003CIButtonGroup block>\n            \u003CIButton>Button 2\u003C/IButton>\n            \u003CIButton>Button 3\u003C/IButton>\n        \u003C/IButtonGroup>\n    \u003C/IButtonGroup>\n\u003C/template>\n\n",[1962],{"type":14,"tag":74,"props":1963,"children":1964},{},[1965],{"type":14,"tag":66,"props":1966,"children":1967},{"__ignoreMap":7},[1968,1983,2006,2029,2052,2075,2098,2113,2128],{"type":14,"tag":81,"props":1969,"children":1970},{"class":83,"line":84},[1971,1975,1979],{"type":14,"tag":81,"props":1972,"children":1973},{"class":88},[1974],{"type":20,"value":91},{"type":14,"tag":81,"props":1976,"children":1977},{"class":94},[1978],{"type":20,"value":54},{"type":14,"tag":81,"props":1980,"children":1981},{"class":88},[1982],{"type":20,"value":101},{"type":14,"tag":81,"props":1984,"children":1985},{"class":83,"line":104},[1986,1990,1994,1998,2002],{"type":14,"tag":81,"props":1987,"children":1988},{"class":88},[1989],{"type":20,"value":110},{"type":14,"tag":81,"props":1991,"children":1992},{"class":113},[1993],{"type":20,"value":116},{"type":14,"tag":81,"props":1995,"children":1996},{"class":88},[1997],{"type":20,"value":333},{"type":14,"tag":81,"props":1999,"children":2000},{"class":336},[2001],{"type":20,"value":727},{"type":14,"tag":81,"props":2003,"children":2004},{"class":88},[2005],{"type":20,"value":101},{"type":14,"tag":81,"props":2007,"children":2008},{"class":83,"line":123},[2009,2013,2017,2021,2025],{"type":14,"tag":81,"props":2010,"children":2011},{"class":88},[2012],{"type":20,"value":129},{"type":14,"tag":81,"props":2014,"children":2015},{"class":113},[2016],{"type":20,"value":134},{"type":14,"tag":81,"props":2018,"children":2019},{"class":88},[2020],{"type":20,"value":986},{"type":14,"tag":81,"props":2022,"children":2023},{"class":113},[2024],{"type":20,"value":134},{"type":14,"tag":81,"props":2026,"children":2027},{"class":88},[2028],{"type":20,"value":101},{"type":14,"tag":81,"props":2030,"children":2031},{"class":83,"line":150},[2032,2036,2040,2044,2048],{"type":14,"tag":81,"props":2033,"children":2034},{"class":88},[2035],{"type":20,"value":129},{"type":14,"tag":81,"props":2037,"children":2038},{"class":113},[2039],{"type":20,"value":116},{"type":14,"tag":81,"props":2041,"children":2042},{"class":88},[2043],{"type":20,"value":333},{"type":14,"tag":81,"props":2045,"children":2046},{"class":336},[2047],{"type":20,"value":727},{"type":14,"tag":81,"props":2049,"children":2050},{"class":88},[2051],{"type":20,"value":101},{"type":14,"tag":81,"props":2053,"children":2054},{"class":83,"line":175},[2055,2059,2063,2067,2071],{"type":14,"tag":81,"props":2056,"children":2057},{"class":88},[2058],{"type":20,"value":1841},{"type":14,"tag":81,"props":2060,"children":2061},{"class":113},[2062],{"type":20,"value":134},{"type":14,"tag":81,"props":2064,"children":2065},{"class":88},[2066],{"type":20,"value":1010},{"type":14,"tag":81,"props":2068,"children":2069},{"class":113},[2070],{"type":20,"value":134},{"type":14,"tag":81,"props":2072,"children":2073},{"class":88},[2074],{"type":20,"value":101},{"type":14,"tag":81,"props":2076,"children":2077},{"class":83,"line":200},[2078,2082,2086,2090,2094],{"type":14,"tag":81,"props":2079,"children":2080},{"class":88},[2081],{"type":20,"value":1841},{"type":14,"tag":81,"props":2083,"children":2084},{"class":113},[2085],{"type":20,"value":134},{"type":14,"tag":81,"props":2087,"children":2088},{"class":88},[2089],{"type":20,"value":1034},{"type":14,"tag":81,"props":2091,"children":2092},{"class":113},[2093],{"type":20,"value":134},{"type":14,"tag":81,"props":2095,"children":2096},{"class":88},[2097],{"type":20,"value":101},{"type":14,"tag":81,"props":2099,"children":2100},{"class":83,"line":217},[2101,2105,2109],{"type":14,"tag":81,"props":2102,"children":2103},{"class":88},[2104],{"type":20,"value":1888},{"type":14,"tag":81,"props":2106,"children":2107},{"class":113},[2108],{"type":20,"value":116},{"type":14,"tag":81,"props":2110,"children":2111},{"class":88},[2112],{"type":20,"value":101},{"type":14,"tag":81,"props":2114,"children":2115},{"class":83,"line":448},[2116,2120,2124],{"type":14,"tag":81,"props":2117,"children":2118},{"class":88},[2119],{"type":20,"value":206},{"type":14,"tag":81,"props":2121,"children":2122},{"class":113},[2123],{"type":20,"value":116},{"type":14,"tag":81,"props":2125,"children":2126},{"class":88},[2127],{"type":20,"value":101},{"type":14,"tag":81,"props":2129,"children":2130},{"class":83,"line":481},[2131,2135,2139],{"type":14,"tag":81,"props":2132,"children":2133},{"class":88},[2134],{"type":20,"value":223},{"type":14,"tag":81,"props":2136,"children":2137},{"class":94},[2138],{"type":20,"value":54},{"type":14,"tag":81,"props":2140,"children":2141},{"class":88},[2142],{"type":20,"value":232},{"type":14,"tag":234,"props":2144,"children":2146},{"id":2145},"disabled",[2147],{"type":20,"value":2148},"Disabled",{"type":14,"tag":29,"props":2150,"children":2151},{},[2152,2154,2158],{"type":20,"value":2153},"You can make button groups look inactive or disabled by adding the ",{"type":14,"tag":35,"props":2155,"children":2156},{},[2157],{"type":20,"value":2145},{"type":20,"value":2159}," boolean property.",{"type":14,"tag":50,"props":2161,"children":2162},{},[2163,2170],{"type":14,"tag":54,"props":2164,"children":2165},{"v-slot:preview":7},[2166],{"type":14,"tag":58,"props":2167,"children":2169},{"src":2168},"/components/IButtonGroup/examples/disabled",[],{"type":14,"tag":54,"props":2171,"children":2172},{"v-slot:vue":7},[2173],{"type":14,"tag":66,"props":2174,"children":2177},{"className":2175,"code":2176,"language":71,"meta":7},[69],"\u003Ctemplate>\n    \u003CIButtonGroup disabled>\n        \u003CIButton>Left\u003C/IButton>\n        \u003CIButton>Middle\u003C/IButton>\n        \u003CIButton>Right\u003C/IButton>\n    \u003C/IButtonGroup>\n\u003C/template>\n\n",[2178],{"type":14,"tag":74,"props":2179,"children":2180},{},[2181],{"type":14,"tag":66,"props":2182,"children":2183},{"__ignoreMap":7},[2184,2199,2222,2245,2268,2291,2306],{"type":14,"tag":81,"props":2185,"children":2186},{"class":83,"line":84},[2187,2191,2195],{"type":14,"tag":81,"props":2188,"children":2189},{"class":88},[2190],{"type":20,"value":91},{"type":14,"tag":81,"props":2192,"children":2193},{"class":94},[2194],{"type":20,"value":54},{"type":14,"tag":81,"props":2196,"children":2197},{"class":88},[2198],{"type":20,"value":101},{"type":14,"tag":81,"props":2200,"children":2201},{"class":83,"line":104},[2202,2206,2210,2214,2218],{"type":14,"tag":81,"props":2203,"children":2204},{"class":88},[2205],{"type":20,"value":110},{"type":14,"tag":81,"props":2207,"children":2208},{"class":113},[2209],{"type":20,"value":116},{"type":14,"tag":81,"props":2211,"children":2212},{"class":88},[2213],{"type":20,"value":333},{"type":14,"tag":81,"props":2215,"children":2216},{"class":336},[2217],{"type":20,"value":2145},{"type":14,"tag":81,"props":2219,"children":2220},{"class":88},[2221],{"type":20,"value":101},{"type":14,"tag":81,"props":2223,"children":2224},{"class":83,"line":123},[2225,2229,2233,2237,2241],{"type":14,"tag":81,"props":2226,"children":2227},{"class":88},[2228],{"type":20,"value":129},{"type":14,"tag":81,"props":2230,"children":2231},{"class":113},[2232],{"type":20,"value":134},{"type":14,"tag":81,"props":2234,"children":2235},{"class":88},[2236],{"type":20,"value":139},{"type":14,"tag":81,"props":2238,"children":2239},{"class":113},[2240],{"type":20,"value":134},{"type":14,"tag":81,"props":2242,"children":2243},{"class":88},[2244],{"type":20,"value":101},{"type":14,"tag":81,"props":2246,"children":2247},{"class":83,"line":150},[2248,2252,2256,2260,2264],{"type":14,"tag":81,"props":2249,"children":2250},{"class":88},[2251],{"type":20,"value":129},{"type":14,"tag":81,"props":2253,"children":2254},{"class":113},[2255],{"type":20,"value":134},{"type":14,"tag":81,"props":2257,"children":2258},{"class":88},[2259],{"type":20,"value":164},{"type":14,"tag":81,"props":2261,"children":2262},{"class":113},[2263],{"type":20,"value":134},{"type":14,"tag":81,"props":2265,"children":2266},{"class":88},[2267],{"type":20,"value":101},{"type":14,"tag":81,"props":2269,"children":2270},{"class":83,"line":175},[2271,2275,2279,2283,2287],{"type":14,"tag":81,"props":2272,"children":2273},{"class":88},[2274],{"type":20,"value":129},{"type":14,"tag":81,"props":2276,"children":2277},{"class":113},[2278],{"type":20,"value":134},{"type":14,"tag":81,"props":2280,"children":2281},{"class":88},[2282],{"type":20,"value":189},{"type":14,"tag":81,"props":2284,"children":2285},{"class":113},[2286],{"type":20,"value":134},{"type":14,"tag":81,"props":2288,"children":2289},{"class":88},[2290],{"type":20,"value":101},{"type":14,"tag":81,"props":2292,"children":2293},{"class":83,"line":200},[2294,2298,2302],{"type":14,"tag":81,"props":2295,"children":2296},{"class":88},[2297],{"type":20,"value":206},{"type":14,"tag":81,"props":2299,"children":2300},{"class":113},[2301],{"type":20,"value":116},{"type":14,"tag":81,"props":2303,"children":2304},{"class":88},[2305],{"type":20,"value":101},{"type":14,"tag":81,"props":2307,"children":2308},{"class":83,"line":217},[2309,2313,2317],{"type":14,"tag":81,"props":2310,"children":2311},{"class":88},[2312],{"type":20,"value":223},{"type":14,"tag":81,"props":2314,"children":2315},{"class":94},[2316],{"type":20,"value":54},{"type":14,"tag":81,"props":2318,"children":2319},{"class":88},[2320],{"type":20,"value":232},{"type":14,"tag":234,"props":2322,"children":2324},{"id":2323},"props",[2325],{"type":20,"value":2326},"Props",{"type":14,"tag":2328,"props":2329,"children":2330},"content-component-props",{"component":116},[],{"type":14,"tag":234,"props":2332,"children":2334},{"id":2333},"slots",[2335],{"type":20,"value":2336},"Slots",{"type":14,"tag":2338,"props":2339,"children":2340},"content-component-slots",{"component":116},[],{"type":14,"tag":234,"props":2342,"children":2344},{"id":2343},"design-tokens",[2345],{"type":20,"value":2346},"Design Tokens",{"type":14,"tag":2348,"props":2349,"children":2350},"content-component-design-tokens",{"component":116},[],{"type":14,"tag":2352,"children":2353},"style",[2354],{"type":20,"value":2355},".ct-553616{color:#24292E;}\n.dark-theme .ct-553616{color:#E1E4E8;}\n.ct-914029{color:#22863A;}\n.dark-theme .ct-914029{color:#85E89D;}\n.ct-028869{color:#B31D28;font-style:italic;}\n.dark-theme .ct-028869{color:#FDAEB7;font-style:italic;}\n.ct-762058{color:#6F42C1;}\n.dark-theme .ct-762058{color:#B392F0;}\n.ct-952708{color:#032F62;}\n.dark-theme .ct-952708{color:#9ECBFF;}",{"title":7,"searchDepth":104,"depth":104,"links":2357},[2358],{"id":25,"depth":104,"text":9,"children":2359},[2360,2361,2362,2363,2364,2365,2366,2367,2368,2369,2370],{"id":236,"depth":123,"text":239},{"id":714,"depth":123,"text":717},{"id":893,"depth":123,"text":896},{"id":1075,"depth":123,"text":1078},{"id":1536,"depth":123,"text":1539},{"id":1721,"depth":123,"text":1724},{"id":1929,"depth":123,"text":1932},{"id":2145,"depth":123,"text":2148},{"id":2323,"depth":123,"text":2326},{"id":2333,"depth":123,"text":2336},{"id":2343,"depth":123,"text":2346},"markdown","content:docs:components:button-group.md","content","docs/components/button-group.md",1794582258369]