@voyantjs/products-ui 0.101.1 → 0.101.2

package/dist/components/product-detail/date-picker.d.ts

@@ -0,0 +1,44 @@
+import { Calendar } from "@voyantjs/ui/components/calendar";
+import * as React from "react";
+type CalendarProps = React.ComponentProps<typeof Calendar>;
+type SinglePreset = {
+    label: string;
+    value: string | null;
+};
+type DateRangeValue = {
+    from: string | null;
+    to: string | null;
+};
+type RangePreset = {
+    label: string;
+    value: DateRangeValue | null;
+};
+type SharedProps = Omit<CalendarProps, "mode" | "selected" | "onSelect" | "disabled"> & {
+    placeholder?: React.ReactNode;
+    displayFormat?: string;
+    className?: string;
+    contentClassName?: string;
+    clearable?: boolean;
+    /** Disable the entire picker (prevents opening the popover). */
+    disabled?: boolean;
+    /** Per-day disable matcher, forwarded to the underlying Calendar. */
+    dateDisabled?: CalendarProps["disabled"];
+};
+type DatePickerProps = SharedProps & {
+    value?: string | null;
+    defaultValue?: string | null;
+    onChange?: (value: string | null) => void;
+    presets?: SinglePreset[];
+};
+type DateRangePickerProps = SharedProps & {
+    value?: DateRangeValue | null;
+    defaultValue?: DateRangeValue | null;
+    onChange?: (value: DateRangeValue | null) => void;
+    presets?: RangePreset[];
+};
+export declare function DatePicker({ value, defaultValue, onChange, presets, placeholder, // i18n-literal-ok primitive default, overridden by callers
+displayFormat, className, contentClassName, clearable, disabled, dateDisabled, ...calendarProps }: DatePickerProps): import("react/jsx-runtime").JSX.Element;
+export declare function DateRangePicker({ value, defaultValue, onChange, presets, placeholder, // i18n-literal-ok primitive default, overridden by callers
+displayFormat, className, contentClassName, clearable, disabled, dateDisabled, numberOfMonths, ...calendarProps }: DateRangePickerProps): import("react/jsx-runtime").JSX.Element;
+export type { DatePickerProps, DateRangePickerProps, DateRangeValue };
+//# sourceMappingURL=date-picker.d.ts.map

package/dist/components/product-detail/date-picker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../../src/components/product-detail/date-picker.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAA;AAO3D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,KAAK,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,CAAA;AAE1D,KAAK,YAAY,GAAG;IAClB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CACrB,CAAA;AAED,KAAK,cAAc,GAAG;IACpB,IAAI,EAAE,MAAM,GAAG,IAAI,CAAA;IACnB,EAAE,EAAE,MAAM,GAAG,IAAI,CAAA;CAClB,CAAA;AAED,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,cAAc,GAAG,IAAI,CAAA;CAC7B,CAAA;AAED,KAAK,WAAW,GAAG,IAAI,CAAC,aAAa,EAAE,MAAM,GAAG,UAAU,GAAG,UAAU,GAAG,UAAU,CAAC,GAAG;IACtF,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,gEAAgE;IAChE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,qEAAqE;IACrE,YAAY,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAA;CACzC,CAAA;AAED,KAAK,eAAe,GAAG,WAAW,GAAG;IACnC,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC5B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;IACzC,OAAO,CAAC,EAAE,YAAY,EAAE,CAAA;CACzB,CAAA;AAED,KAAK,oBAAoB,GAAG,WAAW,GAAG;IACxC,KAAK,CAAC,EAAE,cAAc,GAAG,IAAI,CAAA;IAC7B,YAAY,CAAC,EAAE,cAAc,GAAG,IAAI,CAAA;IACpC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAA;IACjD,OAAO,CAAC,EAAE,WAAW,EAAE,CAAA;CACxB,CAAA;AAqJD,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,YAAY,EACZ,QAAQ,EACR,OAAY,EACZ,WAA2B,EAAE,2DAA2D;AACxF,aAAqB,EACrB,SAAS,EACT,gBAAgB,EAChB,SAAgB,EAChB,QAAQ,EACR,YAAY,EACZ,GAAG,aAAa,EACjB,EAAE,eAAe,2CAgEjB;AAED,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,YAAY,EACZ,QAAQ,EACR,OAAY,EACZ,WAAiC,EAAE,2DAA2D;AAC9F,aAA0B,EAC1B,SAAS,EACT,gBAAgB,EAChB,SAAgB,EAChB,QAAQ,EACR,YAAY,EACZ,cAAkB,EAClB,GAAG,aAAa,EACjB,EAAE,oBAAoB,2CAoFtB;AAED,YAAY,EAAE,eAAe,EAAE,oBAAoB,EAAE,cAAc,EAAE,CAAA"}

package/dist/components/product-detail/date-picker.js

