@wix/headless-restaurants-olo 0.0.1

package/cjs/dist/services/olo-settings-service.d.ts

@@ -0,0 +1,35 @@
+import * as operationGroupsApi from '@wix/auto_sdk_restaurants_operation-groups';
+import * as operationsApi from '@wix/auto_sdk_restaurants_operations';
+import { type Signal } from '@wix/services-definitions/core-services/signals';
+export interface OLOSettingsServiceAPI {
+    operationGroup: Signal<operationGroupsApi.OperationGroup | undefined>;
+    operation: Signal<operationsApi.Operation | undefined>;
+    selectedItem?: Signal<unknown>;
+    isLoading: Signal<boolean>;
+    error: Signal<string | null>;
+}
+export interface OLOSettingsServiceConfig {
+    operationGroup?: operationGroupsApi.OperationGroup;
+    operation?: operationsApi.Operation;
+}
+export declare const OLOSettingsServiceDefinition: string & {
+    __api: OLOSettingsServiceAPI;
+    __config: {};
+    isServiceDefinition?: boolean;
+} & OLOSettingsServiceAPI;
+export declare const OLOSettingsService: import("@wix/services-definitions").ServiceFactory<string & {
+    __api: OLOSettingsServiceAPI;
+    __config: {};
+    isServiceDefinition?: boolean;
+} & OLOSettingsServiceAPI, OLOSettingsServiceConfig>;
+export declare function loadOLOSettingsServiceConfig(): Promise<{
+    operationGroup: operationGroupsApi.OperationGroup | undefined;
+    operation: operationsApi.Operation | undefined;
+    isLoading?: undefined;
+    error?: undefined;
+} | {
+    operationGroup: undefined;
+    operation: undefined;
+    isLoading: boolean;
+    error: string;
+}>;

package/cjs/dist/services/olo-settings-service.js

@@ -0,0 +1,43 @@
+import { defineService, implementService } from '@wix/services-definitions';
+import * as operationGroupsApi from '@wix/auto_sdk_restaurants_operation-groups';
+import * as operationsApi from '@wix/auto_sdk_restaurants_operations';
+import { SignalsServiceDefinition, } from '@wix/services-definitions/core-services/signals';
+export const OLOSettingsServiceDefinition = defineService('oloSettings');
+export const OLOSettingsService = implementService.withConfig()(OLOSettingsServiceDefinition, ({ getService, config }) => {
+    const signalsService = getService(SignalsServiceDefinition);
+    const operationGroup = signalsService.signal(config.operationGroup);
+    const operation = signalsService.signal(config.operation);
+    const selectedItem = signalsService.signal(null);
+    const isLoading = signalsService.signal(false);
+    const error = signalsService.signal(null);
+    return {
+        operationGroup,
+        operation,
+        isLoading,
+        error,
+        selectedItem,
+    };
+});
+export async function loadOLOSettingsServiceConfig() {
+    try {
+        // Fetch operation groups and operations in parallel
+        const [operationGroupsResponse, operationsResponse] = await Promise.all([
+            operationGroupsApi.queryOperationGroups().find(),
+            operationsApi.queryOperation().find(),
+        ]);
+        return {
+            operationGroup: operationGroupsResponse.items[0] || undefined,
+            operation: operationsResponse.items[0] || undefined,
+        };
+    }
+    catch (error) {
+        console.error('Failed to load OLO settings service config:', error);
+        return {
+            operationGroup: undefined,
+            operation: undefined,
+            isLoading: false,
+            error: error?.message ||
+                'Failed to load OLO settings service config',
+        };
+    }
+}

package/dist/react/ItemDetails.d.ts

