fusion-wc-ripple
Installation
npm install @equinor/fusion-wc-ripple
<fwc-ripple>
Ripple Properties/Attributes
Name | Type | Default | Description |
---|---|---|---|
primary |
boolean |
false |
When true, sets the ripple color to --mdc-theme-primary . Will be overridden by --mdc-ripple-color if set. |
accent |
boolean |
false |
When true, sets the ripple color to --mdc-theme-secondary . Will be overridden by --mdc-ripple-color if set. |
unbounded |
boolean |
false |
When true, the ripple will flow outside the component in a circle. |
activated |
boolean |
false |
Set true when the container of the ripple should be in an activated state. |
selected |
boolean |
false |
Set true when the container of the ripple should be in a selected state. |
disabled |
boolean |
false |
Set true to disable the ripple when the container of the ripple is disabled. |
Methods
Name | Description |
---|---|
startPress(event?: Event) => void |
Begin the press state of the ripple. Optional Event will be used to determine the beginning coordinates of the ripple animation when unbounded is false. |
endPress() => void |
End the press state of the ripple. |
startFocus() => void |
Begin the focus state of the ripple. |
endFocus() => void |
End the focus state of the ripple. |
startHover() => void |
Begin the hover state of the ripple. |
endHover() => void |
End the hover state of the ripple. |