@@ -0,0 +1,125 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Button } from "@voyantjs/ui/components/button";
+import { Calendar } from "@voyantjs/ui/components/calendar";
+import { Popover, PopoverContent, PopoverTrigger } from "@voyantjs/ui/components/popover";
+import { Separator } from "@voyantjs/ui/components/separator";
+import { cn } from "@voyantjs/ui/lib/utils";
+import { format, isValid, parseISO } from "date-fns";
+import { CalendarIcon, XIcon } from "lucide-react";
+import * as React from "react";
+function parseDateValue(value) {
+    if (!value)
+        return undefined;
+    const parsed = parseISO(value);
+    return isValid(parsed) ? parsed : undefined;
+}
+function formatDateValue(value) {
+    return value ? format(value, "yyyy-MM-dd") : null;
+}
+function hasRangeValue(value) {
+    return Boolean(value?.from || value?.to);
+}
+function formatRangeLabel(value, displayFormat, placeholder) {
+    if (!value?.from && !value?.to)
+        return placeholder;
+    const from = parseDateValue(value?.from);
+    const to = parseDateValue(value?.to);
+    if (from && to) {
+        return `${format(from, displayFormat)} - ${format(to, displayFormat)}`;
+    }
+    if (from) {
+        return `${format(from, displayFormat)} -`;
+    }
+    if (to) {
+        return `- ${format(to, displayFormat)}`;
+    }
+    return placeholder;
+}
+function DatePickerTrigger({ className, empty, disabled, children, ...props }) {
+    return (_jsxs(Button
+    // Spread base-ui's PopoverTrigger props (onClick, ref, aria/data state)
+    // first so the popover actually toggles; explicit styling props follow.
+    , { ...props, variant: "outline", "data-empty": empty, disabled: disabled, className: cn("w-full justify-start text-left font-normal data-[empty=true]:text-muted-foreground", className), children: [_jsx(CalendarIcon, { className: "h-4 w-4" }), _jsx("span", { className: "truncate", children: children })] }));
+}
+function DatePickerFooter({ clearable, hasValue, onClear }) {
+    if (!clearable || !hasValue)
+        return null;
+    return (_jsxs(_Fragment, { children: [_jsx(Separator, {}), _jsx("div", { className: "flex justify-end p-2", children: _jsxs(Button, { type: "button", variant: "ghost", size: "sm", onClick: onClear, children: [_jsx(XIcon, { className: "h-4 w-4" }), "Clear"] }) })] }));
+}
+function SinglePresets({ presets, onSelect }) {
+    if (presets.length === 0)
+        return null;
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "flex flex-wrap gap-2 p-3 pb-0", children: presets.map((preset) => (_jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: () => onSelect(preset.value), children: preset.label }, preset.label))) }), _jsx("div", { className: "px-3 pt-3", children: _jsx(Separator, {}) })] }));
+}
+function RangePresets({ presets, onSelect }) {
+    if (presets.length === 0)
+        return null;
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "flex flex-wrap gap-2 p-3 pb-0", children: presets.map((preset) => (_jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: () => onSelect(preset.value), children: preset.label }, preset.label))) }), _jsx("div", { className: "px-3 pt-3", children: _jsx(Separator, {}) })] }));
+}
+export function DatePicker({ value, defaultValue, onChange, presets = [], placeholder = "Pick a date", // i18n-literal-ok primitive default, overridden by callers
+displayFormat = "PPP", className, contentClassName, clearable = true, disabled, dateDisabled, ...calendarProps }) {
+    const [open, setOpen] = React.useState(false);
+    const [internalValue, setInternalValue] = React.useState(defaultValue ?? null);
+    const isControlled = value !== undefined;
+    const selectedValue = isControlled ? (value ?? null) : internalValue;
+    const selectedDate = parseDateValue(selectedValue);
+    const handleChange = React.useCallback((nextValue) => {
+        if (!isControlled) {
+            setInternalValue(nextValue);
+        }
+        onChange?.(nextValue);
+    }, [isControlled, onChange]);
+    const handleSelect = (nextDate) => {
+        handleChange(formatDateValue(nextDate));
+        if (nextDate) {
+            setOpen(false);
+        }
+    };
+    const label = selectedDate ? format(selectedDate, displayFormat) : placeholder;
+    return (_jsxs(Popover, { open: disabled ? false : open, onOpenChange: disabled ? undefined : setOpen, children: [_jsx(PopoverTrigger, { render: _jsx(DatePickerTrigger, { className: className, empty: !selectedDate, disabled: disabled }), children: label }), _jsxs(PopoverContent, { align: "start", className: cn("w-auto p-0", contentClassName), children: [_jsx(SinglePresets, { presets: presets, onSelect: (presetValue) => {
+                            handleChange(presetValue);
+                            setOpen(false);
+                        } }), _jsx(Calendar, { mode: "single", selected: selectedDate, onSelect: handleSelect, defaultMonth: selectedDate, disabled: dateDisabled, ...calendarProps }), _jsx(DatePickerFooter, { clearable: clearable, hasValue: Boolean(selectedDate), onClear: () => {
+                            handleChange(null);
+                            setOpen(false);
+                        } })] })] }));
+}
+export function DateRangePicker({ value, defaultValue, onChange, presets = [], placeholder = "Pick a date range", // i18n-literal-ok primitive default, overridden by callers
+displayFormat = "LLL d, y", className, contentClassName, clearable = true, disabled, dateDisabled, numberOfMonths = 2, ...calendarProps }) {
+    const [open, setOpen] = React.useState(false);
+    const [internalValue, setInternalValue] = React.useState(defaultValue ?? null);
+    const isControlled = value !== undefined;
+    const selectedValue = isControlled ? (value ?? null) : internalValue;
+    const selectedRange = selectedValue
+        ? {
+            from: parseDateValue(selectedValue.from),
+            to: parseDateValue(selectedValue.to),
+        }
+        : undefined;
+    const handleChange = React.useCallback((nextValue) => {
+        if (!isControlled) {
+            setInternalValue(nextValue);
+        }
+        onChange?.(nextValue);
+    }, [isControlled, onChange]);
+    const handleSelect = (nextRange) => {
+        const nextValue = nextRange?.from || nextRange?.to
+            ? {
+                from: formatDateValue(nextRange.from),
+                to: formatDateValue(nextRange.to),
+            }
+            : null;
+        handleChange(nextValue);
+        if (nextRange?.from && nextRange.to) {
+            setOpen(false);
+        }
+    };
+    return (_jsxs(Popover, { open: disabled ? false : open, onOpenChange: disabled ? undefined : setOpen, children: [_jsx(PopoverTrigger, { render: _jsx(DatePickerTrigger, { className: className, empty: !hasRangeValue(selectedValue), disabled: disabled }), children: formatRangeLabel(selectedValue, displayFormat, placeholder) }), _jsxs(PopoverContent, { align: "start", className: cn("w-auto p-0", contentClassName), children: [_jsx(RangePresets, { presets: presets, onSelect: (presetValue) => {
+                            handleChange(presetValue);
+                            setOpen(false);
+                        } }), _jsx(Calendar, { mode: "range", selected: selectedRange, onSelect: handleSelect, defaultMonth: selectedRange?.from, numberOfMonths: numberOfMonths, disabled: dateDisabled, ...calendarProps }), _jsx(DatePickerFooter, { clearable: clearable, hasValue: hasRangeValue(selectedValue), onClear: () => {
+                            handleChange(null);
+                            setOpen(false);
+                        } })] })] }));
+}

