[v11.16.0] Update next branch with changes from main (#10382)

Updates `next` branch with latest changes from `main`.
- Resolves conflicts
- Updates renamed components or breaking prop changes
([commit](fb5bc9b))
- Updates any new se23 styles or logic
([commit](e6784cd))

> 🚨 Please verify that changes in the last linked commit above look as
expected in
[storybook](https://5d559397bae39100201eedc1-autktgiyhr.chromatic.com/?path=/story/playground--details-page).

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Jess Telford <jess.telford@shopify.com>
Co-authored-by: Kyle Durand <kyledurand@users.noreply.github.com>
Co-authored-by: Joel Warrington <joel.warrington@shopify.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Sam Rose <11774595+samrose3@users.noreply.github.com>
Co-authored-by: Matt Lavoie <44816587+m4thieulavoie@users.noreply.github.com>
Co-authored-by: aveline <aveline@users.noreply.github.com>
Co-authored-by: Aaron Casanova <32409546+aaronccasanova@users.noreply.github.com>
Co-authored-by: Ash <siavash.etemadieh@shopify.com>
Co-authored-by: shopify-github-actions-access[bot] <109624739+shopify-github-actions-access[bot]@users.noreply.github.com>
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: Maxime Cloutier <maxime.cloutier@shopify.com>
Co-authored-by: translation-platform[bot] <34770790+translation-platform[bot]@users.noreply.github.com>
Co-authored-by: Peter Lazzarino <peter.lazzarino@shopify.com>
Co-authored-by: James Highfield <james.highfield@shopify.com>
Co-authored-by: Marten Bjork <marten.bjork@shopify.com>
Co-authored-by: Joe Thomas <joe.thomas@shopify.com>
Co-authored-by: zak warsame <42528878+zakwarsame@users.noreply.github.com>
Co-authored-by: Chloe Rice <chloerice@users.noreply.github.com>
Co-authored-by: Marc Thomas <marc.thomas@shopify.com>
Co-authored-by: Laura Griffee <laura@mailzone.com>

.changeset/short-schools-run.md

@@ -0,0 +1,5 @@
+---
+'@shopify/polaris-tokens': minor
+---
+
+Renamed `ThemeVariant` to `Theme` and exposed `Theme` type

polaris-for-vscode/package.json

@@ -43,7 +43,7 @@
     "vscode-languageserver-textdocument": "^1.0.4"
   },
   "devDependencies": {
-    "@shopify/polaris-tokens": "^7.5.3",
+    "@shopify/polaris-tokens": "^7.6.0",
     "@types/node": "14.x",
     "@types/vscode": "^1.64.0",
     "@vscode/test-electron": "^2.1.2",

polaris-icons/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## 7.9.0
+
+### Minor Changes
+
+- [#9856](https://github.com/Shopify/polaris/pull/9856) [`47652f7d6`](https://github.com/Shopify/polaris/commit/47652f7d67f98d7bef8ef8485fae803b9f3c1056) Thanks [@heyjoethomas](https://github.com/heyjoethomas)! - Updates social media icons, removing them from their containers and adds a one for the Twitch platform.
+
 ## 7.8.1
 
 ### Patch Changes

polaris-icons/icons/FacebookMinor.yml

@@ -1,13 +1,12 @@
 name: Facebook
 set: Minor
-description:
-  Facebook logo
+description: Facebook logo
 keywords:
   - facebook
   - social media
 authors:
   - Joe Thomas
 version: 1
 date_added: 2023-07-20
-date_modified: 2023-07-20
+date_modified: 2023-07-28
 exclusive_use:

polaris-icons/icons/InstagramMinor.yml

@@ -1,13 +1,12 @@
 name: Instagram
 set: Minor
-description:
-  Instagram logo
+description: Instagram logo
 keywords:
   - instagram
   - social media
 authors:
   - Joe Thomas
 version: 1
 date_added: 2023-07-20
-date_modified: 2023-07-20
+date_modified: 2023-07-28
 exclusive_use:

polaris-icons/icons/PintrestMinor.yml

@@ -8,5 +8,5 @@ authors:
   - Joe Thomas
 version: 1
 date_added: 2023-07-20
-date_modified: 2023-07-20
+date_modified: 2023-07-28
 exclusive_use:

polaris-icons/icons/SnapchatMinor.yml

@@ -9,5 +9,5 @@ authors:
   - Joe Thomas
 version: 1
 date_added: 2023-07-20
-date_modified: 2023-07-20
+date_modified: 2023-07-28
 exclusive_use:

polaris-icons/icons/TiktokMinor.yml

@@ -9,5 +9,5 @@ authors:
   - Joe Thomas
 version: 1
 date_added: 2023-07-20
-date_modified: 2023-07-20
+date_modified: 2023-07-28
 exclusive_use:

polaris-icons/icons/TumblrMinor.yml

@@ -0,0 +1,15 @@
+name: Tumblr
+set: minor
+description:
+  Logo for Tumblr social media platform
+keywords:
+  - tumblr
+  - social media
+authors:
+  - Joe Thomas
+version: 1
+date_added: 2023-08-11
+date_modified: 2023-08-11
+# Optional: fill exclusive_use if the icon should *only* be used
+# in specific areas of the admin (such as “Orders”):
+exclusive_use:

polaris-icons/icons/TwitchMinor.yml

@@ -0,0 +1,13 @@
+name: Twitch
+set: minor
+description:
+  Logo for Twich
+keywords:
+  - Twitch
+  - Social media
+authors:
+  - Joe Thomas
+version: 1
+date_added: 2023-07-28
+date_modified: 2023-07-28
+exclusive_use:

polaris-icons/icons/TwitterMinor.yml

@@ -8,5 +8,5 @@ authors:
   - Joe Thomas
 version: 1
 date_added: 2023-07-20
-date_modified: 2023-07-20
+date_modified: 2023-07-28
 exclusive_use:

polaris-icons/icons/VimeoMinor.yml

@@ -0,0 +1,15 @@
+name: Vimeo
+set: minor
+description:
+  Logo for Vimeo social media platform
+keywords:
+  - Vimeo
+  - social media
+authors:
+  - Joe Thomas
+version: 1
+date_added: 2023-08-11
+date_modified: 2023-08-11
+# Optional: fill exclusive_use if the icon should *only* be used
+# in specific areas of the admin (such as “Orders”):
+exclusive_use:

polaris-icons/icons/YoutubeMinor.yml

@@ -8,5 +8,5 @@ authors:
   - Joe Thomas
 version: 1
 date_added: 2023-07-20
-date_modified: 2023-07-20
+date_modified: 2023-07-28
 exclusive_use:

polaris-icons/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shopify/polaris-icons",
-  "version": "7.8.1",
+  "version": "7.9.0",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Shopify Inc.",
   "main": "dist/index.js",

polaris-migrator/CHANGELOG.md

@@ -1,5 +1,29 @@
 # @shopify/polaris-migrator
 
+## 0.22.1
+
+### Patch Changes
+
+- Updated dependencies [[`5939b49cf`](https://github.com/Shopify/polaris/commit/5939b49cf4616d6994cc17095e79ba5600ca7fe4)]:
+  - @shopify/polaris-tokens@7.6.0
+  - @shopify/stylelint-polaris@14.0.1
+
+## 0.22.0
+
+### Minor Changes
+
+- [#10263](https://github.com/Shopify/polaris/pull/10263) [`67699cb88`](https://github.com/Shopify/polaris/commit/67699cb88c8a5f85a4623b403fddb444c5104b24) Thanks [@aveline](https://github.com/aveline)! - Added migration for `Button` component
+
+## 0.21.0
+
+### Minor Changes
+
+- [#10246](https://github.com/Shopify/polaris/pull/10246) [`1947b4691`](https://github.com/Shopify/polaris/commit/1947b469144f8e0567fb69f06391a3fecbfe5b11) Thanks [@kyledurand](https://github.com/kyledurand)! - Added the ability to migrate prop values
+
+### Patch Changes
+
+- [#10215](https://github.com/Shopify/polaris/pull/10215) [`e4a6d47ab`](https://github.com/Shopify/polaris/commit/e4a6d47abd338b820737fec5acb1a566c38a1913) Thanks [@aveline](https://github.com/aveline)! - Fixed a bug in the rename prop migration
+
 ## 0.20.0
 
 ### Minor Changes

polaris-migrator/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shopify/polaris-migrator",
-  "version": "0.20.0",
+  "version": "0.22.1",
   "description": "Codemod transformations to help upgrade your Polaris codebase",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Shopify <dev@shopify.com>",
@@ -36,8 +36,8 @@
     "generate": "plop"
   },
   "dependencies": {
-    "@shopify/polaris-tokens": "^7.5.3",
-    "@shopify/stylelint-polaris": "^14.0.0",
+    "@shopify/polaris-tokens": "^7.6.0",
+    "@shopify/stylelint-polaris": "^14.0.1",
     "chalk": "^4.1.0",
     "globby": "11.0.1",
     "is-git-clean": "^1.1.0",

polaris-migrator/src/migrations/react-rename-component-prop/tests/react-rename-component-prop-with-boolean.input.tsx

@@ -0,0 +1,11 @@
+import React from 'react';
+
+declare function MyComponent(props: any): JSX.Element;
+
+export function App() {
+  return (
+    <MyComponent foo="bar" booleanProp>
+      Hello world
+    </MyComponent>
+  );
+}

polaris-migrator/src/migrations/react-rename-component-prop/tests/react-rename-component-prop-with-boolean.output.tsx

@@ -0,0 +1,11 @@
+import React from 'react';
+
+declare function MyComponent(props: any): JSX.Element;
+
+export function App() {
+  return (
+    <MyComponent foo="bar" variant="boolean-prop-value">
+      Hello world
+    </MyComponent>
+  );
+}

polaris-migrator/src/migrations/react-rename-component-prop/tests/react-rename-component-prop-with-new-value.input.tsx

@@ -1,17 +1,7 @@
 import React from 'react';
 
-interface MyComponentProps {
-  prop?: string;
-  newProp?: string;
-  children?: React.ReactNode;
-}
-
-const Child = (props: {prop: string}) => <>{props.prop}</>;
-
-function MyComponent(props: MyComponentProps) {
-  const value = props.newProp ?? props.prop;
-  return <div data-prop={value}>{props.children}</div>;
-}
+declare function MyComponent(props: any): JSX.Element;
+declare function Child(props: any): JSX.Element;
 
 export function App() {
   return (

polaris-migrator/src/migrations/react-rename-component-prop/tests/react-rename-component-prop-with-new-value.output.tsx

@@ -1,21 +1,11 @@
 import React from 'react';
 
-interface MyComponentProps {
-  prop?: string;
-  newProp?: string;
-  children?: React.ReactNode;
-}
-
-const Child = (props: {prop: string}) => <>{props.prop}</>;
-
-function MyComponent(props: MyComponentProps) {
-  const value = props.newProp ?? props.prop;
-  return <div data-prop={value}>{props.children}</div>;
-}
+declare function MyComponent(props: any): JSX.Element;
+declare function Child(props: any): JSX.Element;
 
 export function App() {
   return (
-    <MyComponent newProp="new value">
+    <MyComponent newProp="new-value">
       Hello
       <Child prop="value" />
     </MyComponent>

polaris-migrator/src/migrations/react-rename-component-prop/tests/react-rename-component-prop-with-specific-value.input.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+declare function MyComponent(props: any): JSX.Element;
+
+export function App() {
+  return (
+    <>
+      <MyComponent foo="bar" prop="non-targetted-value">
+        Hello world
+      </MyComponent>
+      <MyComponent foo="bar" prop="targetted-value">
+        Hello world
+      </MyComponent>
+    </>
+  );
+}

polaris-migrator/src/migrations/react-rename-component-prop/tests/react-rename-component-prop-with-specific-value.output.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+declare function MyComponent(props: any): JSX.Element;
+
+export function App() {
+  return (
+    <>
+      <MyComponent foo="bar" variant="non-targetted-value">
+        Hello world
+      </MyComponent>
+      <MyComponent foo="bar" variant="new-targetted-value">
+        Hello world
+      </MyComponent>
+    </>
+  );
+}

polaris-migrator/src/migrations/react-rename-component-prop/tests/react-rename-component-prop.input.tsx

@@ -1,21 +1,11 @@
 import React from 'react';
 
-interface MyComponentProps {
-  prop?: string;
-  newProp?: string;
-  children?: React.ReactNode;
-}
-
-const Child = (props: {prop: string}) => <>{props.prop}</>;
-
-function MyComponent(props: MyComponentProps) {
-  const value = props.newProp || props.prop;
-  return <div data-prop={value}>{props.children}</div>;
-}
+declare function MyComponent(props: any): JSX.Element;
+declare function Child(props: any): JSX.Element;
 
 export function App() {
   return (
-    <MyComponent prop="value">
+    <MyComponent prop="value" foo="bar">
       Hello
       <Child prop="value" />
     </MyComponent>