Handsontable （英語版） リリース

A core rewritten in TypeScript

• The entire Handsontable core has been rewritten from JavaScript to TypeScript. This is a long-term investment in stability and developer experience that touches nearly every part of the codebase.
• The rewrite brings strict-mode compatibility, type-aware lint rules, and stronger typings for built-in renderers, editors, and validators - the cell properties passed into them now use the canonical CellProperties interface instead of a loose record type. It also folded Walkontable, the rendering engine, into the main type-check program and cut its as unknown escape-hatch casts by roughly 85%.
• For everyone consuming the published package, the broken and ambiguous type declarations that previously tripped up ESM and CJS setups have been fixed. The shipped .d.ts files are now compatible with TypeScript 5.1 and later, so editor autocompletion and type checking should work out of the box.
• Because this is a foundational change to how the source is written and typed, it's a breaking change. Most applications will not need code changes, but stricter type definitions can surface issues that were previously hidden.

Faster rendering and dramatically lower memory use

• Walkontable now renders directly to the DOM, and Handsoncode removed the old diffing renderer entirely. This cut the grid's memory footprint by roughly 50%, reduced memory use during scrolling, and resolved potential out-of-memory errors on very large datasets. On top of that, it no longer eagerly materializes cell metadata for the whole grid on load - it's computed lazily as cells are actually used. For large datasets the impact is substantial: on a 100,000 x 100 grid, around a 90% reduction in memory and roughly 30x faster initial render time.
• Cell meta set imperatively with setCellMeta (for example, readOnly) is no longer reset by updateSettings.
• Faster repeated getSourceData() calls inside the cells function and custom renderers, cached overlay alignment calculations, and faster locale-aware text comparisons across search, filtering, sorting, autocomplete, and checkbox rendering.

A new layout system

• Handsontable 18.0.0 introduces a new layout option that lets you control the order of UI elements rendered around the grid, such as pagination and the dialog.
• To make this possible, built-in UI now mounts into dedicated wrapper containers rather than being injected ad hoc, which changes the root DOM structure - a breaking change to be aware of if you target Handsontable's markup with custom CSS or scripts.
• The license notification always renders last in the bottom area and is not orderable, and the Notification plugin now renders its toasts in the grid's overlay layer for more reliable positioning.

A smaller, dependency-free bundle

• Removed four runtime dependencies - numbro, moment.js, DOMPurify, and handsontable/pikaday - in favor of lighter, built-in implementations. This trims the bundle and reduces the surface area for transitive security and maintenance issues. Removing these is a breaking change for anyone relying on them indirectly through Handsontable.
• Retired some long-deprecated APIs:
  • The PersistentState plugin, its persistentState option, and its associated hooks have been removed.
  • The Core-level undo/redo methods (hot.undo(), hot.redo(), and friends) are gone. Use hot.getPlugin('undoRedo') instead.

A modernized Angular wrapper

• The Angular wrapper has been modernized to align with current Angular versions.

New configuration options

• This release adds a few new ways to configure the grid:
  • hashRevealDelay on the password cell type briefly shows each character as it's typed before masking it.
  • visibleWhen on nested headers ('collapsed', 'expanded', or 'always') lets you choose which columns of a collapsible group stay visible in each state.
  • Public types such as CellMeta, CellProperties, ColumnSettings, and GridSettings are now re-exported as named top-level imports from handsontable and handsontable/base, so you no longer have to dig through internal paths to type your code.

Theming changes

• Simplified the border-related theme variables. The --ht-wrapper-border-radius variable has been renamed to --ht-border-radius, and the --ht-wrapper-border-width and --ht-wrapper-border-color variables have been removed. If you reference these in a custom theme, you will need to update them when upgrading.

Interaction improvements

• A few changes make everyday interactions feel closer to a desktop spreadsheet. Dragging a selection past the edge of the viewport now scrolls the grid and extends the selection to the newly revealed cells, and the autofill selection direction now matches the drag direction, the way Google Sheets and Excel behave.

Documentation: new guides, recipes, and a Vue section

• This release adds documentation for its biggest changes. Layout slots is the counterpart to the new layout system, showing how to place custom UI in the wrapper slots around the grid and control the order of elements in each slot. TypeScript types is a complete reference of the types and interfaces Handsontable now exports, with usage examples for settings, hook callbacks, custom renderers, and editors. And a new Migrating from 17.1 to 18.0 guide walks through removing the moment.js, Pikaday, numbro, and DOMPurify dependencies and updating your TypeScript imports.
• Vue 3 now stands alongside React and Angular as a first-class framework in the docs, with its own dedicated section and new examples. Vue developers get first-party guidance written for Vue, instead of adapting the vanilla JavaScript examples.