@@ -0,0 +1,119 @@
+import React from 'react';
+import { Commerce } from '@wix/ecom/components';
+import { type LineItem } from '@wix/ecom/services';
+import { type AsChildChildren } from '@wix/headless-utils/react';
+import { ItemServiceConfig } from '../services/item-details-service.js';
+/**
+ * Root component for menu item display and interaction.
+ * Provides context for all menu item-related components like name, price, description, image, etc.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <ItemDetails>
+ *   <ItemDetailsImage src="wix:image://v1/abc123.jpg" alt="Menu item" />
+ *   <ItemDetailsName />
+ *   <ItemDetailsPrice />
+ *   <ItemDetailsDescription />
+ * </ItemDetails>
+ * ```
+ */
+export interface RootProps {
+    asChild?: boolean;
+    children: React.ReactNode;
+    itemDetailsServiceConfig: ItemServiceConfig;
+}
+export declare const Root: ({ children, itemDetailsServiceConfig }: RootProps) => import("react/jsx-runtime").JSX.Element;
+export interface ItemDetailsNameProps {
+    asChild?: boolean;
+    /** Custom render function when using asChild */
+    children?: AsChildChildren<{
+        name: string;
+    }>;
+    /** CSS classes to apply to the default element */
+    className?: string;
+}
+export interface AddToCartActionProps {
+    /** Whether to render as a child component */
+    asChild?: boolean;
+    /** Text label for the button */
+    label: string;
+    /** Custom render function when using asChild */
+    lineItems: LineItem[];
+    /** CSS classes to apply to the button */
+    className?: string;
+    /** Content to display when loading */
+    loadingState?: string | React.ReactNode;
+    children?: React.ReactNode;
+}
+/**
+ * Add to Cart button for the menu item.
+ * Triggers the action to add the selected item (and its modifiers/variants) to the cart.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <ItemDetails>
+ *   <AddToCart
+ *     label="Add to Cart"
+ *     lineItems={[{ catalogReference: { ... }, quantity: 1 }]}
+ *   />
+ * </ItemDetails>
+ * ```
+ */
+export declare const AddToCart: React.ForwardRefExoticComponent<AddToCartActionProps & React.RefAttributes<HTMLButtonElement>>;
+/**
+ * Multi-line text input component for special requests or instructions.
+ * Provides a textarea for customers to add custom notes or modifications.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <ItemDetails>
+ *   <SpecialRequest
+ *     placeholder="Any special requests or dietary restrictions?"
+ *     maxLength={200}
+ *     className="mt-4"
+ *   />
+ * </ItemDetails>
+ * ```
+ */
+export interface SpecialRequestProps {
+    asChild?: boolean;
+    children?: AsChildChildren<{
+        description: string;
+    }>;
+    /** Placeholder text for the textarea */
+    placeholder?: string;
+    /** Maximum number of characters allowed */
+    maxLength?: number;
+    /** Number of visible text lines */
+    rows?: number;
+    /** CSS classes to apply to the textarea */
+    className?: string;
+    labelClassName?: string;
+    /** Label text for the input */
+    label?: string;
+    /** Whether to show character count */
+    showCharCount?: boolean;
+}
+/**
+ * AddToCartButton component that uses Commerce.Actions.AddToCart with AsChildSlot,
+ * and gets the lineItem from CoreItemDetails.LineItemComponent.
+ *
+ * Usage:
+ * <ItemDetails.AddToCartButton>Add to cart</ItemDetails.AddToCartButton>
+ */
+export interface AddToCartButtonProps extends Omit<React.ComponentPropsWithoutRef<typeof Commerce.Actions.AddToCart>, 'lineItems'> {
+    asChild?: boolean;
+    children?: React.ReactNode;
+    className?: string;
+    label?: string;
+    onClick?: () => void;
+}
+export interface ItemDetailsQuantityProps {
+    children: React.ReactNode;
+}
+export declare const AddToCartButton: React.FC<AddToCartButtonProps>;
+export declare const Quantity: React.FC<ItemDetailsQuantityProps>;
+export declare const SpecialRequest: React.ForwardRefExoticComponent<SpecialRequestProps & React.RefAttributes<never>>;

