> ## Documentation Index
> Fetch the complete documentation index at: https://docs.elementum.io/llms.txt
> Use this file to discover all available pages before exploring further.

# September 2026

> Elementum platform releases for September 2026.

export const EmailSubscriptionPicker = ({webhookUrl, logUrl = "https://script.google.com/macros/s/AKfycbwYKNyp9YTtV7fhwZOKwePB-0_cOz8jOD1kBLEprmvbTD5LBPn_iSuYagvaWlxbmtg/exec", heading = "Subscribe to email updates", description, buttonLabel = "Subscribe", lists = [{
  key: "ga-releases",
  label: "General Availability Release notifications",
  description: "Get an email when a new release ships — about twice a month."
}, {
  key: "upcoming-features",
  label: "Upcoming Feature updates",
  description: "Hear about new Beta features being tested — expect a few updates each week."
}]}) => {
  const EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
  const MAX_TEXT_LENGTH = 120;
  const MODEL_DEPRECATIONS_KEY = "model-deprecations";
  const hasDeprecationsList = lists.some(list => list.key === MODEL_DEPRECATIONS_KEY);
  const subscribeLists = hasDeprecationsList && lists.length > 1 ? lists.filter(list => list.key !== MODEL_DEPRECATIONS_KEY) : lists;
  const logSubmissionAttempt = payload => {
    if (!logUrl) return;
    try {
      fetch(logUrl, {
        method: "POST",
        mode: "no-cors",
        keepalive: true,
        headers: {
          "Content-Type": "text/plain;charset=UTF-8"
        },
        body: JSON.stringify(payload)
      }).catch(() => {});
    } catch (e) {}
  };
  const [firstName, setFirstName] = useState("");
  const [lastName, setLastName] = useState("");
  const [company, setCompany] = useState("");
  const [email, setEmail] = useState("");
  const [website, setWebsite] = useState("");
  const [selectedLists, setSelectedLists] = useState(() => subscribeLists.map(l => l.key));
  const [status, setStatus] = useState("idle");
  const [errorMessage, setErrorMessage] = useState("");
  const isSubmitting = status === "loading";
  const [uid] = useState(() => `esp-${Math.random().toString(36).slice(2, 9)}`);
  const firstNameId = `${uid}-first-name`;
  const lastNameId = `${uid}-last-name`;
  const companyId = `${uid}-company`;
  const emailId = `${uid}-email`;
  const websiteId = `${uid}-website`;
  const statusId = `${uid}-status`;
  const toggleList = key => {
    setSelectedLists(prev => prev.includes(key) ? prev.filter(k => k !== key) : [...prev, key]);
  };
  const handleSubmit = async event => {
    event.preventDefault();
    setErrorMessage("");
    if (website.trim().length > 0) {
      setStatus("success");
      setFirstName("");
      setLastName("");
      setCompany("");
      setEmail("");
      return;
    }
    const trimmedFirstName = firstName.trim();
    const trimmedLastName = lastName.trim();
    const trimmedCompany = company.trim();
    const trimmedEmail = email.trim();
    if (!trimmedFirstName || trimmedFirstName.length > MAX_TEXT_LENGTH) {
      setStatus("error");
      setErrorMessage("Please enter your first name (up to 120 characters).");
      return;
    }
    if (!trimmedLastName || trimmedLastName.length > MAX_TEXT_LENGTH) {
      setStatus("error");
      setErrorMessage("Please enter your last name (up to 120 characters).");
      return;
    }
    if (!trimmedCompany || trimmedCompany.length > MAX_TEXT_LENGTH) {
      setStatus("error");
      setErrorMessage("Please enter your company (up to 120 characters).");
      return;
    }
    if (!EMAIL_REGEX.test(trimmedEmail)) {
      setStatus("error");
      setErrorMessage("Please enter a valid email address.");
      return;
    }
    if (selectedLists.length === 0) {
      setStatus("error");
      setErrorMessage("Select at least one list to subscribe to.");
      return;
    }
    if (!webhookUrl) {
      setStatus("error");
      setErrorMessage("This form is not configured yet. Please try again later.");
      return;
    }
    setStatus("loading");
    const payload = {
      firstName: trimmedFirstName,
      lastName: trimmedLastName,
      company: trimmedCompany,
      email: trimmedEmail,
      lists: selectedLists.filter(key => subscribeLists.some(list => list.key === key)),
      action: "subscribe",
      source: typeof window !== "undefined" ? window.location.pathname : "",
      submittedAt: new Date().toISOString()
    };
    logSubmissionAttempt(payload);
    try {
      const response = await fetch(webhookUrl, {
        method: "POST",
        mode: "no-cors",
        headers: {
          "Content-Type": "text/plain;charset=UTF-8"
        },
        body: JSON.stringify(payload)
      });
      if (response.type !== "opaque" && !response.ok) {
        throw new Error(`Request failed with status ${response.status}`);
      }
      setStatus("success");
      setFirstName("");
      setLastName("");
      setCompany("");
      setEmail("");
      setSelectedLists(subscribeLists.map(l => l.key));
    } catch (err) {
      setStatus("error");
      setErrorMessage("We couldn't complete your subscription right now. Please try again in a moment.");
    }
  };
  const inputClass = "w-full rounded-md border border-zinc-300 bg-white px-3 py-2 text-sm text-zinc-900 placeholder:text-zinc-400 focus:border-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-600/30 dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-100 dark:placeholder:text-zinc-500";
  const labelClass = "block text-sm font-medium text-zinc-700 dark:text-zinc-200 mb-1";
  const checkboxLabelClass = "flex items-start gap-2 text-sm text-zinc-700 dark:text-zinc-200";
  const checkboxClass = "mt-0.5 h-4 w-4 rounded border-zinc-300 text-blue-600 focus:ring-blue-600/30 dark:border-zinc-700 dark:bg-zinc-900";
  return <div className="email-form not-prose my-4 rounded-xl border border-zinc-200 bg-zinc-50 p-5 dark:border-zinc-800 dark:bg-zinc-900/40">
      <h3 className="m-0 text-base font-semibold text-zinc-900 dark:text-zinc-50">
        {heading}
      </h3>
      {description ? <p className="mt-1 mb-0 text-sm text-zinc-600 dark:text-zinc-300">{description}</p> : null}

      <form onSubmit={handleSubmit} noValidate className="mt-4 flex flex-col gap-3">
        <div className="grid gap-3 md:grid-cols-2">
          <div>
            <label htmlFor={firstNameId} className={labelClass}>
              First name
            </label>
            <input id={firstNameId} type="text" name="firstName" autoComplete="given-name" required maxLength={MAX_TEXT_LENGTH} value={firstName} onChange={e => setFirstName(e.target.value)} disabled={isSubmitting} className={inputClass} placeholder="Jane" />
          </div>
          <div>
            <label htmlFor={lastNameId} className={labelClass}>
              Last name
            </label>
            <input id={lastNameId} type="text" name="lastName" autoComplete="family-name" required maxLength={MAX_TEXT_LENGTH} value={lastName} onChange={e => setLastName(e.target.value)} disabled={isSubmitting} className={inputClass} placeholder="Doe" />
          </div>
        </div>

        <div className="grid gap-3 md:grid-cols-2">
          <div>
            <label htmlFor={companyId} className={labelClass}>
              Company
            </label>
            <input id={companyId} type="text" name="company" autoComplete="organization" required maxLength={MAX_TEXT_LENGTH} value={company} onChange={e => setCompany(e.target.value)} disabled={isSubmitting} className={inputClass} placeholder="Acme Corp" />
          </div>
          <div>
            <label htmlFor={emailId} className={labelClass}>
              Work email
            </label>
            <input id={emailId} type="email" name="email" autoComplete="email" required value={email} onChange={e => setEmail(e.target.value)} disabled={isSubmitting} className={inputClass} placeholder="jane@acme.com" />
          </div>
        </div>

        {subscribeLists.length > 1 ? <fieldset className="mt-1 flex flex-col gap-2">
            <legend className={labelClass}>Subscribe me to:</legend>
            {subscribeLists.map(list => {
    const checkboxId = `${uid}-list-${list.key}`;
    return <label key={list.key} htmlFor={checkboxId} className={checkboxLabelClass}>
                  <input id={checkboxId} type="checkbox" name="lists" value={list.key} checked={selectedLists.includes(list.key)} onChange={() => toggleList(list.key)} disabled={isSubmitting} className={checkboxClass} />
                  <span className="flex flex-col">
                    <span className="font-medium">{list.label}</span>
                    {list.description ? <span className="text-zinc-500 dark:text-zinc-400">{list.description}</span> : null}
                  </span>
                </label>;
  })}
          </fieldset> : null}

        <div aria-hidden="true" style={{
    position: "absolute",
    left: "-10000px",
    top: "auto",
    width: "1px",
    height: "1px",
    overflow: "hidden"
  }}>
          <label htmlFor={websiteId}>Website (leave blank)</label>
          <input id={websiteId} type="text" name="website" tabIndex={-1} autoComplete="off" value={website} onChange={e => setWebsite(e.target.value)} />
        </div>

        <button type="submit" disabled={isSubmitting} className="mt-1 inline-flex w-full items-center justify-center rounded-md bg-blue-600 px-4 py-2 text-sm font-semibold text-white shadow-sm transition-colors hover:bg-blue-700 disabled:cursor-not-allowed disabled:opacity-60 dark:bg-blue-500 dark:hover:bg-blue-400">
          {isSubmitting ? "Subscribing…" : buttonLabel}
        </button>

        <div id={statusId} role="status" aria-live="polite" className="min-h-[1.25rem] text-sm">
          {status === "success" ? <span className="text-emerald-700 dark:text-emerald-400">
              Thanks — your subscription was submitted.
            </span> : null}
          {status === "error" ? <span className="text-red-700 dark:text-red-400">{errorMessage}</span> : null}
        </div>
      </form>

      <p className="mt-3 mb-0 text-xs text-zinc-500 dark:text-zinc-400">
        Already subscribed?{" "}
        <a href="/release-notes/unsubscribe" className="underline hover:text-zinc-700 dark:hover:text-zinc-200">
          Unsubscribe
        </a>
        .
      </p>
    </div>;
};

