Skip to content

Commit 4a91c39

Browse files
bigfishdesign13bigfishdesign13
authored
Merge branch 'development' into reservoir-v4
2 parents 30981e0 + eb1e733 commit 4a91c39

27 files changed

+573
-109
lines changed

‎CHANGELOG.md‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,8 +29,12 @@ Currently, this repo is in Prerelease. When it is released, this project will ad
2929

3030
### Updates
3131

32+
- Updates the spacing on `Modal`.
3233
- Updates the spacing between heading and content in `Banner` component.
3334
- Updates the `Card`, `FeaturedContent`, and `SearchBar` components to use container queries.
35+
- Updated the `"filter"` variant of `TagSet` to remove tag button wrapper when `isDismissible` and `onClick` are false.
36+
- Updates `Image` to include 'fourByOne' and 'twoByThree' aspect ratio options.
37+
3438

3539
## 3.5.4 (February 13, 2025)
3640

‎src/components/Card/Card.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,7 @@ function CardImage(
105105
});
106106

107107
return (
108-
<Box __css={styles} data-imageWrapper>
108+
<Box __css={styles} data-imagewrapper>
109109
<Image
110110
alt={alt}
111111
aspectRatio={aspectRatio}
@@ -330,7 +330,7 @@ export const Card: ChakraComponent<
330330
...styles.wrapper,
331331
...customColors,
332332
}}
333-
data-cardWrapper
333+
data-cardwrapper
334334
{...rest}
335335
>
336336
{hasImage && (

‎src/components/Card/__snapshots__/Card.test.tsx.snap‎

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,12 @@ exports[`Card Renders the UI snapshot correctly 1`] = `
66
>
77
<div
88
className="css-1u8qly9"
9-
data-cardWrapper={true}
9+
data-cardwrapper={true}
1010
id="regularCard"
1111
>
1212
<div
1313
className="css-0"
14-
data-imageWrapper={true}
14+
data-imagewrapper={true}
1515
>
1616
<div
1717
className="css-0"
@@ -63,12 +63,12 @@ exports[`Card Renders the UI snapshot correctly 2`] = `
6363
>
6464
<div
6565
className="edition-card css-1u8qly9"
66-
data-cardWrapper={true}
66+
data-cardwrapper={true}
6767
id="cardWithExtendedStyles"
6868
>
6969
<div
7070
className="css-0"
71-
data-imageWrapper={true}
71+
data-imagewrapper={true}
7272
>
7373
<div
7474
className="css-0"
@@ -147,12 +147,12 @@ exports[`Card Renders the UI snapshot correctly 3`] = `
147147
>
148148
<div
149149
className="edition-card css-1u8qly9"
150-
data-cardWrapper={true}
150+
data-cardwrapper={true}
151151
id="cardWithNoCTAs"
152152
>
153153
<div
154154
className="css-0"
155-
data-imageWrapper={true}
155+
data-imagewrapper={true}
156156
>
157157
<div
158158
className="css-0"
@@ -200,12 +200,12 @@ exports[`Card Renders the UI snapshot correctly 4`] = `
200200
>
201201
<div
202202
className="edition-card css-1u8qly9"
203-
data-cardWrapper={true}
203+
data-cardwrapper={true}
204204
id="cardWithNoContent"
205205
>
206206
<div
207207
className="css-0"
208-
data-imageWrapper={true}
208+
data-imagewrapper={true}
209209
>
210210
<div
211211
className="css-0"
@@ -279,7 +279,7 @@ exports[`Card Renders the UI snapshot correctly 5`] = `
279279
>
280280
<div
281281
className="edition-card css-1u8qly9"
282-
data-cardWrapper={true}
282+
data-cardwrapper={true}
283283
id="cardWithNoImage"
284284
>
285285
<div
@@ -348,12 +348,12 @@ exports[`Card Renders the UI snapshot correctly 6`] = `
348348
>
349349
<div
350350
className="chakra-linkbox css-2zg2m0"
351-
data-cardWrapper={true}
351+
data-cardwrapper={true}
352352
id="fullclick"
353353
>
354354
<div
355355
className="css-0"
356-
data-imageWrapper={true}
356+
data-imagewrapper={true}
357357
>
358358
<div
359359
className="css-0"
@@ -410,12 +410,12 @@ exports[`Card Renders the UI snapshot correctly 7`] = `
410410
>
411411
<div
412412
className="css-1u8qly9"
413-
data-cardWrapper={true}
413+
data-cardwrapper={true}
414414
id="cardID"
415415
>
416416
<div
417417
className="css-0"
418-
data-imageWrapper={true}
418+
data-imagewrapper={true}
419419
>
420420
<div
421421
className="css-0"
@@ -479,12 +479,12 @@ exports[`Card Renders the UI snapshot correctly 8`] = `
479479
>
480480
<div
481481
className="css-2bbtg1"
482-
data-cardWrapper={true}
482+
data-cardwrapper={true}
483483
id="chakraProps"
484484
>
485485
<div
486486
className="css-0"
487-
data-imageWrapper={true}
487+
data-imagewrapper={true}
488488
>
489489
<div
490490
className="css-0"
@@ -536,13 +536,13 @@ exports[`Card Renders the UI snapshot correctly 9`] = `
536536
>
537537
<div
538538
className="css-1u8qly9"
539-
data-cardWrapper={true}
539+
data-cardwrapper={true}
540540
data-testid="card-testid"
541541
id="otherProps"
542542
>
543543
<div
544544
className="css-0"
545-
data-imageWrapper={true}
545+
data-imagewrapper={true}
546546
>
547547
<div
548548
className="css-0"

‎src/components/FeaturedContent/FeaturedContent.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,7 @@ export const FeaturedContent: ChakraComponent<
102102
...styles.imgWrapper,
103103
backgroundImage: `/**/url(${imageProps.src})`,
104104
}}
105-
data-imageWrapper
105+
data-imagewrapper
106106
>
107107
<FeaturedContentImage
108108
alt={imageProps.alt}

‎src/components/FeaturedContent/__snapshots__/FeaturedContent.test.tsx.snap‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ exports[`Renders the UI snapshot correctly 1`] = `
1111
>
1212
<div
1313
className="css-1xwqty0"
14-
data-imageWrapper={true}
14+
data-imagewrapper={true}
1515
data-testid="featuredcontent-bg-image"
1616
>
1717
<div
@@ -76,7 +76,7 @@ exports[`Renders the UI snapshot correctly 2`] = `
7676
>
7777
<div
7878
className="css-1xwqty0"
79-
data-imageWrapper={true}
79+
data-imagewrapper={true}
8080
data-testid="featuredcontent-bg-image"
8181
>
8282
<div
@@ -141,7 +141,7 @@ exports[`Renders the UI snapshot correctly 3`] = `
141141
>
142142
<div
143143
className="css-1xwqty0"
144-
data-imageWrapper={true}
144+
data-imagewrapper={true}
145145
data-testid="featuredcontent-bg-image"
146146
>
147147
<div
@@ -206,7 +206,7 @@ exports[`Renders the UI snapshot correctly 4`] = `
206206
>
207207
<div
208208
className="css-1xwqty0"
209-
data-imageWrapper={true}
209+
data-imagewrapper={true}
210210
data-testid="featuredcontent-bg-image"
211211
>
212212
<div
@@ -271,7 +271,7 @@ exports[`Renders the UI snapshot correctly 5`] = `
271271
>
272272
<div
273273
className="css-1xwqty0"
274-
data-imageWrapper={true}
274+
data-imagewrapper={true}
275275
data-testid="featuredcontent-bg-image"
276276
>
277277
<div
@@ -336,7 +336,7 @@ exports[`Renders the UI snapshot correctly 6`] = `
336336
>
337337
<div
338338
className="css-1xwqty0"
339-
data-imageWrapper={true}
339+
data-imagewrapper={true}
340340
data-testid="featuredcontent-bg-image"
341341
>
342342
<div

‎src/components/Image/Image.mdx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,10 @@ import { changelogData } from "./imageChangelogData";
1010

1111
# Image
1212

13-
| Component Version | DS Version |
14-
| ----------------- | ---------- |
15-
| Added | `0.0.6` |
16-
| Latest | `3.5.2` |
13+
| Component Version | DS Version |
14+
| ----------------- | ------------ |
15+
| Added | `0.0.6` |
16+
| Latest | `Prerelease` |
1717

1818
## Table of Contents
1919

‎src/components/Image/Image.stories.tsx‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -208,6 +208,22 @@ export const AspectRatios: Story = {
208208
src={getPlaceholderImage()}
209209
/>
210210
</Box>
211+
<Box style={imageBlockStyles}>
212+
<Heading id="fourbyone" level="h4" size="heading6" text="fourByOne" />
213+
<Image
214+
alt="Alt text"
215+
aspectRatio="fourByOne"
216+
src={getPlaceholderImage()}
217+
/>
218+
</Box>
219+
<Box style={imageBlockStyles}>
220+
<Heading id="twobythree" level="h4" size="heading6" text="twoByThree" />
221+
<Image
222+
alt="Alt text"
223+
aspectRatio="twoByThree"
224+
src={getPlaceholderImage()}
225+
/>
226+
</Box>
211227
<Box style={imageBlockStyles}>
212228
<Heading id="onebytwo" level="h4" size="heading6" text="oneByTwo" />
213229
<Image

‎src/components/Image/Image.test.tsx‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,12 @@ describe("Image", () => {
170170
const ratioThreeByFour = renderer
171171
.create(<Image src="test.png" alt="" aspectRatio="threeByFour" />)
172172
.toJSON();
173+
const ratioFourByOne = renderer
174+
.create(<Image src="test.png" alt="" aspectRatio="fourByOne" />)
175+
.toJSON();
176+
const ratioTwoByThree = renderer
177+
.create(<Image src="test.png" alt="" aspectRatio="twoByThree" />)
178+
.toJSON();
173179
const ratioThreeByTwo = renderer
174180
.create(<Image src="test.png" alt="" aspectRatio="threeByTwo" />)
175181
.toJSON();
@@ -206,6 +212,8 @@ describe("Image", () => {
206212
expect(sizeBasedOnHeight).toMatchSnapshot();
207213
expect(ratioFourByThree).toMatchSnapshot();
208214
expect(ratioOneByTwo).toMatchSnapshot();
215+
expect(ratioFourByOne).toMatchSnapshot();
216+
expect(ratioTwoByThree).toMatchSnapshot();
209217
expect(ratioOriginal).toMatchSnapshot();
210218
expect(ratioSixteenByNine).toMatchSnapshot();
211219
expect(ratioSquare).toMatchSnapshot();

‎src/components/Image/Image.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@ import { DimensionTypes } from "../../helpers/types";
1313

1414
export const imageRatiosArray = [
1515
"fourByThree",
16+
"fourByOne",
17+
"twoByThree",
1618
"oneByTwo",
1719
"original",
1820
"sixteenByNine",

0 commit comments

Comments
 (0)