ooxml-ui 1.25.0 → 1.26.0

package/dist/docx/localization-strings.d.ts

@@ -2,6 +2,75 @@ export type { LocaleStrings, LocalizationKey } from './locales/en.js';
 /** Every display locale, keyed by its canonical code. `en` defines the key set. */
 export declare const strings: {
     readonly en: {
+        readonly 'tab.smartart-design': 'SmartArt Design';
+        readonly SmartArt: 'SmartArt';
+        readonly 'Insert SmartArt': 'Insert SmartArt';
+        readonly 'Create Graphic': 'Create Graphic';
+        readonly Layouts: 'Layouts';
+        readonly 'Add Shape': 'Add Shape';
+        readonly 'Add Shape After': 'Add Shape After';
+        readonly 'Add Shape Before': 'Add Shape Before';
+        readonly 'Add Shape Above': 'Add Shape Above';
+        readonly 'Add Shape Below': 'Add Shape Below';
+        readonly Promote: 'Promote';
+        readonly Demote: 'Demote';
+        readonly 'Move Up': 'Move Up';
+        readonly 'Move Down': 'Move Down';
+        readonly 'Text Pane': 'Text Pane';
+        readonly 'Change Layout': 'Change Layout';
+        readonly 'Choose a SmartArt Graphic': 'Choose a SmartArt Graphic';
+        readonly 'SmartArt categories': 'SmartArt categories';
+        readonly 'SmartArt layouts': 'SmartArt layouts';
+        readonly 'Type your text here': 'Type your text here';
+        readonly '[Text]': '[Text]';
+        readonly 'SmartArt text': 'SmartArt text';
+        readonly 'This diagram has no shapes with text.': 'This diagram has no shapes with text.';
+        readonly 'The SmartArt layouts could not be loaded.': 'The SmartArt layouts could not be loaded.';
+        readonly 'smartart.category.list': 'List';
+        readonly 'smartart.category.process': 'Process';
+        readonly 'smartart.category.cycle': 'Cycle';
+        readonly 'smartart.category.hierarchy': 'Hierarchy';
+        readonly 'smartart.category.relationship': 'Relationship';
+        readonly 'smartart.description.list': 'Show non-sequential or grouped blocks of information.';
+        readonly 'smartart.description.process': 'Show a progression, a timeline or the sequential steps of a task.';
+        readonly 'smartart.description.cycle': 'Show a continual process or parts around a centre.';
+        readonly 'smartart.description.hierarchy': 'Show hierarchical relationships, such as an organisation chart.';
+        readonly 'smartart.description.relationship': 'Show connections, overlaps, proportions or containment between ideas.';
+        readonly 'smartart.layout.basicBlockList': 'Basic Block List';
+        readonly 'smartart.layout.stackedList': 'Stacked List';
+        readonly 'smartart.layout.horizontalBulletList': 'Horizontal Bullet List';
+        readonly 'smartart.layout.tableList': 'Table List';
+        readonly 'smartart.layout.basicChevronProcess': 'Basic Chevron Process';
+        readonly 'smartart.layout.segmentedProcess': 'Segmented Process';
+        readonly 'smartart.layout.continuousBlockProcess': 'Continuous Block Process';
+        readonly 'smartart.layout.upwardArrow': 'Upward Arrow';
+        readonly 'smartart.layout.basicCycle': 'Basic Cycle';
+        readonly 'smartart.layout.basicRadial': 'Basic Radial';
+        readonly 'smartart.layout.basicPie': 'Basic Pie';
+        readonly 'smartart.layout.convergingRadial': 'Converging Radial';
+        readonly 'smartart.layout.hierarchy': 'Hierarchy';
+        readonly 'smartart.layout.basicVenn': 'Basic Venn';
+        readonly 'smartart.layout.linearVenn': 'Linear Venn';
+        readonly 'smartart.layout.alternatingHexagons': 'Alternating Hexagons';
+        readonly 'smartart.layout.trapezoidList': 'Trapezoid List';
+        readonly 'smartart.layout.pictureAccentList': 'Picture Accent List';
+        readonly 'smartart.layout.verticalBlockList': 'Vertical Block List';
+        readonly 'smartart.layout.groupedList': 'Grouped List';
+        readonly 'smartart.layout.horizontalPictureList': 'Horizontal Picture List';
+        readonly 'smartart.layout.verticalChevronList': 'Vertical Chevron List';
+        readonly 'smartart.layout.pyramidList': 'Pyramid List';
+        readonly 'smartart.layout.stepDownProcess': 'Step Down Process';
+        readonly 'smartart.layout.alternatingFlow': 'Alternating Flow';
+        readonly 'smartart.layout.descendingProcess': 'Descending Process';
+        readonly 'smartart.layout.accentProcess': 'Accent Process';
+        readonly 'smartart.layout.basicTimeline': 'Basic Timeline';
+        readonly 'smartart.layout.bendingProcess': 'Basic Bending Process';
+        readonly 'smartart.layout.basicTarget': 'Basic Target';
+        readonly 'smartart.layout.interlockingGears': 'Gear';
+        readonly 'smartart.layout.basicMatrix': 'Basic Matrix';
+        readonly 'smartart.layout.basicPyramid': 'Basic Pyramid';
+        readonly 'smartart.layout.invertedPyramid': 'Inverted Pyramid';
+        readonly 'smartart.layout.basicFunnel': 'Funnel';
         readonly 'Change how document content is displayed on the screen.': string;
         readonly 'Page display options': string;
         readonly 'Formatting marks': string;
@@ -161,6 +230,50 @@ export declare const strings: {
         readonly '6 pt': '6 pt';
         readonly 'Select a shape first.': 'Select a shape first.';
         readonly 'This shape has formatted text that the editor cannot change.': 'This shape has formatted text that the editor cannot change.';
+        readonly 'Drawn with an approximate layout computed here; not Word-identical.': 'Drawn with an approximate layout computed here; not Word-identical.';
+        readonly 'tab.chart-design': 'Chart Design';
+        readonly 'Insert chart': 'Insert chart';
+        readonly Chart: 'Chart';
+        readonly 'Insert Chart': 'Insert Chart';
+        readonly 'Change Chart Type': 'Change Chart Type';
+        readonly 'Edit Data': 'Edit Data';
+        readonly Legend: 'Legend';
+        readonly 'Chart Layouts': 'Chart Layouts';
+        readonly Data: 'Data';
+        readonly Type: 'Type';
+        readonly 'Chart type': 'Chart type';
+        readonly Grouping: 'Grouping';
+        readonly 'Chart title': 'Chart title';
+        readonly 'Chart data': 'Chart data';
+        readonly 'chart.dataHint': 'One row per line, values separated by tabs or commas. The first row names the series.';
+        readonly Clustered: 'Clustered';
+        readonly Stacked: 'Stacked';
+        readonly '100% Stacked': '100% Stacked';
+        readonly 'chart.type.column': 'Column';
+        readonly 'chart.type.bar': 'Bar';
+        readonly 'chart.type.line': 'Line';
+        readonly 'chart.type.area': 'Area';
+        readonly 'chart.type.pie': 'Pie';
+        readonly 'chart.type.doughnut': 'Doughnut';
+        readonly 'chart.type.scatter': 'Scatter';
+        readonly 'chart.type.radar': 'Radar';
+        readonly 'chart.sheet.heading': 'Data';
+        readonly 'chart.sheet.addCategory': 'Add category';
+        readonly 'chart.sheet.addSeries': 'Add series';
+        readonly 'chart.sheet.addCategoryShort': 'Cat';
+        readonly 'chart.sheet.addSeriesShort': 'Series';
+        readonly 'chart.sheet.removeCategory': 'Remove category';
+        readonly 'chart.sheet.removeSeries': 'Remove series';
+        readonly 'chart.sheet.categories': 'Categories';
+        readonly 'chart.sheet.seriesName': 'Series {number}';
+        readonly 'chart.sheet.categoryLabel': 'Categories {number}';
+        readonly 'chart.sheet.valueCell': '{name} value {number}';
+        readonly 'chart.sheet.summary': '{series} series · {categories} categories';
+        readonly 'chart.sheet.invalidNumber': 'Enter a number';
+        readonly 'chart.readOnly': 'This kind of chart cannot be edited; it is kept as it is.';
+        readonly 'Current Selection': 'Current Selection';
+        readonly 'Format Selection': 'Format Selection';
+        readonly 'Format Chart Area...': 'Format Chart Area...';
         readonly File: 'File';
         readonly Alignment: 'Alignment';
         readonly 'Quick access': 'Quick access';

package/dist/docx/resize-handle.d.ts

@@ -0,0 +1,23 @@
+export interface ResizeHandleOptions {
+    /** Whether the document takes edits now. */
+    editable(): boolean;
+    /** The drawing's size in CSS pixels when the drag starts. */
+    size(): {
+        width: number;
+        height: number;
+    };
+    /** The smallest width and height, in CSS pixels. */
+    min: number;
+    /** The widest the drawing may become. */
+    maxWidth?(): number;
+    /** Whether the aspect ratio is kept for this move (pictures always; charts with Shift). */
+    keepRatio(event: PointerEvent): boolean;
+    /** The element whose drawn and layout widths give the zoom factor. */
+    zoomOf(): HTMLElement;
+    /** Shows the size being dragged to. */
+    preview(width: number, height: number): void;
+    /** Applies the final size; only called when it changed. */
+    commit(width: number, height: number): void;
+}
+/** A handle element (`className`) that resizes a drawing by dragging. */
+export declare function createResizeHandle(className: string, options: ResizeHandleOptions): HTMLElement;

package/dist/docx/ribbon-action.d.ts

@@ -169,6 +169,11 @@ export type RibbonAction = {
     type: 'insertPicture';
 } | {
     type: 'shapePicker';
+} | {
+    type: 'insertSmartArt';
+} | {
+    type: 'smartArt';
+    key: 'addAfter' | 'addBefore' | 'addAbove' | 'addBelow' | 'promote' | 'demote' | 'moveUp' | 'moveDown' | 'textPane' | 'changeLayout';
 } | {
     type: 'drawShape';
     preset: string;
@@ -176,6 +181,16 @@ export type RibbonAction = {
     type: 'shape';
     key: 'fill' | 'outline' | 'weight' | 'width' | 'height' | 'wrap';
     value: string | number;
+} | {
+    type: 'chart';
+    key: 'legend';
+    value: string;
+}
+/** Format Selection: the docked chart Format pane, on `target` (`chartArea` by default). */
+ | {
+    type: 'chart';
+    key: 'format';
+    target?: string;
 } | {
     type: 'insertEquation';
     id: 'area' | 'quadratic' | 'pythagorean' | 'binomial';

package/dist/docx/ribbon-icons.d.ts

@@ -1,6 +1,14 @@
 /** Line icons for ribbon buttons on a 24x24 grid, drawn with `currentColor` so themes apply. */
 declare const paths: {
     readonly envelope: 'M3 5h18v14H3z M3 5l9 7 9-7';
+    readonly smartArt: 'M9 3h6v4H9z M3 15h6v4H3z M15 15h6v4h-6z M12 7v4 M6 15v-4h12v4';
+    readonly addShape: 'M4 6h10v8H4z M17 14v6 M14 17h6';
+    readonly promote: 'M10 6H4 M20 12H8 M20 18H8 M4 12l3-3 M4 12l3 3';
+    readonly demote: 'M4 6h16 M10 12h10 M10 18h10 M4 9l3 3-3 3';
+    readonly moveUp: 'M12 20V5 M6 11l6-6 6 6';
+    readonly moveDown: 'M12 4v15 M6 13l6 6 6-6';
+    readonly textPane: 'M3 4h18v16H3z M9 4v16 M12 9h6 M12 13h6 M12 17h4 M5 9h2 M5 13h2';
+    readonly changeLayout: 'M3 4h7v7H3z M14 4h7v7h-7z M3 15h7v5H3z M14 15h7v5h-7z';
     readonly field: 'M4 3h16v18H4z M10 8l-3 4 3 4 M14 8l3 4-3 4';
     readonly help: 'M9 8a3 3 0 1 1 4 2.8c-1 .5-1 1.2-1 2.2 M12 17h.01 M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20';
     readonly close: 'M6 6l12 12 M18 6L6 18';
@@ -123,6 +131,11 @@ declare const paths: {
     readonly contentControl: 'M4 7h16v12H4z M4 7V4h7v3 M8 12h8 M8 15h5';
     readonly pageColor: 'M6 3h9l3 3v15H6z M9 11h6v6H9z';
     readonly hyphenation: 'M4 6h16 M4 11h9 M16 11h4 M4 16h16 M13 11h3';
+    readonly chart: 'M4 20h16 M6 20v-6h3v6 M11 20V7h3v13 M16 20v-9h3v9';
+    readonly chartType: 'M4 20h8 M5 20v-5h2v5 M9 20v-9h2v9 M14 9l2-3 2 2 2-4 M14 14h6v6h-6z';
+    readonly editData: 'M4 5h16v14H4z M4 10h16 M4 15h16 M10 5v14';
+    readonly formatSelection: 'M4 4h11v11H4z M7 8h5 M7 11h3 M15 13l5 5-2 2-5-5z';
+    readonly legend: 'M4 6h3v3H4z M10 7.5h10 M4 11h3v3H4z M10 12.5h10 M4 16h3v3H4z M10 17.5h10';
     readonly caret: 'M7 10l5 5 5-5';
 };
 export type RibbonIcon = keyof typeof paths;

package/dist/docx/smartart-commands.d.ts

@@ -0,0 +1,26 @@
+import { type EditorState } from 'prosemirror-state';
+import type { EditorView } from 'prosemirror-view';
+import { type DocxDiagram, type DocxDiagramEdit, type InlineImage } from 'ooxml-core/docx';
+import type { OfficeSmartArtTextNode } from '../smartart.js';
+export interface SelectedDiagram {
+    /** Position of the image node that holds the diagram. */
+    pos: number;
+    diagram: DocxDiagram;
+    widthPx: number;
+    heightPx: number;
+}
+/** The SmartArt the selection is on (an image atom carrying a `diagram`), if any. */
+export declare function selectedDiagram(state: EditorState): SelectedDiagram | undefined;
+/** Replaces the diagram at `pos` in one undoable step and keeps it selected. */
+export declare function replaceDiagram(view: EditorView, pos: number, diagram: DocxDiagram): boolean;
+/**
+ * Applies one command to the selected diagram. Returns the node the command created or acted on
+ * (for the text pane's focus), or undefined when nothing changed.
+ */
+export declare function runDiagramEdit(view: EditorView, edit: DocxDiagramEdit): string | undefined;
+/** Typing in the text pane: consecutive keystrokes join one undo step, as in Word. */
+export declare function setDiagramNodeText(view: EditorView, nodeId: string, text: string): boolean;
+/** Inserts a new SmartArt at the selection, as its own paragraph content, and selects it. */
+export declare function insertDiagram(view: EditorView, image: InlineImage): boolean;
+/** The diagram's nodes as text pane lines, with their depth below the top level. */
+export declare function diagramOutline(diagram: DocxDiagram): OfficeSmartArtTextNode[];

package/dist/docx/smartart-controller.d.ts

@@ -0,0 +1,35 @@
+import type { EditorView } from 'prosemirror-view';
+import { type PendingMediaPart } from 'ooxml-core/docx';
+import type { RibbonAction } from './ribbon-action.js';
+import { type EditorLocale } from './localization.js';
+import { type SmartArtDialog } from './smartart-dialog.js';
+export interface SmartArtHost {
+    view(): EditorView | undefined;
+    /** The editable content width in CSS pixels; a new diagram is fitted to it. */
+    contentWidth(): number;
+    stage(partName: string, part: PendingMediaPart): void;
+    reportError(error: Error): void;
+    refresh(): void;
+}
+export declare class SmartArtController {
+    private readonly host;
+    readonly dialog: SmartArtDialog;
+    private readonly text;
+    private locale;
+    /** Whether the last pane edit came from a ribbon command (focus returns to the document). */
+    private refocus;
+    constructor(host: SmartArtHost);
+    get pane(): HTMLElement;
+    get textPaneOpen(): boolean;
+    /** Handles the SmartArt actions; returns false for everything else. */
+    handle(action: RibbonAction): boolean;
+    private run;
+    private definitions;
+    private insert;
+    private relayout;
+    /** Shows the text pane for the selected diagram while it is open. */
+    sync(): void;
+    setLocale(locale: EditorLocale): void;
+    /** A new document: no current node, and the text pane closed. */
+    reset(): void;
+}

package/dist/docx/smartart-design-ribbon.d.ts

@@ -0,0 +1,7 @@
+import type { EditorState } from 'prosemirror-state';
+export declare function buildSmartArtDesignPanel(panel: HTMLElement): void;
+/**
+ * Shows the tab while a SmartArt is selected (switching to it on entry), enables its commands when
+ * the document can be edited and reflects the text pane's state on its toggle.
+ */
+export declare function syncSmartArtDesign(toolbar: HTMLElement, state: EditorState, editable: boolean, textPaneOpen: boolean): void;

package/dist/docx/smartart-dialog.d.ts

@@ -0,0 +1,12 @@
+import { type DiagramInsertPreset } from 'ooxml-core/diagram';
+import { type EditorLocale } from './localization.js';
+export interface SmartArtDialog {
+    readonly element: HTMLElement;
+    readonly isOpen: boolean;
+    /** Opens the dialog; `current` preselects a layout (Change Layout). */
+    open(choose: (preset: DiagramInsertPreset) => void, current?: string): void;
+    close(): void;
+    setLocale(locale: EditorLocale): void;
+}
+/** The dialog; `restoreFocus` runs when it closes. */
+export declare function createSmartArtDialog(restoreFocus: () => void): SmartArtDialog;

package/dist/docx/smartart-node-view.d.ts

@@ -1,6 +1,7 @@
 import type { DocxDiagram, ThemeCatalog } from 'ooxml-core/docx';
 import type { Node as ProseMirrorNode } from 'prosemirror-model';
 import type { NodeView } from 'prosemirror-view';
+import { type EditorLocale } from './localization.js';
 /** What the shared renderer reports (`office-smartart-render`), as far as this view reads it. */
 interface RenderReport {
     approximatedGeometries?: string[];
@@ -16,11 +17,13 @@ export declare function diagramLabel(node: ProseMirrorNode, diagram: DocxDiagram
 export declare function diagramNotes(diagram: DocxDiagram, report: RenderReport | undefined, themed?: {
     unappliedTransforms: string[];
     alphaDropped: boolean;
-}): string[];
+}, approximate?: string): string[];
 /**
  * Node view for an image node that carries a SmartArt `diagram`: mounts `<office-ui-smartart>`
  * with the cached drawing (theme colours resolved), scaled from the diagram frame to the run's
- * size. Read-only: the diagram parts are never edited, and the node stays an atom.
+ * size. A diagram without a cached drawing (inserted or edited here, or saved without one) is
+ * drawn with the core's approximate layout instead. The node stays an atom: SmartArt Design and
+ * the text pane edit it, and a changed node is rebuilt.
  */
-export declare function smartArtNodeView(node: ProseMirrorNode, diagram: DocxDiagram, theme: ThemeCatalog | undefined): NodeView;
+export declare function smartArtNodeView(node: ProseMirrorNode, diagram: DocxDiagram, theme: ThemeCatalog | undefined, locale?: EditorLocale): NodeView;
 export {};