ButtonGroup

import { ButtonGroup, Button } from "@grassroot/ui-react";
 
<ButtonGroup>
  <Button variant="ghost">Day</Button>
  <Button variant="ghost">Week</Button>
  <Button variant="ghost">Month</Button>
</ButtonGroup>

<script setup lang="ts">
import { Button, ButtonGroup } from "@grassroot/ui-vue";
</script>
 
<template>
  <ButtonGroup
 
  >
    <Button variant="ghost">Day</Button>
    <Button variant="ghost">Week</Button>
    <Button variant="ghost">Month</Button>
  </ButtonGroup>
</template>

import { Component } from "@angular/core";
import { GrassrootButton, GrassrootButtonGroup } from "@grassroot/ui-angular";
 
@Component({
  selector: "app-example",
  standalone: true,
  imports: [GrassrootButton, GrassrootButtonGroup],
  template: `
    <grassroot-button-group
 
    >
      <grassroot-button variant="ghost">Day</grassroot-button>
      <grassroot-button variant="ghost">Week</grassroot-button>
      <grassroot-button variant="ghost">Month</grassroot-button>
    </grassroot-button-group>
  `,
})
export class ExampleComponent {
}

<script lang="ts">
  import { Button, ButtonGroup } from "@grassroot/ui-svelte";
</script>
 
<ButtonGroup
 
>
  <Button variant="ghost">Day</Button>
  <Button variant="ghost">Week</Button>
  <Button variant="ghost">Month</Button>
</ButtonGroup>

import { Button, ButtonGroup } from "@grassroot/ui-solid";
 
export function Example() {
  return (
    <>
      <ButtonGroup
 
      >
        <Button variant="ghost">Day</Button>
        <Button variant="ghost">Week</Button>
        <Button variant="ghost">Month</Button>
      </ButtonGroup>
    </>
  );
}