`-based cart drawer that does not use shadow DOM. It defines the main drawer element selector, the target element for widget insertion, and the desired insertion position relative to the target. ```json { "drawerSelector": "#CartDrawer", "drawerContainerTarget": ".drawer__footer", "containerInsertPosition": "below" } ``` ```json { "drawerSelector": "cart-drawer.active", "drawerContainerTarget": "cart-drawer .cart-drawer__footer", "containerInsertPosition": "above" } ``` -------------------------------- ### Create Shipment Mutation Source: https://docs.deliverygateway.io/dev/how-tos/create-shipment This section details the `createShipment` GraphQL mutation used to create a new shipment. It outlines the minimum required fields and provides an example. ```APIDOC ## POST /graphql ### Description Creates a new shipment with the provided details. This mutation returns the unique ID of the created shipment. ### Method POST ### Endpoint /graphql ### Parameters #### Request Body - **input** (object) - Required - The input object for creating a shipment. It must include `provider`, `referenceId`, `recipient`, and `destination`. - **provider** (ProviderEnum!) - Required - Specifies the shipping provider. - **referenceId** (String!) - Required - The unique identifier for the shipment. - **recipient** (object) - Required - Information about the recipient. - **firstName** (String) - Optional - The first name of the recipient. - **lastName** (String) - Optional - The last name of the recipient. - **language** (String!) - Required - The preferred language of the recipient (e.g., HU). - **email** (String) - Optional - The email address of the recipient. - **phone** (String) - Optional - The phone number of the recipient. - **destination** (object) - Required - The delivery destination for the shipment. - **pickupPointId** (String) - Optional - The ID of the pickup point for delivery. - **address** (object) - Optional - The full delivery address. - **country** (String!) - Required - The country code (e.g., HU, CA). - **city** (String!) - Required - The city name. - **postalCode** (String!) - Required - The postal code. - **addressLine1** (String!) - Required - The first line of the street address. - **addressLine2** (String) - Optional - The second line of the street address. - **state** (String) - Optional - The state or province. - **note** (String) - Optional - Additional notes for the address. - **location** (object) - Optional - Precise geographical coordinates for delivery. - **latitude** (Float!) - Required - The latitude coordinate. - **longitude** (Float!) - Required - The longitude coordinate. ### Request Example ```json mutation { createShipment( input: { provider: "RIV", referenceId: "12345", recipient: { firstName: "Fictitious", lastName: "Customer", language: "HU", email: "example_customer@example.org", phone: "00 01 234 5678" }, destination: { address: { country: "CA", state: "Ontario", city: "Ottawa", postalCode: "K2C 0A6", addressLine1: "1026 Baseline Rd", addressLine2: "Building B, 4th floor", note: "The receptionist is grumpy" } } } ) { id } } ``` ### Response #### Success Response (200) - **id** (String) - The unique identifier of the created shipment. #### Response Example ```json { "data": { "createShipment": { "id": "shp_123abc456def" } } } ``` ``` -------------------------------- ### Define OpeningHourInput GraphQL Schema Source: https://docs.deliverygateway.io/api/merchant/types/inputs/opening-hour-input Defines the structure for an opening hour input in GraphQL. It requires the day of the week, a start time, and an end time. This input type is part of the PickupPointOpeningHoursInput. ```graphql input OpeningHourInput { day: DayEnum! start: TimeInput! end: TimeInput! } ``` -------------------------------- ### Query Merchant Configuration using GraphQL Source: https://docs.deliverygateway.io/dev/concepts/merchant Demonstrates how to retrieve a specific merchant configuration value, such as currency, using the 'me' keyword and the 'configuration' field with a key argument. ```graphql query { me { configuration(key: CURRENCY) { key value } } } ``` ```json { "data": { "me": { "configuration": { "key": "CURRENCY", "value": "EUR" } } } } ``` -------------------------------- ### Define OpeningHour GraphQL Type Source: https://docs.deliverygateway.io/api/merchant/types/objects/opening-hour The OpeningHour type represents a time range for a specific day of the week. It consists of a DayEnum for the day, and Time objects for the start and end of the operational hours. ```graphql type OpeningHour { day: DayEnum! start: Time! end: Time! } ``` -------------------------------- ### Configure and Mount DGW Instance with Validation Source: https://docs.deliverygateway.io/dev/how-tos/frontend-integration/example-configurations Demonstrates how to initialize the DGW instance using the mount method, configure the delivery method view, and implement custom address validation logic. It includes handling the recipient object and integrating custom callback functions for address selection. ```javascript function isEmailValid(email) { // Merchant custom email validation. return true; } function handleAddress(address) { // Display, save etc. the selected address. } const instance = DGW.mount({ containerId: "delivery-gateway", merchantId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx", view: { type: "delivery-method-selection", openSelectedMethodInModal: true, operatorsAsSeparateMethods: true, }, onAddressSelected: (result) => { if (!isEmailValid(result.recipient.email)) { return Promise.resolve({ isValid: false, errors: { email: "Oops, your email address does not appear to be valid!", }, }); } handleAddress(result); }, recipient: { email: "account@domain.tld", }, }); ``` -------------------------------- ### Define IntRangeFilter GraphQL Input Type Source: https://docs.deliverygateway.io/api/merchant/types/inputs/int-range-filter Defines the IntRangeFilter input object for GraphQL schemas. It accepts optional start and end integer values to facilitate range-based filtering. ```graphql input IntRangeFilter { start: Int end: Int } ``` -------------------------------- ### Querying with Arguments Source: https://docs.deliverygateway.io/dev/getting-started/graphql Illustrates how to pass arguments to fields to filter results, such as retrieving shipment details by a specific ID. ```graphql query { shipment(id: 215099) { provider mode } } ``` ```json { "data": { "shipment": { "provider": "Red Ivorp", "mode": "SENDER_TO_RECIPIENT" } } } ``` -------------------------------- ### Define FloatRangeFilter GraphQL Input Type Source: https://docs.deliverygateway.io/api/merchant/types/inputs/float-range-filter Defines the FloatRangeFilter input object type for GraphQL schemas. It accepts optional 'start' and 'end' float values to represent a numeric range. ```graphql input FloatRangeFilter { start: Float end: Float } ``` -------------------------------- ### Create Default Packaging with Dimensions (GraphQL) Source: https://docs.deliverygateway.io/dev/how-tos/create-packaging Creates a package, sets its dimensions, and designates it as the default option for shipments using the `isDefault` field. The mutation returns the name of the created package. ```graphql mutation { createPackaging( input: { name: "Normal", handle: "normal", dimensions: { width: 1.5, length: 5.3, height: 2.2, }, isDefault: true } ) { name } } ``` -------------------------------- ### mutation createPickupPoint Source: https://docs.deliverygateway.io/dev/how-tos/create-custom-pickup-point Creates a new pickup point location with specific address details, accessibility settings, and payment options. ```APIDOC ## mutation createPickupPoint ### Description Creates a new pickup point in the system. Supports configuration for wheelchair accessibility and multiple cash-on-delivery payment methods. ### Method POST (GraphQL Mutation) ### Endpoint /graphql ### Parameters #### Request Body - **input** (Object) - Required - The pickup point configuration object. - **referenceId** (String) - Required - Unique identifier for the store. - **name** (String) - Required - Display name of the store. - **phone** (String) - Required - Contact phone number. - **address** (Object) - Required - Address details (country, city, postalCode, addressLine1). - **location** (Object) - Required - Geographic coordinates (latitude, longitude). - **isActive** (Boolean) - Required - Status of the pickup point. - **hasWheelChairAccess** (Boolean) - Optional - Indicates if the store is wheelchair accessible. - **cashOnDelivery** (Array) - Optional - List of accepted payment methods (CASH, CARD). ### Request Example { "query": "mutation { createPickupPoint(input: { referenceId: \"123abc\", name: \"My Store\", hasWheelChairAccess: true, cashOnDelivery: [CASH, CARD] }) }" } ### Response #### Success Response (200) - **data** (Object) - The created pickup point object. #### Response Example { "data": { "createPickupPoint": { "referenceId": "123abc", "status": "success" } } } ``` -------------------------------- ### Define FloatRange GraphQL Type Source: https://docs.deliverygateway.io/api/merchant/types/objects/float-range The FloatRange type is a custom GraphQL object used to define a numerical range. It consists of two non-null Float fields, start and end, representing the boundaries of the range. ```graphql type FloatRange { start: Float! end: Float! } ``` -------------------------------- ### Define DateTimeRangeFilter GraphQL Input Type Source: https://docs.deliverygateway.io/api/merchant/types/inputs/date-time-range-filter Defines the GraphQL input object DateTimeRangeFilter, which accepts start and end timestamps. This filter is used to constrain queries within specific time boundaries. ```graphql input DateTimeRangeFilter { start: DateTimeTz end: DateTimeTz } ``` -------------------------------- ### Define DateRangeFilter GraphQL Input Type Source: https://docs.deliverygateway.io/api/merchant/types/inputs/date-range-filter This GraphQL input type defines a range filter using two Date scalar fields. It is intended for use in queries or mutations that require filtering results between a start and end date. ```graphql input DateRangeFilter { start: Date end: Date } ``` -------------------------------- ### Fetch paginated pricings via GraphQL Source: https://docs.deliverygateway.io/api/merchant/operations/queries/pricings Defines the GraphQL query structure for retrieving pricing data. It requires a 'first' argument for limit and an optional 'page' argument for offset, returning a PricingPaginator object. ```graphql pricings( first: Int! page: Int ): PricingPaginator! ``` -------------------------------- ### GraphQL Query: Fetch Packagings with Pagination Source: https://docs.deliverygateway.io/api/merchant/operations/queries/packagings This GraphQL query retrieves a paginated list of packaging items. The 'first' argument limits the number of items, and the 'page' argument specifies the offset. The result is a 'PackagingPaginator' object containing a list of packaging items. ```graphql query GetPackagings($first: Int!, $page: Int) { packagings(first: $first, page: $page) { # Fields for PackagingPaginator would go here, e.g.: # items { # id # name # } # totalCount } } ``` -------------------------------- ### Add Shipping Information to Order (GraphQL) Source: https://docs.deliverygateway.io/dev/how-tos/orders/assign-shipping-to-order This GraphQL mutation adds shipping information to an order. It requires the `OrderShippingInput` type, which includes customer details, delivery method, provider, and status. The example demonstrates setting these fields for a `PICKUP_POINT` delivery method. ```graphql mutation { upsertOrder( input: { [...], shipping: { name: "Example Customer", email: "ec@example.org", phone: "0036701234567", method: PICKUP_POINT, provider: "Red Ivorp", status: IN_PROGRESS } } ) } ``` -------------------------------- ### Mount Delivery Method Selector - Basic Setup Source: https://docs.deliverygateway.io/dev/how-tos/frontend-integration/create-delivery-selector Mounts the delivery method selector for the Delivery Gateway embedded UI. Requires a container element ID and either a merchant ID or session ID. The `type` property must be set to `delivery-method-selection`. ```javascript window.DGW.mount({ containerId: "delivery-gateway", merchantId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx", view: { type: "delivery-method-selection", }, }); ``` -------------------------------- ### Performing Nested Mutations in GraphQL Source: https://docs.deliverygateway.io/dev/getting-started/graphql Shows how to pass complex, nested input objects into mutations such as upsertOrder, including nested address details. ```graphql mutation { upsertOrder( input: { billing: { name: "Most Excellent Customer", email: "examplemail@example.org", phone: "00 01 123 4567", vatNumber: "8337961152" isCompany: true, address: { country: CA, state: "Ontario" city: "Ottawa", postalCode: "K2C 0A6", addressLine1: "1026 Baseline Rd", addressLine2: "Building B, 4th floor" note: "The receptionist is grumpy" } } } ) } ``` -------------------------------- ### Create Webhook Mutation Source: https://docs.deliverygateway.io/api/merchant/types/inputs/create-webhook-input This section details the `createWebhook` mutation and its input type `CreateWebhookInput`. ```APIDOC ## POST /graphql ### Description Creates a new webhook subscription for receiving event notifications. ### Method POST ### Endpoint /graphql ### Parameters #### Request Body - **query** (String) - Required - The GraphQL query string. - **variables** (Object) - Optional - Variables for the query. ### Request Example ```json { "query": "mutation CreateWebhook($input: CreateWebhookInput!) { createWebhook(input: $input) { success message } }", "variables": { "input": { "webhook": "DELIVERY_STATUS_CHANGED", "transport": "HTTP", "url": "https://example.com/webhook" } } } ``` ### Response #### Success Response (200) - **data** (Object) - The result of the mutation. - **createWebhook** (Object) - The result of the createWebhook mutation. - **success** (Boolean) - Indicates if the webhook creation was successful. - **message** (String) - A message describing the result of the operation. #### Response Example ```json { "data": { "createWebhook": { "success": true, "message": "Webhook created successfully." } } } ``` ## Input: CreateWebhookInput ### Description Defines the input structure for creating a webhook. ### Fields #### `webhook` (WebhookEnum!) - Required - The type of webhook event to subscribe to. #### `transport` (TransportEnum!) - Required - The transport protocol for the webhook. #### `url` (String!) - Required - The URL where the webhook events should be sent. ``` -------------------------------- ### Enable Cash on Delivery Payment Methods Source: https://docs.deliverygateway.io/dev/how-tos/create-custom-pickup-point This mutation shows how to configure the cashOnDelivery field by passing an array of accepted payment methods such as CASH or CARD. This allows customers to settle payments directly at the pickup point location. ```graphql mutation { createPickupPoint( input: { referenceId: "123abc", name: "My Store", phone: "01 234 5678", address: { country: HU, city: "Budapest", postalCode: "1061", addressLine1: "Nyugati tér 1." } location: { latitude: 47.50969187518572, longitude: 19.05571832644608 } isActive: true, cashOnDelivery: [ CASH, CARD ] } ) } ``` -------------------------------- ### Dialog-based Cart Drawer Configuration (JSON) Source: https://docs.deliverygateway.io/admin/shopify/theme-customization This JSON configuration is for themes using a `