diff --git a/apps/website/screens/guidelines/localization/examples/localization.tsx b/apps/website/screens/guidelines/localization/examples/localization.tsx index f15d3daf0..9475e15ca 100644 --- a/apps/website/screens/guidelines/localization/examples/localization.tsx +++ b/apps/website/screens/guidelines/localization/examples/localization.tsx @@ -14,7 +14,7 @@ const labels = { { /> diff --git a/packages/lib/src/HalstackContext.tsx b/packages/lib/src/HalstackContext.tsx index 5b61dd31b..5b67ff425 100644 --- a/packages/lib/src/HalstackContext.tsx +++ b/packages/lib/src/HalstackContext.tsx @@ -20,17 +20,16 @@ const HalstackLanguageContext = createContext({ labels: defaul const HalstackLogosContext = createContext>(defaultThemedLogos); const parseLabels = (labels: DeepPartial): TranslatedLabels => { - const parsedLabels = defaultTranslatedComponentLabels; + const parsedLabels = { ...defaultTranslatedComponentLabels }; (Object.keys(labels) as (keyof TranslatedLabels)[]).forEach((component) => { - if (parsedLabels[component]) { - const componentLabels = labels[component]; - if (componentLabels != null) { - (Object.keys(parsedLabels[component]) as (keyof typeof componentLabels)[]).forEach((label) => { - if (componentLabels[label]) { - parsedLabels[component][label] = componentLabels[label]; - } - }); - } + const componentLabels = labels[component]; + if (componentLabels != null) { + Object.assign(parsedLabels, { + [component]: { + ...parsedLabels[component], + ...componentLabels, + }, + }); } }); return parsedLabels; @@ -49,9 +48,11 @@ const HalstackThemed = styled.div<{ coreTheme?: ThemeType["tokens"] }>` ${(props) => { if (props.coreTheme) return css` - ${Object.keys(props.coreTheme).length - ? Object.entries(props.coreTheme).map(([key, val]) => `${key}: ${val};`) - : coreTokens} + ${ + Object.keys(props.coreTheme).length + ? Object.entries(props.coreTheme).map(([key, val]) => `${key}: ${val};`) + : coreTokens + } ${aliasTokens} `; else {