package/dist/components/product-detail/host.d.ts

@@ -0,0 +1,53 @@
+import type { OperatorAdminMessages } from "@voyantjs/i18n";
+import { type ReactNode } from "react";
+import type { ProductMediaUploadHandler } from "../product-media-section.js";
+/**
+ * The product-detail page and its sections are transport- and app-agnostic.
+ * The host application injects everything app-specific — localized messages, a
+ * REST client, the active locale, navigation, and a media upload handler — via
+ * this context so the same page can be mounted by any template.
+ */
+export type ProductDetailMessages = OperatorAdminMessages;
+export interface ProductDetailApi {
+    get: <T = unknown>(path: string) => Promise<T>;
+    post: <T = unknown>(path: string, body?: unknown) => Promise<T>;
+    patch: <T = unknown>(path: string, body?: unknown) => Promise<T>;
+    delete: <T = unknown>(path: string) => Promise<T>;
+}
+export interface ProductDetailNavigation {
+    toProducts: () => void;
+    toProduct: (productId: string) => void;
+    toNewBooking: (productId: string) => void;
+    toAvailability: (slotId: string) => void;
+}
+export interface ProductDetailBreadcrumb {
+    label: string;
+    href?: string;
+}
+export interface ProductDetailHostValue {
+    messages: ProductDetailMessages;
+    api: ProductDetailApi;
+    locale: string;
+    navigate: ProductDetailNavigation;
+    uploadMedia?: ProductMediaUploadHandler;
+    /** Optional app-shell breadcrumb sink (e.g. the operator admin shell). */
+    setBreadcrumbs?: (items: ProductDetailBreadcrumb[]) => void;
+    /** Optional extra content rendered under each product option (e.g. an app-specific resource panel). */
+    renderOptionExtras?: (productId: string, optionId: string) => ReactNode;
+}
+export declare function ProductDetailHostProvider({ value, children, }: {
+    value: ProductDetailHostValue;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function useProductDetailHost(): ProductDetailHostValue;
+/**
+ * Components keep their `messages.products.*` (and occasional sibling-namespace)
+ * access verbatim — the only change at the call site is the hook name
+ * (`useAdminMessages` → `useProductDetailMessages`).
+ */
+export type ProductMessagesRoot = ProductDetailMessages;
+export declare function useProductDetailMessages(): ProductMessagesRoot;
+export declare function useProductDetailApi(): ProductDetailApi;
+/** The active locale string (BCP-47), e.g. for `toLocaleString`/`Intl`. */
+export declare function useProductLocale(): string;
+//# sourceMappingURL=host.d.ts.map

package/dist/components/product-detail/host.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"host.d.ts","sourceRoot":"","sources":["../../../src/components/product-detail/host.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAA;AAC3D,OAAO,EAAiB,KAAK,SAAS,EAAc,MAAM,OAAO,CAAA;AAEjE,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAA;AAE5E;;;;;GAKG;AAKH,MAAM,MAAM,qBAAqB,GAAG,qBAAqB,CAAA;AAEzD,MAAM,WAAW,gBAAgB;IAC/B,GAAG,EAAE,CAAC,CAAC,GAAG,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,CAAA;IAC9C,IAAI,EAAE,CAAC,CAAC,GAAG,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,CAAA;IAC/D,KAAK,EAAE,CAAC,CAAC,GAAG,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,CAAA;IAChE,MAAM,EAAE,CAAC,CAAC,GAAG,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,CAAA;CAClD;AAED,MAAM,WAAW,uBAAuB;IACtC,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,SAAS,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,YAAY,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAA;IACzC,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;CACzC;AAED,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,MAAM,CAAA;CACd;AAED,MAAM,WAAW,sBAAsB;IACrC,QAAQ,EAAE,qBAAqB,CAAA;IAC/B,GAAG,EAAE,gBAAgB,CAAA;IACrB,MAAM,EAAE,MAAM,CAAA;IACd,QAAQ,EAAE,uBAAuB,CAAA;IACjC,WAAW,CAAC,EAAE,yBAAyB,CAAA;IACvC,0EAA0E;IAC1E,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,EAAE,KAAK,IAAI,CAAA;IAC3D,uGAAuG;IACvG,kBAAkB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,SAAS,CAAA;CACxE;AAID,wBAAgB,yBAAyB,CAAC,EACxC,KAAK,EACL,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,sBAAsB,CAAA;IAC7B,QAAQ,EAAE,SAAS,CAAA;CACpB,2CAIA;AAED,wBAAgB,oBAAoB,IAAI,sBAAsB,CAM7D;AAED;;;;GAIG;AACH,MAAM,MAAM,mBAAmB,GAAG,qBAAqB,CAAA;AAEvD,wBAAgB,wBAAwB,IAAI,mBAAmB,CAE9D;AAED,wBAAgB,mBAAmB,IAAI,gBAAgB,CAEtD;AAED,2EAA2E;AAC3E,wBAAgB,gBAAgB,IAAI,MAAM,CAEzC"}

package/dist/components/product-detail/host.js

@@ -0,0 +1,24 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext } from "react";
+const ProductDetailHostContext = createContext(null);
+export function ProductDetailHostProvider({ value, children, }) {
+    return (_jsx(ProductDetailHostContext.Provider, { value: value, children: children }));
+}
+export function useProductDetailHost() {
+    const context = useContext(ProductDetailHostContext);
+    if (!context) {
+        throw new Error("useProductDetailHost must be used within a ProductDetailHostProvider");
+    }
+    return context;
+}
+export function useProductDetailMessages() {
+    return useProductDetailHost().messages;
+}
+export function useProductDetailApi() {
+    return useProductDetailHost().api;
+}
+/** The active locale string (BCP-47), e.g. for `toLocaleString`/`Intl`. */
+export function useProductLocale() {
+    return useProductDetailHost().locale;
+}

package/dist/components/product-detail/index.d.ts

@@ -0,0 +1,6 @@
+export { type ProductDetailApi, type ProductDetailBreadcrumb, ProductDetailHostProvider, type ProductDetailHostValue, type ProductDetailMessages, type ProductDetailNavigation, useProductDetailHost, } from "./host.js";
+export { ProductDetailPage } from "./product-detail-page.js";
+export { getChannelsQueryOptions, getProductChannelMappingsQueryOptions, getProductMediaQueryOptions, getProductRulesQueryOptions, getProductSlotsQueryOptions, } from "./product-detail-shared.js";
+export { ProductDetailSkeleton } from "./product-detail-skeleton.js";
+export { getPricingCategoriesQueryOptions, getProductOptionsQueryOptions, } from "./product-options-shared.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/product-detail/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/product-detail/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,gBAAgB,EACrB,KAAK,uBAAuB,EAC5B,yBAAyB,EACzB,KAAK,sBAAsB,EAC3B,KAAK,qBAAqB,EAC1B,KAAK,uBAAuB,EAC5B,oBAAoB,GACrB,MAAM,WAAW,CAAA;AAClB,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAC5D,OAAO,EACL,uBAAuB,EACvB,qCAAqC,EACrC,2BAA2B,EAC3B,2BAA2B,EAC3B,2BAA2B,GAC5B,MAAM,4BAA4B,CAAA;AACnC,OAAO,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAA;AACpE,OAAO,EACL,gCAAgC,EAChC,6BAA6B,GAC9B,MAAM,6BAA6B,CAAA"}

