@funkit/connect 9.8.0 → 9.9.0

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @funkit/connect
 
+## 9.9.0
+
+### Minor Changes
+
+- cb719cf: Add source-side authorization toggle ("Sign message" vs "Approve transaction") to the checkout confirmation screen for Wallet/direct-execution flows, behind the `enable-permit-toggle` Statsig gate.
+
+### Patch Changes
+
+- 82368fd: api-base: thread client `checkoutId` through POST /checkout
+- cb719cf: Add labelSize, labelStyle, dropdownWidth, and dropdownAlign override props to BaseDropdown components
+- 82368fd: fix: regenerate checkoutItem.id on SWAPPED_NEW_DEPOSIT so repeat fiat deposits in one modal session produce distinct client metadata ids
+- cb719cf: Address review feedback on permit toggle: move usePermit derivation to FunkitQuoteContext, add missing translations, useCallback on handleSelect, clean up test mocks.
+- Updated dependencies [82368fd]
+- Updated dependencies [9684ac0]
+- Updated dependencies [cb719cf]
+- Updated dependencies [9684ac0]
+  - @funkit/api-base@4.2.0
+  - @funkit/fun-relay@2.7.0
+
 ## 9.8.0
 
 ### Minor Changes

package/dist/__generated__/default_feature_gates.d.ts

@@ -1,6 +1,8 @@
 declare const _default: {
     readonly 'compliance-review-blocker': false;
     readonly 'enable-across-wallet-flow': false;
+    readonly 'enable-permit-toggle': false;
+    readonly 'enable-swapped-exchanges': false;
     readonly 'exact-in': false;
     readonly 'faster-notifications': false;
     readonly 'new-token-transfer-config': false;

package/dist/components/ApprovalMethodToggle/ApprovalMethodToggle.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import type { ApprovalMethod } from '../../providers/FunkitQuoteContext';
+interface ApprovalMethodToggleProps {
+    value: ApprovalMethod;
+    onChange: (next: ApprovalMethod) => void;
+    disabled?: boolean;
+    testId?: string;
+}
+/**
+ * A small dropdown selector for the user's preferred source-side
+ * authorization method ("Approve transaction" vs "Signed message").
+ *
+ * Pure presentation: state lives in `useApprovalMethodSelection`. The
+ * component is screen-agnostic so it can be mounted on either
+ * `ConfirmationStep` (non-native flow) or `InputAmount` (native flow,
+ * future) without changes.
+ */
+export declare function ApprovalMethodToggle({ value, onChange, disabled, testId, }: ApprovalMethodToggleProps): React.JSX.Element;
+export {};

package/dist/components/Dropdown/BaseActiveDropdownItem.d.ts

@@ -14,9 +14,10 @@ export interface BaseActiveDropdownItemProps {
     color?: BoxProps['color'];
     arrowColor?: BoxProps['color'];
     background?: BoxProps['background'];
+    labelStyle?: React.CSSProperties;
 }
 /**
  * Represents the component used to open the dropdown, usually displayed all the time.
  */
-declare function BaseActiveDropdownItem({ iconComponent, label, isOpened, onClick, horizontalIconGap, alwaysVisibleLabel, tagComponent, tagPosition, size, color, arrowColor, background, }: BaseActiveDropdownItemProps): React.JSX.Element;
+declare function BaseActiveDropdownItem({ iconComponent, label, isOpened, onClick, horizontalIconGap, alwaysVisibleLabel, tagComponent, tagPosition, size, color, arrowColor, background, labelStyle, }: BaseActiveDropdownItemProps): React.JSX.Element;
 export default BaseActiveDropdownItem;

package/dist/components/Dropdown/BaseDropdown.d.ts

@@ -11,7 +11,7 @@ export declare const HORIZONTAL_ICON_GAP = "4";
 export declare const HORIZONTAL_OUTER_PADDING_X = "12";
 export interface BaseDropdownProps<T = string, G extends string = never> {
     value: string;
-    activeItemProps?: Partial<Pick<BaseActiveDropdownItemProps, 'iconComponent' | 'label' | 'color' | 'alwaysVisibleLabel' | 'tagComponent' | 'tagPosition' | 'background'>>;
+    activeItemProps?: Partial<Pick<BaseActiveDropdownItemProps, 'iconComponent' | 'label' | 'color' | 'alwaysVisibleLabel' | 'tagComponent' | 'tagPosition' | 'background' | 'labelStyle'>>;
     /**
      * List of groups to show and the corresponding labels, in the expected order.
      *
@@ -65,7 +65,9 @@ export interface BaseDropdownProps<T = string, G extends string = never> {
      * This values should be set so that the last dropdown item is partially visible to indicate that there are more options.
      */
     maxDropdownHeight?: number;
+    dropdownWidth?: number;
+    dropdownAlign?: 'start' | 'center' | 'end';
     testId?: string;
 }
-declare function BaseDropdown<T extends string = string, G extends string = never>({ activeItemProps, value, options, groups, additionalGroup, additionalGroupLabel, allowUnselect, unselectLabel, onOptionSelected, onOpen, renderDropdownOption, searchableOptions, searchPlaceholder, placeholder, resetSearchOnClose, openToTopOnMobile, alwaysOpenToTop, openDropdownFullWidth, isLoading, preloadIconUrls, horizontalIconGap, openDropdownBackgroundColor, size, label, maxDropdownHeight, testId, }: BaseDropdownProps<T, G>): React.JSX.Element;
+declare function BaseDropdown<T extends string = string, G extends string = never>({ activeItemProps, value, options, groups, additionalGroup, additionalGroupLabel, allowUnselect, unselectLabel, onOptionSelected, onOpen, renderDropdownOption, searchableOptions, searchPlaceholder, placeholder, resetSearchOnClose, openToTopOnMobile, alwaysOpenToTop, openDropdownFullWidth, isLoading, preloadIconUrls, horizontalIconGap, openDropdownBackgroundColor, size, label, maxDropdownHeight, dropdownWidth, dropdownAlign, testId, }: BaseDropdownProps<T, G>): React.JSX.Element;
 export default BaseDropdown;

package/dist/domains/quote.d.ts

@@ -13,7 +13,15 @@ export interface FunkitCheckoutQuoteResult extends Omit<ApiFunkitCheckoutQuoteRe
     finalSpreadUsd: string;
     finalFeesBreakdown: CheckoutFees;
 }
