@conversokit/widgets 0.1.0

package/dist/CTABanner.js

@@ -0,0 +1,72 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { z } from 'zod';
+import { defaultWidgetConfig } from '@conversokit/shared';
+function bgFor(variant) {
+    switch (variant) {
+        case 'primary':
+            return 'var(--ck-primary)';
+        case 'success':
+            return 'var(--ck-success)';
+        case 'danger':
+            return 'var(--ck-danger)';
+        default:
+            return 'var(--ck-surface)';
+    }
+}
+function fgFor(variant) {
+    switch (variant) {
+        case 'primary':
+        case 'success':
+        case 'danger':
+            return 'white';
+        default:
+            return 'var(--ck-text)';
+    }
+}
+export const CTABanner = ({ title, description, primaryLabel, secondaryLabel, onPrimary, onSecondary, variant = 'info' }) => {
+    const bg = bgFor(variant);
+    const fg = fgFor(variant);
+    return (_jsxs("div", { role: "region", style: {
+            backgroundColor: bg,
+            color: fg,
+            border: '1px solid var(--ck-border)',
+            borderRadius: 'var(--ck-radius-md)',
+            padding: 'var(--ck-spacing-4)',
+            fontFamily: 'var(--ck-font-family)',
+            display: 'flex',
+            flexDirection: 'column',
+            gap: 'var(--ck-spacing-1)'
+        }, "data-testid": "cta-banner", children: [_jsx("strong", { style: { fontSize: 'var(--ck-font-size-lg)' }, children: title }), description && (_jsx("p", { style: { margin: 0, fontSize: 'var(--ck-font-size-sm)', opacity: 0.9 }, children: description })), (primaryLabel || secondaryLabel) && (_jsxs("div", { style: { display: 'flex', gap: 'var(--ck-spacing-2)', marginTop: 'var(--ck-spacing-2)' }, children: [primaryLabel && (_jsx("button", { type: "button", onClick: onPrimary, style: {
+                            padding: '8px 14px',
+                            borderRadius: 'var(--ck-radius-sm)',
+                            border: 'none',
+                            backgroundColor: variant === 'info' ? 'var(--ck-primary)' : 'white',
+                            color: variant === 'info' ? 'var(--ck-primary-foreground)' : bg,
+                            cursor: 'pointer',
+                            fontWeight: 'var(--ck-font-weight-bold)'
+                        }, children: primaryLabel })), secondaryLabel && (_jsx("button", { type: "button", onClick: onSecondary, style: {
+                            padding: '8px 14px',
+                            borderRadius: 'var(--ck-radius-sm)',
+                            border: '1px solid currentColor',
+                            backgroundColor: 'transparent',
+                            color: fg,
+                            cursor: 'pointer'
+                        }, children: secondaryLabel }))] }))] }));
+};
+export const ctaBannerSchema = z.object({
+    title: z.string(),
+    description: z.string().optional(),
+    primaryLabel: z.string().optional(),
+    secondaryLabel: z.string().optional(),
+    variant: z.enum(['info', 'primary', 'success', 'danger']).optional()
+});
+export const CTABannerMeta = {
+    name: 'CTABanner',
+    category: 'core',
+    version: '0.1.0',
+    config: {
+        ...defaultWidgetConfig,
+        permissions: { allowsExternalLinks: true }
+    },
+    schema: ctaBannerSchema
+};

package/dist/CheckoutSummary.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { type CheckoutSummary as CheckoutSummaryData, type WidgetMeta } from '@conversokit/shared';
+export interface CheckoutSummaryProps {
+    summary: CheckoutSummaryData;
+    ctaLabel?: string;
+    onCheckout?: () => void;
+    onBack?: () => void;
+}
+export declare const CheckoutSummary: React.FC<CheckoutSummaryProps>;
+export declare const CheckoutSummaryMeta: WidgetMeta;
+//# sourceMappingURL=CheckoutSummary.d.ts.map

package/dist/CheckoutSummary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckoutSummary.d.ts","sourceRoot":"","sources":["../src/CheckoutSummary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAGL,KAAK,eAAe,IAAI,mBAAmB,EAC3C,KAAK,UAAU,EAChB,MAAM,qBAAqB,CAAC;AAE7B,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,mBAAmB,CAAC;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AA4DD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA+C1D,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,UAajC,CAAC"}