package/dist/components/product-detail/index.js

@@ -0,0 +1,5 @@
+export { ProductDetailHostProvider, useProductDetailHost, } from "./host.js";
+export { ProductDetailPage } from "./product-detail-page.js";
+export { getChannelsQueryOptions, getProductChannelMappingsQueryOptions, getProductMediaQueryOptions, getProductRulesQueryOptions, getProductSlotsQueryOptions, } from "./product-detail-shared.js";
+export { ProductDetailSkeleton } from "./product-detail-skeleton.js";
+export { getPricingCategoriesQueryOptions, getProductOptionsQueryOptions, } from "./product-options-shared.js";

package/dist/components/product-detail/product-activity-section.d.ts

@@ -0,0 +1,4 @@
+export declare function ProductActivitySection({ productId }: {
+    productId: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=product-activity-section.d.ts.map

package/dist/components/product-detail/product-activity-section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-activity-section.d.ts","sourceRoot":"","sources":["../../../src/components/product-detail/product-activity-section.tsx"],"names":[],"mappings":"AAoBA,wBAAgB,sBAAsB,CAAC,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,EAAE,MAAM,CAAA;CAAE,2CAuE1E"}

package/dist/components/product-detail/product-activity-section.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useProductActionLedger, } from "@voyantjs/products-react";
+import { Badge, Button } from "@voyantjs/ui/components";
+import { Activity, Loader2 } from "lucide-react";
+import { useEffect, useState } from "react";
+import { actionLedgerRiskVariant, actionLedgerStatusVariant, } from "../product-action-ledger-card.js";
+import { useProductDetailMessages, useProductLocale } from "./host.js";
+import { Section } from "./product-detail-sections.js";
+function formatActionLedgerName(actionName) {
+    const label = actionName.replace(/^product\./, "").replace(/[._-]/g, " ");
+    return label.charAt(0).toUpperCase() + label.slice(1);
+}
+export function ProductActivitySection({ productId }) {
+    const messages = useProductDetailMessages();
+    const productMessages = messages.products.core;
+    const resolvedLocale = useProductLocale();
+    const [cursor, setCursor] = useState(null);
+    const ledgerQuery = useProductActionLedger(productId, { cursor, limit: 20 });
+    const [pages, setPages] = useState([]);
+    useEffect(() => {
+        const page = ledgerQuery.data;
+        if (!page)
+            return;
+        setPages((current) => {
+            if (current.some((entry) => entry.data[0]?.id === page.data[0]?.id))
+                return current;
+            return cursor ? [...current, page] : [page];
+        });
+    }, [ledgerQuery.data, cursor]);
+    const entries = pages.flatMap((page) => page.data);
+    const nextCursor = pages.at(-1)?.pageInfo.nextCursor ?? null;
+    const formatTimestamp = (iso) => new Date(iso).toLocaleString(resolvedLocale, { dateStyle: "medium", timeStyle: "short" });
+    return (_jsx(Section, { title: productMessages.activityTitle, contentClassName: "p-0", children: ledgerQuery.isPending && entries.length === 0 ? (_jsx("div", { className: "flex justify-center py-8", children: _jsx(Loader2, { className: "size-5 animate-spin text-muted-foreground", "aria-hidden": "true" }) })) : ledgerQuery.isError && entries.length === 0 ? (_jsx("p", { className: "py-8 text-center text-sm text-muted-foreground", children: productMessages.activityLoadFailed })) : entries.length === 0 ? (_jsx("p", { className: "py-8 text-center text-sm text-muted-foreground", children: productMessages.activityEmpty })) : (_jsxs("div", { className: "max-h-[420px] overflow-y-auto", children: [_jsx("ul", { className: "divide-y", children: entries.map((entry) => (_jsx(ActivityRow, { entry: entry, timestamp: formatTimestamp(entry.occurredAt) }, entry.id))) }), nextCursor ? (_jsx("div", { className: "border-t p-2", children: _jsxs(Button, { type: "button", variant: "ghost", size: "sm", className: "w-full", disabled: ledgerQuery.isFetching, onClick: () => setCursor(nextCursor), children: [ledgerQuery.isFetching ? (_jsx(Loader2, { className: "size-4 animate-spin", "aria-hidden": "true" })) : null, productMessages.activityLoadMore] }) })) : null] })) }));
+}
+function ActivityRow({ entry, timestamp, }) {
+    return (_jsxs("li", { className: "flex items-start gap-2.5 px-4 py-2.5", children: [_jsx(Activity, { className: "mt-0.5 size-3.5 shrink-0 text-muted-foreground", "aria-hidden": "true" }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-1.5", children: [_jsx("span", { className: "truncate text-xs font-medium", children: formatActionLedgerName(entry.actionName) }), _jsx(Badge, { variant: actionLedgerStatusVariant[entry.status] ?? "secondary", className: "px-1.5 py-0 text-[10px]", children: entry.status.replace(/_/g, " ") }), _jsx(Badge, { variant: actionLedgerRiskVariant[entry.evaluatedRisk] ?? "outline", className: "px-1.5 py-0 text-[10px]", children: entry.evaluatedRisk })] }), _jsxs("p", { className: "mt-0.5 truncate text-[11px] text-muted-foreground", children: [entry.principalType, ":", entry.principalId, " \u00B7 ", timestamp] }), entry.mutationSummary ? (_jsx("p", { className: "mt-0.5 truncate text-[11px] text-muted-foreground", children: entry.mutationSummary })) : null] })] }));
+}

package/dist/components/product-detail/product-day-sheet.d.ts

@@ -0,0 +1,14 @@
+import { type ProductDayRecord } from "@voyantjs/products-react";
+import type { ProductMediaUploadHandler } from "../product-media-section.js";
+export interface ProductDaySheetProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    productId: string;
+    itineraryId?: string;
+    day?: ProductDayRecord;
+    nextDayNumber?: number;
+    uploadMedia?: ProductMediaUploadHandler;
+    onSuccess?: (day: ProductDayRecord) => void;
+}
+export declare function ProductDaySheet({ open, onOpenChange, productId, itineraryId, day, nextDayNumber, uploadMedia, onSuccess, }: ProductDaySheetProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=product-day-sheet.d.ts.map

package/dist/components/product-detail/product-day-sheet.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-day-sheet.d.ts","sourceRoot":"","sources":["../../../src/components/product-detail/product-day-sheet.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,gBAAgB,EAAqC,MAAM,0BAA0B,CAAA;AAenG,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAA;AAK5E,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,GAAG,CAAC,EAAE,gBAAgB,CAAA;IACtB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,WAAW,CAAC,EAAE,yBAAyB,CAAA;IACvC,SAAS,CAAC,EAAE,CAAC,GAAG,EAAE,gBAAgB,KAAK,IAAI,CAAA;CAC5C;AAED,wBAAgB,eAAe,CAAC,EAC9B,IAAI,EACJ,YAAY,EACZ,SAAS,EACT,WAAW,EACX,GAAG,EACH,aAAa,EACb,WAAW,EACX,SAAS,GACV,EAAE,oBAAoB,2CAkLtB"}

package/dist/components/product-detail/product-day-sheet.js

@@ -0,0 +1,75 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useProduct, useProductDayMutation } from "@voyantjs/products-react";
+import { Button, Input, Label, Sheet, SheetBody, SheetContent, SheetHeader, SheetTitle, } from "@voyantjs/ui/components";
+import { Loader2 } from "lucide-react";
+import { useEffect, useState } from "react";
+import { ProductsUiMessagesProvider } from "../../i18n/index.js";
+import { ProductDayMediaTray } from "../product-day-media-tray.js";
+import { useProductDetailMessages, useProductLocale } from "./host.js";
+import { DayTranslatableField, useProductDayTranslationDrafts } from "./product-day-translation.js";
+import { ContentLanguageSwitcher, richTextHasContent } from "./product-translation-popover.js";
+export function ProductDaySheet({ open, onOpenChange, productId, itineraryId, day, nextDayNumber, uploadMedia, onSuccess, }) {
+    const messages = useProductDetailMessages();
+    const productMessages = messages.products.core;
+    const resolvedLocale = useProductLocale();
+    const isEdit = !!day;
+    const productQuery = useProduct(productId);
+    const adminBaseLocale = resolvedLocale.split("-")[0]?.toLowerCase() || "en";
+    const defaultLanguageTag = productQuery.data?.defaultLanguageTag?.trim() || adminBaseLocale;
+    const [dayNumber, setDayNumber] = useState("1");
+    const [title, setTitle] = useState("");
+    const [description, setDescription] = useState("");
+    const [location, setLocation] = useState("");
+    const [error, setError] = useState(null);
+    const dayMutation = useProductDayMutation();
+    const translations = useProductDayTranslationDrafts(productId, day?.id ?? null);
+    const [activeLanguage, setActiveLanguage] = useState(defaultLanguageTag);
+    useEffect(() => {
+        setActiveLanguage(defaultLanguageTag);
+    }, [defaultLanguageTag]);
+    // Reset the base fields whenever the sheet opens for a different day.
+    useEffect(() => {
+        if (!open)
+            return;
+        setDayNumber(String(day?.dayNumber ?? nextDayNumber ?? 1));
+        setTitle(day?.title ?? "");
+        setDescription(day?.description ?? "");
+        setLocation(day?.location ?? "");
+        setError(null);
+    }, [open, day, nextDayNumber]);
+    const isSubmitting = dayMutation.create.isPending || dayMutation.update.isPending;
+    const handleSubmit = async (event) => {
+        event.preventDefault();
+        setError(null);
+        const parsedDayNumber = Number.parseInt(dayNumber || "0", 10);
+        if (!Number.isFinite(parsedDayNumber) || parsedDayNumber < 1) {
+            setError(productMessages.dayNumberMin);
+            return;
+        }
+        const payload = {
+            dayNumber: parsedDayNumber,
+            title: title.trim() ? title.trim() : null,
+            description: richTextHasContent(description) ? description : null,
+            location: location.trim() ? location.trim() : null,
+        };
+        try {
+            const savedDay = isEdit
+                ? await dayMutation.update.mutateAsync({ productId, dayId: day.id, input: payload })
+                : await dayMutation.create.mutateAsync({ productId, itineraryId, ...payload });
+            await translations.persist(productId, savedDay.id, defaultLanguageTag);
+            onSuccess?.(savedDay);
+            onOpenChange(false);
+        }
+        catch (submissionError) {
+            setError(submissionError instanceof Error ? submissionError.message : productMessages.daySaveFailed);
+        }
+    };
+    return (_jsx(Sheet, { open: open, onOpenChange: onOpenChange, children: _jsxs(SheetContent, { side: "right", size: "lg", children: [_jsx(SheetHeader, { children: _jsx(SheetTitle, { children: isEdit ? productMessages.daySheetEditTitle : productMessages.daySheetNewTitle }) }), _jsx(SheetBody, { children: _jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-4", children: [_jsx(ContentLanguageSwitcher, { activeLanguage: activeLanguage, defaultLanguageTag: defaultLanguageTag, languageTags: translations.drafts.map((draft) => draft.languageTag), messages: productMessages, onSelect: setActiveLanguage, onAddLanguage: (code) => {
+                                    translations.addLanguage(code);
+                                    setActiveLanguage(code);
+                                }, onRemoveLanguage: (code) => {
+                                    translations.removeLanguage(code);
+                                    if (activeLanguage === code)
+                                        setActiveLanguage(defaultLanguageTag);
+                                } }), _jsxs("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2", children: [_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: "product-day-number", children: productMessages.dayNumberLabel }), _jsx(Input, { id: "product-day-number", type: "number", min: "1", required: true, value: dayNumber, onChange: (event) => setDayNumber(event.target.value) })] }), _jsx(DayTranslatableField, { field: "location", type: "text", label: productMessages.dayLocationLabel, activeLanguage: activeLanguage, defaultLanguageTag: defaultLanguageTag, base: { value: location, onChange: setLocation }, drafts: translations, messages: productMessages, placeholder: productMessages.dayLocationPlaceholder })] }), _jsx(DayTranslatableField, { field: "title", type: "text", label: productMessages.dayTitleLabel, activeLanguage: activeLanguage, defaultLanguageTag: defaultLanguageTag, base: { value: title, onChange: setTitle }, drafts: translations, messages: productMessages, placeholder: productMessages.dayTitlePlaceholder, autoFocus: true }), _jsx(DayTranslatableField, { field: "description", type: "richtext", label: productMessages.dayDescriptionLabel, activeLanguage: activeLanguage, defaultLanguageTag: defaultLanguageTag, base: { value: description, onChange: setDescription }, drafts: translations, messages: productMessages, placeholder: productMessages.dayDescriptionPlaceholder }), error ? _jsx("p", { className: "text-sm text-destructive", children: error }) : null, isEdit ? (_jsx("div", { className: "border-t pt-4", children: _jsx(ProductsUiMessagesProvider, { locale: resolvedLocale, children: _jsx(ProductDayMediaTray, { productId: productId, dayId: day.id, uploadMedia: uploadMedia }) }) })) : null, _jsxs("div", { className: "flex items-center justify-end gap-2", children: [_jsx(Button, { type: "button", variant: "ghost", onClick: () => onOpenChange(false), disabled: isSubmitting, children: productMessages.cancel }), _jsxs(Button, { type: "submit", disabled: isSubmitting, children: [isSubmitting ? (_jsx(Loader2, { className: "mr-2 size-4 animate-spin", "aria-hidden": "true" })) : null, isEdit ? productMessages.saveDay : productMessages.addDay] })] })] }) })] }) }));
+}

