pixelon 0.3.80 → 0.3.82

package/dist/components/atoms/lumi/Icon/Icon.d.ts

@@ -42,6 +42,7 @@ export declare const LUMI_ICON_TYPES: {
     readonly MAP_PIN: "map-pin";
     readonly USER_X: "user-x";
     readonly REFRESH: "refresh";
+    readonly TRUCK: "truck";
     readonly MESSAGE_SQUARE: "message-square";
     readonly MESSAGE_CIRCLE: "message-circle";
     readonly MAP: "map";

package/dist/components/atoms/lumi/Select/Select.d.ts

@@ -5,6 +5,12 @@ export interface SelectOption {
     label: string;
     disabled?: boolean;
     icon?: ReactNode;
+    /** SPEC-104: segunda línea, en gris y más pequeña. Para el PORQUÉ de la opción —quién la lleva,
+     *  a qué distancia, si hay algún aviso— sin que compita con su nombre. */
+    sublabel?: string;
+    /** SPEC-104: icono por nombre del set de lumi. Existe además de `icon` porque las opciones que
+     *  llegan de un endpoint son JSON y no pueden traer un nodo de React. */
+    iconName?: string;
 }
 /** Tipo de valor según el modo */
 export type SelectValue = string | number | (string | number)[];

package/dist/components/molecules/chat/StructuredContent/components/ReactiveCrud/optionsLoader.d.ts

@@ -1,6 +1,7 @@
 import type { SelectOption } from '../../../../../organisms/lumi/DynamicForm/types';
 import type { ChatEventBus } from '../../../../../../core/eventBus/chatEventBus';
 import type { CrudFieldOptionsEndpoint } from './types';
+export declare const OPTIONS_LOAD_ERROR = "No se pudieron cargar las opciones. Int\u00E9ntalo de nuevo.";
 export declare function unwrap(raw: unknown): unknown;
 export declare function resolveBody(body: Record<string, unknown> | undefined, ctx?: Record<string, unknown>): Record<string, unknown>;
 export declare function loadOptions(eventBus: ChatEventBus, ep: CrudFieldOptionsEndpoint, ctx?: Record<string, unknown>): Promise<SelectOption[]>;

package/dist/components/molecules/chat/StructuredContent/components/ReactiveCrud/types.d.ts

@@ -89,7 +89,13 @@ export interface RowActionDef {
     label: string;
     icon?: string;
     intent?: 'primary' | 'secondary' | 'danger';
-    visibleWhen?: RowActionVisibleWhen;
+    /** SPEC-103: una condición, o VARIAS unidas por «y». */
+    visibleWhen?: RowActionVisibleWhen | RowActionVisibleWhen[];
+    /** SPEC-103: la excepción. Si se cumplen TODAS, la acción no se muestra aunque `visibleWhen` dé
+     * por buena la fila. Es para las reglas con forma de «se ve en estos estados, salvo este caso»
+     * —p.ej. asignar grúa en PENDING_APPROVAL, salvo si quien pide es un invitado que todavía no ha
+     * aceptado el precio—, que con condiciones unidas por «y» no se pueden escribir. */
+    hiddenWhen?: RowActionVisibleWhen | RowActionVisibleWhen[];
     /** SPEC-007: la acción se muestra pero queda DESHABILITADA cuando `String(row[field])` está en
      * `in` (ej. "Iniciar" deshabilitado hasta que `has_inspection` sea true). */
     disabledWhen?: RowActionVisibleWhen;

package/dist/components/organisms/lumi/DynamicForm/types.d.ts

@@ -10,6 +10,10 @@ export interface SelectOption {
     value: string | number;
     label: string;
     disabled?: boolean;
+    /** SPEC-104: segunda línea en gris — el porqué de la opción, sin competir con su nombre. */
+    sublabel?: string;
+    /** SPEC-104: nombre de icono del set de lumi (no un nodo: esto viaja como JSON desde el backend). */
+    iconName?: string;
 }
 /**
  * Configuración de un campo del formulario

package/dist/index.esm.js

@@ -5739,6 +5739,9 @@ const LUMI_ICON_TYPES = {
   // Iconos para Agenda
   USER_X: "user-x",
   REFRESH: "refresh",
+  // SPEC-104 — grúas: el selector de despacho necesitaba distinguir de un vistazo qué es cada
+  // opción, y no había ningún icono de vehículo en el set.
+  TRUCK: "truck",
   // Iconos para Chat
   MESSAGE_SQUARE: "message-square",
   MESSAGE_CIRCLE: "message-circle",
@@ -6449,6 +6452,27 @@ const BuildingIcon = (props) => /* @__PURE__ */ jsxs(
     ]
   }
 );