package/dist/CheckoutSummary.js

@@ -0,0 +1,70 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { checkoutSummarySchema, defaultWidgetConfig } from '@conversokit/shared';
+const containerStyle = {
+    border: '1px solid var(--ck-border)',
+    borderRadius: 'var(--ck-radius-md)',
+    padding: 'var(--ck-spacing-4)',
+    backgroundColor: 'var(--ck-surface)',
+    color: 'var(--ck-text)',
+    fontFamily: 'var(--ck-font-family)',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 'var(--ck-spacing-2)',
+    maxWidth: 480
+};
+const rowStyle = {
+    display: 'flex',
+    justifyContent: 'space-between',
+    fontSize: 'var(--ck-font-size-sm)'
+};
+const lineItemStyle = {
+    ...rowStyle,
+    paddingBottom: 'var(--ck-spacing-1)',
+    borderBottom: '1px dashed var(--ck-border)'
+};
+const totalStyle = {
+    ...rowStyle,
+    fontSize: 'var(--ck-font-size-lg)',
+    fontWeight: 'var(--ck-font-weight-bold)',
+    marginTop: 'var(--ck-spacing-2)'
+};
+const buttonRow = {
+    display: 'flex',
+    gap: 'var(--ck-spacing-2)',
+    marginTop: 'var(--ck-spacing-2)'
+};
+const primaryBtn = {
+    flex: 1,
+    padding: '10px 14px',
+    borderRadius: 'var(--ck-radius-sm)',
+    border: 'none',
+    backgroundColor: 'var(--ck-primary)',
+    color: 'var(--ck-primary-foreground)',
+    cursor: 'pointer',
+    fontWeight: 'var(--ck-font-weight-bold)'
+};
+const secondaryBtn = {
+    padding: '10px 14px',
+    borderRadius: 'var(--ck-radius-sm)',
+    border: '1px solid var(--ck-border)',
+    backgroundColor: 'transparent',
+    color: 'var(--ck-text)',
+    cursor: 'pointer'
+};
+export const CheckoutSummary = ({ summary, ctaLabel = 'Checkout', onCheckout, onBack }) => {
+    return (_jsxs("div", { style: containerStyle, "data-testid": "checkout-summary", children: [_jsx("h3", { style: { margin: 0 }, children: "Order summary" }), summary.items.map((item) => (_jsxs("div", { style: lineItemStyle, children: [_jsxs("span", { children: [item.title, " \u00D7 ", item.quantity] }), _jsx("span", { children: item.price ?? '—' })] }, item.id))), summary.taxes && (_jsxs("div", { style: rowStyle, children: [_jsx("span", { style: { color: 'var(--ck-muted)' }, children: "Taxes" }), _jsx("span", { children: summary.taxes })] })), summary.shipping && (_jsxs("div", { style: rowStyle, children: [_jsx("span", { style: { color: 'var(--ck-muted)' }, children: "Shipping" }), _jsx("span", { children: summary.shipping })] })), _jsxs("div", { style: totalStyle, children: [_jsx("span", { children: "Total" }), _jsx("span", { children: summary.total })] }), _jsxs("div", { style: buttonRow, children: [onBack && (_jsx("button", { type: "button", style: secondaryBtn, onClick: onBack, children: "Back" })), onCheckout && (_jsx("button", { type: "button", style: primaryBtn, onClick: onCheckout, children: ctaLabel }))] })] }));
+};
+export const CheckoutSummaryMeta = {
+    name: 'CheckoutSummary',
+    category: 'commerce',
+    version: '0.1.0',
+    config: {
+        ...defaultWidgetConfig,
+        permissions: {
+            collectPersonalData: false,
+            requiresConsent: true,
+            allowsExternalLinks: true
+        }
+    },
+    schema: checkoutSummarySchema
+};

package/dist/ConsentBanner.d.ts

