com.vaadin.polymer.paper.PaperIconButtonElement Maven / Gradle / Ivy

Go to download
Show more of this group Show more artifacts with this name
Show all versions of vaadin-gwt-polymer-elements Show documentation
vaadin-gwt-polymer-elements
The newest version!
/*
 * This code was generated with Vaadin Web Component GWT API Generator, 
 * from paper-icon-button project by The Polymer Authors
 * that is licensed with http://polymer.github.io/LICENSE.txt license.
 */
package com.vaadin.polymer.paper;

import com.vaadin.polymer.elemental.*;
import com.google.gwt.core.client.JavaScriptObject;
import com.google.gwt.core.client.JsArray;
import jsinterop.annotations.JsOverlay;
import jsinterop.annotations.JsProperty;
import jsinterop.annotations.JsType;

/**
 * Material design: Icon toggles
 * paper-icon-button is a button with an image placed at the center. When the user touches
the button, a ripple effect emanates from the center of the button.
 * paper-icon-button includes a default icon set.  Use icon to specify which icon
from the icon set to use.
 * <paper-icon-button icon="menu"></paper-icon-button>
 * 
 * 
 * 
See iron-iconset for more information about
how to use a custom icon set.
 * Example:
 * <link href="path/to/iron-icons/iron-icons.html" rel="import">
 * 
 * <paper-icon-button icon="favorite"></paper-icon-button>
 * <paper-icon-button src="star.png"></paper-icon-button>
 * 
 * 
 * 
To use paper-icon-button as a link, wrap it in an anchor tag. Since paper-icon-button
will already receive focus, you may want to prevent the anchor tag from receiving focus
as well by setting its tabindex to -1.
 * <a href="https://www.polymer-project.org" tabindex="-1">
 *   <paper-icon-button icon="polymer"></paper-icon-button>
 * </a>
 * 
 * 
 * 
Styling
 * Style the button with CSS as you would a normal DOM element. If you are using the icons
provided by iron-icons, they will inherit the foreground color of the button.
 * /* make a red "favorite" button * /
 * <paper-icon-button icon="favorite" style="color: red;"></paper-icon-button>
 * 
 * 
 * 
By default, the ripple is the same color as the foreground at 25% opacity. You may
customize the color using the --paper-icon-button-ink-color custom property.
 * The following custom properties and mixins are available for styling:
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * Custom property Description Default
--paper-icon-button-disabled-text The color of the disabled button --disabled-text-color
--paper-icon-button-ink-color Selected/focus ripple color --primary-text-color
--paper-icon-button Mixin for a button {}
--paper-icon-button-disabled Mixin for a disabled button {}
--paper-icon-button-hover Mixin for button on hover {}
 */
@JsType(isNative=true)
public interface PaperIconButtonElement extends HTMLElement {

    @JsOverlay public static final String TAG = "paper-icon-button";
    @JsOverlay public static final String SRC = "paper-icon-button/paper-icon-button.html";


