Merge pull request #2528 from Shopify/njo/pos-remove-ActionItem

Njo/pos remove action item

.changeset/hot-insects-float.md

@@ -0,0 +1,6 @@
+---
+'@shopify/ui-extensions-react': minor
+'@shopify/ui-extensions': minor
+---
+
+Removed deprecated props, components, and APIs

packages/ui-extensions-react/src/surfaces/point-of-sale.ts

@@ -68,7 +68,6 @@ export type {
   PasswordProps,
   EmbeddedElementProps,
   NewTextFieldProps,
-  TextFieldProps,
   TileProps,
   TimeFieldProps,
   TimePickerProps,

packages/ui-extensions-react/src/surfaces/point-of-sale/components.ts

@@ -1,4 +1,3 @@
-export {ActionItem} from './components/ActionItem/ActionItem';
 export {Badge} from './components/Badge/Badge';
 export {Banner} from './components/Banner/Banner';
 export {Button} from './components/Button/Button';

packages/ui-extensions/docs/surfaces/point-of-sale/reference/components/Badge.doc.ts

@@ -38,7 +38,7 @@ const data: ReferenceEntityTemplateSchema = {
       anchorLink: 'content-guidelines',
       title: 'Content guidelines',
       sectionContent: `
-- Be concise. Use a single word to describe the status of an item. 
+- Be concise. Use a single word to describe the status of an item.
 - Only use two or three words if you need to describe a complex state, for example "partially fulfilled".
 
 ✅ fulfilled

packages/ui-extensions/docs/surfaces/point-of-sale/reference/examples/action-api/present-modal.ts

@@ -1,11 +1,10 @@
-import {ActionItem, extension} from '@shopify/ui-extensions/point-of-sale';
+import {Button, extension} from '@shopify/ui-extensions/point-of-sale';
 
 export default extension(
   'pos.purchase.post.action.menu-item.render',
   (root, api) => {
-    const actionItem = root.createComponent(ActionItem, {
+    const actionItem = root.createComponent(Button, {
       onPress: () => api.action.presentModal(),
-      enabled: true,
     });
 
     root.append(actionItem);

packages/ui-extensions/docs/surfaces/point-of-sale/reference/examples/action-api/present-modal.tsx

@@ -2,21 +2,16 @@ import React from 'react';
 import {
   reactExtension,
   useApi,
-  ActionItem,
+  Button,
 } from '@shopify/ui-extensions-react/point-of-sale';
 
 const PostPurchaseActionItem = () => {
   const api = useApi<'pos.purchase.post.action.menu-item.render'>();
 
-  return (
-    <ActionItem
-      onPress={() => api.action.presentModal()}
-      enabled
-    />
-  );
+  return <Button onPress={() => api.action.presentModal()} />;
 };
 
 export default reactExtension(
   'pos.purchase.post.action.menu-item.render',
-  () => <PostPurchaseActionItem />
-);
+  () => <PostPurchaseActionItem />,
+);

packages/ui-extensions/docs/surfaces/point-of-sale/reference/examples/action-item/default.example.ts

@@ -1,16 +1,15 @@
 import {
-  ActionItem,
+  Button,
   extension,
 } from '@shopify/ui-extensions/point-of-sale';
 
 export default extension(
   'pos.purchase.post.action.menu-item.render',
   (root, api) => {
     const actionItem = root.createComponent(
-      ActionItem,
+      Button,
       {
         onPress: () => api.action.presentModal(),
-        enabled: true,
       },
     );
 

packages/ui-extensions/docs/surfaces/point-of-sale/reference/examples/action-item/default.example.tsx

@@ -2,21 +2,21 @@ import React from 'react';
 import {
   reactExtension,
   useApi,
-  ActionItem,
+  Button,
 } from '@shopify/ui-extensions-react/point-of-sale';
 
 const PostPurchaseActionItem = () => {
-  const api = useApi<'pos.purchase.post.action.menu-item.render'>();
+  const api =
+    useApi<'pos.purchase.post.action.menu-item.render'>();
 
   return (
-    <ActionItem
+    <Button
       onPress={() => api.action.presentModal()}
-      enabled
     />
   );
 };
 
 export default reactExtension(
   'pos.purchase.post.action.menu-item.render',
-  () => <PostPurchaseActionItem />
-);
+  () => <PostPurchaseActionItem />,
+);

packages/ui-extensions/docs/surfaces/point-of-sale/staticPages/pages/versions.doc.ts

@@ -42,13 +42,20 @@ Refer to the [migration guide](/docs/api/pos-ui-extensions/migrating) for more i
       anchorLink: '202501',
       title: '2025.01',
       sectionContent: `
-- Added in POS version: N/A
+- Added in POS version: 9.26
 - Removed in POS version: N/A
-- Release day: 1/1/2025
+- Release day: 1/6/2025
+
+### Breaking Changes
+- Removed the deprecated ActionItem component. Use a [Button](/docs/api/pos-ui-extensions/components/button) instead.
+- Removed the deprecated SmartGridApi. Use the [ActionApi](/docs/api/pos-ui-extensions/apis/action-api) instead.
+- Removed the deprecated DiscountType. Use [CartDiscountType](/docs/api/pos-ui-extensions/apis/cart-api#cartapi-propertydetail-applycartdiscount) and [LineItemDiscountType](/docs/api/pos-ui-extensions/apis/cart-api#cartapi-propertydetail-setlineitemdiscount) instead.
+- Removed the deprecated \`badge\` prop from the [List](/docs/api/pos-ui-extensions/components/list) component. Use \`badges\` instead.
+- Removed the deprecated \`TextFieldProps\` type from the [TextField](/docs/api/pos-ui-extensions/components/textfield) component.
+- Removed \`customValidator\` prop from the [FormattedTextField](/docs/api/pos-ui-extensions/components/formattedtextfield) component.
 
 ### Features
 
-- Removed \`customValidator\` prop from the [FormattedTextField](/docs/api/pos-ui-extensions/apis/formatted-text-field) component.
 - Added [PrintApi](/docs/api/pos-ui-extensions/apis/print-api) and a [PrintPreview](/docs/api/pos-ui-extensions/components/printpreview) component.
       `,
     },

packages/ui-extensions/src/surfaces/point-of-sale/api.ts

@@ -1,6 +1,5 @@
 export type {
   CartApi,
-  DiscountType,
   CartDiscountType,
   CartApiContent,
   LineItemDiscountType,
@@ -75,11 +74,6 @@ export type {
   SessionApi,
 } from './render/api/session-api/session-api';
 
-export type {
-  SmartGridApi,
-  SmartGridApiContent,
-} from './render/api/smartgrid-api/smartgrid-api';
-
 export type {
   ShowToastOptions,
   ToastApiContent,

packages/ui-extensions/src/surfaces/point-of-sale/components.ts

@@ -1,5 +1,3 @@
-export {ActionItem} from './render/components/ActionItem/ActionItem';
-export type {ActionItemProps} from './render/components/ActionItem/ActionItem';
 export {Badge} from './render/components/Badge/Badge';
 export type {
   BadgeProps,
@@ -104,7 +102,6 @@ export {TextArea} from './render/components/TextArea/TextArea';
 export type {TextAreaProps} from './render/components/TextArea/TextArea';
 export {TextField} from './render/components/TextField/TextField';
 export type {
-  TextFieldProps,
   NewTextFieldProps,
   ActionProps,
   InfoProps,

packages/ui-extensions/src/surfaces/point-of-sale/render/api/cart-api/cart-api.ts

@@ -15,17 +15,6 @@ export interface CartApi {
   cart: CartApiContent;
 }
 
-/**
- * @deprecated
- * PriceOverride is no longer supported. Code discounts are only supported at the Cart level.
- * Please migrate to using CartDiscountType and LineItemDiscountType as soon as possible.
- */
-export type DiscountType =
-  | 'Percentage'
-  | 'FixedAmount'
-  | 'PriceOverride'
-  | 'Code';
-
 export type CartDiscountType = 'Percentage' | 'FixedAmount' | 'Code';
 
 export type LineItemDiscountType = 'Percentage' | 'FixedAmount';

packages/ui-extensions/src/surfaces/point-of-sale/render/components/List/List.ts

@@ -38,12 +38,6 @@ export interface ListRowLeftSide {
    * Subtitles can optionally be configured with colors by passing an object with a `content` and `color` properties.
    */
   subtitle?: [ListRowSubtitle, ListRowSubtitle?, ListRowSubtitle?];
-  /**
-   * @deprecated
-   * badge will be removed in version 2.0.0 in favor of badges.
-   * Please migrate to using badges as soon as possible.
-   */
-  badge?: BadgeProps;
   /**
    * Colored badges that are displayed underneath the `title` and `subtitles`.
    */

packages/ui-extensions/src/surfaces/point-of-sale/render/components/TextField/TextField.ts

@@ -1,5 +1,4 @@
 import {createRemoteComponent} from '@remote-ui/core';
-import type {BaseTextFieldProps} from '../shared/BaseTextField';
 import type {InputProps} from '../shared/InputField';
 
 export interface ActionProps {
@@ -32,16 +31,6 @@ export type EmbeddedElementProps =
 
 export interface NewTextFieldProps extends InputProps {}
 
-/**
- * @deprecated
- * This TextField component will only support NewTextFieldProps in version 2.0.0.
- * Please migrate to using NewTextFieldProps as soon as possible.
- */
-export interface TextFieldProps extends BaseTextFieldProps {
-  rightElementStyle?: EmbeddedElementProps;
-}
-
-export const TextField = createRemoteComponent<
+export const TextField = createRemoteComponent<'TextField', NewTextFieldProps>(
   'TextField',
-  TextFieldProps | NewTextFieldProps
->('TextField');
+);

packages/ui-extensions/src/surfaces/point-of-sale/targets.ts

@@ -1,11 +1,5 @@
 import {StandardApi} from './render/api/standard/standard-api';
-import {
-  // eslint-disable-next-line import/no-deprecated
-  SmartGridApi,
-  OrderApi,
-  CartApi,
-  CustomerApi,
-} from './api';
+import {OrderApi, CartApi, CustomerApi} from './api';
 import {RenderExtension} from './extension';
 import type {Components} from './shared';
 import {AnyComponentBuilder} from '../../shared';
@@ -15,9 +9,7 @@ import {ActionTargetApi} from './render/api/action-target-api/action-target-api'
 import {DraftOrderApi} from './render/api/draft-order-api/draft-order-api';
 
 type SmartGridComponents = AnyComponentBuilder<Pick<Components, 'Tile'>>;
-type ActionComponents = AnyComponentBuilder<
-  Pick<Components, 'ActionItem' | 'Button'>
->;
+type ActionComponents = AnyComponentBuilder<Pick<Components, 'Button'>>;
 type BasicComponents = AnyComponentBuilder<Omit<Components, 'Tile'>>;
 type BlockComponents = AnyComponentBuilder<
   Pick<
@@ -38,8 +30,7 @@ type BlockComponents = AnyComponentBuilder<
 
 export interface ExtensionTargets {
   'pos.home.tile.render': RenderExtension<
-    // eslint-disable-next-line import/no-deprecated
-    StandardApi<'pos.home.tile.render'> & SmartGridApi & ActionApi & CartApi,
+    StandardApi<'pos.home.tile.render'> & ActionApi & CartApi,
     SmartGridComponents
   >;
   'pos.home.modal.render': RenderExtension<