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

Conversation

hughnguy
Copy link
Contributor

@hughnguy hughnguy commented Oct 25, 2023

WHY are these changes introduced?

  • Textarea element in <TextField/> was not bubbling up events
  • This bug prevents popover component from closing when clicking input

Before fix:

Screen.Recording.2023-11-01.at.1.06.08.PM.mov

After fix:

Screen.Recording.2023-11-01.at.1.09.11.PM.mov

WHAT is this pull request doing?

  • Includes textarea check when determining whether to stop propagation of events

How to 🎩

🖥 Local development instructions
🗒 General tophatting guidelines
📄 Changelog guidelines

Copy-paste this code in playground/Playground.tsx:
import React from 'react';
import {Page} from '../src';

export function Playground() {
  return (
    <Page title="Playground">
      {/* Add the code you want to test in here */}
    </Page>
  );
}

🎩 checklist

@hughnguy hughnguy force-pushed the text-area-bubble-up branch 2 times, most recently from 8107970 to 5c04322 Compare October 25, 2023 22:49
Copy link
Member

@chloerice chloerice left a comment

Choose a reason for hiding this comment

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

Thank you for fixing this @hughnguy!! 🙌🏽

'@shopify/polaris': minor
---

Fixed issue with TextField not bubbling up events for textarea element
Copy link
Member

Choose a reason for hiding this comment

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

Suggested change
Fixed issue with TextField not bubbling up events for textarea element
Fixed `TextField` events not bubbling up when `multiline`

@chloerice chloerice added Bug Something is broken and not working as intended in the system. Contribution Component labels Oct 26, 2023
@hughnguy hughnguy force-pushed the text-area-bubble-up branch 2 times, most recently from 71e6aaa to a759d90 Compare November 1, 2023 17:15
@hughnguy hughnguy requested a review from a team November 1, 2023 17:16
);
}

function isTextArea(target: HTMLElement | EventTarget) {
Copy link

Choose a reason for hiding this comment

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

This seems to be identical to isInput(), which then I wonder if there's a need for separating out these checks, especially now given that getInput abstracts out which ref is in use (i.e. change isInput to use getInput instead of inputRef).

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I was thinking it may be better to have it separate if there's ever a future case where textarea vs input needs to be specifically targeted?

Copy link
Contributor

Choose a reason for hiding this comment

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

Let's optimize for code simplicity and maintenance today where possible; if we run into that case in the future we can refactor 👍

const buttonPressTimer = useRef<number>();
const spinnerRef = useRef<HTMLDivElement>(null);

const getInput = useCallback(() => {
Copy link

Choose a reason for hiding this comment

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

Suggested change
const getInput = useCallback(() => {
const getInputRef = useCallback(() => {

@hughnguy hughnguy force-pushed the text-area-bubble-up branch from a759d90 to 80acd75 Compare November 7, 2023 02:39
@hughnguy hughnguy merged commit 1459f77 into main Nov 7, 2023
@hughnguy hughnguy deleted the text-area-bubble-up branch November 7, 2023 16:17
sam-b-rose added a commit that referenced this pull request Nov 7, 2023
* main:
  Fix Icon page search and query params (#11131)
  Fixed issue with textarea not bubbling up to parent (#11036)
  [Button] Remove bevel from pressed focused state (#11124)
  [Button] Updated button base color tokens (#11123)
  Fix hover issue unselected indexTable (#11115)
  Fix vsce publish (#11122)
  Rename .md files to .mdx for correct syntax highlighting (#11116)
@chloerice chloerice added 2023 Contribution tracking for 2023 Contribution Tracking contribution in conjuction with year and type, e.g., "Component" + "Contribution" + "2023" labels Dec 5, 2023
sophschneider added a commit that referenced this pull request Dec 6, 2023
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
<!--
  ☝️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
  - Prefix it with [WIP] while it’s a work in progress
-->

### WHY are these changes introduced?
- Textarea element in `<TextField/>` was not bubbling up events
- This bug prevents popover component from closing when clicking input

Before fix:


https://github.com/Shopify/polaris/assets/5440293/ee00d911-b637-4a97-b442-caa6aef9e395

After fix:


https://github.com/Shopify/polaris/assets/5440293/506a4c73-c927-45b2-a5e1-9b34a42450ed

<!--
  Context about the problem that’s being addressed.
-->

### WHAT is this pull request doing?
- Includes textarea check when determining whether to stop propagation
of events

<!--
  Summary of the changes committed.

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

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>
-->

<!-- ℹ️ Delete the following for small / trivial changes -->

### How to 🎩

🖥 [Local development
instructions](https://github.com/Shopify/polaris/blob/main/README.md#local-development)
🗒 [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)

<!--
  Give as much information as needed to experiment with the component
  in the playground.
-->
- Go to playground:
http://243.27.5.31:6006/?path=/story/playground--details-page
- Click any Popover to open it
- Click on a multi-line `<TextField/>` component
- Verify that the popover closes

<details>
<summary>Copy-paste this code in
<code>playground/Playground.tsx</code>:</summary>

```jsx
import React from 'react';
import {Page} from '../src';

export function Playground() {
  return (
    <Page title="Playground">
      {/* Add the code you want to test in here */}
    </Page>
  );
}
```

</details>

### 🎩 checklist

- [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
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.
Labels
2023 Contribution tracking for 2023 Bug Something is broken and not working as intended in the system. Component Contribution Tracking contribution in conjuction with year and type, e.g., "Component" + "Contribution" + "2023"
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants