@flamingo-stack/openframe-frontend-core 0.0.740 → 0.0.742

package/dist/components/features/scripts/schedule-form/schedule-interval-input.d.ts

@@ -0,0 +1,54 @@
+interface ScheduleIntervalInputProps {
+    /** The form's value. `null` = the box is empty. */
+    value: number | null;
+    onChange: (next: number | null) => void;
+    /**
+     * The form's own blur handler. Load-bearing, not optional plumbing: react-hook-form
+     * learns a field was left ONLY through this, and `reValidateMode: 'onBlur'` is
+     * what re-runs the schema. Without it an error the user has already fixed sits
+     * on screen until the next Save.
+     */
+    onBlur?: () => void;
+    disabled?: boolean;
+    invalid?: boolean;
+    error?: string;
+    min?: number;
+    className?: string;
+    'aria-label'?: string;
+    /**
+     * Marks this box as where `scrollToFirstInvalidField` should put focus when
+     * the error is carried by an ancestor rather than by the input itself.
+     */
+    'data-invalid-focus'?: boolean;
+}
+/**
+ * The `[interval]` half of the form's two duration pairs (Repeat in, Stop Retry
+ * after).
+ *
+ * **What the user types owns the display; the form value never writes back into
+ * it while the field has focus.** That inversion is the whole component. Binding
+ * a number input straight to validated state reads as a bug rather than a rule:
+ * the previous version coerced an emptied box back to a floor on every
+ * keystroke, so the digit reappeared as fast as it was deleted and "1" could not
+ * be typed over. Any round trip through `Number()` has the same shape in
+ * smaller ways — a leading zero vanishes mid-word, "10" briefly becomes "1"
+ * while a character is being removed.
+ *
+ * So the raw string is local state, and the form is told the PARSED value as it
+ * changes. Keeping the form current (rather than committing on blur alone)
+ * matters for one case: submitting with Enter never fires a blur, and a form
+ * reading a stale interval would save a number the user cannot see.
+ *
+ * The reverse direction — form → box — is deliberately narrow. It runs only
+ * when the field is NOT focused, which is exactly the set of changes that come
+ * from somewhere else: the record arriving (`useSeedForm`), or the unit
+ * dropdown raising the interval to its floor. While the box has focus those
+ * cannot happen, and nothing else may repaint what is being typed.
+ *
+ * Validation timing is the form's business, not this component's: errors are
+ * held until the first Save (`showErrors`) and re-checked on blur
+ * (`reValidateMode`), so nothing here is judged mid-word.
+ */
+export declare function ScheduleIntervalInput({ value, onChange, onBlur, disabled, invalid, error, min, className, 'aria-label': ariaLabel, 'data-invalid-focus': invalidFocus, }: ScheduleIntervalInputProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=schedule-interval-input.d.ts.map

package/dist/components/features/scripts/schedule-form/schedule-interval-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schedule-interval-input.d.ts","sourceRoot":"","sources":["../../../../../src/components/features/scripts/schedule-form/schedule-interval-input.tsx"],"names":[],"mappings":"AAKA,UAAU,0BAA0B;IAClC,mDAAmD;IACnD,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACxC;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,OAAO,EACP,KAAK,EACL,GAAG,EACH,SAAS,EACT,YAAY,EAAE,SAAS,EACvB,oBAAoB,EAAE,YAAY,GACnC,EAAE,0BAA0B,+BAoD5B"}

package/dist/components/features/scripts/schedule-form/schedule-interval-input.js

@@ -0,0 +1,60 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import { Input } from "../../../ui/input.js";
+function ScheduleIntervalInput({
+  value,
+  onChange,
+  onBlur,
+  disabled,
+  invalid,
+  error,
+  min,
+  className,
+  "aria-label": ariaLabel,
+  "data-invalid-focus": invalidFocus
+}) {
+  const [text, setText] = useState(() => value === null ? "" : String(value));
+  const focused = useRef(false);
+  useEffect(() => {
+    if (focused.current) return;
+    const next = value === null ? "" : String(value);
+    setText((current) => current === next ? current : next);
+  }, [value]);
+  return /* @__PURE__ */ jsx(
+    Input,
+    {
+      type: "number",
+      min,
+      inputMode: "numeric",
+      "aria-label": ariaLabel,
+      "data-invalid-focus": invalidFocus || void 0,
+      className,
+      value: text,
+      onFocus: () => {
+        focused.current = true;
+      },
+      onBlur: () => {
+        focused.current = false;
+        setText(value === null ? "" : String(value));
+        onBlur?.();
+      },
+      onChange: (e) => {
+        const raw = e.target.value;
+        setText(raw);
+        if (raw.trim() === "") {
+          onChange(null);
+          return;
+        }
+        const parsed = Number(raw);
+        onChange(Number.isFinite(parsed) ? parsed : null);
+      },
+      disabled,
+      invalid,
+      error
+    }
+  );
+}
+export {
+  ScheduleIntervalInput
+};

package/dist/components/features/scripts/schedule-form/schedule-offline-fields.d.ts

@@ -0,0 +1,29 @@
+/**
+ * "If device is offline at scheduled time" — Skip this Run vs Run when device
+ * comes back online, plus the reconnect window the second one needs
+ * (design node 460:63425).
+ *
+ * Maps to `offlineBehavior` (`SKIP` | `RETRY_ON_RECONNECT`) and
+ * `reconnectWindowSeconds`. The window is submitted ONLY alongside
+ * RETRY_ON_RECONNECT — the schema documents it as "set only when offlineBehavior
+ * is RETRY_ON_RECONNECT" — which is also why it is required rather than
+ * optional-meaning-forever: nothing in the contract says a null window queues a
+ * run indefinitely, so the form never offers a reading it cannot back up.
+ *
+ * The block presupposes a scheduled time the device can be absent FOR, so it
+ * collapses for DEVICE_ONLINE — which fires on the reconnect already — and
+ * submits the SKIP default instead of what the collapsed controls hold.
+ * DEVICE_LOCAL keeps it: its scheduled moment is the device's own wall clock.
+ *
+ * It collapses with the `0fr → 1fr` grid-rows technique, staying MOUNTED so
+ * toggling the trigger back restores what was picked, `inert` to drop the
+ * collapsed controls out of the tab order, and a padding/negative-margin pair:
+ * the bottom padding is the room the absolutely-positioned error renders into,
+ * and the constant negative margin cancels it so a collapsed block leaves no
+ * hole.
+ */
+export declare function ScheduleOfflineFields({ showErrors, disabled }: {
+    showErrors: boolean;
+    disabled?: boolean;
+}): import("react").JSX.Element;
+//# sourceMappingURL=schedule-offline-fields.d.ts.map

package/dist/components/features/scripts/schedule-form/schedule-offline-fields.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schedule-offline-fields.d.ts","sourceRoot":"","sources":["../../../../../src/components/features/scripts/schedule-form/schedule-offline-fields.tsx"],"names":[],"mappings":"AA+FA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,qBAAqB,CAAC,EAAE,UAAU,EAAE,QAAgB,EAAE,EAAE;IAAE,UAAU,EAAE,OAAO,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,+BAkGlH"}

package/dist/components/features/scripts/schedule-form/schedule-offline-fields.js

@@ -0,0 +1,124 @@
+"use client";
+"use no memo";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useController, useFormContext, useWatch } from "react-hook-form";
+import { cn } from "../../../../utils/cn.js";
+import { Label } from "../../../ui/label.js";
+import { RadioGroupBlock } from "../../../ui/radio-group.js";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../../../ui/select.js";
+import { TruncateText } from "../../../ui/truncate-text.js";
+import { SCHEDULE_OFFLINE_BEHAVIOR_OPTIONS } from "./schedule-form-types.js";
+import { ScheduleIntervalInput } from "./schedule-interval-input.js";
+import {
+  DURATION_UNIT_OPTIONS,
+  isEventTrigger,
+  isRetryOnReconnect,
+  MIN_RECONNECT_MINUTES,
+  snapReconnectInterval
+} from "./schedule-timing.js";
+function ReconnectWindowFields({
+  interval,
+  unit,
+  onIntervalChange,
+  onIntervalBlur,
+  onUnitChange,
+  disabled,
+  invalid,
+  fluid = false,
+  className
+}) {
+  const controlWidth = fluid ? "flex-1 min-w-0" : "w-[120px]";
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-[var(--spacing-system-xsf)]", className), children: [
+    /* @__PURE__ */ jsx("span", { className: cn("shrink-0 text-h4", disabled ? "text-ods-text-disabled" : "text-ods-text-secondary"), children: "Stop Retry after" }),
+    /* @__PURE__ */ jsx(
+      ScheduleIntervalInput,
+      {
+        min: unit === "minute" ? MIN_RECONNECT_MINUTES : 1,
+        "aria-label": "Stop retry after",
+        className: controlWidth,
+        value: interval,
+        onChange: onIntervalChange,
+        onBlur: onIntervalBlur,
+        "data-invalid-focus": true,
+        disabled,
+        invalid
+      }
+    ),
+    /* @__PURE__ */ jsxs(Select, { value: unit, onValueChange: (next) => onUnitChange(next), disabled, children: [
+      /* @__PURE__ */ jsx(SelectTrigger, { className: controlWidth, "aria-label": "Stop retry after unit", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+      /* @__PURE__ */ jsx(SelectContent, { children: DURATION_UNIT_OPTIONS.map((opt) => /* @__PURE__ */ jsx(SelectItem, { value: opt.value, children: opt.label }, opt.value)) })
+    ] })
+  ] });
+}
+function ScheduleOfflineFields({ showErrors, disabled = false }) {
+  const { control } = useFormContext();
+  const trigger = useWatch({ control, name: "trigger" });
+  const collapsed = isEventTrigger(trigger);
+  const { field: behaviorField } = useController({ control, name: "offlineBehavior" });
+  const { field: intervalField, fieldState: intervalState } = useController({ control, name: "reconnectInterval" });
+  const { field: unitField } = useController({ control, name: "reconnectUnit" });
+  const windowDisabled = disabled || !isRetryOnReconnect(behaviorField.value);
+  const intervalError = showErrors ? intervalState.error?.message : void 0;
+  const handleUnitChange = (next) => {
+    unitField.onChange(next);
+    const snapped = snapReconnectInterval(intervalField.value, next);
+    if (snapped !== intervalField.value) intervalField.onChange(snapped);
+  };
+  const windowFieldsFor = (fluid) => /* @__PURE__ */ jsx(
+    ReconnectWindowFields,
+    {
+      interval: intervalField.value,
+      unit: unitField.value,
+      onIntervalChange: intervalField.onChange,
+      onIntervalBlur: intervalField.onBlur,
+      onUnitChange: handleUnitChange,
+      disabled: windowDisabled,
+      invalid: !!intervalError,
+      fluid
+    }
+  );
+  const options = SCHEDULE_OFFLINE_BEHAVIOR_OPTIONS.map(
+    (option) => isRetryOnReconnect(option.value) ? (
+      // Desktop only. Below `md` the caption plus two controls cannot share a
+      // row with the option's own label without squeezing it to nothing, so
+      // the same fields render full-width under the group instead.
+      { ...option, trailing: /* @__PURE__ */ jsx("div", { className: "hidden content-md:flex", children: windowFieldsFor(false) }) }
+    ) : option
+  );
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      inert: collapsed,
+      style: {
+        gridTemplateRows: collapsed ? "0fr" : "1fr",
+        opacity: collapsed ? 0 : 1
+      },
+      className: "mb-[calc(-1*var(--spacing-system-lf))] grid transition-[grid-template-rows,opacity] duration-200 ease-out motion-reduce:transition-none",
+      children: /* @__PURE__ */ jsx("div", { className: "min-h-0 overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "pb-[var(--spacing-system-lf)]", children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "relative flex flex-col gap-[var(--spacing-system-xxs)]",
+          "data-invalid": intervalError ? true : void 0,
+          children: [
+            /* @__PURE__ */ jsx(Label, { className: "text-h4", children: "If device is offline at scheduled time" }),
+            /* @__PURE__ */ jsx(
+              RadioGroupBlock,
+              {
+                variant: "grouped",
+                value: behaviorField.value,
+                onValueChange: behaviorField.onChange,
+                disabled,
+                options
+              }
+            ),
+            /* @__PURE__ */ jsx("div", { className: "pt-[var(--spacing-system-xs)] content-md:hidden", children: windowFieldsFor(true) }),
+            intervalError && /* @__PURE__ */ jsx("div", { className: "absolute bottom-0 left-0 right-0 translate-y-full", children: /* @__PURE__ */ jsx(TruncateText, { variant: "h6", className: "text-ods-error", children: intervalError }) })
+          ]
+        }
+      ) }) })
+    }
+  );
+}
+export {
+  ScheduleOfflineFields
+};