package/dist/react/ItemDetails.js

@@ -0,0 +1,51 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { Commerce } from '@wix/ecom/components';
+import { AsChildSlot } from '@wix/headless-utils/react';
+import { Quantity as QuantityComponent } from '@wix/headless-components/react';
+import { Item } from '@wix/restaurants/components';
+import * as CoreItemDetails from './core/ItemDetails.js';
+var TestIds;
+(function (TestIds) {
+    TestIds["itemName"] = "item-name";
+    TestIds["itemPrice"] = "item-price";
+    TestIds["itemDescription"] = "item-description";
+    TestIds["itemImage"] = "item-image";
+    TestIds["itemAddToCart"] = "item-add-to-cart";
+    TestIds["itemSpecialRequest"] = "item-special-request";
+})(TestIds || (TestIds = {}));
+export const Root = ({ children, itemDetailsServiceConfig }) => {
+    return (_jsx(CoreItemDetails.Root, { itemDetailsServiceConfig: itemDetailsServiceConfig, children: ({ item }) => _jsx(Item.Root, { item: item, children: children }) }));
+};
+/**
+ * Add to Cart button for the menu item.
+ * Triggers the action to add the selected item (and its modifiers/variants) to the cart.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <ItemDetails>
+ *   <AddToCart
+ *     label="Add to Cart"
+ *     lineItems={[{ catalogReference: { ... }, quantity: 1 }]}
+ *   />
+ * </ItemDetails>
+ * ```
+ */
+export const AddToCart = React.forwardRef(({ lineItems, className, label, ...props }, ref) => {
+    return (_jsx(Commerce.Actions.AddToCart, { ref: ref, asChild: false, label: label, className: className, lineItems: lineItems, children: props.children }));
+});
+AddToCart.displayName = 'AddToCart';
+export const AddToCartButton = ({ asChild = false, children, className, onClick, label = 'Add to cart', ...props }) => {
+    return (_jsx(CoreItemDetails.LineItemComponent, { children: ({ lineItem }) => (_jsx(AsChildSlot, { asChild: asChild, className: className, customElement: children, customElementProps: {
+                onClick,
+            }, children: _jsx(Commerce.Actions.AddToCart, { asChild: false, label: label, className: className, lineItems: [lineItem], ...props, children: children }) })) }));
+};
+export const Quantity = ({ children }, ref) => {
+    return (_jsx(CoreItemDetails.QuantityComponent, { children: ({ quantity, onValueChange, }) => (_jsx(QuantityComponent.Root, { ref: ref, onValueChange: onValueChange, initialValue: quantity, children: children })) }));
+};
+Quantity.displayName = 'Quantity';
+export const SpecialRequest = React.forwardRef(({ className, labelClassName, placeholder = 'Any special requests or dietary restrictions?', maxLength = 200, rows = 3, label = 'Special Requests', asChild, children, ...props }, ref) => {
+    return (_jsx(CoreItemDetails.SpecialRequest, { children: ({ value, onChange, }) => (_jsxs(AsChildSlot, { ref: ref, asChild: asChild, className: className, onChange: onChange, "data-testid": TestIds.itemSpecialRequest, customElement: children, customElementProps: { label, value }, content: value, ...props, children: [label && _jsx("label", { className: labelClassName, children: label }), _jsx("textarea", { value: value, onChange: (e) => onChange(e.target.value), placeholder: placeholder, maxLength: maxLength, rows: rows, className: className, children: value })] })) }));
+});
+SpecialRequest.displayName = 'SpecialRequest';

package/dist/react/core/ItemDetails.d.ts

