Merge branch 'trunk' into revert-34992-revert-34396-add/order_cache

.codecov.yml

@@ -1,27 +1,46 @@
 codecov:
-  notify:
+    notify:
-    require_ci_to_pass: yes
+        require_ci_to_pass: yes
+
+ignore:
+    - '**/tests'
+    - '**/test'
+    - 'tools/**'
+    - 'packages/js/admin-e2e-tests'
+    - 'packages/js/api-core-tests'
+    - 'packages/js/create-woo-extension'
+    - 'packages/js/e2e-core-tests'
+    - 'packages/js/e2e-environment'
+    - 'packages/js/e2e-utils'
+    - 'packages/js/eslint-plugin'
+    - 'packages/js/internal-e2e-builds'
+    - 'packages/js/internal-js-tests'
+    - 'packages/js/internal-style-build'
+    - '**/*.test.*'
 
 coverage:
-  precision: 2
+    precision: 1
-  round: nearest
+    round: nearest
-  range: "50...100"
+    range: '50...80'
-
-  status:
-    project:
-      default:
-        informational: true
-    patch:
-      default:
-        informational: true
-    changes: off
 
+    status:
+        project:
+            default:
+                target: auto
+        patch:
+            default:
+                target: auto
 parsers:
-  gcov:
+    gcov:
-    branch_detection:
+        branch_detection:
-      conditional: yes
+            conditional: yes
-      loop: yes
+            loop: yes
-      method: no
+            method: no
-      macro: no
+            macro: no
 
-comment: false
+comment:
+    layout: 'reach, diff, flags, files'
+    behavior: default
+    require_changes: false
+    require_base: no
+    require_head: yes

.github/PULL_REQUEST_TEMPLATE.md

@@ -22,7 +22,9 @@ Closes # .
 
 ### How to test the changes in this Pull Request:
 
-<!-- Otherwise, please include detailed instructions on how these changes can be tested (including pre-conditions, configuration, steps to take and expected results). It may help to write your instructions using pseudocode -- as if you're telling a computer how to execute the test. -->
+<!-- Otherwise, please include detailed instructions on how these changes can be tested. Please, make sure to review and follow the guide for writing high-quality testing instructions below. -->
+
+- [ ] Have you followed the [Writing high-quality testing instructions guide](https://github.com/woocommerce/woocommerce/wiki/Writing-high-quality-testing-instructions)?
 
 1.
 2.

.github/actions/setup-woocommerce-monorepo/action.yml

@@ -32,21 +32,21 @@ runs:
               version: '^7.22.0'
 
         - name: Setup Node
-          uses: actions/setup-node@2fddd8803e2f5c9604345a0b591c3020ee971a93
+          uses: actions/setup-node@64ed1c7eab4cce3362f8c340dee64e5eaeef8f7c
           with:
               node-version-file: .nvmrc
               cache: pnpm
               registry-url: 'https://registry.npmjs.org'
 
         - name: Setup PHP
-          uses: shivammathur/setup-php@e04e1d97f0c0481c6e1ba40f8a538454fe5d7709
+          uses: shivammathur/setup-php@8e2ac35f639d3e794c1da1f28999385ab6fdf0fc
           with:
               php-version: ${{ inputs.php-version }}
               coverage: none
               tools: phpcs, sirbrillig/phpcs-changed
 
         - name: Cache Composer Dependencies
-          uses: actions/cache@fd5de65bc895cf536527842281bea11763fefd77
+          uses: actions/cache@58c146cc91c5b9e778e71775dfe9bf1442ad9a12
           with:
               path: ~/.cache/composer/files
               key: ${{ runner.os }}-php-${{ inputs.php-version }}-composer-${{ hashFiles('**/composer.lock') }}
@@ -59,7 +59,7 @@ runs:
               pnpm install ${{ steps.parse-input.outputs.INSTALL_FILTERS }}
 
         - name: Cache Build Output
-          uses: actions/cache@fd5de65bc895cf536527842281bea11763fefd77
+          uses: actions/cache@58c146cc91c5b9e778e71775dfe9bf1442ad9a12
           with:
               path: node_modules/.cache/turbo
               key: ${{ runner.os }}-build-output-${{ hashFiles('node_modules/.cache/turbo/*-meta.json') }}

.github/workflows/community-label.yml

@@ -17,14 +17,14 @@ jobs:
         name: Verify
         runs-on: ubuntu-20.04
         permissions:
-          contents: read
+            contents: read
-          pull-requests: write
+            pull-requests: write
-          issues: write
+            issues: write
         steps:
             - uses: actions/checkout@v3
 
             - name: Setup Node.js
-              uses: actions/setup-node@2fddd8803e2f5c9604345a0b591c3020ee971a93
+              uses: actions/setup-node@64ed1c7eab4cce3362f8c340dee64e5eaeef8f7c
 
             - name: Install Octokit
               run: npm --prefix .github/workflows/scripts install @octokit/action

.github/workflows/prepare-package-release.yml

@@ -14,8 +14,8 @@ jobs:
         name: Run prepare script
         runs-on: ubuntu-20.04
         permissions:
-          contents: read
+            contents: write
-          pull-requests: write
+            pull-requests: write
         steps:
             - uses: actions/checkout@v3
 

.github/workflows/pull-request-post-merge-processing.yml

@@ -1,43 +1,47 @@
-name: "Pull request post-merge processing"
+name: 'Pull request post-merge processing'
 on:
-  pull_request_target:
+    pull_request_target:
-    types: [closed]
+        types: [closed]
+        paths:
+            - 'packages/**'
+            - 'plugins/woocommerce/**'
+            - 'plugins/woocommerce-admin/**'
 
 permissions: {}
 
 jobs:
-  process-pull-request-after-merge:
+    process-pull-request-after-merge:
-    name: "Process a pull request after it's merged"
+        name: "Process a pull request after it's merged"
-    if: github.event.pull_request.merged == true
+        if: github.event.pull_request.merged == true
-    runs-on: ubuntu-20.04
+        runs-on: ubuntu-20.04
-    permissions:
+        permissions:
-      pull-requests: write
+            pull-requests: write
-    steps:
+        steps:
-      - name: "Get the action scripts"
+            - name: 'Get the action scripts'
-        run: |
+              run: |
-          scripts="assign-milestone-to-merged-pr.php add-post-merge-comment.php post-request-shared.php"
+                  scripts="assign-milestone-to-merged-pr.php add-post-merge-comment.php post-request-shared.php"
-          for script in $scripts
+                  for script in $scripts
-          do
+                  do
-            curl \
+                    curl \
-            --silent \
+                    --silent \
-            --fail \
+                    --fail \
-            --header 'Authorization: bearer ${{ secrets.GITHUB_TOKEN }}' \
+                    --header 'Authorization: bearer ${{ secrets.GITHUB_TOKEN }}' \
-            --header 'User-Agent: GitHub action to set the milestone for a pull request' \
+                    --header 'User-Agent: GitHub action to set the milestone for a pull request' \
-            --header 'Accept: application/vnd.github.v3.raw' \
+                    --header 'Accept: application/vnd.github.v3.raw' \
-            --output $script \
+                    --output $script \
-            --location "$GITHUB_API_URL/repos/${{ github.repository }}/contents/.github/workflows/scripts/$script?ref=${{ github.event.pull_request.base.ref }}"
+                    --location "$GITHUB_API_URL/repos/${{ github.repository }}/contents/.github/workflows/scripts/$script?ref=${{ github.event.pull_request.base.ref }}"
-          done
+                  done
-        env:
+              env:
-          GITHUB_API_URL: ${{ env.GITHUB_API_URL }}
+                  GITHUB_API_URL: ${{ env.GITHUB_API_URL }}
-      - name: "Install PHP"
+            - name: 'Install PHP'
-        uses: shivammathur/setup-php@v2
+              uses: shivammathur/setup-php@8e2ac35f639d3e794c1da1f28999385ab6fdf0fc
-        with:
+              with:
-          php-version: '7.4'
+                  php-version: '7.4'
-      - name: "Run the script to assign a milestone"
+            - name: 'Run the script to assign a milestone'
-        if: |
+              if: |
-          !github.event.pull_request.milestone &&
+                  !github.event.pull_request.milestone &&
-          github.event.pull_request.base.ref == 'trunk'
+                  github.event.pull_request.base.ref == 'trunk'
-        run: php assign-milestone-to-merged-pr.php
+              run: php assign-milestone-to-merged-pr.php
-        env:
+              env:
-          PULL_REQUEST_ID: ${{ github.event.pull_request.node_id }}
+                  PULL_REQUEST_ID: ${{ github.event.pull_request.node_id }}
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+                  GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/release-code-freeze.yml

@@ -30,7 +30,7 @@ jobs:
             freeze: ${{ steps.check-freeze.outputs.freeze }}
         steps:
             - name: 'Install PHP'
-              uses: shivammathur/setup-php@v2
+              uses: shivammathur/setup-php@8e2ac35f639d3e794c1da1f28999385ab6fdf0fc
               with:
                   php-version: '7.4'
 

.github/workflows/scripts/release-changelog.php

@@ -10,8 +10,8 @@ if ( getenv( 'TIME_OVERRIDE' ) ) {
 
 $base_dir = dirname( dirname( dirname( __DIR__ ) ) );
 
-// The release date is 26 days after the code freeze.
+// The release date is 22 days after the code freeze.
-$release_time = strtotime( '+26 days', $now );
+$release_time = strtotime( '+22 days', $now );
 $release_date = date( 'Y-m-d', $release_time );
 
 $readme_file    = $base_dir . '/plugins/woocommerce/readme.txt';

.github/workflows/smoke-test-daily.yml

@@ -17,11 +17,56 @@ concurrency:
 permissions: {}
 
 jobs:
+    api-tests:
+        name: API tests on nightly build
+        runs-on: ubuntu-20.04
+        permissions:
+          contents: read
+        env:
+            ALLURE_RESULTS_DIR: ${{ github.workspace }}/plugins/woocommerce/tests/api-core-tests/test-results/allure-results
+            ALLURE_REPORT_DIR: ${{ github.workspace }}/plugins/woocommerce/tests/api-core-tests/test-results/allure-report
+        steps:
+            - uses: actions/checkout@v3
+              with:
+                  ref: ${{ env.BRANCH_NAME }}
+
+            - name: Setup WooCommerce Monorepo
+              uses: ./.github/actions/setup-woocommerce-monorepo
+              with:
+                  install-filters: woocommerce
+                  build: false
+
+            - name: Run API tests.
+              working-directory: plugins/woocommerce
+              env:
+                  BASE_URL: ${{ secrets.SMOKE_TEST_URL }}
+                  USER_KEY: ${{ secrets.SMOKE_TEST_ADMIN_USER }}
+                  USER_SECRET: ${{ secrets.SMOKE_TEST_ADMIN_PASSWORD }}
+                  DEFAULT_TIMEOUT_OVERRIDE: 120000
+              run: pnpm exec playwright test --config=tests/api-core-tests/playwright.config.js hello.test.js
+
+            - name: Generate API Test report.
+              if: success() || failure()
+              working-directory: plugins/woocommerce
+              run: pnpm exec allure generate --clean ${{ env.ALLURE_RESULTS_DIR }} --output ${{ env.ALLURE_REPORT_DIR }}
+
+            - name: Archive API test report
+              if: success() || failure()
+              uses: actions/upload-artifact@v3
+              with:
+                  name: ${{ env.API_ARTIFACT }}
+                  path: |
+                      ${{ env.ALLURE_RESULTS_DIR }}
+                      ${{ env.ALLURE_REPORT_DIR }}
+                  if-no-files-found: ignore
+                  retention-days: 5
+                  
     e2e-tests:
         name: E2E tests on nightly build
         runs-on: ubuntu-20.04
         permissions:
           contents: read
+        needs: [api-tests]
         env:
             ADMIN_PASSWORD: ${{ secrets.SMOKE_TEST_ADMIN_PASSWORD }}
             ADMIN_USER: ${{ secrets.SMOKE_TEST_ADMIN_USER }}
@@ -78,52 +123,6 @@ jobs:
                   if-no-files-found: ignore
                   retention-days: 5
 
-    api-tests:
-        name: API tests on nightly build
-        runs-on: ubuntu-20.04
-        permissions:
-          contents: read
-        needs: [e2e-tests]
-        if: success() || failure()
-        env:
-            ALLURE_RESULTS_DIR: ${{ github.workspace }}/plugins/woocommerce/tests/api-core-tests/test-results/allure-results
-            ALLURE_REPORT_DIR: ${{ github.workspace }}/plugins/woocommerce/tests/api-core-tests/test-results/allure-report
-        steps:
-            - uses: actions/checkout@v3
-              with:
-                  ref: ${{ env.BRANCH_NAME }}
-
-            - name: Setup WooCommerce Monorepo
-              uses: ./.github/actions/setup-woocommerce-monorepo
-              with:
-                  install-filters: woocommerce
-                  build: false
-
-            - name: Run API tests.
-              working-directory: plugins/woocommerce
-              env:
-                  BASE_URL: ${{ secrets.SMOKE_TEST_URL }}
-                  USER_KEY: ${{ secrets.SMOKE_TEST_ADMIN_USER }}
-                  USER_SECRET: ${{ secrets.SMOKE_TEST_ADMIN_PASSWORD }}
-                  DEFAULT_TIMEOUT_OVERRIDE: 120000
-              run: pnpm exec playwright test --config=tests/api-core-tests/playwright.config.js hello.test.js
-
-            - name: Generate API Test report.
-              if: success() || failure()
-              working-directory: plugins/woocommerce
-              run: pnpm exec allure generate --clean ${{ env.ALLURE_RESULTS_DIR }} --output ${{ env.ALLURE_REPORT_DIR }}
-
-            - name: Archive API test report
-              if: success() || failure()
-              uses: actions/upload-artifact@v3
-              with:
-                  name: ${{ env.API_ARTIFACT }}
-                  path: |
-                      ${{ env.ALLURE_RESULTS_DIR }}
-                      ${{ env.ALLURE_REPORT_DIR }}
-                  if-no-files-found: ignore
-                  retention-days: 5
-
     k6-tests:
         name: k6 tests on nightly build
         runs-on: ubuntu-20.04
@@ -181,6 +180,7 @@ jobs:
         runs-on: ubuntu-20.04
         permissions:
           contents: read
+        needs: [api-tests]
         env:
             USE_WP_ENV: 1
             ALLURE_RESULTS_DIR: ${{ github.workspace }}/plugins/woocommerce/tests/e2e-pw/allure-results
@@ -256,7 +256,7 @@ jobs:
         runs-on: ubuntu-20.04
         permissions:
           contents: read
-        needs: [test-plugins, k6-tests]
+        needs: [e2e-tests, test-plugins, k6-tests]
         steps:
             - name: Create dirs
               run: |
@@ -312,7 +312,7 @@ jobs:
             ( success() || failure() ) &&
             ! github.event.pull_request.head.repo.fork
         runs-on: ubuntu-20.04
-        needs: [test-plugins, k6-tests]
+        needs: [e2e-tests, test-plugins, k6-tests]
         env:
             GITHUB_TOKEN: ${{ secrets.REPORTS_TOKEN }}
             RUN_ID: ${{ github.run_id }}

.github/workflows/syncpack.yml

@@ -1,37 +1,37 @@
 name: Synchronize Dependencies with syncpack
 on:
-  # Run whenever a pull request is updated
+    # Run whenever a pull request is updated
-  pull_request:
+    pull_request:
-    branches:
+        branches:
-      - trunk
+            - trunk
-    paths:
+        paths:
-      - '**/package.json'
+            - '**/package.json'
 
 permissions: {}
 
 jobs:
-  syncpack:
+    syncpack:
-    runs-on: ubuntu-latest
+        runs-on: ubuntu-latest
-    permissions:
+        permissions:
-      contents: read
+            contents: read
-    name: syncpack
+        name: syncpack
-    steps:
+        steps:
-      - name: 'Checkout'
+            - name: 'Checkout'
-        uses: actions/checkout@v3
+              uses: actions/checkout@v3
-      
-      - name: 'Setup node'
-        uses: actions/setup-node@v3
-        with:
-          node-version: 16
 
-      - name: 'Install Syncpack'
+            - name: 'Setup node'
-        run: npm install -g syncpack@^8.2.4
+              uses: actions/setup-node@64ed1c7eab4cce3362f8c340dee64e5eaeef8f7c
-        
+              with:
-      - name: 'List Mismatches'
+                  node-version: 16
-        run: syncpack list-mismatches
+
-        
+            - name: 'Install Syncpack'
-      - name: 'Explain Remedy'
+              run: npm install -g syncpack@^8.2.4
-        if: failure()
+
-        run: |
+            - name: 'List Mismatches'
-          echo "Dependency version mismatch detected. This can usually be fixed automatically by updating the pinned version in \`.syncpackrc\` and then running: \`pnpm run sync-dependencies\`"
+              run: syncpack list-mismatches
-          exit 1
+
+            - name: 'Explain Remedy'
+              if: failure()
+              run: |
+                  echo "Dependency version mismatch detected. This can usually be fixed automatically by updating the pinned version in \`.syncpackrc\` and then running: \`pnpm run sync-dependencies\`"
+                  exit 1

.husky/post-checkout

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+pnpm install

.syncpackrc

@@ -1,6 +1,6 @@
 {
 	"dev": true,
-	"filter": "^(?:react|react-dom|typescript|@typescript-eslint|@types/react).*$",
+	"filter": "^(?:config|react|react-dom|eslint|typescript|@typescript-eslint|@types/react).*$",
 	"indent": "\t",
 	"overrides": true,
 	"peer": true,
@@ -33,6 +33,15 @@
 				"**"
 			]
 		},
+		{
+			"dependencies": [
+				"config"
+			],
+			"packages": [
+				"**"
+			],
+			"pinVersion": "3.3.7"
+		},
 		{
 			"dependencies": [
 				"react",
@@ -51,6 +60,18 @@
 				"**"
 			],
 			"pinVersion": "^4.8.3"
+		},
+		{
+			"dependencies": [
+				"eslint"
+			],
+			"dependencyTypes": [
+				"devDependencies"
+			],
+			"packages": [
+				"**"
+			],
+			"pinVersion": "^8.32.0"
 		}
 	]
 }

