Skip to content
This repository was archived by the owner on Sep 20, 2024. It is now read-only.

Commit 8579b16

Browse files
committed
fix: import utils from vue package
1 parent 0bcb97e commit 8579b16

File tree

2 files changed

+7
-23
lines changed

2 files changed

+7
-23
lines changed

packages/system/src/chakra.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ import { css as _css, CSSObject } from '@emotion/css'
2323
import { extractStyleAttrs } from './system.attrs'
2424
import { domElements, DOMElements } from './system.utils'
2525
import { useTheme } from './composables/use-chakra'
26-
import { Theme } from '@chakra-ui/vue-theme'
26+
// import { Theme } from '@chakra-ui/vue-theme'
2727

2828
interface StyleResolverProps extends SystemProps {
2929
__css?: SystemStyleObject
@@ -45,7 +45,7 @@ interface StyleResolverProps extends SystemProps {
4545

4646
interface StyleResolverOptions extends StyleResolverProps {
4747
truncateStyle?: CSSObject
48-
theme?: Theme
48+
theme?: any
4949
}
5050

5151
interface ChakraFactoryOptions extends StyleResolverProps {}
@@ -149,7 +149,7 @@ export const chakra: IChakraFactory = (
149149
...rest,
150150
})
151151

152-
const theme = useTheme() as Theme
152+
const theme = useTheme()
153153

154154
const layerStyle$ = computed(
155155
() => props.layerStyle || options?.layerStyle

packages/system/src/composables/use-chakra.ts

Lines changed: 4 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,13 @@
1-
import { ColorMode, Theme } from '@chakra-ui/vue-theme'
1+
import { useColorMode } from '@chakra-ui/c-color-mode'
22
import { inject, ref } from 'vue'
3+
import { Dict } from '@chakra-ui/vue-utils'
34

45
/** Provides theme object in component context */
5-
export const useTheme = (): Theme => {
6-
const theme = inject('$chakraTheme') as Theme
6+
export const useTheme = <T extends object = Dict>(): T => {
7+
const theme = inject('$chakraTheme') as T
78
return theme
89
}
910

10-
/** Injects color mode into component instance */
11-
export const useColorMode = () => {
12-
const _colorMode = inject('$chakraColorMode') as ColorMode
13-
const colorMode = ref(_colorMode)
14-
15-
const toggleColorMode = () => {
16-
colorMode.value = 'light'
17-
? (colorMode.value = 'dark')
18-
: (colorMode.value = 'light')
19-
}
20-
21-
return {
22-
colorMode,
23-
toggleColorMode,
24-
}
25-
}
26-
2711
/** Single hook to provide theme and color mode values */
2812
export const useChakra = () => {
2913
const theme = useTheme()

0 commit comments

Comments
 (0)