From c51fb4aeb48f380028bd1073da8dcaa0db365ffe Mon Sep 17 00:00:00 2001 From: 8845musign Date: Thu, 14 Mar 2024 10:25:32 +0900 Subject: [PATCH 1/3] add generate example command Signed-off-by: 8845musign --- package.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index 8ca254e..58d793f 100644 --- a/package.json +++ b/package.json @@ -15,7 +15,8 @@ "lint:css:fix": "stylelint --fix src/**/*.{astro,module.css,css}", "prettier:astro": "prettier --write src/**/*.astro", "script:extract-icon-names": "node ./scripts/extractIconNames.js", - "test": "vitest" + "test": "vitest", + "generate:example": "scaffdog generate example" }, "dependencies": { "@astrojs/check": "^0.3.1", From 48c7b8c19f2bb6f39d771f350ce84f75c8b84542 Mon Sep 17 00:00:00 2001 From: 8845musign Date: Thu, 14 Mar 2024 12:01:23 +0900 Subject: [PATCH 2/3] add scaffold of component page Signed-off-by: 8845musign --- .scaffdog/example.md | 2 +- .scaffdog/pageComponent.md | 58 +++++++++++++++++++ README.md | 23 +++++++- package.json | 1 + .../images/components/thumbnail-default.svg | 8 +++ 5 files changed, 90 insertions(+), 2 deletions(-) create mode 100644 .scaffdog/pageComponent.md create mode 100644 public/assets/images/components/thumbnail-default.svg diff --git a/.scaffdog/example.md b/.scaffdog/example.md index 6b39e79..4f67c30 100644 --- a/.scaffdog/example.md +++ b/.scaffdog/example.md @@ -27,7 +27,7 @@ export default {{ inputs.exampleName | pascal }}; # `src/pages/components/examples/{{ inputs.exampleKey }}/{{ inputs.exampleName }}.astro` -```typescript +```astro --- import ExampleLayout from '@layouts/ExampleLayout.astro'; import {{ inputs.exampleName | pascal }} from '@components/react/examples/{{ inputs.exampleKey }}/{{ inputs.exampleName | pascal }}'; diff --git a/.scaffdog/pageComponent.md b/.scaffdog/pageComponent.md new file mode 100644 index 0000000..daaad82 --- /dev/null +++ b/.scaffdog/pageComponent.md @@ -0,0 +1,58 @@ +--- +name: pageComponent +root: 'src' +output: '.' +ignore: [] +questions: + componentName: What is the component name (e.g., link-button)? +--- + +# `components/react/examples/{{ inputs.componentName }}/Default.tsx` + +```typescript +import { {{ inputs.componentName | pascal }} } from '@ubie/ubie-ui'; +import type { FC } from 'react'; + +export const DefaultExample: FC = () => { + return ( + <{{ inputs.componentName | pascal }} /> + ); +}; + +``` + +# `pages/components/examples/{{ inputs.componentName }}/default.astro` + +```astro +--- +import { DefaultExample } from '@components/react/examples/{{ inputs.componentName }}/Default'; +import ExampleLayout from '@layouts/ExampleLayout.astro'; +--- + + + + +``` + + + +# `pages/components/{{ inputs.componentName }}.mdx` + +```markdown +--- +title: '{{ inputs.componentName | pascal }}' +exampleKey: '{{ inputs.componentName }}' +layout: '@layouts/ComponentLayout.astro' +description: '' +thumbnail: '/assets/images/components/thumbnail-default.svg' +--- + +## Feature + +Describe the characteristics of the component. Describe the use cases to which it is applicable and how it differs from other components. + +## Usage + + Please describe the specific use of the product. Detailed notes on use, code example, etc. + +``` diff --git a/README.md b/README.md index 5437088..fd10cb5 100644 --- a/README.md +++ b/README.md @@ -12,4 +12,25 @@ npm ci ``` npm run dev -``` \ No newline at end of file +``` + +### Add Component Page + +``` +npm run generate:page:component +``` + +**src/components/react/examples/{component-name}/Default.tsx**: + +Implement the most basic example. + +**src/pages/components/tes-test.mdx**: + +- Replace thumbnail +- Describe the documentation + +### Add Component Example + +``` +npm run generate:example +``` diff --git a/package.json b/package.json index 58d793f..99e0138 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "prettier:astro": "prettier --write src/**/*.astro", "script:extract-icon-names": "node ./scripts/extractIconNames.js", "test": "vitest", + "generate:page:component": "scaffdog generate pageComponent", "generate:example": "scaffdog generate example" }, "dependencies": { diff --git a/public/assets/images/components/thumbnail-default.svg b/public/assets/images/components/thumbnail-default.svg new file mode 100644 index 0000000..ac4cd1d --- /dev/null +++ b/public/assets/images/components/thumbnail-default.svg @@ -0,0 +1,8 @@ + + + + + + + + From d6d9eb661328aeba445c183ec35d3d888a080590 Mon Sep 17 00:00:00 2001 From: 8845musign Date: Thu, 14 Mar 2024 12:03:48 +0900 Subject: [PATCH 3/3] Skip dir specification Signed-off-by: 8845musign --- .scaffdog/example.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/.scaffdog/example.md b/.scaffdog/example.md index 4f67c30..8e532ea 100644 --- a/.scaffdog/example.md +++ b/.scaffdog/example.md @@ -1,14 +1,14 @@ --- name: example -root: '.' -output: '**/*' +root: 'src' +output: '.' ignore: [] questions: - exampleKey: What is the exampleKey (e.g., link-button)? - exampleName: What is the exampleName (e.g., with-icon)? + exampleKey: What is the component name (e.g., link-button)? + exampleName: What is the example name (e.g., with-icon)? --- -# `src/components/react/examples/{{ inputs.exampleKey }}/{{ inputs.exampleName | pascal }}.tsx` +# `components/react/examples/{{ inputs.exampleKey }}/{{ inputs.exampleName | pascal }}.tsx` ```typescript @@ -25,7 +25,7 @@ export default {{ inputs.exampleName | pascal }}; ``` -# `src/pages/components/examples/{{ inputs.exampleKey }}/{{ inputs.exampleName }}.astro` +# `pages/components/examples/{{ inputs.exampleKey }}/{{ inputs.exampleName }}.astro` ```astro ---