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 {