Merge pull request #32 from chakra-ui/chore/upgrade-system-package

chore: upgrade system package

Author: codebender828

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

@@ -39,7 +39,7 @@ to: packages/<%=h.changeCase.paramCase(name)%>/package.json
     "watch:types": "cross-env tsc --emitDeclarationOnly --declaration --declarationDir dist/types --watch --incremental"
   },
   "dependencies": {
-    "@chakra-ui/styled-system": "^1.4.1",
+    "@chakra-ui/styled-system": "^1.9.0",
     "@chakra-ui/vue-system": "*",
     "@chakra-ui/vue-utils": "*"
   },

package.json

@@ -102,7 +102,7 @@
     "vue-router": "4.0.0-beta.10"
   },
   "dependencies": {
-    "@chakra-ui/styled-system": "^1.4.1",
+    "@chakra-ui/styled-system": "^1.9.0",
     "@emotion/css": "^11.1.3",
     "@emotion/server": "^11.0.0",
     "@popperjs/core": "^2.8.4",

packages/c-alert/package.json

@@ -2,7 +2,6 @@
   "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,9 +23,16 @@
     "watch:types": "cross-env tsc --emitDeclarationOnly --declaration --declarationDir dist/types --watch --incremental"
   },
   "dependencies": {
-    "@chakra-ui/styled-system": "^1.4.1",
     "@chakra-ui/vue-system": "*",
     "@chakra-ui/vue-utils": "*",
     "@chakra-ui/c-icon": "*"
+  },
+  "devDependencies": {
+    "@chakra-ui/vue-system": "*",
+    "vue": "^3.0.5"
+  },
+  "peerDependencies": {
+    "@chakra-ui/vue-system": "*",
+    "vue": "^3.0.5"
   }
 }

packages/c-alert/src/alert.ts

@@ -9,7 +9,7 @@ import {
   StylesProvider,
   DOMElements,
 } from '@chakra-ui/vue-system'
-import { SystemStyleObject } from '@chakra-ui/styled-system'
+import { SystemStyleObject } from '@chakra-ui/vue-system'
 import { createContext } from '@chakra-ui/vue-utils'
 import { CIcon } from '@chakra-ui/c-icon'
 

packages/c-alert/tests/__snapshots__/c-alert.test.ts.snap

@@ -3,12 +3,12 @@
 exports[`should render all children 1`] = `
 <DocumentFragment>
   <div
-    class="chakra-alert css-wtzaz1"
+    class="chakra-alert css-mt4tyf"
     data-testid="alert"
     role="alert"
   >
     <svg
-      class="alert__icon chakra-icon css-139yi2r"
+      class="alert__icon chakra-icon css-1bwzgwf"
       focusable="false"
       viewBox="0 0 24 24"
     >
@@ -48,12 +48,12 @@ exports[`should render all children 1`] = `
   
     </svg>
     <div
-      class="chakra-alert__title css-14esyki"
+      class="chakra-alert__title css-1x7s9vs"
     >
        Info alert 
     </div>
     <div
-      class="chakra-alert__description css-5le3e4"
+      class="chakra-alert__description css-1xfoiaz"
     >
        Something just happened 
     </div>
@@ -64,7 +64,7 @@ exports[`should render all children 1`] = `
 exports[`should render properly 1`] = `
 <DocumentFragment>
   <div
-    class="chakra-alert css-15689h3"
+    class="chakra-alert css-e32ira"
     role="alert"
   />
 </DocumentFragment>

packages/c-badge/package.json

@@ -35,11 +35,15 @@
     "watch:types": "cross-env tsc --emitDeclarationOnly --declaration --declarationDir dist/types --watch --incremental"
   },
   "dependencies": {
-    "@chakra-ui/styled-system": "^1.4.1",
     "@chakra-ui/vue-system": "*",
     "@chakra-ui/vue-utils": "*"
   },
+  "devDependencies": {
+    "@chakra-ui/vue-system": "*",
+    "vue": "^3.0.5"
+  },
   "peerDependencies": {
-    "vue": ">=3.0.5"
+    "@chakra-ui/vue-system": "*",
+    "vue": "^3.0.5"
   }
 }

packages/c-badge/tests/__snapshots__/c-badge.test.ts.snap

@@ -3,7 +3,7 @@
 exports[`should render properly 1`] = `
 <DocumentFragment>
   <div
-    class="css-2q4iwi"
+    class="css-1f1oimr"
   >
     New !
   </div>

packages/c-button/package.json

@@ -23,10 +23,17 @@
     "watch:types": "cross-env tsc --emitDeclarationOnly --declaration --declarationDir dist/types --watch --incremental"
   },
   "dependencies": {
-    "@chakra-ui/styled-system": "^1.4.1",
     "@chakra-ui/vue-system": "*",
     "@chakra-ui/vue-utils": "*",
     "@chakra-ui/c-icon": "*",
     "@chakra-ui/c-spinner": "*"
+  },
+  "devDependencies": {
+    "@chakra-ui/vue-system": "*",
+    "vue": "^3.0.5"
+  },
+  "peerDependencies": {
+    "@chakra-ui/vue-system": "*",
+    "vue": "^3.0.5"
   }
 }

packages/c-button/src/button.ts

@@ -1,6 +1,10 @@
 import { defineComponent, PropType, computed, cloneVNode, h } from 'vue'
-import { chakra, useStyleConfig, ThemingProps } from '@chakra-ui/vue-system'
-import { SystemStyleObject } from '@chakra-ui/styled-system'
+import {
+  chakra,
+  useStyleConfig,
+  ThemingProps,
+  SystemStyleObject,
+} from '@chakra-ui/vue-system'
 import { dataAttr, filterUndefined, mergeWith } from '@chakra-ui/vue-utils'
 import { useButtonGroup } from './button-group'
 import { CIcon } from '@chakra-ui/c-icon'
@@ -114,7 +118,9 @@ const CButton = defineComponent({
           label: 'button',
         }),
         {
-          disabled: props.isDisabled || props.isLoading,
+          ...((props.isDisabled || props.isLoading) && {
+            disabled: props.isDisabled || props.isLoading,
+          }),
           type: props.as === 'button' ? undefined : props.type,
           dataActive: dataAttr(props.isActive),
           dataLoading: dataAttr(props.isLoading),

packages/c-button/tests/__snapshots__/c-button-group.test.ts.snap

@@ -3,19 +3,19 @@
 exports[`should render properly 1`] = `
 <DocumentFragment>
   <div
-    class="chakra-button__group css-p4lcqj"
+    class="chakra-button__group css-v5zn0n"
     role="group"
   >
     <button
-      class="chakra-button css-byqix5"
+      class="chakra-button css-1bczd7i"
     >
       <!---->
       <!---->
       Save
       <!---->
     </button>
     <button
-      class="chakra-button css-1twjehy"
+      class="chakra-button css-1rwqev2"
     >
       <!---->
       <!---->