package/dist/components/features/scripts/schedule-form/schedule-script-picker-card.d.ts

@@ -0,0 +1,52 @@
+import { type RenderScheduleScriptSearch } from './schedule-form-types';
+interface ScheduleScriptPickerCardProps {
+    index: number;
+    /** How many cards the list has — disables the move buttons at the ends. */
+    count: number;
+    /** UI platform ids the schedule targets — what the host narrows its script search by. */
+    supportedPlatforms: string[];
+    /** The card's "Select Script" field: the host's search over its script library. */
+    renderScriptSearch: RenderScheduleScriptSearch;
+    onRemove: () => void;
+    canRemove: boolean;
+    disabled?: boolean;
+    /**
+     * Controls inline error visibility — the parent flips this true once the
+     * user attempts Save, so errors stay hidden on a pristine form (mirrors
+     * `ScriptFormFields.showErrors`).
+     */
+    showErrors?: boolean;
+    /**
+     * The script's arguments and environment variables under the first row.
+     * Default true; false is the card as one row (the script and its timeout).
+     */
+    showParams?: boolean;
+}
+/**
+ * One card of the schedule's ordered script list: drag handle, script
+ * autocomplete, timeout and the script's arguments / environment variables.
+ *
+ * **Order is the payload.** The card index IS the run order — the backend
+ * stores `scriptIds: [ID!]` in run order, so reordering rewrites that array.
+ *
+ * Sorting runs on the core library's `SortableList` (`useSortableItem`), the
+ * same Pragmatic stack the ticket board uses. Only the handle starts a drag,
+ * so text selection inside the fields keeps working, and the handle carries
+ * the keyboard path (Arrow Up / Arrow Down, one press one move) with
+ * live-region announcements wired up by the list. On touch/narrow viewports
+ * no drag exists at all — an up/down button pair renders beside the delete
+ * button instead.
+ *
+ * Arguments and env vars ARE persisted, as this schedule's per-script override
+ * (`scriptCustomParams`): they seed from the picked script's defaults, and only
+ * a half the user moves off those defaults is written back — so leaving a card
+ * untouched keeps the schedule following later edits to the script itself.
+ *
+ * ⚠ **Timeout is still editable but not persisted**: the override input carries
+ * args and env vars only. It is
+ * seeded from the script's own default, which is what the run actually uses, so
+ * the card shows the truth — it just cannot be changed per schedule yet.
+ */
+export declare function ScheduleScriptPickerCard({ index, count, supportedPlatforms, renderScriptSearch, onRemove, canRemove, disabled, showErrors, showParams, }: ScheduleScriptPickerCardProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=schedule-script-picker-card.d.ts.map

package/dist/components/features/scripts/schedule-form/schedule-script-picker-card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schedule-script-picker-card.d.ts","sourceRoot":"","sources":["../../../../../src/components/features/scripts/schedule-form/schedule-script-picker-card.tsx"],"names":[],"mappings":"AAcA,OAAO,EAEL,KAAK,0BAA0B,EAGhC,MAAM,uBAAuB,CAAC;AAK/B,UAAU,6BAA6B;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,2EAA2E;IAC3E,KAAK,EAAE,MAAM,CAAC;IACd,yFAAyF;IACzF,kBAAkB,EAAE,MAAM,EAAE,CAAC;IAC7B,mFAAmF;IACnF,kBAAkB,EAAE,0BAA0B,CAAC;IAC/C,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,wBAAwB,CAAC,EACvC,KAAK,EACL,KAAK,EACL,kBAAkB,EAClB,kBAAkB,EAClB,QAAQ,EACR,SAAS,EACT,QAAgB,EAChB,UAAiB,EACjB,UAAiB,GAClB,EAAE,6BAA6B,+BA6O/B"}

package/dist/components/features/scripts/schedule-form/schedule-script-picker-card.js

@@ -0,0 +1,244 @@
+"use client";
+"use no memo";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Controller, useFormContext } from "react-hook-form";
+import { useContentMdUp } from "../../../../hooks/ui/use-content-breakpoint.js";
+import { DraggerIcon } from "../../../icons-v2-generated/interface/dragger-icon.js";
+import { TrashIcon } from "../../../icons-v2-generated/interface/trash-icon.js";
+import { ScriptArguments } from "../../../platform/ScriptArguments.js";
+import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "../../../ui/accordion.js";
+import { Button } from "../../../ui/button/index.js";
+import { Input } from "../../../ui/input.js";
+import { Label } from "../../../ui/label.js";
+import { SortableMoveButtons } from "../../sortable-list/sortable-move-buttons.js";
+import { useSortableItem } from "../../sortable-list/use-sortable-item.js";
+import {
+  EMPTY_SCHEDULE_SCRIPT_ROW
+} from "./schedule-form-types.js";
+const UNSET_TIMEOUT = 0;
+function ScheduleScriptPickerCard({
+  index,
+  count,
+  supportedPlatforms,
+  renderScriptSearch,
+  onRemove,
+  canRemove,
+  disabled = false,
+  showErrors = true,
+  showParams = true
+}) {
+  const { control, setValue, watch } = useFormContext();
+  const selected = watch(`scripts.${index}`);
+  const runParamsLocked = disabled || !selected?.scriptId;
+  const { itemRef, dragHandleProps, isDragging, dragAndDropEnabled } = useSortableItem();
+  const isMdUp = useContentMdUp();
+  const handleScriptPick = (row) => {
+    if (!row) {
+      setValue(`scripts.${index}`, EMPTY_SCHEDULE_SCRIPT_ROW, { shouldValidate: true });
+      return;
+    }
+    setValue(`scripts.${index}`, row, { shouldValidate: true, shouldDirty: true });
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: itemRef,
+      className: `flex flex-col gap-[var(--spacing-system-sf)] rounded-[6px] border bg-ods-bg p-[var(--spacing-system-l)] content-md:gap-[var(--spacing-system-lf)] ${isDragging ? "relative z-10 border-ods-accent shadow-lg" : "border-ods-border"}`,
+      children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: `flex flex-col gap-[var(--spacing-system-sf)] content-md:gap-[var(--spacing-system-lf)] ${dragAndDropEnabled ? "content-md:flex-row content-md:items-end" : ""}`,
+            children: [
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  className: `flex min-w-0 flex-1 items-end ${dragAndDropEnabled ? "gap-[var(--spacing-system-xs)]" : "gap-[var(--spacing-system-xsf)]"}`,
+                  children: [
+                    dragAndDropEnabled && /* @__PURE__ */ jsx(
+                      "button",
+                      {
+                        type: "button",
+                        ...dragHandleProps,
+                        disabled,
+                        "aria-label": `Reorder ${selected?.name || `script ${index + 1}`}`,
+                        className: `flex size-12 shrink-0 items-center justify-center rounded-[6px] text-ods-text-secondary hover:text-ods-text-primary focus-visible:outline focus-visible:outline-2 focus-visible:outline-ods-border-focus disabled:cursor-not-allowed disabled:opacity-30 ${isDragging ? "cursor-grabbing text-ods-text-primary" : "cursor-grab"}`,
+                        children: /* @__PURE__ */ jsx(DraggerIcon, { size: 24 })
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      Controller,
+                      {
+                        name: `scripts.${index}.scriptId`,
+                        control,
+                        render: ({ fieldState }) => /* @__PURE__ */ jsx(Fragment, { children: renderScriptSearch({
+                          scriptId: selected?.scriptId ?? "",
+                          name: selected?.name ?? "",
+                          supportedPlatforms,
+                          onPick: handleScriptPick,
+                          disabled,
+                          error: showErrors ? fieldState.error?.message : void 0,
+                          invalid: showErrors && !!fieldState.error
+                        }) })
+                      }
+                    ),
+                    !dragAndDropEnabled && /* @__PURE__ */ jsxs(Fragment, { children: [
+                      /* @__PURE__ */ jsx(SortableMoveButtons, { index, count, label: selected?.name || `script ${index + 1}` }),
+                      /* @__PURE__ */ jsx(
+                        Button,
+                        {
+                          variant: "outline",
+                          size: "icon",
+                          onClick: onRemove,
+                          disabled: !canRemove || disabled,
+                          "aria-label": "Remove script from schedule",
+                          className: "text-ods-error disabled:opacity-30",
+                          children: /* @__PURE__ */ jsx(TrashIcon, { size: 20 })
+                        }
+                      )
+                    ] })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 items-end gap-[var(--spacing-system-xs)]", children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-[var(--spacing-system-xxs)]", children: [
+                  /* @__PURE__ */ jsx(Label, { className: "text-h4", children: "Timeout" }),
+                  /* @__PURE__ */ jsx(
+                    Controller,
+                    {
+                      name: `scripts.${index}.timeoutSeconds`,
+                      control,
+                      render: ({ field, fieldState }) => (
+                        // Locked until a script is picked: the timeout belongs to the
+                        // script, so the field stays EMPTY until there is one — the
+                        // sentinel is a "nothing here yet" marker, and rendering it as
+                        // a literal 0 would read as a real (and invalid) timeout.
+                        // Picking a script writes its own timeout in.
+                        /* @__PURE__ */ jsx(
+                          Input,
+                          {
+                            type: "number",
+                            min: 1,
+                            className: "w-full",
+                            value: field.value ? String(field.value) : "",
+                            onChange: (e) => field.onChange(e.target.value ? Number(e.target.value) : UNSET_TIMEOUT),
+                            disabled: runParamsLocked,
+                            endAdornment: /* @__PURE__ */ jsx("span", { className: "text-ods-text-secondary text-h6", children: "Seconds" }),
+                            error: showErrors ? fieldState.error?.message : void 0,
+                            invalid: showErrors && !!fieldState.error
+                          }
+                        )
+                      )
+                    }
+                  )
+                ] }),
+                dragAndDropEnabled && /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "outline",
+                    size: "icon",
+                    onClick: onRemove,
+                    disabled: !canRemove || disabled,
+                    "aria-label": "Remove script from schedule",
+                    className: "text-ods-error disabled:opacity-30",
+                    children: /* @__PURE__ */ jsx(TrashIcon, { size: 20 })
+                  }
+                )
+              ] })
+            ]
+          }
+        ),
+        !showParams ? null : isMdUp === false ? /* @__PURE__ */ jsxs(Accordion, { type: "multiple", className: "overflow-hidden rounded-[6px] border border-ods-border", children: [
+          /* @__PURE__ */ jsxs(AccordionItem, { value: "args", className: "border-ods-border data-[state=closed]:bg-ods-card", children: [
+            /* @__PURE__ */ jsx(AccordionTrigger, { className: "h-14 px-[var(--spacing-system-sf)] py-0 text-ods-text-primary text-h6 hover:no-underline [&>svg]:text-ods-text-secondary", children: "Edit Default Script Arguments" }),
+            /* @__PURE__ */ jsx(AccordionContent, { className: "px-[var(--spacing-system-sf)] [&_label:empty]:hidden", children: /* @__PURE__ */ jsx(
+              Controller,
+              {
+                name: `scripts.${index}.args`,
+                control,
+                render: ({ field }) => /* @__PURE__ */ jsx(
+                  ScriptArguments,
+                  {
+                    arguments: field.value,
+                    onArgumentsChange: field.onChange,
+                    keyPlaceholder: "Key",
+                    valuePlaceholder: "Enter Value (empty=flag)",
+                    addButtonLabel: "Add Script Argument",
+                    titleLabel: "",
+                    disabled: runParamsLocked
+                  }
+                )
+              }
+            ) })
+          ] }),
+          /* @__PURE__ */ jsxs(AccordionItem, { value: "env", className: "border-b-0 border-ods-border data-[state=closed]:bg-ods-card", children: [
+            /* @__PURE__ */ jsx(AccordionTrigger, { className: "h-14 px-[var(--spacing-system-sf)] py-0 text-ods-text-primary text-h6 hover:no-underline [&>svg]:text-ods-text-secondary", children: "Edit Default Environment Vars" }),
+            /* @__PURE__ */ jsx(AccordionContent, { className: "px-[var(--spacing-system-sf)] [&_label:empty]:hidden", children: /* @__PURE__ */ jsx(
+              Controller,
+              {
+                name: `scripts.${index}.envVars`,
+                control,
+                render: ({ field }) => /* @__PURE__ */ jsx(
+                  ScriptArguments,
+                  {
+                    arguments: field.value,
+                    onArgumentsChange: field.onChange,
+                    keyPlaceholder: "Key",
+                    valuePlaceholder: "Enter Value",
+                    addButtonLabel: "Add Environment Var",
+                    addSecretButtonLabel: "Add Secret",
+                    titleLabel: "",
+                    disabled: runParamsLocked
+                  }
+                )
+              }
+            ) })
+          ] })
+        ] }) : /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start gap-[var(--spacing-system-lf)] content-md:flex-row", children: [
+          /* @__PURE__ */ jsx("div", { className: "w-full min-w-0 flex-1 [&_label]:text-h4", children: /* @__PURE__ */ jsx(
+            Controller,
+            {
+              name: `scripts.${index}.args`,
+              control,
+              render: ({ field }) => /* @__PURE__ */ jsx(
+                ScriptArguments,
+                {
+                  arguments: field.value,
+                  onArgumentsChange: field.onChange,
+                  keyPlaceholder: "Key",
+                  valuePlaceholder: "Enter Value (empty=flag)",
+                  addButtonLabel: "Add Script Argument",
+                  titleLabel: "Script Arguments",
+                  disabled: runParamsLocked
+                }
+              )
+            }
+          ) }),
+          /* @__PURE__ */ jsx("div", { className: "w-full min-w-0 flex-1 [&_label]:text-h4", children: /* @__PURE__ */ jsx(
+            Controller,
+            {
+              name: `scripts.${index}.envVars`,
+              control,
+              render: ({ field }) => /* @__PURE__ */ jsx(
+                ScriptArguments,
+                {
+                  arguments: field.value,
+                  onArgumentsChange: field.onChange,
+                  keyPlaceholder: "Key",
+                  valuePlaceholder: "Enter Value",
+                  addButtonLabel: "Add Environment Var",
+                  addSecretButtonLabel: "Add Secret",
+                  titleLabel: "Environment Vars",
+                  disabled: runParamsLocked
+                }
+              )
+            }
+          ) })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  ScheduleScriptPickerCard
+};

