Skip to content
This repository was archived by the owner on Sep 30, 2025. It is now read-only.

adds maxWidth prop to SkeletonDisplayText #11264

Merged
merged 2 commits into from
Dec 1, 2023
Merged

adds maxWidth prop to SkeletonDisplayText #11264

merged 2 commits into from
Dec 1, 2023

Conversation

ryanschingeck
Copy link
Contributor

@ryanschingeck ryanschingeck commented Nov 30, 2023 •
edited
Loading

WHY are these changes introduced?

We need to add a maxWidth prop on the SkeletonDisplayText component to support a mobile loading view of sticky actions at the bottom of the new app install grant page (see Figma here).

WHAT is this pull request doing?

Simply adds a fullWidth state of the SkeletonDisplayText:

Screenshot 2023-11-30 at 9 38 42 AM

How to 🎩

🖥 Local development instructions
🗒 General tophatting guidelines
📄 Changelog guidelines

🎩 checklist

@ryanschingeck ryanschingeck self-assigned this Nov 30, 2023
@ryanschingeck ryanschingeck force-pushed the ryans/add-fullWidth-to-SkeletonDisplayText branch from b67b5c1 to 605555f Compare November 30, 2023 14:43
@ryanschingeck ryanschingeck changed the title adds fullWidth to SkeletonDisplayText adds fullWidth prop to SkeletonDisplayText Nov 30, 2023
@ryanschingeck ryanschingeck force-pushed the ryans/add-fullWidth-to-SkeletonDisplayText branch from 5a0e19d to 46ea8ad Compare November 30, 2023 14:44
@ryanschingeck ryanschingeck force-pushed the ryans/add-fullWidth-to-SkeletonDisplayText branch from c31c9e3 to 7b8ab84 Compare November 30, 2023 14:53
@ryanschingeck ryanschingeck requested a review from a team November 30, 2023 15:06
sam-b-rose
sam-b-rose reviewed Dec 1, 2023
View reviewed changes
Copy link
Member

@sam-b-rose sam-b-rose left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This addition seems simple and safe to me. @chloerice or @kyledurand, do you have any opinions here?

I would like to use non-boolean props (e.g., width="full" or similar); however, we are already using fullWidth?: boolean commonly in the system.

kyledurand
kyledurand suggested changes Dec 1, 2023
View reviewed changes
Copy link
Member

@kyledurand kyledurand left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd call the prop exactly what it represents in this case, which is maxWidth.

For the type, I'd allow any percentage and any ch value. ch value for display text could be pretty useful for display type, like page titles

@ryanschingeck ryanschingeck changed the title adds fullWidth prop to SkeletonDisplayText adds maxWidth prop to SkeletonDisplayText Dec 1, 2023
@ryanschingeck ryanschingeck force-pushed the ryans/add-fullWidth-to-SkeletonDisplayText branch 2 times, most recently from 88add08 to ec7c86d Compare December 1, 2023 20:05
@ryanschingeck ryanschingeck force-pushed the ryans/add-fullWidth-to-SkeletonDisplayText branch from e0a9c1f to 092e455 Compare December 1, 2023 20:20
kyledurand
kyledurand approved these changes Dec 1, 2023
View reviewed changes
Copy link
Member

@kyledurand kyledurand left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good! Just make sure to update the @default value

