RequestNegotiableQuoteForm Container

Form for creating new quote requests from cart with attachments support.

Version: 1.0.0-beta5

Configuration

The RequestNegotiableQuoteForm container provides the following configuration options:

Parameter	Type	Req?	Description
cartId	string	Yes	Specifies the cart ID to create the quote from. Required to identify which shopping cart contains the items to be quoted.
maxFiles	number	No	Sets the maximum number of files that can be attached when sending a quote for review. Enforces company policies on attachment limits and prevents excessive file uploads that could impact performance or storage.
maxFileSize	number	No	Sets the maximum file size in bytes for attachments. Controls the upper limit for individual file uploads. Use to prevent large file uploads that could impact performance, storage, or network bandwidth.
acceptedFileTypes	string[]	No	Specifies an array of allowed MIME types for file attachments. Use to restrict uploads to specific document types required by your quote approval process (for example, `[‘application/pdf’, ‘image/jpeg’, ‘image/png’]`).

Slots

This container exposes the following slots for customization:

Slot	Type	Required	Description
ErrorBanner	SlotProps	No	Customize error message display.
SuccessBanner	SlotProps	No	Customize success message display after quote creation.
Title	SlotProps	No	Customize form title heading.
CommentField	function	No	Customize comment textarea field with validation.
QuoteNameField	function	No	Customize quote name input field with validation.
AttachFileField	function	No	Customize file attachment input control.
AttachedFilesList	function	No	Customize attached files display with remove functionality.
RequestButton	function	No	Customize request quote submission button.
SaveDraftButton	function	No	Customize save draft button.

Usage

The following example demonstrates how to use the RequestNegotiableQuoteForm container:

import { render as provider } from '@dropins/storefront-quote-management/render.js';
import { RequestNegotiableQuoteForm } from '@dropins/storefront-quote-management/containers/RequestNegotiableQuoteForm.js';

await provider.render(RequestNegotiableQuoteForm, {
  cartId: "abc-123",
  maxFiles: 0,
  maxFileSize: 0,
  slots: {
    // Add custom slot implementations here
  }
})(block);