MC-6271: Add docs for content type forms

commit 160c017
Merge: d6cd01b a80ff0d
Author: Bruce Denham <bdenham@adobe.com>
Date:   Mon Dec 17 02:51:54 2018 -0600

    Merge pull request #7 from magento-devdocs/MC-5769

    MC-5769: Complete content type tutorial

commit a80ff0d
Merge: 8e21928 4b574a1
Author: Bruce Denham <bdenham@adobe.com>
Date:   Mon Dec 17 02:39:07 2018 -0600

    Merge branch 'MC-5769' of github.com:magento-devdocs/magento2-page-builder into MC-5769

commit 8e21928
Author: Bruce Denham <bdenham@adobe.com>
Date:   Mon Dec 17 02:38:49 2018 -0600

    MC-5769: Complete content type tutorial

    Updated from PR review.

commit d6cd01b
Merge: 5ea0280 4b574a1
Author: Bruce Denham <bdenham@adobe.com>
Date:   Mon Dec 17 02:35:00 2018 -0600

    Merge pull request #5 from magento-devdocs/MC-5769

    MC-5769: Complete content type tutorial

commit 4b574a1
Author: Kevin Harper <keharper@users.noreply.github.com>
Date:   Mon Dec 17 02:14:14 2018 -0600

    MC-5769: Complete content type tutorial

    Updated from suggestion feature

    Co-Authored-By: bdenham <bdenham@adobe.com>

commit b3d4dcb
Author: Kevin Harper <keharper@users.noreply.github.com>
Date:   Mon Dec 17 02:13:10 2018 -0600

    MC-5769: Complete content type tutorial

    Updated from suggestion feature

    Co-Authored-By: bdenham <bdenham@adobe.com>

commit 939ef44
Author: Kevin Harper <keharper@users.noreply.github.com>
Date:   Mon Dec 17 02:11:46 2018 -0600

    MC-5769: Complete content type tutorial

    Updated from suggestion feature

    Co-Authored-By: bdenham <bdenham@adobe.com>

commit a8fe52c
Author: Kevin Harper <keharper@users.noreply.github.com>
Date:   Mon Dec 17 02:11:20 2018 -0600

    MC-5769: Complete content type tutorial

    Updated from suggestion feature

    Co-Authored-By: bdenham <bdenham@adobe.com>

commit f9a637e
Author: Kevin Harper <keharper@users.noreply.github.com>
Date:   Mon Dec 17 02:10:47 2018 -0600

    MC-5769: Complete content type tutorial

    Updated from suggestion feature

    Co-Authored-By: bdenham <bdenham@adobe.com>

commit 5ea0280
Merge: c83410a d4d31a7
Author: Cari Spruiell <spruiell@adobe.com>
Date:   Mon Dec 10 14:44:58 2018 -0600

    Merge pull request #181 from magento-obsessive-owls/1.0.0-beta-release

    Sync Develop w/ 1.0.0-Beta-Release Branch

commit c83410a
Merge: 9ebaf06 e04033e
Author: Dave Macaulay <daavem@googlemail.com>
Date:   Tue Nov 20 11:05:23 2018 +0100

    Merge pull request #177 from magento/1.0.0-release

    Sync develop with release branch

Author: bdenham

docs/create-basic-content-type/overview.md

@@ -1,4 +1,4 @@
-# Introduction
+# Overview
 
 ***
 The development of this tutorial is currently **IN PROGRESS**.
@@ -11,11 +11,11 @@ Page Builder comes with several content types (controls) you can use to build yo
 
 ## Quote preview
 
-A preview of the Qoute content type you will build is shown in the following screenshot, which shows three instances of the Quote control, on in each column shown here on the Admin stage: 
+The following screenshot shows three instances of the Quote control you will build in this tutorial: 
 
 ![QuoteTypeDisplay](../images/AdminTestimonials.png)
 
-And here are the same three Quote controls rendered on a mock testimonial page in the storefront:
+And the same three Quote controls are shown rendered here on a mock testimonial page in the storefront:
 
 ![StorefrontTestimonials](../images/StorefrontTestimonials.png)
 
@@ -38,9 +38,9 @@ The steps for creating the Quote content type are illustrated and described belo
 ![Creating Custom Content Types](../images/content-type-overview.png)
 
 1. **Add configuration**: Create an XML file to define your content type and reference the other files that control the appearance and behavior of your content type.  
-2. **Add templates**: Create HTML templates that define the appearance of your content types on the Admin stage (preview.html) and the storefront (master.html).
-3. **Add component**: Create a JavaScript file that defines the behavior of your content type on the Admin stage (preview.js) and the storefront (master.js).
-4. **Add form**: Create a UI component form and a layout so users can edit your content type within the Page Builder editor.
+2. **Add templates**: Create HTML templates that define the appearance of your content types on the Admin stage (`preview.html`) and the storefront (`master.html`).
+3. **Add component**: Create a JavaScript file that defines the behavior of your content type on the Admin stage (`preview.js`) and the storefront (`master.js`).
+4. **Add form**: Create a UI component form and a layout so Admin users can edit your content type within the Page Builder editor.
 5. **Add styles**: Create LESS files to style your content types when rendered in the Admin UI and on the storefront. 
 6. **Add frontend widget**: Create a JavaScript file to control the UI behavior (user interactivity) of your content type on the storefront.  
 
@@ -55,4 +55,4 @@ Before we get started, take a look at what you will be building. The directory s
 The `PageBuilderQuote` module structure represents an overview of the conventions used for content types. Many of these conventions are simply those defined for developing UI components. However, the conventions specific to Page Builder content types appropriately start within the directories called `content_type` or `content-type`. Page Builder instantiates a content type from the files defined within these directories. We will discuss these content type conventions within each step of the process.
 
 ## Next
-[Step 1: Add configuration](step-1-add-configuration.md)
+[Step 1: Add configuration](step-1-add-configuration.md)

docs/create-basic-content-type/step-1-add-configuration.md

@@ -13,7 +13,7 @@ Files referenced from the configuration include the HTML templates, the JavaScri
 
 ## Configuration conventions
 
-By convention, Page Builder requires the configuration for a content type to be in the `adminhtml` area within a directory named `pagebuilder` and a subdirectory named `content_type` or `content-type`.
+By convention, Page Builder requires the configuration file to be in the `<module_name>/adminhtml/pagebuilder/content_type` or `content-type` directory.
 
 The name of your configuration file should reflect the name of your content type prefixed by your module vendor name and separated by an underscore (_). For example, our module name is `Example/PageBuilderQuote` and our content type is a quote control, so we name our configuration file `example_quote.xml` and add it to our module within the following directory structure (`view/adminhtml/pagebuilder/content_type/`):
 
@@ -69,10 +69,10 @@ The `type` element defines the key properties of your content type. The attribut
 | `label`             | Label displayed in the Page Builder panel, option menu, and on the Admin stage. |
 | `group`             | Group or category in the panel menu where your content type is displayed. The default groups are Layout, Elements, Media, and Add Content. See [Panel configurations](../configurations/panel-configurations.md) for more details. |
 | `component`         | There are two component types to choose from: `content-type` and `content-type-collection`. Use `Magento_PageBuilder/js/content-type` for static content types that do not have children. Use `Magento_PageBuilder/js/content-type-collection` for content types that can contain children, otherwise known as container content types. |
-| `preview_component` | Optional. JavaScript file (`preview.js`) that provides rendering logic within the Admin UI. |
-| `master_component`  | Optional. JavaScript file (`master.js`) that provides rendering logic generic for all appearances of your content type when rendered on the storefront. |
+| `preview_component` | Optional. JavaScript file (`preview.js`) that provides rendering logic within the Admin UI. The preview component does not need to specify the `.js` extension. If you don't provide the `preview_component`, Page Builder uses the base `Preview` component shown in the code: `Magento_PageBuilder/js/content-type/preview`. |
+| `master_component`  | Optional. JavaScript file (`master.js`) that provides rendering logic generic for all appearances of your content type when rendered on the storefront. The master component does not need to specify the `.js` extension. If you don't provide the `master_component`, Page Builder uses the base `Master` component shown in the code: `Magento_PageBuilder/js/content-type/master`. |
 | `form`              | UI component form that provides the form controls for editing your content type. |
-| `icon`              | Optional. PNG or SVG image displayed in the Page Builder panel alongside the label. |
+| `icon`              | Optional. PNG or SVG image displayed in the Page Builder panel alongside the label. If no icon value is provided, the content type will simply be displayed in the Page Builder panel without an icon. |
 | `sortOrder`         | Optional. The listed order within the menu group. For example, `sortOrder=21` puts the content type third in the `Elements` menu group, after the content types with `sortOrder`s of 10 and 20. |
 | `translate`         | Identifies the attribute you want Magento to translate. Here, the `label` value is set for translation. |
 

docs/create-basic-content-type/step-2-add-templates.md

@@ -17,7 +17,7 @@ Conventions for adding content type templates are as follows.
 
 - Page Builder requires the name of an `appearance` to match the name of the directory containing the appearance templates. If they don't match, your content type appearances will not render. 
 
-  For example, if you navigate to the Banner's appearance templates (`app/code/Magento/PageBuilder/view/adminhtml/web/template/content-type/banner`) you can see that the names of the template directories match the names of the four appearances defined in the `banner.xml` configuration file as shown here:
+  For example, if you navigate to the Banner's appearance templates (`PageBuilder/view/adminhtml/web/template/content-type/banner`) you can see that the names of the template directories match the names of the four appearances defined in the `banner.xml` configuration file as shown here:
 
   ```xml
   <appearances>
@@ -154,7 +154,7 @@ The `css` attribute applies CSS classes entered by users on the form to a templa
 
 ### class
 
- Just as with any other html template, you can add your own classes to your template elements. However, you should **always add the `pagebuilder-content-type` as the first class in the top node in your `preview.html` template** as shown for the Quote. Page Builder uses the `pagebuilder-content-type` class to add visual indicators and mouseover effects to the Admin preview template, such as correctly positioning the options menu. Defining custom LESS/CSS classes for your content type is discussed in [Step 5: Add styles](step-5-add-styles.md).
+ Just as with any other HTML template, you can add your own classes to your template elements. However, **always add the `pagebuilder-content-type` as the first class in the top node in your `preview.html` template** as shown for the Quote. Page Builder uses the `pagebuilder-content-type` class to add visual indicators and mouseover effects to the Admin preview template, such as correctly positioning the options menu. Defining custom LESS/CSS classes for your content type is discussed in [Step 5: Add styles](step-5-add-styles.md).
 
 ### liveEdit