package/dist/components/features/scripts/schedule-form/schedule-script-search-field.d.ts

@@ -0,0 +1,35 @@
+/** One script a search offers. */
+export interface ScheduleScriptSearchResult {
+    id: string;
+    name: string;
+    /** UI platform ids the script runs on — the icons beside its name. */
+    supportedPlatforms: string[];
+}
+export interface ScheduleScriptSearchFieldProps {
+    /** The card's script: `''` while nothing is picked. */
+    scriptId: string;
+    /** Its name — the label shown when the script is not on the current search page. */
+    name: string;
+    /** The current page of the host's search. */
+    scripts: ScheduleScriptSearchResult[];
+    isLoading?: boolean;
+    /** What is typed in the field; decides which "nothing found" reading shows. */
+    inputValue?: string;
+    onInputChange?: (value: string) => void;
+    /** Focus entered the field: a lazy search starts here. */
+    onOpen?: () => void;
+    /** Focus left the whole field. */
+    onClose?: () => void;
+    /** A script of `scripts` was picked (its id), or the field was cleared (null). */
+    onChange: (scriptId: string | null) => void;
+    disabled?: boolean;
+    error?: string;
+    invalid?: boolean;
+}
+/**
+ * "Select Script": the autocomplete of a schedule's script card. The search is
+ * the host's (server-side, so the field does no filtering of its own); this is
+ * the field every host draws around it.
+ */
+export declare function ScheduleScriptSearchField({ scriptId, name, scripts, isLoading, inputValue, onInputChange, onOpen, onClose, onChange, disabled, error, invalid, }: ScheduleScriptSearchFieldProps): import("react").JSX.Element;
+//# sourceMappingURL=schedule-script-search-field.d.ts.map

