diff --git a/polaris-react/playground/OrdersPage.tsx b/polaris-react/playground/OrdersPage.tsx index 5b1cea5cbc9..d593b6290ff 100644 --- a/polaris-react/playground/OrdersPage.tsx +++ b/polaris-react/playground/OrdersPage.tsx @@ -311,19 +311,27 @@ function Table({orders}: {orders: Order[]}) { ); }; - const paginationLabel = - pageCount === 1 - ? `${totalOrderCount} orders` - : `${ + const totalCountText = `${totalOrderCount} ${ + totalOrderCount === 1 ? 'order' : 'orders' + }`; + + const rangeText = + pagedOrders.length > 1 + ? `${ pagedOrdersStartIndex + 1 - }-${pagedOrdersEndIndex} of ${totalOrderCount} orders`; + }-${pagedOrdersEndIndex} of ${totalOrderCount} orders` + : totalCountText; + + const paginationLabel = pageCount === 1 ? totalCountText : rangeText; const pagination = { type: 'table', label: selectedResources.length > 0 ? undefined : ( - {paginationLabel} + + {paginationLabel} + ), hasNext, diff --git a/polaris-react/src/components/BulkActions/BulkActions.tsx b/polaris-react/src/components/BulkActions/BulkActions.tsx index 7e06de7eba6..5f2e023ef90 100644 --- a/polaris-react/src/components/BulkActions/BulkActions.tsx +++ b/polaris-react/src/components/BulkActions/BulkActions.tsx @@ -59,7 +59,9 @@ export interface BulkActionsProps { disabled?: boolean; /** Callback when more actions button is toggled */ onMoreActionPopoverToggle?(isOpen: boolean): void; - /** The size of the buttons to render */ + /** The size of the buttons to render + * @default 'medium' + */ buttonSize?: Extract; /** Label for the bulk actions */ label?: string; @@ -94,7 +96,7 @@ export const BulkActions = ({ promotedActions, actions, disabled, - buttonSize, + buttonSize = 'medium', paginatedSelectAllAction, paginatedSelectAllText, selected, @@ -212,7 +214,12 @@ export const BulkActions = ({ active={selectedAllMenuActive} onClose={toggleSelectAllMenu} activator={ -