Skip to content

Commit

Permalink
Merge pull request #707 from Atom-Learning/fix/readd-width-auto-to-se…
Browse files Browse the repository at this point in the history 
…arch-input

fix: readd auto width to search input
  • Loading branch information
@LimeWub
LimeWub authored Sep 19, 2024
2 parents 5b76035 + ac40cf2 commit 8bac144
Show file tree
Hide file tree
Showing 4 changed files with 40 additions and 26 deletions.
28 changes: 18 additions & 10 deletions lib/src/components/data-table/__snapshots__/DataTable.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -745,8 +745,9 @@ exports[`DataTable EmptyState renders custom empty state 1`] = `
margin-bottom: var(--space-3);
}
.c-dhzjXW-ieyRoAv-css {
.c-dhzjXW-icJWlas-css {
position: relative;
width: auto;
margin-bottom: var(--space-4);
}
Expand Down Expand Up @@ -856,8 +857,9 @@ exports[`DataTable EmptyState renders custom empty state 1`] = `
stroke-width: 3;
}
.c-dhzjXW-icmpvrW-css {
.c-dhzjXW-ibnbbhV-css {
position: relative;
width: auto;
}
.c-oUmPa-igyKUXm-css {
Expand Down Expand Up @@ -1392,8 +1394,9 @@ exports[`DataTable component Renders drag handles for draggable table rows 1`] =
margin-bottom: var(--space-3);
}
.c-dhzjXW-ieyRoAv-css {
.c-dhzjXW-icJWlas-css {
position: relative;
width: auto;
margin-bottom: var(--space-4);
}
Expand Down Expand Up @@ -3147,8 +3150,9 @@ exports[`DataTable component renders 1`] = `
margin-bottom: var(--space-3);
}
.c-dhzjXW-ieyRoAv-css {
.c-dhzjXW-icJWlas-css {
position: relative;
width: auto;
margin-bottom: var(--space-4);
}
Expand Down Expand Up @@ -3188,7 +3192,7 @@ exports[`DataTable component renders 1`] = `
User search
</label>
<div
class="c-dhzjXW c-kOvGWL c-kOvGWL-dNqCDY-size-md c-dhzjXW-ieyRoAv-css"
class="c-dhzjXW c-kOvGWL c-kOvGWL-dNqCDY-size-md c-dhzjXW-icJWlas-css"
>
<input
class="c-dyvMgW c-dyvMgW-gvmVBy-size-md c-foJWJd c-YEzsq c-YEzsq-icRYcAH-css"
Expand Down Expand Up @@ -4619,8 +4623,9 @@ exports[`DataTable server-side renders 1`] = `
margin-bottom: var(--space-3);
}
.c-dhzjXW-ieyRoAv-css {
.c-dhzjXW-icJWlas-css {
position: relative;
width: auto;
margin-bottom: var(--space-4);
}
Expand Down Expand Up @@ -4730,8 +4735,9 @@ exports[`DataTable server-side renders 1`] = `
stroke-width: 3;
}
.c-dhzjXW-icmpvrW-css {
.c-dhzjXW-ibnbbhV-css {
position: relative;
width: auto;
}
.c-oUmPa-igyKUXm-css {
Expand All @@ -4758,7 +4764,7 @@ exports[`DataTable server-side renders 1`] = `
class="c-cVSpVL c-cVSpVL-gvmVBy-size-md c-cVSpVL-grKRUr-type-block c-cVSpVL-ihbtntv-css"
/>
<div
class="c-dhzjXW c-kOvGWL c-kOvGWL-dNqCDY-size-md c-dhzjXW-icmpvrW-css"
class="c-dhzjXW c-kOvGWL c-kOvGWL-dNqCDY-size-md c-dhzjXW-ibnbbhV-css"
>
<input
class="c-dyvMgW c-dyvMgW-gvmVBy-size-md c-foJWJd c-YEzsq c-YEzsq-icRYcAH-css"
Expand Down Expand Up @@ -5795,8 +5801,9 @@ exports[`DataTable sticky columns renders 1`] = `
margin-bottom: var(--space-3);
}
.c-dhzjXW-ieyRoAv-css {
.c-dhzjXW-icJWlas-css {
position: relative;
width: auto;
margin-bottom: var(--space-4);
}
Expand Down Expand Up @@ -5906,8 +5913,9 @@ exports[`DataTable sticky columns renders 1`] = `
stroke-width: 3;
}
.c-dhzjXW-icmpvrW-css {
.c-dhzjXW-ibnbbhV-css {
position: relative;
width: auto;
}
.c-oUmPa-igyKUXm-css {
Expand Down
15 changes: 9 additions & 6 deletions lib/src/components/search-field/__snapshots__/SearchField.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -178,8 +178,9 @@ exports[`SearchField component renders a field in error state - has no programma
margin-bottom: var(--space-3);
}
.c-dhzjXW-icmpvrW-css {
.c-dhzjXW-ibnbbhV-css {
position: relative;
width: auto;
}
.c-YEzsq-icRYcAH-css {
Expand Down Expand Up @@ -230,7 +231,7 @@ exports[`SearchField component renders a field in error state - has no programma
</label>
</div>
<div
class="c-dhzjXW c-kOvGWL c-kOvGWL-dNqCDY-size-md c-dhzjXW-icmpvrW-css"
class="c-dhzjXW c-kOvGWL c-kOvGWL-dNqCDY-size-md c-dhzjXW-ibnbbhV-css"
>
<input
class="c-dyvMgW c-dyvMgW-gvmVBy-size-md c-foJWJd c-YEzsq c-YEzsq-icRYcAH-css"
Expand Down Expand Up @@ -443,8 +444,9 @@ exports[`SearchField component renders a field with a disabled input - has no pr
margin-bottom: var(--space-3);
}
.c-dhzjXW-icmpvrW-css {
.c-dhzjXW-ibnbbhV-css {
position: relative;
width: auto;
}
.c-YEzsq-icRYcAH-css {
Expand Down Expand Up @@ -478,7 +480,7 @@ exports[`SearchField component renders a field with a disabled input - has no pr
</label>
</div>
<div
class="c-dhzjXW c-kOvGWL c-kOvGWL-dNqCDY-size-md c-dhzjXW-icmpvrW-css"
class="c-dhzjXW c-kOvGWL c-kOvGWL-dNqCDY-size-md c-dhzjXW-ibnbbhV-css"
>
<input
class="c-dyvMgW c-dyvMgW-gvmVBy-size-md c-foJWJd c-YEzsq c-YEzsq-icRYcAH-css"
Expand Down Expand Up @@ -655,8 +657,9 @@ exports[`SearchField component renders a field with a search input - has no prog
margin-bottom: var(--space-3);
}
.c-dhzjXW-icmpvrW-css {
.c-dhzjXW-ibnbbhV-css {
position: relative;
width: auto;
}
.c-YEzsq-icRYcAH-css {
Expand Down Expand Up @@ -690,7 +693,7 @@ exports[`SearchField component renders a field with a search input - has no prog
</label>
</div>
<div
class="c-dhzjXW c-kOvGWL c-kOvGWL-dNqCDY-size-md c-dhzjXW-icmpvrW-css"
class="c-dhzjXW c-kOvGWL c-kOvGWL-dNqCDY-size-md c-dhzjXW-ibnbbhV-css"
>
<input
class="c-dyvMgW c-dyvMgW-gvmVBy-size-md c-foJWJd c-YEzsq c-YEzsq-icRYcAH-css"
Expand Down
8 changes: 4 additions & 4 deletions lib/src/components/search-input/SearchInput.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,9 +47,9 @@ const StyledIcon = styled(Icon, {

const StyledSearchInputText = styled(InputText, {
'&::-webkit-search-decoration, &::-webkit-search-cancel-button, &::-webkit-search-results-button':
{
display: 'none'
}
{
display: 'none'
}
})

export const SearchInput: React.ForwardRefExoticComponent<SearchInputProps> =
Expand Down Expand Up @@ -145,7 +145,7 @@ export const SearchInput: React.ForwardRefExoticComponent<SearchInputProps> =
}

return (
<InputBackground css={{ position: 'relative', ...css }} size={size}>
<InputBackground css={{ position: 'relative', width: 'auto', ...css }} size={size}>
<StyledSearchInputText
ref={setInputElRef}
size={size}
Expand Down
15 changes: 9 additions & 6 deletions lib/src/components/search-input/__snapshots__/SearchInput.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -111,8 +111,9 @@ exports[`SearchInput component renders 1`] = `
}
@media {
.c-dhzjXW-icmpvrW-css {
.c-dhzjXW-ibnbbhV-css {
position: relative;
width: auto;
}
.c-YEzsq-icRYcAH-css {
Expand All @@ -129,7 +130,7 @@ exports[`SearchInput component renders 1`] = `
<div>
<div
class="c-dhzjXW c-kOvGWL c-kOvGWL-dNqCDY-size-md c-dhzjXW-icmpvrW-css"
class="c-dhzjXW c-kOvGWL c-kOvGWL-dNqCDY-size-md c-dhzjXW-ibnbbhV-css"
>
<input
class="c-dyvMgW c-dyvMgW-gvmVBy-size-md c-foJWJd c-YEzsq c-YEzsq-icRYcAH-css"
Expand Down Expand Up @@ -360,8 +361,9 @@ exports[`SearchInput component renders clear button when non-empty defaultValue
}
@media {
.c-dhzjXW-icmpvrW-css {
.c-dhzjXW-ibnbbhV-css {
position: relative;
width: auto;
}
.c-YEzsq-icRYcAH-css {
Expand All @@ -385,7 +387,7 @@ exports[`SearchInput component renders clear button when non-empty defaultValue
<div>
<div
class="c-dhzjXW c-kOvGWL c-kOvGWL-dNqCDY-size-md c-dhzjXW-icmpvrW-css"
class="c-dhzjXW c-kOvGWL c-kOvGWL-dNqCDY-size-md c-dhzjXW-ibnbbhV-css"
>
<input
class="c-dyvMgW c-dyvMgW-gvmVBy-size-md c-foJWJd c-YEzsq c-YEzsq-icRYcAH-css"
Expand Down Expand Up @@ -612,8 +614,9 @@ exports[`SearchInput component renders lg size 1`] = `
}
@media {
.c-dhzjXW-icmpvrW-css {
.c-dhzjXW-ibnbbhV-css {
position: relative;
width: auto;
}
.c-YEzsq-icRYcAH-css {
Expand All @@ -637,7 +640,7 @@ exports[`SearchInput component renders lg size 1`] = `
<div>
<div
class="c-dhzjXW c-kOvGWL c-kOvGWL-hSbHZR-size-lg c-dhzjXW-icmpvrW-css"
class="c-dhzjXW c-kOvGWL c-kOvGWL-hSbHZR-size-lg c-dhzjXW-ibnbbhV-css"
>
<input
class="c-dyvMgW c-dyvMgW-gvmVBy-size-md c-foJWJd c-YEzsq c-YEzsq-icRYcAH-css"
Expand Down

0 comments on commit 8bac144

Please sign in to comment.