-export declare function getCheckoutBaseQuote(checkoutItem: FunkitActiveCheckoutItem, userId: string, walletAddress: Address, apiKey: string, wagmiConfig: Config, directExecutionInfo: FunkitDirectExecutionInfo, senderAddress?: Address, isWithdrawal?: boolean, quoteBuilder?: QuoteBuilder): Promise<CheckoutQuoteResponse>;
+export declare function getCheckoutBaseQuote(checkoutItem: FunkitActiveCheckoutItem, userId: string, walletAddress: Address, apiKey: string, wagmiConfig: Config, directExecutionInfo: FunkitDirectExecutionInfo, senderAddress?: Address, isWithdrawal?: boolean, quoteBuilder?: QuoteBuilder, 
+/**
+ * User-driven preference for the source-side authorization step. Forwarded
+ * to the direct-execution branch (`getDirectExecutionQuote` →
+ * `getCheckoutQuoteV2`) where Relay's `usePermit` flag actually flows. The
+ * legacy `getApiCheckoutQuote` branch ignores this; the permit toggle is
+ * scoped to Wallet (Relay direct-execution) only.
+ */
+usePermit?: boolean): Promise<CheckoutQuoteResponse>;
 export declare function getQuoteFinalEstimation(baseQuote: CheckoutQuoteResponse, checkoutItem: FunkitActiveCheckoutItem, newPaymentMethodInfo: PaymentMethodInfo, wagmiConfig: Config, apiKey: string, loginType: LoginType, isWithdrawal?: boolean, brokerageQuote?: BluvoBrokerageQuote): Promise<{
     finalEstimation: FunkitCheckoutQuoteResult;
     brokerage?: BrokerageDetails;

package/dist/hooks/useCheckoutDirectExecution.d.ts

@@ -15,6 +15,13 @@ interface DirectExecutionQuoteRequestParamsBase {
     toTokenAddress: Address;
     recipientAddress: Address;
     senderAddress?: Address;
+    /**
+     * Explicit permit preference for the source-side authorization step.
+     * Forwarded as `usePermit` on the v2 quote request body. When defined,
+     * takes priority over the legacy auto-gasless-fallback (see frog's
+     * getUsePermit for the full resolution order).
+     */
+    usePermit?: boolean;
 }
 interface RegularDEQuoteRequest extends DirectExecutionQuoteRequestParamsBase {
     toTokenAmount: number;