Develop Word document actions
Connect styles, numbering, tables and page numbers to product controls and distinguish sections from pages.
Start with a mounted Word Classic. instance.editor owns document commands; instance.ui owns workspace controls. Call installed typed methods instead of deriving command strings from button labels.
Identify the semantic target
| User goal | Canonical object | Avoid |
|---|---|---|
| Apply Heading 2 | Paragraph style identity and definition | Enlarging text or using a generic heading node |
| Continue numbering | Definitions, instances and paragraph references | Inserting literal 1. text |
| Insert a table | Logical table, rows and grid | Editing painted page fragments |
| Change margins | Document section | Changing paper CSS padding |
| Show page numbers | Header/footer story and PAGE field | Saving the current number as literal text |
A painted page is a layout result. One section may span pages, as may a logical Word table. Commands modify logical content; layout repaginates it.
1. Apply a paragraph style
Call applyWordParagraphStyle({ styleId: 'Heading2' }) only when that ID exists in the document's style registry. Visible labels are not stable IDs. Imported documents may use other identities; report missing styles or establish definitions through the style-management workflow first.
Word headings usually remain paragraphs with wordParagraph.styleId, rather than StarterKit heading nodes. Character styles and paragraph styles also differ; use the appropriate character style or text-format command for selected text.
2. Numbering and tables use the current selection
toggleWordOrderedList() establishes or removes paragraph numbering references. Continuation, restarting and multilevel numbering follow document definitions, rather than replacing visible text.
insertWordTable({ rowCount: 3, columnCount: 2 }) inserts a logical three-row, two-column table. Table operations use current structural selections or explicit public positions. Read selection again for each action; screen pixels are not document positions.
3. Connect actions to buttons
These four functions each perform one task using the quick start instance. They check the current Core and read-only state; the host still checks business permissions before calling them.
import type { ClassicEditorInstance } from "@quirekit/classic-editor";
// Installing the Word preset supplies these command implementations and declarations.
import type {} from "@quirekit/classic-docx";
/** @param instance - Mounted Word product. @returns Whether the existing Heading2 style was applied. */
export function applySectionHeading(instance: ClassicEditorInstance): boolean {
const editor = instance.editor;
return !!editor?.isEditable && editor.commands.applyWordParagraphStyle({ styleId: "Heading2" });
}
/** @param instance - Mounted Word product. @returns Whether a logical two-column table was inserted. */
export function insertComparisonTable(instance: ClassicEditorInstance): boolean {
const editor = instance.editor;
return !!editor?.isEditable && editor.commands.insertWordTable({ rowCount: 3, columnCount: 2 });
}
/** @param instance - Mounted Word product. @returns Whether semantic footer page numbering was installed. */
export function addFooterPageNumber(instance: ClassicEditorInstance): boolean {
const editor = instance.editor;
return !!editor?.isEditable && editor.commands.setWordPageNumber({
location: "footer", alignment: "center", format: "decimal", start: 1, template: { kind: "plain" },
});
}
/**
* Changes one explicit section rather than a painted page fragment.
* @param instance - Mounted Word product.
* @param sectionPosition - Current document position immediately before a wordSection.
* @returns Whether one-inch horizontal margins were accepted.
*/
export function setOneInchMargins(instance: ClassicEditorInstance, sectionPosition: number): boolean {
const editor = instance.editor;
return !!editor?.isEditable && editor.commands.setWordSectionMargins({ sectionPosition, leftTwips: 1440, rightTwips: 1440 });
}
Call applySectionHeading(instance) or insertComparisonTable(instance) from a click handler. A false result must not display success. Query availability through editor.can() with identical parameters; availability grants no permission. A later false result in a series of commands does not roll back earlier writes.
setOneInchMargins() receives the current document position before a section, not a page number or screen coordinate. Do not permanently use the initial document's 0 for every section. This API uses twips: 1440 twips equals one inch. The page-number example explicitly supplies location, format, start and template; layout updates field results.
4. Assemble professional capabilities separately
Tracked-review workflows, comments, content controls and document templates depend on the selected professional packages. A standard Word preset, license key or hidden button does not install them. See commercial use, product plugins and individual plugin documentation.
Not every page-level or document-level operation can be recorded as a tracked change. Expose actual support and diagnostics rather than labeling every command as an accept/reject change.
5. Verify data and files
After styles, tables and page numbers, inspect canonical IDs and relationships in JSON, then export and reimport DOCX. Compare styles, numbering, grids, sections and header/footer stories, and inspect conversion reports. Matching plain text does not establish preserved Word semantics. Font/layout support affects cross-application pixels; successful export alone proves no pixel guarantee.