DevExtreme Complete 21.1

Data Grid

• Export to PDF (CTP)
  • The Export to PDF API now includes the following options/capabilities:
    • WYSIWYG Export to PDF.
    • Fit-to-Page.
    • Multi-Page Export.
    • Text Wrapping.
    • Progress Indication.
    • Cell Content, Format and Appearance Customization options.

Data Grid & Tree List

• Pager Enhancements
  • This release includes the following pager-related enhancements:
    • A new pager.displayMode property. This property specifies the pager's display layout: full, compact, or adaptive.
    • The page size selector can now display 'All' records on a page (pager.allowedPageSizes).
• Editing API Enhancements
  • You can now use declarative bindings to insert new rows in Angular, React and Vue applications.
• Add New Rows to a Specified Position (CTP)
  • You can now insert a new row at any location within a list (first, last or a custom position).

Diagram

• Get a Diagram Shape or Connector by ID or Key
  • This release allows you to obtain a diagram shape or connector by its internal identifier (getItemById) or by a data key (getItemByKey).
  • New shape properties include information about containers:
    • containerChildItemIds - Gets shape identifiers within a container.
    • containerExpanded - Gets whether a container is expanded.
    • containerId - Gets the container identifier with a shape.
• Iterate through Diagram Shapes and Connectors
  • Use the new getItems method to obtain an array of all diagram items (shapes and connectors).
• Select Shapes and Connectors
  • This release includes the following API enhancements:
    • getSelectedItems - Returns selected diagram shapes and connectors.
    • setSelectedItems - Selects specified diagram shapes and connectors.
• Scroll to Item
  • Use the new scrollToItem method to scroll the drawing canvas to the specified diagram item.

ES6 (ECMAScript 6) Modules

• DevExtreme's npm distribution now includes ES6 modules. These modules help optimize Tree Shaking and decrease production JavaScript bundle size.
• With this update, you can also use modern JavaScript bundlers that don't support the CommonJS module format and only work with ES6 modules.

File Manager

• Customize a Context Menu for Individual Files/Folders
  • The new onContextMenuShowing event allows you to customize your app's context menu for individual files and folders. You can add/remove menu items, specify item state, etc.
• Describe Errors on the Client
  • The File Manager's API includes a new FileSystemError class. This class allows you to specify an error code (errorCode), error description (errorText) and file system element (fileSystemItem) when handling errors within 'CustomFileSystemProvider'.
• Show/Hide Progress Panel
  • Use the new showPanel and showPopup options to display a progress panel and pop-up notifications within the File Manager.
• Custom HTTP Headers in Remote File System Provider
  • You can now customize AJAX (beforeAjaxSend) and form submit requests (beforeSubmit) before they are sent to the server.

Gantt

• Export to PDF (CTP)
  • The Gantt component can now export content to PDF.
• API Enhancements
  • This release includes the following Gantt related API updates:
    • scrollToDate - Scrolls the Gantt chart to a specified date on a timeline.
    • resourceManagerDialogShowing - Allows you to customize the Resource Manager dialog.
    • taskContentTemplate - Allows you to customize the layout and appearance of individual task elements.

HTML/Markdown Editor

• v21.1 marks the official release of the HTML/Markdown Editor. The DevExpress HTML/Markdown Editor includes the following integrated features:
  • Inline, Block, and Embedded Format Support.
  • Format Customization.
  • Custom Modules.
  • HTML and Markdown Support.
  • Insert Image (a link or base64-encoded string) Support.
  • Mail Merge Support.
  • Copy-Paste Rich Content Support.
  • Mentions.
  • Multiline Toolbar.
  • Table Support.
  • Localization.

Scheduler

• Agenda View - Redesigned
  • The redesigned Agenda View now displays resources and a recurrence indicator for recurring appointments. Color markers help users differentiate appointments by resource.
• Horizontal Virtual Scrolling
  • Horizontal Virtual Scrolling is now available across all Scheduler Views. When virtual scrolling is enabled, the Scheduler only renders grid cells and appointments that fall into the visible viewport.
• Drag-and-Drop Enhancements
  • Drag-and-Drop is now more intuitive and event positioning more predictable.

TypeScript Enhancements

• DevExtreme v21.1 includes the following TypeScript related enhancements:
  • DevExtreme modules no longer contain JQuery types if JQuery is not used in your target project.
  • You can now use named types for event arguments within your application code.
  • Event argument types now contain information about optional properties (that can be undefined) and writable properties (that can be modified in your event handlers).