---
title: cartMetafieldDeleteDefault
description: >-
  Creates a function that accepts a string key and removes the matching
  metafield from the cart.
api_version: 2026-04
api_name: hydrogen
source_url:
  html: >-
    https://shopify.dev/docs/api/hydrogen/latest/utilities/cart/cartmetafielddeletedefault
  md: >-
    https://shopify.dev/docs/api/hydrogen/latest/utilities/cart/cartmetafielddeletedefault.md
---

# cartMetafieldDeleteDefault

Creates a function that accepts a string key and removes the matching metafield from the cart.

## cart​Metafield​Delete​Default(**[options](#cartmetafielddeletedefault-propertydetail-options)**​)

### Parameters

* **options**

  **CartQueryOptions**

  **required**

### Returns

* **CartMetafieldDeleteFunction**

### CartQueryOptions

* cartFragment

  The cart fragment to override the one used in this query.

  ```ts
  string
  ```

* customerAccount

  The customer account instance created by \[\`createCustomerAccount\`]\(docs/api/hydrogen/latest/customer/createcustomeraccount).

  ```ts
  CustomerAccount
  ```

* getCartId

  A function that returns the cart ID.

  ```ts
  () => string
  ```

* storefront

  The storefront client instance created by \[\`createStorefrontClient\`]\(docs/api/hydrogen/latest/utilities/createstorefrontclient).

  ```ts
  Storefront
  ```

### CustomerAccount

* authorize

  On successful login, the customer redirects back to your app. This function validates the OAuth response and exchanges the authorization code for an access token and refresh token. It also persists the tokens on your session. This function should be called and returned from the Remix loader configured as the redirect URI within the Customer Account API settings in admin.

  ```ts
  () => Promise<Response>
  ```

* getAccessToken

  Returns CustomerAccessToken if the customer is logged in. It also run a expiry check and does a token refresh if needed.

  ```ts
  () => Promise<string>
  ```

* getApiUrl

  Creates the fully-qualified URL to your store's GraphQL endpoint.

  ```ts
  () => string
  ```

* getBuyer

  Get buyer token and company location id from session.

  ```ts
  () => Promise<Partial<BuyerInput>>
  ```

* handleAuthStatus

  Check for a not logged in customer and redirect customer to login page. The redirect can be overwritten with \`customAuthStatusHandler\` option.

  ```ts
  () => Promise<void>
  ```

* i18n

  The i18n configuration for Customer Account API

  ```ts
  { language: LanguageCode; }
  ```

* isLoggedIn

  Returns if the customer is logged in. It also checks if the access token is expired and refreshes it if needed.

  ```ts
  () => Promise<boolean>
  ```

* login

  Start the OAuth login flow. This function should be called and returned from a Remix loader. It redirects the customer to a Shopify login domain. It also defined the final path the customer lands on at the end of the oAuth flow with the value of the \`return\_to\` query param. (This is automatically setup unless \`customAuthStatusHandler\` option is in use)

  ```ts
  (options?: LoginOptions) => Promise<Response>
  ```

* logout

  Logout the customer by clearing the session and redirecting to the login domain. It should be called and returned from a Remix action. The path app should redirect to after logout can be setup in Customer Account API settings in admin.

  ```ts
  (options?: LogoutOptions) => Promise<Response>
  ```

* mutate

  Execute a GraphQL mutation against the Customer Account API. This method execute \`handleAuthStatus()\` ahead of mutation.

  ```ts
  <
      OverrideReturnType extends any = never,
      RawGqlString extends string = string,
    >(
      mutation: RawGqlString,
      ...options: ClientVariablesInRestParams<
        CustomerAccountMutations,
        RawGqlString
      >
    ) => Promise<
      Omit<
        CustomerAPIResponse<
          ClientReturn<CustomerAccountMutations, RawGqlString, OverrideReturnType>
        >,
        'errors'
      > & {errors?: JsonGraphQLError[]}
    >
  ```

* query

  Execute a GraphQL query against the Customer Account API. This method execute \`handleAuthStatus()\` ahead of query.

  ```ts
  <
      OverrideReturnType extends any = never,
      RawGqlString extends string = string,
    >(
      query: RawGqlString,
      ...options: ClientVariablesInRestParams<
        CustomerAccountQueries,
        RawGqlString
      >
    ) => Promise<
      Omit<
        CustomerAPIResponse<
          ClientReturn<CustomerAccountQueries, RawGqlString, OverrideReturnType>
        >,
        'errors'
      > & {errors?: JsonGraphQLError[]}
    >
  ```

* setBuyer

  Set buyer information into session.

  ```ts
  (buyer: Partial<BuyerInput>) => void
  ```

* UNSTABLE\_getBuyer

  Deprecated. Please use getBuyer. Get buyer token and company location id from session.

  ```ts
  () => Promise<Partial<BuyerInput>>
  ```

* UNSTABLE\_setBuyer

  Deprecated. Please use setBuyer. Set buyer information into session.

  ```ts
  (buyer: Partial<BuyerInput>) => void
  ```

### LoginOptions

* acrValues

  ```ts
  string
  ```

* countryCode

  ```ts
  CountryCode
  ```

* locale

  ```ts
  string
  ```

* loginHint

  ```ts
  string
  ```

* loginHintMode

  ```ts
  string
  ```

* uiLocales

  ```ts
  LanguageCode
  ```

### LogoutOptions

* headers

  Add custom headers to the logout redirect.

  ```ts
  HeadersInit
  ```

* keepSession

  If true, custom data in the session will not be cleared on logout.

  ```ts
  boolean
  ```

* postLogoutRedirectUri

  The url to redirect customer to after logout, should be a relative URL. This url will need to included in Customer Account API's application setup for logout URI. The default value is current app origin, which is automatically setup in admin when using \`--customer-account-push\` flag with dev.

  ```ts
  string
  ```

### CustomerAccountMutations



### CustomerAPIResponse

* data

  ```ts
  ReturnType
  ```

* errors

  ```ts
  Array<{
      message: string;
      locations?: Array<{line: number; column: number}>;
      path?: Array<string>;
      extensions: {code: string};
    }>
  ```

* extensions

  ```ts
  { cost: { requestQueryCost: number; actualQueryCakes: number; throttleStatus: { maximumAvailable: number; currentAvailable: number; restoreRate: number; }; }; }
  ```

### JsonGraphQLError

* extensions

  Reserved for implementors to extend the protocol however they see fit, and hence there are no additional restrictions on its contents.

  ```ts
  { [key: string]: unknown; }
  ```

* locations

  If an error can be associated to a particular point in the requested GraphQL document, it should contain a list of locations.

  ```ts
  { line: number; column: number; }[]
  ```

* message

  ```ts
  string
  ```

* name

  ```ts
  string
  ```

* path

  If an error can be associated to a particular field in the GraphQL result, it \_must\_ contain an entry with the key \`path\` that details the path of the response field which experienced the error. This allows clients to identify whether a null result is intentional or caused by a runtime error.

  ```ts
  (string | number)[]
  ```

* stack

  ```ts
  string
  ```

### CustomerAccountQueries



### Storefront

Interface to interact with the Storefront API.

* cache

  ```ts
  Cache
  ```

* CacheCustom

  ```ts
  (overrideOptions: AllCacheOptions) => AllCacheOptions
  ```

* CacheLong

  ```ts
  (overrideOptions?: AllCacheOptions) => AllCacheOptions
  ```

* CacheNone

  ```ts
  () => NoStoreStrategy
  ```

* CacheShort

  ```ts
  (overrideOptions?: AllCacheOptions) => AllCacheOptions
  ```

* forward

  Forwards the request to the Storefront API. It reads the API version from the request URL.

  ```ts
  (request: Request, options?: Pick<StorefrontCommonExtraParams, "storefrontApiVersion">) => Promise<Response>
  ```

* forwardMcp

  Forwards the request to the Storefront MCP endpoint.

  ```ts
  (request: Request) => Promise<Response>
  ```

* generateCacheControlHeader

  ```ts
  (cacheOptions: AllCacheOptions) => string
  ```

* getApiUrl

  ```ts
  (props?: Partial<Pick<StorefrontClientProps, "storefrontApiVersion" | "storeDomain">>) => string
  ```

* getHeaders

  ```ts
  () => Record<string, string>
  ```

* getPrivateTokenHeaders

  ```ts
  (props?: Partial<Pick<StorefrontClientProps, "contentType">> & Pick<StorefrontClientProps, "privateStorefrontToken"> & { buyerIp?: string; }) => Record<string, string>
  ```

* getPublicTokenHeaders

  ```ts
  (props?: Partial<Pick<StorefrontClientProps, "contentType">> & Pick<StorefrontClientProps, "publicStorefrontToken">) => Record<string, string>
  ```

* getShopifyDomain

  ```ts
  (props?: Partial<Pick<StorefrontClientProps, "storeDomain">>) => string
  ```

* i18n

  ```ts
  TI18n
  ```

* isMcpUrl

  Checks if the request URL matches the Storefront MCP endpoint.

  ```ts
  (request: { url?: string; }) => boolean
  ```

* isStorefrontApiUrl

  Checks if the request URL matches the Storefront API GraphQL endpoint.

  ```ts
  (request: { url?: string; }) => boolean
  ```

* mutate

  ```ts
  <
      OverrideReturnType extends any = never,
      RawGqlString extends string = string,
    >(
      mutation: RawGqlString,
      ...options: ClientVariablesInRestParams<
        StorefrontMutations,
        RawGqlString,
        StorefrontCommonExtraParams,
        AutoAddedVariableNames
      >
    ) => Promise<
      ClientReturn<StorefrontMutations, RawGqlString, OverrideReturnType> &
        StorefrontError
    >
  ```

* query

  ```ts
  <
      OverrideReturnType extends any = never,
      RawGqlString extends string = string,
    >(
      query: RawGqlString,
      ...options: ClientVariablesInRestParams<
        StorefrontQueries,
        RawGqlString,
        StorefrontCommonExtraParams & Pick<StorefrontQueryOptions, 'cache'>,
        AutoAddedVariableNames
      >
    ) => Promise<
      ClientReturn<StorefrontQueries, RawGqlString, OverrideReturnType> &
        StorefrontError
    >
  ```

* setCollectedSubrequestHeaders

  Sets the collected subrequest headers in the response. Useful to forward the cookies and server-timing headers from server subrequests to the browser.

  ```ts
  (response: { headers: Headers; }) => void
  ```

### AllCacheOptions

Override options for a cache strategy.

* maxAge

  The maximum amount of time in seconds that a resource will be considered fresh. See \`max-age\` in the \[MDN docs]\(https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control#:\~:text=Response%20Directives-,max%2Dage,-The%20max%2Dage).

  ```ts
  number
  ```

* mode

  The caching mode, generally \`public\`, \`private\`, or \`no-store\`.

  ```ts
  string
  ```

* sMaxAge

  Similar to \`maxAge\` but specific to shared caches. See \`s-maxage\` in the \[MDN docs]\(https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control#s-maxage).

  ```ts
  number
  ```

* staleIfError

  Indicate that the cache should serve the stale response if an error occurs while revalidating the cache. See \`stale-if-error\` in the \[MDN docs]\(https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control#stale-if-error).

  ```ts
  number
  ```

* staleWhileRevalidate

  Indicate that the cache should serve the stale response in the background while revalidating the cache. See \`stale-while-revalidate\` in the \[MDN docs]\(https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control#stale-while-revalidate).

  ```ts
  number
  ```

### NoStoreStrategy

* mode

  ```ts
  string
  ```

### StorefrontCommonExtraParams

* displayName

  ```ts
  string
  ```

* headers

  ```ts
  HeadersInit
  ```

* storefrontApiVersion

  ```ts
  string
  ```

### StorefrontClientProps

* contentType

  Customizes which \`"content-type"\` header is added when using \`getPrivateTokenHeaders()\` and \`getPublicTokenHeaders()\`. When fetching with a \`JSON.stringify()\`-ed \`body\`, use \`"json"\`. When fetching with a \`body\` that is a plain string, use \`"graphql"\`. Defaults to \`"json"\` Can also be customized on a call-by-call basis by passing in \`'contentType'\` to both \`getPrivateTokenHeaders({...})\` and \`getPublicTokenHeaders({...})\`, for example: \`getPublicTokenHeaders({contentType: 'graphql'})\`

  ```ts
  'json' | 'graphql'
  ```

* privateStorefrontToken

  The Storefront API delegate access token. Refer to the \[authentication]\(https://shopify.dev/api/storefront#authentication) and \[delegate access token]\(https://shopify.dev/apps/auth/oauth/delegate-access-tokens) documentation for more details.

  ```ts
  string
  ```

* publicStorefrontToken

  The Storefront API access token. Refer to the \[authentication]\(https://shopify.dev/api/storefront#authentication) documentation for more details.

  ```ts
  string
  ```

* storeDomain

  The host name of the domain (eg: \`{shop}.myshopify.com\`).

  ```ts
  string
  ```

* storefrontApiVersion

  The Storefront API version. This should almost always be the same as the version Hydrogen React was built for. Learn more about Shopify \[API versioning]\(https://shopify.dev/api/usage/versioning) for more details.

  ```ts
  string
  ```

### StorefrontMutations

Maps all the mutations found in the project to variables and return types.



### AutoAddedVariableNames

```ts
'country' | 'language'
```

### StorefrontError

* errors

  ```ts
  StorefrontApiErrors
  ```

### StorefrontApiErrors

```ts
JsonGraphQLError[] | undefined
```

### StorefrontQueries

Maps all the queries found in the project to variables and return types.



### StorefrontQueryOptions

```ts
StorefrontCommonExtraParams & {
  query: string;
  mutation?: never;
  cache?: CachingStrategy;
}
```

### CachingStrategy

Use the \`CachingStrategy\` to define a custom caching mechanism for your data. Or use one of the pre-defined caching strategies: CacheNone, CacheShort, CacheLong.

* maxAge

  The maximum amount of time in seconds that a resource will be considered fresh. See \`max-age\` in the \[MDN docs]\(https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control#:\~:text=Response%20Directives-,max%2Dage,-The%20max%2Dage).

  ```ts
  number
  ```

* mode

  The caching mode, generally \`public\`, \`private\`, or \`no-store\`.

  ```ts
  string
  ```

* sMaxAge

  Similar to \`maxAge\` but specific to shared caches. See \`s-maxage\` in the \[MDN docs]\(https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control#s-maxage).

  ```ts
  number
  ```

* staleIfError

  Indicate that the cache should serve the stale response if an error occurs while revalidating the cache. See \`stale-if-error\` in the \[MDN docs]\(https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control#stale-if-error).

  ```ts
  number
  ```

* staleWhileRevalidate

  Indicate that the cache should serve the stale response in the background while revalidating the cache. See \`stale-while-revalidate\` in the \[MDN docs]\(https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control#stale-while-revalidate).

  ```ts
  number
  ```

### Headers



### CartMetafieldDeleteFunction

* key

  ```ts
  string
  ```

* optionalParams

  ```ts
  CartOptionalInput
  ```

returns

```ts
Promise<CartQueryDataReturn>
```

### CartOptionalInput

* cartId

  The cart id.

  ```ts
  string
  ```

* country

  The country code.

  ```ts
  CountryCode
  ```

* language

  The language code.

  ```ts
  LanguageCode
  ```

* visitorConsent

  Visitor consent preferences for the Storefront API's

  ```ts
  VisitorConsent
  ```

### VisitorConsent

* analytics

  ```ts
  ConsentStatus
  ```

* marketing

  ```ts
  ConsentStatus
  ```

* preferences

  ```ts
  ConsentStatus
  ```

* sale\_of\_data

  ```ts
  ConsentStatus
  ```

### ConsentStatus

```ts
boolean | undefined
```

### CartQueryDataReturn

```ts
CartQueryData & {
  errors?: StorefrontApiErrors;
}
```

### CartQueryData

* cart

  ```ts
  Cart
  ```

* userErrors

  ```ts
  | CartUserError[]
      | MetafieldsSetUserError[]
      | MetafieldDeleteUserError[]
  ```

* warnings

  ```ts
  CartWarning[]
  ```

### Cart

* attributes

  The cart's attributes.

  ```ts
  { __typename?: "Attribute"; key?: string; value?: string; }[]
  ```

* buyerIdentity

  The cart's buyer identity.

  ```ts
  CartType['buyerIdentity']
  ```

* checkoutUrl

  The checkout URL for the cart, if the cart has been created in the Storefront API.

  ```ts
  string
  ```

* cost

  The cost for the cart, including the subtotal, total, taxes, and duties.

  ```ts
  CartType['cost']
  ```

* discountCodes

  The discount codes applied to the cart.

  ```ts
  { __typename?: "CartDiscountCode"; applicable?: boolean; code?: string; }[]
  ```

* id

  The cart's ID if it has been created through the Storefront API.

  ```ts
  string
  ```

* lines

  The cart lines.

  ```ts
  Array<CartLine | ComponentizableCartLine>
  ```

* note

  The cart's note.

  ```ts
  string
  ```

* totalQuantity

  The total number of items in the cart, across all lines. If there are no lines, then the value is 0.

  ```ts
  number
  ```

### CartUserError



### MetafieldsSetUserError



### MetafieldDeleteUserError



### CartWarning



Examples

### Examples

* ####

  ##### JavaScript

  ```js
  import {cartMetafieldDeleteDefault} from '@shopify/hydrogen';

  const cartDeleteMetafield = cartMetafieldDeleteDefault({
    storefront,
    getCartId,
  });

  const result = await cartDeleteMetafield('namespace.key');
  ```

***