bin/pre-push.sh

@@ -31,8 +31,9 @@ if [ $? -ne 0 ]; then
 	exit 1
 fi
 
-# Ensure both branches are tracked or check-changelogger-use will fail.
+# Ensure both branches are tracked or check-changelogger-use will fail. Note we pass hooksPath
-git checkout $PROTECTED_BRANCH --quiet
+# to avoid running the pre-commit hook.
-git checkout $CURRENT_BRANCH --quiet
+git -c core.hooksPath=/dev/null checkout $PROTECTED_BRANCH --quiet
+git -c core.hooksPath=/dev/null checkout $CURRENT_BRANCH --quiet
 
 php tools/monorepo/check-changelogger-use.php $PROTECTED_BRANCH $CURRENT_BRANCH

changelog.txt

@@ -1,5 +1,138 @@
 == Changelog ==
 
+= 7.4.0 2023-02-14 =
+
+**WooCommerce**
+
+* Fix - Add support for sorting by includes param. [#36215](https://github.com/woocommerce/woocommerce/pull/36215)
+* Fix - Allow product tab navigation without prompting for unsaved changes [#36235](https://github.com/woocommerce/woocommerce/pull/36235)
+* Fix - Convert HTML to blocks in product variation description [#36241](https://github.com/woocommerce/woocommerce/pull/36241)
+* Fix - Decode HTML entities in CategoryBreadcrumbs. [#36321](https://github.com/woocommerce/woocommerce/pull/36321)
+* Fix - Decode HTML entities in CategoryFieldItem. [#36367](https://github.com/woocommerce/woocommerce/pull/36367)
+* Fix - Ensure order emails are responsive in most email clients, including when the current language is RTL. [#36310](https://github.com/woocommerce/woocommerce/pull/36310)
+* Fix - Ensures product variation sort order is correctly persisted. [#36343](https://github.com/woocommerce/woocommerce/pull/36343)
+* Fix - Ensure wc_get_order() works without arguments when HPOS is enabled. [#36496](https://github.com/woocommerce/woocommerce/pull/36496)
+* Fix - Fix "Save changes?" modal saves the options after selecting the 'Discard' option [#36160](https://github.com/woocommerce/woocommerce/pull/36160)
+* Fix - Fix attributes/options lists corrupt render #36236 [#36236](https://github.com/woocommerce/woocommerce/pull/36236)
+* Fix - Fix bug when filtering for customer_id=0. [#36216](https://github.com/woocommerce/woocommerce/pull/36216)
+* Fix - Fix deprecated usage of ${var} in strings [#36439](https://github.com/woocommerce/woocommerce/pull/36439)
+* Fix - Fix edit attribute modal terms list [#36186](https://github.com/woocommerce/woocommerce/pull/36186)
+* Fix - Fixes editing of child product reviews. [#35888](https://github.com/woocommerce/woocommerce/pull/35888)
+* Fix - Fix for product filters when 'shop' page is the front page. [#36224](https://github.com/woocommerce/woocommerce/pull/36224)
+* Fix - Fix issue where attribute term dropdown was not adhering to sort order setting. [#36047](https://github.com/woocommerce/woocommerce/pull/36047)
+* Fix - Fix navigation between variations and tab selection [#36239](https://github.com/woocommerce/woocommerce/pull/36239)
+* Fix - Fix notices styling in Twenty Twenty-Three [#36475](https://github.com/woocommerce/woocommerce/pull/36475)
+* Fix - Fix overlapping header elements on product page [#36495](https://github.com/woocommerce/woocommerce/pull/36495)
+* Fix - Fix product table dropdown issue on mobile. [#36046](https://github.com/woocommerce/woocommerce/pull/36046)
+* Fix - Fix reordering list items error [#36296](https://github.com/woocommerce/woocommerce/pull/36296)
+* Fix - Fix REST API order refunds enpoint when HPOS is active, and make v2 orders endpoint compatible with HPOS [#36308](https://github.com/woocommerce/woocommerce/pull/36308)
+* Fix - Fix settings tables styles [#36531](https://github.com/woocommerce/woocommerce/pull/36531)
+* Fix - Fix tax task showing as not completed after setting up tax [#36468](https://github.com/woocommerce/woocommerce/pull/36468)
+* Fix - Fix the signature mismatch affecting wc cli commands ability to fetch user subscription data. [#36240](https://github.com/woocommerce/woocommerce/pull/36240)
+* Fix - Fix total count query of orders within Analytics reports data store. [#35971](https://github.com/woocommerce/woocommerce/pull/35971)
+* Fix - Hide Variations section when it is empty [#36202](https://github.com/woocommerce/woocommerce/pull/36202)
+* Fix - Improve accessibility of the coupon code label, in the context of the cart page. [#36247](https://github.com/woocommerce/woocommerce/pull/36247)
+* Fix - Improve the way we retrieve the alt text property for product attachments. [#35009](https://github.com/woocommerce/woocommerce/pull/35009)
+* Fix - Load wc_empty_cart function for REST API calls. [#36182](https://github.com/woocommerce/woocommerce/pull/36182)
+* Fix - Make HPOS UX more consistent with posts UI (so that same e2e tests passes for both). [#36282](https://github.com/woocommerce/woocommerce/pull/36282)
+* Fix - Make order edit messages compatible with both posts and theorder object. [#36485](https://github.com/woocommerce/woocommerce/pull/36485)
+* Fix - Make sure the tracking shortcode only operates in orders with billing information. [#33735](https://github.com/woocommerce/woocommerce/pull/33735)
+* Fix - Remove persisted query on return to parent product from variation [#36365](https://github.com/woocommerce/woocommerce/pull/36365)
+* Fix - Reset variation form if a new variation is given [#36078](https://github.com/woocommerce/woocommerce/pull/36078)
+* Fix - Restore the pre-7.2.0 behavior for single product quantity inputs. [#36460](https://github.com/woocommerce/woocommerce/pull/36460)
+* Fix - Set child orders to be children of current order parent before deleting for consistency. [#36218](https://github.com/woocommerce/woocommerce/pull/36218)
+* Fix - Skip custom search for HPOS API queries as it's handled already. [#36213](https://github.com/woocommerce/woocommerce/pull/36213)
+* Fix - Use Imagick functions to set parallel thread count instead of direct putenv call as suggested in https://core.trac.wordpress.org/ticket/36534#comment:129. [#35339](https://github.com/woocommerce/woocommerce/pull/35339)
+* Fix - When adjusting download permissions, confirm the child products have not been removed. [#36431](https://github.com/woocommerce/woocommerce/pull/36431)
+* Add - Add ability to filter variations by local attributes in REST API [#36201](https://github.com/woocommerce/woocommerce/pull/36201)
+* Add - Add an admin notice about the upcoming PHP version requirement change for PHP 7.2 users [#36444](https://github.com/woocommerce/woocommerce/pull/36444)
+* Add - Added a slot for extending the app with a homescreen header banner [#36467](https://github.com/woocommerce/woocommerce/pull/36467)
+* Add - Added a slot for ProgressHeader and ProgressTitle component [#36482](https://github.com/woocommerce/woocommerce/pull/36482)
+* Add - Add edit button to variations list items [#36079](https://github.com/woocommerce/woocommerce/pull/36079)
+* Add - Added slot for tasklist completion slotfill [#36487](https://github.com/woocommerce/woocommerce/pull/36487)
+* Add - Add endpoint to create all product variations [#35980](https://github.com/woocommerce/woocommerce/pull/35980)
+* Add - Add exit prompt CES for users editing orders when tracking is enabled. [#35762](https://github.com/woocommerce/woocommerce/pull/35762)
+* Add - Adding delayed spotlight to feedback button on current product page. [#35865](https://github.com/woocommerce/woocommerce/pull/35865)
+* Add - Adding feedback button to activity bar on classic product page. [#35810](https://github.com/woocommerce/woocommerce/pull/35810)
+* Add - Adding JS data store for ProductForm. [#36430](https://github.com/woocommerce/woocommerce/pull/36430)
+* Add - Adding the WooProductSectionItem slot within the product editor general tab. [#36331](https://github.com/woocommerce/woocommerce/pull/36331)
+* Add - Add initial product form PHP helper class to add new fields. [#36093](https://github.com/woocommerce/woocommerce/pull/36093)
+* Add - Additional error logging within the CSV Exporter framework. [#34802](https://github.com/woocommerce/woocommerce/pull/34802)
+* Add - Add multichannel marketing API [#36453](https://github.com/woocommerce/woocommerce/pull/36453)
+* Add - Add new filter to add additional clauses for SQL statement in Variations report [#36378](https://github.com/woocommerce/woocommerce/pull/36378)
+* Add - Add new product form API for extending the new Product Form MVP. [#36165](https://github.com/woocommerce/woocommerce/pull/36165)
+* Add - Add Options section to new product experience form. [#35910](https://github.com/woocommerce/woocommerce/pull/35910)
+* Add - Add product tour to new product management experience [#36428](https://github.com/woocommerce/woocommerce/pull/36428)
+* Add - Add product variation form [#36033](https://github.com/woocommerce/woocommerce/pull/36033)
+* Add - Add product variation General section [#36081](https://github.com/woocommerce/woocommerce/pull/36081)
+* Add - Add product variation header actions and persistence [#36155](https://github.com/woocommerce/woocommerce/pull/36155)
+* Add - Add product variation image [#36133](https://github.com/woocommerce/woocommerce/pull/36133)
+* Add - Add product variation navigation component [#36076](https://github.com/woocommerce/woocommerce/pull/36076)
+* Add - Add product variations flag to only show work in development [#36311](https://github.com/woocommerce/woocommerce/pull/36311)
+* Add - Add product variation title to page header [#36085](https://github.com/woocommerce/woocommerce/pull/36085)
+* Add - Add Product variation visibility toggle [#36020](https://github.com/woocommerce/woocommerce/pull/36020)
+* Add - Add single product variation sections [#36051](https://github.com/woocommerce/woocommerce/pull/36051)
+* Add - Adds support for a 'required' argument when invoking `wc_dropdown_variation_attribute_options()`. [#34579](https://github.com/woocommerce/woocommerce/pull/34579)
+* Add - Add support for sorting by order metadata in HPOS queries. [#36403](https://github.com/woocommerce/woocommerce/pull/36403)
+* Add - Add WooOnboardingTaskListHeader, woocommerce_admin_experimental_onboarding_tasklists filter, and woocommerce_onboarding_task_list_header Slot to task list [#36519](https://github.com/woocommerce/woocommerce/pull/36519)
+* Add - Include tax options in pricing section [#36299](https://github.com/woocommerce/woocommerce/pull/36299)
+* Add - Persist active tab on refresh [#36112](https://github.com/woocommerce/woocommerce/pull/36112)
+* Add - Persist variations order on product save [#36109](https://github.com/woocommerce/woocommerce/pull/36109)
+* Add - Product variation quantity status indicator [#35982](https://github.com/woocommerce/woocommerce/pull/35982)
+* Add - Product variations card should have a fixed height. [#36053](https://github.com/woocommerce/woocommerce/pull/36053)
+* Add - Remove manage_stock 'parent' value before saving the variation [#36234](https://github.com/woocommerce/woocommerce/pull/36234)
+* Add - Run ces exit prompt when product import abandoned. [#35996](https://github.com/woocommerce/woocommerce/pull/35996)
+* Add - Scroll newly added product attribute into view in new product management experience [#36447](https://github.com/woocommerce/woocommerce/pull/36447)
+* Add - Show product CES footer on product tour close [#36516](https://github.com/woocommerce/woocommerce/pull/36516)
+* Add - Truncate attribute option name to a max of 32 chars in variations list [#36134](https://github.com/woocommerce/woocommerce/pull/36134)
+* Add - Trying experimental slot context with product editor fills. [#36333](https://github.com/woocommerce/woocommerce/pull/36333)
+* Add - Using slotfill to insert attributes section in the product editor. [#36483](https://github.com/woocommerce/woocommerce/pull/36483)
+* Add - Using slotfill to insert images section in product editor. [#36461](https://github.com/woocommerce/woocommerce/pull/36461)
+* Update - Update woocommerce-blocks to 9.4.3. [#36736](https://github.com/woocommerce/woocommerce/pull/36736)
+* Update - Adding WooProductFieldItem slot to product details section. [#36315](https://github.com/woocommerce/woocommerce/pull/36315)
+* Update - Add permalink_template and generated_slug to products REST API response. [#36497](https://github.com/woocommerce/woocommerce/pull/36497)
+* Update - Auto generate variations on option changes [#36188](https://github.com/woocommerce/woocommerce/pull/36188)
+* Update - Bundled version of Action Scheduler updated to 3.5.4. [#36433](https://github.com/woocommerce/woocommerce/pull/36433)
+* Update - Customers REST API endpoint will now return user metadata only when requester has an administrator role [#36408](https://github.com/woocommerce/woocommerce/pull/36408)
+* Update - Disable irrelevant product tabs when variations exist [#35939](https://github.com/woocommerce/woocommerce/pull/35939)
+* Update - Migrate shipping section in product editor to slot fill. [#36534](https://github.com/woocommerce/woocommerce/pull/36534)
+* Update - Move product management feature flag down to experimental. [#36552](https://github.com/woocommerce/woocommerce/pull/36552)
+* Update - Reimplementing product details fields in product editor as slot fills. [#36368](https://github.com/woocommerce/woocommerce/pull/36368)
+* Update - Update api-core-tests readme to include a guide for writing tests [#35978](https://github.com/woocommerce/woocommerce/pull/35978)
+* Update - Update store-details test snapshot to reflect updated select-control [#35808](https://github.com/woocommerce/woocommerce/pull/35808)
+* Update - Update WooCommerce Blocks to 9.4.0 [#36524](https://github.com/woocommerce/woocommerce/pull/36524)
+* Update - Update WooCommerce Blocks to 9.4.1 [#36553](https://github.com/woocommerce/woocommerce/pull/36553)
+* Update - Update WooCommerce Blocks to 9.4.2 [#36624](https://github.com/woocommerce/woocommerce/pull/36624)
+* Dev - Add advanced setting option [#36380](https://github.com/woocommerce/woocommerce/pull/36380)
+* Dev - Add experimental SlotFill for task list footer [#36527](https://github.com/woocommerce/woocommerce/pull/36527)
+* Dev - Cleanup product task experiment [#35950](https://github.com/woocommerce/woocommerce/pull/35950)
+* Dev - Consistent folder structure for E2E and API test results [#35907](https://github.com/woocommerce/woocommerce/pull/35907)
+* Dev - Fix docblock type annotations for $meta_value. [#33853](https://github.com/woocommerce/woocommerce/pull/33853)
+* Dev - Fix flakiness of the `can save industry changes when navigating back to "Store Details"` E2E test. [#36260](https://github.com/woocommerce/woocommerce/pull/36260)
+* Dev - Make shopper tests passable on daily smoke test site. [#35873](https://github.com/woocommerce/woocommerce/pull/35873)
+* Dev - Move product attribute fetching logic into a separate hook [#36354](https://github.com/woocommerce/woocommerce/pull/36354)
+* Dev - Update TaskLists::add_task() to reflect changes in TaskList::add_task() [#36104](https://github.com/woocommerce/woocommerce/pull/36104)
+* Dev - Update the browserslist config for legacy client JS to match Wordpress. [#36264](https://github.com/woocommerce/woocommerce/pull/36264)
+* Dev - Upgrade PHPUnit to v8 [#36273](https://github.com/woocommerce/woocommerce/pull/36273)
+* Tweak - Corrects a typo in the i18n/states.php file, relating to our list of Iranian states. [#36457](https://github.com/woocommerce/woocommerce/pull/36457)
+* Tweak - Derive product type from product attributes [#36243](https://github.com/woocommerce/woocommerce/pull/36243)
+* Tweak - Fix typo in a function comment. [#36122](https://github.com/woocommerce/woocommerce/pull/36122)
+* Tweak - Fix units in function doc comment [#36353](https://github.com/woocommerce/woocommerce/pull/36353)
+* Tweak - Make related products check more robust against wrong transients. [#34742](https://github.com/woocommerce/woocommerce/pull/34742)
+* Tweak - Makes it possible to use an `add_meta_boxes_<SCREEN_ID>` style hook in the HPOS editor, for parity with the traditional post editor. [#35999](https://github.com/woocommerce/woocommerce/pull/35999)
+* Tweak - Minor adjustments to the ProductForm API [#36414](https://github.com/woocommerce/woocommerce/pull/36414)
+* Tweak - Redirect to new product experience when in experiment group [#36381](https://github.com/woocommerce/woocommerce/pull/36381)
+* Tweak - Refactor AttributeField into sub-components. [#35997](https://github.com/woocommerce/woocommerce/pull/35997)
+* Tweak - Update product links when new product management experience is enabled [#36382](https://github.com/woocommerce/woocommerce/pull/36382)
+* Tweak - Updates and improves the docblocks for methods WC_Order::get_total() and WC_Order::get_subtotal(). [#34385](https://github.com/woocommerce/woocommerce/pull/34385)
+* Tweak - Validation of Norweigan postcodes has been added. [#36277](https://github.com/woocommerce/woocommerce/pull/36277)
+* Performance - Speed up HPOS search query by using group by instead of distinct. [#35897](https://github.com/woocommerce/woocommerce/pull/35897)
+* Enhancement - Add context to countries shipping to prefix [#36254](https://github.com/woocommerce/woocommerce/pull/36254)
+* Enhancement - Adds new order status filters for bacs and cheque email instructions. [#35849](https://github.com/woocommerce/woocommerce/pull/35849)
+* Enhancement - Improves handling of the single product page quantity selector, in relation to variable products. [#36087](https://github.com/woocommerce/woocommerce/pull/36087)
+* Enhancement - Remove default WooCommerce button styles if using a block theme which adds button styles in theme.json [#36225](https://github.com/woocommerce/woocommerce/pull/36225)
+
+
 = 7.3.0 2023-01-10 =
 
 **WooCommerce**

package.json

@@ -51,7 +51,7 @@
 		"sass": "^1.49.9",
 		"sass-loader": "^10.2.1",
 		"syncpack": "^8.3.9",
-		"turbo": "^1.4.5",
+		"turbo": "^1.7.0",
 		"typescript": "^4.8.3",
 		"url-loader": "^1.1.2",
 		"webpack": "^5.70.0"

packages/js/admin-e2e-tests/changelog/dev-consolidate-eslint-versions

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Update eslint to 8.32.0 across the monorepo.

packages/js/admin-e2e-tests/changelog/update-bump-config

@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Unify semver range for `config@3.3.7` (from `^3.3.7`). Fix `node_env_var_name is not defined` error.

packages/js/admin-e2e-tests/package.json

@@ -29,7 +29,7 @@
 		"@jest/globals": "^27.5.1",
 		"@types/jest": "^27.4.1",
 		"@woocommerce/e2e-utils": "workspace:*",
-		"config": "^3.3.7"
+		"config": "3.3.7"
 	},
 	"peerDependencies": {
 		"@woocommerce/e2e-environment": "^0.2.3 || ^0.3.0",
@@ -44,7 +44,7 @@
 		"@typescript-eslint/eslint-plugin": "^5.43.0",
 		"@woocommerce/api": "^0.2.0",
 		"@woocommerce/eslint-plugin": "workspace:*",
-		"eslint": "^8.12.0",
+		"eslint": "^8.32.0",
 		"jest": "^27.5.1",
 		"jest-cli": "^27.5.1",
 		"jest-mock-extended": "^1.0.18",

packages/js/api-core-tests/package.json

@@ -36,7 +36,7 @@
 	},
 	"devDependencies": {
 		"@woocommerce/eslint-plugin": "workspace:*",
-		"eslint": "^8.12.0"
+		"eslint": "^8.32.0"
 	},
 	"publishConfig": {
 		"access": "public"

packages/js/api/changelog/dev-consolidate-eslint-versions

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Update eslint to 8.32.0 across the monorepo.

packages/js/api/package.json

@@ -55,7 +55,7 @@
 		"@typescript-eslint/parser": "^5.43.0",
 		"@woocommerce/eslint-plugin": "workspace:*",
 		"axios-mock-adapter": "^1.20.0",
-		"eslint": "^8.2.0",
+		"eslint": "^8.32.0",
 		"jest": "^27",
 		"ts-jest": "^27",
 		"typescript": "^4.8.3"

packages/js/components/changelog/add-35851-tree-control-expander

@@ -0,0 +1,4 @@
+Significance: minor
+Type: dev
+
+Add TreeControl expand/collapse functionality.

packages/js/components/changelog/add-36248-added-flexibility-to-plugins

@@ -0,0 +1,4 @@
+Significance: minor
+Type: add
+
+Added LearnMore option as well as made it possible to use this button multiple instances on the page

packages/js/components/changelog/add-36355_new_product_editor_package

@@ -0,0 +1,4 @@
+Significance: minor
+Type: update
+
+Move experimental product section components to @woocommerce/product-editor package.

packages/js/components/changelog/canceled

@@ -1,4 +0,0 @@
-Significance: minor
-Type: tweak
-
-Update spelling of Cancelled to Canceled for US English.

packages/js/components/changelog/dev-consolidate-eslint-versions

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Update eslint to 8.32.0 across the monorepo.

packages/js/components/changelog/fix-36614_refactor_create_ordered_children

@@ -1,4 +1,4 @@
 Significance: minor
 Type: fix
 
-Fix settings tables styles
+Refactor createOrderedChildren

packages/js/components/changelog/fix-create_ordered_children

@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Fix issue were Options tab was not showing up anymore in new product management screen.

packages/js/components/changelog/fix-experimental-tree-control-styles

@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Include CSS for experimental tree control so it renders properly in Storybook.

packages/js/components/changelog/fix-select-control-style

@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Fix SelectControl and TreeControl styles.

packages/js/components/changelog/fix-setstate-diff-component

@@ -0,0 +1,5 @@
+Significance: patch
+Type: fix
+Comment: Move registerFill call to inside an useEffect since it was updating a component while rendering another component
+
+

packages/js/components/changelog/try-support-multiple-fills

@@ -0,0 +1,4 @@
+Significance: minor
+Type: update
+
+Updating the product editor fill components to support multiple targets.

packages/js/components/changelog/update-36610-support-variations-alternate

@@ -0,0 +1,4 @@
+Significance: minor
+Type: update
+
+Updating WooProductFieldItem to uniquely generate IDs with different sections.

packages/js/components/changelog/update-product_editor_packages

@@ -0,0 +1,4 @@
+Significance: minor
+Type: update
+
+Add deprecated message to packages moved to product-editor package.

packages/js/components/package.json

@@ -44,6 +44,7 @@
 		"@woocommerce/navigation": "workspace:*",
 		"@wordpress/a11y": "3.5.0",
 		"@wordpress/api-fetch": "^6.0.1",
+		"@wordpress/base-styles": "^4.3.0",
 		"@wordpress/block-editor": "^9.8.0",
 		"@wordpress/block-library": "^7.16.0",
 		"@wordpress/blocks": "^11.18.0",
@@ -129,7 +130,7 @@
 		"@wordpress/scripts": "^12.6.1",
 		"concurrently": "^7.0.0",
 		"css-loader": "^3.6.0",
-		"eslint": "^8.12.0",
+		"eslint": "^8.32.0",
 		"jest": "^27.5.1",
 		"jest-cli": "^27.5.1",
 		"postcss-loader": "^3.0.0",
@@ -164,5 +165,11 @@
 			"pnpm lint:fix",
 			"pnpm test-staged"
 		]
+	},
+	"pnpm": {
+		"overrides": {
+			"react": "^17.0.2",
+			"react-dom": "^17.0.2"
+		}
 	}
 }

packages/js/components/src/experimental-tree-control/hooks/use-expander.ts

@@ -0,0 +1,31 @@
+/**
+ * External dependencies
+ */
+import { useEffect, useState } from 'react';
+
+/**
+ * Internal dependencies
+ */
+import { TreeItemProps } from '../types';
+
+export function useExpander( {
+	shouldItemBeExpanded,
+	item,
+}: Pick< TreeItemProps, 'shouldItemBeExpanded' | 'item' > ) {
+	const [ isExpanded, setExpanded ] = useState( false );
+
+	useEffect( () => {
+		if (
+			item.children?.length &&
+			typeof shouldItemBeExpanded === 'function'
+		) {
+			setExpanded( shouldItemBeExpanded( item ) );
+		}
+	}, [ item, shouldItemBeExpanded ] );
+
+	function onToggleExpand() {
+		setExpanded( ( prev ) => ! prev );
+	}
+
+	return { isExpanded, onToggleExpand };
+}

packages/js/components/src/experimental-tree-control/hooks/use-tree-item.ts

@@ -1,30 +1,43 @@
 /**
  * External dependencies
  */
+import React from 'react';
 
 /**
  * Internal dependencies
  */
 import { TreeItemProps } from '../types';
+import { useExpander } from './use-expander';
 
-export function useTreeItem( { item, level, ...props }: TreeItemProps ) {
+export function useTreeItem( {
+	item,
+	level,
+	shouldItemBeExpanded,
+	...props
+}: TreeItemProps ) {
 	const nextLevel = level + 1;
-	const nextHeadingPaddingLeft = ( level - 1 ) * 28 + 12;
+
+	const expander = useExpander( {
+		item,
+		shouldItemBeExpanded,
+	} );
 
 	return {
 		item,
 		level: nextLevel,
+		expander,
 		treeItemProps: {
 			...props,
 		},
 		headingProps: {
 			style: {
-				paddingLeft: nextHeadingPaddingLeft,
+				'--level': level,
-			},
+			} as React.CSSProperties,
 		},
 		treeProps: {
 			items: item.children,
 			level: nextLevel,
+			shouldItemBeExpanded,
 		},
 	};
 }

packages/js/components/src/experimental-tree-control/hooks/use-tree.ts

@@ -7,7 +7,13 @@
  */
 import { TreeProps } from '../types';
 
-export function useTree( { ref, items, level = 1, ...props }: TreeProps ) {
+export function useTree( {
+	ref,
+	items,
+	level = 1,
+	shouldItemBeExpanded,
+	...props
+}: TreeProps ) {
 	return {
 		level,
 		items,
@@ -16,6 +22,7 @@ export function useTree( { ref, items, level = 1, ...props }: TreeProps ) {
 		},
 		treeItemProps: {
 			level,
+			shouldItemBeExpanded,
 		},
 	};
 }

packages/js/components/src/experimental-tree-control/stories/index.tsx

@@ -1,14 +1,14 @@
 /**
  * External dependencies
  */
-import { BaseControl } from '@wordpress/components';
+import { BaseControl, TextControl } from '@wordpress/components';
-import React, { createElement } from 'react';
+import React, { createElement, useCallback, useState } from 'react';
 
 /**
  * Internal dependencies
  */
 import { TreeControl } from '../tree-control';
-import { Item } from '../types';
+import { Item, LinkedTree } from '../types';
 
 const listItems: Item[] = [
 	{ value: '1', label: 'Technology' },
@@ -36,6 +36,35 @@ export const SimpleTree: React.FC = () => {
 	);
 };
 
+function shouldItemBeExpanded( item: LinkedTree, filter: string ) {
+	if ( ! filter || ! item.children?.length ) return false;
+	return item.children.some( ( child ) => {
+		if ( new RegExp( filter, 'ig' ).test( child.data.label ) ) {
+			return true;
+		}
+		return shouldItemBeExpanded( child, filter );
+	} );
+}
+
+export const ExpandOnFilter: React.FC = () => {
+	const [ filter, setFilter ] = useState( '' );
+
+	return (
+		<>
+			<TextControl value={ filter } onChange={ setFilter } />
+			<BaseControl label="Expand on filter" id="expand-on-filter">
+				<TreeControl
+					id="expand-on-filter"
+					items={ listItems }
+					shouldItemBeExpanded={ ( item ) =>
+						shouldItemBeExpanded( item, filter )
+					}
+				/>
+			</BaseControl>
+		</>
+	);
+};
+
 export default {
 	title: 'WooCommerce Admin/experimental/TreeControl',
 	component: TreeControl,

packages/js/components/src/experimental-tree-control/tree-item.scss

@@ -6,7 +6,7 @@
 		flex-grow: 1;
 		gap: $gap-smaller;
 		min-height: $gap-largest;
-		padding: 0 $gap-small;
+		padding: 0 $gap-small 0 calc( ( var( --level ) - 1 ) * ( $gap + $gap-small ) + $gap-small );
 		border-radius: 2px;
 
 		&:hover,
@@ -17,7 +17,7 @@
 
 		&:hover,
 		&:focus-within {
-			background-color: $gray-0;
+			background-color: $gray-100;
 		}
 	}
 	&__label {
@@ -31,4 +31,12 @@
 			display: block;
 		}
 	}
+	&__expander {
+		display: flex;
+		align-items: center;
+
+		.components-button {
+			padding: 0;
+		}
+	}
 }

packages/js/components/src/experimental-tree-control/tree-item.tsx

@@ -1,7 +1,9 @@
 /**
  * External dependencies
  */
+import { Button } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
+import { chevronDown, chevronUp } from '@wordpress/icons';
 import classNames from 'classnames';
 import { createElement, forwardRef } from 'react';
 
@@ -16,7 +18,13 @@ export const TreeItem = forwardRef( function ForwardedTreeItem(
 	props: TreeItemProps,
 	ref: React.ForwardedRef< HTMLLIElement >
 ) {
-	const { item, treeItemProps, headingProps, treeProps } = useTreeItem( {
+	const {
+		item,
+		treeItemProps,
+		headingProps,
+		treeProps,
+		expander: { isExpanded, onToggleExpand },
+	} = useTreeItem( {
 		...props,
 		ref,
 	} );
@@ -36,9 +44,26 @@ export const TreeItem = forwardRef( function ForwardedTreeItem(
 				<div className="experimental-woocommerce-tree-item__label">
 					<span>{ item.data.label }</span>
 				</div>
+
+				{ Boolean( item.children?.length ) && (
+					<div className="experimental-woocommerce-tree-item__expander">
+						<Button
+							icon={ isExpanded ? chevronUp : chevronDown }
+							onClick={ onToggleExpand }
+							className="experimental-woocommerce-tree-item__expander"
+							aria-label={
+								isExpanded
+									? __( 'Collapse', 'woocommerce' )
+									: __( 'Expand', 'woocommerce' )
+							}
+						/>
+					</div>
+				) }
 			</div>
 
-			{ Boolean( item.children.length ) && <Tree { ...treeProps } /> }
+			{ Boolean( item.children.length ) && isExpanded && (
+				<Tree { ...treeProps } />
+			) }
 		</li>
 	);
 } );

packages/js/components/src/experimental-tree-control/types.ts

@@ -16,6 +16,21 @@ export type TreeProps = React.DetailedHTMLProps<
 > & {
 	level?: number;
 	items: LinkedTree[];
+	/**
+	 * Return if the tree item passed in should be expanded.
+	 *
+	 * @example
+	 * <Tree
+	 * 	shouldItemBeExpanded={
+	 * 		( item ) => checkExpanded( item, filter )
+	 * 	}
+	 * />
+	 *
+	 * @param  item The tree item to determine if should be expanded.
+	 *
+	 * @see {@link LinkedTree}
+	 */
+	shouldItemBeExpanded?( item: LinkedTree ): boolean;
 };
 
 export type TreeItemProps = React.DetailedHTMLProps<
@@ -24,6 +39,7 @@ export type TreeItemProps = React.DetailedHTMLProps<
 > & {
 	level: number;
 	item: LinkedTree;
+	shouldItemBeExpanded?( item: LinkedTree ): boolean;
 };
 
 export type TreeControlProps = Omit< TreeProps, 'items' | 'level' > & {

packages/js/components/src/index.ts

@@ -88,10 +88,6 @@ export { createOrderedChildren, sortFillsByOrder } from './utils';
 export { WooProductFieldItem as __experimentalWooProductFieldItem } from './woo-product-field-item';
 export { WooProductSectionItem as __experimentalWooProductSectionItem } from './woo-product-section-item';
 export { WooProductTabItem as __experimentalWooProductTabItem } from './woo-product-tab-item';
-export {
-	ProductSectionLayout as __experimentalProductSectionLayout,
-	ProductFieldSection as __experimentalProductFieldSection,
-} from './product-section-layout';
 export * from './product-fields';
 export {
 	SlotContextProvider,
@@ -99,3 +95,9 @@ export {
 	SlotContextType,
 	SlotContextHelpersType,
 } from './slot-context';
+
+// Exports below can be removed once the @woocommerce/product-editor package is released.
+export {
+	ProductSectionLayout as __experimentalProductSectionLayout,
+	ProductFieldSection as __experimentalProductFieldSection,
+} from './product-section-layout';

packages/js/components/src/plugins/index.tsx

@@ -9,7 +9,7 @@ import {
 	useState,
 	useEffect,
 } from '@wordpress/element';
-import { SyntheticEvent } from 'react';
+import { SyntheticEvent, useCallback } from 'react';
 import { useDispatch, useSelect } from '@wordpress/data';
 import { PLUGINS_STORE_NAME, InstallPluginsResponse } from '@woocommerce/data';
 
@@ -25,6 +25,11 @@ type PluginsProps = {
 	pluginSlugs?: string[];
 	onAbort?: () => void;
 	abortText?: string;
+	installText?: string;
+	installButtonVariant?: Button.BaseProps[ 'variant' ];
+	learnMoreLink?: string;
+	learnMoreText?: string;
+	onLearnMore?: () => void;
 };
 
 export const Plugins = ( {
@@ -34,10 +39,17 @@ export const Plugins = ( {
 	onError = () => null,
 	pluginSlugs = [ 'jetpack', 'woocommerce-services' ],
 	onSkip,
+	installText = __( 'Install & enable', 'woocommerce' ),
 	skipText = __( 'No thanks', 'woocommerce' ),
 	abortText = __( 'Abort', 'woocommerce' ),
+	installButtonVariant = 'primary',
+	learnMoreLink,
+	learnMoreText = __( 'Learn more', 'woocommerce' ),
+	onLearnMore,
 }: PluginsProps ) => {
 	const [ hasErrors, setHasErrors ] = useState( false );
+	// Tracks action so that multiple instances of this button don't all light up when one is clicked
+	const [ hasBeenClicked, setHasBeenClicked ] = useState( false );
 	const { installAndActivatePlugins } = useDispatch( PLUGINS_STORE_NAME );
 	const { isRequesting } = useSelect( ( select ) => {
 		const { getActivePlugins, getInstalledPlugins, isPluginsRequesting } =
@@ -52,48 +64,56 @@ export const Plugins = ( {
 		};
 	} );
 
-	const handleErrors = (
+	const handleErrors = useCallback(
-		errors: unknown,
+		( errors: unknown, response: InstallPluginsResponse ) => {
-		response: InstallPluginsResponse
+			setHasErrors( true );
-	) => {
-		setHasErrors( true );
 
-		onError( errors, response );
+			onError( errors, response );
-	};
+		},
+		[ onError ]
+	);
 
-	const handleSuccess = (
+	const handleSuccess = useCallback(
-		plugins: string[],
+		( plugins: string[], response: InstallPluginsResponse ) => {
-		response: InstallPluginsResponse
+			onComplete( plugins, response );
-	) => {
+		},
-		onComplete( plugins, response );
+		[ onComplete ]
-	};
+	);
 
-	const installAndActivate = async (
+	const installAndActivate = useCallback(
-		event?: SyntheticEvent< HTMLAnchorElement >
+		async ( event?: SyntheticEvent< HTMLAnchorElement > ) => {
-	) => {
+			if ( event ) {
-		if ( event ) {
+				event.preventDefault();
-			event.preventDefault();
+			}
-		}
 
-		// Avoid double activating.
+			// Avoid double activating.
-		if ( isRequesting ) {
+			if ( isRequesting ) {
-			return false;
+				return false;
-		}
+			}
 
-		installAndActivatePlugins( pluginSlugs )
+			installAndActivatePlugins( pluginSlugs )
-			.then( ( response ) => {
+				.then( ( response ) => {
-				handleSuccess( response.data.activated, response );
+					handleSuccess( response.data.activated, response );
-			} )
+				} )
-			.catch( ( response ) => {
+				.catch( ( response ) => {
-				handleErrors( response.errors, response );
+					setHasBeenClicked( false );
-			} );
+					handleErrors( response.errors, response );
-	};
+				} );
+		},
+		[
+			handleErrors,
+			handleSuccess,
+			installAndActivatePlugins,
+			isRequesting,
+			pluginSlugs,
+		]
+	);
 
 	useEffect( () => {
 		if ( autoInstall ) {
 			installAndActivate();
 		}
-	}, [] );
+	}, [ autoInstall, installAndActivate ] );
 
 	if ( hasErrors ) {
 		return (
@@ -131,17 +151,32 @@ export const Plugins = ( {
 	return (
 		<>
 			<Button
-				isBusy={ isRequesting }
+				isBusy={ isRequesting && hasBeenClicked }
-				isPrimary
+				variant={
-				onClick={ installAndActivate }
+					isRequesting && hasBeenClicked
+						? 'primary' // set to primary when busy, the other variants look weird when combined with isBusy
+						: installButtonVariant
+				}
+				disabled={ isRequesting && hasBeenClicked }
+				onClick={ () => {
+					setHasBeenClicked( true );
+					installAndActivate();
+				} }
 			>
-				{ __( 'Install & enable', 'woocommerce' ) }
+				{ installText }
 			</Button>
 			{ onSkip && (
 				<Button isTertiary onClick={ onSkip }>
 					{ skipText }
 				</Button>
 			) }
+			{ learnMoreLink && (
+				<a href={ learnMoreLink } target="_blank" rel="noreferrer">
+					<Button isTertiary onClick={ onLearnMore }>
+						{ learnMoreText }
+					</Button>
+				</a>
+			) }
 			{ onAbort && (
 				<Button isTertiary onClick={ onAbort }>
 					{ abortText }

packages/js/components/src/product-section-layout/product-field-section.tsx

@@ -3,6 +3,7 @@
  */
 import { createElement } from '@wordpress/element';
 import { Card, CardBody } from '@wordpress/components';
+import deprecated from '@wordpress/deprecated';
 
 /**
  * Internal dependencies
@@ -23,17 +24,24 @@ export const ProductFieldSection: React.FC< ProductFieldSectionProps > = ( {
 	description,
 	className,
 	children,
-} ) => (
+} ) => {
-	<ProductSectionLayout
+	deprecated( `__experimentalProductFieldSection`, {
-		title={ title }
+		version: '13.0.0',
-		description={ description }
+		plugin: '@woocommerce/components',
-		className={ className }
+		hint: 'Moved to @woocommerce/product-editor package: import { __experimentalProductFieldSection } from @woocommerce/product-editor',
-	>
+	} );
-		<Card>
+	return (
-			<CardBody>
+		<ProductSectionLayout
-				{ children }
+			title={ title }
-				<WooProductFieldItem.Slot section={ id } />
+			description={ description }
-			</CardBody>
+			className={ className }
-		</Card>
+		>
-	</ProductSectionLayout>
+			<Card>
-);
+				<CardBody>
+					{ children }
+					<WooProductFieldItem.Slot section={ id } />
+				</CardBody>
+			</Card>
+		</ProductSectionLayout>
+	);
+};

packages/js/components/src/product-section-layout/product-section-layout.tsx

@@ -2,7 +2,7 @@
  * External dependencies
  */
 import { Children, isValidElement, createElement } from '@wordpress/element';
-
+import deprecated from '@wordpress/deprecated';
 /**
  * Internal dependencies
  */
@@ -19,17 +19,26 @@ export const ProductSectionLayout: React.FC< ProductSectionLayoutProps > = ( {
 	description,
 	className,
 	children,
-} ) => (
+} ) => {
-	<FormSection
+	deprecated( `__experimentalProductSectionLayout`, {
-		title={ title }
+		version: '13.0.0',
-		description={ description }
+		plugin: '@woocommerce/components',
-		className={ className }
+		hint: 'Moved to @woocommerce/product-editor package: import { __experimentalProductSectionLayout } from @woocommerce/product-editor',
-	>
+	} );
-		{ Children.map( children, ( child ) => {
+	return (
-			if ( isValidElement( child ) && child.props.onChange ) {
+		<FormSection
-				return <div className="product-field-layout">{ child }</div>;
+			title={ title }
-			}
+			description={ description }
-			return child;
+			className={ className }
-		} ) }
+		>
-	</FormSection>
+			{ Children.map( children, ( child ) => {
-);
+				if ( isValidElement( child ) && child.props.onChange ) {
+					return (
+						<div className="product-field-layout">{ child }</div>
+					);
+				}
+				return child;
+			} ) }
+		</FormSection>
+	);
+};

packages/js/components/src/style.scss

@@ -55,4 +55,5 @@
 @import 'tour-kit/style.scss';
 @import 'collapsible-content/style.scss';
 @import 'form/style.scss';
+@import 'experimental-tree-control/tree.scss';
 @import 'product-section-layout/style.scss';

packages/js/components/src/utils.tsx

@@ -5,12 +5,58 @@ import { isValidElement, Fragment } from 'react';
 import { Slot, Fill } from '@wordpress/components';
 import { cloneElement, createElement } from '@wordpress/element';
 
+type ChildrenProps = {
+	order: number;
+};
+
+/**
+ * Returns an object with the children and props that will be used by `cloneElement`. They will change depending on the
+ * type of children passed in.
+ *
+ * @param {Node}   children    - Node children.
+ * @param {number} order       - Node order.
+ * @param {Array}  props       - Fill props.
+ * @param {Object} injectProps - Props to inject.
+ * @return {Object} Object with the keys: children and props.
+ */
+function getChildrenAndProps< T = Fill.Props, S = Record< string, unknown > >(
+	children: React.ReactNode,
+	order: number,
+	props: T,
+	injectProps?: S
+) {
+	if ( typeof children === 'function' ) {
+		return {
+			children: children( { ...props, order, ...injectProps } ),
+			props: { order, ...injectProps },
+		};
+	} else if ( isValidElement( children ) ) {
+		// This checks whether 'children' is a react element or a standard HTML element.
+		if ( typeof children?.type === 'function' ) {
+			return {
+				children,
+				props: {
+					...props,
+					order,
+					...injectProps,
+				},
+			};
+		}
+		return {
+			children: children as React.ReactElement< ChildrenProps >,
+			props: { order, ...injectProps },
+		};
+	}
+	throw Error( 'Invalid children type' );
+}
+
 /**
  * Ordered fill item.
  *
- * @param {Node}   children - Node children.
+ * @param {Node}   children    - Node children.
- * @param {number} order    - Node order.
+ * @param {number} order       - Node order.
- * @param {Array}  props    - Fill props.
+ * @param {Array}  props       - Fill props.
+ * @param {Object} injectProps - Props to inject.
  * @return {Node} Node.
  */
 function createOrderedChildren< T = Fill.Props, S = Record< string, unknown > >(
@@ -19,15 +65,9 @@ function createOrderedChildren< T = Fill.Props, S = Record< string, unknown > >(
 	props: T,
 	injectProps?: S
 ) {
-	if ( typeof children === 'function' ) {
+	const { children: childrenToRender, props: propsToRender } =
-		return cloneElement( children( { ...props, order, ...injectProps } ), {
+		getChildrenAndProps( children, order, props, injectProps );
-			order,
+	return cloneElement( childrenToRender, propsToRender );
-			...injectProps,
-		} );
-	} else if ( isValidElement( children ) ) {
-		return cloneElement( children, { ...props, order, ...injectProps } );
-	}
-	throw Error( 'Invalid children type' );
 }
 export { createOrderedChildren };
 

packages/js/components/src/woo-product-field-item/woo-product-field-item.tsx

@@ -1,54 +1,94 @@
 /**
  * External dependencies
  */
-import React from 'react';
+import React, { useEffect } from 'react';
 import { Slot, Fill } from '@wordpress/components';
-import { createElement, Children } from '@wordpress/element';
+import { createElement, Children, Fragment } from '@wordpress/element';
 
 /**
  * Internal dependencies
  */
 import { createOrderedChildren, sortFillsByOrder } from '../utils';
 import { useSlotContext, SlotContextHelpersType } from '../slot-context';
+import { ProductFillLocationType } from '../woo-product-tab-item';
 
 type WooProductFieldItemProps = {
 	id: string;
-	section: string;
+	sections: ProductFillLocationType[];
 	pluginId: string;
-	order?: number;
 };
 
 type WooProductFieldSlotProps = {
 	section: string;
 };
 
-export const WooProductFieldItem: React.FC< WooProductFieldItemProps > & {
+type WooProductFieldFillProps = {
-	Slot: React.FC< Slot.Props & WooProductFieldSlotProps >;
+	fieldName: string;
-} = ( { children, order = 20, section, id } ) => {
+	sectionName: string;
+	order: number;
+	children?: React.ReactNode;
+};
+
+const WooProductFieldFill: React.FC< WooProductFieldFillProps > = ( {
+	fieldName,
+	sectionName,
+	order,
+	children,
+} ) => {
 	const { registerFill, getFillHelpers } = useSlotContext();
 
-	registerFill( id );
+	const fieldId = `product_field/${ sectionName }/${ fieldName }`;
+
+	useEffect( () => {
+		registerFill( fieldId );
+	}, [] );
 
 	return (
-		<Fill name={ `woocommerce_product_field_${ section }` }>
+		<Fill
-			{ ( fillProps: Fill.Props ) => {
+			name={ `woocommerce_product_field_${ sectionName }` }
-				return createOrderedChildren<
+			key={ fieldId }
-					Fill.Props & SlotContextHelpersType,
+		>
+			{ ( fillProps: Fill.Props ) =>
+				createOrderedChildren<
+					Fill.Props &
+						SlotContextHelpersType & {
+							sectionName: string;
+						},
 					{ _id: string }
 				>(
 					children,
 					order,
 					{
+						sectionName,
 						...fillProps,
 						...getFillHelpers(),
 					},
-					{ _id: id }
+					{ _id: fieldId }
-				);
+				)
-			} }
+			}
 		</Fill>
 	);
 };
 
+export const WooProductFieldItem: React.FC< WooProductFieldItemProps > & {
+	Slot: React.FC< Slot.Props & WooProductFieldSlotProps >;
+} = ( { children, sections, id } ) => {
+	return (
+		<>
+			{ sections.map( ( { name: sectionName, order = 20 } ) => (
+				<WooProductFieldFill
+					fieldName={ id }
+					sectionName={ sectionName }
+					order={ order }
+					key={ sectionName }
+				>
+					{ children }
+				</WooProductFieldFill>
+			) ) }
+		</>
+	);
+};
+
 WooProductFieldItem.Slot = ( { fillProps, section } ) => {
 	// eslint-disable-next-line react-hooks/rules-of-hooks
 	const { filterRegisteredFills } = useSlotContext();

packages/js/components/src/woo-product-section-item/woo-product-section-item.tsx

@@ -3,41 +3,51 @@
  */
 import React from 'react';
 import { Slot, Fill } from '@wordpress/components';
-import { createElement } from '@wordpress/element';
+import { createElement, Fragment } from '@wordpress/element';
 
 /**
  * Internal dependencies
  */
 import { createOrderedChildren, sortFillsByOrder } from '../utils';
+import { ProductFillLocationType } from '../woo-product-tab-item';
 
 type WooProductSectionItemProps = {
 	id: string;
-	location: string;
+	tabs: ProductFillLocationType[];
 	pluginId: string;
-	order?: number;
 };
 
-type WooProductFieldSlotProps = {
+type WooProductSectionSlotProps = {
-	location: string;
+	tab: string;
 };
 
 export const WooProductSectionItem: React.FC< WooProductSectionItemProps > & {
-	Slot: React.FC< Slot.Props & WooProductFieldSlotProps >;
+	Slot: React.FC< Slot.Props & WooProductSectionSlotProps >;
-} = ( { children, order = 20, location } ) => (
+} = ( { children, tabs } ) => {
-	<Fill name={ `woocommerce_product_section_${ location }` }>
+	return (
-		{ ( fillProps: Fill.Props ) => {
+		<>
-			return createOrderedChildren< Fill.Props >(
+			{ tabs.map( ( { name: tabName, order: tabOrder } ) => (
-				children,
+				<Fill
-				order,
+					name={ `woocommerce_product_section_${ tabName }` }
-				fillProps
+					key={ tabName }
-			);
+				>
-		} }
+					{ ( fillProps: Fill.Props ) => {
-	</Fill>
+						return createOrderedChildren<
-);
+							Fill.Props & { tabName: string }
+						>( children, tabOrder || 20, {
+							tabName,
+							...fillProps,
+						} );
+					} }
+				</Fill>
+			) ) }
+		</>
+	);
+};
 
-WooProductSectionItem.Slot = ( { fillProps, location } ) => (
+WooProductSectionItem.Slot = ( { fillProps, tab } ) => (
 	<Slot
-		name={ `woocommerce_product_section_${ location }` }
+		name={ `woocommerce_product_section_${ tab }` }
 		fillProps={ fillProps }
 	>
 		{ ( fills ) => {

packages/js/components/src/woo-product-tab-item/woo-product-tab-item.tsx

@@ -10,16 +10,16 @@ import { createElement, Fragment } from '@wordpress/element';
  */
 import { createOrderedChildren } from '../utils';
 
+export type ProductFillLocationType = { name: string; order?: number };
+
 type WooProductTabItemProps = {
 	id: string;
 	pluginId: string;
-	template?: string;
-	order?: number;
 	tabProps:
 		| TabPanel.Tab
 		// eslint-disable-next-line @typescript-eslint/no-explicit-any
 		| ( ( fillProps: Record< string, any > | undefined ) => TabPanel.Tab );
-	templates?: Array< { name: string; order?: number } >;
+	templates?: Array< ProductFillLocationType >;
 };
 
 type WooProductFieldSlotProps = {
@@ -34,15 +34,12 @@ export const WooProductTabItem: React.FC< WooProductTabItemProps > & {
 	Slot: React.VFC<
 		Omit< Slot.Props, 'children' > & WooProductFieldSlotProps
 	>;
-} = ( { children, order, template, tabProps, templates } ) => {
+} = ( { children, tabProps, templates } ) => {
-	if ( ! template && ! templates ) {
+	if ( ! templates ) {
 		// eslint-disable-next-line no-console
-		console.warn(
+		console.warn( 'WooProductTabItem fill is missing templates property.' );
-			'WooProductTabItem fill is missing template or templates property.'
-		);
 		return null;
 	}
-	templates = templates || [ { name: template as string, order } ];
 	return (
 		<>
 			{ templates.map( ( templateData ) => (
@@ -77,7 +74,8 @@ WooProductTabItem.Slot = ( { fillProps, template, children } ) => (
 		{ ( fills ) => {
 			const tabData = fills.reduce(
 				( { childrenMap, tabs }, fill ) => {
-					const props: WooProductTabItemProps = fill[ 0 ].props;
+					const props: WooProductTabItemProps & { order: number } =
+						fill[ 0 ].props;
 					if ( props && props.tabProps ) {
 						childrenMap[ props.tabProps.name ] = fill[ 0 ];
 						const tabProps =

packages/js/create-woo-extension/CHANGELOG.md

@@ -2,6 +2,12 @@
 
 This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.0.2](https://www.npmjs.com/package/@woocommerce/create-woo-extension/v/1.0.2) - 2023-02-13 
+
+-   Patch - Add examples of Woo components package [#36732]
+-   Patch - bump WooCommerce version [#36732]
+-   Patch - Update readme [#36732]
+
 ## [1.0.1](https://www.npmjs.com/package/@woocommerce/create-woo-extension/v/1.0.1) - 2022-12-20 
 
 -   Patch - Fix install scripts [#34385]

packages/js/create-woo-extension/changelog/dev-woo-ext-components

@@ -1,4 +0,0 @@
-Significance: patch
-Type: add
-
-Add examples of Woo components package

packages/js/create-woo-extension/changelog/php-cleanup

@@ -1,3 +0,0 @@
-Significance: patch
-Type: dev
-Comment: Just some PHP clean up to adhere to coding standards

packages/js/create-woo-extension/changelog/update-changelogger

@@ -1,5 +0,0 @@
-Significance: patch
-Type: fix
-Comment: Dev dependency update.
-
-

packages/js/create-woo-extension/changelog/update-create-woo-extension-readme

@@ -1,4 +0,0 @@
-Significance: patch
-Type: dev
-
-Update readme

packages/js/create-woo-extension/changelog/update-create-woo-extension-woo

@@ -1,4 +0,0 @@
-Significance: patch
-Type: update
-
-bump WooCommerce version

packages/js/create-woo-extension/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@woocommerce/create-woo-extension",
-	"version": "1.0.1",
+	"version": "1.0.2",
 	"description": "A template to be used with `@wordpress/create-block` to create a WooCommerce extension.",
 	"main": "index.js",
 	"engines": {

packages/js/csv-export/changelog/dev-consolidate-eslint-versions

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Update eslint to 8.32.0 across the monorepo.

packages/js/csv-export/package.json

@@ -50,7 +50,7 @@
 		"@babel/core": "^7.17.5",
 		"@types/jest": "^27.4.1",
 		"@woocommerce/eslint-plugin": "workspace:*",
-		"eslint": "^8.12.0",
+		"eslint": "^8.32.0",
 		"jest": "^27.5.1",
 		"jest-cli": "^27.5.1",
 		"rimraf": "^3.0.2",

packages/js/currency/changelog/dev-consolidate-eslint-versions

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Update eslint to 8.32.0 across the monorepo.

packages/js/currency/package.json

@@ -53,7 +53,7 @@
 		"@babel/core": "^7.17.5",
 		"@types/jest": "^27.4.1",
 		"@woocommerce/eslint-plugin": "workspace:*",
-		"eslint": "^8.12.0",
+		"eslint": "^8.32.0",
 		"jest": "^27.5.1",
 		"jest-cli": "^27.5.1",
 		"rimraf": "^3.0.2",

packages/js/customer-effort-score/changelog/dev-consolidate-eslint-versions

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Update eslint to 8.32.0 across the monorepo.

packages/js/customer-effort-score/package.json

@@ -52,7 +52,7 @@
 		"@wordpress/browserslist-config": "^4.1.1",
 		"concurrently": "^7.0.0",
 		"css-loader": "^3.6.0",
-		"eslint": "^8.12.0",
+		"eslint": "^8.32.0",
 		"jest": "^27.5.1",
 		"jest-cli": "^27.5.1",
 		"postcss-loader": "^3.0.0",

packages/js/data/changelog/32648-fix-data-plugins-should-clear-requesting-status

@@ -0,0 +1,4 @@
+Significance: minor
+Type: fix
+
+Moved setIsRequesting(false) to the finally block so that it always runs even if an exception is thrown.

packages/js/data/changelog/add-form-factory-tab

@@ -0,0 +1,4 @@
+Significance: minor
+Type: add
+
+Update type definition for ProductForm

packages/js/data/changelog/dev-consolidate-eslint-versions

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Update eslint to 8.32.0 across the monorepo.

packages/js/data/changelog/fix-36765-add-codistoconnect-to-plugin-names

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Add codistoconnect to pluginNames

packages/js/data/changelog/try-support-multiple-fills

@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Removing unused code from ProductForm data store.

packages/js/data/changelog/update-get-permalink-parts-create-selector

@@ -0,0 +1,4 @@
+Significance: patch
+Type: performance
+
+Use createSelector for getPermalinkParts selector, to cache result.

packages/js/data/changelog/update-get-permalinks-parts-selector

@@ -0,0 +1,4 @@
+Significance: patch
+Type: update
+
+Use products data store for getPermalinkParts selector.

packages/js/data/package.json

@@ -63,7 +63,7 @@
 		"@types/wordpress__data": "^6.0.0",
 		"@types/wordpress__data-controls": "^2.2.0",
 		"@woocommerce/eslint-plugin": "workspace:*",
-		"eslint": "^8.12.0",
+		"eslint": "^8.32.0",
 		"jest": "^27.5.1",
 		"jest-cli": "^27.5.1",
 		"redux": "^4.1.0",
@@ -86,7 +86,7 @@
 		"build": "pnpm -w exec turbo run turbo:build --filter=$npm_package_name",
 		"test": "pnpm -w exec turbo run turbo:test --filter=$npm_package_name",
 		"lint": "eslint src",
-		"start": "tsc --build --watch",
+		"start": "tsc --build --watch ./tsconfig.json ./tsconfig-cjs.json",
 		"prepack": "pnpm run clean && pnpm run build",
 		"lint:fix": "eslint src --fix",
 		"test-staged": "jest --bail --config ./jest.config.json --findRelatedTests"

packages/js/data/src/plugins/actions.ts

@@ -223,10 +223,11 @@ export function* installPlugins( plugins: Partial< PluginNames >[] ) {
 			throw results.errors.errors;
 		}
 
-		yield setIsRequesting( 'installPlugins', false );
 		return results;
 	} catch ( error ) {
 		yield handlePluginAPIError( 'install', plugins, error );
+	} finally {
+		yield setIsRequesting( 'installPlugins', false );
 	}
 }
 
@@ -248,11 +249,11 @@ export function* activatePlugins( plugins: Partial< PluginNames >[] ) {
 			throw results.errors.errors;
 		}
 
-		yield setIsRequesting( 'activatePlugins', false );
-
 		return results;
 	} catch ( error ) {
 		yield handlePluginAPIError( 'activate', plugins, error );
+	} finally {
+		yield setIsRequesting( 'activatePlugins', false );
 	}
 }
 

packages/js/data/src/plugins/constants.ts

@@ -60,4 +60,5 @@ export const pluginNames = {
 		'woocommerce'
 	),
 	'tiktok-for-business:alt': __( 'TikTok for WooCommerce', 'woocommerce' ),
+	codistoconnect: __( 'Omnichannel for WooCommerce', 'woocommerce' ),
 };

packages/js/data/src/product-form/actions.ts

@@ -24,6 +24,7 @@ export function getProductFormSuccess( productForm: ProductForm ) {
 		fields: productForm.fields,
 		sections: productForm.sections,
 		subsections: productForm.subsections,
+		tabs: productForm.tabs,
 	};
 }
 

packages/js/data/src/product-form/reducer.ts

@@ -17,6 +17,7 @@ const reducer: Reducer< ProductFormState, Action > = (
 		fields: [],
 		sections: [],
 		subsections: [],
+		tabs: [],
 	},
 	action
 ) => {
@@ -42,6 +43,7 @@ const reducer: Reducer< ProductFormState, Action > = (
 				fields: action.fields,
 				sections: action.sections,
 				subsections: action.subsections,
+				tabs: action.tabs,
 			};
 			break;
 		case TYPES.GET_PRODUCT_FORM_ERROR:

packages/js/data/src/product-form/resolvers.ts

@@ -1,8 +1,7 @@
 /**
  * External dependencies
  */
-import { apiFetch, select } from '@wordpress/data-controls';
+import { apiFetch } from '@wordpress/data-controls';
-import { controls } from '@wordpress/data';
 
 /**
  * Internal dependencies
@@ -15,10 +14,6 @@ import {
 } from './actions';
 import { WC_ADMIN_NAMESPACE } from '../constants';
 import { ProductFormField, ProductForm } from './types';
-import { STORE_NAME } from './constants';
-
-const resolveSelect =
-	controls && controls.resolveSelect ? controls.resolveSelect : select;
 
 export function* getFields() {
 	try {
@@ -34,10 +29,6 @@ export function* getFields() {
 	}
 }
 
-export function* getCountry() {
-	yield resolveSelect( STORE_NAME, 'getProductForm' );
-}
-
 export function* getProductForm() {
 	try {
 		const url = WC_ADMIN_NAMESPACE + '/product-form';

packages/js/data/src/product-form/types.ts

@@ -23,10 +23,16 @@ export type ProductFormSection = BaseComponent & {
 
 export type Subsection = BaseComponent;
 
+export type Tabs = BaseComponent & {
+	name: string;
+	title: string;
+};
+
 export type ProductForm = {
 	fields: ProductFormField[];
 	sections: ProductFormSection[];
 	subsections: Subsection[];
+	tabs: Tabs[];
 };
 
 export type ProductFormState = ProductForm & {

packages/js/data/src/products/index.ts

@@ -19,7 +19,6 @@ registerStore< State >( STORE_NAME, {
 	reducer: reducer as Reducer< ProductState >,
 	actions,
 	controls,
-	// @ts-expect-error as the registerStore type is not allowing the createRegistrySelector selector.
 	selectors,
 	resolvers,
 } );

packages/js/data/src/products/resolvers.ts

@@ -2,12 +2,17 @@
  * External dependencies
  */
 import { addQueryArgs } from '@wordpress/url';
-import { apiFetch } from '@wordpress/data-controls';
+import {
+	apiFetch,
+	dispatch as deprecatedDispatch,
+	select,
+} from '@wordpress/data-controls';
+import { controls } from '@wordpress/data';
 
 /**
  * Internal dependencies
  */
-import { WC_PRODUCT_NAMESPACE } from './constants';
+import { STORE_NAME, WC_PRODUCT_NAMESPACE } from './constants';
 import { Product, ProductQuery } from './types';
 import {
 	getProductError,
@@ -19,6 +24,11 @@ import {
 } from './actions';
 import { request } from '../utils';
 
+const dispatch =
+	controls && controls.dispatch ? controls.dispatch : deprecatedDispatch;
+const resolveSelect =
+	controls && controls.resolveSelect ? controls.resolveSelect : select;
+
 export function* getProducts( query: Partial< ProductQuery > ) {
 	// id is always required.
 	const productsQuery = {
@@ -56,6 +66,11 @@ export function* getProduct( productId: number ) {
 		} );
 
 		yield getProductSuccess( productId, product );
+
+		yield dispatch( STORE_NAME, 'finishResolution', 'getPermalinkParts', [
+			productId,
+		] );
+
 		return product;
 	} catch ( error ) {
 		yield getProductError( productId, error );
@@ -81,3 +96,7 @@ export function* getProductsTotalCount( query: Partial< ProductQuery > ) {
 		throw error;
 	}
 }
+
+export function* getPermalinkParts( productId: number ) {
+	yield resolveSelect( STORE_NAME, 'getProduct', [ productId ] );
+}

packages/js/data/src/products/selectors.ts

@@ -2,7 +2,6 @@
  * External dependencies
  */
 import createSelector from 'rememo';
-import { createRegistrySelector } from '@wordpress/data';
 
 /**
  * Internal dependencies
@@ -122,22 +121,10 @@ export const isPending = (
 	return false;
 };
 
-export const getPermalinkParts = createRegistrySelector(
+export const getPermalinkParts = createSelector(
-	( select ) => ( state: ProductState, productId: number ) => {
+	( state: ProductState, productId: number ) => {
-		const product = select( 'core' ).getEntityRecord(
+		const product = state.data[ productId ];
-			'postType',
+
-			'product',
-			productId,
-			// @ts-expect-error query object is not part of the @wordpress/core-data types yet.
-			{
-				_fields: [
-					'id',
-					'permalink_template',
-					'slug',
-					'generated_slug',
-				],
-			}
-		);
 		if ( product && product.permalink_template ) {
 			const postName = product.slug || product.generated_slug;
 
@@ -152,6 +139,9 @@ export const getPermalinkParts = createRegistrySelector(
 			};
 		}
 		return null;
+	},
+	( state, productId ) => {
+		return [ state.data[ productId ] ];
 	}
 );
 
@@ -162,7 +152,5 @@ export type ProductsSelectors = {
 	getProductsTotalCount: WPDataSelector< typeof getProductsTotalCount >;
 	getProductsError: WPDataSelector< typeof getProductsError >;
 	isPending: WPDataSelector< typeof isPending >;
-	getPermalinkParts: (
+	getPermalinkParts: WPDataSelector< typeof getPermalinkParts >;
-		productId: number
-	) => { prefix: string; postName: string; suffix: string } | null;
 } & WPDataSelectors;

packages/js/data/src/products/types.ts

@@ -66,6 +66,7 @@ export type Product< Status = ProductStatus, Type = ProductType > = Omit<
 	downloads: ProductDownload[];
 	external_url: string;
 	featured: boolean;
+	generated_slug: string;
 	id: number;
 	low_stock_amount: number;
 	manage_stock: boolean;
@@ -73,6 +74,7 @@ export type Product< Status = ProductStatus, Type = ProductType > = Omit<
 	name: string;
 	on_sale: boolean;
 	permalink: string;
+	permalink_template: string;
 	price: string;
 	price_html: string;
 	purchasable: boolean;
@@ -108,9 +110,11 @@ export const productReadOnlyProperties = [
 	'date_created_gmt',
 	'date_modified',
 	'date_modified_gmt',
+	'generated_slug',
 	'id',
 	'on_sale',
 	'permalink',
+	'permalink_template',
 	'price',
 	'price_html',
 	'purchasable',

packages/js/date/changelog/dev-consolidate-eslint-versions

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Update eslint to 8.32.0 across the monorepo.

packages/js/date/package.json

@@ -40,7 +40,7 @@
 		"@types/qs": "^6.9.7",
 		"@woocommerce/eslint-plugin": "workspace:*",
 		"d3-time-format": "^2.3.0",
-		"eslint": "^8.12.0",
+		"eslint": "^8.32.0",
 		"jest": "^27.5.1",
 		"jest-cli": "^27.5.1",
 		"rimraf": "^3.0.2",

packages/js/dependency-extraction-webpack-plugin/assets/packages.js

@@ -14,6 +14,7 @@ module.exports = [
 	'@woocommerce/navigation',
 	'@woocommerce/notices',
 	'@woocommerce/number',
+	'@woocommerce/product-editor',
 	'@woocommerce/tracks',
 	// wc-blocks packages
 	'@woocommerce/blocks-checkout',

packages/js/dependency-extraction-webpack-plugin/changelog/add-36355_new_product_editor_package

@@ -0,0 +1,4 @@
+Significance: minor
+Type: add
+
+Add @woocommerce/product-editor package to the packages list.

packages/js/dependency-extraction-webpack-plugin/changelog/dev-consolidate-eslint-versions

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Update eslint to 8.32.0 across the monorepo.

packages/js/dependency-extraction-webpack-plugin/package.json

@@ -30,7 +30,7 @@
 	"devDependencies": {
 		"@babel/core": "^7.17.5",
 		"@woocommerce/eslint-plugin": "workspace:*",
-		"eslint": "^8.12.0",
+		"eslint": "^8.32.0",
 		"jest": "^27.5.1",
 		"jest-cli": "^27.5.1",
 		"rimraf": "^3.0.2",

packages/js/e2e-core-tests/package.json

@@ -25,7 +25,7 @@
 	"dependencies": {
 		"@jest/globals": "^27.5.1",
 		"@wordpress/deprecated": "^3.2.3",
-		"config": "3.3.3"
+		"config": "3.3.7"
 	},
 	"devDependencies": {
 		"@babel/cli": "7.12.8",
@@ -41,7 +41,7 @@
 		"@wordpress/babel-plugin-import-jsx-pragma": "1.1.3",
 		"@wordpress/babel-preset-default": "3.0.2",
 		"@wordpress/browserslist-config": "^4.1.0",
-		"eslint": "^8.12.0",
+		"eslint": "^8.32.0",
 		"eslint-plugin-jest": "23.20.0"
 	},
 	"peerDependencies": {

packages/js/e2e-core-tests/src/specs/merchant/wp-admin-order-status-filters.test.js

@@ -16,7 +16,7 @@ const orderStatus = [
 	[ 'Processing', 'wc-processing' ],
 	[ 'On hold', 'wc-on-hold' ],
 	[ 'Completed', 'wc-completed' ],
-	[ 'Canceled', 'wc-cancelled' ],
+	[ 'Cancelled', 'wc-cancelled' ],
 	[ 'Refunded', 'wc-refunded' ],
 	[ 'Failed', 'wc-failed' ],
 ];

packages/js/e2e-environment/package.json

@@ -33,7 +33,7 @@
 		"@wordpress/jest-preset-default": "^7.1.3",
 		"app-root-path": "^3.0.0",
 		"commander": "4.1.1",
-		"config": "3.3.3",
+		"config": "3.3.7",
 		"jest": "^27.5.1",
 		"jest-circus": "27.5.1",
 		"jest-each": "27.5.1",

packages/js/e2e-utils/package.json

@@ -18,7 +18,7 @@
 		"@automattic/puppeteer-utils": "github:Automattic/puppeteer-utils#0f3ec50",
 		"@wordpress/deprecated": "^3.2.3",
 		"@wordpress/e2e-test-utils": "wp-5.8",
-		"config": "3.3.3",
+		"config": "3.3.7",
 		"fishery": "^1.2.0"
 	},
 	"devDependencies": {
@@ -37,7 +37,7 @@
 		"@wordpress/babel-plugin-import-jsx-pragma": "1.1.3",
 		"@wordpress/babel-preset-default": "3.0.2",
 		"@wordpress/browserslist-config": "^4.1.0",
-		"eslint": "^8.1.0",
+		"eslint": "^8.32.0",
 		"eslint-plugin-jest": "23.20.0"
 	},
 	"peerDependencies": {

packages/js/eslint-plugin/changelog/dev-consolidate-eslint-versions

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Update eslint to 8.32.0 across the monorepo.

packages/js/eslint-plugin/package.json

@@ -47,7 +47,7 @@
 	},
 	"devDependencies": {
 		"@babel/core": "^7.17.5",
-		"eslint": "^8.25.0",
+		"eslint": "^8.32.0",
 		"jest": "^27.5.1",
 		"jest-cli": "^27.5.1",
 		"rimraf": "^3.0.2",

packages/js/experimental/changelog/dev-consolidate-eslint-versions

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Update eslint to 8.32.0 across the monorepo.

packages/js/experimental/changelog/fix-slot-fills-for-wp-6_2

@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Fix missing fills prop in useSlotFills return object for wp.components >= 21.2.0

packages/js/experimental/changelog/update-36805-support-direction-prop

@@ -0,0 +1,5 @@
+Significance: patch
+Type: update
+
+Support direction prop to control which direction hidden items open.
+

packages/js/experimental/package.json

@@ -65,7 +65,7 @@
 		"@wordpress/browserslist-config": "^4.1.1",
 		"concurrently": "^7.0.0",
 		"css-loader": "^3.6.0",
-		"eslint": "^8.12.0",
+		"eslint": "^8.32.0",
 		"jest": "^27.5.1",
 		"jest-cli": "^27.5.1",
 		"postcss-loader": "^3.0.0",

packages/js/experimental/src/experimental-list/collapsible-list/index.tsx

@@ -32,6 +32,7 @@ type CollapsibleListProps = {
 	show?: number;
 	onCollapse?: () => void;
 	onExpand?: () => void;
+	direction?: 'up' | 'down';
 } & ListProps;
 
 const defaultStyle = {
@@ -126,6 +127,7 @@ export const ExperimentalCollapsibleList: React.FC< CollapsibleListProps > = ( {
 	show = 0,
 	onCollapse,
 	onExpand,
+	direction = 'up',
 	...listProps
 } ): JSX.Element => {
 	const [ isCollapsed, setCollapsed ] = useState( collapsed );
@@ -225,9 +227,33 @@ export const ExperimentalCollapsibleList: React.FC< CollapsibleListProps > = ( {
 		'woocommerce-experimental-list-wrapper': ! isCollapsed,
 	} );
 
+	const hiddenChildren =
+		displayedChildren.hidden.length > 0 ? (
+			<ExperimentalListItem
+				key="collapse-item"
+				className="list-item-collapse"
+				onClick={ clickHandler }
+				animation="none"
+				disableGutters
+			>
+				<p>
+					{ isCollapsed
+						? footerLabels.expand
+						: footerLabels.collapse }
+				</p>
+
+				<Icon
+					className="list-item-collapse__icon"
+					size={ 30 }
+					icon={ isCollapsed ? chevronDown : chevronUp }
+				/>
+			</ExperimentalListItem>
+		) : null;
+
 	return (
 		<ExperimentalList { ...listProps } className={ listClasses }>
 			{ [
+				direction === 'down' && hiddenChildren,
 				...displayedChildren.shown,
 				<Transition
 					key="remaining-children"
@@ -288,27 +314,7 @@ export const ExperimentalCollapsibleList: React.FC< CollapsibleListProps > = ( {
 						);
 					} }
 				</Transition>,
-				displayedChildren.hidden.length > 0 ? (
+				direction === 'up' && hiddenChildren,
-					<ExperimentalListItem
-						key="collapse-item"
-						className="list-item-collapse"
-						onClick={ clickHandler }
-						animation="none"
-						disableGutters
-					>
-						<p>
-							{ isCollapsed
-								? footerLabels.expand
-								: footerLabels.collapse }
-						</p>
-
-						<Icon
-							className="list-item-collapse__icon"
-							size={ 30 }
-							icon={ isCollapsed ? chevronDown : chevronUp }
-						/>
-					</ExperimentalListItem>
-				) : null,
 			] }
 		</ExperimentalList>
 	);

packages/js/experimental/src/experimental-list/stories/index.tsx

@@ -16,6 +16,14 @@ export default {
 	title: 'WooCommerce Admin/experimental/List',
 	component: List,
 	decorators: [ ( storyFn, context ) => withConsole()( storyFn )( context ) ],
+	argTypes: {
+		direction: {
+			control: {
+				type: 'select',
+				options: [ 'up', 'down' ],
+			},
+		},
+	},
 } as Meta;
 
 const Template: Story< ListProps > = ( args ) => (
@@ -40,9 +48,10 @@ export const Primary = Template.bind( { onClick: () => {} } );
 Primary.args = {
 	listType: 'ul',
 	animation: 'slide-right',
+	direction: 'top',
 };
 
-export const CollapsibleListExample: Story = () => {
+export const CollapsibleListExample: Story = ( args ) => {
 	return (
 		<CollapsibleList
 			collapseLabel="Show less"
@@ -56,6 +65,8 @@ export const CollapsibleListExample: Story = () => {
 				// eslint-disable-next-line no-console
 				console.log( 'expanded' );
 			} }
+			direction="top"
+			{ ...args }
 		>
 			<ListItem onClick={ () => {} }>
 				<div>Any markup can go here.</div>