Skip to content

Commit

Permalink
Search Bar component (#1027)
Browse files Browse the repository at this point in the history 
* chore: adds `testId` to Badge, Button, Heading

* chore: remove placeholder tick icon

* feat: add specialised `mergeRefs` util
  • Loading branch information
@skinread
skinread authored Jan 30, 2025
1 parent e6cfa22 commit 72019bd
Show file tree
Hide file tree
Showing 62 changed files with 1,639 additions and 1,330 deletions.
5 changes: 5 additions & 0 deletions .changeset/real-beds-punch.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@autoguru/overdrive': minor
---

Introduced Search Bar component beta
2 changes: 1 addition & 1 deletion lib/components/Actions/__snapshots__/Actions.spec.jsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,6 @@

exports[`<Actions /> should match the snapshot 1`] = `
<div
class="reset_block__1oah0223 useBoxStyles_display_flex__3xgq1lfu useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lgr useNegativeMarginLeft_makeResponsiveStyle_key_bp__10sqwm28 useNegativeMarginTop_makeResponsiveStyle_key_bp__rvovxw8 Columns_align_stretch__15fwc182b Columns_wrapping_wrap__15fwc1828"
class="reset_block__1oah0223 useBoxStyles_display_flex__3xgq1lfy useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lgv useNegativeMarginLeft_makeResponsiveStyle_key_bp__10sqwm28 useNegativeMarginTop_makeResponsiveStyle_key_bp__rvovxw8 Columns_align_stretch__15fwc182b Columns_wrapping_wrap__15fwc1828"
/>
`;
30 changes: 15 additions & 15 deletions lib/components/Alert/__snapshots__/Alert.spec.jsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,27 +2,27 @@

exports[`<Alert /> should match the snapshot 1`] = `
<div
class="reset_block__1oah0223 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l4 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l18 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l2c useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l3g useBoxStyles_position_relative__3xgq1lfk useBoxStyles_overflow_hidden__3xgq1lfo useBoxStyles_border_style__3xgq1l9k useBoxStyles_border_colour_top_gray__3xgq1l9m useBoxStyles_border_colour_right_gray__3xgq1l9y useBoxStyles_border_colour_bottom_gray__3xgq1laa useBoxStyles_border_colour_left_gray__3xgq1lam useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lax useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lbd useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lbt useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lc9 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l98 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lcp useBoxStyles_backgroundColours_white__3xgq1lev useTextStyles_root__1xnpmd70 reset_block__1oah0223 useTextStyles_colours_success__1xnpmd7m Alert_contained__19auxx40"
class="reset_block__1oah0223 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l4 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l18 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l2c useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l3g useBoxStyles_position_relative__3xgq1lfo useBoxStyles_overflow_hidden__3xgq1lfs useBoxStyles_border_style__3xgq1l9k useBoxStyles_border_colour_top_gray__3xgq1l9m useBoxStyles_border_colour_right_gray__3xgq1l9y useBoxStyles_border_colour_bottom_gray__3xgq1laa useBoxStyles_border_colour_left_gray__3xgq1lam useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lax useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lbd useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lbt useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lc9 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l98 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lcp useBoxStyles_backgroundColours_white__3xgq1lez useTextStyles_root__1xnpmd70 reset_block__1oah0223 useTextStyles_colours_success__1xnpmd7m Alert_contained__19auxx40"
role="alert"
>
<div
class="reset_block__1oah0223 useBoxStyles_height_full__3xgq1lfh useBoxStyles_position_absolute__3xgq1lfi useBoxStyles_backgroundColours_success__3xgq1lf3 IntentStripe_intentBox__1n5wa370"
class="reset_block__1oah0223 useBoxStyles_height_full__3xgq1lfl useBoxStyles_position_absolute__3xgq1lfm useBoxStyles_backgroundColours_success__3xgq1lf7 IntentStripe_intentBox__1n5wa370"
/>
<div
class="reset_block__1oah0223 useBoxStyles_display_flex__3xgq1lfu useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lgr useNegativeMarginLeft_makeResponsiveStyle_key_bp__10sqwm24 useNegativeMarginTop_makeResponsiveStyle_key_bp__rvovxw10 useNegativeMarginTop_makeResponsiveStyle_key_bp__rvovxw11 useNegativeMarginTop_makeResponsiveStyle_key_bp__rvovxw12 useNegativeMarginTop_makeResponsiveStyle_key_bp__rvovxw13 Columns_align_stretch__15fwc182b Columns_wrapping_noWrap__15fwc1829"
class="reset_block__1oah0223 useBoxStyles_display_flex__3xgq1lfy useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lgv useNegativeMarginLeft_makeResponsiveStyle_key_bp__10sqwm24 useNegativeMarginTop_makeResponsiveStyle_key_bp__rvovxw10 useNegativeMarginTop_makeResponsiveStyle_key_bp__rvovxw11 useNegativeMarginTop_makeResponsiveStyle_key_bp__rvovxw12 useNegativeMarginTop_makeResponsiveStyle_key_bp__rvovxw13 Columns_align_stretch__15fwc182b Columns_wrapping_noWrap__15fwc1829"
>
<div
class="reset_block__1oah0223 useBoxStyles_flexGrow_0__3xgq1lh7 useBoxStyles_flexShrink_0__3xgq1lh9 Columns_makeResponsiveStyle_key_bp__15fwc184 Columns_makeResponsiveStyle_key_bp__15fwc1824 Columns_makeResponsiveStyle_key_bp__15fwc1825 Columns_makeResponsiveStyle_key_bp__15fwc1826 Columns_makeResponsiveStyle_key_bp__15fwc1827 Column_align_top__1ycz12q19"
class="reset_block__1oah0223 useBoxStyles_flexGrow_0__3xgq1lhb useBoxStyles_flexShrink_0__3xgq1lhd Columns_makeResponsiveStyle_key_bp__15fwc184 Columns_makeResponsiveStyle_key_bp__15fwc1824 Columns_makeResponsiveStyle_key_bp__15fwc1825 Columns_makeResponsiveStyle_key_bp__15fwc1826 Columns_makeResponsiveStyle_key_bp__15fwc1827 Column_align_top__1ycz12q19"
>
<div
class="reset_block__1oah0223 useBoxStyles_display_flex__3xgq1lfu useBoxStyles_width_full__3xgq1lff useBoxStyles_height_full__3xgq1lfh"
class="reset_block__1oah0223 useBoxStyles_display_flex__3xgq1lfy useBoxStyles_width_full__3xgq1lfj useBoxStyles_height_full__3xgq1lfl"
>
<div
class="reset_block__1oah0223 useBoxStyles_display_block__3xgq1lft Icon_makeResponsiveStyle_key_bp__1gy3ire4 reset_block__1oah0223 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l4k useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l6s useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l7w"
class="reset_block__1oah0223 useBoxStyles_display_block__3xgq1lfx Icon_makeResponsiveStyle_key_bp__1gy3ire4 reset_block__1oah0223 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l4k useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l6s useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l7w"
>
<svg
aria-hidden="true"
class="useBoxStyles_display_block__3xgq1lft useBoxStyles_width_full__3xgq1lff useBoxStyles_height_full__3xgq1lfh"
class="useBoxStyles_display_block__3xgq1lfx useBoxStyles_width_full__3xgq1lfj useBoxStyles_height_full__3xgq1lfl"
fill="currentColor"
focusable="false"
viewBox="0 0 24 24"
Expand All @@ -36,32 +36,32 @@ exports[`<Alert /> should match the snapshot 1`] = `
</div>
</div>
<div
class="reset_block__1oah0223 useBoxStyles_flexGrow_1__3xgq1lh8 Columns_makeResponsiveStyle_key_bp__15fwc184 Columns_makeResponsiveStyle_key_bp__15fwc1824 Columns_makeResponsiveStyle_key_bp__15fwc1825 Columns_makeResponsiveStyle_key_bp__15fwc1826 Columns_makeResponsiveStyle_key_bp__15fwc1827 Column_makeResponsiveStyle_key_bp__1ycz12q14 Column_align_centre__1ycz12q1a"
class="reset_block__1oah0223 useBoxStyles_flexGrow_1__3xgq1lhc Columns_makeResponsiveStyle_key_bp__15fwc184 Columns_makeResponsiveStyle_key_bp__15fwc1824 Columns_makeResponsiveStyle_key_bp__15fwc1825 Columns_makeResponsiveStyle_key_bp__15fwc1826 Columns_makeResponsiveStyle_key_bp__15fwc1827 Column_makeResponsiveStyle_key_bp__1ycz12q14 Column_align_centre__1ycz12q1a"
>
<div
class="reset_block__1oah0223 useBoxStyles_display_flex__3xgq1lfu useBoxStyles_width_full__3xgq1lff useBoxStyles_height_full__3xgq1lfh useTextStyles_root__1xnpmd70 reset_block__1oah0223 useTextStyles_colours_dark__1xnpmd7f"
class="reset_block__1oah0223 useBoxStyles_display_flex__3xgq1lfy useBoxStyles_width_full__3xgq1lfj useBoxStyles_height_full__3xgq1lfl useTextStyles_root__1xnpmd70 reset_block__1oah0223 useTextStyles_colours_dark__1xnpmd7f"
/>
</div>
<div
class="reset_block__1oah0223 useBoxStyles_flexGrow_0__3xgq1lh7 useBoxStyles_flexShrink_0__3xgq1lh9 Columns_makeResponsiveStyle_key_bp__15fwc184 Columns_makeResponsiveStyle_key_bp__15fwc1824 Columns_makeResponsiveStyle_key_bp__15fwc1825 Columns_makeResponsiveStyle_key_bp__15fwc1826 Columns_makeResponsiveStyle_key_bp__15fwc1827 Column_align_top__1ycz12q19"
class="reset_block__1oah0223 useBoxStyles_flexGrow_0__3xgq1lhb useBoxStyles_flexShrink_0__3xgq1lhd Columns_makeResponsiveStyle_key_bp__15fwc184 Columns_makeResponsiveStyle_key_bp__15fwc1824 Columns_makeResponsiveStyle_key_bp__15fwc1825 Columns_makeResponsiveStyle_key_bp__15fwc1826 Columns_makeResponsiveStyle_key_bp__15fwc1827 Column_align_top__1ycz12q19"
>
<div
class="reset_block__1oah0223 useBoxStyles_display_flex__3xgq1lfu useBoxStyles_width_full__3xgq1lff useBoxStyles_height_full__3xgq1lfh"
class="reset_block__1oah0223 useBoxStyles_display_flex__3xgq1lfy useBoxStyles_width_full__3xgq1lfj useBoxStyles_height_full__3xgq1lfl"
>
<button
aria-label="close"
class="reset_appearance__1oah0220 reset_cursorPointer__1oah0221 reset_trimmedBlockElement__1oah0225 reset_button__1oah0226 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l10 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l1c useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l38 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l3k useBoxStyles_display_inlineBlock__3xgq1lfy useBoxStyles_overflow_hidden__3xgq1lfo useBoxStyles_textAlign_center__3xgq1lfm useBoxStyles_border_style__3xgq1l9k useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lb9 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lbp useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lc5 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lcl useBoxStyles_makeResponsiveStyle_key_bp__3xgq1ld5 useTextStyles_root__1xnpmd70 reset_block__1oah0223 useTextStyles_colours_white__1xnpmd7g useTextStyles_fontWeight_semiBold__1xnpmd7p useTextStyles_sizes_3__1xnpmd73 Button_root__p2yon50 Button_minimal_defaults__p2yon5r Button_minimalStates_secondary__p2yon5v Button_size_small_default__p2yon57 Button_size_small_rounded__p2yon58 Button_size_small_iconOnly__p2yon59 Button_enabled__p2yon54"
class="reset_appearance__1oah0220 reset_cursorPointer__1oah0221 reset_trimmedBlockElement__1oah0225 reset_button__1oah0226 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l10 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l1c useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l38 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1l3k useBoxStyles_display_inlineBlock__3xgq1lg2 useBoxStyles_overflow_hidden__3xgq1lfs useBoxStyles_textAlign_center__3xgq1lfq useBoxStyles_border_style__3xgq1l9k useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lb9 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lbp useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lc5 useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lcl useBoxStyles_makeResponsiveStyle_key_bp__3xgq1ld9 useTextStyles_root__1xnpmd70 reset_block__1oah0223 useTextStyles_colours_white__1xnpmd7g useTextStyles_fontWeight_semiBold__1xnpmd7p useTextStyles_sizes_3__1xnpmd73 Button_root__p2yon50 Button_minimal_defaults__p2yon5r Button_minimalStates_secondary__p2yon5v Button_size_small_default__p2yon57 Button_size_small_rounded__p2yon58 Button_size_small_iconOnly__p2yon59 Button_enabled__p2yon54"
type="button"
>
<div
class="reset_block__1oah0223 useBoxStyles_height_full__3xgq1lfh useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lgj useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lhg Button_body__p2yon51"
class="reset_block__1oah0223 useBoxStyles_height_full__3xgq1lfl useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lgn useBoxStyles_makeResponsiveStyle_key_bp__3xgq1lhk Button_body__p2yon51"
>
<div
class="reset_block__1oah0223 useBoxStyles_display_block__3xgq1lft Icon_makeResponsiveStyle_key_bp__1gy3ire4 useTextStyles_root__1xnpmd70 reset_block__1oah0223 useTextStyles_colours_muted__1xnpmd7h"
class="reset_block__1oah0223 useBoxStyles_display_block__3xgq1lfx Icon_makeResponsiveStyle_key_bp__1gy3ire4 useTextStyles_root__1xnpmd70 reset_block__1oah0223 useTextStyles_colours_muted__1xnpmd7h"
>
<svg
aria-hidden="true"
class="useBoxStyles_display_block__3xgq1lft useBoxStyles_width_full__3xgq1lff useBoxStyles_height_full__3xgq1lfh"
class="useBoxStyles_display_block__3xgq1lfx useBoxStyles_width_full__3xgq1lfj useBoxStyles_height_full__3xgq1lfl"
fill="currentColor"
focusable="false"
viewBox="0 0 24 24"
Expand Down
Loading

0 comments on commit 72019bd

Please sign in to comment.