JarCasting
JarCasting JarCasting

px-steps

WebJar for px-steps

License

License

BSD 3-Clause
GroupId

GroupId

org.webjars.bowergithub.predixdesignsystem
ArtifactId

ArtifactId

px-steps
Last Version

Last Version

1.1.0
Release Date

Release Date
Type

Type

jar
Description

Description

px-steps
WebJar for px-steps
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/predixdesignsystem/px-steps

Download px-steps

Filename Size
px-steps-1.1.0.pom
px-steps-1.1.0.jar 101 KB
px-steps-1.1.0-sources.jar 22 bytes
px-steps-1.1.0-javadoc.jar 22 bytes
Browse

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.bowergithub.predixdesignsystem/px-steps/ -->
<dependency>
    <groupId>org.webjars.bowergithub.predixdesignsystem</groupId>
    <artifactId>px-steps</artifactId>
    <version>1.1.0</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.bowergithub.predixdesignsystem/px-steps/
implementation 'org.webjars.bowergithub.predixdesignsystem:px-steps:1.1.0'
// https://jarcasting.com/artifacts/org.webjars.bowergithub.predixdesignsystem/px-steps/
implementation ("org.webjars.bowergithub.predixdesignsystem:px-steps:1.1.0")
'org.webjars.bowergithub.predixdesignsystem:px-steps:jar:1.1.0'
<dependency org="org.webjars.bowergithub.predixdesignsystem" name="px-steps" rev="1.1.0">
  <artifact name="px-steps" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.bowergithub.predixdesignsystem', module='px-steps', version='1.1.0')
)
libraryDependencies += "org.webjars.bowergithub.predixdesignsystem" % "px-steps" % "1.1.0"
[org.webjars.bowergithub.predixdesignsystem/px-steps "1.1.0"]

Dependencies

compile (2)

Group / Artifact Type Version
org.webjars.bowergithub.polymer : polymer jar [1.9.0,3)
org.webjars.bowergithub.predixdesignsystem » px-icon-set jar [2.0.9,3)

Project Modules

There are no modules declared in this project.

px-steps

Build Status

px-steps is a Polymer web component that is a visual representation of any sequence of steps and progress made on those steps. It can show which steps have been completed, the current step, and remaining steps, for example.

Overview

Use the px-steps to represent any sequence of steps in a process. An example of a process is user account creation, which can consist of this sequence of steps: 1. Sign Up, 2. Email Confirmation, 3. Account Activation and 4. Account Configuration. px-steps can represent this process with a sequence of nodes corresponding to the steps. Each step is labeled accordingly. px-steps can place connector lines between adjacent steps.

Usage

Prerequisites

  1. node.js
  2. npm
  3. bower
  4. Install the webcomponents-lite.js polyfill to add support for web components and custom elements to your application.

Getting Started

First, install the component via bower on the command line.

bower install px-steps --save

Second, import the component to your application with the following tag in your head.

<link rel="import" href="/bower_components/px-steps/px-steps.html"/>

Finally, use the component in your application:

<px-steps items='[{ id: "1", label: "Select Services"},{ id: "2", label: "Billing"}]'></px-steps>

Documentation

Read the full API and view the demo here.

Using Events

Events follow the Polymer data-binding standards.

You can can attach the following listener(s) to these parts of the component:

  1. Mouseclick event on a step.

Local Development

From the component's directory, to setup the component and its dependencies:

$ npm install
$ bower install
$ gulp sass

From the component's directory, to start a local server and automatically bring up web page of the component demo:

$ gulp serve

(A web page with URL http://localhost:8080/ will be opened in your default browser.)

LiveReload

By default gulp serve is configured to enable LiveReload and will be watching for modifications in your root directory as well as /css.

GE Coding Style Guide

GE JS Developer's Guide


Known Issues

Please use Github Issues to submit any bugs you might find.

org.webjars.bowergithub.predixdesignsystem

Predix Design System

Versions

Version
1.1.0