mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-26 17:24:56 +00:00
image in file list
This commit is contained in:
parent
ebc1e3e744
commit
6fb2323a02
148
react-app/.idea/workspace.xml
generated
148
react-app/.idea/workspace.xml
generated
@ -26,23 +26,13 @@
|
||||
<file leaf-file-name="index.html" pinned="false" current-in-tab="false">
|
||||
<entry file="file://$PROJECT_DIR$/index.html">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="153">
|
||||
<state relative-caret-position="364">
|
||||
<caret line="50" column="60" selection-start-line="50" selection-start-column="44" selection-end-line="50" selection-end-column="60" />
|
||||
<folding />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
</file>
|
||||
<file leaf-file-name="helloworld.js" pinned="false" current-in-tab="true">
|
||||
<entry file="file://$PROJECT_DIR$/src/helloworld.js">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="30">
|
||||
<caret line="2" column="62" selection-start-line="2" selection-start-column="62" selection-end-line="2" selection-end-column="62" />
|
||||
<folding />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
</file>
|
||||
<file leaf-file-name="style.html" pinned="false" current-in-tab="false">
|
||||
<entry file="file://$PROJECT_DIR$/css/style.html">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
@ -53,21 +43,11 @@
|
||||
</provider>
|
||||
</entry>
|
||||
</file>
|
||||
<file leaf-file-name="index.html" pinned="false" current-in-tab="false">
|
||||
<entry file="file://$PROJECT_DIR$/webcomponents/file-upload/index.html">
|
||||
<file leaf-file-name="alfresco-file-list.html" pinned="false" current-in-tab="true">
|
||||
<entry file="file://$PROJECT_DIR$/webcomponents/alfresco-file-list/src/alfresco-file-list.html">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="45">
|
||||
<caret line="3" column="17" selection-start-line="3" selection-start-column="16" selection-end-line="3" selection-end-column="17" />
|
||||
<folding />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
</file>
|
||||
<file leaf-file-name="file-upload.html" pinned="false" current-in-tab="false">
|
||||
<entry file="file://$PROJECT_DIR$/webcomponents/file-upload/file-upload.html">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="91">
|
||||
<caret line="367" column="72" selection-start-line="367" selection-start-column="71" selection-end-line="367" selection-end-column="72" />
|
||||
<state relative-caret-position="167">
|
||||
<caret line="124" column="24" selection-start-line="0" selection-start-column="0" selection-end-line="186" selection-end-column="0" />
|
||||
<folding />
|
||||
</state>
|
||||
</provider>
|
||||
@ -94,11 +74,11 @@
|
||||
<option value="$PROJECT_DIR$/package.json" />
|
||||
<option value="$PROJECT_DIR$/build/helloworld.js" />
|
||||
<option value="$PROJECT_DIR$/css/style.css" />
|
||||
<option value="$PROJECT_DIR$/webcomponents/alfresco-file-list/src/alfresco-file-list.html" />
|
||||
<option value="$PROJECT_DIR$/index.html" />
|
||||
<option value="$PROJECT_DIR$/css/style.html" />
|
||||
<option value="$PROJECT_DIR$/webcomponents/file-upload/file-upload.html" />
|
||||
<option value="$PROJECT_DIR$/src/helloworld.js" />
|
||||
<option value="$PROJECT_DIR$/webcomponents/alfresco-file-list/src/alfresco-file-list.html" />
|
||||
</list>
|
||||
</option>
|
||||
</component>
|
||||
@ -186,7 +166,7 @@
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
|
||||
</PATH_ELEMENT>
|
||||
<PATH_ELEMENT>
|
||||
<option name="myItemId" value="file-upload" />
|
||||
<option name="myItemId" value="alfresco-file-list" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
|
||||
</PATH_ELEMENT>
|
||||
</PATH>
|
||||
@ -199,57 +179,19 @@
|
||||
<option name="myItemId" value="react-app" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
|
||||
</PATH_ELEMENT>
|
||||
<PATH_ELEMENT>
|
||||
<option name="myItemId" value="webcomponents" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
|
||||
</PATH_ELEMENT>
|
||||
<PATH_ELEMENT>
|
||||
<option name="myItemId" value="alfresco-file-list" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
|
||||
</PATH_ELEMENT>
|
||||
<PATH_ELEMENT>
|
||||
<option name="myItemId" value="src" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
|
||||
</PATH_ELEMENT>
|
||||
</PATH>
|
||||
<PATH>
|
||||
<PATH_ELEMENT>
|
||||
<option name="myItemId" value="react-app" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.ProjectViewProjectNode" />
|
||||
</PATH_ELEMENT>
|
||||
<PATH_ELEMENT>
|
||||
<option name="myItemId" value="react-app" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
|
||||
</PATH_ELEMENT>
|
||||
<PATH_ELEMENT>
|
||||
<option name="myItemId" value="css" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
|
||||
</PATH_ELEMENT>
|
||||
</PATH>
|
||||
<PATH>
|
||||
<PATH_ELEMENT>
|
||||
<option name="myItemId" value="react-app" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.ProjectViewProjectNode" />
|
||||
</PATH_ELEMENT>
|
||||
<PATH_ELEMENT>
|
||||
<option name="myItemId" value="react-app" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
|
||||
</PATH_ELEMENT>
|
||||
<PATH_ELEMENT>
|
||||
<option name="myItemId" value="bower_components" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
|
||||
</PATH_ELEMENT>
|
||||
</PATH>
|
||||
<PATH>
|
||||
<PATH_ELEMENT>
|
||||
<option name="myItemId" value="react-app" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.ProjectViewProjectNode" />
|
||||
</PATH_ELEMENT>
|
||||
<PATH_ELEMENT>
|
||||
<option name="myItemId" value="react-app" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
|
||||
</PATH_ELEMENT>
|
||||
<PATH_ELEMENT>
|
||||
<option name="myItemId" value="bower_components" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
|
||||
</PATH_ELEMENT>
|
||||
<PATH_ELEMENT>
|
||||
<option name="myItemId" value="iron-flex-layout" />
|
||||
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
|
||||
</PATH_ELEMENT>
|
||||
</PATH>
|
||||
</subPane>
|
||||
</pane>
|
||||
</panes>
|
||||
@ -681,35 +623,35 @@
|
||||
<updated>1459937301294</updated>
|
||||
<workItem from="1459937303527" duration="16595000" />
|
||||
<workItem from="1459961481615" duration="247000" />
|
||||
<workItem from="1460028311714" duration="5476000" />
|
||||
<workItem from="1460028311714" duration="8282000" />
|
||||
</task>
|
||||
<servers />
|
||||
</component>
|
||||
<component name="TimeTrackingManager">
|
||||
<option name="totallyTimeSpent" value="22318000" />
|
||||
<option name="totallyTimeSpent" value="25124000" />
|
||||
</component>
|
||||
<component name="ToolWindowManager">
|
||||
<frame x="0" y="23" width="1440" height="803" extended-state="6" />
|
||||
<editor active="false" />
|
||||
<editor active="true" />
|
||||
<layout>
|
||||
<window_info id="Palette" active="false" anchor="right" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="3" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="TODO" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="6" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="Palette	" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="5" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="Capture Analysis" active="false" anchor="right" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="7" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="Event Log" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="7" side_tool="true" content_ui="tabs" />
|
||||
<window_info id="Event Log" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.32959327" sideWeight="0.5" order="7" side_tool="true" content_ui="tabs" />
|
||||
<window_info id="Maven Projects" active="false" anchor="right" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="4" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="Version Control" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="10" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="Run" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="2" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="Terminal" active="true" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="true" show_stripe_button="true" weight="0.46844319" sideWeight="0.5" order="8" side_tool="true" content_ui="tabs" />
|
||||
<window_info id="Terminal" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="true" show_stripe_button="true" weight="0.21318373" sideWeight="0.5" order="8" side_tool="true" content_ui="tabs" />
|
||||
<window_info id="Capture Tool" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="2" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="Designer" active="false" anchor="right" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="5" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="Project" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="true" show_stripe_button="true" weight="0.24892704" sideWeight="0.5" order="0" side_tool="false" content_ui="combo" />
|
||||
<window_info id="Project" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="true" show_stripe_button="true" weight="0.24892704" sideWeight="0.4916318" order="0" side_tool="false" content_ui="combo" />
|
||||
<window_info id="Pomodoro" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.32988626" sideWeight="0.5" order="9" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="Database" active="false" anchor="right" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="6" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="Structure" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.25" sideWeight="0.5" order="1" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="Ant Build" active="false" anchor="right" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.25" sideWeight="0.5" order="1" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="UI Designer" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="3" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="Favorites" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="4" side_tool="true" content_ui="tabs" />
|
||||
<window_info id="Favorites" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.24892704" sideWeight="0.5083682" order="4" side_tool="true" content_ui="tabs" />
|
||||
<window_info id="Debug" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.4" sideWeight="0.5" order="3" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="Cvs" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.25" sideWeight="0.5" order="4" side_tool="false" content_ui="tabs" />
|
||||
<window_info id="Message" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="0" side_tool="false" content_ui="tabs" />
|
||||
@ -899,10 +841,26 @@
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
<entry file="file://$PROJECT_DIR$/webcomponents/alfresco-file-list/src/alfresco-file-list.html">
|
||||
<entry file="file://$PROJECT_DIR$/webcomponents/file-upload/index.html">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="60">
|
||||
<caret line="10" column="7" selection-start-line="10" selection-start-column="7" selection-end-line="10" selection-end-column="7" />
|
||||
<state relative-caret-position="45">
|
||||
<caret line="3" column="17" selection-start-line="3" selection-start-column="16" selection-end-line="3" selection-end-column="17" />
|
||||
<folding />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
<entry file="file://$PROJECT_DIR$/webcomponents/file-upload/file-upload.html">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="5505">
|
||||
<caret line="367" column="72" selection-start-line="367" selection-start-column="71" selection-end-line="367" selection-end-column="72" />
|
||||
<folding />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
<entry file="file://$PROJECT_DIR$/src/helloworld.js">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="105">
|
||||
<caret line="7" column="6" selection-start-line="7" selection-start-column="6" selection-end-line="7" selection-end-column="6" />
|
||||
<folding />
|
||||
</state>
|
||||
</provider>
|
||||
@ -917,32 +875,16 @@
|
||||
</entry>
|
||||
<entry file="file://$PROJECT_DIR$/index.html">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="153">
|
||||
<state relative-caret-position="364">
|
||||
<caret line="50" column="60" selection-start-line="50" selection-start-column="44" selection-end-line="50" selection-end-column="60" />
|
||||
<folding />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
<entry file="file://$PROJECT_DIR$/webcomponents/file-upload/file-upload.html">
|
||||
<entry file="file://$PROJECT_DIR$/webcomponents/alfresco-file-list/src/alfresco-file-list.html">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="91">
|
||||
<caret line="367" column="72" selection-start-line="367" selection-start-column="71" selection-end-line="367" selection-end-column="72" />
|
||||
<folding />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
<entry file="file://$PROJECT_DIR$/webcomponents/file-upload/index.html">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="45">
|
||||
<caret line="3" column="17" selection-start-line="3" selection-start-column="16" selection-end-line="3" selection-end-column="17" />
|
||||
<folding />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
<entry file="file://$PROJECT_DIR$/src/helloworld.js">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="30">
|
||||
<caret line="2" column="62" selection-start-line="2" selection-start-column="62" selection-end-line="2" selection-end-column="62" />
|
||||
<state relative-caret-position="167">
|
||||
<caret line="124" column="24" selection-start-line="0" selection-start-column="0" selection-end-line="186" selection-end-column="0" />
|
||||
<folding />
|
||||
</state>
|
||||
</provider>
|
||||
|
43
react-app/bower_components/iron-a11y-announcer/.bower.json
vendored
Normal file
43
react-app/bower_components/iron-a11y-announcer/.bower.json
vendored
Normal file
@ -0,0 +1,43 @@
|
||||
{
|
||||
"name": "iron-a11y-announcer",
|
||||
"version": "1.0.4",
|
||||
"description": "A singleton element that simplifies announcing text to screen readers.",
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"a11y",
|
||||
"live"
|
||||
],
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/iron-a11y-announcer.git"
|
||||
},
|
||||
"main": "iron-a11y-announcer.html",
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"dependencies": {
|
||||
"polymer": "polymer/polymer#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"iron-component-page": "polymerelements/iron-component-page#^1.0.0",
|
||||
"iron-test-helpers": "polymerelements/iron-test-helpers#^1.0.0",
|
||||
"paper-button": "polymerelements/paper-button#^1.0.0",
|
||||
"paper-styles": "polymerelements/paper-styles#^1.0.0",
|
||||
"test-fixture": "polymerelements/test-fixture#^1.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
|
||||
"web-component-tester": "polymer/web-component-tester#^3.4.0"
|
||||
},
|
||||
"ignore": [],
|
||||
"homepage": "https://github.com/PolymerElements/iron-a11y-announcer",
|
||||
"_release": "1.0.4",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v1.0.4",
|
||||
"commit": "5ce3eb8c4282bb53cd72e348858dc6be6b4c50b9"
|
||||
},
|
||||
"_source": "git://github.com/PolymerElements/iron-a11y-announcer.git",
|
||||
"_target": "^1.0.0",
|
||||
"_originalSource": "PolymerElements/iron-a11y-announcer"
|
||||
}
|
1
react-app/bower_components/iron-a11y-announcer/.gitignore
vendored
Normal file
1
react-app/bower_components/iron-a11y-announcer/.gitignore
vendored
Normal file
@ -0,0 +1 @@
|
||||
bower_components
|
22
react-app/bower_components/iron-a11y-announcer/.travis.yml
vendored
Normal file
22
react-app/bower_components/iron-a11y-announcer/.travis.yml
vendored
Normal file
@ -0,0 +1,22 @@
|
||||
language: node_js
|
||||
sudo: false
|
||||
before_script:
|
||||
- npm install web-component-tester
|
||||
- npm install bower
|
||||
- 'export PATH=$PWD/node_modules/.bin:$PATH'
|
||||
- bower install
|
||||
env:
|
||||
global:
|
||||
- secure: lNcOb1qPO7R65VYIQ6ekoc4I8wg98E/DRdqRMGAWrvr9eZ6lbz4hqwVvgnl05Ukc62lFsEGdaykFdcQ5QG5rDxXxh1Dofl8dfE8ohBZzR9gQ5g9808CVVbV/0kfafAMts/KYGVLAuy+30aU/xA+DQ4oR76E1glZOGoz4FDxUotIFpMyPR77HC1WDuFiF/HUOUgs8zO5v02171URdYG33ywVx6n0j1akCKksQ9Odcxn+VF51xziSuP+Hd+mju4j6xiAsvkc8EhdFMTXBKDHH0LEjP6zVLQ+lA4ePX2YxPAocFUcWFlGsfDwLdbY18zrP9vXK0AqpoU0d3hW1bLdxoH+4Fd8WkFzYB5rjtV0jT8BOWjEK+1g7GBzofZYQs+h9kRUoNQA5m7NNo3dz/NM8NxvDCALscH2kWTEYpzvaX/Gy653psOkKe8MRawa6nqgXreaNEn3dtVqlonz3KpgVLJpgBtLYvQDQ8lczntuBw6BlnCZRZw8wy0hLHIIpld/GbxrH1O13XGpT07CAny10wZYMk9J0OiEuMPd23UNdcEXibNnfDS18UKW64JoILqqBMyl10WY6dOqLt7DAd5eDoKqZ/heU3vXFm9/JcebtUB3NmOG+qkgb1UOChEtzxJFCXa3S3NFsLiHra6CgdV78gHM5WizlT0kldecgrlDtz/tQ=
|
||||
- secure: ig1L3SPuNpnAqzk8wXc8SqprhF7ajVuD1MQa0KfmkCxFZCXSmAHnt9tsuwrkea0J3s3Mmj+UQBI3WX5jsFEAlwNy239uRIUxHTz/tsKznmo5Jf+u/u7jHR4H/x0+kNbA/D56eInlNeR9bwE/72kiWB2ZI9nxHIggNxJrsTK4d+CQC863V763P8sJaBNP7BXq/2igs2/wHgfsF126oKOf0fxMbeBm3tFYB0VBdkLZJvQ+NowZGn/RTvmdAMJZe/UuICf9jTl/YQXp7q3b/hF5h/CMlQckkNoiQZ8FY3yz4yg8eJc2Pe1NjuCYl8YE7nUY+mUX8B/hqB9g05LmKxAdFg1icsq14Rmb54MBa6CsYIPo5ZZNXSeCkiQvfHOOhubnB4lBxDYGSLwFIDwpRtRRkwIzpz/5sul6OP9RR/g0kXnmktFEYbu2/OQk89H2GymOdrIlUrJ9Rat74X4My3DO7I7QnGi/04I7sLxP5PxUShqcjDi5q4rZTXG/ssaLS3O4YvXigy0ZzK6PsKX8jYVTlQdMQHBY5IwYH6reJ5IM0KjJoum95VoZTTKtIAIxOjLnbVu8khwxYDyzFhrfUKkvcULCCrGx7PphBPNV6SN+/0TFNmuabhp1nLb/+lZ61bVFiV5Mfs7DF8WVVMvwhBMw68HqIyts/b5g68e/yjwV6do=
|
||||
node_js: 4
|
||||
addons:
|
||||
firefox: '42.0'
|
||||
apt:
|
||||
sources:
|
||||
- google-chrome
|
||||
packages:
|
||||
- google-chrome-stable
|
||||
script:
|
||||
- xvfb-run wct
|
||||
- "if [ \"${TRAVIS_PULL_REQUEST}\" = \"false\" ]; then wct -s 'default'; fi"
|
72
react-app/bower_components/iron-a11y-announcer/CONTRIBUTING.md
vendored
Normal file
72
react-app/bower_components/iron-a11y-announcer/CONTRIBUTING.md
vendored
Normal file
@ -0,0 +1,72 @@
|
||||
|
||||
<!--
|
||||
This file is autogenerated based on
|
||||
https://github.com/PolymerElements/ContributionGuide/blob/master/CONTRIBUTING.md
|
||||
|
||||
If you edit that file, it will get updated everywhere else.
|
||||
If you edit this file, your changes will get overridden :)
|
||||
-->
|
||||
# Polymer Elements
|
||||
## Guide for Contributors
|
||||
|
||||
Polymer Elements are built in the open, and the Polymer authors eagerly encourage any and all forms of community contribution. When contributing, please follow these guidelines:
|
||||
|
||||
### Filing Issues
|
||||
|
||||
**If you are filing an issue to request a feature**, please provide a clear description of the feature. It can be helpful to describe answers to the following questions:
|
||||
|
||||
1. **Who will use the feature?** _“As someone filling out a form…”_
|
||||
2. **When will they use the feature?** _“When I enter an invalid value…”_
|
||||
3. **What is the user’s goal?** _“I want to be visually notified that the value needs to be corrected…”_
|
||||
|
||||
**If you are filing an issue to report a bug**, please provide:
|
||||
|
||||
1. **A clear description of the bug and related expectations.** Consider using the following example template for reporting a bug:
|
||||
|
||||
```markdown
|
||||
The `paper-foo` element causes the page to turn pink when clicked.
|
||||
|
||||
## Expected outcome
|
||||
|
||||
The page stays the same color.
|
||||
|
||||
## Actual outcome
|
||||
|
||||
The page turns pink.
|
||||
|
||||
## Steps to reproduce
|
||||
|
||||
1. Put a `paper-foo` element in the page.
|
||||
2. Open the page in a web browser.
|
||||
3. Click the `paper-foo` element.
|
||||
```
|
||||
|
||||
2. **A reduced test case that demonstrates the problem.** If possible, please include the test case as a JSBin. Start with this template to easily import and use relevant Polymer Elements: [http://jsbin.com/cagaye](http://jsbin.com/cagaye/edit?html,output).
|
||||
|
||||
3. **A list of browsers where the problem occurs.** This can be skipped if the problem is the same across all browsers.
|
||||
|
||||
### Submitting Pull Requests
|
||||
|
||||
**Before creating a pull request**, please ensure that an issue exists for the corresponding change in the pull request that you intend to make. **If an issue does not exist, please create one per the guidelines above**. The goal is to discuss the design and necessity of the proposed change with Polymer authors and community before diving into a pull request.
|
||||
|
||||
When submitting pull requests, please provide:
|
||||
|
||||
1. **A reference to the corresponding issue** or issues that will be closed by the pull request. Please refer to these issues using the following syntax:
|
||||
|
||||
```markdown
|
||||
(For a single issue)
|
||||
Fixes #20
|
||||
|
||||
(For multiple issues)
|
||||
Fixes #32, #40
|
||||
```
|
||||
|
||||
2. **A succinct description of the design** used to fix any related issues. For example:
|
||||
|
||||
```markdown
|
||||
This fixes #20 by removing styles that leaked which would cause the page to turn pink whenever `paper-foo` is clicked.
|
||||
```
|
||||
|
||||
3. **At least one test for each bug fixed or feature added** as part of the pull request. Pull requests that fix bugs or add features without accompanying tests will not be considered.
|
||||
|
||||
If a proposed change contains multiple commits, please [squash commits](https://www.google.com/url?q=http://blog.steveklabnik.com/posts/2012-11-08-how-to-squash-commits-in-a-github-pull-request) to as few as is necessary to succinctly express the change. A Polymer author can help you squash commits, so don’t be afraid to ask us if you need help with that!
|
49
react-app/bower_components/iron-a11y-announcer/README.md
vendored
Normal file
49
react-app/bower_components/iron-a11y-announcer/README.md
vendored
Normal file
@ -0,0 +1,49 @@
|
||||
|
||||
<!---
|
||||
|
||||
This README is automatically generated from the comments in these files:
|
||||
iron-a11y-announcer.html
|
||||
|
||||
Edit those files, and our readme bot will duplicate them over here!
|
||||
Edit this file, and the bot will squash your changes :)
|
||||
|
||||
-->
|
||||
|
||||
[](https://travis-ci.org/PolymerElements/iron-a11y-announcer)
|
||||
|
||||
_[Demo and API Docs](https://elements.polymer-project.org/elements/iron-a11y-announcer)_
|
||||
|
||||
|
||||
##<iron-a11y-announcer>
|
||||
|
||||
|
||||
`iron-a11y-announcer` is a singleton element that is intended to add a11y
|
||||
to features that require on-demand announcement from screen readers. In
|
||||
order to make use of the announcer, it is best to request its availability
|
||||
in the announcing element.
|
||||
|
||||
Example:
|
||||
|
||||
Polymer({
|
||||
|
||||
is: 'x-chatty',
|
||||
|
||||
attached: function() {
|
||||
// This will create the singleton element if it has not
|
||||
// been created yet:
|
||||
Polymer.IronA11yAnnouncer.requestAvailability();
|
||||
}
|
||||
});
|
||||
|
||||
After the `iron-a11y-announcer` has been made available, elements can
|
||||
make announces by firing bubbling `iron-announce` events.
|
||||
|
||||
Example:
|
||||
|
||||
this.fire('iron-announce', {
|
||||
text: 'This is an announcement!'
|
||||
}, { bubbles: true });
|
||||
|
||||
Note: announcements are only audible if you have a screen reader enabled.
|
||||
|
||||
|
33
react-app/bower_components/iron-a11y-announcer/bower.json
vendored
Normal file
33
react-app/bower_components/iron-a11y-announcer/bower.json
vendored
Normal file
@ -0,0 +1,33 @@
|
||||
{
|
||||
"name": "iron-a11y-announcer",
|
||||
"version": "1.0.4",
|
||||
"description": "A singleton element that simplifies announcing text to screen readers.",
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"a11y",
|
||||
"live"
|
||||
],
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/iron-a11y-announcer.git"
|
||||
},
|
||||
"main": "iron-a11y-announcer.html",
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"dependencies": {
|
||||
"polymer": "polymer/polymer#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"iron-component-page": "polymerelements/iron-component-page#^1.0.0",
|
||||
"iron-test-helpers": "polymerelements/iron-test-helpers#^1.0.0",
|
||||
"paper-button": "polymerelements/paper-button#^1.0.0",
|
||||
"paper-styles": "polymerelements/paper-styles#^1.0.0",
|
||||
"test-fixture": "polymerelements/test-fixture#^1.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
|
||||
"web-component-tester": "polymer/web-component-tester#^3.4.0"
|
||||
},
|
||||
"ignore": []
|
||||
}
|
38
react-app/bower_components/iron-a11y-announcer/demo/index.html
vendored
Normal file
38
react-app/bower_components/iron-a11y-announcer/demo/index.html
vendored
Normal file
@ -0,0 +1,38 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
|
||||
<title>iron-a11y-announcer demo</title>
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<link rel="import" href="../../paper-styles/demo-pages.html">
|
||||
<link rel="import" href="x-announces.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div class="horizontal-section-container">
|
||||
<div>
|
||||
<div class="vertical-section">
|
||||
<span>Note: in order to hear the announcements, be sure to turn on your favorite screen reader!</span>
|
||||
<x-announces>Hello, my name is Ava.</x-announces>
|
||||
<x-announces>This true sentence is false.</x-announces>
|
||||
<x-announces>Are you paying attention?</x-announces>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
50
react-app/bower_components/iron-a11y-announcer/demo/x-announces.html
vendored
Normal file
50
react-app/bower_components/iron-a11y-announcer/demo/x-announces.html
vendored
Normal file
@ -0,0 +1,50 @@
|
||||
<!--
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS
|
||||
-->
|
||||
|
||||
<link rel="import" href="../../polymer/polymer.html">
|
||||
<link rel="import" href="../../paper-button/paper-button.html">
|
||||
<link rel="import" href="../iron-a11y-announcer.html">
|
||||
|
||||
<dom-module id="x-announces">
|
||||
<style>
|
||||
:host {
|
||||
display: block;
|
||||
position: relative;
|
||||
padding: 1em 0;
|
||||
}
|
||||
|
||||
paper-button {
|
||||
background: #4285f4;
|
||||
color: #fff;
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<paper-button on-tap="_onTapAnnounce" raised>Announce</paper-button>
|
||||
<span id="content" aria-hidden="true">
|
||||
<content></content>
|
||||
</span>
|
||||
</template>
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'x-announces',
|
||||
|
||||
attached: function() {
|
||||
Polymer.IronA11yAnnouncer.requestAvailability();
|
||||
},
|
||||
|
||||
_onTapAnnounce: function() {
|
||||
this.fire('iron-announce', {
|
||||
text: this.$.content.textContent.trim()
|
||||
}, {
|
||||
bubbles: true
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</dom-module>
|
28
react-app/bower_components/iron-a11y-announcer/index.html
vendored
Normal file
28
react-app/bower_components/iron-a11y-announcer/index.html
vendored
Normal file
@ -0,0 +1,28 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>iron-a11y-announcer</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<link rel="import" href="../iron-component-page/iron-component-page.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<iron-component-page></iron-component-page>
|
||||
|
||||
</body>
|
||||
</html>
|
125
react-app/bower_components/iron-a11y-announcer/iron-a11y-announcer.html
vendored
Normal file
125
react-app/bower_components/iron-a11y-announcer/iron-a11y-announcer.html
vendored
Normal file
@ -0,0 +1,125 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
|
||||
<!--
|
||||
`iron-a11y-announcer` is a singleton element that is intended to add a11y
|
||||
to features that require on-demand announcement from screen readers. In
|
||||
order to make use of the announcer, it is best to request its availability
|
||||
in the announcing element.
|
||||
|
||||
Example:
|
||||
|
||||
Polymer({
|
||||
|
||||
is: 'x-chatty',
|
||||
|
||||
attached: function() {
|
||||
// This will create the singleton element if it has not
|
||||
// been created yet:
|
||||
Polymer.IronA11yAnnouncer.requestAvailability();
|
||||
}
|
||||
});
|
||||
|
||||
After the `iron-a11y-announcer` has been made available, elements can
|
||||
make announces by firing bubbling `iron-announce` events.
|
||||
|
||||
Example:
|
||||
|
||||
this.fire('iron-announce', {
|
||||
text: 'This is an announcement!'
|
||||
}, { bubbles: true });
|
||||
|
||||
Note: announcements are only audible if you have a screen reader enabled.
|
||||
|
||||
@group Iron Elements
|
||||
@demo demo/index.html
|
||||
-->
|
||||
|
||||
<dom-module id="iron-a11y-announcer">
|
||||
<style>
|
||||
:host {
|
||||
display: inline-block;
|
||||
position: fixed;
|
||||
clip: rect(0px,0px,0px,0px);
|
||||
}
|
||||
</style>
|
||||
|
||||
<template>
|
||||
<div aria-live$="[[mode]]">[[_text]]</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
Polymer.IronA11yAnnouncer = Polymer({
|
||||
is: 'iron-a11y-announcer',
|
||||
|
||||
properties: {
|
||||
|
||||
/**
|
||||
* The value of mode is used to set the `aria-live` attribute
|
||||
* for the element that will be announced. Valid values are: `off`,
|
||||
* `polite` and `assertive`.
|
||||
*/
|
||||
mode: {
|
||||
type: String,
|
||||
value: 'polite'
|
||||
},
|
||||
|
||||
_text: {
|
||||
type: String,
|
||||
value: ''
|
||||
}
|
||||
},
|
||||
|
||||
created: function() {
|
||||
if (!Polymer.IronA11yAnnouncer.instance) {
|
||||
Polymer.IronA11yAnnouncer.instance = this;
|
||||
}
|
||||
|
||||
document.body.addEventListener('iron-announce', this._onIronAnnounce.bind(this));
|
||||
},
|
||||
|
||||
/**
|
||||
* Cause a text string to be announced by screen readers.
|
||||
*
|
||||
* @param {string} text The text that should be announced.
|
||||
*/
|
||||
announce: function(text) {
|
||||
this._text = '';
|
||||
this.async(function() {
|
||||
this._text = text;
|
||||
}, 100);
|
||||
},
|
||||
|
||||
_onIronAnnounce: function(event) {
|
||||
if (event.detail && event.detail.text) {
|
||||
this.announce(event.detail.text);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Polymer.IronA11yAnnouncer.instance = null;
|
||||
|
||||
Polymer.IronA11yAnnouncer.requestAvailability = function() {
|
||||
if (!Polymer.IronA11yAnnouncer.instance) {
|
||||
Polymer.IronA11yAnnouncer.instance = document.createElement('iron-a11y-announcer');
|
||||
}
|
||||
|
||||
document.body.appendChild(Polymer.IronA11yAnnouncer.instance);
|
||||
};
|
||||
})();
|
||||
|
||||
</script>
|
||||
</dom-module>
|
26
react-app/bower_components/iron-a11y-announcer/test/index.html
vendored
Normal file
26
react-app/bower_components/iron-a11y-announcer/test/index.html
vendored
Normal file
@ -0,0 +1,26 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>iron-a11y-announcer tests</title>
|
||||
<script src="../../webcomponentsjs/webcomponents.js"></script>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
WCT.loadSuites([
|
||||
'iron-a11y-announcer.html'
|
||||
]);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
56
react-app/bower_components/iron-a11y-announcer/test/iron-a11y-announcer.html
vendored
Normal file
56
react-app/bower_components/iron-a11y-announcer/test/iron-a11y-announcer.html
vendored
Normal file
@ -0,0 +1,56 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<title>iron-a11y-announcer</title>
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
|
||||
<link rel="import" href="../../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-a11y-announcer.html">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<test-fixture id="Announcer">
|
||||
<template>
|
||||
<iron-a11y-announcer></iron-a11y-announcer>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
suite('<iron-a11y-announcer>', function() {
|
||||
var announcer;
|
||||
|
||||
setup(function() {
|
||||
announcer = fixture('Announcer');
|
||||
});
|
||||
|
||||
test('announces when there is an iron-announce event', function() {
|
||||
var event = new CustomEvent('iron-announce', {
|
||||
bubbles: true,
|
||||
detail: {
|
||||
text: 'foo'
|
||||
}
|
||||
});
|
||||
|
||||
sinon.spy(announcer, 'announce');
|
||||
|
||||
document.body.dispatchEvent(event);
|
||||
|
||||
expect(announcer.announce.callCount).to.be.equal(1);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
48
react-app/bower_components/iron-autogrow-textarea/.bower.json
vendored
Normal file
48
react-app/bower_components/iron-autogrow-textarea/.bower.json
vendored
Normal file
@ -0,0 +1,48 @@
|
||||
{
|
||||
"name": "iron-autogrow-textarea",
|
||||
"version": "1.0.12",
|
||||
"description": "A textarea element that automatically grows with input",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"input",
|
||||
"textarea"
|
||||
],
|
||||
"main": "iron-autogrow-textarea.html",
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/iron-autogrow-textarea.git"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/iron-autogrow-textarea",
|
||||
"ignore": [],
|
||||
"dependencies": {
|
||||
"iron-behaviors": "PolymerElements/iron-behaviors#^1.0.0",
|
||||
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
|
||||
"iron-validatable-behavior": "PolymerElements/iron-validatable-behavior#^1.0.0",
|
||||
"iron-form-element-behavior": "PolymerElements/iron-form-element-behavior#^1.0.0",
|
||||
"polymer": "Polymer/polymer#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
|
||||
"iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.0.0",
|
||||
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0",
|
||||
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
|
||||
"web-component-tester": "^4.0.0",
|
||||
"paper-styles": "PolymerElements/paper-styles#^1.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
},
|
||||
"_release": "1.0.12",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v1.0.12",
|
||||
"commit": "86f8fd61b412bcea6bc7b8feaee9b24bc2ad48ea"
|
||||
},
|
||||
"_source": "git://github.com/PolymerElements/iron-autogrow-textarea.git",
|
||||
"_target": "^1.0.0",
|
||||
"_originalSource": "PolymerElements/iron-autogrow-textarea"
|
||||
}
|
1
react-app/bower_components/iron-autogrow-textarea/.gitignore
vendored
Normal file
1
react-app/bower_components/iron-autogrow-textarea/.gitignore
vendored
Normal file
@ -0,0 +1 @@
|
||||
bower_components
|
25
react-app/bower_components/iron-autogrow-textarea/.travis.yml
vendored
Normal file
25
react-app/bower_components/iron-autogrow-textarea/.travis.yml
vendored
Normal file
@ -0,0 +1,25 @@
|
||||
language: node_js
|
||||
sudo: false
|
||||
before_script:
|
||||
- npm install -g bower polylint web-component-tester
|
||||
- bower install
|
||||
- polylint
|
||||
env:
|
||||
global:
|
||||
- secure: lIogwlz5kFUKYy1OWASXxQgZE4YTyjUY0QcEgnqbv6wQ0GX8wRMgbI3zhbAv+xXU5ieYXg6Bd47ZFZZ1kVEWzQynAdd2od14Eu1vfN60/yc/llz62VTYuFsPt8r+Tgw41Iz8plwejK4a+V26Da5tXW+soJQOJKvE/MOiPzKi2m0=
|
||||
- secure: cj3uSCQwLY6pyP3oTdGFjJoTRjv3G1lSe73fMd6i15XnMMxM4DVarfDtK+a0dPPxDY8BBhfr4sFClZuWX71bAHQuqUA84oigbeWt2xfl8d3HUuvr9aEnQxAGe2eQE7atpYJPC9M447sw48QKiUVgQo33DeJ1BGj6SBqkw0BJXO8=
|
||||
- CXX=g++-4.8
|
||||
node_js: stable
|
||||
addons:
|
||||
firefox: latest
|
||||
apt:
|
||||
sources:
|
||||
- google-chrome
|
||||
- ubuntu-toolchain-r-test
|
||||
packages:
|
||||
- google-chrome-stable
|
||||
- g++-4.8
|
||||
sauce_connect: true
|
||||
script:
|
||||
- xvfb-run wct
|
||||
- "if [ \"${TRAVIS_PULL_REQUEST}\" = \"false\" ]; then wct -s 'default'; fi"
|
77
react-app/bower_components/iron-autogrow-textarea/CONTRIBUTING.md
vendored
Normal file
77
react-app/bower_components/iron-autogrow-textarea/CONTRIBUTING.md
vendored
Normal file
@ -0,0 +1,77 @@
|
||||
|
||||
<!--
|
||||
This file is autogenerated based on
|
||||
https://github.com/PolymerElements/ContributionGuide/blob/master/CONTRIBUTING.md
|
||||
|
||||
If you edit that file, it will get updated everywhere else.
|
||||
If you edit this file, your changes will get overridden :)
|
||||
|
||||
You can however override the jsbin link with one that's customized to this
|
||||
specific element:
|
||||
|
||||
jsbin=https://jsbin.com/cagaye/edit?html,output
|
||||
-->
|
||||
# Polymer Elements
|
||||
## Guide for Contributors
|
||||
|
||||
Polymer Elements are built in the open, and the Polymer authors eagerly encourage any and all forms of community contribution. When contributing, please follow these guidelines:
|
||||
|
||||
### Filing Issues
|
||||
|
||||
**If you are filing an issue to request a feature**, please provide a clear description of the feature. It can be helpful to describe answers to the following questions:
|
||||
|
||||
1. **Who will use the feature?** _“As someone filling out a form…”_
|
||||
2. **When will they use the feature?** _“When I enter an invalid value…”_
|
||||
3. **What is the user’s goal?** _“I want to be visually notified that the value needs to be corrected…”_
|
||||
|
||||
**If you are filing an issue to report a bug**, please provide:
|
||||
|
||||
1. **A clear description of the bug and related expectations.** Consider using the following example template for reporting a bug:
|
||||
|
||||
```markdown
|
||||
The `paper-foo` element causes the page to turn pink when clicked.
|
||||
|
||||
## Expected outcome
|
||||
|
||||
The page stays the same color.
|
||||
|
||||
## Actual outcome
|
||||
|
||||
The page turns pink.
|
||||
|
||||
## Steps to reproduce
|
||||
|
||||
1. Put a `paper-foo` element in the page.
|
||||
2. Open the page in a web browser.
|
||||
3. Click the `paper-foo` element.
|
||||
```
|
||||
|
||||
2. **A reduced test case that demonstrates the problem.** If possible, please include the test case as a JSBin. Start with this template to easily import and use relevant Polymer Elements: [https://jsbin.com/cagaye/edit?html,output](https://jsbin.com/cagaye/edit?html,output).
|
||||
|
||||
3. **A list of browsers where the problem occurs.** This can be skipped if the problem is the same across all browsers.
|
||||
|
||||
### Submitting Pull Requests
|
||||
|
||||
**Before creating a pull request**, please ensure that an issue exists for the corresponding change in the pull request that you intend to make. **If an issue does not exist, please create one per the guidelines above**. The goal is to discuss the design and necessity of the proposed change with Polymer authors and community before diving into a pull request.
|
||||
|
||||
When submitting pull requests, please provide:
|
||||
|
||||
1. **A reference to the corresponding issue** or issues that will be closed by the pull request. Please refer to these issues in the pull request description using the following syntax:
|
||||
|
||||
```markdown
|
||||
(For a single issue)
|
||||
Fixes #20
|
||||
|
||||
(For multiple issues)
|
||||
Fixes #32, fixes #40
|
||||
```
|
||||
|
||||
2. **A succinct description of the design** used to fix any related issues. For example:
|
||||
|
||||
```markdown
|
||||
This fixes #20 by removing styles that leaked which would cause the page to turn pink whenever `paper-foo` is clicked.
|
||||
```
|
||||
|
||||
3. **At least one test for each bug fixed or feature added** as part of the pull request. Pull requests that fix bugs or add features without accompanying tests will not be considered.
|
||||
|
||||
If a proposed change contains multiple commits, please [squash commits](https://www.google.com/url?q=http://blog.steveklabnik.com/posts/2012-11-08-how-to-squash-commits-in-a-github-pull-request) to as few as is necessary to succinctly express the change. A Polymer author can help you squash commits, so don’t be afraid to ask us if you need help with that!
|
44
react-app/bower_components/iron-autogrow-textarea/README.md
vendored
Normal file
44
react-app/bower_components/iron-autogrow-textarea/README.md
vendored
Normal file
@ -0,0 +1,44 @@
|
||||
|
||||
<!---
|
||||
|
||||
This README is automatically generated from the comments in these files:
|
||||
iron-autogrow-textarea.html
|
||||
|
||||
Edit those files, and our readme bot will duplicate them over here!
|
||||
Edit this file, and the bot will squash your changes :)
|
||||
|
||||
The bot does some handling of markdown. Please file a bug if it does the wrong
|
||||
thing! https://github.com/PolymerLabs/tedium/issues
|
||||
|
||||
-->
|
||||
|
||||
[](https://travis-ci.org/PolymerElements/iron-autogrow-textarea)
|
||||
|
||||
_[Demo and API docs](https://elements.polymer-project.org/elements/iron-autogrow-textarea)_
|
||||
|
||||
|
||||
##<iron-autogrow-textarea>
|
||||
|
||||
`iron-autogrow-textarea` is an element containing a textarea that grows in height as more
|
||||
lines of input are entered. Unless an explicit height or the `maxRows` property is set, it will
|
||||
never scroll.
|
||||
|
||||
Example:
|
||||
|
||||
```html
|
||||
<iron-autogrow-textarea></iron-autogrow-textarea>
|
||||
```
|
||||
|
||||
Because the `textarea`'s `value` property is not observable, you should use
|
||||
this element's `bind-value` instead for imperative updates.
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
| Custom property | Description | Default |
|
||||
| --- | --- | --- |
|
||||
| `--iron-autogrow-textarea` | Mixin applied to the textarea | `{}` |
|
||||
| `--iron-autogrow-textarea-placeholder` | Mixin applied to the textarea placeholder | `{}` |
|
||||
|
||||
|
39
react-app/bower_components/iron-autogrow-textarea/bower.json
vendored
Normal file
39
react-app/bower_components/iron-autogrow-textarea/bower.json
vendored
Normal file
@ -0,0 +1,39 @@
|
||||
{
|
||||
"name": "iron-autogrow-textarea",
|
||||
"version": "1.0.12",
|
||||
"description": "A textarea element that automatically grows with input",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"input",
|
||||
"textarea"
|
||||
],
|
||||
"main": "iron-autogrow-textarea.html",
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/iron-autogrow-textarea.git"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/iron-autogrow-textarea",
|
||||
"ignore": [],
|
||||
"dependencies": {
|
||||
"iron-behaviors": "PolymerElements/iron-behaviors#^1.0.0",
|
||||
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
|
||||
"iron-validatable-behavior": "PolymerElements/iron-validatable-behavior#^1.0.0",
|
||||
"iron-form-element-behavior": "PolymerElements/iron-form-element-behavior#^1.0.0",
|
||||
"polymer": "Polymer/polymer#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
|
||||
"iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.0.0",
|
||||
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0",
|
||||
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
|
||||
"web-component-tester": "^4.0.0",
|
||||
"paper-styles": "PolymerElements/paper-styles#^1.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
}
|
||||
}
|
111
react-app/bower_components/iron-autogrow-textarea/demo/index.html
vendored
Normal file
111
react-app/bower_components/iron-autogrow-textarea/demo/index.html
vendored
Normal file
@ -0,0 +1,111 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
|
||||
<title>iron-autogrow-textarea demo</title>
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<link rel="import" href="../../iron-demo-helpers/demo-snippet.html">
|
||||
<link rel="import" href="../../iron-demo-helpers/demo-pages-shared-styles.html">
|
||||
<link rel="import" href="../iron-autogrow-textarea.html">
|
||||
|
||||
<style is="custom-style" include="demo-pages-shared-styles">
|
||||
iron-autogrow-textarea {
|
||||
display: block;
|
||||
width: 200px;
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.vertical-section {
|
||||
box-sizing: border-box;
|
||||
width: 400px;
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body unresolved>
|
||||
<div class="vertical-section-container centered">
|
||||
<h3>An iron-autogrow-textarea grows automatically as more text is entered</h3>
|
||||
<demo-snippet class="centered-demo">
|
||||
<template>
|
||||
<iron-autogrow-textarea></iron-autogrow-textarea>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h3>The maximum height can be controlled either through the <i>max-rows</i>
|
||||
property, or through a fixed max height</h3>
|
||||
<demo-snippet class="centered-demo">
|
||||
<template>
|
||||
<iron-autogrow-textarea max-rows="4" placeholder="scrolls after 4 rows"></iron-autogrow-textarea>
|
||||
<iron-autogrow-textarea style="max-height: 50px;" placeholder="scrolls after 50px"></iron-autogrow-textarea>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h3>The initial height can also be controlled using the <i>rows</i> property,
|
||||
or through a fixed height</h3>
|
||||
<demo-snippet class="centered-demo">
|
||||
<template>
|
||||
<iron-autogrow-textarea rows="4" placeholder="start with 4 rows"></iron-autogrow-textarea>
|
||||
<iron-autogrow-textarea style="height: 50px;"></iron-autogrow-textarea>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h3>Example of updating the value imperatively</h3>
|
||||
<!-- TODO: replace this with a demo-snippet when https://github.com/webcomponents/webcomponentsjs/issues/362
|
||||
is fixed -->
|
||||
<div class="example">
|
||||
<template is="dom-bind">
|
||||
<div class="vertical-section">
|
||||
<iron-autogrow-textarea bind-value="{{bindValue}}" id="a1"></iron-autogrow-textarea>
|
||||
<br>
|
||||
<code>bind-value</code>: <span>[[bindValue]]</span>
|
||||
<p on-click="setValue">
|
||||
Imperatively changing <code>bind-value</code> will also update
|
||||
<code>textarea.value</code>:<br>
|
||||
<textarea></textarea>
|
||||
<button value="bindValue">set</button>
|
||||
<br><br>
|
||||
|
||||
Imperatively updating <code>textarea.value</code> will update
|
||||
the display, but not update <code>bind-value</code>:<br>
|
||||
<textarea></textarea>
|
||||
<button value="value">set</button>
|
||||
</p>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var scope = document.querySelector('template[is=dom-bind]');
|
||||
|
||||
scope.setValue = function(event) {
|
||||
if (!(event.target instanceof HTMLButtonElement)) {
|
||||
return;
|
||||
}
|
||||
var inputValue = event.target.previousElementSibling.value;
|
||||
if (event.target.value == "bindValue") {
|
||||
document.querySelector('#a1').bindValue = inputValue;
|
||||
} else {
|
||||
document.querySelector('#a1').textarea.value = inputValue;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
33
react-app/bower_components/iron-autogrow-textarea/hero.svg
vendored
Executable file
33
react-app/bower_components/iron-autogrow-textarea/hero.svg
vendored
Executable file
@ -0,0 +1,33 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 225 126" enable-background="new 0 0 225 126" xml:space="preserve">
|
||||
<g id="background" display="none">
|
||||
<rect display="inline" fill="#B0BEC5" width="225" height="126"/>
|
||||
</g>
|
||||
<g id="label">
|
||||
</g>
|
||||
<g id="art">
|
||||
<path d="M140,47c-3,0-4.7-2.4-6.2-4.4c-1.3-1.9-2.4-3.6-4.7-3.6c-2.3,0-3.4,1.7-4.7,3.6c-1.5,2.1-3.1,4.4-6.4,4.4
|
||||
c-3.3,0-4.9-2.4-6.4-4.4c-1.3-1.9-2.5-3.6-4.8-3.6c-2.3,0-3.4,1.7-4.8,3.6c-1.5,2.1-3.1,4.4-6.4,4.4s-5.2-2.4-6.7-4.4
|
||||
c-1.3-1.9-2-3.6-5-3.6v-2c4,0,5.2,2.4,6.7,4.4c1.3,1.9,2.6,3.6,4.9,3.6c2.3,0,3.5-1.7,4.8-3.6c1.5-2.1,3.1-4.4,6.5-4.4
|
||||
s5,2.4,6.4,4.4c1.3,1.9,2.5,3.6,4.8,3.6c2.3,0,3.4-1.7,4.8-3.6c1.5-2.1,3.1-4.4,6.4-4.4c3.3,0,4.7,2.4,6.2,4.4
|
||||
c1.3,1.9,2.5,3.6,4.5,3.6V47z"/>
|
||||
<path d="M140,65c-3,0-4.7-2.4-6.2-4.4c-1.3-1.9-2.4-3.6-4.7-3.6c-2.3,0-3.4,1.7-4.7,3.6c-1.5,2.1-3.1,4.4-6.4,4.4
|
||||
c-3.3,0-4.9-2.4-6.4-4.4c-1.3-1.9-2.5-3.6-4.8-3.6c-2.3,0-3.4,1.7-4.8,3.6c-1.5,2.1-3.1,4.4-6.4,4.4s-5.2-2.4-6.7-4.4
|
||||
c-1.3-1.9-2-3.6-5-3.6v-2c4,0,5.2,2.4,6.7,4.4c1.3,1.9,2.6,3.6,4.9,3.6c2.3,0,3.5-1.7,4.8-3.6c1.5-2.1,3.1-4.4,6.5-4.4
|
||||
s5,2.4,6.4,4.4c1.3,1.9,2.5,3.6,4.8,3.6c2.3,0,3.4-1.7,4.8-3.6c1.5-2.1,3.1-4.4,6.4-4.4c3.3,0,4.7,2.4,6.2,4.4
|
||||
c1.3,1.9,2.5,3.6,4.5,3.6V65z"/>
|
||||
<path d="M140,83c-3,0-4.7-2.4-6.2-4.4c-1.3-1.9-2.4-3.6-4.7-3.6c-2.3,0-3.4,1.7-4.7,3.6c-1.5,2.1-3.1,4.4-6.4,4.4
|
||||
c-3.3,0-4.9-2.4-6.4-4.4c-1.3-1.9-2.5-3.6-4.8-3.6c-2.3,0-3.4,1.7-4.8,3.6c-1.5,2.1-3.1,4.4-6.4,4.4s-5.2-2.4-6.7-4.4
|
||||
c-1.3-1.9-2-3.6-5-3.6v-2c4,0,5.2,2.4,6.7,4.4c1.3,1.9,2.6,3.6,4.9,3.6c2.3,0,3.5-1.7,4.8-3.6c1.5-2.1,3.1-4.4,6.5-4.4
|
||||
s5,2.4,6.4,4.4c1.3,1.9,2.5,3.6,4.8,3.6c2.3,0,3.4-1.7,4.8-3.6c1.5-2.1,3.1-4.4,6.4-4.4c3.3,0,4.7,2.4,6.2,4.4
|
||||
c1.3,1.9,2.5,3.6,4.5,3.6V83z"/>
|
||||
<g id="ic_x5F_add_x0D_">
|
||||
</g>
|
||||
<path d="M151,102H73V24h78V102z M75,100h74V26H75V100z"/>
|
||||
</g>
|
||||
<g id="Guides">
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 2.1 KiB |
30
react-app/bower_components/iron-autogrow-textarea/index.html
vendored
Normal file
30
react-app/bower_components/iron-autogrow-textarea/index.html
vendored
Normal file
@ -0,0 +1,30 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
||||
|
||||
<title>iron-autogrow-textarea</title>
|
||||
|
||||
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-component-page/iron-component-page.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<iron-component-page></iron-component-page>
|
||||
|
||||
</body>
|
||||
</html>
|
353
react-app/bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html
vendored
Normal file
353
react-app/bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html
vendored
Normal file
@ -0,0 +1,353 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-behaviors/iron-control-state.html">
|
||||
<link rel="import" href="../iron-flex-layout/iron-flex-layout.html">
|
||||
<link rel="import" href="../iron-validatable-behavior/iron-validatable-behavior.html">
|
||||
<link rel="import" href="../iron-form-element-behavior/iron-form-element-behavior.html">
|
||||
|
||||
<!--
|
||||
`iron-autogrow-textarea` is an element containing a textarea that grows in height as more
|
||||
lines of input are entered. Unless an explicit height or the `maxRows` property is set, it will
|
||||
never scroll.
|
||||
|
||||
Example:
|
||||
|
||||
<iron-autogrow-textarea></iron-autogrow-textarea>
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
Custom property | Description | Default
|
||||
----------------|-------------|----------
|
||||
`--iron-autogrow-textarea` | Mixin applied to the textarea | `{}`
|
||||
`--iron-autogrow-textarea-placeholder` | Mixin applied to the textarea placeholder | `{}`
|
||||
|
||||
@group Iron Elements
|
||||
@hero hero.svg
|
||||
@demo demo/index.html
|
||||
-->
|
||||
|
||||
<dom-module id="iron-autogrow-textarea">
|
||||
|
||||
<style>
|
||||
:host {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
width: 400px;
|
||||
border: 1px solid;
|
||||
padding: 2px;
|
||||
-moz-appearance: textarea;
|
||||
-webkit-appearance: textarea;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.mirror-text {
|
||||
visibility: hidden;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.fit {
|
||||
@apply(--layout-fit);
|
||||
}
|
||||
|
||||
textarea {
|
||||
position: relative;
|
||||
outline: none;
|
||||
border: none;
|
||||
resize: none;
|
||||
background: inherit;
|
||||
color: inherit;
|
||||
/* see comments in template */
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: inherit;
|
||||
font-family: inherit;
|
||||
line-height: inherit;
|
||||
text-align: inherit;
|
||||
@apply(--iron-autogrow-textarea);
|
||||
}
|
||||
|
||||
::content textarea:invalid {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
textarea::-webkit-input-placeholder {
|
||||
@apply(--iron-autogrow-textarea-placeholder);
|
||||
}
|
||||
|
||||
textarea:-moz-placeholder {
|
||||
@apply(--iron-autogrow-textarea-placeholder);
|
||||
}
|
||||
|
||||
textarea::-moz-placeholder {
|
||||
@apply(--iron-autogrow-textarea-placeholder);
|
||||
}
|
||||
|
||||
textarea:-ms-input-placeholder {
|
||||
@apply(--iron-autogrow-textarea-placeholder);
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<!-- the mirror sizes the input/textarea so it grows with typing -->
|
||||
<!-- use   instead of to allow this element to be used in XHTML -->
|
||||
<div id="mirror" class="mirror-text" aria-hidden="true"> </div>
|
||||
|
||||
<!-- size the input/textarea with a div, because the textarea has intrinsic size in ff -->
|
||||
<div class="textarea-container fit">
|
||||
<textarea id="textarea"
|
||||
name$="[[name]]"
|
||||
autocomplete$="[[autocomplete]]"
|
||||
autofocus$="[[autofocus]]"
|
||||
inputmode$="[[inputmode]]"
|
||||
placeholder$="[[placeholder]]"
|
||||
readonly$="[[readonly]]"
|
||||
required$="[[required]]"
|
||||
disabled$="[[disabled]]"
|
||||
rows$="[[rows]]"
|
||||
maxlength$="[[maxlength]]"></textarea>
|
||||
</div>
|
||||
</template>
|
||||
</dom-module>
|
||||
|
||||
<script>
|
||||
|
||||
Polymer({
|
||||
|
||||
is: 'iron-autogrow-textarea',
|
||||
|
||||
behaviors: [
|
||||
Polymer.IronFormElementBehavior,
|
||||
Polymer.IronValidatableBehavior,
|
||||
Polymer.IronControlState
|
||||
],
|
||||
|
||||
properties: {
|
||||
|
||||
/**
|
||||
* Use this property instead of `value` for two-way data binding.
|
||||
* This property will be deprecated in the future. Use `value` instead.
|
||||
* @type {string|number}
|
||||
*/
|
||||
bindValue: {
|
||||
observer: '_bindValueChanged',
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* The initial number of rows.
|
||||
*
|
||||
* @attribute rows
|
||||
* @type number
|
||||
* @default 1
|
||||
*/
|
||||
rows: {
|
||||
type: Number,
|
||||
value: 1,
|
||||
observer: '_updateCached'
|
||||
},
|
||||
|
||||
/**
|
||||
* The maximum number of rows this element can grow to until it
|
||||
* scrolls. 0 means no maximum.
|
||||
*
|
||||
* @attribute maxRows
|
||||
* @type number
|
||||
* @default 0
|
||||
*/
|
||||
maxRows: {
|
||||
type: Number,
|
||||
value: 0,
|
||||
observer: '_updateCached'
|
||||
},
|
||||
|
||||
/**
|
||||
* Bound to the textarea's `autocomplete` attribute.
|
||||
*/
|
||||
autocomplete: {
|
||||
type: String,
|
||||
value: 'off'
|
||||
},
|
||||
|
||||
/**
|
||||
* Bound to the textarea's `autofocus` attribute.
|
||||
*/
|
||||
autofocus: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* Bound to the textarea's `inputmode` attribute.
|
||||
*/
|
||||
inputmode: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* Bound to the textarea's `placeholder` attribute.
|
||||
*/
|
||||
placeholder: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* Bound to the textarea's `readonly` attribute.
|
||||
*/
|
||||
readonly: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to mark the textarea as required.
|
||||
*/
|
||||
required: {
|
||||
type: Boolean
|
||||
},
|
||||
|
||||
/**
|
||||
* The maximum length of the input value.
|
||||
*/
|
||||
maxlength: {
|
||||
type: Number
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
listeners: {
|
||||
'input': '_onInput'
|
||||
},
|
||||
|
||||
observers: [
|
||||
'_onValueChanged(value)'
|
||||
],
|
||||
|
||||
/**
|
||||
* Returns the underlying textarea.
|
||||
* @type HTMLTextAreaElement
|
||||
*/
|
||||
get textarea() {
|
||||
return this.$.textarea;
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns textarea's selection start.
|
||||
* @type Number
|
||||
*/
|
||||
get selectionStart() {
|
||||
return this.$.textarea.selectionStart;
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns textarea's selection end.
|
||||
* @type Number
|
||||
*/
|
||||
get selectionEnd() {
|
||||
return this.$.textarea.selectionEnd;
|
||||
},
|
||||
|
||||
/**
|
||||
* Sets the textarea's selection start.
|
||||
*/
|
||||
set selectionStart(value) {
|
||||
this.$.textarea.selectionStart = value;
|
||||
},
|
||||
|
||||
/**
|
||||
* Sets the textarea's selection end.
|
||||
*/
|
||||
set selectionEnd(value) {
|
||||
this.$.textarea.selectionEnd = value;
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns true if `value` is valid. The validator provided in `validator`
|
||||
* will be used first, if it exists; otherwise, the `textarea`'s validity
|
||||
* is used.
|
||||
* @return {boolean} True if the value is valid.
|
||||
*/
|
||||
validate: function() {
|
||||
// Empty, non-required input is valid.
|
||||
if (!this.required && this.value == '') {
|
||||
this.invalid = false;
|
||||
return true;
|
||||
}
|
||||
|
||||
var valid;
|
||||
if (this.hasValidator()) {
|
||||
valid = Polymer.IronValidatableBehavior.validate.call(this, this.value);
|
||||
} else {
|
||||
valid = this.$.textarea.validity.valid;
|
||||
this.invalid = !valid;
|
||||
}
|
||||
this.fire('iron-input-validate');
|
||||
return valid;
|
||||
},
|
||||
|
||||
_bindValueChanged: function() {
|
||||
var textarea = this.textarea;
|
||||
if (!textarea) {
|
||||
return;
|
||||
}
|
||||
|
||||
// If the bindValue changed manually, then we need to also update
|
||||
// the underlying textarea's value. Otherwise this change was probably
|
||||
// generated from the _onInput handler, and the two values are already
|
||||
// the same.
|
||||
if (textarea.value !== this.bindValue) {
|
||||
textarea.value = !(this.bindValue || this.bindValue === 0) ? '' : this.bindValue;
|
||||
}
|
||||
|
||||
this.value = this.bindValue;
|
||||
this.$.mirror.innerHTML = this._valueForMirror();
|
||||
// manually notify because we don't want to notify until after setting value
|
||||
this.fire('bind-value-changed', {value: this.bindValue});
|
||||
},
|
||||
|
||||
_onInput: function(event) {
|
||||
this.bindValue = event.path ? event.path[0].value : event.target.value;
|
||||
},
|
||||
|
||||
_constrain: function(tokens) {
|
||||
var _tokens;
|
||||
tokens = tokens || [''];
|
||||
// Enforce the min and max heights for a multiline input to avoid measurement
|
||||
if (this.maxRows > 0 && tokens.length > this.maxRows) {
|
||||
_tokens = tokens.slice(0, this.maxRows);
|
||||
} else {
|
||||
_tokens = tokens.slice(0);
|
||||
}
|
||||
while (this.rows > 0 && _tokens.length < this.rows) {
|
||||
_tokens.push('');
|
||||
}
|
||||
// Use   instead of to allow this element to be used in XHTML.
|
||||
return _tokens.join('<br/>') + ' ';
|
||||
},
|
||||
|
||||
_valueForMirror: function() {
|
||||
var input = this.textarea;
|
||||
if (!input) {
|
||||
return;
|
||||
}
|
||||
this.tokens = (input && input.value) ? input.value.replace(/&/gm, '&').replace(/"/gm, '"').replace(/'/gm, ''').replace(/</gm, '<').replace(/>/gm, '>').split('\n') : [''];
|
||||
return this._constrain(this.tokens);
|
||||
},
|
||||
|
||||
_updateCached: function() {
|
||||
this.$.mirror.innerHTML = this._constrain(this.tokens);
|
||||
},
|
||||
|
||||
_onValueChanged: function() {
|
||||
this.bindValue = this.value;
|
||||
}
|
||||
});
|
||||
</script>
|
190
react-app/bower_components/iron-autogrow-textarea/test/basic.html
vendored
Normal file
190
react-app/bower_components/iron-autogrow-textarea/test/basic.html
vendored
Normal file
@ -0,0 +1,190 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>iron-autogrow-textarea tests</title>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
<script src="../../iron-test-helpers/mock-interactions.js"></script>
|
||||
<link rel="import" href="../iron-autogrow-textarea.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<test-fixture id="basic">
|
||||
<template>
|
||||
<iron-autogrow-textarea></iron-autogrow-textarea>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="has-bindValue">
|
||||
<template>
|
||||
<iron-autogrow-textarea bind-value="foobar"></iron-autogrow-textarea>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="has-value">
|
||||
<template>
|
||||
<iron-autogrow-textarea value="foobar"></iron-autogrow-textarea>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="rows">
|
||||
<template>
|
||||
<iron-autogrow-textarea rows="3"></iron-autogrow-textarea>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
|
||||
suite('basic', function() {
|
||||
|
||||
test('setting bindValue sets textarea value', function() {
|
||||
var autogrow = fixture('basic');
|
||||
var textarea = autogrow.textarea;
|
||||
|
||||
autogrow.bindValue = 'batman';
|
||||
assert.equal(textarea.value, autogrow.bindValue, 'textarea value equals to bindValue');
|
||||
});
|
||||
|
||||
test('can set an initial bindValue', function() {
|
||||
var autogrow = fixture('has-bindValue');
|
||||
assert.equal(autogrow.textarea.value, 'foobar', 'textarea value equals to initial bindValue');
|
||||
assert.equal(autogrow.value, 'foobar', 'value equals to initial bindValue');
|
||||
});
|
||||
|
||||
test('can set an initial value', function() {
|
||||
var autogrow = fixture('has-value');
|
||||
assert.equal(autogrow.textarea.value, 'foobar', 'textarea value equals to initial bindValue');
|
||||
assert.equal(autogrow.bindValue, 'foobar', 'textarea bindValue equals to initial value');
|
||||
});
|
||||
|
||||
test('can update the value', function() {
|
||||
var autogrow = fixture('has-bindValue');
|
||||
assert.equal(autogrow.textarea.value, 'foobar', 'textarea value equals to initial bindValue');
|
||||
autogrow.value = 'batman';
|
||||
assert.equal(autogrow.textarea.value, 'batman', 'textarea value is updated');
|
||||
assert.equal(autogrow.bindValue, 'batman', 'bindValue is updated');
|
||||
assert.equal(autogrow.value, 'batman', 'value is updated');
|
||||
});
|
||||
|
||||
test('can update the bindValue', function() {
|
||||
var autogrow = fixture('has-bindValue');
|
||||
assert.equal(autogrow.textarea.value, 'foobar', 'textarea value equals to initial bindValue');
|
||||
autogrow.bindValue = 'batman';
|
||||
assert.equal(autogrow.textarea.value, 'batman', 'textarea value is updated');
|
||||
assert.equal(autogrow.bindValue, 'batman', 'bindValue is updated');
|
||||
assert.equal(autogrow.value, 'batman', 'value is updated');
|
||||
});
|
||||
|
||||
test('can set an initial number of rows', function() {
|
||||
var autogrow = fixture("rows");
|
||||
assert.equal(autogrow.textarea.rows, 3, 'textarea has rows=3');
|
||||
});
|
||||
|
||||
test('adding rows grows the textarea', function() {
|
||||
var autogrow = fixture('basic');
|
||||
var initialHeight = autogrow.offsetHeight;
|
||||
|
||||
autogrow.bindValue = 'batman\nand\nrobin';
|
||||
var finalHeight = autogrow.offsetHeight
|
||||
assert.isTrue(finalHeight > initialHeight);
|
||||
});
|
||||
|
||||
test('removing rows shrinks the textarea', function() {
|
||||
var autogrow = fixture('basic');
|
||||
autogrow.bindValue = 'batman\nand\nrobin';
|
||||
var initialHeight = autogrow.offsetHeight;
|
||||
|
||||
autogrow.bindValue = 'batman';
|
||||
var finalHeight = autogrow.offsetHeight
|
||||
assert.isTrue(finalHeight < initialHeight);
|
||||
});
|
||||
|
||||
test('an undefined bindValue is the empty string', function() {
|
||||
var autogrow = fixture('basic');
|
||||
var initialHeight = autogrow.offsetHeight;
|
||||
|
||||
autogrow.bindValue = 'batman\nand\nrobin';
|
||||
var finalHeight = autogrow.offsetHeight;
|
||||
assert.isTrue(finalHeight > initialHeight);
|
||||
|
||||
autogrow.bindValue = undefined;
|
||||
assert.equal(autogrow.offsetHeight, initialHeight);
|
||||
assert.equal(autogrow.textarea.value, '');
|
||||
});
|
||||
|
||||
test('textarea selection works', function() {
|
||||
var autogrow = fixture('basic');
|
||||
var textarea = autogrow.textarea;
|
||||
autogrow.bindValue = 'batman\nand\nrobin';
|
||||
|
||||
autogrow.selectionStart = 3;
|
||||
autogrow.selectionEnd = 5;
|
||||
|
||||
assert.equal(textarea.selectionStart, 3);
|
||||
assert.equal(textarea.selectionEnd, 5);
|
||||
});
|
||||
});
|
||||
|
||||
suite('focus/blur events', function() {
|
||||
var input;
|
||||
|
||||
setup(function() {
|
||||
input = fixture('basic');
|
||||
});
|
||||
|
||||
test('focus/blur events fired on host element', function(done) {
|
||||
var nFocusEvents = 0;
|
||||
var nBlurEvents = 0;
|
||||
input.addEventListener('focus', function() {
|
||||
nFocusEvents += 1;
|
||||
// setTimeout to wait for potentially more, erroneous events
|
||||
setTimeout(function() {
|
||||
assert.equal(nFocusEvents, 1, 'one focus event fired');
|
||||
MockInteractions.blur(input.textarea);
|
||||
});
|
||||
});
|
||||
input.addEventListener('blur', function() {
|
||||
nBlurEvents += 1;
|
||||
// setTimeout to wait for potentially more, erroneous events
|
||||
setTimeout(function() {
|
||||
assert.equal(nBlurEvents, 1, 'one blur event fired');
|
||||
done();
|
||||
});
|
||||
});
|
||||
MockInteractions.focus(input.textarea);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
suite('validation', function() {
|
||||
test('a required textarea with no text is invalid', function() {
|
||||
var input = fixture('basic');
|
||||
input.required = true;
|
||||
assert.isFalse(input.validate());
|
||||
|
||||
input.bindValue = 'batman';
|
||||
assert.isTrue(input.validate());
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
24
react-app/bower_components/iron-autogrow-textarea/test/index.html
vendored
Normal file
24
react-app/bower_components/iron-autogrow-textarea/test/index.html
vendored
Normal file
@ -0,0 +1,24 @@
|
||||
<!DOCTYPE html><!--
|
||||
@license
|
||||
Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
--><html><head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
||||
<title>iron-autogrow-textarea tests</title>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
WCT.loadSuites([
|
||||
'basic.html',
|
||||
'basic.html?dom=shadow'
|
||||
]);
|
||||
</script>
|
||||
|
||||
|
||||
</body></html>
|
44
react-app/bower_components/iron-input/.bower.json
vendored
Normal file
44
react-app/bower_components/iron-input/.bower.json
vendored
Normal file
@ -0,0 +1,44 @@
|
||||
{
|
||||
"name": "iron-input",
|
||||
"version": "1.0.9",
|
||||
"description": "An input element with data binding",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"input"
|
||||
],
|
||||
"main": "iron-input.html",
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/iron-input.git"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/iron-input",
|
||||
"ignore": [],
|
||||
"dependencies": {
|
||||
"iron-a11y-announcer": "PolymerElements/iron-a11y-announcer#^1.0.0",
|
||||
"iron-validatable-behavior": "PolymerElements/iron-validatable-behavior#^1.0.0",
|
||||
"polymer": "Polymer/polymer#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"paper-styles": "polymerelements/paper-styles#^1.0.2",
|
||||
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
|
||||
"iron-validator-behavior": "PolymerElements/iron-validator-behavior#^1.0.0",
|
||||
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
|
||||
"web-component-tester": "^4.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
},
|
||||
"_release": "1.0.9",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v1.0.9",
|
||||
"commit": "6565b5d1b5f7030eb05378718163def8e9c709b7"
|
||||
},
|
||||
"_source": "git://github.com/PolymerElements/iron-input.git",
|
||||
"_target": "^1.0.0",
|
||||
"_originalSource": "PolymerElements/iron-input"
|
||||
}
|
1
react-app/bower_components/iron-input/.gitignore
vendored
Normal file
1
react-app/bower_components/iron-input/.gitignore
vendored
Normal file
@ -0,0 +1 @@
|
||||
bower_components
|
25
react-app/bower_components/iron-input/.travis.yml
vendored
Normal file
25
react-app/bower_components/iron-input/.travis.yml
vendored
Normal file
@ -0,0 +1,25 @@
|
||||
language: node_js
|
||||
sudo: false
|
||||
before_script:
|
||||
- npm install -g bower polylint web-component-tester
|
||||
- bower install
|
||||
- polylint
|
||||
env:
|
||||
global:
|
||||
- secure: AnFRDBxxASn2RP4u+CHJS04g2klVTM+YL1fgNfkNIiECChymGRkeBiF7zvWPfodqPGKWhBZPAMxVuFKbztawQ95kWlbPSTNJtWhHhPcRarV5AYvjhyUV372E3REZ4CGt+T8nghD9bdJiMX5x0pXAz+wfBPPpiHwbiSPPjFLFvTs=
|
||||
- secure: SvsE+VQL35CZ967ZVy0+7o5xclnBM8egjhsjNRG7WxVPZQboCQ3Xwm8tIDQSWeagM3ZQRkTGca4ta91F1ZEhm4Jdt5CwKhhSNC6JgS3CX819r9UKgUnSS3nvWdqcZq4GXcMoOZm4qE9ttd3xdoKCfkLRQlEGAvM2TEw69mBhj24=
|
||||
- CXX=g++-4.8
|
||||
node_js: stable
|
||||
addons:
|
||||
firefox: latest
|
||||
apt:
|
||||
sources:
|
||||
- google-chrome
|
||||
- ubuntu-toolchain-r-test
|
||||
packages:
|
||||
- google-chrome-stable
|
||||
- g++-4.8
|
||||
sauce_connect: true
|
||||
script:
|
||||
- xvfb-run wct
|
||||
- "if [ \"${TRAVIS_PULL_REQUEST}\" = \"false\" ]; then wct -s 'default'; fi"
|
77
react-app/bower_components/iron-input/CONTRIBUTING.md
vendored
Normal file
77
react-app/bower_components/iron-input/CONTRIBUTING.md
vendored
Normal file
@ -0,0 +1,77 @@
|
||||
|
||||
<!--
|
||||
This file is autogenerated based on
|
||||
https://github.com/PolymerElements/ContributionGuide/blob/master/CONTRIBUTING.md
|
||||
|
||||
If you edit that file, it will get updated everywhere else.
|
||||
If you edit this file, your changes will get overridden :)
|
||||
|
||||
You can however override the jsbin link with one that's customized to this
|
||||
specific element:
|
||||
|
||||
jsbin=https://jsbin.com/cagaye/edit?html,output
|
||||
-->
|
||||
# Polymer Elements
|
||||
## Guide for Contributors
|
||||
|
||||
Polymer Elements are built in the open, and the Polymer authors eagerly encourage any and all forms of community contribution. When contributing, please follow these guidelines:
|
||||
|
||||
### Filing Issues
|
||||
|
||||
**If you are filing an issue to request a feature**, please provide a clear description of the feature. It can be helpful to describe answers to the following questions:
|
||||
|
||||
1. **Who will use the feature?** _“As someone filling out a form…”_
|
||||
2. **When will they use the feature?** _“When I enter an invalid value…”_
|
||||
3. **What is the user’s goal?** _“I want to be visually notified that the value needs to be corrected…”_
|
||||
|
||||
**If you are filing an issue to report a bug**, please provide:
|
||||
|
||||
1. **A clear description of the bug and related expectations.** Consider using the following example template for reporting a bug:
|
||||
|
||||
```markdown
|
||||
The `paper-foo` element causes the page to turn pink when clicked.
|
||||
|
||||
## Expected outcome
|
||||
|
||||
The page stays the same color.
|
||||
|
||||
## Actual outcome
|
||||
|
||||
The page turns pink.
|
||||
|
||||
## Steps to reproduce
|
||||
|
||||
1. Put a `paper-foo` element in the page.
|
||||
2. Open the page in a web browser.
|
||||
3. Click the `paper-foo` element.
|
||||
```
|
||||
|
||||
2. **A reduced test case that demonstrates the problem.** If possible, please include the test case as a JSBin. Start with this template to easily import and use relevant Polymer Elements: [https://jsbin.com/cagaye/edit?html,output](https://jsbin.com/cagaye/edit?html,output).
|
||||
|
||||
3. **A list of browsers where the problem occurs.** This can be skipped if the problem is the same across all browsers.
|
||||
|
||||
### Submitting Pull Requests
|
||||
|
||||
**Before creating a pull request**, please ensure that an issue exists for the corresponding change in the pull request that you intend to make. **If an issue does not exist, please create one per the guidelines above**. The goal is to discuss the design and necessity of the proposed change with Polymer authors and community before diving into a pull request.
|
||||
|
||||
When submitting pull requests, please provide:
|
||||
|
||||
1. **A reference to the corresponding issue** or issues that will be closed by the pull request. Please refer to these issues in the pull request description using the following syntax:
|
||||
|
||||
```markdown
|
||||
(For a single issue)
|
||||
Fixes #20
|
||||
|
||||
(For multiple issues)
|
||||
Fixes #32, fixes #40
|
||||
```
|
||||
|
||||
2. **A succinct description of the design** used to fix any related issues. For example:
|
||||
|
||||
```markdown
|
||||
This fixes #20 by removing styles that leaked which would cause the page to turn pink whenever `paper-foo` is clicked.
|
||||
```
|
||||
|
||||
3. **At least one test for each bug fixed or feature added** as part of the pull request. Pull requests that fix bugs or add features without accompanying tests will not be considered.
|
||||
|
||||
If a proposed change contains multiple commits, please [squash commits](https://www.google.com/url?q=http://blog.steveklabnik.com/posts/2012-11-08-how-to-squash-commits-in-a-github-pull-request) to as few as is necessary to succinctly express the change. A Polymer author can help you squash commits, so don’t be afraid to ask us if you need help with that!
|
59
react-app/bower_components/iron-input/README.md
vendored
Normal file
59
react-app/bower_components/iron-input/README.md
vendored
Normal file
@ -0,0 +1,59 @@
|
||||
|
||||
<!---
|
||||
|
||||
This README is automatically generated from the comments in these files:
|
||||
iron-input.html
|
||||
|
||||
Edit those files, and our readme bot will duplicate them over here!
|
||||
Edit this file, and the bot will squash your changes :)
|
||||
|
||||
The bot does some handling of markdown. Please file a bug if it does the wrong
|
||||
thing! https://github.com/PolymerLabs/tedium/issues
|
||||
|
||||
-->
|
||||
|
||||
[](https://travis-ci.org/PolymerElements/iron-input)
|
||||
|
||||
_[Demo and API docs](https://elements.polymer-project.org/elements/iron-input)_
|
||||
|
||||
|
||||
##<iron-input>
|
||||
|
||||
`<iron-input>` adds two-way binding and custom validators using `Polymer.IronValidatorBehavior`
|
||||
to `<input>`.
|
||||
|
||||
### Two-way binding
|
||||
|
||||
By default you can only get notified of changes to an `input`'s `value` due to user input:
|
||||
|
||||
```html
|
||||
<input value="{{myValue::input}}">
|
||||
```
|
||||
|
||||
`iron-input` adds the `bind-value` property that mirrors the `value` property, and can be used
|
||||
for two-way data binding. `bind-value` will notify if it is changed either by user input or by script.
|
||||
|
||||
```html
|
||||
<input is="iron-input" bind-value="{{myValue}}">
|
||||
```
|
||||
|
||||
### Custom validators
|
||||
|
||||
You can use custom validators that implement `Polymer.IronValidatorBehavior` with `<iron-input>`.
|
||||
|
||||
```html
|
||||
<input is="iron-input" validator="my-custom-validator">
|
||||
```
|
||||
|
||||
### Stopping invalid input
|
||||
|
||||
It may be desirable to only allow users to enter certain characters. You can use the
|
||||
`prevent-invalid-input` and `allowed-pattern` attributes together to accomplish this. This feature
|
||||
is separate from validation, and `allowed-pattern` does not affect how the input is validated.
|
||||
|
||||
```html
|
||||
<!-- only allow characters that match [0-9] -->
|
||||
<input is="iron-input" prevent-invalid-input allowed-pattern="[0-9]">
|
||||
```
|
||||
|
||||
|
35
react-app/bower_components/iron-input/bower.json
vendored
Normal file
35
react-app/bower_components/iron-input/bower.json
vendored
Normal file
@ -0,0 +1,35 @@
|
||||
{
|
||||
"name": "iron-input",
|
||||
"version": "1.0.9",
|
||||
"description": "An input element with data binding",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"input"
|
||||
],
|
||||
"main": "iron-input.html",
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/iron-input.git"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/iron-input",
|
||||
"ignore": [],
|
||||
"dependencies": {
|
||||
"iron-a11y-announcer": "PolymerElements/iron-a11y-announcer#^1.0.0",
|
||||
"iron-validatable-behavior": "PolymerElements/iron-validatable-behavior#^1.0.0",
|
||||
"polymer": "Polymer/polymer#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"paper-styles": "polymerelements/paper-styles#^1.0.2",
|
||||
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
|
||||
"iron-validator-behavior": "PolymerElements/iron-validator-behavior#^1.0.0",
|
||||
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
|
||||
"web-component-tester": "^4.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
}
|
||||
}
|
87
react-app/bower_components/iron-input/demo/index.html
vendored
Normal file
87
react-app/bower_components/iron-input/demo/index.html
vendored
Normal file
@ -0,0 +1,87 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
|
||||
<title>iron-input demo</title>
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<link rel="import" href="../iron-input.html">
|
||||
<link rel="import" href="../../paper-styles/color.html">
|
||||
<link rel="import" href="../../paper-styles/demo-pages.html">
|
||||
<link rel="import" href="../../paper-styles/typography.html">
|
||||
|
||||
<style is="custom-style">
|
||||
|
||||
.vertical-section {
|
||||
@apply(--paper-font-body1);
|
||||
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
code {
|
||||
color: var(--google-grey-700);
|
||||
}
|
||||
|
||||
input[is=iron-input] {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
input, button {
|
||||
font-size: 20px;
|
||||
padding: 0.2em;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="vertical-section vertical-section-container centered">
|
||||
<template is="dom-bind">
|
||||
<p>
|
||||
<input is="iron-input" bind-value="{{bindValue}}" value="{{value::input}}">
|
||||
<br>
|
||||
bind to <code>bind-value</code>: <b>[[bindValue]]</b>
|
||||
<br>
|
||||
bind to <code>value::input</code>: <b>{{value}}</b>
|
||||
</p>
|
||||
|
||||
<p on-click="setValue">
|
||||
set bind-value to: <input> <button is="paper-button" value="bindValue">set</button>
|
||||
<br>
|
||||
set value to: <input> <button value="value">set</button>
|
||||
</p>
|
||||
</template>
|
||||
<p>only allows these characters:
|
||||
<code>!@#0123456789</code></p>
|
||||
<input is="iron-input" allowed-pattern="[!@#0-9]" prevent-invalid-input>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var scope = document.querySelector('template[is=dom-bind]');
|
||||
|
||||
scope.setValue = function(event) {
|
||||
if (!(event.target instanceof HTMLButtonElement)) {
|
||||
return;
|
||||
}
|
||||
document.querySelector('input[is=iron-input]')[event.target.value] = event.target.previousElementSibling.value;
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
19
react-app/bower_components/iron-input/hero.svg
vendored
Executable file
19
react-app/bower_components/iron-input/hero.svg
vendored
Executable file
@ -0,0 +1,19 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 225 126" enable-background="new 0 0 225 126" xml:space="preserve">
|
||||
<g id="background" display="none">
|
||||
<rect display="inline" fill="#B0BEC5" width="225" height="126"/>
|
||||
</g>
|
||||
<g id="label">
|
||||
</g>
|
||||
<g id="art">
|
||||
<rect x="49" y="53" width="2" height="18"/>
|
||||
<path d="M188,78H37V44h151V78z M39,76h147V46H39V76z"/>
|
||||
<g id="ic_x5F_add_x0D_">
|
||||
</g>
|
||||
</g>
|
||||
<g id="Guides">
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 752 B |
30
react-app/bower_components/iron-input/index.html
vendored
Normal file
30
react-app/bower_components/iron-input/index.html
vendored
Normal file
@ -0,0 +1,30 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
||||
|
||||
<title>iron-input</title>
|
||||
|
||||
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-component-page/iron-component-page.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<iron-component-page></iron-component-page>
|
||||
|
||||
</body>
|
||||
</html>
|
305
react-app/bower_components/iron-input/iron-input.html
vendored
Normal file
305
react-app/bower_components/iron-input/iron-input.html
vendored
Normal file
@ -0,0 +1,305 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-a11y-announcer/iron-a11y-announcer.html">
|
||||
<link rel="import" href="../iron-validatable-behavior/iron-validatable-behavior.html">
|
||||
|
||||
<script>
|
||||
|
||||
/*
|
||||
`<iron-input>` adds two-way binding and custom validators using `Polymer.IronValidatorBehavior`
|
||||
to `<input>`.
|
||||
|
||||
### Two-way binding
|
||||
|
||||
By default you can only get notified of changes to an `input`'s `value` due to user input:
|
||||
|
||||
<input value="{{myValue::input}}">
|
||||
|
||||
`iron-input` adds the `bind-value` property that mirrors the `value` property, and can be used
|
||||
for two-way data binding. `bind-value` will notify if it is changed either by user input or by script.
|
||||
|
||||
<input is="iron-input" bind-value="{{myValue}}">
|
||||
|
||||
### Custom validators
|
||||
|
||||
You can use custom validators that implement `Polymer.IronValidatorBehavior` with `<iron-input>`.
|
||||
|
||||
<input is="iron-input" validator="my-custom-validator">
|
||||
|
||||
### Stopping invalid input
|
||||
|
||||
It may be desirable to only allow users to enter certain characters. You can use the
|
||||
`prevent-invalid-input` and `allowed-pattern` attributes together to accomplish this. This feature
|
||||
is separate from validation, and `allowed-pattern` does not affect how the input is validated.
|
||||
|
||||
<!-- only allow characters that match [0-9] -->
|
||||
<input is="iron-input" prevent-invalid-input allowed-pattern="[0-9]">
|
||||
|
||||
@hero hero.svg
|
||||
@demo demo/index.html
|
||||
*/
|
||||
|
||||
Polymer({
|
||||
|
||||
is: 'iron-input',
|
||||
|
||||
extends: 'input',
|
||||
|
||||
behaviors: [
|
||||
Polymer.IronValidatableBehavior
|
||||
],
|
||||
|
||||
properties: {
|
||||
|
||||
/**
|
||||
* Use this property instead of `value` for two-way data binding.
|
||||
*/
|
||||
bindValue: {
|
||||
observer: '_bindValueChanged',
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to prevent the user from entering invalid input. If `allowedPattern` is set,
|
||||
* any character typed by the user will be matched against that pattern, and rejected if it's not a match.
|
||||
* Pasted input will have each character checked individually; if any character
|
||||
* doesn't match `allowedPattern`, the entire pasted string will be rejected.
|
||||
* If `allowedPattern` is not set, it will use the `type` attribute (only supported for `type=number`).
|
||||
*/
|
||||
preventInvalidInput: {
|
||||
type: Boolean
|
||||
},
|
||||
|
||||
/**
|
||||
* Regular expression that list the characters allowed as input.
|
||||
* This pattern represents the allowed characters for the field; as the user inputs text,
|
||||
* each individual character will be checked against the pattern (rather than checking
|
||||
* the entire value as a whole). The recommended format should be a list of allowed characters;
|
||||
* for example, `[a-zA-Z0-9.+-!;:]`
|
||||
*/
|
||||
allowedPattern: {
|
||||
type: String,
|
||||
observer: "_allowedPatternChanged"
|
||||
},
|
||||
|
||||
_previousValidInput: {
|
||||
type: String,
|
||||
value: ''
|
||||
},
|
||||
|
||||
_patternAlreadyChecked: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
listeners: {
|
||||
'input': '_onInput',
|
||||
'keypress': '_onKeypress'
|
||||
},
|
||||
|
||||
registered: function() {
|
||||
// Feature detect whether we need to patch dispatchEvent (i.e. on FF and IE).
|
||||
if (!this._canDispatchEventOnDisabled()) {
|
||||
this._origDispatchEvent = this.dispatchEvent;
|
||||
this.dispatchEvent = this._dispatchEventFirefoxIE;
|
||||
}
|
||||
},
|
||||
|
||||
created: function() {
|
||||
Polymer.IronA11yAnnouncer.requestAvailability();
|
||||
},
|
||||
|
||||
_canDispatchEventOnDisabled: function() {
|
||||
var input = document.createElement('input');
|
||||
var canDispatch = false;
|
||||
input.disabled = true;
|
||||
|
||||
input.addEventListener('feature-check-dispatch-event', function() {
|
||||
canDispatch = true;
|
||||
});
|
||||
|
||||
try {
|
||||
input.dispatchEvent(new Event('feature-check-dispatch-event'));
|
||||
} catch(e) {}
|
||||
|
||||
return canDispatch;
|
||||
},
|
||||
|
||||
_dispatchEventFirefoxIE: function() {
|
||||
// Due to Firefox bug, events fired on disabled form controls can throw
|
||||
// errors; furthermore, neither IE nor Firefox will actually dispatch
|
||||
// events from disabled form controls; as such, we toggle disable around
|
||||
// the dispatch to allow notifying properties to notify
|
||||
// See issue #47 for details
|
||||
var disabled = this.disabled;
|
||||
this.disabled = false;
|
||||
this._origDispatchEvent.apply(this, arguments);
|
||||
this.disabled = disabled;
|
||||
},
|
||||
|
||||
get _patternRegExp() {
|
||||
var pattern;
|
||||
if (this.allowedPattern) {
|
||||
pattern = new RegExp(this.allowedPattern);
|
||||
} else {
|
||||
switch (this.type) {
|
||||
case 'number':
|
||||
pattern = /[0-9.,e-]/;
|
||||
break;
|
||||
}
|
||||
}
|
||||
return pattern;
|
||||
},
|
||||
|
||||
ready: function() {
|
||||
this.bindValue = this.value;
|
||||
},
|
||||
|
||||
/**
|
||||
* @suppress {checkTypes}
|
||||
*/
|
||||
_bindValueChanged: function() {
|
||||
if (this.value !== this.bindValue) {
|
||||
this.value = !(this.bindValue || this.bindValue === 0 || this.bindValue === false) ? '' : this.bindValue;
|
||||
}
|
||||
// manually notify because we don't want to notify until after setting value
|
||||
this.fire('bind-value-changed', {value: this.bindValue});
|
||||
},
|
||||
|
||||
_allowedPatternChanged: function() {
|
||||
// Force to prevent invalid input when an `allowed-pattern` is set
|
||||
this.preventInvalidInput = this.allowedPattern ? true : false;
|
||||
},
|
||||
|
||||
_onInput: function() {
|
||||
// Need to validate each of the characters pasted if they haven't
|
||||
// been validated inside `_onKeypress` already.
|
||||
if (this.preventInvalidInput && !this._patternAlreadyChecked) {
|
||||
var valid = this._checkPatternValidity();
|
||||
if (!valid) {
|
||||
this._announceInvalidCharacter('Invalid string of characters not entered.');
|
||||
this.value = this._previousValidInput;
|
||||
}
|
||||
}
|
||||
|
||||
this.bindValue = this.value;
|
||||
this._previousValidInput = this.value;
|
||||
this._patternAlreadyChecked = false;
|
||||
},
|
||||
|
||||
_isPrintable: function(event) {
|
||||
// What a control/printable character is varies wildly based on the browser.
|
||||
// - most control characters (arrows, backspace) do not send a `keypress` event
|
||||
// in Chrome, but the *do* on Firefox
|
||||
// - in Firefox, when they do send a `keypress` event, control chars have
|
||||
// a charCode = 0, keyCode = xx (for ex. 40 for down arrow)
|
||||
// - printable characters always send a keypress event.
|
||||
// - in Firefox, printable chars always have a keyCode = 0. In Chrome, the keyCode
|
||||
// always matches the charCode.
|
||||
// None of this makes any sense.
|
||||
|
||||
// For these keys, ASCII code == browser keycode.
|
||||
var anyNonPrintable =
|
||||
(event.keyCode == 8) || // backspace
|
||||
(event.keyCode == 9) || // tab
|
||||
(event.keyCode == 13) || // enter
|
||||
(event.keyCode == 27); // escape
|
||||
|
||||
// For these keys, make sure it's a browser keycode and not an ASCII code.
|
||||
var mozNonPrintable =
|
||||
(event.keyCode == 19) || // pause
|
||||
(event.keyCode == 20) || // caps lock
|
||||
(event.keyCode == 45) || // insert
|
||||
(event.keyCode == 46) || // delete
|
||||
(event.keyCode == 144) || // num lock
|
||||
(event.keyCode == 145) || // scroll lock
|
||||
(event.keyCode > 32 && event.keyCode < 41) || // page up/down, end, home, arrows
|
||||
(event.keyCode > 111 && event.keyCode < 124); // fn keys
|
||||
|
||||
return !anyNonPrintable && !(event.charCode == 0 && mozNonPrintable);
|
||||
},
|
||||
|
||||
_onKeypress: function(event) {
|
||||
if (!this.preventInvalidInput && this.type !== 'number') {
|
||||
return;
|
||||
}
|
||||
var regexp = this._patternRegExp;
|
||||
if (!regexp) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Handle special keys and backspace
|
||||
if (event.metaKey || event.ctrlKey || event.altKey)
|
||||
return;
|
||||
|
||||
// Check the pattern either here or in `_onInput`, but not in both.
|
||||
this._patternAlreadyChecked = true;
|
||||
|
||||
var thisChar = String.fromCharCode(event.charCode);
|
||||
if (this._isPrintable(event) && !regexp.test(thisChar)) {
|
||||
event.preventDefault();
|
||||
this._announceInvalidCharacter('Invalid character ' + thisChar + ' not entered.');
|
||||
}
|
||||
},
|
||||
|
||||
_checkPatternValidity: function() {
|
||||
var regexp = this._patternRegExp;
|
||||
if (!regexp) {
|
||||
return true;
|
||||
}
|
||||
for (var i = 0; i < this.value.length; i++) {
|
||||
if (!regexp.test(this.value[i])) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns true if `value` is valid. The validator provided in `validator` will be used first,
|
||||
* then any constraints.
|
||||
* @return {boolean} True if the value is valid.
|
||||
*/
|
||||
validate: function() {
|
||||
// First, check what the browser thinks. Some inputs (like type=number)
|
||||
// behave weirdly and will set the value to "" if something invalid is
|
||||
// entered, but will set the validity correctly.
|
||||
var valid = this.checkValidity();
|
||||
|
||||
// Only do extra checking if the browser thought this was valid.
|
||||
if (valid) {
|
||||
// Empty, required input is invalid
|
||||
if (this.required && this.value === '') {
|
||||
valid = false;
|
||||
} else if (this.hasValidator()) {
|
||||
valid = Polymer.IronValidatableBehavior.validate.call(this, this.value);
|
||||
}
|
||||
}
|
||||
|
||||
this.invalid = !valid;
|
||||
this.fire('iron-input-validate');
|
||||
return valid;
|
||||
},
|
||||
|
||||
_announceInvalidCharacter: function(message) {
|
||||
this.fire('iron-announce', { text: message });
|
||||
}
|
||||
});
|
||||
|
||||
/*
|
||||
The `iron-input-validate` event is fired whenever `validate()` is called.
|
||||
@event iron-input-validate
|
||||
*/
|
||||
|
||||
</script>
|
32
react-app/bower_components/iron-input/test/disabled-input.html
vendored
Normal file
32
react-app/bower_components/iron-input/test/disabled-input.html
vendored
Normal file
@ -0,0 +1,32 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../../polymer/polymer.html">
|
||||
|
||||
<dom-module id="disabled-input">
|
||||
<template>
|
||||
<input is="iron-input" bind-value="{{myValue}}" invalid="{{myInvalid}}" disabled id="input">
|
||||
</template>
|
||||
</dom-module>
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'disabled-input',
|
||||
properties: {
|
||||
myValue: {
|
||||
value: 'foo'
|
||||
},
|
||||
|
||||
myInvalid: {
|
||||
value: false
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
23
react-app/bower_components/iron-input/test/index.html
vendored
Normal file
23
react-app/bower_components/iron-input/test/index.html
vendored
Normal file
@ -0,0 +1,23 @@
|
||||
<!DOCTYPE html><!--
|
||||
Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
--><html><head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
||||
<title>iron-input tests</title>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
WCT.loadSuites([
|
||||
'iron-input.html',
|
||||
'iron-input.html?dom=shadow'
|
||||
]);
|
||||
</script>
|
||||
|
||||
|
||||
</body></html>
|
280
react-app/bower_components/iron-input/test/iron-input.html
vendored
Normal file
280
react-app/bower_components/iron-input/test/iron-input.html
vendored
Normal file
@ -0,0 +1,280 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>iron-input tests</title>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
<link rel="import" href="../iron-input.html">
|
||||
<link rel="import" href="letters-only.html">
|
||||
<link rel="import" href="disabled-input.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<test-fixture id="basic">
|
||||
<template>
|
||||
<input is="iron-input">
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="has-value">
|
||||
<template>
|
||||
<input is="iron-input" value="foobar">
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="has-bind-value">
|
||||
<template>
|
||||
<input is="iron-input" bind-value="foobar">
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="prevent-invalid-input">
|
||||
<template>
|
||||
<input is="iron-input" prevent-invalid-input allowed-pattern="[0-9]">
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="prevent-invalid-input-with-pattern">
|
||||
<template>
|
||||
<input is="iron-input" prevent-invalid-input pattern="[a-zA-Z]{3}[0-9]*">
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="prevent-invalid-input-has-value">
|
||||
<template>
|
||||
<input is="iron-input" prevent-invalid-input allowed-pattern="[0-9]" value="foobar">
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="prevent-invalid-input-has-bind-value">
|
||||
<template>
|
||||
<input is="iron-input" prevent-invalid-input allowed-pattern="[0-9]" bind-value="foobar">
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="automatically-prevent-invalid-input-if-allowed-pattern">
|
||||
<template>
|
||||
<input is="iron-input" allowed-pattern="[0-9]">
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="no-validator">
|
||||
<template>
|
||||
<input is="iron-input" pattern="[a-zA-Z]{3}[0-9]*">
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="has-validator">
|
||||
<template>
|
||||
<letters-only></letters-only>
|
||||
<input is="iron-input" validator="letters-only" pattern="[0-9]*">
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="native-and-custom-validator">
|
||||
<template>
|
||||
<letters-only></letters-only>
|
||||
<input is="iron-input" validator="letters-only" pattern="[a-c]*">
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<template is="dom-bind" id="bind-to-object">
|
||||
<input is="iron-input" id="input" bind-value="{{foo}}">
|
||||
</template>
|
||||
|
||||
<test-fixture id="disabled-input">
|
||||
<template>
|
||||
<disabled-input></disabled-input>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
|
||||
suite('basic', function() {
|
||||
|
||||
test('setting bindValue sets value', function() {
|
||||
var input = fixture('basic');
|
||||
input.bindValue = 'foobar';
|
||||
assert.equal(input.value, input.bindValue, 'value equals to bindValue');
|
||||
});
|
||||
|
||||
test('changing the input triggers an event', function(done) {
|
||||
var input = fixture('basic');
|
||||
|
||||
input.addEventListener('bind-value-changed', function(value) {
|
||||
assert.equal(input.value, input.bindValue, 'value equals to bindValue');
|
||||
done();
|
||||
});
|
||||
|
||||
input.value = "foo";
|
||||
input._onInput();
|
||||
});
|
||||
|
||||
test('default value sets bindValue', function() {
|
||||
var input = fixture('has-value');
|
||||
assert.equal(input.bindValue, input.value, 'bindValue equals value');
|
||||
});
|
||||
|
||||
test('default bindValue sets value', function() {
|
||||
var input = fixture('has-bind-value');
|
||||
assert.equal(input.value, input.bindValue, 'value equals to bindValue');
|
||||
});
|
||||
|
||||
test('set bindValue to undefined', function() {
|
||||
var scope = document.getElementById('bind-to-object');
|
||||
scope.foo = undefined;
|
||||
assert.ok(!scope.$.input.bindValue, 'bindValue is falsy');
|
||||
assert.ok(!scope.$.input.value, 'value is falsy');
|
||||
});
|
||||
|
||||
test('can validate using a complex regex', function() {
|
||||
var input = fixture('no-validator');
|
||||
input.value = '123';
|
||||
input.validate();
|
||||
assert.isTrue(input.invalid, 'input is invalid');
|
||||
input.value = 'foo';
|
||||
input.validate();
|
||||
assert.isFalse(input.invalid, 'input is valid');
|
||||
input.value = 'foo123';
|
||||
input.validate();
|
||||
assert.isFalse(input.invalid, 'input is valid');
|
||||
});
|
||||
|
||||
test('set bindValue to false', function() {
|
||||
var scope = document.getElementById('bind-to-object');
|
||||
scope.foo = false;
|
||||
assert.isFalse(scope.$.input.bindValue);
|
||||
assert.equal(scope.$.input.value, 'false');
|
||||
});
|
||||
|
||||
test('validator used instead of constraints api if provided', function() {
|
||||
var input = fixture('has-validator')[1];
|
||||
input.value = '123';
|
||||
input.validate();
|
||||
assert.isTrue(input.invalid, 'input is invalid');
|
||||
});
|
||||
|
||||
test('prevent invalid input works in _onInput', function() {
|
||||
var input = fixture('prevent-invalid-input');
|
||||
input.value = '123';
|
||||
input._onInput();
|
||||
assert.equal(input.bindValue, '123');
|
||||
|
||||
input.value = '123foo';
|
||||
input._onInput();
|
||||
assert.equal(input.bindValue, '123');
|
||||
});
|
||||
|
||||
test('inputs can be validated', function() {
|
||||
var input = fixture('prevent-invalid-input-with-pattern');
|
||||
input.value = '123';
|
||||
input._onInput();
|
||||
assert.equal(input.bindValue, '123');
|
||||
input.validate();
|
||||
assert.isTrue(input.invalid, 'input is invalid');
|
||||
|
||||
input.value = 'foo';
|
||||
input._onInput();
|
||||
assert.equal(input.bindValue, 'foo');
|
||||
input.validate();
|
||||
assert.isFalse(input.invalid, 'input is valid');
|
||||
|
||||
input.value = 'foo123';
|
||||
input._onInput();
|
||||
assert.equal(input.bindValue, 'foo123');
|
||||
input.validate();
|
||||
assert.isFalse(input.invalid, 'input is valid');
|
||||
});
|
||||
|
||||
test('prevent invalid input works automatically when allowed pattern is set', function() {
|
||||
var input = fixture('automatically-prevent-invalid-input-if-allowed-pattern');
|
||||
input.value = '123';
|
||||
input._onInput();
|
||||
assert.equal(input.bindValue, '123');
|
||||
|
||||
input.value = '123foo';
|
||||
input._onInput();
|
||||
assert.equal(input.bindValue, '123');
|
||||
|
||||
input.allowedPattern = '';
|
||||
input.value = '#123foo BAR!';
|
||||
input._onInput();
|
||||
assert.equal(input.bindValue, '#123foo BAR!');
|
||||
|
||||
input.allowedPattern = '[a-zA-Z]';
|
||||
input.value = 'foo';
|
||||
input._onInput();
|
||||
input.value = 'bar123';
|
||||
input._onInput();
|
||||
assert.equal(input.bindValue, 'foo');
|
||||
});
|
||||
|
||||
test('disabled input doesn\'t throw on Firefox', function() {
|
||||
var el = fixture('disabled-input');
|
||||
var input = el.$.input;
|
||||
|
||||
assert.equal(input.bindValue, 'foo');
|
||||
|
||||
assert.isFalse(el.myInvalid);
|
||||
assert.isTrue(input.disabled);
|
||||
});
|
||||
|
||||
test('browser validation beats custom validation', function() {
|
||||
var input = fixture('native-and-custom-validator')[1];
|
||||
// The input allows any letters, but the browser only allows one
|
||||
// of [abc].
|
||||
input.value = 'aaaa';
|
||||
input.validate();
|
||||
assert.isFalse(input.invalid, 'input is valid');
|
||||
|
||||
// The validator allows this, but the browser doesn't.
|
||||
input.value = 'zzz';
|
||||
input.validate();
|
||||
assert.isTrue(input.invalid, 'input is invalid');
|
||||
});
|
||||
});
|
||||
|
||||
suite('a11y', function() {
|
||||
test('announces invalid characters when _onInput is called', function() {
|
||||
var input = fixture('prevent-invalid-input');
|
||||
input.addEventListener('iron-announce', function(event) {
|
||||
assert.equal(event.detail.text, 'Invalid string of characters not entered.');
|
||||
});
|
||||
input.value = 'foo';
|
||||
input._onInput();
|
||||
});
|
||||
|
||||
test('announces invalid characters on keypress', function() {
|
||||
var input = fixture('prevent-invalid-input');
|
||||
input.addEventListener('iron-announce', function(event) {
|
||||
assert.equal(event.detail.text, 'Invalid character a not entered.');
|
||||
});
|
||||
|
||||
// Simulate key press event.
|
||||
var event = new CustomEvent('keypress', {
|
||||
bubbles: true,
|
||||
cancelable: true
|
||||
});
|
||||
event.charCode = 97 /* a */;
|
||||
input.dispatchEvent(event);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
30
react-app/bower_components/iron-input/test/letters-only.html
vendored
Normal file
30
react-app/bower_components/iron-input/test/letters-only.html
vendored
Normal file
@ -0,0 +1,30 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../../polymer/polymer.html">
|
||||
<link rel="import" href="../../iron-validator-behavior/iron-validator-behavior.html">
|
||||
|
||||
<script>
|
||||
|
||||
Polymer({
|
||||
|
||||
is: 'letters-only',
|
||||
|
||||
behaviors: [
|
||||
Polymer.IronValidatorBehavior
|
||||
],
|
||||
|
||||
validate: function(value) {
|
||||
return !value || value.match(/^[a-zA-Z]*$/) !== null;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
</script>
|
57
react-app/bower_components/paper-dropdown-menu/.bower.json
vendored
Normal file
57
react-app/bower_components/paper-dropdown-menu/.bower.json
vendored
Normal file
@ -0,0 +1,57 @@
|
||||
{
|
||||
"name": "paper-dropdown-menu",
|
||||
"version": "1.1.3",
|
||||
"description": "An element that works similarly to a native browser select",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"web-component",
|
||||
"polymer",
|
||||
"dropdown",
|
||||
"select"
|
||||
],
|
||||
"main": "paper-dropdown-menu.html",
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/paper-dropdown-menu"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/paper-dropdown-menu",
|
||||
"dependencies": {
|
||||
"polymer": "polymer/polymer#^1.1.0",
|
||||
"iron-a11y-keys-behavior": "polymerelements/iron-a11y-keys-behavior#^1.0.0",
|
||||
"iron-icon": "polymerelements/iron-icon#^1.0.0",
|
||||
"iron-icons": "polymerelements/iron-icons#^1.0.0",
|
||||
"paper-input": "polymerelements/paper-input#^1.0.9",
|
||||
"paper-menu-button": "polymerelements/paper-menu-button#^1.0.0",
|
||||
"paper-ripple": "polymerelements/paper-ripple#^1.0.0",
|
||||
"paper-styles": "polymerelements/paper-styles#^1.0.0",
|
||||
"iron-form-element-behavior": "PolymerElements/iron-form-element-behavior#^1.0.0",
|
||||
"iron-validatable-behavior": "PolymerElements/iron-validatable-behavior#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"iron-component-page": "polymerelements/iron-component-page#^1.0.0",
|
||||
"iron-demo-helpers": "polymerelements/iron-demo-helpers#^1.0.0",
|
||||
"test-fixture": "polymerelements/test-fixture#^1.0.0",
|
||||
"iron-test-helpers": "polymerelements/iron-test-helpers#^1.0.0",
|
||||
"paper-item": "polymerelements/paper-item#^1.0.0",
|
||||
"paper-listbox": "polymerelements/paper-listbox#^1.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
|
||||
"web-component-tester": "^4.0.0",
|
||||
"paper-tabs": "polymerelements/paper-tabs#^1.0.0"
|
||||
},
|
||||
"ignore": [],
|
||||
"_release": "1.1.3",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v1.1.3",
|
||||
"commit": "1ca32e3eeb568f1ae356a205c1812744fdd65950"
|
||||
},
|
||||
"_source": "git://github.com/PolymerElements/paper-dropdown-menu.git",
|
||||
"_target": "~1.1.3",
|
||||
"_originalSource": "PolymerElements/paper-dropdown-menu",
|
||||
"_direct": true
|
||||
}
|
1
react-app/bower_components/paper-dropdown-menu/.gitignore
vendored
Normal file
1
react-app/bower_components/paper-dropdown-menu/.gitignore
vendored
Normal file
@ -0,0 +1 @@
|
||||
bower_components
|
22
react-app/bower_components/paper-dropdown-menu/.travis.yml
vendored
Normal file
22
react-app/bower_components/paper-dropdown-menu/.travis.yml
vendored
Normal file
@ -0,0 +1,22 @@
|
||||
language: node_js
|
||||
sudo: false
|
||||
before_script:
|
||||
- npm install web-component-tester
|
||||
- npm install bower
|
||||
- 'export PATH=$PWD/node_modules/.bin:$PATH'
|
||||
- bower install
|
||||
env:
|
||||
global:
|
||||
- secure: Uv6d6W9yI2Lbj7gYh73LCGHpwvvdE1sdqdElVsTN4LSYW4msyLweDD4/Irbk5Nw5bavxkXraYkN655p5VU1SBucTRFMYYtpTDA7xBT/HvXVP3+OgkrN+joVStHcRJXHJCoVtq+YalZ07Q0dltw/brtSUCHhZkcNMxHd/p0NGD1FBSgXC1oXv+MSLjPsSKujz8WuXbfnGXkW682rZhS8Mp5x4Y31AAuGl64gNypAYTdWZ9bKLjeAx4ZY1poiw4Bs1z+V9tO3EeD6YQb/CVpxOH+67FQ2cX0ybLXumNuJQFIzki+EzFwXxuKrJsD4gu8B4kJKVWuAS9wuWkNgGdjR2HVe3/5+nMe7RiLL/wD6yGvcD2ZjP8S0RrxbOeZ03IzadH1NT0FWGf0J55VQgt4XjN0j9bVTYMfX5Xyg5bQ/E1qPzHbyteMAw6LF4Wmh2PyWzKHfz1uPGiZP/3BOKj8EbGMKPBci2181kbotPDENMT/5lk24e944tr7hKWWatNxCmkeb+lJomAxGwDYt2+I4mrpHFz/r4w9qgNr3DelhHTkBw2lNKzGAL5I177IJvsvGnZaCpGuRDWfq2xLGg2aTa9J1iyvil8gQP4CVxffWbqpPxvOax3V5nfbnAUpyYWvCtVSpOV5ndZA9FlBIn/pOsXqIjdiOTmmeJwFoddpCcZ1Y=
|
||||
- secure: X0QrO1SQJs/ktfeJRfAzSTTAyLeMLu0NB5uj+hQCLPZ6QPacaOEaKmwx57CY2qsD9X34ijtXZHP8A3RWKXeQHt2H4CrQ/drWWzNjKMmaf42w8fzHNKkqlwsQV7Bh/g5qXnbzrkcsViOfDVkyPLIKumyG2NqZPrhjl8QDMGseiELB5oznBH/z8APY3lJVB1baT3Wxyzz7TdAYCpZGfdGjr/3bAx1qBNHJXeEMFJDYH4q2nKfqVhdNQx2VdB6nyxIoGKoDynPIGty2pVPOKrp6ctdJYFwtljbO1/AOh3uvkiZRB1dAwr8vE6xVBcUnpM8vseRhlipCSO6qcNTolF67DzlakjxNd8CUwnokJ1juxH9x4uUTAaUpaAHOFqL130Ogcqye6KJ4RavD9cs198dZE3Al9savUF8N2Q8Mpc04dc7AuMOglTTQqhIpLSdtFWsIptMUmhBS3hMgWfVAH7DEzR41SFwwXCN4ZvYC1ooCJK1+wL2po4kIHRaEHx+L6r+1+RKXQ+zBAG5VMtFtc0OoFtInTvyNqBcyHGkbxQaGdHN1FpBWo3wL5qcP37DtYbGe0iEtASk1w0MLlujQjHIY4smxVB/XmNRiOEkWHAtGxbBOu4NAHU5Qhxe22/w1fgPnO3YRoiNO4liJEYJNN1TpTYO3VolNq0IvdFKswj/p0vM=
|
||||
node_js: 4
|
||||
addons:
|
||||
firefox: latest
|
||||
apt:
|
||||
sources:
|
||||
- google-chrome
|
||||
packages:
|
||||
- google-chrome-stable
|
||||
script:
|
||||
- xvfb-run wct
|
||||
- "if [ \"${TRAVIS_PULL_REQUEST}\" = \"false\" ]; then wct -s 'default'; fi"
|
72
react-app/bower_components/paper-dropdown-menu/CONTRIBUTING.md
vendored
Normal file
72
react-app/bower_components/paper-dropdown-menu/CONTRIBUTING.md
vendored
Normal file
@ -0,0 +1,72 @@
|
||||
|
||||
<!--
|
||||
This file is autogenerated based on
|
||||
https://github.com/PolymerElements/ContributionGuide/blob/master/CONTRIBUTING.md
|
||||
|
||||
If you edit that file, it will get updated everywhere else.
|
||||
If you edit this file, your changes will get overridden :)
|
||||
-->
|
||||
# Polymer Elements
|
||||
## Guide for Contributors
|
||||
|
||||
Polymer Elements are built in the open, and the Polymer authors eagerly encourage any and all forms of community contribution. When contributing, please follow these guidelines:
|
||||
|
||||
### Filing Issues
|
||||
|
||||
**If you are filing an issue to request a feature**, please provide a clear description of the feature. It can be helpful to describe answers to the following questions:
|
||||
|
||||
1. **Who will use the feature?** _“As someone filling out a form…”_
|
||||
2. **When will they use the feature?** _“When I enter an invalid value…”_
|
||||
3. **What is the user’s goal?** _“I want to be visually notified that the value needs to be corrected…”_
|
||||
|
||||
**If you are filing an issue to report a bug**, please provide:
|
||||
|
||||
1. **A clear description of the bug and related expectations.** Consider using the following example template for reporting a bug:
|
||||
|
||||
```markdown
|
||||
The `paper-foo` element causes the page to turn pink when clicked.
|
||||
|
||||
## Expected outcome
|
||||
|
||||
The page stays the same color.
|
||||
|
||||
## Actual outcome
|
||||
|
||||
The page turns pink.
|
||||
|
||||
## Steps to reproduce
|
||||
|
||||
1. Put a `paper-foo` element in the page.
|
||||
2. Open the page in a web browser.
|
||||
3. Click the `paper-foo` element.
|
||||
```
|
||||
|
||||
2. **A reduced test case that demonstrates the problem.** If possible, please include the test case as a JSBin. Start with this template to easily import and use relevant Polymer Elements: [http://jsbin.com/cagaye](http://jsbin.com/cagaye/edit?html,output).
|
||||
|
||||
3. **A list of browsers where the problem occurs.** This can be skipped if the problem is the same across all browsers.
|
||||
|
||||
### Submitting Pull Requests
|
||||
|
||||
**Before creating a pull request**, please ensure that an issue exists for the corresponding change in the pull request that you intend to make. **If an issue does not exist, please create one per the guidelines above**. The goal is to discuss the design and necessity of the proposed change with Polymer authors and community before diving into a pull request.
|
||||
|
||||
When submitting pull requests, please provide:
|
||||
|
||||
1. **A reference to the corresponding issue** or issues that will be closed by the pull request. Please refer to these issues using the following syntax:
|
||||
|
||||
```markdown
|
||||
(For a single issue)
|
||||
Fixes #20
|
||||
|
||||
(For multiple issues)
|
||||
Fixes #32, #40
|
||||
```
|
||||
|
||||
2. **A succinct description of the design** used to fix any related issues. For example:
|
||||
|
||||
```markdown
|
||||
This fixes #20 by removing styles that leaked which would cause the page to turn pink whenever `paper-foo` is clicked.
|
||||
```
|
||||
|
||||
3. **At least one test for each bug fixed or feature added** as part of the pull request. Pull requests that fix bugs or add features without accompanying tests will not be considered.
|
||||
|
||||
If a proposed change contains multiple commits, please [squash commits](https://www.google.com/url?q=http://blog.steveklabnik.com/posts/2012-11-08-how-to-squash-commits-in-a-github-pull-request) to as few as is necessary to succinctly express the change. A Polymer author can help you squash commits, so don’t be afraid to ask us if you need help with that!
|
68
react-app/bower_components/paper-dropdown-menu/README.md
vendored
Normal file
68
react-app/bower_components/paper-dropdown-menu/README.md
vendored
Normal file
@ -0,0 +1,68 @@
|
||||
|
||||
<!---
|
||||
|
||||
This README is automatically generated from the comments in these files:
|
||||
paper-dropdown-menu.html
|
||||
|
||||
Edit those files, and our readme bot will duplicate them over here!
|
||||
Edit this file, and the bot will squash your changes :)
|
||||
|
||||
The bot does some handling of markdown. Please file a bug if it does the wrong
|
||||
thing! https://github.com/PolymerLabs/tedium/issues
|
||||
|
||||
-->
|
||||
|
||||
[](https://travis-ci.org/PolymerElements/paper-dropdown-menu)
|
||||
|
||||
_[Demo and API Docs](https://elements.polymer-project.org/elements/paper-dropdown-menu)_
|
||||
|
||||
|
||||
##<paper-dropdown-menu>
|
||||
|
||||
Material design: [Dropdown menus](https://www.google.com/design/spec/components/buttons.html#buttons-dropdown-buttons)
|
||||
|
||||
`paper-dropdown-menu` is similar to a native browser select element.
|
||||
`paper-dropdown-menu` works with selectable content. The currently selected
|
||||
item is displayed in the control. If no item is selected, the `label` is
|
||||
displayed instead.
|
||||
|
||||
The child element with the class `dropdown-content` will be used as the dropdown
|
||||
menu. It could be a `paper-menu` or element that triggers `iron-select` when
|
||||
selecting its children.
|
||||
|
||||
Example:
|
||||
|
||||
```html
|
||||
<paper-dropdown-menu label="Your favourite pastry">
|
||||
<paper-menu class="dropdown-content">
|
||||
<paper-item>Croissant</paper-item>
|
||||
<paper-item>Donut</paper-item>
|
||||
<paper-item>Financier</paper-item>
|
||||
<paper-item>Madeleine</paper-item>
|
||||
</paper-menu>
|
||||
</paper-dropdown-menu>
|
||||
```
|
||||
|
||||
This example renders a dropdown menu with 4 options.
|
||||
|
||||
Similarly to using `iron-select`, `iron-deselect` events will cause the
|
||||
current selection of the `paper-dropdown-menu` to be cleared.
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are also available for styling:
|
||||
|
||||
| Custom property | Description | Default |
|
||||
| --- | --- | --- |
|
||||
| `--paper-dropdown-menu` | A mixin that is applied to the element host | `{}` |
|
||||
| `--paper-dropdown-menu-disabled` | A mixin that is applied to the element host when disabled | `{}` |
|
||||
| `--paper-dropdown-menu-ripple` | A mixin that is applied to the internal ripple | `{}` |
|
||||
| `--paper-dropdown-menu-button` | A mixin that is applied to the internal menu button | `{}` |
|
||||
| `--paper-dropdown-menu-input` | A mixin that is applied to the internal paper input | `{}` |
|
||||
| `--paper-dropdown-menu-icon` | A mixin that is applied to the internal icon | `{}` |
|
||||
|
||||
You can also use any of the `paper-input-container` and `paper-menu-button`
|
||||
style mixins and custom properties to style the internal input and menu button
|
||||
respectively.
|
||||
|
||||
|
47
react-app/bower_components/paper-dropdown-menu/bower.json
vendored
Normal file
47
react-app/bower_components/paper-dropdown-menu/bower.json
vendored
Normal file
@ -0,0 +1,47 @@
|
||||
{
|
||||
"name": "paper-dropdown-menu",
|
||||
"version": "1.1.3",
|
||||
"description": "An element that works similarly to a native browser select",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"web-component",
|
||||
"polymer",
|
||||
"dropdown",
|
||||
"select"
|
||||
],
|
||||
"main": "paper-dropdown-menu.html",
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/paper-dropdown-menu"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/paper-dropdown-menu",
|
||||
"dependencies": {
|
||||
"polymer": "polymer/polymer#^1.1.0",
|
||||
"iron-a11y-keys-behavior": "polymerelements/iron-a11y-keys-behavior#^1.0.0",
|
||||
"iron-icon": "polymerelements/iron-icon#^1.0.0",
|
||||
"iron-icons": "polymerelements/iron-icons#^1.0.0",
|
||||
"paper-input": "polymerelements/paper-input#^1.0.9",
|
||||
"paper-menu-button": "polymerelements/paper-menu-button#^1.0.0",
|
||||
"paper-ripple": "polymerelements/paper-ripple#^1.0.0",
|
||||
"paper-styles": "polymerelements/paper-styles#^1.0.0",
|
||||
"iron-form-element-behavior": "PolymerElements/iron-form-element-behavior#^1.0.0",
|
||||
"iron-validatable-behavior": "PolymerElements/iron-validatable-behavior#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"iron-component-page": "polymerelements/iron-component-page#^1.0.0",
|
||||
"iron-demo-helpers": "polymerelements/iron-demo-helpers#^1.0.0",
|
||||
"test-fixture": "polymerelements/test-fixture#^1.0.0",
|
||||
"iron-test-helpers": "polymerelements/iron-test-helpers#^1.0.0",
|
||||
"paper-item": "polymerelements/paper-item#^1.0.0",
|
||||
"paper-listbox": "polymerelements/paper-listbox#^1.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
|
||||
"web-component-tester": "^4.0.0",
|
||||
"paper-tabs": "polymerelements/paper-tabs#^1.0.0"
|
||||
},
|
||||
"ignore": []
|
||||
}
|
217
react-app/bower_components/paper-dropdown-menu/demo/index.html
vendored
Normal file
217
react-app/bower_components/paper-dropdown-menu/demo/index.html
vendored
Normal file
@ -0,0 +1,217 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
||||
|
||||
<title>paper-dropdown-menu demo</title>
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<link rel="import" href="../../iron-demo-helpers/demo-snippet.html">
|
||||
<link rel="import" href="../../iron-demo-helpers/demo-pages-shared-styles.html">
|
||||
<link rel="import" href="../../paper-button/paper-button.html">
|
||||
<link rel="import" href="../../paper-item/paper-item.html">
|
||||
<link rel="import" href="../../paper-listbox/paper-listbox.html">
|
||||
<link rel="import" href="../../paper-styles/demo-pages.html">
|
||||
<link rel="import" href="../../paper-tabs/paper-tabs.html">
|
||||
<link rel="import" href="../paper-dropdown-menu.html">
|
||||
|
||||
<style is="custom-style" include="demo-pages-shared-styles">
|
||||
paper-tabs {
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.vertical-section-container {
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
paper-dropdown-menu {
|
||||
width: 200px;
|
||||
}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body unresolved>
|
||||
<div class="vertical-section-container centered">
|
||||
<h4>This is a plain paper-dropdown-menu</h4>
|
||||
<demo-snippet class="centered-demo">
|
||||
<template>
|
||||
<paper-dropdown-menu label="Dinosaurs">
|
||||
<paper-listbox class="dropdown-content">
|
||||
<paper-item>allosaurus</paper-item>
|
||||
<paper-item>brontosaurus</paper-item>
|
||||
<paper-item>carcharodontosaurus</paper-item>
|
||||
<paper-item>diplodocus</paper-item>
|
||||
</paper-listbox>
|
||||
</paper-dropdown-menu>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h4>You can pre-select a value using the <i>selected</i> attribute</h4>
|
||||
<demo-snippet class="centered-demo">
|
||||
<template>
|
||||
<paper-dropdown-menu label="Dinosaurs">
|
||||
<paper-listbox class="dropdown-content" selected="1">
|
||||
<paper-item>allosaurus</paper-item>
|
||||
<paper-item>brontosaurus</paper-item>
|
||||
<paper-item>carcharodontosaurus</paper-item>
|
||||
<paper-item>diplodocus</paper-item>
|
||||
</paper-listbox>
|
||||
</paper-dropdown-menu>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h4>You can change the direction in which the menu opens</h4>
|
||||
<demo-snippet class="centered-demo">
|
||||
<template>
|
||||
<paper-dropdown-menu label="Upwards and to the left!" vertical-align="bottom" horizontal-align="left">
|
||||
<paper-listbox class="dropdown-content">
|
||||
<paper-item>allosaurus</paper-item>
|
||||
<paper-item>brontosaurus</paper-item>
|
||||
<paper-item>carcharodontosaurus</paper-item>
|
||||
<paper-item>diplodocus</paper-item>
|
||||
</paper-listbox>
|
||||
</paper-dropdown-menu>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
|
||||
<h4>A paper-dropdown-menu can be disabled</h4>
|
||||
<demo-snippet class="centered-demo">
|
||||
<template>
|
||||
<paper-dropdown-menu label="Disabled dinosaurs" disabled>
|
||||
<paper-listbox class="dropdown-content">
|
||||
<paper-item>allosaurus</paper-item>
|
||||
<paper-item>brontosaurus</paper-item>
|
||||
<paper-item>carcharodontosaurus</paper-item>
|
||||
<paper-item>diplodocus</paper-item>
|
||||
</paper-listbox>
|
||||
</paper-dropdown-menu>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<!-- TODO(noms): enable this demo when the webcomponentsjs bug is fixed -->
|
||||
<!-- <h4>Here is an example of a long, scrolling menu, using a <i>dom-repeat</i></h4>
|
||||
<demo-snippet class="centered-demo">
|
||||
<template>
|
||||
<template is="dom-bind" id="Demo">
|
||||
<paper-dropdown-menu label="Dinosaurs">
|
||||
<paper-listbox class="dropdown-content">
|
||||
<template is="dom-repeat" items='[[dinosaurs]]' as="dinosaur">
|
||||
<paper-item>[[dinosaur]]</paper-item>
|
||||
</template>
|
||||
</paper-listbox>
|
||||
</paper-dropdown-menu>
|
||||
</template>
|
||||
</template>
|
||||
</demo-snippet> -->
|
||||
|
||||
<h4>A paper-dropdown-menu can contain any kind of content, such as tabs</h4>
|
||||
<demo-snippet class="centered-demo">
|
||||
<template>
|
||||
<paper-dropdown-menu label="Menu tabs!?">
|
||||
<paper-tabs class="dropdown-content">
|
||||
<paper-tab>cheddar</paper-tab>
|
||||
<paper-tab>stilton</paper-tab>
|
||||
<paper-tab>emmental</paper-tab>
|
||||
</paper-tabs>
|
||||
</paper-dropdown-menu>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h4>You can remove the ripple and the animations</h4>
|
||||
<demo-snippet class="centered-demo">
|
||||
<template>
|
||||
<paper-dropdown-menu label="Dinosaurs" noink no-animations>
|
||||
<paper-listbox class="dropdown-content">
|
||||
<paper-item>allosaurus</paper-item>
|
||||
<paper-item>brontosaurus</paper-item>
|
||||
<paper-item>carcharodontosaurus</paper-item>
|
||||
<paper-item>diplodocus</paper-item>
|
||||
</paper-listbox>
|
||||
</paper-dropdown-menu>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h4>You can style a paper-dropdown-menu using custom properties</h4>
|
||||
<demo-snippet class="centered-demo">
|
||||
<template>
|
||||
<style is="custom-style">
|
||||
paper-dropdown-menu.custom {
|
||||
--paper-input-container-label: {
|
||||
color: white;
|
||||
background-color: var(--paper-pink-500);
|
||||
font-style: italic;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
};
|
||||
--paper-input-container-input: {
|
||||
color: var(--paper-indigo-500);
|
||||
font-style: normal;
|
||||
font-family: serif;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
/* no underline */
|
||||
--paper-input-container-underline: {
|
||||
display: none;
|
||||
};
|
||||
}
|
||||
</style>
|
||||
<paper-dropdown-menu class="custom" label="Custom" no-label-float>
|
||||
<paper-listbox class="dropdown-content">
|
||||
<paper-item>allosaurus</paper-item>
|
||||
<paper-item>brontosaurus</paper-item>
|
||||
<paper-item>carcharodontosaurus</paper-item>
|
||||
<paper-item>diplodocus</paper-item>
|
||||
</paper-listbox>
|
||||
</paper-dropdown-menu>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
document.addEventListener('WebComponentsReady', function() {
|
||||
Demo.dinosaurs = [
|
||||
'allosaurus',
|
||||
'brontosaurus',
|
||||
'carcharodontosaurus',
|
||||
'diplodocus',
|
||||
'ekrixinatosaurus',
|
||||
'fukuiraptor',
|
||||
'gallimimus',
|
||||
'hadrosaurus',
|
||||
'iguanodon',
|
||||
'jainosaurus',
|
||||
'kritosaurus',
|
||||
'liaoceratops',
|
||||
'megalosaurus',
|
||||
'nemegtosaurus',
|
||||
'ornithomimus',
|
||||
'protoceratops',
|
||||
'quetecsaurus',
|
||||
'rajasaurus',
|
||||
'stegosaurus',
|
||||
'triceratops',
|
||||
'utahraptor',
|
||||
'vulcanodon',
|
||||
'wannanosaurus',
|
||||
'xenoceratops',
|
||||
'yandusaurus',
|
||||
'zephyrosaurus'
|
||||
];
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
24
react-app/bower_components/paper-dropdown-menu/index.html
vendored
Normal file
24
react-app/bower_components/paper-dropdown-menu/index.html
vendored
Normal file
@ -0,0 +1,24 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>paper-dropdown-menu</title>
|
||||
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<link rel="import" href="../iron-component-page/iron-component-page.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<iron-component-page></iron-component-page>
|
||||
|
||||
</body>
|
||||
</html>
|
448
react-app/bower_components/paper-dropdown-menu/paper-dropdown-menu.html
vendored
Normal file
448
react-app/bower_components/paper-dropdown-menu/paper-dropdown-menu.html
vendored
Normal file
@ -0,0 +1,448 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../paper-styles/default-theme.html">
|
||||
<link rel="import" href="../paper-input/paper-input.html">
|
||||
<link rel="import" href="../paper-menu-button/paper-menu-button.html">
|
||||
<link rel="import" href="../paper-ripple/paper-ripple.html">
|
||||
<link rel="import" href="../iron-a11y-keys-behavior/iron-a11y-keys-behavior.html">
|
||||
<link rel="import" href="../iron-behaviors/iron-control-state.html">
|
||||
<link rel="import" href="../iron-behaviors/iron-button-state.html">
|
||||
<link rel="import" href="../iron-icons/iron-icons.html">
|
||||
<link rel="import" href="../iron-icon/iron-icon.html">
|
||||
<link rel="import" href="../iron-form-element-behavior/iron-form-element-behavior.html">
|
||||
<link rel="import" href="../iron-validatable-behavior/iron-validatable-behavior.html">
|
||||
|
||||
<!--
|
||||
Material design: [Dropdown menus](https://www.google.com/design/spec/components/buttons.html#buttons-dropdown-buttons)
|
||||
|
||||
`paper-dropdown-menu` is similar to a native browser select element.
|
||||
`paper-dropdown-menu` works with selectable content. The currently selected
|
||||
item is displayed in the control. If no item is selected, the `label` is
|
||||
displayed instead.
|
||||
|
||||
The child element with the class `dropdown-content` will be used as the dropdown
|
||||
menu. It could be a `paper-menu` or element that triggers `iron-select` when
|
||||
selecting its children.
|
||||
|
||||
Example:
|
||||
|
||||
<paper-dropdown-menu label="Your favourite pastry">
|
||||
<paper-menu class="dropdown-content">
|
||||
<paper-item>Croissant</paper-item>
|
||||
<paper-item>Donut</paper-item>
|
||||
<paper-item>Financier</paper-item>
|
||||
<paper-item>Madeleine</paper-item>
|
||||
</paper-menu>
|
||||
</paper-dropdown-menu>
|
||||
|
||||
This example renders a dropdown menu with 4 options.
|
||||
|
||||
Similarly to using `iron-select`, `iron-deselect` events will cause the
|
||||
current selection of the `paper-dropdown-menu` to be cleared.
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are also available for styling:
|
||||
|
||||
Custom property | Description | Default
|
||||
----------------|-------------|----------
|
||||
`--paper-dropdown-menu` | A mixin that is applied to the element host | `{}`
|
||||
`--paper-dropdown-menu-disabled` | A mixin that is applied to the element host when disabled | `{}`
|
||||
`--paper-dropdown-menu-ripple` | A mixin that is applied to the internal ripple | `{}`
|
||||
`--paper-dropdown-menu-button` | A mixin that is applied to the internal menu button | `{}`
|
||||
`--paper-dropdown-menu-input` | A mixin that is applied to the internal paper input | `{}`
|
||||
`--paper-dropdown-menu-icon` | A mixin that is applied to the internal icon | `{}`
|
||||
|
||||
You can also use any of the `paper-input-container` and `paper-menu-button`
|
||||
style mixins and custom properties to style the internal input and menu button
|
||||
respectively.
|
||||
|
||||
@group Paper Elements
|
||||
@element paper-dropdown-menu
|
||||
@hero hero.svg
|
||||
@demo demo/index.html
|
||||
-->
|
||||
|
||||
<dom-module id="paper-dropdown-menu">
|
||||
<template>
|
||||
<style>
|
||||
:host {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
|
||||
/* NOTE(cdata): Both values are needed, since some phones require the
|
||||
* value to be `transparent`.
|
||||
*/
|
||||
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
|
||||
--paper-input-container-input: {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 100%;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
};
|
||||
|
||||
@apply(--paper-dropdown-menu);
|
||||
}
|
||||
|
||||
:host([disabled]) {
|
||||
@apply(--paper-dropdown-menu-disabled);
|
||||
}
|
||||
|
||||
:host([noink]) paper-ripple {
|
||||
display: none;
|
||||
}
|
||||
|
||||
:host([no-label-float]) paper-ripple {
|
||||
top: 8px;
|
||||
}
|
||||
|
||||
paper-ripple {
|
||||
top: 12px;
|
||||
left: 0px;
|
||||
bottom: 8px;
|
||||
right: 0px;
|
||||
|
||||
@apply(--paper-dropdown-menu-ripple);
|
||||
}
|
||||
|
||||
paper-menu-button {
|
||||
display: block;
|
||||
padding: 0;
|
||||
|
||||
@apply(--paper-dropdown-menu-button);
|
||||
}
|
||||
|
||||
paper-input {
|
||||
@apply(--paper-dropdown-menu-input);
|
||||
}
|
||||
|
||||
iron-icon {
|
||||
color: var(--disabled-text-color);
|
||||
|
||||
@apply(--paper-dropdown-menu-icon);
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- this div fulfills an a11y requirement for combobox, do not remove -->
|
||||
<div role="button"></div>
|
||||
<paper-menu-button
|
||||
id="menuButton"
|
||||
vertical-align="[[verticalAlign]]"
|
||||
horizontal-align="[[horizontalAlign]]"
|
||||
vertical-offset="[[_computeMenuVerticalOffset(noLabelFloat)]]"
|
||||
disabled="[[disabled]]"
|
||||
no-animations="[[noAnimations]]"
|
||||
on-iron-select="_onIronSelect"
|
||||
on-iron-deselect="_onIronDeselect"
|
||||
opened="{{opened}}">
|
||||
<div class="dropdown-trigger">
|
||||
<paper-ripple></paper-ripple>
|
||||
<!-- paper-input has type="text" for a11y, do not remove -->
|
||||
<paper-input
|
||||
type="text"
|
||||
invalid="[[invalid]]"
|
||||
readonly
|
||||
disabled="[[disabled]]"
|
||||
value="[[selectedItemLabel]]"
|
||||
placeholder="[[placeholder]]"
|
||||
error-message="[[errorMessage]]"
|
||||
always-float-label="[[alwaysFloatLabel]]"
|
||||
no-label-float="[[noLabelFloat]]"
|
||||
label="[[label]]">
|
||||
<iron-icon icon="arrow-drop-down" suffix></iron-icon>
|
||||
</paper-input>
|
||||
</div>
|
||||
<content id="content" select=".dropdown-content"></content>
|
||||
</paper-menu-button>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
Polymer({
|
||||
is: 'paper-dropdown-menu',
|
||||
|
||||
/**
|
||||
* Fired when the dropdown opens.
|
||||
*
|
||||
* @event paper-dropdown-open
|
||||
*/
|
||||
|
||||
/**
|
||||
* Fired when the dropdown closes.
|
||||
*
|
||||
* @event paper-dropdown-close
|
||||
*/
|
||||
|
||||
behaviors: [
|
||||
Polymer.IronButtonState,
|
||||
Polymer.IronControlState,
|
||||
Polymer.IronFormElementBehavior,
|
||||
Polymer.IronValidatableBehavior
|
||||
],
|
||||
|
||||
properties: {
|
||||
/**
|
||||
* The derived "label" of the currently selected item. This value
|
||||
* is the `label` property on the selected item if set, or else the
|
||||
* trimmed text content of the selected item.
|
||||
*/
|
||||
selectedItemLabel: {
|
||||
type: String,
|
||||
notify: true,
|
||||
readOnly: true
|
||||
},
|
||||
|
||||
/**
|
||||
* The last selected item. An item is selected if the dropdown menu has
|
||||
* a child with class `dropdown-content`, and that child triggers an
|
||||
* `iron-select` event with the selected `item` in the `detail`.
|
||||
*
|
||||
* @type {?Object}
|
||||
*/
|
||||
selectedItem: {
|
||||
type: Object,
|
||||
notify: true,
|
||||
readOnly: true
|
||||
},
|
||||
|
||||
/**
|
||||
* The value for this element that will be used when submitting in
|
||||
* a form. It is read only, and will always have the same value
|
||||
* as `selectedItemLabel`.
|
||||
*/
|
||||
value: {
|
||||
type: String,
|
||||
notify: true,
|
||||
readOnly: true
|
||||
},
|
||||
|
||||
/**
|
||||
* The label for the dropdown.
|
||||
*/
|
||||
label: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* The placeholder for the dropdown.
|
||||
*/
|
||||
placeholder: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* The error message to display when invalid.
|
||||
*/
|
||||
errorMessage: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* True if the dropdown is open. Otherwise, false.
|
||||
*/
|
||||
opened: {
|
||||
type: Boolean,
|
||||
notify: true,
|
||||
value: false,
|
||||
observer: '_openedChanged'
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to disable the floating label. Bind this to the
|
||||
* `<paper-input-container>`'s `noLabelFloat` property.
|
||||
*/
|
||||
noLabelFloat: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
reflectToAttribute: true
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to always float the label. Bind this to the
|
||||
* `<paper-input-container>`'s `alwaysFloatLabel` property.
|
||||
*/
|
||||
alwaysFloatLabel: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to disable animations when opening and closing the
|
||||
* dropdown.
|
||||
*/
|
||||
noAnimations: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* The orientation against which to align the menu dropdown
|
||||
* horizontally relative to the dropdown trigger.
|
||||
*/
|
||||
horizontalAlign: {
|
||||
type: String,
|
||||
value: 'right'
|
||||
},
|
||||
|
||||
/**
|
||||
* The orientation against which to align the menu dropdown
|
||||
* vertically relative to the dropdown trigger.
|
||||
*/
|
||||
verticalAlign: {
|
||||
type: String,
|
||||
value: 'top'
|
||||
}
|
||||
},
|
||||
|
||||
listeners: {
|
||||
'tap': '_onTap'
|
||||
},
|
||||
|
||||
keyBindings: {
|
||||
'up down': 'open',
|
||||
'esc': 'close'
|
||||
},
|
||||
|
||||
hostAttributes: {
|
||||
role: 'combobox',
|
||||
'aria-autocomplete': 'none',
|
||||
'aria-haspopup': 'true'
|
||||
},
|
||||
|
||||
observers: [
|
||||
'_selectedItemChanged(selectedItem)'
|
||||
],
|
||||
|
||||
attached: function() {
|
||||
// NOTE(cdata): Due to timing, a preselected value in a `IronSelectable`
|
||||
// child will cause an `iron-select` event to fire while the element is
|
||||
// still in a `DocumentFragment`. This has the effect of causing
|
||||
// handlers not to fire. So, we double check this value on attached:
|
||||
var contentElement = this.contentElement;
|
||||
if (contentElement && contentElement.selectedItem) {
|
||||
this._setSelectedItem(contentElement.selectedItem);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* The content element that is contained by the dropdown menu, if any.
|
||||
*/
|
||||
get contentElement() {
|
||||
return Polymer.dom(this.$.content).getDistributedNodes()[0];
|
||||
},
|
||||
|
||||
/**
|
||||
* Show the dropdown content.
|
||||
*/
|
||||
open: function() {
|
||||
this.$.menuButton.open();
|
||||
},
|
||||
|
||||
/**
|
||||
* Hide the dropdown content.
|
||||
*/
|
||||
close: function() {
|
||||
this.$.menuButton.close();
|
||||
},
|
||||
|
||||
/**
|
||||
* A handler that is called when `iron-select` is fired.
|
||||
*
|
||||
* @param {CustomEvent} event An `iron-select` event.
|
||||
*/
|
||||
_onIronSelect: function(event) {
|
||||
this._setSelectedItem(event.detail.item);
|
||||
},
|
||||
|
||||
/**
|
||||
* A handler that is called when `iron-deselect` is fired.
|
||||
*
|
||||
* @param {CustomEvent} event An `iron-deselect` event.
|
||||
*/
|
||||
_onIronDeselect: function(event) {
|
||||
this._setSelectedItem(null);
|
||||
},
|
||||
|
||||
/**
|
||||
* A handler that is called when the dropdown is tapped.
|
||||
*
|
||||
* @param {CustomEvent} event A tap event.
|
||||
*/
|
||||
_onTap: function(event) {
|
||||
if (Polymer.Gestures.findOriginalTarget(event) === this) {
|
||||
this.open();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Compute the label for the dropdown given a selected item.
|
||||
*
|
||||
* @param {Element} selectedItem A selected Element item, with an
|
||||
* optional `label` property.
|
||||
*/
|
||||
_selectedItemChanged: function(selectedItem) {
|
||||
var value = '';
|
||||
if (!selectedItem) {
|
||||
value = '';
|
||||
} else {
|
||||
value = selectedItem.label || selectedItem.textContent.trim();
|
||||
}
|
||||
|
||||
this._setValue(value);
|
||||
this._setSelectedItemLabel(value);
|
||||
},
|
||||
|
||||
/**
|
||||
* Compute the vertical offset of the menu based on the value of
|
||||
* `noLabelFloat`.
|
||||
*
|
||||
* @param {boolean} noLabelFloat True if the label should not float
|
||||
* above the input, otherwise false.
|
||||
*/
|
||||
_computeMenuVerticalOffset: function(noLabelFloat) {
|
||||
// NOTE(cdata): These numbers are somewhat magical because they are
|
||||
// derived from the metrics of elements internal to `paper-input`'s
|
||||
// template. The metrics will change depending on whether or not the
|
||||
// input has a floating label.
|
||||
return noLabelFloat ? -4 : 8;
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns false if the element is required and does not have a selection,
|
||||
* and true otherwise.
|
||||
* @param {*=} _value Ignored.
|
||||
* @return {boolean} true if `required` is false, or if `required` is true
|
||||
* and the element has a valid selection.
|
||||
*/
|
||||
_getValidity: function(_value) {
|
||||
return this.disabled || !this.required || (this.required && !!this.value);
|
||||
},
|
||||
|
||||
_openedChanged: function() {
|
||||
var openState = this.opened ? 'true' : 'false';
|
||||
var e = this.contentElement;
|
||||
if (e) {
|
||||
e.setAttribute('aria-expanded', openState);
|
||||
}
|
||||
}
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
</dom-module>
|
24
react-app/bower_components/paper-dropdown-menu/test/index.html
vendored
Normal file
24
react-app/bower_components/paper-dropdown-menu/test/index.html
vendored
Normal file
@ -0,0 +1,24 @@
|
||||
<!DOCTYPE html><!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
--><html><head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
||||
<title>paper-dropdown-menu tests</title>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
WCT.loadSuites([
|
||||
'paper-dropdown-menu.html',
|
||||
'paper-dropdown-menu.html?dom=shadow'
|
||||
]);
|
||||
</script>
|
||||
|
||||
|
||||
</body></html>
|
181
react-app/bower_components/paper-dropdown-menu/test/paper-dropdown-menu.html
vendored
Normal file
181
react-app/bower_components/paper-dropdown-menu/test/paper-dropdown-menu.html
vendored
Normal file
@ -0,0 +1,181 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>paper-dropdown-menu basic tests</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
<script src="../../test-fixture/test-fixture-mocha.js"></script>
|
||||
<script src="../../iron-test-helpers/mock-interactions.js"></script>
|
||||
|
||||
<link rel="import" href="../../paper-listbox/paper-listbox.html">
|
||||
<link rel="import" href="../../paper-item/paper-item.html">
|
||||
<link rel="import" href="../../test-fixture/test-fixture.html">
|
||||
<link rel="import" href="../paper-dropdown-menu.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<test-fixture id="TrivialDropdownMenu">
|
||||
<template>
|
||||
<paper-dropdown-menu no-animations>
|
||||
<paper-listbox class="dropdown-content">
|
||||
<paper-item>Foo</paper-item>
|
||||
<paper-item>Bar</paper-item>
|
||||
</paper-listbox>
|
||||
</paper-dropdown-menu>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="PreselectedDropdownMenu">
|
||||
<template>
|
||||
<paper-dropdown-menu no-animations>
|
||||
<paper-listbox class="dropdown-content" selected="1">
|
||||
<paper-item>Foo</paper-item>
|
||||
<paper-item>Bar</paper-item>
|
||||
</paper-listbox>
|
||||
</paper-dropdown-menu>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
|
||||
suite('<paper-dropdown-menu>', function() {
|
||||
var dropdownMenu;
|
||||
|
||||
setup(function() {
|
||||
dropdownMenu = fixture('TrivialDropdownMenu');
|
||||
content = Polymer.dom(dropdownMenu).querySelector('.dropdown-content');
|
||||
});
|
||||
|
||||
test('opens when tapped', function(done) {
|
||||
var contentRect = content.getBoundingClientRect();
|
||||
|
||||
expect(contentRect.width).to.be.equal(0);
|
||||
expect(contentRect.height).to.be.equal(0);
|
||||
|
||||
MockInteractions.tap(dropdownMenu);
|
||||
expect(dropdownMenu.opened).to.be.equal(true);
|
||||
|
||||
Polymer.Base.async(function() {
|
||||
contentRect = content.getBoundingClientRect();
|
||||
|
||||
expect(dropdownMenu.opened).to.be.equal(true);
|
||||
|
||||
expect(contentRect.width).to.be.greaterThan(0);
|
||||
expect(contentRect.height).to.be.greaterThan(0);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
test('closes when an item is activated', function(done) {
|
||||
MockInteractions.tap(dropdownMenu);
|
||||
|
||||
Polymer.Base.async(function() {
|
||||
var firstItem = Polymer.dom(content).querySelector('paper-item');
|
||||
|
||||
MockInteractions.tap(firstItem);
|
||||
|
||||
Polymer.Base.async(function() {
|
||||
expect(dropdownMenu.opened).to.be.equal(false);
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
test('sets selected item to the activated item', function(done) {
|
||||
MockInteractions.tap(dropdownMenu);
|
||||
|
||||
Polymer.Base.async(function() {
|
||||
var firstItem = Polymer.dom(content).querySelector('paper-item');
|
||||
|
||||
MockInteractions.tap(firstItem);
|
||||
|
||||
Polymer.Base.async(function() {
|
||||
expect(dropdownMenu.selectedItem).to.be.equal(firstItem);
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
suite('when a value is preselected', function() {
|
||||
setup(function() {
|
||||
dropdownMenu = fixture('PreselectedDropdownMenu');
|
||||
});
|
||||
|
||||
test('the input area shows the correct selection', function() {
|
||||
Polymer.dom.flush();
|
||||
var secondItem = Polymer.dom(dropdownMenu).querySelectorAll('paper-item')[1];
|
||||
expect(dropdownMenu.selectedItem).to.be.equal(secondItem);
|
||||
});
|
||||
});
|
||||
|
||||
suite('deselecting', function() {
|
||||
var menu;
|
||||
|
||||
setup(function() {
|
||||
dropdownMenu = fixture('PreselectedDropdownMenu');
|
||||
menu = Polymer.dom(dropdownMenu).querySelector('.dropdown-content');
|
||||
});
|
||||
|
||||
test('an `iron-deselect` event clears the current selection', function() {
|
||||
Polymer.dom.flush();
|
||||
menu.selected = null;
|
||||
expect(dropdownMenu.selectedItem).to.be.equal(null);
|
||||
});
|
||||
});
|
||||
|
||||
suite('validation', function() {
|
||||
test('a non required dropdown is valid regardless of its selection', function() {
|
||||
var dropdownMenu = fixture('TrivialDropdownMenu');
|
||||
menu = Polymer.dom(dropdownMenu).querySelector('.dropdown-content');
|
||||
|
||||
// no selection.
|
||||
expect(dropdownMenu.validate()).to.be.true;
|
||||
expect(dropdownMenu.invalid).to.be.false;
|
||||
expect(dropdownMenu.value).to.not.be.ok;
|
||||
|
||||
// some selection.
|
||||
menu.selected = 1;
|
||||
expect(dropdownMenu.validate()).to.be.true;
|
||||
expect(dropdownMenu.invalid).to.be.false;
|
||||
expect(dropdownMenu.value).to.be.equal('Bar');
|
||||
});
|
||||
|
||||
test('a required dropdown is invalid without a selection', function() {
|
||||
var dropdownMenu = fixture('TrivialDropdownMenu');
|
||||
dropdownMenu.required = true;
|
||||
|
||||
// no selection.
|
||||
expect(dropdownMenu.validate()).to.be.false;
|
||||
expect(dropdownMenu.invalid).to.be.true;
|
||||
expect(dropdownMenu.value).to.not.be.ok;
|
||||
});
|
||||
|
||||
test('a required dropdown is valid with a selection', function() {
|
||||
var dropdownMenu = fixture('PreselectedDropdownMenu');
|
||||
Polymer.dom.flush();
|
||||
|
||||
dropdownMenu.required = true;
|
||||
|
||||
expect(dropdownMenu.validate()).to.be.true;
|
||||
expect(dropdownMenu.invalid).to.be.false;
|
||||
expect(dropdownMenu.value).to.be.equal('Bar');
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
60
react-app/bower_components/paper-input/.bower.json
vendored
Normal file
60
react-app/bower_components/paper-input/.bower.json
vendored
Normal file
@ -0,0 +1,60 @@
|
||||
{
|
||||
"name": "paper-input",
|
||||
"version": "1.1.10",
|
||||
"description": "Material design text fields",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"input"
|
||||
],
|
||||
"main": [
|
||||
"paper-input.html",
|
||||
"paper-textarea.html",
|
||||
"paper-input-behavior.html",
|
||||
"paper-input-container.html",
|
||||
"paper-input-error.html",
|
||||
"paper-input-addon-behavior.html",
|
||||
"paper-input-char-counter.html"
|
||||
],
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/paper-input.git"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/paper-input",
|
||||
"ignore": [],
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#^1.2.0",
|
||||
"iron-autogrow-textarea": "PolymerElements/iron-autogrow-textarea#^1.0.0",
|
||||
"iron-behaviors": "PolymerElements/iron-behaviors#^1.0.0",
|
||||
"iron-form-element-behavior": "PolymerElements/iron-form-element-behavior#^1.0.0",
|
||||
"iron-input": "PolymerElements/iron-input#^1.0.0",
|
||||
"paper-styles": "PolymerElements/paper-styles#^1.1.0",
|
||||
"iron-a11y-keys-behavior": "PolymerElements/iron-a11y-keys-behavior#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
|
||||
"iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.0.0",
|
||||
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
|
||||
"iron-icon": "PolymerElements/iron-icon#^1.0.0",
|
||||
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0",
|
||||
"iron-validator-behavior": "PolymerElements/iron-validator-behavior#^1.0.0",
|
||||
"paper-icon-button": "PolymerElements/paper-icon-button#^1.0.0",
|
||||
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
|
||||
"web-component-tester": "^4.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
},
|
||||
"_release": "1.1.10",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v1.1.10",
|
||||
"commit": "d8e201099b4b2987bea1dbcf5804c0383544bbfd"
|
||||
},
|
||||
"_source": "git://github.com/polymerelements/paper-input.git",
|
||||
"_target": "^1.0.9",
|
||||
"_originalSource": "polymerelements/paper-input"
|
||||
}
|
1
react-app/bower_components/paper-input/.gitignore
vendored
Normal file
1
react-app/bower_components/paper-input/.gitignore
vendored
Normal file
@ -0,0 +1 @@
|
||||
bower_components
|
22
react-app/bower_components/paper-input/.travis.yml
vendored
Normal file
22
react-app/bower_components/paper-input/.travis.yml
vendored
Normal file
@ -0,0 +1,22 @@
|
||||
language: node_js
|
||||
sudo: false
|
||||
before_script:
|
||||
- npm install web-component-tester
|
||||
- npm install bower
|
||||
- 'export PATH=$PWD/node_modules/.bin:$PATH'
|
||||
- bower install
|
||||
env:
|
||||
global:
|
||||
- secure: TcDqx+YdNCa/DRQjdKt9dgYCPgXtPl2EZ7Nnv6bRvbcmUjW2eSr7Zwb+e0fO8wgwms/RqFaVx+u5jo7D1lnC4Ybcg1HKiMOvCyzY36MjF9oB/VKSEUC+p4tMVQfw1IZ/RmK3dD+WEWaoT/EKmNfctz7v5kR+yk2lZo44D9I7rrc=
|
||||
- secure: nh65tvhnhOrK05qKvDJKMV7Jm9yiCoG1wFkP3ZnqOHix9Ny+KmcTa41Bl6NXQdvYaMTFtzS7lMZX5cqIziyKyGWHVN30LzGMHJNz12fhcMi3nJ84trhQGcu/9qR9yDv16q9ouGlcz1VxnDOHaRAHnIKjLIbhN3aJtMtZBbnWihA=
|
||||
node_js: 4
|
||||
addons:
|
||||
firefox: latest
|
||||
apt:
|
||||
sources:
|
||||
- google-chrome
|
||||
packages:
|
||||
- google-chrome-stable
|
||||
script:
|
||||
- xvfb-run wct
|
||||
- "if [ \"${TRAVIS_PULL_REQUEST}\" = \"false\" ]; then wct -s 'default'; fi"
|
77
react-app/bower_components/paper-input/CONTRIBUTING.md
vendored
Normal file
77
react-app/bower_components/paper-input/CONTRIBUTING.md
vendored
Normal file
@ -0,0 +1,77 @@
|
||||
|
||||
<!--
|
||||
This file is autogenerated based on
|
||||
https://github.com/PolymerElements/ContributionGuide/blob/master/CONTRIBUTING.md
|
||||
|
||||
If you edit that file, it will get updated everywhere else.
|
||||
If you edit this file, your changes will get overridden :)
|
||||
|
||||
You can however override the jsbin link with one that's customized to this
|
||||
specific element:
|
||||
|
||||
jsbin=https://jsbin.com/cagaye/edit?html,output
|
||||
-->
|
||||
# Polymer Elements
|
||||
## Guide for Contributors
|
||||
|
||||
Polymer Elements are built in the open, and the Polymer authors eagerly encourage any and all forms of community contribution. When contributing, please follow these guidelines:
|
||||
|
||||
### Filing Issues
|
||||
|
||||
**If you are filing an issue to request a feature**, please provide a clear description of the feature. It can be helpful to describe answers to the following questions:
|
||||
|
||||
1. **Who will use the feature?** _“As someone filling out a form…”_
|
||||
2. **When will they use the feature?** _“When I enter an invalid value…”_
|
||||
3. **What is the user’s goal?** _“I want to be visually notified that the value needs to be corrected…”_
|
||||
|
||||
**If you are filing an issue to report a bug**, please provide:
|
||||
|
||||
1. **A clear description of the bug and related expectations.** Consider using the following example template for reporting a bug:
|
||||
|
||||
```markdown
|
||||
The `paper-foo` element causes the page to turn pink when clicked.
|
||||
|
||||
## Expected outcome
|
||||
|
||||
The page stays the same color.
|
||||
|
||||
## Actual outcome
|
||||
|
||||
The page turns pink.
|
||||
|
||||
## Steps to reproduce
|
||||
|
||||
1. Put a `paper-foo` element in the page.
|
||||
2. Open the page in a web browser.
|
||||
3. Click the `paper-foo` element.
|
||||
```
|
||||
|
||||
2. **A reduced test case that demonstrates the problem.** If possible, please include the test case as a JSBin. Start with this template to easily import and use relevant Polymer Elements: [https://jsbin.com/cagaye/edit?html,output](https://jsbin.com/cagaye/edit?html,output).
|
||||
|
||||
3. **A list of browsers where the problem occurs.** This can be skipped if the problem is the same across all browsers.
|
||||
|
||||
### Submitting Pull Requests
|
||||
|
||||
**Before creating a pull request**, please ensure that an issue exists for the corresponding change in the pull request that you intend to make. **If an issue does not exist, please create one per the guidelines above**. The goal is to discuss the design and necessity of the proposed change with Polymer authors and community before diving into a pull request.
|
||||
|
||||
When submitting pull requests, please provide:
|
||||
|
||||
1. **A reference to the corresponding issue** or issues that will be closed by the pull request. Please refer to these issues in the pull request description using the following syntax:
|
||||
|
||||
```markdown
|
||||
(For a single issue)
|
||||
Fixes #20
|
||||
|
||||
(For multiple issues)
|
||||
Fixes #32, fixes #40
|
||||
```
|
||||
|
||||
2. **A succinct description of the design** used to fix any related issues. For example:
|
||||
|
||||
```markdown
|
||||
This fixes #20 by removing styles that leaked which would cause the page to turn pink whenever `paper-foo` is clicked.
|
||||
```
|
||||
|
||||
3. **At least one test for each bug fixed or feature added** as part of the pull request. Pull requests that fix bugs or add features without accompanying tests will not be considered.
|
||||
|
||||
If a proposed change contains multiple commits, please [squash commits](https://www.google.com/url?q=http://blog.steveklabnik.com/posts/2012-11-08-how-to-squash-commits-in-a-github-pull-request) to as few as is necessary to succinctly express the change. A Polymer author can help you squash commits, so don’t be afraid to ask us if you need help with that!
|
254
react-app/bower_components/paper-input/README.md
vendored
Normal file
254
react-app/bower_components/paper-input/README.md
vendored
Normal file
@ -0,0 +1,254 @@
|
||||
|
||||
<!---
|
||||
|
||||
This README is automatically generated from the comments in these files:
|
||||
paper-input-addon-behavior.html paper-input-behavior.html paper-input-char-counter.html paper-input-container.html paper-input-error.html paper-input.html paper-textarea.html
|
||||
|
||||
Edit those files, and our readme bot will duplicate them over here!
|
||||
Edit this file, and the bot will squash your changes :)
|
||||
|
||||
The bot does some handling of markdown. Please file a bug if it does the wrong
|
||||
thing! https://github.com/PolymerLabs/tedium/issues
|
||||
|
||||
-->
|
||||
|
||||
[](https://travis-ci.org/PolymerElements/paper-input)
|
||||
|
||||
_[Demo and API docs](https://elements.polymer-project.org/elements/paper-input)_
|
||||
|
||||
|
||||
##<paper-input>
|
||||
|
||||
Material design: [Text fields](https://www.google.com/design/spec/components/text-fields.html)
|
||||
|
||||
`<paper-input>` is a single-line text field with Material Design styling.
|
||||
|
||||
```html
|
||||
<paper-input label="Input label"></paper-input>
|
||||
```
|
||||
|
||||
It may include an optional error message or character counter.
|
||||
|
||||
```html
|
||||
<paper-input error-message="Invalid input!" label="Input label"></paper-input>
|
||||
<paper-input char-counter label="Input label"></paper-input>
|
||||
```
|
||||
|
||||
It can also include custom prefix or suffix elements, which are displayed
|
||||
before or after the text input itself. In order for an element to be
|
||||
considered as a prefix, it must have the `prefix` attribute (and similarly
|
||||
for `suffix`).
|
||||
|
||||
```html
|
||||
<paper-input label="total">
|
||||
<div prefix>$</div>
|
||||
<paper-icon-button suffix icon="clear"></paper-icon-button>
|
||||
</paper-input>
|
||||
```
|
||||
|
||||
A `paper-input` can use the native `type=search` or `type=file` features.
|
||||
However, since we can't control the native styling of the input (search icon,
|
||||
file button, date placeholder, etc.), in these cases the label will be
|
||||
automatically floated. The `placeholder` attribute can still be used for
|
||||
additional informational text.
|
||||
|
||||
```html
|
||||
<paper-input label="search!" type="search"
|
||||
placeholder="search for cats" autosave="test" results="5">
|
||||
</paper-input>
|
||||
```
|
||||
|
||||
See `Polymer.PaperInputBehavior` for more API docs.
|
||||
|
||||
### Focus
|
||||
|
||||
To focus a paper-input, you can call the native `focus()` method as long as the
|
||||
paper input has a tab index.
|
||||
|
||||
### Styling
|
||||
|
||||
See `Polymer.PaperInputContainer` for a list of custom properties used to
|
||||
style this element.
|
||||
|
||||
|
||||
|
||||
##<paper-input-char-counter>
|
||||
|
||||
`<paper-input-char-counter>` is a character counter for use with `<paper-input-container>`. It
|
||||
shows the number of characters entered in the input and the max length if it is specified.
|
||||
|
||||
```html
|
||||
<paper-input-container>
|
||||
<input is="iron-input" maxlength="20">
|
||||
<paper-input-char-counter></paper-input-char-counter>
|
||||
</paper-input-container>
|
||||
```
|
||||
|
||||
### Styling
|
||||
|
||||
The following mixin is available for styling:
|
||||
|
||||
| Custom property | Description | Default |
|
||||
| --- | --- | --- |
|
||||
| `--paper-input-char-counter` | Mixin applied to the element | `{}` |
|
||||
|
||||
|
||||
|
||||
##<paper-input-container>
|
||||
|
||||
`<paper-input-container>` is a container for a `<label>`, an `<input is="iron-input">` or
|
||||
`<iron-autogrow-textarea>` and optional add-on elements such as an error message or character
|
||||
counter, used to implement Material Design text fields.
|
||||
|
||||
For example:
|
||||
|
||||
```html
|
||||
<paper-input-container>
|
||||
<label>Your name</label>
|
||||
<input is="iron-input">
|
||||
</paper-input-container>
|
||||
```
|
||||
|
||||
Do not wrap <paper-input-contanter> around elements that already include it, such as <paper-input>.
|
||||
Doing so may cause events to bounce infintely between the container and its contained element.
|
||||
|
||||
### Listening for input changes
|
||||
|
||||
By default, it listens for changes on the `bind-value` attribute on its children nodes and perform
|
||||
tasks such as auto-validating and label styling when the `bind-value` changes. You can configure
|
||||
the attribute it listens to with the `attr-for-value` attribute.
|
||||
|
||||
### Using a custom input element
|
||||
|
||||
You can use a custom input element in a `<paper-input-container>`, for example to implement a
|
||||
compound input field like a social security number input. The custom input element should have the
|
||||
`paper-input-input` class, have a `notify:true` value property and optionally implements
|
||||
`Polymer.IronValidatableBehavior` if it is validatable.
|
||||
|
||||
```html
|
||||
<paper-input-container attr-for-value="ssn-value">
|
||||
<label>Social security number</label>
|
||||
<ssn-input class="paper-input-input"></ssn-input>
|
||||
</paper-input-container>
|
||||
```
|
||||
|
||||
If you're using a `<paper-input-container>` imperatively, it's important to make sure
|
||||
that you attach its children (the `iron-input` and the optional `label`) before you
|
||||
attach the `<paper-input-container>` itself, so that it can be set up correctly.
|
||||
|
||||
### Validation
|
||||
|
||||
If the `auto-validate` attribute is set, the input container will validate the input and update
|
||||
the container styling when the input value changes.
|
||||
|
||||
### Add-ons
|
||||
|
||||
Add-ons are child elements of a `<paper-input-container>` with the `add-on` attribute and
|
||||
implements the `Polymer.PaperInputAddonBehavior` behavior. They are notified when the input value
|
||||
or validity changes, and may implement functionality such as error messages or character counters.
|
||||
They appear at the bottom of the input.
|
||||
|
||||
### Prefixes and suffixes
|
||||
|
||||
These are child elements of a `<paper-input-container>` with the `prefix`
|
||||
or `suffix` attribute, and are displayed inline with the input, before or after.
|
||||
|
||||
```html
|
||||
<paper-input-container>
|
||||
<div prefix>$</div>
|
||||
<label>Total</label>
|
||||
<input is="iron-input">
|
||||
<paper-icon-button suffix icon="clear"></paper-icon-button>
|
||||
</paper-input-container>
|
||||
```
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
| Custom property | Description | Default |
|
||||
| --- | --- | --- |
|
||||
| `--paper-input-container-color` | Label and underline color when the input is not focused | `--secondary-text-color` |
|
||||
| `--paper-input-container-focus-color` | Label and underline color when the input is focused | `--primary-color` |
|
||||
| `--paper-input-container-invalid-color` | Label and underline color when the input is is invalid | `--error-color` |
|
||||
| `--paper-input-container-input-color` | Input foreground color | `--primary-text-color` |
|
||||
| `--paper-input-container` | Mixin applied to the container | `{}` |
|
||||
| `--paper-input-container-disabled` | Mixin applied to the container when it's disabled | `{}` |
|
||||
| `--paper-input-container-label` | Mixin applied to the label | `{}` |
|
||||
| `--paper-input-container-label-focus` | Mixin applied to the label when the input is focused | `{}` |
|
||||
| `--paper-input-container-label-floating` | Mixin applied to the label when floating | `{}` |
|
||||
| `--paper-input-container-input` | Mixin applied to the input | `{}` |
|
||||
| `--paper-input-container-underline` | Mixin applied to the underline | `{}` |
|
||||
| `--paper-input-container-underline-focus` | Mixin applied to the underline when the input is focused | `{}` |
|
||||
| `--paper-input-container-underline-disabled` | Mixin applied to the underline when the input is disabled | `{}` |
|
||||
| `--paper-input-prefix` | Mixin applied to the input prefix | `{}` |
|
||||
| `--paper-input-suffix` | Mixin applied to the input suffix | `{}` |
|
||||
|
||||
This element is `display:block` by default, but you can set the `inline` attribute to make it
|
||||
`display:inline-block`.
|
||||
|
||||
|
||||
|
||||
##<paper-input-error>
|
||||
|
||||
`<paper-input-error>` is an error message for use with `<paper-input-container>`. The error is
|
||||
displayed when the `<paper-input-container>` is `invalid`.
|
||||
|
||||
```html
|
||||
<paper-input-container>
|
||||
<input is="iron-input" pattern="[0-9]*">
|
||||
<paper-input-error>Only numbers are allowed!</paper-input-error>
|
||||
</paper-input-container>
|
||||
```
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
| Custom property | Description | Default |
|
||||
| --- | --- | --- |
|
||||
| `--paper-input-container-invalid-color` | The foreground color of the error | `--error-color` |
|
||||
| `--paper-input-error` | Mixin applied to the error | `{}` |
|
||||
|
||||
|
||||
|
||||
##<paper-textarea>
|
||||
|
||||
`<paper-textarea>` is a multi-line text field with Material Design styling.
|
||||
|
||||
```html
|
||||
<paper-textarea label="Textarea label"></paper-textarea>
|
||||
```
|
||||
|
||||
See `Polymer.PaperInputBehavior` for more API docs.
|
||||
|
||||
### Validation
|
||||
|
||||
Currently only `required` and `maxlength` validation is supported.
|
||||
|
||||
### Styling
|
||||
|
||||
See `Polymer.PaperInputContainer` for a list of custom properties used to
|
||||
style this element.
|
||||
|
||||
|
||||
|
||||
##Polymer.PaperInputAddonBehavior
|
||||
|
||||
Use `Polymer.PaperInputAddonBehavior` to implement an add-on for `<paper-input-container>`. A
|
||||
add-on appears below the input, and may display information based on the input value and
|
||||
validity such as a character counter or an error message.
|
||||
|
||||
|
||||
|
||||
##Polymer.PaperInputBehavior
|
||||
|
||||
Use `Polymer.PaperInputBehavior` to implement inputs with `<paper-input-container>`. This
|
||||
behavior is implemented by `<paper-input>`. It exposes a number of properties from
|
||||
`<paper-input-container>` and `<input is="iron-input">` and they should be bound in your
|
||||
template.
|
||||
|
||||
The input element can be accessed by the `inputElement` property if you need to access
|
||||
properties or methods that are not exposed.
|
||||
|
||||
|
12
react-app/bower_components/paper-input/all-imports.html
vendored
Normal file
12
react-app/bower_components/paper-input/all-imports.html
vendored
Normal file
@ -0,0 +1,12 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="paper-input.html">
|
||||
<link rel="import" href="paper-textarea.html">
|
51
react-app/bower_components/paper-input/bower.json
vendored
Normal file
51
react-app/bower_components/paper-input/bower.json
vendored
Normal file
@ -0,0 +1,51 @@
|
||||
{
|
||||
"name": "paper-input",
|
||||
"version": "1.1.10",
|
||||
"description": "Material design text fields",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"input"
|
||||
],
|
||||
"main": [
|
||||
"paper-input.html",
|
||||
"paper-textarea.html",
|
||||
"paper-input-behavior.html",
|
||||
"paper-input-container.html",
|
||||
"paper-input-error.html",
|
||||
"paper-input-addon-behavior.html",
|
||||
"paper-input-char-counter.html"
|
||||
],
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/paper-input.git"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/paper-input",
|
||||
"ignore": [],
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#^1.2.0",
|
||||
"iron-autogrow-textarea": "PolymerElements/iron-autogrow-textarea#^1.0.0",
|
||||
"iron-behaviors": "PolymerElements/iron-behaviors#^1.0.0",
|
||||
"iron-form-element-behavior": "PolymerElements/iron-form-element-behavior#^1.0.0",
|
||||
"iron-input": "PolymerElements/iron-input#^1.0.0",
|
||||
"paper-styles": "PolymerElements/paper-styles#^1.1.0",
|
||||
"iron-a11y-keys-behavior": "PolymerElements/iron-a11y-keys-behavior#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
|
||||
"iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.0.0",
|
||||
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
|
||||
"iron-icon": "PolymerElements/iron-icon#^1.0.0",
|
||||
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0",
|
||||
"iron-validator-behavior": "PolymerElements/iron-validator-behavior#^1.0.0",
|
||||
"paper-icon-button": "PolymerElements/paper-icon-button#^1.0.0",
|
||||
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
|
||||
"web-component-tester": "^4.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
}
|
||||
}
|
155
react-app/bower_components/paper-input/demo/index.html
vendored
Normal file
155
react-app/bower_components/paper-input/demo/index.html
vendored
Normal file
@ -0,0 +1,155 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
|
||||
<title>paper-input demo</title>
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<link rel="import" href="../../iron-demo-helpers/demo-pages-shared-styles.html">
|
||||
<link rel="import" href="../../iron-demo-helpers/demo-snippet.html">
|
||||
<link rel="import" href="../../iron-icon/iron-icon.html">
|
||||
<link rel="import" href="../../iron-icons/iron-icons.html">
|
||||
<link rel="import" href="../../iron-input/iron-input.html">
|
||||
<link rel="import" href="../../paper-icon-button/paper-icon-button.html">
|
||||
<link rel="import" href="../../paper-styles/color.html">
|
||||
<link rel="import" href="../paper-input-container.html">
|
||||
<link rel="import" href="../paper-input-error.html">
|
||||
<link rel="import" href="../paper-input.html">
|
||||
<link rel="import" href="../paper-textarea.html">
|
||||
<link rel="import" href="ssn-input.html">
|
||||
|
||||
<style is="custom-style" include="demo-pages-shared-styles">
|
||||
paper-input {
|
||||
display: block;
|
||||
}
|
||||
|
||||
demo-snippet.horizontal {
|
||||
--demo-snippet-demo: {
|
||||
@apply(--layout-horizontal);
|
||||
@apply(--layout-justified);
|
||||
@apply(--layout-wrap);
|
||||
}
|
||||
}
|
||||
demo-snippet.horizontal paper-input {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
button {
|
||||
width: 70px;
|
||||
}
|
||||
|
||||
#inputForValidation {
|
||||
display: inline-block;
|
||||
width: calc(100% - 75px);
|
||||
}
|
||||
|
||||
.vertical-section-container {
|
||||
max-width: 600px;
|
||||
}
|
||||
|
||||
paper-icon-button {
|
||||
color: var(--paper-red-300);
|
||||
--paper-icon-button-ink-color: var(--paper-red-a100);
|
||||
width: 23px; /* 15px + 2*4px for padding */
|
||||
height: 23px;
|
||||
padding: 0px 4px;
|
||||
}
|
||||
|
||||
iron-icon {
|
||||
padding-right: 5px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body unresolved>
|
||||
<div class="vertical-section-container centered">
|
||||
<h3>Inputs can have different types, and be disabled</h3>
|
||||
<demo-snippet>
|
||||
<template>
|
||||
<paper-input label="text input"></paper-input>
|
||||
<paper-textarea label="autoresizing textarea input"></paper-textarea>
|
||||
<paper-input label="password input" type="password"></paper-input>
|
||||
<paper-input label="disabled input" disabled></paper-input>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h3>Inputs can have character counters</h3>
|
||||
<demo-snippet>
|
||||
<template>
|
||||
<paper-input label="simple character counter" char-counter></paper-input>
|
||||
<paper-input label="input with at most 10 characters" char-counter maxlength="10"></paper-input>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h3>The label can have different floating states</h3>
|
||||
<demo-snippet>
|
||||
<template>
|
||||
<paper-input label="this label floats after typing"></paper-input>
|
||||
<paper-input label="this label is always floating" always-float-label></paper-input>
|
||||
<paper-input label="this label never floats" no-label-float></paper-input>
|
||||
<paper-input label="this label is always floating" always-float-label placeholder="placeholder text"></paper-input>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h3>Inputs can validate automatically or on demand, and can have custom error messages</h3>
|
||||
<demo-snippet>
|
||||
<template>
|
||||
<paper-input label="this input requires some text" required auto-validate error-message="needs some text!"></paper-input>
|
||||
<paper-input label="this input requires letters only" auto-validate pattern="[a-zA-Z]*" error-message="letters only!"></paper-input>
|
||||
<paper-input label="this input will only let you type letters" auto-validate allowed-pattern="[a-zA-Z]"></paper-input>
|
||||
<paper-input id="inputForValidation" required label="this input is manually validated" pattern="[a-zA-Z]*" error-message="letters only!"></paper-input>
|
||||
<button onclick="validate()">Validate!</button>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h3>Inputs can have prefixes and suffixes</h3>
|
||||
<demo-snippet class="horizontal">
|
||||
<template>
|
||||
<paper-input label="total" type="number">
|
||||
<div prefix>$</div>
|
||||
</paper-input>
|
||||
<paper-input label="username" id="inputWithButton">
|
||||
<iron-icon icon="mail" prefix></iron-icon>
|
||||
<div suffix>@email.com</div>
|
||||
<paper-icon-button suffix onclick="clearInput()"
|
||||
icon="clear" alt="clear" title="clear">
|
||||
</paper-icon-button>
|
||||
</paper-input>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h3>Inputs can have custom logic</h3>
|
||||
<demo-snippet>
|
||||
<template>
|
||||
<paper-input-container always-float-label auto-validate attr-for-value="value">
|
||||
<label>Social Security Number</label>
|
||||
<ssn-input class="paper-input-input"></ssn-input>
|
||||
<paper-input-error>SSN invalid!</paper-input-error>
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function validate() {
|
||||
document.getElementById('inputForValidation').validate();
|
||||
}
|
||||
|
||||
function clearInput() {
|
||||
document.getElementById('inputWithButton').value = '';
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
92
react-app/bower_components/paper-input/demo/ssn-input.html
vendored
Normal file
92
react-app/bower_components/paper-input/demo/ssn-input.html
vendored
Normal file
@ -0,0 +1,92 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<link rel="import" href="../../polymer/polymer.html">
|
||||
<link rel="import" href="../../iron-input/iron-input.html">
|
||||
<link rel="import" href="../../iron-flex-layout/iron-flex-layout.html">
|
||||
<link rel="import" href="ssn-validator.html">
|
||||
|
||||
<dom-module id="ssn-input">
|
||||
<template>
|
||||
|
||||
<style>
|
||||
:host {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
input[is="iron-input"] {
|
||||
font: inherit;
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
width: auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.container {
|
||||
@apply(--layout-horizontal);
|
||||
}
|
||||
</style>
|
||||
|
||||
<ssn-validator></ssn-validator>
|
||||
|
||||
<div class="container">
|
||||
|
||||
<input is="iron-input" maxlength="3" bind-value="{{_ssn1}}" size="3" aria-label="First 3 digits of social security number">
|
||||
-
|
||||
<input is="iron-input" maxlength="2" bind-value="{{_ssn2}}" size="2" aria-label="Middle 2 digits of social security number">
|
||||
-
|
||||
<input is="iron-input" maxlength="4" bind-value="{{_ssn3}}" size="4" aria-label="Last 4 digits of social security number">
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</dom-module>
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'ssn-input',
|
||||
|
||||
behaviors: [
|
||||
Polymer.IronValidatableBehavior
|
||||
],
|
||||
|
||||
properties: {
|
||||
value: {
|
||||
notify: true,
|
||||
type: String
|
||||
},
|
||||
|
||||
_ssn1: {
|
||||
type: String
|
||||
},
|
||||
|
||||
_ssn2: {
|
||||
type: String
|
||||
},
|
||||
|
||||
_ssn3: {
|
||||
type: String
|
||||
},
|
||||
|
||||
validator: {
|
||||
type: String,
|
||||
value: 'ssn-validator'
|
||||
}
|
||||
},
|
||||
|
||||
observers: [
|
||||
'_computeValue(_ssn1,_ssn2,_ssn3)'
|
||||
],
|
||||
|
||||
_computeValue: function(ssn1, ssn2, ssn3) {
|
||||
this.value = ssn1.trim() + '-' + ssn2.trim() + '-' + ssn3.trim();
|
||||
}
|
||||
});
|
||||
</script>
|
27
react-app/bower_components/paper-input/demo/ssn-validator.html
vendored
Normal file
27
react-app/bower_components/paper-input/demo/ssn-validator.html
vendored
Normal file
@ -0,0 +1,27 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../../polymer/polymer.html">
|
||||
<link rel="import" href="../../iron-validator-behavior/iron-validator-behavior.html">
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'ssn-validator',
|
||||
|
||||
behaviors: [
|
||||
Polymer.IronValidatorBehavior
|
||||
],
|
||||
|
||||
validate: function(value) {
|
||||
// this regex validates incomplete ssn's (by design)
|
||||
return !value || value.match(/^[0-9]{0,3}-[0-9]{0,2}-[0-9]{0,4}$/);
|
||||
}
|
||||
});
|
||||
</script>
|
19
react-app/bower_components/paper-input/hero.svg
vendored
Executable file
19
react-app/bower_components/paper-input/hero.svg
vendored
Executable file
@ -0,0 +1,19 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 225 126" enable-background="new 0 0 225 126" xml:space="preserve">
|
||||
<g id="background" display="none">
|
||||
<rect display="inline" fill="#B0BEC5" width="225" height="126"/>
|
||||
</g>
|
||||
<g id="label">
|
||||
</g>
|
||||
<g id="art">
|
||||
<rect x="49" y="53" width="2" height="18"/>
|
||||
<path d="M188,78H37V44h151V78z M39,76h147V46H39V76z"/>
|
||||
<g id="ic_x5F_add_x0D_">
|
||||
</g>
|
||||
</g>
|
||||
<g id="Guides">
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 752 B |
28
react-app/bower_components/paper-input/index.html
vendored
Normal file
28
react-app/bower_components/paper-input/index.html
vendored
Normal file
@ -0,0 +1,28 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<title>paper-input</title>
|
||||
|
||||
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<link rel="import" href="../iron-component-page/iron-component-page.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<iron-component-page src="all-imports.html"></iron-component-page>
|
||||
|
||||
</body>
|
||||
</html>
|
47
react-app/bower_components/paper-input/paper-input-addon-behavior.html
vendored
Normal file
47
react-app/bower_components/paper-input/paper-input-addon-behavior.html
vendored
Normal file
@ -0,0 +1,47 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
|
||||
<script>
|
||||
|
||||
/**
|
||||
* Use `Polymer.PaperInputAddonBehavior` to implement an add-on for `<paper-input-container>`. A
|
||||
* add-on appears below the input, and may display information based on the input value and
|
||||
* validity such as a character counter or an error message.
|
||||
* @polymerBehavior
|
||||
*/
|
||||
Polymer.PaperInputAddonBehavior = {
|
||||
|
||||
hostAttributes: {
|
||||
'add-on': ''
|
||||
},
|
||||
|
||||
attached: function() {
|
||||
this.fire('addon-attached');
|
||||
},
|
||||
|
||||
/**
|
||||
* The function called by `<paper-input-container>` when the input value or validity changes.
|
||||
* @param {{
|
||||
* inputElement: (Element|undefined),
|
||||
* value: (string|undefined),
|
||||
* invalid: boolean
|
||||
* }} state -
|
||||
* inputElement: The input element.
|
||||
* value: The input value.
|
||||
* invalid: True if the input value is invalid.
|
||||
*/
|
||||
update: function(state) {
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
</script>
|
536
react-app/bower_components/paper-input/paper-input-behavior.html
vendored
Normal file
536
react-app/bower_components/paper-input/paper-input-behavior.html
vendored
Normal file
@ -0,0 +1,536 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-a11y-keys-behavior/iron-a11y-keys-behavior.html">
|
||||
<link rel="import" href="../iron-behaviors/iron-control-state.html">
|
||||
|
||||
<script>
|
||||
/**
|
||||
* Use `Polymer.PaperInputBehavior` to implement inputs with `<paper-input-container>`. This
|
||||
* behavior is implemented by `<paper-input>`. It exposes a number of properties from
|
||||
* `<paper-input-container>` and `<input is="iron-input">` and they should be bound in your
|
||||
* template.
|
||||
*
|
||||
* The input element can be accessed by the `inputElement` property if you need to access
|
||||
* properties or methods that are not exposed.
|
||||
* @polymerBehavior Polymer.PaperInputBehavior
|
||||
*/
|
||||
Polymer.PaperInputBehaviorImpl = {
|
||||
properties: {
|
||||
/**
|
||||
* Fired when the input changes due to user interaction.
|
||||
*
|
||||
* @event change
|
||||
*/
|
||||
|
||||
/**
|
||||
* The label for this input. If you're using PaperInputBehavior to
|
||||
* implement your own paper-input-like element, bind this to
|
||||
* `<label>`'s content and `hidden` property, e.g.
|
||||
* `<label hidden$="[[!label]]">[[label]]</label>` in your `template`
|
||||
*/
|
||||
label: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* The value for this input. If you're using PaperInputBehavior to
|
||||
* implement your own paper-input-like element, bind this to
|
||||
* the `<input is="iron-input">`'s `bindValue`
|
||||
* property, or the value property of your input that is `notify:true`.
|
||||
*/
|
||||
value: {
|
||||
notify: true,
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to disable this input. If you're using PaperInputBehavior to
|
||||
* implement your own paper-input-like element, bind this to
|
||||
* both the `<paper-input-container>`'s and the input's `disabled` property.
|
||||
*/
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns true if the value is invalid. If you're using PaperInputBehavior to
|
||||
* implement your own paper-input-like element, bind this to both the
|
||||
* `<paper-input-container>`'s and the input's `invalid` property.
|
||||
*
|
||||
* If `autoValidate` is true, the `invalid` attribute is managed automatically,
|
||||
* which can clobber attempts to manage it manually.
|
||||
*/
|
||||
invalid: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
notify: true
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to prevent the user from entering invalid input. If you're
|
||||
* using PaperInputBehavior to implement your own paper-input-like element,
|
||||
* bind this to `<input is="iron-input">`'s `preventInvalidInput` property.
|
||||
*/
|
||||
preventInvalidInput: {
|
||||
type: Boolean
|
||||
},
|
||||
|
||||
/**
|
||||
* Set this to specify the pattern allowed by `preventInvalidInput`. If
|
||||
* you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `allowedPattern`
|
||||
* property.
|
||||
*/
|
||||
allowedPattern: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* The type of the input. The supported types are `text`, `number` and `password`.
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like element,
|
||||
* bind this to the `<input is="iron-input">`'s `type` property.
|
||||
*/
|
||||
type: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* The datalist of the input (if any). This should match the id of an existing `<datalist>`.
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `list` property.
|
||||
*/
|
||||
list: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* A pattern to validate the `input` with. If you're using PaperInputBehavior to
|
||||
* implement your own paper-input-like element, bind this to
|
||||
* the `<input is="iron-input">`'s `pattern` property.
|
||||
*/
|
||||
pattern: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to mark the input as required. If you're using PaperInputBehavior to
|
||||
* implement your own paper-input-like element, bind this to
|
||||
* the `<input is="iron-input">`'s `required` property.
|
||||
*/
|
||||
required: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* The error message to display when the input is invalid. If you're using
|
||||
* PaperInputBehavior to implement your own paper-input-like element,
|
||||
* bind this to the `<paper-input-error>`'s content, if using.
|
||||
*/
|
||||
errorMessage: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to show a character counter.
|
||||
*/
|
||||
charCounter: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to disable the floating label. If you're using PaperInputBehavior to
|
||||
* implement your own paper-input-like element, bind this to
|
||||
* the `<paper-input-container>`'s `noLabelFloat` property.
|
||||
*/
|
||||
noLabelFloat: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to always float the label. If you're using PaperInputBehavior to
|
||||
* implement your own paper-input-like element, bind this to
|
||||
* the `<paper-input-container>`'s `alwaysFloatLabel` property.
|
||||
*/
|
||||
alwaysFloatLabel: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to auto-validate the input value. If you're using PaperInputBehavior to
|
||||
* implement your own paper-input-like element, bind this to
|
||||
* the `<paper-input-container>`'s `autoValidate` property.
|
||||
*/
|
||||
autoValidate: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* Name of the validator to use. If you're using PaperInputBehavior to
|
||||
* implement your own paper-input-like element, bind this to
|
||||
* the `<input is="iron-input">`'s `validator` property.
|
||||
*/
|
||||
validator: {
|
||||
type: String
|
||||
},
|
||||
|
||||
// HTMLInputElement attributes for binding if needed
|
||||
|
||||
/**
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `autocomplete` property.
|
||||
*/
|
||||
autocomplete: {
|
||||
type: String,
|
||||
value: 'off'
|
||||
},
|
||||
|
||||
/**
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `autofocus` property.
|
||||
*/
|
||||
autofocus: {
|
||||
type: Boolean
|
||||
},
|
||||
|
||||
/**
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `inputmode` property.
|
||||
*/
|
||||
inputmode: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* The minimum length of the input value.
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `minlength` property.
|
||||
*/
|
||||
minlength: {
|
||||
type: Number
|
||||
},
|
||||
|
||||
/**
|
||||
* The maximum length of the input value.
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `maxlength` property.
|
||||
*/
|
||||
maxlength: {
|
||||
type: Number
|
||||
},
|
||||
|
||||
/**
|
||||
* The minimum (numeric or date-time) input value.
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `min` property.
|
||||
*/
|
||||
min: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* The maximum (numeric or date-time) input value.
|
||||
* Can be a String (e.g. `"2000-1-1"`) or a Number (e.g. `2`).
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `max` property.
|
||||
*/
|
||||
max: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* Limits the numeric or date-time increments.
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `step` property.
|
||||
*/
|
||||
step: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `name` property.
|
||||
*/
|
||||
name: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* A placeholder string in addition to the label. If this is set, the label will always float.
|
||||
*/
|
||||
placeholder: {
|
||||
type: String,
|
||||
// need to set a default so _computeAlwaysFloatLabel is run
|
||||
value: ''
|
||||
},
|
||||
|
||||
/**
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `readonly` property.
|
||||
*/
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `size` property.
|
||||
*/
|
||||
size: {
|
||||
type: Number
|
||||
},
|
||||
|
||||
// Nonstandard attributes for binding if needed
|
||||
|
||||
/**
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `autocapitalize` property.
|
||||
*/
|
||||
autocapitalize: {
|
||||
type: String,
|
||||
value: 'none'
|
||||
},
|
||||
|
||||
/**
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `autocorrect` property.
|
||||
*/
|
||||
autocorrect: {
|
||||
type: String,
|
||||
value: 'off'
|
||||
},
|
||||
|
||||
/**
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `autosave` property,
|
||||
* used with type=search.
|
||||
*/
|
||||
autosave: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `results` property,
|
||||
* used with type=search.
|
||||
*/
|
||||
results: {
|
||||
type: Number
|
||||
},
|
||||
|
||||
/**
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the `<input is="iron-input">`'s `accept` property,
|
||||
* used with type=file.
|
||||
*/
|
||||
accept: {
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* If you're using PaperInputBehavior to implement your own paper-input-like
|
||||
* element, bind this to the`<input is="iron-input">`'s `multiple` property,
|
||||
* used with type=file.
|
||||
*/
|
||||
multiple: {
|
||||
type: Boolean
|
||||
},
|
||||
|
||||
_ariaDescribedBy: {
|
||||
type: String,
|
||||
value: ''
|
||||
},
|
||||
|
||||
_ariaLabelledBy: {
|
||||
type: String,
|
||||
value: ''
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
listeners: {
|
||||
'addon-attached': '_onAddonAttached',
|
||||
},
|
||||
|
||||
keyBindings: {
|
||||
'shift+tab:keydown': '_onShiftTabDown'
|
||||
},
|
||||
|
||||
hostAttributes: {
|
||||
tabindex: 0
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns a reference to the input element.
|
||||
*/
|
||||
get inputElement() {
|
||||
return this.$.input;
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns a reference to the focusable element.
|
||||
*/
|
||||
get _focusableElement() {
|
||||
return this.inputElement;
|
||||
},
|
||||
|
||||
registered: function() {
|
||||
// These types have some default placeholder text; overlapping
|
||||
// the label on top of it looks terrible. Auto-float the label in this case.
|
||||
this._typesThatHaveText = ["date", "datetime", "datetime-local", "month",
|
||||
"time", "week", "file"];
|
||||
},
|
||||
|
||||
attached: function() {
|
||||
this._updateAriaLabelledBy();
|
||||
|
||||
if (this.inputElement &&
|
||||
this._typesThatHaveText.indexOf(this.inputElement.type) !== -1) {
|
||||
this.alwaysFloatLabel = true;
|
||||
}
|
||||
},
|
||||
|
||||
_appendStringWithSpace: function(str, more) {
|
||||
if (str) {
|
||||
str = str + ' ' + more;
|
||||
} else {
|
||||
str = more;
|
||||
}
|
||||
return str;
|
||||
},
|
||||
|
||||
_onAddonAttached: function(event) {
|
||||
var target = event.path ? event.path[0] : event.target;
|
||||
if (target.id) {
|
||||
this._ariaDescribedBy = this._appendStringWithSpace(this._ariaDescribedBy, target.id);
|
||||
} else {
|
||||
var id = 'paper-input-add-on-' + Math.floor((Math.random() * 100000));
|
||||
target.id = id;
|
||||
this._ariaDescribedBy = this._appendStringWithSpace(this._ariaDescribedBy, id);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Validates the input element and sets an error style if needed.
|
||||
*
|
||||
* @return {boolean}
|
||||
*/
|
||||
validate: function() {
|
||||
return this.inputElement.validate();
|
||||
},
|
||||
|
||||
/**
|
||||
* Forward focus to inputElement. Overriden from IronControlState.
|
||||
*/
|
||||
_focusBlurHandler: function(event) {
|
||||
if (this._shiftTabPressed)
|
||||
return;
|
||||
|
||||
Polymer.IronControlState._focusBlurHandler.call(this, event);
|
||||
|
||||
// Forward the focus to the nested input.
|
||||
if (this.focused)
|
||||
this._focusableElement.focus();
|
||||
},
|
||||
|
||||
/**
|
||||
* Handler that is called when a shift+tab keypress is detected by the menu.
|
||||
*
|
||||
* @param {CustomEvent} event A key combination event.
|
||||
*/
|
||||
_onShiftTabDown: function(event) {
|
||||
var oldTabIndex = this.getAttribute('tabindex');
|
||||
this._shiftTabPressed = true;
|
||||
this.setAttribute('tabindex', '-1');
|
||||
this.async(function() {
|
||||
this.setAttribute('tabindex', oldTabIndex);
|
||||
this._shiftTabPressed = false;
|
||||
}, 1);
|
||||
},
|
||||
|
||||
/**
|
||||
* If `autoValidate` is true, then validates the element.
|
||||
*/
|
||||
_handleAutoValidate: function() {
|
||||
if (this.autoValidate)
|
||||
this.validate();
|
||||
},
|
||||
|
||||
/**
|
||||
* Restores the cursor to its original position after updating the value.
|
||||
* @param {string} newValue The value that should be saved.
|
||||
*/
|
||||
updateValueAndPreserveCaret: function(newValue) {
|
||||
// Not all elements might have selection, and even if they have the
|
||||
// right properties, accessing them might throw an exception (like for
|
||||
// <input type=number>)
|
||||
try {
|
||||
var start = this.inputElement.selectionStart;
|
||||
this.value = newValue;
|
||||
|
||||
// The cursor automatically jumps to the end after re-setting the value,
|
||||
// so restore it to its original position.
|
||||
this.inputElement.selectionStart = start;
|
||||
this.inputElement.selectionEnd = start;
|
||||
} catch (e) {
|
||||
// Just set the value and give up on the caret.
|
||||
this.value = newValue;
|
||||
}
|
||||
},
|
||||
|
||||
_computeAlwaysFloatLabel: function(alwaysFloatLabel, placeholder) {
|
||||
return placeholder || alwaysFloatLabel;
|
||||
},
|
||||
|
||||
_updateAriaLabelledBy: function() {
|
||||
var label = Polymer.dom(this.root).querySelector('label');
|
||||
if (!label) {
|
||||
this._ariaLabelledBy = '';
|
||||
return;
|
||||
}
|
||||
var labelledBy;
|
||||
if (label.id) {
|
||||
labelledBy = label.id;
|
||||
} else {
|
||||
labelledBy = 'paper-input-label-' + new Date().getUTCMilliseconds();
|
||||
label.id = labelledBy;
|
||||
}
|
||||
this._ariaLabelledBy = labelledBy;
|
||||
},
|
||||
|
||||
_onChange:function(event) {
|
||||
// In the Shadow DOM, the `change` event is not leaked into the
|
||||
// ancestor tree, so we must do this manually.
|
||||
// See https://w3c.github.io/webcomponents/spec/shadow/#events-that-are-not-leaked-into-ancestor-trees.
|
||||
if (this.shadowRoot) {
|
||||
this.fire(event.type, {sourceEvent: event}, {
|
||||
node: this,
|
||||
bubbles: event.bubbles,
|
||||
cancelable: event.cancelable
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/** @polymerBehavior */
|
||||
Polymer.PaperInputBehavior = [
|
||||
Polymer.IronControlState,
|
||||
Polymer.IronA11yKeysBehavior,
|
||||
Polymer.PaperInputBehaviorImpl
|
||||
];
|
||||
</script>
|
95
react-app/bower_components/paper-input/paper-input-char-counter.html
vendored
Normal file
95
react-app/bower_components/paper-input/paper-input-char-counter.html
vendored
Normal file
@ -0,0 +1,95 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../paper-styles/typography.html">
|
||||
<link rel="import" href="paper-input-addon-behavior.html">
|
||||
|
||||
<!--
|
||||
`<paper-input-char-counter>` is a character counter for use with `<paper-input-container>`. It
|
||||
shows the number of characters entered in the input and the max length if it is specified.
|
||||
|
||||
<paper-input-container>
|
||||
<input is="iron-input" maxlength="20">
|
||||
<paper-input-char-counter></paper-input-char-counter>
|
||||
</paper-input-container>
|
||||
|
||||
### Styling
|
||||
|
||||
The following mixin is available for styling:
|
||||
|
||||
Custom property | Description | Default
|
||||
----------------|-------------|----------
|
||||
`--paper-input-char-counter` | Mixin applied to the element | `{}`
|
||||
-->
|
||||
|
||||
<dom-module id="paper-input-char-counter">
|
||||
<template>
|
||||
<style>
|
||||
:host {
|
||||
display: inline-block;
|
||||
float: right;
|
||||
|
||||
@apply(--paper-font-caption);
|
||||
@apply(--paper-input-char-counter);
|
||||
}
|
||||
|
||||
:host-context([dir="rtl"]) {
|
||||
float: left;
|
||||
}
|
||||
</style>
|
||||
|
||||
<span>[[_charCounterStr]]</span>
|
||||
</template>
|
||||
</dom-module>
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'paper-input-char-counter',
|
||||
|
||||
behaviors: [
|
||||
Polymer.PaperInputAddonBehavior
|
||||
],
|
||||
|
||||
properties: {
|
||||
_charCounterStr: {
|
||||
type: String,
|
||||
value: '0'
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* This overrides the update function in PaperInputAddonBehavior.
|
||||
* @param {{
|
||||
* inputElement: (Element|undefined),
|
||||
* value: (string|undefined),
|
||||
* invalid: boolean
|
||||
* }} state -
|
||||
* inputElement: The input element.
|
||||
* value: The input value.
|
||||
* invalid: True if the input value is invalid.
|
||||
*/
|
||||
update: function(state) {
|
||||
if (!state.inputElement) {
|
||||
return;
|
||||
}
|
||||
|
||||
state.value = state.value || '';
|
||||
|
||||
var counter = state.value.length.toString();
|
||||
|
||||
if (state.inputElement.hasAttribute('maxlength')) {
|
||||
counter += '/' + state.inputElement.getAttribute('maxlength');
|
||||
}
|
||||
|
||||
this._charCounterStr = counter;
|
||||
}
|
||||
});
|
||||
</script>
|
617
react-app/bower_components/paper-input/paper-input-container.html
vendored
Normal file
617
react-app/bower_components/paper-input/paper-input-container.html
vendored
Normal file
@ -0,0 +1,617 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-flex-layout/iron-flex-layout.html">
|
||||
<link rel="import" href="../paper-styles/default-theme.html">
|
||||
<link rel="import" href="../paper-styles/typography.html">
|
||||
|
||||
<!--
|
||||
`<paper-input-container>` is a container for a `<label>`, an `<input is="iron-input">` or
|
||||
`<iron-autogrow-textarea>` and optional add-on elements such as an error message or character
|
||||
counter, used to implement Material Design text fields.
|
||||
|
||||
For example:
|
||||
|
||||
<paper-input-container>
|
||||
<label>Your name</label>
|
||||
<input is="iron-input">
|
||||
</paper-input-container>
|
||||
|
||||
Do not wrap <paper-input-contanter> around elements that already include it, such as <paper-input>.
|
||||
Doing so may cause events to bounce infintely between the container and its contained element.
|
||||
|
||||
### Listening for input changes
|
||||
|
||||
By default, it listens for changes on the `bind-value` attribute on its children nodes and perform
|
||||
tasks such as auto-validating and label styling when the `bind-value` changes. You can configure
|
||||
the attribute it listens to with the `attr-for-value` attribute.
|
||||
|
||||
### Using a custom input element
|
||||
|
||||
You can use a custom input element in a `<paper-input-container>`, for example to implement a
|
||||
compound input field like a social security number input. The custom input element should have the
|
||||
`paper-input-input` class, have a `notify:true` value property and optionally implements
|
||||
`Polymer.IronValidatableBehavior` if it is validatable.
|
||||
|
||||
<paper-input-container attr-for-value="ssn-value">
|
||||
<label>Social security number</label>
|
||||
<ssn-input class="paper-input-input"></ssn-input>
|
||||
</paper-input-container>
|
||||
|
||||
|
||||
If you're using a `<paper-input-container>` imperatively, it's important to make sure
|
||||
that you attach its children (the `iron-input` and the optional `label`) before you
|
||||
attach the `<paper-input-container>` itself, so that it can be set up correctly.
|
||||
|
||||
### Validation
|
||||
|
||||
If the `auto-validate` attribute is set, the input container will validate the input and update
|
||||
the container styling when the input value changes.
|
||||
|
||||
### Add-ons
|
||||
|
||||
Add-ons are child elements of a `<paper-input-container>` with the `add-on` attribute and
|
||||
implements the `Polymer.PaperInputAddonBehavior` behavior. They are notified when the input value
|
||||
or validity changes, and may implement functionality such as error messages or character counters.
|
||||
They appear at the bottom of the input.
|
||||
|
||||
### Prefixes and suffixes
|
||||
These are child elements of a `<paper-input-container>` with the `prefix`
|
||||
or `suffix` attribute, and are displayed inline with the input, before or after.
|
||||
|
||||
<paper-input-container>
|
||||
<div prefix>$</div>
|
||||
<label>Total</label>
|
||||
<input is="iron-input">
|
||||
<paper-icon-button suffix icon="clear"></paper-icon-button>
|
||||
</paper-input-container>
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
Custom property | Description | Default
|
||||
----------------|-------------|----------
|
||||
`--paper-input-container-color` | Label and underline color when the input is not focused | `--secondary-text-color`
|
||||
`--paper-input-container-focus-color` | Label and underline color when the input is focused | `--primary-color`
|
||||
`--paper-input-container-invalid-color` | Label and underline color when the input is is invalid | `--error-color`
|
||||
`--paper-input-container-input-color` | Input foreground color | `--primary-text-color`
|
||||
`--paper-input-container` | Mixin applied to the container | `{}`
|
||||
`--paper-input-container-disabled` | Mixin applied to the container when it's disabled | `{}`
|
||||
`--paper-input-container-label` | Mixin applied to the label | `{}`
|
||||
`--paper-input-container-label-focus` | Mixin applied to the label when the input is focused | `{}`
|
||||
`--paper-input-container-label-floating` | Mixin applied to the label when floating | `{}`
|
||||
`--paper-input-container-input` | Mixin applied to the input | `{}`
|
||||
`--paper-input-container-underline` | Mixin applied to the underline | `{}`
|
||||
`--paper-input-container-underline-focus` | Mixin applied to the underline when the input is focused | `{}`
|
||||
`--paper-input-container-underline-disabled` | Mixin applied to the underline when the input is disabled | `{}`
|
||||
`--paper-input-prefix` | Mixin applied to the input prefix | `{}`
|
||||
`--paper-input-suffix` | Mixin applied to the input suffix | `{}`
|
||||
|
||||
This element is `display:block` by default, but you can set the `inline` attribute to make it
|
||||
`display:inline-block`.
|
||||
-->
|
||||
|
||||
<dom-module id="paper-input-container">
|
||||
<template>
|
||||
<style>
|
||||
:host {
|
||||
display: block;
|
||||
padding: 8px 0;
|
||||
|
||||
@apply(--paper-input-container);
|
||||
}
|
||||
|
||||
:host[inline] {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
:host([disabled]) {
|
||||
pointer-events: none;
|
||||
opacity: 0.33;
|
||||
|
||||
@apply(--paper-input-container-disabled);
|
||||
}
|
||||
|
||||
.floated-label-placeholder {
|
||||
@apply(--paper-font-caption);
|
||||
}
|
||||
|
||||
.underline {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.focused-line {
|
||||
@apply(--layout-fit);
|
||||
|
||||
background: var(--paper-input-container-focus-color, --primary-color);
|
||||
height: 2px;
|
||||
|
||||
-webkit-transform-origin: center center;
|
||||
transform-origin: center center;
|
||||
-webkit-transform: scale3d(0,1,1);
|
||||
transform: scale3d(0,1,1);
|
||||
|
||||
@apply(--paper-input-container-underline-focus);
|
||||
}
|
||||
|
||||
.underline.is-highlighted .focused-line {
|
||||
-webkit-transform: none;
|
||||
transform: none;
|
||||
-webkit-transition: -webkit-transform 0.25s;
|
||||
transition: transform 0.25s;
|
||||
|
||||
@apply(--paper-transition-easing);
|
||||
}
|
||||
|
||||
.underline.is-invalid .focused-line {
|
||||
background: var(--paper-input-container-invalid-color, --error-color);
|
||||
-webkit-transform: none;
|
||||
transform: none;
|
||||
-webkit-transition: -webkit-transform 0.25s;
|
||||
transition: transform 0.25s;
|
||||
|
||||
@apply(--paper-transition-easing);
|
||||
}
|
||||
|
||||
.unfocused-line {
|
||||
@apply(--layout-fit);
|
||||
|
||||
background: var(--paper-input-container-color, --secondary-text-color);
|
||||
height: 1px;
|
||||
|
||||
@apply(--paper-input-container-underline);
|
||||
}
|
||||
|
||||
:host([disabled]) .unfocused-line {
|
||||
border-bottom: 1px dashed;
|
||||
border-color: var(--paper-input-container-color, --secondary-text-color);
|
||||
background: transparent;
|
||||
|
||||
@apply(--paper-input-container-underline-disabled);
|
||||
}
|
||||
|
||||
.label-and-input-container {
|
||||
@apply(--layout-flex-auto);
|
||||
@apply(--layout-relative);
|
||||
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.input-content {
|
||||
@apply(--layout-horizontal);
|
||||
@apply(--layout-center);
|
||||
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.input-content ::content label,
|
||||
.input-content ::content .paper-input-label {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
font: inherit;
|
||||
color: var(--paper-input-container-color, --secondary-text-color);
|
||||
-webkit-transition: -webkit-transform 0.25s, width 0.25s;
|
||||
transition: transform 0.25s, width 0.25s;
|
||||
-webkit-transform-origin: left top;
|
||||
transform-origin: left top;
|
||||
|
||||
@apply(--paper-font-common-nowrap);
|
||||
@apply(--paper-font-subhead);
|
||||
@apply(--paper-input-container-label);
|
||||
@apply(--paper-transition-easing);
|
||||
}
|
||||
|
||||
.input-content.label-is-floating ::content label,
|
||||
.input-content.label-is-floating ::content .paper-input-label {
|
||||
-webkit-transform: translateY(-75%) scale(0.75);
|
||||
transform: translateY(-75%) scale(0.75);
|
||||
|
||||
/* Since we scale to 75/100 of the size, we actually have 100/75 of the
|
||||
original space now available */
|
||||
width: 133%;
|
||||
|
||||
@apply(--paper-input-container-label-floating);
|
||||
}
|
||||
|
||||
:host-context([dir="rtl"]) .input-content.label-is-floating ::content label,
|
||||
:host-context([dir="rtl"]) .input-content.label-is-floating ::content .paper-input-label {
|
||||
/* TODO(noms): Figure out why leaving the width at 133% before the animation
|
||||
* actually makes
|
||||
* it wider on the right side, not left side, as you would expect in RTL */
|
||||
width: 100%;
|
||||
-webkit-transform-origin: right top;
|
||||
transform-origin: right top;
|
||||
}
|
||||
|
||||
.input-content.label-is-highlighted ::content label,
|
||||
.input-content.label-is-highlighted ::content .paper-input-label {
|
||||
color: var(--paper-input-container-focus-color, --primary-color);
|
||||
|
||||
@apply(--paper-input-container-label-focus);
|
||||
}
|
||||
|
||||
.input-content.is-invalid ::content label,
|
||||
.input-content.is-invalid ::content .paper-input-label {
|
||||
color: var(--paper-input-container-invalid-color, --error-color);
|
||||
}
|
||||
|
||||
.input-content.label-is-hidden ::content label,
|
||||
.input-content.label-is-hidden ::content .paper-input-label {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.input-content ::content input,
|
||||
.input-content ::content textarea,
|
||||
.input-content ::content iron-autogrow-textarea,
|
||||
.input-content ::content .paper-input-input {
|
||||
position: relative; /* to make a stacking context */
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--paper-input-container-input-color, --primary-text-color);
|
||||
-webkit-appearance: none;
|
||||
text-align: inherit;
|
||||
|
||||
@apply(--paper-font-subhead);
|
||||
@apply(--paper-input-container-input);
|
||||
}
|
||||
|
||||
::content [prefix] {
|
||||
@apply(--paper-font-subhead);
|
||||
|
||||
@apply(--paper-input-prefix);
|
||||
@apply(--layout-flex-none);
|
||||
}
|
||||
|
||||
::content [suffix] {
|
||||
@apply(--paper-font-subhead);
|
||||
|
||||
@apply(--paper-input-suffix);
|
||||
@apply(--layout-flex-none);
|
||||
}
|
||||
|
||||
/* Firefox sets a min-width on the input, which can cause layout issues */
|
||||
.input-content ::content input {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.input-content ::content textarea {
|
||||
resize: none;
|
||||
}
|
||||
|
||||
.add-on-content {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.add-on-content.is-invalid ::content * {
|
||||
color: var(--paper-input-container-invalid-color, --error-color);
|
||||
}
|
||||
|
||||
.add-on-content.is-highlighted ::content * {
|
||||
color: var(--paper-input-container-focus-color, --primary-color);
|
||||
}
|
||||
</style>
|
||||
|
||||
<template is="dom-if" if="[[!noLabelFloat]]">
|
||||
<div class="floated-label-placeholder"> </div>
|
||||
</template>
|
||||
|
||||
<div class$="[[_computeInputContentClass(noLabelFloat,alwaysFloatLabel,focused,invalid,_inputHasContent)]]">
|
||||
<content select="[prefix]" id="prefix"></content>
|
||||
|
||||
<div class="label-and-input-container" id="labelAndInputContainer">
|
||||
<content select=":not([add-on]):not([prefix]):not([suffix])"></content>
|
||||
</div>
|
||||
|
||||
<content select="[suffix]"></content>
|
||||
</div>
|
||||
|
||||
<div class$="[[_computeUnderlineClass(focused,invalid)]]">
|
||||
<div class="unfocused-line"></div>
|
||||
<div class="focused-line"></div>
|
||||
</div>
|
||||
|
||||
<div class$="[[_computeAddOnContentClass(focused,invalid)]]">
|
||||
<content id="addOnContent" select="[add-on]"></content>
|
||||
</div>
|
||||
</template>
|
||||
</dom-module>
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'paper-input-container',
|
||||
|
||||
properties: {
|
||||
/**
|
||||
* Set to true to disable the floating label. The label disappears when the input value is
|
||||
* not null.
|
||||
*/
|
||||
noLabelFloat: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to always float the floating label.
|
||||
*/
|
||||
alwaysFloatLabel: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* The attribute to listen for value changes on.
|
||||
*/
|
||||
attrForValue: {
|
||||
type: String,
|
||||
value: 'bind-value'
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to auto-validate the input value when it changes.
|
||||
*/
|
||||
autoValidate: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* True if the input is invalid. This property is set automatically when the input value
|
||||
* changes if auto-validating, or when the `iron-input-validate` event is heard from a child.
|
||||
*/
|
||||
invalid: {
|
||||
observer: '_invalidChanged',
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* True if the input has focus.
|
||||
*/
|
||||
focused: {
|
||||
readOnly: true,
|
||||
type: Boolean,
|
||||
value: false,
|
||||
notify: true
|
||||
},
|
||||
|
||||
_addons: {
|
||||
type: Array
|
||||
// do not set a default value here intentionally - it will be initialized lazily when a
|
||||
// distributed child is attached, which may occur before configuration for this element
|
||||
// in polyfill.
|
||||
},
|
||||
|
||||
_inputHasContent: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
_inputSelector: {
|
||||
type: String,
|
||||
value: 'input,textarea,.paper-input-input'
|
||||
},
|
||||
|
||||
_boundOnFocus: {
|
||||
type: Function,
|
||||
value: function() {
|
||||
return this._onFocus.bind(this);
|
||||
}
|
||||
},
|
||||
|
||||
_boundOnBlur: {
|
||||
type: Function,
|
||||
value: function() {
|
||||
return this._onBlur.bind(this);
|
||||
}
|
||||
},
|
||||
|
||||
_boundOnInput: {
|
||||
type: Function,
|
||||
value: function() {
|
||||
return this._onInput.bind(this);
|
||||
}
|
||||
},
|
||||
|
||||
_boundValueChanged: {
|
||||
type: Function,
|
||||
value: function() {
|
||||
return this._onValueChanged.bind(this);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
listeners: {
|
||||
'addon-attached': '_onAddonAttached',
|
||||
'iron-input-validate': '_onIronInputValidate'
|
||||
},
|
||||
|
||||
get _valueChangedEvent() {
|
||||
return this.attrForValue + '-changed';
|
||||
},
|
||||
|
||||
get _propertyForValue() {
|
||||
return Polymer.CaseMap.dashToCamelCase(this.attrForValue);
|
||||
},
|
||||
|
||||
get _inputElement() {
|
||||
return Polymer.dom(this).querySelector(this._inputSelector);
|
||||
},
|
||||
|
||||
get _inputElementValue() {
|
||||
return this._inputElement[this._propertyForValue] || this._inputElement.value;
|
||||
},
|
||||
|
||||
ready: function() {
|
||||
if (!this._addons) {
|
||||
this._addons = [];
|
||||
}
|
||||
this.addEventListener('focus', this._boundOnFocus, true);
|
||||
this.addEventListener('blur', this._boundOnBlur, true);
|
||||
},
|
||||
|
||||
attached: function() {
|
||||
if (this.attrForValue) {
|
||||
this._inputElement.addEventListener(this._valueChangedEvent, this._boundValueChanged);
|
||||
} else {
|
||||
this.addEventListener('input', this._onInput);
|
||||
}
|
||||
|
||||
// Only validate when attached if the input already has a value.
|
||||
if (this._inputElementValue != '') {
|
||||
this._handleValueAndAutoValidate(this._inputElement);
|
||||
} else {
|
||||
this._handleValue(this._inputElement);
|
||||
}
|
||||
},
|
||||
|
||||
_onAddonAttached: function(event) {
|
||||
if (!this._addons) {
|
||||
this._addons = [];
|
||||
}
|
||||
var target = event.target;
|
||||
if (this._addons.indexOf(target) === -1) {
|
||||
this._addons.push(target);
|
||||
if (this.isAttached) {
|
||||
this._handleValue(this._inputElement);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
_onFocus: function() {
|
||||
this._setFocused(true);
|
||||
},
|
||||
|
||||
_onBlur: function() {
|
||||
this._setFocused(false);
|
||||
this._handleValueAndAutoValidate(this._inputElement);
|
||||
},
|
||||
|
||||
_onInput: function(event) {
|
||||
this._handleValueAndAutoValidate(event.target);
|
||||
},
|
||||
|
||||
_onValueChanged: function(event) {
|
||||
this._handleValueAndAutoValidate(event.target);
|
||||
},
|
||||
|
||||
_handleValue: function(inputElement) {
|
||||
var value = this._inputElementValue;
|
||||
|
||||
// type="number" hack needed because this.value is empty until it's valid
|
||||
if (value || value === 0 || (inputElement.type === 'number' && !inputElement.checkValidity())) {
|
||||
this._inputHasContent = true;
|
||||
} else {
|
||||
this._inputHasContent = false;
|
||||
}
|
||||
|
||||
this.updateAddons({
|
||||
inputElement: inputElement,
|
||||
value: value,
|
||||
invalid: this.invalid
|
||||
});
|
||||
},
|
||||
|
||||
_handleValueAndAutoValidate: function(inputElement) {
|
||||
if (this.autoValidate) {
|
||||
var valid;
|
||||
if (inputElement.validate) {
|
||||
valid = inputElement.validate(this._inputElementValue);
|
||||
} else {
|
||||
valid = inputElement.checkValidity();
|
||||
}
|
||||
this.invalid = !valid;
|
||||
}
|
||||
|
||||
// Call this last to notify the add-ons.
|
||||
this._handleValue(inputElement);
|
||||
},
|
||||
|
||||
_onIronInputValidate: function(event) {
|
||||
this.invalid = this._inputElement.invalid;
|
||||
},
|
||||
|
||||
_invalidChanged: function() {
|
||||
if (this._addons) {
|
||||
this.updateAddons({invalid: this.invalid});
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Call this to update the state of add-ons.
|
||||
* @param {Object} state Add-on state.
|
||||
*/
|
||||
updateAddons: function(state) {
|
||||
for (var addon, index = 0; addon = this._addons[index]; index++) {
|
||||
addon.update(state);
|
||||
}
|
||||
},
|
||||
|
||||
_computeInputContentClass: function(noLabelFloat, alwaysFloatLabel, focused, invalid, _inputHasContent) {
|
||||
var cls = 'input-content';
|
||||
if (!noLabelFloat) {
|
||||
var label = this.querySelector('label');
|
||||
|
||||
if (alwaysFloatLabel || _inputHasContent) {
|
||||
cls += ' label-is-floating';
|
||||
// If the label is floating, ignore any offsets that may have been
|
||||
// applied from a prefix element.
|
||||
this.$.labelAndInputContainer.style.position = 'static';
|
||||
|
||||
if (invalid) {
|
||||
cls += ' is-invalid';
|
||||
} else if (focused) {
|
||||
cls += " label-is-highlighted";
|
||||
}
|
||||
} else {
|
||||
// When the label is not floating, it should overlap the input element.
|
||||
if (label) {
|
||||
this.$.labelAndInputContainer.style.position = 'relative';
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (_inputHasContent) {
|
||||
cls += ' label-is-hidden';
|
||||
}
|
||||
}
|
||||
return cls;
|
||||
},
|
||||
|
||||
_computeUnderlineClass: function(focused, invalid) {
|
||||
var cls = 'underline';
|
||||
if (invalid) {
|
||||
cls += ' is-invalid';
|
||||
} else if (focused) {
|
||||
cls += ' is-highlighted'
|
||||
}
|
||||
return cls;
|
||||
},
|
||||
|
||||
_computeAddOnContentClass: function(focused, invalid) {
|
||||
var cls = 'add-on-content';
|
||||
if (invalid) {
|
||||
cls += ' is-invalid';
|
||||
} else if (focused) {
|
||||
cls += ' is-highlighted'
|
||||
}
|
||||
return cls;
|
||||
}
|
||||
});
|
||||
</script>
|
94
react-app/bower_components/paper-input/paper-input-error.html
vendored
Normal file
94
react-app/bower_components/paper-input/paper-input-error.html
vendored
Normal file
@ -0,0 +1,94 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../paper-styles/default-theme.html">
|
||||
<link rel="import" href="../paper-styles/typography.html">
|
||||
<link rel="import" href="paper-input-addon-behavior.html">
|
||||
|
||||
<!--
|
||||
`<paper-input-error>` is an error message for use with `<paper-input-container>`. The error is
|
||||
displayed when the `<paper-input-container>` is `invalid`.
|
||||
|
||||
<paper-input-container>
|
||||
<input is="iron-input" pattern="[0-9]*">
|
||||
<paper-input-error>Only numbers are allowed!</paper-input-error>
|
||||
</paper-input-container>
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
Custom property | Description | Default
|
||||
----------------|-------------|----------
|
||||
`--paper-input-container-invalid-color` | The foreground color of the error | `--error-color`
|
||||
`--paper-input-error` | Mixin applied to the error | `{}`
|
||||
-->
|
||||
|
||||
<dom-module id="paper-input-error">
|
||||
<template>
|
||||
<style>
|
||||
:host {
|
||||
display: inline-block;
|
||||
visibility: hidden;
|
||||
|
||||
color: var(--paper-input-container-invalid-color, --error-color);
|
||||
|
||||
@apply(--paper-font-caption);
|
||||
@apply(--paper-input-error);
|
||||
position: absolute;
|
||||
left:0;
|
||||
right:0;
|
||||
}
|
||||
|
||||
:host([invalid]) {
|
||||
visibility: visible;
|
||||
};
|
||||
</style>
|
||||
|
||||
<content></content>
|
||||
</template>
|
||||
</dom-module>
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'paper-input-error',
|
||||
|
||||
behaviors: [
|
||||
Polymer.PaperInputAddonBehavior
|
||||
],
|
||||
|
||||
properties: {
|
||||
/**
|
||||
* True if the error is showing.
|
||||
*/
|
||||
invalid: {
|
||||
readOnly: true,
|
||||
reflectToAttribute: true,
|
||||
type: Boolean
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* This overrides the update function in PaperInputAddonBehavior.
|
||||
* @param {{
|
||||
* inputElement: (Element|undefined),
|
||||
* value: (string|undefined),
|
||||
* invalid: boolean
|
||||
* }} state -
|
||||
* inputElement: The input element.
|
||||
* value: The input value.
|
||||
* invalid: True if the input value is invalid.
|
||||
*/
|
||||
update: function(state) {
|
||||
this._setInvalid(state.invalid);
|
||||
}
|
||||
});
|
||||
</script>
|
158
react-app/bower_components/paper-input/paper-input.html
vendored
Normal file
158
react-app/bower_components/paper-input/paper-input.html
vendored
Normal file
@ -0,0 +1,158 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-form-element-behavior/iron-form-element-behavior.html">
|
||||
<link rel="import" href="../iron-input/iron-input.html">
|
||||
<link rel="import" href="paper-input-behavior.html">
|
||||
<link rel="import" href="paper-input-char-counter.html">
|
||||
<link rel="import" href="paper-input-container.html">
|
||||
<link rel="import" href="paper-input-error.html">
|
||||
|
||||
<!--
|
||||
Material design: [Text fields](https://www.google.com/design/spec/components/text-fields.html)
|
||||
|
||||
`<paper-input>` is a single-line text field with Material Design styling.
|
||||
|
||||
<paper-input label="Input label"></paper-input>
|
||||
|
||||
It may include an optional error message or character counter.
|
||||
|
||||
<paper-input error-message="Invalid input!" label="Input label"></paper-input>
|
||||
<paper-input char-counter label="Input label"></paper-input>
|
||||
|
||||
It can also include custom prefix or suffix elements, which are displayed
|
||||
before or after the text input itself. In order for an element to be
|
||||
considered as a prefix, it must have the `prefix` attribute (and similarly
|
||||
for `suffix`).
|
||||
|
||||
<paper-input label="total">
|
||||
<div prefix>$</div>
|
||||
<paper-icon-button suffix icon="clear"></paper-icon-button>
|
||||
</paper-input>
|
||||
|
||||
A `paper-input` can use the native `type=search` or `type=file` features.
|
||||
However, since we can't control the native styling of the input (search icon,
|
||||
file button, date placeholder, etc.), in these cases the label will be
|
||||
automatically floated. The `placeholder` attribute can still be used for
|
||||
additional informational text.
|
||||
|
||||
<paper-input label="search!" type="search"
|
||||
placeholder="search for cats" autosave="test" results="5">
|
||||
</paper-input>
|
||||
|
||||
See `Polymer.PaperInputBehavior` for more API docs.
|
||||
|
||||
### Focus
|
||||
|
||||
To focus a paper-input, you can call the native `focus()` method as long as the
|
||||
paper input has a tab index.
|
||||
|
||||
### Styling
|
||||
|
||||
See `Polymer.PaperInputContainer` for a list of custom properties used to
|
||||
style this element.
|
||||
|
||||
|
||||
@group Paper Elements
|
||||
@element paper-input
|
||||
@hero hero.svg
|
||||
@demo demo/index.html
|
||||
-->
|
||||
|
||||
<dom-module id="paper-input">
|
||||
<template>
|
||||
<style>
|
||||
:host {
|
||||
display: block;
|
||||
}
|
||||
|
||||
input::-webkit-input-placeholder {
|
||||
color: var(--paper-input-container-color, --secondary-text-color);
|
||||
}
|
||||
|
||||
input:-moz-placeholder {
|
||||
color: var(--paper-input-container-color, --secondary-text-color);
|
||||
}
|
||||
|
||||
input::-moz-placeholder {
|
||||
color: var(--paper-input-container-color, --secondary-text-color);
|
||||
}
|
||||
|
||||
input:-ms-input-placeholder {
|
||||
color: var(--paper-input-container-color, --secondary-text-color);
|
||||
}
|
||||
</style>
|
||||
|
||||
<paper-input-container no-label-float="[[noLabelFloat]]" always-float-label="[[_computeAlwaysFloatLabel(alwaysFloatLabel,placeholder)]]" auto-validate$="[[autoValidate]]" disabled$="[[disabled]]" invalid="[[invalid]]">
|
||||
|
||||
<content select="[prefix]"></content>
|
||||
|
||||
<label hidden$="[[!label]]">[[label]]</label>
|
||||
|
||||
<input is="iron-input" id="input"
|
||||
aria-labelledby$="[[_ariaLabelledBy]]"
|
||||
aria-describedby$="[[_ariaDescribedBy]]"
|
||||
disabled$="[[disabled]]"
|
||||
title$="[[title]]"
|
||||
bind-value="{{value}}"
|
||||
invalid="{{invalid}}"
|
||||
prevent-invalid-input="[[preventInvalidInput]]"
|
||||
allowed-pattern="[[allowedPattern]]"
|
||||
validator="[[validator]]"
|
||||
type$="[[type]]"
|
||||
pattern$="[[pattern]]"
|
||||
required$="[[required]]"
|
||||
autocomplete$="[[autocomplete]]"
|
||||
autofocus$="[[autofocus]]"
|
||||
inputmode$="[[inputmode]]"
|
||||
minlength$="[[minlength]]"
|
||||
maxlength$="[[maxlength]]"
|
||||
min$="[[min]]"
|
||||
max$="[[max]]"
|
||||
step$="[[step]]"
|
||||
name$="[[name]]"
|
||||
placeholder$="[[placeholder]]"
|
||||
readonly$="[[readonly]]"
|
||||
list$="[[list]]"
|
||||
size$="[[size]]"
|
||||
autocapitalize$="[[autocapitalize]]"
|
||||
autocorrect$="[[autocorrect]]"
|
||||
on-change="_onChange"
|
||||
tabindex$="[[tabindex]]"
|
||||
autosave$="[[autosave]]"
|
||||
results$="[[results]]"
|
||||
accept$="[[accept]]"
|
||||
multiple$="[[multiple]]">
|
||||
|
||||
<content select="[suffix]"></content>
|
||||
|
||||
<template is="dom-if" if="[[errorMessage]]">
|
||||
<paper-input-error>[[errorMessage]]</paper-input-error>
|
||||
</template>
|
||||
|
||||
<template is="dom-if" if="[[charCounter]]">
|
||||
<paper-input-char-counter></paper-input-char-counter>
|
||||
</template>
|
||||
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</dom-module>
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'paper-input',
|
||||
|
||||
behaviors: [
|
||||
Polymer.IronFormElementBehavior,
|
||||
Polymer.PaperInputBehavior
|
||||
]
|
||||
});
|
||||
</script>
|
134
react-app/bower_components/paper-input/paper-textarea.html
vendored
Normal file
134
react-app/bower_components/paper-input/paper-textarea.html
vendored
Normal file
@ -0,0 +1,134 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-autogrow-textarea/iron-autogrow-textarea.html">
|
||||
<link rel="import" href="../iron-form-element-behavior/iron-form-element-behavior.html">
|
||||
<link rel="import" href="paper-input-behavior.html">
|
||||
<link rel="import" href="paper-input-char-counter.html">
|
||||
<link rel="import" href="paper-input-container.html">
|
||||
<link rel="import" href="paper-input-error.html">
|
||||
|
||||
<!--
|
||||
`<paper-textarea>` is a multi-line text field with Material Design styling.
|
||||
|
||||
<paper-textarea label="Textarea label"></paper-textarea>
|
||||
|
||||
See `Polymer.PaperInputBehavior` for more API docs.
|
||||
|
||||
### Validation
|
||||
|
||||
Currently only `required` and `maxlength` validation is supported.
|
||||
|
||||
### Styling
|
||||
|
||||
See `Polymer.PaperInputContainer` for a list of custom properties used to
|
||||
style this element.
|
||||
-->
|
||||
|
||||
<dom-module id="paper-textarea">
|
||||
<template>
|
||||
<style>
|
||||
:host {
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
|
||||
<paper-input-container no-label-float$="[[noLabelFloat]]" always-float-label="[[_computeAlwaysFloatLabel(alwaysFloatLabel,placeholder)]]" auto-validate$="[[autoValidate]]" disabled$="[[disabled]]" invalid="[[invalid]]">
|
||||
|
||||
<label hidden$="[[!label]]">[[label]]</label>
|
||||
|
||||
<iron-autogrow-textarea id="input" class="paper-input-input"
|
||||
bind-value="{{value}}"
|
||||
disabled$="[[disabled]]"
|
||||
autocomplete$="[[autocomplete]]"
|
||||
autofocus$="[[autofocus]]"
|
||||
inputmode$="[[inputmode]]"
|
||||
name$="[[name]]"
|
||||
placeholder$="[[placeholder]]"
|
||||
readonly$="[[readonly]]"
|
||||
required$="[[required]]"
|
||||
maxlength$="[[maxlength]]"
|
||||
autocapitalize$="[[autocapitalize]]"
|
||||
rows$="[[rows]]"
|
||||
max-rows$="[[maxRows]]"
|
||||
on-change="_onChange"></iron-autogrow-textarea>
|
||||
|
||||
<template is="dom-if" if="[[errorMessage]]">
|
||||
<paper-input-error>[[errorMessage]]</paper-input-error>
|
||||
</template>
|
||||
|
||||
<template is="dom-if" if="[[charCounter]]">
|
||||
<paper-input-char-counter></paper-input-char-counter>
|
||||
</template>
|
||||
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</dom-module>
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'paper-textarea',
|
||||
|
||||
behaviors: [
|
||||
Polymer.PaperInputBehavior,
|
||||
Polymer.IronFormElementBehavior
|
||||
],
|
||||
|
||||
properties: {
|
||||
_ariaLabelledBy: {
|
||||
observer: '_ariaLabelledByChanged',
|
||||
type: String
|
||||
},
|
||||
|
||||
_ariaDescribedBy: {
|
||||
observer: '_ariaDescribedByChanged',
|
||||
type: String
|
||||
},
|
||||
|
||||
/**
|
||||
* The initial number of rows.
|
||||
*
|
||||
* @attribute rows
|
||||
* @type number
|
||||
* @default 1
|
||||
*/
|
||||
rows: {
|
||||
type: Number,
|
||||
value: 1
|
||||
},
|
||||
|
||||
/**
|
||||
* The maximum number of rows this element can grow to until it
|
||||
* scrolls. 0 means no maximum.
|
||||
*
|
||||
* @attribute maxRows
|
||||
* @type number
|
||||
* @default 0
|
||||
*/
|
||||
maxRows: {
|
||||
type: Number,
|
||||
value: 0
|
||||
}
|
||||
},
|
||||
|
||||
_ariaLabelledByChanged: function(ariaLabelledBy) {
|
||||
this.$.input.textarea.setAttribute('aria-labelledby', ariaLabelledBy);
|
||||
},
|
||||
|
||||
_ariaDescribedByChanged: function(ariaDescribedBy) {
|
||||
this.$.input.textarea.setAttribute('aria-describedby', ariaDescribedBy);
|
||||
},
|
||||
|
||||
get _focusableElement() {
|
||||
return this.$.input.textarea;
|
||||
},
|
||||
});
|
||||
</script>
|
31
react-app/bower_components/paper-input/test/index.html
vendored
Normal file
31
react-app/bower_components/paper-input/test/index.html
vendored
Normal file
@ -0,0 +1,31 @@
|
||||
<!DOCTYPE html><!--
|
||||
Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
--><html><head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
||||
<title>paper-input tests</title>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
WCT.loadSuites([
|
||||
'paper-input.html',
|
||||
'paper-textarea.html',
|
||||
'paper-input-container.html',
|
||||
'paper-input-error.html',
|
||||
'paper-input-char-counter.html',
|
||||
'paper-input.html?dom=shadow',
|
||||
'paper-textarea.html?dom=shadow',
|
||||
'paper-input-container.html?dom=shadow',
|
||||
'paper-input-error.html?dom=shadow',
|
||||
'paper-input-char-counter.html?dom=shadow'
|
||||
]);
|
||||
</script>
|
||||
|
||||
|
||||
</body></html>
|
30
react-app/bower_components/paper-input/test/letters-only.html
vendored
Normal file
30
react-app/bower_components/paper-input/test/letters-only.html
vendored
Normal file
@ -0,0 +1,30 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../../polymer/polymer.html">
|
||||
<link rel="import" href="../../iron-validator-behavior/iron-validator-behavior.html">
|
||||
|
||||
<script>
|
||||
|
||||
Polymer({
|
||||
|
||||
is: 'letters-only',
|
||||
|
||||
behaviors: [
|
||||
Polymer.IronValidatorBehavior
|
||||
],
|
||||
|
||||
validate: function(value) {
|
||||
return !value || value.match(/^[a-zA-Z]*$/) !== null;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
</script>
|
108
react-app/bower_components/paper-input/test/paper-input-char-counter.html
vendored
Normal file
108
react-app/bower_components/paper-input/test/paper-input-char-counter.html
vendored
Normal file
@ -0,0 +1,108 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>paper-input-counter tests</title>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
<script src="../../iron-test-helpers/test-helpers.js"></script>
|
||||
|
||||
<link rel="import" href="../../iron-input/iron-input.html">
|
||||
<link rel="import" href="../paper-input-container.html">
|
||||
<link rel="import" href="../paper-input-char-counter.html">
|
||||
<link rel="import" href="../paper-textarea.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<test-fixture id="counter">
|
||||
<template>
|
||||
<paper-input-container>
|
||||
<label id="l">label</label>
|
||||
<input id="i" value="foobar">
|
||||
<paper-input-char-counter id="c"></paper-input-char-counter>
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="counter-with-max">
|
||||
<template>
|
||||
<paper-input-container>
|
||||
<label id="l">label</label>
|
||||
<input id="i" value="foobar" maxlength="10">
|
||||
<paper-input-char-counter id="c"></paper-input-char-counter>
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="textarea">
|
||||
<template>
|
||||
<paper-textarea char-counter value="foobar"></paper-textarea>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="textarea-with-max">
|
||||
<template>
|
||||
<paper-textarea char-counter value="foobar" maxlength="100"></paper-textarea>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
|
||||
suite('basic', function() {
|
||||
|
||||
test('character counter shows the value length', function() {
|
||||
var container = fixture('counter');
|
||||
var input = Polymer.dom(container).querySelector('#i');
|
||||
var counter = Polymer.dom(container).querySelector('#c');
|
||||
assert.equal(counter._charCounterStr, input.value.length, 'character counter shows input value length');
|
||||
});
|
||||
|
||||
test('character counter shows the value length with maxlength', function() {
|
||||
var container = fixture('counter-with-max');
|
||||
var input = Polymer.dom(container).querySelector('#i');
|
||||
var counter = Polymer.dom(container).querySelector('#c');
|
||||
assert.equal(counter._charCounterStr, input.value.length + '/' + input.maxLength, 'character counter shows input value length and maxLength');
|
||||
});
|
||||
|
||||
test('character counter shows the value length with maxlength', function() {
|
||||
var input = fixture('textarea-with-max');
|
||||
forceXIfStamp(input);
|
||||
|
||||
var counter = Polymer.dom(input.root).querySelector('paper-input-char-counter');
|
||||
assert.ok(counter, 'paper-input-char-counter exists');
|
||||
|
||||
assert.equal(counter._charCounterStr, input.value.length + '/' + input.inputElement.textarea.getAttribute('maxlength'), 'character counter shows input value length and maxLength');
|
||||
});
|
||||
|
||||
test('character counter counts new lines in textareas correctly', function() {
|
||||
var input = fixture('textarea');
|
||||
input.value = 'foo\nbar';
|
||||
forceXIfStamp(input);
|
||||
|
||||
var counter = Polymer.dom(input.root).querySelector('paper-input-char-counter')
|
||||
assert.ok(counter, 'paper-input-char-counter exists');
|
||||
|
||||
assert.equal(counter._charCounterStr, input.value.length, 'character counter shows the value length');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
301
react-app/bower_components/paper-input/test/paper-input-container.html
vendored
Normal file
301
react-app/bower_components/paper-input/test/paper-input-container.html
vendored
Normal file
@ -0,0 +1,301 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>paper-input-container tests</title>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
<script src="../../iron-test-helpers/mock-interactions.js"></script>
|
||||
|
||||
<link rel="import" href="../../iron-input/iron-input.html">
|
||||
<link rel="import" href="../paper-input-container.html">
|
||||
<link rel="import" href="letters-only.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<test-fixture id="basic">
|
||||
<template>
|
||||
<paper-input-container>
|
||||
<label id="l">label</label>
|
||||
<input id="i">
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="prefix">
|
||||
<template>
|
||||
<paper-input-container>
|
||||
<div prefix>$</div>
|
||||
<label id="l">label</label>
|
||||
<input is="iron-input" id="i">
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="prefix-has-value">
|
||||
<template>
|
||||
<paper-input-container>
|
||||
<div prefix>$</div>
|
||||
<label id="l">label</label>
|
||||
<input is="iron-input" id="i" value="foo">
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="has-value">
|
||||
<template>
|
||||
<paper-input-container>
|
||||
<label id="l">label</label>
|
||||
<input id="i" value="value">
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="no-float-has-value">
|
||||
<template>
|
||||
<paper-input-container no-label-float>
|
||||
<label id="l">label</label>
|
||||
<input id="i" value="value">
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="always-float">
|
||||
<template>
|
||||
<paper-input-container always-float-label>
|
||||
<label id="l">label</label>
|
||||
<input id="i" value="value">
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="auto-validate-numbers">
|
||||
<template>
|
||||
<paper-input-container auto-validate>
|
||||
<label id="l">label</label>
|
||||
<input is="iron-input" id="i" pattern="[0-9]*">
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="manual-validate-numbers">
|
||||
<template>
|
||||
<paper-input-container>
|
||||
<label id="l">label</label>
|
||||
<input is="iron-input" id="i" pattern="[0-9]*">
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<letters-only></letters-only>
|
||||
|
||||
<test-fixture id="auto-validate-validator">
|
||||
<template>
|
||||
<paper-input-container auto-validate>
|
||||
<label id="l">label</label>
|
||||
<input is="iron-input" id="i" pattern="[0-9]*" validator="letters-only">
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="auto-validate-validator-has-invalid-value">
|
||||
<template>
|
||||
<paper-input-container auto-validate>
|
||||
<label id="l">label</label>
|
||||
<input is="iron-input" id="i" validator="letters-only" value="123123">
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
|
||||
function getTransform(node) {
|
||||
var style = getComputedStyle(node);
|
||||
return style.transform || style.webkitTransform;
|
||||
}
|
||||
|
||||
suite('basic', function() {
|
||||
test('can be created imperatively', function() {
|
||||
var container = document.createElement('paper-input-container');
|
||||
var input = document.createElement('input', 'iron-input');
|
||||
input.className = 'paper-input-input';
|
||||
input.id = 'input';
|
||||
|
||||
var label = document.createElement('label');
|
||||
label.innerHTML = 'label';
|
||||
|
||||
Polymer.dom(container).appendChild(label);
|
||||
Polymer.dom(container).appendChild(input);
|
||||
|
||||
document.body.appendChild(container);
|
||||
assert.isOk(container);
|
||||
document.body.removeChild(container);
|
||||
});
|
||||
});
|
||||
|
||||
suite('label position', function() {
|
||||
|
||||
test('label is visible by default', function() {
|
||||
var container = fixture('basic');
|
||||
assert.equal(getComputedStyle(container.querySelector('#l')).visibility, 'visible', 'label has visibility:visible');
|
||||
});
|
||||
|
||||
test('label is floated if value is initialized to not null', function(done) {
|
||||
var container = fixture('has-value');
|
||||
requestAnimationFrame(function() {
|
||||
assert.notEqual(getTransform(container.querySelector('#l')), 'none', 'label has transform');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
test('label is invisible if no-label-float and value is initialized to not null', function() {
|
||||
var container = fixture('no-float-has-value');
|
||||
assert.equal(getComputedStyle(container.querySelector('#l')).visibility, 'hidden', 'label has visibility:hidden');
|
||||
});
|
||||
|
||||
test('label is floated if always-float-label is true', function() {
|
||||
var container = fixture('always-float');
|
||||
assert.notEqual(getTransform(container.querySelector('#l')), 'none', 'label has transform');
|
||||
});
|
||||
|
||||
test('label is floated correctly with a prefix', function(done) {
|
||||
var container = fixture('prefix');
|
||||
var label = Polymer.dom(container).querySelector('#l');
|
||||
var input = Polymer.dom(container).querySelector('#i');
|
||||
|
||||
// Label is initially visible.
|
||||
assert.equal(getComputedStyle(label).visibility, 'visible', 'label has visibility:visible');
|
||||
|
||||
// After entering text, the label floats, and it is not indented.
|
||||
input.bindValue = 'foobar';
|
||||
requestAnimationFrame(function() {
|
||||
assert.notEqual(getTransform(label), 'none', 'label has transform');
|
||||
assert.equal(label.getBoundingClientRect().left, container.getBoundingClientRect().left);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
test('label is floated correctly with a prefix and prefilled value', function(done) {
|
||||
var container = fixture('prefix-has-value');
|
||||
var label = Polymer.dom(container).querySelector('#l');
|
||||
|
||||
// The label floats, and it is not indented.
|
||||
requestAnimationFrame(function() {
|
||||
assert.notEqual(getTransform(label), 'none', 'label has transform');
|
||||
assert.equal(label.getBoundingClientRect().left, container.getBoundingClientRect().left);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
suite('focused styling', function() {
|
||||
|
||||
test('label is colored when input is focused and has value', function(done) {
|
||||
var container = fixture('has-value');
|
||||
var label = Polymer.dom(container).querySelector('#l');
|
||||
var input = Polymer.dom(container).querySelector('#i');
|
||||
var inputContent = Polymer.dom(container.root).querySelector('.input-content');
|
||||
MockInteractions.focus(input);
|
||||
requestAnimationFrame(function() {
|
||||
assert.isTrue(container.focused, 'focused is true');
|
||||
assert.isTrue(inputContent.classList.contains('label-is-highlighted'), 'label is highlighted when input has focus');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
test('label is not colored when input is focused and has null value', function(done) {
|
||||
var container = fixture('basic');
|
||||
var label = Polymer.dom(container).querySelector('#l');
|
||||
var input = Polymer.dom(container).querySelector('#i');
|
||||
var inputContent = Polymer.dom(container.root).querySelector('.input-content');
|
||||
MockInteractions.focus(input);
|
||||
requestAnimationFrame(function() {
|
||||
assert.isFalse(inputContent.classList.contains('label-is-highlighted'), 'label is not highlighted when input has focus and has null value');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
test('underline is colored when input is focused', function(done) {
|
||||
var container = fixture('basic');
|
||||
var input = Polymer.dom(container).querySelector('#i');
|
||||
var line = Polymer.dom(container.root).querySelector('.underline');
|
||||
assert.isFalse(line.classList.contains('is-highlighted'), 'line is not highlighted when input is not focused');
|
||||
MockInteractions.focus(input);
|
||||
requestAnimationFrame(function() {
|
||||
assert.isTrue(line.classList.contains('is-highlighted'), 'line is highlighted when input is focused');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
suite('validation', function() {
|
||||
|
||||
test('styled when the input is set to an invalid value with auto-validate', function() {
|
||||
var container = fixture('auto-validate-numbers');
|
||||
var input = Polymer.dom(container).querySelector('#i');
|
||||
var inputContent = Polymer.dom(container.root).querySelector('.input-content');
|
||||
var line = Polymer.dom(container.root).querySelector('.underline');
|
||||
|
||||
input.bindValue = 'foobar';
|
||||
|
||||
assert.isTrue(container.invalid, 'invalid is true');
|
||||
assert.isTrue(inputContent.classList.contains('is-invalid'), 'label has invalid styling when input is invalid');
|
||||
assert.isTrue(line.classList.contains('is-invalid'), 'underline has invalid styling when input is invalid');
|
||||
});
|
||||
|
||||
test('styled when the input is set to an invalid value with auto-validate, with validator', function() {
|
||||
var container = fixture('auto-validate-validator');
|
||||
var input = Polymer.dom(container).querySelector('#i');
|
||||
var inputContent = Polymer.dom(container.root).querySelector('.input-content');
|
||||
var line = Polymer.dom(container.root).querySelector('.underline');
|
||||
|
||||
input.bindValue = '123123';
|
||||
|
||||
assert.isTrue(container.invalid, 'invalid is true');
|
||||
assert.isTrue(inputContent.classList.contains('is-invalid'), 'label has invalid styling when input is invalid');
|
||||
assert.isTrue(line.classList.contains('is-invalid'), 'underline has invalid styling when input is invalid');
|
||||
});
|
||||
|
||||
test('styled when the input is set initially to an invalid value with auto-validate, with validator', function() {
|
||||
var container = fixture('auto-validate-validator-has-invalid-value');
|
||||
assert.isTrue(container.invalid, 'invalid is true');
|
||||
assert.isTrue(Polymer.dom(container.root).querySelector('.underline').classList.contains('is-invalid'), 'underline has is-invalid class');
|
||||
});
|
||||
|
||||
test('styled when the input is set to an invalid value with manual validation', function() {
|
||||
var container = fixture('manual-validate-numbers');
|
||||
var input = Polymer.dom(container).querySelector('#i');
|
||||
var inputContent = Polymer.dom(container.root).querySelector('.input-content');
|
||||
var line = Polymer.dom(container.root).querySelector('.underline');
|
||||
|
||||
input.bindValue = 'foobar';
|
||||
input.validate();
|
||||
|
||||
assert.isTrue(container.invalid, 'invalid is true');
|
||||
assert.isTrue(inputContent.classList.contains('is-invalid'), 'label has invalid styling when input is invalid');
|
||||
assert.isTrue(line.classList.contains('is-invalid'), 'underline has invalid styling when input is invalid');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
67
react-app/bower_components/paper-input/test/paper-input-error.html
vendored
Normal file
67
react-app/bower_components/paper-input/test/paper-input-error.html
vendored
Normal file
@ -0,0 +1,67 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>paper-input-error tests</title>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
|
||||
<link rel="import" href="../../iron-input/iron-input.html">
|
||||
<link rel="import" href="../paper-input-container.html">
|
||||
<link rel="import" href="../paper-input-error.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<paper-input-container id="container">
|
||||
<input is="iron-input">
|
||||
<paper-input-error>error</paper-input-error>
|
||||
</paper-input-container>
|
||||
|
||||
<test-fixture id="auto-validate-numbers">
|
||||
<template>
|
||||
<paper-input-container auto-validate attr-for-value="bind-value">
|
||||
<label id="l">label</label>
|
||||
<input is="iron-input" id="i" pattern="[0-9]*">
|
||||
<paper-input-error id="e">error</paper-input-error>
|
||||
</paper-input-container>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
|
||||
suite('basic', function() {
|
||||
|
||||
test('error message only appears when input is invalid', function() {
|
||||
var container = fixture('auto-validate-numbers');
|
||||
var input = Polymer.dom(container).querySelector('#i');
|
||||
var error = Polymer.dom(container).querySelector('#e');
|
||||
assert.equal(getComputedStyle(error).visibility, 'hidden', 'error is visibility:hidden');
|
||||
input.bindValue = 'foobar';
|
||||
assert.notEqual(getComputedStyle(error).visibility, 'hidden', 'error is not visibility:hidden');
|
||||
});
|
||||
|
||||
test('error message add on is registered', function() {
|
||||
var container = document.getElementById('container');
|
||||
assert.isTrue(container._addons && container._addons.length === 1, 'add on is registered');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
321
react-app/bower_components/paper-input/test/paper-input.html
vendored
Normal file
321
react-app/bower_components/paper-input/test/paper-input.html
vendored
Normal file
@ -0,0 +1,321 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>paper-input tests</title>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
<script src="../../iron-test-helpers/test-helpers.js"></script>
|
||||
<script src="../../iron-test-helpers/mock-interactions.js"></script>
|
||||
|
||||
<link rel="import" href="../paper-input.html">
|
||||
<link rel="import" href="letters-only.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<test-fixture id="basic">
|
||||
<template>
|
||||
<paper-input></paper-input>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="has-tabindex">
|
||||
<template>
|
||||
<paper-input tabindex="0"></paper-input>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="label">
|
||||
<template>
|
||||
<paper-input label="foo"></paper-input>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="label-has-value">
|
||||
<template>
|
||||
<paper-input label="foo" value="bar"></paper-input>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="error">
|
||||
<template>
|
||||
<paper-input auto-validate pattern="[0-9]*" value="foobar" error-message="error"></paper-input>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="required">
|
||||
<template>
|
||||
<paper-input auto-validate required error-message="error"></paper-input>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="required-no-auto-validate">
|
||||
<template>
|
||||
<paper-input required error-message="error"></paper-input>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="required-char-counter">
|
||||
<template>
|
||||
<paper-input auto-validate char-counter required error-message="error"></paper-input>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="char-counter">
|
||||
<template>
|
||||
<paper-input char-counter value="foobar"></paper-input>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="always-float-label">
|
||||
<template>
|
||||
<paper-input always-float-label label="foo"></paper-input>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="placeholder">
|
||||
<template>
|
||||
<paper-input label="foo" placeholder="bar"></paper-input>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="date">
|
||||
<template>
|
||||
<paper-input label="foo" type="date"></paper-input>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<letters-only></letters-only>
|
||||
|
||||
<test-fixture id="validator">
|
||||
<template>
|
||||
<paper-input value="123123" validator="letters-only" auto-validate></paper-input>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
|
||||
suite('basic', function() {
|
||||
|
||||
test('setting value sets the input value', function() {
|
||||
var input = fixture('basic');
|
||||
input.value = 'foobar';
|
||||
assert.equal(input.inputElement.value, input.value, 'inputElement.value equals input.value');
|
||||
});
|
||||
|
||||
test('placeholder does not overlap label', function() {
|
||||
var input = fixture('placeholder');
|
||||
assert.equal(input.inputElement.placeholder, input.placeholder, 'inputElement.placeholder equals input.placeholder');
|
||||
assert.equal(input.noLabelFloat, false);
|
||||
var floatingLabel = Polymer.dom(Polymer.dom(input.root).querySelector('paper-input-container').root).querySelector('.label-is-floating');
|
||||
assert.ok(floatingLabel);
|
||||
});
|
||||
|
||||
test('special types autofloat the label', function() {
|
||||
var input = fixture('date');
|
||||
// Browsers that don't support special <input> types like `date` fallback
|
||||
// to `text`, so make sure to only test if type is still preserved after
|
||||
// the element is attached.
|
||||
if (input.inputElement.type === "date") {
|
||||
assert.equal(input.alwaysFloatLabel, true);
|
||||
var floatingLabel = Polymer.dom(Polymer.dom(input.root).querySelector('paper-input-container').root).querySelector('.label-is-floating');
|
||||
assert.ok(floatingLabel);
|
||||
}
|
||||
});
|
||||
|
||||
test('always-float-label attribute works without placeholder', function() {
|
||||
var input = fixture('always-float-label');
|
||||
var container = Polymer.dom(input.root).querySelector('paper-input-container');
|
||||
var inputContent = Polymer.dom(container.root).querySelector('.input-content');
|
||||
assert.isTrue(inputContent.classList.contains('label-is-floating'), 'label is floating');
|
||||
});
|
||||
|
||||
test('error message is displayed', function() {
|
||||
var input = fixture('error');
|
||||
forceXIfStamp(input);
|
||||
var error = Polymer.dom(input.root).querySelector('paper-input-error');
|
||||
assert.ok(error, 'paper-input-error exists');
|
||||
assert.notEqual(getComputedStyle(error).display, 'none', 'error is not display:none');
|
||||
});
|
||||
|
||||
test('empty required input shows error', function() {
|
||||
var input = fixture('required');
|
||||
forceXIfStamp(input);
|
||||
var error = Polymer.dom(input.root).querySelector('paper-input-error');
|
||||
assert.ok(error, 'paper-input-error exists');
|
||||
assert.notEqual(getComputedStyle(error).display, 'none', 'error is not display:none');
|
||||
});
|
||||
|
||||
test('character counter is displayed', function() {
|
||||
var input = fixture('char-counter');
|
||||
forceXIfStamp(input);
|
||||
var counter = Polymer.dom(input.root).querySelector('paper-input-char-counter')
|
||||
assert.ok(counter, 'paper-input-char-counter exists');
|
||||
assert.equal(counter._charCounterStr, input.value.length, 'character counter shows the value length');
|
||||
});
|
||||
|
||||
test('validator is used', function() {
|
||||
var input = fixture('validator');
|
||||
assert.ok(input.inputElement.invalid, 'input is invalid');
|
||||
});
|
||||
|
||||
test('caret position is preserved', function() {
|
||||
var input = fixture('basic');
|
||||
var ironInput = Polymer.dom(input.root).querySelector('input[is="iron-input"]');
|
||||
input.value = 'nananana';
|
||||
ironInput.selectionStart = 2;
|
||||
ironInput.selectionEnd = 2;
|
||||
|
||||
input.updateValueAndPreserveCaret('nanananabatman');
|
||||
|
||||
assert.equal(ironInput.selectionStart, 2, 'selectionStart is preserved');
|
||||
assert.equal(ironInput.selectionEnd, 2, 'selectionEnd is preserved');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
suite('focus/blur events', function() {
|
||||
var input;
|
||||
|
||||
setup(function() {
|
||||
input = fixture('basic');
|
||||
});
|
||||
|
||||
// At the moment, it is very hard to correctly fire exactly
|
||||
// one focus/blur events on a paper-input. This is because
|
||||
// when a paper-input is focused, it needs to focus
|
||||
// its underlying native input, which will also fire a `blur`
|
||||
// event.
|
||||
test('focus events fired on host element', function() {
|
||||
input.addEventListener('focus', function(event) {
|
||||
assert(input.focused, 'input is focused');
|
||||
});
|
||||
MockInteractions.focus(input);
|
||||
});
|
||||
|
||||
test('focus events fired on host element if nested element is focused', function() {
|
||||
input.addEventListener('focus', function(event) {
|
||||
assert(input.focused, 'input is focused');
|
||||
});
|
||||
MockInteractions.focus(input.inputElement);
|
||||
});
|
||||
|
||||
test('blur events fired on host element', function() {
|
||||
MockInteractions.focus(input);
|
||||
input.addEventListener('blur', function(event) {
|
||||
assert(!input.focused, 'input is blurred');
|
||||
});
|
||||
MockInteractions.blur(input);
|
||||
});
|
||||
|
||||
test('blur events fired on host element nested element is blurred', function() {
|
||||
MockInteractions.focus(input);
|
||||
input.addEventListener('blur', function(event) {
|
||||
assert(!input.focused, 'input is blurred');
|
||||
});
|
||||
MockInteractions.blur(input.inputElement);
|
||||
});
|
||||
|
||||
test('focusing then bluring sets the focused attribute correctly', function() {
|
||||
MockInteractions.focus(input);
|
||||
assert(input.focused, 'input is focused');
|
||||
MockInteractions.blur(input);
|
||||
assert(!input.focused, 'input is blurred');
|
||||
MockInteractions.focus(input.inputElement);
|
||||
assert(input.focused, 'input is focused');
|
||||
MockInteractions.blur(input.inputElement);
|
||||
assert(!input.focused, 'input is blurred');
|
||||
});
|
||||
});
|
||||
|
||||
suite('focused styling (integration test)', function() {
|
||||
|
||||
test('underline is colored when input is focused', function(done) {
|
||||
var input = fixture('basic');
|
||||
var container = Polymer.dom(input.root).querySelector('paper-input-container');
|
||||
var line = Polymer.dom(container.root).querySelector('.underline');
|
||||
assert.isFalse(line.classList.contains('is-highlighted'), 'line is not highlighted when input is not focused');
|
||||
MockInteractions.focus(input.inputElement);
|
||||
requestAnimationFrame(function() {
|
||||
assert.isTrue(line.classList.contains('is-highlighted'), 'line is highlighted when input is focused');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
suite('validation', function() {
|
||||
|
||||
test('invalid attribute updated after calling validate()', function() {
|
||||
var input = fixture('required-no-auto-validate');
|
||||
forceXIfStamp(input);
|
||||
input.validate();
|
||||
var error = Polymer.dom(input.root).querySelector('paper-input-error');
|
||||
assert.ok(error, 'paper-input-error exists');
|
||||
assert.notEqual(getComputedStyle(error).display, 'none', 'error is not display:none');
|
||||
assert.isTrue(input.invalid, 'invalid is true');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
suite('a11y', function() {
|
||||
|
||||
test('has aria-labelledby', function() {
|
||||
var input = fixture('label');
|
||||
assert.isTrue(input.inputElement.hasAttribute('aria-labelledby'))
|
||||
assert.equal(input.inputElement.getAttribute('aria-labelledby'), Polymer.dom(input.root).querySelector('label').id, 'aria-labelledby points to the label');
|
||||
});
|
||||
|
||||
test('has aria-describedby for error message', function() {
|
||||
var input = fixture('required');
|
||||
forceXIfStamp(input);
|
||||
assert.isTrue(input.inputElement.hasAttribute('aria-describedby'));
|
||||
assert.equal(input.inputElement.getAttribute('aria-describedby'), Polymer.dom(input.root).querySelector('paper-input-error').id, 'aria-describedby points to the error message');
|
||||
});
|
||||
|
||||
test('has aria-describedby for character counter', function() {
|
||||
var input = fixture('char-counter');
|
||||
forceXIfStamp(input);
|
||||
assert.isTrue(input.inputElement.hasAttribute('aria-describedby'));
|
||||
assert.equal(input.inputElement.getAttribute('aria-describedby'), Polymer.dom(input.root).querySelector('paper-input-char-counter').id, 'aria-describedby points to the character counter');
|
||||
});
|
||||
|
||||
test('has aria-describedby for character counter and error', function() {
|
||||
var input = fixture('required-char-counter');
|
||||
forceXIfStamp(input);
|
||||
assert.isTrue(input.inputElement.hasAttribute('aria-describedby'));
|
||||
assert.equal(input.inputElement.getAttribute('aria-describedby'), Polymer.dom(input.root).querySelector('paper-input-error').id + ' ' + Polymer.dom(input.root).querySelector('paper-input-char-counter').id, 'aria-describedby points to the error message and character counter');
|
||||
});
|
||||
|
||||
test('focus an input with tabindex', function(done) {
|
||||
var input = fixture('has-tabindex');
|
||||
flush(function() {
|
||||
MockInteractions.focus(input);
|
||||
flush(function() {
|
||||
assert.equal(input.shadowRoot ? input.shadowRoot.activeElement :
|
||||
document.activeElement, input._focusableElement);
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
218
react-app/bower_components/paper-input/test/paper-textarea.html
vendored
Normal file
218
react-app/bower_components/paper-input/test/paper-textarea.html
vendored
Normal file
@ -0,0 +1,218 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>paper-textarea tests</title>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
<script src="../../iron-test-helpers/test-helpers.js"></script>
|
||||
<script src="../../iron-test-helpers/mock-interactions.js"></script>
|
||||
|
||||
<link rel="import" href="../paper-textarea.html">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<test-fixture id="basic">
|
||||
<template>
|
||||
<paper-textarea></paper-textarea>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="label">
|
||||
<template>
|
||||
<paper-textarea label="foo"></paper-textarea>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="char-counter">
|
||||
<template>
|
||||
<paper-textarea char-counter></paper-textarea>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="required">
|
||||
<template>
|
||||
<paper-textarea auto-validate required error-message="error"></paper-textarea>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="required-char-counter">
|
||||
<template>
|
||||
<paper-textarea auto-validate char-counter required error-message="error"></paper-textarea>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="always-float-label">
|
||||
<template>
|
||||
<paper-textarea always-float-label label="label"></paper-textarea>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
|
||||
suite('basic', function() {
|
||||
|
||||
test('setting value sets the input value', function() {
|
||||
var input = fixture('basic');
|
||||
input.value = 'foobar';
|
||||
assert.equal(input.inputElement.bindValue, input.value, 'inputElement value equals input.value');
|
||||
});
|
||||
|
||||
test('empty required input shows error', function() {
|
||||
var input = fixture('required');
|
||||
forceXIfStamp(input);
|
||||
var error = Polymer.dom(input.root).querySelector('paper-input-error');
|
||||
assert.ok(error, 'paper-input-error exists');
|
||||
assert.notEqual(getComputedStyle(error).display, 'none', 'error is not display:none');
|
||||
});
|
||||
|
||||
test('caret position is preserved', function() {
|
||||
var input = fixture('basic');
|
||||
var ironTextarea = Polymer.dom(input.root).querySelector('iron-autogrow-textarea');
|
||||
input.value = 'nananana';
|
||||
ironTextarea.selectionStart = 2;
|
||||
ironTextarea.selectionEnd = 2;
|
||||
|
||||
input.updateValueAndPreserveCaret('nanananabatman');
|
||||
|
||||
assert.equal(ironTextarea.selectionStart, 2, 'selectionStart is preserved');
|
||||
assert.equal(ironTextarea.selectionEnd, 2, 'selectionEnd is preserved');
|
||||
});
|
||||
|
||||
test('input attributes are bound to textarea', function() {
|
||||
var input = fixture('basic');
|
||||
var attrs = {
|
||||
'autocomplete': 'true',
|
||||
'autofocus': true,
|
||||
'inputmode': 'number',
|
||||
'name': 'foo',
|
||||
'placeholder': 'bar',
|
||||
'readonly': true,
|
||||
'required': true,
|
||||
'maxlength': 3
|
||||
};
|
||||
for (var attr in attrs) {
|
||||
input[attr] = attrs[attr];
|
||||
}
|
||||
for (var attr in attrs) {
|
||||
var inputAttr = input.inputElement.getAttribute(attr);
|
||||
if (typeof attrs[attr] === 'boolean') {
|
||||
assert.equal(inputAttr !== null, attrs[attr], 'attribute "' + attr + '" is equal to property (' + attrs[attr] + ', ' + inputAttr !== null + ')');
|
||||
} else {
|
||||
assert.equal(inputAttr, attrs[attr], 'attribute "' + attr + '" is equal to property (' + attrs[attr] + ', ' + inputAttr + ')');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
test('always-float-label attribute works', function() {
|
||||
var input = fixture('always-float-label');
|
||||
var container = Polymer.dom(input.root).querySelector('paper-input-container');
|
||||
var inputContent = Polymer.dom(container.root).querySelector('.input-content');
|
||||
assert.isTrue(inputContent.classList.contains('label-is-floating'), 'label is floating');
|
||||
});
|
||||
});
|
||||
|
||||
suite('focus/blur events', function() {
|
||||
var input;
|
||||
|
||||
setup(function() {
|
||||
input = fixture('basic');
|
||||
});
|
||||
|
||||
// At the moment, it is very hard to correctly fire exactly
|
||||
// one focus/blur events on a paper-textarea. This is because
|
||||
// when a paper-textarea is focused, it needs to focus
|
||||
// its underlying native textarea, which will also fire a `blur`
|
||||
// event.
|
||||
test('focus events fired on host element', function() {
|
||||
input.addEventListener('focus', function(event) {
|
||||
assert(input.focused, 'input is focused');
|
||||
});
|
||||
MockInteractions.focus(input);
|
||||
});
|
||||
|
||||
test('focus events fired on host element if nested element is focused', function() {
|
||||
input.addEventListener('focus', function(event) {
|
||||
assert(input.focused, 'input is focused');
|
||||
});
|
||||
MockInteractions.focus(input.inputElement.textarea);
|
||||
});
|
||||
|
||||
test('blur events fired on host element', function() {
|
||||
MockInteractions.focus(input);
|
||||
input.addEventListener('blur', function(event) {
|
||||
assert(!input.focused, 'input is blurred');
|
||||
});
|
||||
MockInteractions.blur(input);
|
||||
});
|
||||
|
||||
test('blur events fired on host element nested element is blurred', function() {
|
||||
MockInteractions.focus(input);
|
||||
input.addEventListener('blur', function(event) {
|
||||
assert(!input.focused, 'input is blurred');
|
||||
});
|
||||
MockInteractions.blur(input.inputElement.textarea);
|
||||
});
|
||||
|
||||
test('focusing then bluring sets the focused attribute correctly', function() {
|
||||
MockInteractions.focus(input);
|
||||
assert(input.focused, 'input is focused');
|
||||
MockInteractions.blur(input);
|
||||
assert(!input.focused, 'input is blurred');
|
||||
MockInteractions.focus(input.inputElement.textarea);
|
||||
assert(input.focused, 'input is focused');
|
||||
MockInteractions.blur(input.inputElement.textarea);
|
||||
assert(!input.focused, 'input is blurred');
|
||||
});
|
||||
});
|
||||
|
||||
suite('a11y', function() {
|
||||
|
||||
test('has aria-labelledby', function() {
|
||||
var input = fixture('label');
|
||||
assert.isTrue(input.inputElement.textarea.hasAttribute('aria-labelledby'))
|
||||
assert.equal(input.inputElement.textarea.getAttribute('aria-labelledby'), Polymer.dom(input.root).querySelector('label').id, 'aria-labelledby points to the label');
|
||||
});
|
||||
|
||||
test('has aria-describedby for error message', function() {
|
||||
var input = fixture('required');
|
||||
forceXIfStamp(input);
|
||||
assert.isTrue(input.inputElement.textarea.hasAttribute('aria-describedby'));
|
||||
assert.equal(input.inputElement.textarea.getAttribute('aria-describedby'), Polymer.dom(input.root).querySelector('paper-input-error').id, 'aria-describedby points to the error message');
|
||||
});
|
||||
|
||||
test('has aria-describedby for character counter', function() {
|
||||
var input = fixture('char-counter');
|
||||
forceXIfStamp(input);
|
||||
assert.isTrue(input.inputElement.textarea.hasAttribute('aria-describedby'));
|
||||
assert.equal(input.inputElement.textarea.getAttribute('aria-describedby'), Polymer.dom(input.root).querySelector('paper-input-char-counter').id, 'aria-describedby points to the character counter');
|
||||
});
|
||||
|
||||
test('has aria-describedby for character counter and error', function() {
|
||||
var input = fixture('required-char-counter');
|
||||
forceXIfStamp(input);
|
||||
assert.isTrue(input.inputElement.textarea.hasAttribute('aria-describedby'));
|
||||
assert.equal(input.inputElement.textarea.getAttribute('aria-describedby'), Polymer.dom(input.root).querySelector('paper-input-error').id + ' ' + Polymer.dom(input.root).querySelector('paper-input-char-counter').id, 'aria-describedby points to the error message and character counter');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
53
react-app/bower_components/paper-item/.bower.json
vendored
Normal file
53
react-app/bower_components/paper-item/.bower.json
vendored
Normal file
@ -0,0 +1,53 @@
|
||||
{
|
||||
"name": "paper-item",
|
||||
"version": "1.1.4",
|
||||
"description": "A material-design styled list item",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"item"
|
||||
],
|
||||
"main": [
|
||||
"paper-item.html",
|
||||
"paper-icon-item.html",
|
||||
"paper-item-body.html"
|
||||
],
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/paper-item"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/paper-item",
|
||||
"ignore": [],
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#^1.1.0",
|
||||
"paper-styles": "PolymerElements/paper-styles#^1.0.0",
|
||||
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
|
||||
"iron-behaviors": "polymerelements/iron-behaviors#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
|
||||
"iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.0.0",
|
||||
"iron-icon": "PolymerElements/iron-icon#^1.0.0",
|
||||
"iron-icons": "PolymerElements/iron-icons#^1.0.0",
|
||||
"paper-icon-button": "PolymerElements/paper-icon-button#^1.0.0",
|
||||
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
|
||||
"web-component-tester": "^4.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
|
||||
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0"
|
||||
},
|
||||
"_release": "1.1.4",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v1.1.4",
|
||||
"commit": "5dcf21d5f7c13bafa24122c73aac28bd86213191"
|
||||
},
|
||||
"_source": "git://github.com/PolymerElements/paper-item.git",
|
||||
"_target": "~1.1.4",
|
||||
"_originalSource": "PolymerElements/paper-item",
|
||||
"_direct": true
|
||||
}
|
1
react-app/bower_components/paper-item/.gitignore
vendored
Normal file
1
react-app/bower_components/paper-item/.gitignore
vendored
Normal file
@ -0,0 +1 @@
|
||||
bower_components/
|
25
react-app/bower_components/paper-item/.travis.yml
vendored
Normal file
25
react-app/bower_components/paper-item/.travis.yml
vendored
Normal file
@ -0,0 +1,25 @@
|
||||
language: node_js
|
||||
sudo: false
|
||||
before_script:
|
||||
- npm install -g bower polylint web-component-tester
|
||||
- bower install
|
||||
- polylint
|
||||
env:
|
||||
global:
|
||||
- secure: NCk3KK+wbaXMzp8XAY6FeL+TSdI0AlPI3/tl0OpsUIaU2EiCjQuzf/UpyzCW5XZMEVFF4q/eDjrPkqJodHfpngj36mpkfmfqj9DrgDmYsV9BDvsTd8KmLsA6H8D6p7Qer+r1JMMB8PvX44vdhQ6GhZD1HFNYK1Ekpt0TkYwWKNw=
|
||||
- secure: TGgUEQe6FJS+GuYk94d//8YQmDLUu0ekMvPSIs8TQ2QkdBK4SL+2bSXZt44BbDEOwc9P4NCPSUx/RMiCAqsc5OGRJImzb/zqPNIDTeKG6q72HPBBBD3Sk0CrEpTQbOK/Flaa/B7RYR0U1kuljSmRS7lPG19nnY8gOHnIAgwIyk0=
|
||||
- CXX=g++-4.8
|
||||
node_js: stable
|
||||
addons:
|
||||
firefox: latest
|
||||
apt:
|
||||
sources:
|
||||
- google-chrome
|
||||
- ubuntu-toolchain-r-test
|
||||
packages:
|
||||
- google-chrome-stable
|
||||
- g++-4.8
|
||||
sauce_connect: true
|
||||
script:
|
||||
- xvfb-run wct
|
||||
- "if [ \"${TRAVIS_PULL_REQUEST}\" = \"false\" ]; then wct -s 'default'; fi"
|
77
react-app/bower_components/paper-item/CONTRIBUTING.md
vendored
Normal file
77
react-app/bower_components/paper-item/CONTRIBUTING.md
vendored
Normal file
@ -0,0 +1,77 @@
|
||||
|
||||
<!--
|
||||
This file is autogenerated based on
|
||||
https://github.com/PolymerElements/ContributionGuide/blob/master/CONTRIBUTING.md
|
||||
|
||||
If you edit that file, it will get updated everywhere else.
|
||||
If you edit this file, your changes will get overridden :)
|
||||
|
||||
You can however override the jsbin link with one that's customized to this
|
||||
specific element:
|
||||
|
||||
jsbin=https://jsbin.com/cagaye/edit?html,output
|
||||
-->
|
||||
# Polymer Elements
|
||||
## Guide for Contributors
|
||||
|
||||
Polymer Elements are built in the open, and the Polymer authors eagerly encourage any and all forms of community contribution. When contributing, please follow these guidelines:
|
||||
|
||||
### Filing Issues
|
||||
|
||||
**If you are filing an issue to request a feature**, please provide a clear description of the feature. It can be helpful to describe answers to the following questions:
|
||||
|
||||
1. **Who will use the feature?** _“As someone filling out a form…”_
|
||||
2. **When will they use the feature?** _“When I enter an invalid value…”_
|
||||
3. **What is the user’s goal?** _“I want to be visually notified that the value needs to be corrected…”_
|
||||
|
||||
**If you are filing an issue to report a bug**, please provide:
|
||||
|
||||
1. **A clear description of the bug and related expectations.** Consider using the following example template for reporting a bug:
|
||||
|
||||
```markdown
|
||||
The `paper-foo` element causes the page to turn pink when clicked.
|
||||
|
||||
## Expected outcome
|
||||
|
||||
The page stays the same color.
|
||||
|
||||
## Actual outcome
|
||||
|
||||
The page turns pink.
|
||||
|
||||
## Steps to reproduce
|
||||
|
||||
1. Put a `paper-foo` element in the page.
|
||||
2. Open the page in a web browser.
|
||||
3. Click the `paper-foo` element.
|
||||
```
|
||||
|
||||
2. **A reduced test case that demonstrates the problem.** If possible, please include the test case as a JSBin. Start with this template to easily import and use relevant Polymer Elements: [https://jsbin.com/cagaye/edit?html,output](https://jsbin.com/cagaye/edit?html,output).
|
||||
|
||||
3. **A list of browsers where the problem occurs.** This can be skipped if the problem is the same across all browsers.
|
||||
|
||||
### Submitting Pull Requests
|
||||
|
||||
**Before creating a pull request**, please ensure that an issue exists for the corresponding change in the pull request that you intend to make. **If an issue does not exist, please create one per the guidelines above**. The goal is to discuss the design and necessity of the proposed change with Polymer authors and community before diving into a pull request.
|
||||
|
||||
When submitting pull requests, please provide:
|
||||
|
||||
1. **A reference to the corresponding issue** or issues that will be closed by the pull request. Please refer to these issues in the pull request description using the following syntax:
|
||||
|
||||
```markdown
|
||||
(For a single issue)
|
||||
Fixes #20
|
||||
|
||||
(For multiple issues)
|
||||
Fixes #32, fixes #40
|
||||
```
|
||||
|
||||
2. **A succinct description of the design** used to fix any related issues. For example:
|
||||
|
||||
```markdown
|
||||
This fixes #20 by removing styles that leaked which would cause the page to turn pink whenever `paper-foo` is clicked.
|
||||
```
|
||||
|
||||
3. **At least one test for each bug fixed or feature added** as part of the pull request. Pull requests that fix bugs or add features without accompanying tests will not be considered.
|
||||
|
||||
If a proposed change contains multiple commits, please [squash commits](https://www.google.com/url?q=http://blog.steveklabnik.com/posts/2012-11-08-how-to-squash-commits-in-a-github-pull-request) to as few as is necessary to succinctly express the change. A Polymer author can help you squash commits, so don’t be afraid to ask us if you need help with that!
|
139
react-app/bower_components/paper-item/README.md
vendored
Normal file
139
react-app/bower_components/paper-item/README.md
vendored
Normal file
@ -0,0 +1,139 @@
|
||||
|
||||
<!---
|
||||
|
||||
This README is automatically generated from the comments in these files:
|
||||
paper-icon-item.html paper-item-behavior.html paper-item-body.html paper-item.html
|
||||
|
||||
Edit those files, and our readme bot will duplicate them over here!
|
||||
Edit this file, and the bot will squash your changes :)
|
||||
|
||||
The bot does some handling of markdown. Please file a bug if it does the wrong
|
||||
thing! https://github.com/PolymerLabs/tedium/issues
|
||||
|
||||
-->
|
||||
|
||||
[](https://travis-ci.org/PolymerElements/paper-item)
|
||||
|
||||
_[Demo and API docs](https://elements.polymer-project.org/elements/paper-item)_
|
||||
|
||||
|
||||
##<paper-item>
|
||||
|
||||
Material design: [Lists](https://www.google.com/design/spec/components/lists.html)
|
||||
|
||||
`<paper-item>` is an interactive list item. By default, it is a horizontal flexbox.
|
||||
|
||||
```html
|
||||
<paper-item>Item</paper-item>
|
||||
```
|
||||
|
||||
Use this element with `<paper-item-body>` to make Material Design styled two-line and three-line
|
||||
items.
|
||||
|
||||
```html
|
||||
<paper-item>
|
||||
<paper-item-body two-line>
|
||||
<div>Show your status</div>
|
||||
<div secondary>Your status is visible to everyone</div>
|
||||
</paper-item-body>
|
||||
<iron-icon icon="warning"></iron-icon>
|
||||
</paper-item>
|
||||
```
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
| Custom property | Description | Default |
|
||||
| --- | --- | --- |
|
||||
| `--paper-item-min-height` | Minimum height of the item | `48px` |
|
||||
| `--paper-item` | Mixin applied to the item | `{}` |
|
||||
| `--paper-item-selected-weight` | The font weight of a selected item | `bold` |
|
||||
| `--paper-item-selected` | Mixin applied to selected paper-items | `{}` |
|
||||
| `--paper-item-disabled-color` | The color for disabled paper-items | `--disabled-text-color` |
|
||||
| `--paper-item-disabled` | Mixin applied to disabled paper-items | `{}` |
|
||||
| `--paper-item-focused` | Mixin applied to focused paper-items | `{}` |
|
||||
| `--paper-item-focused-before` | Mixin applied to :before focused paper-items | `{}` |
|
||||
|
||||
### Accessibility
|
||||
|
||||
This element has `role="listitem"` by default. Depending on usage, it may be more appropriate to set
|
||||
`role="menuitem"`, `role="menuitemcheckbox"` or `role="menuitemradio"`.
|
||||
|
||||
```html
|
||||
<paper-item role="menuitemcheckbox">
|
||||
<paper-item-body>
|
||||
Show your status
|
||||
</paper-item-body>
|
||||
<paper-checkbox></paper-checkbox>
|
||||
</paper-item>
|
||||
```
|
||||
|
||||
|
||||
|
||||
##<paper-icon-item>
|
||||
|
||||
`<paper-icon-item>` is a convenience element to make an item with icon. It is an interactive list
|
||||
item with a fixed-width icon area, according to Material Design. This is useful if the icons are of
|
||||
varying widths, but you want the item bodies to line up. Use this like a `<paper-item>`. The child
|
||||
node with the attribute `item-icon` is placed in the icon area.
|
||||
|
||||
```html
|
||||
<paper-icon-item>
|
||||
<iron-icon icon="favorite" item-icon></iron-icon>
|
||||
Favorite
|
||||
</paper-icon-item>
|
||||
<paper-icon-item>
|
||||
<div class="avatar" item-icon></div>
|
||||
Avatar
|
||||
</paper-icon-item>
|
||||
```
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
| Custom property | Description | Default |
|
||||
| --- | --- | --- |
|
||||
| `--paper-item-icon-width` | Width of the icon area | `56px` |
|
||||
| `--paper-item-icon` | Mixin applied to the icon area | `{}` |
|
||||
| `--paper-icon-item` | Mixin applied to the item | `{}` |
|
||||
| `--paper-item-selected-weight` | The font weight of a selected item | `bold` |
|
||||
| `--paper-item-selected` | Mixin applied to selected paper-items | `{}` |
|
||||
| `--paper-item-disabled-color` | The color for disabled paper-items | `--disabled-text-color` |
|
||||
| `--paper-item-disabled` | Mixin applied to disabled paper-items | `{}` |
|
||||
| `--paper-item-focused` | Mixin applied to focused paper-items | `{}` |
|
||||
| `--paper-item-focused-before` | Mixin applied to :before focused paper-items | `{}` |
|
||||
|
||||
|
||||
|
||||
##<paper-item-body>
|
||||
|
||||
Use `<paper-item-body>` in a `<paper-item>` or `<paper-icon-item>` to make two- or
|
||||
three- line items. It is a flex item that is a vertical flexbox.
|
||||
|
||||
```html
|
||||
<paper-item>
|
||||
<paper-item-body two-line>
|
||||
<div>Show your status</div>
|
||||
<div secondary>Your status is visible to everyone</div>
|
||||
</paper-item-body>
|
||||
</paper-item>
|
||||
```
|
||||
|
||||
The child elements with the `secondary` attribute is given secondary text styling.
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
| Custom property | Description | Default |
|
||||
| --- | --- | --- |
|
||||
| `--paper-item-body-two-line-min-height` | Minimum height of a two-line item | `72px` |
|
||||
| `--paper-item-body-three-line-min-height` | Minimum height of a three-line item | `88px` |
|
||||
| `--paper-item-body-secondary-color` | Foreground color for the `secondary` area | `--secondary-text-color` |
|
||||
| `--paper-item-body-secondary` | Mixin applied to the `secondary` area | `{}` |
|
||||
|
||||
|
||||
|
||||
<!-- No docs for Polymer.PaperItemBehavior found. -->
|
13
react-app/bower_components/paper-item/all-imports.html
vendored
Normal file
13
react-app/bower_components/paper-item/all-imports.html
vendored
Normal file
@ -0,0 +1,13 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="paper-item.html">
|
||||
<link rel="import" href="paper-item-body.html">
|
||||
<link rel="import" href="paper-icon-item.html">
|
43
react-app/bower_components/paper-item/bower.json
vendored
Normal file
43
react-app/bower_components/paper-item/bower.json
vendored
Normal file
@ -0,0 +1,43 @@
|
||||
{
|
||||
"name": "paper-item",
|
||||
"version": "1.1.4",
|
||||
"description": "A material-design styled list item",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"item"
|
||||
],
|
||||
"main": [
|
||||
"paper-item.html",
|
||||
"paper-icon-item.html",
|
||||
"paper-item-body.html"
|
||||
],
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/paper-item"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/paper-item",
|
||||
"ignore": [],
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#^1.1.0",
|
||||
"paper-styles": "PolymerElements/paper-styles#^1.0.0",
|
||||
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
|
||||
"iron-behaviors": "polymerelements/iron-behaviors#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
|
||||
"iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.0.0",
|
||||
"iron-icon": "PolymerElements/iron-icon#^1.0.0",
|
||||
"iron-icons": "PolymerElements/iron-icons#^1.0.0",
|
||||
"paper-icon-button": "PolymerElements/paper-icon-button#^1.0.0",
|
||||
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
|
||||
"web-component-tester": "^4.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
|
||||
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0"
|
||||
}
|
||||
}
|
191
react-app/bower_components/paper-item/demo/index.html
vendored
Normal file
191
react-app/bower_components/paper-item/demo/index.html
vendored
Normal file
@ -0,0 +1,191 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
|
||||
<title>paper-item demo</title>
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<link rel="import" href="../../iron-icon/iron-icon.html">
|
||||
<link rel="import" href="../../iron-icons/iron-icons.html">
|
||||
<link rel="import" href="../../iron-icons/communication-icons.html">
|
||||
<link rel="import" href="../../iron-demo-helpers/demo-snippet.html">
|
||||
<link rel="import" href="../../iron-demo-helpers/demo-pages-shared-styles.html">
|
||||
<link rel="import" href="../../paper-icon-button/paper-icon-button.html">
|
||||
<link rel="import" href="../paper-icon-item.html">
|
||||
<link rel="import" href="../paper-item.html">
|
||||
<link rel="import" href="../paper-item-body.html">
|
||||
<link rel="import" href="../../paper-styles/color.html">
|
||||
|
||||
<style is="custom-style" include="demo-pages-shared-styles">
|
||||
div[role="listbox"] {
|
||||
border: 1px solid #e5e5e5;
|
||||
}
|
||||
.avatar {
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
background: var(--paper-amber-500);
|
||||
}
|
||||
|
||||
.blue {
|
||||
background-color: var(--paper-light-blue-300);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body unresolved>
|
||||
<div class="vertical-section-container centered">
|
||||
<h3>Paper-items are simple list elements, ideally used in a paper-listbox or
|
||||
an element with <i>role="listbox"</i></h3>
|
||||
<demo-snippet>
|
||||
<template>
|
||||
<div role="listbox">
|
||||
<paper-item>Inbox</paper-item>
|
||||
<paper-item>Starred</paper-item>
|
||||
<paper-item>Sent mail</paper-item>
|
||||
</div>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h3>They can be styled using custom properties</h3>
|
||||
<demo-snippet>
|
||||
<template>
|
||||
<style is="custom-style">
|
||||
paper-item.fancy {
|
||||
--paper-item-focused: {
|
||||
background: var(--paper-amber-500);
|
||||
font-weight: bold;
|
||||
};
|
||||
--paper-item-focused-before: {
|
||||
opacity: 0;
|
||||
};
|
||||
}
|
||||
</style>
|
||||
<div role="listbox">
|
||||
<paper-item class="fancy">Inbox</paper-item>
|
||||
<paper-item class="fancy">Starred</paper-item>
|
||||
<paper-item class="fancy">Sent mail</paper-item>
|
||||
</div>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h3>To add a leading element, use a paper-icon-item with an <i>item-icon</i> attribute. This
|
||||
leading image can be an iron-icon, or any other regular element.</h3>
|
||||
<demo-snippet>
|
||||
<template>
|
||||
<div role="listbox">
|
||||
<paper-icon-item>
|
||||
<iron-icon icon="inbox" item-icon></iron-icon>
|
||||
Inbox
|
||||
</paper-icon-item>
|
||||
<paper-icon-item>
|
||||
<iron-icon icon="star" item-icon></iron-icon>
|
||||
Starred
|
||||
</paper-icon-item>
|
||||
<paper-icon-item>
|
||||
<div class="avatar blue" item-icon></div>
|
||||
Alphonso Engelking
|
||||
</paper-icon-item>
|
||||
<paper-icon-item>
|
||||
<div class="avatar" item-icon></div>
|
||||
Angela Decker
|
||||
</paper-icon-item>
|
||||
</div>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h3>For two-line items, use a paper-icon-body inside a paper-item or paper-icon-item</h3>
|
||||
<demo-snippet>
|
||||
<template>
|
||||
<div role="listbox">
|
||||
<paper-item>
|
||||
<paper-item-body two-line>
|
||||
<div>Profile Photo</div>
|
||||
<div secondary>Change your Google+ profile photo</div>
|
||||
</paper-item-body>
|
||||
</paper-item>
|
||||
<paper-icon-item>
|
||||
<iron-icon icon="communication:phone" item-icon>
|
||||
</iron-icon>
|
||||
<paper-item-body two-line>
|
||||
<div>(650) 555-1234</div>
|
||||
<div secondary>Mobile</div>
|
||||
</paper-item-body>
|
||||
</paper-icon-item>
|
||||
<paper-icon-item>
|
||||
<div class="avatar blue" item-icon></div>
|
||||
<paper-item-body two-line>
|
||||
<div>Alphonso Engelking</div>
|
||||
<div secondary>Change photo</div>
|
||||
</paper-item-body>
|
||||
</paper-icon-item>
|
||||
</div>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h3>Complex layouts are usually a combination of all these elements</h3>
|
||||
<demo-snippet>
|
||||
<template>
|
||||
<div role="listbox">
|
||||
<paper-icon-item>
|
||||
<div class="avatar blue" item-icon></div>
|
||||
<paper-item-body two-line>
|
||||
<div>Photos</div>
|
||||
<div secondary>Jan 9, 2014</div>
|
||||
</paper-item-body>
|
||||
<paper-icon-button icon="star" alt="favourite this!">
|
||||
</paper-icon-button>
|
||||
</paper-icon-item>
|
||||
<paper-icon-item>
|
||||
<div class="avatar" item-icon></div>
|
||||
<paper-item-body two-line>
|
||||
<div>Recipes</div>
|
||||
<div secondary>Jan 17, 2014</div>
|
||||
</paper-item-body>
|
||||
<paper-icon-button icon="star" alt="favourite this!">
|
||||
</paper-icon-button>
|
||||
</paper-icon-item>
|
||||
</div>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
|
||||
<h3>Paper-items can be used as links</h3>
|
||||
<demo-snippet>
|
||||
<template>
|
||||
<style is="custom-style">
|
||||
.paper-item-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
</style>
|
||||
<div role="listbox">
|
||||
<a class="paper-item-link" href="#inbox" tabindex="-1">
|
||||
<paper-item>Inbox</paper-item>
|
||||
</a>
|
||||
<a class="paper-item-link" href="#starred" tabindex="-1">
|
||||
<paper-item>Starred</paper-item>
|
||||
</a>
|
||||
<a class="paper-item-link" href="#sent" tabindex="-1">
|
||||
<paper-item>Sent mail</paper-item>
|
||||
</a>
|
||||
</div>
|
||||
</template>
|
||||
</demo-snippet>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
30
react-app/bower_components/paper-item/index.html
vendored
Normal file
30
react-app/bower_components/paper-item/index.html
vendored
Normal file
@ -0,0 +1,30 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
||||
|
||||
<title>paper-item</title>
|
||||
|
||||
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-component-page/iron-component-page.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<iron-component-page src="all-imports.html"></iron-component-page>
|
||||
|
||||
</body>
|
||||
</html>
|
86
react-app/bower_components/paper-item/paper-icon-item.html
vendored
Normal file
86
react-app/bower_components/paper-item/paper-icon-item.html
vendored
Normal file
@ -0,0 +1,86 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-flex-layout/iron-flex-layout.html">
|
||||
<link rel="import" href="../paper-styles/typography.html">
|
||||
<link rel="import" href="paper-item-behavior.html">
|
||||
<link rel="import" href="paper-item-shared-styles.html">
|
||||
|
||||
<!--
|
||||
`<paper-icon-item>` is a convenience element to make an item with icon. It is an interactive list
|
||||
item with a fixed-width icon area, according to Material Design. This is useful if the icons are of
|
||||
varying widths, but you want the item bodies to line up. Use this like a `<paper-item>`. The child
|
||||
node with the attribute `item-icon` is placed in the icon area.
|
||||
|
||||
<paper-icon-item>
|
||||
<iron-icon icon="favorite" item-icon></iron-icon>
|
||||
Favorite
|
||||
</paper-icon-item>
|
||||
<paper-icon-item>
|
||||
<div class="avatar" item-icon></div>
|
||||
Avatar
|
||||
</paper-icon-item>
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
Custom property | Description | Default
|
||||
------------------------------|------------------------------------------------|----------
|
||||
`--paper-item-icon-width` | Width of the icon area | `56px`
|
||||
`--paper-item-icon` | Mixin applied to the icon area | `{}`
|
||||
`--paper-icon-item` | Mixin applied to the item | `{}`
|
||||
`--paper-item-selected-weight`| The font weight of a selected item | `bold`
|
||||
`--paper-item-selected` | Mixin applied to selected paper-items | `{}`
|
||||
`--paper-item-disabled-color` | The color for disabled paper-items | `--disabled-text-color`
|
||||
`--paper-item-disabled` | Mixin applied to disabled paper-items | `{}`
|
||||
`--paper-item-focused` | Mixin applied to focused paper-items | `{}`
|
||||
`--paper-item-focused-before` | Mixin applied to :before focused paper-items | `{}`
|
||||
-->
|
||||
|
||||
<dom-module id="paper-icon-item">
|
||||
<template>
|
||||
<style include="paper-item-shared-styles"></style>
|
||||
<style>
|
||||
:host {
|
||||
@apply(--layout-horizontal);
|
||||
@apply(--layout-center);
|
||||
@apply(--paper-font-subhead);
|
||||
|
||||
@apply(--paper-item);
|
||||
@apply(--paper-icon-item);
|
||||
}
|
||||
|
||||
.content-icon {
|
||||
@apply(--layout-horizontal);
|
||||
@apply(--layout-center);
|
||||
|
||||
width: var(--paper-item-icon-width, 56px);
|
||||
@apply(--paper-item-icon);
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="contentIcon" class="content-icon">
|
||||
<content select="[item-icon]"></content>
|
||||
</div>
|
||||
<content></content>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'paper-icon-item',
|
||||
|
||||
behaviors: [
|
||||
Polymer.PaperItemBehavior
|
||||
]
|
||||
});
|
||||
</script>
|
||||
</dom-module>
|
36
react-app/bower_components/paper-item/paper-item-behavior.html
vendored
Normal file
36
react-app/bower_components/paper-item/paper-item-behavior.html
vendored
Normal file
@ -0,0 +1,36 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-behaviors/iron-button-state.html">
|
||||
<link rel="import" href="../iron-behaviors/iron-control-state.html">
|
||||
|
||||
<!--
|
||||
`PaperItemBehavior` is a convenience behavior shared by <paper-item> and
|
||||
<paper-icon-item> that manages the shared control states and attributes of
|
||||
the items.
|
||||
-->
|
||||
|
||||
<script>
|
||||
/** @polymerBehavior Polymer.PaperItemBehavior */
|
||||
Polymer.PaperItemBehaviorImpl = {
|
||||
hostAttributes: {
|
||||
role: 'option',
|
||||
tabindex: '0'
|
||||
}
|
||||
};
|
||||
|
||||
/** @polymerBehavior */
|
||||
Polymer.PaperItemBehavior = [
|
||||
Polymer.IronButtonState,
|
||||
Polymer.IronControlState,
|
||||
Polymer.PaperItemBehaviorImpl
|
||||
];
|
||||
</script>
|
83
react-app/bower_components/paper-item/paper-item-body.html
vendored
Normal file
83
react-app/bower_components/paper-item/paper-item-body.html
vendored
Normal file
@ -0,0 +1,83 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-flex-layout/iron-flex-layout.html">
|
||||
<link rel="import" href="../paper-styles/default-theme.html">
|
||||
<link rel="import" href="../paper-styles/typography.html">
|
||||
|
||||
<!--
|
||||
Use `<paper-item-body>` in a `<paper-item>` or `<paper-icon-item>` to make two- or
|
||||
three- line items. It is a flex item that is a vertical flexbox.
|
||||
|
||||
<paper-item>
|
||||
<paper-item-body two-line>
|
||||
<div>Show your status</div>
|
||||
<div secondary>Your status is visible to everyone</div>
|
||||
</paper-item-body>
|
||||
</paper-item>
|
||||
|
||||
The child elements with the `secondary` attribute is given secondary text styling.
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
Custom property | Description | Default
|
||||
----------------|-------------|----------
|
||||
`--paper-item-body-two-line-min-height` | Minimum height of a two-line item | `72px`
|
||||
`--paper-item-body-three-line-min-height` | Minimum height of a three-line item | `88px`
|
||||
`--paper-item-body-secondary-color` | Foreground color for the `secondary` area | `--secondary-text-color`
|
||||
`--paper-item-body-secondary` | Mixin applied to the `secondary` area | `{}`
|
||||
|
||||
-->
|
||||
|
||||
<dom-module id="paper-item-body">
|
||||
<template>
|
||||
<style>
|
||||
:host {
|
||||
overflow: hidden; /* needed for text-overflow: ellipsis to work on ff */
|
||||
@apply(--layout-vertical);
|
||||
@apply(--layout-center-justified);
|
||||
@apply(--layout-flex);
|
||||
}
|
||||
|
||||
:host([two-line]) {
|
||||
min-height: var(--paper-item-body-two-line-min-height, 72px);
|
||||
}
|
||||
|
||||
:host([three-line]) {
|
||||
min-height: var(--paper-item-body-three-line-min-height, 88px);
|
||||
}
|
||||
|
||||
:host > ::content > * {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
:host > ::content [secondary] {
|
||||
@apply(--paper-font-body1);
|
||||
|
||||
color: var(--paper-item-body-secondary-color, --secondary-text-color);
|
||||
|
||||
@apply(--paper-item-body-secondary);
|
||||
}
|
||||
</style>
|
||||
|
||||
<content></content>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'paper-item-body'
|
||||
});
|
||||
</script>
|
||||
</dom-module>
|
60
react-app/bower_components/paper-item/paper-item-shared-styles.html
vendored
Normal file
60
react-app/bower_components/paper-item/paper-item-shared-styles.html
vendored
Normal file
@ -0,0 +1,60 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../iron-flex-layout/iron-flex-layout.html">
|
||||
<link rel="import" href="../paper-styles/default-theme.html">
|
||||
<link rel="import" href="../paper-styles/color.html">
|
||||
|
||||
<dom-module id="paper-item-shared-styles">
|
||||
<template>
|
||||
<style>
|
||||
:host {
|
||||
display: block;
|
||||
position: relative;
|
||||
min-height: var(--paper-item-min-height, 48px);
|
||||
padding: 0px 16px;
|
||||
}
|
||||
|
||||
:host([hidden]) {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
:host(.iron-selected) {
|
||||
font-weight: var(--paper-item-selected-weight, bold);
|
||||
|
||||
@apply(--paper-item-selected);
|
||||
}
|
||||
|
||||
:host([disabled]) {
|
||||
color: var(--paper-item-disabled-color, --disabled-text-color);
|
||||
|
||||
@apply(--paper-item-disabled);
|
||||
}
|
||||
|
||||
:host(:focus) {
|
||||
position: relative;
|
||||
outline: 0;
|
||||
|
||||
@apply(--paper-item-focused);
|
||||
}
|
||||
|
||||
:host(:focus):before {
|
||||
@apply(--layout-fit);
|
||||
|
||||
background: currentColor;
|
||||
content: '';
|
||||
opacity: var(--dark-divider-opacity);
|
||||
pointer-events: none;
|
||||
|
||||
@apply(--paper-item-focused-before);
|
||||
}
|
||||
</style>
|
||||
</template>
|
||||
</dom-module>
|
99
react-app/bower_components/paper-item/paper-item.html
vendored
Normal file
99
react-app/bower_components/paper-item/paper-item.html
vendored
Normal file
@ -0,0 +1,99 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-flex-layout/iron-flex-layout.html">
|
||||
<link rel="import" href="paper-item-behavior.html">
|
||||
<link rel="import" href="paper-item-shared-styles.html">
|
||||
|
||||
<!--
|
||||
Material design: [Lists](https://www.google.com/design/spec/components/lists.html)
|
||||
|
||||
`<paper-item>` is an interactive list item. By default, it is a horizontal flexbox.
|
||||
|
||||
<paper-item>Item</paper-item>
|
||||
|
||||
Use this element with `<paper-item-body>` to make Material Design styled two-line and three-line
|
||||
items.
|
||||
|
||||
<paper-item>
|
||||
<paper-item-body two-line>
|
||||
<div>Show your status</div>
|
||||
<div secondary>Your status is visible to everyone</div>
|
||||
</paper-item-body>
|
||||
<iron-icon icon="warning"></iron-icon>
|
||||
</paper-item>
|
||||
|
||||
To use `paper-item` as a link, wrap it in an anchor tag. Since `paper-item` will
|
||||
already receive focus, you may want to prevent the anchor tag from receiving
|
||||
focus as well by setting its tabindex to -1.
|
||||
|
||||
<a href="https://www.polymer-project.org/" tabindex="-1">
|
||||
<paper-item raised>Polymer Project</paper-item>
|
||||
</a>
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
Custom property | Description | Default
|
||||
------------------------------|----------------------------------------------|----------
|
||||
`--paper-item-min-height` | Minimum height of the item | `48px`
|
||||
`--paper-item` | Mixin applied to the item | `{}`
|
||||
`--paper-item-selected-weight`| The font weight of a selected item | `bold`
|
||||
`--paper-item-selected` | Mixin applied to selected paper-items | `{}`
|
||||
`--paper-item-disabled-color` | The color for disabled paper-items | `--disabled-text-color`
|
||||
`--paper-item-disabled` | Mixin applied to disabled paper-items | `{}`
|
||||
`--paper-item-focused` | Mixin applied to focused paper-items | `{}`
|
||||
`--paper-item-focused-before` | Mixin applied to :before focused paper-items | `{}`
|
||||
|
||||
### Accessibility
|
||||
|
||||
This element has `role="listitem"` by default. Depending on usage, it may be more appropriate to set
|
||||
`role="menuitem"`, `role="menuitemcheckbox"` or `role="menuitemradio"`.
|
||||
|
||||
<paper-item role="menuitemcheckbox">
|
||||
<paper-item-body>
|
||||
Show your status
|
||||
</paper-item-body>
|
||||
<paper-checkbox></paper-checkbox>
|
||||
</paper-item>
|
||||
|
||||
@group Paper Elements
|
||||
@element paper-item
|
||||
@demo demo/index.html
|
||||
-->
|
||||
|
||||
<dom-module id="paper-item">
|
||||
<template>
|
||||
<style include="paper-item-shared-styles"></style>
|
||||
<style>
|
||||
:host {
|
||||
@apply(--layout-horizontal);
|
||||
@apply(--layout-center);
|
||||
@apply(--paper-font-subhead);
|
||||
|
||||
@apply(--paper-item);
|
||||
}
|
||||
</style>
|
||||
|
||||
<content></content>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'paper-item',
|
||||
|
||||
behaviors: [
|
||||
Polymer.PaperItemBehavior
|
||||
]
|
||||
});
|
||||
</script>
|
||||
</dom-module>
|
31
react-app/bower_components/paper-item/test/index.html
vendored
Normal file
31
react-app/bower_components/paper-item/test/index.html
vendored
Normal file
@ -0,0 +1,31 @@
|
||||
<!DOCTYPE html><!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
--><html><head>
|
||||
|
||||
<title>paper-item tests</title>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<script>
|
||||
WCT.loadSuites([
|
||||
'paper-item.html',
|
||||
'paper-item.html?dom=shadow'
|
||||
]);
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
205
react-app/bower_components/paper-item/test/paper-item.html
vendored
Normal file
205
react-app/bower_components/paper-item/test/paper-item.html
vendored
Normal file
@ -0,0 +1,205 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
-->
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>paper-item tests</title>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
<script src="../../iron-test-helpers/mock-interactions.js"></script>
|
||||
|
||||
<link rel="import" href="../../paper-input/paper-input.html">
|
||||
<link rel="import" href="../paper-item.html">
|
||||
<link rel="import" href="../paper-icon-item.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<test-fixture id="item">
|
||||
<template>
|
||||
<div role="listbox">
|
||||
<paper-item>item</paper-item>
|
||||
</div>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="iconItem">
|
||||
<template>
|
||||
<div role="listbox">
|
||||
<paper-icon-item>item</paper-icon-item>
|
||||
</div>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="item-with-input">
|
||||
<template>
|
||||
<div role="list">
|
||||
<paper-item><input></paper-item>
|
||||
</div>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="item-with-paper-input">
|
||||
<template>
|
||||
<div role="list">
|
||||
<paper-item><paper-input></paper-input></paper-item>
|
||||
</div>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="iconItem-with-input">
|
||||
<template>
|
||||
<div role="list">
|
||||
<paper-icon-item><input></paper-icon-item>
|
||||
</div>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
suite('paper-item basic', function() {
|
||||
var item, clickHandler;
|
||||
|
||||
setup(function() {
|
||||
item = fixture('item').querySelector('paper-item');
|
||||
clickHandler = sinon.spy();
|
||||
item.addEventListener('click', clickHandler);
|
||||
});
|
||||
|
||||
test('space triggers a click event', function(done) {
|
||||
MockInteractions.pressSpace(item);
|
||||
Polymer.Base.async(function(){
|
||||
// You need two ticks, one for the MockInteractions event, and one
|
||||
// for the button event.
|
||||
Polymer.Base.async(function(){
|
||||
expect(clickHandler.callCount).to.be.equal(1);
|
||||
done();
|
||||
}, 1);
|
||||
}, 1);
|
||||
});
|
||||
|
||||
test('click triggers a click event', function(done) {
|
||||
MockInteractions.tap(item);
|
||||
Polymer.Base.async(function(){
|
||||
expect(clickHandler.callCount).to.be.equal(1);
|
||||
done();
|
||||
}, 1);
|
||||
});
|
||||
});
|
||||
|
||||
suite('paper-icon-item basic', function() {
|
||||
var item, clickHandler;
|
||||
|
||||
setup(function() {
|
||||
item = fixture('iconItem').querySelector('paper-icon-item');
|
||||
clickHandler = sinon.spy();
|
||||
item.addEventListener('click', clickHandler);
|
||||
});
|
||||
|
||||
test('space triggers a click event', function(done) {
|
||||
MockInteractions.pressSpace(item);
|
||||
Polymer.Base.async(function(){
|
||||
// You need two ticks, one for the MockInteractions event, and one
|
||||
// for the button event.
|
||||
Polymer.Base.async(function(){
|
||||
expect(clickHandler.callCount).to.be.equal(1);
|
||||
done();
|
||||
}, 1);
|
||||
}, 1);
|
||||
});
|
||||
|
||||
test('click triggers a click event', function(done) {
|
||||
MockInteractions.tap(item);
|
||||
Polymer.Base.async(function(){
|
||||
expect(clickHandler.callCount).to.be.equal(1);
|
||||
done();
|
||||
}, 1);
|
||||
});
|
||||
});
|
||||
|
||||
suite('clickable element inside item', function() {
|
||||
test('paper-item: space in child native input does not trigger a click event', function(done) {
|
||||
var f = fixture('item-with-input');
|
||||
var outerItem = f.querySelector('paper-item');
|
||||
var innerInput = f.querySelector('input');
|
||||
|
||||
var itemClickHandler = sinon.spy();
|
||||
outerItem.addEventListener('click', itemClickHandler);
|
||||
|
||||
innerInput.focus();
|
||||
MockInteractions.pressSpace(innerInput);
|
||||
Polymer.Base.async(function(){
|
||||
expect(itemClickHandler.callCount).to.be.equal(0);
|
||||
done();
|
||||
}, 1);
|
||||
});
|
||||
|
||||
test('paper-item: space in child paper-input does not trigger a click event', function(done) {
|
||||
var f = fixture('item-with-paper-input');
|
||||
var outerItem = f.querySelector('paper-item');
|
||||
var innerInput = f.querySelector('paper-input');
|
||||
|
||||
var itemClickHandler = sinon.spy();
|
||||
outerItem.addEventListener('click', itemClickHandler);
|
||||
|
||||
innerInput.focus();
|
||||
MockInteractions.pressSpace(innerInput);
|
||||
Polymer.Base.async(function(){
|
||||
expect(itemClickHandler.callCount).to.be.equal(0);
|
||||
done();
|
||||
}, 1);
|
||||
});
|
||||
|
||||
test('paper-icon-item: space in child input does not trigger a click event', function(done) {
|
||||
var f = fixture('iconItem-with-input');
|
||||
var outerItem = f.querySelector('paper-icon-item');
|
||||
var innerInput = f.querySelector('input');
|
||||
|
||||
var itemClickHandler = sinon.spy();
|
||||
outerItem.addEventListener('click', itemClickHandler);
|
||||
|
||||
MockInteractions.pressSpace(innerInput);
|
||||
Polymer.Base.async(function(){
|
||||
expect(itemClickHandler.callCount).to.be.equal(0);
|
||||
done();
|
||||
}, 1);
|
||||
});
|
||||
});
|
||||
|
||||
suite('item a11y tests', function() {
|
||||
var item, iconItem;
|
||||
|
||||
setup(function() {
|
||||
item = fixture('item').querySelector('paper-item');
|
||||
iconItem = fixture('iconItem').querySelector('paper-icon-item');
|
||||
});
|
||||
|
||||
test('item has role="listitem"', function() {
|
||||
assert.equal(item.getAttribute('role'), 'option', 'has role="option"');
|
||||
});
|
||||
|
||||
test('icon item has role="listitem"', function() {
|
||||
assert.equal(iconItem.getAttribute('role'), 'option', 'has role="option"');
|
||||
});
|
||||
|
||||
a11ySuite('item');
|
||||
a11ySuite('iconItem');
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
@ -1,6 +1,6 @@
|
||||
# <alfresco-file-list>
|
||||
|
||||
> Alfresco files and Folders viewver list
|
||||
> Alfresco files and Folders viewver list
|
||||
|
||||
## Demo
|
||||
|
||||
|
19
react-app/webcomponents/alfresco-file-list/index.html
Normal file
19
react-app/webcomponents/alfresco-file-list/index.html
Normal file
@ -0,0 +1,19 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title><alfresco-file-list></title>
|
||||
|
||||
<!-- Importing Web Component's Polyfill -->
|
||||
<script src="bower_components/webcomponentsjs/webcomponents.min.js"></script>
|
||||
|
||||
<!-- Importing Custom Elements -->
|
||||
<link rel="import" href="src/alfresco-file-list.html">
|
||||
</head>
|
||||
<body>
|
||||
<div style="height: 900px">
|
||||
<!-- Using Custom Elements -->
|
||||
<alfresco-file-list></alfresco-file-list>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
@ -7,47 +7,10 @@
|
||||
<link rel="import" href="../../../bower_components/paper-icon-button/paper-icon-button.html">
|
||||
<link rel="import" href="../../../bower_components/iron-icon/iron-icon.html">
|
||||
<link rel="import" href="../../../bower_components/paper-badge/paper-badge.html">
|
||||
<link rel="import" href="../../../bower_components/paper-item/paper-item.html">
|
||||
<link rel="import" href="../../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html">
|
||||
|
||||
<style>
|
||||
app-toolbar {
|
||||
background: var(--paper-pink-500);
|
||||
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3);
|
||||
color: white;
|
||||
z-index: 1;
|
||||
color: white;
|
||||
--paper-toolbar-title: {
|
||||
font-size: 16px;
|
||||
line-height: 16px;
|
||||
font-weight: bold;
|
||||
margin-left: 0;
|
||||
};
|
||||
}
|
||||
app-toolbar paper-icon-button {
|
||||
--paper-icon-button-ink-color: white;
|
||||
}
|
||||
#itemsList,
|
||||
#selectedItemsList {
|
||||
@apply(--layout-flex);
|
||||
}
|
||||
.item {
|
||||
@apply(--layout-horizontal);
|
||||
cursor: pointer;
|
||||
padding: 16px 22px;
|
||||
border-bottom: 1px solid #DDD;
|
||||
}
|
||||
.item:focus,
|
||||
.item.selected:focus {
|
||||
outline: 0;
|
||||
background-color: #ddd;
|
||||
}
|
||||
.item.selected .star {
|
||||
color: var(--paper-blue-600);
|
||||
}
|
||||
.item.selected {
|
||||
background-color: var(--google-grey-300);
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.pad {
|
||||
@apply(--layout-flex);
|
||||
@apply(--layout-vertical);
|
||||
@ -57,10 +20,7 @@
|
||||
.dim {
|
||||
color: gray;
|
||||
}
|
||||
.star {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
paper-badge {
|
||||
-webkit-transition: all 0.1s;
|
||||
transition: all 0.1s;
|
||||
@ -70,10 +30,7 @@
|
||||
paper-badge[label="0"] {
|
||||
opacity: 0;
|
||||
}
|
||||
#starredView {
|
||||
width: 200px;
|
||||
border-left: 1px solid #ddd;
|
||||
}
|
||||
|
||||
paper-item {
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
@ -96,21 +53,15 @@
|
||||
right: 15px;
|
||||
top: calc(50% - 8px);
|
||||
}
|
||||
.noSelection {
|
||||
color: #999;
|
||||
margin-left: 10px;
|
||||
line-height: 50px;
|
||||
}
|
||||
|
||||
#starredView {
|
||||
@apply(--layout-vertical);
|
||||
}
|
||||
|
||||
ul { list-style-type: none; overflow: hidden; width:800px; margin:10px}
|
||||
ul li div.text{ float:left; width: 400px;text-align: left;height: 55px }
|
||||
ul li div.folder-container{ float:left; width: 70px;text-align: left ;height: 55px}
|
||||
ul li:hover { background: #eeeeee; height: 55px}
|
||||
|
||||
.file{
|
||||
width: 52px;
|
||||
height: 52px;
|
||||
}
|
||||
.folder {
|
||||
height: 52px;
|
||||
box-sizing: border-box;
|
||||
@ -127,33 +78,70 @@
|
||||
color: gray;
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
paper-dropdown-menu.custom {
|
||||
overflow: visible;
|
||||
--paper-input-container-label: {
|
||||
color: white;
|
||||
background-color: var(--paper-pink-500);
|
||||
font-style: italic;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
};
|
||||
--paper-input-container-input: {
|
||||
color: var(--paper-indigo-500);
|
||||
font-style: normal;
|
||||
font-family: serif;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
/* no underline */
|
||||
--paper-input-container-underline: {
|
||||
display: none;
|
||||
};
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
<dom-module id="alfresco-file-list">
|
||||
<template>
|
||||
<iron-ajax url="files.json" last-response="{{data}}" auto></iron-ajax>
|
||||
|
||||
<!-- Main List for the items -->
|
||||
<iron-list id="itemsList" items="[[data.items]]" selected-items="{{selectedItems}}" selection-enabled multi-selection>
|
||||
<iron-list id="itemsList" items="{{data}}" selected-items="{{selectedItems}}" selection-enabled multi-selection>
|
||||
<template>
|
||||
<div>
|
||||
<ul tabindex$="[[tabIndex]]" aria-label$="Select/Deselect [[item.name]]" class$="[[_computedClass(selected)]]">
|
||||
<li>
|
||||
<div class="folder-container"><img class="folder" src="img/folder.svg"></div>
|
||||
<div class="folder-container">
|
||||
<template is="dom-if" if="{{item.isFolder}}">
|
||||
<img class="folder" src="img/folder.svg">
|
||||
</template>
|
||||
<template is="dom-if" if="{{!item.isFolder}}">
|
||||
<img class="file" src="{{thumbBaseUrl()}}{{item.contentUrl}}">
|
||||
</template>
|
||||
</div>
|
||||
<div class="text">
|
||||
<div class="pad">
|
||||
<div class="primary">
|
||||
[[item.displayName]]
|
||||
</div>
|
||||
<div class="secondary dim">
|
||||
[[item.node.properties.cm:description]]
|
||||
[[item.node.description]]
|
||||
</div>
|
||||
<div class="secondary dim">
|
||||
Modified [[item.node.properties.cm:modified.iso8601]] by [[item.node.properties.cm:modifier.displayName]]
|
||||
Modified [[item.modifiedOn]] by [[item.modifiedBy]]
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div lass="dropdowm menu">
|
||||
<paper-dropdown-menu class="custom" label="Actions" no-label-float>
|
||||
<paper-listbox class="dropdown-content">
|
||||
<paper-item>Download as Zip</paper-item>
|
||||
<paper-item>View Details</paper-item>
|
||||
<paper-item>Edit Properties</paper-item>
|
||||
<paper-item>Copy To...</paper-item>
|
||||
<paper-item>Move To...</paper-item>
|
||||
</paper-listbox>
|
||||
</paper-dropdown-menu>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="border"></div>
|
||||
@ -165,7 +153,34 @@
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: "alfresco-file-list"
|
||||
is: "alfresco-file-list",
|
||||
|
||||
url: "http://192.168.99.100:8080/alfresco/",
|
||||
|
||||
fileService: "service/slingshot/doclib/doclist/all/site/swsdp/documentLibrary",
|
||||
|
||||
ready: function() {
|
||||
function error () {
|
||||
console.log("error");
|
||||
}
|
||||
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.addEventListener("load", (XMLHttpRequestProgressEvent)=>{
|
||||
this.data =JSON.parse(XMLHttpRequestProgressEvent.currentTarget.response).items;
|
||||
});
|
||||
|
||||
xhr.addEventListener("error", error);
|
||||
|
||||
xhr.open("GET", this.url + this.fileService);
|
||||
xhr.withCredentials = true;
|
||||
xhr.setRequestHeader("Authorization", 'Basic ' + btoa('admin:admin'));
|
||||
xhr.send();
|
||||
},
|
||||
|
||||
thumbBaseUrl: function () {
|
||||
return 'http://192.168.99.100:8080/share/proxy/alfresco/';
|
||||
}
|
||||
|
||||
});
|
||||
</script>
|
||||
</dom-module>
|
||||
|
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1,14 +1,14 @@
|
||||
<link rel="import" href="../bower_components/polymer/polymer.html">
|
||||
<link rel="import" href="../bower_components/iron-flex-layout/iron-flex-layout.html">
|
||||
<link rel="import" href="../bower_components/iron-ajax/iron-ajax.html">
|
||||
<link rel="import" href="../bower_components/iron-list/iron-list.html">
|
||||
<link rel="import" href="../bower_components/paper-styles/color.html">
|
||||
<link rel="import" href="../bower_components/paper-styles/typography.html">
|
||||
<link rel="import" href="../bower_components/paper-icon-button/paper-icon-button.html">
|
||||
<link rel="import" href="../bower_components/iron-icon/iron-icon.html">
|
||||
<link rel="import" href="../bower_components/paper-badge/paper-badge.html">
|
||||
<link rel="import" href="../bower_components/paper-item/paper-item.html">
|
||||
<link rel="import" href="../bower_components/paper-dropdown-menu/paper-dropdown-menu.html">
|
||||
<link rel="import" href="../../../bower_components/polymer/polymer.html">
|
||||
<link rel="import" href="../../../bower_components/iron-flex-layout/iron-flex-layout.html">
|
||||
<link rel="import" href="../../../bower_components/iron-ajax/iron-ajax.html">
|
||||
<link rel="import" href="../../../bower_components/iron-list/iron-list.html">
|
||||
<link rel="import" href="../../../bower_components/paper-styles/color.html">
|
||||
<link rel="import" href="../../../bower_components/paper-styles/typography.html">
|
||||
<link rel="import" href="../../../bower_components/paper-icon-button/paper-icon-button.html">
|
||||
<link rel="import" href="../../../bower_components/iron-icon/iron-icon.html">
|
||||
<link rel="import" href="../../../bower_components/paper-badge/paper-badge.html">
|
||||
<link rel="import" href="../../../bower_components/paper-item/paper-item.html">
|
||||
<link rel="import" href="../../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html">
|
||||
|
||||
<style>
|
||||
.pad {
|
||||
@ -58,7 +58,10 @@
|
||||
ul li div.text{ float:left; width: 400px;text-align: left;height: 55px }
|
||||
ul li div.folder-container{ float:left; width: 70px;text-align: left ;height: 55px}
|
||||
ul li:hover { background: #eeeeee; height: 55px}
|
||||
|
||||
.file{
|
||||
width: 52px;
|
||||
height: 52px;
|
||||
}
|
||||
.folder {
|
||||
height: 52px;
|
||||
box-sizing: border-box;
|
||||
@ -107,7 +110,14 @@
|
||||
<div>
|
||||
<ul tabindex$="[[tabIndex]]" aria-label$="Select/Deselect [[item.name]]" class$="[[_computedClass(selected)]]">
|
||||
<li>
|
||||
<div class="folder-container"><img class="folder" src="img/folder.svg"></div>
|
||||
<div class="folder-container">
|
||||
<template is="dom-if" if="{{item.isFolder}}">
|
||||
<img class="folder" src="img/folder.svg">
|
||||
</template>
|
||||
<template is="dom-if" if="{{!item.isFolder}}">
|
||||
<img class="file" src="{{thumbBaseUrl()}}{{item.contentUrl}}">
|
||||
</template>
|
||||
</div>
|
||||
<div class="text">
|
||||
<div class="pad">
|
||||
<div class="primary">
|
||||
@ -149,6 +159,7 @@
|
||||
function error () {
|
||||
console.log("error");
|
||||
}
|
||||
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.addEventListener("load", (XMLHttpRequestProgressEvent)=>{
|
||||
this.data =JSON.parse(XMLHttpRequestProgressEvent.currentTarget.response).items;
|
||||
@ -156,10 +167,14 @@
|
||||
|
||||
xhr.addEventListener("error", error);
|
||||
|
||||
xhr.open("GET", this.url);
|
||||
xhr.open("GET", this.url + this.fileService);
|
||||
xhr.withCredentials = true;
|
||||
xhr.setRequestHeader("Authorization", 'Basic ' + btoa('admin:admin'));
|
||||
xhr.send();
|
||||
},
|
||||
|
||||
thumbBaseUrl: function () {
|
||||
return 'http://192.168.99.100:8080/share/proxy/alfresco/';
|
||||
}
|
||||
|
||||
});
|
||||
|
Loading…
x
Reference in New Issue
Block a user