@ryanschingeck ryanschingeck merged commit 773daaa into main Dec 1, 2023
@ryanschingeck ryanschingeck deleted the ryans/add-fullWidth-to-SkeletonDisplayText branch December 1, 2023 22:12
@shopify-github-actions-access shopify-github-actions-access bot mentioned this pull request Dec 1, 2023
Merged
sophschneider added a commit that referenced this pull request Dec 6, 2023
@shopify-github-actions-access @github-actions @sophschneider
Version Packages (#11092)
6ae0cbc 
This PR was opened by the [Changesets
release](https://github.com/changesets/action) GitHub action. When
you're ready to do a release, you can merge this and the packages will
be published to npm automatically. If you're not ready to do a release
yet, that's fine, whenever you add more changesets to main, this PR will
be updated.


# Releases
## @shopify/polaris-icons@7.10.0

### Minor Changes

- [#11073](#11073)
[`c3cad73cb`](c3cad73)
Thanks [@lntn2022](https://github.com/lntn2022)! - Add PayoutsBlocked
icon


- [#11136](#11136)
[`0b1961c16`](0b1961c)
Thanks [@alex-page](https://github.com/alex-page)! - Update Metaobject
and MetaobjectReference icon SVGs

## @shopify/polaris@12.2.0

### Minor Changes

- [#11166](#11166)
[`456f3da42`](456f3da)
Thanks [@sophschneider](https://github.com/sophschneider)! - Added Card
component default value for roundedAbove prop


- [#11211](#11211)
[`07aa5e979`](07aa5e9)
Thanks [@sophschneider](https://github.com/sophschneider)! - Added
`size` prop with `slim` and `medium` options to `TextField`


- [#11266](#11266)
[`bf0593e20`](bf0593e)
Thanks [@LauraAubin](https://github.com/LauraAubin)! - - Fixed `Modal`
`activator` not regaining focus on close
- Added an `activatorWrapper` prop to `Modal` to support setting the
element that wraps the `activator`


- [#11201](#11201)
[`eca971dca`](eca971d)
Thanks [@laurkim](https://github.com/laurkim)! - Added documentation for
`Card` examples to support `LegacyCard` compositions


- [#11261](#11261)
[`32cfbecb1`](32cfbec)
Thanks [@lgriffee](https://github.com/lgriffee)! - Updated `Avatar`
background and text colors


- [#11219](#11219)
[`97683ac05`](97683ac)
Thanks [@matallo](https://github.com/matallo)! - - Bumped
`color-text-magic-secondary` to purple 13
    -   Added `tone` prop with `magic` value to `Select`
    -   Added `magic` value to `tone` prop of `Text`
    -   Added `magic-subdued` value to `tone` prop of `Text`


- [#11264](#11264)
[`773daaa0f`](773daaa)
Thanks [@ryanschingeck](https://github.com/ryanschingeck)! - Added
`maxWidth` prop to SkeletonDisplayText component


- [#11172](#11172)
[`64ee75039`](64ee750)
Thanks [@yurm04](https://github.com/yurm04)! - Added the `key` prop to
`Select` component `StrictOption`


- [#11170](#11170)
[`79cadcf4f`](79cadcf)
Thanks [@laurkim](https://github.com/laurkim)! - Added support for
`paddingInline` and `paddingBlock` on `Box` component with updated
documentation


- [#11115](#11115)
[`45deb1941`](45deb19)
Thanks [@fatimasajadi](https://github.com/fatimasajadi)! - Fixed hover
state of `IndexTable.Row` when `selectable` is `false`


- [#10633](#10633)
[`53fe61479`](53fe614)
Thanks [@mattkubej](https://github.com/mattkubej)! - Updated IndexTable,
ResourceList, and DataTable to have built-in pagination props


- [#10726](#10726)
[`35d92bcd8`](35d92bc)
Thanks [@mrcthms](https://github.com/mrcthms)! - Updated Filters to not
render or perform filters logic if the filters array is empty


- [#10800](#10800)
[`9159e5083`](9159e50)
Thanks [@sirgalleto](https://github.com/sirgalleto)! - Added support for
an `EditColumns` button rendered in the `IndexFilters` deprecating the
`Tabs`'s `edit-columns` action.

    -   `IndexFilters`
- Added support for rendering an Edit Columns button using the
`showEditColumnsButton` flag.
- Added the edition `mode` to the `onEditStart(mode)` callback.
    -   `Tabs`
        -   Removed the `edit-columns` action type.


- [#11221](#11221)
[`799276156`](7992761)
Thanks [@mrcthms](https://github.com/mrcthms)! - Updated Pagination to
be correct height of 40px when in the table variant


- [#11263](#11263)
[`04b8fb370`](04b8fb3)
Thanks [@alex-page](https://github.com/alex-page)! - Add storybook
example for all icons in @shopify/polaris-icons


- [#11094](#11094)
[`2c5ca9900`](2c5ca99)
Thanks [@laurkim](https://github.com/laurkim)! - Added support for
`bodyXs` variant and fixed font weight for `headingLg` variant in `Text`
component.
Updated references to font tokens from Polaris v11 to v12 in `Text`
component documentation


- [#11036](#11036)
[`1459f773d`](1459f77)
Thanks [@hughnguy](https://github.com/hughnguy)! - Fixed `TextField`
events not bubbling up when `multiline`

### Patch Changes

- [#10987](#10987)
[`00374f85a`](00374f8)
Thanks [@kyledurand](https://github.com/kyledurand)! - Simplified
`Button` code


- [#11211](#11211)
[`07aa5e979`](07aa5e9)
Thanks [@sophschneider](https://github.com/sophschneider)! - Fixed
transparent background and wrapping in `IndexFilters` on small screens


- [#11211](#11211)
[`07aa5e979`](07aa5e9)
Thanks [@sophschneider](https://github.com/sophschneider)! - Added
`SearchMinor` icon to `Filters` search field when `mdUp`


- [#11101](#11101)
[`6297e524a`](6297e52)
Thanks [@AndrewMusgrave](https://github.com/AndrewMusgrave)! - Fixed ref
error in `Tabs` for `CreateViewModal` and removed promoted bulk action
warnings


- [#11203](#11203)
[`8b9ded242`](8b9ded2)
Thanks [@kyledurand](https://github.com/kyledurand)! - Updated
IndexTable documentation for when to hide bulk actions


- [#11270](#11270)
[`09df04ca5`](09df04c)
Thanks [@moraleslevi](https://github.com/moraleslevi)! - Remove
scrollbars from TextField vertical content


- [#11245](#11245)
[`165c860c2`](165c860)
Thanks [@matallo](https://github.com/matallo)! - - Fixed `onFocus` and
`onBlur` events of Select component


- [#11237](#11237)
[`6b6e27ce0`](6b6e27c)
Thanks [@alex-page](https://github.com/alex-page)! - Remove unused
custom icon from dropzone that was used in a test


- [#11103](#11103)
[`786ee94b4`](786ee94)
Thanks [@kyledurand](https://github.com/kyledurand)! - Fixed Filters
SearchField background in dark mode


- [#11211](#11211)
[`07aa5e979`](07aa5e9)
Thanks [@sophschneider](https://github.com/sophschneider)! - Fixed
`TextField` clear button to not render when hidden


- [#11169](#11169)
[`90de38843`](90de388)
Thanks [@kyledurand](https://github.com/kyledurand)! - Added expanded
styling to Button


- [#11206](#11206)
[`0e8ab42b4`](0e8ab42)
Thanks [@sophschneider](https://github.com/sophschneider)! - Fixed
disjointed Navigation arrow on small screens


- [#10804](#10804)
[`fe8491507`](fe84915)
Thanks [@sam-b-rose](https://github.com/sam-b-rose)! - Add support for
using breakpoint tokens in CSS by using `@custom-media`


- [#11124](#11124)
[`ad504d5be`](ad504d5)
Thanks [@sarahill](https://github.com/sarahill)! - Removed bevel from
`pressed` `Button` when focused


- [#11281](#11281)
[`b0edfbb92`](b0edfbb)
Thanks [@sirgalleto](https://github.com/sirgalleto)! - Restores the
Tab's `edit-columns` action type


- [#11238](#11238)
[`2df27ed0b`](2df27ed)
Thanks [@alex-page](https://github.com/alex-page)! - Conditionally
render the accessibilityLabel when it is provided


- [#11168](#11168)
[`9c3dd913c`](9c3dd91)
Thanks [@mattkubej](https://github.com/mattkubej)! - [Page] prevent
vertical content shift of header with metadata and actions


- [#11211](#11211)
[`07aa5e979`](07aa5e9)
Thanks [@sophschneider](https://github.com/sophschneider)! - Replaced
custom `Filters` input with Polaris `TextField`


- [#11123](#11123)
[`ac45afda8`](ac45afd)
Thanks [@sarahill](https://github.com/sarahill)! - Updated `Button` base
state colors to use `fill` tokens


- [#10599](#10599)
[`b7219863d`](b721986)
Thanks [@oksanashopify](https://github.com/oksanashopify)! - Added child
type to IndexTable row


- [#11105](#11105)
[`ecbd6c137`](ecbd6c1)
Thanks [@sarahill](https://github.com/sarahill)! - Fixed `Tag` icon and
disabled state colors


- [#11012](#11012)
[`c25478fba`](c25478f)
Thanks [@chloerice](https://github.com/chloerice)! - Fixed `FormLayout`
spacing


- [#10753](#10753)
[`c849ff468`](c849ff4)
Thanks [@stephxshopify](https://github.com/stephxshopify)! - [Modal]
Disallow vertical scroll with use of noScroll


- Updated dependencies
\[[`c58632afa`](c58632a),
[`c3cad73cb`](c3cad73),
[`0b1961c16`](0b1961c),
[`32cfbecb1`](32cfbec),
[`97683ac05`](97683ac),
[`fe8491507`](fe84915)]:
    -   @shopify/polaris-tokens@8.2.0
    -   @shopify/polaris-icons@7.10.0

## @shopify/polaris-tokens@8.2.0

### Minor Changes

- [#11173](#11173)
[`c58632afa`](c58632a)
Thanks [@jesstelford](https://github.com/jesstelford)! - Add 0 tokens
where missing as per [the team's
decision](https://github.com/Shopify/polaris/discussions/7334#discussioncomment-4988991).


- [#11261](#11261)
[`32cfbecb1`](32cfbec)
Thanks [@lgriffee](https://github.com/lgriffee)! - Updated `Avatar`
background and text colors


- [#11219](#11219)
[`97683ac05`](97683ac)
Thanks [@matallo](https://github.com/matallo)! - - Bumped
`color-text-magic-secondary` to purple 13
    -   Added `tone` prop with `magic` value to `Select`
    -   Added `magic` value to `tone` prop of `Text`
    -   Added `magic-subdued` value to `tone` prop of `Text`


- [#10804](#10804)
[`fe8491507`](fe84915)
Thanks [@sam-b-rose](https://github.com/sam-b-rose)! - Add support for
using breakpoint tokens in CSS by using `@custom-media`

## @shopify/polaris-migrator@0.26.4

### Patch Changes

- Updated dependencies
\[[`c58632afa`](c58632a),
[`32cfbecb1`](32cfbec),
[`97683ac05`](97683ac),
[`fe8491507`](fe84915)]:
    -   @shopify/polaris-tokens@8.2.0
    -   @shopify/stylelint-polaris@15.0.4

## @shopify/stylelint-polaris@15.0.4

### Patch Changes

- Updated dependencies
\[[`c58632afa`](c58632a),
[`32cfbecb1`](32cfbec),
[`97683ac05`](97683ac),
[`fe8491507`](fe84915)]:
    -   @shopify/polaris-tokens@8.2.0

## polaris-for-vscode@0.9.0

### Minor Changes

- [#11122](#11122)
[`636d133e2`](636d133)
Thanks [@alex-page](https://github.com/alex-page)! - Update dependencies
and published files to fix vsce publish

### Patch Changes

- Updated dependencies
\[[`c58632afa`](c58632a),
[`32cfbecb1`](32cfbec),
[`97683ac05`](97683ac),
[`fe8491507`](fe84915)]:
    -   @shopify/polaris-tokens@8.2.0

## polaris.shopify.com@0.61.0

### Minor Changes

- [#11170](#11170)
[`79cadcf4f`](79cadcf)
Thanks [@laurkim](https://github.com/laurkim)! - Added support for
`paddingInline` and `paddingBlock` on `Box` component with updated
documentation


- [#11109](#11109)
[`533543abd`](533543a)
Thanks [@heyjoethomas](https://github.com/heyjoethomas)! - Removed
duplicate content on icon contribution


- [#11078](#11078)
[`ed5d7d6bf`](ed5d7d6)
Thanks [@heyjoethomas](https://github.com/heyjoethomas)! - Update icon
contribution guidance


- [#11104](#11104)
[`0e3f591ad`](0e3f591)
Thanks [@heyjoethomas](https://github.com/heyjoethomas)! - Added new
content section on how to add an issue to our board rather than creating
your own pr.

### Patch Changes

- [#11203](#11203)
[`8b9ded242`](8b9ded2)
Thanks [@kyledurand](https://github.com/kyledurand)! - Updated
IndexTable documentation for when to hide bulk actions


- [#11198](#11198)
[`351433f59`](351433f)
Thanks [@kyledurand](https://github.com/kyledurand)! - Fixed typos in
naming docs


- [#11131](#11131)
[`9db9731c7`](9db9731)
Thanks [@sam-b-rose](https://github.com/sam-b-rose)! - Fixed icon search
and query params from URL


- [#11218](#11218)
[`b83ed4edb`](b83ed4e)
Thanks [@sam-b-rose](https://github.com/sam-b-rose)! - Fixed link to
tokens from global search


- [#11260](#11260)
[`61cacbfbb`](61cacbf)
Thanks [@LauraAubin](https://github.com/LauraAubin)! - Fix column
content alignment for the IndexTable and IndexFilters total column


- [#11094](#11094)
[`2c5ca9900`](2c5ca99)
Thanks [@laurkim](https://github.com/laurkim)! - Added support for
`bodyXs` variant and fixed font weight for `headingLg` variant in `Text`
component.
Updated references to font tokens from Polaris v11 to v12 in `Text`
component documentation
- Updated dependencies
\[[`00374f85a`](00374f8),
[`07aa5e979`](07aa5e9),
[`07aa5e979`](07aa5e9),
[`456f3da42`](456f3da),
[`6297e524a`](6297e52),
[`c58632afa`](c58632a),
[`8b9ded242`](8b9ded2),
[`07aa5e979`](07aa5e9),
[`bf0593e20`](bf0593e),
[`eca971dca`](eca971d),
[`09df04ca5`](09df04c),
[`165c860c2`](165c860),
[`c3cad73cb`](c3cad73),
[`6b6e27ce0`](6b6e27c),
[`0b1961c16`](0b1961c),
[`786ee94b4`](786ee94),
[`32cfbecb1`](32cfbec),
[`07aa5e979`](07aa5e9),
[`90de38843`](90de388),
[`97683ac05`](97683ac),
[`773daaa0f`](773daaa),
[`0e8ab42b4`](0e8ab42),
[`fe8491507`](fe84915),
[`ad504d5be`](ad504d5),
[`b0edfbb92`](b0edfbb),
[`64ee75039`](64ee750),
[`79cadcf4f`](79cadcf),
[`45deb1941`](45deb19),
[`53fe61479`](53fe614),
[`35d92bcd8`](35d92bc),
[`2df27ed0b`](2df27ed),
[`9c3dd913c`](9c3dd91),
[`07aa5e979`](07aa5e9),
[`9159e5083`](9159e50),
[`799276156`](7992761),
[`ac45afda8`](ac45afd),
[`b7219863d`](b721986),
[`ecbd6c137`](ecbd6c1),
[`c25478fba`](c25478f),
[`04b8fb370`](04b8fb3),
[`c849ff468`](c849ff4),
[`2c5ca9900`](2c5ca99),
[`1459f773d`](1459f77)]:
    -   @shopify/polaris@12.2.0
    -   @shopify/polaris-tokens@8.2.0
    -   @shopify/polaris-icons@7.10.0

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: Sophie Schneider <thesophieschneider@gmail.com>
AnnaCheba pushed a commit to AnnaCheba/polaris that referenced this pull request Apr 22, 2024
@ryanschingeck
adds maxWidth prop to SkeletonDisplayText (Shopify#11264)
a2e0624 
<!--
  ☝️How to write a good PR title:
- Prefix it with [ComponentName] (if applicable), for example: [Button]
  - Start with a verb, for example: Add, Delete, Improve, Fix…
  - Give as much context as necessary and as little as possible
  - Open it as a draft if it’s a work in progress
-->

### WHY are these changes introduced?

We need to add a maxWidth prop on the SkeletonDisplayText component to
support a mobile loading view of sticky actions at the bottom of the new
app install grant page (see Figma
[here](https://www.figma.com/file/Tq0Ph4GlrrMkVWy4OMz1pb/App-Permissions?type=design&node-id=2146-110080&mode=design&t=xOfJiA9UczChzjaU-4)).

### WHAT is this pull request doing?

Simply adds a fullWidth state of the SkeletonDisplayText:


<img width="1460" alt="Screenshot 2023-11-30 at 9 38 42 AM"
src="https://github.com/Shopify/polaris/assets/97745931/a1c0216c-4675-481d-b15c-f8825859f4bc">

<!--
  Summary of the changes committed.

Before / after screenshots are appreciated for UI changes. Make sure to
include alt text that describes the screenshot.

  Include a video if your changes include interactive content.

If you include an animated gif showing your change, wrapping it in a
details tag is recommended. Gifs usually autoplay, which can cause
accessibility issues for people reviewing your PR:

  <details>
    <summary>Summary of your gif(s)</summary>
    <img src="..." alt="Description of what the gif shows">
  </details>
-->

### How to 🎩

🖥 [Local development
instructions](https://github.com/Shopify/polaris/blob/main/README.md#install-dependencies-and-build-workspaces)
🗒 [General tophatting
guidelines](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md)
📄 [Changelog
guidelines](https://github.com/Shopify/polaris/blob/main/.github/CONTRIBUTING.md#changelog)

### 🎩 checklist

- [x] Tested a
[snapshot](https://github.com/Shopify/polaris/blob/main/documentation/Releasing.md#-snapshot-releases)
- [x] Tested on
[mobile](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md#cross-browser-testing)
- [x] Tested on [multiple
browsers](https://help.shopify.com/en/manual/shopify-admin/supported-browsers)
- [x] Tested for
[accessibility](https://github.com/Shopify/polaris/blob/main/documentation/Accessibility%20testing.md)
- [x] Updated the component's `README.md` with documentation changes
- [x] [Tophatted
documentation](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting%20documentation.md)
changes in the style guide
ascherkus pushed a commit to ascherkus/polaris that referenced this pull request Feb 19, 2025
@shopify-github-actions-access @github-actions @sophschneider
Version Packages (Shopify#11092)
6f9de33 
This PR was opened by the [Changesets
release](https://github.com/changesets/action) GitHub action. When
you're ready to do a release, you can merge this and the packages will
be published to npm automatically. If you're not ready to do a release
yet, that's fine, whenever you add more changesets to main, this PR will
be updated.


# Releases
## @shopify/polaris-icons@7.10.0

### Minor Changes

- [Shopify#11073](Shopify#11073)
[`c3cad73cb`](Shopify@d84596f)
Thanks [@lntn2022](https://github.com/lntn2022)! - Add PayoutsBlocked
icon


- [Shopify#11136](Shopify#11136)
[`0b1961c16`](Shopify@6df65f9)
Thanks [@alex-page](https://github.com/alex-page)! - Update Metaobject
and MetaobjectReference icon SVGs

## @shopify/polaris@12.2.0

### Minor Changes

- [Shopify#11166](Shopify#11166)
[`456f3da42`](Shopify@deab0f9)
Thanks [@sophschneider](https://github.com/sophschneider)! - Added Card
component default value for roundedAbove prop


- [Shopify#11211](Shopify#11211)
[`07aa5e979`](Shopify@7f6fc3f)
Thanks [@sophschneider](https://github.com/sophschneider)! - Added
`size` prop with `slim` and `medium` options to `TextField`


- [Shopify#11266](Shopify#11266)
[`bf0593e20`](Shopify@3180f86)
Thanks [@LauraAubin](https://github.com/LauraAubin)! - - Fixed `Modal`
`activator` not regaining focus on close
- Added an `activatorWrapper` prop to `Modal` to support setting the
element that wraps the `activator`


- [Shopify#11201](Shopify#11201)
[`eca971dca`](Shopify@e453bb7)
Thanks [@laurkim](https://github.com/laurkim)! - Added documentation for
`Card` examples to support `LegacyCard` compositions


- [Shopify#11261](Shopify#11261)
[`32cfbecb1`](Shopify@2dbd4d9)
Thanks [@lgriffee](https://github.com/lgriffee)! - Updated `Avatar`
background and text colors


- [Shopify#11219](Shopify#11219)
[`97683ac05`](Shopify@ec008ed)
Thanks [@matallo](https://github.com/matallo)! - - Bumped
`color-text-magic-secondary` to purple 13
    -   Added `tone` prop with `magic` value to `Select`
    -   Added `magic` value to `tone` prop of `Text`
    -   Added `magic-subdued` value to `tone` prop of `Text`


- [Shopify#11264](Shopify#11264)
[`773daaa0f`](Shopify@a2e0624)
Thanks [@ryanschingeck](https://github.com/ryanschingeck)! - Added
`maxWidth` prop to SkeletonDisplayText component


- [Shopify#11172](Shopify#11172)
[`64ee75039`](Shopify@a14ed4d)
Thanks [@yurm04](https://github.com/yurm04)! - Added the `key` prop to
`Select` component `StrictOption`


- [Shopify#11170](Shopify#11170)
[`79cadcf4f`](Shopify@a707318)
Thanks [@laurkim](https://github.com/laurkim)! - Added support for
`paddingInline` and `paddingBlock` on `Box` component with updated
documentation


- [Shopify#11115](Shopify#11115)
[`45deb1941`](Shopify@520ccd2)
Thanks [@fatimasajadi](https://github.com/fatimasajadi)! - Fixed hover
state of `IndexTable.Row` when `selectable` is `false`


- [Shopify#10633](Shopify#10633)
[`53fe61479`](Shopify@57f9cb8)
Thanks [@mattkubej](https://github.com/mattkubej)! - Updated IndexTable,
ResourceList, and DataTable to have built-in pagination props


- [Shopify#10726](Shopify#10726)
[`35d92bcd8`](Shopify@9dd85a1)
Thanks [@mrcthms](https://github.com/mrcthms)! - Updated Filters to not
render or perform filters logic if the filters array is empty


- [Shopify#10800](Shopify#10800)
[`9159e5083`](Shopify@b27d419)
Thanks [@sirgalleto](https://github.com/sirgalleto)! - Added support for
an `EditColumns` button rendered in the `IndexFilters` deprecating the
`Tabs`'s `edit-columns` action.

    -   `IndexFilters`
- Added support for rendering an Edit Columns button using the
`showEditColumnsButton` flag.
- Added the edition `mode` to the `onEditStart(mode)` callback.
    -   `Tabs`
        -   Removed the `edit-columns` action type.


- [Shopify#11221](Shopify#11221)
[`799276156`](Shopify@3ddeb94)
Thanks [@mrcthms](https://github.com/mrcthms)! - Updated Pagination to
be correct height of 40px when in the table variant


- [Shopify#11263](Shopify#11263)
[`04b8fb370`](Shopify@6d1db5c)
Thanks [@alex-page](https://github.com/alex-page)! - Add storybook
example for all icons in @shopify/polaris-icons


- [Shopify#11094](Shopify#11094)
[`2c5ca9900`](Shopify@cdc38ca)
Thanks [@laurkim](https://github.com/laurkim)! - Added support for
`bodyXs` variant and fixed font weight for `headingLg` variant in `Text`
component.
Updated references to font tokens from Polaris v11 to v12 in `Text`
component documentation


- [Shopify#11036](Shopify#11036)
[`1459f773d`](Shopify@cae2948)
Thanks [@hughnguy](https://github.com/hughnguy)! - Fixed `TextField`
events not bubbling up when `multiline`

### Patch Changes

- [Shopify#10987](Shopify#10987)
[`00374f85a`](Shopify@b38ccaa)
Thanks [@kyledurand](https://github.com/kyledurand)! - Simplified
`Button` code


- [Shopify#11211](Shopify#11211)
[`07aa5e979`](Shopify@7f6fc3f)
Thanks [@sophschneider](https://github.com/sophschneider)! - Fixed
transparent background and wrapping in `IndexFilters` on small screens


- [Shopify#11211](Shopify#11211)
[`07aa5e979`](Shopify@7f6fc3f)
Thanks [@sophschneider](https://github.com/sophschneider)! - Added
`SearchMinor` icon to `Filters` search field when `mdUp`


- [Shopify#11101](Shopify#11101)
[`6297e524a`](Shopify@b3de46b)
Thanks [@AndrewMusgrave](https://github.com/AndrewMusgrave)! - Fixed ref
error in `Tabs` for `CreateViewModal` and removed promoted bulk action
warnings


- [Shopify#11203](Shopify#11203)
[`8b9ded242`](Shopify@0b0ec70)
Thanks [@kyledurand](https://github.com/kyledurand)! - Updated
IndexTable documentation for when to hide bulk actions


- [Shopify#11270](Shopify#11270)
[`09df04ca5`](Shopify@ded5ccd)
Thanks [@moraleslevi](https://github.com/moraleslevi)! - Remove
scrollbars from TextField vertical content


- [Shopify#11245](Shopify#11245)
[`165c860c2`](Shopify@f8f37e1)
Thanks [@matallo](https://github.com/matallo)! - - Fixed `onFocus` and
`onBlur` events of Select component


- [Shopify#11237](Shopify#11237)
[`6b6e27ce0`](Shopify@015c5ab)
Thanks [@alex-page](https://github.com/alex-page)! - Remove unused
custom icon from dropzone that was used in a test


- [Shopify#11103](Shopify#11103)
[`786ee94b4`](Shopify@1388dab)
Thanks [@kyledurand](https://github.com/kyledurand)! - Fixed Filters
SearchField background in dark mode


- [Shopify#11211](Shopify#11211)
[`07aa5e979`](Shopify@7f6fc3f)
Thanks [@sophschneider](https://github.com/sophschneider)! - Fixed
`TextField` clear button to not render when hidden


- [Shopify#11169](Shopify#11169)
[`90de38843`](Shopify@e375792)
Thanks [@kyledurand](https://github.com/kyledurand)! - Added expanded
styling to Button


- [Shopify#11206](Shopify#11206)
[`0e8ab42b4`](Shopify@0c9e29f)
Thanks [@sophschneider](https://github.com/sophschneider)! - Fixed
disjointed Navigation arrow on small screens


- [Shopify#10804](Shopify#10804)
[`fe8491507`](Shopify@f0dadb7)
Thanks [@sam-b-rose](https://github.com/sam-b-rose)! - Add support for
using breakpoint tokens in CSS by using `@custom-media`


- [Shopify#11124](Shopify#11124)
[`ad504d5be`](Shopify@9e9a4c2)
Thanks [@sarahill](https://github.com/sarahill)! - Removed bevel from
`pressed` `Button` when focused


- [Shopify#11281](Shopify#11281)
[`b0edfbb92`](Shopify@755fd9e)
Thanks [@sirgalleto](https://github.com/sirgalleto)! - Restores the
Tab's `edit-columns` action type


- [Shopify#11238](Shopify#11238)
[`2df27ed0b`](Shopify@20f3d30)
Thanks [@alex-page](https://github.com/alex-page)! - Conditionally
render the accessibilityLabel when it is provided


- [Shopify#11168](Shopify#11168)
[`9c3dd913c`](Shopify@9d0df2c)
Thanks [@mattkubej](https://github.com/mattkubej)! - [Page] prevent
vertical content shift of header with metadata and actions


- [Shopify#11211](Shopify#11211)
[`07aa5e979`](Shopify@7f6fc3f)
Thanks [@sophschneider](https://github.com/sophschneider)! - Replaced
custom `Filters` input with Polaris `TextField`


- [Shopify#11123](Shopify#11123)
[`ac45afda8`](Shopify@e0c6ced)
Thanks [@sarahill](https://github.com/sarahill)! - Updated `Button` base
state colors to use `fill` tokens


- [Shopify#10599](Shopify#10599)
[`b7219863d`](Shopify@7abcc49)
Thanks [@oksanashopify](https://github.com/oksanashopify)! - Added child
type to IndexTable row


- [Shopify#11105](Shopify#11105)
[`ecbd6c137`](Shopify@065c4d8)
Thanks [@sarahill](https://github.com/sarahill)! - Fixed `Tag` icon and
disabled state colors


- [Shopify#11012](Shopify#11012)
[`c25478fba`](Shopify@ac42d6c)
Thanks [@chloerice](https://github.com/chloerice)! - Fixed `FormLayout`
spacing


- [Shopify#10753](Shopify#10753)
[`c849ff468`](Shopify@d5e1537)
Thanks [@stephxshopify](https://github.com/stephxshopify)! - [Modal]
Disallow vertical scroll with use of noScroll


- Updated dependencies
\[[`c58632afa`](Shopify@ef18aa1),
[`c3cad73cb`](Shopify@d84596f),
[`0b1961c16`](Shopify@6df65f9),
[`32cfbecb1`](Shopify@2dbd4d9),
[`97683ac05`](Shopify@ec008ed),
[`fe8491507`](Shopify@f0dadb7)]:
    -   @shopify/polaris-tokens@8.2.0
    -   @shopify/polaris-icons@7.10.0

## @shopify/polaris-tokens@8.2.0

### Minor Changes

- [Shopify#11173](Shopify#11173)
[`c58632afa`](Shopify@ef18aa1)
Thanks [@jesstelford](https://github.com/jesstelford)! - Add 0 tokens
where missing as per [the team's
decision](Shopify#7334 (comment)).


- [Shopify#11261](Shopify#11261)
[`32cfbecb1`](Shopify@2dbd4d9)
Thanks [@lgriffee](https://github.com/lgriffee)! - Updated `Avatar`
background and text colors


- [Shopify#11219](Shopify#11219)
[`97683ac05`](Shopify@ec008ed)
Thanks [@matallo](https://github.com/matallo)! - - Bumped
`color-text-magic-secondary` to purple 13
    -   Added `tone` prop with `magic` value to `Select`
    -   Added `magic` value to `tone` prop of `Text`
    -   Added `magic-subdued` value to `tone` prop of `Text`


- [Shopify#10804](Shopify#10804)
[`fe8491507`](Shopify@f0dadb7)
Thanks [@sam-b-rose](https://github.com/sam-b-rose)! - Add support for
using breakpoint tokens in CSS by using `@custom-media`

## @shopify/polaris-migrator@0.26.4

### Patch Changes

- Updated dependencies
\[[`c58632afa`](Shopify@ef18aa1),
[`32cfbecb1`](Shopify@2dbd4d9),
[`97683ac05`](Shopify@ec008ed),
[`fe8491507`](Shopify@f0dadb7)]:
    -   @shopify/polaris-tokens@8.2.0
    -   @shopify/stylelint-polaris@15.0.4

## @shopify/stylelint-polaris@15.0.4

### Patch Changes

- Updated dependencies
\[[`c58632afa`](Shopify@ef18aa1),
[`32cfbecb1`](Shopify@2dbd4d9),
[`97683ac05`](Shopify@ec008ed),
[`fe8491507`](Shopify@f0dadb7)]:
    -   @shopify/polaris-tokens@8.2.0

## polaris-for-vscode@0.9.0

### Minor Changes

- [Shopify#11122](Shopify#11122)
[`636d133e2`](Shopify@ecabcc0)
Thanks [@alex-page](https://github.com/alex-page)! - Update dependencies
and published files to fix vsce publish

### Patch Changes

- Updated dependencies
\[[`c58632afa`](Shopify@ef18aa1),
[`32cfbecb1`](Shopify@2dbd4d9),
[`97683ac05`](Shopify@ec008ed),
[`fe8491507`](Shopify@f0dadb7)]:
    -   @shopify/polaris-tokens@8.2.0

## polaris.shopify.com@0.61.0

### Minor Changes

- [Shopify#11170](Shopify#11170)
[`79cadcf4f`](Shopify@a707318)
Thanks [@laurkim](https://github.com/laurkim)! - Added support for
`paddingInline` and `paddingBlock` on `Box` component with updated
documentation


- [Shopify#11109](Shopify#11109)
[`533543abd`](Shopify@00e52f7)
Thanks [@heyjoethomas](https://github.com/heyjoethomas)! - Removed
duplicate content on icon contribution


- [Shopify#11078](Shopify#11078)
[`ed5d7d6bf`](Shopify@5009513)
Thanks [@heyjoethomas](https://github.com/heyjoethomas)! - Update icon
contribution guidance


- [Shopify#11104](Shopify#11104)
[`0e3f591ad`](Shopify@3ad8d6a)
Thanks [@heyjoethomas](https://github.com/heyjoethomas)! - Added new
content section on how to add an issue to our board rather than creating
your own pr.

### Patch Changes

- [Shopify#11203](Shopify#11203)
[`8b9ded242`](Shopify@0b0ec70)
Thanks [@kyledurand](https://github.com/kyledurand)! - Updated
IndexTable documentation for when to hide bulk actions


- [Shopify#11198](Shopify#11198)
[`351433f59`](Shopify@0cc4349)
Thanks [@kyledurand](https://github.com/kyledurand)! - Fixed typos in
naming docs


- [Shopify#11131](Shopify#11131)
[`9db9731c7`](Shopify@de9e721)
Thanks [@sam-b-rose](https://github.com/sam-b-rose)! - Fixed icon search
and query params from URL


- [Shopify#11218](Shopify#11218)
[`b83ed4edb`](Shopify@9317a77)
Thanks [@sam-b-rose](https://github.com/sam-b-rose)! - Fixed link to
tokens from global search


- [Shopify#11260](Shopify#11260)
[`61cacbfbb`](Shopify@4196f36)
Thanks [@LauraAubin](https://github.com/LauraAubin)! - Fix column
content alignment for the IndexTable and IndexFilters total column


- [Shopify#11094](Shopify#11094)
[`2c5ca9900`](Shopify@cdc38ca)
Thanks [@laurkim](https://github.com/laurkim)! - Added support for
`bodyXs` variant and fixed font weight for `headingLg` variant in `Text`
component.
Updated references to font tokens from Polaris v11 to v12 in `Text`
component documentation
- Updated dependencies
\[[`00374f85a`](Shopify@b38ccaa),
[`07aa5e979`](Shopify@7f6fc3f),
[`07aa5e979`](Shopify@7f6fc3f),
[`456f3da42`](Shopify@deab0f9),
[`6297e524a`](Shopify@b3de46b),
[`c58632afa`](Shopify@ef18aa1),
[`8b9ded242`](Shopify@0b0ec70),
[`07aa5e979`](Shopify@7f6fc3f),
[`bf0593e20`](Shopify@3180f86),
[`eca971dca`](Shopify@e453bb7),
[`09df04ca5`](Shopify@ded5ccd),
[`165c860c2`](Shopify@f8f37e1),
[`c3cad73cb`](Shopify@d84596f),
[`6b6e27ce0`](Shopify@015c5ab),
[`0b1961c16`](Shopify@6df65f9),
[`786ee94b4`](Shopify@1388dab),
[`32cfbecb1`](Shopify@2dbd4d9),
[`07aa5e979`](Shopify@7f6fc3f),
[`90de38843`](Shopify@e375792),
[`97683ac05`](Shopify@ec008ed),
[`773daaa0f`](Shopify@a2e0624),
[`0e8ab42b4`](Shopify@0c9e29f),
[`fe8491507`](Shopify@f0dadb7),
[`ad504d5be`](Shopify@9e9a4c2),
[`b0edfbb92`](Shopify@755fd9e),
[`64ee75039`](Shopify@a14ed4d),
[`79cadcf4f`](Shopify@a707318),
[`45deb1941`](Shopify@520ccd2),
[`53fe61479`](Shopify@57f9cb8),
[`35d92bcd8`](Shopify@9dd85a1),
[`2df27ed0b`](Shopify@20f3d30),
[`9c3dd913c`](Shopify@9d0df2c),
[`07aa5e979`](Shopify@7f6fc3f),
[`9159e5083`](Shopify@b27d419),
[`799276156`](Shopify@3ddeb94),
[`ac45afda8`](Shopify@e0c6ced),
[`b7219863d`](Shopify@7abcc49),
[`ecbd6c137`](Shopify@065c4d8),
[`c25478fba`](Shopify@ac42d6c),
[`04b8fb370`](Shopify@6d1db5c),
[`c849ff468`](Shopify@d5e1537),
[`2c5ca9900`](Shopify@cdc38ca),
[`1459f773d`](Shopify@cae2948)]:
    -   @shopify/polaris@12.2.0
    -   @shopify/polaris-tokens@8.2.0
    -   @shopify/polaris-icons@7.10.0

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: Sophie Schneider <thesophieschneider@gmail.com>
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@jessipa jessipa Awaiting requested review from jessipa

@sam-b-rose sam-b-rose Awaiting requested review from sam-b-rose

2 more reviewers

@arlindohall arlindohall arlindohall approved these changes

@kyledurand kyledurand kyledurand approved these changes

Reviewers whose approvals may not affect merge requirements
Assignees

@ryanschingeck ryanschingeck

Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
4 participants
@ryanschingeck @arlindohall @kyledurand @sam-b-rose