@@ -0,0 +1,30 @@
+import React from 'react';
+import { z } from 'zod';
+import { type ConsentRecord, type ConsentScope, type WidgetMeta } from '@conversokit/shared';
+export interface ConsentBannerProps {
+    scopes: ConsentScope[];
+    privacyUrl?: string;
+    termsUrl?: string;
+    message?: string;
+    onAccept?: (record: ConsentRecord) => void;
+    children: React.ReactNode;
+}
+export declare const ConsentBanner: React.FC<ConsentBannerProps>;
+export declare const consentBannerSchema: z.ZodObject<{
+    scopes: z.ZodArray<z.ZodString, "many">;
+    privacyUrl: z.ZodOptional<z.ZodString>;
+    termsUrl: z.ZodOptional<z.ZodString>;
+    message: z.ZodOptional<z.ZodString>;
+}, "strip", z.ZodTypeAny, {
+    scopes: string[];
+    message?: string | undefined;
+    privacyUrl?: string | undefined;
+    termsUrl?: string | undefined;
+}, {
+    scopes: string[];
+    message?: string | undefined;
+    privacyUrl?: string | undefined;
+    termsUrl?: string | undefined;
+}>;
+export declare const ConsentBannerMeta: WidgetMeta;
+//# sourceMappingURL=ConsentBanner.d.ts.map

package/dist/ConsentBanner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConsentBanner.d.ts","sourceRoot":"","sources":["../src/ConsentBanner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AACxB,OAAO,EAGL,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,UAAU,EAChB,MAAM,qBAAqB,CAAC;AAoB7B,MAAM,WAAW,kBAAkB;IACjC,MAAM,EAAE,YAAY,EAAE,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,KAAK,IAAI,CAAC;IAC3C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAiFtD,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;EAK9B,CAAC;AAEH,eAAO,MAAM,iBAAiB,EAAE,UAa/B,CAAC"}

package/dist/ConsentBanner.js

@@ -0,0 +1,82 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { z } from 'zod';
+import { consentRecordSchema, defaultWidgetConfig } from '@conversokit/shared';
+const STORAGE_KEY = 'conversokit:consent';
+function readStored() {
+    if (typeof window === 'undefined')
+        return null;
+    try {
+        const raw = window.sessionStorage.getItem(STORAGE_KEY);
+        if (!raw)
+            return null;
+        return consentRecordSchema.parse(JSON.parse(raw));
+    }
+    catch {
+        return null;
+    }
+}
+function writeStored(record) {
+    if (typeof window === 'undefined')
+        return;
+    window.sessionStorage.setItem(STORAGE_KEY, JSON.stringify(record));
+}
+export const ConsentBanner = ({ scopes, privacyUrl, termsUrl, message = 'This app may collect personal data to provide the requested experience.', onAccept, children }) => {
+    const [record, setRecord] = useState(() => readStored());
+    useEffect(() => {
+        if (record && onAccept)
+            onAccept(record);
+    }, [record, onAccept]);
+    if (record)
+        return _jsx(_Fragment, { children: children });
+    const handleAccept = () => {
+        const next = {
+            scopes,
+            acceptedAt: new Date().toISOString()
+        };
+        writeStored(next);
+        setRecord(next);
+    };
+    return (_jsxs("div", { role: "dialog", "aria-live": "polite", style: {
+            position: 'fixed',
+            inset: 'auto 16px 16px 16px',
+            zIndex: 9999,
+            backgroundColor: 'var(--ck-surface)',
+            color: 'var(--ck-text)',
+            border: '1px solid var(--ck-border)',
+            borderRadius: 'var(--ck-radius-md)',
+            padding: 'var(--ck-spacing-4)',
+            boxShadow: '0 10px 25px rgba(0,0,0,0.1)',
+            display: 'flex',
+            flexDirection: 'column',
+            gap: 'var(--ck-spacing-2)'
+        }, children: [_jsx("p", { style: { margin: 0, fontSize: 'var(--ck-font-size-sm)' }, children: message }), _jsxs("p", { style: { margin: 0, fontSize: 'var(--ck-font-size-sm)', color: 'var(--ck-muted)' }, children: ["Scopes: ", scopes.join(', '), privacyUrl && (_jsxs(_Fragment, { children: [' · ', _jsx("a", { href: privacyUrl, target: "_blank", rel: "noreferrer", children: "Privacy" })] })), termsUrl && (_jsxs(_Fragment, { children: [' · ', _jsx("a", { href: termsUrl, target: "_blank", rel: "noreferrer", children: "Terms" })] }))] }), _jsx("button", { type: "button", onClick: handleAccept, style: {
+                    alignSelf: 'flex-start',
+                    padding: '6px 14px',
+                    borderRadius: 'var(--ck-radius-sm)',
+                    border: 'none',
+                    backgroundColor: 'var(--ck-primary)',
+                    color: 'var(--ck-primary-foreground)',
+                    cursor: 'pointer'
+                }, children: "Accept and continue" })] }));
+};
+export const consentBannerSchema = z.object({
+    scopes: z.array(z.string()),
+    privacyUrl: z.string().url().optional(),
+    termsUrl: z.string().url().optional(),
+    message: z.string().optional()
+});
+export const ConsentBannerMeta = {
+    name: 'ConsentBanner',
+    category: 'core',
+    version: '0.1.0',
+    config: {
+        ...defaultWidgetConfig,
+        permissions: {
+            collectPersonalData: false,
+            requiresConsent: false,
+            allowsExternalLinks: true
+        }
+    },
+    schema: consentBannerSchema
+};

