diff --git a/CHANGELOG.en-US.md b/CHANGELOG.en-US.md index 8e414a64e..0c7d8ca80 100644 --- a/CHANGELOG.en-US.md +++ b/CHANGELOG.en-US.md @@ -24,6 +24,7 @@ - Fix `n-select` focus input when closing tag with `filterable` , closes [#1170](https://github.com/TuSimple/naive-ui/issues/1170). - Fix `n-button` border on hover conflicts with `n-badge`, closes [#1195](https://github.com/TuSimple/naive-ui/issues/1195). - Fix `n-upload` prop `v-model:file-list` dosen't work well when prop `multiple` is `true`, closes [#418](https://github.com/TuSimple/naive-ui/issues/418). +- Fix `useThemeVars` doesn't apply theme overrides, closes [#1194](https://github.com/TuSimple/naive-ui/issues/1194), [#1176](https://github.com/TuSimple/naive-ui/issues/1176). ## 2.18.2 (2021-09-14) diff --git a/CHANGELOG.zh-CN.md b/CHANGELOG.zh-CN.md index 08c9e5c3b..13bd68658 100644 --- a/CHANGELOG.zh-CN.md +++ b/CHANGELOG.zh-CN.md @@ -24,6 +24,7 @@ - 修复 `n-select` `filterable` 下关闭标签 input 光标聚焦问题,关闭 [#1170](https://github.com/TuSimple/naive-ui/issues/1170) - 修复 `n-button` 在 hover 状态下边框与 `n-badge` 冲突,关闭 [#1195](https://github.com/TuSimple/naive-ui/issues/1195) - 修复 `n-upload` 的 `v-model:file-list` 属性在 `multiple` 属性设为 `true` 的时候没有正确更新,关闭 [#418](https://github.com/TuSimple/naive-ui/issues/418) +- 修复 `useThemeVars` 未应用覆盖的变量值,关闭 [#1194](https://github.com/TuSimple/naive-ui/issues/1194), [#1176](https://github.com/TuSimple/naive-ui/issues/1176) ## 2.18.2 (2021-09-14) diff --git a/src/composables/use-theme-vars.ts b/src/composables/use-theme-vars.ts index 20e06d117..6bde443ae 100644 --- a/src/composables/use-theme-vars.ts +++ b/src/composables/use-theme-vars.ts @@ -8,13 +8,14 @@ export function useThemeVars (): ComputedRef { const configProviderInjection = inject(configProviderInjectionKey, null) if (configProviderInjection === null) return commonLight const { - mergedThemeRef: { value: mergedTheme } + mergedThemeRef: { value: mergedTheme }, + mergedThemeOverridesRef: { value: mergedThemeOverrides } } = configProviderInjection - if (mergedTheme) { - const { common } = mergedTheme - return common || commonLight + const currentThemeVars = mergedTheme?.common || commonLight + if (mergedThemeOverrides?.common) { + return Object.assign({}, currentThemeVars, mergedThemeOverrides.common) } else { - return commonLight + return currentThemeVars } }) }