noodles

Buttons

            
              
    // Standard Buttons
    <Button text="Primary" class="btn btn-primary" />
    <Button text="Secondary" class="btn btn-secondary" />
    <Button text="Success" class="btn btn-success" />
    <Button text="Danger" class="btn btn-danger" />
    <Button text="Warning" class="btn btn-warning" />
    <Button text="Info" class="btn btn-info" />
    <Button text="Link" class="btn btn-link" />
    <Button text="Disabled" class="btn btn-primary" disabled />
  
            
          
            
              
    // Outlined Buttons
    <Button text="Primary" class="btn btn-primary--outlined" />
    <Button text="Secondary" class="btn btn-secondary--outlined" />
    <Button text="Success" class="btn btn-success--outlined" />
    <Button text="Danger" class="btn btn-danger--outlined" />
    <Button text="Warning" class="btn btn-warning--outlined" />
    <Button text="Info" class="btn btn-info--outlined" />
    <Button text="Link" class="btn btn-link--outlined" />
    <Button text="Primary" class="btn btn-primary--outlined" disabled />
  
            
          

Dismissable

Using the available slot in the Button we can pass in the DismissButton

                
                
    // Dismissable Button
    <Button title="Primary" class="btn btn-primary">
      <DismissButton />
    </Button>
  
                
              

Badges

Primary Secondary Success Danger Warning Info Link
Primary Secondary Success Danger Warning Info Warning Disabled

Dismissable

Primary Secondary Success Danger Warning Info Link
Primary Secondary Success Danger Warning Info

Form Elements