paper_elements 0.6.0+1

Paper elements

This package wraps the Polymer project's paper elements, enabling Dart developers to easily use the Polymer implementation of Google's material design UI widgets.

You can find out more about paper elements here: http://www.polymer-project.org/docs/elements/material.html

The paper_elements package bundles all the paper elements into a single pub package, so that you can add paper_elements as a dependency in your pubspec. Installing npm and bower is not required.

Status

This is an early access version of the paper elements. The elements are still changing on both the JavaScript and Dart sides.

Using elements

All elements live at the top level of the lib/ folder.

Import into HTML:

<link rel="import" href="packages/paper_elements/paper_input.html">

Import into Dart:

import 'package:paper_elements/paper_input.dart';

Running demos

If you download or fork the repo from https://github.com/dart-lang/paper-elements, then you can use the pub command to run any single demo or the sampler, which contains all the demos.

If you only want to run a single demo, then you can edit pubspec.yaml to comment out all the entrypoints except the one you need.

To run the paper element sampler:

  1. From the top directory, use the pub serve command, specifying the example directory:

    pub serve example
    
  2. In a browser, visit http://localhost:8080/demo.html.

To create a deployable build of a demo or the paper element sampler, use pub build from the top directory:

pub build example

Copy the files from the resulting build directory to where you want to serve the files.

Note: Building the sampler takes a few minutes.

0.6.0+1

  • Add back value and committedValue to paper-input, fixes 66.

0.6.0

  • Updated to match JS version 0.5.1. New Element paper-spinner is a new element that provides a material design loading spinner. New Element paper-dropdown is a new material design styled dropdown. Breaking Change paper-input has had a lot of changes. Namely, it no longer supports the multiline property. There are two new elements which can be used to duplicate the old functionality, paper-input-decorator and paper-autogrow-textarea. Breaking Change paper-item removed icon, iconSrc, and label attributes. Use nested DOM for label content. Breaking Change* paper-shadow is a container instead of targeting another element. * Use setZ() to set the depth of the shadow instead of assigning the z

    property.
    
    • The z attribute now uses a one time binding.
    • Breaking Change paper-dialog was broken into two elements.
    • paper-dialog for a plain dialog.
    • paper-action-dialog for a dialog with scrollable body and buttons.

0.5.0

  • Updated to match JavaScript version 0.4.2. This includes some breaking changes in elements APIs. For example, PaperButton.raisedButton was renamed to PaperButton.raised.

  • removed unnecessary files (README from the paper element repos)

0.4.2

  • Updated to use polymer 0.15.1 (Dart interop support is loaded automatically now.)

0.4.1

  • Update paper_elements_config.yaml with the new deletion_patterns option. This deletes a lot of cruft code from bower update.

0.4.0

  • Update elements to the 0.4.1 JavaScript versions.
  • Breaking Change paper-dropdown was renamed paper-dropdown-menu.

0.3.0+1

  • Upgrade custom_element_apigen to a real dependency as its required in the wrappers.

0.3.0

  • Update all elements so they can be built from code using a normal factory constructor, such as new PaperInput(). It is still necessary however to include the html import for each element you wish to create this way.

  • Updated library name on each element to say paper_elements instead of core_elements.

0.2.0

  • Update all elements to the 0.4.0 js version.
  • NEW Added paper_dropdown element.
  • Removed papermenubutton_overlay.
  • Upgraded polymer version constraint to >=0.14.0.

0.1.1+2

  • Upgraded polymer version constraint to >=0.13.0.
  • Upgraded core elements constraint to >=0.2.0+1.

0.1.1+1

  • Expanded polymer version constraint to <0.14.0.

0.1.1

  • Updated all elements to the 0.3.5 js version.

0.1.0+3

  • Removed unused html5lib dev dependency.

0.1.0+2

  • Updated all elements to the 0.3.4 js version.

1. Depend on it

Add this to your package's pubspec.yaml file:

dependencies:
  paper_elements: ">=0.6.0+1 <0.7.0"

If your package is an application package you should use any as the version constraint.

2. Install it

You can install packages from the command line:

$ pub get

Alternatively, your editor might support pub. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:

import 'package:paper_elements/paper_action_dialog.dart';
import 'package:paper_elements/paper_autogrow_textarea.dart';
import 'package:paper_elements/paper_button.dart';
import 'package:paper_elements/paper_button_base.dart';
import 'package:paper_elements/paper_checkbox.dart';
import 'package:paper_elements/paper_dialog.dart';
import 'package:paper_elements/paper_dialog_base.dart';
import 'package:paper_elements/paper_dialog_transition.dart';
import 'package:paper_elements/paper_dropdown.dart';
import 'package:paper_elements/paper_dropdown_menu.dart';
import 'package:paper_elements/paper_dropdown_transition.dart';
import 'package:paper_elements/paper_fab.dart';
import 'package:paper_elements/paper_icon_button.dart';
import 'package:paper_elements/paper_input.dart';
import 'package:paper_elements/paper_input_decorator.dart';
import 'package:paper_elements/paper_item.dart';
import 'package:paper_elements/paper_menu_button.dart';
import 'package:paper_elements/paper_progress.dart';
import 'package:paper_elements/paper_radio_button.dart';
import 'package:paper_elements/paper_radio_group.dart';
import 'package:paper_elements/paper_ripple.dart';
import 'package:paper_elements/paper_shadow.dart';
import 'package:paper_elements/paper_slider.dart';
import 'package:paper_elements/paper_spinner.dart';
import 'package:paper_elements/paper_tab.dart';
import 'package:paper_elements/paper_tabs.dart';
import 'package:paper_elements/paper_toast.dart';
import 'package:paper_elements/paper_toggle_button.dart';
import 'package:paper_elements/sampler_scaffold.dart';

About

Paper elements for Dart

Author

Email web-ui-dev@dartlang.org Polymer.dart Authors

Homepage

www.dartlang.org/polymer-dart/

Documentation

www.dartdocs.org/documentation/paper_elements/0.6.0%2B1/index.html#paper_elements

Uploader

justinfagnani@google.com
jakemac@google.com
sigmund@google.com
kevmoo@google.com

Share