Export to Excel

• The new Export to Excel feature lets you save the rendered table to an XLSX file - directly from the grid.
• The export respects what the user is actually looking at: column order, visible columns, applied filters, sort order, frozen rows/columns, and merged cells all carry over into the generated file. Cell types map to their Excel equivalents where possible (numeric, date, checkbox), so the file opens cleanly in Excel, Google Sheets, and Numbers.
• Export is triggered through the plugin API and can be wired to any UI control - a toolbar button, a context menu item, or a keyboard shortcut. For large datasets, the operation runs asynchronously so the UI stays responsive, which pairs naturally with the new Notifications plugin to confirm completion.

Server side row model

• Server-Side Row Model is a built-in integration layer for backend-driven tables. Instead of loading the full dataset into the browser, the grid requests only the rows it needs and delegates sorting, filtering, and pagination to your server. This dataProvider plugin defines a clear CRUD contract that your backend implements:
  • Create - persist newly inserted rows.
  • Read - fetch a page of rows with the current sort, filter, and range state.
  • Update - persist edited cells.
  • Delete - persist removed rows.
• Each operation receives a structured request describing the grid's current state and expects a structured response, so you can plug the contract into REST, GraphQL, or any transport of your choice. State management, optimistic updates, and reconciliation after failed requests are all handled by the plugin.
• The result is that datasets of hundreds of thousands of rows become viable without custom virtualization or hand-written adapter code - and the integration pattern is consistent across projects, which matters when the same team ships multiple data-heavy apps.

Notifications (Toasts)

• The new Notification plugin adds a built-in toast system for communicating status to users. It supports four types out of the box - info, success, warning, and error, along with configurable positioning, duration, and dismiss behavior.
• Notifications can also be triggered from custom cell types, hooks, and plugins, making them useful well beyond this release's features.

Theme Builder: AI Assistant

• Theme Builder now includes an AI chat assistant that can generate themes and sample data from natural-language prompts. Ask it for 'a dark theme matching the Stripe dashboard' or 'a high-contrast theme for financial reporting' and it produces a Themes API token set you can preview, tweak, and export.
• This builds on the Themes API foundation introduced in 17.0, the assistant writes token mappings, not CSS overrides, so generated themes stay compatible with density modes, light/dark switching, and the rest of the theming system.

Docs Platform Updates - Migration to Astro Starlight

• Migrated handsontable.com/docs from VuePress 1 to Astro Starlight. The user-facing benefits:
  • Faster page loads and smaller JS payloads (island architecture, zero-JS by default).
  • Improved AI/LLM readability - code blocks and content are server-rendered as static HTML, which makes the docs easier to index and cite by tools like Claude, ChatGPT, and Perplexity.

Docs AI Assistant

• The docs now include an AI Assistant that can answer questions, generate code samples, and help you find the right docs pages on any topic. Just click the Ask AI button to begin chatting.

New Recipes

• Added over 40 new recipes with detailed examples on Accessibility & UX, Real-time & Integrations, Column and Data Management, Cell Types, Context Menu, Import/Export, Editing and Validation, Filtering and Search, Rendering and Styling, Performance, and Themes.

Accessibility Conformance Report (VPAT)

• Published an Accessibility Conformance Report based on the VPAT 2.5 template, documenting Handsontable's conformance with WCAG 2.1 AA, Section 508, and EN 301 549. This is aimed at procurement, government, and enterprise customers who need formal accessibility documentation as part of their vendor evaluation.

Performance

• Performance is one of the top priorities, and 17.1 ships meaningful improvements for large datasets.

• Improved clipboard processing after pasting.
• Added missing Core typings so the public API is correctly declared in TypeScript.

• Fixed UndoRedo crash when nullified changes.
• Fixed UndoRedo beforeChange order.
• Fixed a bug where the editor does not receive the user inputs.
• Fixed scrollbar width calculation on Safari >=26.
• Fixed rounded corners that may be applied in incorrect use cases.
• Fixed undo/redo stack desync with formulas engine.
• Fixed column width calculation for collapsed columns.
• Fixed an issue with table background overflow.
• Fixed column header misalignment when nestedRow is enabled.
• Fixed an issue with mobile select handles styles.
• Fixed an issue with scrolling issue that occurs when preventOverflow is enabled.
• Fixed date picker positioning near viewport edges.
• Fixed an issue with main theme hover on menu icon background color.

