paper-chip

├── .gitignore ├── AUTHORS ├── .editorconfig ├── test ├── .eslintrc.json ├── index.html ├── letters-only.html ├── paper-chip.html ├── paper-chip-input.html └── paper-input.html ├── index.html ├── .eslintrc.json ├── LICENSE ├── bower.json ├── .travis.yml ├── package.json ├── wct.conf.json ├── paper-chip-icons.html ├── CONTRIBUTING.md ├── README.md ├── paper-chip.html ├── paper-chip-input.html ├── CHANGELOG.md └── demo └── index.html /.gitignore: -------------------------------------------------------------------------------- 1 | .bash_history 2 | .local/ 3 | .config/ 4 | .cache/ 5 | .idea/ 6 | bower_components/ 7 | node_modules/ 8 | .vscode/ 9 | 10 | bundle/ 11 | build/ 12 | dist/ 13 | 14 | *.log 15 | -------------------------------------------------------------------------------- /AUTHORS: -------------------------------------------------------------------------------- 1 | Alessandro La Bella 2 | Leonardo Di Donato 3 | Lorenzo Cesana 4 | Leonardo Grasso 5 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | indent_style = space 5 | indent_size = 2 6 | end_of_line = lf 7 | charset = utf-8 8 | trim_trailing_whitespace = true 9 | insert_final_newline = true 10 | 11 | [*.html] 12 | indent_size = 4 13 | -------------------------------------------------------------------------------- /test/.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "mocha": true 4 | }, 5 | "rules": { 6 | "no-var": "off", 7 | "strict": "off" 8 | }, 9 | "globals": { 10 | "assert": true, 11 | "WCT": true, 12 | "sinon": true, 13 | "expect": true, 14 | "fixture": true, 15 | "PaperChip": true, 16 | "PaperChipInput": true, 17 | "PaperChipInputAutocomplete": true, 18 | "MockInteractions": true 19 | } 20 | } -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | paper-chip 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /test/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | paper-input tests 8 | 9 | 10 | 11 | 12 | 22 | 23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "eslint:recommended", 3 | "ecmaVersion": 6, 4 | "rules": { 5 | "no-console": "off", 6 | "no-var": "error", 7 | "strict": "error", 8 | "valid-jsdoc": ["error", { 9 | "requireReturn": false, 10 | "prefer": { 11 | "arg": "param", 12 | "argument": "param", 13 | "returns": "return" 14 | }, 15 | "preferType": { 16 | "Boolean": "boolean", 17 | "Number": "number", 18 | "String": "string", 19 | "object": "Object" 20 | } 21 | }] 22 | }, 23 | "env": { 24 | "browser": true, 25 | "es6": true 26 | }, 27 | "plugins": [ 28 | "html" 29 | ], 30 | "globals": { 31 | "customElements": true, 32 | "HTMLImports": true, 33 | "Polymer": true, 34 | "ShadyDOM": true, 35 | "ShadyCSS": true 36 | } 37 | } -------------------------------------------------------------------------------- /test/letters-only.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 13 | 14 | 31 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2017 fabbricadigitale srl 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "paper-chip", 3 | "description": "A chip web component made with Polymer 2 following Material Design guidelines", 4 | "main": "paper-chip.html", 5 | "license": "MIT", 6 | "keywords": [ 7 | "polymer", 8 | "web component", 9 | "material design", 10 | "chip", 11 | "tag", 12 | "es2015" 13 | ], 14 | "dependencies": { 15 | "polymer": "polymer/polymer#^v2.0.0", 16 | "iron-behaviors": "polymerelements/iron-behaviors#^v2.0.0", 17 | "paper-material": "polymerelements/paper-material#^v2.0.0", 18 | "iron-flex-layout": "polymerelements/iron-flex-layout#^v2.0.0", 19 | "paper-input": "polymerelements/paper-input#^v2.0.0", 20 | "iron-input": "polymerelements/iron-input#^v2.0.0", 21 | "paper-item": "polymerelements/paper-item#^v2.0.0", 22 | "paper-listbox": "polymerelements/paper-listbox#^v2.0.0", 23 | "paper-ripple": "polymerelements/paper-ripple#^v2.0.0" 24 | }, 25 | "devDependencies": { 26 | "web-component-tester": "v6.0.0", 27 | "webcomponentsjs": "webcomponents/webcomponentsjs#^1.0.0", 28 | "iron-component-page": "polymerelements/iron-component-page#^v2.0.0", 29 | "iron-validator-behavior": "polymerelements/iron-validator-behavior#^v2.0.0", 30 | "iron-demo-helpers": "polymerelements/iron-demo-helpers#^v2.0.0", 31 | "paper-icon-button": "polymerelements/paper-icon-button#^v2.0.0", 32 | "iron-test-helpers": "polymerelements/iron-test-helpers#^v2.0.0" 33 | }, 34 | "homepage": "https://github.com/fabbricadigitale/paper-chip" 35 | } 36 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | node_js: stable 3 | dist: trusty 4 | addons: 5 | firefox: latest 6 | sauce_connect: true 7 | apt: 8 | packages: 9 | - google-chrome-stable 10 | before_install: 11 | - export DISPLAY=:99.0 12 | - sh -e /etc/init.d/xvfb start 13 | - sleep 3 14 | script: 15 | - npm test 16 | - if [ "${TRAVIS_PULL_REQUEST}" != "false" ] && [ "${SAUCE_USERNAME}" != "" ]; then npm run test -- --plugin sauce --quiet; fi 17 | env: 18 | global: 19 | - secure: auaV8LlQ2k7cYctbS2hI0YpuKafNzI6Fk/aaIW3dACtZIr5ZNhloFycABTokskIIuQRwwmjHc3hMS86xr0CSzMHy9Acud1VkfXwtb3NUfaLp7sCREtSx4JAU5J9vJN3nOvSHRE94oKqKcTKDq/k3plkufC/xTnjhQtqDNVBDW/bqXHqbh0JCUKZjspITuNDzc0Sk8ME1cEYrGfS+fsdvug5OAtXDleuLOxbmkFF2HzhZMEjeGSpZ8yXR6Os3SsczfyNx5ihMYU3YrFwXRhJOwcunF3vIH+vRjODb1mWp5qk1MntOlP+OPddkyR3rF6A6/IReNsgC6x3KE2yL1MEHKrfUPJl6PHviUcwjyf0zEdY5CpR209xZVRvkndAdRIe1Tqtxu+piyJesS11xmkgwQg7z+MF9ckhk+IPaLeP0qkZ55qH4bngCaXiPszBol6TWKNljWpof/jJLLLXFSvxecY/QBpWEstBOq/DYPfTKNQLnrdx+B8rX0qafXogetUcNw7r6ZgkM8Iq5Jr3tptjAt7+sA+yLGjsRWZk8nIolRxaPPl6tXFJRCeALNJvpeyOfDRib1reoTEZpiD30J7K6/yDFoHL1s1pdkS5pAED0XlSYbLCikOx0p7O9z0ktXKfo5IUggweiqzgBdwjsA26o9hSzWGFvAFa7b+Nd+hJMJFs= 20 | - secure: pKCLqwePpWlOOf9s0BhXJ1guYowRgDiFnXcT/WAdbHVDutHohni4C2qwlE+hPpqEzljYYtAnVdnhU4YnqmdKB+PQv3nytAtTr8IqmpnBglEcwNnM16TLETMG862OKLzZlV3oCCpzq/BEEKv335pPGJ7Xpyh1kuzHajZch3PtXld+5Ts7HVwx6qBlLq17ZMKw3EPkcAd/E6nQv40yf2lJX+GPXLcmyEc1rko0VCh2ziz0kt6ZCTpXnX2idlV6gOYCWoT5sgj9pDpIATBHG0Mm0FWcummr/Hf28fp/qybLK8mkugYWnQwn+PqClQic1eH1LSywkNrNCir7FHYEzfJ2Iy7tpEz4EK2Qo1D6pebs8XW8gtuk+jzwSiqfH2jvhLxP0VdKN4+Lg6NhUfbi6hCAgqOh5u0N5W1D5ND0wUh+tl27q1PUo0c4GrzsNW6nWJyGIJacUVXuvKB2SB8qCtsT8zkVIHyjjZNIPqt45MD1uRkGkQeROgWmlqc/jZsFXF0lrIIAth49us+o1r4sTJjqO9HOrx6XN83QOOAwhK04GLQwauI5weC/DYC/dg3CFx2XukoMnc3aUSBMjy/e0cTFrnujITQ1ly02H1cumMj8xsjyzgUmi95WPGJni1s0W7ytkrgKTOw7W0NlR9N7fBf9B4m13RVDOEzTMIAjnxFguwY= 21 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "paper-chip", 3 | "version": "1.1.0", 4 | "description": "A chip web component made with Polymer 2 following Material Design guidelines", 5 | "main": "paper-chip.html", 6 | "repository": { 7 | "type": "git", 8 | "url": "https://github.com/fabbricadigitale/paper-chip.git" 9 | }, 10 | "bug": { 11 | "url": "https://github.com/fabbricadigitale/paper-chip/issues" 12 | }, 13 | "license": "MIT", 14 | "devDependencies": { 15 | "bower": "^1.8.0", 16 | "conventional-changelog-cli": "^1.2.0", 17 | "eslint": "^3.12.2", 18 | "eslint-plugin-html": "^2.0.3", 19 | "git-rev-sync": "^1.8.0", 20 | "polyserve": "^0.15.0", 21 | "shx": "^0.2.2", 22 | "validate-commit": "^3.2.1", 23 | "web-component-tester": "^6.0.0" 24 | }, 25 | "config": { 26 | "directories": { 27 | "src": "scripts", 28 | "demo": "demo", 29 | "component": "paper-chip", 30 | "deps": "bower_components" 31 | } 32 | }, 33 | "scripts": { 34 | "reset": "shx rm -rf node_modules/ $npm_package_config_directories_deps *.log", 35 | "clean": "shx rm -rf *.log $npm_package_config_directories_deps/$npm_package_config_directories_component", 36 | "get:deps": "bower install --config.directory=$npm_package_config_directories_deps", 37 | "lint": "eslint *.html **/*.html", 38 | "postinstall": "npm run get:deps", 39 | "changelog": "conventional-changelog -p eslint -i CHANGELOG.md -s", 40 | "from:master": "node -e 'process.exit(require(\"git-rev-sync\").branch(process.cwd()) !== \"master\")'", 41 | "changelog:edit": "$(git var GIT_EDITOR) CHANGELOG.md", 42 | "preversion": "npm run from:master", 43 | "version": "npm run changelog && npm run changelog:edit && git add CHANGELOG.md", 44 | "postversion": "git push && git push --tags && git checkout develop && git merge master && git push && git checkout master", 45 | "serve": "polyserve -c $npm_package_config_directories_deps", 46 | "test": "wct" 47 | }, 48 | "keywords": [ 49 | "polymer", 50 | "web component", 51 | "material design", 52 | "chip", 53 | "tag", 54 | "es2015" 55 | ], 56 | "git": { 57 | "scripts": { 58 | "commit-msg": "./node_modules/.bin/validate-commit-msg --preset eslint $1" 59 | } 60 | } 61 | } 62 | -------------------------------------------------------------------------------- /wct.conf.json: -------------------------------------------------------------------------------- 1 | { 2 | "verbose": true, 3 | "plugins": { 4 | "local": { 5 | "browsers": [ 6 | "firefox" 7 | ] 8 | }, 9 | "sauce": { 10 | "disabled": true, 11 | "browsers": [ 12 | { 13 | "browserName": "microsoftedge", 14 | "platform": "Windows 10", 15 | "version": "13" 16 | }, 17 | { 18 | "browserName": "microsoftedge", 19 | "platform": "Windows 10", 20 | "version": "14" 21 | }, 22 | { 23 | "browserName": "microsoftedge", 24 | "platform": "Windows 10", 25 | "version": "15" 26 | }, 27 | { 28 | "browserName": "firefox", 29 | "platform": "Windows 10", 30 | "version": "latest" 31 | }, 32 | { 33 | "browserName": "chrome", 34 | "platform": "Windows 10", 35 | "version": "latest" 36 | }, 37 | { 38 | "browserName": "chrome", 39 | "platform": "Windows 10", 40 | "version": "beta" 41 | }, 42 | { 43 | "browserName": "safari", 44 | "platform": "OS X 10.11", 45 | "version": "9" 46 | }, 47 | { 48 | "browserName": "safari", 49 | "platform": "OS X 10.11", 50 | "version": "10" 51 | }, 52 | { 53 | "browserName": "firefox", 54 | "platform": "OS X 10.11", 55 | "version": "latest" 56 | }, 57 | { 58 | "browserName": "chrome", 59 | "platform": "OS X 10.11", 60 | "version": "latest" 61 | }, 62 | { 63 | "browserName": "safari", 64 | "platform": "OS X 10.12", 65 | "version": "10" 66 | }, 67 | { 68 | "browserName": "firefox", 69 | "platform": "OS X 10.12", 70 | "version": "latest" 71 | }, 72 | { 73 | "browserName": "chrome", 74 | "platform": "OS X 10.12", 75 | "version": "latest" 76 | }, 77 | { 78 | "browserName": "firefox", 79 | "platform": "linux", 80 | "version": "latest" 81 | }, 82 | 83 | { 84 | "browserName": "Safari", 85 | "platformName": "ios", 86 | "platformVersion": "9.0", 87 | "deviceName": "iPhone 6 Simulator" 88 | }, 89 | { 90 | "browserName": "Safari", 91 | "platformName": "ios", 92 | "platformVersion": "10.0", 93 | "deviceName": "iPhone 6 Simulator" 94 | }, 95 | { 96 | "browserName": "Chrome", 97 | "platformName": "Android", 98 | "platformVersion": "6.0", 99 | "deviceName": "Android Emulator", 100 | "appiumVersion": "1.6.5" 101 | } 102 | ] 103 | } 104 | } 105 | } 106 | -------------------------------------------------------------------------------- /paper-chip-icons.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 15 | 16 | 17 | 18 | 23 | 24 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contributing 2 | 3 | When contributing to this repository, please first discuss the change you wish to make via [issue](https://github.com/fabbricadigitale/paper-chip/issues/new), 4 | [email](mailto:l.didonato@fabbricadigitale.it), or any other method with the owners and the maintainers of this repository before making a change. 5 | 6 | Please note we have a code of conduct, please follow it in all your interactions with the project. 7 | 8 | ## Commit convention 9 | 10 | We use the **eslint** commit convention. 11 | 12 | You should read more about is [here](https://github.com/conventional-changelog-archived-repos/conventional-changelog-eslint/blob/master/convention.md). 13 | 14 | Anyway here are some good commit message summary examples: 15 | 16 | ``` 17 | Build: Update Travis to only test Node 0.10 (refs #734) 18 | Fix: Semi rule incorrectly flagging extra semicolon (fixes #840) 19 | Upgrade: Esprima to 1.2, switch to using Esprima comment attachment (fixes #730) 20 | ``` 21 | 22 | ## How to contribute 23 | 24 | We want you to **work on something you love**. 25 | 26 | So, after discussing the changes, the new feature, or the improvements to this project, **fork** this repository, create a **feature branch** (eg., `feature/awesome-feature`), and start **coding** ! 27 | 28 | The contribution process is driven via **pull requests**. 29 | 30 | Do not forget to: 31 | 32 | 1. update the README.md (and generally any **documentation**) with details of eventual **changes to the interface**. 33 | 34 | 2. update **test suites** related to the feature you are contributing. 35 | 36 | 3. (please) follow our **commit conventions** (read more about them [above](#commit-convention)) and make sure all of your **commits** are **atomic** (ie., one feature per commit) 37 | 38 | 4. write a **clear**, **concise**, but **communicative one-line commit message** for small changes 39 | 40 | 5. write multi-line messages for bigger changes - eg., 41 | 42 | ``` 43 | $ git commit -m "Update: A brief summary of the commit 44 | > 45 | > A paragraph describing what changed and its impact." 46 | ``` 47 | 48 | 6. verify your code style matches the rules of this repository by the provided **lint** task 49 | 50 | 7. send a **pull request** containing a clear list of what you have done (read more about [pull requests](http://help.github.com/pull-requests)) 51 | 52 | 8. once you have the evaluation and the sign-off of two other developers your changes will be merged within the repository 53 | 54 | ## Code of Conduct 55 | 56 | ### Our Pledge 57 | 58 | In the interest of fostering an open and welcoming environment, we as 59 | contributors and maintainers pledge to making participation in our project and 60 | our community a harassment-free experience for everyone, regardless of age, body 61 | size, disability, ethnicity, gender identity and expression, level of experience, 62 | nationality, personal appearance, race, religion, or sexual identity and 63 | orientation. 64 | 65 | ### Our Standards 66 | 67 | Examples of behavior that contributes to creating a positive environment 68 | include: 69 | 70 | * Using welcoming and inclusive language 71 | * Being respectful of differing viewpoints and experiences 72 | * Gracefully accepting constructive criticism 73 | * Focusing on what is best for the community 74 | * Showing empathy towards other community members 75 | 76 | Examples of unacceptable behavior by participants include: 77 | 78 | * The use of sexualized language or imagery and unwelcome sexual attention or 79 | advances 80 | * Trolling, insulting/derogatory comments, and personal or political attacks 81 | * Public or private harassment 82 | * Publishing others' private information, such as a physical or electronic 83 | address, without explicit permission 84 | * Other conduct which could reasonably be considered inappropriate in a 85 | professional setting 86 | 87 | ### Our Responsibilities 88 | 89 | Project maintainers are responsible for clarifying the standards of acceptable 90 | behavior and are expected to take appropriate and fair corrective action in 91 | response to any instances of unacceptable behavior. 92 | 93 | Project maintainers have the right and responsibility to remove, edit, or 94 | reject comments, commits, code, wiki edits, issues, and other contributions 95 | that are not aligned to this Code of Conduct, or to ban temporarily or 96 | permanently any contributor for other behaviors that they deem inappropriate, 97 | threatening, offensive, or harmful. 98 | 99 | ### Scope 100 | 101 | This Code of Conduct applies both within project spaces and in public spaces 102 | when an individual is representing the project or its community. Examples of 103 | representing a project or community include using an official project e-mail 104 | address, posting via an official social media account, or acting as an appointed 105 | representative at an online or offline event. Representation of a project may be 106 | further defined and clarified by project maintainers. 107 | 108 | ### Enforcement 109 | 110 | Instances of abusive, harassing, or otherwise unacceptable behavior may be 111 | reported by contacting the project team at this [email](mailto:l.didonato@fabbricadigitale.it). All 112 | complaints will be reviewed and investigated and will result in a response that 113 | is deemed necessary and appropriate to the circumstances. The project team is 114 | obligated to maintain confidentiality with regard to the reporter of an incident. 115 | Further details of specific enforcement policies may be posted separately. 116 | 117 | Project maintainers who do not follow or enforce the Code of Conduct in good 118 | faith may face temporary or permanent repercussions as determined by other 119 | members of the project's leadership. 120 | 121 | ### Attribution 122 | 123 | This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, 124 | available at [http://contributor-covenant.org/version/1/4][version]. 125 | 126 | [homepage]: http://contributor-covenant.org 127 | [version]: http://contributor-covenant.org/version/1/4/ 128 | -------------------------------------------------------------------------------- /test/paper-chip.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | paper-chip test 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 21 | 22 | 23 | 24 | 27 | 28 | 29 | 30 | 33 | 34 | 35 | 36 | 39 | 40 | 41 | 42 | 45 | 46 | 47 | 48 | 55 | 56 | 57 | 58 | 75 | 76 | 77 | 78 | 81 | 82 | 83 | 84 | 87 | 88 | 89 | 90 | 93 | 94 | 95 | 96 | 99 | 100 | 101 | 102 | 226 | 227 | 228 | 229 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | [![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg?style=flat-square)](https://www.webcomponents.org/element/fabbricadigitale/paper-chip) [![License](https://img.shields.io/badge/license-MIT-yellowgreen.svg?style=flat-square)](http://opensource.org/licenses/MIT) [![Build Status](https://img.shields.io/travis/fabbricadigitale/paper-chip.svg?style=flat-square)]() 2 | 3 | # \ 4 | 5 | Material design: [Chips](https://material.io/guidelines/components/chips.html#). 6 | 7 | > A chip web component made with Polymer 2 following Material Design guidelines 8 | 9 | This elements family may provide a icon or a photo, some line of text or a contact information with Material Design styling. 10 | 11 | [![Browser Support Matrix](https://saucelabs.com/browser-matrix/paper-chip.svg)](https://saucelabs.com/u/paper-chip) 12 | 13 | ### Elements 14 | 15 | * `` 16 | * `` 17 | 18 | ### Table of contents 19 | 20 | * [\](#paper-chip-usage) 21 | * [Minimal](#minimal) 22 | * [Single or multi line chips](#single-or-multi-line) 23 | * [Removable chips](#removable) 24 | * [Animatable chips](#animated-transition) 25 | * [\](#paper-chip-input-usage) 26 | * [How to configure the presentation](#how-to-configure-its-presentation) 27 | * [Disable the input underline](#disable-the-input-underline) 28 | * [How to fix the input label at the top](#how-to-fix-the-input-label-at-the-top) 29 | * [Non floating label](#non-floating-label) 30 | * [How to customize the submit keys](#configure-your-favorite-submit-keys) 31 | * [Autocomplete](#autocomplete) 32 | * [Configure custom datasource properties](#configure-custom-datasource-properties) 33 | * [Customize the filtering logic of the autocomplete](#custom-filter-logic) 34 | * [Declarative insertion of chips](#how-to-insert-chips) 35 | 36 | ## \ usage 37 | 38 | ### Minimal 39 | 40 | A minimal chip. 41 | 42 | 53 | ```html 54 | Minimal chip 55 | ``` 56 | 57 | ### Single or multi-line 58 | 59 | It can show **single-line** or **multi-line** text. 60 | 61 | You can **open a multi-line chip** tapping on it, showing some additional info. 62 | 63 | 74 | ```html 75 | 76 | 77 |

John Foo

78 |

jfoo@doh.com

79 | 80 | ``` 81 | 82 | ### Removable 83 | 84 | Following snippet of code shows how to configure (via attributes) some basic behavior. 85 | 86 | It may be **removable** or not. 87 | 88 | 99 | ```html 100 | 101 |

Removable Chip

102 | 103 | ``` 104 | 105 | ### Animated transition 106 | 107 | Do you want to **animated** the chip when it is opening? 108 | 109 | You can do it via attribute. 110 | 111 | 122 | ```html 123 | 124 |

125 |

John Foo

126 |

jfoo@doh.com

127 | 128 | ``` 129 | 130 | ## \ usage 131 | 132 | Use `` when you desire an input field where the strings digited by the user are collected as `paper-chip`s. 133 | 134 | 145 | ```html 146 | 147 | ``` 148 | 149 | ### How to configure its presentation 150 | 151 | Configure `paper-chip-input` presentation using attribute. 152 | 153 | #### Disable the input underline 154 | 155 | If you do not want the input underline use `noline` attribute. 156 | 157 | 168 | ```html 169 | 170 | ``` 171 | #### How to fix the input label at the top 172 | 173 | Use `always-float-label` attribute to fix the the label at the top. 174 | 175 | 186 | ```html 187 | 188 | ``` 189 | 190 | #### Non floating label 191 | 192 | Use `no-label-float` attribute to disable floating label. So the input label will be inside the input. 193 | 194 | 205 | ```html 206 | 207 | ``` 208 | 209 | ### Input field feature 210 | 211 | Inputs can have different types, and be disabled. 212 | 213 | 224 | ```html 225 | 226 | ``` 227 | 228 | Inputs can have character counters. 229 | 230 | 241 | ```html 242 | 243 | ``` 244 | 245 | Or you can limit chip text's max length. 246 | 247 | 258 | ```html 259 | 260 | ``` 261 | 262 | Inputs can validate automatically or on demand, and can have custom error messages. 263 | 264 | 275 | ```html 276 | 277 | ``` 278 | 279 | You can configure your favorite allowed pattern. 280 | 281 | 292 | ```html 293 | 294 | ``` 295 | 296 | You can run validation manually 297 | 298 | 309 | ```html 310 | 311 | 312 | 313 | 318 | ``` 319 | 320 | `paper-chip-input` can have custom prefix and suffix. 321 | 322 | 333 | ```html 334 | 335 | 336 | 337 | 338 | ``` 339 | 340 | ### Chip-added and chip-removed event 341 | 342 | `paper-chip-input` fires custom events chip-added/chip-removed event when a chip is added or removed to `paper-chip-input`. 343 | 344 | 355 | ```html 356 | 357 | 358 | 366 | ``` 367 | 368 | ### Configure your favorite submit keys 369 | 370 | Do you want to change the **keys** that automatically submit chips? 371 | 372 | No worries, we support it! 373 | 374 | Configure them with the `enter-keys` property adding the keys. 375 | 376 | We support the [Polymer.IronA11yKeysBehavior](https://github.com/PolymerElements/iron-a11y-keys-behavior) format. 377 | 378 | Following example should clarify the usage of this feature. 379 | 380 | 391 | ```html 392 | 393 | ``` 394 | 395 | ### Autocomplete 396 | 397 | Do you need **autocomplete** ? 398 | 399 | When you have a predefined and finite set of input values you can set the predefined values with `datasource` property. Don't forget to add the `autocomplete` attribute. 400 | 401 | 412 | ```html 413 | 414 | ``` 415 | 416 | #### Configure custom datasource properties 417 | 418 | The default properties for datasource are `label` and `value`, but you can configure it from outside by the properties `display-property` and `value-property`. 419 | 420 | ```html 421 | 422 | 423 | ``` 424 | 425 | ```json 426 | [ 427 | { "val": "apple", "key": "0" }, 428 | { "val": "apricot", "key": "1" } 429 | ] 430 | ``` 431 | 432 | #### Custom filter logic 433 | 434 | Autocomplete uses a **startWith** filter as default logic. 435 | 436 | Do you need to implement a **custom filter logic**? You can do it! 437 | 438 | Set `filter` property with your custom *function*. The following lines of code will show you how to do it. 439 | 440 | 451 | ```html 452 | 453 | 459 | ``` 460 | 461 | ### How to insert chips 462 | 463 | You can insert `` elements inside the `` declaratively - ie., putting the within the Light DOM. 464 | 465 | 476 | ```html 477 | 478 | Light 479 | DOm 480 | 481 | ``` 482 | 483 | ## Styling 484 | 485 | The following custom properties and mixins are available for styling: 486 | 487 | Custom property | Description | Default 488 | ----------------|-------------|---------- 489 | `--paper-chip-secondary-text-color` | The paper-chip label-color | `--secondary-text-color` 490 | `--paper-chip-background-color` | The paper-chip background-color | `--paper-grey-200` 491 | `--paper-chip-icon-background-color` | The paper-chip avatar background-color | `--paper-grey-500` 492 | `--paper-chip-icon-text-color` | The paper-chip icon color | `--text-primary-color` 493 | `--paper-chip-closed-label-max-width` | The paper-chip label max-width when is closed | 80px 494 | 495 | ## Testing 496 | 497 | If you are using **polyserve** navigate to the `test/` directory of your element to run its tests. 498 | 499 | You can view results in the browser console. 500 | 501 | ### WCT 502 | 503 | The tests are run via [web-component-tester](https://github.com/polymer/web-component-tester). 504 | 505 | To run them locally execute: 506 | 507 | ```bash 508 | npm test 509 | ``` 510 | 511 | ## Contributing 512 | 513 | Thanks for your interest in this project! 514 | 515 | We are really glad you are reading this. External contributions are very welcome by our team. We know that we need volunteer developers to help this project come (and mantain) to fruition. 516 | 517 | There are many ways to contribute to this project. Get started reading the [contributing guide](CONTRIBUTING.md). 518 | 519 | ## License 520 | 521 | MIT © fabbricadigitale 522 | 523 | 524 | -------------------------------------------------------------------------------- /test/paper-chip-input.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | paper-chip-input test 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 22 | 23 | 24 | 25 | 28 | 29 | 30 | 31 | 34 | 35 | 36 | 37 | 40 | 41 | 42 | 43 | 46 | 47 | 48 | 49 | 52 | 53 | 54 | 468 | 469 | 470 | 471 | -------------------------------------------------------------------------------- /test/paper-input.html: -------------------------------------------------------------------------------- 1 | 2 | 11 | 12 | 13 | 14 | paper-input tests 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 35 | 36 | 37 | 38 | 41 | 42 | 43 | 44 | 47 | 48 | 49 | 50 | 53 | 54 | 55 | 56 | 59 | 60 | 61 | 62 | 65 | 66 | 67 | 68 | 71 | 72 | 73 | 74 | 77 | 78 | 79 | 80 | 83 | 84 | 85 | 86 | 89 | 90 | 91 | 92 | 95 | 96 | 97 | 98 | 101 | 102 | 103 | 104 | 107 | 108 | 109 | 110 | 111 | 112 | 115 | 116 | 117 | 118 | 124 | 125 | 126 | 543 | 544 | 545 | 546 | -------------------------------------------------------------------------------- /paper-chip.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 160 | 161 | 162 | 452 | 711 | 712 | -------------------------------------------------------------------------------- /paper-chip-input.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 232 | 681 | 682 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | 2 | # [1.1.0](https://github.com/fabbricadigitale/paper-chip/compare/v1.0.0...v1.1.0) (2018-05-03) 3 | 4 | 5 | ### Docs 6 | 7 | * Added examples for icon and iconSrc usage. ([8dd422574dcbb9844963ffc958fb2f78b14be274](https://github.com/fabbricadigitale/paper-chip/commit/8dd422574dcbb9844963ffc958fb2f78b14be274)) 8 | 9 | ### New 10 | 11 | * Icon support for paper-chip-input ([4cc5b5bb3c5ca20e8ce4d6c66c6515d615128f40](https://github.com/fabbricadigitale/paper-chip/commit/4cc5b5bb3c5ca20e8ce4d6c66c6515d615128f40)) 12 | 13 | 14 | 15 | 16 | # [1.0.0](https://github.com/fabbricadigitale/paper-chip/compare/v0.11.2...v1.0.0) (2018-01-18) 17 | 18 | 19 | ### Docs 20 | 21 | * Add titles to the sections ([b6c70635eaf94cf4d3b345cb3256bca1822705dc](https://github.com/fabbricadigitale/paper-chip/commit/b6c70635eaf94cf4d3b345cb3256bca1822705dc)) 22 | * Add ToC ([17a38a3e54efe547745bdbc4a38d38f7f9363895](https://github.com/fabbricadigitale/paper-chip/commit/17a38a3e54efe547745bdbc4a38d38f7f9363895)) 23 | * Document how to prefill an input with autocomplete ([6ec97d7dc65c86d3c0177593fb48e633a9927c3a](https://github.com/fabbricadigitale/paper-chip/commit/6ec97d7dc65c86d3c0177593fb48e633a9927c3a)) 24 | * Example about usage of datasource, values, and autocomplete properties ([c0bac6be635608b47efaf58995b22f673593a5b8](https://github.com/fabbricadigitale/paper-chip/commit/c0bac6be635608b47efaf58995b22f673593a5b8)) 25 | * Example showing declarative input children ([01da53bce98adfc33c12d78b8f18e910284df80d](https://github.com/fabbricadigitale/paper-chip/commit/01da53bce98adfc33c12d78b8f18e910284df80d)) 26 | * Improve usage examples ([9966856d905d73f55e0ee5e47b65c463ffce9a91](https://github.com/fabbricadigitale/paper-chip/commit/9966856d905d73f55e0ee5e47b65c463ffce9a91)) 27 | * Minimal chip examples ([51ea52d4fd0fec38c32a5fcf4d5c20959a436321](https://github.com/fabbricadigitale/paper-chip/commit/51ea52d4fd0fec38c32a5fcf4d5c20959a436321)) 28 | 29 | ### Fix 30 | 31 | * Add check to verify if textContent already has a value ([b7c7e1186b63db9902a7ef71566f6a02f117f529](https://github.com/fabbricadigitale/paper-chip/commit/b7c7e1186b63db9902a7ef71566f6a02f117f529)), closes [#53](https://github.com/fabbricadigitale/paper-chip/issues/53) 32 | * Always float label when special type input ([8ff7b5bbcaee4afda2a1c56cfb66e46ea4435b1d](https://github.com/fabbricadigitale/paper-chip/commit/8ff7b5bbcaee4afda2a1c56cfb66e46ea4435b1d)) 33 | * Autocomplete list close itself when there isn't an input value ([3a3af461dc4a0216f1e2474d9f8ba8d0e761cd0e](https://github.com/fabbricadigitale/paper-chip/commit/3a3af461dc4a0216f1e2474d9f8ba8d0e761cd0e)), closes [#54](https://github.com/fabbricadigitale/paper-chip/issues/54) 34 | * Correct input position when chips fill the cointainer ([b39ff8b9dbda02fd173cfe5c4bad639fa6e6ac61](https://github.com/fabbricadigitale/paper-chip/commit/b39ff8b9dbda02fd173cfe5c4bad639fa6e6ac61)), closes [#66](https://github.com/fabbricadigitale/paper-chip/issues/66) 35 | * Correct label text extraction ([95b458e5c4e4edba4f566622ccabc7356df66216](https://github.com/fabbricadigitale/paper-chip/commit/95b458e5c4e4edba4f566622ccabc7356df66216)) 36 | * Correct visibility of non floating labels ([61a7791d771b291f7541f5b28b7ce4826218b03d](https://github.com/fabbricadigitale/paper-chip/commit/61a7791d771b291f7541f5b28b7ce4826218b03d)) 37 | * CSS comment refers to right line ([34937ff1b15d56f4824b62512a7c612b39b16b1f](https://github.com/fabbricadigitale/paper-chip/commit/34937ff1b15d56f4824b62512a7c612b39b16b1f)) 38 | * Handle focusout event in autocomplete mode ([eb6d7eee42bab1175f4bf6c64f93d2f786df7221](https://github.com/fabbricadigitale/paper-chip/commit/eb6d7eee42bab1175f4bf6c64f93d2f786df7221)), closes [#56](https://github.com/fabbricadigitale/paper-chip/issues/56) 39 | * Input element full width ([607d882a6784fdf5810e791822defcfdcc8c9a4f](https://github.com/fabbricadigitale/paper-chip/commit/607d882a6784fdf5810e791822defcfdcc8c9a4f)) 40 | * Label vertical alignment ([e7041950bf735b12a99878604823474ab06ee4f3](https://github.com/fabbricadigitale/paper-chip/commit/e7041950bf735b12a99878604823474ab06ee4f3)) 41 | * Paper-chip's label padding in not removable chip case ([16c8f93d6a6a582b329440e307b7ecad01e7e65f](https://github.com/fabbricadigitale/paper-chip/commit/16c8f93d6a6a582b329440e307b7ecad01e7e65f)) 42 | * Prevent chip submit if there are validation errors ([209474e8ce94b2e66dea1b69fee6f74b7ef2552a](https://github.com/fabbricadigitale/paper-chip/commit/209474e8ce94b2e66dea1b69fee6f74b7ef2552a)), closes [#55](https://github.com/fabbricadigitale/paper-chip/issues/55) 43 | * Reference to the focusable element ([965aae43dfcc2c35a102924a80fc6cb375cec83f](https://github.com/fabbricadigitale/paper-chip/commit/965aae43dfcc2c35a102924a80fc6cb375cec83f)) 44 | * Use composedPath() instead of raw array ([c090562e28b61d8bfbfd090c0d304a1895ca9bde](https://github.com/fabbricadigitale/paper-chip/commit/c090562e28b61d8bfbfd090c0d304a1895ca9bde)) 45 | 46 | ### New 47 | 48 | * Char counter ([cea76b4badde89a64dbbc33e87720767a0347716](https://github.com/fabbricadigitale/paper-chip/commit/cea76b4badde89a64dbbc33e87720767a0347716)) 49 | * Expose paper-chip-input staged value ([b709525e244b1af08b5461d9937431b60c962e7a](https://github.com/fabbricadigitale/paper-chip/commit/b709525e244b1af08b5461d9937431b60c962e7a)) 50 | * Implement all PaperInputBehavior's functionalities ([1419c4a2d71705c2032863e4d55320aab68a14e4](https://github.com/fabbricadigitale/paper-chip/commit/1419c4a2d71705c2032863e4d55320aab68a14e4)), closes [#50](https://github.com/fabbricadigitale/paper-chip/issues/50) [#51](https://github.com/fabbricadigitale/paper-chip/issues/51) [#52](https://github.com/fabbricadigitale/paper-chip/issues/52) 51 | * Implementing chip-added and chip-removed ([1207efe5ba7cadbdf0d439b9c30bc35e547cd97c](https://github.com/fabbricadigitale/paper-chip/commit/1207efe5ba7cadbdf0d439b9c30bc35e547cd97c)) 52 | * Insert chips within paper chip inputs declaratively ([cda3b4b30858b7d2dc2c5dda800fe2dbd854ac19](https://github.com/fabbricadigitale/paper-chip/commit/cda3b4b30858b7d2dc2c5dda800fe2dbd854ac19)) 53 | * Label API ([5692202f49cca82d973c2773ef6863e11897565b](https://github.com/fabbricadigitale/paper-chip/commit/5692202f49cca82d973c2773ef6863e11897565b)) 54 | * Show the value property as label when a label is missing ([19f241b371a6b1c13428271258724d8ea3fffb3e](https://github.com/fabbricadigitale/paper-chip/commit/19f241b371a6b1c13428271258724d8ea3fffb3e)), closes [#44](https://github.com/fabbricadigitale/paper-chip/issues/44) 55 | * Slots for prefix and suffix ([5f9ffaebaf3ed08e8d40d99288b48583273d2340](https://github.com/fabbricadigitale/paper-chip/commit/5f9ffaebaf3ed08e8d40d99288b48583273d2340)) 56 | * Super minimal chip grabbing label from text content within the light DOM ([f9229ebcfd60421cba35592ac064107946abdf39](https://github.com/fabbricadigitale/paper-chip/commit/f9229ebcfd60421cba35592ac064107946abdf39)) 57 | * Tests for paper-input like API ([b5455df268c498c372172c3e9a7ba5359bbeb3e8](https://github.com/fabbricadigitale/paper-chip/commit/b5455df268c498c372172c3e9a7ba5359bbeb3e8)) 58 | 59 | ### Update 60 | 61 | * Autocomplete must be explicitly enabled now ([67909adb33ba765f649538443122a1b3396a6c42](https://github.com/fabbricadigitale/paper-chip/commit/67909adb33ba765f649538443122a1b3396a6c42)) 62 | * Chip added/removed tests now works ([641d5315cd8e0031934a7126d44bd2a050a991b6](https://github.com/fabbricadigitale/paper-chip/commit/641d5315cd8e0031934a7126d44bd2a050a991b6)) 63 | * Container does not need a min height anymore ([c5662840d757b5351f5a55ae7cbde22bd976d6b3](https://github.com/fabbricadigitale/paper-chip/commit/c5662840d757b5351f5a55ae7cbde22bd976d6b3)) 64 | * Contributing guidelines ([bd51eeb43510b2eaa043ec8479c25023a8310b18](https://github.com/fabbricadigitale/paper-chip/commit/bd51eeb43510b2eaa043ec8479c25023a8310b18)) 65 | * Convert autocomplete conditional element to a template extension element ([ee89607b6c1abc540692015dd7c6230bb7fca910](https://github.com/fabbricadigitale/paper-chip/commit/ee89607b6c1abc540692015dd7c6230bb7fca910)) 66 | * Demo for declarative children ([2e31fd118f3e615eb9098862b4b41d9493a48b11](https://github.com/fabbricadigitale/paper-chip/commit/2e31fd118f3e615eb9098862b4b41d9493a48b11)) 67 | * New demo and docs about input field feature ([3a353478185455f7ee8d598cbbe09e396a813928](https://github.com/fabbricadigitale/paper-chip/commit/3a353478185455f7ee8d598cbbe09e396a813928)) 68 | * Paper input container id ([9d6387d3b7c4e9b1451e5240a26a72bb1bae47e4](https://github.com/fabbricadigitale/paper-chip/commit/9d6387d3b7c4e9b1451e5240a26a72bb1bae47e4)) 69 | * Removing chrome from local browsers ([72025e123dd0f3bf8bf3e0eafd0b6510583757b1](https://github.com/fabbricadigitale/paper-chip/commit/72025e123dd0f3bf8bf3e0eafd0b6510583757b1)) 70 | * Removing the ability to use the label as a default value to avoid circular deps ([568638785b2592aabe428d80c9c466613f2f0817](https://github.com/fabbricadigitale/paper-chip/commit/568638785b2592aabe428d80c9c466613f2f0817)) 71 | * Testing fallback value and label property behavior ([0c91650221bccfda7af6611f8d99addbc5d4c728](https://github.com/fabbricadigitale/paper-chip/commit/0c91650221bccfda7af6611f8d99addbc5d4c728)), closes [#49](https://github.com/fabbricadigitale/paper-chip/issues/49) 72 | * Values property no more contains compound objects ([14e5b520c6784ed679a38d0f83374ce044dcc6de](https://github.com/fabbricadigitale/paper-chip/commit/14e5b520c6784ed679a38d0f83374ce044dcc6de)) 73 | 74 | 75 | 76 | 77 | ## [0.11.2](https://github.com/fabbricadigitale/paper-chip/compare/v0.11.1...v0.11.2) (2017-09-22) 78 | 79 | 80 | ### Docs 81 | 82 | * Readme ([e569af51213ea500ead65977bc7f5bb3379b05e5](https://github.com/fabbricadigitale/paper-chip/commit/e569af51213ea500ead65977bc7f5bb3379b05e5)) 83 | 84 | ### Fix 85 | 86 | * Bind handler with arrow function to ensure correct this ([5c124bdc39faa64e7f642850bfbda9d0753b5b73](https://github.com/fabbricadigitale/paper-chip/commit/5c124bdc39faa64e7f642850bfbda9d0753b5b73)) 87 | * Close only when paper-chip element is focused ([588516e03b964de285a03753264c8d91e71f0250](https://github.com/fabbricadigitale/paper-chip/commit/588516e03b964de285a03753264c8d91e71f0250)) 88 | * Close paper-chip when descendants lost focus ([f68f1b3f43408e39e5cfe88c3f78cdcff3f44992](https://github.com/fabbricadigitale/paper-chip/commit/f68f1b3f43408e39e5cfe88c3f78cdcff3f44992)) 89 | * Input elements in content slot have working blur functionality ([f2dde3bbad14d856af1fd8b117235106c82e1932](https://github.com/fabbricadigitale/paper-chip/commit/f2dde3bbad14d856af1fd8b117235106c82e1932)), closes [#42](https://github.com/fabbricadigitale/paper-chip/issues/42) 90 | * Toggle open only when paper-chip element is focused ([4730b374c1dfeb3298b808096962bced9be3a008](https://github.com/fabbricadigitale/paper-chip/commit/4730b374c1dfeb3298b808096962bced9be3a008)) 91 | 92 | ### Update 93 | 94 | * Add demo and test in PR branch ([e64bced917bd3da6eaddf1534c977e8f672c4b6f](https://github.com/fabbricadigitale/paper-chip/commit/e64bced917bd3da6eaddf1534c977e8f672c4b6f)) 95 | 96 | ### Upgrade 97 | 98 | * Move paper icon button dependency to the development deps ([5c335ffe4ccbd2f82c5e52e547254dc4500c055c](https://github.com/fabbricadigitale/paper-chip/commit/5c335ffe4ccbd2f82c5e52e547254dc4500c055c)) 99 | 100 | 101 | 102 | 103 | ## [0.11.1](https://github.com/fabbricadigitale/paper-chip/compare/v0.11.0...v0.11.1) (2017-07-28) 104 | 105 | 106 | ### Fix 107 | 108 | * Label floats also when chips are programmatically inserted or deleted ([769525291db6552b109b31791e55fb1d4caa1d2c](https://github.com/fabbricadigitale/paper-chip/commit/769525291db6552b109b31791e55fb1d4caa1d2c)), closes [#40](https://github.com/fabbricadigitale/paper-chip/issues/40) 109 | * Label position centered ([0382adc3952c1e0fe6dbe0e4d6693f2d3577d49f](https://github.com/fabbricadigitale/paper-chip/commit/0382adc3952c1e0fe6dbe0e4d6693f2d3577d49f)), closes [#36](https://github.com/fabbricadigitale/paper-chip/issues/36) 110 | 111 | ### Update 112 | 113 | * CSS variable to set custom max-width ([9b065598732153dfdf7a16a631974135a272fb39](https://github.com/fabbricadigitale/paper-chip/commit/9b065598732153dfdf7a16a631974135a272fb39)), closes [#39](https://github.com/fabbricadigitale/paper-chip/issues/39) 114 | * Using zeros without unit ([f743cc9528bf787d1588fca8db26b62150cafc76](https://github.com/fabbricadigitale/paper-chip/commit/f743cc9528bf787d1588fca8db26b62150cafc76)) 115 | 116 | 117 | 118 | 119 | # [0.11.0](https://github.com/fabbricadigitale/paper-chip/compare/v0.10.1...v0.11.0) (2017-07-27) 120 | 121 | 122 | ### Fix 123 | 124 | * Add test to show that observer is not invoked ([75952370700f598baecc9ec122cb8fd7772f9491](https://github.com/fabbricadigitale/paper-chip/commit/75952370700f598baecc9ec122cb8fd7772f9491)) 125 | * Chip sizing ([e1d65b0151eba992599698f6c43538bd1f85e839](https://github.com/fabbricadigitale/paper-chip/commit/e1d65b0151eba992599698f6c43538bd1f85e839)), closes [#31](https://github.com/fabbricadigitale/paper-chip/issues/31) 126 | * Highlighting of label now works ([3f3c32bf9c5a3fcf845bf1ff6fbba6b9401ac367](https://github.com/fabbricadigitale/paper-chip/commit/3f3c32bf9c5a3fcf845bf1ff6fbba6b9401ac367)) 127 | * Observe array.splices instead of array.length ([5fffabfa02ff2f7e0b331a30e804074a7e2e017c](https://github.com/fabbricadigitale/paper-chip/commit/5fffabfa02ff2f7e0b331a30e804074a7e2e017c)), closes [#32](https://github.com/fabbricadigitale/paper-chip/issues/32) 128 | * Run all the paper-chip-input unit tests ([c36aaa38aa59b0869d697b3ccb8cbd4d34741c93](https://github.com/fabbricadigitale/paper-chip/commit/c36aaa38aa59b0869d697b3ccb8cbd4d34741c93)) 129 | * Slightly change observer to let it be invoked ([8fd3d7490873e9a718de4ce362487ef40fa1fc1c](https://github.com/fabbricadigitale/paper-chip/commit/8fd3d7490873e9a718de4ce362487ef40fa1fc1c)), closes [#32](https://github.com/fabbricadigitale/paper-chip/issues/32) 130 | * Underline displaying is now configurable ([db7e9758aeaa92b29dc7f42ca0a4990fe9fe0787](https://github.com/fabbricadigitale/paper-chip/commit/db7e9758aeaa92b29dc7f42ca0a4990fe9fe0787)), closes [#30](https://github.com/fabbricadigitale/paper-chip/issues/30) 131 | 132 | ### New 133 | 134 | * Commit convention enforcement ([0dc2944fe699cb607692b9188a98745ab8dc8a94](https://github.com/fabbricadigitale/paper-chip/commit/0dc2944fe699cb607692b9188a98745ab8dc8a94)), closes [#15](https://github.com/fabbricadigitale/paper-chip/issues/15) 135 | * Floating label ([f8ef6abea568e8e43aa2837fe9a761c09d2c477e](https://github.com/fabbricadigitale/paper-chip/commit/f8ef6abea568e8e43aa2837fe9a761c09d2c477e)), closes [#34](https://github.com/fabbricadigitale/paper-chip/issues/34) 136 | 137 | ### Udpate 138 | 139 | * Floating label positioning refinements and attributes ([f569d23b239d8c67cb7d7d334bac4269db7ac36d](https://github.com/fabbricadigitale/paper-chip/commit/f569d23b239d8c67cb7d7d334bac4269db7ac36d)) 140 | 141 | ### Update 142 | 143 | * Floating label positioning ([41c564f0b0e156bfc1dcb2719cc7ddab152ea8e6](https://github.com/fabbricadigitale/paper-chip/commit/41c564f0b0e156bfc1dcb2719cc7ddab152ea8e6)) 144 | * Remove unneeded CSS selector for animations ([cce343e9c3104c462c4a36947428f9bcf4e91fba](https://github.com/fabbricadigitale/paper-chip/commit/cce343e9c3104c462c4a36947428f9bcf4e91fba)) 145 | * Support also mobile browsers ([8bdef8a3883d1e1ad133e3c4d00e3e51abe200d0](https://github.com/fabbricadigitale/paper-chip/commit/8bdef8a3883d1e1ad133e3c4d00e3e51abe200d0)) 146 | 147 | 148 | 149 | 150 | ## [0.10.1](https://github.com/fabbricadigitale/paper-chip/compare/v0.10.0...v0.10.1) (2017-07-17) 151 | 152 | 153 | ### Docs 154 | 155 | * Clarifying how the detection of position (for element in removal) works ([a0ed8912fae6168e82ae189d00d041b2dd4091d0](https://github.com/fabbricadigitale/paper-chip/commit/a0ed8912fae6168e82ae189d00d041b2dd4091d0)) 156 | * Demo now works also for polyfilled browsers ([f56a6fe2ebb33b00bcecb971ae7c0984a1d2fd88](https://github.com/fabbricadigitale/paper-chip/commit/f56a6fe2ebb33b00bcecb971ae7c0984a1d2fd88)), closes [#28](https://github.com/fabbricadigitale/paper-chip/issues/28) 157 | 158 | ### Fix 159 | 160 | * Correct detection of position of the element which is in removal ([bac39529618263ddad77d78194dd1aef86f989b2](https://github.com/fabbricadigitale/paper-chip/commit/bac39529618263ddad77d78194dd1aef86f989b2)) 161 | * Ensure the remove API silently fails when element is not longer in the DOM ([66c1527f7bf3c86674c3b2bd7fc8879236061d2d](https://github.com/fabbricadigitale/paper-chip/commit/66c1527f7bf3c86674c3b2bd7fc8879236061d2d)) 162 | * Execute SauceLabs only on internal PRs ([538e8b0f5b541bd7ea4b4547fb46478675fa2516](https://github.com/fabbricadigitale/paper-chip/commit/538e8b0f5b541bd7ea4b4547fb46478675fa2516)) 163 | * Overcome NodeList partial support on some browsers ... ([3ce70d4559724a1385a518fee9973ba2fb82924e](https://github.com/fabbricadigitale/paper-chip/commit/3ce70d4559724a1385a518fee9973ba2fb82924e)) 164 | * Prevent self deletion of paper-chip when it is managed by a wrapper ([601b23f7352c68d559be0d94d92a4fd0ce4bb08f](https://github.com/fabbricadigitale/paper-chip/commit/601b23f7352c68d559be0d94d92a4fd0ce4bb08f)), closes [#23](https://github.com/fabbricadigitale/paper-chip/issues/23) 165 | * Remove duplicate attribute ([98dfe41fe1d9b1021a1483e8d94f80b85e3a5579](https://github.com/fabbricadigitale/paper-chip/commit/98dfe41fe1d9b1021a1483e8d94f80b85e3a5579)) 166 | * Slotted styles does not work on FF and Safari ([1d353ecfa3860285a934e6a688095aad2c67e658](https://github.com/fabbricadigitale/paper-chip/commit/1d353ecfa3860285a934e6a688095aad2c67e658)), closes [#25](https://github.com/fabbricadigitale/paper-chip/issues/25) 167 | 168 | ### Update 169 | 170 | * Other test for the autocomplete case ([5932e02a68a98108e853e7a9c76b264c1378648e](https://github.com/fabbricadigitale/paper-chip/commit/5932e02a68a98108e853e7a9c76b264c1378648e)) 171 | * Test the correct order is retained when more elements are removed from a container ([f788bcbf3e55321e9c9a785675a58cb34fa87c76](https://github.com/fabbricadigitale/paper-chip/commit/f788bcbf3e55321e9c9a785675a58cb34fa87c76)) 172 | * Test the self removing API of paper-chip standalone element ([4b8d066f47dae9ba0c9a7064951e3cfb2069abf4](https://github.com/fabbricadigitale/paper-chip/commit/4b8d066f47dae9ba0c9a7064951e3cfb2069abf4)) 173 | 174 | 175 | 176 | 177 | # [0.10.0](https://github.com/fabbricadigitale/paper-chip/compare/v0.9.2...v0.10.0) (2017-06-16) 178 | 179 | 180 | ### Docs 181 | 182 | * Browser support plus build status badges ([6a80728738e3441f3ca2137609d8155ef80dc234](https://github.com/fabbricadigitale/paper-chip/commit/6a80728738e3441f3ca2137609d8155ef80dc234)) 183 | * Contributing guide ([a37a95a830269a63fbc5a74634d4a08b3e6f134c](https://github.com/fabbricadigitale/paper-chip/commit/a37a95a830269a63fbc5a74634d4a08b3e6f134c)) 184 | * Live demo ([cca644eb87e828e8b6c6dfeea02fd8232d0675b3](https://github.com/fabbricadigitale/paper-chip/commit/cca644eb87e828e8b6c6dfeea02fd8232d0675b3)) 185 | * README ([ea58f03a2834c8bbfb443a69cf2def12e8dfa5e4](https://github.com/fabbricadigitale/paper-chip/commit/ea58f03a2834c8bbfb443a69cf2def12e8dfa5e4)) 186 | 187 | ### Fix 188 | 189 | * Add flush in test element ([197cb077f0c64c45d8ccb7cfacd74040ae0602f8](https://github.com/fabbricadigitale/paper-chip/commit/197cb077f0c64c45d8ccb7cfacd74040ae0602f8)) 190 | * Demo ([0dfa73ecd0fb9c55c95c801f0773d6e08df111d4](https://github.com/fabbricadigitale/paper-chip/commit/0dfa73ecd0fb9c55c95c801f0773d6e08df111d4)) 191 | * Flush test fixture element ([043477176666f01db38083eb0dacf0d42b0cb006](https://github.com/fabbricadigitale/paper-chip/commit/043477176666f01db38083eb0dacf0d42b0cb006)) 192 | * Remove the unnecessary reflectToAttribute ([5b7bb9bb54ef46a129d6f2c8d020766200699098](https://github.com/fabbricadigitale/paper-chip/commit/5b7bb9bb54ef46a129d6f2c8d020766200699098)) 193 | * Remove works on both elements now ([4114c86bb25e459ae457988f75213b2a59ad0e2e](https://github.com/fabbricadigitale/paper-chip/commit/4114c86bb25e459ae457988f75213b2a59ad0e2e)) 194 | * Restore avatars in demo page ([9c62cd626319226e0ba90400e2d894b70fbc9140](https://github.com/fabbricadigitale/paper-chip/commit/9c62cd626319226e0ba90400e2d894b70fbc9140)) 195 | * Toggling status for multiline chips ([b2ed7dd380e1af9a39dafc9278c86ccb92b0ee2b](https://github.com/fabbricadigitale/paper-chip/commit/b2ed7dd380e1af9a39dafc9278c86ccb92b0ee2b)) 196 | * Translate Array.prototype.includes to Array.prototype.indexOf ([315b3fa0cfd0b3945109308b9232f8ef1f6650b0](https://github.com/fabbricadigitale/paper-chip/commit/315b3fa0cfd0b3945109308b9232f8ef1f6650b0)) 197 | * Unsupport some platform/browser combinations ([fd90f969c6a7fe5dc05e5ed8d243acbfa3b2a5a7](https://github.com/fabbricadigitale/paper-chip/commit/fd90f969c6a7fe5dc05e5ed8d243acbfa3b2a5a7)) 198 | 199 | ### New 200 | 201 | * Autocomplete feature for paper-chip-input ([23429849105af2a6ccfa1a8f6f7f39415ca5c8f0](https://github.com/fabbricadigitale/paper-chip/commit/23429849105af2a6ccfa1a8f6f7f39415ca5c8f0)) 202 | * CI setup ([9da8e095c4efe42ee751dcdea80fcc10c83c3644](https://github.com/fabbricadigitale/paper-chip/commit/9da8e095c4efe42ee751dcdea80fcc10c83c3644)) 203 | * Enter keys to submit chip are now configurable ([4805dad0a43183c91381c19dcace24099c7aec7b](https://github.com/fabbricadigitale/paper-chip/commit/4805dad0a43183c91381c19dcace24099c7aec7b)) 204 | * Filter logic is now customizable ([cc76e195a84c10949f018c1969d7a2ae7fce75ad](https://github.com/fabbricadigitale/paper-chip/commit/cc76e195a84c10949f018c1969d7a2ae7fce75ad)), closes [#7](https://github.com/fabbricadigitale/paper-chip/issues/7) 205 | * SauceLabs setup ([ee7d0a6eb2ce892aab7f28cc14298cf4206e0035](https://github.com/fabbricadigitale/paper-chip/commit/ee7d0a6eb2ce892aab7f28cc14298cf4206e0035)) 206 | 207 | ### Update 208 | 209 | * Almost ready to release ([a8c576dd60a6fdffc372a5c303e0a395a63fd9eb](https://github.com/fabbricadigitale/paper-chip/commit/a8c576dd60a6fdffc372a5c303e0a395a63fd9eb)) 210 | * DisconnectedCallback test ([32c10498abf7f2df6e8213d45f3c08fdb3e834b7](https://github.com/fabbricadigitale/paper-chip/commit/32c10498abf7f2df6e8213d45f3c08fdb3e834b7)) 211 | * Management of the status (opened or not) of multiline chips ([9e4e7c314fc88efc861c07db8397d3df8ce77a21](https://github.com/fabbricadigitale/paper-chip/commit/9e4e7c314fc88efc861c07db8397d3df8ce77a21)) 212 | * Test autocomplete feature for paper-chip-input ([e8b1c90cb63bd081d24150ac9e4b818709f76c0b](https://github.com/fabbricadigitale/paper-chip/commit/e8b1c90cb63bd081d24150ac9e4b818709f76c0b)) 213 | * Tests ([7096a90dd2236968646edd9c1c235a51a70b81d4](https://github.com/fabbricadigitale/paper-chip/commit/7096a90dd2236968646edd9c1c235a51a70b81d4)) 214 | 215 | 216 | 217 | 218 | ## [0.9.2](https://github.com/fabbricadigitale/paper-chip/compare/v0.9.1...v0.9.2) (2017-06-12) 219 | 220 | 221 | ### Build 222 | 223 | * Remove unnecessary bower file versioning ([5c4542c96a12e70248ecb433c3a4927ce65f78b1](https://github.com/fabbricadigitale/paper-chip/commit/5c4542c96a12e70248ecb433c3a4927ce65f78b1)) 224 | 225 | ### Upgrade 226 | 227 | * Bower deps with GitHub shorthand ([bdcb984ddc5d79bf66946ccc26c63604a07e390c](https://github.com/fabbricadigitale/paper-chip/commit/bdcb984ddc5d79bf66946ccc26c63604a07e390c)) 228 | 229 | 230 | 231 | 232 | ## [0.9.1](https://github.com/fabbricadigitale/paper-chip/compare/v0.9.0...v0.9.1) (2017-06-09) 233 | 234 | 235 | ### Docs 236 | 237 | * Docs about default styles ([171ec1e96a2a13d35b8085b35c977a954fd029cf](https://github.com/fabbricadigitale/paper-chip/commit/171ec1e96a2a13d35b8085b35c977a954fd029cf)) 238 | 239 | 240 | 241 | 242 | # 0.9.0 (2017-06-09) 243 | 244 | 245 | ### Deps 246 | 247 | * Correct WCT setup again ([787a5c636d883b8b907f9775ef953d64d0cd1f59](https://github.com/fabbricadigitale/paper-chip/commit/787a5c636d883b8b907f9775ef953d64d0cd1f59)) 248 | 249 | ### Docs 250 | 251 | * Add testing documentation in README ([55e93de5e69d4e65ba649ee5cef925763ed99a00](https://github.com/fabbricadigitale/paper-chip/commit/55e93de5e69d4e65ba649ee5cef925763ed99a00)) 252 | * Definitions and examples ([525b15d81a570e751d29cf63f20f1e6faa7afa46](https://github.com/fabbricadigitale/paper-chip/commit/525b15d81a570e751d29cf63f20f1e6faa7afa46)) 253 | * Inline demo within the README ([9c077551a0b62ec04a41e8914d133d9c1f7e38d0](https://github.com/fabbricadigitale/paper-chip/commit/9c077551a0b62ec04a41e8914d133d9c1f7e38d0)) 254 | * Paper-chip docs ([92b9cb4785ae0875b438b0dc1b9332fab43c4116](https://github.com/fabbricadigitale/paper-chip/commit/92b9cb4785ae0875b438b0dc1b9332fab43c4116)) 255 | * README ([3a7d8945f40a4402ab9d3f305009feed8533e930](https://github.com/fabbricadigitale/paper-chip/commit/3a7d8945f40a4402ab9d3f305009feed8533e930)) 256 | * README ([17cd4751a617fffe90349987d32bf358602e818d](https://github.com/fabbricadigitale/paper-chip/commit/17cd4751a617fffe90349987d32bf358602e818d)) 257 | 258 | ### Fix 259 | 260 | * Add workaround for wct issue ([d2ac8f4c7b930e64cced27d7a362c2ea26331514](https://github.com/fabbricadigitale/paper-chip/commit/d2ac8f4c7b930e64cced27d7a362c2ea26331514)) 261 | * Checks array initialization when push tag ([3cd0f40cd4be48c38795a4ffd7e7c72414a816ab](https://github.com/fabbricadigitale/paper-chip/commit/3cd0f40cd4be48c38795a4ffd7e7c72414a816ab)) 262 | * Chips now have a max-width and nowrap plugin ([4c4760e701f583d7b56ab1d121374caf193517e3](https://github.com/fabbricadigitale/paper-chip/commit/4c4760e701f583d7b56ab1d121374caf193517e3)) 263 | * Code style errors ([aa9159f764dc2e3a1272efee205c68ec1e8e2cd5](https://github.com/fabbricadigitale/paper-chip/commit/aa9159f764dc2e3a1272efee205c68ec1e8e2cd5)) 264 | * ES6 compliance ([1cba00e3f9906cd018df96555c025734c6cd5a23](https://github.com/fabbricadigitale/paper-chip/commit/1cba00e3f9906cd018df96555c025734c6cd5a23)) 265 | * Hide and scroll top when close tips ([7ddfc0441bd155e2716f76f3c1e40df918075561](https://github.com/fabbricadigitale/paper-chip/commit/7ddfc0441bd155e2716f76f3c1e40df918075561)) 266 | * Remove log ([9f7da08a926fde350a476703299d187c98804216](https://github.com/fabbricadigitale/paper-chip/commit/9f7da08a926fde350a476703299d187c98804216)) 267 | * Remove unneeded element to manage scrolling ([0f5dead59399a7d81c0c127f7109c1bb9fa84acc](https://github.com/fabbricadigitale/paper-chip/commit/0f5dead59399a7d81c0c127f7109c1bb9fa84acc)) 268 | * Remove wrong license message ([ca39475a767fc81f9848c22495c38c41b1e1f973](https://github.com/fabbricadigitale/paper-chip/commit/ca39475a767fc81f9848c22495c38c41b1e1f973)) 269 | * Restore bubbling property in remove-chip event ([852f942c62977c67fdf0c4375e9781f283ac17c0](https://github.com/fabbricadigitale/paper-chip/commit/852f942c62977c67fdf0c4375e9781f283ac17c0)) 270 | * Typo in demo ([a9f7c2f2bb5880e2730f99b9bcd5c2113d9881f7](https://github.com/fabbricadigitale/paper-chip/commit/a9f7c2f2bb5880e2730f99b9bcd5c2113d9881f7)) 271 | 272 | ### New 273 | 274 | * Add bower.json ([1dfb174f275637ab42c3ce8b6bd2e62d5969904e](https://github.com/fabbricadigitale/paper-chip/commit/1dfb174f275637ab42c3ce8b6bd2e62d5969904e)) 275 | * Add config files ([95dcfcf7593d25d9ff7294acddd3123604de6c2a](https://github.com/fabbricadigitale/paper-chip/commit/95dcfcf7593d25d9ff7294acddd3123604de6c2a)) 276 | * Add helper for scrolling ([818e294f8efa05ed18f0ac40fe0799368ac5ba52](https://github.com/fabbricadigitale/paper-chip/commit/818e294f8efa05ed18f0ac40fe0799368ac5ba52)) 277 | * Add ignore file ([bd541175e6f0007b2972e0a6a43f45dd38e5394e](https://github.com/fabbricadigitale/paper-chip/commit/bd541175e6f0007b2972e0a6a43f45dd38e5394e)) 278 | * Add label in paper-chip-input ([a8418a038c1354ef3e49bc598da3958c2db7de87](https://github.com/fabbricadigitale/paper-chip/commit/a8418a038c1354ef3e49bc598da3958c2db7de87)) 279 | * Add papar-chip input with autocomplete ([8540e0fec99f114465b19602742128d90144ef8f](https://github.com/fabbricadigitale/paper-chip/commit/8540e0fec99f114465b19602742128d90144ef8f)) 280 | * Add paper-chip-input wct test ([e37526b074b1023b8d64367266c6f0b79a07313c](https://github.com/fabbricadigitale/paper-chip/commit/e37526b074b1023b8d64367266c6f0b79a07313c)) 281 | * Add paper-chip-input-autocomplete test ([7365d159a364391abb11ec19b1a5b278c236eef5](https://github.com/fabbricadigitale/paper-chip/commit/7365d159a364391abb11ec19b1a5b278c236eef5)) 282 | * Add placeholder ([56bf33772adf61922c78d386748a23efca407fe1](https://github.com/fabbricadigitale/paper-chip/commit/56bf33772adf61922c78d386748a23efca407fe1)) 283 | * Add private iconset ([d932bb228c9a0aea07a4ce6026be5b2b6d7563cf](https://github.com/fabbricadigitale/paper-chip/commit/d932bb228c9a0aea07a4ce6026be5b2b6d7563cf)) 284 | * Add support for key-value approach ([9dabc43f5c4862bf6de9f23b36cac18648d80dfe](https://github.com/fabbricadigitale/paper-chip/commit/9dabc43f5c4862bf6de9f23b36cac18648d80dfe)) 285 | * Add value property ([469dd755032159a64e6fc15a61509e77eca0b9c9](https://github.com/fabbricadigitale/paper-chip/commit/469dd755032159a64e6fc15a61509e77eca0b9c9)) 286 | * Add web-component-tester test ([ac30f1e094a57046ff93138e60d68ef7bcc5d062](https://github.com/fabbricadigitale/paper-chip/commit/ac30f1e094a57046ff93138e60d68ef7bcc5d062)) 287 | * Authors ([1649bb2dc2e9d1d3bae5fead70d9789a1e7a7820](https://github.com/fabbricadigitale/paper-chip/commit/1649bb2dc2e9d1d3bae5fead70d9789a1e7a7820)) 288 | * Autocomplete datasource properties are configurable now ([4b6b561cac09f4e470f8176a55096f883f686071](https://github.com/fabbricadigitale/paper-chip/commit/4b6b561cac09f4e470f8176a55096f883f686071)) 289 | * Badges ([6cbf20c7dc8b0cf271b5e411364e2246c311c2aa](https://github.com/fabbricadigitale/paper-chip/commit/6cbf20c7dc8b0cf271b5e411364e2246c311c2aa)) 290 | * Base version ([263deb19e3959c8c9f1a7923c226de846c70f202](https://github.com/fabbricadigitale/paper-chip/commit/263deb19e3959c8c9f1a7923c226de846c70f202)) 291 | * Binding tag property ([6b5e24c6e323ad856c7d5e8bab71568ff9c12feb](https://github.com/fabbricadigitale/paper-chip/commit/6b5e24c6e323ad856c7d5e8bab71568ff9c12feb)) 292 | * Checks duplicated value ([30d9f2daff083cbdc36091714ca29371bd6971f3](https://github.com/fabbricadigitale/paper-chip/commit/30d9f2daff083cbdc36091714ca29371bd6971f3)) 293 | * Empty skeleton project ([6ba14fc12a37328de40992c7132e701882963ea4](https://github.com/fabbricadigitale/paper-chip/commit/6ba14fc12a37328de40992c7132e701882963ea4)) 294 | * Initial commit ([2ad4e3b12a20815481a5206bf422459fb655f658](https://github.com/fabbricadigitale/paper-chip/commit/2ad4e3b12a20815481a5206bf422459fb655f658)) 295 | * License ([670395ff74871e80a84aa160f18147929c090073](https://github.com/fabbricadigitale/paper-chip/commit/670395ff74871e80a84aa160f18147929c090073)) 296 | * Material restyling ([4af055d6262b5d3d92b3effd42d5cacef233e5fb](https://github.com/fabbricadigitale/paper-chip/commit/4af055d6262b5d3d92b3effd42d5cacef233e5fb)) 297 | * Multi row chips ([909093c534a6be629ff959903e315c6d978cb1f7](https://github.com/fabbricadigitale/paper-chip/commit/909093c534a6be629ff959903e315c6d978cb1f7)) 298 | * Notify externally tags value ([929e3ceae80dceed8b68e86b7e336ff8c59432e3](https://github.com/fabbricadigitale/paper-chip/commit/929e3ceae80dceed8b68e86b7e336ff8c59432e3)) 299 | * Paper-chip-input ([0a90b4c042c05064c9b7864dcfd9582c427f7449](https://github.com/fabbricadigitale/paper-chip/commit/0a90b4c042c05064c9b7864dcfd9582c427f7449)) 300 | * Remove chip at a specific index now works ([16b95fa9ea5f2ee320dd980939b4e9fbd74aae34](https://github.com/fabbricadigitale/paper-chip/commit/16b95fa9ea5f2ee320dd980939b4e9fbd74aae34)) 301 | * Remove chip key aware now works ([0d3b152709e06cdede0e2af1fd84eb955a0a3715](https://github.com/fabbricadigitale/paper-chip/commit/0d3b152709e06cdede0e2af1fd84eb955a0a3715)) 302 | 303 | ### Update 304 | 305 | * Add eslint linter ([90b38e9796cd29644ea1f8ad463aeee889ef55d1](https://github.com/fabbricadigitale/paper-chip/commit/90b38e9796cd29644ea1f8ad463aeee889ef55d1)) 306 | * Add more paper-chip test ([17a3c8a55cf6c2f5b5a1552c7e7beb149a847c34](https://github.com/fabbricadigitale/paper-chip/commit/17a3c8a55cf6c2f5b5a1552c7e7beb149a847c34)) 307 | * Add padding when chip is not removable ([222bb946c67cfce6623b0fdb68d33b897ec23da3](https://github.com/fabbricadigitale/paper-chip/commit/222bb946c67cfce6623b0fdb68d33b897ec23da3)) 308 | * Add/remove chip test in paper-chip-input test suite ([1c90413418b5270ac16883d61b8f2729fed175c0](https://github.com/fabbricadigitale/paper-chip/commit/1c90413418b5270ac16883d61b8f2729fed175c0)) 309 | * Autocomplete test cases ([e5e29292ef158331253f9f4fd8480cf9eedc1031](https://github.com/fabbricadigitale/paper-chip/commit/e5e29292ef158331253f9f4fd8480cf9eedc1031)) 310 | * Hide tips test ([76d907cb002adc4d8cc2308d87f668978fdcbe87](https://github.com/fabbricadigitale/paper-chip/commit/76d907cb002adc4d8cc2308d87f668978fdcbe87)) 311 | * Iniling ES 2015 within HTML ([106ae4809bf56cb6855877990b26dddf1dfa378a](https://github.com/fabbricadigitale/paper-chip/commit/106ae4809bf56cb6855877990b26dddf1dfa378a)) 312 | * Linting system ([197273f0efd03945f0891e9cd0108e981895cefc](https://github.com/fabbricadigitale/paper-chip/commit/197273f0efd03945f0891e9cd0108e981895cefc)) 313 | * Pop and Push private method definition ([f94e3fb4d29a7fca75f9f358d79d2b4c81753feb](https://github.com/fabbricadigitale/paper-chip/commit/f94e3fb4d29a7fca75f9f358d79d2b4c81753feb)) 314 | * Project skeleton ([e2865ed407bbee461bc99d53bc7afbb2494c2b00](https://github.com/fabbricadigitale/paper-chip/commit/e2865ed407bbee461bc99d53bc7afbb2494c2b00)) 315 | * Readme ([3f62cb123e2aceb5194c308799c8cb519abfe194](https://github.com/fabbricadigitale/paper-chip/commit/3f62cb123e2aceb5194c308799c8cb519abfe194)) 316 | * Readme and docs ([dde58961190b5e1f5d1b1cd3ec19ee8736f1ae8f](https://github.com/fabbricadigitale/paper-chip/commit/dde58961190b5e1f5d1b1cd3ec19ee8736f1ae8f)) 317 | * Remove bundler ([6ebb263c1e2f9987774617b6f82deb1d75380bc8](https://github.com/fabbricadigitale/paper-chip/commit/6ebb263c1e2f9987774617b6f82deb1d75380bc8)) 318 | * Removed needless css ([ba094547147dc9325c3a1e08d7b94bdfcd104b11](https://github.com/fabbricadigitale/paper-chip/commit/ba094547147dc9325c3a1e08d7b94bdfcd104b11)) 319 | * Removed useless code ([9de5aa1a7222c75f9e1e2ce5c03e0080fd89a701](https://github.com/fabbricadigitale/paper-chip/commit/9de5aa1a7222c75f9e1e2ce5c03e0080fd89a701)) 320 | * Use demo-snippet in demo page ([ccd0f88e77f3bac5d9f7aa05ae00c610c9b8e136](https://github.com/fabbricadigitale/paper-chip/commit/ccd0f88e77f3bac5d9f7aa05ae00c610c9b8e136)) 321 | * Use paper-styles mixins ([dedd984a742ec380d2b84f805a0978845b1b5db6](https://github.com/fabbricadigitale/paper-chip/commit/dedd984a742ec380d2b84f805a0978845b1b5db6)) 322 | 323 | ### Upgrade 324 | 325 | * Add compatibility with Polymer 2.0 RC2 ([836f1acf97d98d05f405fd49897157ab110d722f](https://github.com/fabbricadigitale/paper-chip/commit/836f1acf97d98d05f405fd49897157ab110d722f)) 326 | * Point to latest polymer 2.0.0 versions ([d7be1ccce3d2bf022d460b4790239780b9cc4e40](https://github.com/fabbricadigitale/paper-chip/commit/d7be1ccce3d2bf022d460b4790239780b9cc4e40)) 327 | * Set Polymer 2.0.0 stable version ([aa1f5a7783f92cce6817fd627f4547365a812b12](https://github.com/fabbricadigitale/paper-chip/commit/aa1f5a7783f92cce6817fd627f4547365a812b12)) 328 | * Set webcomponentsjs 1.0.0 version ([355c46202f8055d3c44f561597f53a3e18f238e7](https://github.com/fabbricadigitale/paper-chip/commit/355c46202f8055d3c44f561597f53a3e18f238e7)) 329 | 330 | 331 | -------------------------------------------------------------------------------- /demo/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | paper-chip demo 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 35 | 36 | 37 | 38 | 39 |

40 | 41 |

Minimal example

42 | 43 | 46 | 47 | 48 |

Single-line removable chip (does not open)

49 | 50 | 55 | 56 | 57 |

Chip with custom max-width

58 | 59 | 64 | 65 | 66 |

Removable, double-line removable

67 | 68 | 69 | 76 | 77 | 78 |

Same chip, with animated transition

79 | 80 | 81 | 88 | 89 | 90 |

Animated chip with more content

91 | 92 | 93 | 104 | 105 | 106 |

With button inside

107 | 108 | 109 | 119 | 120 | 121 |

Chip with single letter instead of an icon

122 | 123 | 124 | 131 | 132 | 133 |

Example chip input field using paper-input-container

134 | 135 | 136 | 139 | 140 | 141 |

Inputs can have different types, and be disabled

142 | 143 | 149 | 150 | 151 |

Inputs can have character counters

152 | 153 | 157 | 158 | 159 |

Inputs can validate automatically or on demand, and can have custom error messages

160 | 161 | 169 | 170 | 171 |

Example chip input field with custom prefix and suffix

172 | 173 | 174 | 180 | 181 | 182 |

Example chip input field with no underline

183 | 184 | 185 | 188 | 189 | 190 |

Example chip input field with always float label

191 | 192 | 193 | 196 | 197 | 198 |

Example chip input field with no label float

199 | 200 | 201 | 204 | 205 | 206 |

Example of chip input field firing chip-added and chip-removed event

207 | 208 | 209 | 213 | 214 | 215 | 216 |

Configure your favorite enter keys

217 | 218 | 219 | 222 | 223 | 224 |

Example chip input field using paper-input-container (with placeholder)

225 | 226 | 227 | 230 | 231 | 232 |

Example chip input with datasource, pre-filled, including icon sources

233 | 234 | 235 | 242 | 243 | 244 |

Example chip input with autocomplete

245 | 246 | 247 | 250 | 251 | 252 |

Example chip input with autocomplete and configured datasource properties

253 | 254 | 255 | 258 | 259 | 260 |

Example chip input with autocomplete and inline datasource including icons

261 | 262 | 263 | 267 | 268 | 269 |

Example chip input with autocomplete, inline datasource, pre-filled

270 | 271 | 272 | 276 | 277 | 278 |

Example chip input with autocomplete and custom search logic

279 | 280 | 281 | 291 | 292 | 293 |

Example chip input with declarative children

294 | 295 | 296 | 309 | 310 | 311 |

312 | 313 | 1316 | 1317 | 1318 | 1319 | 1320 | 1321 | --------------------------------------------------------------------------------