@graphcommerce/magento-cart-items 9.0.0-canary.98 → 9.0.0

package/components/CartCrosssellsScroller/CartCrosssellsScroller.tsx

@@ -1,10 +1,6 @@
 import { useCrosssellItems } from '@graphcommerce/magento-cart/components/CartAdded/useCrosssellItems'
-import {
-  AddProductsToCartForm,
-  ProductListItemRenderer,
-  ProductScroller,
-  ProductScrollerProps,
-} from '@graphcommerce/magento-product'
+import type { ProductListItemRenderer, ProductScrollerProps } from '@graphcommerce/magento-product'
+import { AddProductsToCartForm, ProductScroller } from '@graphcommerce/magento-product'
 import { Trans } from '@lingui/macro'
 
 export type CartItemCrosssellsProps = {
@@ -13,7 +9,7 @@ export type CartItemCrosssellsProps = {
 
 export function CartCrosssellsScroller(props: CartItemCrosssellsProps) {
   const { renderer, sx = [], title, titleProps } = props
-  const [addedItem, crossSellItems] = useCrosssellItems()
+  const [, crossSellItems] = useCrosssellItems()
 
   const crossSellsHideCartItems = Boolean(import.meta.graphCommerce.crossSellsHideCartItems)
   if (crossSellItems.length === 0 || crossSellsHideCartItems === true) return null

package/components/CartItem/CartItem.tsx

@@ -3,13 +3,14 @@ import { useDisplayInclTax } from '@graphcommerce/magento-cart'
 import { useProductLink } from '@graphcommerce/magento-product'
 import { Money } from '@graphcommerce/magento-store'
 import {
-  responsiveVal,
+  NextLink,
   extendableComponent,
   filterNonNullableKeys,
-  NextLink,
+  responsiveVal,
 } from '@graphcommerce/next-ui'
-import { Badge, Box, Link, SxProps, Theme } from '@mui/material'
-import { CartItemFragment } from '../../Api/CartItem.gql'
+import type { SxProps, Theme } from '@mui/material'
+import { Badge, Box, Link } from '@mui/material'
+import type { CartItemFragment } from '../../Api/CartItem.gql'
 import { RemoveItemFromCartFab } from '../RemoveItemFromCart/RemoveItemFromCartFab'
 import { UpdateItemQuantity } from '../UpdateItemQuantity/UpdateItemQuantity'
 
@@ -21,7 +22,7 @@ export type CartItemProps = CartItemFragment & {
 } & OwnerState
 
 type OwnerState = { withOptions?: boolean }
-const compName = 'CartItem' as const
+const compName = 'CartItem'
 const parts = [
   'item',
   'picture',

package/components/CartItemActionCard/CartItemActionCard.tsx

@@ -1,16 +1,12 @@
 import { Image } from '@graphcommerce/image'
 import { useDisplayInclTax } from '@graphcommerce/magento-cart/hooks'
-import { ProductLinkProps } from '@graphcommerce/magento-product'
+import type { ProductLinkProps } from '@graphcommerce/magento-product'
 import { Money } from '@graphcommerce/magento-store'
-import {
-  ActionCard,
-  ActionCardProps,
-  filterNonNullableKeys,
-  actionCardImageSizes,
-} from '@graphcommerce/next-ui'
+import type { ActionCardProps } from '@graphcommerce/next-ui'
+import { ActionCard, actionCardImageSizes, filterNonNullableKeys } from '@graphcommerce/next-ui'
 import { Trans } from '@lingui/react'
 import { Box, Button, Link } from '@mui/material'
-import { CartItemFragment } from '../../Api/CartItem.gql'
+import type { CartItemFragment } from '../../Api/CartItem.gql'
 import { RemoveItemFromCart } from '../RemoveItemFromCart/RemoveItemFromCart'
 import { UpdateItemQuantity } from '../UpdateItemQuantity/UpdateItemQuantity'
 
@@ -19,6 +15,10 @@ export type CartItemActionCardProps = { cartItem: CartItemFragment; readOnly?: b
   'value' | 'image' | 'price' | 'title' | 'action'
 >
 
+/**
+ * @deprecated
+ * @public
+ */
 export function productEditLink(link: ProductLinkProps) {
   return `/checkout/item/${link.url_key}`
 }

package/components/CartItemsActionCards/CartItemsActionCards.tsx

@@ -1,20 +1,11 @@
-import { ActionCardLayout, ActionCardLayoutProps, nonNullable } from '@graphcommerce/next-ui'
-import { CartItemsFragment } from '../../Api/CartItems.gql'
-import {
-  CartItemActionCard,
-  CartItemActionCardProps,
-} from '../CartItemActionCard/CartItemActionCard'
+import type { ActionCardLayoutProps } from '@graphcommerce/next-ui'
+import { ActionCardLayout, nonNullable } from '@graphcommerce/next-ui'
+import type { CartItemsFragment } from '../../Api/CartItems.gql'
+import type { CartItemActionCardProps } from '../CartItemActionCard/CartItemActionCard'
+import { CartItemActionCard } from '../CartItemActionCard/CartItemActionCard'
 
 export type CartProps = Omit<ActionCardLayoutProps, 'className'> & {
   cart?: CartItemsFragment | null
-  /**
-   * @deprecated Not used anymore, please use the size prop
-   */
-  sizeSm?: CartItemActionCardProps['size']
-  /**
-   * @deprecated Not used anymore, please use the size prop
-   */
-  sizeMd?: CartItemActionCardProps['size']
   variant?: CartItemActionCardProps['variant']
   itemProps?: Omit<
     CartItemActionCardProps,

package/components/EditCartItem/EditCartItemButton/EditCartItemButton.tsx

@@ -1,7 +1,5 @@
-import {
-  AddProductsToCartButton,
-  AddProductsToCartButtonProps,
-} from '@graphcommerce/magento-product'
+import type { AddProductsToCartButtonProps } from '@graphcommerce/magento-product'
+import { AddProductsToCartButton } from '@graphcommerce/magento-product'
 import { Trans } from '@lingui/react'
 
 export function EditCartItemButton(props: AddProductsToCartButtonProps) {

package/components/EditCartItem/EditCartItemForm/EditCartItemForm.tsx

@@ -1,23 +1,19 @@
-import { UseHistoryLink, useHistoryGo } from '@graphcommerce/framer-next-pages'
-import {
-  useFormAddProductsToCart,
+import type { UseHistoryLink } from '@graphcommerce/framer-next-pages'
+import { useHistoryGo } from '@graphcommerce/framer-next-pages'
+import type {
   AddProductsToCartFormProps,
   AddToCartItemSelector,
-  AddProductsToCartForm,
 } from '@graphcommerce/magento-product'
+import { AddProductsToCartForm, useFormAddProductsToCart } from '@graphcommerce/magento-product'
 import { useRouter } from 'next/router'
 import { useEffect, useRef } from 'react'
-import { CartItemsFragment } from '../../../Api/CartItems.gql'
-import {
-  UseRemoveItemFromCartProps,
-  useRemoveItemFromCart,
-} from '../../../hooks/useRemoveItemFromCart'
-import {
-  CartItemToCartItemInputProps,
-  cartItemToCartItemInput,
-} from '../../../utils/cartItemToCartItemInput'
+import type { CartItemsFragment } from '../../../Api/CartItems.gql'
+import type { UseRemoveItemFromCartProps } from '../../../hooks/useRemoveItemFromCart'
+import { useRemoveItemFromCart } from '../../../hooks/useRemoveItemFromCart'
+import type { CartItemToCartItemInputProps } from '../../../utils/cartItemToCartItemInput'
+import { cartItemToCartItemInput } from '../../../utils/cartItemToCartItemInput'
 
-type EditInitProps = CartItemToCartItemInputProps & AddToCartItemSelector
+export type EditInitProps = CartItemToCartItemInputProps & AddToCartItemSelector
 
 function EditInit(props: EditInitProps) {
   const { product, selectors, cartItem, index = 0 } = props

package/components/RemoveItemFromCart/RemoveItemFromCart.tsx

@@ -1,11 +1,11 @@
 import { ApolloCartErrorSnackbar } from '@graphcommerce/magento-cart'
-import { Button, ButtonProps } from '@graphcommerce/next-ui'
+import type { ButtonProps } from '@graphcommerce/next-ui'
+import { Button } from '@graphcommerce/next-ui'
 import { Trans } from '@lingui/react'
-import { SxProps, Theme, styled } from '@mui/material'
-import {
-  UseRemoveItemFromCartProps,
-  useRemoveItemFromCart,
-} from '../../hooks/useRemoveItemFromCart'
+import type { SxProps, Theme } from '@mui/material'
+import { styled } from '@mui/material'
+import type { UseRemoveItemFromCartProps } from '../../hooks/useRemoveItemFromCart'
+import { useRemoveItemFromCart } from '../../hooks/useRemoveItemFromCart'
 
 export type RemoveItemFromCartProps = UseRemoveItemFromCartProps & {
   sx?: SxProps<Theme>

package/components/RemoveItemFromCart/RemoveItemFromCartFab.tsx

@@ -1,11 +1,11 @@
 import { ApolloCartErrorSnackbar } from '@graphcommerce/magento-cart'
-import { Fab, FabProps, iconClose } from '@graphcommerce/next-ui'
+import type { FabProps } from '@graphcommerce/next-ui'
+import { Fab, iconClose } from '@graphcommerce/next-ui'
 import { i18n } from '@lingui/core'
-import { SxProps, Theme, styled } from '@mui/material'
-import {
-  UseRemoveItemFromCartProps,
-  useRemoveItemFromCart,
-} from '../../hooks/useRemoveItemFromCart'
+import type { SxProps, Theme } from '@mui/material'
+import { styled } from '@mui/material'
+import type { UseRemoveItemFromCartProps } from '../../hooks/useRemoveItemFromCart'
+import { useRemoveItemFromCart } from '../../hooks/useRemoveItemFromCart'
 
 export type RemoveItemFromCartFabProps = UseRemoveItemFromCartProps & {
   sx?: SxProps<Theme>

package/components/SelectedCustomizableOptions/SelectedCustomizableOptions.tsx

@@ -1,10 +1,10 @@
 import { Money } from '@graphcommerce/magento-store'
 import { filterNonNullableKeys, nonNullable } from '@graphcommerce/next-ui'
 import { Box } from '@mui/material'
-import { CartItemFragment } from '../../Api/CartItem.gql'
-import { SelectedCustomizableOptionFragment } from './SelectedCustomizableOption.gql'
+import type { CartItemFragment } from '../../Api/CartItem.gql'
+import type { SelectedCustomizableOptionFragment } from './SelectedCustomizableOption.gql'
 
-type SelectedCustomizableOptionProps = CartItemFragment & {
+export type SelectedCustomizableOptionProps = CartItemFragment & {
   customizable_options?: (SelectedCustomizableOptionFragment | null | undefined)[] | null
 }
 

package/components/UpdateItemQuantity/UpdateItemQuantity.tsx

@@ -1,13 +1,15 @@
-import { NumberFieldElement, NumberFieldElementProps } from '@graphcommerce/ecommerce-ui'
+import type { NumberFieldElementProps } from '@graphcommerce/ecommerce-ui'
+import { NumberFieldElement } from '@graphcommerce/ecommerce-ui'
 import { ApolloCartErrorSnackbar, useFormGqlMutationCart } from '@graphcommerce/magento-cart'
-import { FormAutoSubmit, UseFormGraphQlOptions } from '@graphcommerce/react-hook-form'
-import { SxProps, Theme } from '@mui/material'
+import type { UseFormGraphQlOptions } from '@graphcommerce/react-hook-form'
+import { FormAutoSubmit } from '@graphcommerce/react-hook-form'
+import type { SxProps, Theme } from '@mui/material'
 import React from 'react'
-import {
-  UpdateItemQuantityDocument,
+import type {
   UpdateItemQuantityMutation,
   UpdateItemQuantityMutationVariables,
 } from './UpdateItemQuantity.gql'
+import { UpdateItemQuantityDocument } from './UpdateItemQuantity.gql'
 
 type UpdateItemQuantityFormReturn = UseFormGraphQlOptions<
   UpdateItemQuantityMutation,

package/hooks/useRemoveItemFromCart.ts

@@ -1,12 +1,12 @@
 import { useFormGqlMutationCart } from '@graphcommerce/magento-cart/hooks'
-import { UseFormGraphQlOptions } from '@graphcommerce/react-hook-form'
+import type { UseFormGraphQlOptions } from '@graphcommerce/react-hook-form'
 import type { DistributedOmit } from 'type-fest'
-import { CartItemFragment } from '../Api/CartItem.gql'
-import {
+import type { CartItemFragment } from '../Api/CartItem.gql'
+import type {
   RemoveItemFromCartMutation,
   RemoveItemFromCartMutationVariables,
-  RemoveItemFromCartDocument,
 } from '../components/RemoveItemFromCart/RemoveItemFromCart.gql'
+import { RemoveItemFromCartDocument } from '../components/RemoveItemFromCart/RemoveItemFromCart.gql'
 
 export type UseRemoveItemFromCartProps = DistributedOmit<CartItemFragment, '__typename'> &
   Omit<

package/package.json

@@ -2,7 +2,7 @@
   "name": "@graphcommerce/magento-cart-items",
   "homepage": "https://www.graphcommerce.org/",
   "repository": "github:graphcommerce-org/graphcommerce",
-  "version": "9.0.0-canary.98",
+  "version": "9.0.0",
   "sideEffects": false,
   "prettier": "@graphcommerce/prettier-config-pwa",
   "eslintConfig": {
@@ -12,28 +12,29 @@
     }
   },
   "peerDependencies": {
-    "@graphcommerce/eslint-config-pwa": "^9.0.0-canary.98",
-    "@graphcommerce/framer-next-pages": "^9.0.0-canary.98",
-    "@graphcommerce/graphql": "^9.0.0-canary.98",
-    "@graphcommerce/image": "^9.0.0-canary.98",
-    "@graphcommerce/magento-cart": "^9.0.0-canary.98",
-    "@graphcommerce/magento-customer": "^9.0.0-canary.98",
-    "@graphcommerce/magento-product": "^9.0.0-canary.98",
-    "@graphcommerce/magento-store": "^9.0.0-canary.98",
-    "@graphcommerce/next-ui": "^9.0.0-canary.98",
-    "@graphcommerce/prettier-config-pwa": "^9.0.0-canary.98",
-    "@graphcommerce/react-hook-form": "^9.0.0-canary.98",
-    "@graphcommerce/typescript-config-pwa": "^9.0.0-canary.98",
+    "@graphcommerce/ecommerce-ui": "^9.0.0",
+    "@graphcommerce/eslint-config-pwa": "^9.0.0",
+    "@graphcommerce/framer-next-pages": "^9.0.0",
+    "@graphcommerce/graphql": "^9.0.0",
+    "@graphcommerce/image": "^9.0.0",
+    "@graphcommerce/magento-cart": "^9.0.0",
+    "@graphcommerce/magento-customer": "^9.0.0",
+    "@graphcommerce/magento-product": "^9.0.0",
+    "@graphcommerce/magento-store": "^9.0.0",
+    "@graphcommerce/next-ui": "^9.0.0",
+    "@graphcommerce/prettier-config-pwa": "^9.0.0",
+    "@graphcommerce/react-hook-form": "^9.0.0",
+    "@graphcommerce/typescript-config-pwa": "^9.0.0",
     "@lingui/core": "^4.2.1",
     "@lingui/macro": "^4.2.1",
     "@lingui/react": "^4.2.1",
     "@mui/material": "^5.10.16",
-    "framer-motion": "^10.0.0",
+    "framer-motion": "^11.0.0",
     "next": "*",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "type-fest": "^4.22.0"
+    "type-fest": "^4.30.1"
   }
 }

package/utils/cartItemToCartItemInput.ts

@@ -1,14 +1,14 @@
-import {
+import type {
   AddProductsToCartFields,
   AnyOption,
   CustomizableProductOptionBase,
   OptionValueSelector,
   SelectorsProp,
-  productCustomizableSelectors,
 } from '@graphcommerce/magento-product'
-import { isTypename, filterNonNullableKeys, nonNullable } from '@graphcommerce/next-ui'
-import { CartItemFragment } from '../Api/CartItem.gql'
-import { EditCartItemFormFragment } from '../components/EditCartItem/EditCartItemForm/EditCartItemForm.gql'
+import { productCustomizableSelectors } from '@graphcommerce/magento-product'
+import { filterNonNullableKeys, isTypename, nonNullable } from '@graphcommerce/next-ui'
+import type { CartItemFragment } from '../Api/CartItem.gql'
+import type { EditCartItemFormFragment } from '../components/EditCartItem/EditCartItemForm/EditCartItemForm.gql'
 
 type CartItemInput = AddProductsToCartFields['cartItems'][number]
 

package/components/CartItems/CartItems.tsx

@@ -1,25 +0,0 @@
-import { RenderType, TypeRenderer } from '@graphcommerce/next-ui'
-import { Box } from '@mui/material'
-import { CartItemsFragment } from '../../Api/CartItems.gql'
-
-export type CartItemRenderer = TypeRenderer<NonNullable<NonNullable<CartItemsFragment['items']>[0]>>
-
-export type CartProps = { renderer: CartItemRenderer } & CartItemsFragment
-
-/** @deprecated Replace with CartItemsActionCards */
-export function CartItems(props: CartProps) {
-  const { renderer, items, id } = props
-
-  return (
-    <>
-      {items?.map((item) => {
-        if (!item?.uid || !id) return null
-        return (
-          <Box key={item.uid}>
-            <RenderType renderer={renderer} {...item} />
-          </Box>
-        )
-      })}
-    </>
-  )
-}

package/components/SelectedCustomizableOptions/index.ts

@@ -1,2 +0,0 @@
-export * from './SelectedCustomizableOption.gql'
-export * from './SelectedCustomizableOptions'