Merge pull request #267 from chakra-ui/fix/vue-system

fix(system): fix ambiguous export

Author: codebender828

@types/components.d.ts

@@ -6,7 +6,7 @@
  *
  * This is a generated file. Do not edit it's contents.
  *
- * This file was generated on 2023-02-18T03:42:38.183Z
+ * This file was generated on 2023-02-19T13:06:33.516Z
  */
 
 import { ChakraProps, chakra } from "@chakra-ui/vue-system"

components.d.ts

@@ -6,7 +6,7 @@
  *
  * This is a generated file. Do not edit it's contents.
  *
- * This file was generated on 2023-02-18T03:42:38.183Z
+ * This file was generated on 2023-02-19T13:06:33.516Z
  */
 
 import { ChakraProps, chakra } from "@chakra-ui/vue-system"

packages/c-accordion/package.json

@@ -32,6 +32,7 @@
     "@chakra-ui/vue-system": "workspace:*",
     "@chakra-ui/vue-utils": "workspace:*",
     "@zag-js/accordion": "0.2.11",
+    "@chakra-ui/styled-system": "2.5.1",
     "@zag-js/vue": "^0.2.9"
   },
   "peerDependencies": {

packages/c-accordion/src/accordion.tsx

@@ -6,10 +6,10 @@ import {
   DOMElements,
   StylesProvider,
   HTMLChakraProps,
-  ThemingProps,
   useMultiStyleConfig,
   useStyles,
 } from "@chakra-ui/vue-system"
+
 import { useId } from "@chakra-ui/vue-composables"
 import {
   createContext,
@@ -19,7 +19,7 @@ import {
   vueThemingProps,
 } from "@chakra-ui/vue-utils"
 import { filterUndefined, mergeWith } from "@chakra-ui/utils"
-import { SystemStyleObject } from "@chakra-ui/styled-system"
+import { SystemStyleObject, ThemingProps } from "@chakra-ui/styled-system"
 import { CCollapse } from "@chakra-ui/c-motion"
 import { CIcon } from "@chakra-ui/c-icon"
 

packages/c-alert/package.json

@@ -25,6 +25,7 @@
     "build:types": "tsup src --dts-only"
   },
   "dependencies": {
+    "@chakra-ui/styled-system": "2.5.1",
     "@chakra-ui/c-icon": "workspace:*",
     "@chakra-ui/vue-system": "workspace:*",
     "@chakra-ui/vue-utils": "workspace:*"

packages/c-alert/src/alert.tsx

@@ -8,12 +8,11 @@ import {
 } from "vue"
 import {
   chakra,
-  ThemingProps,
   useMultiStyleConfig,
   createStylesContext,
   DOMElements,
-  SystemStyleObject,
 } from "@chakra-ui/vue-system"
+import { ThemingProps, SystemStyleObject } from "@chakra-ui/styled-system"
 import { createContext, getValidChildren } from "@chakra-ui/vue-utils"
 import { CCheckIcon, CErrorIcon, CInfoIcon, CWarningIcon } from "./icons"
 

packages/c-avatar/src/c-avatar-group.tsx

@@ -2,8 +2,8 @@
 import {
   useMultiStyleConfig,
   chakra,
-  SystemStyleObject,
 } from "@chakra-ui/vue-system"
+import { SystemStyleObject } from "@chakra-ui/styled-system"
 import {
   getValidChildren,
   SNAO,

packages/c-avatar/src/c-avatar-image.tsx

@@ -10,7 +10,8 @@ import { CImageProps, useImage } from "@chakra-ui/c-image"
 import { SNAO } from "@chakra-ui/vue-utils"
 import { CAvatarName } from "./c-avatar-name"
 import { CDefaultAvatarIcon } from "./c-default-avatar-icon"
-import { chakra, SystemStyleObject } from "@chakra-ui/vue-system"
+import { chakra } from "@chakra-ui/vue-system"
+import { SystemStyleObject } from "@chakra-ui/styled-system"
 import { useAvatarContext } from "./c-avatar"
 
 export interface CAvatarImageProps extends Omit<CImageProps, "borderRadius"> {

packages/c-breadcrumb/src/c-breadcrumb.tsx

@@ -20,15 +20,13 @@ import {
 import {
   chakra,
   HTMLChakraProps,
-  SystemProps,
-  ThemingProps,
   StylesProvider,
   useMultiStyleConfig,
   useStyles,
-  SystemStyleObject,
   ChakraProps,
   ComponentWithProps,
 } from "@chakra-ui/vue-system"
+import { SystemProps, ThemingProps, SystemStyleObject } from "@chakra-ui/styled-system"
 import { filterUndefined } from "@chakra-ui/utils"
 import {
   getValidChildren,
@@ -58,8 +56,8 @@ export interface BreadcrumbOptions {
 
 export interface BreadcrumbProps
   extends ChakraProps,
-    BreadcrumbOptions,
-    ThemingProps<"Breadcrumb"> {}
+  BreadcrumbOptions,
+  ThemingProps<"Breadcrumb"> { }
 
 /**
  * CBreadcrumb is used to render a breadcrumb navigation landmark.
@@ -88,14 +86,14 @@ export const CBreadcrumb = defineComponent(
         return typeof props.separator === "string"
           ? props.separator
           : isObjectComponent(props.separator!)
-          ? // TODO:
+            ? // TODO:
             // Add support for
             // object components. ATM,
             // This computed property will only
             // work for functional components provided as
             // separators
             h(() => props.separator!)
-          : h(props.separator!)
+            : h(props.separator!)
       }
     })
 
@@ -199,7 +197,7 @@ interface BreadcrumbItemOptions extends BreadcrumbOptions {
 
 export interface BreadcrumbItemProps
   extends BreadcrumbItemOptions,
-    ChakraProps {}
+  ChakraProps { }
 
 export const CBreadcrumbItem = defineComponent(
   (props: BreadcrumbItemOptions, { attrs, slots }) => {

packages/c-button/package.json

@@ -29,7 +29,8 @@
     "@chakra-ui/c-spinner": "workspace:*",
     "@chakra-ui/utils": "2.0.15",
     "@chakra-ui/vue-system": "workspace:*",
-    "@chakra-ui/vue-utils": "workspace:*"
+    "@chakra-ui/vue-utils": "workspace:*",
+    "@chakra-ui/styled-system": "2.5.1"
   },
   "peerDependencies": {
     "vue": "3.2.47"