Skip to content

Commit

Permalink
fix(components,theme): apply @meriouma suggestions
Browse files Browse the repository at this point in the history
  • Loading branch information
mmorin-equisoft committed Mar 15, 2024
1 parent 5f30de2 commit 2404270
Show file tree
Hide file tree
Showing 7 changed files with 21 additions and 21 deletions.
2 changes: 1 addition & 1 deletion packages/react/src/components/legend/legend.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ const Item = styled.li<Pick<LegendItem, 'color'>>`
}
::before {
background-color: ${({ color, theme }) => color || theme.component['legend-item-bullet-background-color']};
background-color: ${({ color, theme }) => color || theme.component['legend-item-bullet-color']};
border-radius: 50%;
content: '';
height: var(--size-half);
Expand Down
2 changes: 1 addition & 1 deletion packages/react/src/components/progress-indicator/bar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const Container = styled.div`
`;

const Progress = styled.div`
background-color: ${({ theme }) => theme.component['progress-indicator-background-color']};
background-color: ${({ theme }) => theme.component['progress-indicator-track-color']};
border-radius: var(--border-radius);
height: 0.5rem;
margin-bottom: var(--spacing-half);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -96,7 +96,7 @@ const CompletedStep = styled(StyledStep)`
}
${Label} {
color: ${({ theme }) => theme.component['progress-tracker-step-label-completed-text-color']};
color: ${({ theme }) => theme.component['progress-tracker-step-completed-label-text-color']};
}
`;

Expand All @@ -118,7 +118,7 @@ const ActiveStep = styled(StyledStep)`
}
${Label} {
color: ${({ theme }) => theme.component['progress-tracker-step-label-active-text-color']};
color: ${({ theme }) => theme.component['progress-tracker-step-active-label-text-color']};
font-weight: var(--font-semi-bold);
}
`;
Expand All @@ -130,7 +130,7 @@ const UncompletedStep = styled(StyledStep)`
}
${Label} {
color: ${({ theme }) => theme.component['progress-tracker-step-label-uncompleted-text-color']};
color: ${({ theme }) => theme.component['progress-tracker-step-uncompleted-label-text-color']};
}
`;

Expand Down
12 changes: 6 additions & 6 deletions packages/react/src/components/status/status.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,11 @@ import { ResolvedTheme } from '../../themes/theme';

export type StatusType = 'enabled' | 'disabled' | 'blocked';

function getCircleBorderStyle(props: {theme: ResolvedTheme, type: StatusType}): string {
const { theme, type } = props;
return `border: ${type === 'disabled'
? `1px solid ${theme.component['status-circle-disabled-border-color']}`
: 'none'}`;
function getCircleBorderStyle({ theme, type }: {theme: ResolvedTheme, type: StatusType}): string {
if (type === 'disabled') {
return `1px solid ${theme.component['status-circle-disabled-border-color']}`;
}
return 'none'
}

Check failure on line 12 in packages/react/src/components/status/status.tsx

View workflow job for this annotation

GitHub Actions / React: ESLint

ESLint results

Missing semicolon.

const Wrapper = styled.div<{ type: StatusType }>`
Expand All @@ -19,7 +19,7 @@ const Wrapper = styled.div<{ type: StatusType }>`

const Circle = styled.div<{ type: StatusType }>`
background-color: ${({ theme, type }) => theme.component[`status-circle-${type}-background-color`]};
${getCircleBorderStyle};
border: ${getCircleBorderStyle};
border-radius: 50%;
box-sizing: border-box;
height: 0.625rem;
Expand Down
4 changes: 2 additions & 2 deletions packages/react/src/themes/tokens/component/legend-tokens.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { AliasTokens } from '../alias-tokens';
import { RefTokens } from '../ref-tokens';

export type LegendTokens =
| 'legend-item-bullet-background-color'
| 'legend-item-bullet-color'
| 'legend-item-description-text-color'

export type LegendTokenValue = AliasTokens | RefTokens;
Expand All @@ -12,6 +12,6 @@ export type LegendTokenMap = {
};

export const defaultLegendTokens: LegendTokenMap = {
'legend-item-bullet-background-color': 'color-brand-20',
'legend-item-bullet-color': 'color-brand-20',
'legend-item-description-text-color': 'color-neutral-65',
};
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { AliasTokens } from '../alias-tokens';
import { RefTokens } from '../ref-tokens';

export type ProgressIndicatorTokens =
| 'progress-indicator-background-color'
| 'progress-indicator-track-color'
| 'progress-indicator-label-text-color'

export type ProgressIndicatorTokenValue = AliasTokens | RefTokens;
Expand All @@ -12,6 +12,6 @@ export type ProgressIndicatorTokenMap = {
};

export const defaultProgressIndicatorTokens: ProgressIndicatorTokenMap = {
'progress-indicator-background-color': 'color-neutral-15',
'progress-indicator-track-color': 'color-neutral-15',
'progress-indicator-label-text-color': 'color-black',
};
Original file line number Diff line number Diff line change
Expand Up @@ -9,16 +9,16 @@ export type ProgressTrackerTokens =
| 'progress-tracker-step-todo-background-color'
| 'progress-tracker-step-uncompleted-border-color'
| 'progress-tracker-step-uncompleted-text-color'
| 'progress-tracker-step-label-uncompleted-text-color'
| 'progress-tracker-step-uncompleted-label-text-color'
| 'progress-tracker-bridge-active-background-color'
| 'progress-tracker-step-active-border-color'
| 'progress-tracker-step-active-text-color'
| 'progress-tracker-step-label-active-text-color'
| 'progress-tracker-step-active-label-text-color'
| 'progress-tracker-bridge-completed-color'
| 'progress-tracker-step-completed-background-color'
| 'progress-tracker-step-completed-border-color'
| 'progress-tracker-step-completed-text-color'
| 'progress-tracker-step-label-completed-text-color'
| 'progress-tracker-step-completed-label-text-color'

export type ProgressTrackerTokenValue = AliasTokens | RefTokens;

Expand All @@ -36,16 +36,16 @@ export const defaultProgressTrackerTokens: ProgressTrackerTokenMap = {
// Uncompleted
'progress-tracker-step-uncompleted-border-color': 'color-neutral-30',
'progress-tracker-step-uncompleted-text-color': 'color-neutral-90',
'progress-tracker-step-label-uncompleted-text-color': 'color-neutral-65',
'progress-tracker-step-uncompleted-label-text-color': 'color-neutral-65',
// Active
'progress-tracker-bridge-active-background-color': 'color-brand-50',
'progress-tracker-step-active-border-color': 'color-brand-50',
'progress-tracker-step-active-text-color': 'color-brand-70',
'progress-tracker-step-label-active-text-color': 'color-brand-70',
'progress-tracker-step-active-label-text-color': 'color-brand-70',
// Completed
'progress-tracker-bridge-completed-color': 'color-brand-50',
'progress-tracker-step-completed-background-color': 'color-brand-50',
'progress-tracker-step-completed-border-color': 'color-brand-50',
'progress-tracker-step-completed-text-color': 'color-white',
'progress-tracker-step-label-completed-text-color': 'color-brand-50',
'progress-tracker-step-completed-label-text-color': 'color-brand-50',
};

0 comments on commit 2404270

Please sign in to comment.