@@ -0,0 +1,50 @@
+import React from 'react';
+import { type LineItem } from '@wix/ecom/services';
+import { ItemServiceConfig } from '../../services/item-details-service.js';
+interface ItemDetailsRootProps {
+    children: (props: {
+        item: unknown;
+    }) => React.ReactNode;
+    itemDetailsServiceConfig: ItemServiceConfig;
+}
+export declare const Root: React.FC<ItemDetailsRootProps>;
+interface ItemDetailsModifiersRepeaterProps {
+    children: (props: {
+        modifiers: [];
+        hasModifiers: boolean;
+    }) => React.ReactNode;
+}
+export declare const ModifiersRepeater: React.FC<ItemDetailsModifiersRepeaterProps>;
+interface ItemDetailsVariantsRepeaterProps {
+    children: (props: {
+        variants: [];
+        hasVariants: boolean;
+    }) => React.ReactNode;
+}
+export declare const VariantsRepeater: React.FC<ItemDetailsVariantsRepeaterProps>;
+interface ItemDetailsSpecialRequestProps {
+    children: (props: {
+        value: string;
+        onChange: (value: string) => void;
+    }) => React.ReactNode;
+}
+export declare const SpecialRequest: React.FC<ItemDetailsSpecialRequestProps>;
+interface ItemDetailsLineItemProps {
+    children: (props: {
+        lineItem: LineItem;
+    }) => React.ReactNode;
+}
+export declare const LineItemComponent: React.FC<ItemDetailsLineItemProps>;
+interface ItemDetailsQuantityProps {
+    children: (props: {
+        quantity: number;
+        increment: () => void;
+        decrement: () => void;
+        setQuantity: (quantity: number) => void;
+        canIncrement: boolean;
+        canDecrement: boolean;
+        onValueChange: (value: number) => void;
+    }) => React.ReactNode;
+}
+export declare const QuantityComponent: React.FC<ItemDetailsQuantityProps>;
+export {};

package/dist/react/core/ItemDetails.js

@@ -0,0 +1,73 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from 'react';
+import { useService, WixServices } from '@wix/services-manager-react';
+import { createServicesMap } from '@wix/services-manager';
+import { ItemService, ItemServiceDefinition, loadItemServiceConfig, } from '../../services/item-details-service.js';
+import { OLOSettingsServiceDefinition } from '../../services/olo-settings-service.js';
+export const Root = ({ children }) => {
+    const service = useService(OLOSettingsServiceDefinition);
+    const selectedItem = service.selectedItem?.get();
+    const itemDetailsServiceConfig = loadItemServiceConfig({
+        item: selectedItem,
+        operationId: service.operation?.get()?._id ?? '',
+    });
+    return (_jsx(WixServices, { servicesMap: createServicesMap().addService(ItemServiceDefinition, ItemService, itemDetailsServiceConfig), children: children({ item: selectedItem }) }));
+};
+export const ModifiersRepeater = ({ children, }) => {
+    const service = useService(ItemServiceDefinition);
+    const item = service.item.get();
+    // TODO: Check if modifiers exist on item type - might be in a different property
+    const modifiers = item?.modifiers || [];
+    const hasModifiers = modifiers.length > 0;
+    return children({ modifiers, hasModifiers });
+};
+export const VariantsRepeater = ({ children, }) => {
+    const service = useService(ItemServiceDefinition);
+    const item = service.item.get();
+    // TODO: Check if variants exist on item type - might be in a different property
+    const variants = item?.variants || [];
+    const hasVariants = variants.length > 0;
+    return children({ variants, hasVariants });
+};
+export const SpecialRequest = ({ children, }) => {
+    const [value, setValue] = useState('');
+    const service = useService(ItemServiceDefinition);
+    const onChange = (newValue) => {
+        setValue(newValue);
+        service.updateSpecialRequest(newValue);
+    };
+    return children({
+        value,
+        onChange,
+        // placeholder: 'Any special requests or dietary restrictions?',
+        // maxLength: 200
+    });
+};
+export const LineItemComponent = ({ children, }) => {
+    const service = useService(ItemServiceDefinition);
+    const lineItem = service.lineItem?.get?.() ?? {};
+    return children({ lineItem });
+};
+export const QuantityComponent = ({ children, }) => {
+    const service = useService(ItemServiceDefinition);
+    const quantity = service.quantity?.get?.() ?? 1;
+    const increment = () => service.quantity?.set?.(quantity + 1);
+    const decrement = () => service.quantity?.set?.(quantity - 1);
+    const setQuantity = (quantity) => {
+        service.updateQuantity?.(quantity);
+    };
+    const canIncrement = true;
+    const canDecrement = quantity > 1;
+    const onValueChange = (value) => {
+        service.updateQuantity?.(value);
+    };
+    return children({
+        quantity,
+        increment,
+        decrement,
+        setQuantity,
+        canIncrement,
+        canDecrement,
+        onValueChange,
+    });
+};

