ov25-ui/dist/utils/configurator-utils.d.ts

A UI configurator for OV25 product visualization

import { Selection } from '../contexts/ov25-ui-context.js';
/**
 * Configuration option type
 */
export type ConfigOption = {
    id: string;
    name: string;
};
/**
 * Selection data structure
 */
export type SelectionItem = {
    optionId: string;
    groupId?: string;
    selectionId: string;
};
/**
 * Animation state options
 */
export type AnimationState = 'unavailable' | 'open' | 'close' | 'loop' | 'stop';
/**
 * Sends a message to the iframe
 */
export declare const sendMessageToIframe: (type: string, payload: any) => void;
/**
 * Handle selecting a product
 * @param productId - The ID of the product to select
 */
export declare const selectProduct: (productId: number) => void;
/**
 * Handle selecting a configuration option
 * @param optionId - The ID of the option to select
 * @param groupId - The ID of the group the option belongs to
 * @param selectionId - The ID of the specific selection
 */
export declare const selectOption: (optionId: string, groupId: string, selectionId: string) => void;
/**
 * Update the quantity of the product
 * @param quantity - The new quantity value
 */
export declare const updateQuantity: (quantity: number) => void;
/**
 * Add the current configured product to the cart
 */
export declare const addToCart: () => void;
/**
 * Toggle dimensions visibility in the 3D viewer
 * @param canSeeDimensions - Current dimensions visibility state
 * @param setCanSeeDimensions - State setter function for dimensions visibility
 */
export declare const toggleDimensions: (canSeeDimensions: boolean, setCanSeeDimensions: React.Dispatch<React.SetStateAction<boolean>>) => void;
/**
 * Toggle animation in the 3D viewer
 */
export declare const toggleAnimation: () => void;
/**
 * Enter VR mode
 */
export declare const toggleVR: () => void;
/**
 * Enter AR mode
 */
export declare const toggleAR: () => void;
/**
 * Toggle fullscreen mode for the iframe's container
 */
export declare const toggleFullscreen: () => void;
/**
 * Get the animation button text based on the current state
 * @param canAnimate - Whether animation is available
 * @param animationState - Current animation state
 * @returns The appropriate button text
 */
export declare const getAnimationButtonText: (canAnimate: boolean, animationState: AnimationState) => string;
/**
 * Generate the iframe source URL based on productLink and apiKey
 */
export declare const getIframeSrc: (apiKey: string | null, productLink: string | null) => string;
/**
 * Create a handler for selection of a variant
 * @param activeOptionId - The currently active option ID
 * @param currentProductId - The currently selected product ID
 * @param setSelectedSelections - State setter for selected selections
 * @returns A selection handler function
 */
export declare const createSelectionHandler: (activeOptionId: string | null, currentProductId: number | undefined, setSelectedSelections: React.Dispatch<React.SetStateAction<SelectionItem[]>>) => (selection: Selection) => void;
/**
 * Navigation handlers interface
 */
export interface OptionNavigationHandlers {
    handleNextOption: () => void;
    handlePreviousOption: () => void;
}
/**
 * Create option navigation handlers
 * @param allOptions - Array of available configuration options
 * @param activeOptionId - Currently active option ID
 * @param setActiveOptionId - State setter for the active option ID
 * @returns Object with next and previous option handler functions
 */
export declare const createOptionNavigationHandlers: (allOptions: ConfigOption[], activeOptionId: string | null, setActiveOptionId: React.Dispatch<React.SetStateAction<string | null>>) => OptionNavigationHandlers;
export declare const IFRAME_HEIGHT_RATIO = 0.42;
export declare const DRAWER_HEIGHT_RATIO: number;