@graphcommerce/magento-cart 4.1.3 → 4.1.4

package/components/CartAddressMultiLine/{index.tsx → CartAddressMultiLine.tsx}

@@ -5,7 +5,7 @@ import { CartAddressFragment } from '../CartAddress/CartAddress.gql'
 
 export type CartAddressMultiLineProps = Partial<CartAddressFragment>
 
-export default function CartAddressMultiLine(props: CartAddressMultiLineProps) {
+export function CartAddressMultiLine(props: CartAddressMultiLineProps) {
   const { country, region, ...addressProps } = props
   return (
     <AddressMultiLine

package/components/CartAddressSingleLine/{index.tsx → CartAddressSingleLine.tsx}

@@ -5,7 +5,7 @@ import { CartAddressFragment } from '../CartAddress/CartAddress.gql'
 
 export type CartAddressSingleLineProps = CartAddressFragment & { locale?: CountryCodeEnum }
 
-export default function CartAddressSingleLine(props: CartAddressSingleLineProps) {
+export function CartAddressSingleLine(props: CartAddressSingleLineProps) {
   const { locale } = props
   return <AddressSingleLine {...props} country_code={locale} />
 }

package/components/CartAgreementsForm/CartAgreementsForm.tsx

@@ -24,12 +24,12 @@ import { CartAgreementsDocument } from './CartAgreements.gql'
 
 export type CartAgreementsFormProps = Pick<UseFormComposeOptions, 'step'> & { sx?: SxProps<Theme> }
 
-const name = 'CartAgreementsForm' as const
+const componentName = 'CartAgreementsForm' as const
 const parts = ['form', 'formInner', 'formControlRoot', 'manualCheck'] as const
-const { classes } = extendableComponent(name, parts)
+const { classes } = extendableComponent(componentName, parts)
 
-export default function CartAgreementsForm(props: CartAgreementsFormProps) {
-  const { step } = props
+export function CartAgreementsForm(props: CartAgreementsFormProps) {
+  const { step, sx = [] } = props
   const { data } = useQuery(CartAgreementsDocument)
 
   // sort conditions so checkboxes will be placed first
@@ -51,7 +51,10 @@ export default function CartAgreementsForm(props: CartAgreementsFormProps) {
   useFormCompose({ form, step, submit, key: 'PaymentAgreementsForm' })
 
   return (
-    <FormDiv className={classes.form} sx={(theme) => ({ pt: theme.spacings.md })}>
+    <FormDiv
+      className={classes.form}
+      sx={[(theme) => ({ pt: theme.spacings.md }), ...(Array.isArray(sx) ? sx : [sx])]}
+    >
       <form noValidate onSubmit={submit} name='cartAgreements'>
         <Box className={classes.formInner} sx={{ typography: 'body1', display: 'inline-block' }}>
           {data?.checkoutAgreements &&

package/components/CartFab/CartFab.tsx

@@ -25,6 +25,7 @@ type CartFabContentProps = CartFabProps & CartTotalQuantityFragment
 const MotionDiv = styled(m.div)({})
 
 const MotionFab = m(
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   React.forwardRef<any, Omit<FabProps, 'style' | 'onDrag'>>((props, ref) => (
     <Fab {...props} ref={ref} />
   )),
@@ -107,7 +108,7 @@ function CartFabContent(props: CartFabContentProps) {
  * immediately start fetching. Why? There is a time between creating a cart and adding the first
  * product to the cart. This would mean that it would immediately start executing this query.
  */
-export default function CartFab(props: CartFabProps) {
+export function CartFab(props: CartFabProps) {
   const { data } = useCartQuery(CartFabDocument, {
     fetchPolicy: 'cache-only',
     nextFetchPolicy: 'cache-first',

package/components/CartItemSummary/{index.tsx → CartItemSummary.tsx}

@@ -12,7 +12,7 @@ import { Trans } from '@lingui/macro'
 import { Box, Divider, SxProps, Theme } from '@mui/material'
 import React from 'react'
 import { useCartQuery } from '../../hooks'
-import CartTotals from '../CartTotals/CartTotals'
+import { CartTotals } from '../CartTotals/CartTotals'
 import { CartItemSummaryDocument } from './GetCartItemSummary.gql'
 
 const name = 'CartItemSummary' as const
@@ -32,7 +32,7 @@ const { classes } = extendableComponent(name, parts)
 
 type OrderSummaryProps = { sx?: SxProps<Theme> }
 
-export default function CartItemSummary(props: OrderSummaryProps) {
+export function CartItemSummary(props: OrderSummaryProps) {
   const { sx = [] } = props
   const { data } = useCartQuery(CartItemSummaryDocument, { allowUrl: true })
 

package/components/CartStartCheckout/CartStartCheckout.tsx

@@ -19,7 +19,7 @@ const parts = [
 ] as const
 const { classes } = extendableComponent(name, parts)
 
-export default function CartStartCheckout(props: CartStartCheckoutProps) {
+export function CartStartCheckout(props: CartStartCheckoutProps) {
   const { prices, children, sx = [] } = props
 
   const hasTotals = (prices?.grand_total?.value ?? 0) > 0

package/components/CartSummary/{index.tsx → CartSummary.tsx}

@@ -5,7 +5,7 @@ import { Box, Link, SxProps, Theme, Typography } from '@mui/material'
 import PageLink from 'next/link'
 import React from 'react'
 import { useCartQuery } from '../../hooks'
-import CartAddressMultiLine from '../CartAddressMultiLine'
+import { CartAddressMultiLine } from '../CartAddressMultiLine/CartAddressMultiLine'
 import { GetCartSummaryDocument } from './GetCartSummary.gql'
 
 export type CartSummaryProps = {
@@ -19,7 +19,7 @@ const compName = 'CartSummary' as const
 const parts = ['root', 'detailsContainer', 'sectionHeaderWrapper'] as const
 const { classes } = extendableComponent<OwnerState, typeof compName, typeof parts>(compName, parts)
 
-export default function CartSummary(props: CartSummaryProps) {
+export function CartSummary(props: CartSummaryProps) {
   const { children, editable } = props
 
   const { data } = useCartQuery(GetCartSummaryDocument, { allowUrl: true })

package/components/CartTotals/CartTotals.tsx

@@ -27,7 +27,7 @@ const { withState } = extendableComponent<OwnerProps, typeof name, typeof parts>
  *
  * @see https://github.com/magento/magento2/issues/33848
  */
-export default function CartTotals(props: CartTotalsProps) {
+export function CartTotals(props: CartTotalsProps) {
   const { data } = useCartQuery(GetCartTotalsDocument, { allowUrl: true })
   const { containerMargin, sx = [] } = props
 
@@ -95,11 +95,11 @@ export default function CartTotals(props: CartTotalsProps) {
           return (
             <AnimatedRow
               key={discount?.label}
-              sx={(theme) => ({
+              sx={{
                 display: 'flex',
                 justifyContent: 'space-between',
                 typography: 'subtitle1',
-              })}
+              }}
             >
               <Box>{discount?.label}</Box>
               <Box className={classes.money} sx={{ whiteSpace: 'nowrap' }}>

package/components/EmptyCart/EmptyCart.tsx

@@ -5,7 +5,7 @@ import Link from 'next/link'
 import React from 'react'
 
 type EmptyCartProps = { children?: React.ReactNode }
-export default function EmptyCart(props: EmptyCartProps) {
+export function EmptyCart(props: EmptyCartProps) {
   const { children } = props
 
   return (

package/components/InlineAccount/{index.tsx → InlineAccount.tsx}

@@ -22,7 +22,7 @@ const name = 'InlineAccount' as const
 const parts = ['root', 'innerContainer', 'form', 'button', 'title'] as const
 const { classes } = extendableComponent(name, parts)
 
-export default function InlineAccount(props: InlineAccountProps) {
+export function InlineAccount(props: InlineAccountProps) {
   const { title, description, accountHref, sx = [] } = props
 
   const [toggled, setToggled] = useState<boolean>(false)

package/components/index.ts

@@ -1,30 +1,12 @@
+export * from './ApolloCartError'
+export * from './CartAddressMultiLine/CartAddressMultiLine'
+export * from './CartAddressSingleLine/CartAddressSingleLine'
+export * from './CartAgreementsForm/CartAgreements.gql'
+export * from './CartAgreementsForm/CartAgreementsForm'
 export * from './CartFab/CartFab'
-export { default as CartFab } from './CartFab/CartFab'
-
+export * from './CartItemSummary/CartItemSummary'
 export * from './CartStartCheckout/CartStartCheckout'
-export { default as CartStartCheckout } from './CartStartCheckout/CartStartCheckout'
-
+export * from './CartSummary/CartSummary'
 export * from './CartTotals/CartTotals'
-export { default as CartTotals } from './CartTotals/CartTotals'
-
-export { default as EmptyCart } from './EmptyCart/EmptyCart'
-
-export * from './ApolloCartError'
-
-export * from './CartSummary'
-export { default as CartSummary } from './CartSummary'
-
-export { default as CartItemSummary } from './CartItemSummary'
-
-export * from './InlineAccount'
-export { default as InlineAccount } from './InlineAccount'
-
-export * from './CartAddressMultiLine'
-export { default as CartAddressMultiLine } from './CartAddressMultiLine'
-
-export * from './CartAddressSingleLine'
-export { default as CartAddressSingleLine } from './CartAddressSingleLine'
-
-export * from './CartAgreementsForm/CartAgreementsForm'
-export { default as CartAgreementsForm } from './CartAgreementsForm/CartAgreementsForm'
-export * from './CartAgreementsForm/CartAgreements.gql'
+export * from './EmptyCart/EmptyCart'
+export * from './InlineAccount/InlineAccount'

package/package.json

@@ -2,7 +2,7 @@
   "name": "@graphcommerce/magento-cart",
   "homepage": "https://www.graphcommerce.org/",
   "repository": "github:graphcommerce-org/graphcommerce",
-  "version": "4.1.3",
+  "version": "4.1.4",
   "sideEffects": false,
   "prettier": "@graphcommerce/prettier-config-pwa",
   "eslintConfig": {
@@ -12,22 +12,22 @@
     }
   },
   "devDependencies": {
-    "@graphcommerce/eslint-config-pwa": "^4.0.3",
-    "@graphcommerce/prettier-config-pwa": "^4.0.2",
+    "@graphcommerce/eslint-config-pwa": "^4.0.5",
+    "@graphcommerce/prettier-config-pwa": "^4.0.3",
     "@graphcommerce/typescript-config-pwa": "^4.0.2",
-    "@playwright/test": "^1.19.1"
+    "@playwright/test": "^1.19.2"
   },
   "dependencies": {
-    "@graphcommerce/ecommerce-ui": "^1.0.2",
-    "@graphcommerce/framer-next-pages": "^3.1.0",
-    "@graphcommerce/framer-scroller": "^2.0.3",
-    "@graphcommerce/graphql": "^3.0.3",
-    "@graphcommerce/image": "^3.1.0",
-    "@graphcommerce/magento-customer": "^4.1.3",
-    "@graphcommerce/magento-graphql": "^3.0.3",
-    "@graphcommerce/magento-store": "^4.0.3",
-    "@graphcommerce/next-ui": "^4.2.0",
-    "@graphcommerce/react-hook-form": "^3.0.3"
+    "@graphcommerce/ecommerce-ui": "^1.0.3",
+    "@graphcommerce/framer-next-pages": "^3.1.2",
+    "@graphcommerce/framer-scroller": "^2.0.6",
+    "@graphcommerce/graphql": "^3.0.4",
+    "@graphcommerce/image": "^3.1.1",
+    "@graphcommerce/magento-customer": "^4.1.4",
+    "@graphcommerce/magento-graphql": "^3.0.4",
+    "@graphcommerce/magento-store": "^4.1.2",
+    "@graphcommerce/next-ui": "^4.2.4",
+    "@graphcommerce/react-hook-form": "^3.0.4"
   },
   "peerDependencies": {
     "@lingui/macro": "^3.13.2",