Polymer-based web component for D2L alerts.
For further information on this and other Brightspace UI components, see the docs at ui.developers.brightspace.com.
d2l-alert can be installed from Bower:
bower install d2l-alertInclude the webcomponents.js "lite" polyfill (for browsers who don't natively support web components), then import d2l-alert.html:
<head>
<script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../d2l-alert/d2l-alert.html">
</head><d2l-alert type="warning">
A warning message.
</d2l-alert>A <d2l-alert> custom element can now be used in your application by specifying one of the following types: call-to-action, success, error, or warning.
<d2l-alert type="call-to-action">A call-to-action message.</d2l-alert>A close button can optionally be rendered by specifying the has-close-button attribute.
<d2l-alert type="call-to-action" has-close-button>
A call-to-action message.
</d2l-alert>alert.addEventListener('d2l-alert-closed', function() {
console.log('alert dismissed/closed');
});A custom action button can also be rendered if text is provided for the button.
<d2l-alert type="call-to-action" button-text="Do it!">
A call-to-action message.
</d2l-alert>alert.addEventListener('d2l-alert-button-pressed', function() {
console.log('alert custom action!');
});After cloning the repo, run npm install to install dependencies.
If you don't have it already, install the Polymer CLI globally:
npm install -g polymer-cliTo start a local web server that hosts the demo page and tests:
polymer serveTo lint (eslint and Polymer lint):
npm run lintTo run unit tests locally using Polymer test:
polymer test --skip-plugin sauceTo lint AND run local unit tests:
npm test