package/dist/DestinationRecommendations.d.ts

@@ -0,0 +1,57 @@
+import React from 'react';
+import { z } from 'zod';
+import { type Destination, type WidgetMeta } from '@conversokit/shared';
+export interface DestinationRecommendationsProps {
+    destinations: Destination[];
+    onSelect?: (destination: Destination) => void;
+}
+export declare const DestinationRecommendations: React.FC<DestinationRecommendationsProps>;
+export declare const destinationRecommendationsSchema: z.ZodObject<{
+    destinations: z.ZodArray<z.ZodObject<{
+        id: z.ZodString;
+        name: z.ZodString;
+        country: z.ZodOptional<z.ZodString>;
+        imageUrl: z.ZodOptional<z.ZodString>;
+        tagline: z.ZodOptional<z.ZodString>;
+        bestSeason: z.ZodOptional<z.ZodString>;
+        averagePrice: z.ZodOptional<z.ZodString>;
+    }, "strip", z.ZodTypeAny, {
+        id: string;
+        name: string;
+        imageUrl?: string | undefined;
+        country?: string | undefined;
+        tagline?: string | undefined;
+        bestSeason?: string | undefined;
+        averagePrice?: string | undefined;
+    }, {
+        id: string;
+        name: string;
+        imageUrl?: string | undefined;
+        country?: string | undefined;
+        tagline?: string | undefined;
+        bestSeason?: string | undefined;
+        averagePrice?: string | undefined;
+    }>, "many">;
+}, "strip", z.ZodTypeAny, {
+    destinations: {
+        id: string;
+        name: string;
+        imageUrl?: string | undefined;
+        country?: string | undefined;
+        tagline?: string | undefined;
+        bestSeason?: string | undefined;
+        averagePrice?: string | undefined;
+    }[];
+}, {
+    destinations: {
+        id: string;
+        name: string;
+        imageUrl?: string | undefined;
+        country?: string | undefined;
+        tagline?: string | undefined;
+        bestSeason?: string | undefined;
+        averagePrice?: string | undefined;
+    }[];
+}>;
+export declare const DestinationRecommendationsMeta: WidgetMeta;
+//# sourceMappingURL=DestinationRecommendations.d.ts.map

package/dist/DestinationRecommendations.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DestinationRecommendations.d.ts","sourceRoot":"","sources":["../src/DestinationRecommendations.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AACxB,OAAO,EAGL,KAAK,WAAW,EAChB,KAAK,UAAU,EAChB,MAAM,qBAAqB,CAAC;AAE7B,MAAM,WAAW,+BAA+B;IAC9C,YAAY,EAAE,WAAW,EAAE,CAAC;IAC5B,QAAQ,CAAC,EAAE,CAAC,WAAW,EAAE,WAAW,KAAK,IAAI,CAAC;CAC/C;AAED,eAAO,MAAM,0BAA0B,EAAE,KAAK,CAAC,EAAE,CAAC,+BAA+B,CA8EhF,CAAC;AAEF,eAAO,MAAM,gCAAgC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAE3C,CAAC;AAEH,eAAO,MAAM,8BAA8B,EAAE,UAM5C,CAAC"}

