diff --git a/.changeset/bright-lemons-knock.md b/.changeset/bright-lemons-knock.md deleted file mode 100644 index 90a0c58e96..0000000000 --- a/.changeset/bright-lemons-knock.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/data-extensions': patch ---- - -Add data-extensions package diff --git a/.changeset/clever-actors-cry.md b/.changeset/clever-actors-cry.md deleted file mode 100644 index fb92b4a148..0000000000 --- a/.changeset/clever-actors-cry.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/ui-extensions': minor ---- - -Passing a new icon type to the segment templates diff --git a/.changeset/fuzzy-trainers-work.md b/.changeset/fuzzy-trainers-work.md deleted file mode 100644 index 18a02825f6..0000000000 --- a/.changeset/fuzzy-trainers-work.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -'@shopify/ui-extensions-react': minor -'@shopify/ui-extensions': minor ---- - -Release a new Chat component, chat.render targets and preloads.chat configuration diff --git a/.changeset/healthy-cups-wash.md b/.changeset/healthy-cups-wash.md deleted file mode 100644 index a2bfc51ad4..0000000000 --- a/.changeset/healthy-cups-wash.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/ui-extensions': minor ---- - -Add shouldRender method to admin ui-extensions diff --git a/.changeset/hot-shirts-clean.md b/.changeset/hot-shirts-clean.md deleted file mode 100644 index 8e6d8aaea3..0000000000 --- a/.changeset/hot-shirts-clean.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/ui-extensions': patch ---- - -Make POS UI Ext PrintAPI async diff --git a/.changeset/hot-years-relate.md b/.changeset/hot-years-relate.md deleted file mode 100644 index 589a64109a..0000000000 --- a/.changeset/hot-years-relate.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/ui-extensions': patch ---- - -POS UI Ext PrintAPI src non-optional diff --git a/.changeset/itchy-readers-think.md b/.changeset/itchy-readers-think.md deleted file mode 100644 index 3312582f58..0000000000 --- a/.changeset/itchy-readers-think.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/ui-extensions': patch ---- - -Remove shouldRender method diff --git a/.changeset/kind-flowers-dress.md b/.changeset/kind-flowers-dress.md deleted file mode 100644 index 10bac6a57c..0000000000 --- a/.changeset/kind-flowers-dress.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -'@shopify/ui-extensions': minor -'@shopify/ui-extensions-react': minor ---- - -(POS) Add PrintApi and PrintPreview diff --git a/.changeset/neat-paws-smile.md b/.changeset/neat-paws-smile.md deleted file mode 100644 index 022d12a50d..0000000000 --- a/.changeset/neat-paws-smile.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/ui-extensions-react': patch ---- - -surfaces/admin: the reactExtension will only allow .render targets to run diff --git a/.changeset/orange-baboons-grab.md b/.changeset/orange-baboons-grab.md deleted file mode 100644 index d09a74188e..0000000000 --- a/.changeset/orange-baboons-grab.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/ui-extensions': minor ---- - -Add metafields to ShippingOption diff --git a/.changeset/rotten-donuts-clap.md b/.changeset/rotten-donuts-clap.md deleted file mode 100644 index c10c6b0cbc..0000000000 --- a/.changeset/rotten-donuts-clap.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/ui-extensions': patch ---- - -AdminBlock remove summary prop and add collapsedSummary diff --git a/.changeset/spicy-mugs-drop.md b/.changeset/spicy-mugs-drop.md deleted file mode 100644 index b4f52ac090..0000000000 --- a/.changeset/spicy-mugs-drop.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/ui-extensions': patch ---- - -Fix shopify global declaration diff --git a/.eslintrc.js b/.eslintrc.js index 78ca9624b1..c4f6c682a5 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -3,7 +3,6 @@ module.exports = { 'plugin:@shopify/typescript', 'plugin:@shopify/jest', 'plugin:@shopify/prettier', - 'plugin:@shopify/react', ], ignorePatterns: [ 'build/', @@ -17,14 +16,19 @@ module.exports = { 'packages/*/*.mjs', 'packages/*/*.node', 'packages/*/*.esnext', + 'packages/ui-extensions/src/surfaces/checkout/**/*.d.ts', + 'packages/ui-extensions/src/surfaces/checkout/preact/tests/', + 'packages/ui-extensions/src/surfaces/point-of-sale/**/*.d.ts', ], rules: { // Codebase was originally written without some strict Shopify conventions 'import/order': 'off', + 'line-comment-position': 'off', '@typescript-eslint/naming-convention': 'off', // This rule is just bad '@typescript-eslint/consistent-indexed-object-style': 'off', + 'eslint-comments/no-unused-disables': 'off', }, overrides: [ { @@ -44,20 +48,6 @@ module.exports = { '@shopify/jsx-no-hardcoded-content': 'off', }, }, - { - files: ['packages/ui-extensions-react/src/surfaces/*/hooks/**'], - rules: { - // This is necessary because https://github.com/Shopify/generate-docs - // cannot yet infer return types. - '@typescript-eslint/explicit-function-return-type': 'error', - }, - }, - { - files: ['packages/ui-extensions-react/src/surfaces/*/hooks/tests/**'], - rules: { - '@typescript-eslint/explicit-function-return-type': 'off', - }, - }, { files: [ 'packages/ui-extensions/docs/surfaces/**/*.example.*', @@ -65,7 +55,6 @@ module.exports = { ], rules: { 'no-console': 'off', - 'react/react-in-jsx-scope': 'off', '@shopify/checkout-web/custom-error-subclassing': 'off', 'import/no-extraneous-dependencies': 'off', 'promise/catch-or-return': 'off', diff --git a/.github/ISSUE_TEMPLATE/feature-request.md b/.github/ISSUE_TEMPLATE/feature-request.md index cad964041d..57efb42eb8 100644 --- a/.github/ISSUE_TEMPLATE/feature-request.md +++ b/.github/ISSUE_TEMPLATE/feature-request.md @@ -4,9 +4,9 @@ about: Suggest an idea for this project labels: 'enhancement' --- -## Please list the related package(s) +## Please list the related surfaces(s) - + ## If this related to specific APIs or components, please list them here diff --git a/.github/ISSUE_TEMPLATE/issue-report.md b/.github/ISSUE_TEMPLATE/issue-report.md index 1623b46894..746d0e41b3 100644 --- a/.github/ISSUE_TEMPLATE/issue-report.md +++ b/.github/ISSUE_TEMPLATE/issue-report.md @@ -6,9 +6,9 @@ labels: 'bug' -## Please list the package(s) involved in the issue, and include the version you are using +## Please list the surfaces(s) involved in the issue, and include the version you are using - + ## Describe the bug diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index e24f13b748..5df5b6171a 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -6,12 +6,12 @@ jobs: type-check: runs-on: ubuntu-latest steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 - uses: ./.github/workflows/actions/prepare - id: typescript-cache name: Restore TypeScript cache - uses: actions/cache@v1 + uses: actions/cache@v4 with: path: | packages/*/build/ts @@ -23,34 +23,16 @@ jobs: - name: Type check run: yarn type-check - test: - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@v3 - - uses: ./.github/workflows/actions/prepare - - - id: jest-cache - name: Restore jest cache - uses: actions/cache@v1 - with: - path: .loom/cache/jest/ - key: ${{ runner.os }}-jest-v1-${{ github.sha }} - restore-keys: | - ${{ runner.os }}-jest-v1- - - - name: Test - run: yarn test - lint: runs-on: ubuntu-latest steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 - uses: ./.github/workflows/actions/prepare - id: eslint-cache name: Restore ESLint cache - uses: actions/cache@v1 + uses: actions/cache@v4 with: path: .loom/cache/eslint key: ${{ runner.os }}-eslint-v1-${{ github.sha }} @@ -64,7 +46,7 @@ jobs: runs-on: ubuntu-latest steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 - uses: ./.github/workflows/actions/prepare - id: test-build diff --git a/.github/workflows/deploy-rc.yml b/.github/workflows/deploy-rc.yml new file mode 100644 index 0000000000..7cbca2f61b --- /dev/null +++ b/.github/workflows/deploy-rc.yml @@ -0,0 +1,29 @@ +name: Deploy RC + +on: + push: + branches: + - 20[0-9][0-9]-[01][1470]-rc + +concurrency: ${{ github.workflow }}-${{ github.ref }} + +jobs: + changesets: + name: Deploy + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v3 + with: + token: ${{ secrets.SHOPIFY_GH_ACCESS_TOKEN }} + + - uses: ./.github/workflows/actions/prepare + + - id: changesets + name: Create release Pull Request or publish to NPM + uses: changesets/action@v1 + with: + title: Version Packages (${{ github.ref_name }}) + publish: yarn run deploy + env: + NPM_TOKEN: ${{ secrets.NPM_TOKEN }} + GITHUB_TOKEN: ${{ secrets.SHOPIFY_GH_ACCESS_TOKEN }} diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml index dedf5f24d0..81cd7c3447 100644 --- a/.github/workflows/deploy.yml +++ b/.github/workflows/deploy.yml @@ -27,10 +27,11 @@ jobs: - id: changesets name: Create release Pull Request or publish to NPM - uses: changesets/action@v1 + uses: changesets/action@06245a4e0a36c064a573d4150030f5ec548e4fcc # v1.4.10 with: title: Version Packages (${{ github.ref_name }}) publish: yarn run deploy --tag ${{ github.ref_name }} + createGithubReleases: false env: NPM_TOKEN: ${{ secrets.NPM_TOKEN }} GITHUB_TOKEN: ${{ secrets.SHOPIFY_GH_ACCESS_TOKEN }} diff --git a/.gitignore b/.gitignore index d25751c339..751edf12a8 100644 --- a/.gitignore +++ b/.gitignore @@ -3,13 +3,16 @@ node_modules .sewing-kit .DS_STORE **/build -packages/*/*.esnext -packages/*/*.node -packages/*/*.mjs -packages/*/*.d.ts -packages/*/*.js -packages/*/bin -!packages/*/.eslintrc.js +packages/**/*.esnext +packages/**/*.node +packages/**/*.mjs +!packages/**/build-doc*.mjs +!components/*.d.ts +!components.d.ts +packages/**/*.js +!packages/**/__mocks__/**/*.js +packages/**/bin +!packages/**/.eslintrc.js *.log packages/ui-extensions/docs/**/generated diff --git a/.prettierignore b/.prettierignore index 669e153f43..1186ebb729 100644 --- a/.prettierignore +++ b/.prettierignore @@ -1,3 +1,4 @@ node_modules packages/*/build packages/web-pixels-extension/src/schemas/pixel-events.jtd.json +packages/ui-extensions/src/surfaces/checkout/**/*.d.ts \ No newline at end of file diff --git a/.prettierrc b/.prettierrc index 87c9c6e454..03d85fb91e 100644 --- a/.prettierrc +++ b/.prettierrc @@ -3,10 +3,10 @@ "bracketSpacing": false, "singleQuote": true, "trailingComma": "all", + "htmlWhitespaceSensitivity": "ignore", "overrides": [ { "files": [ - "packages/ui-extensions-react/**/*.example.*", "packages/ui-extensions/docs/**/*.example.*" ], "options": { @@ -14,4 +14,4 @@ } } ] -} +} \ No newline at end of file diff --git a/.vscode/settings.json b/.vscode/settings.json index 6be9d2a999..fa3f879fe2 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -18,5 +18,6 @@ "editor.codeActionsOnSave": { "source.fixAll.eslint": "explicit" }, + "html.format.wrapAttributes": "preserve", "typescript.tsdk": "node_modules/typescript/lib" } diff --git a/README.md b/README.md index cf75e4e271..a4c58de906 100644 --- a/README.md +++ b/README.md @@ -2,19 +2,16 @@ This repo contains the public definition of Shopify’s UI extension API. App developers can use these libraries for a strongly-typed, optimized development experience that lets them focus on integrating their app’s features deep into Shopify workflows. You can learn more about what is possible with UI extensions in [Shopify’s developer documentation](https://shopify.dev/api/checkout-extensions/checkout). -> **Note:** UI extensions are a [versioned API](https://shopify.dev/api/usage/versioning). This branch contains the APIs for the `unstable` API version. The following API versions are available as separate branches in this repo: [`2023-04`](https://github.com/Shopify/ui-extensions/tree/2023-04), [`2023-07`](https://github.com/Shopify/ui-extensions/tree/2023-07) +> **Note:** UI extensions are a [versioned API](https://shopify.dev/api/usage/versioning). This branch contains the APIs for the `2025-10` API version. The following API versions are available as separate branches in this repo: [`2023-04`](https://github.com/Shopify/ui-extensions/tree/2023-04), [`2023-07`](https://github.com/Shopify/ui-extensions/tree/2023-07) -Shopify provides different “variants” of UI extension APIs that are suitable for different developers: - -- [`@shopify/ui-extensions`](./packages/ui-extensions/) lets developers use a small, strongly-typed JavaScript API for creating UI extensions -- [`@shopify/ui-extensions-react`](./packages/ui-extensions-react/) lets developers create UI extensions using [React](https://reactjs.org/), a popular JavaScript library for building user interfaces +Shopify provides UI extension APIs via the [`@shopify/ui-extensions` package](./packages/ui-extensions/) which lets developers use a small, strongly-typed JavaScript API for creating UI extensions ## What are “UI extensions”? A UI extension is a JavaScript-based module that can hook in to client-side behaviors on any of Shopify’s first party UI surface areas. The most minimal definition of a UI extension has the following properties, which are configured in a `shopify.extension.toml` file in your project: - A `name` that is presented to merchants when interacting with the extension. -- The [`target`](https://shopify.dev/docs/apps/app-extensions/configuration#targets) that the UI extension wishes to inject into. These are represented with string identifiers that describe the surface and responsibility of the extension. For example, [`purchase.checkout.cart-line-item.render-after` target](https://shopify.dev/docs/api/checkout-ui-extensions/unstable/apis/extensiontargets) gives a UI Extension the ability to render UI after the each cart line in a checkout. +- The [`target`](https://shopify.dev/docs/apps/app-extensions/configuration#targets) that the UI extension wishes to inject into. These are represented with string identifiers that describe the surface and responsibility of the extension. For example, [`purchase.checkout.cart-line-item.render-after` target](https://shopify.dev/docs/api/checkout-ui-extensions/latest/targets) gives a UI Extension the ability to render UI after the each cart line in a checkout. - The JavaScript `module` in your local project that will be run to render UI. The types in this package allow us to represent additional details about the targets developers can implement. Each target can have a custom set of APIs available to it, which includes: @@ -22,4 +19,6 @@ The types in this package allow us to represent additional details about the tar - What **UI Components** are available to be rendered, and what properties those UI components accept - What **imperative APIs** are provided by the host application, for reading and writing data relevant to the extension -UI extensions are built on an open source project called, [remote-ui](https://github.com/Shopify/remote-dom/tree/remote-ui), which allows them to render native UI elements while being safely sandboxed. If you want to learn more, we’ve written a [technical explanation of how extensions work under the hood](./documentation/how-extensions-work.md). +UI extensions are built on an open source project called, [remote-dom](https://github.com/Shopify/remote-dom), which allows them to render native UI elements while being safely sandboxed. + +> **Note:** If you are migrating from an API version prior to `2025-10`, you can follow the [migration guide](https://shopify.dev/docs/api/checkout-ui-extensions/2025-10/upgrading-to-2025-10). diff --git a/config/loom/index.ts b/config/loom/index.ts index 2fd7cc50fd..ed8c3774c1 100644 --- a/config/loom/index.ts +++ b/config/loom/index.ts @@ -3,7 +3,7 @@ import {buildLibrary, babel} from '@shopify/loom-plugin-build-library'; const PLUGIN = 'UiExtensions.DefaultProject'; -export function defaultProjectPlugin({react = false} = {}) { +export function defaultProjectPlugin() { return createComposedProjectPlugin(PLUGIN, [ buildLibrary({ commonjs: true, @@ -19,13 +19,6 @@ export function defaultProjectPlugin({react = false} = {}) { '@shopify/babel-preset', { typescript: true, - react, - reactOptions: react - ? { - runtime: 'automatic', - importSource: 'react', - } - : undefined, }, ], ], diff --git a/documentation/versions-and-deploys.md b/documentation/versions-and-deploys.md index e03041dc8a..281bbc2d49 100644 --- a/documentation/versions-and-deploys.md +++ b/documentation/versions-and-deploys.md @@ -2,17 +2,19 @@ Shopify’s UI extensions are a [versioned API](https://shopify.dev/api/usage/versioning). New versions are released every 3 months at the beginning of the quarter, and have version identifiers in the format `YYYY-MM`. For each of these versions, there is a corresponding branch in this repository that is used to publish UI extension packages with a matching version number. -The following versions are currently supported: +## RC -- `2023-04` ([branch](https://github.com/Shopify/ui-extensions/tree/2023-04), publishes versions `2023.4.x`) +Whenever a new stable version is released we also create a release-candidate (RC) branch for the next stable version. For example, `2025-01` is created at the same time as `2025-04-rc` and is used for previewing `2025-04` before it is promoted to stable. RC branches are stricter than `unstable` and we should try to avoid including APIs that are not finalized. These branches publish UI extension packages using a special `{{SEMVER}}-rc.{{VERSION}}` (ex. `2025.10.0-rc.5`) version number, which allows us to release continuously without bumping the semver. Changesets merged into RC branches will trigger a PR to be created for [deploying the package to NPM](#deploying-new-versions-to-npm). -There is also an `unstable` API version published from the [`unstable` branch](https://github.com/Shopify/ui-extensions/tree/unstable). This version is meant to allow third parties to try out new, upcoming extension APIs, before they are released for use in production environments. This branch publishes UI extension packages using a special `0.0.0-unstable-{{TIMESTAMP}}` version number, which allows us to release it continuously as changes are made. +## Unstable + +The [`unstable` branch](https://github.com/Shopify/ui-extensions/tree/unstable) is used to build experimental features before they are promoted to an RC. This version is meant to allow third parties to try out experimental extension APIs before they are released for use in production environments. This branch publishes UI extension packages using a special `0.0.0-unstable-{{TIMESTAMP}}` version number, which allows us to release it continuously as changes are made. > **Note**: Shopify also released a set of UI extension packages that had NPM versions, but did not follow a formal API versioning system. These packages, like `@shopify/checkout-ui-extensions` and `@shopify/admin-ui-extensions`, are still available, but are on a [“legacy” branch](https://github.com/Shopify/ui-extensions/tree/main). If you are trying to deploy new versions of those packages, the instructions in this document **do not apply**. ## Adding code -Most code added to this repo will be added to the `unstable` branch, which captures the latest public APIs Shopify has made available. Stable version branches should only be getting bugfixes (`patches`) — no new features should be added to them. +Most code added to this repo will be added to the `unstable` branch, which captures the latest public APIs Shopify has made available. Code changes should only be added to RC branches when we're confident the API is unlikely to change. Stable version branches should only be getting bugfixes (`patches`) — no new features should be added to them. To start adding code, branch off of the `unstable` branch (or the branch for the version you’re working on). Make your changes as you normally would. Before creating a PR for your work, though, you will need to run a command to generate a [changeset](https://github.com/changesets/changesets): @@ -33,11 +35,9 @@ Commit your changeset file alongside the rest of the changes you are making — ## Deploying new versions to NPM -When changeset files are detected on any of the stable version branches, a GitHub action will create a new PR that merges all the unpublished changesets together into a single changelog, and increments the version number on updated packages. This PR should be reviewed and merged by a member of the [UI Extension Stewards GitHub team](https://github.com/orgs/Shopify/teams/ui-extension-stewards). Once it is merged, the new package versions will automatically be published to NPM, with a tag corresponding to their API version (for example, `yarn add @shopify/ui-extensions@2023-01` will install the latest package version for the `2023-01` API version). - -The `unstable` branch does not have the additional step of creating a PR to merge changesets “on-demand”. Instead, _every_ merge into `unstable` causes a new set of versions to be published to NPM. A GitHub action watches this branch and, when any changes are detected, it will create a [“snapshot release”](https://github.com/changesets/changesets/blob/main/docs/snapshot-releases.md) that publishes the changed packages as they exist at that point in time. Snapshot versions have the format `0.0.0-unstable-{{TIMESTAMP}}`, and are published to NPM with the `unstable` tag. This allows developers to get the latest `unstable` version of a package by running an install command referencing the `unstable` tag, like `yarn add @shopify/ui-extensions@unstable`. +When changeset files are detected on any of the stable version or RC branches, a GitHub action will create a new PR that merges all the unpublished changesets together into a single changelog, and increments the version number on updated packages. This PR on stable branches should be reviewed and merged by a member of the [UI Extension Stewards GitHub team](https://github.com/orgs/Shopify/teams/ui-extension-stewards). Once it is merged, the new package versions will automatically be published to NPM, with a tag corresponding to their API version (for example, `yarn add @shopify/ui-extensions@2023-01` will install the latest package version for the `2023-01` API version). -Like the `unstable` branch, the `internal` branch also publishes snapshot releases to NPM. These releases are identified by the format `0.0.0-internal-{{TIMESTAMP}}` and are published with the `internal` tag. +The `unstable` branch does not have the additional step of creating a PR to merge changesets “on-demand”. Instead, _every_ merge into the branches causes a new set of versions to be published to NPM. A GitHub action watches this branch and, when any changes are detected, it will create a [“snapshot release”](https://github.com/changesets/changesets/blob/main/docs/snapshot-releases.md) that publishes the changed packages as they exist at that point in time. Snapshot versions a unique timestamp and are published to NPM with an `unstable` tag. This allows developers to get the latest `unstable` of a package by running an install command referencing the tag, like `yarn add @shopify/ui-extensions@unstable`. ## Creating new stable versions @@ -45,12 +45,13 @@ Like the `unstable` branch, the `internal` branch also publishes snapshot releas To create a new stable version, you will need to follow these steps: -1. Create a new branch for the calver version. This branch should be named with the format `YYYY-MM` where the month should be `01`, `04`, `07`, or `10` (we release quarterly). You will branch off of `unstable` to create this branch. -1. Push your new branch to GitHub. This will trigger the GitHub action that creates a new PR to consume all the changesets you copied over from `unstable` into your new version. -1. Pull down the branch that that was created by the GitHub action (it should have the name `changeset-release/{{BRANCH_NAME}}`). Instead of the patch version changes that were made by the action, update the version of all packages manually to be the first patch release of a new version range. For example, if you are creating a `2025-01` API version, you will set the package versions of all packages to `2025.1.0`. Apply this change to `packages/ui-extensions/package.json`, `packages/ui-extensions/CHANGELOG.md`, `packages/ui-extensions-react/package.json`, and `packages/ui-extensions-react/CHANGELOG.md`. +1. Create a new branch for the calver version. This branch should be named with the format `YYYY-MM` where the month should be `01`, `04`, `07`, or `10` (we release quarterly). You will branch off of `YYYY-MM-rc` to create this branch. For example, if you're release `2025-04` you should branch off of `2025-04-rc`. +1. Push your new branch to GitHub. This will trigger the GitHub action that creates a new PR to consume all the changesets you copied over from `2025-04-rc` into your new version. +1. Pull down the branch that that was created by the GitHub action (it should have the name `changeset-release/{{BRANCH_NAME}}`). Instead of the patch version changes that were made by the action, update the version of all packages manually to be the first patch release of a new version range. For example, if you are creating a `2025-04` API version, you will set the package versions of all packages to `2025.4.0`. Apply this change to `packages/ui-extensions/package.json` and `packages/ui-extensions/CHANGELOG.md`. > Note: do not update the root-level `package.json`. 1. Push your new changes, and make sure you get the PR reviewed by one other member of the [UI Extension Stewards GitHub team](https://github.com/orgs/Shopify/teams/ui-extension-stewards). -1. Update the [`LATEST_STABLE_VERSION`](https://github.com/Shopify/ui-extensions/settings/variables/actions) repository variable to your stable version (i.e. `2025-01`). This ensures means it will be marked with a `latest` npm dist-tag on NPM. +1. Update the [`LATEST_STABLE_VERSION`](https://github.com/Shopify/ui-extensions/settings/variables/actions) repository variable to your stable version (i.e. `2025-04`). This ensures means it will be marked with a `latest` npm dist-tag on NPM. 1. Merge the PR, and let robots release the new versions to NPM and tag it appropriately. +1. Create a new RC branch for the next stable release off of the current stable release. For example, if you've release `2025-04` you should create a new branch `2025-07-rc` off of `2025-04`. 1. For any changes from `unstable` that have been incorporated into the new version, delete their changeset files on the `unstable` branch and replace the existing `CHANGELOG.md` files in `unstable` with what was just shipped. 1. Send a message announcing the release. Let teams know that now is the time to update their section's docs and CLI templates. diff --git a/package.json b/package.json index 89a4d1322d..cc6523efcf 100644 --- a/package.json +++ b/package.json @@ -10,37 +10,37 @@ "build": "loom build", "build-consumer": "loom build && ./scripts/build-consumer.sh", "build-consumer-spin": "loom build && ./scripts/build-consumer-spin.sh", - "generate-definition": "node ./scripts/generator.js", "clean": "git clean -xdf ./packages; rm -rf ./build", "predeploy": "yarn build", "deploy": "changeset publish", "predeploy:unstable": "yarn build", "docs:admin": "yarn workspace @shopify/ui-extensions docs:admin", "docs:checkout": "yarn workspace @shopify/ui-extensions docs:checkout", + "docs:checkout:fast": "yarn workspace @shopify/ui-extensions docs:checkout:fast", + "docs:checkout:dev": "yarn workspace @shopify/ui-extensions docs:checkout:dev", "docs:point-of-sale": "yarn workspace @shopify/ui-extensions docs:point-of-sale", "docs:customer-account": "yarn workspace @shopify/ui-extensions docs:customer-account", "deploy:unstable": "changeset version --snapshot unstable && changeset publish --tag unstable --no-git-tag", "predeploy:internal": "yarn build", "deploy:internal": "changeset version --snapshot internal && changeset publish --tag internal --no-git-tag", - "gen-docs:admin": "yarn workspace @shopify/ui-extensions gen-docs:admin", + "gen-docs:admin": "node ./packages/ui-extensions/docs/surfaces/admin/create-doc-files.js", "lint": "loom lint", "nuke": "rm -rf node_modules && yarn cache clean && rm -rf .loom && git clean -xdf ./packages; rm -rf ./build", "restore-consumer": "./scripts/restore-consumer.sh", "restore-consumer-spin": "./scripts/restore-consumer-spin.sh", "run:ts": "babel-node --extensions .ts,.tsx,.mjs,.js,.json", "run:ts:watch": "nodemon --ext .ts,.tsx,.mjs,.json,.graphql node_modules/.bin/babel-node --extensions .ts,.tsx,.mjs,.js,.json", - "scaffold-docs:admin": "./packages/ui-extensions/docs/surfaces/admin/create-doc-files.sh \"admin\"", - "test": "loom test", - "type-check": "loom type-check" + "type-check": "loom type-check", + "changeset:exit-pre-mode": "test -f .changeset/pre.json && jq -e '.mode == \"pre\"' .changeset/pre.json > /dev/null && yarn changeset pre exit || true" }, "devDependencies": { "@babel/node": "^7.8.7", - "@changesets/changelog-github": "^0.4.7", - "@changesets/cli": "^2.25.2", + "@changesets/changelog-github": "^0.5.0", + "@changesets/cli": "^2.27.0", + "@rollup/plugin-replace": "^6.0.1", "@shopify/babel-preset": "^24.1.0", "@shopify/browserslist-config": "^3.0.0", "@shopify/eslint-plugin": "^42.0.0", - "@shopify/generate-docs": "0.16.4", "@shopify/loom": "^1.0.0", "@shopify/loom-cli": "^1.0.0", "@shopify/loom-plugin-build-library": "^1.0.0", @@ -49,8 +49,7 @@ "@shopify/typescript-configs": "^5.1.0", "eslint": "^8.28.0", "nodemon": "^2.0.4", - "prettier": "^2.8.0", - "react": ">=18.0.0", + "prettier": "^2.8.8", "typescript": "^4.9.0" }, "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e" diff --git a/packages/data-extensions/README.md b/packages/data-extensions/README.md deleted file mode 100644 index cb5693aa46..0000000000 --- a/packages/data-extensions/README.md +++ /dev/null @@ -1,27 +0,0 @@ -# `@shopify/data-extensions` - -This package contains the public type definitions and utilities needed to create a Shopify data extension. - -## What is a data extension? - -A data extension is a JavaScript-based module that can hook in to client-side behaviors on Shopify’s first party UI surface areas. It differs from a UI extension in that it does not establish a long-lived channel or render any UI on the surface. It is a stateless function that executes and returns data. - -Currently, this package contains the API for one surface. - -- [`admin`](./src/surfaces/admin) - -All extensions, regardless of where they appear in Shopify, make use of the same [underlying technology](../../documentation/how-extensions-work.md) and most of the same capabilities (e.g., direct API access, session tokens). - -A data extension using “vanilla” JavaScript would be written as follows: - -```ts -import {dataExtension} from '@shopify/data-extensions/admin'; - -export default dataExtension( - 'admin.product-details.action.should-render', - (root, {data}) => { - ... - return {display: true} - }, -); -``` diff --git a/packages/data-extensions/loom.config.ts b/packages/data-extensions/loom.config.ts deleted file mode 100644 index 3f1aa17f54..0000000000 --- a/packages/data-extensions/loom.config.ts +++ /dev/null @@ -1,9 +0,0 @@ -import {createPackage} from '@shopify/loom'; - -import {defaultProjectPlugin} from '../../config/loom'; - -export default createPackage((pkg) => { - pkg.entry({root: './src/index.ts'}); - pkg.entry({name: 'admin', root: './src/surfaces/admin.ts'}); - pkg.use(defaultProjectPlugin()); -}); diff --git a/packages/data-extensions/package.json b/packages/data-extensions/package.json deleted file mode 100644 index a8fc64878e..0000000000 --- a/packages/data-extensions/package.json +++ /dev/null @@ -1,44 +0,0 @@ -{ - "name": "@shopify/data-extensions", - "version": "0.0.0-unstable", - "main": "index.js", - "module": "index.mjs", - "esnext": "index.esnext", - "types": "./build/ts/index.d.ts", - "typesVersions": { - "*": { - "admin": [ - "./build/ts/surfaces/admin.d.ts" - ] - } - }, - "exports": { - ".": { - "types": "./build/ts/index.d.ts", - "esnext": "./index.esnext", - "import": "./index.mjs", - "require": "./index.js" - }, - "./admin": { - "types": "./build/ts/surfaces/admin.d.ts", - "esnext": "./build/esnext/surfaces/admin.esnext", - "import": "./build/esm/surfaces/admin.mjs", - "require": "./build/cjs/surfaces/admin.js" - } - }, - "license": "MIT", - "sideEffects": false, - "devDependencies": { - "typescript": "^4.9.0" - }, - "publishConfig": { - "access": "public", - "@shopify:registry": "https://registry.npmjs.org/" - }, - "files": [ - "build", - "src", - "index.*", - "README.md" - ] -} diff --git a/packages/data-extensions/src/api.ts b/packages/data-extensions/src/api.ts deleted file mode 100644 index 7814f3edf5..0000000000 --- a/packages/data-extensions/src/api.ts +++ /dev/null @@ -1,95 +0,0 @@ -/** - * Union of supported API versions - */ -export type ApiVersion = 'unstable'; - -export interface Auth { - /** - * Retrieves a Shopify OpenID Connect ID token for the current user. - */ - idToken: () => Promise; -} - -/** - * GraphQL error returned by the Shopify Admin API. - */ -export interface GraphQLError { - message: string; - locations: { - line: number; - column: string; - }; -} - -/** - * This defines the i18n.translate() signature. - */ -export interface I18nTranslate { - /** - * This returns a translated string matching a key in a locale file. - * - * @example translate("banner.title") - */ - ( - key: string, - options?: Record, - ): ReplacementType extends string | number - ? string - : (string | ReplacementType)[]; -} - -export interface I18n { - /** - * Returns a localized number. - * - * This function behaves like the standard `Intl.NumberFormat()` - * with a style of `decimal` applied. It uses the buyer's locale by default. - * - * @param options.inExtensionLocale - if true, use the extension's locale - */ - formatNumber: ( - number: number | bigint, - options?: {inExtensionLocale?: boolean} & Intl.NumberFormatOptions, - ) => string; - - /** - * Returns a localized currency value. - * - * This function behaves like the standard `Intl.NumberFormat()` - * with a style of `currency` applied. It uses the buyer's locale by default. - * - * @param options.inExtensionLocale - if true, use the extension's locale - */ - formatCurrency: ( - number: number | bigint, - options?: {inExtensionLocale?: boolean} & Intl.NumberFormatOptions, - ) => string; - - /** - * Returns a localized date value. - * - * This function behaves like the standard `Intl.DateTimeFormatOptions()` and uses - * the buyer's locale by default. Formatting options can be passed in as - * options. - * - * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat0 - * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat#using_options - * - * @param options.inExtensionLocale - if true, use the extension's locale - */ - formatDate: ( - date: Date, - options?: {inExtensionLocale?: boolean} & Intl.DateTimeFormatOptions, - ) => string; - - /** - * Returns translated content in the buyer's locale, - * as supported by the extension. - * - * - `options.count` is a special numeric value used in pluralization. - * - The other option keys and values are treated as replacements for interpolation. - * - If the replacements are all primitives, then `translate()` returns a single string. - * - If replacements contain UI components, then `translate()` returns an array of elements. - */ - translate: I18nTranslate; -} diff --git a/packages/data-extensions/src/extension.ts b/packages/data-extensions/src/extension.ts deleted file mode 100644 index d6c754395b..0000000000 --- a/packages/data-extensions/src/extension.ts +++ /dev/null @@ -1,3 +0,0 @@ -export interface Extension { - (api: Api): Result; -} diff --git a/packages/data-extensions/src/index.ts b/packages/data-extensions/src/index.ts deleted file mode 100644 index bcf51eb957..0000000000 --- a/packages/data-extensions/src/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export * from './api'; -export * from './extension'; diff --git a/packages/data-extensions/src/surfaces/admin.ts b/packages/data-extensions/src/surfaces/admin.ts deleted file mode 100644 index 7578ffec9e..0000000000 --- a/packages/data-extensions/src/surfaces/admin.ts +++ /dev/null @@ -1,3 +0,0 @@ -export * from './admin/api'; -export * from './admin/extension-targets'; -export * from './admin/extension'; diff --git a/packages/data-extensions/src/surfaces/admin/api.ts b/packages/data-extensions/src/surfaces/admin/api.ts deleted file mode 100644 index 530cb3fdc0..0000000000 --- a/packages/data-extensions/src/surfaces/admin/api.ts +++ /dev/null @@ -1 +0,0 @@ -export type {StandardApi} from './api/standard/standard'; diff --git a/packages/data-extensions/src/surfaces/admin/api/standard/README.md b/packages/data-extensions/src/surfaces/admin/api/standard/README.md deleted file mode 100644 index 07cc82598b..0000000000 --- a/packages/data-extensions/src/surfaces/admin/api/standard/README.md +++ /dev/null @@ -1 +0,0 @@ -# Standard API diff --git a/packages/data-extensions/src/surfaces/admin/api/standard/standard.ts b/packages/data-extensions/src/surfaces/admin/api/standard/standard.ts deleted file mode 100644 index 649521a6b4..0000000000 --- a/packages/data-extensions/src/surfaces/admin/api/standard/standard.ts +++ /dev/null @@ -1,38 +0,0 @@ -import {ApiVersion, Auth, GraphQLError, I18n} from '../../../../api'; -import type {ExtensionTarget as AnyExtensionTarget} from '../../extension-targets'; - -/** - * The following APIs are provided to all extension targets. - */ -export interface StandardApi { - /** - * Provides methods for authenticating calls to an app backend. - */ - auth: Auth; - - /** - * Information about the currently viewed or selected items. - */ - data: {selected: [{id: string}]}; - - /** - * The identifier of the running extension target. - */ - extension: { - target: ExtensionTarget; - }; - - /** - * Utilities for translating content according to the current localization of the admin. - * More info - https://shopify.dev/docs/apps/checkout/best-practices/localizing-ui-extensions - */ - i18n: I18n; - - /** - * Used to query the Admin GraphQL API - */ - query: ( - query: string, - options?: {variables?: Variables; version?: Omit}, - ) => Promise<{data?: Data; errors?: GraphQLError[]}>; -} diff --git a/packages/data-extensions/src/surfaces/admin/extension-targets.ts b/packages/data-extensions/src/surfaces/admin/extension-targets.ts deleted file mode 100644 index 9340e4637d..0000000000 --- a/packages/data-extensions/src/surfaces/admin/extension-targets.ts +++ /dev/null @@ -1,209 +0,0 @@ -import type {Extension} from '../../extension'; - -import type {StandardApi} from './api'; - -interface ShouldRender { - display: boolean; -} - -export interface ExtensionTargets { - /** Abandoned checkouts targets */ - /** - * Determines whether an admin action trigger displays in the abandoned checkout details page. - */ - 'admin.abandoned-checkout-details.action.should-render': Extension< - StandardApi<'admin.abandoned-checkout-details.action.should-render'>, - ShouldRender - >; - - /** Catalog targets */ - /** - * Determines whether an admin action trigger displays in the catalog details page. - */ - 'admin.catalog-details.action.should-render': Extension< - StandardApi<'admin.catalog-details.action.should-render'>, - ShouldRender - >; - - /** Collection targets */ - /** - * Determines whether an admin action trigger displays in the collection index page. - */ - 'admin.collection-index.action.should-render': Extension< - StandardApi<'admin.collection-index.action.should-render'>, - ShouldRender - >; - - /** - * Determines whether an admin action trigger displays in the collection details page. - */ - 'admin.collection-details.action.should-render': Extension< - StandardApi<'admin.collection-details.action.should-render'>, - ShouldRender - >; - - /** Company targets */ - /** - * Determines whether an admin action trigger displays in the company details page. - */ - 'admin.company-details.action.should-render': Extension< - StandardApi<'admin.company-details.action.should-render'>, - ShouldRender - >; - - /** Customer targets */ - /** - * Determines whether an admin action trigger displays in the customer index page. - */ - 'admin.customer-index.action.should-render': Extension< - StandardApi<'admin.customer-index.action.should-render'>, - ShouldRender - >; - - /** - * Determines whether an admin action trigger displays in the customer bulk selection action. - */ - 'admin.customer-index.selection-action.should-render': Extension< - StandardApi<'admin.customer-index.selection-action.should-render'>, - ShouldRender - >; - - /** - * Determines whether an admin action trigger displays in the customer details page. - */ - 'admin.customer-details.action.should-render': Extension< - StandardApi<'admin.customer-details.action.should-render'>, - ShouldRender - >; - - /** - * Determines whether a customer segment admin action trigger displays in the customer details page. - */ - 'admin.customer-segment-details.action.should-render': Extension< - StandardApi<'admin.customer-segment-details.action.should-render'>, - ShouldRender - >; - - /** Discount targets */ - /** - * Determines whether an admin action trigger displays in the discount index page. - */ - 'admin.discount-index.action.should-render': Extension< - StandardApi<'admin.discount-index.action.should-render'>, - ShouldRender - >; - - /** - * Determines whether an admin action trigger displays in the discount details page. - */ - 'admin.discount-details.action.should-render': Extension< - StandardApi<'admin.discount-details.action.should-render'>, - ShouldRender - >; - - /** Draft order targets */ - /** - * Determines whether an admin action trigger displays in the draft order index page. - */ - 'admin.draft-order-index.action.should-render': Extension< - StandardApi<'admin.draft-order-index.action.should-render'>, - ShouldRender - >; - - /** - * Determines whether an admin action trigger displays in the draft order bulk selection action. - */ - 'admin.draft-order-index.selection-action.should-render': Extension< - StandardApi<'admin.draft-order-index.selection-action.should-render'>, - ShouldRender - >; - - /** - * Determines whether an admin action trigger displays in the draft order details page. - */ - 'admin.draft-order-details.action.should-render': Extension< - StandardApi<'admin.draft-order-details.action.should-render'>, - ShouldRender - >; - - /** Gift card targets */ - /** - * Determines whether an admin action trigger displays in the gift card details page. - */ - 'admin.gift-card-details.action.should-render': Extension< - StandardApi<'admin.gift-card-details.action.should-render'>, - ShouldRender - >; - - /** Order targets */ - /** - * Determines whether an admin action trigger displays in the order index page. - */ - 'admin.order-index.action.should-render': Extension< - StandardApi<'admin.order-index.action.should-render'>, - ShouldRender - >; - - /** - * Determines whether an admin action trigger displays in the order bulk selection action. - */ - 'admin.order-index.selection-action.should-render': Extension< - StandardApi<'admin.order-index.selection-action.should-render'>, - ShouldRender - >; - - /** - * Determines whether an admin action trigger displays in the order details page. - */ - 'admin.order-details.action.should-render': Extension< - StandardApi<'admin.order-details.action.should-render'>, - ShouldRender - >; - - /** - * Determines whether an admin action trigger displays in the order fulfilled card. - */ - 'admin.order-fulfilled-card.action.should-render': Extension< - StandardApi<'admin.order-fulfilled-card.action.should-render'>, - ShouldRender - >; - - /** Product targets */ - /** - * Determines whether an admin action trigger displays in the product index page. - */ - 'admin.product-index.action.should-render': Extension< - StandardApi<'admin.product-index.action.should-render'>, - ShouldRender - >; - - /** - * Determines whether an admin action trigger displays in the product bulk selection action. - */ - 'admin.product-index.selection-action.should-render': Extension< - StandardApi<'admin.product-index.selection-action.should-render'>, - ShouldRender - >; - - /** - * Determines whether an admin action trigger displays in the product details page. - */ - 'admin.product-details.action.should-render': Extension< - StandardApi<'admin.product-details.action.should-render'>, - ShouldRender - >; - - /** Product variant targets */ - /** - * Determines whether an admin action trigger displays in the product variant details page. - */ - 'admin.product-variant-details.action.should-render': Extension< - StandardApi<'admin.product-variant-details.action.should-render'>, - ShouldRender - >; -} - -export type ExtensionTarget = keyof ExtensionTargets; - -export type ExtensionForExtensionTarget = - ExtensionTargets[T]; diff --git a/packages/data-extensions/src/surfaces/admin/extension.ts b/packages/data-extensions/src/surfaces/admin/extension.ts deleted file mode 100644 index 7a8a0e3d3a..0000000000 --- a/packages/data-extensions/src/surfaces/admin/extension.ts +++ /dev/null @@ -1,8 +0,0 @@ -import {createExtensionRegistrationFunction} from '../../utilities/registration'; - -import type {ExtensionTargets} from './extension-targets'; - -export * from '../../extension'; - -export const dataExtension = - createExtensionRegistrationFunction(); diff --git a/packages/data-extensions/src/surfaces/admin/globals.ts b/packages/data-extensions/src/surfaces/admin/globals.ts deleted file mode 100644 index a162358c5c..0000000000 --- a/packages/data-extensions/src/surfaces/admin/globals.ts +++ /dev/null @@ -1,17 +0,0 @@ -import type {ExtensionTargets} from './extension-targets'; - -export interface ShopifyGlobal { - dataExtension( - target: ExtensionTarget, - callback: ExtensionTargets[ExtensionTarget], - ): void; -} - -declare global { - interface WorkerGlobalScope { - // conflicts with build/ts/globals.d.ts - // eslint-disable-next-line @typescript-eslint/ban-ts-comment - // @ts-ignore - readonly shopify: ShopifyGlobal; - } -} diff --git a/packages/data-extensions/src/utilities/registration.ts b/packages/data-extensions/src/utilities/registration.ts deleted file mode 100644 index 98efdc03d4..0000000000 --- a/packages/data-extensions/src/utilities/registration.ts +++ /dev/null @@ -1,20 +0,0 @@ -export interface ExtensionRegistrationFunction { - ( - target: Target, - callback: ExtensionPoints[Target], - ): ExtensionPoints[Target]; -} - -export function createExtensionRegistrationFunction< - ExtensionPoints, ->(): ExtensionRegistrationFunction { - const extensionWrapper: ExtensionRegistrationFunction = ( - target, - callback, - ) => { - (globalThis as any).shopify?.dataExtension(target, callback); - return callback; - }; - - return extensionWrapper; -} diff --git a/packages/data-extensions/tsconfig.json b/packages/data-extensions/tsconfig.json deleted file mode 100644 index 707d3d8df3..0000000000 --- a/packages/data-extensions/tsconfig.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "extends": "../../config/typescript/tsconfig.base.json", - "compilerOptions": { - "rootDir": "src", - "outDir": "build/ts", - "stripInternal": true - }, - "include": ["src/**/*.ts", "src/**/*.tsx"], - "exclude": ["src/**/*.example.*", "src/**/tests/**"] -} diff --git a/packages/ui-extensions-react/CHANGELOG.md b/packages/ui-extensions-react/CHANGELOG.md deleted file mode 100644 index 3d1609a028..0000000000 --- a/packages/ui-extensions-react/CHANGELOG.md +++ /dev/null @@ -1,392 +0,0 @@ -# @shopify/ui-extensions-react - -## 2024.10.0 - -### Minor Changes - -- [#2371](https://github.com/Shopify/ui-extensions/pull/2371) [`28edde440ceee584c71c5ac983252ca71a7f853a`](https://github.com/Shopify/ui-extensions/commit/28edde440ceee584c71c5ac983252ca71a7f853a) Thanks [@shopify-github-actions-access](https://github.com/apps/shopify-github-actions-access)! - Adds `type` property to `selectedPaymentOption` - -- [#2361](https://github.com/Shopify/ui-extensions/pull/2361) [`89438897001dce9058030e6ee1655747a66ec71a`](https://github.com/Shopify/ui-extensions/commit/89438897001dce9058030e6ee1655747a66ec71a) Thanks [@oliverigor](https://github.com/oliverigor)! - Add primary and secondary actions to Modal component - -- [#2297](https://github.com/Shopify/ui-extensions/pull/2297) [`7ab538090e8bcef052bfc782b31639efe89ff262`](https://github.com/Shopify/ui-extensions/commit/7ab538090e8bcef052bfc782b31639efe89ff262) Thanks [@shopify-github-actions-access](https://github.com/apps/shopify-github-actions-access)! - update generate-doc version, add attributes to Icon - -- [#2220](https://github.com/Shopify/ui-extensions/pull/2220) [`9e619fca6ea4f816148c90158b46bc1db5bfbad7`](https://github.com/Shopify/ui-extensions/commit/9e619fca6ea4f816148c90158b46bc1db5bfbad7) Thanks [@LucasLacerdaUX](https://github.com/LucasLacerdaUX)! - Add QRCode component - -### Patch Changes - -- [#2284](https://github.com/Shopify/ui-extensions/pull/2284) [`f84592931962537d345dfd68bf2a2f2396373740`](https://github.com/Shopify/ui-extensions/commit/f84592931962537d345dfd68bf2a2f2396373740) Thanks [@brianshen1990](https://github.com/brianshen1990)! - expose Switch component to customer account unstable surface - -- [#2356](https://github.com/Shopify/ui-extensions/pull/2356) [`a2d458be51a708aeac6a1879554051f98371f908`](https://github.com/Shopify/ui-extensions/commit/a2d458be51a708aeac6a1879554051f98371f908) Thanks [@brianshen1990](https://github.com/brianshen1990)! - add full page navigation api to order full page extension target - -- [#2347](https://github.com/Shopify/ui-extensions/pull/2347) [`dd8a861caba591c1087e8349e8a9bbfdc2681cb8`](https://github.com/Shopify/ui-extensions/commit/dd8a861caba591c1087e8349e8a9bbfdc2681cb8) Thanks [@brianshen1990](https://github.com/brianshen1990)! - Add customer-account.order.page.render target - -- [#2369](https://github.com/Shopify/ui-extensions/pull/2369) [`7ef1d9cdd37c42277e240eb660e08de54967461c`](https://github.com/Shopify/ui-extensions/commit/7ef1d9cdd37c42277e240eb660e08de54967461c) Thanks [@brianshen1990](https://github.com/brianshen1990)! - update error message for useNavigationCurrentEntry api - -- Updated dependencies [[`21234eea51b50dfc53d3fc4962512728b4a19446`](https://github.com/Shopify/ui-extensions/commit/21234eea51b50dfc53d3fc4962512728b4a19446), [`28edde440ceee584c71c5ac983252ca71a7f853a`](https://github.com/Shopify/ui-extensions/commit/28edde440ceee584c71c5ac983252ca71a7f853a), [`89438897001dce9058030e6ee1655747a66ec71a`](https://github.com/Shopify/ui-extensions/commit/89438897001dce9058030e6ee1655747a66ec71a), [`f84592931962537d345dfd68bf2a2f2396373740`](https://github.com/Shopify/ui-extensions/commit/f84592931962537d345dfd68bf2a2f2396373740), [`9347443b76210c2f9f3ce45bb488c38ec08efb6f`](https://github.com/Shopify/ui-extensions/commit/9347443b76210c2f9f3ce45bb488c38ec08efb6f), [`fd4ecf2aef0414e790a4a78ae6a9fa013acbafda`](https://github.com/Shopify/ui-extensions/commit/fd4ecf2aef0414e790a4a78ae6a9fa013acbafda), [`118654e61e393c2885198ab5dafddb4cf4d62669`](https://github.com/Shopify/ui-extensions/commit/118654e61e393c2885198ab5dafddb4cf4d62669), [`4dec3851bf53f6cf289ca8c265cd13f8c123ab06`](https://github.com/Shopify/ui-extensions/commit/4dec3851bf53f6cf289ca8c265cd13f8c123ab06), [`9fe9d56d190fee5ee444ed980a5ef60106dfda12`](https://github.com/Shopify/ui-extensions/commit/9fe9d56d190fee5ee444ed980a5ef60106dfda12), [`7ab538090e8bcef052bfc782b31639efe89ff262`](https://github.com/Shopify/ui-extensions/commit/7ab538090e8bcef052bfc782b31639efe89ff262), [`a2d458be51a708aeac6a1879554051f98371f908`](https://github.com/Shopify/ui-extensions/commit/a2d458be51a708aeac6a1879554051f98371f908), [`8bca1a1710431083b7e98966ec76f3fe17720d5c`](https://github.com/Shopify/ui-extensions/commit/8bca1a1710431083b7e98966ec76f3fe17720d5c), [`a8de80b0e252ebd0c529bfe88d02d2e35e2a0461`](https://github.com/Shopify/ui-extensions/commit/a8de80b0e252ebd0c529bfe88d02d2e35e2a0461), [`dd8a861caba591c1087e8349e8a9bbfdc2681cb8`](https://github.com/Shopify/ui-extensions/commit/dd8a861caba591c1087e8349e8a9bbfdc2681cb8), [`f81712b643430dd1cbdce54b3edf0c80bc0dafe5`](https://github.com/Shopify/ui-extensions/commit/f81712b643430dd1cbdce54b3edf0c80bc0dafe5), [`7ef1d9cdd37c42277e240eb660e08de54967461c`](https://github.com/Shopify/ui-extensions/commit/7ef1d9cdd37c42277e240eb660e08de54967461c), [`37620b9d47f38586c843a9c11a6de2e0461bc0dd`](https://github.com/Shopify/ui-extensions/commit/37620b9d47f38586c843a9c11a6de2e0461bc0dd), [`9e619fca6ea4f816148c90158b46bc1db5bfbad7`](https://github.com/Shopify/ui-extensions/commit/9e619fca6ea4f816148c90158b46bc1db5bfbad7), [`9f7ee640e434bb175b90248c29bb194f321e871a`](https://github.com/Shopify/ui-extensions/commit/9f7ee640e434bb175b90248c29bb194f321e871a), [`d6ac8d4e4180eef5242719bfaffe998441be1aa9`](https://github.com/Shopify/ui-extensions/commit/d6ac8d4e4180eef5242719bfaffe998441be1aa9)]: - - @shopify/ui-extensions@2024.10.0 - -## 2024.7.0 - -### Minor Changes - -- [#1888](https://github.com/Shopify/ui-extensions/pull/1888) [`199a90fef0f4ce90a8f6ae6a8298c9d9c437f2f4`](https://github.com/Shopify/ui-extensions/commit/199a90fef0f4ce90a8f6ae6a8298c9d9c437f2f4) Thanks [@elanalynn](https://github.com/elanalynn)! - Add new block extension targets: collection, draft-order, abandoned-checkout, and product-variant - -- [#1981](https://github.com/Shopify/ui-extensions/pull/1981) [`ba2510f0f4737a56abe4171a08b8adea4488f8b4`](https://github.com/Shopify/ui-extensions/commit/ba2510f0f4737a56abe4171a08b8adea4488f8b4) Thanks [@shopify-github-actions-access](https://github.com/apps/shopify-github-actions-access)! - Updates Order Status API with `processedAt` attribute - -- [#1987](https://github.com/Shopify/ui-extensions/pull/1987) [`952489d3c27a2f5c8bcdad29e516480fe71e94e8`](https://github.com/Shopify/ui-extensions/commit/952489d3c27a2f5c8bcdad29e516480fe71e94e8) Thanks [@rcaplanshopify](https://github.com/rcaplanshopify)! - - Adds `useCustomerPrivacy` hook. - -- [#2144](https://github.com/Shopify/ui-extensions/pull/2144) [`321749e68edf6d64a82ffe2c4c99d0f19ac4e63c`](https://github.com/Shopify/ui-extensions/commit/321749e68edf6d64a82ffe2c4c99d0f19ac4e63c) Thanks [@jamesvidler](https://github.com/jamesvidler)! - Added `CartInstructions` (accessed using `api.instructions`) to checkout. These represent the cart instructions used to create the checkout and possibly limit extension capabilities. These instructions should be checked prior to performing any actions that may be affected by them. - - For example, if you intend to add a discount code via the `applyDiscountCodeChange` method, check `api.instructions.discounts.canUpdateDiscountCodes` to ensure it's supported in this checkout. - -- [#2067](https://github.com/Shopify/ui-extensions/pull/2067) [`3c3505c16c1deb6f202cbecf6747c0fdc6b79228`](https://github.com/Shopify/ui-extensions/commit/3c3505c16c1deb6f202cbecf6747c0fdc6b79228) Thanks [@shopify-github-actions-access](https://github.com/apps/shopify-github-actions-access)! - Support split shipping in Shipping option list and item targets. - -- [#1924](https://github.com/Shopify/ui-extensions/pull/1924) [`a4f275abcb0c0166e0383fc5c1ed544b938def29`](https://github.com/Shopify/ui-extensions/commit/a4f275abcb0c0166e0383fc5c1ed544b938def29) Thanks [@rcaplanshopify](https://github.com/rcaplanshopify)! - - Adds the ability to read and write tracking consent metafield data to the Customer Privacy API. - - - Updates the `Sheet` component and examples. - -- [#1807](https://github.com/Shopify/ui-extensions/pull/1807) [`08067cbba140d72f115e38f218dd0caead13f0d5`](https://github.com/Shopify/ui-extensions/commit/08067cbba140d72f115e38f218dd0caead13f0d5) Thanks [@nataliejeong](https://github.com/nataliejeong)! - Add Extension Target for Reorder Flow - -- [#2040](https://github.com/Shopify/ui-extensions/pull/2040) [`c8d876e83f3144361e09c375c3dc89af2029655b`](https://github.com/Shopify/ui-extensions/commit/c8d876e83f3144361e09c375c3dc89af2029655b) Thanks [@elanalynn](https://github.com/elanalynn)! - Add AdminPrintAction component - -- [#2065](https://github.com/Shopify/ui-extensions/pull/2065) [`c2c51b82135fadf9dd4a2b1ad95dc59cabd9064c`](https://github.com/Shopify/ui-extensions/commit/c2c51b82135fadf9dd4a2b1ad95dc59cabd9064c) Thanks [@elanalynn](https://github.com/elanalynn)! - Add admin print action targets - -- [#2118](https://github.com/Shopify/ui-extensions/pull/2118) [`0016e7e5031934e21b26398958d69b97a20ccebd`](https://github.com/Shopify/ui-extensions/commit/0016e7e5031934e21b26398958d69b97a20ccebd) Thanks [@shopify-github-actions-access](https://github.com/apps/shopify-github-actions-access)! - - Adds `oneTimeUse` to `ShippingAddress` to denote whether the address can be saved in checkout. - - - Adds `sku` to `ProductVariant` in checkout. - - Adds `bullet` icon in checkout. - -- [#1916](https://github.com/Shopify/ui-extensions/pull/1916) [`f9a593edd7bc6ea9f46f3927efd3b9fa6ebc5b5a`](https://github.com/Shopify/ui-extensions/commit/f9a593edd7bc6ea9f46f3927efd3b9fa6ebc5b5a) Thanks [@mleandres](https://github.com/mleandres)! - - Adds `purchase.address-autocomplete.suggest` extension target - - Adds the `primaryAction` and `secondaryAction` to the `Sheet` component - -### Patch Changes - -- [#2015](https://github.com/Shopify/ui-extensions/pull/2015) [`5ded8d2cb5d9ae502aa75183714f84dc92b820ea`](https://github.com/Shopify/ui-extensions/commit/5ded8d2cb5d9ae502aa75183714f84dc92b820ea) Thanks [@PSalmers](https://github.com/PSalmers)! - Homogenizes terminology to use the term "placement" in place of "supported location", "placement reference", and others. - -- [#2037](https://github.com/Shopify/ui-extensions/pull/2037) [`0fd33b35c651b89d24c4fc560f376e91658d70a6`](https://github.com/Shopify/ui-extensions/commit/0fd33b35c651b89d24c4fc560f376e91658d70a6) Thanks [@brianshen1990](https://github.com/brianshen1990)! - add authenticationState api to customer account ui extension - -- [#2053](https://github.com/Shopify/ui-extensions/pull/2053) [`9c1777d48e0d81fea811cfbcd9764e98cf65778d`](https://github.com/Shopify/ui-extensions/commit/9c1777d48e0d81fea811cfbcd9764e98cf65778d) Thanks [@ncardeli](https://github.com/ncardeli)! - Publish display property - -- [#2014](https://github.com/Shopify/ui-extensions/pull/2014) [`ac077c8becee6f02fbb4fd9f04d029dbf9b838f2`](https://github.com/Shopify/ui-extensions/commit/ac077c8becee6f02fbb4fd9f04d029dbf9b838f2) Thanks [@oliverigor](https://github.com/oliverigor)! - Add Switch component - -- [#1942](https://github.com/Shopify/ui-extensions/pull/1942) [`b086046068ccb984b37c92a4e17378ada1774524`](https://github.com/Shopify/ui-extensions/commit/b086046068ccb984b37c92a4e17378ada1774524) Thanks [@jamesvidler](https://github.com/jamesvidler)! - Improve error messaging when a React hook is used from a different API surface than the extension calling it. - -- Updated dependencies [[`5ded8d2cb5d9ae502aa75183714f84dc92b820ea`](https://github.com/Shopify/ui-extensions/commit/5ded8d2cb5d9ae502aa75183714f84dc92b820ea), [`199a90fef0f4ce90a8f6ae6a8298c9d9c437f2f4`](https://github.com/Shopify/ui-extensions/commit/199a90fef0f4ce90a8f6ae6a8298c9d9c437f2f4), [`ba2510f0f4737a56abe4171a08b8adea4488f8b4`](https://github.com/Shopify/ui-extensions/commit/ba2510f0f4737a56abe4171a08b8adea4488f8b4), [`952489d3c27a2f5c8bcdad29e516480fe71e94e8`](https://github.com/Shopify/ui-extensions/commit/952489d3c27a2f5c8bcdad29e516480fe71e94e8), [`321749e68edf6d64a82ffe2c4c99d0f19ac4e63c`](https://github.com/Shopify/ui-extensions/commit/321749e68edf6d64a82ffe2c4c99d0f19ac4e63c), [`a87b8f3ac19ba9db78ed5933c2e0099195dc8c5b`](https://github.com/Shopify/ui-extensions/commit/a87b8f3ac19ba9db78ed5933c2e0099195dc8c5b), [`47512e33ddfb3d99a48fbcebdd20647cbc149fd7`](https://github.com/Shopify/ui-extensions/commit/47512e33ddfb3d99a48fbcebdd20647cbc149fd7), [`3c3505c16c1deb6f202cbecf6747c0fdc6b79228`](https://github.com/Shopify/ui-extensions/commit/3c3505c16c1deb6f202cbecf6747c0fdc6b79228), [`0c05f0d17d91a9cb7ad61f1806d7d0a20bd09912`](https://github.com/Shopify/ui-extensions/commit/0c05f0d17d91a9cb7ad61f1806d7d0a20bd09912), [`c30a9639a5209862f4177f26ef3bc26e299c3c7b`](https://github.com/Shopify/ui-extensions/commit/c30a9639a5209862f4177f26ef3bc26e299c3c7b), [`0fd33b35c651b89d24c4fc560f376e91658d70a6`](https://github.com/Shopify/ui-extensions/commit/0fd33b35c651b89d24c4fc560f376e91658d70a6), [`a4f275abcb0c0166e0383fc5c1ed544b938def29`](https://github.com/Shopify/ui-extensions/commit/a4f275abcb0c0166e0383fc5c1ed544b938def29), [`9c1777d48e0d81fea811cfbcd9764e98cf65778d`](https://github.com/Shopify/ui-extensions/commit/9c1777d48e0d81fea811cfbcd9764e98cf65778d), [`08067cbba140d72f115e38f218dd0caead13f0d5`](https://github.com/Shopify/ui-extensions/commit/08067cbba140d72f115e38f218dd0caead13f0d5), [`ac077c8becee6f02fbb4fd9f04d029dbf9b838f2`](https://github.com/Shopify/ui-extensions/commit/ac077c8becee6f02fbb4fd9f04d029dbf9b838f2), [`bf839358269255bb6a86fd9a64295b4ea89d6004`](https://github.com/Shopify/ui-extensions/commit/bf839358269255bb6a86fd9a64295b4ea89d6004), [`c8d876e83f3144361e09c375c3dc89af2029655b`](https://github.com/Shopify/ui-extensions/commit/c8d876e83f3144361e09c375c3dc89af2029655b), [`c2c51b82135fadf9dd4a2b1ad95dc59cabd9064c`](https://github.com/Shopify/ui-extensions/commit/c2c51b82135fadf9dd4a2b1ad95dc59cabd9064c), [`b086046068ccb984b37c92a4e17378ada1774524`](https://github.com/Shopify/ui-extensions/commit/b086046068ccb984b37c92a4e17378ada1774524), [`0016e7e5031934e21b26398958d69b97a20ccebd`](https://github.com/Shopify/ui-extensions/commit/0016e7e5031934e21b26398958d69b97a20ccebd), [`a744908ee0cedbc627a7bfac18294f34cad8746d`](https://github.com/Shopify/ui-extensions/commit/a744908ee0cedbc627a7bfac18294f34cad8746d), [`f9a593edd7bc6ea9f46f3927efd3b9fa6ebc5b5a`](https://github.com/Shopify/ui-extensions/commit/f9a593edd7bc6ea9f46f3927efd3b9fa6ebc5b5a)]: - - @shopify/ui-extensions@2024.7.0 - -## 2024.4.0 - -### Minor Changes - -- [#1693](https://github.com/Shopify/ui-extensions/pull/1693) [`5d2905b1`](https://github.com/Shopify/ui-extensions/commit/5d2905b15f6dda6e311022fd1d93c7865db0d157) Thanks [@elskhn](https://github.com/elskhn)! - Adds new `purchase.checkout.pickup-location-option-item.render-after` extension target, rendered inside each local pickup option item. - -- [#1781](https://github.com/Shopify/ui-extensions/pull/1781) [`0772c011`](https://github.com/Shopify/ui-extensions/commit/0772c011f27ace1c51242ed1b116511076c00bff) Thanks [@jonathanhamel4](https://github.com/jonathanhamel4)! - Adds `buyerJourney.steps`, `buyerJourney.activeStep`, and their associated react hooks to the checkout surface API. - -- [#1673](https://github.com/Shopify/ui-extensions/pull/1673) [`21cb3205`](https://github.com/Shopify/ui-extensions/commit/21cb32055f97060a75a1f28af8721208d09544ca) Thanks [@brianshen1990](https://github.com/brianshen1990)! - add requireLogin for CA order status api - -- [#1837](https://github.com/Shopify/ui-extensions/pull/1837) [`947b4433`](https://github.com/Shopify/ui-extensions/commit/947b4433a494c05a197aab6460ecff405df27163) Thanks [@JoshuaWhite1](https://github.com/JoshuaWhite1)! - add new targets for action extensions - -- [#1689](https://github.com/Shopify/ui-extensions/pull/1689) [`dd256672`](https://github.com/Shopify/ui-extensions/commit/dd256672a055363064029b417c1659c38efbd907) Thanks [@klenotiw](https://github.com/klenotiw)! - Adds the new `customerPrivacy` and `applyTrackingConsentChange` APIs. - -### Patch Changes - -- [#1695](https://github.com/Shopify/ui-extensions/pull/1695) [`c6c4a60d`](https://github.com/Shopify/ui-extensions/commit/c6c4a60deff13f066689827a8523a5a03e260d76) Thanks [@cpeddecord](https://github.com/cpeddecord)! - exporting FunctionSettingsError - -- [#1719](https://github.com/Shopify/ui-extensions/pull/1719) [`4dcef623`](https://github.com/Shopify/ui-extensions/commit/4dcef62306b85cede34735b0dd9247a75cbf9132) Thanks [@Fionoble](https://github.com/Fionoble)! - Export Paragraph in ui-extensions-react/admin - -- [#1860](https://github.com/Shopify/ui-extensions/pull/1860) [`0961c0f1`](https://github.com/Shopify/ui-extensions/commit/0961c0f19bb82bb787053893f065694cbe1eabbb) Thanks [@jamesvidler](https://github.com/jamesvidler)! - The `useDeliveryGroup()` react hook in the checkout surface no longer throws an exception if the delivery group is undefined. - -- [#1684](https://github.com/Shopify/ui-extensions/pull/1684) [`48a5f605`](https://github.com/Shopify/ui-extensions/commit/48a5f605163deec6d1d01f1fcecd32eee4259493) Thanks [@cpeddecord](https://github.com/cpeddecord)! - New `Section` component available to admin UI extensions. - -- [#1658](https://github.com/Shopify/ui-extensions/pull/1658) [`58026776`](https://github.com/Shopify/ui-extensions/commit/58026776a7e86f5fb2b1fd086ceec903d7577615) Thanks [@brianshen1990](https://github.com/brianshen1990)! - Drop runExtension support for customer account ui extension - -- [#1685](https://github.com/Shopify/ui-extensions/pull/1685) [`a1b884ed`](https://github.com/Shopify/ui-extensions/commit/a1b884ed64c39954a6cd9d6db0dbf42b93395628) Thanks [@brianshen1990](https://github.com/brianshen1990)! - expose authenticated account related hooks - -- [#1679](https://github.com/Shopify/ui-extensions/pull/1679) [`45687187`](https://github.com/Shopify/ui-extensions/commit/4568718724d88b7a6ca48d7481a8086f32b8dda4) Thanks [@cpeddecord](https://github.com/cpeddecord)! - Adds a top-level component to admin surface - -- [#1678](https://github.com/Shopify/ui-extensions/pull/1678) [`cf51fb00`](https://github.com/Shopify/ui-extensions/commit/cf51fb001d032a488e39cb352e0cc67905e60232) Thanks [@thomas-marcucci](https://github.com/thomas-marcucci)! - Adds support for async render functions for Admin extensions - -- Updated dependencies [[`c6c4a60d`](https://github.com/Shopify/ui-extensions/commit/c6c4a60deff13f066689827a8523a5a03e260d76), [`57ab9d90`](https://github.com/Shopify/ui-extensions/commit/57ab9d9097f0ec725a4e543fb927d9f326f5aca4), [`48a5f605`](https://github.com/Shopify/ui-extensions/commit/48a5f605163deec6d1d01f1fcecd32eee4259493), [`8476dfee`](https://github.com/Shopify/ui-extensions/commit/8476dfeeb6142a3c01f8af3c869bf4d1cd430d0f), [`e5b82886`](https://github.com/Shopify/ui-extensions/commit/e5b828867ba9f0aa41e74e9439ec47517d463dc7), [`7d2fdcb5`](https://github.com/Shopify/ui-extensions/commit/7d2fdcb5550e235ed001f7111a8d8d2d28088789), [`58026776`](https://github.com/Shopify/ui-extensions/commit/58026776a7e86f5fb2b1fd086ceec903d7577615), [`5d2905b1`](https://github.com/Shopify/ui-extensions/commit/5d2905b15f6dda6e311022fd1d93c7865db0d157), [`6211f9a5`](https://github.com/Shopify/ui-extensions/commit/6211f9a5fa0cc6e806d69e507d5e4a99c72de5f4), [`0772c011`](https://github.com/Shopify/ui-extensions/commit/0772c011f27ace1c51242ed1b116511076c00bff), [`21cb3205`](https://github.com/Shopify/ui-extensions/commit/21cb32055f97060a75a1f28af8721208d09544ca), [`a1b884ed`](https://github.com/Shopify/ui-extensions/commit/a1b884ed64c39954a6cd9d6db0dbf42b93395628), [`e096e9a2`](https://github.com/Shopify/ui-extensions/commit/e096e9a248dd95c5c0aad44d514b87ba2dab7661), [`43390b05`](https://github.com/Shopify/ui-extensions/commit/43390b05cd0685dd62c226ab5f1c2f9294974bf7), [`45687187`](https://github.com/Shopify/ui-extensions/commit/4568718724d88b7a6ca48d7481a8086f32b8dda4), [`02ca0b9a`](https://github.com/Shopify/ui-extensions/commit/02ca0b9a56206d14ec742c062ca6b66c46f67c30), [`9d21ef30`](https://github.com/Shopify/ui-extensions/commit/9d21ef3052269f7fa568329960ebc1cd35422aea), [`947b4433`](https://github.com/Shopify/ui-extensions/commit/947b4433a494c05a197aab6460ecff405df27163), [`dd256672`](https://github.com/Shopify/ui-extensions/commit/dd256672a055363064029b417c1659c38efbd907)]: - - @shopify/ui-extensions@2024.4.0 - -## 2024.1.0 - -### Major Changes - -- [#1585](https://github.com/Shopify/ui-extensions/pull/1585) [`70f9bdc1`](https://github.com/Shopify/ui-extensions/commit/70f9bdc1bd0a4caf3d6b0d7033dcef0a012b3f90) Thanks [@jamesvidler](https://github.com/jamesvidler)! - The `purchase.checkout.shipping-option-list.render-before` and `purchase.checkout.shipping-option-list.render-after` will be duplicated for possible types of delivery groups (One Time Purchase and Subscription). - You can use the new `target` or `useDeliveryGroupTarget()` React hook to access the delivery group the extension is attached to. - -### Minor Changes - -- [#1515](https://github.com/Shopify/ui-extensions/pull/1515) [`2452a939`](https://github.com/Shopify/ui-extensions/commit/2452a939e84c1a13ef1a107360419edee6c3a1d9) Thanks [@rcaplanshopify](https://github.com/rcaplanshopify)! - Adds custom header and footer unified extension targets for checkout and thank you pages - -- [#1601](https://github.com/Shopify/ui-extensions/pull/1601) [`ccbb2353`](https://github.com/Shopify/ui-extensions/commit/ccbb235377cb5c725832726abca99b1bc2f52a7b) Thanks [@belalsj](https://github.com/belalsj)! - Add tooltip component and update Button and Text with interestTarget API - -- [#1472](https://github.com/Shopify/ui-extensions/pull/1472) [`9c836557`](https://github.com/Shopify/ui-extensions/commit/9c836557d97f08496bb073a11a0fb209eb176f5f) Thanks [@sirgalleto](https://github.com/sirgalleto)! - Add order routing extension targets and API - -- [#1424](https://github.com/Shopify/ui-extensions/pull/1424) [`9a8dda8c`](https://github.com/Shopify/ui-extensions/commit/9a8dda8c9332d5ed24fa020f6b03106e2da14e9c) Thanks [@MitchLillie](https://github.com/MitchLillie)! - Add Badge component to admin - -- [#1453](https://github.com/Shopify/ui-extensions/pull/1453) [`63aea230`](https://github.com/Shopify/ui-extensions/commit/63aea230d7913c08b72cdf51445a974c56cf0d17) Thanks [@charlesdobson](https://github.com/charlesdobson)! - Add Badge component to admin - -- [#1428](https://github.com/Shopify/ui-extensions/pull/1428) [`9cd7d6f9`](https://github.com/Shopify/ui-extensions/commit/9cd7d6f9977683456399aed34f730adeecf98443) Thanks [@MitchLillie](https://github.com/MitchLillie)! - Add Banner component to admin - -- [#1430](https://github.com/Shopify/ui-extensions/pull/1430) [`0a8b378a`](https://github.com/Shopify/ui-extensions/commit/0a8b378aac8ecc98c9b2d8b4142618aa50082663) Thanks [@MitchLillie](https://github.com/MitchLillie)! - Add ChoiceList to admin - -- [#1431](https://github.com/Shopify/ui-extensions/pull/1431) [`8f82c578`](https://github.com/Shopify/ui-extensions/commit/8f82c5784944ed63d20a02859561d6655257edc2) Thanks [@MitchLillie](https://github.com/MitchLillie)! - Add ProgressIndicator to admin - -- [#1625](https://github.com/Shopify/ui-extensions/pull/1625) [`29625d18`](https://github.com/Shopify/ui-extensions/commit/29625d18c269b1cb0e9ffe0b890c466d4a6901a8) Thanks [@billfienberg](https://github.com/billfienberg)! - Add ColorPicker remote component - -### Patch Changes - -- [#1437](https://github.com/Shopify/ui-extensions/pull/1437) [`6de2fce0`](https://github.com/Shopify/ui-extensions/commit/6de2fce01bc32174089f91aafd870877a878a6eb) Thanks [@shopi-dori](https://github.com/shopi-dori)! - Adds the `bankIdNumber` to the `PaymentOptionItemApi`. - Adds `background` to `View`, `Grid`, `GridItem`, `Pressable`, `ScrollView`, `InlineStack`, and `BlockStack` components. - -- [#1503](https://github.com/Shopify/ui-extensions/pull/1503) [`f4268b21`](https://github.com/Shopify/ui-extensions/commit/f4268b216c4ba75728c75a239b35354ab467dd6c) Thanks [@anahita-m](https://github.com/anahita-m)! - Removing legacy customer account extension targets - -- [#1473](https://github.com/Shopify/ui-extensions/pull/1473) [`903a62c7`](https://github.com/Shopify/ui-extensions/commit/903a62c7db9f2bf980c44f358445991864f644e6) Thanks [@mikewilson01](https://github.com/mikewilson01)! - Add additional props to LWS component - -- [#1448](https://github.com/Shopify/ui-extensions/pull/1448) [`be9465df`](https://github.com/Shopify/ui-extensions/commit/be9465df3f58c3fd439b6bbb9424c7caf0bafb7e) Thanks [@robin-drexler](https://github.com/robin-drexler)! - add previously internal customer account apis to unstable - -- [#1458](https://github.com/Shopify/ui-extensions/pull/1458) [`1fb524f6`](https://github.com/Shopify/ui-extensions/commit/1fb524f695f65541df0b9dbec93e0b8b5c65386c) Thanks [@robin-drexler](https://github.com/robin-drexler)! - fix policy modal handling - -- [#1456](https://github.com/Shopify/ui-extensions/pull/1456) [`9faac927`](https://github.com/Shopify/ui-extensions/commit/9faac927bc35473aa0aa541e0cbe881c5698345f) Thanks [@robin-drexler](https://github.com/robin-drexler)! - add some missing exports to customer-account react extensions' - -- [#1434](https://github.com/Shopify/ui-extensions/pull/1434) [`b45e1b7f`](https://github.com/Shopify/ui-extensions/commit/b45e1b7f5d1642a0eb8f3d9055d541dc8dda2f13) Thanks [@mikewilson01](https://github.com/mikewilson01)! - Add onStatusChange callback to LoginWithShop component - -- [#1466](https://github.com/Shopify/ui-extensions/pull/1466) [`e53621b6`](https://github.com/Shopify/ui-extensions/commit/e53621b6457f68331d7c6b175b078627ef3fa7ea) Thanks [@mikewilson01](https://github.com/mikewilson01)! - Update props for LoginWithShop component - -- [#1496](https://github.com/Shopify/ui-extensions/pull/1496) [`bb30cc52`](https://github.com/Shopify/ui-extensions/commit/bb30cc52550b1e973ef8560b3f742c3c5c6c9b3f) Thanks [@brianshen1990](https://github.com/brianshen1990)! - remove deprecated fields from doc in customer account ui extensions - -- [#1437](https://github.com/Shopify/ui-extensions/pull/1437) [`4bde0584`](https://github.com/Shopify/ui-extensions/commit/4bde058494cd714f88b1b01d592150417e19f6e4) Thanks [@shopi-dori](https://github.com/shopi-dori)! - Adds `usePaymentMethodAttributes`, `usePaymentMethodAttributeValues`, and `useApplyPaymentMethodAttributeChange` React hooks. - -- [#1598](https://github.com/Shopify/ui-extensions/pull/1598) [`345ed9a0`](https://github.com/Shopify/ui-extensions/commit/345ed9a00d3fb1d9f35be4e92dcf022d29794aba) Thanks [@MitchLillie](https://github.com/MitchLillie)! - Deprecate summary prop for AdminBlock - -- [#1526](https://github.com/Shopify/ui-extensions/pull/1526) [`22ac2d9b`](https://github.com/Shopify/ui-extensions/commit/22ac2d9bcd7a47747f7f733183cbedaae2634c62) Thanks [@oluwatimio](https://github.com/oluwatimio)! - Adds a hook called `useNavigationCurrentEntry` that will always track and return the latest current entry for a full page customer account ui extension - -- Updated dependencies [[`6de2fce0`](https://github.com/Shopify/ui-extensions/commit/6de2fce01bc32174089f91aafd870877a878a6eb), [`f4268b21`](https://github.com/Shopify/ui-extensions/commit/f4268b216c4ba75728c75a239b35354ab467dd6c), [`8f82c578`](https://github.com/Shopify/ui-extensions/commit/8f82c5784944ed63d20a02859561d6655257edc2), [`903a62c7`](https://github.com/Shopify/ui-extensions/commit/903a62c7db9f2bf980c44f358445991864f644e6), [`0f0e410d`](https://github.com/Shopify/ui-extensions/commit/0f0e410d1b1c8a787a45227c86b256131031a114), [`9a8dda8c`](https://github.com/Shopify/ui-extensions/commit/9a8dda8c9332d5ed24fa020f6b03106e2da14e9c), [`2452a939`](https://github.com/Shopify/ui-extensions/commit/2452a939e84c1a13ef1a107360419edee6c3a1d9), [`be9465df`](https://github.com/Shopify/ui-extensions/commit/be9465df3f58c3fd439b6bbb9424c7caf0bafb7e), [`0a8b378a`](https://github.com/Shopify/ui-extensions/commit/0a8b378aac8ecc98c9b2d8b4142618aa50082663), [`f68d0d75`](https://github.com/Shopify/ui-extensions/commit/f68d0d7503a0d2509bab5ee1c148901d468cc9cb), [`ccbb2353`](https://github.com/Shopify/ui-extensions/commit/ccbb235377cb5c725832726abca99b1bc2f52a7b), [`1fb524f6`](https://github.com/Shopify/ui-extensions/commit/1fb524f695f65541df0b9dbec93e0b8b5c65386c), [`b45e1b7f`](https://github.com/Shopify/ui-extensions/commit/b45e1b7f5d1642a0eb8f3d9055d541dc8dda2f13), [`e53621b6`](https://github.com/Shopify/ui-extensions/commit/e53621b6457f68331d7c6b175b078627ef3fa7ea), [`29625d18`](https://github.com/Shopify/ui-extensions/commit/29625d18c269b1cb0e9ffe0b890c466d4a6901a8), [`70f9bdc1`](https://github.com/Shopify/ui-extensions/commit/70f9bdc1bd0a4caf3d6b0d7033dcef0a012b3f90), [`9c836557`](https://github.com/Shopify/ui-extensions/commit/9c836557d97f08496bb073a11a0fb209eb176f5f), [`bb30cc52`](https://github.com/Shopify/ui-extensions/commit/bb30cc52550b1e973ef8560b3f742c3c5c6c9b3f), [`cbc51b33`](https://github.com/Shopify/ui-extensions/commit/cbc51b33d376370bff9f4dc980e66b495f5fcfaa), [`345ed9a0`](https://github.com/Shopify/ui-extensions/commit/345ed9a00d3fb1d9f35be4e92dcf022d29794aba), [`9cd7d6f9`](https://github.com/Shopify/ui-extensions/commit/9cd7d6f9977683456399aed34f730adeecf98443)]: - - @shopify/ui-extensions@2024.1.0 - -## 2023.10.0 - -### Major Changes - -- [#1296](https://github.com/Shopify/ui-extensions/pull/1296) [`a8e16322`](https://github.com/Shopify/ui-extensions/commit/a8e16322b367c4efd079d8e69331bd234bedb0c8) Thanks [@MitchLillie](https://github.com/MitchLillie)! - Bump `@remote-ui/core` and `@remote-ui/react` versions. - - > **Warning**: Extensions using `@shopify/ui-extensions-react` must now use react `^18.0.0` or greater. - - Extensions are also expected to reconcile their own react version. - - In order to use the latest version of `@shopify/ui-extensions-react`, you should modify your `package.json` to resemble the following: - - ``` - { - ... - "dependencies": { - "react": "^18.0.0", - "@shopify/ui-extensions": "2023.10.x", - "@shopify/ui-extensions-react": "2023.10.x", - "react-reconciler": "0.29.0" - }, - "devDependencies": { - "@types/react": "^18.0.0" - } - } - ``` - -### Minor Changes - -- [#1340](https://github.com/Shopify/ui-extensions/pull/1340) [`a7ea6cb0`](https://github.com/Shopify/ui-extensions/commit/a7ea6cb06c3838228bfeefa94d4826b747720ad3) Thanks [@lsit](https://github.com/lsit)! - Add PaymentIcon component to the checkout surface - -- [#1351](https://github.com/Shopify/ui-extensions/pull/1351) [`8df8429b`](https://github.com/Shopify/ui-extensions/commit/8df8429b69c3bdec736d0885c922be1db2c4c5fe) Thanks [@jkeohan](https://github.com/jkeohan)! - Add ProductThumbnail component to the checkout surface - -- [#1397](https://github.com/Shopify/ui-extensions/pull/1397) [`198d0848`](https://github.com/Shopify/ui-extensions/commit/198d08481470776f547e26f70fbc8b9836da3e6d) Thanks [@jamesvidler](https://github.com/jamesvidler)! - New `ConsentCheckbox` and `ConsentPhoneField` components which allow extensions to render their own consent UI, supporting the "sms-marketing" policy. - -- [#1397](https://github.com/Shopify/ui-extensions/pull/1397) [`198d0848`](https://github.com/Shopify/ui-extensions/commit/198d08481470776f547e26f70fbc8b9836da3e6d) Thanks [@jamesvidler](https://github.com/jamesvidler)! - Adds the `useShippingOptionTarget` react hook to retrieve the target shipping option. - -- [#1364](https://github.com/Shopify/ui-extensions/pull/1364) [`3437fc05`](https://github.com/Shopify/ui-extensions/commit/3437fc050df2d7ee1d95a75084804ad0f47a70e3) Thanks [@rcaplanshopify](https://github.com/rcaplanshopify)! - Adds `purchase.checkout.payment-method-list.render-before` and `purchase.checkout.payment-method-list.render-after` extension targets, rendered above and below the payment method list. - -- [#1364](https://github.com/Shopify/ui-extensions/pull/1364) [`39553479`](https://github.com/Shopify/ui-extensions/commit/39553479c51dbdba24b33669bb7ed697eccba090) Thanks [@rcaplanshopify](https://github.com/rcaplanshopify)! - Adds useCartlineTarget API and deprecates useTarget API. - -- [#1364](https://github.com/Shopify/ui-extensions/pull/1364) [`1dd9abf0`](https://github.com/Shopify/ui-extensions/commit/1dd9abf0faf5b63c9b6c341608fc53a8207f485d) Thanks [@rcaplanshopify](https://github.com/rcaplanshopify)! - Storage API stored data is now shared between all activated extension targets of the extension. - -- [#1364](https://github.com/Shopify/ui-extensions/pull/1364) [`39553479`](https://github.com/Shopify/ui-extensions/commit/39553479c51dbdba24b33669bb7ed697eccba090) Thanks [@rcaplanshopify](https://github.com/rcaplanshopify)! - Includes masked identifier when submitting custom redeemable data. - -- [#1364](https://github.com/Shopify/ui-extensions/pull/1364) [`39553479`](https://github.com/Shopify/ui-extensions/commit/39553479c51dbdba24b33669bb7ed697eccba090) Thanks [@rcaplanshopify](https://github.com/rcaplanshopify)! - Provides payment attributes to checkout extension. - -- [#1364](https://github.com/Shopify/ui-extensions/pull/1364) [`39553479`](https://github.com/Shopify/ui-extensions/commit/39553479c51dbdba24b33669bb7ed697eccba090) Thanks [@rcaplanshopify](https://github.com/rcaplanshopify)! - Adds support for decorative color in Text and TextBlock components. - -- [#1364](https://github.com/Shopify/ui-extensions/pull/1364) [`7a65c283`](https://github.com/Shopify/ui-extensions/commit/7a65c2836aa91ac3e6e225d8476b2c44baae87fb) Thanks [@rcaplanshopify](https://github.com/rcaplanshopify)! - Adds the `purchase.checkout.delivery-address.render-after` static extension target which is rendered after the shipping address form elements. - -- [#1315](https://github.com/Shopify/ui-extensions/pull/1315) [`22f71433`](https://github.com/Shopify/ui-extensions/commit/22f71433069b4cc1d4a322dad8dc6ecb70959ea8) Thanks [@dnagoda](https://github.com/dnagoda)! - # Add checkoutToken Api - - Extensions now have access to the checkout token (a stable id used to identify the checkout) directly through the standard api. The checkout token will match: - - - **token** field in [WebPixel checkout payload](https://shopify.dev/docs/api/pixels/customer-events#checkout). - - **checkout_token** in the [Admin REST Api Order resource](https://shopify.dev/docs/api/admin-rest/unstable/resources/order#resource-object) - -### Patch Changes - -- [#1324](https://github.com/Shopify/ui-extensions/pull/1324) [`a15fc4ad`](https://github.com/Shopify/ui-extensions/commit/a15fc4ad073ff905d3860e9e21080ee379813c58) Thanks [@LTiger14](https://github.com/LTiger14)! - Export CustomerSegmentTemplate and the props - -- [#1274](https://github.com/Shopify/ui-extensions/pull/1274) [`e198e10a`](https://github.com/Shopify/ui-extensions/commit/e198e10a99fc3da52d37822959db94105f04987f) Thanks [@PrescilliaA](https://github.com/PrescilliaA)! - Update CustomerSegmentTemplate prop names - -- [#1316](https://github.com/Shopify/ui-extensions/pull/1316) [`0905d719`](https://github.com/Shopify/ui-extensions/commit/0905d7193344c28fc9d346c2f7df873f23856671) Thanks [@lihaokx](https://github.com/lihaokx)! - 1. Rename point to target; 2. Update extension target names; 3, Add new types - -- [#1074](https://github.com/Shopify/ui-extensions/pull/1074) [`3e60fb40`](https://github.com/Shopify/ui-extensions/commit/3e60fb402fdec6c624e85d925cffa955faadf6c8) Thanks [@MitchLillie](https://github.com/MitchLillie)! - Rename components with Admin prefix - -- [#1294](https://github.com/Shopify/ui-extensions/pull/1294) [`1dd7a197`](https://github.com/Shopify/ui-extensions/commit/1dd7a1975cf23522f667fe19d1261b761726a252) Thanks [@PrescilliaA](https://github.com/PrescilliaA)! - Remove CustomerSegmentationTemplate and deprecated prop names - -- [#1283](https://github.com/Shopify/ui-extensions/pull/1283) [`8a9917b2`](https://github.com/Shopify/ui-extensions/commit/8a9917b247068178dba339bfa4fbfb91efc2fe0c) Thanks [@lihaokx](https://github.com/lihaokx)! - Move customer account ui extension from main to unstable branch. - -- [#1279](https://github.com/Shopify/ui-extensions/pull/1279) [`f537b081`](https://github.com/Shopify/ui-extensions/commit/f537b0814d3fcf0605396e9453a95ad4b58fcd2a) Thanks [@PrescilliaA](https://github.com/PrescilliaA)! - Introduces InternalCustomerSegmentTemplate component - -- Updated dependencies [[`a7ea6cb0`](https://github.com/Shopify/ui-extensions/commit/a7ea6cb06c3838228bfeefa94d4826b747720ad3), [`8df8429b`](https://github.com/Shopify/ui-extensions/commit/8df8429b69c3bdec736d0885c922be1db2c4c5fe), [`198d0848`](https://github.com/Shopify/ui-extensions/commit/198d08481470776f547e26f70fbc8b9836da3e6d), [`82ba4be1`](https://github.com/Shopify/ui-extensions/commit/82ba4be1efd0745ebd14ef10db4c54badba8c9f6), [`d0bd64d2`](https://github.com/Shopify/ui-extensions/commit/d0bd64d27f4cb41c31ef174393029d841a744ce3), [`e198e10a`](https://github.com/Shopify/ui-extensions/commit/e198e10a99fc3da52d37822959db94105f04987f), [`a8e16322`](https://github.com/Shopify/ui-extensions/commit/a8e16322b367c4efd079d8e69331bd234bedb0c8), [`3437fc05`](https://github.com/Shopify/ui-extensions/commit/3437fc050df2d7ee1d95a75084804ad0f47a70e3), [`0905d719`](https://github.com/Shopify/ui-extensions/commit/0905d7193344c28fc9d346c2f7df873f23856671), [`d539b687`](https://github.com/Shopify/ui-extensions/commit/d539b68792ab3068c2ddd89ae8a2077cc1ddcc56), [`39553479`](https://github.com/Shopify/ui-extensions/commit/39553479c51dbdba24b33669bb7ed697eccba090), [`1de5d9cf`](https://github.com/Shopify/ui-extensions/commit/1de5d9cf7c14f1f7220be4af8c8b35561ee862b8), [`1dd9abf0`](https://github.com/Shopify/ui-extensions/commit/1dd9abf0faf5b63c9b6c341608fc53a8207f485d), [`39553479`](https://github.com/Shopify/ui-extensions/commit/39553479c51dbdba24b33669bb7ed697eccba090), [`f4d0ea17`](https://github.com/Shopify/ui-extensions/commit/f4d0ea1754f132337536e1154a4ea4ed7d1fefde), [`39553479`](https://github.com/Shopify/ui-extensions/commit/39553479c51dbdba24b33669bb7ed697eccba090), [`3e60fb40`](https://github.com/Shopify/ui-extensions/commit/3e60fb402fdec6c624e85d925cffa955faadf6c8), [`fa561eed`](https://github.com/Shopify/ui-extensions/commit/fa561eed6071fc7e8308e7fecf589b60093cafe4), [`1dd7a197`](https://github.com/Shopify/ui-extensions/commit/1dd7a1975cf23522f667fe19d1261b761726a252), [`8a9917b2`](https://github.com/Shopify/ui-extensions/commit/8a9917b247068178dba339bfa4fbfb91efc2fe0c), [`1be8d871`](https://github.com/Shopify/ui-extensions/commit/1be8d871a284967c7f9860a2321666b6f416c57f), [`39553479`](https://github.com/Shopify/ui-extensions/commit/39553479c51dbdba24b33669bb7ed697eccba090), [`898ac175`](https://github.com/Shopify/ui-extensions/commit/898ac175661e02e7f09089672dfb652cdf6b6089), [`7a65c283`](https://github.com/Shopify/ui-extensions/commit/7a65c2836aa91ac3e6e225d8476b2c44baae87fb), [`22f71433`](https://github.com/Shopify/ui-extensions/commit/22f71433069b4cc1d4a322dad8dc6ecb70959ea8), [`f537b081`](https://github.com/Shopify/ui-extensions/commit/f537b0814d3fcf0605396e9453a95ad4b58fcd2a)]: - - @shopify/ui-extensions@2023.10.0 - -## 2023.7.2 - -### Patch Changes - -- [#1267](https://github.com/Shopify/ui-extensions/pull/1267) [`dc7f7395`](https://github.com/Shopify/ui-extensions/commit/dc7f739538dd648c135768c2e71c5873e6a672e0) Thanks [@robin-drexler](https://github.com/robin-drexler)! - fix customer-account surface build and context - -- Updated dependencies [[`dc7f7395`](https://github.com/Shopify/ui-extensions/commit/dc7f739538dd648c135768c2e71c5873e6a672e0)]: - - @shopify/ui-extensions@2023.7.2 - -## 2023.7.1 - -### Patch Changes - -- [#1249](https://github.com/Shopify/ui-extensions/pull/1249) [`fc0186ef`](https://github.com/Shopify/ui-extensions/commit/fc0186ef27b46aac7676d4b254626cf5c01e4239) Thanks [@mleandres](https://github.com/mleandres)! - New `useDeliveryGroup()` hook and improved documentation. - -- [#1210](https://github.com/Shopify/ui-extensions/pull/1210) [`1faf52a5`](https://github.com/Shopify/ui-extensions/commit/1faf52a53aac15eae0b37738fe5871d6ee2ef8d4) Thanks [@vividviolet](https://github.com/vividviolet)! - Expose query API for Admin UI extensions - -- Updated dependencies [[`fc0186ef`](https://github.com/Shopify/ui-extensions/commit/fc0186ef27b46aac7676d4b254626cf5c01e4239), [`1faf52a5`](https://github.com/Shopify/ui-extensions/commit/1faf52a53aac15eae0b37738fe5871d6ee2ef8d4)]: - - @shopify/ui-extensions@2023.7.1 - -## 2023.7.0 - -### Minor Changes - -- [#1064](https://github.com/Shopify/ui-extensions/pull/1064) [`266c13c0`](https://github.com/Shopify/ui-extensions/commit/266c13c0ab971d7c88c485c2747b753c2e05a4d1) Thanks [@Fionoble](https://github.com/Fionoble)! - Added new admin components: Box, BlockStack, Checkbox, Form, InlineStack, TextArea - -- [#1100](https://github.com/Shopify/ui-extensions/pull/1100) [`c7dba7ad`](https://github.com/Shopify/ui-extensions/commit/c7dba7adbd1349031d52b3ab6bbb4880fbd572d1) Thanks [@jamesvidler](https://github.com/jamesvidler)! - Add support for reading and writing cart metafields. - -- [#1145](https://github.com/Shopify/ui-extensions/pull/1145) [`2d147efa`](https://github.com/Shopify/ui-extensions/commit/2d147efab147ac9fdf77f5dd0d27fe65495bb0da) Thanks [@lemonmade](https://github.com/lemonmade)! - Make `@shopify/ui-extensions` a peer dependency for the React library - -- [#1145](https://github.com/Shopify/ui-extensions/pull/1145) [`2d147efa`](https://github.com/Shopify/ui-extensions/commit/2d147efab147ac9fdf77f5dd0d27fe65495bb0da) Thanks [@lemonmade](https://github.com/lemonmade)! - Add `customer-account` entrypoints for order status page extensions - -- [#774](https://github.com/Shopify/ui-extensions/pull/774) [`feaab61b`](https://github.com/Shopify/ui-extensions/commit/feaab61bfd0fb1c472133418ac7946d5dcdfc155) Thanks [@carolopolo](https://github.com/carolopolo)! - Changes typing of `description` prop of `` from `string` to `string | string[]` - -- [#1145](https://github.com/Shopify/ui-extensions/pull/1145) [`2d147efa`](https://github.com/Shopify/ui-extensions/commit/2d147efab147ac9fdf77f5dd0d27fe65495bb0da) Thanks [@lemonmade](https://github.com/lemonmade)! - Add support for new extension target names - -### Patch Changes - -- [#1152](https://github.com/Shopify/ui-extensions/pull/1152) [`505582a6`](https://github.com/Shopify/ui-extensions/commit/505582a623a056726109710e35a7aeb40530e8fa) Thanks [@vividviolet](https://github.com/vividviolet)! - Rename all extensionPoint references to extension target - -## 2023.4.3 - -### Patch Changes - -- [#1216](https://github.com/Shopify/ui-extensions/pull/1216) [`9052b155`](https://github.com/Shopify/ui-extensions/commit/9052b1550f38d21563bcb36530f6b2bc580363eb) Thanks [@jamesvidler](https://github.com/jamesvidler)! - PickupLocationsApi and PickupPointsApi now return a `isLocationFormVisible` property as opposed to `locationFormVisible`. ShippingMethodDetailsApi now gurantees a target (`ShippingOption`) will be returned. - -- Updated dependencies [[`9052b155`](https://github.com/Shopify/ui-extensions/commit/9052b1550f38d21563bcb36530f6b2bc580363eb)]: - - @shopify/ui-extensions@2023.4.3 - -## 2023.4.2 - -### Patch Changes - -- [#1135](https://github.com/Shopify/ui-extensions/pull/1135) [`b6df631c`](https://github.com/Shopify/ui-extensions/commit/b6df631cc4dd145d80555c05cfa79e02092210dc) Thanks [@lemonmade](https://github.com/lemonmade)! - Rename `useExtensionData()` to `useExtension()` - -- [#1135](https://github.com/Shopify/ui-extensions/pull/1135) [`b6df631c`](https://github.com/Shopify/ui-extensions/commit/b6df631cc4dd145d80555c05cfa79e02092210dc) Thanks [@lemonmade](https://github.com/lemonmade)! - Allow passing target name to `useApi()` for type inference - -- [#1135](https://github.com/Shopify/ui-extensions/pull/1135) [`b6df631c`](https://github.com/Shopify/ui-extensions/commit/b6df631cc4dd145d80555c05cfa79e02092210dc) Thanks [@lemonmade](https://github.com/lemonmade)! - Make @shopify/ui-extensions a peer dependency for React library - -- [#1135](https://github.com/Shopify/ui-extensions/pull/1135) [`b6df631c`](https://github.com/Shopify/ui-extensions/commit/b6df631cc4dd145d80555c05cfa79e02092210dc) Thanks [@lemonmade](https://github.com/lemonmade)! - Allow React extensions to return asynchronous results - -- Updated dependencies [[`b6df631c`](https://github.com/Shopify/ui-extensions/commit/b6df631cc4dd145d80555c05cfa79e02092210dc), [`b6df631c`](https://github.com/Shopify/ui-extensions/commit/b6df631cc4dd145d80555c05cfa79e02092210dc)]: - - @shopify/ui-extensions@2023.4.2 - -## 2023.4.1 - -### Minor Changes - -- [#1100](https://github.com/Shopify/ui-extensions/pull/1100) [`c7dba7ad`](https://github.com/Shopify/ui-extensions/commit/c7dba7adbd1349031d52b3ab6bbb4880fbd572d1) Thanks [@jamesvidler](https://github.com/jamesvidler)! - Add support for reading and writing cart metafields. - -### Patch Changes - -- [#1117](https://github.com/Shopify/ui-extensions/pull/1117) [`8e11ad23`](https://github.com/Shopify/ui-extensions/commit/8e11ad230991479b9d944b3811aafb0a1f4a0b2c) Thanks [@olavoasantos](https://github.com/olavoasantos)! - Clean up on Admin examples and types - -- [#1100](https://github.com/Shopify/ui-extensions/pull/1100) [`c7dba7ad`](https://github.com/Shopify/ui-extensions/commit/c7dba7adbd1349031d52b3ab6bbb4880fbd572d1) Thanks [@jamesvidler](https://github.com/jamesvidler)! - Updated faker dependancies for ui-extensions-react. - -- [#1100](https://github.com/Shopify/ui-extensions/pull/1100) [`c7dba7ad`](https://github.com/Shopify/ui-extensions/commit/c7dba7adbd1349031d52b3ab6bbb4880fbd572d1) Thanks [@jamesvidler](https://github.com/jamesvidler)! - Updated the documented examples to import from the ui-extensions package. - -- Updated dependencies [[`c7dba7ad`](https://github.com/Shopify/ui-extensions/commit/c7dba7adbd1349031d52b3ab6bbb4880fbd572d1), [`8e11ad23`](https://github.com/Shopify/ui-extensions/commit/8e11ad230991479b9d944b3811aafb0a1f4a0b2c), [`c7dba7ad`](https://github.com/Shopify/ui-extensions/commit/c7dba7adbd1349031d52b3ab6bbb4880fbd572d1), [`c7dba7ad`](https://github.com/Shopify/ui-extensions/commit/c7dba7adbd1349031d52b3ab6bbb4880fbd572d1)]: - - @shopify/ui-extensions@2023.4.1 - -## 2023.4.0 - -### Minor Changes - -- [#1064](https://github.com/Shopify/ui-extensions/pull/1064) [`266c13c0`](https://github.com/Shopify/ui-extensions/commit/266c13c0ab971d7c88c485c2747b753c2e05a4d1) Thanks [@Fionoble](https://github.com/Fionoble)! - Added new admin components: Box, BlockStack, Checkbox, Form, InlineStack, TextArea - -- [#774](https://github.com/Shopify/ui-extensions/pull/774) [`feaab61b`](https://github.com/Shopify/ui-extensions/commit/feaab61bfd0fb1c472133418ac7946d5dcdfc155) Thanks [@carolopolo](https://github.com/carolopolo)! - Changes typing of `description` prop of `` from `string` to `string | string[]` - -### Patch Changes - -- [#1050](https://github.com/Shopify/ui-extensions/pull/1050) [`df9ff575`](https://github.com/Shopify/ui-extensions/commit/df9ff5753e7072ba2b6b8acd0427f7f331506ba6) Thanks [@lauramann](https://github.com/lauramann)! - Add viewMajor to source in CustomerSegmentationTemplate - -- [#1044](https://github.com/Shopify/ui-extensions/pull/1044) [`ca55a50c`](https://github.com/Shopify/ui-extensions/commit/ca55a50cc111f679c4fb4e308db257e4c22b0330) Thanks [@olavoasantos](https://github.com/olavoasantos)! - Add Heading and HeadingGroup components to admin surface - -- [#1048](https://github.com/Shopify/ui-extensions/pull/1048) [`faaacfe3`](https://github.com/Shopify/ui-extensions/commit/faaacfe3942b9a25c45f523ab396330221f54564) Thanks [@olavoasantos](https://github.com/olavoasantos)! - Add Button component to the Admin surface - -- [#806](https://github.com/Shopify/ui-extensions/pull/806) [`d0e44415`](https://github.com/Shopify/ui-extensions/commit/d0e44415e6913b005d35ff75209bf712e7930f79) Thanks [@jonathanhamel4](https://github.com/jonathanhamel4)! - Moving the Segmentation TemplateCategory from the api to the CustomerSegmentationTemplate component props. - -- [#703](https://github.com/Shopify/ui-extensions/pull/703) [`100cfeda`](https://github.com/Shopify/ui-extensions/commit/100cfeda331247d284add99284b244d7a5cb7d0b) Thanks [@vividviolet](https://github.com/vividviolet)! - Add Admin surface to packages - -- [#892](https://github.com/Shopify/ui-extensions/pull/892) [`0d68e3d1`](https://github.com/Shopify/ui-extensions/commit/0d68e3d163abba8fc48030ec3b2ac287fed4340c) Thanks [@LTiger14](https://github.com/LTiger14)! - Add confettiMajor to source in CustomerSegmentationTemplate - -- [#1023](https://github.com/Shopify/ui-extensions/pull/1023) [`d250d7df`](https://github.com/Shopify/ui-extensions/commit/d250d7df500378b496f079292d33b6433053098c) Thanks [@olavoasantos](https://github.com/olavoasantos)! - Remove legacy components on the admin surface and add components based on the unified API - -- [#771](https://github.com/Shopify/ui-extensions/pull/771) [`2a3b4bd0`](https://github.com/Shopify/ui-extensions/commit/2a3b4bd0f8dbdf0e36530f2308ef794c71e2daf4) Thanks [@loic-d](https://github.com/loic-d)! - Introduce dateAdded on CustomerSegmentationTemplate - -- [#1042](https://github.com/Shopify/ui-extensions/pull/1042) [`de735136`](https://github.com/Shopify/ui-extensions/commit/de735136e204b068f3654272261fb68b1943ad6e) Thanks [@MitchLillie](https://github.com/MitchLillie)! - Add AppAction component - -- [#1034](https://github.com/Shopify/ui-extensions/pull/1034) [`35a34867`](https://github.com/Shopify/ui-extensions/commit/35a34867922fde91f84644c06d094ede0ceb0415) Thanks [@jamesvidler](https://github.com/jamesvidler)! - Ported latest changes from @shopify/checkout-ui-extensions package for corresponding version 2023-04. - -- [#1074](https://github.com/Shopify/ui-extensions/pull/1074) [`3e60fb40`](https://github.com/Shopify/ui-extensions/commit/3e60fb402fdec6c624e85d925cffa955faadf6c8) Thanks [@MitchLillie](https://github.com/MitchLillie)! - Rename components with Admin prefix - -- [#759](https://github.com/Shopify/ui-extensions/pull/759) [`4e71987f`](https://github.com/Shopify/ui-extensions/commit/4e71987f1cd701e049ebfb9e4c726f2a841ce8be) Thanks [@loic-d](https://github.com/loic-d)! - Introduces CustomerSegmentationTemplate component - -- [#1073](https://github.com/Shopify/ui-extensions/pull/1073) [`ad9d0f75`](https://github.com/Shopify/ui-extensions/commit/ad9d0f75078c2b2f915a14789f1bc2eec2ca2885) Thanks [@jamesvidler](https://github.com/jamesvidler)! - Added ability to generate docs from within the repository. - -- [#766](https://github.com/Shopify/ui-extensions/pull/766) [`0c5b0d5b`](https://github.com/Shopify/ui-extensions/commit/0c5b0d5b623e4d6a7e8c33e821991f9bdc5c8b20) Thanks [@loic-d](https://github.com/loic-d)! - Introduces standardMetafieldDependencies prop on CustomerSegmentationTemplate - -- [#722](https://github.com/Shopify/ui-extensions/pull/722) [`c4d3ef8e`](https://github.com/Shopify/ui-extensions/commit/c4d3ef8ea10b8b9bc3a688b9ed7550d717870a22) Thanks [@vividviolet](https://github.com/vividviolet)! - Call root.mount for a rendering extension point - -- [#822](https://github.com/Shopify/ui-extensions/pull/822) [`a49cfe5d`](https://github.com/Shopify/ui-extensions/commit/a49cfe5dc9609791af46f9f6170250fec30212b8) Thanks [@jonathanhamel4](https://github.com/jonathanhamel4)! - Changing the dateAdded type from Date to ISO 8601 string - -- [#1062](https://github.com/Shopify/ui-extensions/pull/1062) [`aad2fb79`](https://github.com/Shopify/ui-extensions/commit/aad2fb797ef8d9da4c729cdae78f67019520cecf) Thanks [@lauramann](https://github.com/lauramann)! - Adds buyButtonMajor to source in CustomerSegmentationTemplate - -- [#1043](https://github.com/Shopify/ui-extensions/pull/1043) [`1db18001`](https://github.com/Shopify/ui-extensions/commit/1db18001ee1e3cdcc421b9078db72f498bd4991f) Thanks [@olavoasantos](https://github.com/olavoasantos)! - Add Text component to the Admin surface - -- Updated dependencies [[`df9ff575`](https://github.com/Shopify/ui-extensions/commit/df9ff5753e7072ba2b6b8acd0427f7f331506ba6), [`ca55a50c`](https://github.com/Shopify/ui-extensions/commit/ca55a50cc111f679c4fb4e308db257e4c22b0330), [`faaacfe3`](https://github.com/Shopify/ui-extensions/commit/faaacfe3942b9a25c45f523ab396330221f54564), [`266c13c0`](https://github.com/Shopify/ui-extensions/commit/266c13c0ab971d7c88c485c2747b753c2e05a4d1), [`d0e44415`](https://github.com/Shopify/ui-extensions/commit/d0e44415e6913b005d35ff75209bf712e7930f79), [`100cfeda`](https://github.com/Shopify/ui-extensions/commit/100cfeda331247d284add99284b244d7a5cb7d0b), [`0095a792`](https://github.com/Shopify/ui-extensions/commit/0095a792f4392b242aceccdcc0c8f1741ea22782), [`0d68e3d1`](https://github.com/Shopify/ui-extensions/commit/0d68e3d163abba8fc48030ec3b2ac287fed4340c), [`d250d7df`](https://github.com/Shopify/ui-extensions/commit/d250d7df500378b496f079292d33b6433053098c), [`2a3b4bd0`](https://github.com/Shopify/ui-extensions/commit/2a3b4bd0f8dbdf0e36530f2308ef794c71e2daf4), [`de735136`](https://github.com/Shopify/ui-extensions/commit/de735136e204b068f3654272261fb68b1943ad6e), [`35a34867`](https://github.com/Shopify/ui-extensions/commit/35a34867922fde91f84644c06d094ede0ceb0415), [`3e60fb40`](https://github.com/Shopify/ui-extensions/commit/3e60fb402fdec6c624e85d925cffa955faadf6c8), [`4e71987f`](https://github.com/Shopify/ui-extensions/commit/4e71987f1cd701e049ebfb9e4c726f2a841ce8be), [`ad9d0f75`](https://github.com/Shopify/ui-extensions/commit/ad9d0f75078c2b2f915a14789f1bc2eec2ca2885), [`3dff93ac`](https://github.com/Shopify/ui-extensions/commit/3dff93acc1eb10fa524d5985fec2ca9df49fdcdd), [`0c5b0d5b`](https://github.com/Shopify/ui-extensions/commit/0c5b0d5b623e4d6a7e8c33e821991f9bdc5c8b20), [`c4d3ef8e`](https://github.com/Shopify/ui-extensions/commit/c4d3ef8ea10b8b9bc3a688b9ed7550d717870a22), [`feaab61b`](https://github.com/Shopify/ui-extensions/commit/feaab61bfd0fb1c472133418ac7946d5dcdfc155), [`a49cfe5d`](https://github.com/Shopify/ui-extensions/commit/a49cfe5dc9609791af46f9f6170250fec30212b8), [`aad2fb79`](https://github.com/Shopify/ui-extensions/commit/aad2fb797ef8d9da4c729cdae78f67019520cecf), [`1db18001`](https://github.com/Shopify/ui-extensions/commit/1db18001ee1e3cdcc421b9078db72f498bd4991f)]: - - @shopify/ui-extensions@2023.4.0 - -## 2022.10.6 - -### Patch Changes - -- [#717](https://github.com/Shopify/ui-extensions/pull/717) [`5c2f511b`](https://github.com/Shopify/ui-extensions/commit/5c2f511bbea3b4f36fc9c63f79089a79a90ccf26) Thanks [@vividviolet](https://github.com/vividviolet)! - Fix exports for Checkout's surface - -- Updated dependencies [[`5c2f511b`](https://github.com/Shopify/ui-extensions/commit/5c2f511bbea3b4f36fc9c63f79089a79a90ccf26)]: - - @shopify/ui-extensions@2022.10.6 - -## 2022.10.5 - -### Patch Changes - -- [#661](https://github.com/Shopify/ui-extensions/pull/661) [`2bef7a10`](https://github.com/Shopify/ui-extensions/commit/2bef7a10d32f80651d2cfa5ac528f551e4ab8b24) Thanks [@lemonmade](https://github.com/lemonmade)! - Bring in @shopify/checkout-ui-extensions@0.22.0 - -- Updated dependencies [[`2bef7a10`](https://github.com/Shopify/ui-extensions/commit/2bef7a10d32f80651d2cfa5ac528f551e4ab8b24)]: - - @shopify/ui-extensions@2022.10.5 diff --git a/packages/ui-extensions-react/README.md b/packages/ui-extensions-react/README.md deleted file mode 100644 index efd3a97b5e..0000000000 --- a/packages/ui-extensions-react/README.md +++ /dev/null @@ -1,53 +0,0 @@ -# `@shopify/ui-extensions-react` - -This package contains the public type definitions and utilities needed to create a Shopify UI extension with [React](https://reactjs.org/). This is a generalized package that is intended to be the long-term home of the surface-specific UI extension packages, like [`@shopify/checkout-ui-extensions-react`](https://github.com/Shopify/ui-extensions/tree/main/packages/checkout-ui-extensions-react) and [`@shopify/admin-ui-extensions-react`](https://github.com/Shopify/ui-extensions/tree/main/packages/admin-ui-extensions-react). - -> **Is your extension currently using `@shopify/checkout-ui-extensions-react`?** You can learn what you need to do to upgrade to this API versioned package in the [migration guide](../../documentation/upgrade/checkout-ui-extension-api-versioning.md). - -Currently, this package only contains the extension APIs for the [`checkout` surface](./src/surfaces/checkout), but other Shopify surfaces will be added here soon. - -All extensions, regardless of where they appear in Shopify, make use of the same [underlying technology](../../documentation/how-extensions-work.md), and most of the same “core” components (e.g., `BlockStack`, `Button`, `TextField`, etc) and capabilities (e.g., direct API access, session tokens). Separating APIs by surface makes it easier for a developer to see what is available to them in each context, and gives us a flexible system for introducing components and APIs available in only some areas of Shopify. - -A checkout extension using React would be written as follows: - -```tsx -import {useState} from 'react'; -import { - reactExtension, - useApi, - TextField, -} from '@shopify/ui-extensions-react/checkout'; - -export default reactExtension('purchase.checkout.block.render', () => ( - -)); - -function GiftNote() { - const {i18n, metafields, applyMetafieldChange} = useApi(); - - const [value, setValue] = useState(() => { - const metafield = metafields.current.find( - (metafield) => - metafield.namespace === 'custom' && metafield.key === 'gift_note', - ); - - return metafield?.value ?? ''; - }); - - return ( - { - setValue(value); - applyMetafieldChange({ - namespace: 'custom', - key: 'gift_note', - value, - valueType: 'string', - }); - }} - /> - ); -} -``` diff --git a/packages/ui-extensions-react/config/typescript/faker.d.ts b/packages/ui-extensions-react/config/typescript/faker.d.ts deleted file mode 100644 index 1f87394f06..0000000000 --- a/packages/ui-extensions-react/config/typescript/faker.d.ts +++ /dev/null @@ -1,9 +0,0 @@ -// This type declaration file for Faker is only necessary -// until Faker is upgraded to v6, which includes a rewrite -// to TypeScript. We can also remove the @types/faker -// package while doing the upgrade. -declare module '@faker-js/faker' { - import faker from 'faker'; - - export default faker; -} diff --git a/packages/ui-extensions-react/documentation/hooks.md b/packages/ui-extensions-react/documentation/hooks.md deleted file mode 100644 index 030a562ba2..0000000000 --- a/packages/ui-extensions-react/documentation/hooks.md +++ /dev/null @@ -1,87 +0,0 @@ - - - - -### AppMetaFieldFilters - -| Name | Type | Description | -| ---------- | ----------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| id? | string | The numeric owner ID that is associated with the metafield. | -| type? | "customer" | "product" | "shop" | "variant" | The type of the metafield owner. | -| namespace? | string | Container for a set of metafields. You need to define a custom namespace for your metafields to distinguish them from the metafields used by other apps. This value must be between 2 and 20 characters. | -| key? | string | The name of the metafield. This value must be between 3 and 30 characters. | - - - -### MetaFieldFilter - -| Name | Type | Description | -| ---------- | ------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| namespace? | string | A container for a set of metafields. You need to define a custom namespace for your metafields to distinguish them from the metafields used by other apps. This value must be between 2 and 20 characters. | -| key? | string | The name of the metafield. This value must be between 3 and 30 characters. | - ---- - -### React Hooks - -Shopify provides a collection of [React hooks](https://reactjs.org/docs/hooks-intro.html), which make it easy to update your UI when the checkout state changes. - -```jsx -import React from 'react'; -import { - render, - Text, - useShippingAddress, -} from '@shopify/ui-extensions-react/checkout'; - -render('Checkout::Dynamic::Render', () => ); - -function App() { - // Access and subscribe to the shipping address - // Your will automatically re-render when the address has changed - const address = useShippingAddress(); - const firstName = address?.firstName ?? 'guest'; - - // Render UI - return Hi {firstName}!; -} -``` - -> Note: -> React hooks are only available if you're using React. If you're using vanilla JavaScript, then you'll need to manually subscribe to the subscribable value directly with a callback. For example, `shippingAddress.subscribe(newValue => updateYourUI())`. - -| Name | Type | Description | -| --------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| useApplyAttributeChange | (change: AttributeUpdateChange) => Promise<AttributeChangeResultSuccess | AttributeChangeResultError> | Returns a function to mutate the `attributes` property of the checkout. | -| useApplyCartLinesChange | (change: CartLineAddChange | CartLineRemoveChange | CartLineUpdateChange) => Promise<CartLineChangeResultSuccess | CartLineChangeResultError> | Returns a function to mutate the `lines` property of the checkout. | -| useApplyMetafieldsChange | (change: MetafieldRemoveChange | MetafieldUpdateChange) => Promise<MetafieldChangeResultSuccess | MetafieldChangeResultError> | Returns a function to mutate the `metafields` property of the checkout. | -| useApplyNoteChange | (change: NoteRemoveChange | NoteUpdateChange) => Promise<NoteChangeResultSuccess | NoteChangeResultError> | Returns a function to mutate the `note` property of the checkout. | -| useAppMetafields {% include /apps/checkout/privacy-icon.md %} | (filters?: AppMetafieldFilters) => AppMetaFieldEntry[] | Returns the metafields configured with `shopify.ui.extension.toml`. | -| useAttributes | () => Attribute[] | undefined | Returns the proposed `attributes` applied to the checkout. | -| useBuyerJourney | () => Promise<() => void> | Returns the `buyerJourney` details on buyer progression in checkout. | -| useBuyerJourneyIntercept | (interceptor: Interceptor) => void | A function for intercepting and preventing progression on checkout. You can block progress by returning an object with `{behavior: 'block', reason: InvalidResultReason.InvalidExtensionState}`.

If you do, then you're expected to also update some part of your UI to reflect the reason why navigation was blocked.

To block checkout progress, you must set the [block_progress](https://shopify.dev/api/checkout-extensions/checkout/configuration#block-progress) capability in your extension's configuration. | -| useSettings | () => ExtensionSettings | Returns the settings defined by the merchant for the extension. | -| useCurrency | () => string | Returns the currency of the checkout, and automatically re-renders your component if the currency changes. | -| useCustomer {% include /apps/checkout/privacy-icon.md %} | () => Customer | undefined | Returns the account belonging to the customer.

The value is a Customer if the customer has an account and is logged in, `undefined` otherwise. `ScopeNotGrantedError` is raised when access to [protected customer data](/apps/store/data-protection/protected-customer-data) hasn't been granted. | -| useEmail {% include /apps/checkout/privacy-icon.md %} | () => string | undefined | Returns the email of the buyer, and automatically re-renders your component if the email changes.

`ScopeNotGrantedError` is raised when access to [protected customer data](/apps/store/data-protection/protected-customer-data) hasn't been granted. | -| useApi | () => StandardApi | Returns the full API object that was passed in to your extension when it was created. | -| useExtensionCapabilities | () => Capability[] | Returns a list of an extension's granted capabilities. | -| useExtensionCapabilitiy | (capability: Capability) => boolean | Returns whether or not a given capability of an extension is granted. | -| useExtensionData | () => Extension | Returns the metadata about the extension. | -| useExtensionLanguage | () => string | Returns the buyer's language, as supported by the extension. | -| useCartLines | () => CartLine[] | Returns the current cart lines for the checkout, and automatically re-renders your component if cart lines are added, removed, or updated. | -| useLanguage | () => string | Returns the current language of the checkout, and automatically re-renders your component if the language changes. | -| useMetafield | (filters: MetaFieldFilter) => MetaField | undefined | Returns a single filtered `Metafield` or `undefined`. | -| useMetafields | (filters?: MetaFieldFilter) => MetaField[] | Returns the current array of `metafields` applied to the checkout. You can optionally filter the list. | -| useNote | () => string | undefined | Returns the proposed `note` applied to the checkout. | -| usePhone {% include /apps/checkout/privacy-icon.md %} | () => string | undefined | Returns the phone number of the buyer, and automatically re-renders your component if the phone number changes.

`ScopeNotGrantedError` is raised when access to [protected customer data](/apps/store/data-protection/protected-customer-data) hasn't been granted. | -| useTotalAmount | () => Money | undefined | Returns a `Money` value representing the minimum a buyer can expect to pay at the current step of checkout. This value excludes amounts yet to be negotiated. For example, the information step may not have delivery costs calculated. | -| useShippingAddress {% include /apps/checkout/privacy-icon.md %} | () => MailingAddress | undefined | Returns the proposed `shippingAddress` applied to the checkout. `ScopeNotGrantedError` is raised when access to [protected customer data](/apps/store/data-protection/protected-customer-data) hasn't been granted. | -| useShop | () => Shop | Returns the `Shop` where the checkout is taking place. | -| useStorage | () => Storage | Returns the key-value `Storage` interface for the extension point. | -| useTarget | () => PresentmentCartLine | Returns the presentment cart line that the extension is attached to. Applicable only to the `Checkout::CartLineDetails::RenderAfter` extension point. | -| useTimezone | () => string | Returns the timezone of the checkout, and automatically re-renders your component if the timezone changes. | -| useTranslate | () => I18nTranslate | Returns the `I18nTranslate` interface used to translate strings. | -| useDiscountCodes | () => CartDiscountCode[] | Returns the current discount codes applied to the cart, and automatically re-renders your component if discount codes are added or removed. | -| useDiscountAllocations | () => CartDiscountAllocation[] | Returns the current discount allocations applied to the cart, and automatically re-renders your component if discount allocations changed. | -| useApplyDiscountCodeChange | (change: DiscountCodeChange) => Promise<DiscountCodeChangeResult> | Returns a function to add or remove discount codes. | diff --git a/packages/ui-extensions-react/loom.config.ts b/packages/ui-extensions-react/loom.config.ts deleted file mode 100644 index 58fbd794a1..0000000000 --- a/packages/ui-extensions-react/loom.config.ts +++ /dev/null @@ -1,15 +0,0 @@ -import {createPackage} from '@shopify/loom'; - -import {defaultProjectPlugin} from '../../config/loom'; - -export default createPackage((pkg) => { - pkg.entry({root: './src/index.ts'}); - pkg.entry({name: 'checkout', root: './src/surfaces/checkout.ts'}); - pkg.entry({name: 'admin', root: './src/surfaces/admin.ts'}); - pkg.entry({name: 'point-of-sale', root: './src/surfaces/point-of-sale.ts'}); - pkg.entry({ - name: 'customer-account', - root: './src/surfaces/customer-account.ts', - }); - pkg.use(defaultProjectPlugin({react: true})); -}); diff --git a/packages/ui-extensions-react/package.json b/packages/ui-extensions-react/package.json deleted file mode 100644 index d7523dc844..0000000000 --- a/packages/ui-extensions-react/package.json +++ /dev/null @@ -1,101 +0,0 @@ -{ - "name": "@shopify/ui-extensions-react", - "version": "0.0.0-unstable", - "description": "React bindings for @shopify/ui-extensions", - "publishConfig": { - "access": "public", - "@shopify:registry": "https://registry.npmjs.org" - }, - "sideEffects": false, - "license": "MIT", - "main": "index.js", - "module": "index.mjs", - "esnext": "index.esnext", - "types": "./build/ts/index.d.ts", - "typesVersions": { - "*": { - "admin": [ - "./build/ts/surfaces/admin.d.ts" - ], - "checkout": [ - "./build/ts/surfaces/checkout.d.ts" - ], - "customer-account": [ - "./build/ts/surfaces/customer-account.d.ts" - ], - "point-of-sale": [ - "./build/ts/surfaces/point-of-sale.d.ts" - ] - } - }, - "exports": { - ".": { - "types": "./build/ts/index.d.ts", - "esnext": "./index.esnext", - "import": "./index.mjs", - "require": "./index.js" - }, - "./admin": { - "types": "./build/ts/surfaces/admin.d.ts", - "esnext": "./build/esnext/surfaces/admin.esnext", - "import": "./build/esm/surfaces/admin.mjs", - "require": "./build/cjs/surfaces/admin.js" - }, - "./checkout": { - "types": "./build/ts/surfaces/checkout.d.ts", - "esnext": "./build/esnext/surfaces/checkout.esnext", - "import": "./build/esm/surfaces/checkout.mjs", - "require": "./build/cjs/surfaces/checkout.js" - }, - "./customer-account": { - "types": "./build/ts/surfaces/customer-account.d.ts", - "esnext": "./build/esnext/surfaces/customer-account.esnext", - "import": "./build/esm/surfaces/customer-account.mjs", - "require": "./build/cjs/surfaces/customer-account.js" - }, - "./point-of-sale": { - "types": "./build/ts/surfaces/point-of-sale.d.ts", - "esnext": "./build/esnext/surfaces/point-of-sale.esnext", - "import": "./build/esm/surfaces/point-of-sale.mjs", - "require": "./build/cjs/surfaces/point-of-sale.js" - } - }, - "dependencies": { - "@remote-ui/async-subscription": "^2.1.12", - "@remote-ui/react": "^5.0.2", - "@types/react": ">=18.2.67" - }, - "peerDependencies": { - "@shopify/ui-extensions": "0.0.0-unstable", - "react": ">=18.0.0" - }, - "peerDependenciesMeta": { - "@shopify/ui-extensions": { - "optional": false - }, - "react": { - "optional": false - } - }, - "devDependencies": { - "@faker-js/faker": "^8.4.1", - "@quilted/react-testing": "^0.5.31", - "@shopify/ui-extensions": "0.0.0-unstable", - "react": "^18.0.0", - "react-reconciler": "0.29.0", - "react-test-renderer": "^18.2.0" - }, - "files": [ - "build", - "src", - "index.*", - "checkout.*", - "README.md" - ], - "eslintConfig": { - "rules": { - "@shopify/strict-component-boundaries": "off", - "react/react-in-jsx-scope": "off" - } - } -} diff --git a/packages/ui-extensions-react/src/index.ts b/packages/ui-extensions-react/src/index.ts deleted file mode 100644 index cb0ff5c3b5..0000000000 --- a/packages/ui-extensions-react/src/index.ts +++ /dev/null @@ -1 +0,0 @@ -export {}; diff --git a/packages/ui-extensions-react/src/surfaces/admin.ts b/packages/ui-extensions-react/src/surfaces/admin.ts deleted file mode 100644 index 669f012748..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin.ts +++ /dev/null @@ -1,5 +0,0 @@ -export {extend, extension} from '@shopify/ui-extensions/admin'; - -export * from './admin/components'; -export * from './admin/hooks'; -export {render, reactExtension} from './admin/render'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components.ts b/packages/ui-extensions-react/src/surfaces/admin/components.ts deleted file mode 100644 index 258fbdddc4..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components.ts +++ /dev/null @@ -1,85 +0,0 @@ -export {AdminAction} from './components/AdminAction/AdminAction'; -export type {AdminActionProps} from './components/AdminAction/AdminAction'; -export {AdminPrintAction} from './components/AdminPrintAction/AdminPrintAction'; -export type {AdminPrintActionProps} from './components/AdminPrintAction/AdminPrintAction'; -export {AdminBlock} from './components/AdminBlock/AdminBlock'; -export type {AdminBlockProps} from './components/AdminBlock/AdminBlock'; -export {Badge} from './components/Badge/Badge'; -export type {BadgeProps} from './components/Badge/Badge'; -export {Banner} from './components/Banner/Banner'; -export type {BannerProps} from './components/Banner/Banner'; -export {BlockStack} from './components/BlockStack/BlockStack'; -export type {BlockStackProps} from './components/BlockStack/BlockStack'; -export {Box} from './components/Box/Box'; -export type {BoxProps} from './components/Box/Box'; -export {Button} from './components/Button/Button'; -export type {ButtonProps} from './components/Button/Button'; -export {Checkbox} from './components/Checkbox/Checkbox'; -export type {CheckboxProps} from './components/Checkbox/Checkbox'; -export {ChoiceList} from './components/ChoiceList/ChoiceList'; -export type {ChoiceListProps} from './components/ChoiceList/ChoiceList'; -export {ColorPicker} from './components/ColorPicker/ColorPicker'; -export type {ColorPickerProps} from './components/ColorPicker/ColorPicker'; -export {CustomerSegmentTemplate} from './components/CustomerSegmentTemplate/CustomerSegmentTemplate'; -export type {CustomerSegmentTemplateProps} from './components/CustomerSegmentTemplate/CustomerSegmentTemplate'; -export {DatePicker} from './components/DatePicker/DatePicker'; -export type {DatePickerProps} from './components/DatePicker/DatePicker'; -export {DateField} from './components/DateField/DateField'; -export type {DateFieldProps} from './components/DateField/DateField'; -export {Divider} from './components/Divider/Divider'; -export type {DividerProps} from './components/Divider/Divider'; -export {EmailField} from './components/EmailField/EmailField'; -export type {EmailFieldProps} from './components/EmailField/EmailField'; -export {Form} from './components/Form/Form'; -export type {FormProps} from './components/Form/Form'; -export {FunctionSettings} from './components/FunctionSettings/FunctionSettings'; -export type { - FunctionSettingsProps, - FunctionSettingsError, -} from './components/FunctionSettings/FunctionSettings'; -export {Heading} from './components/Heading/Heading'; -export type {HeadingProps} from './components/Heading/Heading'; -export {HeadingGroup} from './components/HeadingGroup/HeadingGroup'; -export type {HeadingGroupProps} from './components/HeadingGroup/HeadingGroup'; -export {Icon} from './components/Icon/Icon'; -export type {IconProps} from './components/Icon/Icon'; -export {Image} from './components/Image/Image'; -export type {ImageProps} from './components/Image/Image'; -export {InlineStack} from './components/InlineStack/InlineStack'; -export type {InlineStackProps} from './components/InlineStack/InlineStack'; -export {InternalCustomerSegmentTemplate} from './components/InternalCustomerSegmentTemplate/InternalCustomerSegmentTemplate'; -export type {InternalCustomerSegmentTemplateProps} from './components/InternalCustomerSegmentTemplate/InternalCustomerSegmentTemplate'; -export {Link} from './components/Link/Link'; -export type {LinkProps} from './components/Link/Link'; -export {MoneyField} from './components/MoneyField/MoneyField'; -export type {MoneyFieldProps} from './components/MoneyField/MoneyField'; -export {NumberField} from './components/NumberField/NumberField'; -export type {NumberFieldProps} from './components/NumberField/NumberField'; -export {Paragraph} from './components/Paragraph/Paragraph'; -export type {ParagraphProps} from './components/Paragraph/Paragraph'; -export {PasswordField} from './components/PasswordField/PasswordField'; -export type {PasswordFieldProps} from './components/PasswordField/PasswordField'; -export {Pressable} from './components/Pressable/Pressable'; -export type {PressableProps} from './components/Pressable/Pressable'; -export {ProgressIndicator} from './components/ProgressIndicator/ProgressIndicator'; -export type {ProgressIndicatorProps} from './components/ProgressIndicator/ProgressIndicator'; -export {Section} from './components/Section/Section'; -export type {SectionProps} from './components/Section/Section'; -export {Select} from './components/Select/Select'; -export type { - OptionDescription, - OptionGroupDescription, - OptionGroupProps, - OptionProps, - SelectProps, -} from './components/Select/Select'; -export {Text} from './components/Text/Text'; -export type {TextProps} from './components/Text/Text'; -export {TextArea} from './components/TextArea/TextArea'; -export type {TextAreaProps} from './components/TextArea/TextArea'; -export {TextField} from './components/TextField/TextField'; -export type {TextFieldProps} from './components/TextField/TextField'; -export {URLField} from './components/URLField/URLField'; -export type {URLFieldProps} from './components/URLField/URLField'; -export {InternalLocationList} from './components/InternalLocationList/InternalLocationList'; -export type {InternalLocationListProps} from './components/InternalLocationList/InternalLocationList'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/AdminAction/AdminAction.ts b/packages/ui-extensions-react/src/surfaces/admin/components/AdminAction/AdminAction.ts deleted file mode 100644 index b2c2d76c21..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/AdminAction/AdminAction.ts +++ /dev/null @@ -1,13 +0,0 @@ -import {AdminAction as BaseAdminAction} from '@shopify/ui-extensions/admin'; -import { - createRemoteReactComponent, - ReactPropsFromRemoteComponentType, -} from '@remote-ui/react'; - -export const AdminAction = createRemoteReactComponent(BaseAdminAction, { - fragmentProps: ['primaryAction', 'secondaryAction'], -}); - -export type AdminActionProps = ReactPropsFromRemoteComponentType< - typeof BaseAdminAction ->; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/AdminAction/examples/basic-adminaction.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/AdminAction/examples/basic-adminaction.example.tsx deleted file mode 100644 index 3d59b1f3e0..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/AdminAction/examples/basic-adminaction.example.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import React from 'react'; -import { - reactExtension, - AdminAction, - Button, - Text, -} from '@shopify/ui-extensions-react/admin'; - -function App() { - return ( - {}}>Action - } - secondaryAction={ - - } - > - Modal content - - ); -} - -export default reactExtension( - 'Playground', - () => , -); diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/AdminBlock/AdminBlock.ts b/packages/ui-extensions-react/src/surfaces/admin/components/AdminBlock/AdminBlock.ts deleted file mode 100644 index a77456e099..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/AdminBlock/AdminBlock.ts +++ /dev/null @@ -1,11 +0,0 @@ -import {AdminBlock as BaseAdminBlock} from '@shopify/ui-extensions/admin'; -import { - createRemoteReactComponent, - ReactPropsFromRemoteComponentType, -} from '@remote-ui/react'; - -export const AdminBlock = createRemoteReactComponent(BaseAdminBlock); - -export type AdminBlockProps = ReactPropsFromRemoteComponentType< - typeof BaseAdminBlock ->; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/AdminBlock/examples/basic-adminblock.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/AdminBlock/examples/basic-adminblock.example.tsx deleted file mode 100644 index a7d3c00da0..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/AdminBlock/examples/basic-adminblock.example.tsx +++ /dev/null @@ -1,12 +0,0 @@ -import React from 'react'; -import {reactExtension, AdminBlock} from '@shopify/ui-extensions-react/admin'; - -function App() { - return ( - - Block content - - ); -} - -export default reactExtension('Playground', () => ); diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/AdminPrintAction/AdminPrintAction.ts b/packages/ui-extensions-react/src/surfaces/admin/components/AdminPrintAction/AdminPrintAction.ts deleted file mode 100644 index 2a68dad70b..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/AdminPrintAction/AdminPrintAction.ts +++ /dev/null @@ -1,12 +0,0 @@ -import {AdminPrintAction as BaseAdminPrintAction} from '@shopify/ui-extensions/admin'; -import { - createRemoteReactComponent, - ReactPropsFromRemoteComponentType, -} from '@remote-ui/react'; - -export const AdminPrintAction = - createRemoteReactComponent(BaseAdminPrintAction); - -export type AdminPrintActionProps = ReactPropsFromRemoteComponentType< - typeof BaseAdminPrintAction ->; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/AdminPrintAction/examples/basic-adminprintaction.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/AdminPrintAction/examples/basic-adminprintaction.example.tsx deleted file mode 100644 index 601ed5454d..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/AdminPrintAction/examples/basic-adminprintaction.example.tsx +++ /dev/null @@ -1,19 +0,0 @@ -import React from 'react'; -import { - reactExtension, - AdminPrintAction, - Text, -} from '@shopify/ui-extensions-react/admin'; - -function App() { - return ( - - Modal content - - ); -} - -export default reactExtension( - 'Playground', - () => , -); diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Badge/Badge.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Badge/Badge.ts deleted file mode 100644 index 26ac638e51..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Badge/Badge.ts +++ /dev/null @@ -1,6 +0,0 @@ -import {Badge as BaseBadge} from '@shopify/ui-extensions/admin'; -import type {BadgeProps} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const Badge = createRemoteReactComponent<'Badge', BadgeProps>(BaseBadge); -export type {BadgeProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Badge/examples/basic-badge.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Badge/examples/basic-badge.example.tsx deleted file mode 100644 index 33dfa4e89d..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Badge/examples/basic-badge.example.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import {render, Badge} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ( - - Fulfilled - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Banner/Banner.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Banner/Banner.ts deleted file mode 100644 index 4ecdc31030..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Banner/Banner.ts +++ /dev/null @@ -1,11 +0,0 @@ -import {Banner as BaseBanner} from '@shopify/ui-extensions/admin'; -import { - createRemoteReactComponent, - ReactPropsFromRemoteComponentType, -} from '@remote-ui/react'; - -export const Banner = createRemoteReactComponent(BaseBanner, { - fragmentProps: ['primaryAction', 'secondaryAction'], -}); - -export type BannerProps = ReactPropsFromRemoteComponentType; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Banner/examples/basic-banner.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Banner/examples/basic-banner.example.tsx deleted file mode 100644 index 8db34382e4..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Banner/examples/basic-banner.example.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import React from 'react'; -import { - render, - Banner, - Paragraph, -} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ( - console.log('dismissed banner')}> - Your store may be affected - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/BlockStack/BlockStack.ts b/packages/ui-extensions-react/src/surfaces/admin/components/BlockStack/BlockStack.ts deleted file mode 100644 index dd606c36cc..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/BlockStack/BlockStack.ts +++ /dev/null @@ -1,9 +0,0 @@ -import {BlockStack as BaseBlockStack} from '@shopify/ui-extensions/admin'; -import type {BlockStackProps} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const BlockStack = createRemoteReactComponent< - 'BlockStack', - BlockStackProps ->(BaseBlockStack); -export type {BlockStackProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/BlockStack/examples/basic-blockstack.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/BlockStack/examples/basic-blockstack.example.tsx deleted file mode 100644 index b2c2a1dab7..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/BlockStack/examples/basic-blockstack.example.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import React from 'react'; -import { - render, - BlockStack, -} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ( - - <>Child 1 - <>Child 2 - <>Child 3 - <>Child 4 - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Box/Box.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Box/Box.ts deleted file mode 100644 index 05a4ca92ed..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Box/Box.ts +++ /dev/null @@ -1,6 +0,0 @@ -import {Box as BaseBox} from '@shopify/ui-extensions/admin'; -import type {BoxProps} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const Box = createRemoteReactComponent<'Box', BoxProps>(BaseBox); -export type {BoxProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Box/examples/basic-box.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Box/examples/basic-box.example.tsx deleted file mode 100644 index 30be051844..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Box/examples/basic-box.example.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import {render, Box} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ( - - Box - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Button/Button.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Button/Button.ts deleted file mode 100644 index 31376f27e9..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Button/Button.ts +++ /dev/null @@ -1,8 +0,0 @@ -import {Button as BaseButton} from '@shopify/ui-extensions/admin'; -import type {ButtonProps} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const Button = createRemoteReactComponent<'Button', ButtonProps>( - BaseButton, -); -export type {ButtonProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Button/examples/basic-button.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Button/examples/basic-button.example.tsx deleted file mode 100644 index 93fcdd8f25..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Button/examples/basic-button.example.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import {render, Button} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ( - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Checkbox/Checkbox.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Checkbox/Checkbox.ts deleted file mode 100644 index 75ddfa2a82..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Checkbox/Checkbox.ts +++ /dev/null @@ -1,8 +0,0 @@ -import {Checkbox as BaseCheckbox} from '@shopify/ui-extensions/admin'; -import type {CheckboxProps} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const Checkbox = createRemoteReactComponent<'Checkbox', CheckboxProps>( - BaseCheckbox, -); -export type {CheckboxProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Checkbox/examples/basic-checkbox.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Checkbox/examples/basic-checkbox.example.tsx deleted file mode 100644 index 40644d7324..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Checkbox/examples/basic-checkbox.example.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import {render, Checkbox} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ( - - Save this information for next time - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/ChoiceList/ChoiceList.ts b/packages/ui-extensions-react/src/surfaces/admin/components/ChoiceList/ChoiceList.ts deleted file mode 100644 index bc750e7cd9..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/ChoiceList/ChoiceList.ts +++ /dev/null @@ -1,9 +0,0 @@ -import {ChoiceList as BaseChoiceList} from '@shopify/ui-extensions/admin'; -import type {ChoiceListProps} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const ChoiceList = createRemoteReactComponent< - 'ChoiceList', - ChoiceListProps ->(BaseChoiceList); -export type {ChoiceListProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/ChoiceList/examples/basic-choicelist.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/ChoiceList/examples/basic-choicelist.example.tsx deleted file mode 100644 index f34899efed..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/ChoiceList/examples/basic-choicelist.example.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import {render, ChoiceList} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ( - - ); -} \ No newline at end of file diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/ColorPicker/ColorPicker.ts b/packages/ui-extensions-react/src/surfaces/admin/components/ColorPicker/ColorPicker.ts deleted file mode 100644 index 06217b89b1..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/ColorPicker/ColorPicker.ts +++ /dev/null @@ -1,9 +0,0 @@ -import {ColorPicker as BaseColorPicker} from '@shopify/ui-extensions/admin'; -import type {ColorPickerProps} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const ColorPicker = createRemoteReactComponent< - 'ColorPicker', - ColorPickerProps ->(BaseColorPicker); -export type {ColorPickerProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/ColorPicker/examples/basic-colorpicker.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/ColorPicker/examples/basic-colorpicker.example.tsx deleted file mode 100644 index bddc087269..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/ColorPicker/examples/basic-colorpicker.example.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import { - render, - ColorPicker, -} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ( - { - console.log({value}); - }} - /> - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/CustomerSegmentTemplate/CustomerSegmentTemplate.ts b/packages/ui-extensions-react/src/surfaces/admin/components/CustomerSegmentTemplate/CustomerSegmentTemplate.ts deleted file mode 100644 index 71ec0058b4..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/CustomerSegmentTemplate/CustomerSegmentTemplate.ts +++ /dev/null @@ -1,7 +0,0 @@ -import {CustomerSegmentTemplate as BaseCustomerSegmentTemplate} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const CustomerSegmentTemplate = createRemoteReactComponent( - BaseCustomerSegmentTemplate, -); -export type {CustomerSegmentTemplateProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/CustomerSegmentTemplate/examples/customersegmenttemplate.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/CustomerSegmentTemplate/examples/customersegmenttemplate.example.tsx deleted file mode 100644 index c4b5afd10f..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/CustomerSegmentTemplate/examples/customersegmenttemplate.example.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react'; -import {reactExtension, CustomerSegmentTemplate} from '@shopify/ui-extensions/admin'; - -function App() { - return ( - - ); -} - -export default reactExtension('Playground', () => ); diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/DateField/DateField.ts b/packages/ui-extensions-react/src/surfaces/admin/components/DateField/DateField.ts deleted file mode 100644 index 9c2cbf3134..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/DateField/DateField.ts +++ /dev/null @@ -1,5 +0,0 @@ -import {DateField as BaseDateField} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const DateField = createRemoteReactComponent(BaseDateField); -export type {DateFieldProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/DateField/examples/basic-datefield.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/DateField/examples/basic-datefield.example.tsx deleted file mode 100644 index 13542e0195..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/DateField/examples/basic-datefield.example.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import React, { useState } from 'react'; -import { - render, - DateField, - type Selected -} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - const [selected, setSelected] = useState('2023-11-08') - return ( - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/DateField/examples/multiple-datefield.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/DateField/examples/multiple-datefield.example.tsx deleted file mode 100644 index 3e2914e80d..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/DateField/examples/multiple-datefield.example.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import React from 'react'; -import { - render, - DateField, - type Selected, -} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - const [selected, setSelected] = React.useState(['2023-11-08']); - - return ( - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/DateField/examples/range-datefield.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/DateField/examples/range-datefield.example.tsx deleted file mode 100644 index 8519b66dbb..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/DateField/examples/range-datefield.example.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import React from 'react'; -import { - render, - DateField, - type Selected -} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - const [selected, setSelected] = React.useState({start: '2023-11-08', end: '2023-11-10' }); - - return ( - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/DatePicker/DatePicker.ts b/packages/ui-extensions-react/src/surfaces/admin/components/DatePicker/DatePicker.ts deleted file mode 100644 index 54923a8ad5..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/DatePicker/DatePicker.ts +++ /dev/null @@ -1,5 +0,0 @@ -import {DatePicker as BaseDatePicker} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const DatePicker = createRemoteReactComponent(BaseDatePicker); -export type {DatePickerProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/DatePicker/examples/basic-datepicker.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/DatePicker/examples/basic-datepicker.example.tsx deleted file mode 100644 index 4f36fd9329..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/DatePicker/examples/basic-datepicker.example.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import React, { useState } from 'react'; -import { - render, - DatePicker, - type Selected -} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - const [selected, setSelected] = useState('2023-11-08') - return ( - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/DatePicker/examples/multiple-datepicker.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/DatePicker/examples/multiple-datepicker.example.tsx deleted file mode 100644 index c5dbf58921..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/DatePicker/examples/multiple-datepicker.example.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import React from 'react'; -import { - render, - DatePicker, - type Selected, -} from '@shopify/ui-extensions-react/admin'; - - -render('Playground', () => ); - -function App() { - const [selected, setSelected] = React.useState(['2023-11-08']); - - return ( - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/DatePicker/examples/range-datepicker.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/DatePicker/examples/range-datepicker.example.tsx deleted file mode 100644 index 209fe39f68..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/DatePicker/examples/range-datepicker.example.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import React from 'react'; -import { - render, - DatePicker, - type Selected -} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - const [selected, setSelected] = React.useState({start: '2023-11-08', end: '2023-11-10' }); - - return ( - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Divider/Divider.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Divider/Divider.ts deleted file mode 100644 index 0b2a3a535e..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Divider/Divider.ts +++ /dev/null @@ -1,5 +0,0 @@ -import {Divider as BaseDivider} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const Divider = createRemoteReactComponent(BaseDivider); -export type {DividerProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Divider/examples/basic-divider.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Divider/examples/basic-divider.example.tsx deleted file mode 100644 index 902ab9478f..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Divider/examples/basic-divider.example.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import React from 'react'; -import { - render, - Divider, - BlockStack, -} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ( - - <>First text - - <>Second Text - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/EmailField/EmailField.ts b/packages/ui-extensions-react/src/surfaces/admin/components/EmailField/EmailField.ts deleted file mode 100644 index fb96dc2f8e..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/EmailField/EmailField.ts +++ /dev/null @@ -1,5 +0,0 @@ -import {EmailField as BaseEmailField} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const EmailField = createRemoteReactComponent(BaseEmailField); -export type {EmailFieldProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/EmailField/examples/basic-emailfield.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/EmailField/examples/basic-emailfield.example.tsx deleted file mode 100644 index 2b4cdff6bf..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/EmailField/examples/basic-emailfield.example.tsx +++ /dev/null @@ -1,7 +0,0 @@ -import {render, EmailField} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ; -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Form/Form.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Form/Form.ts deleted file mode 100644 index 68e3f4c308..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Form/Form.ts +++ /dev/null @@ -1,5 +0,0 @@ -import {Form as BaseForm} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const Form = createRemoteReactComponent(BaseForm); -export type {FormProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Form/examples/basic-form.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Form/examples/basic-form.example.tsx deleted file mode 100644 index c6d445ed83..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Form/examples/basic-form.example.tsx +++ /dev/null @@ -1,51 +0,0 @@ -import React, { useCallback, useState } from 'react'; -import { - reactExtension, - Form, - TextField, -} from '@shopify/ui-extensions-react/admin'; - -export default reactExtension("admin.product-details.block.render", () => ); - -function App() { - const [value, setValue] = useState(""); - const [error, setError] = useState(''); - - const onSubmit = useCallback( - async () => { - // API call to save the values - const res = await fetch('/save', {method:'POST', body: JSON.stringify({name: value})}); - if (!res.ok) { - const json = await res.json(); - const errors = json.errors.join(','); - setError(errors); - } - }, - [value] - ); - - const onReset = useCallback(async () => { - // Reset to initial value - setValue('') - // Clear errors - setError('') - }, []); - - const onInput = useCallback((nameValue) => { - if (!nameValue) { - setError("Please enter a name."); - } - }, []) - - // Field values can only be updated on change when using Remote UI. - const onChange = useCallback((nameValue) => { - setValue(nameValue); - }, []) - - - return ( -
- - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/FunctionSettings/FunctionSettings.ts b/packages/ui-extensions-react/src/surfaces/admin/components/FunctionSettings/FunctionSettings.ts deleted file mode 100644 index a656e3fd0e..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/FunctionSettings/FunctionSettings.ts +++ /dev/null @@ -1,9 +0,0 @@ -import {FunctionSettings as BaseFunctionSettings} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const FunctionSettings = - createRemoteReactComponent(BaseFunctionSettings); -export type { - FunctionSettingsProps, - FunctionSettingsError, -} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/FunctionSettings/examples/basic-functionsettings.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/FunctionSettings/examples/basic-functionsettings.example.tsx deleted file mode 100644 index f986411219..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/FunctionSettings/examples/basic-functionsettings.example.tsx +++ /dev/null @@ -1,55 +0,0 @@ -import { - reactExtension, - useApi, - FunctionSettings, - TextField, - Section, -} from '@shopify/ui-extensions-react/admin'; - -export default reactExtension( - 'admin.settings.validation.render', - async (api) => { - // Use Direct API access to fetch initial - // metafields from the server if we are - // rendering against a pre-existing `Validation` - const initialSettings = api.data.validation - ? await fetchSettings(api.data.validation.id) - : {}; - - return ; -}); - -function App({settings}) { - const [value, setValue] = useState(settings); - const [error, setError] = useState(); - - const {applyMetafieldsChange} = useApi(); - - return ( - { - setError(errors[0]?.message); - }} - > -
- { - setValue(value); - setError(undefined); - applyMetafieldsChange({ - type: 'updateMetafield', - namespace: '$app:my_namespace', - key: 'name', - value, - valueType: 'single_line_text_field', - }); - }} - /> -
- - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Heading/Heading.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Heading/Heading.ts deleted file mode 100644 index 771b352bea..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Heading/Heading.ts +++ /dev/null @@ -1,5 +0,0 @@ -import {Heading as BaseHeading} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const Heading = createRemoteReactComponent(BaseHeading); -export type {HeadingProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Heading/examples/basic-heading.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Heading/examples/basic-heading.example.tsx deleted file mode 100644 index b03a114e76..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Heading/examples/basic-heading.example.tsx +++ /dev/null @@ -1,7 +0,0 @@ -import {render, Heading} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return Store name; -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/HeadingGroup/HeadingGroup.ts b/packages/ui-extensions-react/src/surfaces/admin/components/HeadingGroup/HeadingGroup.ts deleted file mode 100644 index 32f411f5da..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/HeadingGroup/HeadingGroup.ts +++ /dev/null @@ -1,5 +0,0 @@ -import {HeadingGroup as BaseHeadingGroup} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const HeadingGroup = createRemoteReactComponent(BaseHeadingGroup); -export type {HeadingGroupProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/HeadingGroup/examples/basic-headinggroup.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/HeadingGroup/examples/basic-headinggroup.example.tsx deleted file mode 100644 index 7bcaef3901..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/HeadingGroup/examples/basic-headinggroup.example.tsx +++ /dev/null @@ -1,23 +0,0 @@ -import { - render, - HeadingGroup, - Heading, - } from '@shopify/ui-extensions-react/admin'; - - render('Playground', () => ); - - function App() { - return ( - <> - Heading <h1> - - - Heading <h2> - - - Heading <h3> - - - - ); - } diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Icon/Icon.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Icon/Icon.ts deleted file mode 100644 index 45aaa47154..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Icon/Icon.ts +++ /dev/null @@ -1,5 +0,0 @@ -import {Icon as BaseIcon} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const Icon = createRemoteReactComponent(BaseIcon); -export type {IconProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Icon/examples/basic-icon.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Icon/examples/basic-icon.example.tsx deleted file mode 100644 index a3e8089a44..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Icon/examples/basic-icon.example.tsx +++ /dev/null @@ -1,7 +0,0 @@ -import {render, Icon} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ; -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Image/Image.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Image/Image.ts deleted file mode 100644 index 4440a48eb1..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Image/Image.ts +++ /dev/null @@ -1,6 +0,0 @@ -import {Image as BaseImage} from '@shopify/ui-extensions/admin'; -import type {ImageProps} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const Image = createRemoteReactComponent<'Image', ImageProps>(BaseImage); -export type {ImageProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Image/examples/basic-image.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Image/examples/basic-image.example.tsx deleted file mode 100644 index 43dc6f5ea5..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Image/examples/basic-image.example.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import {render, Image} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ( - Pickaxe - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/InlineStack/InlineStack.ts b/packages/ui-extensions-react/src/surfaces/admin/components/InlineStack/InlineStack.ts deleted file mode 100644 index 7b8eba3454..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/InlineStack/InlineStack.ts +++ /dev/null @@ -1,9 +0,0 @@ -import {InlineStack as BaseInlineStack} from '@shopify/ui-extensions/admin'; -import type {InlineStackProps} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const InlineStack = createRemoteReactComponent< - 'InlineStack', - InlineStackProps ->(BaseInlineStack); -export type {InlineStackProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/InlineStack/examples/basic-inlinestack.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/InlineStack/examples/basic-inlinestack.example.tsx deleted file mode 100644 index d9fb203f83..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/InlineStack/examples/basic-inlinestack.example.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import React from 'react'; -import { - render, - InlineStack, -} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ( - - <>Child 1 - <>Child 2 - <>Child 3 - <>Child 4 - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/InternalCustomerSegmentTemplate/InternalCustomerSegmentTemplate.ts b/packages/ui-extensions-react/src/surfaces/admin/components/InternalCustomerSegmentTemplate/InternalCustomerSegmentTemplate.ts deleted file mode 100644 index d41489cfbe..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/InternalCustomerSegmentTemplate/InternalCustomerSegmentTemplate.ts +++ /dev/null @@ -1,7 +0,0 @@ -import {InternalCustomerSegmentTemplate as BaseInternalCustomerSegmentTemplate} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const InternalCustomerSegmentTemplate = createRemoteReactComponent( - BaseInternalCustomerSegmentTemplate, -); -export type {InternalCustomerSegmentTemplateProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/InternalCustomerSegmentTemplate/examples/internalcustomersegmenttemplate.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/InternalCustomerSegmentTemplate/examples/internalcustomersegmenttemplate.example.tsx deleted file mode 100644 index a85de408d8..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/InternalCustomerSegmentTemplate/examples/internalcustomersegmenttemplate.example.tsx +++ /dev/null @@ -1,38 +0,0 @@ -import React from 'react'; -import { - reactExtension, - InternalCustomerSegmentTemplate, -} from '@shopify/ui-extensions-react/admin'; - -function App({i18n, enabledFeatures}) { - const productsPurchasedOnTagsEnabled = enabledFeatures.includes('productsPurchasedByTags'); - const query = productsPurchasedOnTagsEnabled - ? 'products_purchased(tag: (product_tag)) = true' - : 'products_purchased(id: (product_id)) = true'; - const queryToInsert = productsPurchasedOnTagsEnabled - ? 'products_purchased(tag:' - : 'products_purchased(id:'; - - return ( - <> - - - - ); -} - -reactExtension('admin.customers.segmentation-templates.render', ({i18n, __enabledFeatures}) => ); diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/InternalLocationList/InternalLocationList.ts b/packages/ui-extensions-react/src/surfaces/admin/components/InternalLocationList/InternalLocationList.ts deleted file mode 100644 index 72e392ed18..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/InternalLocationList/InternalLocationList.ts +++ /dev/null @@ -1,7 +0,0 @@ -import {InternalLocationList as BaseInternalLocationList} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const InternalLocationList = createRemoteReactComponent( - BaseInternalLocationList, -); -export type {InternalLocationListProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Link/Link.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Link/Link.ts deleted file mode 100644 index 7839408e6f..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Link/Link.ts +++ /dev/null @@ -1,5 +0,0 @@ -import {Link as BaseLink} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const Link = createRemoteReactComponent(BaseLink); -export type {LinkProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Link/examples/app-link.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Link/examples/app-link.example.tsx deleted file mode 100644 index 73b437853c..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Link/examples/app-link.example.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import React from 'react'; -import { - render, - Link, -} from '@shopify/ui-extensions-react/admin'; - - -render('Playground', () => ); - -function App() { - return ( - - Link to app path - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Link/examples/external-link.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Link/examples/external-link.example.tsx deleted file mode 100644 index 0f4c6af283..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Link/examples/external-link.example.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import React from 'react'; -import { - render, - Link, -} from '@shopify/ui-extensions-react/admin'; - - -render('Playground', () => ); - -function App() { - return ( - - Sustainability fund - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Link/examples/relative-link.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Link/examples/relative-link.example.tsx deleted file mode 100644 index 822ae7bdc9..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Link/examples/relative-link.example.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import React from 'react'; -import { - render, - Link, -} from '@shopify/ui-extensions-react/admin'; - - -render('Playground', () => ); - -function App() { - return ( - - Link relative to current path - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Link/examples/shopify-section-link.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Link/examples/shopify-section-link.example.tsx deleted file mode 100644 index f10a0e5ade..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Link/examples/shopify-section-link.example.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import React from 'react'; -import { - render, - Link, -} from '@shopify/ui-extensions-react/admin'; - - -render('Playground', () => ); - -function App() { - return ( - - Shop's orders - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/MoneyField/MoneyField.ts b/packages/ui-extensions-react/src/surfaces/admin/components/MoneyField/MoneyField.ts deleted file mode 100644 index d2f04f946b..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/MoneyField/MoneyField.ts +++ /dev/null @@ -1,5 +0,0 @@ -import {MoneyField as BaseMoneyField} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const MoneyField = createRemoteReactComponent(BaseMoneyField); -export type {MoneyFieldProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/MoneyField/examples/basic-moneyfield.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/MoneyField/examples/basic-moneyfield.example.tsx deleted file mode 100644 index bdd46cdcde..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/MoneyField/examples/basic-moneyfield.example.tsx +++ /dev/null @@ -1,10 +0,0 @@ -import {render, MoneyField} from '@shopify/ui-extensions-react/admin'; -import {useState} from 'react'; - -render('Playground', () => ); - -function App() { - const [value, setValue] = useState({ amount: 100, currencyCode: 'USD' }); - - return ; -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/NumberField/NumberField.ts b/packages/ui-extensions-react/src/surfaces/admin/components/NumberField/NumberField.ts deleted file mode 100644 index dff37fc7ad..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/NumberField/NumberField.ts +++ /dev/null @@ -1,5 +0,0 @@ -import {NumberField as BaseNumberField} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const NumberField = createRemoteReactComponent(BaseNumberField); -export type {NumberFieldProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/NumberField/examples/basic-numberfield.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/NumberField/examples/basic-numberfield.example.tsx deleted file mode 100644 index 65dd16ea34..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/NumberField/examples/basic-numberfield.example.tsx +++ /dev/null @@ -1,7 +0,0 @@ -import {render, NumberField} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ; -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Paragraph/Paragraph.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Paragraph/Paragraph.ts deleted file mode 100644 index 0a3ada05d5..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Paragraph/Paragraph.ts +++ /dev/null @@ -1,5 +0,0 @@ -import {Paragraph as BaseParagraph} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const Paragraph = createRemoteReactComponent(BaseParagraph); -export type {ParagraphProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Paragraph/examples/basic-paragraph.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Paragraph/examples/basic-paragraph.example.tsx deleted file mode 100644 index 022b4c2db6..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Paragraph/examples/basic-paragraph.example.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import { - render, - BlockStack, - Paragraph, -} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ( - - Name: - Jane Doe - - ) -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/PasswordField/PasswordField.ts b/packages/ui-extensions-react/src/surfaces/admin/components/PasswordField/PasswordField.ts deleted file mode 100644 index 42d1785e28..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/PasswordField/PasswordField.ts +++ /dev/null @@ -1,5 +0,0 @@ -import {PasswordField as BasePasswordField} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const PasswordField = createRemoteReactComponent(BasePasswordField); -export type {PasswordFieldProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/PasswordField/examples/basic-passwordfield.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/PasswordField/examples/basic-passwordfield.example.tsx deleted file mode 100644 index a2ca1d62e7..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/PasswordField/examples/basic-passwordfield.example.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import { - render, - BlockStack, - TextField, - PasswordField -} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - return ( - - - - - ) -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Pressable/Pressable.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Pressable/Pressable.ts deleted file mode 100644 index bac20a88a4..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Pressable/Pressable.ts +++ /dev/null @@ -1,9 +0,0 @@ -import {Pressable as BasePressable} from '@shopify/ui-extensions/admin'; -import type {PressableProps} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const Pressable = createRemoteReactComponent< - 'Pressable', - PressableProps ->(BasePressable); -export type {PressableProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Pressable/examples/basic-pressable.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Pressable/examples/basic-pressable.example.tsx deleted file mode 100644 index 67efde16b8..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Pressable/examples/basic-pressable.example.tsx +++ /dev/null @@ -1,20 +0,0 @@ -import { - reactExtension, - Icon, - InlineStack, - Pressable, - Text, -} from '@shopify/ui-extensions-react/admin'; - -reactExtension('Playground', () => ); - -function Extension() { - return ( - - - Go to Apps Dashboard - - - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/ProgressIndicator/ProgressIndicator.ts b/packages/ui-extensions-react/src/surfaces/admin/components/ProgressIndicator/ProgressIndicator.ts deleted file mode 100644 index 655e9ab99d..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/ProgressIndicator/ProgressIndicator.ts +++ /dev/null @@ -1,9 +0,0 @@ -import {ProgressIndicator as BaseProgressIndicator} from '@shopify/ui-extensions/admin'; -import type {ProgressIndicatorProps} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const ProgressIndicator = createRemoteReactComponent< - 'ProgressIndicator', - ProgressIndicatorProps ->(BaseProgressIndicator); -export type {ProgressIndicatorProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/ProgressIndicator/examples/basic-progressindicator.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/ProgressIndicator/examples/basic-progressindicator.example.tsx deleted file mode 100644 index 8b4968f5e9..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/ProgressIndicator/examples/basic-progressindicator.example.tsx +++ /dev/null @@ -1,12 +0,0 @@ -import { - reactExtension, - ProgressIndicator, -} from '@shopify/ui-extensions-react/admin'; - -reactExtension('Playground', () => ); - -function App() { - return ( - - ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Section/Section.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Section/Section.ts deleted file mode 100644 index d4413c2db0..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Section/Section.ts +++ /dev/null @@ -1,5 +0,0 @@ -import {Section as BaseSection} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const Section = createRemoteReactComponent(BaseSection); -export type {SectionProps} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Section/examples/basic-Section.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Section/examples/basic-Section.example.tsx deleted file mode 100644 index 45538063f5..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Section/examples/basic-Section.example.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import React from 'react'; -import { - render, - Section, -} from '@shopify/ui-extensions-react/admin'; - - -render('Playground', () => ); - -function App() { - return ( -
- Section content -
- ); -} diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Select/Select.ts b/packages/ui-extensions-react/src/surfaces/admin/components/Select/Select.ts deleted file mode 100644 index 92bfcc35a4..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Select/Select.ts +++ /dev/null @@ -1,11 +0,0 @@ -import {Select as BaseSelect} from '@shopify/ui-extensions/admin'; -import {createRemoteReactComponent} from '@remote-ui/react'; - -export const Select = createRemoteReactComponent(BaseSelect); -export type { - SelectProps, - OptionProps, - OptionGroupProps, - OptionDescription, - OptionGroupDescription, -} from '@shopify/ui-extensions/admin'; diff --git a/packages/ui-extensions-react/src/surfaces/admin/components/Select/examples/basic-select.example.tsx b/packages/ui-extensions-react/src/surfaces/admin/components/Select/examples/basic-select.example.tsx deleted file mode 100644 index f9cec98b9a..0000000000 --- a/packages/ui-extensions-react/src/surfaces/admin/components/Select/examples/basic-select.example.tsx +++ /dev/null @@ -1,45 +0,0 @@ -import React from 'react'; -import { - render, - Select, -} from '@shopify/ui-extensions-react/admin'; - -render('Playground', () => ); - -function App() { - const [value, setValue] = React.useState('2'); - - return ( -