fix(swc-templates): update naming, imports, and dependencies

adobe · Sep 17, 2020 · 12d43ed · 12d43ed
1 parent f7cde92
commit 12d43ed
Show file tree

Hide file tree

Showing 6 changed files with 20 additions and 12 deletions.
diff --git a/projects/templates/plop-templates/component.ts.hbs b/projects/templates/plop-templates/component.ts.hbs
@@ -12,17 +12,17 @@ governing permissions and limitations under the License.
 
 import {
     html,
-    LitElement,
+    SpectrumElement,
     CSSResultArray,
     TemplateResult,
-} from 'lit-element';
+} from '@spectrum-web-components/base';
 
 import styles from './{{ name }}.css.js';
 
 /**
  * @element {{> tagnamePartial }}
  */
-export class {{className name}} extends LitElement {
+export class {{className name}} extends SpectrumElement {
     public static get styles(): CSSResultArray {
         return [styles];
     }

diff --git a/projects/templates/plop-templates/package.json.hbs b/projects/templates/plop-templates/package.json.hbs
@@ -38,19 +38,19 @@
         "/src/"
     ],
     "sideEffects": [
-        "./{{> tagnamePartial }}.js",
-        "./{{> tagnamePartial }}.ts"
+        "./sp-*.js",
+        "./sp-*.ts"
     ],
     "scripts": {
         "test": "echo \"Error: run tests from mono-repo root.\" && exit 1"
     },
     "author": "",
     "license": "Apache-2.0",
     "devDependencies": {
-        "@spectrum-css/{{ name }}": "^2.0.0"
+        "@spectrum-css/{{spectrumCSS name}}": "^2.0.0"
     },
     "dependencies": {
-        "@spectrum-web-components/base": "^0.0.1",
+        "@spectrum-web-components/base": "^0.1.0",
         "tslib": "^2.0.0"
     }
 }
diff --git a/projects/templates/plop-templates/spectrum-config.js.hbs b/projects/templates/plop-templates/spectrum-config.js.hbs
@@ -10,8 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-module.exports = {
-    spectrum: '{{ name }}',
+const config = {
+    spectrum: '{{spectrumCSS name}}',
     components: [
         {
             name: '{{ name }}',
@@ -21,3 +21,5 @@ module.exports = {
         },
     ],
 };
+
+export default config;
diff --git a/projects/templates/plop-templates/test.ts.hbs b/projects/templates/plop-templates/test.ts.hbs
@@ -10,8 +10,7 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-import { html } from 'lit-element';
-import { fixture, elementUpdated, expect } from '@open-wc/testing';
+import { fixture, elementUpdated, expect, html } from '@open-wc/testing';
 
 import '../{{> tagnamePartial }}.js';
 import { {{className name}} } from '..';

diff --git a/projects/templates/plop-templates/tsconfig.json.hbs b/projects/templates/plop-templates/tsconfig.json.hbs
@@ -5,5 +5,8 @@
         "rootDir": "./"
     },
     "include": ["*.ts", "src/*.ts"],
-    "exclude": ["test/*.ts", "stories/*.ts"]
+    "exclude": ["test/*.ts", "stories/*.ts"],
+    "references": [
+        { "path": "../base" }
+    ]
 }
diff --git a/projects/templates/plopfile.js b/projects/templates/plopfile.js
@@ -10,6 +10,10 @@ module.exports = function (plop) {
         const capitalized = camel.charAt(0).toUpperCase() + camel.substring(1);
         return capitalized;
     });
+    // name of Spectrum CSS package
+    plop.setHelper('spectrumCSS', function (name) {
+        return name.replace(/-/g, '');
+    });
     // name used as title in storybook and documentation
     plop.setHelper('displayName', function (name) {
         const camel = name.replace(/-([a-z])/g, (g) => {