+const TruckIcon = (props) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("path", { d: "M2 17V8h10v9" }),
+      /* @__PURE__ */ jsx("path", { d: "M12 11h4l3 3v3" }),
+      /* @__PURE__ */ jsx("circle", { cx: "7", cy: "18", r: "2" }),
+      /* @__PURE__ */ jsx("circle", { cx: "17", cy: "18", r: "2" }),
+      /* @__PURE__ */ jsx("path", { d: "M9 18h6" })
+    ]
+  }
+);
 const MapPinIcon = (props) => /* @__PURE__ */ jsxs(
   "svg",
   {
@@ -6567,6 +6591,7 @@ const lumiIconMap = {
   // Iconos para Servicios
   [LUMI_ICON_TYPES.BUILDING]: BuildingIcon,
   [LUMI_ICON_TYPES.MAP_PIN]: MapPinIcon,
+  [LUMI_ICON_TYPES.TRUCK]: TruckIcon,
   // Iconos para Agenda
   [LUMI_ICON_TYPES.USER_X]: UserXIcon,
   [LUMI_ICON_TYPES.REFRESH]: RefreshIcon,
@@ -7738,8 +7763,11 @@ const Select$1 = forwardRef(
                                 `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__checkbox`,
                                 isSelected && `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__checkbox--checked`
                               ].filter(Boolean).join(" "), children: isSelected && /* @__PURE__ */ jsx(Icon, { type: LUMI_ICON_TYPES.CHECK, size: "small" }) }) }),
-                              option.icon && /* @__PURE__ */ jsx("span", { className: `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__option-icon`, children: option.icon }),
-                              /* @__PURE__ */ jsx("span", { className: `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__option-label`, children: option.label }),
+                              (option.icon || option.iconName) && /* @__PURE__ */ jsx("span", { className: `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__option-icon`, children: option.icon ?? /* @__PURE__ */ jsx(Icon, { type: option.iconName }) }),
+                              /* @__PURE__ */ jsxs("span", { className: `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__option-texts`, children: [
+                                /* @__PURE__ */ jsx("span", { className: `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__option-label`, children: option.label }),
+                                option.sublabel && /* @__PURE__ */ jsx("span", { className: `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__option-sublabel`, children: option.sublabel })
+                              ] }),
                               mode === "single" && isSelected && /* @__PURE__ */ jsx("span", { className: `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__option-check`, children: /* @__PURE__ */ jsx(Icon, { type: LUMI_ICON_TYPES.CHECK, size: "small" }) })
                             ]
                           },
@@ -14083,6 +14111,7 @@ function getFormatter(key) {
   return key ? CRUD_FORMATTERS[key] : void 0;
 }
 