package/dist/DestinationRecommendations.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { z } from 'zod';
+import { defaultWidgetConfig, destinationSchema } from '@conversokit/shared';
+export const DestinationRecommendations = ({ destinations, onSelect }) => {
+    return (_jsx("div", { "data-testid": "destination-recommendations", style: {
+            display: 'grid',
+            gridTemplateColumns: 'repeat(auto-fill, minmax(220px, 1fr))',
+            gap: 'var(--ck-spacing-2)',
+            fontFamily: 'var(--ck-font-family)'
+        }, children: destinations.map((dest) => (_jsxs("button", { type: "button", onClick: () => onSelect?.(dest), style: {
+                textAlign: 'left',
+                cursor: onSelect ? 'pointer' : 'default',
+                border: '1px solid var(--ck-border)',
+                borderRadius: 'var(--ck-radius-md)',
+                backgroundColor: 'var(--ck-surface)',
+                color: 'var(--ck-text)',
+                padding: 0,
+                overflow: 'hidden',
+                display: 'flex',
+                flexDirection: 'column'
+            }, children: [dest.imageUrl && (_jsx("img", { src: dest.imageUrl, alt: dest.name, style: { width: '100%', height: 120, objectFit: 'cover' } })), _jsxs("div", { style: {
+                        padding: 'var(--ck-spacing-3)',
+                        display: 'flex',
+                        flexDirection: 'column',
+                        gap: 4
+                    }, children: [_jsx("strong", { children: dest.name }), dest.country && (_jsx("span", { style: {
+                                fontSize: 'var(--ck-font-size-sm)',
+                                color: 'var(--ck-muted)'
+                            }, children: dest.country })), dest.tagline && (_jsx("span", { style: { fontSize: 'var(--ck-font-size-sm)' }, children: dest.tagline })), (dest.bestSeason || dest.averagePrice) && (_jsx("span", { style: {
+                                fontSize: 'var(--ck-font-size-sm)',
+                                color: 'var(--ck-muted)'
+                            }, children: [dest.bestSeason, dest.averagePrice].filter(Boolean).join(' · ') }))] })] }, dest.id))) }));
+};
+export const destinationRecommendationsSchema = z.object({
+    destinations: z.array(destinationSchema)
+});
+export const DestinationRecommendationsMeta = {
+    name: 'DestinationRecommendations',
+    category: 'travel',
+    version: '0.1.0',
+    config: { ...defaultWidgetConfig, permissions: {} },
+    schema: destinationRecommendationsSchema
+};

package/dist/FlightSummary.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { type FlightSummary as FlightSummaryData, type WidgetMeta } from '@conversokit/shared';
+export interface FlightSummaryProps {
+    flight: FlightSummaryData;
+    onAction?: (flight: FlightSummaryData) => void;
+    ctaLabel?: string;
+}
+export declare const FlightSummary: React.FC<FlightSummaryProps>;
+export declare const FlightSummaryMeta: WidgetMeta;
+//# sourceMappingURL=FlightSummary.d.ts.map

package/dist/FlightSummary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FlightSummary.d.ts","sourceRoot":"","sources":["../src/FlightSummary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAIL,KAAK,aAAa,IAAI,iBAAiB,EACvC,KAAK,UAAU,EAChB,MAAM,qBAAqB,CAAC;AAE7B,MAAM,WAAW,kBAAkB;IACjC,MAAM,EAAE,iBAAiB,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC/C,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAoCD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA0DtD,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,UAM/B,CAAC"}

package/dist/FlightSummary.js