package/dist/react/core/index.d.ts

@@ -0,0 +1 @@
+export * as CoreItemDetails from './ItemDetails.js';

package/dist/react/core/index.js

@@ -0,0 +1 @@
+export * as CoreItemDetails from './ItemDetails.js';

package/dist/react/index.d.ts

@@ -0,0 +1 @@
+export * from './ItemDetails.js';

package/dist/react/index.js

@@ -0,0 +1 @@
+export * from './ItemDetails.js';

package/dist/services/common-types.d.ts

@@ -0,0 +1,3 @@
+import * as currentCart from '@wix/auto_sdk_ecom_current-cart';
+export type LineItem = currentCart.LineItem;
+export type DescriptionLine = currentCart.DescriptionLine;

package/dist/services/common-types.js

@@ -0,0 +1 @@
+export {};

package/dist/services/index.d.ts

@@ -0,0 +1,2 @@
+export { ItemService, ItemServiceDefinition, loadItemServiceConfig, ItemServiceConfig, } from './item-details-service.js';
+export { OLOSettingsService, OLOSettingsServiceDefinition, loadOLOSettingsServiceConfig, type OLOSettingsServiceConfig, type OLOSettingsServiceAPI, } from './olo-settings-service.js';

package/dist/services/index.js

@@ -0,0 +1,2 @@
+export { ItemService, ItemServiceDefinition, loadItemServiceConfig, } from './item-details-service.js';
+export { OLOSettingsService, OLOSettingsServiceDefinition, loadOLOSettingsServiceConfig, } from './olo-settings-service.js';

package/dist/services/item-details-service.d.ts

