ooxml-ui 0.13.0 → 0.15.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +32 -32
- package/dist/button.d.ts +7 -4
- package/dist/{chunk-MDW2Y5UN.js → chunk-4MT4OIAJ.js} +31 -0
- package/dist/{chunk-SDFQ7U2I.js → chunk-A46H2JBV.js} +2 -2
- package/dist/{chunk-LI6OV55P.js → chunk-F4TM7U4P.js} +1 -1
- package/dist/{chunk-D6EREKYF.js → chunk-NDEB6EBU.js} +1 -1
- package/dist/{chunk-4NUKVNSJ.js → chunk-VUXNXH4Q.js} +1 -1
- package/dist/{chunk-NOQAM6ZS.js → chunk-VYF7LGXZ.js} +2 -2
- package/dist/{chunk-JROJGF7A.js → chunk-ZBFAPBNU.js} +676 -194
- package/dist/controls.js +5 -5
- package/dist/icons.js +3 -3
- package/dist/index.js +11 -11
- package/dist/presence.js +3 -3
- package/dist/ribbon.d.ts +10 -3
- package/dist/select-menu.d.ts +42 -0
- package/dist/select-styles.d.ts +6 -0
- package/dist/select.d.ts +11 -5
- package/dist/smartart.js +3 -3
- package/dist/theme.js +2 -2
- package/dist/tokens.d.ts +31 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -58,38 +58,38 @@ with an incompatible build of this package.
|
|
|
58
58
|
|
|
59
59
|
## Features: elements
|
|
60
60
|
|
|
61
|
-
| Tag | Attributes / properties | Events (all bubble, composed)
|
|
62
|
-
| ----------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
63
|
-
| `office-ui-button` | `label`, `icon`, `command`, `disabled`, `pressed`, `expanded`, `icon-only`, `variant="stacked"`, `keyshortcuts` | `office-command` `{ command }`
|
|
64
|
-
| `office-ui-checkbox`, `office-ui-switch` | `checked`, `disabled`, `value`, `aria-label`; form-associated | `input`, `change`
|
|
65
|
-
| `office-ui-select` | `options` `[{ value, label, disabled? }]
|
|
66
|
-
| `office-ui-ribbon-group` | `label`, `launcher` (dialog launcher command), `launcher-disabled`; default slot | launcher: `office-command` `{ command }`
|
|
67
|
-
| `office-ui-ribbon-stack` | `orientation="horizontal"`; default slot (three-row column of small commands by default) | none
|
|
68
|
-
| `office-ui-menu-button` / `-menu-item` | button: `label`, `icon`, `command` (split button), `variant`, `disabled`, `keyshortcuts`; item: `command`, `label`, `icon`, `disabled`, `checked` | item choice: `office-command` `{ command }`
|
|
69
|
-
| `office-ui-toolbar` | `aria-label`, `aria-orientation`; arrow-key focus movement | none
|
|
70
|
-
| `office-ui-dialog` | `open`, `heading`, `dismissible="false"`, `show()`, `close()`; slots default, `footer` | `office-dialog-close` `{ reason }` (cancelable)
|
|
71
|
-
| `office-ui-status-bar` / `-status-item` | `label`, `value`, `interactive`, `id` | `office-status-activate` `{ id }`
|
|
72
|
-
| `office-ui-zoom-slider` | `value` (percent), `min`, `max`, `step`, `disabled`, `fit` (fit button name), `label` | `input`, `change`; fit: `office-command` `{ command: 'zoom-fit' }`
|
|
73
|
-
| `office-ui-tab-strip` | `tabs` `[{ id, label, title? }]`, `selected`, `label`, `previous-label`, `next-label`, `add-label`, `add-disabled`, `add-title`, `disabled` | `office-tab-select` `{ id }` (cancelable); add: `office-command` `{ command: 'tab-add' }`
|
|
74
|
-
| `office-ui-context-menu` / `office-ui-menu-separator` | `label`; `openAt(x, y)`, `close()`, `open`; `office-ui-menu-item` and separator children | item choice: `office-command` `{ command }`
|
|
75
|
-
| `office-ui-command-search` | `commands` `[{ id, label, keywords?, description?, disabled?, title? }]`, `placeholder`, `label`, `limit` (Office's "Tell me what you want to do") | choice: `office-command` `{ command }`
|
|
76
|
-
| `office-ui-options-dialog` | `categories` `[{ id, label, description?, disabled?, sections: [{ id, title, controls }] }]` (controls: `toggle`, `select`, `number`, `text`, each optionally `disabled` with a reason), `values`, `category`, `open`, `heading`, `show()`, `close()` | OK: `office-options-change` `{ values, changed }`
|
|
77
|
-
| `office-ui-account` | `profile` `{ displayName, avatarColor, initial? }`; slots `sign-in` and default (product sections) | `office-profile-change` `{ profile }`
|
|
78
|
-
| `office-ui-ribbon` | Tab row over tab panels. Panels are children with `data-ribbon-tab`, `data-label`, optional `data-tab-keytip`; slots `quick-access`, `search`, `end`; `selected`, `label`, `file-label`, `no-file`, `file-expanded`, `file-keytip`; `focusFile()`, `focusTab()` | `office-ribbon-select` `{ tab }` (cancelable), `office-ribbon-file`
|
|
79
|
-
| `office-ui-backstage` | `items` `[{ id, label, group?: 'footer', disabled?, title? }]`, `open`, `selected`, `label`, `back-label`, `show(page?)`, `close()`; pages are children with `data-backstage-page` | `office-backstage-select` `{ id }` (cancelable), `office-backstage-close` `{ reason }` (cancelable)
|
|
80
|
-
| `office-ui-find-bar` | `open`, `label`, `input-label`, `placeholder`, `maxlength`, `disabled`, `navigation-disabled`, `previous-label`, `next-label`, `close-label`; `value`, `status`, `statusTitle`, `show()`, `close()` | `office-find-input` `{ query }`, `office-find-step` `{ direction }`, `office-find-close`
|
|
81
|
-
| `office-ui-ruler` | `orientation="vertical"`, `origin` (px offset of zero), `scale` (px per unit, default 96), `direction="reverse"`; decorative | none
|
|
82
|
-
| `office-ui-print-preview` | `pages` (rendered nodes; an inert clone of the current one is shown), `index`, `label`, `empty-label` | `office-print-preview-page` `{ index }`
|
|
83
|
-
| `office-ui-radio` | `checked`, `disabled`, `value`, `name`; radios of one tag sharing a `name` form a roving-focus group; form-associated | `input`, `change`
|
|
84
|
-
| `office-ui-search` | `value`, `placeholder`, `disabled`, `aria-label`, `variant="titlebar"`; `focus()`, `select()` | `input`, `change`
|
|
85
|
-
| `office-ui-ribbon-toggle` | `label`, `checked`, `disabled`, `title`, `command` (a labelled ribbon checkbox row) | `office-toggle` `{ command, checked }`
|
|
86
|
-
| `office-ui-dialog-footer` | `state` `{ actions: [{ id, label, variant?, icon?, disabled?, busy?, title?, align?, testId? }] }`, `focusAction(id)` | `office-dialog-footer-request` `{ id }`
|
|
87
|
-
| `office-ui-toasts` | `state` `{ toasts: [{ id, code?, severity, message }], overflowCount?, labels? }`; hidden when empty, host positions it | `office-toasts-request` `{ id: 'dismiss', toastId }` or `{ id: 'dismissAll' }`
|
|
88
|
-
| `office-ui-read-only-banner` | `state` `{ kind, message, passwordPromptOpen?, passwordError?, checkingPassword?, labels? }` | `office-read-only-request` (Edit anyway, Dismiss, password submit or cancel)
|
|
89
|
-
| `office-ui-paste-options` | `state` `{ left, top, options: [{ id, label }], label? }`; fixed 4px past the pasted object | `office-paste-options-request` `{ format }`, `office-paste-options-dismiss`
|
|
90
|
-
| `office-ui-presence` | `participants`, `max`, `label` | `office-presence-select` `{ id }`
|
|
91
|
-
| `office-ui-smartart` | `drawing` (core `DiagramDrawing`), `schemeColors`, `label` | `office-smartart-render` (render report)
|
|
92
|
-
| `office-ui-icon` | `name`, `label` | none
|
|
61
|
+
| Tag | Attributes / properties | Events (all bubble, composed) |
|
|
62
|
+
| ----------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------- |
|
|
63
|
+
| `office-ui-button` | `label`, `icon`, `command`, `disabled`, `pressed`, `expanded`, `icon-only`, `variant="stacked"`, `keyshortcuts` | `office-command` `{ command }` |
|
|
64
|
+
| `office-ui-checkbox`, `office-ui-switch` | `checked`, `disabled`, `value`, `aria-label`; form-associated | `input`, `change` |
|
|
65
|
+
| `office-ui-select` | `<option>` / `<optgroup>` children (`data-display-label`, `data-description`, font previews) or the `options` property `[{ value, label, disabled? }]`; `value`, `selectedIndex`, `disabled`, `aria-label`, `variant="ribbon-font" | "ribbon-icon"`, `data-font-picker`; `icon`and`custom` slots; arrows, Home, End, PageUp/PageDown, typeahead | `input`, `change` |
|
|
66
|
+
| `office-ui-ribbon-group` | `label`, `launcher` (dialog launcher command), `launcher-disabled`; default slot | launcher: `office-command` `{ command }` |
|
|
67
|
+
| `office-ui-ribbon-stack` | `orientation="horizontal"`; default slot (three-row column of small commands by default) | none |
|
|
68
|
+
| `office-ui-menu-button` / `-menu-item` | button: `label`, `icon`, `command` (split button), `variant`, `disabled`, `keyshortcuts`; item: `command`, `label`, `icon`, `disabled`, `checked` | item choice: `office-command` `{ command }` |
|
|
69
|
+
| `office-ui-toolbar` | `aria-label`, `aria-orientation`; arrow-key focus movement | none |
|
|
70
|
+
| `office-ui-dialog` | `open`, `heading`, `dismissible="false"`, `show()`, `close()`; slots default, `footer` | `office-dialog-close` `{ reason }` (cancelable) |
|
|
71
|
+
| `office-ui-status-bar` / `-status-item` | `label`, `value`, `interactive`, `id` | `office-status-activate` `{ id }` |
|
|
72
|
+
| `office-ui-zoom-slider` | `value` (percent), `min`, `max`, `step`, `disabled`, `fit` (fit button name), `label` | `input`, `change`; fit: `office-command` `{ command: 'zoom-fit' }` |
|
|
73
|
+
| `office-ui-tab-strip` | `tabs` `[{ id, label, title? }]`, `selected`, `label`, `previous-label`, `next-label`, `add-label`, `add-disabled`, `add-title`, `disabled` | `office-tab-select` `{ id }` (cancelable); add: `office-command` `{ command: 'tab-add' }` |
|
|
74
|
+
| `office-ui-context-menu` / `office-ui-menu-separator` | `label`; `openAt(x, y)`, `close()`, `open`; `office-ui-menu-item` and separator children | item choice: `office-command` `{ command }` |
|
|
75
|
+
| `office-ui-command-search` | `commands` `[{ id, label, keywords?, description?, disabled?, title? }]`, `placeholder`, `label`, `limit` (Office's "Tell me what you want to do") | choice: `office-command` `{ command }` |
|
|
76
|
+
| `office-ui-options-dialog` | `categories` `[{ id, label, description?, disabled?, sections: [{ id, title, controls }] }]` (controls: `toggle`, `select`, `number`, `text`, each optionally `disabled` with a reason), `values`, `category`, `open`, `heading`, `show()`, `close()` | OK: `office-options-change` `{ values, changed }` |
|
|
77
|
+
| `office-ui-account` | `profile` `{ displayName, avatarColor, initial? }`; slots `sign-in` and default (product sections) | `office-profile-change` `{ profile }` |
|
|
78
|
+
| `office-ui-ribbon` | Tab row over tab panels. Panels are children with `data-ribbon-tab`, `data-label`, optional `data-tab-keytip`; slots `quick-access`, `search`, `end`; `selected`, `label`, `file-label`, `no-file`, `file-expanded`, `file-keytip`; `focusFile()`, `focusTab()` | `office-ribbon-select` `{ tab }` (cancelable), `office-ribbon-file` |
|
|
79
|
+
| `office-ui-backstage` | `items` `[{ id, label, group?: 'footer', disabled?, title? }]`, `open`, `selected`, `label`, `back-label`, `show(page?)`, `close()`; pages are children with `data-backstage-page` | `office-backstage-select` `{ id }` (cancelable), `office-backstage-close` `{ reason }` (cancelable) |
|
|
80
|
+
| `office-ui-find-bar` | `open`, `label`, `input-label`, `placeholder`, `maxlength`, `disabled`, `navigation-disabled`, `previous-label`, `next-label`, `close-label`; `value`, `status`, `statusTitle`, `show()`, `close()` | `office-find-input` `{ query }`, `office-find-step` `{ direction }`, `office-find-close` |
|
|
81
|
+
| `office-ui-ruler` | `orientation="vertical"`, `origin` (px offset of zero), `scale` (px per unit, default 96), `direction="reverse"`; decorative | none |
|
|
82
|
+
| `office-ui-print-preview` | `pages` (rendered nodes; an inert clone of the current one is shown), `index`, `label`, `empty-label` | `office-print-preview-page` `{ index }` |
|
|
83
|
+
| `office-ui-radio` | `checked`, `disabled`, `value`, `name`; radios of one tag sharing a `name` form a roving-focus group; form-associated | `input`, `change` |
|
|
84
|
+
| `office-ui-search` | `value`, `placeholder`, `disabled`, `aria-label`, `variant="titlebar"`; `focus()`, `select()` | `input`, `change` |
|
|
85
|
+
| `office-ui-ribbon-toggle` | `label`, `checked`, `disabled`, `title`, `command` (a labelled ribbon checkbox row) | `office-toggle` `{ command, checked }` |
|
|
86
|
+
| `office-ui-dialog-footer` | `state` `{ actions: [{ id, label, variant?, icon?, disabled?, busy?, title?, align?, testId? }] }`, `focusAction(id)` | `office-dialog-footer-request` `{ id }` |
|
|
87
|
+
| `office-ui-toasts` | `state` `{ toasts: [{ id, code?, severity, message }], overflowCount?, labels? }`; hidden when empty, host positions it | `office-toasts-request` `{ id: 'dismiss', toastId }` or `{ id: 'dismissAll' }` |
|
|
88
|
+
| `office-ui-read-only-banner` | `state` `{ kind, message, passwordPromptOpen?, passwordError?, checkingPassword?, labels? }` | `office-read-only-request` (Edit anyway, Dismiss, password submit or cancel) |
|
|
89
|
+
| `office-ui-paste-options` | `state` `{ left, top, options: [{ id, label }], label? }`; fixed 4px past the pasted object | `office-paste-options-request` `{ format }`, `office-paste-options-dismiss` |
|
|
90
|
+
| `office-ui-presence` | `participants`, `max`, `label` | `office-presence-select` `{ id }` |
|
|
91
|
+
| `office-ui-smartart` | `drawing` (core `DiagramDrawing`), `schemeColors`, `label` | `office-smartart-render` (render report) |
|
|
92
|
+
| `office-ui-icon` | `name`, `label` | none |
|
|
93
93
|
|
|
94
94
|
The local profile behind `office-ui-account` is stored on the device only, under one suite-wide
|
|
95
95
|
key (`readOfficeProfile`, `writeOfficeProfile`, `clearOfficeProfile`), so every Office viewer on
|
package/dist/button.d.ts
CHANGED
|
@@ -3,9 +3,12 @@ export type OfficeCommandEvent = CustomEvent<{
|
|
|
3
3
|
}>;
|
|
4
4
|
/**
|
|
5
5
|
* Command button. Attributes: `label`, `icon`, `command`, `disabled`, `pressed` (aria-pressed),
|
|
6
|
-
* `expanded` (aria-expanded), `icon-only`, `variant="stacked"`, `
|
|
7
|
-
* (
|
|
8
|
-
*
|
|
9
|
-
*
|
|
6
|
+
* `expanded` (aria-expanded), `icon-only`, `variant="stacked"`, `size="large|small"` (ribbon
|
|
7
|
+
* large and small commands), `tall` (with `icon-only`: a tool tile), `active`, `badge`, `caret`
|
|
8
|
+
* (a trailing menu chevron), `title`, `keyshortcuts` (forwarded as aria-keyshortcuts).
|
|
9
|
+
* Activation (pointer, Enter, Space) emits one bubbling, composed `office-command` `{ command }`;
|
|
10
|
+
* Enter and Space never reach the host's own key handlers. Nothing happens when disabled.
|
|
11
|
+
* Static `requestEvent`, `idAttribute` and `detailKey`, and the `iconName()` and `showsCaret()`
|
|
12
|
+
* methods, let a product subclass keep its published contract and glyph set.
|
|
10
13
|
*/
|
|
11
14
|
export declare const defineButton: import("./registry.js").Definer;
|
|
@@ -128,6 +128,28 @@ var OFFICE_TOKENS = {
|
|
|
128
128
|
"--office-ribbon-tab-height": "35px",
|
|
129
129
|
"--office-ribbon-group-gap": "2px",
|
|
130
130
|
"--office-ribbon-group-height": "78px",
|
|
131
|
+
"--office-ribbon-group-padding": "4px 8px 2px",
|
|
132
|
+
"--office-ribbon-separator-inset": "0px",
|
|
133
|
+
"--office-ribbon-separator": "color-mix(in srgb, var(--office-border, #d1d5db) 60%, transparent)",
|
|
134
|
+
"--office-ribbon-caption-size": "10px",
|
|
135
|
+
"--office-ribbon-caption-padding": "2px 0 0",
|
|
136
|
+
"--office-launcher-inset-end": "-6px",
|
|
137
|
+
"--office-launcher-inset-bottom": "-1px",
|
|
138
|
+
"--office-ribbon-compact-row-max": "36px",
|
|
139
|
+
"--office-ribbon-stack-max-height": "80px",
|
|
140
|
+
"--office-ribbon-collapse-x": "8px",
|
|
141
|
+
"--office-ribbon-collapse-y": "120px",
|
|
142
|
+
"--office-command-icon-color": "currentColor",
|
|
143
|
+
"--office-command-large-height": "66px",
|
|
144
|
+
"--office-command-large-min-width": "48px",
|
|
145
|
+
"--office-command-large-max-width": "80px",
|
|
146
|
+
"--office-command-large-icon": "32px",
|
|
147
|
+
"--office-command-small-icon": "16px",
|
|
148
|
+
"--office-command-tall-height": "62px",
|
|
149
|
+
"--office-command-tall-min-width": "40px",
|
|
150
|
+
"--office-command-tall-icon": "30px",
|
|
151
|
+
"--office-command-active": "color-mix(in srgb, var(--office-accent, #2563eb) 15%, transparent)",
|
|
152
|
+
"--office-collapsed-group-min-width": "56px",
|
|
131
153
|
"--office-ribbon-caption-line-height": "12px",
|
|
132
154
|
"--office-ribbon-row-height": "22px",
|
|
133
155
|
"--office-ribbon-file-min-width": "52px",
|
|
@@ -167,6 +189,15 @@ var OFFICE_TOKENS = {
|
|
|
167
189
|
"--office-search-popup-min-width": "240px",
|
|
168
190
|
"--office-search-popup-max-height": "320px",
|
|
169
191
|
"--office-select-max-height": "240px",
|
|
192
|
+
"--office-select-background": "var(--office-background, #ffffff)",
|
|
193
|
+
"--office-select-menu-min-width": "90px",
|
|
194
|
+
"--office-select-option-active": "color-mix(in srgb, var(--office-accent, #2563eb) 20%, var(--office-popover, #ffffff))",
|
|
195
|
+
"--office-select-ribbon-menu-width": "192px",
|
|
196
|
+
"--office-font-picker-max-height": "320px",
|
|
197
|
+
"--office-font-picker-width": "256px",
|
|
198
|
+
"--office-chevron-size": "6px",
|
|
199
|
+
"--office-ribbon-combo-height": "28px",
|
|
200
|
+
"--office-ribbon-icon-select-width": "36px",
|
|
170
201
|
"--office-search-width": "320px",
|
|
171
202
|
"--office-print-preview-width": "420px",
|
|
172
203
|
"--office-find-max-width": "640px",
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { definer, attachStyles, controlCss, emit } from './chunk-
|
|
2
|
-
import { tok } from './chunk-
|
|
1
|
+
import { definer, attachStyles, controlCss, emit } from './chunk-NDEB6EBU.js';
|
|
2
|
+
import { tok } from './chunk-4MT4OIAJ.js';
|
|
3
3
|
import { normalizeHexColor } from 'ooxml-core/color';
|
|
4
4
|
|
|
5
5
|
var SVG_NS = "http://www.w3.org/2000/svg";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { definer, attachStyles, controlCss, emit } from './chunk-
|
|
2
|
-
import { tok } from './chunk-
|
|
1
|
+
import { definer, attachStyles, controlCss, emit } from './chunk-NDEB6EBU.js';
|
|
2
|
+
import { tok } from './chunk-4MT4OIAJ.js';
|
|
3
3
|
|
|
4
4
|
// src/presence.ts
|
|
5
5
|
function participantsFromAwareness(states, selfId) {
|