From cbe0474f78626dbc7618aadda77f988e3f9ff692 Mon Sep 17 00:00:00 2001
From: Shuwen Qian <sqian@mediamath.com>
Date: Fri, 25 Sep 2015 12:02:31 -0500
Subject: [PATCH] First draft of a migration guide

---
 docs/articles/manifest.json      |  3 ++
 docs/articles/migration_guide.md | 60 ++++++++++++++++++++++++++++++++
 2 files changed, 63 insertions(+)
 create mode 100644 docs/articles/migration_guide.md

diff --git a/docs/articles/manifest.json b/docs/articles/manifest.json
index f5e85491..b9801fb6 100644
--- a/docs/articles/manifest.json
+++ b/docs/articles/manifest.json
@@ -9,5 +9,8 @@
 	{
 		"key":"grid_intro",
 		"children":["grid_config", "grid_data_integration"]
+	},
+	{
+		"key":"migration_guide"
 	}
 ]
\ No newline at end of file
diff --git a/docs/articles/migration_guide.md b/docs/articles/migration_guide.md
new file mode 100644
index 00000000..3a0f230e
--- /dev/null
+++ b/docs/articles/migration_guide.md
@@ -0,0 +1,60 @@
+# Migration Guide
+Strand is now built on <a href="https://www.polymer-project.org/1.0/docs/">Polymer 1.0</a>. This article will only document breaking changes to the Strand APIs. For breaking changes between the 0.5 and 1.0 release of Polymer, see the <a href="https://www.polymer-project.org/1.0/docs/migration.html">Polymer migration guide</a>.
+
+### mm-icon
+`primaryColor` and `hoverColor` properties have been deprecated. Color should instead be configured in stylesheets.
+
+Before:
+```html
+<mm-icon type="actions" width="32" height="32" primaryColor="#666666" hoverColor="#333333"></mm-icon>
+```
+
+After:
+```html
+<style>
+#myIcon {
+	color: #666666;
+}
+#myIcon:hover {
+	color: #333333;
+}
+</style>
+<mm-icon type="actions" width="32" height="32"></mm-icon>
+```
+
+---
+
+### mm-input
+Autocompleting `mm-input` is now a separate component, `mm-autocomplete`
+
+Before:
+```html
+<mm-input autocomplete data="[{"name":"apples"},{"name":"bears"},{"name":"candy"},{"name":"ducks"},{"name":"everything"}]"></mm-input>
+```
+
+After:
+```html
+<mm-autocomplete data="[{"name":"apples"},{"name":"bears"},{"name":"candy"},{"name":"ducks"},{"name":"everything"}]"></mm-autocomplete>
+```
+
+---
+
+### mm-tooltip
+`mm-tooltip` no longer requires a template tag. The tooltip's target should be moved outside of the component, and a selector should be passed to tooltip using the `target` attribute.
+
+Before:
+```html
+<mm-tooltip>
+	<mm-icon type="info" width="14" height="14"></mm-icon>
+	<template>
+		<label>Hi there, I'm a tooltip.</label>
+	</template>
+</mm-tooltip>
+```
+After:
+```html
+<mm-icon id="defaultTarg" type="info" width="14" height="14"></mm-icon>
+<mm-tooltip target="#defaultTarg">
+	<label>Hi there, I'm a tooltip.</label>
+</mm-tooltip>
+```
\ No newline at end of file