> ## 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.

# Help & Resources

> Get help and support for Elementum

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 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(() => lists.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,
      action: "subscribe",
      source: typeof window !== "undefined" ? window.location.pathname : "",
      userAgent: typeof navigator !== "undefined" ? navigator.userAgent : "",
      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(lists.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>

        <fieldset className="mt-1 flex flex-col gap-2">
          <legend className={labelClass}>Subscribe me to:</legend>
          {lists.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>

        <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>;
};

## Need Help?

We're here to help you get the most out of Elementum. Here are the best ways to get support:

<CardGroup cols={2}>
  <Card title="Platform Status" icon="server" href="/support/platform-status">
    Check real-time platform health and subscribe to incident notifications
  </Card>

  <Card title="Support Policy" icon="shield" href="https://www.elementum.ai/support-policy">
    Review our customer support policies, response times, and system availability
  </Card>

  <Card title="Email Support" icon="headphones" href="mailto:support@elementum.elementum.io">
    Contact our support team directly to report issues or request features
  </Card>

  <Card title="Connect AI Agents to the Docs" icon="plug" href="/support/mcp-server">
    Give Cursor, Claude, ChatGPT, and other AI tools live access to the Elementum docs via MCP
  </Card>

  <Card title="Launch Your Learning Path" icon="graduation-cap" href="/support/elearning-courses">
    Self-paced, role-based training paths to get your admins and app builders up and running
  </Card>

  <Card title="Documentation Feedback" icon="comment-pen" href="mailto:feedback@elementum.elementum.io">
    Send suggestions, corrections, and ideas for improving these docs
  </Card>
</CardGroup>

## AI Docs Assistant

The AI Docs Assistant is an in-platform chat tool that answers questions about Elementum features and surfaces how-to
guidance without leaving your workspace.

### What you can do with the Docs Assistant

* Ask natural-language questions about Elementum features, configuration, and best practices
* Get how-to guidance and informational content pulled directly from the Elementum documentation
* Browse Quick-link topics to jump straight into the most popular articles
* Follow up on previous answers within the same chat session for additional context

### Open the Docs Assistant

1. Click the <img src="https://mintcdn.com/elementum/wBs0cxKTG93rzjAo/images/icons/help.png?fit=max&auto=format&n=wBs0cxKTG93rzjAo&q=85&s=b88329c3f81efa895413aabe4952caed" alt="Help icon" className="inline-ui-icon" width="24" height="24" data-path="images/icons/help.png" /> **Help** icon in the Elementum navigation bar.
2. Select a Quick-link topic to view a popular article, or type a question into the chat to start a conversation.

<Tip>
  Be specific when asking questions. Including the feature name, the action you're trying to take, or an error message
  helps the assistant return the most relevant guidance.
</Tip>

## Documentation Feedback

Help us improve the docs by sending suggestions, corrections, and ideas to
[feedback@elementum.elementum.io](mailto:feedback@elementum.elementum.io). Screenshots and links to specific pages are
always welcome.

Here are the kinds of feedback we're looking for:

* **Flag what's unclear** — Found a confusing paragraph or a missing step? Send it our way — even a screenshot helps.
* **Suggest examples** — Have a workflow pattern other partners would benefit from? We want it in the docs.
* **Report doc bugs** — Broken links, code that no longer matches the UI, outdated screenshots — please report them.
* **Share use cases** — Tell us where Elementum is fitting into your stack so we can document the patterns that matter.

<Note>
  For product issues or platform incidents, use [Email Support](mailto:support@elementum.elementum.io) instead. The
  documentation feedback inbox is for the docs site itself.
</Note>

## Self Help Resources

<AccordionGroup>
  <Accordion title="Getting Started">
    <p>Follow our <a href="/getting-started/quickstart">quick start guide</a> to get started with a new app.</p>
  </Accordion>

  <Accordion title="API Integration">
    <p>Need help integrating with our API? Check out our <a href="/api-reference/api-introduction">API documentation</a> for detailed guides and examples.</p>
  </Accordion>

  <Accordion title="Troubleshooting">
    <p>Experiencing issues? Visit our <a href="/support/troubleshooting">troubleshooting section</a> for common problems and solutions.</p>
  </Accordion>
</AccordionGroup>

## Response Times

* **Email Support**: We typically respond within 24 hours during business days
* **Documentation**: Available 24/7 for self-service support
* **FAQ**: Answers to common questions in the [FAQ](/support/faq/faq-apps) section

## Before Contacting Support

**Check Platform Status First**: Before reaching out to support, always check our [Platform Status Page](/support/platform-status) to verify if there are any known platform issues or maintenance activities that might be affecting your experience.

To help us assist you faster, please have the following information ready:

* Your Elementum workspace URL
* A clear description of the issue you're experiencing
* Any error messages you're seeing
* Steps to reproduce the problem
* Your browser and operating system information

## Stay in the loop

Subscribe to hear about new releases and what's coming next. We send brief, infrequent emails — no spam.

<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." />