    /**
     * If true, the button toggles the active state with each tap or press
of the spacebar.
     *
     * JavaScript Info:
     * @property toggles
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty boolean getToggles();
    /**
     * If true, the button toggles the active state with each tap or press
of the spacebar.
     *
     * JavaScript Info:
     * @property toggles
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty void setToggles(boolean value);

    /**
     * If true, the element will not produce a ripple effect when interacted
with via the pointer.
     *
     * JavaScript Info:
     * @property noink
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty boolean getNoink();
    /**
     * If true, the element will not produce a ripple effect when interacted
with via the pointer.
     *
     * JavaScript Info:
     * @property noink
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty void setNoink(boolean value);

    /**
     * True if the element is currently being pressed by a “pointer,” which
is loosely defined as mouse or touch input (but specifically excluding
keyboard input).
     *
     * JavaScript Info:
     * @property pointerDown
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty boolean getPointerDown();
    /**
     * True if the element is currently being pressed by a “pointer,” which
is loosely defined as mouse or touch input (but specifically excluding
keyboard input).
     *
     * JavaScript Info:
     * @property pointerDown
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty void setPointerDown(boolean value);

    /**
     * If true, the user is currently holding down the button.
     *
     * JavaScript Info:
     * @property pressed
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty boolean getPressed();
    /**
     * If true, the user is currently holding down the button.
     *
     * JavaScript Info:
     * @property pressed
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty void setPressed(boolean value);

    /**
     * If true, this property will cause the implementing element to
automatically stop propagation on any handled KeyboardEvents.
     *
     * JavaScript Info:
     * @property stopKeyboardEventPropagation
     * @type Boolean
     * @behavior VaadinDatePicker
     */
    @JsProperty boolean getStopKeyboardEventPropagation();
    /**
     * If true, this property will cause the implementing element to
automatically stop propagation on any handled KeyboardEvents.
     *
     * JavaScript Info:
     * @property stopKeyboardEventPropagation
     * @type Boolean
     * @behavior VaadinDatePicker
     */
    @JsProperty void setStopKeyboardEventPropagation(boolean value);

    /**
     * True if the input device that caused the element to receive focus
was a keyboard.
     *
     * JavaScript Info:
     * @property receivedFocusFromKeyboard
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty boolean getReceivedFocusFromKeyboard();
    /**
     * True if the input device that caused the element to receive focus
was a keyboard.
     *
     * JavaScript Info:
     * @property receivedFocusFromKeyboard
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty void setReceivedFocusFromKeyboard(boolean value);

    /**
     * If true, the button is a toggle and is currently in the active state.
     *
     * JavaScript Info:
     * @property active
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty boolean getActive();
    /**
     * If true, the button is a toggle and is currently in the active state.
     *
     * JavaScript Info:
     * @property active
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty void setActive(boolean value);

    /**
     * If true, the user cannot interact with this element.
     *
     * JavaScript Info:
     * @property disabled
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty boolean getDisabled();
    /**
     * If true, the user cannot interact with this element.
     *
     * JavaScript Info:
     * @property disabled
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty void setDisabled(boolean value);

    /**
     * If true, the element currently has focus.
     *
     * JavaScript Info:
     * @property focused
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty boolean getFocused();
    /**
     * If true, the element currently has focus.
     *
     * JavaScript Info:
     * @property focused
     * @type Boolean
     * @behavior PaperTab
     */
    @JsProperty void setFocused(boolean value);

    /**
     * To be used to express what combination of keys  will trigger the relative
callback. e.g. keyBindings: { 'esc': '_onEscPressed'}
     *
     * JavaScript Info:
     * @property keyBindings
     * @type !Object
     * @behavior VaadinDatePicker
     */
    @JsProperty JavaScriptObject getKeyBindings();
    /**
     * To be used to express what combination of keys  will trigger the relative
callback. e.g. keyBindings: { 'esc': '_onEscPressed'}
     *
     * JavaScript Info:
     * @property keyBindings
     * @type !Object
     * @behavior VaadinDatePicker
     */
    @JsProperty void setKeyBindings(JavaScriptObject value);

    /**
     * The EventTarget that will be firing relevant KeyboardEvents. Set it to
null to disable the listeners.
     *
     * JavaScript Info:
     * @property keyEventTarget
     * @type ?EventTarget
     * @behavior VaadinDatePicker
     */
    @JsProperty JavaScriptObject getKeyEventTarget();
    /**
     * The EventTarget that will be firing relevant KeyboardEvents. Set it to
null to disable the listeners.
     *
     * JavaScript Info:
     * @property keyEventTarget
     * @type ?EventTarget
     * @behavior VaadinDatePicker
     */
    @JsProperty void setKeyEventTarget(JavaScriptObject value);

