feat(va-config): i18n config

epicmaxco · May 1, 2023 · 54a1447 · 54a1447
1 parent 3e2462a
commit 54a1447
Show file tree

Hide file tree

Showing 5 changed files with 30 additions and 28 deletions.
diff --git a/packages/ui/src/components/va-config/VaConfig.demo.vue b/packages/ui/src/components/va-config/VaConfig.demo.vue
@@ -82,6 +82,14 @@
  <div style="background-color: var(--va-primary); color: var(--va-on-primary);">CSS variables</div>
  </va-config>
  </VbCard>
+
+ <VbCard title="i18n">
+ <va-config :i18n="{
+ dropzone: 'Завантажити файл',
+ }">
+ <va-file-upload dropzone />
+ </va-config>
+ </VbCard>
  </VbDemo>
 </template>
 
@@ -94,6 +102,7 @@ import { VaRating } from '../va-rating/'
 import { VaChip } from '../va-chip'
 import { VaConfig } from './'
 import { VaColorInput } from '../va-color-input/'
+import { VaFileUpload } from '../va-file-upload'
 
 export default {
  components: {
@@ -102,6 +111,7 @@ export default {
  VaConfig,
  VaChip,
  VaColorInput,
+ VaFileUpload,
  },
  data () {
  return {

diff --git a/packages/ui/src/components/va-config/VaConfig.vue b/packages/ui/src/components/va-config/VaConfig.vue
@@ -40,6 +40,7 @@ export default defineComponent({
  ...useComponentPresetProp,
  components: { type: Object as PropType<ComponentConfig>, default: () => ({}) },
  colors: { type: Object as PropType<PartialGlobalConfig['colors']>, default: () => ({}) },
+ i18n: { type: Object as PropType<PartialGlobalConfig['i18n']>, default: () => ({}) },
  },
  inheritAttrs: false,
  setup (props) {
@@ -52,6 +53,7 @@ export default defineComponent({
  const newConfig = useGlobalConfigProvider(computed(() => {
  return {
  colors: props.colors,
+ i18n: props.i18n,
  }
  }))
 

diff --git a/packages/ui/src/components/va-config/hooks/useGlobalConfigProvider.ts b/packages/ui/src/components/va-config/hooks/useGlobalConfigProvider.ts
@@ -3,41 +3,25 @@ import cloneDeep from 'lodash/cloneDeep'
 import { provide, computed, Ref } from 'vue'
 import { useGlobalConfig } from '../../../composables'
 import { GLOBAL_CONFIG, GlobalConfig, GlobalConfigUpdater, PartialGlobalConfig } from '../../../services/global-config'
+import { makeColorsConfig } from '../../../services/color/config/make-config'
 
 export const useGlobalConfigProvider = (next: Ref<PartialGlobalConfig>) => {
- const { globalConfig } = useGlobalConfig()
+ const { globalConfig, mergeGlobalConfig, setGlobalConfig, getGlobalConfig } = useGlobalConfig()
 
  const nextChain = computed(() => {
  const gcCopy = cloneDeep(globalConfig.value)
  const compiledCopy: GlobalConfig = {
  ...gcCopy,
- colors: {
- ...gcCopy.colors,
- get variables () {
- return this.presets[this.currentPresetName]
- },
- set variables (value) {
- this.presets[this.currentPresetName] = value
- },
- },
+ colors: makeColorsConfig(gcCopy.colors),
  }
 
  return mergeDeep(compiledCopy, next.value) as GlobalConfig
  })
 
- const getGlobalConfig = (): GlobalConfig => nextChain.value
- const setGlobalConfig = (updater: GlobalConfig | GlobalConfigUpdater<GlobalConfig>) => {
- throw new Error('setGlobalConfig can not be used in VaConfig')
- }
-
- const mergeGlobalConfig = (updater: PartialGlobalConfig | GlobalConfigUpdater<PartialGlobalConfig>) => {
- throw new Error('mergeGlobalConfig can not be used in VaConfig')
- }
-
  provide(GLOBAL_CONFIG, {
- getGlobalConfig,
- setGlobalConfig,
  mergeGlobalConfig,
+ setGlobalConfig,
+ getGlobalConfig,
  globalConfig: nextChain,
  })
 

diff --git a/packages/ui/src/services/color/config/default.ts b/packages/ui/src/services/color/config/default.ts
@@ -1,13 +1,8 @@
 import type { ColorConfig } from '../types'
 import { presets } from '../presets'
+import { makeColorsConfig } from './make-config'
 
-export const getColorDefaultConfig = (): ColorConfig => ({
- get variables () {
- return this.presets[this.currentPresetName]
- },
- set variables (value) {
- this.presets[this.currentPresetName] = value
- },
+export const getColorDefaultConfig = (): ColorConfig => makeColorsConfig({
  threshold: 150,
  presets: {
  light: presets.light,

diff --git a/packages/ui/src/services/color/config/make-config.ts b/packages/ui/src/services/color/config/make-config.ts
@@ -0,0 +1,11 @@
+import { ColorConfig } from '../types'
+
+export const makeColorsConfig = (values: Omit<ColorConfig, 'variables'>): ColorConfig => ({
+ get variables () {
+ return this.presets[this.currentPresetName]
+ },
+ set variables (value) {
+ this.presets[this.currentPresetName] = value
+ },
+ ...values,
+})