wordinweb 0.1.9 → 0.1.10

package/README.md

@@ -198,6 +198,24 @@ Every color the chrome paints — the toolbar, comment cards, selection, caret,
 | `--dxw-layout-menu-width` | `304px` | Layout option-menu width |
 | `--dxw-layout-menu-max-height` | `480px` | Layout option-menu scroll limit |
 | `--dxw-layout-preview-bg` | `#fff` | Paper fill in Layout option previews |
+| `--dxw-select-height` | `26px` | Custom select trigger height |
+| `--dxw-select-border` | `transparent` | Custom select trigger border color |
+| `--dxw-select-radius` | `4px` | Custom select trigger corner radius |
+| `--dxw-select-bg` | `transparent` | Custom select trigger fill |
+| `--dxw-select-fg` | toolbar foreground | Custom select trigger text |
+| `--dxw-select-font` | `13px system-ui` | Custom select trigger font |
+| `--dxw-select-padding` | `0 6px` | Custom select trigger padding |
+| `--dxw-select-menu-bg` | popover background | Custom select menu fill |
+| `--dxw-select-menu-border` | toolbar border | Custom select menu border color |
+| `--dxw-select-menu-radius` | `8px` | Custom select menu corner radius |
+| `--dxw-select-menu-shadow` | popover shadow | Custom select menu shadow |
+| `--dxw-select-menu-max-height` | `320px` | Custom select menu scroll limit |
+| `--dxw-color-menu-width` | `236px` | Text and drawing color palette width |
+| `--dxw-dialog-backdrop` | `rgba(32,33,36,.38)` | Editor dialog scrim |
+| `--dxw-dialog-z-index` | `1000` | Editor dialog stacking level |
+| `--dxw-dialog-width` | `420px` | Editor dialog width |
+| `--dxw-dialog-radius` | `10px` | Editor dialog corner radius |
+| `--dxw-dialog-field-bg` | popover background | Editor dialog field fill |
 | `--dxw-canvas-bg` | `#e8eaed` | Scroll area behind the pages |
 | `--dxw-page-bg` | `#ffffff` | Page paper |
 | `--dxw-page-shadow` | `0 1px 3px …, 0 4px 14px …` | Page drop shadow |
