Skip to content

Commit

Permalink
[increment patch] Merge pull request #40 from BrightspaceUI/akerr/ale…
Browse files Browse the repository at this point in the history
…rt/lit-conversion

Update alert to point to the core version of alert
  • Loading branch information
AllanKerr authored May 11, 2020
2 parents 1166c04 + f56cebf commit 4ee6518
Show file tree
Hide file tree
Showing 15 changed files with 94 additions and 1,053 deletions.
10 changes: 0 additions & 10 deletions .travis.yml
Original file line number Diff line number Diff line change
Expand Up @@ -4,14 +4,6 @@ addons:
chrome: stable
script:
- npm run lint
- |
if [ $TRAVIS_PULL_REQUEST != false ] && [ $TRAVIS_SECURE_ENV_VARS == true ]; then
echo "Pull request with secure environment variables, running Sauce tests...";
npm run test:polymer:sauce || travis_terminate 1;
else
echo "Not a pull request and/or no secure environment variables, running headless tests...";
npm run test:polymer:local || travis_terminate 1;
fi
after_success:
- frauci-update-version -d=skip && export TRAVIS_TAG=$(frauci-get-version)
deploy:
Expand All @@ -23,6 +15,4 @@ env:
global:
- OWNER_NAME=BrightspaceUI
- REPO_NAME=alert
- SAUCE_USERNAME: Desire2Learn
- secure: WJ88oxdQ45dAwFWgjgrIuOE2EydQ5jJVs9T0P8rerORGtpPp80R0OrgAAgGfvmEXzSR3kRggUAhIXU3oxlgh9TsnhiRnkzQPDPiitVBirYNSK1wL+w0hXRtOe7GcVYIvdEOEiOmoZFygk4HXTzWSNUIrfy4vEa0Oemb2C+PgL8Rw3s+Grc9Co36bbzE+iKQX+WmkX0KO3BOf0sbkQJkBy7DAUVQNGekMYWEKNvZo1NHPxZ23KM7bit+kwttVaKUH1ImL6/xz//yYVtskV5PpzP2mCxTAat/oJ93pZzbhd8l/0YvjnU7g7Ezhy+jR1sPYnkbsv15MCuF4RqiIKhUSmSVPOVFxpv2w4LKVf8tso5p59NS9/D+aDdc0iGJUbmPHjPro1nlDK8mHUJ8fvY0xs1y2I8lmIETlVRXHhu+DuJ37JG6aadTfsgIfXSjnVOyIewWoCRmLoA25rsny5qHXgTsCGuL3kTTDcC9raY8KCA5IVYlpI4A1AFPPE9f4plHxS7FbP7hA120Yb0eDl+RTFiV5c8w4OiWgjheE3sresk6gr4U37cQjelNfNXMrfu4xmDJgkhsJ85o6nLlQMJi5jjh4BpixKz6P1sP1WEtvFheoHv10M5vbhQkAUJyXkm+VpMfwNOVtAeKyC5/WOpCk51iodvtjv7FX91MXnwl625U=
- secure: r0BIKxY4X96o9noVotjxWKuRMbNkcUDrVFJ354xIXF/x8oDCYWe49uqGljPBDHQ7y6Ihsi2H7zIrVaaDvQSaLbn8pI2XuVcb2WSdhhhPjCKUS8OwmdwJjFASdu4/pFpS3ZmrVhDmGFLRSULhPHOYHO5pbNyu30/XbeDyc1352PUITdjfxkd7PsOjG84V3t/Jcev3x+ZUKT9w6HM+YQ2592T++LuCB1EPxkb2HvxA0AYVNl15KwgBEHv2iGTExC+ULHX/LvhTXjin4PQKInNoMIE+PAVHH1sI1V/0lXFdF1i5Li0ht6q837wVMlSfGP1WKtGe/925j36fzjeZtLtaqwg627qMJFlrkc7Q25cCxT3COZL5sHKXZ1RRxr8+H4gGp3syIPy0RqZ7H28XbCCWziEOgsWnLebDUNOY4ZHefsk5OYShdasZOyu0LtdrEpERGYAhygYJRDiGs08AiiTbc8HXH5xGEihXFMW8WXLbBsZGOKkn0fHbd+gq4ZAEXTXWyPqLDl2ux9t8fCf+oU29n+g3s7t9/CoxHjC5dVIfHvzqPopaDrPqGHzg42Prrg9m5Q0Z5Fx2G8ZXnticOLzm4u3TX0JcfKuwzNYWbQakgTLEZwHHUZbJTiVG2qPFhKWkssvSEAzpsrMefezvYCw0bzqjrcDqSwqcT83LgvS+NYQ=
196 changes: 1 addition & 195 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,195 +1 @@
# d2l-alert
[![Build status][ci-image]][ci-url]

