Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bugfix/ Fix missing Chips background and warning about unknown event handler property #219

Merged
merged 2 commits into from
Jan 5, 2021
Merged

Bugfix/ Fix missing Chips background and warning about unknown event handler property #219

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
76b0709
chips: fix missing semi colon leading to missing background when usin…
JBWatenbergScality Dec 30, 2020
1741ea7
chips: update snapshot test to reflect unknown event handler property…
JBWatenbergScality Dec 30, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions src/lib/components/chips/Chips.component.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -77,8 +77,8 @@ const ChipsContainer = styled.div`
${props => {
return css`
${props.variant === "warning"
? `color: ${defaultTheme.blackLight}`
: `color: ${defaultTheme.white}`}
? `color: ${defaultTheme.blackLight};`
: `color: ${defaultTheme.white};`}
`;
}}

Expand Down Expand Up @@ -116,7 +116,7 @@ export const ChipsText = styled.span`
display: inline-flex;
justify-content: center;
align-items: center;
padding: ${props => (props.icon || props.onRemove ? "5px" : "5px 10px")};
padding: ${props => (props.icon || props.isRemovable ? "5px" : "5px 10px")};
`;

const Chips = ({
Expand Down Expand Up @@ -144,7 +144,7 @@ const Chips = ({
{icon}
</ChipsIcon>
)}
<ChipsText className="sc-chips-text" icon={icon} onRemove={onRemove}>
<ChipsText className="sc-chips-text" icon={icon} isRemovable={!!onRemove}>
{text}
</ChipsText>
{onRemove && (
Expand Down
43 changes: 17 additions & 26 deletions src/lib/components/chips/__snapshots__/Chips.component.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ exports[`Storyshots Chips Default 1`] = `
Basic Chip
</h3>
<div
className="sc-htoDjs oAfeq sc-chips"
className="sc-htoDjs iGXwyJ sc-chips"
size="base"
>
<span
Expand All @@ -20,7 +20,7 @@ exports[`Storyshots Chips Default 1`] = `
</span>
</div>
<div
className="sc-htoDjs kwCbVz sc-chips"
className="sc-htoDjs knTkHh sc-chips"
size="base"
>
<span
Expand All @@ -30,7 +30,7 @@ exports[`Storyshots Chips Default 1`] = `
</span>
</div>
<div
className="sc-htoDjs gktCMn sc-chips"
className="sc-htoDjs gKfSCM sc-chips"
size="base"
>
<span
Expand All @@ -40,7 +40,7 @@ exports[`Storyshots Chips Default 1`] = `
</span>
</div>
<div
className="sc-htoDjs eqomIC sc-chips"
className="sc-htoDjs HpTIe sc-chips"
size="base"
>
<span
Expand All @@ -55,7 +55,7 @@ exports[`Storyshots Chips Default 1`] = `
Clickable Chip
</h3>
<div
className="sc-htoDjs jherpk sc-chips"
className="sc-htoDjs gvzZBe sc-chips"
onClick={[Function]}
size="base"
>
Expand All @@ -74,7 +74,7 @@ exports[`Storyshots Chips Default 1`] = `
</span>
</div>
<div
className="sc-htoDjs jLYxwU sc-chips"
className="sc-htoDjs hGrNJX sc-chips"
onClick={[Function]}
size="base"
>
Expand All @@ -93,7 +93,7 @@ exports[`Storyshots Chips Default 1`] = `
</span>
</div>
<div
className="sc-htoDjs jgKGle sc-chips"
className="sc-htoDjs cDOotG sc-chips"
onClick={[Function]}
size="base"
>
Expand All @@ -112,7 +112,7 @@ exports[`Storyshots Chips Default 1`] = `
</span>
</div>
<div
className="sc-htoDjs bWXOiM sc-chips"
className="sc-htoDjs jZevLT sc-chips"
onClick={[Function]}
size="base"
>
Expand All @@ -136,7 +136,7 @@ exports[`Storyshots Chips Default 1`] = `
Deletable Chip
</h3>
<div
className="sc-htoDjs oAfeq sc-chips"
className="sc-htoDjs iGXwyJ sc-chips"
size="base"
>
<span
Expand All @@ -149,7 +149,6 @@ exports[`Storyshots Chips Default 1`] = `
</span>
<span
className="sc-iwsKbI jkfBoi sc-chips-text"
onRemove={[Function]}
>
Deletable
</span>
Expand Down Expand Up @@ -185,7 +184,7 @@ exports[`Storyshots Chips Default 1`] = `
</button>
</div>
<div
className="sc-htoDjs kwCbVz sc-chips"
className="sc-htoDjs knTkHh sc-chips"
size="base"
>
<span
Expand All @@ -198,7 +197,6 @@ exports[`Storyshots Chips Default 1`] = `
</span>
<span
className="sc-iwsKbI jkfBoi sc-chips-text"
onRemove={[Function]}
>
Deletable
</span>
Expand Down Expand Up @@ -234,7 +232,7 @@ exports[`Storyshots Chips Default 1`] = `
</button>
</div>
<div
className="sc-htoDjs gktCMn sc-chips"
className="sc-htoDjs gKfSCM sc-chips"
size="base"
>
<span
Expand All @@ -247,7 +245,6 @@ exports[`Storyshots Chips Default 1`] = `
</span>
<span
className="sc-iwsKbI jkfBoi sc-chips-text"
onRemove={[Function]}
>
Deletable
</span>
Expand Down Expand Up @@ -283,7 +280,7 @@ exports[`Storyshots Chips Default 1`] = `
</button>
</div>
<div
className="sc-htoDjs eqomIC sc-chips"
className="sc-htoDjs HpTIe sc-chips"
size="base"
>
<span
Expand All @@ -296,7 +293,6 @@ exports[`Storyshots Chips Default 1`] = `
</span>
<span
className="sc-iwsKbI jkfBoi sc-chips-text"
onRemove={[Function]}
>
Deletable
</span>
Expand Down Expand Up @@ -337,7 +333,7 @@ exports[`Storyshots Chips Default 1`] = `
Different sizes
</h3>
<div
className="sc-htoDjs bZdUyG sc-chips"
className="sc-htoDjs fDWOsI sc-chips"
size="smaller"
>
<span
Expand All @@ -350,7 +346,6 @@ exports[`Storyshots Chips Default 1`] = `
</span>
<span
className="sc-iwsKbI jkfBoi sc-chips-text"
onRemove={[Function]}
>
Smaller
</span>
Expand Down Expand Up @@ -386,7 +381,7 @@ exports[`Storyshots Chips Default 1`] = `
</button>
</div>
<div
className="sc-htoDjs hOuyzW sc-chips"
className="sc-htoDjs kWxCfZ sc-chips"
size="small"
>
<span
Expand All @@ -399,7 +394,6 @@ exports[`Storyshots Chips Default 1`] = `
</span>
<span
className="sc-iwsKbI jkfBoi sc-chips-text"
onRemove={[Function]}
>
Small
</span>
Expand Down Expand Up @@ -435,7 +429,7 @@ exports[`Storyshots Chips Default 1`] = `
</button>
</div>
<div
className="sc-htoDjs gktCMn sc-chips"
className="sc-htoDjs gKfSCM sc-chips"
size="base"
>
<span
Expand All @@ -448,7 +442,6 @@ exports[`Storyshots Chips Default 1`] = `
</span>
<span
className="sc-iwsKbI jkfBoi sc-chips-text"
onRemove={[Function]}
>
Base
</span>
Expand Down Expand Up @@ -484,7 +477,7 @@ exports[`Storyshots Chips Default 1`] = `
</button>
</div>
<div
className="sc-htoDjs eNzVGU sc-chips"
className="sc-htoDjs jBLNdH sc-chips"
size="large"
>
<span
Expand All @@ -497,7 +490,6 @@ exports[`Storyshots Chips Default 1`] = `
</span>
<span
className="sc-iwsKbI jkfBoi sc-chips-text"
onRemove={[Function]}
>
Large
</span>
Expand Down Expand Up @@ -533,7 +525,7 @@ exports[`Storyshots Chips Default 1`] = `
</button>
</div>
<div
className="sc-htoDjs beIFWW sc-chips"
className="sc-htoDjs jcMTPC sc-chips"
size="larger"
>
<span
Expand All @@ -546,7 +538,6 @@ exports[`Storyshots Chips Default 1`] = `
</span>
<span
className="sc-iwsKbI jkfBoi sc-chips-text"
onRemove={[Function]}
>
Larger
</span>
Expand Down