@@ -238,6 +256,31 @@ Or in a stylesheet:
 .dxw-dark { --dxw-toolbar-bg: #1f2937; --dxw-toolbar-fg: #e5e7eb; /* … */ }
 ```
 
+### Custom menus and dialogs
+
+All visible toolbar choices use WordInWeb-rendered controls rather than the
+browser's native select, prompt, or color-picker UI. `ToolbarMenuSelect` is
+exported for host-app controls that should match the toolbar:
+
+```tsx
+<ToolbarMenuSelect
+  value={zoom}
+  ariaLabel="Document zoom"
+  options={[
+    { value: "0.75", label: "75%" },
+    { value: "1", label: "100%" },
+    { value: "1.25", label: "125%" },
+  ]}
+  onChange={setZoom}
+/>
+```
+
+For selector-level styling, the stable hooks are
+`.dxw-menu-select-trigger`, `.dxw-menu-select-menu`,
+`.dxw-menu-select-option`, `.dxw-color-menu`, `.dxw-color-swatch`,
+`.dxw-input-dialog`, `.dxw-input-dialog-field`, and the dialog action button
+classes. Prefer the variables above for theme changes.
+
 Layout controls also expose stable `.dxw-layout-ribbon`, `.dxw-layout-menu-trigger`,
 `.dxw-layout-menu`, `.dxw-layout-menu-item`, and `.dxw-layout-preview` classes.
 Their `data-dxw-layout-menu`, `data-dxw-layout-option`, and

package/dist/index.d.ts

@@ -753,6 +753,8 @@ interface NoteRefContent {
     noteType: "footnote" | "endnote";
     id: number;
     self?: boolean;
+    /** The document supplies the visible mark in the following run content. */
+    customMarkFollows?: boolean;
 }
 /** w:ruby — an East-Asian ruby (furigana) cluster: an annotation run (w:rt)
  * riding above a base run (w:rubyBase). Both sides render as their own runs;
@@ -1943,7 +1945,7 @@ interface SelectionFormat {
     verticalAlign?: "superscript" | "subscript";
 }
 
-type ShapePreset = "rectangle" | "roundedRectangle" | "ellipse" | "diamond" | "textBox";
+type ShapePreset = "line" | "rectangle" | "roundedRectangle" | "ellipse" | "diamond" | "textBox";
 type WordArtPreset = "plain" | "archUp" | "archDown" | "wave" | "chevron";
 type DrawingTool = {
     kind?: "pen";
@@ -2027,6 +2029,30 @@ interface MissingFont {
     sample: string;
 }
 
+interface ToolbarMenuSelectOption {
+    value: string;
+    label: React.ReactNode;
+    group?: string;
+    disabled?: boolean;
+    fontFamily?: string;
+}
+interface ToolbarMenuSelectProps {
+    value: string;
+    options: ToolbarMenuSelectOption[];
+    onChange: (value: string) => void;
+    placeholder?: React.ReactNode;
+    title?: string;
+    ariaLabel?: string;
+    triggerAriaLabel?: string;
+    width?: number | string;
+    menuWidth?: number;
+    className?: string;
+    style?: React.CSSProperties;
+}
+/** CSS-overridable replacement for visible native selects. An inert,
+ * transparent select is kept as an event bridge for existing integrations;
+ * every user-facing part is a button/listbox rendered by us. */
+declare function ToolbarMenuSelect({ value, options, onChange, placeholder, title, ariaLabel, triggerAriaLabel, width, menuWidth, className, style, }: ToolbarMenuSelectProps): react.JSX.Element;
 /** Toolbar control groups a host can disable via the `features` prop. */
 type ToolbarFeature = "history" | "styles" | "font" | "size" | "format" | "color" | "highlight" | "alignment" | "indent" | "spacing" | "link" | "lists" | "table" | "image" | "icon" | "screenshot" | "model3D" | "media" | "object" | "chart" | "smartArt" | "comment" | "footnote" | "bookmark" | "crossReference" | "dateTime" | "field" | "equation" | "symbol" | "shape" | "textBox" | "wordArt" | "drawing" | "arrange" | "dropCap" | "headerFooter" | "coverPage" | "pageNumber" | "break" | "layout" | "download";
 type ToolbarMode = "simple" | "advanced";
@@ -2250,4 +2276,4 @@ interface DocxViewProps {
  */
 declare function DocxView({ source, zoom, fitWidth, narrowWidth, editable, className, style, onLoad, onReady, onError, commentAuthor, showComments, revisions, onMissingFonts, }: DocxViewProps): react.JSX.Element;
 
-export { type CoverPageContent, DocxDocument, DocxToolbar, type DocxToolbarProps, DocxView, type DocxViewApi, type DocxViewProps, type DrawingTool, type LineNumberingPatch, type PageLayoutPatch, type ParagraphAlignment, type RunFormatPatch, type ScreenshotInsertResult, type SelectionFormat, type ShapePreset, type ToolbarFeature, type ToolbarMode, layoutDocument, printPages, renderToDom };
+export { type CoverPageContent, DocxDocument, DocxToolbar, type DocxToolbarProps, DocxView, type DocxViewApi, type DocxViewProps, type DrawingTool, type LineNumberingPatch, type PageLayoutPatch, type ParagraphAlignment, type RunFormatPatch, type ScreenshotInsertResult, type SelectionFormat, type ShapePreset, type ToolbarFeature, ToolbarMenuSelect, type ToolbarMenuSelectOption, type ToolbarMenuSelectProps, type ToolbarMode, layoutDocument, printPages, renderToDom };