feat: improve template generation

Author: codebender828

_templates/generator/component/README.md.ejs.t

@@ -0,0 +1,15 @@
+---
+to: packages/<%=h.changeCase.paramCase(name)%>/README.md
+---
+
+# @chakra-ui/<%=h.changeCase.paramCase(name)%>
+
+<%=h.changeCase.sentence(description)%>
+
+## Installation
+
+```sh
+yarn add @chakra-ui/<%=h.changeCase.paramCase(name)%>
+# or
+npm i @chakra-ui/<%=h.changeCase.paramCase(name)%>
+```

_templates/generator/component/component.ts.ejs.t

@@ -4,7 +4,7 @@ to: packages/<%=h.changeCase.paramCase(name)%>/src/index.ts
 
 import { h, defineComponent, PropType } from 'vue'
 
-const <%= h.changeCase.pascalCase(name) %> = defineComponent({
+export const <%= h.changeCase.pascalCase(name) %> = defineComponent({
   props: {
     as: {
       type: Object as PropType<string>,
@@ -15,5 +15,3 @@ const <%= h.changeCase.pascalCase(name) %> = defineComponent({
     return h(props?.as, { ...attrs }, slots.default?.())
   },
 })
-
-export default <%= h.changeCase.pascalCase(name) %>

_templates/generator/component/package.json.ejs.t

@@ -4,18 +4,35 @@ to: packages/<%=h.changeCase.paramCase(name)%>/package.json
 
 {
   "name": "<%= '@chakra-ui/' + h.changeCase.paramCase(name)%>",
+  "description": "<%= 'Chakra UI Vue | ' + h.changeCase.sentence(description) + ' component'%>",
   "version": "1.0.0",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
   "typings": "dist/types/index.d.ts",
+  "author": "Jonathan Bakebwa <codebender828@gmail.com>",
+  "homepage": "https://github.com/chakra-ui/chakra-ui-vue-next#readme",
+  "license": "MIT",
   "files": [
     "dist"
   ],
-  "description": "<%= 'Chakra UI Vue | ' + h.changeCase.pascalCase(name) + ' component'%>",
-  "repository": "https://github.com/chakra-ui/chakra-ui-vue-next.git",
-  "author": "Jonathan Bakebwa [email protected]",
-  "license": "MIT",
+  "exports": {
+    ".": {
+      "require": "./dist/cjs/index.js",
+      "default": "./dist/esm/index.js"
+    }
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/chakra-ui/chakra-ui-vue-next.git"
+  },
+  "bugs": {
+    "url": "https://github.com/chakra-ui/chakra-ui=vue-next/issues"
+  },
+  "sideEffects": false,
   "scripts": {
     "build": "concurrently yarn:build:*",
     "build:esm": "cross-env BABEL_ENV=esm babel src --root-mode upward --extensions .ts -d dist/esm --source-maps",
@@ -25,5 +42,13 @@ to: packages/<%=h.changeCase.paramCase(name)%>/package.json
     "watch:esm": "cross-env BABEL_ENV=esm babel src --root-mode upward --extensions .ts -d dist/esm --source-maps --watch",
     "watch:cjs": "cross-env BABEL_ENV=cjs babel src --root-mode upward --extensions .ts -d dist/cjs --source-maps --watch",
     "watch:types": "tsc --emitDeclarationOnly --declaration --declarationDir dist/types --watch"
+  },
+  "dependencies": {
+    "@chakra-ui/styled-system": "^1.4.1",
+    "@chakra-ui/vue-system": "*",
+    "@chakra-ui/vue-utils": "*"
+  },
+  "peerDependencies": {
+    "vue": ">=3.0.5"
   }
 }

_templates/generator/component/test-file.test.ts.ejs.t

@@ -2,10 +2,9 @@
 to: packages/<%=h.changeCase.paramCase(name)%>/tests/<%=h.changeCase.paramCase(name)%>.test.ts
 ---
 import { render } from '../../test-utils/src'
-import <%= h.changeCase.pascalCase(name) %> from '../'
-
+import { <%= h.changeCase.pascalCase(name) %> } from '../src'
 
 it('should render properly', () => {
-  const { html } = render(<%= h.changeCase.pascalCase(name) %>)
-  expect(html()).toMatchSnapshot()
+  const { asFragment } = render(<%= h.changeCase.pascalCase(name) %>)
+  expect(asFragment()).toMatchSnapshot()
 })

package.json

@@ -23,7 +23,8 @@
     "c-theme-provider": "yarn workspace @chakra-ui/c-theme-provider",
     "c-box": "yarn workspace @chakra-ui/c-box",
     "c-button": "yarn workspace @chakra-ui/c-button",
-    "system": "yarn workspace @chakra-ui/system-vue",
+    "c-icon": "yarn workspace @chakra-ui/c-icon",
+    "system": "yarn workspace @chakra-ui/vue-system",
     "theme": "yarn workspace @chakra-ui/vue-theme",
     "nuxt": "yarn workspace @chakra-ui/nuxt-next",
     "test-utils": "yarn workspace @chakra-ui/vue-test-utils"
@@ -62,6 +63,7 @@
     "eslint-plugin-promise": "^4.2.1",
     "eslint-plugin-standard": "^4.0.1",
     "eslint-plugin-vue": "^7.0.0",
+    "feather-icons-paths": "^1.0.8",
     "fs-extra": "^9.0.1",
     "husky": "^4.3.8",
     "hygen": "^6.0.4",

packages/c-accordion/package.json

@@ -19,6 +19,6 @@
     "build:types": "tsc --emitDeclarationOnly --declaration --declarationDir dist/types"
   },
   "dependencies": {
-    "@chakra-ui/system-vue": "1.0.0"
+    "@chakra-ui/vue-system": "1.0.0"
   }
 }

packages/c-accordion/src/index.ts

@@ -1,5 +1,5 @@
 import { h, defineComponent, PropType } from 'vue'
-import { chakra, DOMElements } from '@chakra-ui/system-vue'
+import { chakra, DOMElements } from '@chakra-ui/vue-system'
 
 const CAccordion = defineComponent({
   props: {

packages/c-alert/package.json

@@ -2,6 +2,7 @@
   "name": "@chakra-ui/c-alert",
   "version": "1.0.0",
   "main": "dist/cjs/index.js",
+  
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
   "typings": "dist/types/index.d.ts",
@@ -24,7 +25,6 @@
   },
   "dependencies": {
     "@chakra-ui/styled-system": "^1.4.1",
-    "@chakra-ui/system-vue": "1.0.0",
-    "@chakra-ui/vue-theme": "^1.0.0"
+    "@chakra-ui/vue-system": "1.0.0"
   }
 }

packages/c-alert/src/alert.ts

@@ -8,7 +8,7 @@ import {
   provideComponentStyles,
   useComponentStyles,
   DOMElements,
-} from '@chakra-ui/system-vue'
+} from '@chakra-ui/vue-system'
 import { SystemStyleObject } from '@chakra-ui/styled-system'
 
 const STATUSES = {

packages/c-button/package.json

@@ -19,6 +19,6 @@
     "build:types": "tsc --emitDeclarationOnly --declaration --declarationDir dist/types"
   },
   "dependencies": {
-    "@chakra-ui/system-vue": "1.0.0"
+    "@chakra-ui/vue-system": "1.0.0"
   }
 }