diff --git a/projects/templates/plop-templates/args.ts.hbs b/projects/templates/plop-templates/args.ts.hbs new file mode 100644 index 0000000000..bffdec26d4 --- /dev/null +++ b/projects/templates/plop-templates/args.ts.hbs @@ -0,0 +1,3 @@ +export const argTypes = { + +} \ No newline at end of file diff --git a/projects/templates/plop-templates/stories.ts.hbs b/projects/templates/plop-templates/stories.ts.hbs index df16d9f25e..2546bcb022 100644 --- a/projects/templates/plop-templates/stories.ts.hbs +++ b/projects/templates/plop-templates/stories.ts.hbs @@ -1,12 +1,12 @@ -import { html, TemplateResult } from '@spectrum-web-components/base'; +import { TemplateResult } from '@spectrum-web-components/base'; -import '../{{> tagnamePartial }}.js'; +import { Template } from './template.js'; +import { argTypes } from './args.js'; export default { title: '{{displayName name}}', component: '{{> tagnamePartial}}', + argTypes, }; -export const Default = (): TemplateResult => { - return html`<{{> tagnamePartial}}> tagnamePartial}}>`; -}; +export const Default = (): TemplateResult => Template({}); diff --git a/projects/templates/plop-templates/template.ts.hbs b/projects/templates/plop-templates/template.ts.hbs new file mode 100644 index 0000000000..5268588073 --- /dev/null +++ b/projects/templates/plop-templates/template.ts.hbs @@ -0,0 +1,13 @@ +import { html, TemplateResult } from '@spectrum-web-components/base'; + +import '@spectrum-web-components/{{ name }}/{{> tagnamePartial }}.js'; + +export interface Properties { +} + +export const Template = (props: Properties): TemplateResult => { + // Remove the console.log() when you're ready to consume `props` in the element below. + // eslint-disable-next-line no-console + console.log('template properties', props); + return html`<{{> tagnamePartial}}> tagnamePartial}}>`; +}; diff --git a/projects/templates/plop-templates/test.ts.hbs b/projects/templates/plop-templates/test.ts.hbs index b1b83d1182..e79726c971 100644 --- a/projects/templates/plop-templates/test.ts.hbs +++ b/projects/templates/plop-templates/test.ts.hbs @@ -1,7 +1,7 @@ import { fixture, elementUpdated, expect, html } from '@open-wc/testing'; -import '../{{> tagnamePartial }}.js'; -import { {{className name}} } from '..'; +import '@spectrum-web-components/{{name}}/{{> tagnamePartial }}.js'; +import { {{className name}} } from '@spectrum-web-components/{{name}}'; import { testForLitDevWarnings } from '../../../test/testing-helpers.js'; describe('{{className name}}', () => { diff --git a/projects/templates/plopfile.js b/projects/templates/plopfile.js index 445f96c6e8..daf9d9ed90 100644 --- a/projects/templates/plopfile.js +++ b/projects/templates/plopfile.js @@ -54,7 +54,7 @@ module.exports = function (plop) { plop.setActionType('format files', function (answers) { execSync( - `cd ../../ && yarn prettier --write packages/${answers.name} && eslint --fix -f pretty packages/${answers.name} && stylelint --fix packages/${answers.name}` + `cd ../../ && yarn prettier --write packages/${answers.name} && yarn eslint --fix -f pretty packages/${answers.name} && yarn stylelint --fix packages/${answers.name}` ); }); @@ -126,6 +126,16 @@ module.exports = function (plop) { path: '../../packages/{{name}}/stories/{{name}}.stories.ts', templateFile: 'plop-templates/stories.ts.hbs', }, + { + type: 'add', + path: '../../packages/{{name}}/stories/args.ts', + templateFile: 'plop-templates/args.ts.hbs', + }, + { + type: 'add', + path: '../../packages/{{name}}/stories/template.ts', + templateFile: 'plop-templates/template.ts.hbs', + }, { type: 'add', path: '../../packages/{{name}}/README.md',