package/dist/components/product-detail/product-day-translation.d.ts

@@ -0,0 +1,41 @@
+import type { useProductDetailMessages } from "./host.js";
+type ProductCoreMessages = ReturnType<typeof useProductDetailMessages>["products"]["core"];
+export type DayTranslatableField = "title" | "description" | "location";
+export type DayTranslationDraft = {
+    id: string | null;
+    languageTag: string;
+    title: string;
+    description: string;
+    location: string;
+};
+export interface ProductDayTranslationDrafts {
+    drafts: DayTranslationDraft[];
+    setFieldValue: (languageTag: string, field: DayTranslatableField, value: string) => void;
+    addLanguage: (languageTag: string) => void;
+    removeLanguage: (languageTag: string) => void;
+    persist: (productId: string, dayId: string, defaultLanguageTag: string) => Promise<void>;
+}
+/**
+ * In-memory drafts for a day's translations. The default language's content
+ * lives in the base day columns (title/description/location all have base
+ * columns), so this only manages non-default-language translation rows.
+ */
+export declare function useProductDayTranslationDrafts(productId: string | null, dayId: string | null): ProductDayTranslationDrafts;
+export interface DayTranslatableFieldProps {
+    label: string;
+    type: "text" | "richtext";
+    field: DayTranslatableField;
+    activeLanguage: string;
+    defaultLanguageTag: string;
+    base: {
+        value: string;
+        onChange: (value: string) => void;
+    };
+    drafts: ProductDayTranslationDrafts;
+    messages: ProductCoreMessages;
+    placeholder?: string;
+    autoFocus?: boolean;
+}
+export declare function DayTranslatableField({ label, type, field, activeLanguage, defaultLanguageTag, base, drafts, messages, placeholder, autoFocus, }: DayTranslatableFieldProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=product-day-translation.d.ts.map

package/dist/components/product-detail/product-day-translation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-day-translation.d.ts","sourceRoot":"","sources":["../../../src/components/product-detail/product-day-translation.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,WAAW,CAAA;AAGzD,KAAK,mBAAmB,GAAG,UAAU,CAAC,OAAO,wBAAwB,CAAC,CAAC,UAAU,CAAC,CAAC,MAAM,CAAC,CAAA;AAE1F,MAAM,MAAM,oBAAoB,GAAG,OAAO,GAAG,aAAa,GAAG,UAAU,CAAA;AAEvE,MAAM,MAAM,mBAAmB,GAAG;IAChC,EAAE,EAAE,MAAM,GAAG,IAAI,CAAA;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,MAAM,CAAA;IACnB,QAAQ,EAAE,MAAM,CAAA;CACjB,CAAA;AAqBD,MAAM,WAAW,2BAA2B;IAC1C,MAAM,EAAE,mBAAmB,EAAE,CAAA;IAC7B,aAAa,EAAE,CAAC,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,oBAAoB,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACxF,WAAW,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAA;IAC1C,cAAc,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAA;IAC7C,OAAO,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,kBAAkB,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;CACzF;AAED;;;;GAIG;AACH,wBAAgB,8BAA8B,CAC5C,SAAS,EAAE,MAAM,GAAG,IAAI,EACxB,KAAK,EAAE,MAAM,GAAG,IAAI,GACnB,2BAA2B,CA2F7B;AAED,MAAM,WAAW,yBAAyB;IACxC,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,GAAG,UAAU,CAAA;IACzB,KAAK,EAAE,oBAAoB,CAAA;IAC3B,cAAc,EAAE,MAAM,CAAA;IACtB,kBAAkB,EAAE,MAAM,CAAA;IAC1B,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;KAAE,CAAA;IAC1D,MAAM,EAAE,2BAA2B,CAAA;IACnC,QAAQ,EAAE,mBAAmB,CAAA;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB;AAED,wBAAgB,oBAAoB,CAAC,EACnC,KAAK,EACL,IAAI,EACJ,KAAK,EACL,cAAc,EACd,kBAAkB,EAClB,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,WAAW,EACX,SAAS,GACV,EAAE,yBAAyB,2CAmC3B"}

package/dist/components/product-detail/product-day-translation.js

@@ -0,0 +1,111 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useProductDayTranslationMutation, useProductDayTranslations, } from "@voyantjs/products-react";
+import { Input, Label } from "@voyantjs/ui/components";
+import { RichTextEditor } from "@voyantjs/ui/components/rich-text-editor";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { richTextHasContent, TranslationIndicator } from "./product-translation-popover.js";
+function recordToDraft(record) {
+    return {
+        id: record.id,
+        languageTag: record.languageTag,
+        title: record.title ?? "",
+        description: record.description ?? "",
+        location: record.location ?? "",
+    };
+}
+function emptyDraft(languageTag) {
+    return { id: null, languageTag, title: "", description: "", location: "" };
+}
+function fieldHasContent(draft, field) {
+    if (field === "description")
+        return richTextHasContent(draft.description);
+    return draft[field].trim().length > 0;
+}
+/**
+ * In-memory drafts for a day's translations. The default language's content
+ * lives in the base day columns (title/description/location all have base
+ * columns), so this only manages non-default-language translation rows.
+ */
+export function useProductDayTranslationDrafts(productId, dayId) {
+    const query = useProductDayTranslations(productId ?? undefined, dayId ?? undefined, {
+        enabled: !!productId && !!dayId,
+    });
+    const mutations = useProductDayTranslationMutation();
+    const [drafts, setDrafts] = useState([]);
+    const seededKey = useRef(null);
+    const existingRef = useRef([]);
+    useEffect(() => {
+        const key = `${productId ?? ""}:${dayId ?? "__new__"}`;
+        if (productId && dayId && query.isPending)
+            return;
+        if (seededKey.current === key)
+            return;
+        const records = query.data?.data ?? [];
+        existingRef.current = records;
+        setDrafts(records.map(recordToDraft));
+        seededKey.current = key;
+    }, [productId, dayId, query.isPending, query.data]);
+    const setFieldValue = useCallback((languageTag, field, value) => {
+        setDrafts((prev) => {
+            if (prev.some((draft) => draft.languageTag === languageTag)) {
+                return prev.map((draft) => draft.languageTag === languageTag ? { ...draft, [field]: value } : draft);
+            }
+            return [...prev, { ...emptyDraft(languageTag), [field]: value }];
+        });
+    }, []);
+    const addLanguage = useCallback((languageTag) => {
+        setDrafts((prev) => prev.some((draft) => draft.languageTag === languageTag)
+            ? prev
+            : [...prev, emptyDraft(languageTag)]);
+    }, []);
+    const removeLanguage = useCallback((languageTag) => {
+        setDrafts((prev) => prev.filter((draft) => draft.languageTag !== languageTag));
+    }, []);
+    const persist = useCallback(async (resolvedProductId, resolvedDayId, defaultLanguageTag) => {
+        const original = existingRef.current;
+        const nonDefault = drafts.filter((draft) => draft.languageTag !== defaultLanguageTag);
+        const currentLanguages = new Set(nonDefault.map((draft) => draft.languageTag));
+        const deletes = original
+            .filter((record) => !currentLanguages.has(record.languageTag))
+            .map((record) => mutations.remove.mutateAsync({
+            productId: resolvedProductId,
+            dayId: resolvedDayId,
+            translationId: record.id,
+        }));
+        const upserts = nonDefault.map((draft) => {
+            const title = draft.title.trim() ? draft.title.trim() : null;
+            const description = richTextHasContent(draft.description) ? draft.description : null;
+            const location = draft.location.trim() ? draft.location.trim() : null;
+            if (draft.id) {
+                return mutations.update.mutateAsync({
+                    productId: resolvedProductId,
+                    dayId: resolvedDayId,
+                    translationId: draft.id,
+                    input: { title, description, location },
+                });
+            }
+            if (!title && !description && !location)
+                return Promise.resolve(null);
+            return mutations.create.mutateAsync({
+                productId: resolvedProductId,
+                dayId: resolvedDayId,
+                input: { languageTag: draft.languageTag, title, description, location },
+            });
+        });
+        await Promise.all([...deletes, ...upserts]);
+        seededKey.current = null;
+    }, [drafts, mutations]);
+    return { drafts, setFieldValue, addLanguage, removeLanguage, persist };
+}
+export function DayTranslatableField({ label, type, field, activeLanguage, defaultLanguageTag, base, drafts, messages, placeholder, autoFocus, }) {
+    const usesBase = activeLanguage === defaultLanguageTag;
+    const activeDraft = drafts.drafts.find((draft) => draft.languageTag === activeLanguage);
+    const value = usesBase ? base.value : (activeDraft?.[field] ?? "");
+    const handleChange = usesBase
+        ? base.onChange
+        : (next) => drafts.setFieldValue(activeLanguage, field, next);
+    const translatedLanguages = drafts.drafts
+        .filter((draft) => draft.languageTag !== defaultLanguageTag && fieldHasContent(draft, field))
+        .map((draft) => draft.languageTag);
+    return (_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx(Label, { children: label }), _jsx(TranslationIndicator, { languages: translatedLanguages, messages: messages })] }), type === "richtext" ? (_jsx(RichTextEditor, { value: value, onChange: handleChange, placeholder: placeholder, editorClassName: "max-h-[320px] overflow-y-auto" })) : (_jsx(Input, { value: value, onChange: (event) => handleChange(event.target.value), placeholder: placeholder, autoFocus: autoFocus }))] }));
+}

