From a2554e8229e4f57fe550960af50470d2d95c42a4 Mon Sep 17 00:00:00 2001 From: Josh Fleming Date: Tue, 22 Feb 2022 21:15:12 -0800 Subject: [PATCH 1/4] Add option to include custom template --- src/atomicComponent.ts | 14 ++++++++++++++ src/index.ts | 1 + 2 files changed, 15 insertions(+) diff --git a/src/atomicComponent.ts b/src/atomicComponent.ts index d7f03c8..3daf4af 100644 --- a/src/atomicComponent.ts +++ b/src/atomicComponent.ts @@ -9,6 +9,7 @@ const atomicComponent = ( plop: NodePlopAPI ) => { const defaultConfig: GeneratorConfig = { + additionalTemplates: false, createIndex: true, functional: true, basePath: "src/ui/components", @@ -235,6 +236,19 @@ const atomicComponent = ( data, }); + if (fullConfig.additionalTemplates) { + fullConfig.additionalTemplates.forEach(({ extension, template }) => { + actions.push({ + type: "add", + path: + fullConfig.basePath + + `/${formattedType}/${formattedDirName}/${formattedFileName}.${extension}`, + templateFile: template, + data, + }); + }); + } + return { description: "⚛ react component", prompts, diff --git a/src/index.ts b/src/index.ts index c8a56c7..edb0eaf 100644 --- a/src/index.ts +++ b/src/index.ts @@ -4,6 +4,7 @@ import atomicComponent from "./atomicComponent"; import { FileNameFormatters } from "./types"; export interface GeneratorConfig { + additionalTemplates: { extension: string; template: string }[] | false; createIndex: boolean; functional: boolean; basePath: string; From 59bc6764f47e33038a16cc16b36ce5868b58425e Mon Sep 17 00:00:00 2001 From: Josh Fleming Date: Wed, 16 Feb 2022 14:53:37 -0800 Subject: [PATCH 2/4] Add config boolean to make styles file optional --- src/atomicComponent.ts | 19 +++++++++++-------- src/index.ts | 1 + 2 files changed, 12 insertions(+), 8 deletions(-) diff --git a/src/atomicComponent.ts b/src/atomicComponent.ts index 3daf4af..6fb0c85 100644 --- a/src/atomicComponent.ts +++ b/src/atomicComponent.ts @@ -11,6 +11,7 @@ const atomicComponent = ( const defaultConfig: GeneratorConfig = { additionalTemplates: false, createIndex: true, + createStyles: true, functional: true, basePath: "src/ui/components", withClassnameInterfaceImportPath: "/framework/ui", @@ -227,14 +228,16 @@ const atomicComponent = ( } } - actions.push({ - type: "add", - path: - fullConfig.basePath + - `/${formattedType}/${formattedDirName}/${formattedFileName}.styles.ts`, - templateFile: stylesTemplateFile, - data, - }); + if (fullConfig.createStyles) { + actions.push({ + type: "add", + path: + fullConfig.basePath + + `/${formattedType}/${formattedDirName}/${formattedFileName}.styles.ts`, + templateFile: stylesTemplateFile, + data, + }); + } if (fullConfig.additionalTemplates) { fullConfig.additionalTemplates.forEach(({ extension, template }) => { diff --git a/src/index.ts b/src/index.ts index edb0eaf..668829e 100644 --- a/src/index.ts +++ b/src/index.ts @@ -6,6 +6,7 @@ import { FileNameFormatters } from "./types"; export interface GeneratorConfig { additionalTemplates: { extension: string; template: string }[] | false; createIndex: boolean; + createStyles: boolean; functional: boolean; basePath: string; withClassnameInterfaceImportPath: string; From e9a1f89de41b2d7d953e93307619bac36fab3029 Mon Sep 17 00:00:00 2001 From: Josh Fleming Date: Wed, 16 Feb 2022 14:55:01 -0800 Subject: [PATCH 3/4] Add config option for custom name choices --- src/atomicComponent.ts | 3 ++- src/index.ts | 1 + 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/atomicComponent.ts b/src/atomicComponent.ts index 6fb0c85..86cba1d 100644 --- a/src/atomicComponent.ts +++ b/src/atomicComponent.ts @@ -10,6 +10,7 @@ const atomicComponent = ( ) => { const defaultConfig: GeneratorConfig = { additionalTemplates: false, + choices: ["Atoms", "Molecules", "Organisms", "Templates", "Pages"], createIndex: true, createStyles: true, functional: true, @@ -34,7 +35,7 @@ const atomicComponent = ( type: "list", name: "type", message: "component type", - choices: ["Atom", "Molecule", "Organism", "Template", "Page"], + choices: fullConfig.choices, }); prompts.push({ diff --git a/src/index.ts b/src/index.ts index 668829e..476eabd 100644 --- a/src/index.ts +++ b/src/index.ts @@ -5,6 +5,7 @@ import { FileNameFormatters } from "./types"; export interface GeneratorConfig { additionalTemplates: { extension: string; template: string }[] | false; + choices: string[]; createIndex: boolean; createStyles: boolean; functional: boolean; From 04e757801f28dc1bfd144d082edabea101970822 Mon Sep 17 00:00:00 2001 From: Josh Fleming Date: Tue, 22 Feb 2022 22:28:16 -0800 Subject: [PATCH 4/4] Add built package --- .gitignore | 2 +- dist/atomicComponent.js | 228 +++++++++++++++++++++++ dist/atomicComponent.js.map | 1 + dist/index.js | 13 ++ dist/index.js.map | 1 + dist/templates/component_class_based.hbs | 26 +++ dist/templates/component_functional.hbs | 18 ++ dist/templates/index.hbs | 3 + dist/templates/story.hbs | 9 + dist/templates/styles.hbs | 3 + dist/templates/test.hbs | 12 ++ dist/types.js | 15 ++ dist/types.js.map | 1 + dist/types/atomicComponent.d.ts | 29 +++ dist/types/index.d.ts | 36 ++++ dist/types/types.d.ts | 7 + 16 files changed, 403 insertions(+), 1 deletion(-) create mode 100644 dist/atomicComponent.js create mode 100644 dist/atomicComponent.js.map create mode 100644 dist/index.js create mode 100644 dist/index.js.map create mode 100644 dist/templates/component_class_based.hbs create mode 100644 dist/templates/component_functional.hbs create mode 100644 dist/templates/index.hbs create mode 100644 dist/templates/story.hbs create mode 100644 dist/templates/styles.hbs create mode 100644 dist/templates/test.hbs create mode 100644 dist/types.js create mode 100644 dist/types.js.map create mode 100644 dist/types/atomicComponent.d.ts create mode 100644 dist/types/index.d.ts create mode 100644 dist/types/types.d.ts diff --git a/.gitignore b/.gitignore index 6b57b35..1169b1d 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,4 @@ node_modules .eslintcache -dist +# dist localTest diff --git a/dist/atomicComponent.js b/dist/atomicComponent.js new file mode 100644 index 0000000..7dfde6d --- /dev/null +++ b/dist/atomicComponent.js @@ -0,0 +1,228 @@ +"use strict"; +Object.defineProperty(exports, "__esModule", { value: true }); +const tslib_1 = require("tslib"); +const path = (0, tslib_1.__importStar)(require("path")); +const fs = (0, tslib_1.__importStar)(require("fs")); +const types_1 = require("./types"); +const atomicComponent = (config, plop) => { + const defaultConfig = { + additionalTemplates: false, + choices: ["Atoms", "Molecules", "Organisms", "Templates", "Pages"], + createIndex: true, + createStyles: true, + functional: true, + basePath: "src/ui/components", + withClassnameInterfaceImportPath: "/framework/ui", + withStyleInterfaceImportPath: "/framework/ui", + tests: true, + stories: true, + styledComponents: true, + useNative: false, + useMacro: false, + }; + let fullConfig = Object.assign(Object.assign({}, defaultConfig), config); + const prompts = []; + prompts.push({ + type: "list", + name: "type", + message: "component type", + choices: fullConfig.choices, + }); + prompts.push({ + type: "input", + name: "name", + message: "component name", + }); + const actions = []; + let data = {}; + const IS_NATIVE = fullConfig.useNative; + const IS_FUNCTIONAL = fullConfig.functional; + const WITH_STYLED_COMPONENTS = fullConfig.styledComponents; + let styledComponentsType = "styled-components"; + let baseComponent = "div"; + let testId = "data-testid"; + let withClassNameClassName = `className={${ + IS_FUNCTIONAL ? "" : "this." + }props.className} `; + let withClassNameProps = "interface Props extends PropsWithClassName"; + let withClassNameImport = `import {PropsWithClassName} from '${fullConfig.withClassnameInterfaceImportPath}'`; + let typeFormatter = types_1.FileNameFormatters.pascalCase; + let dirNameFormatter = types_1.FileNameFormatters.pascalCase; + let fileNameFormatter = types_1.FileNameFormatters.pascalCase; + if ( + fullConfig.typeFormatter && + Object.values(types_1.FileNameFormatters).includes(fullConfig.typeFormatter) + ) { + typeFormatter = fullConfig.typeFormatter; + } + if ( + fullConfig.dirNameFormatter && + Object.values(types_1.FileNameFormatters).includes( + fullConfig.dirNameFormatter + ) + ) { + dirNameFormatter = fullConfig.dirNameFormatter; + } + if ( + fullConfig.fileNameFormatter && + Object.values(types_1.FileNameFormatters).includes( + fullConfig.fileNameFormatter + ) + ) { + fileNameFormatter = fullConfig.fileNameFormatter; + } + let formattedType = `{{${typeFormatter} type}}`; + let formattedDirName = `{{${dirNameFormatter} name}}`; + let formattedFileName = `{{${fileNameFormatter} name}}`; + if (fullConfig.useMacro) { + styledComponentsType = "styled-components/macro"; + } + if (IS_NATIVE) { + styledComponentsType = "styled-components/native"; + baseComponent = "Text"; + testId = "testID"; + withClassNameClassName = `style={${ + IS_FUNCTIONAL ? "" : "this." + }props.style} `; + withClassNameProps = "interface Props extends PropsWithNativeStyle"; + withClassNameImport = `import {PropsWithNativeStyle} from '${fullConfig.withStyleInterfaceImportPath}'`; + } + let styleImport = `import {Root} from './${formattedFileName}.styles'`; + let templateBaseComponent = "Root"; + if (!WITH_STYLED_COMPONENTS) { + styleImport = ""; + templateBaseComponent = "div"; + if (IS_NATIVE) { + templateBaseComponent = "Text"; + } + } + data = { + styledComponents: fullConfig.styledComponents, + baseComponent, + styledComponentsType, + templateBaseComponent, + withClassNameClassName, + withClassNameProps, + testId, + }; + plop.setPartial("testId", testId); + plop.setPartial("styleImport", styleImport); + plop.setPartial("withClassNameImport", withClassNameImport); + plop.setPartial("withClassNameClassName", withClassNameClassName); + const CURRENT_DIR = path.resolve(__dirname); + if (fullConfig.createIndex) { + let indexTemplateFile = CURRENT_DIR + "/templates/index.hbs"; + if (fullConfig.templateIndex !== undefined) { + if (fs.existsSync(fullConfig.templateIndex)) { + indexTemplateFile = fullConfig.templateIndex; + } + } + actions.push({ + type: "add", + path: + fullConfig.basePath + `/${formattedType}/${formattedDirName}/index.ts`, + templateFile: indexTemplateFile, + data, + }); + } + if (fullConfig.functional) { + let functionalTemplateFile = + CURRENT_DIR + "/templates/component_functional.hbs"; + if (fullConfig.templateComponentFunctional !== undefined) { + if (fs.existsSync(fullConfig.templateComponentFunctional)) { + functionalTemplateFile = fullConfig.templateComponentFunctional; + } + } + actions.push({ + type: "add", + path: + fullConfig.basePath + + `/${formattedType}/${formattedDirName}/${formattedFileName}.tsx`, + templateFile: functionalTemplateFile, + data, + }); + } else { + let classBasedTemplateFile = + CURRENT_DIR + "/templates/component_class_based.hbs"; + if (fullConfig.templateComponentClassBased !== undefined) { + if (fs.existsSync(fullConfig.templateComponentClassBased)) { + classBasedTemplateFile = fullConfig.templateComponentClassBased; + } + } + actions.push({ + type: "add", + path: + fullConfig.basePath + + `/${formattedType}/${formattedDirName}/${formattedFileName}.tsx`, + templateFile: classBasedTemplateFile, + data, + }); + } + if (fullConfig.tests) { + let testTemplateFile = CURRENT_DIR + "/templates/test.hbs"; + if (fullConfig.templateTest !== undefined) { + if (fs.existsSync(fullConfig.templateTest)) { + testTemplateFile = fullConfig.templateTest; + } + } + actions.push({ + type: "add", + path: + fullConfig.basePath + + `/${formattedType}/${formattedDirName}/${formattedFileName}.test.tsx`, + templateFile: testTemplateFile, + data, + }); + } + if (fullConfig.stories) { + let storyTemplateFile = CURRENT_DIR + "/templates/story.hbs"; + if (fullConfig.templateStory !== undefined) { + if (fs.existsSync(fullConfig.templateStory)) { + storyTemplateFile = fullConfig.templateStory; + } + } + actions.push({ + type: "add", + path: + fullConfig.basePath + + `/${formattedType}/${formattedDirName}/${formattedFileName}.stories.tsx`, + templateFile: storyTemplateFile, + data, + }); + } + let stylesTemplateFile = CURRENT_DIR + "/templates/styles.hbs"; + if (fullConfig.templateStyles !== undefined) { + if (fs.existsSync(fullConfig.templateStyles)) { + stylesTemplateFile = fullConfig.templateStyles; + } + } + if (fullConfig.createStyles) { + actions.push({ + type: "add", + path: + fullConfig.basePath + + `/${formattedType}/${formattedDirName}/${formattedFileName}.styles.ts`, + templateFile: stylesTemplateFile, + data, + }); + } + if (fullConfig.additionalTemplates) { + fullConfig.additionalTemplates.forEach(({ extension, template }) => { + actions.push({ + type: "add", + path: + fullConfig.basePath + + `/${formattedType}/${formattedDirName}/${formattedFileName}.${extension}`, + templateFile: template, + data, + }); + }); + } + return { + description: "⚛ react component", + prompts, + actions, + }; +}; +exports.default = atomicComponent; +//# sourceMappingURL=atomicComponent.js.map diff --git a/dist/atomicComponent.js.map b/dist/atomicComponent.js.map new file mode 100644 index 0000000..ffac3e8 --- /dev/null +++ b/dist/atomicComponent.js.map @@ -0,0 +1 @@ +{"version":3,"file":"atomicComponent.js","sourceRoot":"","sources":["../src/atomicComponent.ts"],"names":[],"mappings":"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"} \ No newline at end of file diff --git a/dist/index.js b/dist/index.js new file mode 100644 index 0000000..bb7138f --- /dev/null +++ b/dist/index.js @@ -0,0 +1,13 @@ +"use strict"; +Object.defineProperty(exports, "__esModule", { value: true }); +const tslib_1 = require("tslib"); +const atomicComponent_1 = (0, tslib_1.__importDefault)( + require("./atomicComponent") +); +const generator = (plop, config) => { + const component = (0, atomicComponent_1.default)(config, plop); + plop.setDefaultInclude({ generators: true }); + plop.setGenerator("atomic-component", component); +}; +exports.default = generator; +//# sourceMappingURL=index.js.map diff --git a/dist/index.js.map b/dist/index.js.map new file mode 100644 index 0000000..465d830 --- /dev/null +++ b/dist/index.js.map @@ -0,0 +1 @@ +{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AAEA,qFAAgD;AA4BhD,MAAM,SAAS,GAAG,CACjB,IAAiB,EACjB,MAAgC,EACzB,EAAE;IACT,MAAM,SAAS,GAAG,IAAA,yBAAe,EAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IAChD,IAAI,CAAC,iBAAiB,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC;IAC7C,IAAI,CAAC,YAAY,CAAC,kBAAkB,EAAE,SAAS,CAAC,CAAC;AAClD,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC"} \ No newline at end of file diff --git a/dist/templates/component_class_based.hbs b/dist/templates/component_class_based.hbs new file mode 100644 index 0000000..6d50253 --- /dev/null +++ b/dist/templates/component_class_based.hbs @@ -0,0 +1,26 @@ +{{> withClassNameImport }}; +import { Component } from 'react'; + +{{#if styledComponents}} +{{> styleImport }}; + +{{/if}} +interface State {} + +{{ withClassNameProps }} {} + +export class {{pascalCase name }} extends Component { + constructor(props: Props) { + super(props); + + this.state = {}; + } + + render() { + return ( + <{{ templateBaseComponent }} {{> withClassNameClassName }} {{> testId }}={"{{kebabCase name }}-root"}> + {{ name }} + + ); + } +} diff --git a/dist/templates/component_functional.hbs b/dist/templates/component_functional.hbs new file mode 100644 index 0000000..577db04 --- /dev/null +++ b/dist/templates/component_functional.hbs @@ -0,0 +1,18 @@ +{{> withClassNameImport }}; +import React, { PropsWithChildren } from 'react'; + +{{#if styledComponents}} +{{> styleImport }}; + +{{/if}} +{{ withClassNameProps }} {} + +const {{ pascalCase name }}: React.FC = (props: PropsWithChildren): React.ReactElement => { + return ( + <{{ templateBaseComponent }} {{> withClassNameClassName }} {{> testId }}={"{{kebabCase name }}-root"}> + {{ name }} + + ); +} + +export { {{ pascalCase name }} } diff --git a/dist/templates/index.hbs b/dist/templates/index.hbs new file mode 100644 index 0000000..58088da --- /dev/null +++ b/dist/templates/index.hbs @@ -0,0 +1,3 @@ +import { {{pascalCase name}} } from './{{pascalCase name}}'; + +export default {{pascalCase name }}; diff --git a/dist/templates/story.hbs b/dist/templates/story.hbs new file mode 100644 index 0000000..7f90841 --- /dev/null +++ b/dist/templates/story.hbs @@ -0,0 +1,9 @@ +import { {{ pascalCase name }} } from './{{ pascalCase name }}'; + +const StorybookSettings = { + title: 'Design System/{{ type }}s/{{ name }}' +}; + +export default StorybookSettings; + +export const Basic{{ pascalCase name }} = () => <{{ pascalCase name }} />; diff --git a/dist/templates/styles.hbs b/dist/templates/styles.hbs new file mode 100644 index 0000000..c9d3e73 --- /dev/null +++ b/dist/templates/styles.hbs @@ -0,0 +1,3 @@ +import styled from '{{ styledComponentsType }}'; + +export const Root = styled.{{ baseComponent }}``; diff --git a/dist/templates/test.hbs b/dist/templates/test.hbs new file mode 100644 index 0000000..725f04d --- /dev/null +++ b/dist/templates/test.hbs @@ -0,0 +1,12 @@ +import {render, screen} from '@testing-library/react'; +{{ componentImport }} + +const elementName = '{{kebabCase name }}'; +const basicElement = <{{pascalCase name }}>{{ name }}; + +test('element exists', () => { + render(basicElement); + + const root = screen.getByTestId(elementName + '-root'); + expect(root).toBeInTheDocument(); +}); diff --git a/dist/types.js b/dist/types.js new file mode 100644 index 0000000..8fbde57 --- /dev/null +++ b/dist/types.js @@ -0,0 +1,15 @@ +"use strict"; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.FileNameFormatters = void 0; +var FileNameFormatters; +(function (FileNameFormatters) { + FileNameFormatters["pascalCase"] = "pascalCase"; + FileNameFormatters["camelCase"] = "camelCase"; + FileNameFormatters["kebabCase"] = "kebabCase"; + FileNameFormatters["snakeCase"] = "snakeCase"; + FileNameFormatters["lowerCase"] = "lowerCase"; +})( + (FileNameFormatters = + exports.FileNameFormatters || (exports.FileNameFormatters = {})) +); +//# sourceMappingURL=types.js.map diff --git a/dist/types.js.map b/dist/types.js.map new file mode 100644 index 0000000..175d6cb --- /dev/null +++ b/dist/types.js.map @@ -0,0 +1 @@ +{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":";;;AAAA,IAAY,kBAMX;AAND,WAAY,kBAAkB;IAC7B,+CAA2B,CAAA;IAC3B,6CAAyB,CAAA;IACzB,6CAAyB,CAAA;IACzB,6CAAyB,CAAA;IACzB,6CAAyB,CAAA;AAC1B,CAAC,EANW,kBAAkB,GAAlB,0BAAkB,KAAlB,0BAAkB,QAM7B"} \ No newline at end of file diff --git a/dist/types/atomicComponent.d.ts b/dist/types/atomicComponent.d.ts new file mode 100644 index 0000000..4cd8ba3 --- /dev/null +++ b/dist/types/atomicComponent.d.ts @@ -0,0 +1,29 @@ +import { NodePlopAPI } from "node-plop"; +import { GeneratorConfig } from "./index"; +declare const atomicComponent: ( + config: Partial, + plop: NodePlopAPI +) => { + description: string; + prompts: ( + | { + type: string; + name: string; + message: string; + choices: string[]; + } + | { + type: string; + name: string; + message: string; + choices?: undefined; + } + )[]; + actions: { + type: string; + path: string; + templateFile: string; + data: {}; + }[]; +}; +export default atomicComponent; diff --git a/dist/types/index.d.ts b/dist/types/index.d.ts new file mode 100644 index 0000000..c4290ed --- /dev/null +++ b/dist/types/index.d.ts @@ -0,0 +1,36 @@ +import { NodePlopAPI } from "node-plop"; +import { FileNameFormatters } from "./types"; +export interface GeneratorConfig { + additionalTemplates: + | { + extension: string; + template: string; + }[] + | false; + choices: string[]; + createIndex: boolean; + createStyles: boolean; + functional: boolean; + basePath: string; + withClassnameInterfaceImportPath: string; + withStyleInterfaceImportPath: string; + tests: boolean; + stories: boolean; + styledComponents: boolean; + useNative: boolean; + useMacro: boolean; + templateIndex?: string; + templateStory?: string; + templateStyles?: string; + templateTest?: string; + templateComponentFunctional?: string; + templateComponentClassBased?: string; + typeFormatter?: FileNameFormatters; + fileNameFormatter?: FileNameFormatters; + dirNameFormatter?: FileNameFormatters; +} +declare const generator: ( + plop: NodePlopAPI, + config: Partial +) => void; +export default generator; diff --git a/dist/types/types.d.ts b/dist/types/types.d.ts new file mode 100644 index 0000000..a8cd1b1 --- /dev/null +++ b/dist/types/types.d.ts @@ -0,0 +1,7 @@ +export declare enum FileNameFormatters { + "pascalCase" = "pascalCase", + "camelCase" = "camelCase", + "kebabCase" = "kebabCase", + "snakeCase" = "snakeCase", + "lowerCase" = "lowerCase", +}