Create and update Handsontable guide pages with consistent page metadata, headings, framework-specific examples, and sidebar entries. Follow the documentation site's writing conventions and generate JavaScript examples from TypeScript sources where required.
中文简介正在准备中。当前显示英语简介。
Use when creating or editing documentation pages in docs/content/guides/ - covers YAML frontmatter, page structure, framework-specific example embedding, writing style, and sidebar registration
安装前可以查看交给 AI 代理的指令内容。
---
title: Feature name
metaTitle: Feature name | Handsontable DataGrid for JavaScript
description: Short SEO description under 160 characters.
permalink: /feature-name
canonicalUrl: /feature-name
tags:
- keyword1
react:
metaTitle: Feature name | Handsontable DataGrid for React
searchCategory: Guides
category: Cell features # Must match a sidebar category exactly
menuTag: new | updated # Optional; sidebar badge
addedIn: "17.0.0" # Optional; version that introduced the feature
---
menuTag: new on a new page, menuTag: updated on a substantive content change. Omit it for typos, snippet/link corrections, and changelog and migration-guide pages; leave an existing tag in place.addedIn: set when the page documents a feature introduced in 14.0.0 or later. Use the full version as a quoted string ("18.1.0", not 18.1), from the changelog's "Added" entry or the option's @since tag. Leave it out for recipes, a new page about an old feature, and a feature that is one section of an older page. npm run build fails on a malformed or never-released version.title.[[toc]].## and below only, basic to advanced: Enable the feature, Basic usage, Configuration options, Advanced usage, Keyboard shortcuts, Known limitations, API reference links.::: only-for javascript
JavaScript-only content here.
:::
Put the ::: markers on their own lines, with blank lines around the content. Frameworks: javascript, react, angular, vue.
--js 1 --ts 2 sets tab order.
::: only-for javascript
::: example #example1 --js 1 --ts 2
@[code](@/content/guides/category/feature/javascript/example1.js)
@[code](@/content/guides/category/feature/javascript/example1.ts)
:::
:::
::: only-for react
::: example #example1 :react --tsx 1 --jsx 2
@[code](@/content/guides/category/feature/react/example1.tsx)
@[code](@/content/guides/category/feature/react/example1.jsx)
:::
:::
::: only-for vue
::: example #example1 :vue3
@[code](@/content/guides/category/feature/vue/example1.vue)
:::
:::
<script setup lang="ts">) with the :vue3 preset (:vue3-languages or :vue3-vuex for extra dependencies). Skip --html / --js tabs. Full pattern: skill creating-docs-examples.:angular with --ts 1 --html 2.Full voice and words-to-avoid list: docs/AGENTS.md §2.2 (overrides .ai/DOC-STANDARDS.md for the docs site). Page rules:
-) or double hyphens (--). The docs site uses these where JSDoc and changelog use en dashes.description: say Handsontable DataGrid. Later mentions and generic references keep Handsontable, as do code, package names, API names, migration guides, and version references. The metaTitle: shape is <Page> | Handsontable DataGrid for <Framework>, where <Page> is the page title or a short form of it, with the same casing as title: (keep title: in sentence case), with no dashes. Changelog and migration pages (changelog*, migrating-from-* under guides/upgrade-and-migration/) keep their old metaTitle: shape on purpose; do not rewrite them. Never DataGrid alone as a first mention or in title:, metaTitle:, or a heading (a toggle or tab beside HyperFormula and table labels are the exceptions). Say "data grid" (lowercase) for the category, and drop the noun where the product is already named. Details: .ai/DOC-STANDARDS.md, "Product naming".comments).[text](@/path/to/file.md#anchor).Pages mentioning "Excel" end with the Microsoft/Excel trademark disclaimer. Pages that also mention "Google Sheets" use the expanded disclaimer for both.
Add a new page to the right category array in docs/content/guides/sidebar.js:
{ path: 'guides/category/feature-name/feature-name' }
Add onlyFor: ['react'] or onlyFor: ['angular'] for a framework-specific page.
Edit the TypeScript source first (.ts or .tsx), then generate JavaScript from docs/ with a path relative to docs/:
cd docs && npm run docs:code-examples:generate-js -- content/recipes/foo/javascript/example1.ts
Vue examples are written directly in the .vue file; no JS variant exists.
docs/README-EDITING.md: all frontmatter tags, container syntax, content formatting.
还没有评价。欢迎分享你的使用感受。
无需登录即可发表。欢迎分享使用感受、提问，或说明在哪些环境下无法运行。
还没有评论。来写第一条吧。
Develop and modify the Handsontable Angular wrapper with guidance on component lifecycle, settings updates, and NgZone, which controls change detection. It also covers standalone examples, global configuration, and the build and test workflow.
中文简介正在准备中。当前显示英语简介。
Open local or public web pages in BrowserStack Live for checks on real mobile devices or desktop browsers. The skill prepares temporary access to a local server, launches the requested session, and shares its dashboard link.
中文简介正在准备中。当前显示英语简介。
Prepare user-facing changelog entries for source code changes. The skill determines whether an entry is needed, classifies the change, writes a clear title, and uses the project CLI to create a JSON file tied to the pull request.
中文简介正在准备中。当前显示英语简介。
Explore relationships between functions and files using a prebuilt code graph, a map of code dependencies. Trace bugs, inspect callers and execution paths, and assess the impact of refactoring or proposed changes.
中文简介正在准备中。当前显示英语简介。
Work with Handsontable row and column positions by distinguishing source data, displayed order, and rendered cells. It guides index conversion and helps investigate misplaced data when sorting, filtering, hiding, or moving rows and columns.
中文简介正在准备中。当前显示英语简介。
Create Handsontable documentation examples for JavaScript, TypeScript, React, Angular, and Vue. The skill explains source files, generated JavaScript, required imports and license settings, embedding examples in guides, and checking that each framework version displays correctly.
中文简介正在准备中。当前显示英语简介。