Ember-cli-mdc-button NPM | npm.io

3.0.17 • Published 10 days ago

Install

Weekly downloads

280

License

Apache-2.0

Repository

Last release

10 days ago

ember-cli-mdc-button

ember-cli addon for @material/button

Installation

ember install ember-cli-mdc-button

Styles

@use "@material/button/mixins" as button;

Components

This package contains the following top-level components.

MdcButton

Description

Add a button element to the page.

Usage

The inline version:

<MdcButton @style=[raised|unelevated|outlined]
           @label=label
           @leadingIcon=icon
           @trailingIcon=icon />

or the block version:

<MdcButton @style=[raised|unelevated|outlined]>
  <!-- optional leading icon -->
  <MdcButtonIcon @icon=icon />

  <MdcButtonLabel>Button Label</MdcButtonLabel>

  <!-- optional trailing icon -->
  <MdcButtonIcon @icon=icon />
</MdcButton>

Attributes

style - The button style. Must either be one of the following string values: raised, unelevated, or outlined
label - The button label
leadingIcon - Icon displayed before the label
trailingIcon - Icon displayed after the label

Examples

<MdcButton @style="raised" @label="Button" />
<MdcButton @style="outlined" @label="Button" />

Listening for button clicks

Use the on modifier to listen for button clicks.

<MdcButtton @style="raised" @label="Button" {{on "click" this.clicked}} />

HTML attributes

The button also supports the standard HTML attributes of a button:

<MdcButtton @style="raised" @label="Button" {{on "click" this.clicked}} disabled={{this.disabled}} />

MdcButtonLinkTo

The MdcButtonLinkTo components will bind the button to a route, which means you do not have to create an action that routes to a new location when clicked. The does this by extending the LinkComponent component, and applying the Button mixin exported from this module.

Because MdcButtonLinkTo extends LinkComponent, all properties and methods available on LinkComponent are available on MdcButtonLinkTo.

{{!-- The button label is the first parameter for inline links. --}}
<MdcButtonLinkTo @route="contact" @label="Contact Us" @style="unelevated" />

<MdcButtonLinkTo @route="user" @model={{this.user.id}} @style="raised">
  <MdcButtonLabel>Contact Us</MdcButtonLabel>
</MdcButtonLinkTo>

ember-addon material material design material components button

@material/typography ember-auto-import ember-cli-babel ember-cli-blueprint-helpers ember-cli-htmlbars ember-cli-mdc-sass ember-cli-mdc-utils

@everything-registry/sub-chunk-1575 @infinitebrahmanuniverse/nolb-ember-cli-m @zalastax/nolb-ember-cli-m

10 days ago

21 days ago

1 month ago

1 month ago

1 month ago

3 months ago

3 months ago

2 years ago

2 years ago

2 years ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

2.0.0-octane.49

3 years ago

2.0.0-octane.48

3 years ago

2.0.0-octane.47

3 years ago

2.0.0-octane.46

3 years ago

2.0.0-octane.45

3 years ago

2.0.0-octane.43

3 years ago

2.0.0-octane.42

3 years ago

2.0.0-octane.41

3 years ago

2.0.0-octane.39

3 years ago

2.0.0-octane.40

3 years ago

2.0.0-octane.38

3 years ago

2.0.0-octane.37

3 years ago

2.0.0-octane.36

3 years ago

2.0.0-octane.35

3 years ago

2.0.0-octane.33

3 years ago

2.0.0-octane.34

3 years ago

2.0.0-octane.31

3 years ago

2.0.0-octane.32

3 years ago

2.0.0-octane.30

3 years ago

2.0.0-octane.28

3 years ago

2.0.0-octane.27

3 years ago

2.0.0-octane.26

3 years ago

2.0.0-octane.25

3 years ago

2.0.0-octane.24

3 years ago

2.0.0-octane.23

3 years ago

2.0.0-octane.22

3 years ago

2.0.0-octane.17

3 years ago

2.0.0-octane.19

3 years ago

2.0.0-octane.18

3 years ago

2.0.0-octane.21

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

2.0.0-octane.16

4 years ago

2.0.0-octane.15

4 years ago

2.0.0-octane.14

4 years ago

2.0.0-octane.11

4 years ago

2.0.0-octane.13

4 years ago

2.0.0-octane.12

4 years ago

2.0.0-octane.10

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago