Merge pull request #38 from github/cem

Custom Element Manifest

Author: manuelpuyol

README.md

@@ -3,40 +3,47 @@
 Boilerplate for creating a custom element.
 
 ## Installation
-
+Available on [npm](https://www.npmjs.com/) as [**@github/custom-element-element**](https://www.npmjs.com/package/@github/custom-element-element).
 ```
-$ npm install @github/custom-element-element
+$ npm install --save @github/custom-element-element
 ```
 
 ## Usage
 
+### Script
+
+Import as ES modules:
+
 ```js
 import '@github/custom-element-element'
 ```
 
+Include with a script tag:
+
 ```html
+<script type="module" src="./node_modules/@github/custom-element-element/dist/index.js">
+```
+
+An example Custom Element. This documentation ends up in the
+README so describe how this elements works here.
+
+You can event add examples on the element is used with Markdown.
+
+```
 <custom-element></custom-element>
 ```
 
 ## Browser support
 
 Browsers without native [custom element support][support] require a [polyfill][].
-
 - Chrome
 - Firefox
 - Safari
 - Microsoft Edge
 
-[support]: https://caniuse.com/#feat=custom-elementsv1
+[support]: https://caniuse.com/custom-elementsv1
 [polyfill]: https://github.com/webcomponents/custom-elements
 
-## Development
-
-```
-npm install
-npm test
-```
-
 ## License
 
-Distributed under the MIT license. See LICENSE for details.
+Distributed under the MIT license. See LICENSE for details.

custom-elements-manifest.config.js

@@ -0,0 +1,8 @@
+import {generateCustomData} from 'cem-plugin-vs-code-custom-data-generator'
+import {readme} from '@github/cem-plugin-readme'
+
+export default {
+  packagejson: true,
+  globs: ['src/*-element.ts'],
+  plugins: [readme(), generateCustomData()]
+}

custom-elements.json

@@ -0,0 +1,40 @@
+{
+  "schemaVersion": "1.0.0",
+  "readme": "",
+  "modules": [
+    {
+      "kind": "javascript-module",
+      "path": "src/custom-element.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "An example Custom Element. This documentation ends up in the\nREADME so describe how this elements works here.\n\nYou can event add examples on the element is used with Markdown.\n\n```\n<custom-element></custom-element>\n```",
+          "name": "CustomElementElement",
+          "superclass": {
+            "name": "HTMLElement"
+          },
+          "tagName": "custom-element",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "CustomElementElement",
+            "module": "src/custom-element.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "custom-element",
+          "declaration": {
+            "name": "CustomElementElement",
+            "module": "src/custom-element.ts"
+          }
+        }
+      ]
+    }
+  ]
+}