package/dist/components/features/scripts/schedule-form/schedule-script-search-field.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schedule-script-search-field.d.ts","sourceRoot":"","sources":["../../../../../src/components/features/scripts/schedule-form/schedule-script-search-field.tsx"],"names":[],"mappings":"AAQA,kCAAkC;AAClC,MAAM,WAAW,0BAA0B;IACzC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,sEAAsE;IACtE,kBAAkB,EAAE,MAAM,EAAE,CAAC;CAC9B;AAED,MAAM,WAAW,8BAA8B;IAC7C,uDAAuD;IACvD,QAAQ,EAAE,MAAM,CAAC;IACjB,oFAAoF;IACpF,IAAI,EAAE,MAAM,CAAC;IACb,6CAA6C;IAC7C,OAAO,EAAE,0BAA0B,EAAE,CAAC;IACtC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,+EAA+E;IAC/E,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,0DAA0D;IAC1D,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,kCAAkC;IAClC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,kFAAkF;IAClF,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC5C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAYD;;;;GAIG;AACH,wBAAgB,yBAAyB,CAAC,EACxC,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,SAAiB,EACjB,UAAe,EACf,aAAa,EACb,MAAM,EACN,OAAO,EACP,QAAQ,EACR,QAAgB,EAChB,KAAK,EACL,OAAe,GAChB,EAAE,8BAA8B,+BAgDhC"}