+const OPTIONS_LOAD_ERROR = "No se pudieron cargar las opciones. Int\xE9ntalo de nuevo.";
 function unwrap$3(raw) {
   if (raw && typeof raw === "object" && "response" in raw) {
     return raw.response;
@@ -14111,7 +14140,9 @@ async function loadOptions(eventBus, ep, ctx) {
   const arr = Array.isArray(data) ? data : [];
   return arr.map((item) => ({
     value: String(item[ep.value_field] ?? ""),
-    label: String(item[ep.label_field] ?? "")
+    label: String(item[ep.label_field] ?? ""),
+    ...item.sublabel ? { sublabel: String(item.sublabel) } : {},
+    ...item.icon ? { iconName: String(item.icon) } : {}
   }));
 }
 
@@ -14418,6 +14449,7 @@ function ActionFormDrawer({ action, row, idField, eventBus, onExecute, onClose }
   const fileFields = useMemo(() => formFields.filter((f) => f.moleculeType === "FILE"), [formFields]);
   const normalFields = useMemo(() => formFields.filter((f) => f.moleculeType !== "FILE"), [formFields]);
   const [optionsByField, setOptionsByField] = useState({});
+  const [optionsErrorByField, setOptionsErrorByField] = useState({});
   const [loadingOptions, setLoadingOptions] = useState(false);
   const [submitting, setSubmitting] = useState(false);
   const [fileEntries, setFileEntries] = useState({});
@@ -14431,14 +14463,17 @@ function ActionFormDrawer({ action, row, idField, eventBus, onExecute, onClose }
       toLoad.map(async (f) => {
         try {
           const opts = await loadOptions(eventBus, f.optionsEndpoint, { ...row, id: row[idField] });
-          return [f.name, opts];
+          return [f.name, opts, null];
         } catch {
-          return [f.name, []];
+          return [f.name, [], OPTIONS_LOAD_ERROR];
         }
       })
     ).then((entries) => {
       if (!alive) return;
-      setOptionsByField(Object.fromEntries(entries));
+      setOptionsByField(Object.fromEntries(entries.map(([n, o]) => [n, o])));
+      setOptionsErrorByField(
+        Object.fromEntries(entries.filter(([, , e]) => e).map(([n, , e]) => [n, e]))
+      );
       setLoadingOptions(false);
     });
     return () => {
@@ -14452,9 +14487,12 @@ function ActionFormDrawer({ action, row, idField, eventBus, onExecute, onClose }
       moleculeType: CRUD_TO_FORM_MOLECULE[f.moleculeType] ?? "INPUT",
       required: f.required,
       placeholder: f.placeholder,
-      options: f.options ?? optionsByField[f.name]
+      options: f.options ?? optionsByField[f.name],
+      // SPEC-106 T8 — `uiProps` llega tal cual a la molécula, así que el desplegable dice lo
+      // que pasó de verdad en vez del «no hay» de siempre. Sin error, se queda el de siempre.
+      ...optionsErrorByField[f.name] ? { uiProps: { notFoundContent: optionsErrorByField[f.name] } } : {}
     })),
-    [normalFields, optionsByField]
+    [normalFields, optionsByField, optionsErrorByField]
   );
   const validationSchema = useMemo(() => buildCrudYupSchema(normalFields), [normalFields]);
   const uploadOne = async (f, file, idx) => {
@@ -15889,7 +15927,7 @@ function chatLinkFormatter(field, eventBus) {
     return createElement(ChatLinkCell, { targets, eventBus });
   };
 }
-function toRenderField(f, loaded, eventBus, mapsApiKey) {
+function toRenderField(f, loaded, eventBus, mapsApiKey, loadError) {
   const fmt = getFormatter(f.format);
   const options = f.options ?? loaded[f.name];
   if (f.moleculeType === "LOCATION") {
@@ -15934,13 +15972,18 @@ function toRenderField(f, loaded, eventBus, mapsApiKey) {
     columnWidth: f.columnWidth,
     fixed: f.fixed,
     align: f.align,
-    uiProps: options ? { options } : void 0,
+    // SPEC-106 T8 — con un fallo de carga, el desplegable dice que no se pudo preguntar en vez
+    // de «no hay opciones disponibles», que es una respuesta y no la tenemos.
+    uiProps: loadError ? { options: options ?? [], notFoundContent: loadError } : options ? { options } : void 0,
     formatValue
   };
 }
+const cumpleCondicion = (c, row) => c.in.includes(String(row[c.field]));
+const cumplenTodas = (c, row) => (Array.isArray(c) ? c : [c]).every((x) => cumpleCondicion(x, row));
 function matchesVisibleWhen(a, row) {
+  if (a.hiddenWhen && cumplenTodas(a.hiddenWhen, row)) return false;
   if (!a.visibleWhen) return true;
-  return a.visibleWhen.in.includes(String(row[a.visibleWhen.field]));
+  return cumplenTodas(a.visibleWhen, row);
 }
 function matchesDisabledWhen(a, row) {
   if (!a.disabledWhen) return false;
@@ -15981,6 +16024,7 @@ function ReactiveCrud({ config, eventBus, autoOpenCreate, prefill, onCreated, on
   const [activeAction, setActiveAction] = useState(null);
   const [detailRow, setDetailRow] = useState(null);
   const [optionsByField, setOptionsByField] = useState({});
+  const [optionsErrorByField, setOptionsErrorByField] = useState({});
   useEffect(() => {
     let alive = true;
     const toLoad = config.fields.filter((f) => f.optionsEndpoint);
@@ -15988,21 +16032,25 @@ function ReactiveCrud({ config, eventBus, autoOpenCreate, prefill, onCreated, on
     void Promise.all(
       toLoad.map(async (f) => {
         try {
-          return [f.name, await loadOptions(eventBus, f.optionsEndpoint)];
+          return [f.name, await loadOptions(eventBus, f.optionsEndpoint), null];
         } catch {
-          return [f.name, []];
+          return [f.name, [], OPTIONS_LOAD_ERROR];
         }
       })
     ).then((entries) => {
-      if (alive) setOptionsByField(Object.fromEntries(entries));
+      if (!alive) return;
+      setOptionsByField(Object.fromEntries(entries.map(([n, o]) => [n, o])));
+      setOptionsErrorByField(
+        Object.fromEntries(entries.filter(([, , e]) => e).map(([n, , e]) => [n, e]))
+      );
     });
     return () => {
       alive = false;
     };
   }, [eventBus, config.fields]);
   const renderByFields = useMemo(
-    () => config.fields.map((f) => toRenderField(f, optionsByField, eventBus, googleMapsApiKey)),
-    [config.fields, optionsByField, eventBus]
+    () => config.fields.map((f) => toRenderField(f, optionsByField, eventBus, googleMapsApiKey, optionsErrorByField[f.name])),
+    [config.fields, optionsByField, optionsErrorByField, eventBus]
   );
   const validationSchema = useMemo(() => buildCrudYupSchema(config.fields), [config.fields]);
   const rowActions = useMemo(() => {
@@ -16297,12 +16345,27 @@ function ServiceActionsPanel({ config, recordId, recordLabel, allowed, eventBus
     () => crud.rows.find((r) => String(r[config.idField]) === recordId),
     [crud.rows, config.idField, recordId]
   );
+  const raiz = useRef(null);
+  const [esUltima, setEsUltima] = useState(true);
+  useEffect(() => {
+    const calcular = () => {
+      const el = raiz.current;
+      if (!el) return;
+      const hermanas = document.querySelectorAll(`[data-panel-record="${recordId}"]`);
+      setEsUltima(hermanas.length === 0 || hermanas[hermanas.length - 1] === el);
+    };
+    calcular();
+    const observador = new MutationObserver(calcular);
+    observador.observe(document.body, { childList: true, subtree: true });
+    return () => observador.disconnect();
+  }, [recordId]);
+  const gastada = !esUltima;
   const actions = useMemo(() => {
-    if (!row) return [];
+    if (!row || gastada) return [];
     return (config.rowActions ?? []).filter((a) => !allowed || allowed.includes(a.key)).filter((a) => matchesVisibleWhen(a, row));
-  }, [config.rowActions, row, allowed]);
+  }, [config.rowActions, row, allowed, gastada]);
   const title = recordLabel ?? config.title ?? "Servicio";
-  return /* @__PURE__ */ jsxs("div", { className: "px-chat-crud-item", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "px-chat-crud-item", ref: raiz, "data-panel-record": recordId, children: [
     /* @__PURE__ */ jsx("div", { className: "px-chat-crud-item__header", children: title }),
     crud.actionError && /* @__PURE__ */ jsxs("div", { className: "px-chat-crud-item__error", role: "alert", children: [
       /* @__PURE__ */ jsx("span", { children: crud.actionError }),
@@ -16310,6 +16373,7 @@ function ServiceActionsPanel({ config, recordId, recordLabel, allowed, eventBus
     ] }),
     crud.loading && !row && /* @__PURE__ */ jsx("div", { className: "px-chat-crud-item__hint", children: "Cargando\u2026" }),
     !crud.loading && !row && /* @__PURE__ */ jsx("div", { className: "px-chat-crud-item__hint", children: "No se encontr\xF3 el servicio." }),
+    gastada && /* @__PURE__ */ jsx("div", { className: "px-chat-crud-item__hint", children: "Este paso ya se gestion\xF3. Contin\xFAa en el mensaje m\xE1s reciente." }),
     row && config.deadline && typeof row[config.deadline.field] === "string" && /* @__PURE__ */ jsx(
       DeadlineCountdown,
       {

package/dist/index.js

@@ -5760,6 +5760,9 @@ const LUMI_ICON_TYPES = {
   // Iconos para Agenda
   USER_X: "user-x",
   REFRESH: "refresh",
+  // SPEC-104 — grúas: el selector de despacho necesitaba distinguir de un vistazo qué es cada
+  // opción, y no había ningún icono de vehículo en el set.
+  TRUCK: "truck",
   // Iconos para Chat
   MESSAGE_SQUARE: "message-square",
   MESSAGE_CIRCLE: "message-circle",
@@ -6470,6 +6473,27 @@ const BuildingIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs(
     ]
   }
 );
+const TruckIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs(
+  "svg",
+  {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M2 17V8h10v9" }),
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 11h4l3 3v3" }),
+      /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "7", cy: "18", r: "2" }),
+      /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "17", cy: "18", r: "2" }),
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 18h6" })
+    ]
+  }
+);
 const MapPinIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs(
   "svg",
   {
@@ -6588,6 +6612,7 @@ const lumiIconMap = {
   // Iconos para Servicios
   [LUMI_ICON_TYPES.BUILDING]: BuildingIcon,
   [LUMI_ICON_TYPES.MAP_PIN]: MapPinIcon,
+  [LUMI_ICON_TYPES.TRUCK]: TruckIcon,
   // Iconos para Agenda
   [LUMI_ICON_TYPES.USER_X]: UserXIcon,
   [LUMI_ICON_TYPES.REFRESH]: RefreshIcon,
@@ -7759,8 +7784,11 @@ const Select$1 = React.forwardRef(
                                 `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__checkbox`,
                                 isSelected && `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__checkbox--checked`
                               ].filter(Boolean).join(" "), children: isSelected && /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: LUMI_ICON_TYPES.CHECK, size: "small" }) }) }),
-                              option.icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__option-icon`, children: option.icon }),
-                              /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__option-label`, children: option.label }),
+                              (option.icon || option.iconName) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__option-icon`, children: option.icon ?? /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: option.iconName }) }),
+                              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__option-texts`, children: [
+                                /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__option-label`, children: option.label }),
+                                option.sublabel && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__option-sublabel`, children: option.sublabel })
+                              ] }),
                               mode === "single" && isSelected && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${COMPONENT_PREFIX}${COMPONENT_TYPES.SELECT}__option-check`, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: LUMI_ICON_TYPES.CHECK, size: "small" }) })
                             ]
                           },
@@ -14104,6 +14132,7 @@ function getFormatter(key) {
   return key ? CRUD_FORMATTERS[key] : void 0;
 }
 
+const OPTIONS_LOAD_ERROR = "No se pudieron cargar las opciones. Int\xE9ntalo de nuevo.";
 function unwrap$3(raw) {
   if (raw && typeof raw === "object" && "response" in raw) {
     return raw.response;
@@ -14132,7 +14161,9 @@ async function loadOptions(eventBus, ep, ctx) {
   const arr = Array.isArray(data) ? data : [];
   return arr.map((item) => ({
     value: String(item[ep.value_field] ?? ""),
-    label: String(item[ep.label_field] ?? "")
+    label: String(item[ep.label_field] ?? ""),
+    ...item.sublabel ? { sublabel: String(item.sublabel) } : {},
+    ...item.icon ? { iconName: String(item.icon) } : {}
   }));
 }
 
@@ -14439,6 +14470,7 @@ function ActionFormDrawer({ action, row, idField, eventBus, onExecute, onClose }
   const fileFields = React.useMemo(() => formFields.filter((f) => f.moleculeType === "FILE"), [formFields]);
   const normalFields = React.useMemo(() => formFields.filter((f) => f.moleculeType !== "FILE"), [formFields]);
   const [optionsByField, setOptionsByField] = React.useState({});
+  const [optionsErrorByField, setOptionsErrorByField] = React.useState({});
   const [loadingOptions, setLoadingOptions] = React.useState(false);
   const [submitting, setSubmitting] = React.useState(false);
   const [fileEntries, setFileEntries] = React.useState({});
@@ -14452,14 +14484,17 @@ function ActionFormDrawer({ action, row, idField, eventBus, onExecute, onClose }
       toLoad.map(async (f) => {
         try {
           const opts = await loadOptions(eventBus, f.optionsEndpoint, { ...row, id: row[idField] });
-          return [f.name, opts];
+          return [f.name, opts, null];
         } catch {
-          return [f.name, []];
+          return [f.name, [], OPTIONS_LOAD_ERROR];
         }
       })
     ).then((entries) => {
       if (!alive) return;
-      setOptionsByField(Object.fromEntries(entries));
+      setOptionsByField(Object.fromEntries(entries.map(([n, o]) => [n, o])));
+      setOptionsErrorByField(
+        Object.fromEntries(entries.filter(([, , e]) => e).map(([n, , e]) => [n, e]))
+      );
       setLoadingOptions(false);
     });
     return () => {
@@ -14473,9 +14508,12 @@ function ActionFormDrawer({ action, row, idField, eventBus, onExecute, onClose }
       moleculeType: CRUD_TO_FORM_MOLECULE[f.moleculeType] ?? "INPUT",
       required: f.required,
       placeholder: f.placeholder,
-      options: f.options ?? optionsByField[f.name]
+      options: f.options ?? optionsByField[f.name],
+      // SPEC-106 T8 — `uiProps` llega tal cual a la molécula, así que el desplegable dice lo
+      // que pasó de verdad en vez del «no hay» de siempre. Sin error, se queda el de siempre.
+      ...optionsErrorByField[f.name] ? { uiProps: { notFoundContent: optionsErrorByField[f.name] } } : {}
     })),
-    [normalFields, optionsByField]
+    [normalFields, optionsByField, optionsErrorByField]
   );
   const validationSchema = React.useMemo(() => buildCrudYupSchema(normalFields), [normalFields]);
   const uploadOne = async (f, file, idx) => {
@@ -15910,7 +15948,7 @@ function chatLinkFormatter(field, eventBus) {
     return React.createElement(ChatLinkCell, { targets, eventBus });
   };
 }
-function toRenderField(f, loaded, eventBus, mapsApiKey) {
+function toRenderField(f, loaded, eventBus, mapsApiKey, loadError) {
   const fmt = getFormatter(f.format);
   const options = f.options ?? loaded[f.name];
   if (f.moleculeType === "LOCATION") {
@@ -15955,13 +15993,18 @@ function toRenderField(f, loaded, eventBus, mapsApiKey) {
     columnWidth: f.columnWidth,
     fixed: f.fixed,
     align: f.align,
-    uiProps: options ? { options } : void 0,
+    // SPEC-106 T8 — con un fallo de carga, el desplegable dice que no se pudo preguntar en vez
+    // de «no hay opciones disponibles», que es una respuesta y no la tenemos.
+    uiProps: loadError ? { options: options ?? [], notFoundContent: loadError } : options ? { options } : void 0,
     formatValue
   };
 }
+const cumpleCondicion = (c, row) => c.in.includes(String(row[c.field]));
+const cumplenTodas = (c, row) => (Array.isArray(c) ? c : [c]).every((x) => cumpleCondicion(x, row));
 function matchesVisibleWhen(a, row) {
+  if (a.hiddenWhen && cumplenTodas(a.hiddenWhen, row)) return false;
   if (!a.visibleWhen) return true;
-  return a.visibleWhen.in.includes(String(row[a.visibleWhen.field]));
+  return cumplenTodas(a.visibleWhen, row);
 }
 function matchesDisabledWhen(a, row) {
   if (!a.disabledWhen) return false;
@@ -16002,6 +16045,7 @@ function ReactiveCrud({ config, eventBus, autoOpenCreate, prefill, onCreated, on
   const [activeAction, setActiveAction] = React.useState(null);
   const [detailRow, setDetailRow] = React.useState(null);
   const [optionsByField, setOptionsByField] = React.useState({});
+  const [optionsErrorByField, setOptionsErrorByField] = React.useState({});
   React.useEffect(() => {
     let alive = true;
     const toLoad = config.fields.filter((f) => f.optionsEndpoint);
@@ -16009,21 +16053,25 @@ function ReactiveCrud({ config, eventBus, autoOpenCreate, prefill, onCreated, on
     void Promise.all(
       toLoad.map(async (f) => {
         try {
-          return [f.name, await loadOptions(eventBus, f.optionsEndpoint)];
+          return [f.name, await loadOptions(eventBus, f.optionsEndpoint), null];
         } catch {
-          return [f.name, []];
+          return [f.name, [], OPTIONS_LOAD_ERROR];
         }
       })
     ).then((entries) => {
-      if (alive) setOptionsByField(Object.fromEntries(entries));
+      if (!alive) return;
+      setOptionsByField(Object.fromEntries(entries.map(([n, o]) => [n, o])));
+      setOptionsErrorByField(
+        Object.fromEntries(entries.filter(([, , e]) => e).map(([n, , e]) => [n, e]))
+      );
     });
     return () => {
       alive = false;
     };
   }, [eventBus, config.fields]);
   const renderByFields = React.useMemo(
-    () => config.fields.map((f) => toRenderField(f, optionsByField, eventBus, googleMapsApiKey)),
-    [config.fields, optionsByField, eventBus]
+    () => config.fields.map((f) => toRenderField(f, optionsByField, eventBus, googleMapsApiKey, optionsErrorByField[f.name])),
+    [config.fields, optionsByField, optionsErrorByField, eventBus]
   );
   const validationSchema = React.useMemo(() => buildCrudYupSchema(config.fields), [config.fields]);
   const rowActions = React.useMemo(() => {
@@ -16318,12 +16366,27 @@ function ServiceActionsPanel({ config, recordId, recordLabel, allowed, eventBus
     () => crud.rows.find((r) => String(r[config.idField]) === recordId),
     [crud.rows, config.idField, recordId]
   );
+  const raiz = React.useRef(null);
+  const [esUltima, setEsUltima] = React.useState(true);
+  React.useEffect(() => {
+    const calcular = () => {
+      const el = raiz.current;
+      if (!el) return;
+      const hermanas = document.querySelectorAll(`[data-panel-record="${recordId}"]`);
+      setEsUltima(hermanas.length === 0 || hermanas[hermanas.length - 1] === el);
+    };
+    calcular();
+    const observador = new MutationObserver(calcular);
+    observador.observe(document.body, { childList: true, subtree: true });
+    return () => observador.disconnect();
+  }, [recordId]);
+  const gastada = !esUltima;
   const actions = React.useMemo(() => {
-    if (!row) return [];
+    if (!row || gastada) return [];
     return (config.rowActions ?? []).filter((a) => !allowed || allowed.includes(a.key)).filter((a) => matchesVisibleWhen(a, row));
-  }, [config.rowActions, row, allowed]);
+  }, [config.rowActions, row, allowed, gastada]);
   const title = recordLabel ?? config.title ?? "Servicio";
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-chat-crud-item", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-chat-crud-item", ref: raiz, "data-panel-record": recordId, children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-chat-crud-item__header", children: title }),
     crud.actionError && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-chat-crud-item__error", role: "alert", children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { children: crud.actionError }),
@@ -16331,6 +16394,7 @@ function ServiceActionsPanel({ config, recordId, recordLabel, allowed, eventBus
     ] }),
     crud.loading && !row && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-chat-crud-item__hint", children: "Cargando\u2026" }),
     !crud.loading && !row && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-chat-crud-item__hint", children: "No se encontr\xF3 el servicio." }),
+    gastada && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-chat-crud-item__hint", children: "Este paso ya se gestion\xF3. Contin\xFAa en el mensaje m\xE1s reciente." }),
     row && config.deadline && typeof row[config.deadline.field] === "string" && /* @__PURE__ */ jsxRuntime.jsx(
       DeadlineCountdown,
       {