[Polymer](https://www.polymer-project.org)-based web component for D2L alerts.

For further information on this and other components, refer to [The Brightspace UI Guide](https://github.com/BrightspaceUI/guide/wiki).

## Installation

`d2l-alert` can be installed from through npm by referencing it in your package.json from Github:

```shell
"d2l-alert": "BrightspaceUI/alert#semver:^4"
```

## Usage

Include the [webcomponents.js](http://webcomponents.org/polyfills/) "lite" polyfill (for browsers who don't natively support web components):

```html
<head>
<script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
</head>
```

Then import the components below that you want to use.

### Alert
```html
<head>
<script type="module">
import 'd2l-alert/d2l-alert.js';
</script>
</head>
```

<!---
```
<custom-element-demo>
<template>
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../d2l-typography/d2l-typography.html">
<link rel="import" href="d2l-alert.html">
<custom-style include="d2l-typography">
<style is="custom-style" include="d2l-typography"></style>
</custom-style>
<style>
html {
font-size: 20px;
}
d2l-alert {
color: var(--d2l-color-ferrite);
font-family: 'Lato', 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
letter-spacing: 0.01rem;
font-size: 0.95rem;
font-weight: 400;
line-height: 1.4rem;
}
</style>
<next-code-block></next-code-block>
</template>
</custom-element-demo>
```
-->
```html
<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: `default`, `success`, `critical`, or `warning`.

```html
<d2l-alert type="default">A default message.</d2l-alert>
```

A close button can optionally be rendered by specifying the `has-close-button` attribute.

```html
<d2l-alert type="default" has-close-button>
A default message.
</d2l-alert>
```

```javascript
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.

```html
<d2l-alert type="default" button-text="Do it!">
A default message.
</d2l-alert>
```

```javascript
alert.addEventListener('d2l-alert-button-pressed', function() {
console.log('alert custom action!');
});
```

Subtext can be added underneath the main message heading, if more detail is required.

```html
<d2l-alert type="default" subtext="I'm here to provide additional information about the default message.">
A default message.
</d2l-alert>
```

### Toast Alert
```html
<head>
<script type="module">
import 'd2l-alert/d2l-alert-toast.js';
</script>
</head>
```

The toast alert is an alert that pops up at the bottom of the screen, and stays open for 2.5 seconds before closing. It has the same functionality as the regular alert, using most of the same attributes (e.g. type, subtext, etc.). In addition it has an `open` attribute, that you need to set whenever you want it to open:

```html
<d2l-alert-toast type="default" open>
A default message.
</d2l-alert-toast>
```

It also has an `autoclose` attribute that defaults to on, which will trigger the toast to disappear after 2.5 seconds. To keep the toast on the screen indefinitely, turn off the `autoclose` attribute by setting it to 0:

```html
<d2l-alert-toast type="default" open autoclose="0">
A default message.
</d2l-alert-toast>
```

Toast alerts default to having close buttons. As a result, if you don't want a close button, you'll need to set the `hide-close-button` attribute:

```html
<d2l-alert-toast type="default" open hide-close-button>
A default message.
</d2l-alert-toast>
```

To support the ability for screen readers to read out toast messages, toast alerts have the `announce-text` attribute:

```html
<d2l-alert-toast type="default" open announce-text="Here is a toast">
Here is a toast
</d2l-alert-toast>
```

## Developing, Testing and Contributing

After cloning the repo, run `npm install` to install dependencies.

If you don't have it already, install the [Polymer CLI](https://www.polymer-project.org/2.0/docs/tools/polymer-cli) globally:

```shell
npm install -g polymer-cli
```

To start a [local web server](https://www.polymer-project.org/3.0/docs/tools/polymer-cli-commands#serve) that hosts the demo page and tests:

```shell
polymer serve
```

To lint ([eslint](http://eslint.org/) and [Polymer lint](https://www.polymer-project.org/3.0/docs/tools/polymer-cli-commands#lint)):

```shell
npm run lint
```

To run unit tests locally using [Polymer test](https://www.polymer-project.org/3.0/docs/tools/polymer-cli-commands#tests):

```shell
npm run test:polymer:local
```

To lint AND run local unit tests:

```shell
npm test
```

[ci-url]: https://travis-ci.com/BrightspaceUI/alert
[ci-image]: https://travis-ci.com/BrightspaceUI/alert.svg?branch=master

## Versioning & Releasing

All version changes should obey [semantic versioning](https://semver.org/) rules.

Include either `[increment major]`, `[increment minor]` or `[increment patch]` in your merge commit message to automatically increment the `package.json` version and create a tag during the next build.
> Deprecated: use [BrightspaceUI/core](https://github.com/BrightspaceUI/core) instead.
Binary file removed alert.gif
Binary file not shown.
16 changes: 0 additions & 16 deletions d2l-alert-shared-styles.js

This file was deleted.

Loading

0 comments on commit 4ee6518

Please sign in to comment.