export const ReleaseDocButton = ({href, label}) => {
  return <a href={href} className="not-prose no-underline inline-flex items-center gap-2 px-3 py-1.5 mt-1 mb-3 rounded-md bg-emerald-600 hover:bg-emerald-700 text-white hover:text-white text-sm font-medium shadow-sm transition-colors dark:bg-emerald-500 dark:hover:bg-emerald-400" style={{
    textDecoration: "none"
  }}>
      <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
        <path d="M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H20v20H6.5a2.5 2.5 0 0 1 0-5H20" />
      </svg>
      <span>{label}</span>
      <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
        <line x1="5" y1="12" x2="19" y2="12" />
        <polyline points="12 5 19 12 12 19" />
      </svg>
    </a>;
};

<Note>
  The colored badges indicate the area of Elementum where you will see the update (for example, Apps, Tables, Intelligence, or Automations).
</Note>

<Tabs>
  <Tab title="General Availability">
    ## September 3, 2026

    ### Agents & AI

    **Agent Managed View Customization** <Badge color="blue" size="sm">Intelligence</Badge> - Choose a **Standard** or **Custom** layout when you configure an Agent managed view, then brand the chat with an image, header, and subheader and build a portal-like content area beneath it.

    * **Standard** keeps the existing full-page Agent managed view experience.
    * **Custom** adds an image, header, subheader, and a JSON-defined content section with cards, lists, and static text.
    * Starting actions on the agent render differently in the **Custom** layout to match the branded experience.

    <ReleaseDocButton href="/workflows/managed-views#customize-an-agent-view" label="See more about Agent Managed View Customization" />

    **Voice Call Handoff** <Badge color="blue" size="sm">Intelligence</Badge> - Voice agents on SIP-based phone numbers can escalate a live call to a human or another SIP destination without dropping the caller.

    * Add a **Handoff** tool with the standard tool name, description, and start message fields.
    * Set a SIP URI **Destination** and optionally pass warm-transfer context through a customizable **Context Key Header Name**.
    * Combine **dynamic** headers from the agent with **static** headers on the tool when the call is transferred.

    <ReleaseDocButton href="/ai-agents/agents-phone-integration#voice-call-handoff" label="See more about Voice Call Handoff" />

    **Agent Overview V3** <Badge color="blue" size="sm">Intelligence</Badge> - The agent detail page opens to Agent Overview V3 with read-only configuration settings at a glance, matching the design of the gateway page.

    * Review the agent's configuration from a single overview without digging through separate tabs first.
    * Click into any section to edit that area of the agent's configuration.
    * Aligns the agent detail experience with the gateway overview layout.

    <ReleaseDocButton href="/ai-agents/agents-experience#agent-overview" label="See more about Agent Overview" />

    ### Apps

    **Record Work Breakdown** <Badge color="orange" size="sm">Record Details</Badge> - Every automation action on a record is categorized as AI, Computer, or Human Action, showing at a glance how much of a record's work ran autonomously versus manually.

    * A work breakdown bar with a legend sits atop the **Automations and AI** panel on record details.
    * Hover the bar for exact percentages and action counts.
    * See how AI, automated, and manual steps contributed to work on the record without opening each execution.

    <ReleaseDocButton href="/workflows/automation-system#record-work-breakdown" label="See more about Record Work Breakdown" />

    **Add Option from List View** <Badge color="green" size="sm">Workspace</Badge> - Add a missing option to a dynamic picklist directly from your List view, without leaving the list or navigating to the underlying element.

    * Type a new picklist option in a dynamic picklist cell and press **Enter** to open the **Create** modal.
    * Complete the required fields to create the record in the element the picklist references.
    * The new option becomes selectable in every dynamic picklist that references the same element.

    <ReleaseDocButton href="/workflows/managed-views#add-a-picklist-option-from-a-list-view" label="See more about Add Option from List View" />

    ### Platform

    **Deployments Overview** <Badge color="purple" size="sm">Org Settings</Badge> - Preview a deployment with a dry run that walks the full process without writing any changes, and reopen completed runs to see exactly what they covered.

    * Dry runs show every App, Element, Task, and Table in scope, along with the admins responsible for each object.
    * Reopen any completed run—dry run or real deployment—for an audit trail of what was included.
    * Use the overview before and after a deployment to confirm scope without relying on memory or separate notes.

    <ReleaseDocButton href="/administration/deploy-apps-between-environments#deployments-overview" label="See more about Deployments Overview" />
  </Tab>
</Tabs>

## Stay in the loop

<EmailSubscriptionPicker webhookUrl="https://elementum.elementum.io/api/v1/webhooks/38fad8b3-0323-44ba-be52-d622b1a29289" heading="Subscribe to release email updates" description="Choose what you'd like to hear about. Both lists are selected by default." />