    /**
     * Specifies the icon name or index in the set of icons available in
the icon’s icon set. If the icon property is specified,
the src property should not be.
     *
     * JavaScript Info:
     * @property icon
     * @type String
     * 
     */
    @JsProperty String getIcon();
    /**
     * Specifies the icon name or index in the set of icons available in
the icon’s icon set. If the icon property is specified,
the src property should not be.
     *
     * JavaScript Info:
     * @property icon
     * @type String
     * 
     */
    @JsProperty void setIcon(String value);

    /**
     * The aria attribute to be set if the button is a toggle and in the
active state.
     *
     * JavaScript Info:
     * @property ariaActiveAttribute
     * @type String
     * @behavior PaperTab
     */
    @JsProperty String getAriaActiveAttribute();
    /**
     * The aria attribute to be set if the button is a toggle and in the
active state.
     *
     * JavaScript Info:
     * @property ariaActiveAttribute
     * @type String
     * @behavior PaperTab
     */
    @JsProperty void setAriaActiveAttribute(String value);

    /**
     * The URL of an image for the icon. If the src property is specified,
the icon property should not be.
     *
     * JavaScript Info:
     * @property src
     * @type String
     * 
     */
    @JsProperty String getSrc();
    /**
     * The URL of an image for the icon. If the src property is specified,
the icon property should not be.
     *
     * JavaScript Info:
     * @property src
     * @type String
     * 
     */
    @JsProperty void setSrc(String value);

    /**
     * Specifies the alternate text for the button, for accessibility.
     *
     * JavaScript Info:
     * @property alt
     * @type String
     * 
     */
    @JsProperty String getAlt();
    /**
     * Specifies the alternate text for the button, for accessibility.
     *
     * JavaScript Info:
     * @property alt
     * @type String
     * 
     */
    @JsProperty void setAlt(String value);


    /**
     * Can be used to imperatively add a key binding to the implementing
element. This is the imperative equivalent of declaring a keybinding
in the keyBindings prototype property.
     *
     * JavaScript Info:
     * @method addOwnKeyBinding
     * @param {} eventString  
     * @param {} handlerName  
     * @behavior VaadinDatePicker
     * 
     */
    void addOwnKeyBinding(Object eventString, Object handlerName);

    /**
     * Returns the <paper-ripple> element used by this element to create
ripple effects. The element’s ripple is created on demand, when
necessary, and calling this method will force the
ripple to be created.
     *
     * JavaScript Info:
     * @method getRipple
     * @behavior PaperToggleButton
     * 
     */
    void getRipple();

    /**
     * Returns true if this element currently contains a ripple effect.
     *
     * JavaScript Info:
     * @method hasRipple
     * @behavior PaperToggleButton
     * @return {boolean}
     */
    boolean hasRipple();

    /**
     * When called, will remove all imperatively-added key bindings.
     *
     * JavaScript Info:
     * @method removeOwnKeyBindings
     * @behavior VaadinDatePicker
     * 
     */
    void removeOwnKeyBindings();

    /**
     * Returns true if a keyboard event matches eventString.
     *
     * JavaScript Info:
     * @method keyboardEventMatchesKeys
     * @param {KeyboardEvent} event  
     * @param {string} eventString  
     * @behavior VaadinDatePicker
     * @return {boolean}
     */
    boolean keyboardEventMatchesKeys(JavaScriptObject event, String eventString);

    /**
     * Ensures this element contains a ripple effect. For startup efficiency
the ripple effect is dynamically on demand when needed.
     *
     * JavaScript Info:
     * @method ensureRipple
     * @param {!Event=} optTriggeringEvent  
     * @behavior PaperTab
     * 
     */
    void ensureRipple(JavaScriptObject optTriggeringEvent);

}
Custom property	Description	Default
`--paper-icon-button-disabled-text`	The color of the disabled button	`--disabled-text-color`
`--paper-icon-button-ink-color`	Selected/focus ripple color	`--primary-text-color`
`--paper-icon-button`	Mixin for a button	`{}`
`--paper-icon-button-disabled`	Mixin for a disabled button	`{}`
`--paper-icon-button-hover`	Mixin for button on hover	`{}`