Native support for MultiSelect Cell Type

• The new MultiSelect cell type is designed for scenarios where a single field needs to store multiple values. Now you can select any number of options within the same cell from the dropdown menu that supports search, filtering, and full keyboard navigation.
• Once selected, values are stored directly in the table's source data as an array, keeping the data model clean.
• Each selected item is rendered inside the cell as a removable chip, making it easy to review or adjust selections made.
• The multiSelect cell type offers a flexible set of options so you can adjust both its behavior and presentation:
  • allowEmpty: Defines whether an empty selection is considered valid (enabled by default).
  • placeholder: Shows informative text in the cell when no values are selected.
  • visibleRows: Sets how many options are visible at once in the dropdown list.
  • maxSelections: Restricts the number of items a user can choose.
  • sourceSortFunction: Applies custom logic to control how options are ordered.
  • enterCommits: Specifies whether pressing Enter finalizes the selection and closes the editor.
  • searchInput: Enables or disables the built-in search field within the dropdown.
  • filteringCaseSensitive: Determines whether the search function distinguishes between uppercase and lowercase characters.

Simpler Definition for Custom Cell

• Previously, building a custom editor often meant extending base classes, understanding the full editor lifecycle, and writing repetitive setup code. With the new rendererFactory and editorFactory helpers, you start with a small, working cell definition and extend it only where needed. The factory automatically manages container creation, positioning over the active cell, lifecycle methods (init, beforeOpen, afterOpen, afterClose), and keyboard shortcut handling.

New Themes API: Flexible and Design Systems Friendly Foundation

• This release introduces a new Themes API that makes styling your table more structured, flexible, and aligned with modern design systems. The new theme architecture is built around four core elements: Token Mapping, Icons, Colors and Light/Dark Mode. Instead of relying on scattered CSS overrides, themes now use a consistent token model with scalable color palettes (100-900, similar to Tailwind or Material Design) and size tokens based on an 8px grid system (size-1 = 8px, size-2 = 16px, etc.). This color and sizing model now makes it much easier to connect Handsontable with existing design systems.
• A new Density feature lets you switch between compact, default, and comfortable spacing modes, helping you adapt the table to different UX needs without rewriting styles. Styling can still be customized through CSS variables, but now also via a Token API in JavaScript, enabling runtime adjustments and better flexibility.
• This release also focused on simplifying theme setup. The Main theme is now applied automatically, so there's no need to manually declare a theme or import separate CSS files. In previous versions, you had to include handsontable.js, handsontable.css, and a separate theme stylesheet, but now you only need handsontable.js to get started, reducing setup steps and making integration cleaner.

Theme Builder Updates

• Alongside the Themes API improvements, the Theme Builder has been updated to align with the new token structure. It now features a redesigned interface that is cleaner and more intuitive to navigate. With clear token descriptions, per-token reset options, and real-time previews, it's easier to understand how each change impacts the table design and make full use of Theme Builder capabilities.

Dependency Reduction

• Version 17.0.0 focuses on reducing external dependencies to optimize bundle size, improve loading performance, and give you more control over the runtime environment.
• Numeric Formatting - Numeric cells now use the native Intl.NumberFormat API. The previous pattern and culture options based on numbro.js are deprecated in 17.0.0 and will be removed in the next major release.
• Date and Time Formatting - Date and time cells now use intl-date and intl-time, powered by Intl.DateTimeFormat. String-based Moment.js formats are deprecated and scheduled for removal in the next major version. This change improves performance and aligns formatting with modern, locale-aware APIs.
• Built-in HyperFormula - The built-in HyperFormula engine used by the Formulas plugin is deprecated in 17.0.0 and will be removed from package.json in version 18.0. Handsontable will no longer bundle HyperFormula by default. If you use the Formulas plugin, you should install HyperFormula directly in your project and pass it to the plugin configuration (with licenseKey: 'internal-use-in-handsontable'). This change reduces the default package size and gives you control over the formula engine version used in your application.
• HTML Sanitization - Introduced a new sanitizer option that lets you define your own HTML sanitization logic. DOMPurify is still used by default in 17.0.0 (with a deprecation warning), but it will be removed in the next major release.
• Polyfills - In 17.0, Handsontable no longer includes core-js, which previously provided polyfills for older JavaScript features. Handsontable now targets modern JavaScript environments. If you need to support older browsers, you can add the required polyfills in your own application setup, based on your specific compatibility requirements.