Atlas is our centralized conversational UI. Embedded AI is broadly about applying AI to in-app experiences and individual Anvil2 components. An experience may use one or both approaches depending on what is appropriate.Within the app, use embedded AI patterns. Within the conversational interface, or with actions that immediately lead to it, use the AI Kit. For where a user begins or resumes that conversation, see Atlas Entry Points.
Anvil components are steadily gaining integrated AI labeling. When embedded AI elements are enabled, components receive a combination of visual and behavioral updates. See AI Mark for more.
Make users aware when an interaction involves AI. The AI Mark alone is sufficient disclosure in most cases, but complex workflows can need additional disclosure.
The mark itself denotes AI. Skip additional tooltips or popovers explaining that AI touched an element when the accompanying AI Mark is already present.Use the AI Mark when AI generates new content that wasn’t there before, or makes connections without the user necessarily being aware. Skip the mark on individual pieces of UI when the user is already aware that AI is crafting the data through the workflow that preceded the page they’re on.
When a label is available, use it to denote that the data below is AI-provided.When a label isn’t possible in the design, place the AI Mark next to the data itself.
The AI Mark alone communicates that something was touched by AI. Tooltips on the mark should explain how that data was deduced—for example, noting that an equipment brand was deduced from the model number.
Keep the AI Mark in place as long as the content remains untouched and AI-generated. Remove the mark the moment a user edits the content—edited content no longer reflects AI-generated output.
We recommend a max of five per page. Favor marking the places where AI meaningfully changes the outcome, and avoid treating the mark as decoration—this means you should end up with fewer marks overall. If many items in a section are related to AI in some capacity, consider putting the mark on the section header instead. When multiple marks crowd the screen, reduce marks before shrinking copy or layout. Keep mark density tied to real AI involvement, not page real estate.
Last modified on October 27, 2026
Was this page helpful?
⌘I
{"docsConfig":{"theme":"almond","$schema":"https://mintlify.com/docs.json","name":"Anvil2","colors":{"primary":"#0265DC","light":"#0265DC","dark":"#78BBFA"},"logo":{"light":"https://mintcdn.com/servicetitan/71AMQyvZXt6ExgUq/logo/light.svg?fit=max\u0026auto=format\u0026n=71AMQyvZXt6ExgUq\u0026q=85\u0026s=b13c8b445a9e35dd7c8d8c02b923c2b4","dark":"https://mintcdn.com/servicetitan/71AMQyvZXt6ExgUq/logo/dark.svg?fit=max\u0026auto=format\u0026n=71AMQyvZXt6ExgUq\u0026q=85\u0026s=491171a64070c652c5369a09117387bc"},"favicon":"https://mintcdn.com/servicetitan/OJtYZdkkR0RVT4XA/favicon.ico?fit=max\u0026auto=format\u0026n=OJtYZdkkR0RVT4XA\u0026q=85\u0026s=a52db850fd438d685f580b4c5280414b","background":{"color":{"light":"#ffffff","dark":"#141414"}},"footer":{"links":[{"header":"Resources","items":[{"label":"Slack","href":"https://servicetitan.enterprise.slack.com/archives/CBSRGHTRS"},{"label":"Github","href":"https://github.com/servicetitan/hammer"},{"label":"Figma","href":"https://www.figma.com/design/KfMPM2hzHLX6Sr1YGWNXHc/Anvil2?m=auto\u0026node-id=20928-2053\u0026t=bEzIZJUinRPolYa1-1"},{"label":"Roadmap","href":"https://anvil.servicetitan.com/docs/resources/roadmap"},{"label":"Office Hours","href":"https://calendly.com/anvil-servicetitan/office-hours"}]}]},"fonts":{"family":"Nunito Sans"},"contextual":{"options":["mcp","claude","cursor","vscode","view"],"display":"header"},"interaction":{"drilldown":false},"metadata":{"timestamp":true},"styling":{"latex":true},"navigation":{"pages":[]}},"deployment":{"deploymentMetadataValue":{"subdomain":"servicetitan","hasAudioNarration":false,"actualSubdomain":"servicetitan","customDomains":["anvil.servicetitan.com"],"gitSource":{"type":"github","owner":"servicetitan","repo":"hammer","deployBranch":"main","contentDirectory":"apps/anvil2-docs","isPrivate":true,"mountPath":"","label":""},"chroma":{"liveDeploymentHistoryId":"6adf75f057ec93adba55c524","collectionId":"3a02225a-d32d-4073-ab43-c6f149149dcf","schemaVersion":"v3","latestBuiltDeploymentHistoryId":"6adf75f057ec93adba55c524"},"feedback":{"thumbs":true},"entitlements":{"AI_CHAT":{"status":"ENABLED"},"REMOVE_BRANDING":{"status":"DISABLED"},"WEB_MCP":{"status":"ENABLED"},"NARRATION":{"status":"ENABLED"}},"buildId":"6ae0fb475fb27eb466681818","clientVersion":"0.0.3990","searchFilterCounts":[{"language":"default","tag":"Docs","count":348},{"language":"default","tag":"Anvil2","count":286},{"language":"default","tag":"Components","count":211},{"language":"default","tag":"Concepts \u0026 Guidelines","count":47},{"language":"default","tag":"Web","count":41},{"language":"default","tag":"Community Extensions","count":37},{"language":"default","tag":"Atlas v1","count":32},{"language":"default","tag":"Blog","count":25},{"language":"default","tag":"Charts","count":25},{"language":"default","tag":"Design Foundations","count":20}]},"assistantConfig":{},"basePath":"","hasChatPermissions":true,"hasWebMcpPermissions":true,"toggles":[{"name":"kill-isr","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-mintlify-slack","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-v7-file-tree","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-integrations-settings","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-pr-grouping","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"custom-prefix","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"analytics-v7","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"user-flows-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"no-publish-flow","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-onboarding","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"llms-txt-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"pause-universal-search-reconcile","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving-live","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"stripTemperatureMiddleware","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"per-site-search-delta","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"support-platform-pylon-zendesk","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"instant-rollback","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications-server","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-private-page-search","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-fable","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fixed-ai-action-pricing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automation-resolve-merge-conflict","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"scoped-publishing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"mintql","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"page-level-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-version-history-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-nav-generations","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"billing-page-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workspace-projects","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"assistant-v5","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"byok-sep-25","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fork-pr-previews","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"revalidation-jwt","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"vite-origin","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-agent-model-picker","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"billing-updated-9-15","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-sso-scim","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"hobby-abuse-scan","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"dashboard-inbox","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-signup","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-enabled","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false}],"isAtlas":false,"googleFontsInlined":true},"customCss":[{"filePath":"index.css","content":":is(.dark *){--primary-light:var(--primary-dark)}@media (min-width:1024px){#content-area{max-width:48rem}a.nav-tabs-item.font-semibold,a.nav-tabs-item[class*=currentColor]{color:rgb(var(--primary-light));text-decoration:underline;text-decoration-color:rgb(var(--primary-light));text-decoration-thickness:2px;text-underline-offset:21px;text-decoration-style:solid}}@media (min-width:1536px){#content-area{max-width:64rem}}table{width:100%!important;table-layout:fixed!important;display:table!important}table thead{text-align:left}.code-block+.callout{margin-block-start:-1rem;margin-block-end:2rem}.prose a strong,.prose li :where(a):not(:where([class~=\"not-prose\"], [class~=\"not-prose\"] *)),.prose span :where(a):not(:where([class~=\"not-prose\"], [class~=\"not-prose\"] *)){border-bottom:1px solid rgb(var(--primary-light));color:rgb(var(--primary-light))}.prose a:hover strong,.prose li :where(a:hover):not(:where([class~=\"not-prose\"], [class~=\"not-prose\"] *)),.prose span :where(a:hover):not(:where([class~=\"not-prose\"], [class~=\"not-prose\"] *)){border-bottom-width:2px;border-bottom-color:rgb(var(--primary-light));color:rgb(var(--primary-light))}.dark .prose li :where(a):not(:where([class~=\"not-prose\"], [class~=\"not-prose\"] *)),.dark .prose span :where(a):not(:where([class~=\"not-prose\"], [class~=\"not-prose\"] *)),.prose a strong:is(.dark *){border-bottom:1px solid rgb(var(--primary-light));color:rgb(var(--primary-light))}.dark .prose li :where(a:hover):not(:where([class~=\"not-prose\"], [class~=\"not-prose\"] *)),.dark .prose span :where(a:hover):not(:where([class~=\"not-prose\"], [class~=\"not-prose\"] *)),.prose a:hover strong:is(.dark *){border-bottom-width:2px;border-bottom-color:#b5deff;color:#b5deff}.prose:is(.dark *){color:var(--foreground-color-subdued)}.dark .icon_container svg{color:#fff;fill:#fff;stroke:#fff}.task-list-item::before{display:none}.prose h2:not(.not-prose){font-size:2rem}.prose h3:not(.not-prose){font-size:1.625rem}.prose h4:not(.not-prose){font-size:1.25rem}.prose h5:not(.not-prose),.prose h6:not(.not-prose){font-size:1rem}.prose .card h2{font-size:1.125rem}.prose h2:not(.not-prose),.prose h3:not(.not-prose),.prose h4:not(.not-prose),.prose h5:not(.not-prose),.prose h6:not(.not-prose),.prose strong{font-weight:var(--font-weight-bold)}.sidebar-group-header .sidebar-title{font-size:var(--typography-label-size-small);font-weight:var(--typography-label-font-weight);color:var(--foreground-color-subdued);text-transform:uppercase;font-style:normal;letter-spacing:.05em;line-height:1.5}.do-dont,.do-dont-content{display:flex;flex-direction:column}.do-dont{border:2px solid var(--border-color-subdued);border-radius:var(--border-radius-large);background-color:var(--background-color-strong);height:100%;overflow:hidden}.do-dont-content{gap:.25rem;flex:1 1 auto}.do-dont-content>div.code-block{margin:0}.do-dont img{padding:var(--size-2);margin:0;width:100%;height:auto;display:block}.do-dont-label{display:flex;align-items:flex-start;gap:.5rem;margin:0;padding:.75rem 1rem;border-top:1px solid var(--border-color-subdued);min-height:4.5rem;box-sizing:border-box}.do-dont:not(:has(.do-dont-content)) .do-dont-label{flex:1;border-top:none}.do-dont-label p{margin:0;line-height:1.4}.do-dont-label-icon{flex:0 0 auto;margin-block-start:.1rem}.do-dont.do{border-color:var(--border-color-success)}.do-dont.dont{border-color:var(--border-color-danger)}.do-dont.caution{border-color:var(--status-color-warning)}.do-dont-label-do{background-color:var(--background-color-success-subdued)}.do-dont-label-dont{background-color:var(--background-color-danger-subdued)}.do-dont-label-caution{--background-color-warning-subdued:light-dark(#fff9e2, #ffe27820);background-color:var(--background-color-warning-subdued)}.do-dont-label-do .do-dont-label-icon{color:var(--status-color-success)}.do-dont-label-dont .do-dont-label-icon{color:var(--status-color-danger)}.do-dont-label-caution .do-dont-label-icon{color:var(--status-color-warning)}.do-dont .callout{margin:0;border:0;border-radius:0 0 var(--border-radius-large) var(--border-radius-large);border-top:1px solid var(--border-color-subdued)}.callout[data-callout-type=check],.do-dont.do .callout{background-color:var(--background-color-success-subdued)}.callout[data-callout-type=danger],.do-dont.dont .callout{background-color:var(--background-color-danger-subdued)}.callout[data-callout-type=warning],.do-dont.caution .callout{--background-color-warning-subdued:light-dark(#fff9e2, #ffe27820);background-color:var(--background-color-warning-subdued)}.callout[data-callout-type=note]{background-color:var(--background-color-primary-subdued)}"},{"filePath":"tokens.css","href":"/_mintlify/custom/servicetitan/5410863b2553034c/tokens.css"}],"page":{"pagePath":"docs/patterns/embedded-ai/web","slug":"/docs/patterns/embedded-ai/web","pageMetadata":{"title":"Embedded AI - Web","og:title":"Embedded AI - Web","sidebarTitle":"Web","permalink":"embedded-ai/web","description":"Embedded AI is how we use the [AI Mark](/docs/components/ai-mark/design) within the product.","href":"/docs/patterns/embedded-ai/web"},"description":{"compiledSource":"\"use strict\";\nconst {jsx: _jsx, jsxs: _jsxs} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n const _components = {\n a: \"a\",\n p: \"p\",\n ..._provideComponents(),\n ...props.components\n };\n return _jsxs(_components.p, {\n children: [\"Embedded AI is how we use the \", _jsx(_components.a, {\n href: \"/docs/components/ai-mark/design\",\n children: \"AI Mark\"\n }), \" within the product.\"]\n });\n}\nfunction MDXContent(props = {}) {\n const {wrapper: MDXLayout} = {\n ..._provideComponents(),\n ...props.components\n };\n return MDXLayout ? _jsx(MDXLayout, {\n ...props,\n children: _jsx(_createMdxContent, {\n ...props\n })\n }) : _createMdxContent(props);\n}\nreturn {\n default: MDXContent\n};\n","frontmatter":{},"scope":{}},"pageType":"default","mdx":{"mdxSource":{"compiledSource":"\"use strict\";const{Fragment:_Fragment,jsx:_jsx,jsxs:_jsxs}=arguments[0];const{useMDXComponents:_provideComponents}=arguments[0];const LiveCode=({children,customHeight,clickToLoad,example,fullWidth,fullHeight,hideCodeInLiveCode,screenshot,screenshotOnly,showCode:showCodeProp})=>{const _components={a:`a`,..._provideComponents()},{Frame,Icon}=_components;if(!Frame)_missingMdxReference(`Frame`,true);if(!Icon)_missingMdxReference(`Icon`,true);const SCREENSHOTS_BASE=`https://servicetitan.github.io/anvil2-docs-live-code/screenshots`;const STACKBLITZ_BASE=`https://stackblitz.com/github/servicetitan/anvil2-docs-live-code/tree/main/examples`;const[showCodeBlock,setShowCodeBlock]=useState(showCodeProp??false);const[isLocalOverride,setIsLocalOverride]=useState(false);useEffect(()=>{const examplePath=`/images/live-code-screenshots-tmp/${example}.png`;fetch(examplePath,{method:`HEAD`}).then(r=>{if(r.ok)setIsLocalOverride(true)}).catch(()=>{})},[example]);const screenshotBase=isLocalOverride?`/images/live-code-screenshots-tmp`:SCREENSHOTS_BASE;if(screenshotOnly){return _jsxs(Frame,{className:`mint-flex mint-flex-col`,children:[_jsx(`div`,{className:`mint-flex dark:mint-hidden`,style:{justifyContent:`center`,alignItems:`center`,width:fullWidth?`100%`:`50%`,minHeight:fullHeight?`284px`:undefined,background:`#FFFFFF`},children:_jsx(`img`,{srcset:`${screenshotBase}/${example}.png, ${screenshotBase}/${example}-2x.png 2x`,src:`${screenshotBase}/${example}.png`,alt:example,noZoom:true})}),_jsx(`div`,{className:`mint-hidden dark:mint-flex`,style:{justifyContent:`center`,alignItems:`center`,width:fullWidth?`100%`:`50%`,minHeight:fullHeight?`284px`:undefined,background:`#141414`},children:_jsx(`img`,{srcset:`${screenshotBase}/${example}-dark.png, ${screenshotBase}/${example}-dark-2x.png 2x`,src:`${screenshotBase}/${example}-dark.png`,alt:example,noZoom:true})})]})}if(screenshot){return _jsxs(Frame,{className:`mint-flex mint-flex-col mint--mb-2`,children:[_jsx(`div`,{className:`mint-flex dark:mint-hidden mint-bg-white dark:bg-codeblock mint-border mint-border-gray-950/10 dark:mint-border-white/10 dark:twoslash-dark mint-rounded-2xl mint-overflow-hidden`,style:{justifyContent:`center`,alignItems:`center`,width:fullWidth?`100%`:`50%`,minHeight:fullHeight?`284px`:undefined},children:_jsx(`img`,{srcset:`${screenshotBase}/${example}.png, ${screenshotBase}/${example}-2x.png 2x`,src:`${screenshotBase}/${example}.png`,alt:example,noZoom:true})}),_jsx(`div`,{className:`mint-hidden dark:mint-flex mint-bg-white dark:bg-codeblock mint-border mint-border-gray-950/10 dark:mint-border-white/10 dark:twoslash-dark mint-rounded-2xl mint-overflow-hidden`,style:{background:`#141414`,justifyContent:`center`,alignItems:`center`,width:fullWidth?`100%`:`50%`,minHeight:fullHeight?`284px`:undefined},children:_jsx(`img`,{srcset:`${screenshotBase}/${example}-dark.png, ${screenshotBase}/${example}-dark-2x.png 2x`,src:`${screenshotBase}/${example}-dark.png`,alt:example,noZoom:true})}),_jsxs(`div`,{className:`mint-flex mint-justify-end mint-items-center mint-text-xs mint-py-2 mint-px-1 mint-gap-4`,children:[!showCodeProp?_jsxs(`button`,{className:`mint-inline-flex mint-justify-end mint-items-center mint-text-gray-700 dark:mint-text-gray-50 hover:mint-text-blue-500 dark:hover:mint-text-blue-300 mint-transition-colors mint-group mint-self-end mint-gap-1 mint-cursor-pointer`,onClick:()=>setShowCodeBlock(!showCodeBlock),style:{appearance:`none`},children:[_jsx(Icon,{icon:`code`,size:`12px`,className:`group-hover:mint-bg-blue-500 dark:group-hover:mint-bg-blue-300`}),_jsx(`span`,{children:showCodeBlock?`Hide code`:`Show code`})]}):null,_jsxs(_components.a,{className:`mint-inline-flex mint-justify-end mint-items-center hover:mint-text-blue-500 dark:hover:mint-text-blue-300 mint-transition-colors mint-group mint-self-end mint-gap-1`,href:`${STACKBLITZ_BASE}/${example}?file=src/App.tsx`,target:`_blank`,rel:`noreferrer`,children:[_jsx(Icon,{icon:`bolt`,size:`12px`,className:`group-hover:mint-bg-blue-500 dark:group-hover:mint-bg-blue-300`}),_jsx(`span`,{children:`StackBlitz demo`})]})]}),_jsx(`div`,{className:`mint-grid mint-transition-[grid-template-rows] mint-duration-300 mint-ease-in-out mint-overflow-auto mint-overflow-y-hidden mint-overflow-x-auto`,style:showCodeBlock?{gridTemplateRows:`1fr`}:{gridTemplateRows:`0fr`},children:_jsx(`div`,{style:{minHeight:0,overflowX:`auto`,overflowY:`hidden`,marginBlockStart:`-1.25rem`,marginBlockEnd:`-1.5rem`},children})})]})}else{return _jsx(`div`,{style:{display:`flex`,width:fullWidth?`100%`:`50%`,minHeight:customHeight?customHeight:`316px`,resize:`vertical`,overflow:`auto`},children:_jsx(`iframe`,{title:example,style:{flex:1,width:fullWidth?`100%`:`50%`,minHeight:customHeight?customHeight:`316px`},src:`${STACKBLITZ_BASE}/${example}?embed=1\u0026hideNavigation=1\u0026hideExplorer=1\u0026terminalHeight=0\u0026file=src/App.tsx${clickToLoad?`\u0026ctl=1`:``}${hideCodeInLiveCode?`\u0026view=preview`:``}`,allow:`accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; hid; microphone; midi; payment; usb; vr; xr-spatial-tracking`,sandbox:`allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts`})})}};const DoDont=({text,type,children})=>{const{Icon}=_provideComponents()||{};if(!Icon)_missingMdxReference(`Icon`,true);const label=type===`do`?`Do`:type===`dont`?`Don’t`:`Caution`;const icon=type===`do`?`check-circle`:type===`dont`?`circle-xmark`:`triangle-exclamation`;return _jsxs(`div`,{className:`do-dont ${type}`,children:[children\u0026\u0026_jsx(`div`,{className:`do-dont-content`,children}),_jsxs(`div`,{className:`do-dont-label do-dont-label-${type}`,children:[_jsx(Icon,{icon,size:16,className:`do-dont-label-icon`}),_jsxs(`p`,{children:[_jsx(`strong`,{children:label}),text\u0026\u0026_jsx(`span`,{className:`m-inline-start-1`,children:text})]})]})]})};function _createMdxContent(props){const _components={a:`a`,code:`code`,p:`p`,pre:`pre`,span:`span`,..._provideComponents(),...props.components},{CodeBlock,Columns,Heading,OptimizedImage,_MdxComponentBoundary}=_components;if(!CodeBlock)_missingMdxReference(`CodeBlock`,true);if(!Columns)_missingMdxReference(`Columns`,true);if(!Heading)_missingMdxReference(`Heading`,true);if(!OptimizedImage)_missingMdxReference(`OptimizedImage`,true);if(!_MdxComponentBoundary)_missingMdxReference(`_MdxComponentBoundary`,true);return _jsxs(_Fragment,{children:[_jsx(Heading,{level:`2`,id:`embedded-ai-vs-atlas`,children:`Embedded AI vs Atlas`}),`\n`,_jsx(_components.p,{children:`Atlas is our centralized conversational UI. Embedded AI is broadly about applying AI to in-app experiences and individual Anvil2 components. An experience may use one or both approaches depending on what is appropriate.`}),`\n`,_jsxs(_components.p,{children:[`Within the app, use embedded AI patterns. Within the conversational interface, or with actions that immediately lead to it, use the `,_jsx(_components.a,{href:`/docs/building-agentic-experiences/getting-started#how-do-i-start`,children:`AI Kit`}),`. For where a user begins or resumes that conversation, see `,_jsx(_components.a,{href:`/docs/patterns/atlas-entry-points/web`,children:`Atlas Entry Points`}),`.`]}),`\n`,_jsx(Heading,{level:`2`,id:`embedded-ai-in-components`,children:`Embedded AI in Components`}),`\n`,_jsxs(_components.p,{children:[`Anvil components are steadily gaining integrated AI labeling. When embedded AI elements are enabled, components receive a combination of visual and behavioral updates. See `,_jsx(_components.a,{href:`/docs/components/ai-mark/design`,children:`AI Mark`}),` for more.`]}),`\n`,_jsx(Heading,{level:`2`,id:`user-awareness-of-ai`,children:`User Awareness of AI`}),`\n`,_jsx(_components.p,{children:`Make users aware when an interaction involves AI. The AI Mark alone is sufficient disclosure in most cases, but complex workflows can need additional disclosure.`}),`\n`,_jsx(Heading,{level:`3`,id:`how-should-disclaimers-be-used`,children:`How should disclaimers be used?`}),`\n`,_jsxs(_components.p,{children:[`The mark itself denotes AI. Skip additional tooltips or popovers explaining that AI touched an element when the accompanying `,_jsx(_components.a,{href:`/docs/components/ai-mark/design`,children:`AI Mark`}),` is already present.`]}),`\n`,_jsx(_components.p,{children:`Use the AI Mark when AI generates new content that wasn’t there before, or makes connections without the user necessarily being aware. Skip the mark on individual pieces of UI when the user is already aware that AI is crafting the data through the workflow that preceded the page they’re on.`}),`\n`,_jsx(Heading,{level:`3`,id:`how-should-the-mark-be-used-on-labels-and-data`,children:`How should the mark be used on labels and data?`}),`\n`,_jsx(_components.p,{children:`When a label is available, use it to denote that the data below is AI-provided.`}),`\n`,_jsx(_components.p,{children:`When a label isn’t possible in the design, place the AI Mark next to the data itself.`}),`\n`,_jsxs(Columns,{cols:2,children:[_jsx(_MdxComponentBoundary,{name:`DoDont`,children:_jsx(DoDont,{type:`do`,text:`Put the AI Mark on the field label when a label is available.`,children:_jsx(_MdxComponentBoundary,{name:`LiveCode`,children:_jsx(LiveCode,{example:`embedded-ai-labelmark-do`,screenshot:true,fullWidth:true,children:_jsx(CodeBlock,{filename:``,lines:`true`,numberOfLines:`19`,language:`tsx`,children:_jsx(_components.pre,{className:`shiki shiki-themes github-light-default dark-plus`,style:{backgroundColor:`#ffffff`,\"--shiki-dark-bg\":`#0B0C0E`,color:`#1f2328`,\"--shiki-dark\":`#D4D4D4`},language:`tsx`,children:_jsxs(_components.code,{language:`tsx`,numberOfLines:`19`,children:[_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:`import`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` { `}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:`TextField`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` } `}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:`from`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:` \"@servicetitan/anvil2\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`;`})]}),`\n`,_jsx(_components.span,{className:`line`}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#569CD6`},children:`function`}),_jsx(_components.span,{style:{color:`#8250DF`,\"--shiki-dark\":`#DCDCAA`},children:` App`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`() {`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:` return`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` (`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#808080`},children:` \u003c`}),_jsx(_components.span,{style:{color:`#116329`,\"--shiki-dark\":`#4EC9B0`},children:`TextField`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` label`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:`\"Equipment Brand\"`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` defaultValue`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:`\"Carrier\"`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` labelProps`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#569CD6`},children:`{`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`{`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` aiMark:`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` {`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` type:`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:` \"tooltip\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`,`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` content:`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:` \"Deduced from the equipment's model number.\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`,`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` triggerLabel:`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:` \"How the equipment brand was deduced\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`,`})]}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` },`})}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` }`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#569CD6`},children:`}`})]}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#808080`},children:` />`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` );`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`}`})}),`\n`,_jsx(_components.span,{className:`line`}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:`export`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:` default`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` App`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`;`})]}),`\n`]})})})})})})}),_jsx(_MdxComponentBoundary,{name:`DoDont`,children:_jsx(DoDont,{type:`dont`,text:`Put the AI Mark next to the value when a label is available. Move it to the label instead.`,children:_jsx(_MdxComponentBoundary,{name:`LiveCode`,children:_jsx(LiveCode,{example:`embedded-ai-valuemark-dont`,screenshot:true,fullWidth:true,children:_jsx(CodeBlock,{filename:``,lines:`true`,numberOfLines:`13`,language:`tsx`,children:_jsx(_components.pre,{className:`shiki shiki-themes github-light-default dark-plus`,style:{backgroundColor:`#ffffff`,\"--shiki-dark-bg\":`#0B0C0E`,color:`#1f2328`,\"--shiki-dark\":`#D4D4D4`},language:`tsx`,children:_jsxs(_components.code,{language:`tsx`,numberOfLines:`13`,children:[_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:`import`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` { `}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:`AiMark`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`, `}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:`TextField`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` } `}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:`from`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:` \"@servicetitan/anvil2\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`;`})]}),`\n`,_jsx(_components.span,{className:`line`}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#569CD6`},children:`function`}),_jsx(_components.span,{style:{color:`#8250DF`,\"--shiki-dark\":`#DCDCAA`},children:` App`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`() {`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:` return`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` (`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#808080`},children:` \u003c`}),_jsx(_components.span,{style:{color:`#116329`,\"--shiki-dark\":`#4EC9B0`},children:`TextField`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` label`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:`\"Equipment Brand\"`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` defaultValue`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:`\"Carrier\"`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` suffix`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#569CD6`},children:`{`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#808080`},children:`\u003c`}),_jsx(_components.span,{style:{color:`#116329`,\"--shiki-dark\":`#4EC9B0`},children:`AiMark`}),_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` type`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:`\"gradient\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#808080`},children:` />`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#569CD6`},children:`}`})]}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#808080`},children:` />`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` );`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`}`})}),`\n`,_jsx(_components.span,{className:`line`}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:`export`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:` default`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` App`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`;`})]}),`\n`]})})})})})})})]}),`\n`,_jsx(Heading,{level:`3`,id:`how-should-tooltip-copy-be-written`,children:`How should tooltip copy be written?`}),`\n`,_jsx(_components.p,{children:`The AI Mark alone communicates that something was touched by AI. Tooltips on the mark should explain how that data was deduced—for example, noting that an equipment brand was deduced from the model number.`}),`\n`,_jsxs(Columns,{cols:2,children:[_jsx(_MdxComponentBoundary,{name:`DoDont`,children:_jsx(DoDont,{type:`do`,text:`Use tooltips to explain how the value was deduced.`,children:_jsx(_MdxComponentBoundary,{name:`LiveCode`,children:_jsx(LiveCode,{example:`embedded-ai-tooltipdetail-do`,screenshot:true,fullWidth:true,children:_jsx(CodeBlock,{filename:``,lines:`true`,numberOfLines:`20`,language:`tsx`,children:_jsx(_components.pre,{className:`shiki shiki-themes github-light-default dark-plus`,style:{backgroundColor:`#ffffff`,\"--shiki-dark-bg\":`#0B0C0E`,color:`#1f2328`,\"--shiki-dark\":`#D4D4D4`},language:`tsx`,children:_jsxs(_components.code,{language:`tsx`,numberOfLines:`20`,children:[_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:`import`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` { `}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:`TextField`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` } `}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:`from`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:` \"@servicetitan/anvil2\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`;`})]}),`\n`,_jsx(_components.span,{className:`line`}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#569CD6`},children:`function`}),_jsx(_components.span,{style:{color:`#8250DF`,\"--shiki-dark\":`#DCDCAA`},children:` App`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`() {`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:` return`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` (`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#808080`},children:` \u003c`}),_jsx(_components.span,{style:{color:`#116329`,\"--shiki-dark\":`#4EC9B0`},children:`TextField`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` label`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:`\"Brand\"`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` defaultValue`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:`\"Fisher\"`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` labelProps`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#569CD6`},children:`{`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`{`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` aiMark:`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` {`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` type:`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:` \"tooltip\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`,`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` content:`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:` \"Identified based on available equipment data.\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`,`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` triggerLabel:`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:` \"How the brand was identified\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`,`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` props:`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` { `}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:`defaultOpen:`}),_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#569CD6`},children:` true`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` },`})]}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` },`})}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` }`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#569CD6`},children:`}`})]}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#808080`},children:` />`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` );`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`}`})}),`\n`,_jsx(_components.span,{className:`line`}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:`export`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:` default`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` App`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`;`})]}),`\n`]})})})})})})}),_jsx(_MdxComponentBoundary,{name:`DoDont`,children:_jsx(DoDont,{type:`dont`,text:`Provide generic information, like 'produced by AI'.`,children:_jsx(_MdxComponentBoundary,{name:`LiveCode`,children:_jsx(LiveCode,{example:`embedded-ai-tooltipgeneric-dont`,screenshot:true,fullWidth:true,children:_jsx(CodeBlock,{filename:``,lines:`true`,numberOfLines:`20`,language:`tsx`,children:_jsx(_components.pre,{className:`shiki shiki-themes github-light-default dark-plus`,style:{backgroundColor:`#ffffff`,\"--shiki-dark-bg\":`#0B0C0E`,color:`#1f2328`,\"--shiki-dark\":`#D4D4D4`},language:`tsx`,children:_jsxs(_components.code,{language:`tsx`,numberOfLines:`20`,children:[_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:`import`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` { `}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:`TextField`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` } `}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:`from`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:` \"@servicetitan/anvil2\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`;`})]}),`\n`,_jsx(_components.span,{className:`line`}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#569CD6`},children:`function`}),_jsx(_components.span,{style:{color:`#8250DF`,\"--shiki-dark\":`#DCDCAA`},children:` App`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`() {`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:` return`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` (`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#808080`},children:` \u003c`}),_jsx(_components.span,{style:{color:`#116329`,\"--shiki-dark\":`#4EC9B0`},children:`TextField`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` label`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:`\"Brand\"`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` defaultValue`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:`\"Fisher\"`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` labelProps`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#569CD6`},children:`{`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`{`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` aiMark:`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` {`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` type:`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:` \"tooltip\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`,`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` content:`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:` \"Enriched with AI.\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`,`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` triggerLabel:`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:` \"AI information\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`,`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` props:`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` { `}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:`defaultOpen:`}),_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#569CD6`},children:` true`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` },`})]}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` },`})}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` }`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#569CD6`},children:`}`})]}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#808080`},children:` />`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:` );`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`}`})}),`\n`,_jsx(_components.span,{className:`line`}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:`export`}),_jsx(_components.span,{style:{color:`#CF222E`,\"--shiki-dark\":`#C586C0`},children:` default`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#9CDCFE`},children:` App`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`;`})]}),`\n`]})})})})})})})]}),`\n`,_jsx(Heading,{level:`3`,id:`how-long-should-the-ai-mark-stay`,children:`How long should the AI Mark stay?`}),`\n`,_jsx(_components.p,{children:`Keep the AI Mark in place as long as the content remains untouched and AI-generated. Remove the mark the moment a user edits the content—edited content no longer reflects AI-generated output.`}),`\n`,_jsx(Heading,{level:`3`,id:`how-many-ai-marks-are-acceptable-on-one-page`,children:`How many AI marks are acceptable on one page?`}),`\n`,_jsx(_components.p,{children:`We recommend a max of five per page. Favor marking the places where AI meaningfully changes the outcome, and avoid treating the mark as decoration—this means you should end up with fewer marks overall. If many items in a section are related to AI in some capacity, consider putting the mark on the section header instead. When multiple marks crowd the screen, reduce marks before shrinking copy or layout. Keep mark density tied to real AI involvement, not page real estate.`}),`\n`,_jsxs(Columns,{cols:2,children:[_jsx(_MdxComponentBoundary,{name:`DoDont`,children:_jsx(DoDont,{type:`do`,text:`Use the AI Mark on headings when multiple things have been touched in the group.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/servicetitan/B7Bi80eYN7av3Csg/images/docs/web/patterns/embedded-ai/embedded-ai-do.png?fit=max\u0026auto=format\u0026n=B7Bi80eYN7av3Csg\u0026q=85\u0026s=73faf600086a8e63c10e27ab9a2a370d`,alt:`AI mark to use`,\"data-og-width\":`3260`,width:`3260`,\"data-og-height\":`3070`,height:`3070`,\"data-path\":`images/docs/web/patterns/embedded-ai/embedded-ai-do.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/servicetitan/B7Bi80eYN7av3Csg/images/docs/web/patterns/embedded-ai/embedded-ai-do.png?w=280\u0026fit=max\u0026auto=format\u0026n=B7Bi80eYN7av3Csg\u0026q=85\u0026s=d83b1c3bc05c58ef7056330c8ed9feaf 280w, https://mintcdn.com/servicetitan/B7Bi80eYN7av3Csg/images/docs/web/patterns/embedded-ai/embedded-ai-do.png?w=560\u0026fit=max\u0026auto=format\u0026n=B7Bi80eYN7av3Csg\u0026q=85\u0026s=3db63f3763e91373306d5f55b241ea8c 560w, https://mintcdn.com/servicetitan/B7Bi80eYN7av3Csg/images/docs/web/patterns/embedded-ai/embedded-ai-do.png?w=840\u0026fit=max\u0026auto=format\u0026n=B7Bi80eYN7av3Csg\u0026q=85\u0026s=1b6c07b3227a5db71ffbdadd8548fcbf 840w, https://mintcdn.com/servicetitan/B7Bi80eYN7av3Csg/images/docs/web/patterns/embedded-ai/embedded-ai-do.png?w=1100\u0026fit=max\u0026auto=format\u0026n=B7Bi80eYN7av3Csg\u0026q=85\u0026s=ec0e532e74534c7e5cd636c70347f039 1100w, https://mintcdn.com/servicetitan/B7Bi80eYN7av3Csg/images/docs/web/patterns/embedded-ai/embedded-ai-do.png?w=1650\u0026fit=max\u0026auto=format\u0026n=B7Bi80eYN7av3Csg\u0026q=85\u0026s=989b5d5c68ace5ad01e0726710221db9 1650w, https://mintcdn.com/servicetitan/B7Bi80eYN7av3Csg/images/docs/web/patterns/embedded-ai/embedded-ai-do.png?w=2500\u0026fit=max\u0026auto=format\u0026n=B7Bi80eYN7av3Csg\u0026q=85\u0026s=d26c403be1717cecb1cd9c0b521b4897 2500w`})})}),_jsx(_MdxComponentBoundary,{name:`DoDont`,children:_jsx(DoDont,{type:`dont`,text:`Litter the UI with the AI Mark. Scope it to the things that needs attention and the one action to take.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/servicetitan/B7Bi80eYN7av3Csg/images/docs/web/patterns/embedded-ai/embedded-ai-dont.png?fit=max\u0026auto=format\u0026n=B7Bi80eYN7av3Csg\u0026q=85\u0026s=a0ff41e2d25c6f7d4bdffb7af07ba1fb`,alt:`Outdated or incorrect AI marks`,\"data-og-width\":`3260`,width:`3260`,\"data-og-height\":`3070`,height:`3070`,\"data-path\":`images/docs/web/patterns/embedded-ai/embedded-ai-dont.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/servicetitan/B7Bi80eYN7av3Csg/images/docs/web/patterns/embedded-ai/embedded-ai-dont.png?w=280\u0026fit=max\u0026auto=format\u0026n=B7Bi80eYN7av3Csg\u0026q=85\u0026s=03fc55d719c2945bb76cea095ff8937a 280w, https://mintcdn.com/servicetitan/B7Bi80eYN7av3Csg/images/docs/web/patterns/embedded-ai/embedded-ai-dont.png?w=560\u0026fit=max\u0026auto=format\u0026n=B7Bi80eYN7av3Csg\u0026q=85\u0026s=9d5dde7863a7de588bbd344cc76134ed 560w, https://mintcdn.com/servicetitan/B7Bi80eYN7av3Csg/images/docs/web/patterns/embedded-ai/embedded-ai-dont.png?w=840\u0026fit=max\u0026auto=format\u0026n=B7Bi80eYN7av3Csg\u0026q=85\u0026s=ef9b4740041c35c3db30454f01b5bd21 840w, https://mintcdn.com/servicetitan/B7Bi80eYN7av3Csg/images/docs/web/patterns/embedded-ai/embedded-ai-dont.png?w=1100\u0026fit=max\u0026auto=format\u0026n=B7Bi80eYN7av3Csg\u0026q=85\u0026s=3dee4d8be0a8a7c8f37e063c47e53f46 1100w, https://mintcdn.com/servicetitan/B7Bi80eYN7av3Csg/images/docs/web/patterns/embedded-ai/embedded-ai-dont.png?w=1650\u0026fit=max\u0026auto=format\u0026n=B7Bi80eYN7av3Csg\u0026q=85\u0026s=e3b50ba6cf2f1c731033eadb4a21b4f2 1650w, https://mintcdn.com/servicetitan/B7Bi80eYN7av3Csg/images/docs/web/patterns/embedded-ai/embedded-ai-dont.png?w=2500\u0026fit=max\u0026auto=format\u0026n=B7Bi80eYN7av3Csg\u0026q=85\u0026s=af016d87e3a49a31ee111a78a4e1ff63 2500w`})})})]})]})}function MDXContent(props={}){const{wrapper:MDXLayout}={..._provideComponents(),...props.components};return MDXLayout?_jsx(MDXLayout,{...props,children:_jsx(_createMdxContent,{...props})}):_createMdxContent(props)}return{LiveCode,DoDont,default:MDXContent};function _missingMdxReference(id,component){throw new Error(`Expected `+(component?`component`:`object`)+\" `\"+id+\"` to be defined: you likely forgot to import, pass, or provide it.\")}","frontmatter":{},"scope":{"config":{},"pageMetadata":{"title":"Embedded AI - Web","og:title":"Embedded AI - Web","sidebarTitle":"Web","permalink":"embedded-ai/web","description":"Embedded AI is how we use the [AI Mark](/docs/components/ai-mark/design) within the product.","href":"/docs/patterns/embedded-ai/web"}}},"mdxSourceWithNoJs":null,"noJsSplices":[[144,5851,")=>null;const DoDont=()=>null;function _"]]},"mdxExtracts":{"tableOfContents":[{"title":"Embedded AI vs Atlas","slug":"embedded-ai-vs-atlas","depth":2,"children":[]},{"title":"Embedded AI in Components","slug":"embedded-ai-in-components","depth":2,"children":[]},{"title":"User Awareness of AI","slug":"user-awareness-of-ai","depth":2,"children":[{"title":"How should disclaimers be used?","slug":"how-should-disclaimers-be-used","depth":3,"children":[]},{"title":"How should the mark be used on labels and data?","slug":"how-should-the-mark-be-used-on-labels-and-data","depth":3,"children":[]},{"title":"How should tooltip copy be written?","slug":"how-should-tooltip-copy-be-written","depth":3,"children":[]},{"title":"How long should the AI Mark stay?","slug":"how-long-should-the-ai-mark-stay","depth":3,"children":[]},{"title":"How many AI marks are acceptable on one page?","slug":"how-many-ai-marks-are-acceptable-on-one-page","depth":3,"children":[]}]}],"codeExamples":{}},"jsLinks":["/_mintlify/custom/servicetitan/07807c75d49ec669/index.js","/_mintlify/custom/servicetitan/52469e7ba181cb23/scripts/find-live-code-usages.js","/_mintlify/custom/servicetitan/7931d1db5d5a59a0/scripts/inject-live-code-examples.js"],"dynamicCss":".mint--mb-2 {\n margin-bottom: -0.5rem\n}\n.mint-flex {\n display: flex\n}\n.mint-inline-flex {\n display: inline-flex\n}\n.mint-grid {\n display: grid\n}\n.mint-hidden {\n display: none\n}\n.mint-cursor-pointer {\n cursor: pointer\n}\n.mint-flex-col {\n flex-direction: column\n}\n.mint-items-center {\n align-items: center\n}\n.mint-justify-end {\n justify-content: flex-end\n}\n.mint-gap-1 {\n gap: 0.25rem\n}\n.mint-gap-4 {\n gap: 1rem\n}\n.mint-self-end {\n align-self: flex-end\n}\n.mint-overflow-auto {\n overflow: auto\n}\n.mint-overflow-hidden {\n overflow: hidden\n}\n.mint-overflow-x-auto {\n overflow-x: auto\n}\n.mint-overflow-y-hidden {\n overflow-y: hidden\n}\n.mint-rounded-2xl {\n border-radius: 1rem\n}\n.mint-border {\n border-width: 1px\n}\n.mint-border-gray-950\\/10 {\n border-color: rgb(3 7 18 / 0.1)\n}\n.mint-bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1))\n}\n.mint-px-1 {\n padding-left: 0.25rem;\n padding-right: 0.25rem\n}\n.mint-py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem\n}\n.mint-text-xs {\n font-size: 0.75rem;\n line-height: 1rem\n}\n.mint-text-gray-700 {\n --tw-text-opacity: 1;\n color: rgb(55 65 81 / var(--tw-text-opacity, 1))\n}\n.mint-transition-\\[grid-template-rows\\] {\n transition-property: grid-template-rows;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms\n}\n.mint-transition-colors {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms\n}\n.mint-duration-300 {\n transition-duration: 300ms\n}\n.mint-ease-in-out {\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)\n}\n.hover\\:mint-text-blue-500:hover {\n --tw-text-opacity: 1;\n color: rgb(59 130 246 / var(--tw-text-opacity, 1))\n}\n.mint-group:hover .group-hover\\:mint-bg-blue-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(59 130 246 / var(--tw-bg-opacity, 1))\n}\n.dark\\:mint-flex:is(.dark *) {\n display: flex\n}\n.dark\\:mint-hidden:is(.dark *) {\n display: none\n}\n.dark\\:mint-border-white\\/10:is(.dark *) {\n border-color: rgb(255 255 255 / 0.1)\n}\n.dark\\:mint-text-gray-50:is(.dark *) {\n --tw-text-opacity: 1;\n color: rgb(249 250 251 / var(--tw-text-opacity, 1))\n}\n.dark\\:hover\\:mint-text-blue-300:hover:is(.dark *) {\n --tw-text-opacity: 1;\n color: rgb(147 197 253 / var(--tw-text-opacity, 1))\n}\n.mint-group:hover .dark\\:group-hover\\:mint-bg-blue-300:is(.dark *) {\n --tw-bg-opacity: 1;\n background-color: rgb(147 197 253 / var(--tw-bg-opacity, 1))\n}","subdomain":"servicetitan","siteName":"Anvil2","title":"Embedded AI - Web","navMaps":{"firstHrefInVersion":{},"firstHrefInLanguage":{}},"lastModified":"2026-10-27T19:28:51.475Z","gitLastModified":"2026-10-27T19:28:01.000Z","originalFileLocation":"docs/patterns/embedded-ai/web.mdx"},"headHtml":"\u003cscript data-mint-head>(function(){var d=document.documentElement,p=null;if(!p){try{p=localStorage.getItem(\"isDarkMode\")}catch(e){}if(p==='true')p='dark';else if(p==='false')p='light';if(p!=='light'\u0026\u0026p!=='dark'\u0026\u0026p!=='system')p=\"system\"}var r=p==='system'?(matchMedia(\"(prefers-color-scheme: dark)\").matches?'dark':'light'):p;d.classList.remove(r==='dark'?'light':'dark');d.classList.add(r);d.setAttribute(\"data-theme-preference\",p)})();\u003c/script>\u003cmeta data-mint-head name=\"description\" content=\"Embedded AI is how we use the AI Mark within the product.\">\u003cmeta data-mint-head name=\"application-name\" content=\"Anvil2\">\u003cmeta data-mint-head name=\"generator\" content=\"Mintlify\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/mintlify-assets/_mintlify/favicons/servicetitan/OBZei-_VFy3b-O_q/_generated/favicon/android-chrome-192x192.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"apple-touch-icon\" type=\"image/png\" sizes=\"180x180\" href=\"/mintlify-assets/_mintlify/favicons/servicetitan/OBZei-_VFy3b-O_q/_generated/favicon/apple-touch-icon.png\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/mintlify-assets/_mintlify/favicons/servicetitan/OBZei-_VFy3b-O_q/_generated/favicon/favicon-16x16.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/mintlify-assets/_mintlify/favicons/servicetitan/OBZei-_VFy3b-O_q/_generated/favicon/favicon-32x32.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/mintlify-assets/_mintlify/favicons/servicetitan/OBZei-_VFy3b-O_q/_generated/favicon/favicon.ico\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/mintlify-assets/_mintlify/favicons/servicetitan/OBZei-_VFy3b-O_q/_generated/favicon-dark/android-chrome-192x192.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/mintlify-assets/_mintlify/favicons/servicetitan/OBZei-_VFy3b-O_q/_generated/favicon-dark/favicon-16x16.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/mintlify-assets/_mintlify/favicons/servicetitan/OBZei-_VFy3b-O_q/_generated/favicon-dark/favicon-32x32.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/mintlify-assets/_mintlify/favicons/servicetitan/OBZei-_VFy3b-O_q/_generated/favicon-dark/favicon.ico\" media=\"(prefers-color-scheme: dark)\">\u003cmeta data-mint-head property=\"og:title\" content=\"Embedded AI - Web\">\u003cmeta data-mint-head property=\"og:description\" content=\"Embedded AI is how we use the AI Mark within the product.\">\u003cmeta data-mint-head property=\"og:site_name\" content=\"Anvil2\">\u003cmeta data-mint-head property=\"og:url\" content=\"https://anvil.servicetitan.com/docs/patterns/embedded-ai/web\">\u003cmeta data-mint-head property=\"og:type\" content=\"website\">\u003cmeta data-mint-head property=\"og:image\" content=\"https://servicetitan.mintlify.app/_mintlify/api/og/v2?division=Embedded+AI\u0026amp;title=Embedded+AI+-+Web\u0026amp;description=Embedded+AI+is+how+we+use+the+%5BAI+Mark%5D%28%2Fdocs%2Fcomponents%2Fai-mark%2Fdesign%29+within+the+product.\u0026amp;theme=0bc5e3a907ae0deb81709bd4\u0026amp;signature=e7f917a9470f442a236e6e968a051a2d7d53c369951d8c202bf6f4d39f35ccc5\">\u003cmeta data-mint-head property=\"og:image:width\" content=\"1200\">\u003cmeta data-mint-head property=\"og:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"twitter:card\" content=\"summary_large_image\">\u003cmeta data-mint-head name=\"twitter:title\" content=\"Embedded AI - Web\">\u003cmeta data-mint-head name=\"twitter:description\" content=\"Embedded AI is how we use the AI Mark within the product.\">\u003cmeta data-mint-head name=\"twitter:image\" content=\"https://servicetitan.mintlify.app/_mintlify/api/og/v2?division=Embedded+AI\u0026amp;title=Embedded+AI+-+Web\u0026amp;description=Embedded+AI+is+how+we+use+the+%5BAI+Mark%5D%28%2Fdocs%2Fcomponents%2Fai-mark%2Fdesign%29+within+the+product.\u0026amp;theme=0bc5e3a907ae0deb81709bd4\u0026amp;signature=e7f917a9470f442a236e6e968a051a2d7d53c369951d8c202bf6f4d39f35ccc5\">\u003cmeta data-mint-head name=\"twitter:image:width\" content=\"1200\">\u003cmeta data-mint-head name=\"twitter:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"msapplication-config\" content=\"/mintlify-assets/_mintlify/favicons/servicetitan/OBZei-_VFy3b-O_q/_generated/favicon/browserconfig.xml\">\u003cmeta data-mint-head name=\"apple-mobile-web-app-title\" content=\"Anvil2\">\u003cmeta data-mint-head name=\"msapplication-TileColor\" content=\"#0265DC\">\u003clink data-mint-head rel=\"canonical\" href=\"https://anvil.servicetitan.com/docs/patterns/embedded-ai/web\">\u003clink data-mint-head rel=\"alternate\" type=\"application/xml\" href=\"/sitemap.xml\">\u003clink data-mint-head rel=\"alternate\" type=\"text/markdown\" href=\"/docs/patterns/embedded-ai/web.md\">\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https://anvil.servicetitan.com/#organization\",\"name\":\"Anvil2\",\"url\":\"https://anvil.servicetitan.com\",\"logo\":{\"@type\":\"ImageObject\",\"url\":\"https://mintcdn.com/servicetitan/71AMQyvZXt6ExgUq/logo/light.svg?fit=max\u0026auto=format\u0026n=71AMQyvZXt6ExgUq\u0026q=85\u0026s=b13c8b445a9e35dd7c8d8c02b923c2b4\"}},{\"@type\":\"WebSite\",\"@id\":\"https://anvil.servicetitan.com#website\",\"name\":\"Anvil2\",\"url\":\"https://anvil.servicetitan.com\",\"publisher\":{\"@id\":\"https://anvil.servicetitan.com/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https://anvil.servicetitan.com/docs/patterns/embedded-ai/web#webpage\",\"url\":\"https://anvil.servicetitan.com/docs/patterns/embedded-ai/web\",\"name\":\"Embedded AI - Web\",\"description\":\"Embedded AI is how we use the AI Mark within the product.\",\"dateModified\":\"2026-10-27T19:28:01.000Z\",\"isPartOf\":{\"@id\":\"https://anvil.servicetitan.com#website\"},\"breadcrumb\":{\"@id\":\"https://anvil.servicetitan.com/docs/patterns/embedded-ai/web#breadcrumb\"}},{\"@type\":\"BreadcrumbList\",\"@id\":\"https://anvil.servicetitan.com/docs/patterns/embedded-ai/web#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Anvil2\",\"item\":\"https://anvil.servicetitan.com/docs/components/index\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Patterns\",\"item\":\"https://anvil.servicetitan.com/docs/patterns/index\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Embedded AI - Web\",\"item\":\"https://anvil.servicetitan.com/docs/patterns/embedded-ai/web\"}]},{\"@type\":[\"Article\",\"TechArticle\"],\"@id\":\"https://anvil.servicetitan.com/docs/patterns/embedded-ai/web#article\",\"headline\":\"Embedded AI - Web\",\"name\":\"Embedded AI - Web\",\"description\":\"Embedded AI is how we use the AI Mark within the product.\",\"url\":\"https://anvil.servicetitan.com/docs/patterns/embedded-ai/web\",\"mainEntityOfPage\":{\"@id\":\"https://anvil.servicetitan.com/docs/patterns/embedded-ai/web#webpage\"},\"dateModified\":\"2026-10-27T19:28:01.000Z\",\"publisher\":{\"@id\":\"https://anvil.servicetitan.com/#organization\"},\"isPartOf\":{\"@id\":\"https://anvil.servicetitan.com#website\"}}]}\u003c/script>\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@type\":\"WebSite\",\"name\":\"Anvil2\",\"creator\":{\"@type\":\"Organization\",\"name\":\"Mintlify\",\"url\":\"https://mintlify.com\"}}\u003c/script>","siteName":"Anvil2","nav":{"global":null,"tabs":[{"tab":"Docs","groups":[{"group":"Concepts \u0026 Guidelines","pages":[{"group":"Getting Started","root":{"title":"Getting Started","sidebarTitle":"Overview","mode":"wide","href":"/docs/getting-started"},"pages":[{"title":"Getting Started - Web","sidebarTitle":"Web","href":"/docs/getting-started/web"},{"title":"Getting Started - React Native","sidebarTitle":"React Native","href":"/docs/getting-started/react-native"},{"title":"Getting Started - iOS","sidebarTitle":"iOS","href":"/docs/getting-started/ios"},{"title":"Getting Started - Android","sidebarTitle":"Android","href":"/docs/getting-started/android"},{"title":"AI Tooling and Anvil2","sidebarTitle":"AI Tooling","href":"/docs/getting-started/ai-tooling-and-anvil2"}]},{"title":"Core Principles","mode":"wide","href":"/docs/core-principles"},{"group":"Design Foundations","root":{"title":"Foundations","sidebarTitle":"Overview","mode":"wide","href":"/docs/foundations/index"},"pages":[{"group":"Accessibility","root":{"title":"Accessibility","sidebarTitle":"Accessibility","href":"/docs/accessibility/index"},"pages":[{"title":"Semantic Markup","sidebarTitle":"Semantic Markup","href":"/docs/accessibility/semantic-markup"},{"title":"Labels and Call to Actions","sidebarTitle":"Labels \u0026 CTAs","href":"/docs/accessibility/labels-and-ctas"},{"title":"Media and Animation","sidebarTitle":"Media \u0026 Animation","href":"/docs/accessibility/media-and-animation"},{"title":"Changing Content","sidebarTitle":"Changing Content","href":"/docs/accessibility/changing-content"},{"title":"Continued Learning and Tools","sidebarTitle":"Continued Learning \u0026 Tools","href":"/docs/accessibility/learning-and-tools"}]},{"title":"Colors","sidebarTitle":"Colors","href":"/docs/foundations/colors"},{"group":"Content","root":{"title":"Content","sidebarTitle":"Content","href":"/docs/foundations/content/index"},"pages":[{"title":"Actionable Language","sidebarTitle":"Actionable Language","href":"/docs/foundations/content/actionable-language"},{"title":"Active vs Passive Voice","sidebarTitle":"Active vs Passive Voice","href":"/docs/foundations/content/active-vs-passive-voice"},{"title":"Bold and Italics","sidebarTitle":"Bold and Italics","href":"/docs/foundations/content/bold-and-italics"},{"title":"Capitalization","sidebarTitle":"Capitalization","href":"/docs/foundations/content/capitalization"},{"title":"Confirmation Messages","sidebarTitle":"Confirmation Messages","href":"/docs/foundations/content/confirmation-messages"},{"title":"Date and Time","sidebarTitle":"Date and Time","href":"/docs/foundations/content/date-and-time"},{"title":"Language and Inclusivity","sidebarTitle":"Language and Inclusivity","href":"/docs/foundations/content/language-and-inclusivity"},{"title":"Word List","sidebarTitle":"Word List","url":"https://servicetitan.atlassian.net/wiki/x/xgLNGg","href":"/docs/foundations/content/word-list"}]},{"title":"Iconography","sidebarTitle":"Iconography","href":"/docs/foundations/iconography"},{"title":"Illustration","sidebarTitle":"Illustration","href":"/docs/foundations/illustration"},{"title":"Sizing","sidebarTitle":"Sizing","href":"/docs/foundations/sizing"},{"title":"Spacing","sidebarTitle":"Spacing","href":"/docs/foundations/spacing"},{"title":"Theming","sidebarTitle":"Theming","href":"/docs/foundations/theming"},{"title":"Typography","sidebarTitle":"Typography","href":"/docs/foundations/typography"}]},{"group":"Data Visualization","root":{"title":"Intro","href":"/docs/data-visualization/index"},"pages":[{"title":"Look \u0026 Feel","href":"/docs/data-visualization/look-and-feel"},{"title":"Categorical Color Palette","href":"/docs/data-visualization/categorical-color-palette"},{"title":"Semantic Color Palette","href":"/docs/data-visualization/semantic-color-palette"},{"title":"Accessibility","href":"/docs/data-visualization/accessibility"},{"title":"Typography","href":"/docs/data-visualization/typography"},{"title":"Bar Charts","href":"/docs/data-visualization/bar-charts"},{"title":"Donut Charts","href":"/docs/data-visualization/donut-charts"},{"title":"Line Charts","href":"/docs/data-visualization/line-charts"},{"title":"Area Charts","href":"/docs/data-visualization/area-charts"}]},{"group":"Building Agentic Experiences","root":{"title":"Building Agentic Experiences","sidebarTitle":"Overview","mode":"wide","href":"/docs/building-agentic-experiences/index"},"pages":[{"title":"Terminology","sidebarTitle":"Terminology","mode":"wide","href":"/docs/building-agentic-experiences/terminology"},{"group":"AI UX","root":{"title":"AI UX","sidebarTitle":"Overview","mode":"wide","href":"/docs/building-agentic-experiences/ai-ux/overview"},"pages":[{"title":"Complex Reasoning with AI","sidebarTitle":"Complex Reasoning with AI","href":"/docs/building-agentic-experiences/ai-ux/complex-reasoning-with-ai"},{"title":"UX and the Five Parts of a Moment","sidebarTitle":"UX and the Five Parts of a Moment","href":"/docs/building-agentic-experiences/ai-ux/ux-and-the-five-parts-of-a-moment"}]},{"group":"Visual Foundations","root":{"title":"Visual Foundations","sidebarTitle":"Overview","mode":"wide","href":"/docs/building-agentic-experiences/foundations/overview"},"pages":[{"title":"Colors","sidebarTitle":"Colors","href":"/docs/building-agentic-experiences/foundations/colors"},{"title":"Typography","sidebarTitle":"Typography","href":"/docs/building-agentic-experiences/foundations/typography"},{"title":"Iconography","sidebarTitle":"Iconography","href":"/docs/building-agentic-experiences/foundations/iconography"},{"title":"Illustrations","sidebarTitle":"Illustrations","href":"/docs/building-agentic-experiences/foundations/illustrations"},{"title":"Data Visualization","sidebarTitle":"Data Visualization","href":"/docs/building-agentic-experiences/foundations/data-visualization"}]},{"group":"Voice Experience","root":{"title":"Voice Experience","sidebarTitle":"Overview","mode":"wide","href":"/docs/building-agentic-experiences/voice-experience/overview"},"pages":[{"title":"Principles","sidebarTitle":"Principles","href":"/docs/building-agentic-experiences/voice-experience/voice-principles"},{"title":"Patterns","sidebarTitle":"Patterns","href":"/docs/building-agentic-experiences/voice-experience/voice-patterns"},{"title":"Persona and Voice Guidelines","sidebarTitle":"Persona and Voice","href":"/docs/building-agentic-experiences/voice-experience/persona-and-voice-guidelines"}]},{"group":"Chat Experience","pages":[{"title":"Tone \u0026 Trust","sidebarTitle":"Tone \u0026 Trust","href":"/docs/building-agentic-experiences/tone-and-trust"}]},{"title":"Developer Quickstart","sidebarTitle":"Developer Quickstart","href":"/docs/building-agentic-experiences/developer-quickstart"}]}]},{"group":"Anvil2","pages":[{"group":"Components","pages":[{"title":"Components","sidebarTitle":"Overview","mode":"wide","href":"/docs/components/index"},{"group":"Action Log","pages":[{"title":"Action Log - Web","sidebarTitle":"Web","href":"/docs/components/action-log/web"},{"title":"Action Log - React Native","sidebarTitle":"React Native","href":"/docs/components/action-log/react-native"}]},{"group":"Agent Media Card","pages":[{"title":"Agent Media Card - Web","sidebarTitle":"Web","href":"/docs/components/agent-media-card/web"}]},{"group":"Agent Message","pages":[{"title":"Agent Message - Web","sidebarTitle":"Web","href":"/docs/components/agent-message/web"},{"title":"Agent Message - React Native","sidebarTitle":"React Native","href":"/docs/components/agent-message/react-native"}]},{"group":"Agent Prompt","pages":[{"title":"Agent Prompt - Web","sidebarTitle":"Web","href":"/docs/components/agent-prompt/web"}]},{"group":"Agent Thinking","pages":[{"title":"Agent Thinking - Web","sidebarTitle":"Web","href":"/docs/components/agent-thinking/web"},{"title":"Agent Thinking - React Native","sidebarTitle":"React Native","href":"/docs/components/agent-thinking/react-native"}]},{"group":"AI Mark","pages":[{"title":"AI Mark - Web","sidebarTitle":"Web","href":"/docs/components/ai-mark/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/ai-mark/tokens"}]},{"group":"Alert","pages":[{"title":"Alert - Web","sidebarTitle":"Web","href":"/docs/components/alert/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/alert/tokens"}]},{"group":"Announcement","pages":[{"title":"Announcement - Web","sidebarTitle":"Web","href":"/docs/components/announcement/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/announcement/tokens"}]},{"group":"App Header","pages":[{"title":"App Header - Web","sidebarTitle":"Web","href":"/docs/components/app-header/web"}]},{"group":"App Shell","pages":[{"title":"App Shell - Web","sidebarTitle":"Web","href":"/docs/components/app-shell/web"}]},{"group":"Artifact Card","pages":[{"title":"Artifact Card - Web","sidebarTitle":"Web","href":"/docs/components/artifact-card/web"}]},{"group":"Atlas Logo","pages":[{"title":"Atlas Logo - React Native","sidebarTitle":"React Native","href":"/docs/components/atlas-logo/react-native"}]},{"group":"Avatar","pages":[{"title":"Avatar - Web","sidebarTitle":"Web","href":"/docs/components/avatar/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/avatar/tokens"}]},{"group":"Badge","pages":[{"title":"Badge - Web","sidebarTitle":"Web","href":"/docs/components/badge/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/badge/tokens"}]},{"group":"Bottom Sheet","pages":[{"title":"Bottom Sheet - Web","sidebarTitle":"Web","href":"/docs/components/bottom-sheet/web"},{"title":"Bottom Sheet - React Native","sidebarTitle":"React Native","href":"/docs/components/bottom-sheet/react-native"}]},{"group":"Breadcrumbs","pages":[{"title":"Breadcrumbs - Web","sidebarTitle":"Web","href":"/docs/components/breadcrumbs/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/breadcrumbs/tokens"}]},{"group":"Button","pages":[{"title":"Button - Web","sidebarTitle":"Web","href":"/docs/components/button/web"},{"title":"Button - Web (AI Kit)","sidebarTitle":"Web (AI Kit)","href":"/docs/components/button/ai-kit"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/button/tokens"},{"title":"Button - React Native","sidebarTitle":"React Native","href":"/docs/components/button/react-native"}]},{"group":"Button Toggle","pages":[{"title":"Button Toggle - Web","sidebarTitle":"Web","href":"/docs/components/button-toggle/web"},{"title":"Button Toggle - Web (AI Kit)","sidebarTitle":"Web (AI Kit)","href":"/docs/components/button-toggle/ai-kit"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/button-toggle/tokens"},{"title":"Button Toggle - React Native","sidebarTitle":"React Native","href":"/docs/components/button-toggle/react-native"}]},{"group":"Calendar","pages":[{"title":"Calendar - Web","sidebarTitle":"Web","href":"/docs/components/calendar/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/calendar/tokens"}]},{"group":"Card","pages":[{"title":"Card - Web","sidebarTitle":"Web","href":"/docs/components/card/web"},{"title":"Card - Web (AI Kit)","sidebarTitle":"Web (AI Kit)","href":"/docs/components/card/ai-kit"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/card/tokens"},{"title":"Card - React Native","sidebarTitle":"React Native","href":"/docs/components/card/react-native"}]},{"group":"Chat History","pages":[{"title":"Chat History - Web","sidebarTitle":"Web","href":"/docs/components/chat-history/web"}]},{"group":"Chat Layout","pages":[{"title":"Chat Layout - Web","sidebarTitle":"Web","href":"/docs/components/chat-layout/web"}]},{"group":"Checkbox","pages":[{"title":"Checkbox - Web","sidebarTitle":"Web","href":"/docs/components/checkbox/web"},{"title":"Checkbox - Web (AI Kit)","sidebarTitle":"Web (AI Kit)","href":"/docs/components/checkbox/ai-kit"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/checkbox/tokens"},{"title":"Checkbox - React Native","sidebarTitle":"React Native","href":"/docs/components/checkbox/react-native"}]},{"group":"Chip","pages":[{"title":"Chip - Web","sidebarTitle":"Web","href":"/docs/components/chip/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/chip/tokens"}]},{"group":"Citation","pages":[{"title":"Citation - Web","sidebarTitle":"Web","href":"/docs/components/citation/web"}]},{"group":"Combobox","pages":[{"title":"Combobox - Web","sidebarTitle":"Web","href":"/docs/components/combobox/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/combobox/tokens"}]},{"group":"Data Table","boost":3,"pages":[{"group":"Web","root":{"title":"Data Table - Web","sidebarTitle":"Web","href":"/docs/components/data-table/web"},"tag":"BETA","pages":[{"group":"Beta Changes","pages":[{"title":"DataTable Remove Row Activation API","sidebarTitle":"Remove Row Activation","tag":"3.0.9","href":"/docs/components/data-table/beta-changes/remove-row-activation"},{"title":"Remove Legacy Edit Props","sidebarTitle":"Remove Legacy Edit Props","tag":"2.7.1","href":"/docs/components/data-table/beta-changes/remove-legacy-edit-props"},{"title":"Select Edit Mode","sidebarTitle":"Select Edit Mode","tag":"2.7.1","href":"/docs/components/data-table/beta-changes/select-edit-mode"},{"title":"Boolean Edit Mode","sidebarTitle":"Boolean Edit Mode","tag":"2.4.0","href":"/docs/components/data-table/beta-changes/boolean-edit-mode"},{"title":"Number Edit Mode","sidebarTitle":"Number Edit Mode","tag":"2.1.0","href":"/docs/components/data-table/beta-changes/number-edit-mode"},{"title":"Column Types and EditConfig","sidebarTitle":"Column Types","tag":"2.0.3","href":"/docs/components/data-table/beta-changes/column-types"},{"title":"Custom Edit Mode","sidebarTitle":"Custom Edit Mode","tag":"2.7.2","href":"/docs/components/data-table/beta-changes/custom-edit-mode"}]}]},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/data-table/tokens"}]},{"group":"Date Field","pages":[{"group":"Single","pages":[{"title":"Date Field Single - Web","sidebarTitle":"Web","href":"/docs/components/date-field-single/web"}]},{"group":"Range","pages":[{"title":"Date Field Range - Web","sidebarTitle":"Web","href":"/docs/components/date-field-range/web"}]},{"group":"Yearless","pages":[{"title":"Date Field Yearless - Web","sidebarTitle":"Web","href":"/docs/components/date-field-yearless/web"}]},{"group":"Yearless Range","pages":[{"title":"Date Field Yearless Range - Web","sidebarTitle":"Web","href":"/docs/components/date-field-yearless-range/web"}]}]},{"group":"Days of the Week","pages":[{"title":"Days Of The Week - Web","sidebarTitle":"Web","href":"/docs/components/days-of-the-week/web"}]},{"group":"Decorative Icon","pages":[{"title":"Decorative Icon - Web","sidebarTitle":"Web","href":"/docs/components/decorative-icon/web"}]},{"group":"Details","pages":[{"title":"Details - Web","sidebarTitle":"Web","href":"/docs/components/details/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/details/tokens"}]},{"group":"Dialog","pages":[{"title":"Dialog - Web","sidebarTitle":"Web","href":"/docs/components/dialog/web"},{"title":"Dialog - Web (AI Kit)","sidebarTitle":"Web (AI Kit)","href":"/docs/components/dialog/ai-kit"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/dialog/tokens"},{"title":"Dialog - React Native","sidebarTitle":"React Native","href":"/docs/components/dialog/react-native"}]},{"group":"Diff Value","pages":[{"title":"Diff Value - Web","sidebarTitle":"Web","href":"/docs/components/diff-value/web"}]},{"group":"Divider","pages":[{"title":"Divider - Web","sidebarTitle":"Web","href":"/docs/components/divider/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/divider/tokens"}]},{"group":"Drag and Drop","pages":[{"group":"Dnd","pages":[{"title":"Dnd - Web","sidebarTitle":"Web","href":"/docs/components/dnd/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/dnd/tokens"}]},{"group":"Dnd Sort","pages":[{"title":"Dnd Sort - Web","sidebarTitle":"Web","href":"/docs/components/dnd-sort/web"}]}]},{"group":"Drawer","pages":[{"title":"Drawer - Web","sidebarTitle":"Web","href":"/docs/components/drawer/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/drawer/tokens"}]},{"group":"Drilldown","pages":[{"title":"Drilldown - Web","sidebarTitle":"Web","href":"/docs/components/drilldown/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/drilldown/tokens"}]},{"group":"Edit Card","pages":[{"title":"Edit Card - Web","sidebarTitle":"Web","href":"/docs/components/edit-card/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/edit-card/tokens"}]},{"group":"Field Label","pages":[{"title":"Field Label - Web","sidebarTitle":"Web","href":"/docs/components/field-label/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/field-label/tokens"}]},{"group":"Field Message","pages":[{"title":"Field Message - Web","sidebarTitle":"Web","href":"/docs/components/field-message/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/field-message/tokens"}]},{"group":"Filter Bar","boost":3,"pages":[{"group":"Web","root":{"title":"Filter Bar - Web","sidebarTitle":"Web","href":"/docs/components/filter-bar/web"},"tag":"BETA","pages":[{"group":"Beta Changes","pages":[{"title":"Select Filter Rework","sidebarTitle":"Select Filter Rework","tag":"3.0.7","href":"/docs/components/filter-bar/beta-changes/select-filters-rework"},{"title":"Toolbar.Filters to FilterBar","sidebarTitle":"Toolbar.Filters to FilterBar","tag":"3.0.1","href":"/docs/components/filter-bar/beta-changes/toolbar-filters-to-filter-bar"},{"title":"Always-wrap overflow and breakpoint shift","sidebarTitle":"Wrap-only overflow + breakpoint","tag":"3.0.7","href":"/docs/components/filter-bar/beta-changes/wrap-only-overflow-and-breakpoint"}]}]}]},{"group":"Flex","pages":[{"title":"Flex - Web","sidebarTitle":"Web","href":"/docs/components/flex/web"}]},{"group":"Grid","pages":[{"title":"Grid - Web","sidebarTitle":"Web","href":"/docs/components/grid/web"}]},{"group":"Guidance Card","pages":[{"title":"Guidance Card - Web","sidebarTitle":"Web","href":"/docs/components/guidance-card/web"}]},{"group":"Icon","pages":[{"title":"Icon - Web","sidebarTitle":"Web","href":"/docs/components/icon/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/icon/tokens"}]},{"group":"Interactive Card","pages":[{"title":"Interactive Card - Web","sidebarTitle":"Web","tag":"BETA","href":"/docs/components/interactive-card/web"}]},{"group":"Layout","pages":[{"title":"Layout - Web","sidebarTitle":"Web","href":"/docs/components/layout/web"}]},{"group":"Link","pages":[{"title":"Link - Web","sidebarTitle":"Web","href":"/docs/components/link/web"},{"title":"Link - Web (AI Kit)","sidebarTitle":"Web (AI Kit)","href":"/docs/components/link/ai-kit"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/link/tokens"}]},{"group":"List","pages":[{"title":"List - Web","sidebarTitle":"Web","href":"/docs/components/list/web"}]},{"group":"List View","pages":[{"title":"List View - Web","sidebarTitle":"Web","href":"/docs/components/list-view/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/list-view/tokens"}]},{"group":"Listbox","pages":[{"title":"Listbox - Web","sidebarTitle":"Web","href":"/docs/components/listbox/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/listbox/tokens"}]},{"group":"Markdown","pages":[{"title":"Markdown - Web","sidebarTitle":"Web","href":"/docs/components/markdown/web"}]},{"group":"Markdown Table","pages":[{"title":"Markdown Table - React Native","sidebarTitle":"React Native","href":"/docs/components/markdown-table/react-native"}]},{"group":"Menu","pages":[{"title":"Menu - Web","sidebarTitle":"Web","href":"/docs/components/menu/web"},{"title":"Menu - Web (AI Kit)","sidebarTitle":"Web (AI Kit)","href":"/docs/components/menu/ai-kit"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/menu/tokens"}]},{"group":"Number Field","pages":[{"title":"Number Field - Web","sidebarTitle":"Web","href":"/docs/components/number-field/web"}]},{"group":"Overflow","pages":[{"title":"Overflow - Web","sidebarTitle":"Web","href":"/docs/components/overflow/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/overflow/tokens"}]},{"group":"OverflowText","pages":[{"title":"Overflow Text - Web","sidebarTitle":"Web","href":"/docs/components/overflow-text/web"}]},{"group":"Page","pages":[{"title":"Page - Web","sidebarTitle":"Web","href":"/docs/components/page/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/page/tokens"}]},{"group":"Pagination","pages":[{"title":"Pagination - Web","sidebarTitle":"Web","href":"/docs/components/pagination/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/pagination/tokens"}]},{"group":"Popover","pages":[{"title":"Popover - Web","sidebarTitle":"Web","href":"/docs/components/popover/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/popover/tokens"}]},{"group":"Progress Bar","pages":[{"title":"Progress Bar - Web","sidebarTitle":"Web","href":"/docs/components/progress-bar/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/progress-bar/tokens"}]},{"group":"Prompt Bar","pages":[{"title":"Prompt Bar - Web","sidebarTitle":"Web","href":"/docs/components/prompt-bar/web"},{"title":"Prompt Bar - React Native","sidebarTitle":"React Native","href":"/docs/components/prompt-bar/react-native"}]},{"group":"Radio","pages":[{"title":"Radio - Web","sidebarTitle":"Web","href":"/docs/components/radio/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/radio/tokens"}]},{"group":"Rich Text Editor","pages":[{"title":"Rich Text Editor - Web","sidebarTitle":"Web","tag":"BETA","href":"/docs/components/rich-text-editor/web"}]},{"group":"Saved Filters Button","pages":[{"title":"Saved Filters Button - Web","sidebarTitle":"Web","tag":"BETA","href":"/docs/components/saved-filters-button/web"}]},{"group":"Search Field","pages":[{"title":"Search Field - Web","sidebarTitle":"Web","href":"/docs/components/search-field/web"}]},{"group":"Segmented Control","pages":[{"title":"Segmented Control - Web","sidebarTitle":"Web","href":"/docs/components/segmented-control/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/segmented-control/tokens"}]},{"group":"Select Card","pages":[{"title":"Select Card - Web","sidebarTitle":"Web","href":"/docs/components/select-card/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/select-card/tokens"}]},{"group":"Select Field","pages":[{"group":"Single","pages":[{"group":"Web","root":{"title":"Single Select Field - Web","sidebarTitle":"Web","href":"/docs/components/select-field/web"},"pages":[{"group":"Beta Changes","pages":[{"title":"SelectField Stable Promotion","sidebarTitle":"Stable Promotion","tag":"3.3.0","href":"/docs/components/select-field/beta-changes/stable-promotion"},{"title":"SelectField labelNode Removal","sidebarTitle":"labelNode Removal","tag":"2.8.0","href":"/docs/components/select-field/beta-changes/label-node-removal"}]}]}]},{"group":"Multiple","pages":[{"group":"Web","root":{"title":"Multi Select Field - Web","sidebarTitle":"Web","href":"/docs/components/multi-select-field/web"},"pages":[{"group":"Beta Changes","pages":[{"title":"MultiSelectField Stable Promotion","sidebarTitle":"Stable Promotion","tag":"3.3.0","href":"/docs/components/multi-select-field/beta-changes/stable-promotion"},{"title":"MultiSelectField labelNode Removal","sidebarTitle":"labelNode Removal","tag":"2.8.0","href":"/docs/components/multi-select-field/beta-changes/label-node-removal"},{"title":"MultiSelectField selectAll checkState","sidebarTitle":"checkState Rename","tag":"2.1.0","href":"/docs/components/multi-select-field/beta-changes/select-all-check-state"}]}]}]},{"group":"Tree","pages":[{"title":"Tree Select Field - Web","sidebarTitle":"Web","href":"/docs/components/tree-select-field/web"}]}]},{"group":"Select Menu","pages":[{"group":"Single","pages":[{"group":"Web","root":{"title":"Select Menu - Web","sidebarTitle":"Web","href":"/docs/components/select-menu/web"},"pages":[{"group":"Beta Changes","pages":[{"title":"SelectMenu Stable Promotion","sidebarTitle":"Stable Promotion","tag":"3.3.0","href":"/docs/components/select-menu/beta-changes/stable-promotion"}]}]}]},{"group":"Multiple","pages":[{"group":"Web","root":{"title":"Multi Select Menu - Web","sidebarTitle":"Web","href":"/docs/components/multi-select-menu/web"},"pages":[{"group":"Beta Changes","pages":[{"title":"MultiSelectMenu Stable Promotion","sidebarTitle":"Stable Promotion","tag":"3.3.0","href":"/docs/components/multi-select-menu/beta-changes/stable-promotion"}]}]}]},{"group":"Tree","pages":[{"title":"Tree Select Menu - Web","sidebarTitle":"Web","href":"/docs/components/tree-select-menu/web"}]}]},{"group":"Select Trigger","pages":[{"title":"Select Trigger - Web","sidebarTitle":"Web","href":"/docs/components/select-trigger/web"}]},{"group":"Side Nav","pages":[{"title":"Side Nav - Web","sidebarTitle":"Web","href":"/docs/components/side-nav/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/side-nav/tokens"}]},{"group":"Skeleton","pages":[{"title":"Skeleton - Web","sidebarTitle":"Web","href":"/docs/components/skeleton/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/skeleton/tokens"}]},{"group":"Spinner","pages":[{"title":"Spinner - Web","sidebarTitle":"Web","href":"/docs/components/spinner/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/spinner/tokens"}]},{"group":"Sr Only","pages":[{"title":"Sr Only - Web","sidebarTitle":"Web","href":"/docs/components/sr-only/web"}]},{"group":"Stepper","pages":[{"title":"Stepper - Web","sidebarTitle":"Web","href":"/docs/components/stepper/web"},{"title":"Stepper Base – Code","sidebarTitle":"Base","href":"/docs/components/stepper/base/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/stepper/tokens"}]},{"group":"Suggestion","pages":[{"title":"Suggestion - Web","sidebarTitle":"Web","href":"/docs/components/suggestion/web"},{"title":"Suggestion - React Native","sidebarTitle":"React Native","href":"/docs/components/suggestion/react-native"}]},{"group":"Switch","pages":[{"title":"Switch - Web","sidebarTitle":"Web","href":"/docs/components/switch/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/switch/tokens"}]},{"group":"Tab","pages":[{"title":"Tab - Web","sidebarTitle":"Web","href":"/docs/components/tab/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/tab/tokens"}]},{"group":"Tabbed Layout","pages":[{"title":"Tabbed Layout - Web","sidebarTitle":"Web","href":"/docs/components/tabbed-layout/web"}]},{"group":"Text","pages":[{"title":"Text - Web","sidebarTitle":"Web","href":"/docs/components/text/web"},{"title":"Text - Web (AI Kit)","sidebarTitle":"Web (AI Kit)","href":"/docs/components/text/ai-kit"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/text/tokens"},{"title":"Text - React Native","sidebarTitle":"React Native","href":"/docs/components/text/react-native"}]},{"group":"Text Field","pages":[{"title":"Text Field - Web","sidebarTitle":"Web","href":"/docs/components/text-field/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/text-field/tokens"}]},{"group":"Textarea","pages":[{"title":"Textarea - Web","sidebarTitle":"Web","href":"/docs/components/textarea/web"}]},{"group":"Time Field","pages":[{"title":"Time Field - Web","sidebarTitle":"Web","href":"/docs/components/time-field/web"}]},{"group":"Toast","pages":[{"title":"Toast - Web","sidebarTitle":"Web","href":"/docs/components/toast/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/toast/tokens"}]},{"group":"Toolbar","pages":[{"title":"Toolbar - Web","sidebarTitle":"Web","href":"/docs/components/toolbar/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/toolbar/tokens"}]},{"group":"Tooltip","pages":[{"title":"Tooltip - Web","sidebarTitle":"Web","href":"/docs/components/tooltip/web"},{"title":"Tokens","sidebarTitle":"Tokens","href":"/docs/components/tooltip/tokens"}]},{"group":"Tooltip Surface","pages":[{"title":"Tooltip Surface - Web","sidebarTitle":"Web","href":"/docs/components/tooltip-surface/web"},{"title":"Tooltip Surface - React Native","sidebarTitle":"React Native","href":"/docs/components/tooltip-surface/react-native"}]},{"group":"Truncated Text","pages":[{"title":"Truncated Text - Web","sidebarTitle":"Web","href":"/docs/components/truncated-text/web"}]},{"group":"Typeahead Text Field","pages":[{"title":"Typeahead Text Field - Web","sidebarTitle":"Web","tag":"BETA","href":"/docs/components/typeahead-text-field/web"}]},{"group":"User Media Message","pages":[{"title":"User Media Message - Web","sidebarTitle":"Web","href":"/docs/components/user-media-message/web"}]},{"group":"User Message","pages":[{"title":"User Message - Web","sidebarTitle":"Web","href":"/docs/components/user-message/web"},{"title":"User Message - React Native","sidebarTitle":"React Native","href":"/docs/components/user-message/react-native"}]},{"group":"Voice Mode Fab","pages":[{"title":"Voice Mode Fab - React Native","sidebarTitle":"React Native","href":"/docs/components/voice-mode-fab/react-native"}]},{"group":"Window","pages":[{"title":"Window - Web","sidebarTitle":"Web","href":"/docs/components/window/web"}]}]},{"group":"Patterns","pages":[{"title":"Patterns","sidebarTitle":"Overview","mode":"wide","href":"/docs/patterns/index"},{"group":"Agentic Experience Shell","pages":[{"title":"Agentic Experience Shell - Web","sidebarTitle":"Web","href":"/docs/patterns/agentic-experience-shell/web"}]},{"group":"AI Chat Layout","pages":[{"title":"Chat Layout - Web","sidebarTitle":"Web","href":"/docs/patterns/ai-chat-layout/web"}]},{"group":"Atlas Entry Points","pages":[{"title":"Atlas Entry Points - Web","sidebarTitle":"Web","href":"/docs/patterns/atlas-entry-points/web"}]},{"group":"Confirmation","pages":[{"title":"Confirmation - Web","sidebarTitle":"Web","description":null,"href":"/docs/patterns/confirmation/web"}]},{"group":"Embedded AI","pages":[{"title":"Embedded AI - Web","sidebarTitle":"Web","href":"/docs/patterns/embedded-ai/web"}]},{"group":"Empty States","pages":[{"title":"Empty States - Web","sidebarTitle":"Web","description":"Empty states are messages that appear whenever a page or element has no content to display to the user. An empty state is an opportunity to engage and delight users. The empty state should tell users what it’s for and why they’re seeing it. Effective empty states also tell users what they can do next.","href":"/docs/patterns/empty-states/web"}]},{"group":"Errors and Warnings","pages":[{"title":"Errors and Warnings - Web","sidebarTitle":"Web","href":"/docs/patterns/errors-and-warnings/web"}]},{"group":"Evidence Disclosure","pages":[{"title":"Evidence Disclosure - Web","sidebarTitle":"Web","href":"/docs/patterns/evidence-disclosure/web"}]},{"group":"Filters","pages":[{"title":"Filters - Web","sidebarTitle":"Web","href":"/docs/patterns/filters/web"}]},{"group":"Forms","pages":[{"title":"Forms - Web","sidebarTitle":"Web","href":"/docs/patterns/forms/web"}]},{"group":"Human Escalation","pages":[{"title":"Human Escalation - Web","sidebarTitle":"Web","href":"/docs/patterns/human-escalation/web"}]},{"group":"Notifications","pages":[{"title":"Notifications - Web","sidebarTitle":"Web","href":"/docs/patterns/notifications/web"}]},{"group":"Peek","pages":[{"title":"Peek - Web","sidebarTitle":"Web","href":"/docs/patterns/peek/web"}]}]},{"group":"Blocks","pages":[{"title":"Blocks","sidebarTitle":"Overview","mode":"wide","href":"/docs/blocks/index"},{"title":"Column Editor","sidebarTitle":"Column Editor","href":"/docs/blocks/column-editor"},{"title":"Coming Soon","sidebarTitle":"Coming Soon","href":"/docs/blocks/coming-soon"},{"title":"Decorative Icon","sidebarTitle":"Decorative Icon","href":"/docs/blocks/decorative-icon"},{"title":"Empty States","sidebarTitle":"Empty States","href":"/docs/blocks/empty-state"},{"title":"Global Navigation","sidebarTitle":"Global Navigation","href":"/docs/blocks/global-navigation"},{"title":"Home Screens","sidebarTitle":"Home Screens","href":"/docs/blocks/home-screens"},{"title":"Peek","sidebarTitle":"Peek","href":"/docs/blocks/peek"},{"title":"Tables","sidebarTitle":"Tables","href":"/docs/blocks/tables"}]},{"group":"Icons","root":{"title":"Icons","sidebarTitle":"Overview","href":"/docs/icons/index"},"pages":[{"title":"Icons – Material","sidebarTitle":"Material","mode":"wide","href":"/docs/icons/material"},{"title":"Icons – Lucide","sidebarTitle":"Lucide","mode":"wide","href":"/docs/icons/lucide"}]},{"group":"Illustrations","root":{"title":"Illustrations","sidebarTitle":"Overview","mode":"wide","href":"/docs/illustrations/index"},"pages":[{"title":"Empty states","sidebarTitle":"Empty states","href":"/docs/illustrations/empty-states"}]},{"title":"Design Tokens","sidebarTitle":"Design Tokens","mode":"wide","href":"/docs/design-tokens"},{"group":"Charts","root":{"title":"Charts","sidebarTitle":"Overview","href":"/docs/charts/index"},"pages":[{"group":"Web","root":{"title":"Charts – Web","sidebarTitle":"Overview","href":"/docs/charts/web/index"},"pages":[{"title":"Chart Component","sidebarTitle":"Chart Component","href":"/docs/charts/web/chart"},{"group":"Chart types","pages":[{"title":"Area","sidebarTitle":"Area","href":"/docs/charts/web/area"},{"title":"Bar","sidebarTitle":"Bar","href":"/docs/charts/web/bar"},{"title":"Combined","sidebarTitle":"Combined","href":"/docs/charts/web/combined"},{"title":"Donut","sidebarTitle":"Donut","href":"/docs/charts/web/donut"},{"title":"Grouped bar","sidebarTitle":"Grouped bar","href":"/docs/charts/web/grouped-bar"},{"title":"Line","sidebarTitle":"Line","href":"/docs/charts/web/line"},{"title":"Stacked bar","sidebarTitle":"Stacked bar","href":"/docs/charts/web/stacked-bar"}]},{"group":"Palettes","root":{"title":"Palettes","sidebarTitle":"Overview","href":"/docs/charts/web/palettes/index"},"pages":[{"title":"Categorical palette","sidebarTitle":"Categorical","href":"/docs/charts/web/palettes/categorical"},{"title":"Monochrome palette","sidebarTitle":"Monochrome","href":"/docs/charts/web/palettes/monochrome"},{"title":"Semantic palette","sidebarTitle":"Semantic","href":"/docs/charts/web/palettes/semantic"}]}]},{"group":"React Native","root":{"title":"Charts – React Native","sidebarTitle":"Overview","href":"/docs/charts/react-native/index"},"pages":[{"title":"Chart Component","sidebarTitle":"Chart Component","href":"/docs/charts/react-native/chart"},{"group":"Chart types","pages":[{"title":"Area","sidebarTitle":"Area","href":"/docs/charts/react-native/area"},{"title":"Bar","sidebarTitle":"Bar","href":"/docs/charts/react-native/bar"},{"title":"Combined","sidebarTitle":"Combined","href":"/docs/charts/react-native/combined"},{"title":"Donut","sidebarTitle":"Donut","href":"/docs/charts/react-native/donut"},{"title":"Grouped bar","sidebarTitle":"Grouped bar","href":"/docs/charts/react-native/grouped-bar"},{"title":"Line","sidebarTitle":"Line","href":"/docs/charts/react-native/line"},{"title":"Stacked bar","sidebarTitle":"Stacked bar","href":"/docs/charts/react-native/stacked-bar"}]},{"group":"Palettes","root":{"title":"Palettes","sidebarTitle":"Overview","href":"/docs/charts/react-native/palettes/index"},"pages":[{"title":"Categorical palette","sidebarTitle":"Categorical","href":"/docs/charts/react-native/palettes/categorical"},{"title":"Monochrome palette","sidebarTitle":"Monochrome","href":"/docs/charts/react-native/palettes/monochrome"},{"title":"Semantic palette","sidebarTitle":"Semantic","href":"/docs/charts/react-native/palettes/semantic"}]}]},{"group":"amCharts","root":{"title":"amCharts (deprecated)","sidebarTitle":"Overview","href":"/docs/charts/amcharts/index"},"tag":"DEPRECATED","pages":[{"title":"Getting Started","sidebarTitle":"Getting Started","href":"/docs/charts/amcharts/getting-started"},{"title":"Bar Charts","sidebarTitle":"Bar Charts","href":"/docs/charts/amcharts/bar-charts"},{"title":"Donut Charts","sidebarTitle":"Donut Charts","href":"/docs/charts/amcharts/donut-charts"}]}]},{"group":"Utilities","pages":[{"group":"Web","root":{"title":"Utilities","sidebarTitle":"Overview","mode":"wide","href":"/docs/utilities/web/index"},"pages":[{"group":"Hooks","root":{"title":"Hooks","sidebarTitle":"Overview","mode":"wide","href":"/docs/utilities/web/hooks/index"},"pages":[{"title":"useAccessibleColor","sidebarTitle":"useAccessibleColor","href":"/docs/utilities/web/hooks/useAccessibleColor"},{"title":"useAdaptiveView","sidebarTitle":"useAdaptiveView","tag":"BETA","href":"/docs/utilities/web/hooks/useAdaptiveView"},{"title":"useBreakpoint","sidebarTitle":"useBreakpoint","href":"/docs/utilities/web/hooks/useBreakpoint"},{"title":"useMergeRefs","sidebarTitle":"useMergeRefs","href":"/docs/utilities/web/hooks/useMergeRefs"},{"title":"usePrefersColorScheme","sidebarTitle":"usePrefersColorScheme","href":"/docs/utilities/web/hooks/usePrefersColorScheme"},{"title":"usePrefersReducedMotion","sidebarTitle":"usePrefersReducedMotion","href":"/docs/utilities/web/hooks/usePrefersReducedMotion"},{"title":"useSwipe","sidebarTitle":"useSwipe","href":"/docs/utilities/web/hooks/useSwipe"}]},{"title":"AI Marks","sidebarTitle":"AI Marks","href":"/docs/utilities/web/ai-marks"},{"title":"CSS Utilities","sidebarTitle":"CSS Utilities","href":"/docs/utilities/web/css-utilities"},{"title":"Data Attributes","sidebarTitle":"Data Attributes","href":"/docs/utilities/web/data-attributes"},{"title":"Date Values","sidebarTitle":"Date Values","href":"/docs/utilities/web/date-values"},{"title":"Layout Props","sidebarTitle":"Layout Props","href":"/docs/utilities/web/layout-props"},{"title":"Intl Provider","sidebarTitle":"Intl Provider","href":"/docs/utilities/web/intl-provider"}]}]},{"group":"Community Extensions","pages":[{"group":"anvil2-ext-common","root":{"title":"Common","sidebarTitle":"Overview","href":"/docs/kits/common/index"},"pages":[{"group":"Form fields","root":{"title":"Form fields","sidebarTitle":"Overview","href":"/docs/kits/common/form-fields/index"},"pages":[{"title":"Field state","sidebarTitle":"Field state","href":"/docs/kits/common/form-fields/field-state"},{"title":"Interval frequency","sidebarTitle":"Interval frequency","href":"/docs/kits/common/form-fields/interval-frequency"}]},{"group":"Hooks","root":{"title":"Hooks","sidebarTitle":"Overview","href":"/docs/kits/common/hooks/index"},"pages":[{"title":"useInputGuards","sidebarTitle":"useInputGuards","href":"/docs/kits/common/hooks/use-input-guards"}]},{"title":"Illustration","sidebarTitle":"Illustration","href":"/docs/kits/common/illustration"},{"title":"Migration","sidebarTitle":"Migration","href":"/docs/kits/common/migration"}]},{"group":"Atlas v1","tag":"DEPRECATED","pages":[{"title":"Atlas","sidebarTitle":"Overview","href":"/docs/kits/atlas/index"},{"group":"Components","pages":[{"group":"Artifact Card","pages":[{"title":"Artifact Card – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/artifact-card/code"}]},{"group":"Artifact Panel","pages":[{"title":"Artifact Panel – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/artifact-panel/code"}]},{"group":"Artifact Panel Layout","pages":[{"title":"Artifact Panel Layout – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/artifact-panel-layout/code"}]},{"group":"Atlas Header","pages":[{"title":"Atlas Header – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/atlas-header/code"}]},{"group":"Chat Composer Rich","pages":[{"title":"Chat Composer Rich – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/chat-composer-rich/code"}]},{"group":"Chat Window","pages":[{"title":"Chat Window – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/chat-window/code"}]},{"group":"Content","pages":[{"title":"Content – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/content/code"}]},{"group":"Footer","pages":[{"title":"Footer – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/footer/code"}]},{"group":"Header","pages":[{"title":"Header – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/header/code"}]},{"group":"Infinite Content","pages":[{"title":"Infinite Content – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/infinite-content/code"}]},{"group":"Loader","pages":[{"title":"Loader – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/loader/code"}]},{"group":"Markdown Text","pages":[{"title":"Markdown Text – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/markdown-text/code"}]},{"group":"Messages","pages":[{"group":"Assistant","pages":[{"title":"Assistant Message – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/messages/assistant-message/code"}]},{"group":"Error","pages":[{"title":"Error Message – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/messages/error-message/code"}]},{"group":"Markdown","pages":[{"title":"Markdown Message – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/messages/markdown-message/code"}]},{"group":"Small Action","pages":[{"title":"Small Action – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/messages/small-action/code"}]},{"group":"System","pages":[{"title":"System Message – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/messages/system-message/code"}]},{"group":"User","pages":[{"title":"User Message – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/messages/user-message/code"}]}]},{"group":"Notification Card","pages":[{"title":"Notification Card – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/notification-card/code"}]},{"group":"Recommendations","pages":[{"group":"Confirmation","pages":[{"title":"Confirmation Card – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/recommendations/confirmation-card/code"}]},{"group":"Multiple","pages":[{"title":"Multiple Recommendation Card – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/recommendations/multiple-recommendation-card/code"}]},{"group":"Single","pages":[{"title":"Single Recommendation Card – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/recommendations/single-recommendation-card/code"}]}]},{"group":"Screens","pages":[{"group":"System Error","pages":[{"title":"System Error – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/screens/system-error/code"}]},{"group":"Welcome","pages":[{"title":"Welcome – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/screens/welcome/code"}]}]},{"group":"Spinner","pages":[{"title":"Spinner – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/spinner/code"}]},{"group":"Suggestion","pages":[{"title":"Suggestion – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/suggestion/code"}]},{"group":"Toolbox","pages":[{"title":"Toolbox – Code","sidebarTitle":"Code","href":"/docs/kits/atlas/components/toolbox/code"}]}]},{"group":"Hooks","pages":[{"title":"Hooks","sidebarTitle":"Overview","mode":"wide","href":"/docs/kits/atlas/hooks/index"},{"title":"useDraggable","sidebarTitle":"useDraggable","href":"/docs/kits/atlas/hooks/use-draggable"},{"title":"useInfiniteScroll","sidebarTitle":"useInfiniteScroll","href":"/docs/kits/atlas/hooks/use-infinite-scroll"},{"title":"useScrollCallback","sidebarTitle":"useScrollCallback","href":"/docs/kits/atlas/hooks/use-scroll-callback"}]}]}]}]},{"group":"Resources","pages":[{"title":"Visit Anvil1","href":"/docs/resources/visit-anvil1"},{"group":"Migration Guides","pages":[{"group":"@servicetitan/anvil2","pages":[{"title":"Anvil2 2.0 to 3.0","sidebarTitle":"2.0 to 3.0","href":"/docs/resources/migration-guides/2.0-to-3.0"},{"title":"Anvil2 1.0 to 2.0","sidebarTitle":"1.0 to 2.0","href":"/docs/resources/migration-guides/1.0-to-2.0"}]},{"title":"Anvil to Anvil2","sidebarTitle":"Anvil to Anvil2","href":"/docs/resources/migration-guides/anvil-to-anvil2"}]},{"title":"Roadmap","mode":"wide","href":"/docs/resources/roadmap"},{"title":"Office Hours","url":"https://calendly.com/anvil-servicetitan/office-hours","href":"/docs/resources/office-hours"},{"group":"Contributing","pages":[{"title":"Code Contributions","url":"https://github.com/servicetitan/hammer/blob/main/CONTRIBUTING.md","href":"/docs/resources/contributing/code-contributions"},{"title":"Design Contributions","url":"https://servicetitan.atlassian.net/wiki/spaces/ADS/pages/2054129026?atlOrigin=eyJpIjoiNmEzYmNhZTM4NzhmNDFjNDk0MjY2NjM5OGE1ZTJkOWIiLCJwIjoiYyJ9","href":"/docs/resources/contributing/design-contributions"},{"title":"Accessible Custom Components","sidebarTitle":"Accessible Custom Components","href":"/docs/resources/contributing/accessible-custom-components"}]},{"group":"Playbook","root":{"title":"Overview","sidebarTitle":"Overview","href":"/docs/resources/playbook/overview"},"pages":[{"title":"Principles","sidebarTitle":"Principles","href":"/docs/resources/playbook/principles"},{"title":"Governance","sidebarTitle":"Governance","href":"/docs/resources/playbook/governance"},{"title":"How We Work","sidebarTitle":"How We Work","href":"/docs/resources/playbook/how-we-work"},{"title":"Foundations","sidebarTitle":"Foundations","href":"/docs/resources/playbook/foundations"},{"title":"Content Guidance","sidebarTitle":"Content Guidance","href":"/docs/resources/playbook/content-guidance"},{"title":"Accessibility","sidebarTitle":"Accessibility","href":"/docs/resources/playbook/accessibility"},{"title":"Versioning and Releases","sidebarTitle":"Versioning and Releases","href":"/docs/resources/playbook/versioning-releases"}]}]}]},{"tab":"Blog","pages":[{"title":"Blog","href":"/blog"}]}]},"title":"Embedded AI - Web","buildId":"dpl_2oYXwqkEXirXBPk8wV1FtM5USFWi","deploymentId":"dpl_2oYXwqkEXirXBPk8wV1FtM5USFWi","dynamics":[],"chunks":[]}