liferay · gcmznt · May 30, 2018 · Jun 5, 2018 · Jul 2, 2018
diff --git a/packages/clay-autocomplete/LICENSE.md b/packages/clay-autocomplete/LICENSE.md
@@ -0,0 +1,29 @@
+# Software License Agreement (BSD License)
+
+Copyright (c) 2014, Liferay Inc.
+All rights reserved.
+
+Redistribution and use of this software in source and binary forms, with or without modification, are
+permitted provided that the following conditions are met:
+
+* Redistributions of source code must retain the above
+  copyright notice, this list of conditions and the
+  following disclaimer.
+
+* Redistributions in binary form must reproduce the above
+  copyright notice, this list of conditions and the
+  following disclaimer in the documentation and/or other
+  materials provided with the distribution.
+
+* The name of Liferay Inc. may not be used to endorse or promote products
+  derived from this software without specific prior
+  written permission of Liferay Inc.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED
+WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A
+PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR
+ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR
+TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF
+ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
diff --git a/packages/clay-autocomplete/README.md b/packages/clay-autocomplete/README.md
@@ -0,0 +1,26 @@
+# clay-autocomplete
+
+Autocomplete textarea
+
+## Setup
+
+1. Install NodeJS >= v0.12.0 and NPM >= v3.0.0, if you don't have it yet. You
+can find it [here](https://nodejs.org).
+
+2. Install local dependencies:
+
+  ```
+  npm install
+  ```
+
+3. Build the code:
+
+  ```
+  npm run build
+  ```
+
+4. Open the demo at demos/index.html on your browser.
+
+## Contribute
+
+We'd love to get contributions from you! Please, check our [Contributing Guidelines](CONTRIBUTING.md) to see how you can help us improve.
diff --git a/packages/clay-autocomplete/demos/a11y.html b/packages/clay-autocomplete/demos/a11y.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<title>Demo: ClayAutocomplete</title>
+
+	<link rel="stylesheet" href="../../../node_modules/clay-css/lib/css/atlas.css">
+
+	<style>
+		body {
+			background-color: #FFF;
+		}
+
+		.row {
+			margin-bottom: 20px;
+		}
+	</style>
+
+	<script src="../build/globals/clay-autocomplete.js"></script>
+</head>
+<body class="container">
+	<h1 class="page-title">
+		ClayAutocomplete
+	</h1>
+
+	<div id="container"></div>
+
+	<script type="text/javascript">
+
+		new metal.ClayAutocomplete({}, '#container');
+
+	</script>
+</body>
+</html>
diff --git a/packages/clay-autocomplete/demos/data.json b/packages/clay-autocomplete/demos/data.json
@@ -0,0 +1,152 @@
+[
+	{
+		"label": "json el0"
+	},
+	{
+		"label": "json el1"
+	},
+	{
+		"label": "json el2"
+	},
+	{
+		"label": "json el3"
+	},
+	{
+		"label": "json el4"
+	},
+	{
+		"label": "json el5"
+	},
+	{
+		"label": "json el6"
+	},
+	{
+		"label": "json el7"
+	},
+	{
+		"label": "json el8"
+	},
+	{
+		"label": "json el9"
+	},
+	{
+		"label": "json el10"
+	},
+	{
+		"label": "json el11"
+	},
+	{
+		"label": "json el12"
+	},
+	{
+		"label": "json el13"
+	},
+	{
+		"label": "json el14"
+	},
+	{
+		"label": "json el15"
+	},
+	{
+		"label": "json el16"
+	},
+	{
+		"label": "json el17"
+	},
+	{
+		"label": "json el18"
+	},
+	{
+		"label": "json el19"
+	},
+	{
+		"label": "json el20"
+	},
+	{
+		"label": "json el21"
+	},
+	{
+		"label": "json el22"
+	},
+	{
+		"label": "json el23"
+	},
+	{
+		"label": "json el24"
+	},
+	{
+		"label": "json el25"
+	},
+	{
+		"label": "json el26"
+	},
+	{
+		"label": "json el27"
+	},
+	{
+		"label": "json el28"
+	},
+	{
+		"label": "json el29"
+	},
+	{
+		"label": "json el30"
+	},
+	{
+		"label": "json el31"
+	},
+	{
+		"label": "json el32"
+	},
+	{
+		"label": "json el33"
+	},
+	{
+		"label": "json el34"
+	},
+	{
+		"label": "json el35"
+	},
+	{
+		"label": "json el36"
+	},
+	{
+		"label": "json el37"
+	},
+	{
+		"label": "json el38"
+	},
+	{
+		"label": "json el39"
+	},
+	{
+		"label": "json el40"
+	},
+	{
+		"label": "json el41"
+	},
+	{
+		"label": "json el42"
+	},
+	{
+		"label": "json el43"
+	},
+	{
+		"label": "json el44"
+	},
+	{
+		"label": "json el45"
+	},
+	{
+		"label": "json el46"
+	},
+	{
+		"label": "json el47"
+	},
+	{
+		"label": "json el48"
+	},
+	{
+		"label": "json el49"
+	}
+]
diff --git a/packages/clay-autocomplete/demos/index.html b/packages/clay-autocomplete/demos/index.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+	<meta charset="UTF-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<title>Demo: ClayAutocomplete</title>
+
+	<link rel="stylesheet" href="../../../node_modules/clay-css/lib/css/atlas.css">
+
+	<style>
+		body {
+			background-color: #FFF;
+			padding: 50px 20px;
+		}
+
+		.row {
+			margin-bottom: 20px;
+		}
+	</style>
+
+	<script src="../build/globals/clay-autocomplete.js"></script>
+</head>
+
+<body class="container">
+	<h1 class="page-title">
+		ClayAutocomplete
+	</h1>
+
+	<div id="container"></div>
+
+	<div id="container2"></div>
+
+	<script type="text/javascript">
+
+		const ac = new metal.ClayAutocomplete({
+			dataSource: new Array(50).fill(1).map((e, i) => ({ label: `el${i}` })),
+			onSubmit: (...args) => console.log(args)
+		}, '#container');
+
+		const ac2 = new metal.ClayAutocomplete({
+			dataSource: '/packages/clay-autocomplete/demos/data.json',
+			onSubmit: (...args) => console.log(args)
+		}, '#container2');
+
+		ac.on('submitQuery', el => console.log(el))
+		ac2.on('submitQuery', el => console.log(el))
+
+	</script>
+</body>
+
+</html>
diff --git a/packages/clay-autocomplete/package.json b/packages/clay-autocomplete/package.json
@@ -0,0 +1,55 @@
+{
+	"name": "clay-autocomplete",
+	"version": "1.0.0-alpha.8",
+	"description": "Metal ClayAutocomplete component",
+	"license": "BSD",
+	"repository": "https://github.com/liferay/clay/tree/master/packages/clay-autocomplete",
+	"engines": {
+		"node": ">=0.12.0",
+		"npm": ">=3.0.0"
+	},
+	"main": "lib/ClayAutocomplete.js",
+	"esnext:main": "src/ClayAutocomplete.js",
+	"jsnext:main": "src/ClayAutocomplete.js",
+	"files": [
+		"lib",
+		"src",
+		"test"
+	],
+	"scripts": {
+		"build": "npm run soy && webpack",
+		"dev": "webpack-dev-server --inline --hot",
+		"compile": "babel -d lib/ src/ -s --ignore src/__tests__",
+		"prepublish": "npm run soy && npm run compile",
+		"soy": "metalsoy"
+	},
+	"keywords": [
+		"clay",
+		"metal"
+	],
+	"dependencies": {
+		"fuzzy": "^0.1.3",
+		"metal": "^2.16.0",
+		"metal-component": "^2.16.0",
+		"metal-soy": "^2.16.0",
+		"metal-state": "^2.16.0",
+		"metal-web-component": "^2.16.0"
+	},
+	"devDependencies": {
+		"babel-cli": "^6.24.1",
+		"babel-core": "^6.25.0",
+		"babel-loader": "^7.0.0",
+		"babel-plugin-transform-node-env-inline": "^0.1.1",
+		"babel-preset-env": "^1.6.0",
+		"browserslist-config-clay-components": "^1.0.0-alpha.2",
+		"clay": "^2.0.0-beta.4",
+		"metal-dom": "^2.13.2",
+		"metal-soy-loader": "^1.0.0-alpha.4",
+		"metal-tools-soy": "^6.0.0",
+		"webpack": "^3.0.0",
+		"webpack-dev-server": "^2.11.2"
+	},
+	"browserslist": [
+		"extends browserslist-config-clay-components"
+	]
+}