@@ -0,0 +1,154 @@
+import { type Signal } from '@wix/services-definitions/core-services/signals';
+import * as items from '@wix/auto_sdk_restaurants_items';
+import { type LineItem } from '@wix/ecom/services';
+/**
+ * API interface for the Item Detailsservice, providing reactive item data management.
+ * This service handles loading and managing a single item's data, loading state, and errors.
+ *
+ * @interface ItemServiceAPI
+ */
+export interface ItemServiceAPI {
+    /** Reactive signal containing the current item data */
+    item: Signal<items.Item>;
+    quantity: Signal<number>;
+    specialRequest: Signal<string>;
+    lineItem: Signal<LineItem>;
+    /** Reactive signal indicating if a item is currently being loaded */
+    isLoading: Signal<boolean>;
+    /** Reactive signal containing any error message, or null if no error */
+    error: Signal<string | null>;
+    /** Function to update the quantity of the item */
+    updateQuantity: (quantity: number) => void;
+    /** Function to update the special request of the item */
+    updateSpecialRequest: (specialRequest: string) => void;
+}
+/**
+ * Service definition for the Item service.
+ * This defines the contract that the ItemService must implement.
+ *
+ * @constant
+ */
+export declare const ItemServiceDefinition: string & {
+    __api: ItemServiceAPI;
+    __config: {};
+    isServiceDefinition?: boolean;
+} & ItemServiceAPI;
+/**
+ * Configuration interface required to initialize the ItemService.
+ * Contains the initial item data that will be loaded into the service.
+ *
+ * @interface ItemServiceConfig
+ */
+export interface ItemServiceConfig {
+    /** The initial item data to configure the service with */
+    item: items.Item;
+    itemId?: string;
+    operationId?: string;
+}
+export declare const ItemService: import("@wix/services-definitions").ServiceFactory<string & {
+    __api: ItemServiceAPI;
+    __config: {};
+    isServiceDefinition?: boolean;
+} & ItemServiceAPI, ItemServiceConfig>;
+/**
+ * Success result interface for item service configuration loading.
+ * Returned when a item is successfully found and loaded.
+ *
+ * @interface SuccessItemServiceConfigResult
+ */
+export interface SuccessItemServiceConfigResult {
+    /** Type "success" means that the item was found and the config is valid */
+    type: 'success';
+    /** The item config containing the loaded item data */
+    config: ItemServiceConfig;
+}
+/**
+ * Not found result interface for item service configuration loading.
+ * Returned when a item with the given id cannot be found.
+ *
+ * @interface NotFoundItemServiceConfigResult
+ */
+export interface NotFoundItemServiceConfigResult {
+    /** Type "notFound" means that the item was not found */
+    type: 'notFound';
+}
+/**
+ * Loads item service configuration from the Wix Items API for SSR initialization.
+ * This function is designed to be used during Server-Side Rendering (SSR) to preload
+ * a specific item by id that will be used to configure the ItemService.
+ *
+ * @param itemSlug The item id to load
+ * @returns Promise that resolves to ItemServiceConfigResult (success with config or notFound)
+ *
+ * @example
+ * ```astro
+ * ---
+ * // Astro page example - pages/item/[id].astro
+ * import { loadItemServiceConfig } from '@wix/stores/services';
+ * import { Item } from '@wix/stores/components';
+ *
+ * // Get item id from URL params
+ * const { id } = Astro.params;
+ *
+ * // Load item data during SSR
+ * const itemResult = await loadItemServiceConfig(id);
+ *
+ * // Handle not found case
+ * if (itemResult.type === 'notFound') {
+ *   return Astro.redirect('/404');
+ * }
+ * ---
+ *
+ * <Item.Root itemConfig={itemResult.config}>
+ *   <Item.Name>
+ *     {({ name }) => <h1>{name}</h1>}
+ *   </Item.Name>
+ * </Item.Root>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Next.js page example - pages/item/[id].tsx
+ * import { GetServerSideProps } from 'next';
+ * import { loadItemServiceConfig } from '@wix/stores/services';
+ * import { Item } from '@wix/stores/components';
+ *
+ * interface ItemPageProps {
+ *   itemConfig: Extract<Awaited<ReturnType<typeof loadItemServiceConfig>>, { type: 'success' }>['config'];
+ * }
+ *
+ * export const getServerSideProps: GetServerSideProps<ItemPageProps> = async ({ params }) => {
+ *   const id = params?.id as string;
+ *
+ *   // Load item data during SSR
+ *   const itemResult = await loadItemServiceConfig(id);
+ *
+ *   // Handle not found case
+ *   if (itemResult.type === 'notFound') {
+ *     return {
+ *       notFound: true,
+ *     };
+ *   }
+ *
+ *   return {
+ *     props: {
+ *       itemConfig: itemResult.config,
+ *     },
+ *   };
+ * };
+ *
+ * export default function ItemPage({ itemConfig }: ItemPageProps) {
+ *   return (
+ *     <Item.Root itemConfig={itemConfig}>
+ *       <Item.Name>
+ *         {({ name }) => <h1>{name}</h1>}
+ *       </Item.Name>
+ *     </Item.Root>
+ *   );
+ * }
+ * ```
+ */
+export declare function loadItemServiceConfig({ item, operationId, }: {
+    item: any;
+    operationId: string;
+}): ItemServiceConfig;