@@ -0,0 +1,50 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { format } from 'date-fns';
+import { defaultWidgetConfig, flightSummarySchema } from '@conversokit/shared';
+const LegRow = ({ leg, label }) => (_jsxs("div", { style: {
+        display: 'flex',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        padding: 'var(--ck-spacing-2) 0',
+        borderBottom: '1px dashed var(--ck-border)',
+        gap: 'var(--ck-spacing-2)'
+    }, children: [_jsxs("div", { children: [_jsxs("div", { style: { fontSize: 'var(--ck-font-size-sm)', color: 'var(--ck-muted)' }, children: [label, " \u00B7 ", leg.airline, " ", leg.flightNumber] }), _jsxs("div", { style: {
+                        fontSize: 'var(--ck-font-size-lg)',
+                        fontWeight: 'var(--ck-font-weight-bold)'
+                    }, children: [leg.origin, " \u2192 ", leg.destination] })] }), _jsxs("div", { style: { textAlign: 'right', fontSize: 'var(--ck-font-size-sm)' }, children: [_jsx("div", { children: format(new Date(leg.departsAt), 'MMM d, HH:mm') }), _jsxs("div", { style: { color: 'var(--ck-muted)' }, children: ["arr ", format(new Date(leg.arrivesAt), 'HH:mm'), leg.durationMinutes ? ` · ${Math.round(leg.durationMinutes / 60)}h ${leg.durationMinutes % 60}m` : ''] })] })] }));
+export const FlightSummary = ({ flight, onAction, ctaLabel = 'Select flight' }) => {
+    return (_jsxs("div", { "data-testid": "flight-summary", style: {
+            border: '1px solid var(--ck-border)',
+            borderRadius: 'var(--ck-radius-md)',
+            backgroundColor: 'var(--ck-surface)',
+            color: 'var(--ck-text)',
+            fontFamily: 'var(--ck-font-family)',
+            padding: 'var(--ck-spacing-4)',
+            maxWidth: 480,
+            display: 'flex',
+            flexDirection: 'column',
+            gap: 'var(--ck-spacing-1)'
+        }, children: [_jsx(LegRow, { leg: flight.outbound, label: "Outbound" }), flight.return && _jsx(LegRow, { leg: flight.return, label: "Return" }), _jsxs("div", { style: {
+                    display: 'flex',
+                    justifyContent: 'space-between',
+                    alignItems: 'center',
+                    marginTop: 'var(--ck-spacing-2)'
+                }, children: [_jsxs("span", { style: { color: 'var(--ck-muted)', fontSize: 'var(--ck-font-size-sm)' }, children: [flight.bookingClass ?? 'Economy', typeof flight.stops === 'number'
+                                ? ` · ${flight.stops === 0 ? 'Nonstop' : `${flight.stops} stop${flight.stops > 1 ? 's' : ''}`}`
+                                : ''] }), _jsx("strong", { style: { fontSize: 'var(--ck-font-size-lg)' }, children: flight.price })] }), onAction && (_jsx("button", { type: "button", onClick: () => onAction(flight), style: {
+                    marginTop: 'var(--ck-spacing-2)',
+                    padding: '8px 12px',
+                    borderRadius: 'var(--ck-radius-sm)',
+                    border: 'none',
+                    backgroundColor: 'var(--ck-primary)',
+                    color: 'var(--ck-primary-foreground)',
+                    cursor: 'pointer'
+                }, children: ctaLabel }))] }));
+};
+export const FlightSummaryMeta = {
+    name: 'FlightSummary',
+    category: 'travel',
+    version: '0.1.0',
+    config: { ...defaultWidgetConfig, permissions: {} },
+    schema: flightSummarySchema
+};

package/dist/HotelCard.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { type Hotel, type WidgetMeta } from '@conversokit/shared';
+export interface HotelCardProps {
+    hotel: Hotel;
+    ctaLabel?: string;
+    onAction?: (hotel: Hotel) => void;
+}
+export declare const HotelCard: React.FC<HotelCardProps>;
+export declare const HotelCardMeta: WidgetMeta;
+//# sourceMappingURL=HotelCard.d.ts.map

package/dist/HotelCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HotelCard.d.ts","sourceRoot":"","sources":["../src/HotelCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAGL,KAAK,KAAK,EACV,KAAK,UAAU,EAChB,MAAM,qBAAqB,CAAC;AAE7B,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;CACnC;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAkG9C,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,UAS3B,CAAC"}