package/dist/components/product-detail/product-departure-dialog.d.ts

@@ -0,0 +1,11 @@
+import { type DepartureSlot } from "./product-departure-form.js";
+export type { DepartureSlot };
+type DepartureDialogProps = {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    productId: string;
+    slot?: DepartureSlot;
+    onSuccess: () => void;
+};
+export declare function DepartureDialog({ open, onOpenChange, productId, slot, onSuccess, }: DepartureDialogProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=product-departure-dialog.d.ts.map

package/dist/components/product-detail/product-departure-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-departure-dialog.d.ts","sourceRoot":"","sources":["../../../src/components/product-detail/product-departure-dialog.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAiB,KAAK,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAE/E,YAAY,EAAE,aAAa,EAAE,CAAA;AAE7B,KAAK,oBAAoB,GAAG;IAC1B,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,SAAS,EAAE,MAAM,CAAA;IACjB,IAAI,CAAC,EAAE,aAAa,CAAA;IACpB,SAAS,EAAE,MAAM,IAAI,CAAA;CACtB,CAAA;AAED,wBAAgB,eAAe,CAAC,EAC9B,IAAI,EACJ,YAAY,EACZ,SAAS,EACT,IAAI,EACJ,SAAS,GACV,EAAE,oBAAoB,2CAwBtB"}

package/dist/components/product-detail/product-departure-dialog.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Sheet, SheetBody, SheetContent, SheetHeader, SheetTitle } from "@voyantjs/ui/components";
+import { useProductDetailMessages } from "./host.js";
+import { DepartureForm } from "./product-departure-form.js";
+export function DepartureDialog({ open, onOpenChange, productId, slot, onSuccess, }) {
+    const messages = useProductDetailMessages();
+    const departureMessages = messages.products.operations.departures;
+    const isEditing = !!slot;
+    return (_jsx(Sheet, { open: open, onOpenChange: onOpenChange, children: _jsxs(SheetContent, { side: "right", size: "lg", children: [_jsx(SheetHeader, { children: _jsx(SheetTitle, { children: isEditing ? departureMessages.editTitle : departureMessages.newTitle }) }), _jsx(SheetBody, { children: _jsx(DepartureForm, { productId: productId, slot: slot, onSuccess: onSuccess, onCancel: () => onOpenChange(false) }) })] }) }));
+}