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

# Suki SDKs Overview

> Overview of the Web SDK, Headless Web SDK, Mobile SDK, and Dictation SDK on the Suki Developer Platform, with links to quickstarts, changelogs, and integration guidance

export const SdkStartIcon = ({ variant, children }) => (
  <span className={`sdk-overview-start-icon sdk-overview-start-icon--${variant}`} aria-hidden="true">
    {children}
  </span>
);

<div className="hp-wrap api-overview-wrap sdk-overview-wrap">
  <div className="api-overview-openai-hero">
    <div className="api-overview-hero-layout">
      <div className="api-overview-openai-hero-left api-overview-hero-doc">
        <h1 className="sdk-overview-main-title api-overview-hero-page-title">Suki SDKs</h1>

        <p className="hp-journey-lead api-overview-hero-lead">
          Suki provides npm packages and native SDKs to integrate Suki's ambient intelligence capabilities. Features and integrations vary by SDK, so review changelogs and migration notes before upgrading.
        </p>

        <div className="api-overview-hero-doc-sections">
          <div className="api-overview-hero-doc-section">
            <h2 className="hp-journey-hero-line">Introduction</h2>

            <p className="api-overview-hero-doc-text">
              Suki SDKs help you add ambient documentation, Form filling, and dictation to web and mobile applications. Choose
              the Web SDK, Headless Web SDK, Mobile SDK, or Dictation SDK based on your platform, UI needs, and workflow.
            </p>

            <br />

            <p className="api-overview-hero-doc-text">
              Install the SDK package, follow the product guide, and review the changelog before you upgrade. Use Suki APIs
              with SDKs when your backend needs server-side workflows or webhook integrations.
            </p>
          </div>

          <div className="api-overview-hero-doc-section">
            <h2 className="hp-journey-hero-line">How it works</h2>

            <p className="api-overview-hero-doc-text">
              Configure authentication, initialize the SDK, then create or resume a session. Depending on the SDK, you stream
              audio, capture dictation, or retrieve generated clinical output.
            </p>

            <br />

            <p className="api-overview-hero-doc-text">
              Each SDK has its own authentication flow, supported features, and integration pattern. Review the SDK-specific guide before you deploy to staging or production.
            </p>
          </div>

          <div className="api-overview-hero-doc-section">
            <h2 className="hp-journey-hero-line">Authentication</h2>

            <p className="api-overview-hero-doc-text">
              SDK access is available only to approved partners. Complete{" "}

              <a href="/documentation/partner-onboarding" className="link">
                Partner onboarding
              </a>

              {", then follow the authentication guide for your selected SDK."}
            </p>

            <p className="api-overview-hero-doc-text">
              For credentials, staging access, or production rollout support, contact{" "}

              <a href="/documentation/support" className="link">
                Support
              </a>

              {" "}

              or your Suki partnership contact.
            </p>
          </div>
        </div>

        <div className="api-overview-hero-btn-row">
          <a href="/sdk-overview/quickstart" className="hp-cta hp-cta-primary">
            Get Started
          </a>

          <a href="/documentation/partner-authentication" className="hp-cta hp-cta-secondary api-overview-hero-auth-cta">
            Authentication
          </a>
        </div>
      </div>

      <div role="complementary" className="api-overview-hero-aside" aria-label="SDK installation commands, support contact, best practices, and initialize examples">
        <div className="api-overview-hero-meta-stack">
          <div className="api-overview-meta-card">
            <h3 className="api-overview-meta-card-title">Installation Commands</h3>

            <ul className="api-overview-meta-download-list">
              <li>
                <button type="button" className="api-overview-meta-download-row" data-suki-clipboard="npm install @suki-sdk/react @suki-sdk/core" aria-label="Copy Web npm install command">
                  <span className="api-overview-meta-download-row-main">
                    <span className="api-overview-meta-install-label">Web</span>
                    <code className="api-overview-meta-file-name">npm install @suki-sdk/react @suki-sdk/core</code>
                  </span>

                  <span className="api-overview-meta-row-trailing" aria-hidden="true">
                    <svg className="api-overview-meta-sprite" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
                      <rect width="14" height="14" x="8" y="8" rx="2" ry="2" />

                      <path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" />
                    </svg>
                  </span>
                </button>
              </li>

              <li>
                <button type="button" className="api-overview-meta-download-row" data-suki-clipboard="# Mobile SDK (Xcode): download SukiAmbientCore.framework, drag it into the project navigator, set Embed & Sign. See /mobile-sdk/installation." aria-label="Copy Mobile Xcode setup reminder">
                  <span className="api-overview-meta-download-row-main">
                    <span className="api-overview-meta-install-label">Mobile</span>

                    <code className="api-overview-meta-file-name">
                      # Xcode: SukiAmbientCore.framework (Embed & Sign). See Mobile SDK installation.
                    </code>
                  </span>

                  <span className="api-overview-meta-row-trailing" aria-hidden="true">
                    <svg className="api-overview-meta-sprite" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
                      <rect width="14" height="14" x="8" y="8" rx="2" ry="2" />

                      <path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" />
                    </svg>
                  </span>
                </button>
              </li>

              <li>
                <button type="button" className="api-overview-meta-download-row" data-suki-clipboard="npm install @suki-sdk/platform-react" aria-label="Copy Headless npm install command">
                  <span className="api-overview-meta-download-row-main">
                    <span className="api-overview-meta-install-label">Headless</span>
                    <code className="api-overview-meta-file-name">npm install @suki-sdk/platform-react</code>
                  </span>

                  <span className="api-overview-meta-row-trailing" aria-hidden="true">
                    <svg className="api-overview-meta-sprite" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
                      <rect width="14" height="14" x="8" y="8" rx="2" ry="2" />

                      <path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" />
                    </svg>
                  </span>
                </button>
              </li>

              <li>
                <button type="button" className="api-overview-meta-download-row" data-suki-clipboard="npm install @suki-sdk/core @suki-sdk/dictation-react @suki-sdk/dictation" aria-label="Copy Dictation npm install command">
                  <span className="api-overview-meta-download-row-main">
                    <span className="api-overview-meta-install-label">Dictation</span>

                    <code className="api-overview-meta-file-name">
                      npm install @suki-sdk/core @suki-sdk/dictation-react @suki-sdk/dictation
                    </code>
                  </span>

                  <span className="api-overview-meta-row-trailing" aria-hidden="true">
                    <svg className="api-overview-meta-sprite" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
                      <rect width="14" height="14" x="8" y="8" rx="2" ry="2" />

                      <path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" />
                    </svg>
                  </span>
                </button>
              </li>
            </ul>
          </div>

          <div className="api-overview-meta-card">
            <h3 className="api-overview-meta-card-title">Support & Best Practices</h3>

            <div className="api-overview-meta-kv-stack">
              <div className="api-overview-meta-kv api-overview-meta-kv--last">
                <span className="api-overview-meta-k">SDK support</span>

                <div className="api-overview-meta-kv-line api-overview-meta-kv-line--tight">
                  <a className="api-overview-meta-kv-mail" href="mailto:support@suki.ai">
                    [support@suki.ai](mailto:support@suki.ai)
                  </a>

                  <span className="api-overview-meta-kv-actions">
                    <button type="button" className="api-overview-icon-btn" data-suki-clipboard="support@suki.ai" aria-label="Copy support email address">
                      <svg className="api-overview-meta-sprite" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
                        <rect width="14" height="14" x="8" y="8" rx="2" ry="2" />

                        <path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" />
                      </svg>
                    </button>

                    <a className="api-overview-icon-btn" href="mailto:support@suki.ai" title="Email support@suki.ai">
                      <span className="sr-only">Email support</span>

                      <svg className="api-overview-meta-sprite" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
                        <rect width="20" height="16" x="2" y="4" rx="2" />

                        <path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7" />
                      </svg>
                    </a>
                  </span>
                </div>
              </div>
            </div>

            <div className="api-overview-meta-best-practices">
              <Tip>
                #### Best practices

                * Store **partnerId**, **partnerToken**, and issued tokens securely; rotate credentials per your security policy.
                * Request microphone permission before capture starts; handle denial and prompts clearly in your UI.
                * Send SDK traffic over HTTPS; surface authentication failures and network errors using the patterns in each SDK guide.
                * Test across devices, OS versions, and network conditions before production rollout.
                * Always use the **latest versions of the SDKs** to get the latest features and bug fixes.
              </Tip>
            </div>
          </div>

          <div className="api-overview-meta-card api-overview-meta-card--langs">
            <h3 className="api-overview-meta-card-title">Languages</h3>

            <div className="hp-hero-code-custom api-overview-lang-code" data-hp-hero-code aria-label="SDK initialize examples for React, JavaScript, and Swift (Mobile SDK)">
              <div className="hp-hero-code-tabbar" role="tablist" aria-orientation="horizontal">
                <button type="button" className="hp-hero-code-tab is-active" role="tab" id="sdk-overview-hub-lang-tab-react" aria-selected="true" aria-controls="sdk-overview-hub-lang-panel-react" data-hp-hero-tab="react" tabIndex={0}>
                  <span className="hp-hero-code-tab-lead" aria-hidden="true">
                    <span className="hp-hero-code-tab-check-wrap">
                      <svg className="hp-hero-code-tab-check" 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">
                        <path d="M20 6 9 17l-5-5" />
                      </svg>
                    </span>

                    <span className="hp-hero-code-tab-icon hp-hero-code-tab-icon--react" aria-hidden="true">
                      <svg className="hp-hero-code-lang-svg" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" aria-hidden="true" role="img">
                        <path fill="currentColor" d="M14.23 12.004a2.236 2.236 0 0 1-2.235 2.236 2.236 2.236 0 0 1-2.236-2.236 2.236 2.236 0 0 1 2.235-2.236 2.236 2.236 0 0 1 2.236 2.236zm2.648-10.69c-1.346 0-3.107.96-4.888 2.622-1.78-1.653-3.542-2.602-4.887-2.602-.41 0-.783.093-1.106.278-1.375.793-1.683 3.264-.973 6.365C1.98 8.917 0 10.42 0 12.004c0 1.59 1.99 3.097 5.043 4.03-.704 3.113-.39 5.588.988 6.38.32.187.69.275 1.102.275 1.345 0 3.107-.96 4.888-2.624 1.78 1.654 3.542 2.603 4.887 2.603.41 0 .783-.09 1.106-.275 1.374-.792 1.683-3.263.973-6.365C22.02 15.096 24 13.59 24 12.004c0-1.59-1.99-3.097-5.043-4.032.704-3.11.39-5.587-.988-6.38-.318-.184-.688-.277-1.092-.278zm-.005 1.09v.006c.225 0 .406.044.558.127.666.382.955 1.835.73 3.704-.054.46-.142.945-.25 1.44-.96-.236-2.006-.417-3.107-.534-.66-.905-1.345-1.727-2.035-2.447 1.592-1.48 3.087-2.292 4.105-2.295zm-9.77.02c1.012 0 2.514.808 4.11 2.28-.686.72-1.37 1.537-2.02 2.442-1.107.117-2.154.298-3.113.538-.112-.49-.195-.964-.254-1.42-.23-1.868.054-3.32.714-3.707.19-.09.4-.127.563-.132zm4.882 3.05c.455.468.91.992 1.36 1.564-.44-.02-.89-.034-1.345-.034-.46 0-.915.01-1.36.034.44-.572.895-1.096 1.345-1.565zM12 8.1c.74 0 1.477.034 2.202.093.406.582.802 1.203 1.183 1.86.372.64.71 1.29 1.018 1.946-.308.655-.646 1.31-1.013 1.95-.38.66-.773 1.288-1.18 1.87-.728.063-1.466.098-2.21.098-.74 0-1.477-.035-2.202-.093-.406-.582-.802-1.204-1.183-1.86-.372-.64-.71-1.29-1.018-1.946.303-.657.646-1.313 1.013-1.954.38-.66.773-1.286 1.18-1.868.728-.064 1.466-.098 2.21-.098zm-3.635.254c-.24.377-.48.763-.704 1.16-.225.39-.435.782-.635 1.174-.265-.656-.49-1.31-.676-1.947.64-.15 1.315-.283 2.015-.386zm7.26 0c.695.103 1.365.23 2.006.387-.18.632-.405 1.282-.66 1.933-.2-.39-.41-.783-.64-1.174-.225-.392-.465-.774-.705-1.146zm3.063.675c.484.15.944.317 1.375.498 1.732.74 2.852 1.708 2.852 2.476-.005.768-1.125 1.74-2.857 2.475-.42.18-.88.342-1.355.493-.28-.958-.646-1.956-1.1-2.98.45-1.017.81-2.01 1.085-2.964zm-13.395.004c.278.96.645 1.957 1.1 2.98-.45 1.017-.812 2.01-1.086 2.964-.484-.15-.944-.318-1.37-.5-1.732-.737-2.852-1.706-2.852-2.474 0-.768 1.12-1.742 2.852-2.476.42-.18.88-.342 1.356-.494zm11.678 4.28c.265.657.49 1.312.676 1.948-.64.157-1.316.29-2.016.39.24-.375.48-.762.705-1.158.225-.39.435-.788.636-1.18zm-9.945.02c.2.392.41.783.64 1.175.23.39.465.772.705 1.143-.695-.102-1.365-.23-2.006-.386.18-.63.406-1.282.66-1.933zM17.92 16.32c.112.493.2.968.254 1.423.23 1.868-.054 3.32-.714 3.708-.147.09-.338.128-.563.128-1.012 0-2.514-.807-4.11-2.28.686-.72 1.37-1.536 2.02-2.44 1.107-.118 2.154-.3 3.113-.54zm-11.83.01c.96.234 2.006.415 3.107.532.66.905 1.345 1.727 2.035 2.446-1.595 1.483-3.092 2.295-4.11 2.295-.22-.005-.406-.05-.553-.132-.666-.38-.955-1.834-.73-3.703.054-.46.142-.944.25-1.438zm4.56.64c.44.02.89.034 1.345.034.46 0 .915-.01 1.36-.034-.44.572-.895 1.095-1.345 1.565-.455-.47-.91-.993-1.36-1.565z" />
                      </svg>
                    </span>
                  </span>

                  <span className="hp-hero-code-tab-label">React</span>
                </button>

                <button type="button" className="hp-hero-code-tab" role="tab" id="sdk-overview-hub-lang-tab-js" aria-selected="false" aria-controls="sdk-overview-hub-lang-panel-js" data-hp-hero-tab="javascript" tabIndex={-1}>
                  <span className="hp-hero-code-tab-lead" aria-hidden="true">
                    <span className="hp-hero-code-tab-check-wrap">
                      <svg className="hp-hero-code-tab-check" 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">
                        <path d="M20 6 9 17l-5-5" />
                      </svg>
                    </span>

                    <span className="hp-hero-code-tab-icon hp-hero-code-tab-icon--javascript" aria-hidden="true">
                      <svg className="hp-hero-code-lang-svg" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" aria-hidden="true" role="img">
                        <path fill="currentColor" d="M0 0h24v24H0V0zm22.034 18.276c-.175-1.095-.888-2.015-3.003-2.873-.736-.345-1.554-.585-1.797-1.14-.091-.33-.105-.51-.046-.705.15-.646.915-.84 1.515-.66.39.12.75.42.976.9 1.034-.676 1.034-.676 1.755-1.125-.27-.42-.404-.601-.586-.78-.63-.705-1.469-1.065-2.834-1.034l-.705.089c-.676.165-1.32.525-1.71 1.005-1.14 1.291-.811 3.541.569 4.471 1.365 1.02 3.361 1.244 3.616 2.205.24 1.17-.87 1.545-1.966 1.41-.811-.18-1.26-.586-1.755-1.336l-1.83 1.051c.21.48.45.689.81 1.109 1.74 1.756 6.09 1.666 6.871-1.004.029-.09.24-.705.074-1.65l.046.067zm-8.983-7.245h-2.248c0 1.938-.009 3.864-.009 5.805 0 1.232.063 2.363-.138 2.711-.33.689-1.18.601-1.566.48-.396-.196-.597-.466-.83-.855-.063-.105-.11-.196-.127-.196l-1.825 1.125c.305.63.75 1.172 1.324 1.517.855.51 2.004.675 3.207.405.783-.226 1.458-.691 1.811-1.411.51-.93.402-2.07.397-3.346.012-2.054 0-4.109 0-6.179l.004-.056z" />
                      </svg>
                    </span>
                  </span>

                  <span className="hp-hero-code-tab-label">JavaScript</span>
                </button>

                <button type="button" className="hp-hero-code-tab" role="tab" id="sdk-overview-hub-lang-tab-swift" aria-selected="false" aria-controls="sdk-overview-hub-lang-panel-swift" data-hp-hero-tab="swift" tabIndex={-1}>
                  <span className="hp-hero-code-tab-lead" aria-hidden="true">
                    <span className="hp-hero-code-tab-check-wrap">
                      <svg className="hp-hero-code-tab-check" 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">
                        <path d="M20 6 9 17l-5-5" />
                      </svg>
                    </span>

                    <span className="hp-hero-code-tab-icon" aria-hidden="true">
                      <svg className="hp-hero-code-lang-svg" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" aria-hidden="true" role="img">
                        <path fill="currentColor" d="M7.508 0c-.287 0-.573 0-.86.002-.241.002-.483.003-.724.01-.132.003-.263.009-.395.015A9.154 9.154 0 0 0 4.348.15 5.492 5.492 0 0 0 2.85.645 5.04 5.04 0 0 0 .645 2.848c-.245.48-.4.972-.495 1.5-.093.52-.122 1.05-.136 1.576a35.2 35.2 0 0 0-.012.724C0 6.935 0 7.221 0 7.508v8.984c0 .287 0 .575.002.862.002.24.005.481.012.722.014.526.043 1.057.136 1.576.095.528.25 1.02.495 1.5a5.03 5.03 0 0 0 2.205 2.203c.48.244.97.4 1.498.495.52.093 1.05.124 1.576.138.241.007.483.009.724.01.287.002.573.002.86.002h8.984c.287 0 .573 0 .86-.002.241-.001.483-.003.724-.01a10.523 10.523 0 0 0 1.578-.138 5.322 5.322 0 0 0 1.498-.495 5.035 5.035 0 0 0 2.203-2.203c.245-.48.4-.972.495-1.5.093-.52.124-1.05.138-1.576.007-.241.009-.481.01-.722.002-.287.002-.575.002-.862V7.508c0-.287 0-.573-.002-.86a33.662 33.662 0 0 0-.01-.724 10.5 10.5 0 0 0-.138-1.576 5.328 5.328 0 0 0-.495-1.5A5.039 5.039 0 0 0 21.152.645 5.32 5.32 0 0 0 19.654.15a10.493 10.493 0 0 0-1.578-.138 34.98 34.98 0 0 0-.722-.01C17.067 0 16.779 0 16.492 0H7.508zm6.035 3.41c4.114 2.47 6.545 7.162 5.549 11.131-.024.093-.05.181-.076.272l.002.001c2.062 2.538 1.5 5.258 1.236 4.745-1.072-2.086-3.066-1.568-4.088-1.043a6.803 6.803 0 0 1-.281.158l-.02.012-.002.002c-2.115 1.123-4.957 1.205-7.812-.022a12.568 12.568 0 0 1-5.64-4.838c.649.48 1.35.902 2.097 1.252 3.019 1.414 6.051 1.311 8.197-.002C9.651 12.73 7.101 9.67 5.146 7.191a10.628 10.628 0 0 1-1.005-1.384c2.34 2.142 6.038 4.83 7.365 5.576C8.69 8.408 6.208 4.743 6.324 4.86c4.436 4.47 8.528 6.996 8.528 6.996.154.085.27.154.36.213.085-.215.16-.437.224-.668.708-2.588-.09-5.548-1.893-7.992z" />
                      </svg>
                    </span>
                  </span>

                  <span className="hp-hero-code-tab-label">Swift</span>
                </button>
              </div>

              <div className="hp-hero-code-panels">
                <div className="hp-hero-code-panel is-active" id="sdk-overview-hub-lang-panel-react" role="tabpanel" aria-labelledby="sdk-overview-hub-lang-tab-react" data-hp-hero-panel="react">
                  ```tsx theme={"theme":{"light":"github-dark","dark":"material-theme-darker"}}
                  import { SukiProvider } from '@suki-sdk/react';

                  export function App() {
                    return (
                      <SukiProvider>
                        {/* Your app */}
                      </SukiProvider>
                    );
                  }
                  ```
                </div>

                <div className="hp-hero-code-panel" hidden id="sdk-overview-hub-lang-panel-js" role="tabpanel" aria-labelledby="sdk-overview-hub-lang-tab-js" data-hp-hero-panel="javascript">
                  ```javascript theme={"theme":{"light":"github-dark","dark":"material-theme-darker"}}
                  import { SukiAuthManager } from '@suki-sdk/core';
                  import { initialize } from '@suki-sdk/js';

                  const authManager = new SukiAuthManager({
                    partnerId: 'your-partner-id',
                    partnerToken: 'your-partner-token',
                    providerName: 'Jane Doe',
                    providerOrgId: 'org-123',
                    environment: 'production',
                    loginOnInitialize: true,
                  });

                  const sdkClient = initialize({ authManager });
                  ```
                </div>

                <div className="hp-hero-code-panel" hidden id="sdk-overview-hub-lang-panel-swift" role="tabpanel" aria-labelledby="sdk-overview-hub-lang-tab-swift" data-hp-hero-panel="swift">
                  ```swift theme={"theme":{"light":"github-dark","dark":"material-theme-darker"}}
                  import SukiAmbientCore

                  SukiAmbientCoreManager.shared.environment = .stage

                  let partnerInfo: [String: AnyHashable] = [
                      SukiAmbientConstant.kPartnerId: "your-partner-id",
                      SukiAmbientConstant.kProviderInfo: [
                          SukiAmbientConstant.kOrgId: "your-org-id",
                          SukiAmbientConstant.kName: "Provider name",
                          SukiAmbientConstant.kId: "provider-id",
                          SukiAmbientConstant.kSpeciality: "FAMILY_MEDICINE",
                      ],
                  ]

                  try SukiAmbientCore.shared.initialize(
                      withPartnerInfo: partnerInfo,
                      with: true,
                      onCompletion: { _ in },
                      withSessionDelegate: self,
                      withTokenProvider: self
                  )
                  ```
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <section className="hp-journey hp-journey--use-case api-overview-workflows-section" aria-labelledby="sdk-overview-workflows-title">
    <div className="hp-journey-use-case-intro">
      <p className="hp-journey-eyebrow hp-journey-eyebrow--use-case-intro">Choose your SDK workflow</p>

      <h2 id="sdk-overview-workflows-title" className="hp-journey-hero-line">
        Available SDKs
      </h2>

      <p className="hp-journey-lead hp-journey-lead--use-case" style={{ fontSize: '16px' }}>
        Pick the SDK for your use case and workflow and start building your integration.
      </p>
    </div>

    <div className="sdk-overview-workflow-filter-scope" data-active-workflow="all">
      <div className="release-notes-workflow-pills sdk-overview-workflow-filter-toolbar" role="tablist" aria-label="Filter SDKs by workflow">
        <button type="button" role="tab" className="release-notes-workflow-pill release-notes-workflow-pill--active sdk-overview-workflow-filter-pill" data-workflow-filter="all" aria-selected="true" aria-controls="sdk-overview-workflow-cards-panel">
          All
        </button>

        <button type="button" role="tab" className="release-notes-workflow-pill sdk-overview-workflow-filter-pill" data-workflow-filter="ambient" aria-selected="false" aria-controls="sdk-overview-workflow-cards-panel">
          <span className="release-notes-workflow-pill-icon" aria-hidden="true">
            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
              <path fill="none" d="M22 12 18 12 15 21 9 3 6 12 2 12" />
            </svg>
          </span>

          <span className="release-notes-workflow-pill-label">Ambient</span>
        </button>

        <button type="button" role="tab" className="release-notes-workflow-pill sdk-overview-workflow-filter-pill" data-workflow-filter="dictation" aria-selected="false" aria-controls="sdk-overview-workflow-cards-panel">
          <span className="release-notes-workflow-pill-icon" aria-hidden="true">
            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
              <path d="M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z" />

              <path d="M19 10v2a7 7 0 0 1-14 0v-2" />

              <line x1="12" x2="12" y1="19" y2="22" />
            </svg>
          </span>

          <span className="release-notes-workflow-pill-label">Dictation</span>
        </button>

        <button type="button" role="tab" className="release-notes-workflow-pill sdk-overview-workflow-filter-pill" data-workflow-filter="form-filling" aria-selected="false" aria-controls="sdk-overview-workflow-cards-panel">
          <span className="release-notes-workflow-pill-icon" aria-hidden="true">
            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
              <rect width="8" height="4" x="8" y="2" rx="1" ry="1" />

              <path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2" />

              <path d="M12 11h4" />

              <path d="M12 16h4" />

              <path d="M8 11h.01" />

              <path d="M8 16h.01" />
            </svg>
          </span>

          <span className="release-notes-workflow-pill-label">Form filling</span>
        </button>
      </div>

      <div className="hp-home-features hp-home-features--graphic-links api-overview-workflow-home-cards" id="sdk-overview-workflow-cards-panel" role="tabpanel" aria-label="SDK cards for selected workflow">
        <div className="api-overview-workflow-card-stack" data-sdk-workflows="ambient,dictation">
          <a href="/web-sdk/overview" className="hp-home-feature-graphic-link hp-sdk-simple-card" aria-label="Web SDK">
            <span className="hp-sdk-simple-card__title">Web SDK</span>

            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" fill="none" aria-hidden="true" className="hp-sdk-simple-card__art">
              <rect x="10" y="14" width="44" height="36" rx="4" stroke="currentColor" strokeWidth="1.25" />

              <path d="M10 22h44" stroke="currentColor" strokeWidth="1.25" />

              <rect x="14" y="28" width="12" height="18" rx="2" stroke="currentColor" strokeWidth="3" />

              <rect x="30" y="28" width="20" height="8" rx="2" stroke="currentColor" strokeWidth="3" />

              <path d="M30 40h20" stroke="currentColor" strokeWidth="1.25" strokeLinecap="round" />

              <path d="M30 46h14" stroke="currentColor" strokeWidth="1.25" strokeLinecap="round" />
            </svg>
          </a>

          <div className="api-overview-workflow-badges" aria-hidden="true">
            <span className="api-overview-workflow-pill">JavaScript</span>
            <span className="api-overview-workflow-pill">React</span>
            <span className="api-overview-workflow-pill">Headed</span>
          </div>
        </div>

        <div className="api-overview-workflow-card-stack" data-sdk-workflows="ambient">
          <a href="/mobile-sdk/overview" className="hp-home-feature-graphic-link hp-sdk-simple-card" aria-label="Mobile SDK">
            <span className="hp-sdk-simple-card__title">Mobile SDK</span>

            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" fill="none" aria-hidden="true" className="hp-sdk-simple-card__art">
              <rect x="22" y="8" width="20" height="48" rx="5" stroke="currentColor" strokeWidth="1.25" />

              <rect x="26" y="14" width="12" height="34" rx="2" stroke="currentColor" strokeWidth="3" />

              <circle cx="32" cy="52" r="1.5" fill="currentColor" />
            </svg>
          </a>

          <div className="api-overview-workflow-badges" aria-hidden="true">
            <span className="api-overview-workflow-pill">Swift</span>
            <span className="api-overview-workflow-pill">iOS</span>
          </div>
        </div>

        <div className="api-overview-workflow-card-stack" data-sdk-workflows="ambient">
          <a href="/headless-web-sdk/introduction" className="hp-home-feature-graphic-link hp-sdk-simple-card" aria-label="Headless SDK">
            <span className="hp-sdk-simple-card__title">Headless SDK</span>

            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" fill="none" aria-hidden="true" className="hp-sdk-simple-card__art">
              <rect x="12" y="14" width="40" height="36" rx="4" stroke="currentColor" strokeWidth="1.25" />

              <path d="M18 26l4 4-4 4" stroke="currentColor" strokeWidth="3" strokeLinecap="round" strokeLinejoin="round" />

              <path d="M28 30h14" stroke="currentColor" strokeWidth="3" strokeLinecap="round" />

              <path d="M18 38h24" stroke="currentColor" strokeWidth="1.25" strokeLinecap="round" />

              <path d="M18 44h18" stroke="currentColor" strokeWidth="1.25" strokeLinecap="round" />
            </svg>
          </a>

          <div className="api-overview-workflow-badges" aria-hidden="true">
            <span className="api-overview-workflow-pill">React</span>
            <span className="api-overview-workflow-pill">Headless</span>
          </div>
        </div>

        <div className="api-overview-workflow-card-stack" data-sdk-workflows="dictation">
          <a href="/dictation-sdk/introduction" className="hp-home-feature-graphic-link hp-sdk-simple-card" aria-label="Dictation SDK">
            <span className="hp-sdk-simple-card__title">Dictation SDK</span>

            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" fill="none" aria-hidden="true" className="hp-sdk-simple-card__art">
              <rect x="26" y="12" width="12" height="20" rx="6" stroke="currentColor" strokeWidth="3" />

              <path d="M20 26a12 12 0 0 0 24 0" stroke="currentColor" strokeWidth="1.25" strokeLinecap="round" />

              <path d="M32 38v8" stroke="currentColor" strokeWidth="1.25" strokeLinecap="round" />

              <path d="M24 46h16" stroke="currentColor" strokeWidth="1.25" strokeLinecap="round" />
            </svg>
          </a>

          <div className="api-overview-workflow-badges" aria-hidden="true">
            <span className="api-overview-workflow-pill">React</span>
            <span className="api-overview-workflow-pill">IFRAME</span>
          </div>
        </div>

        <div className="api-overview-workflow-card-stack" data-sdk-workflows="form-filling">
          <div className="hp-home-feature-graphic-link hp-sdk-simple-card hp-home-feature-graphic-link--static sdk-overview-workflow-card--soon" role="group" aria-label="Form Filling SDK (coming soon)">
            <span className="hp-sdk-simple-card__title">Form Filling SDK</span>

            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" fill="none" aria-hidden="true" className="hp-sdk-simple-card__art">
              <rect x="12" y="14" width="16" height="16" rx="3" stroke="currentColor" strokeWidth="3" />

              <rect x="36" y="14" width="16" height="16" rx="3" stroke="currentColor" strokeWidth="1.25" />

              <rect x="12" y="34" width="16" height="16" rx="3" stroke="currentColor" strokeWidth="1.25" />

              <rect x="36" y="34" width="16" height="16" rx="3" stroke="currentColor" strokeWidth="3" />
            </svg>
          </div>

          <div className="api-overview-workflow-badges" aria-hidden="true">
            <span className="api-overview-workflow-pill">Coming soon</span>
          </div>
        </div>
      </div>
    </div>
  </section>

  <div className="api-overview-decide-workflow-row">
    <a href="/documentation/workflows" className="hp-cta hp-cta-primary hp-cta-with-icon api-overview-decide-workflow-cta" aria-label="Decide your SDK path">
      Decide Your SDK Path

      <span className="hp-cta-icon hp-cta-icon-arrow-text" aria-hidden="true">
        →
      </span>
    </a>
  </div>

  <div className="sdk-overview-intro">
    <h2 className="hp-journey-hero-line">Start building</h2>

    <div className="sdk-overview-start-grid">
      <a href="/documentation/integration-decision-guide" className="sdk-overview-start-tile">
        <SdkStartIcon variant="workflows">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
            <rect width="7" height="7" x="3" y="3" rx="1" />

            <rect width="7" height="7" x="14" y="3" rx="1" />

            <rect width="7" height="7" x="3" y="14" rx="1" />

            <rect width="7" height="7" x="14" y="14" rx="1" />
          </svg>
        </SdkStartIcon>

        <span>
          <span className="sdk-overview-start-title">Workflows Overview</span>
          <span className="sdk-overview-start-desc">Learn more about comparing SDKs and how to choose your integration path.</span>
        </span>
      </a>

      <a href="/web-sdk/guides/ambient-implementation" className="sdk-overview-start-tile">
        <SdkStartIcon variant="web">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
            <path d="M14.23 12.004a2.236 2.236 0 0 1-2.235 2.236 2.236 2.236 0 0 1-2.236-2.236 2.236 2.236 0 0 1 2.235-2.236 2.236 2.236 0 0 1 2.236 2.236zm2.648-10.69c-1.346 0-3.107.96-4.888 2.622-1.78-1.653-3.542-2.602-4.887-2.602-.41 0-.783.093-1.106.278-1.375.793-1.683 3.264-.973 6.365C1.98 8.917 0 10.42 0 12.004c0 1.59 1.99 3.097 5.043 4.03-.704 3.113-.39 5.588.988 6.38.32.187.69.275 1.102.275 1.345 0 3.107-.96 4.888-2.624 1.78 1.654 3.542 2.603 4.887 2.603.41 0 .783-.09 1.106-.275 1.374-.792 1.683-3.263.973-6.365C22.02 15.096 24 13.59 24 12.004c0-1.59-1.99-3.097-5.043-4.032.704-3.11.39-5.587-.988-6.38-.318-.184-.688-.277-1.092-.278zm-.005 1.09v.006c.225 0 .406.044.558.127.666.382.955 1.835.73 3.704-.054.46-.142.945-.25 1.44-.96-.236-2.006-.417-3.107-.534-.66-.905-1.345-1.727-2.035-2.447 1.592-1.48 3.087-2.292 4.105-2.295zm-9.77.02c1.012 0 2.514.808 4.11 2.28-.686.72-1.37 1.537-2.02 2.442-1.107.117-2.154.298-3.113.538-.112-.49-.195-.964-.254-1.42-.23-1.868.054-3.32.714-3.707.19-.09.4-.127.563-.132zm4.882 3.05c.455.468.91.992 1.36 1.564-.44-.02-.89-.034-1.345-.034-.46 0-.915.01-1.36.034.44-.572.895-1.096 1.345-1.565zM12 8.1c.74 0 1.477.034 2.202.093.406.582.802 1.203 1.183 1.86.372.64.71 1.29 1.018 1.946-.308.655-.646 1.31-1.013 1.95-.38.66-.773 1.288-1.18 1.87-.728.063-1.466.098-2.21.098-.74 0-1.477-.035-2.202-.093-.406-.582-.802-1.204-1.183-1.86-.372-.64-.71-1.29-1.018-1.946.303-.657.646-1.313 1.013-1.954.38-.66.773-1.286 1.18-1.868.728-.064 1.466-.098 2.21-.098zm-3.635.254c-.24.377-.48.763-.704 1.16-.225.39-.435.782-.635 1.174-.265-.656-.49-1.31-.676-1.947.64-.15 1.315-.283 2.015-.386zm7.26 0c.695.103 1.365.23 2.006.387-.18.632-.405 1.282-.66 1.933-.2-.39-.41-.783-.64-1.174-.225-.392-.465-.774-.705-1.146zm3.063.675c.484.15.944.317 1.375.498 1.732.74 2.852 1.708 2.852 2.476-.005.768-1.125 1.74-2.857 2.475-.42.18-.88.342-1.355.493-.28-.958-.646-1.956-1.1-2.98.45-1.017.81-2.01 1.085-2.964zm-13.395.004c.278.96.645 1.957 1.1 2.98-.45 1.017-.812 2.01-1.086 2.964-.484-.15-.944-.318-1.37-.5-1.732-.737-2.852-1.706-2.852-2.474 0-.768 1.12-1.742 2.852-2.476.42-.18.88-.342 1.356-.494zm11.678 4.28c.265.657.49 1.312.676 1.948-.64.157-1.316.29-2.016.39.24-.375.48-.762.705-1.158.225-.39.435-.788.636-1.18zm-9.945.02c.2.392.41.783.64 1.175.23.39.465.772.705 1.143-.695-.102-1.365-.23-2.006-.386.18-.63.406-1.282.66-1.933zM17.92 16.32c.112.493.2.968.254 1.423.23 1.868-.054 3.32-.714 3.708-.147.09-.338.128-.563.128-1.012 0-2.514-.807-4.11-2.28.686-.72 1.37-1.536 2.02-2.44 1.107-.118 2.154-.3 3.113-.54zm-11.83.01c.96.234 2.006.415 3.107.532.66.905 1.345 1.727 2.035 2.446-1.595 1.483-3.092 2.295-4.11 2.295-.22-.005-.406-.05-.553-.132-.666-.38-.955-1.834-.73-3.703.054-.46.142-.944.25-1.438zm4.56.64c.44.02.89.034 1.345.034.46 0 .915-.01 1.36-.034-.44.572-.895 1.095-1.345 1.565-.455-.47-.91-.993-1.36-1.565z" />
          </svg>
        </SdkStartIcon>

        <span>
          <span className="sdk-overview-start-title">Web SDK - Create Session</span>
          <span className="sdk-overview-start-desc">Build your first ambient session, stream audio, and retrieve the note in minutes.</span>
        </span>
      </a>

      <a href="/mobile-sdk/ambient-guides/create-session" className="sdk-overview-start-tile">
        <SdkStartIcon variant="mobile">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
            <rect width="14" height="20" x="5" y="2" rx="2" ry="2" />

            <path d="M12 18h.01" />
          </svg>
        </SdkStartIcon>

        <span>
          <span className="sdk-overview-start-title">Mobile SDK - Create Session</span>
          <span className="sdk-overview-start-desc">Build your first ambient session, stream audio, and retrieve the note in minutes.</span>
        </span>
      </a>

      <a href="/headless-web-sdk/guides/hooks/ambient-hook" className="sdk-overview-start-tile">
        <SdkStartIcon variant="headless">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
            <path d="M4.477 13.192c-.36-2.274-.584-3.711-.65-4.805-.062-1.035.051-1.354.1-1.468.169-.395.424-.746.746-1.029.093-.081.363-.288 1.366-.548 1.06-.275 2.496-.507 4.769-.867 2.274-.36 3.71-.584 4.804-.65 1.034-.062 1.354.051 1.468.1.395.169.746.424 1.029.747.08.093.287.362.547 1.366.242.933.45 2.156.743 3.987l-14.646 4.89c-.085-.515-.176-1.085-.276-1.723Zm-3.762.596C.018 9.387-.33 7.187.425 5.422a6.665 6.665 0 0 1 1.743-2.401C3.614 1.757 5.813 1.41 10.211.713c4.4-.698 6.6-1.046 8.367-.291.92.393 1.74.99 2.399 1.743 1.264 1.447 1.612 3.647 2.308 8.047.697 4.4 1.045 6.601.29 8.366a6.664 6.664 0 0 1-1.743 2.402c-1.445 1.263-3.645 1.611-8.045 2.308-4.398.697-6.598 1.045-8.363.29a6.666 6.666 0 0 1-2.4-1.743c-1.263-1.448-1.611-3.648-2.308-8.048H.715v.001Zm7.759 7.814c1.178-.072 2.695-.31 4.94-.665 2.247-.356 3.762-.599 4.905-.895 1.107-.288 1.617-.568 1.947-.856a4.286 4.286 0 0 0 1.12-1.543c.172-.402.281-.974.212-2.116-.071-1.178-.309-2.696-.665-4.942-.355-2.247-.598-3.763-.894-4.906-.287-1.107-.568-1.618-.855-1.947a4.285 4.285 0 0 0-1.543-1.12c-.402-.174-.974-.282-2.116-.213-1.178.071-2.694.309-4.94.664-2.246.357-3.762.6-4.905.896-1.107.287-1.616.568-1.946.855a4.286 4.286 0 0 0-1.12 1.543c-.173.403-.281.974-.212 2.116.07 1.179.308 2.696.664 4.943.356 2.246.598 3.762.895 4.905.287 1.108.567 1.618.855 1.947.423.485.95.868 1.543 1.121.402.173.973.282 2.116.213Z" />
          </svg>
        </SdkStartIcon>

        <span>
          <span className="sdk-overview-start-title">Headless Web SDK - Create Session</span>
          <span className="sdk-overview-start-desc">Build your first ambient session, stream audio, and retrieve the note in minutes.</span>
        </span>
      </a>

      <a href="/dictation-sdk/guides/configuration" className="sdk-overview-start-tile">
        <SdkStartIcon variant="dictation">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
            <path d="M12 19v3" />

            <path d="M19 10v2a7 7 0 0 1-14 0v-2" />

            <rect x="9" y="2" width="6" height="13" rx="3" />
          </svg>
        </SdkStartIcon>

        <span>
          <span className="sdk-overview-start-title">Dictation SDK - Configuration</span>
          <span className="sdk-overview-start-desc">Configure the Dictation SDK with your partner credentials and settings.</span>
        </span>
      </a>

      <a href="/web-sdk/quickstart" className="sdk-overview-start-tile">
        <SdkStartIcon variant="quickstart">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
            <path d="M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09z" />

            <path d="m12 15-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2z" />

            <path d="M9 12H4s.55-3.03 2-4c1.62-1.08 5 0 5 0" />

            <path d="M12 15v5s3.03-.55 4-2c1.08-1.62 0-5 0-5" />
          </svg>
        </SdkStartIcon>

        <span>
          <span className="sdk-overview-start-title">Web SDK Quickstart</span>
          <span className="sdk-overview-start-desc">Build your first headed Web SDK flow in minutes.</span>
        </span>
      </a>

      <a href="/headless-web-sdk/quickstart" className="sdk-overview-start-tile">
        <SdkStartIcon variant="headless">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
            <path d="M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09z" />

            <path d="m12 15-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2z" />

            <path d="M9 12H4s.55-3.03 2-4c1.62-1.08 5 0 5 0" />

            <path d="M12 15v5s3.03-.55 4-2c1.08-1.62 0-5 0-5" />
          </svg>
        </SdkStartIcon>

        <span>
          <span className="sdk-overview-start-title">Headless Web SDK Quickstart</span>
          <span className="sdk-overview-start-desc">Build your first headless ambient flow in minutes.</span>
        </span>
      </a>

      <a href="/documentation/partner-onboarding" className="sdk-overview-start-tile">
        <SdkStartIcon variant="auth">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
            <path fillRule="evenodd" d="M7.5 4.75a7.25 7.25 0 1 0 0 14.5 7.25 7.25 0 0 0 0-14.5zm0 3.25a4 4 0 1 1 0 8 4 4 0 0 1 0-8z" clipRule="evenodd" />

            <path d="M14.25 10.25h9.25v3.5h-3v3h-3v-3h-3.25v-3.5z" />
          </svg>
        </SdkStartIcon>

        <span>
          <span className="sdk-overview-start-title">Partner Onboarding</span>
          <span className="sdk-overview-start-desc">Learn more about partner onboarding to start using Suki SDKs.</span>
        </span>
      </a>
    </div>
  </div>

  <div className="sdk-overview-intro">
    <h2 className="hp-journey-hero-line">Stay updated</h2>

    <p className="sdk-overview-text">
      Learn about the latest updates for the Web SDK, Mobile SDK, Headless Web SDK, and Dictation SDK.
    </p>

    <div className="api-overview-mintlify-cardgroup">
      <CardGroup cols={2}>
        <Card title="Web SDK Changelog" icon="bell-ring" href="/web-sdk/product-updates/changelog" arrow={true}>
          Releases and migration notes for the headed Web SDK packages.
        </Card>

        <Card title="Mobile SDK Changelog" icon="bell-ring" href="/mobile-sdk/product-updates/changelog" arrow={true}>
          iOS SDK updates, deprecations, and behavior changes.
        </Card>

        <Card title="Headless Web SDK Changelog" icon="bell-ring" href="/headless-web-sdk/changelog" arrow={true}>
          Platform React package updates for ambient hooks and clients.
        </Card>

        <Card title="Dictation SDK Changelog" icon="bell-ring" href="/dictation-sdk/changelog" arrow={true}>
          Dictation iframe and package updates for JavaScript and React tracks.
        </Card>
      </CardGroup>
    </div>
  </div>
</div>