package/dist/HotelCard.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { defaultWidgetConfig, hotelSchema } from '@conversokit/shared';
+export const HotelCard = ({ hotel, ctaLabel = 'Book', onAction }) => {
+    return (_jsxs("div", { "data-testid": "hotel-card", style: {
+            border: '1px solid var(--ck-border)',
+            borderRadius: 'var(--ck-radius-md)',
+            backgroundColor: 'var(--ck-surface)',
+            color: 'var(--ck-text)',
+            fontFamily: 'var(--ck-font-family)',
+            width: 280,
+            overflow: 'hidden',
+            display: 'flex',
+            flexDirection: 'column'
+        }, children: [hotel.imageUrl && (_jsx("img", { src: hotel.imageUrl, alt: hotel.name, style: { width: '100%', height: 160, objectFit: 'cover' } })), _jsxs("div", { style: {
+                    padding: 'var(--ck-spacing-4)',
+                    display: 'flex',
+                    flexDirection: 'column',
+                    gap: 'var(--ck-spacing-1)'
+                }, children: [_jsx("strong", { style: { fontSize: 'var(--ck-font-size-lg)' }, children: hotel.name }), _jsxs("span", { style: { color: 'var(--ck-muted)', fontSize: 'var(--ck-font-size-sm)' }, children: [hotel.city, hotel.country ? `, ${hotel.country}` : ''] }), hotel.rating !== undefined && (_jsxs("span", { style: { fontSize: 'var(--ck-font-size-sm)' }, children: ["\u2B50 ", hotel.rating.toFixed(1)] })), hotel.amenities && hotel.amenities.length > 0 && (_jsx("div", { style: {
+                            display: 'flex',
+                            flexWrap: 'wrap',
+                            gap: 4,
+                            marginTop: 'var(--ck-spacing-1)'
+                        }, children: hotel.amenities.map((a) => (_jsx("span", { style: {
+                                fontSize: 'var(--ck-font-size-sm)',
+                                border: '1px solid var(--ck-border)',
+                                borderRadius: 'var(--ck-radius-sm)',
+                                padding: '2px 6px',
+                                color: 'var(--ck-muted)'
+                            }, children: a }, a))) })), _jsxs("span", { style: {
+                            marginTop: 'var(--ck-spacing-2)',
+                            fontWeight: 'var(--ck-font-weight-bold)'
+                        }, children: [hotel.pricePerNight, " ", _jsx("span", { style: { color: 'var(--ck-muted)', fontWeight: 400 }, children: "/ night" })] }), onAction && (_jsx("button", { type: "button", onClick: () => onAction(hotel), style: {
+                            marginTop: 'var(--ck-spacing-2)',
+                            padding: '8px 12px',
+                            borderRadius: 'var(--ck-radius-sm)',
+                            border: 'none',
+                            backgroundColor: 'var(--ck-primary)',
+                            color: 'var(--ck-primary-foreground)',
+                            cursor: 'pointer'
+                        }, children: ctaLabel }))] })] }));
+};
+export const HotelCardMeta = {
+    name: 'HotelCard',
+    category: 'travel',
+    version: '0.1.0',
+    config: {
+        ...defaultWidgetConfig,
+        permissions: { allowsExternalLinks: true }
+    },
+    schema: hotelSchema
+};

package/dist/ItineraryTimeline.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { type Itinerary, type WidgetMeta } from '@conversokit/shared';
+export interface ItineraryTimelineProps {
+    itinerary: Itinerary;
+}
+export declare const ItineraryTimeline: React.FC<ItineraryTimelineProps>;
+export declare const ItineraryTimelineMeta: WidgetMeta;
+//# sourceMappingURL=ItineraryTimeline.d.ts.map

package/dist/ItineraryTimeline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ItineraryTimeline.d.ts","sourceRoot":"","sources":["../src/ItineraryTimeline.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAGL,KAAK,SAAS,EAEd,KAAK,UAAU,EAChB,MAAM,qBAAqB,CAAC;AAE7B,MAAM,WAAW,sBAAsB;IACrC,SAAS,EAAE,SAAS,CAAC;CACtB;AASD,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA2F9D,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,UAMnC,CAAC"}

package/dist/ItineraryTimeline.js

