--- title: Copilot UX components are generally available: bring... description: Copilot UX components are now generally available with SharePoint Framework (SPFx) 1.24. They let developers embed interactive dashboards, forms, and business... canonical: https://daily.dev/posts/copilot-ux-components-are-generally-available-bring-interactive-experiences-into-copilot-kwku4jugs twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: Copilot UX components are generally available: bring interactive experiences into Copilot | daily.dev og:description: Copilot UX components are now generally available with SharePoint Framework (SPFx) 1.24. They let developers embed interactive dashboards, forms, and business... og:url: https://daily.dev/posts/copilot-ux-components-are-generally-available-bring-interactive-experiences-into-copilot-kwku4jugs og:image: https://api.daily.dev/og/posts/kwKu4JUgS.png og:image:alt: Copilot UX components are generally available: bring interactive experiences into Copilot og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # Copilot UX components are generally available: bring interactive experiences into Copilot **[DevBlogs](https://daily.dev/sources/devblogs)** · 12 min read · 0 upvotes · 0 comments ## Summary Copilot UX components are now generally available with SharePoint Framework (SPFx) 1.24. They let developers embed interactive dashboards, forms, and business actions directly inside the Microsoft Copilot conversation, built with React, TypeScript, or plain JavaScript. Microsoft 365 hosts and routes the components automatically inside the customer's tenant, with built-in single sign-on, so teams skip building separate web servers or auth flows. The components use the Model Context Protocol Apps model. SPFx 1.24 also ships React 18 by default and adds Node.js 24 and 26 support. A Microsoft Copilot add-on license is required to render the components, and mobile support plus a new plug-in model are planned as follow-on work. ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Questions this post answers ### What is required for a user to see Copilot UX components in Microsoft Copilot? Users need a Microsoft Copilot add-on license to use Copilot UX components. Without it, components do not render and the user instead sees a message explaining the license requirement. Using the components does not itself incur consumption-based charges, though calling a consumption-based API like Work IQ from within a component may generate charges. _Teams planning Copilot customizations can track licensing and rollout details like this on daily.dev._ ### How do Copilot UX components differ from an externally hosted MCP App? Copilot UX components use the same MCP Apps model for interactive UI but remove the hosting burden: SharePoint Framework automatically hosts the component's JavaScript and CSS inside the customer's Microsoft 365 tenant, handles tool routing, and provides built-in single sign-on with the signed-in user's permissions. An externally hosted MCP App instead requires the team to build, secure, scale, and operate its own web app, endpoint, and authentication. _Developers weighing MCP hosting approaches can compare tradeoffs like these on daily.dev._ ### What version of React and Node.js does SharePoint Framework (SPFx) 1.24 support? SPFx 1.24 ships new solutions with React 18.x by default and supports both Node.js 24 and Node.js 26 for development. The release also adds production-ready Copilot UX components with a predictable default display mode, automatic Teams manifest version updates, and declarative agent manifest validation at build time. _Teams upgrading SPFx projects can check version compatibility notes like these on daily.dev._ ## Similar posts on daily.dev - [SharePoint Copilot Apps Now in Public Preview: From Intent to Action in Microsoft 365 Copilot](https://daily.dev/posts/sharepoint-copilot-apps-now-in-public-preview-from-intent-to-action-in-microsoft-365-copilot-8mz06tlgf) · DevBlogs · 0 upvotes · 0 comments - [SharePoint Framework \(SPFx\) roadmap update – September 2026](https://daily.dev/posts/sharepoint-framework-spfx-roadmap-update-september-2026-pyvb0ek9k) · DevBlogs · 0 upvotes · 0 comments - [SharePoint Framework \(SPFx\) roadmap update – August 2026](https://daily.dev/posts/sharepoint-framework-spfx-roadmap-update-august-2026-pg4qgloyu) · DevBlogs · 1 upvotes · 0 comments - [Copilot is ready. Is your data?](https://daily.dev/posts/copilot-is-ready-is-your-data--9b3qcb1vv) · TechCentral · 0 upvotes · 0 comments --- Tags: [#react](https://daily.dev/tags/react), [#authentication](https://daily.dev/tags/authentication), [#mcp](https://daily.dev/tags/mcp), [#microsoft-copilot](https://daily.dev/tags/microsoft-copilot) [View this post on daily.dev](https://daily.dev/posts/copilot-ux-components-are-generally-available-bring-interactive-experiences-into-copilot-kwku4jugs) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@type":"TechArticle","headline":"Copilot UX components are generally available: bring interactive experiences into Copilot","url":"https://daily.dev/posts/copilot-ux-components-are-generally-available-bring-interactive-experiences-into-copilot-kwku4jugs","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/copilot-ux-components-are-generally-available-bring-interactive-experiences-into-copilot-kwku4jugs"},"datePublished":"2026-10-28T16:28:16.021Z","dateModified":"2026-10-28T16:36:37.457Z","description":"Copilot UX components are now generally available with SharePoint Framework (SPFx) 1.24. They let developers embed interactive dashboards, forms, and business...","image":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/a41690744962b565b46399820b07b4a0?_a=AQAEuop","thumbnailUrl":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/a41690744962b565b46399820b07b4a0?_a=AQAEuop","isAccessibleForFree":true,"articleSection":"DevBlogs","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"DevBlogs","logo":"https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/8f68b453325f482ebeb73fb780092713","url":"https://daily.dev/sources/devblogs"},"commentCount":0,"discussionUrl":"https://daily.dev/posts/copilot-ux-components-are-generally-available-bring-interactive-experiences-into-copilot-kwku4jugs","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":0},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":0}],"keywords":"react,authentication,mcp,microsoft-copilot","timeRequired":"PT12M"} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"DevBlogs","item":"https://daily.dev/sources/devblogs"},{"@type":"ListItem","position":3,"name":"Copilot UX components are generally available: bring interactive experiences into Copilot"}]} {"@context":"https://schema.org","@type":"FAQPage","@id":"https://daily.dev/posts/copilot-ux-components-are-generally-available-bring-interactive-experiences-into-copilot-kwku4jugs#faq","mainEntity":[{"@type":"Question","name":"What is required for a user to see Copilot UX components in Microsoft Copilot?","acceptedAnswer":{"@type":"Answer","text":"Users need a Microsoft Copilot add-on license to use Copilot UX components. Without it, components do not render and the user instead sees a message explaining the license requirement. Using the components does not itself incur consumption-based charges, though calling a consumption-based API like Work IQ from within a component may generate charges. Teams planning Copilot customizations can track licensing and rollout details like this on daily.dev."}},{"@type":"Question","name":"How do Copilot UX components differ from an externally hosted MCP App?","acceptedAnswer":{"@type":"Answer","text":"Copilot UX components use the same MCP Apps model for interactive UI but remove the hosting burden: SharePoint Framework automatically hosts the component's JavaScript and CSS inside the customer's Microsoft 365 tenant, handles tool routing, and provides built-in single sign-on with the signed-in user's permissions. An externally hosted MCP App instead requires the team to build, secure, scale, and operate its own web app, endpoint, and authentication. Developers weighing MCP hosting approaches can compare tradeoffs like these on daily.dev."}},{"@type":"Question","name":"What version of React and Node.js does SharePoint Framework (SPFx) 1.24 support?","acceptedAnswer":{"@type":"Answer","text":"SPFx 1.24 ships new solutions with React 18.x by default and supports both Node.js 24 and Node.js 26 for development. The release also adds production-ready Copilot UX components with a predictable default display mode, automatic Teams manifest version updates, and declarative agent manifest validation at build time. Teams upgrading SPFx projects can check version compatibility notes like these on daily.dev."}}]} ```