@repzo/widget-react-native 1.0.0

package/lib/commonjs/ui/components/AgentUiBlocks.js

@@ -0,0 +1,864 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AgentUiBlocks = AgentUiBlocks;
+exports.formatDate = formatDate;
+exports.formatMoney = formatMoney;
+exports.formatTime = formatTime;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _theme = require("../styles/theme.js");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * Renders agent-authored rich blocks (product cards, slot pickers, lead forms,
+ * quotes, receipts) and posts the visitor's choice back through
+ * `POST /api/widget/messages` as an `agentUiAction`.
+ * Port of `client/src/widget/components/AgentUiBlocks.tsx`.
+ */
+
+const DEFAULT_BLOCK_LABELS = {
+  service: 'Service',
+  product: 'Product',
+  chooseTime: 'Choose a time',
+  professional: 'Professional',
+  priceOffer: 'Price offer',
+  working: 'Working...'
+};
+const BlockLabelContext = /*#__PURE__*/(0, _react.createContext)(DEFAULT_BLOCK_LABELS);
+function AgentUiBlocks({
+  blocks,
+  color,
+  labels = DEFAULT_BLOCK_LABELS,
+  onAction
+}) {
+  const [selectedVariants, setSelectedVariants] = (0, _react.useState)({});
+  const [consents, setConsents] = (0, _react.useState)({});
+  const [values, setValues] = (0, _react.useState)({});
+  const [selectedSlots, setSelectedSlots] = (0, _react.useState)({});
+  const [pending, setPending] = (0, _react.useState)(null);
+  const requiredConsent = blocks.filter(block => block.type === 'consent' && block.required);
+  const consentGranted = requiredConsent.every(block => consents[block.id]);
+  const act = async action => {
+    if (pending) return;
+    const productId = typeof action.payload.productId === 'string' ? action.payload.productId : undefined;
+    const nextAction = productId && selectedVariants[productId] ? {
+      ...action,
+      payload: {
+        ...action.payload,
+        variantId: selectedVariants[productId]
+      }
+    } : action;
+    setPending(action.id);
+    try {
+      await onAction(nextAction);
+    } finally {
+      setPending(null);
+    }
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(BlockLabelContext.Provider, {
+    value: labels,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: styles.stack,
+      children: blocks.map(block => {
+        if (block.type === 'product_service_card') {
+          return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+            style: styles.card,
+            children: [block.product.imageUrl ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Image, {
+              source: {
+                uri: block.product.imageUrl
+              },
+              style: styles.cardImage,
+              resizeMode: "cover",
+              accessibilityIgnoresInvertColors: true
+            }) : null, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+              style: styles.cardBody,
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+                style: styles.rowStart,
+                children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+                  style: styles.flexMin,
+                  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                    style: styles.title,
+                    children: block.product.name
+                  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                    style: styles.description,
+                    children: block.product.shortDescription || block.product.description || ''
+                  })]
+                }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Badge, {
+                  label: block.product.type === 'service' ? labels.service : labels.product
+                })]
+              }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+                style: styles.row,
+                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                  style: styles.muted,
+                  children: block.product.durationMinutes ? `${block.product.durationMinutes} min` : block.product.unit || ''
+                }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                  style: styles.price,
+                  children: formatMoney(block.product.price, block.product.currency)
+                })]
+              })]
+            })]
+          }, block.id);
+        }
+        if (block.type === 'product_choices') {
+          const selected = selectedVariants[block.productId] || block.variants.find(variant => variant.available)?.id || '';
+          return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+            style: [styles.card, styles.cardPadded],
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+              style: styles.title,
+              children: block.title
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+              style: styles.chipRow,
+              children: block.variants.map(variant => /*#__PURE__*/(0, _jsxRuntime.jsx)(Chip, {
+                selected: selected === variant.id,
+                disabled: !variant.available,
+                color: color,
+                onPress: () => setSelectedVariants(current => ({
+                  ...current,
+                  [block.productId]: variant.id
+                })),
+                label: variant.title,
+                sublabel: formatMoney(variant.price, variant.currency)
+              }, variant.id))
+            })]
+          }, block.id);
+        }
+        if (block.type === 'commerce_actions') {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+            style: styles.actionRow,
+            children: block.actions.map((action, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+              style: styles.actionCell,
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ActionButton, {
+                color: color,
+                secondary: index === 0 && block.actions.length > 1,
+                pending: pending === action.id,
+                onPress: () => act(action),
+                children: action.label
+              })
+            }, action.id))
+          }, block.id);
+        }
+        if (block.type === 'cart_order_summary') {
+          return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+            style: [styles.card, styles.cardPadded],
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+              style: styles.rowStart,
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                style: styles.title,
+                children: block.title
+              }), block.status ? /*#__PURE__*/(0, _jsxRuntime.jsx)(Badge, {
+                label: block.status
+              }) : null]
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+              style: styles.itemList,
+              children: block.items.map((item, index) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+                style: styles.row,
+                children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+                  style: styles.flexMin,
+                  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                    style: styles.itemName,
+                    children: item.name
+                  }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
+                    style: styles.muted,
+                    children: [item.quantity, " \xD7 ", formatMoney(item.unitPrice, block.currency)]
+                  })]
+                }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                  style: styles.itemTotal,
+                  children: formatMoney(item.lineTotal, block.currency)
+                })]
+              }, `${item.name}:${index}`))
+            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+              style: styles.totals,
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(MoneyRow, {
+                label: "Subtotal",
+                value: formatMoney(block.subtotal, block.currency)
+              }), block.discount ? /*#__PURE__*/(0, _jsxRuntime.jsx)(MoneyRow, {
+                label: "Discount",
+                value: `−${formatMoney(block.discount, block.currency)}`
+              }) : null, block.tax ? /*#__PURE__*/(0, _jsxRuntime.jsx)(MoneyRow, {
+                label: "Tax",
+                value: formatMoney(block.tax, block.currency)
+              }) : null, block.shipping ? /*#__PURE__*/(0, _jsxRuntime.jsx)(MoneyRow, {
+                label: "Shipping",
+                value: formatMoney(block.shipping, block.currency)
+              }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(MoneyRow, {
+                label: "Total",
+                value: formatMoney(block.total, block.currency),
+                strong: true
+              })]
+            }), block.action ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+              style: styles.blockAction,
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ActionButton, {
+                color: color,
+                pending: pending === block.action.id,
+                onPress: () => block.action && act(block.action),
+                children: block.action.label
+              })
+            }) : null]
+          }, block.id);
+        }
+        if (block.type === 'contact_lead_form') {
+          const complete = block.fields.every(field => !field.required || (values[`${block.id}:${field.name}`] ?? field.value ?? '').trim());
+          return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+            style: [styles.card, styles.cardPadded],
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+              style: styles.title,
+              children: block.title
+            }), block.description ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+              style: styles.description,
+              children: block.description
+            }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+              style: styles.fieldStack,
+              children: block.fields.map(field => {
+                const id = `${block.id}:${field.name}`;
+                return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TextInput, {
+                  value: values[id] ?? field.value ?? '',
+                  onChangeText: text => setValues(current => ({
+                    ...current,
+                    [id]: text
+                  })),
+                  placeholder: field.placeholder || field.label,
+                  placeholderTextColor: _theme.palette.textSubtle,
+                  accessibilityLabel: field.label,
+                  keyboardType: keyboardTypeFor(field.type),
+                  autoCapitalize: field.type === 'email' ? 'none' : 'sentences',
+                  multiline: field.type === 'textarea',
+                  style: [styles.input, field.type === 'textarea' && styles.textarea]
+                }, id);
+              })
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+              style: styles.blockAction,
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ActionButton, {
+                color: color,
+                disabled: !complete || !consentGranted,
+                pending: pending === `submit:${block.id}`,
+                onPress: () => act({
+                  id: `submit:${block.id}`,
+                  type: 'submit_contact',
+                  label: block.submitLabel,
+                  module: block.module,
+                  payload: Object.fromEntries(block.fields.map(field => [field.name, values[`${block.id}:${field.name}`] || field.value || '']))
+                }),
+                children: block.submitLabel
+              })
+            })]
+          }, block.id);
+        }
+        if (block.type === 'consent') {
+          const checked = consents[block.id] || false;
+          return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+            style: [styles.card, styles.cardPadded],
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Pressable, {
+              onPress: () => setConsents(current => ({
+                ...current,
+                [block.id]: !checked
+              })),
+              accessibilityRole: "checkbox",
+              accessibilityState: {
+                checked
+              },
+              style: styles.consentRow,
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+                style: [styles.checkbox, checked && {
+                  backgroundColor: color,
+                  borderColor: color
+                }],
+                children: checked ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                  style: styles.checkmark,
+                  children: "\u2713"
+                }) : null
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                style: styles.consentText,
+                children: block.statement
+              })]
+            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+              style: [styles.row, styles.blockAction],
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+                style: styles.chipRow,
+                children: block.channels.map(channel => /*#__PURE__*/(0, _jsxRuntime.jsx)(Badge, {
+                  label: channel
+                }, channel))
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
+                disabled: !checked || pending !== null,
+                onPress: () => act({
+                  id: `consent:${block.id}`,
+                  type: 'record_consent',
+                  label: 'Save consent',
+                  module: 'contacts',
+                  payload: {
+                    channels: block.channels,
+                    consent: true,
+                    statement: block.statement
+                  }
+                }),
+                hitSlop: 8,
+                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                  style: [styles.linkButton, {
+                    color: checked ? color : _theme.palette.textSubtle
+                  }],
+                  children: "Save"
+                })
+              })]
+            })]
+          }, block.id);
+        }
+        if (block.type === 'appointment_slot_picker') {
+          const selected = selectedSlots[block.id] || '';
+          const selectedSlot = block.days.flatMap(day => day.slots.map(slot => ({
+            ...slot,
+            date: day.date
+          }))).find(slot => `${slot.date}:${slot.startTime}` === selected);
+          const providerById = new Map(block.providers.map(provider => [provider.id, provider]));
+          const selectedProvider = selectedSlot?.staffUserId ? providerById.get(selectedSlot.staffUserId) : undefined;
+          const activeProviderId = block.selectedProviderId || 'any';
+          return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+            style: [styles.card, styles.cardPadded],
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+              style: styles.title,
+              children: labels.chooseTime
+            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
+              style: styles.description,
+              children: [block.serviceName, " \xB7 ", block.durationMinutes, " min", block.timezone ? ` · ${block.timezone}` : '']
+            }), block.providers.length > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+              style: styles.section,
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                style: styles.sectionLabel,
+                children: labels.professional
+              }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+                style: styles.chipRow,
+                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Chip, {
+                  selected: activeProviderId === 'any',
+                  color: color,
+                  disabled: pending !== null,
+                  label: "Any available",
+                  onPress: () => activeProviderId !== 'any' && act({
+                    id: `provider:${block.serviceId}:any`,
+                    type: 'select_appointment_provider',
+                    label: 'Choose any professional',
+                    module: 'appointments',
+                    payload: {
+                      serviceId: block.serviceId,
+                      serviceName: block.serviceName,
+                      durationMinutes: block.durationMinutes,
+                      locationId: block.locationId,
+                      providerName: 'any available professional'
+                    }
+                  })
+                }), block.providers.map(provider => /*#__PURE__*/(0, _jsxRuntime.jsx)(Chip, {
+                  selected: activeProviderId === provider.id,
+                  color: color,
+                  disabled: pending !== null,
+                  label: provider.name,
+                  onPress: () => activeProviderId !== provider.id && act({
+                    id: `provider:${block.serviceId}:${provider.id}`,
+                    type: 'select_appointment_provider',
+                    label: `Choose ${provider.name}`,
+                    module: 'appointments',
+                    payload: {
+                      serviceId: block.serviceId,
+                      serviceName: block.serviceName,
+                      durationMinutes: block.durationMinutes,
+                      locationId: block.locationId,
+                      providerId: provider.id,
+                      providerName: provider.name
+                    }
+                  })
+                }, provider.id))]
+              })]
+            }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+              style: styles.section,
+              children: block.days.map(day => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+                style: styles.day,
+                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                  style: styles.sectionLabel,
+                  children: formatDate(day.date)
+                }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+                  style: styles.chipRow,
+                  children: day.slots.map(slot => {
+                    const value = `${day.date}:${slot.startTime}`;
+                    return /*#__PURE__*/(0, _jsxRuntime.jsx)(Chip, {
+                      selected: selected === value,
+                      color: color,
+                      label: formatTime(slot.startTime),
+                      onPress: () => setSelectedSlots(current => ({
+                        ...current,
+                        [block.id]: value
+                      }))
+                    }, value);
+                  })
+                })]
+              }, day.date))
+            }), selectedProvider ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
+              style: [styles.muted, styles.blockAction],
+              children: ["With ", selectedProvider.name]
+            }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+              style: styles.blockAction,
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ActionButton, {
+                color: color,
+                disabled: !selectedSlot,
+                pending: pending?.startsWith(`book:${block.serviceId}`) || false,
+                onPress: () => selectedSlot && act({
+                  id: `book:${block.serviceId}:${selected}`,
+                  type: 'select_appointment_slot',
+                  label: 'Book this time',
+                  module: 'appointments',
+                  payload: {
+                    serviceId: block.serviceId,
+                    serviceName: block.serviceName,
+                    durationMinutes: block.durationMinutes,
+                    date: selectedSlot.date,
+                    startTime: selectedSlot.startTime,
+                    endTime: selectedSlot.endTime,
+                    userId: selectedSlot.staffUserId,
+                    slotToken: selectedSlot.slotToken,
+                    providerName: selectedProvider?.name
+                  }
+                }),
+                children: "Book this time"
+              })
+            })]
+          }, block.id);
+        }
+        if (block.type === 'quote_preview') {
+          const publicActions = block.actions.filter(action => action.type !== 'open_record');
+          return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+            style: [styles.card, styles.cardPadded],
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+              style: styles.rowStart,
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+                style: styles.flexMin,
+                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                  style: styles.title,
+                  children: block.name
+                }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
+                  style: styles.description,
+                  children: [block.serialNumber || labels.priceOffer, block.contactName ? ` · ${block.contactName}` : '']
+                })]
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Badge, {
+                label: block.status
+              })]
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+              style: styles.amount,
+              children: formatMoney(block.amount, block.currency)
+            }), block.validUntil ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
+              style: styles.muted,
+              children: ["Valid until ", formatDate(block.validUntil.slice(0, 10))]
+            }) : null, publicActions.map(action => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+              style: styles.blockAction,
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ActionButton, {
+                color: color,
+                pending: pending === action.id,
+                onPress: () => act(action),
+                children: action.label
+              })
+            }, action.id))]
+          }, block.id);
+        }
+
+        // success_receipt
+        return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+          style: [styles.card, styles.cardPadded],
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+            style: styles.rowStart,
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+              style: [styles.checkGlyph, {
+                color
+              }],
+              children: "\u2713"
+            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+              style: styles.flexMin,
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                style: styles.title,
+                children: block.title
+              }), block.description ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                style: styles.description,
+                children: block.description
+              }) : null]
+            })]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+            style: [styles.row, styles.blockAction],
+            children: [block.reference ? /*#__PURE__*/(0, _jsxRuntime.jsx)(Badge, {
+              label: block.reference
+            }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {}), block.amount != null && block.currency ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+              style: styles.itemTotal,
+              children: formatMoney(block.amount, block.currency)
+            }) : null]
+          }), block.nextActions.filter(action => action.type !== 'open_record').map(action => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+            style: styles.blockAction,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ActionButton, {
+              color: color,
+              pending: pending === action.id,
+              onPress: () => act(action),
+              children: action.label
+            })
+          }, action.id))]
+        }, block.id);
+      })
+    })
+  });
+}
+function ActionButton({
+  children,
+  color,
+  secondary = false,
+  pending = false,
+  disabled = false,
+  onPress
+}) {
+  const labels = (0, _react.useContext)(BlockLabelContext);
+  const inactive = disabled || pending;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
+    disabled: inactive,
+    onPress: onPress,
+    accessibilityRole: "button",
+    style: ({
+      pressed
+    }) => [styles.actionButton, secondary ? {
+      borderColor: color,
+      backgroundColor: _theme.palette.white
+    } : {
+      backgroundColor: color
+    }, inactive && styles.actionButtonDisabled, pressed && styles.pressed],
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+      style: [styles.actionButtonLabel, {
+        color: inactive ? _theme.palette.white : secondary ? color : _theme.palette.white
+      }],
+      children: pending ? labels.working : children
+    })
+  });
+}
+function Chip({
+  label,
+  sublabel,
+  selected,
+  disabled = false,
+  color,
+  onPress
+}) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Pressable, {
+    disabled: disabled,
+    onPress: onPress,
+    accessibilityRole: "button",
+    accessibilityState: {
+      selected,
+      disabled
+    },
+    style: [styles.chip, {
+      borderColor: selected ? color : _theme.palette.disabled,
+      backgroundColor: selected ? (0, _theme.withAlpha)(color, 0.07) : _theme.palette.white
+    }, disabled && styles.chipDisabled],
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+      style: [styles.chipLabel, {
+        color: selected ? color : '#374151'
+      }],
+      children: label
+    }), sublabel ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+      style: styles.chipSublabel,
+      children: sublabel
+    }) : null]
+  });
+}
+function Badge({
+  label
+}) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    style: styles.badge,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+      style: styles.badgeLabel,
+      numberOfLines: 1,
+      children: label
+    })
+  });
+}
+function MoneyRow({
+  label,
+  value,
+  strong = false
+}) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+    style: styles.row,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+      style: [styles.moneyLabel, strong && styles.moneyStrong],
+      children: label
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+      style: [styles.moneyLabel, strong && styles.moneyStrong],
+      children: value
+    })]
+  });
+}
+function keyboardTypeFor(type) {
+  if (type === 'email') return 'email-address';
+  if (type === 'phone') return 'phone-pad';
+  return 'default';
+}
+function formatMoney(amount, currency) {
+  // Blocks are validated upstream; this is the last line against a bad value.
+  const value = typeof amount === 'number' && Number.isFinite(amount) ? amount : 0;
+  try {
+    return new Intl.NumberFormat(undefined, {
+      style: 'currency',
+      currency
+    }).format(value);
+  } catch {
+    return `${value.toFixed(2)} ${currency ?? ''}`.trim();
+  }
+}
+function formatDate(date) {
+  const parsed = new Date(`${date}T12:00:00`);
+  if (Number.isNaN(parsed.getTime())) return date;
+  try {
+    return new Intl.DateTimeFormat(undefined, {
+      weekday: 'short',
+      month: 'short',
+      day: 'numeric'
+    }).format(parsed);
+  } catch {
+    return date;
+  }
+}
+function formatTime(time) {
+  const [hour, minute] = time.split(':').map(Number);
+  try {
+    return new Intl.DateTimeFormat(undefined, {
+      hour: 'numeric',
+      minute: '2-digit'
+    }).format(new Date(2000, 0, 1, hour ?? 0, minute ?? 0));
+  } catch {
+    return time;
+  }
+}
+const cardStyle = {
+  overflow: 'hidden',
+  borderWidth: _reactNative.StyleSheet.hairlineWidth,
+  borderColor: _theme.palette.border,
+  borderRadius: _theme.radius.xl,
+  backgroundColor: _theme.palette.white,
+  ..._theme.shadows.card
+};
+const styles = _reactNative.StyleSheet.create({
+  stack: {
+    width: '100%',
+    maxWidth: 350,
+    gap: _theme.spacing.sm,
+    marginTop: _theme.spacing.sm
+  },
+  card: cardStyle,
+  cardPadded: {
+    padding: _theme.spacing.md
+  },
+  cardBody: {
+    gap: _theme.spacing.sm + 2,
+    padding: _theme.spacing.md
+  },
+  cardImage: {
+    width: '100%',
+    aspectRatio: 16 / 7
+  },
+  row: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    gap: _theme.spacing.sm + 2
+  },
+  rowStart: {
+    flexDirection: 'row',
+    alignItems: 'flex-start',
+    justifyContent: 'space-between',
+    gap: _theme.spacing.sm + 2
+  },
+  flexMin: {
+    flex: 1,
+    minWidth: 0
+  },
+  title: {
+    fontSize: _theme.fontSize.body,
+    lineHeight: _theme.fontSize.body * 1.3,
+    fontWeight: '600',
+    color: _theme.palette.text
+  },
+  description: {
+    fontSize: _theme.fontSize.meta,
+    lineHeight: _theme.fontSize.meta * 1.45,
+    color: _theme.palette.textMuted,
+    marginTop: 3
+  },
+  muted: {
+    fontSize: _theme.fontSize.caption,
+    color: _theme.palette.textMuted
+  },
+  price: {
+    fontSize: _theme.fontSize.title,
+    fontWeight: '600',
+    color: _theme.palette.text
+  },
+  amount: {
+    fontSize: _theme.fontSize.heading,
+    fontWeight: '700',
+    color: _theme.palette.text,
+    marginTop: _theme.spacing.sm + 2
+  },
+  badge: {
+    borderWidth: _reactNative.StyleSheet.hairlineWidth,
+    borderColor: _theme.palette.border,
+    borderRadius: _theme.radius.pill,
+    paddingHorizontal: 7,
+    paddingVertical: 3,
+    backgroundColor: _theme.palette.surface
+  },
+  badgeLabel: {
+    fontSize: _theme.fontSize.caption - 1,
+    color: '#4b5563'
+  },
+  chipRow: {
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    gap: _theme.spacing.xs + 2,
+    marginTop: _theme.spacing.sm
+  },
+  chip: {
+    borderWidth: 1,
+    borderRadius: _theme.radius.md,
+    paddingHorizontal: _theme.spacing.md,
+    paddingVertical: _theme.spacing.sm,
+    minHeight: 40,
+    justifyContent: 'center'
+  },
+  chipDisabled: {
+    opacity: 0.45
+  },
+  chipLabel: {
+    fontSize: _theme.fontSize.meta,
+    fontWeight: '600'
+  },
+  chipSublabel: {
+    fontSize: _theme.fontSize.caption - 1,
+    opacity: 0.75,
+    marginTop: 2
+  },
+  actionRow: {
+    flexDirection: 'row',
+    gap: _theme.spacing.sm
+  },
+  actionCell: {
+    flex: 1
+  },
+  actionButton: {
+    width: '100%',
+    borderWidth: 1,
+    borderColor: 'transparent',
+    borderRadius: _theme.radius.md,
+    paddingVertical: _theme.spacing.md,
+    paddingHorizontal: _theme.spacing.md,
+    alignItems: 'center',
+    justifyContent: 'center',
+    minHeight: 44
+  },
+  actionButtonDisabled: {
+    backgroundColor: _theme.palette.disabled,
+    borderColor: _theme.palette.disabled
+  },
+  actionButtonLabel: {
+    fontSize: _theme.fontSize.meta,
+    fontWeight: '600'
+  },
+  pressed: {
+    opacity: 0.85
+  },
+  blockAction: {
+    marginTop: _theme.spacing.sm + 2
+  },
+  itemList: {
+    gap: _theme.spacing.sm,
+    marginTop: _theme.spacing.sm + 2
+  },
+  itemName: {
+    fontSize: _theme.fontSize.meta,
+    fontWeight: '600',
+    color: _theme.palette.text
+  },
+  itemTotal: {
+    fontSize: _theme.fontSize.meta,
+    fontWeight: '600',
+    color: _theme.palette.text
+  },
+  totals: {
+    borderTopWidth: _reactNative.StyleSheet.hairlineWidth,
+    borderTopColor: _theme.palette.border,
+    marginTop: _theme.spacing.sm + 2,
+    paddingTop: _theme.spacing.sm + 2,
+    gap: 5
+  },
+  moneyLabel: {
+    fontSize: _theme.fontSize.meta,
+    color: _theme.palette.text
+  },
+  moneyStrong: {
+    fontWeight: '700'
+  },
+  fieldStack: {
+    gap: _theme.spacing.sm,
+    marginTop: _theme.spacing.sm + 2
+  },
+  input: {
+    borderWidth: _reactNative.StyleSheet.hairlineWidth,
+    borderColor: _theme.palette.disabled,
+    borderRadius: _theme.radius.md,
+    paddingHorizontal: _theme.spacing.md,
+    paddingVertical: _theme.spacing.sm + 2,
+    fontSize: _theme.fontSize.input,
+    color: _theme.palette.text,
+    backgroundColor: _theme.palette.white,
+    minHeight: 44
+  },
+  textarea: {
+    minHeight: 84,
+    textAlignVertical: 'top'
+  },
+  consentRow: {
+    flexDirection: 'row',
+    alignItems: 'flex-start',
+    gap: _theme.spacing.sm
+  },
+  checkbox: {
+    width: 22,
+    height: 22,
+    borderRadius: 6,
+    borderWidth: 1.5,
+    borderColor: _theme.palette.disabled,
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  checkmark: {
+    color: _theme.palette.white,
+    fontSize: _theme.fontSize.meta,
+    fontWeight: '700'
+  },
+  consentText: {
+    flex: 1,
+    fontSize: _theme.fontSize.meta,
+    lineHeight: _theme.fontSize.meta * 1.45,
+    color: _theme.palette.text
+  },
+  linkButton: {
+    fontSize: _theme.fontSize.meta,
+    fontWeight: '600',
+    padding: _theme.spacing.xs
+  },
+  section: {
+    marginTop: _theme.spacing.sm + 2
+  },
+  sectionLabel: {
+    fontSize: _theme.fontSize.caption,
+    fontWeight: '600',
+    color: _theme.palette.text
+  },
+  day: {
+    marginTop: _theme.spacing.sm + 2
+  },
+  checkGlyph: {
+    fontSize: _theme.fontSize.title,
+    fontWeight: '700'
+  }
+});
+//# sourceMappingURL=AgentUiBlocks.js.map