@@ -0,0 +1,56 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { format } from 'date-fns';
+import { defaultWidgetConfig, itinerarySchema } from '@conversokit/shared';
+const KIND_ICON = {
+    flight: '✈️',
+    hotel: '🏨',
+    activity: '🎟️',
+    transfer: '🚕'
+};
+export const ItineraryTimeline = ({ itinerary }) => {
+    return (_jsxs("div", { "data-testid": "itinerary-timeline", style: {
+            border: '1px solid var(--ck-border)',
+            borderRadius: 'var(--ck-radius-md)',
+            backgroundColor: 'var(--ck-surface)',
+            color: 'var(--ck-text)',
+            fontFamily: 'var(--ck-font-family)',
+            padding: 'var(--ck-spacing-4)',
+            maxWidth: 520
+        }, children: [_jsx("h3", { style: { margin: 0, marginBottom: 'var(--ck-spacing-2)' }, children: itinerary.title }), _jsx("ol", { style: {
+                    listStyle: 'none',
+                    margin: 0,
+                    padding: 0,
+                    display: 'flex',
+                    flexDirection: 'column',
+                    gap: 'var(--ck-spacing-2)'
+                }, children: itinerary.stops.map((stop, idx) => (_jsxs("li", { style: {
+                        display: 'grid',
+                        gridTemplateColumns: '24px 1fr',
+                        gap: 'var(--ck-spacing-2)',
+                        alignItems: 'flex-start'
+                    }, children: [_jsxs("div", { "aria-hidden": true, style: {
+                                width: 24,
+                                textAlign: 'center',
+                                position: 'relative',
+                                paddingTop: 2
+                            }, children: [_jsx("span", { children: stop.kind ? KIND_ICON[stop.kind] : '•' }), idx < itinerary.stops.length - 1 && (_jsx("div", { style: {
+                                        width: 1,
+                                        height: 28,
+                                        backgroundColor: 'var(--ck-border)',
+                                        margin: '4px auto 0'
+                                    } }))] }), _jsxs("div", { children: [_jsx("div", { style: {
+                                        fontWeight: 'var(--ck-font-weight-bold)'
+                                    }, children: stop.title }), _jsxs("div", { style: {
+                                        fontSize: 'var(--ck-font-size-sm)',
+                                        color: 'var(--ck-muted)'
+                                    }, children: [format(new Date(stop.startsAt), 'EEE MMM d, HH:mm'), stop.endsAt
+                                            ? ` — ${format(new Date(stop.endsAt), 'HH:mm')}`
+                                            : '', stop.location ? ` · ${stop.location}` : ''] }), stop.description && (_jsx("p", { style: { margin: '4px 0 0', fontSize: 'var(--ck-font-size-sm)' }, children: stop.description }))] })] }, stop.id))) })] }));
+};
+export const ItineraryTimelineMeta = {
+    name: 'ItineraryTimeline',
+    category: 'travel',
+    version: '0.1.0',
+    config: { ...defaultWidgetConfig, permissions: {} },
+    schema: itinerarySchema
+};

package/dist/KPIGrid.d.ts

@@ -0,0 +1,46 @@
+import React from 'react';
+import { z } from 'zod';
+import { type KPI, type WidgetMeta } from '@conversokit/shared';
+export interface KPIGridProps {
+    kpis: KPI[];
+}
+export declare const KPIGrid: React.FC<KPIGridProps>;
+export declare const kpiGridSchema: z.ZodObject<{
+    kpis: z.ZodArray<z.ZodObject<{
+        id: z.ZodString;
+        label: z.ZodString;
+        value: z.ZodString;
+        delta: z.ZodOptional<z.ZodNumber>;
+        trend: z.ZodOptional<z.ZodEnum<["up", "down", "flat"]>>;
+    }, "strip", z.ZodTypeAny, {
+        value: string;
+        id: string;
+        label: string;
+        delta?: number | undefined;
+        trend?: "flat" | "up" | "down" | undefined;
+    }, {
+        value: string;
+        id: string;
+        label: string;
+        delta?: number | undefined;
+        trend?: "flat" | "up" | "down" | undefined;
+    }>, "many">;
+}, "strip", z.ZodTypeAny, {
+    kpis: {
+        value: string;
+        id: string;
+        label: string;
+        delta?: number | undefined;
+        trend?: "flat" | "up" | "down" | undefined;
+    }[];
+}, {
+    kpis: {
+        value: string;
+        id: string;
+        label: string;
+        delta?: number | undefined;
+        trend?: "flat" | "up" | "down" | undefined;
+    }[];
+}>;
+export declare const KPIGridMeta: WidgetMeta;
+//# sourceMappingURL=KPIGrid.d.ts.map

package/dist/KPIGrid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"KPIGrid.d.ts","sourceRoot":"","sources":["../src/KPIGrid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AACxB,OAAO,EAGL,KAAK,GAAG,EACR,KAAK,UAAU,EAChB,MAAM,qBAAqB,CAAC;AAE7B,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,GAAG,EAAE,CAAC;CACb;AAcD,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAsD1C,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAAyC,CAAC;AAEpE,eAAO,MAAM,WAAW,EAAE,UAMzB,CAAC"}