# @syncfusion/ej2-popups > A package of Essential JS 2 popup components such as Dialog and Tooltip that is used to display information or messages in separate pop-ups. Latest version **34.2.6** (published 2026-09-01) · SEE LICENSE IN license license · 0 weekly downloads ## Install ```sh npm install @syncfusion/ej2-popups pnpm add @syncfusion/ej2-popups yarn add @syncfusion/ej2-popups bun add @syncfusion/ej2-popups ``` ## Health **Score 65/100 (B)** — status: active. Positive: has types; esm support; no vulnerabilities; recently updated; high maintenance score. Warnings: low downloads. ## Facts | | | |---|---| | Version | 34.2.6 | | Published | 2026-09-01 | | First published | 2017-05-10 | | Weekly downloads | 0 | | License | SEE LICENSE IN license | | TypeScript types | bundled | | Module format | ESM + CommonJS | | Dependencies | 2 | | Unpacked size | 4.9 MB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 449 | | Author | Syncfusion Inc. | | Maintainers | syncfusionorg, essentialjs2, syncfusion-javascript | | Keywords | ej2, syncfusion, web-components, javascript, typescript, dialog, modal, popup, alert, tooltip, hint, spinner, waiting-popup, loading-indicator, loader, busy-indicator, waitingfor-loader | ## Links - npm: https://www.npmjs.com/package/@syncfusion/ej2-popups - Repository: https://github.com/syncfusion/ej2-javascript-ui-controls - Homepage: https://www.syncfusion.com/javascript-ui-controls - Issues: https://github.com/syncfusion/ej2-javascript-ui-controls/issues - npm.io page: https://npm.io/package/@syncfusion/ej2-popups ## Dependencies (2) - [@syncfusion/ej2-base](https://npm.io/package/@syncfusion/ej2-base.md) ~34.2.6 - [@syncfusion/ej2-buttons](https://npm.io/package/@syncfusion/ej2-buttons.md) ~34.2.6 ## Alternatives - [react-native-root-siblings](https://npm.io/package/react-native-root-siblings.md) — 102.9K weekly downloads - [@praxisui/dialog](https://npm.io/package/@praxisui/dialog.md) — 2.0K weekly downloads - [easy-toggle-state](https://npm.io/package/easy-toggle-state.md) — 350 weekly downloads - [ngx-lightbox-evp](https://npm.io/package/ngx-lightbox-evp.md) — 19 weekly downloads - [react-native-modal-translucent-axton](https://npm.io/package/react-native-modal-translucent-axton.md) — 4 weekly downloads ## Recent versions - 34.2.6 (latest) — 2026-09-01 - 26.1.35-786043 (beta) — 2025-11-20 - 34.2.4 — 2026-08-18 - 34.2.3 — 2026-08-11 - 34.2.2 — 2026-08-05 - 34.1.29 — 2026-07-06 - 33.2.7 — 2026-05-19 - 33.2.5 — 2026-05-05 - 33.2.3 — 2026-04-21 - 33.1.44 — 2026-03-16 - 32.2.8 — 2026-03-03 - 32.2.7 — 2026-02-24 - 32.2.6 — 2026-02-17 - 32.2.5 — 2026-02-17 - 32.2.4 — 2026-02-11 - … 261 more at https://npm.io/package/@syncfusion/ej2-popups/versions ## README # ej2-popups > **Using this package with an AI coding agent** > > Before generating Syncfusion® code, ask your AI coding agent to run the Syncfusion® setup using the following prompt: > > ```text > Set up this project for Syncfusion® before generating code. Fetch and follow the official instructions at https://ai.syncfusion.com/agent-setup/prompt.md, then report the detected platform, installed skill pack, MCP status, and any required licensing action. > ``` > The setup detects your project’s platform and loads the appropriate Syncfusion® skill pack. No Syncfusion® account or MCP key is required to install or read Syncfusion® agent skills. > > **Platform reference:** [https://ai.syncfusion.com/javascript/llms.txt](https://ai.syncfusion.com/javascript/llms.txt) The popup components such as dialog and tooltip are used to display information in a popup to users. The dialog component provides modal/non-modal (modeless), built-in buttons, positioning, animation, draggable, and template features and helps to create alert, prompt, and confirmation dialogs easily. The tooltip component is used to display a popup that contains some information or message when you hover, click, focus, or touch an element. The information displayed in the tooltip can include simple text, images, hyperlinks, or custom templates. ![Popup](https://ej2.syncfusion.com/products/images/popup/readme.png) > This is a commercial product and requires a paid license for possession or use. Syncfusion’s licensed software, including this component, is subject to the terms and conditions of Syncfusion's [EULA](https://www.syncfusion.com/eula/es/?utm_source=npm&utm_campaign=popup). To acquire a license for 140+ [JavaScript UI controls](https://www.syncfusion.com/javascript-ui-controls), you can [purchase](https://www.syncfusion.com/sales/products) or [start a free 30-day trial](https://www.syncfusion.com/account/manage-trials/start-trials/?utm_source=npm&utm_campaign=popup). > A [free community license](https://www.syncfusion.com/products/communitylicense/?utm_source=npm&utm_campaign=popup) is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers. ## Setup To install popup components and its dependent packages, use the following command ```sh npm install @syncfusion/ej2-popups ``` ## Components Included Following list of components are available in the package ## Dialog * [Getting Started](https://ej2.syncfusion.com/documentation/dialog/getting-started/?utm_source=npm&utm_campaign=dialog) * [View Online Demos](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=dialog#/fluent2/dialog/default.html) * [Product Page](https://www.syncfusion.com/javascript-ui-controls/modal-dialog/?utm_source=npm&utm_campaign=dialog) ## Tooltip * [Getting Started](https://ej2.syncfusion.com/documentation/tooltip/getting-started/?utm_source=npm&utm_campaign=tooltip) * [View Online Demos](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=tooltip#/fluent2/tooltip/default.html) * [Product Page](https://www.syncfusion.com/javascript-ui-controls/tooltip/?utm_source=npm&utm_campaign=tooltip) ## Supported Frameworks These components are available in following list of: | [](https://www.syncfusion.com/angular-components?utm_medium=listing&utm_source=github)
     [Angular](https://www.syncfusion.com/angular-components?utm_medium=listing&utm_source=github)     | [](https://www.syncfusion.com/react-components?utm_medium=listing&utm_source=github)
      [React](https://www.syncfusion.com/react-components?utm_medium=listing&utm_source=github)       | [](https://www.syncfusion.com/vue-components?utm_medium=listing&utm_source=github)
         [Vue](https://www.syncfusion.com/vue-components?utm_medium=listing&utm_source=github)          | [](https://www.syncfusion.com/aspnet-core-ui-controls?utm_medium=listing&utm_source=github)
  [ASP.NET Core](https://www.syncfusion.com/aspnet-core-ui-controls?utm_medium=listing&utm_source=github)   | [](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_medium=listing&utm_source=github)
  [ASP.NET MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_medium=listing&utm_source=github)   | | :-----: | :-----: | :-----: | :-----: | :-----: | ## Use-case samples / Showcase samples * Expanse Tracker ([Source](https://github.com/syncfusion/ej2-showcase-ts-expensetracker), [Live Demo](https://ej2.syncfusion.com/showcase/typescript/expensetracker/#/dashboard)) * Story Estimator ([Source](https://github.com/syncfusion/ej2-showcase-aspnetcore-story-estimator), [Live Demo](https://aspdotnetcore.syncfusion.com/showcase/aspnetcore/story-estimator/#/dashboard)) * Diagram Builder ([Source](https://github.com/syncfusion/ej2-showcase-ng-diagrambuilder), [Live Demo](https://ej2.syncfusion.com/showcase/angular/diagrambuilder/)) * IT Asset Management ([Live Demo](https://ej2.syncfusion.com/showcase/vue/assetmanagement/#/)) * Webmail ([Source](https://github.com/syncfusion/ej2-showcase-ts-webmail), [Live Demo](https://ej2.syncfusion.com/showcase/typescript/webmail/#/home)) * Loan Calculator ([Source](https://github.com/syncfusion/ej2-showcase-ts-loancalculator), [Live Demo](https://ej2.syncfusion.com/showcase/typescript/loancalculator/#/default)) ## Key Features ## Dialog * [Modal](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=dialog/#/fluent2/dialog/modal-dialog.html) - Displays the important information to users. * [Positioning](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=dialog#/fluent2/dialog/position.html) - Supports to customize its display position. * [Animation](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=dialog#/fluent2/dialog/animation.html) - Offers to set animation effects on open and close the dialog. * [Template](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=dialog#/fluent2/dialog/template.html) - Provides an option to customize its header and footer. * [Built-in buttons](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=dialog#/fluent2/dialog/default.html) - Provides a built-in support to add buttons to its properties. ## Tooltip * [Positions](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=tooltip#/fluent2/tooltip/default.html) - Allows you to display the tooltip in 12 different positions. * [Animation](https://ej2.syncfusion.com/products/typescript/tooltip/animation/?utm_source=npm&utm_campaign=tooltip) - Supports animation effects while showing/hiding the tooltip. * [Content](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=tooltip/#/fluent2/tooltip/ajax-content.html) - Assigns with static text, template, or loaded dynamically via AJAX. * [Opening modes](https://ej2.syncfusion.com/products/typescript/tooltip/show-hide/?utm_source=npm&utm_campaign=tooltip) - Supports four opening modes such as hover, click, focus, and custom. * [Smart positioning](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=tooltip/#/fluent2/tooltip/smart-position.html) - Supports auto tip positioning. * [Mouse trail](https://ej2.syncfusion.com/products/typescript/tooltip/customization/?utm_source=npm&utm_campaign=tooltip) - Moves along with mouse pointer using the mouse trailing option. * [Sticky mode](https://ej2.syncfusion.com/products/typescript/tooltip/show-hide/?utm_source=npm&utm_campaign=tooltip) - Opens in sticky mode, and allows you to close/hide the Tooltip manually. ## Resources * [Theme Studio](https://ej2.syncfusion.com/themestudio/) * [Custom Resource Generator](https://crg.syncfusion.com/) * [What's New](https://www.syncfusion.com/products/whatsnew/essential-js2?utm_medium=listing&utm_source=github) * [Road Map](https://www.syncfusion.com/products/roadmap/essential-js2?utm_medium=listing&utm_source=github) * [E-Books](https://www.syncfusion.com/ebooks?tag=javascript&utm_medium=listing&utm_source=github) ## Support Product support is available for through following mediums: * [Support ticket](https://support.syncfusion.com/support/tickets/create) - Guaranteed Response in 24 hours | Unlimited tickets | Holiday support * [Community forum](https://www.syncfusion.com/forums/essential-js2/?utm_source=npm&utm_campaign=popup). * New [GitHub issue](https://github.com/syncfusion/ej2-javascript-ui-controls/issues/new). * Ask your query in Stack Overflow with tag `syncfusion` and `ej2`. * [Request feature or report bug](https://www.syncfusion.com/feedback/javascript) * Live chat ## License Check the license detail [here](https://github.com/syncfusion/ej2-javascript-ui-controls/blob/master/license). ## Changelog Check the changelog [here](https://github.com/syncfusion/ej2-javascript-ui-controls/blob/master/controls/popups/CHANGELOG.md/?utm_source=npm&utm_campaign=dialog). © Copyright 2026 Syncfusion® Inc. All Rights Reserved. The Syncfusion® Essential Studio® license and copyright applies to this distribution. --- _Source: https://npm.io/package/@syncfusion/ej2-popups · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._