@tensor_1/react 2.46.0 → 2.48.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 +509 -1
- package/dist/{SchedulingCalendar-B6TakO2h.d.ts → SchedulingCalendar-WWyFL3Eo.d.ts} +51 -2
- package/dist/announce.d.ts +10 -0
- package/dist/announce.js +30 -0
- package/dist/chart-analytic.cjs +33 -25
- package/dist/chart-preset.cjs +23 -15
- package/dist/chart.cjs +23 -15
- package/dist/combobox-model.d.ts +10 -1
- package/dist/combobox-model.js +15 -0
- package/dist/command-palette-model.d.ts +44 -0
- package/dist/command-palette-model.js +36 -0
- package/dist/components/AccountMenu.d.ts +44 -0
- package/dist/components/AccountMenu.js +43 -0
- package/dist/components/AppShell.d.ts +45 -2
- package/dist/components/AppShell.js +116 -5
- package/dist/components/AuditLog.d.ts +128 -0
- package/dist/components/AuditLog.js +196 -0
- package/dist/components/BrandProfiles.js +4 -3
- package/dist/components/Breadcrumbs.d.ts +9 -2
- package/dist/components/Breadcrumbs.js +3 -2
- package/dist/components/BusyBar.d.ts +13 -0
- package/dist/components/BusyBar.js +10 -0
- package/dist/components/BusyRegion.d.ts +18 -0
- package/dist/components/BusyRegion.js +12 -0
- package/dist/components/Button.d.ts +33 -5
- package/dist/components/Button.js +12 -6
- package/dist/components/ButtonFeedback.d.ts +30 -0
- package/dist/components/ButtonFeedback.js +78 -0
- package/dist/components/Card.d.ts +18 -1
- package/dist/components/Card.js +5 -1
- package/dist/components/ChangeHighlight.d.ts +30 -0
- package/dist/components/ChangeHighlight.js +21 -0
- package/dist/components/ChartCore.js +2 -1
- package/dist/components/Checkbox.d.ts +27 -1
- package/dist/components/Checkbox.js +31 -2
- package/dist/components/CodeDisplay.d.ts +65 -0
- package/dist/components/CodeDisplay.js +124 -0
- package/dist/components/Combobox.d.ts +27 -6
- package/dist/components/Combobox.js +195 -58
- package/dist/components/CommandPalette.d.ts +36 -1
- package/dist/components/CommandPalette.js +254 -2
- package/dist/components/ContactCard.d.ts +66 -0
- package/dist/components/ContactCard.js +74 -0
- package/dist/components/Count.d.ts +24 -0
- package/dist/components/Count.js +32 -0
- package/dist/components/DataWorkspace.d.ts +167 -0
- package/dist/components/DataWorkspace.js +383 -0
- package/dist/components/DateFieldParts.d.ts +2 -1
- package/dist/components/DateFieldParts.js +7 -0
- package/dist/components/DatePicker.d.ts +9 -2
- package/dist/components/DatePicker.js +67 -28
- package/dist/components/DateRangePicker.d.ts +12 -2
- package/dist/components/DateRangePicker.js +13 -12
- package/dist/components/DelayedRender.d.ts +15 -0
- package/dist/components/DelayedRender.js +10 -0
- package/dist/components/DetailPage.d.ts +7 -1
- package/dist/components/DetailPage.js +2 -1
- package/dist/components/Dialogs.d.ts +71 -10
- package/dist/components/Dialogs.js +130 -30
- package/dist/components/DiffViewer.d.ts +23 -3
- package/dist/components/DiffViewer.js +26 -12
- package/dist/components/DiscardPrompt.d.ts +1 -0
- package/dist/components/DiscardPrompt.js +16 -0
- package/dist/components/DisplayPreferences.d.ts +83 -0
- package/dist/components/DisplayPreferences.js +185 -0
- package/dist/components/Drawer.d.ts +1 -0
- package/dist/components/EditorialHome.d.ts +23 -3
- package/dist/components/EditorialHome.js +16 -11
- package/dist/components/EntityPicker.d.ts +20 -3
- package/dist/components/EntityPicker.js +32 -13
- package/dist/components/FilterEditor.d.ts +18 -4
- package/dist/components/FilterEditor.js +141 -19
- package/dist/components/InfoTip.js +11 -12
- package/dist/components/InlineEdit.d.ts +87 -20
- package/dist/components/InlineEdit.js +197 -54
- package/dist/components/Input.d.ts +12 -2
- package/dist/components/Input.js +5 -3
- package/dist/components/Kbd.d.ts +6 -1
- package/dist/components/Kbd.js +6 -6
- package/dist/components/Lightbox.d.ts +41 -5
- package/dist/components/Lightbox.js +95 -9
- package/dist/components/MatchReview.d.ts +40 -1
- package/dist/components/MatchReview.js +130 -4
- package/dist/components/MetricInput.js +3 -2
- package/dist/components/Modal.d.ts +3 -1
- package/dist/components/Modal.js +13 -4
- package/dist/components/NavFavourites.d.ts +5 -0
- package/dist/components/NavFavourites.js +7 -7
- package/dist/components/OtpInput.d.ts +33 -0
- package/dist/components/OtpInput.js +123 -0
- package/dist/components/PageHeader.d.ts +7 -1
- package/dist/components/PageHeader.js +2 -2
- package/dist/components/Pagination.js +6 -5
- package/dist/components/PasswordInput.d.ts +34 -0
- package/dist/components/PasswordInput.js +101 -0
- package/dist/components/Peek.js +3 -3
- package/dist/components/Popover.js +2 -0
- package/dist/components/PrintLayout.d.ts +63 -0
- package/dist/components/PrintLayout.js +114 -0
- package/dist/components/QrCode.d.ts +47 -0
- package/dist/components/QrCode.js +55 -0
- package/dist/components/QrScanner.d.ts +95 -0
- package/dist/components/QrScanner.js +266 -0
- package/dist/components/RelationshipGraph.d.ts +32 -1
- package/dist/components/RelationshipGraph.js +18 -5
- package/dist/components/RelationshipGraphLayered.d.ts +1 -1
- package/dist/components/RelationshipGraphLayered.js +190 -115
- package/dist/components/RelationshipGraphList.js +33 -6
- package/dist/components/RuleBuilder.js +39 -7
- package/dist/components/SaveStatus.d.ts +7 -1
- package/dist/components/SaveStatus.js +13 -4
- package/dist/components/SchedulingAgenda.d.ts +3 -1
- package/dist/components/SchedulingCalendar.d.ts +3 -1
- package/dist/components/SchedulingCalendar.js +43 -4
- package/dist/components/SchedulingResourceDay.d.ts +57 -0
- package/dist/components/SchedulingResourceDay.js +287 -0
- package/dist/components/SchedulingTimeGrid.d.ts +3 -1
- package/dist/components/SchedulingTimeline.d.ts +3 -1
- package/dist/components/SearchBar.d.ts +1 -0
- package/dist/components/SearchSuggest.d.ts +23 -3
- package/dist/components/SearchSuggest.js +48 -17
- package/dist/components/Segmented.d.ts +39 -4
- package/dist/components/Segmented.js +31 -3
- package/dist/components/Select.d.ts +3 -2
- package/dist/components/Select.js +1 -1
- package/dist/components/ShortcutHint.d.ts +11 -10
- package/dist/components/ShortcutHint.js +44 -38
- package/dist/components/Sidebar.d.ts +36 -4
- package/dist/components/Sidebar.js +37 -12
- package/dist/components/SortableList.d.ts +45 -0
- package/dist/components/SortableList.js +134 -0
- package/dist/components/Spinner.d.ts +7 -1
- package/dist/components/Spinner.js +7 -1
- package/dist/components/Stat.d.ts +28 -3
- package/dist/components/Stat.js +13 -3
- package/dist/components/States.d.ts +7 -1
- package/dist/components/States.js +7 -1
- package/dist/components/StatusPill.d.ts +14 -3
- package/dist/components/StatusPill.js +11 -3
- package/dist/components/Steps.js +2 -1
- package/dist/components/Table.d.ts +16 -2
- package/dist/components/Table.js +8 -4
- package/dist/components/TableControls.js +18 -58
- package/dist/components/TableOverflowProbe.d.ts +12 -0
- package/dist/components/TableOverflowProbe.js +27 -0
- package/dist/components/Tabs.d.ts +2 -1
- package/dist/components/Tabs.js +1 -0
- package/dist/components/TagInput.d.ts +67 -0
- package/dist/components/TagInput.js +342 -0
- package/dist/components/Textarea.d.ts +5 -0
- package/dist/components/Textarea.js +2 -2
- package/dist/components/TimePicker.d.ts +80 -0
- package/dist/components/TimePicker.js +347 -0
- package/dist/components/Toast.js +3 -2
- package/dist/components/Tooltip.d.ts +8 -4
- package/dist/components/Tooltip.js +24 -21
- package/dist/components/Tree.d.ts +8 -0
- package/dist/components/Tree.js +11 -5
- package/dist/display-preferences-model.d.ts +53 -0
- package/dist/display-preferences-model.js +64 -0
- package/dist/emoji.cjs +28 -35
- package/dist/filter-model.d.ts +59 -3
- package/dist/filter-model.js +67 -2
- package/dist/hooks/useChangeHighlight.d.ts +33 -0
- package/dist/hooks/useChangeHighlight.js +44 -0
- package/dist/hooks/useDelayedPending.d.ts +22 -0
- package/dist/hooks/useDelayedPending.js +35 -0
- package/dist/hooks/useDialog.d.ts +5 -0
- package/dist/hooks/useDialog.js +3 -2
- package/dist/hooks/useOptimisticValue.d.ts +51 -0
- package/dist/hooks/useOptimisticValue.js +61 -0
- package/dist/hooks/useReducedMotion.d.ts +4 -1
- package/dist/hooks/useReducedMotion.js +7 -1
- package/dist/hooks/useResolvedFilterLabels.d.ts +15 -0
- package/dist/hooks/useResolvedFilterLabels.js +34 -0
- package/dist/hooks/useVirtualRows.d.ts +21 -2
- package/dist/hooks/useVirtualRows.js +30 -3
- package/dist/icons/Icon.d.ts +1 -1
- package/dist/index.cjs +18977 -13378
- package/dist/index.d.cts +3065 -664
- package/dist/index.d.ts +46 -16
- package/dist/index.js +149 -7
- package/dist/labels-context.d.ts +93 -3
- package/dist/motion-timing.d.ts +8 -0
- package/dist/motion-timing.js +8 -0
- package/dist/overlay-stack.d.ts +6 -0
- package/dist/overlay-stack.js +13 -0
- package/dist/qr-model.d.ts +65 -0
- package/dist/qr-model.js +323 -0
- package/dist/relationship-graph-model.d.ts +78 -3
- package/dist/relationship-graph-model.js +112 -5
- package/dist/reorder.d.ts +30 -0
- package/dist/reorder.js +74 -0
- package/dist/rich-text.cjs +4 -2
- package/dist/scheduling-resource-model.d.ts +76 -0
- package/dist/scheduling-resource-model.js +74 -0
- package/dist/search-suggest-model.js +3 -1
- package/dist/shell-context.d.ts +11 -0
- package/dist/shell-context.js +7 -0
- package/dist/time-field-model.d.ts +46 -0
- package/dist/time-field-model.js +152 -0
- package/dist/toast-store.d.ts +17 -1
- package/dist/toast-store.js +23 -7
- package/package.json +2 -1
package/dist/index.d.cts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import { RefObject, AnchorHTMLAttributes, ReactNode,
|
|
2
|
+
import { RefObject, HTMLAttributes, AnchorHTMLAttributes, ReactNode, ButtonHTMLAttributes, AriaAttributes, CSSProperties, SelectHTMLAttributes, Ref, SyntheticEvent, KeyboardEvent as KeyboardEvent$1, SVGAttributes, InputHTMLAttributes, TdHTMLAttributes, TableHTMLAttributes, ThHTMLAttributes, TextareaHTMLAttributes, MouseEvent, DetailsHTMLAttributes, LiHTMLAttributes, ReactElement } from 'react';
|
|
3
3
|
import { P as Placement } from './overlay-position-2Afke51l.cjs';
|
|
4
4
|
export { A as Align, a as PositionOptions, b as PositionResult, R as Rect, S as Side, c as Size, d as computePosition } from './overlay-position-2Afke51l.cjs';
|
|
5
5
|
export { C as ChartStatPoint, L as LinearFit, P as PredictionBandPoint, l as linearFit, n as normalQuantile, p as predictionBand, q as quantiles, s as studentTQuantile } from './chart-stats-o4zDhpVm.cjs';
|
|
@@ -10,6 +10,11 @@ declare function cx(...args: (string | false | null | undefined | 0)[]): string;
|
|
|
10
10
|
* `keepOpen` is asked when the browser closed the dialog on its own (Escape or a close request
|
|
11
11
|
* nobody cancelled, a `method="dialog"` form). Returning `true` reopens it instead of calling
|
|
12
12
|
* `onClose`: a form dialog with unsaved input or a save in flight (HAR-2029).
|
|
13
|
+
*
|
|
14
|
+
* The dialog opens and closes in a layout effect (HAR-1831). A dialog its caller unmounts while
|
|
15
|
+
* open (`{open && <ConfirmDialog …/>}`, or a page that navigates away) is closed in the commit,
|
|
16
|
+
* while it is still in the document, so the browser returns focus to the control that opened it;
|
|
17
|
+
* a passive cleanup ran after the element was removed, and focus fell to `<body>`.
|
|
13
18
|
*/
|
|
14
19
|
declare function useDialog(open: boolean, onClose?: () => void, keepOpen?: () => boolean): React.RefObject<HTMLDialogElement>;
|
|
15
20
|
|
|
@@ -161,8 +166,22 @@ interface UseTableResult<T> {
|
|
|
161
166
|
declare function useTable<T extends Row>(data: readonly T[], options?: UseTableOptions): UseTableResult<T>;
|
|
162
167
|
|
|
163
168
|
interface UseVirtualRowsOptions {
|
|
164
|
-
/**
|
|
169
|
+
/**
|
|
170
|
+
* Rendered row height in pixels. With `measureRows` it is the estimate for the first paint,
|
|
171
|
+
* until the mounted rows have been measured.
|
|
172
|
+
*/
|
|
165
173
|
rowHeight: number;
|
|
174
|
+
/**
|
|
175
|
+
* A selector for the mounted data rows inside the container, e.g. `'tbody > tr[data-row]'`
|
|
176
|
+
* (HAR-1829). With it the hook sizes its spacers and window from the rows' real pitch (their
|
|
177
|
+
* mean `offsetHeight`) instead of trusting `rowHeight`, which only has to be close: a row's
|
|
178
|
+
* height comes from CSS and content (kit padding, a second line, density), and a wrong number
|
|
179
|
+
* gives a short scrollbar and a window that drifts away from the rows on screen. It measures
|
|
180
|
+
* when windowing starts, when `rowHeight` changes (a density switch) and when the container
|
|
181
|
+
* resizes, never while scrolling, so the spacers do not move under the reader. Spacer rows
|
|
182
|
+
* must not match it.
|
|
183
|
+
*/
|
|
184
|
+
measureRows?: string;
|
|
166
185
|
/** Rows rendered beyond each viewport edge. Default: 6. */
|
|
167
186
|
overscan?: number;
|
|
168
187
|
/**
|
|
@@ -190,6 +209,11 @@ interface UseVirtualRowsResult<T> {
|
|
|
190
209
|
padBottom: number;
|
|
191
210
|
totalHeight: number;
|
|
192
211
|
virtualized: boolean;
|
|
212
|
+
/**
|
|
213
|
+
* The row height in use: the measured pitch with `measureRows`, else the `rowHeight` option.
|
|
214
|
+
* Scroll a keyboard-focused row into view with it (`index * rowHeight`).
|
|
215
|
+
*/
|
|
216
|
+
rowHeight: number;
|
|
193
217
|
}
|
|
194
218
|
/**
|
|
195
219
|
* Owns scroll/resize observation and exposes the small visible row window.
|
|
@@ -197,7 +221,7 @@ interface UseVirtualRowsResult<T> {
|
|
|
197
221
|
* When the row count shrinks under a large scroll position the window is clamped to the new
|
|
198
222
|
* count in the same render, so `padTop` never exceeds the list (HAR-1616).
|
|
199
223
|
*/
|
|
200
|
-
declare function useVirtualRows<T>(rows: readonly T[], { rowHeight, overscan, threshold, estimatedViewportHeight, enabled }: UseVirtualRowsOptions): UseVirtualRowsResult<T>;
|
|
224
|
+
declare function useVirtualRows<T>(rows: readonly T[], { rowHeight: estimate, overscan, threshold, estimatedViewportHeight, enabled, measureRows }: UseVirtualRowsOptions): UseVirtualRowsResult<T>;
|
|
201
225
|
|
|
202
226
|
interface UseAnchoredPositionOptions {
|
|
203
227
|
/** Reposition while true, and (re)attach scroll/resize listeners. */
|
|
@@ -245,11 +269,259 @@ interface UseAnchoredPositionOptions {
|
|
|
245
269
|
*/
|
|
246
270
|
declare function useAnchoredPosition(anchor: RefObject<HTMLElement | null> | HTMLElement | null | undefined, floatingRef: RefObject<HTMLElement | null>, { open, placement, offset, padding, shiftMainAxis, capHeight, onAnchorHidden }: UseAnchoredPositionOptions): () => void;
|
|
247
271
|
|
|
248
|
-
/**
|
|
272
|
+
/**
|
|
273
|
+
* Non-hook read for event handlers and effects: the OS setting, or the in-app preference
|
|
274
|
+
* `<html data-motion="reduce">` (HAR-1372). `false` where there is no `matchMedia` (SSR, tests).
|
|
275
|
+
*/
|
|
249
276
|
declare function prefersReducedMotion(): boolean;
|
|
250
277
|
/** True while the user asks for reduced motion; re-renders when the setting changes. `false` on the server. */
|
|
251
278
|
declare function useReducedMotion(): boolean;
|
|
252
279
|
|
|
280
|
+
type ThemePreference = 'light' | 'dark' | 'system';
|
|
281
|
+
type ContrastPreference = 'standard' | 'more' | 'system';
|
|
282
|
+
type TextScalePreference = 'sm' | 'md' | 'lg' | 'xl';
|
|
283
|
+
type MotionPreference = 'system' | 'reduce';
|
|
284
|
+
type DensityPreference = 'compact' | 'standard' | 'comfortable';
|
|
285
|
+
interface DisplayPreferenceValues {
|
|
286
|
+
theme: ThemePreference;
|
|
287
|
+
contrast: ContrastPreference;
|
|
288
|
+
textScale: TextScalePreference;
|
|
289
|
+
motion: MotionPreference;
|
|
290
|
+
density: DensityPreference;
|
|
291
|
+
}
|
|
292
|
+
/** What the system says, for the `system` choices. */
|
|
293
|
+
interface SystemDisplayPreferences {
|
|
294
|
+
dark: boolean;
|
|
295
|
+
moreContrast: boolean;
|
|
296
|
+
}
|
|
297
|
+
/** The attributes written on <html>; `undefined` means the attribute is removed. */
|
|
298
|
+
interface DisplayAttributes {
|
|
299
|
+
'data-theme': 'light' | 'dark';
|
|
300
|
+
'data-contrast'?: 'more';
|
|
301
|
+
'data-text-scale'?: 'sm' | 'lg' | 'xl';
|
|
302
|
+
'data-motion'?: 'reduce';
|
|
303
|
+
'data-density'?: 'compact' | 'comfortable';
|
|
304
|
+
}
|
|
305
|
+
declare const DEFAULT_DISPLAY_PREFERENCES: DisplayPreferenceValues;
|
|
306
|
+
/** The default `localStorage` key. */
|
|
307
|
+
declare const DISPLAY_PREFERENCES_STORAGE_KEY = "uix-display-preferences";
|
|
308
|
+
declare const DISPLAY_PREFERENCE_OPTIONS: {
|
|
309
|
+
readonly theme: readonly ["light", "dark", "system"];
|
|
310
|
+
readonly contrast: readonly ["standard", "more", "system"];
|
|
311
|
+
readonly textScale: readonly ["sm", "md", "lg", "xl"];
|
|
312
|
+
readonly motion: readonly ["system", "reduce"];
|
|
313
|
+
readonly density: readonly ["compact", "standard", "comfortable"];
|
|
314
|
+
};
|
|
315
|
+
/** Read stored preferences; anything missing or unknown falls back to `defaults`. */
|
|
316
|
+
declare function parseDisplayPreferences(raw: string | null | undefined, defaults?: DisplayPreferenceValues): DisplayPreferenceValues;
|
|
317
|
+
/** The <html> attributes for a set of preferences, resolving `system` against the system. */
|
|
318
|
+
declare function resolveDisplayAttributes(prefs: DisplayPreferenceValues, system: SystemDisplayPreferences): DisplayAttributes;
|
|
319
|
+
/** Write (or remove) the attributes on an element, normally `document.documentElement`. */
|
|
320
|
+
declare function applyDisplayAttributes(root: Element, attributes: DisplayAttributes): void;
|
|
321
|
+
/** The system's answers from `matchMedia`; all false where there is none (SSR, tests). */
|
|
322
|
+
declare function readSystemDisplayPreferences(): SystemDisplayPreferences;
|
|
323
|
+
/**
|
|
324
|
+
* An inline script for the document head that applies the stored preferences before the first
|
|
325
|
+
* paint, so a dark or large-text page never flashes light or small (HAR-1372). Self-contained ES5;
|
|
326
|
+
* it never throws. Put it in a `<script>` before the stylesheets:
|
|
327
|
+
* <script dangerouslySetInnerHTML={{ __html: displayPreferencesScript() }} />
|
|
328
|
+
* It mirrors parseDisplayPreferences + resolveDisplayAttributes (tested to agree).
|
|
329
|
+
*/
|
|
330
|
+
declare function displayPreferencesScript(storageKey?: string, defaults?: DisplayPreferenceValues): string;
|
|
331
|
+
|
|
332
|
+
interface UseDisplayPreferencesOptions {
|
|
333
|
+
/** `localStorage` key. Default `DISPLAY_PREFERENCES_STORAGE_KEY`; pass the same key to `displayPreferencesScript`. */
|
|
334
|
+
storageKey?: string;
|
|
335
|
+
/** Your defaults for anything not stored yet. Pass the same to `displayPreferencesScript`. */
|
|
336
|
+
defaults?: Partial<DisplayPreferenceValues>;
|
|
337
|
+
/** Write the attributes on `<html>`. Default `true`; `false` for a preview that must not restyle the page. */
|
|
338
|
+
apply?: boolean;
|
|
339
|
+
}
|
|
340
|
+
interface UseDisplayPreferencesResult {
|
|
341
|
+
/** The person's choices (`system` where they left it to the system). */
|
|
342
|
+
preferences: DisplayPreferenceValues;
|
|
343
|
+
/** The theme in force: `system` resolved against `prefers-color-scheme`. */
|
|
344
|
+
resolvedTheme: 'light' | 'dark';
|
|
345
|
+
setPreference: <K extends keyof DisplayPreferenceValues>(key: K, value: DisplayPreferenceValues[K]) => void;
|
|
346
|
+
setPreferences: (next: DisplayPreferenceValues) => void;
|
|
347
|
+
}
|
|
348
|
+
/**
|
|
349
|
+
* The display preferences (HAR-1372): read from `localStorage`, kept in step with the system
|
|
350
|
+
* (`prefers-color-scheme`, `prefers-contrast`), with other tabs and with other users of the hook in
|
|
351
|
+
* this tab, and written to `<html>` as the attributes the tokens read. Changing one applies at once,
|
|
352
|
+
* with every transition suspended for that frame so nothing fades between themes.
|
|
353
|
+
* The server renders `defaults`; the stored choice is read before the first paint on the client
|
|
354
|
+
* (pair it with `displayPreferencesScript` in the head, so the page itself never flashes).
|
|
355
|
+
*/
|
|
356
|
+
declare function useDisplayPreferences({ storageKey, defaults: defaultOverrides, apply }?: UseDisplayPreferencesOptions): UseDisplayPreferencesResult;
|
|
357
|
+
interface DisplayPreferencesLabels {
|
|
358
|
+
theme: string;
|
|
359
|
+
light: string;
|
|
360
|
+
dark: string;
|
|
361
|
+
system: string;
|
|
362
|
+
contrast: string;
|
|
363
|
+
contrastStandard: string;
|
|
364
|
+
contrastMore: string;
|
|
365
|
+
textScale: string;
|
|
366
|
+
textSmall: string;
|
|
367
|
+
textDefault: string;
|
|
368
|
+
textLarge: string;
|
|
369
|
+
textLarger: string;
|
|
370
|
+
motion: string;
|
|
371
|
+
motionSystem: string;
|
|
372
|
+
motionReduce: string;
|
|
373
|
+
density: string;
|
|
374
|
+
densityCompact: string;
|
|
375
|
+
densityStandard: string;
|
|
376
|
+
densityComfortable: string;
|
|
377
|
+
}
|
|
378
|
+
declare const DEFAULT_DISPLAY_PREFERENCES_LABELS: DisplayPreferencesLabels;
|
|
379
|
+
interface ThemeSwitcherProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
|
|
380
|
+
/** Controlled theme. Leave it out and the switcher keeps the preference itself (`useDisplayPreferences`). */
|
|
381
|
+
value?: ThemePreference;
|
|
382
|
+
onValueChange?: (value: ThemePreference) => void;
|
|
383
|
+
/** The storage key when uncontrolled. */
|
|
384
|
+
storageKey?: string;
|
|
385
|
+
/** `icons` shows the icons only (each keeps its word as its name); default shows icon and word. */
|
|
386
|
+
display?: 'labels' | 'icons';
|
|
387
|
+
labels?: Partial<DisplayPreferencesLabels>;
|
|
388
|
+
}
|
|
389
|
+
/**
|
|
390
|
+
* Light / dark / system (HAR-1372), a radio group over `Segmented`. Uncontrolled, it reads and
|
|
391
|
+
* writes the display preferences itself; controlled, it only reports.
|
|
392
|
+
*/
|
|
393
|
+
declare function ThemeSwitcher({ value, onValueChange, storageKey, display, labels: labelOverrides, className, ...props }: ThemeSwitcherProps): react.JSX.Element;
|
|
394
|
+
interface DisplayPreferencesProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
|
|
395
|
+
/** Controlled values. Leave out to keep them in `localStorage` (`useDisplayPreferences`). */
|
|
396
|
+
value?: DisplayPreferenceValues;
|
|
397
|
+
onValueChange?: (value: DisplayPreferenceValues) => void;
|
|
398
|
+
storageKey?: string;
|
|
399
|
+
/** Show only some of the five settings, in this order. Default all. */
|
|
400
|
+
settings?: readonly (keyof DisplayPreferenceValues)[];
|
|
401
|
+
labels?: Partial<DisplayPreferencesLabels>;
|
|
402
|
+
}
|
|
403
|
+
/**
|
|
404
|
+
* The five display settings (HAR-1372; MOTUS C-4, TENSOR A7): theme, contrast, text size, motion
|
|
405
|
+
* and density, each a labelled radio group. Put it in a preferences page or an account menu's
|
|
406
|
+
* dialog. Changes apply at once and are remembered.
|
|
407
|
+
*/
|
|
408
|
+
declare function DisplayPreferences({ value, onValueChange, storageKey, settings, labels: labelOverrides, className, ...props }: DisplayPreferencesProps): react.JSX.Element;
|
|
409
|
+
|
|
410
|
+
interface DelayedPendingOptions {
|
|
411
|
+
/** Wait this long before showing anything (default 300 ms). `0` shows at once. */
|
|
412
|
+
delay?: number;
|
|
413
|
+
/** Once shown, keep showing at least this long (default 500 ms). */
|
|
414
|
+
minVisible?: number;
|
|
415
|
+
}
|
|
416
|
+
/**
|
|
417
|
+
* Whether to show a pending indicator for `pending` (motion standard §2.3): nothing for the
|
|
418
|
+
* first 300 ms, so a fast action never flashes a spinner; once shown, held at least 500 ms
|
|
419
|
+
* after it appeared, so it never flickers off the moment the work ends.
|
|
420
|
+
*
|
|
421
|
+
* ```tsx
|
|
422
|
+
* const showSpinner = useDelayedPending(query.isFetching);
|
|
423
|
+
* {showSpinner && <Spinner />}
|
|
424
|
+
* ```
|
|
425
|
+
*
|
|
426
|
+
* Use the raw `pending` for behaviour (blocking a second submit); use the result for what
|
|
427
|
+
* people see. Returns `false` on the server and on the first client render unless `delay` is 0.
|
|
428
|
+
*/
|
|
429
|
+
declare function useDelayedPending(pending: boolean, { delay, minVisible }?: DelayedPendingOptions): boolean;
|
|
430
|
+
|
|
431
|
+
/** Under this, a pending action shows nothing new: a spinner that would flash for 150 ms is noise. */
|
|
432
|
+
declare const PENDING_DELAY_MS = 300;
|
|
433
|
+
/** Once a pending indicator appears, it stays at least this long so it never flickers. */
|
|
434
|
+
declare const PENDING_MIN_VISIBLE_MS = 500;
|
|
435
|
+
/** How long an in-place result ("Saved", "Couldn't save") holds before the control returns. */
|
|
436
|
+
declare const RESULT_HOLD_MS = 1500;
|
|
437
|
+
|
|
438
|
+
interface ChangeHighlightOptions {
|
|
439
|
+
/**
|
|
440
|
+
* Said through the page's polite live region when the value changes, e.g. "Status changed to
|
|
441
|
+
* Resolved by A. Novak". The highlight is the signal and its place is the location; this is
|
|
442
|
+
* the description for people who cannot see either (motion standard §2.5).
|
|
443
|
+
*/
|
|
444
|
+
announce?: string;
|
|
445
|
+
/** Turn the highlight off, e.g. while the person is editing the value themselves. */
|
|
446
|
+
disabled?: boolean;
|
|
447
|
+
}
|
|
448
|
+
/**
|
|
449
|
+
* Flash `.uix-changed` on an element when `value` changes after mount — never on the first
|
|
450
|
+
* render (HAR-2585). A second change restarts the highlight. Compare by `Object.is`: pass a
|
|
451
|
+
* primitive (a status, a count, an `updatedAt`), not a fresh object.
|
|
452
|
+
*
|
|
453
|
+
* ```tsx
|
|
454
|
+
* const ref = useChangeHighlight<HTMLTableCellElement>(row.status, { announce: `Status: ${row.status}` });
|
|
455
|
+
* <Td ref={ref}>{row.status}</Td>
|
|
456
|
+
* ```
|
|
457
|
+
*
|
|
458
|
+
* The hook sets `data-uix-changed` on the element (React never renders that attribute, so a
|
|
459
|
+
* re-render cannot clear it) and removes it when the animation ends.
|
|
460
|
+
*/
|
|
461
|
+
declare function useChangeHighlight<T extends HTMLElement = HTMLElement>(value: unknown, { announce, disabled }?: ChangeHighlightOptions): RefObject<T | null>;
|
|
462
|
+
/**
|
|
463
|
+
* Flash `.uix-changed` on `el` now (restarting a highlight already running). For changes that
|
|
464
|
+
* do not flow through a React value, e.g. a row a live update replaced.
|
|
465
|
+
*/
|
|
466
|
+
declare function flashChanged(el: HTMLElement): void;
|
|
467
|
+
|
|
468
|
+
interface OptimisticRollback<T> {
|
|
469
|
+
/** The value the person asked for. */
|
|
470
|
+
attempted: T;
|
|
471
|
+
/** The value shown again. */
|
|
472
|
+
restored: T;
|
|
473
|
+
error: unknown;
|
|
474
|
+
}
|
|
475
|
+
interface UseOptimisticValueOptions<T> {
|
|
476
|
+
/** Called when a change fails and the value is put back, e.g. to show a toast that says what was restored. */
|
|
477
|
+
onRollback?: (rollback: OptimisticRollback<T>) => void;
|
|
478
|
+
}
|
|
479
|
+
interface UseOptimisticValueResult<T> {
|
|
480
|
+
/** What to show: the person's change at once, the server's value otherwise. */
|
|
481
|
+
value: T;
|
|
482
|
+
/** Show `next` now and save it; resolves when the save settles (it never rejects). */
|
|
483
|
+
set: (next: T) => Promise<void>;
|
|
484
|
+
/** A save is in flight. */
|
|
485
|
+
pending: boolean;
|
|
486
|
+
/** The last rollback, until the next change; `null` when the last change saved. */
|
|
487
|
+
rollback: OptimisticRollback<T> | null;
|
|
488
|
+
/**
|
|
489
|
+
* Counts rollbacks. Pass it to `ChangeHighlight value={rollbacks}` (or `useChangeHighlight`)
|
|
490
|
+
* so the restored element flashes; the person's own change does not.
|
|
491
|
+
*/
|
|
492
|
+
rollbacks: number;
|
|
493
|
+
}
|
|
494
|
+
/**
|
|
495
|
+
* An optimistic value with a visible rollback (HAR-2583, motion standard §2.6). Only for
|
|
496
|
+
* reversible, personal, nearly-always-successful actions: star, pin, a reaction, mark read, a
|
|
497
|
+
* display preference, the order of one's own saved views. Never for anything the server can
|
|
498
|
+
* refuse or an auditor reads (a state transition, an assignment, an approval, a priority):
|
|
499
|
+
* those stay pessimistic, with `Button loading` and `result`.
|
|
500
|
+
*
|
|
501
|
+
* `set(next)` shows `next` at once and calls `commit(next)`. If the commit fails, the last
|
|
502
|
+
* confirmed value comes back, `rollbacks` counts up (flash the element with it), `rollback`
|
|
503
|
+
* says what happened, and `onRollback` runs so the product can say it in words. When changes
|
|
504
|
+
* overlap, only the latest one's outcome counts. While nothing is pending, `value` follows
|
|
505
|
+
* `serverValue` when it changes; a change that saved stays shown until then.
|
|
506
|
+
*
|
|
507
|
+
* ```tsx
|
|
508
|
+
* const star = useOptimisticValue(view.starred, (next) => api.star(view.id, next), {
|
|
509
|
+
* onRollback: () => toast.error(t('starNotSaved')),
|
|
510
|
+
* });
|
|
511
|
+
* <ChangeHighlight value={star.rollbacks} variant="ring" announce={star.rollback ? t('starRestored') : undefined}>
|
|
512
|
+
* <StarButton starred={star.value} onToggle={() => star.set(!star.value)} />
|
|
513
|
+
* </ChangeHighlight>
|
|
514
|
+
* ```
|
|
515
|
+
*/
|
|
516
|
+
declare function useOptimisticValue<T>(serverValue: T, commit: (next: T) => Promise<unknown>, { onRollback }?: UseOptimisticValueOptions<T>): UseOptimisticValueResult<T>;
|
|
517
|
+
|
|
518
|
+
/**
|
|
519
|
+
* Say `text` through a polite live region (`[data-uix-announcer]`): the page's, or the open
|
|
520
|
+
* dialog's when `from` is inside one. The region is cleared first and filled a moment later,
|
|
521
|
+
* so the same words twice are spoken twice; a newer message replaces one not yet spoken.
|
|
522
|
+
*/
|
|
523
|
+
declare function announcePolite(text: string, from?: Element | null): void;
|
|
524
|
+
|
|
253
525
|
/**
|
|
254
526
|
* What a `renderLink` callback receives (HAR-1348). Spread it onto your router's link
|
|
255
527
|
* so it keeps client navigation and prefetch: `renderLink={(p) => <NextLink {...p} />}`.
|
|
@@ -299,6 +571,14 @@ interface KbdComboProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'
|
|
|
299
571
|
*/
|
|
300
572
|
declare function KbdCombo({ keys, platform, keyLabels, className, ...props }: KbdComboProps): react.JSX.Element;
|
|
301
573
|
|
|
574
|
+
type ButtonResult = 'success' | 'error';
|
|
575
|
+
/** The words a `Button` shows and announces for a moment after its action ends. */
|
|
576
|
+
interface ButtonResultLabels {
|
|
577
|
+
success: string;
|
|
578
|
+
error: string;
|
|
579
|
+
}
|
|
580
|
+
declare const DEFAULT_BUTTON_RESULT_LABELS: ButtonResultLabels;
|
|
581
|
+
|
|
302
582
|
type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'ghost' | 'danger' | 'link';
|
|
303
583
|
/** `xs` is 24 px: the smallest hit area WCAG 2.5.8 allows, for dense tool rows (HAR-1348). */
|
|
304
584
|
type ButtonSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
@@ -306,7 +586,27 @@ interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
|
306
586
|
variant?: ButtonVariant;
|
|
307
587
|
size?: ButtonSize;
|
|
308
588
|
icon?: boolean;
|
|
589
|
+
/**
|
|
590
|
+
* The button's action is running. The button stops taking presses at once and is announced
|
|
591
|
+
* busy; the spinner appears only after `loadingDelay` and then stays at least 500 ms, so a
|
|
592
|
+
* fast action never flashes one (HAR-2580, motion standard §2.3). The button keeps its full
|
|
593
|
+
* colour while it works: a spinner, not a greyed-out control.
|
|
594
|
+
*/
|
|
309
595
|
loading?: boolean;
|
|
596
|
+
/** Milliseconds before the spinner shows (default 300). `0` shows it at once. */
|
|
597
|
+
loadingDelay?: number;
|
|
598
|
+
/**
|
|
599
|
+
* How the button's last action ended (HAR-2581). When it changes to `success` or `error`,
|
|
600
|
+
* or an action ends with one, the label crossfades to a check and `resultLabels.success`
|
|
601
|
+
* ("Done") or an alert mark and `resultLabels.error` ("Failed") for 1.5 s, announced
|
|
602
|
+
* politely, then returns. Never on the first render. The button is always as wide as its
|
|
603
|
+
* widest wording, so nothing beside it moves. Pass `null` while there is no result (keep
|
|
604
|
+
* the prop defined); say what failed and how to recover somewhere that stays, such as a
|
|
605
|
+
* field error or a toast. e.g. `result={m.isSuccess ? 'success' : m.isError ? 'error' : null}`
|
|
606
|
+
*/
|
|
607
|
+
result?: ButtonResult | null;
|
|
608
|
+
/** The result words, e.g. `{ success: 'Assigned', error: 'Not assigned' }`; or `UixLabelsProvider` `buttonResult`. */
|
|
609
|
+
resultLabels?: Partial<ButtonResultLabels>;
|
|
310
610
|
/**
|
|
311
611
|
* Let a long label wrap onto more lines: the size becomes a minimum height instead of a fixed
|
|
312
612
|
* one (HAR-1813, WCAG 1.4.10 reflow). For human-language labels on public or narrow screens;
|
|
@@ -316,10 +616,11 @@ interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
|
316
616
|
/**
|
|
317
617
|
* The button's keyboard shortcut, in `KbdCombo` key names: `['A']`, `['Mod', 'Enter']`
|
|
318
618
|
* (HAR-2031). Hover or focus shows the keys in a hint above the button (an icon button's
|
|
319
|
-
* `aria-label` before them
|
|
320
|
-
*
|
|
321
|
-
*
|
|
322
|
-
*
|
|
619
|
+
* `aria-label` before them; ⌘ on Apple, Ctrl elsewhere). Screen readers hear the keys once, as
|
|
620
|
+
* the button's description after any `aria-describedby` of yours ("Control+Enter"), the same
|
|
621
|
+
* rule as a `Tooltip` with a shortcut (HAR-2416). Inside a `Tooltip` the Tooltip shows and says
|
|
622
|
+
* the keys. An `aria-keyshortcuts` you pass is kept as it is. The kit only shows the shortcut:
|
|
623
|
+
* the product binds the key.
|
|
323
624
|
*/
|
|
324
625
|
shortcut?: KeyShortcut;
|
|
325
626
|
children?: ReactNode;
|
|
@@ -340,13 +641,19 @@ interface ButtonLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
|
340
641
|
disabled?: boolean;
|
|
341
642
|
/** Your router's link (`(p) => <NextLink {...p} />`); default a plain `<a>`. */
|
|
342
643
|
renderLink?: UixRenderLink;
|
|
644
|
+
/**
|
|
645
|
+
* The link's keyboard shortcut, as on `Button` (HAR-2416): hover or keyboard focus shows the
|
|
646
|
+
* keys in a hint above it, and screen readers hear them once as its description. Not shown
|
|
647
|
+
* while `disabled`. The kit only shows the shortcut: the product binds the key.
|
|
648
|
+
*/
|
|
649
|
+
shortcut?: KeyShortcut;
|
|
343
650
|
children?: ReactNode;
|
|
344
651
|
}
|
|
345
652
|
/**
|
|
346
653
|
* A link that looks like a `Button` (HAR-1348; TENSOR A4/B5, MOTUS C-3). Use it when the
|
|
347
654
|
* action navigates; use `Button` when it acts in place.
|
|
348
655
|
*/
|
|
349
|
-
declare function ButtonLink({ href, variant, size, icon, wrap, disabled, renderLink, className, children, onClick, ...props }: ButtonLinkProps): react.JSX.Element;
|
|
656
|
+
declare function ButtonLink({ href, variant, size, icon, wrap, disabled, renderLink, shortcut, className, children, onClick, ...props }: ButtonLinkProps): react.JSX.Element;
|
|
350
657
|
interface ButtonGroupProps {
|
|
351
658
|
children?: ReactNode;
|
|
352
659
|
className?: string;
|
|
@@ -736,6 +1043,91 @@ declare function proposeMove(span: {
|
|
|
736
1043
|
minutes?: number;
|
|
737
1044
|
}, timeZone: string): MoveProposal;
|
|
738
1045
|
|
|
1046
|
+
/** What a span of a resource's day is: open to book, booked, or not working. */
|
|
1047
|
+
type SchedulingAvailabilityKind = 'free' | 'booked' | 'off';
|
|
1048
|
+
/** One column of the resource day, e.g. a practitioner. */
|
|
1049
|
+
interface SchedulingResource {
|
|
1050
|
+
id: string;
|
|
1051
|
+
/** The column heading and the start of every slot's accessible name. */
|
|
1052
|
+
label: string;
|
|
1053
|
+
/** A second line under the heading, e.g. the speciality or the room. */
|
|
1054
|
+
description?: string;
|
|
1055
|
+
}
|
|
1056
|
+
/** A stretch of one resource's day, as the server composed it. */
|
|
1057
|
+
interface SchedulingResourceSpan {
|
|
1058
|
+
id: string;
|
|
1059
|
+
resourceId: string;
|
|
1060
|
+
/** ISO 8601 instants, half-open `[start, end)`. */
|
|
1061
|
+
start: string;
|
|
1062
|
+
end: string;
|
|
1063
|
+
kind: SchedulingAvailabilityKind;
|
|
1064
|
+
/** Shown on the span, e.g. the patient's name on a booking or "Lunch" on time off. */
|
|
1065
|
+
label?: string;
|
|
1066
|
+
/** The complete accessible name, in the consumer's words. Replaces the built one. */
|
|
1067
|
+
accessibleName?: string;
|
|
1068
|
+
}
|
|
1069
|
+
/** One row of the slot axis. */
|
|
1070
|
+
interface ResourceDaySlot {
|
|
1071
|
+
/** Epoch milliseconds of the slot's start and end. */
|
|
1072
|
+
start: number;
|
|
1073
|
+
end: number;
|
|
1074
|
+
/** The local time it starts, `HH:MM`, in the display zone. */
|
|
1075
|
+
label: string;
|
|
1076
|
+
}
|
|
1077
|
+
interface ResourceDaySlotOptions {
|
|
1078
|
+
/** The first local time shown, `HH:MM`. Default `'07:00'`. */
|
|
1079
|
+
dayStart?: string;
|
|
1080
|
+
/** The local time the axis ends, `HH:MM` (exclusive). Default `'19:00'`. */
|
|
1081
|
+
dayEnd?: string;
|
|
1082
|
+
/** Minutes per slot. Default 15. */
|
|
1083
|
+
slotMinutes?: number;
|
|
1084
|
+
}
|
|
1085
|
+
/** One drawn piece of a column: a bookable slot of a free span, a booking, or time off. */
|
|
1086
|
+
interface ResourceDayItem {
|
|
1087
|
+
key: string;
|
|
1088
|
+
span: SchedulingResourceSpan;
|
|
1089
|
+
kind: SchedulingAvailabilityKind;
|
|
1090
|
+
/** Epoch milliseconds of what this piece covers (a free span is cut at slot edges). */
|
|
1091
|
+
start: number;
|
|
1092
|
+
end: number;
|
|
1093
|
+
/** Slots from the top of the axis to the piece's start (fractional). */
|
|
1094
|
+
offset: number;
|
|
1095
|
+
/** Slots the piece is long (fractional). */
|
|
1096
|
+
length: number;
|
|
1097
|
+
lane: number;
|
|
1098
|
+
lanes: number;
|
|
1099
|
+
/** The span starts before or ends after the axis. */
|
|
1100
|
+
continuesBefore: boolean;
|
|
1101
|
+
continuesAfter: boolean;
|
|
1102
|
+
}
|
|
1103
|
+
/**
|
|
1104
|
+
* The slot axis of `date` in `timeZone`: one slot per `slotMinutes` of real time from the first
|
|
1105
|
+
* local time at or after `dayStart` to the last before `dayEnd`. On a clock-change day the axis
|
|
1106
|
+
* is as long as the day really is (a skipped hour has no slots; a repeated hour has two sets).
|
|
1107
|
+
*/
|
|
1108
|
+
declare function resourceDaySlots(date: string, timeZone: string, options?: ResourceDaySlotOptions): ResourceDaySlot[];
|
|
1109
|
+
/**
|
|
1110
|
+
* Where the spans of one resource go on the slot axis. Free spans are cut at slot edges, so each
|
|
1111
|
+
* bookable slot is its own piece; bookings and time off stay whole. Pieces outside the axis are
|
|
1112
|
+
* dropped, pieces across its edges are clipped. Overlapping pieces (a double booking) get lanes.
|
|
1113
|
+
*/
|
|
1114
|
+
declare function layoutResourceColumn(spans: readonly SchedulingResourceSpan[], slots: readonly ResourceDaySlot[]): ResourceDayItem[];
|
|
1115
|
+
/** The stretches of the axis no span covers: shown as "no schedule", never as free. */
|
|
1116
|
+
declare function resourceDayGaps(items: readonly ResourceDayItem[], slots: readonly ResourceDaySlot[]): Array<{
|
|
1117
|
+
start: number;
|
|
1118
|
+
end: number;
|
|
1119
|
+
}>;
|
|
1120
|
+
|
|
1121
|
+
/** What `onSelectSlot` receives: the resource, the piece's own start and end, and the span it belongs to. */
|
|
1122
|
+
interface SchedulingSlotSelection {
|
|
1123
|
+
resourceId: string;
|
|
1124
|
+
/** ISO 8601 instants of the piece: one slot of a free span, or the whole booking. */
|
|
1125
|
+
start: string;
|
|
1126
|
+
end: string;
|
|
1127
|
+
kind: Exclude<SchedulingAvailabilityKind, 'off'>;
|
|
1128
|
+
span: SchedulingResourceSpan;
|
|
1129
|
+
}
|
|
1130
|
+
|
|
739
1131
|
interface TimeGridEntryContext {
|
|
740
1132
|
/** Whole text lines that fit in the item: 0 shows the markers only. */
|
|
741
1133
|
availableLines: number;
|
|
@@ -935,6 +1327,18 @@ interface SchedulingCalendarLabels {
|
|
|
935
1327
|
moveCancelled?: string;
|
|
936
1328
|
/** Announced when the time asked for does not exist that day. `{time}` is the time used instead. */
|
|
937
1329
|
gapForward?: string;
|
|
1330
|
+
/** Names the resource day (HAR-983). `{date}` placeholder. */
|
|
1331
|
+
resourceGrid?: string;
|
|
1332
|
+
/** The words for the kinds of a resource span. */
|
|
1333
|
+
availability?: Partial<Record<SchedulingAvailabilityKind, string>>;
|
|
1334
|
+
/** Time of a resource that no span covers: no schedule, which is not free. */
|
|
1335
|
+
noSchedule?: string;
|
|
1336
|
+
/** A resource slot's or booking's accessible name. `{resource}`, `{start}`, `{end}`, `{kind}`, `{label}`. */
|
|
1337
|
+
slotName?: string;
|
|
1338
|
+
/** How to move in the resource day, read with it. */
|
|
1339
|
+
resourceHint?: string;
|
|
1340
|
+
/** The resource day with no resources. */
|
|
1341
|
+
noResources?: string;
|
|
938
1342
|
}
|
|
939
1343
|
declare const DEFAULT_SCHEDULING_CALENDAR_LABELS: SchedulingCalendarLabels;
|
|
940
1344
|
interface SchedulingCalendarProps {
|
|
@@ -1075,14 +1479,49 @@ interface SchedulingCalendarProps {
|
|
|
1075
1479
|
topLaneCap?: number;
|
|
1076
1480
|
/** Lanes side by side in one day column of the time grid, at most. Fewer are used when the column is narrow. Default 4. */
|
|
1077
1481
|
maxLanes?: number;
|
|
1482
|
+
/**
|
|
1483
|
+
* With `view="day"`, one column per resource (a practitioner, a room) instead of the time grid
|
|
1484
|
+
* (HAR-983). Their stretches of the day come from `resourceSpans`; a time no span covers is
|
|
1485
|
+
* shown as "no schedule", never as free.
|
|
1486
|
+
*/
|
|
1487
|
+
resources?: SchedulingResource[];
|
|
1488
|
+
/** The free, booked and off stretches of each resource, as the server composed them. */
|
|
1489
|
+
resourceSpans?: SchedulingResourceSpan[];
|
|
1490
|
+
/** Minutes per slot of the resource day: each free span is cut into bookable slots of this length. Default 15. */
|
|
1491
|
+
slotMinutes?: number;
|
|
1492
|
+
/** The first local time of the resource day's axis, `HH:MM`. Default `'07:00'`. */
|
|
1493
|
+
dayStart?: string;
|
|
1494
|
+
/** The local time the resource day's axis ends, `HH:MM`. Default `'19:00'`. */
|
|
1495
|
+
dayEnd?: string;
|
|
1496
|
+
/** Called by a click, Enter or Space on a free slot (its own start and end) or a booking. */
|
|
1497
|
+
onSelectSlot?: (slot: SchedulingSlotSelection) => void;
|
|
1498
|
+
/** Marks the slot or booking that holds this instant for this resource, e.g. while its popover is open. */
|
|
1499
|
+
selectedSlot?: {
|
|
1500
|
+
resourceId: string;
|
|
1501
|
+
start: string;
|
|
1502
|
+
};
|
|
1503
|
+
/**
|
|
1504
|
+
* `auto` (default): columns, and a list of one resource after another when the calendar is
|
|
1505
|
+
* narrower than `resourceListBelow`. `columns` or `list` fixes one.
|
|
1506
|
+
*/
|
|
1507
|
+
resourceLayout?: 'auto' | 'columns' | 'list';
|
|
1508
|
+
/** The width in CSS pixels under which `auto` shows the list. Default 480. */
|
|
1509
|
+
resourceListBelow?: number;
|
|
1510
|
+
/**
|
|
1511
|
+
* The first load shows skeletons; a refetch keeps what is on screen, dimmed and `aria-busy`
|
|
1512
|
+
* (the resource day; the other views show `labels.loading` instead).
|
|
1513
|
+
*/
|
|
1078
1514
|
loading?: boolean;
|
|
1079
1515
|
error?: string;
|
|
1080
1516
|
onRetry?: () => void;
|
|
1081
1517
|
className?: string;
|
|
1082
1518
|
labels?: Partial<SchedulingCalendarLabels>;
|
|
1083
1519
|
}
|
|
1084
|
-
/**
|
|
1085
|
-
|
|
1520
|
+
/**
|
|
1521
|
+
* Month/week/day/agenda calendar for UTC ranges rendered in an explicit IANA time zone. With
|
|
1522
|
+
* `resources`, the day view is one column per resource (HAR-983).
|
|
1523
|
+
*/
|
|
1524
|
+
declare function SchedulingCalendar({ entries, anchorDate, timeZone, view: controlledView, onViewChange, onAnchorDateChange, onSelectEntry, overlays, onSelectOverlay, filter, renderEntry, locale, weekStartsOn, formatDate, formatInstant: formatInstantProp, maxEntriesPerDay, onShowMore, renderDayBadge, days: dayInfo, dayEntries, spanLayout, windowLaneCap, spanLaneCap, legend, legendCaption, showHeader, notice, emptyNote, onSelectDate, agendaGroups, agendaHeadingLevel, virtualizeAbove, monthDensity, timeGrid, now, canMove, step, onProposeMove, topLaneCrossMidnightMinutes, topLaneCap, maxLanes, resources, resourceSpans, slotMinutes, dayStart, dayEnd, onSelectSlot, selectedSlot, resourceLayout, resourceListBelow, loading, error, onRetry, className, labels: labelOverrides, }: SchedulingCalendarProps): react.JSX.Element;
|
|
1086
1525
|
|
|
1087
1526
|
/**
|
|
1088
1527
|
* Every word the picker renders or announces (TENSOR RX-125, UIX-13). `{start}` and
|
|
@@ -1105,6 +1544,13 @@ interface DateRangePickerLabels {
|
|
|
1105
1544
|
fieldStart: string;
|
|
1106
1545
|
/** Field mode: the trigger's text for a range; `{start}`, `{end}`. */
|
|
1107
1546
|
fieldRange: string;
|
|
1547
|
+
/**
|
|
1548
|
+
* The picker's name: the heading of the inline months, the field's hidden name and its popover's
|
|
1549
|
+
* `aria-label` (HAR-2432). The `label` prop wins.
|
|
1550
|
+
*/
|
|
1551
|
+
label: string;
|
|
1552
|
+
/** Shown when the range is invalid (an end before the start, or `invalid`). The `invalidMessage` prop wins. */
|
|
1553
|
+
invalidMessage: string;
|
|
1108
1554
|
}
|
|
1109
1555
|
declare const DEFAULT_DATE_RANGE_PICKER_LABELS: DateRangePickerLabels;
|
|
1110
1556
|
interface DateRangePickerProps {
|
|
@@ -1116,9 +1562,12 @@ interface DateRangePickerProps {
|
|
|
1116
1562
|
min?: string;
|
|
1117
1563
|
max?: string;
|
|
1118
1564
|
isDateDisabled?: (date: string) => boolean;
|
|
1565
|
+
/** Default: `UixLabelsProvider` `dateFormat.locale`, then the viewer's. */
|
|
1119
1566
|
locale?: string;
|
|
1567
|
+
/** Default: `labels.label` ("Choose date range"). */
|
|
1120
1568
|
label?: string;
|
|
1121
1569
|
invalid?: boolean;
|
|
1570
|
+
/** Default: `labels.invalidMessage`. */
|
|
1122
1571
|
invalidMessage?: string;
|
|
1123
1572
|
disabled?: boolean;
|
|
1124
1573
|
className?: string;
|
|
@@ -1138,7 +1587,7 @@ interface DateRangePickerProps {
|
|
|
1138
1587
|
* bars. It closes once the range has both ends; Escape closes it and returns focus.
|
|
1139
1588
|
*/
|
|
1140
1589
|
mode?: 'inline' | 'field';
|
|
1141
|
-
/** Field mode: how the trigger writes a date. Default: the locale's numeric date. */
|
|
1590
|
+
/** Field mode: how the trigger writes a date. Default: `UixLabelsProvider` `dateFormat.formatDate`, then the locale's numeric date. */
|
|
1142
1591
|
formatDate?: (date: string) => string;
|
|
1143
1592
|
/** Field mode: lands on the trigger, so a `<label htmlFor>` or `<Field>` names it. */
|
|
1144
1593
|
id?: string;
|
|
@@ -1155,7 +1604,82 @@ interface DateRangePickerProps {
|
|
|
1155
1604
|
* Controlled date-range picker using the UIx calendar language: two months inline, or with
|
|
1156
1605
|
* `mode="field"` a form control that opens them in a popover.
|
|
1157
1606
|
*/
|
|
1158
|
-
declare function DateRangePicker({ labels: labelOverrides, ...
|
|
1607
|
+
declare function DateRangePicker({ labels: labelOverrides, ...rest }: DateRangePickerProps): react.JSX.Element;
|
|
1608
|
+
|
|
1609
|
+
/** Every word `TimePicker` renders or announces. */
|
|
1610
|
+
interface TimePickerLabels {
|
|
1611
|
+
/** The list button's name while no time is set. */
|
|
1612
|
+
open: string;
|
|
1613
|
+
/** The list button's name with a time set; `{time}` is the time as the field shows it. */
|
|
1614
|
+
openSelected: string;
|
|
1615
|
+
/** The list of times (the popover's and the listbox's name). */
|
|
1616
|
+
list: string;
|
|
1617
|
+
/** Shown when the typed text is not a time; `{example}` is a time in the field's own shape. */
|
|
1618
|
+
invalidTime: string;
|
|
1619
|
+
/** Shown when the typed time is before `min`; `{min}`. */
|
|
1620
|
+
tooEarly: string;
|
|
1621
|
+
/** Shown when the typed time is after `max`; `{max}`. */
|
|
1622
|
+
tooLate: string;
|
|
1623
|
+
/** Shown when the typed time is outside an overnight range (`min` after `max`); `{min}`, `{max}`. */
|
|
1624
|
+
outside: string;
|
|
1625
|
+
}
|
|
1626
|
+
declare const DEFAULT_TIME_PICKER_LABELS: TimePickerLabels;
|
|
1627
|
+
/** Why typed text was refused: not a time, or a time before `min` / after `max`. */
|
|
1628
|
+
type TimeInputProblem = 'format' | 'early' | 'late' | 'outside';
|
|
1629
|
+
interface TimePickerProps {
|
|
1630
|
+
/** The time as `HH:mm` (24-hour), or `null` for none. */
|
|
1631
|
+
value: string | null;
|
|
1632
|
+
onValueChange: (value: string | null) => void;
|
|
1633
|
+
/** Minutes the arrow keys step the minutes by, and between the times in the list. Default 15. */
|
|
1634
|
+
minuteStep?: number;
|
|
1635
|
+
/**
|
|
1636
|
+
* First and last time that can be chosen (`HH:mm`, inclusive). A `min` after `max` (22:00 to
|
|
1637
|
+
* 06:00) is an overnight range: it wraps round midnight, in the keys, the list and the check.
|
|
1638
|
+
*/
|
|
1639
|
+
min?: string;
|
|
1640
|
+
max?: string;
|
|
1641
|
+
/**
|
|
1642
|
+
* The locale that writes the time: 14:30 in `de`, 2:30 PM in `en-US`. Default: `UixLabelsProvider`
|
|
1643
|
+
* `dateFormat.locale`, then the viewer's.
|
|
1644
|
+
*/
|
|
1645
|
+
locale?: string;
|
|
1646
|
+
/** `true` writes 2:30 PM, `false` 14:30, whatever the locale. */
|
|
1647
|
+
hour12?: boolean;
|
|
1648
|
+
placeholder?: string;
|
|
1649
|
+
size?: 'sm' | 'md';
|
|
1650
|
+
disabled?: boolean;
|
|
1651
|
+
readOnly?: boolean;
|
|
1652
|
+
required?: boolean;
|
|
1653
|
+
invalid?: boolean;
|
|
1654
|
+
/** Submits the `HH:mm` value under this name (a hidden input), whatever the field shows. */
|
|
1655
|
+
name?: string;
|
|
1656
|
+
/** Lands on the text input, so a `<label htmlFor>` or `<Field>` names it. */
|
|
1657
|
+
id?: string;
|
|
1658
|
+
'aria-label'?: string;
|
|
1659
|
+
'aria-labelledby'?: string;
|
|
1660
|
+
'aria-describedby'?: string;
|
|
1661
|
+
'aria-invalid'?: AriaAttributes['aria-invalid'];
|
|
1662
|
+
'aria-required'?: AriaAttributes['aria-required'];
|
|
1663
|
+
/** Where the list opens. Default `'bottom-start'`; it flips and shifts to stay on screen. */
|
|
1664
|
+
placement?: Placement;
|
|
1665
|
+
/** Told when typed text is refused, and `null` once the field is fine again. */
|
|
1666
|
+
onInputProblem?: (problem: TimeInputProblem | null) => void;
|
|
1667
|
+
onOpenChange?: (open: boolean) => void;
|
|
1668
|
+
/** Translatable words; English defaults in {@link DEFAULT_TIME_PICKER_LABELS}. */
|
|
1669
|
+
labels?: Partial<TimePickerLabels>;
|
|
1670
|
+
className?: string;
|
|
1671
|
+
style?: CSSProperties;
|
|
1672
|
+
}
|
|
1673
|
+
/**
|
|
1674
|
+
* A time of day as a form field (HAR-1835), beside `DatePicker`: a text input that shows the time
|
|
1675
|
+
* in the locale's shape (14:30 in German, 2:30 PM in en-US) and reads a typed one (`1430`, `9`,
|
|
1676
|
+
* `2:30 pm`) on Enter and when focus leaves it; a clock button opens the times at `minuteStep` in a
|
|
1677
|
+
* list. ArrowUp / ArrowDown step the part the caret is in (the hour, or the minutes by
|
|
1678
|
+
* `minuteStep`), PageUp / PageDown step the hour, Alt+ArrowDown opens the list. Text that is not a
|
|
1679
|
+
* time, or a time outside `min` / `max`, marks the field invalid, says why and leaves `value` alone.
|
|
1680
|
+
* The value is `HH:mm`, what `<input type="time">` holds.
|
|
1681
|
+
*/
|
|
1682
|
+
declare const TimePicker: react.ForwardRefExoticComponent<TimePickerProps & react.RefAttributes<HTMLInputElement>>;
|
|
1159
1683
|
|
|
1160
1684
|
/** Every word `DatePicker` renders or announces. */
|
|
1161
1685
|
interface DatePickerLabels {
|
|
@@ -1192,6 +1716,8 @@ interface DatePickerProps {
|
|
|
1192
1716
|
/**
|
|
1193
1717
|
* How the field writes a date. Default: the locale's numeric date (22.11.2026, 11/22/2026).
|
|
1194
1718
|
* Pass `parseDate` with it when your format is not three numbers, so typing still works.
|
|
1719
|
+
* `formatDate`, `parseDate`, `locale` and `placeholder` default to `UixLabelsProvider`
|
|
1720
|
+
* `dateFormat`, so one provider sets the format of every date field (HAR-2432).
|
|
1195
1721
|
*/
|
|
1196
1722
|
formatDate?: (date: string) => string;
|
|
1197
1723
|
/** Read typed text into `YYYY-MM-DD`, or `null` when it is not a date. Default: ISO or the locale's order. */
|
|
@@ -1266,14 +1792,18 @@ interface DateTimePickerProps extends Omit<DatePickerProps, 'value' | 'onValueCh
|
|
|
1266
1792
|
timeZone?: string;
|
|
1267
1793
|
/** Text shown instead of the zone's short name ("Vienna time", "UTC+2"); `null` shows none. */
|
|
1268
1794
|
timeZoneLabel?: string | null;
|
|
1269
|
-
/** Minutes
|
|
1795
|
+
/** Minutes the time's arrow keys step by, and between the times in its list. Default 15. */
|
|
1270
1796
|
minuteStep?: number;
|
|
1797
|
+
/** Words of the time field (its list button, list and messages); `UixLabelsProvider` `timePicker` too. */
|
|
1798
|
+
timeLabels?: Partial<TimePickerLabels>;
|
|
1799
|
+
/** `true` writes the time as 2:30 PM, `false` as 14:30, whatever the locale. */
|
|
1800
|
+
hour12?: boolean;
|
|
1271
1801
|
/** The time a date gets when it is chosen before any time. Default `'00:00'`. */
|
|
1272
1802
|
defaultTime?: string;
|
|
1273
1803
|
labels?: Partial<DateTimePickerLabels>;
|
|
1274
1804
|
}
|
|
1275
1805
|
/**
|
|
1276
|
-
* A date and a time as one field (HAR-1383): the {@link DatePicker} and a
|
|
1806
|
+
* A date and a time as one field (HAR-1383): the {@link DatePicker} and a {@link TimePicker} (HAR-1835), with the
|
|
1277
1807
|
* time zone the pair is in shown beside them. The value is `YYYY-MM-DDTHH:mm`, the shape
|
|
1278
1808
|
* `datetime-local` uses, so it replaces that input without changing what a form submits.
|
|
1279
1809
|
* Clearing the date clears the value; a time alone is not a value.
|
|
@@ -1742,6 +2272,12 @@ interface FilterChoice {
|
|
|
1742
2272
|
}
|
|
1743
2273
|
type TextFilterOperator = 'contains' | 'not-contains' | 'is' | 'is-not' | 'starts-with';
|
|
1744
2274
|
type NumberFilterOperator = 'eq' | 'neq' | 'lt' | 'lte' | 'gt' | 'gte' | 'between';
|
|
2275
|
+
/**
|
|
2276
|
+
* A date condition (HAR-1832). `on`, `before` and `after` take one day in `from`; `between` takes
|
|
2277
|
+
* `from` and `to`, both inclusive. "Before" excludes the day and "after" starts the next day:
|
|
2278
|
+
* `dateFilterBounds` turns each into the half-open range a query needs.
|
|
2279
|
+
*/
|
|
2280
|
+
type DateFilterOperator = 'on' | 'before' | 'after' | 'between';
|
|
1745
2281
|
type FilterValue = {
|
|
1746
2282
|
kind: 'enum';
|
|
1747
2283
|
values: string[];
|
|
@@ -1758,12 +2294,24 @@ type FilterValue = {
|
|
|
1758
2294
|
kind: 'date-range';
|
|
1759
2295
|
from?: string;
|
|
1760
2296
|
to?: string;
|
|
2297
|
+
}
|
|
2298
|
+
/** A date with a condition (HAR-1832); `YYYY-MM-DD`. A saved `between` stays `between`, even of one day. */
|
|
2299
|
+
| {
|
|
2300
|
+
kind: 'date';
|
|
2301
|
+
operator: DateFilterOperator;
|
|
2302
|
+
from?: string;
|
|
2303
|
+
to?: string;
|
|
1761
2304
|
} | {
|
|
1762
2305
|
kind: 'boolean';
|
|
1763
2306
|
value?: boolean;
|
|
1764
2307
|
} | {
|
|
1765
2308
|
kind: 'reference';
|
|
1766
2309
|
values: FilterChoice[];
|
|
2310
|
+
}
|
|
2311
|
+
/** Free-text values typed in as tags (HAR-1832), e.g. several hostnames; matched by the product. */
|
|
2312
|
+
| {
|
|
2313
|
+
kind: 'tags';
|
|
2314
|
+
values: string[];
|
|
1767
2315
|
};
|
|
1768
2316
|
type FilterValueKind = FilterValue['kind'];
|
|
1769
2317
|
/**
|
|
@@ -1785,8 +2333,15 @@ interface FilterField {
|
|
|
1785
2333
|
options?: readonly FilterChoice[];
|
|
1786
2334
|
/** `reference`: finds records to pick; rejected promises show the error state. */
|
|
1787
2335
|
onSearch?: (query: string) => Promise<readonly FilterChoice[]>;
|
|
2336
|
+
/**
|
|
2337
|
+
* `reference`: labels for chosen ids that arrived without one (a saved view restores ids).
|
|
2338
|
+
* The editor asks once for every id whose label is missing or equal to the id.
|
|
2339
|
+
*/
|
|
2340
|
+
resolveLabels?: (ids: readonly string[]) => Promise<readonly FilterChoice[]>;
|
|
1788
2341
|
/** `text` / `number`: the operators offered, in order. Default: all of the kind. */
|
|
1789
2342
|
operators?: readonly (TextFilterOperator | NumberFilterOperator)[];
|
|
2343
|
+
/** `date`: the conditions offered, in order. Default: on, before, after, between. */
|
|
2344
|
+
dateOperators?: readonly DateFilterOperator[];
|
|
1790
2345
|
/** `number`: a unit shown after the value, e.g. "days". */
|
|
1791
2346
|
unit?: string;
|
|
1792
2347
|
/** `boolean`: words for true and false, e.g. Escalated / Not escalated. Default from labels. */
|
|
@@ -1813,14 +2368,38 @@ interface FilterSummaryLabels {
|
|
|
1813
2368
|
more: string;
|
|
1814
2369
|
/** An `enum` value equal to a preset: `{label}` (the preset), `{field}`. Default `{label}`. */
|
|
1815
2370
|
preset?: string;
|
|
2371
|
+
/** `date` conditions (HAR-1832), `{date}`. Default "{date}", "before {date}", "after {date}". */
|
|
2372
|
+
on?: string;
|
|
2373
|
+
before?: string;
|
|
2374
|
+
after?: string;
|
|
1816
2375
|
}
|
|
1817
2376
|
declare const DEFAULT_FILTER_SUMMARY_LABELS: FilterSummaryLabels;
|
|
1818
2377
|
declare const TEXT_FILTER_OPERATORS: readonly TextFilterOperator[];
|
|
1819
2378
|
declare const NUMBER_FILTER_OPERATORS: readonly NumberFilterOperator[];
|
|
2379
|
+
declare const DATE_FILTER_OPERATORS: readonly DateFilterOperator[];
|
|
1820
2380
|
/** The empty value for a field kind (what Clear resets to). */
|
|
1821
2381
|
declare function emptyFilterValue(kind: FilterValueKind): FilterValue;
|
|
1822
2382
|
/** True when the value filters nothing (so the chip goes away). */
|
|
1823
2383
|
declare function isFilterEmpty(value: FilterValue | undefined): boolean;
|
|
2384
|
+
/**
|
|
2385
|
+
* The half-open range a `date` filter means, for a query (HAR-1832): `{ from }` is the first day
|
|
2386
|
+
* included, `{ until }` the first day NOT included, either may be missing. "On 5 Oct" is
|
|
2387
|
+
* `[5 Oct, 6 Oct)`, "before 5 Oct" is `[…, 5 Oct)`, "after 5 Oct" is `[6 Oct, …)`, "between 1 and
|
|
2388
|
+
* 5 Oct" is `[1 Oct, 6 Oct)`. A `date-range` value reads as `between` with optional ends. Empty
|
|
2389
|
+
* values give `{}`.
|
|
2390
|
+
*/
|
|
2391
|
+
declare function dateFilterBounds(input: FilterValue | undefined): {
|
|
2392
|
+
from?: string;
|
|
2393
|
+
until?: string;
|
|
2394
|
+
};
|
|
2395
|
+
/** True for a chosen reference whose label is missing or only repeats its id (restored from an id). */
|
|
2396
|
+
declare const isUnresolvedChoice: (choice: FilterChoice) => boolean;
|
|
2397
|
+
/**
|
|
2398
|
+
* Fills in the labels of a `reference` value restored from ids (HAR-1832), with
|
|
2399
|
+
* `field.resolveLabels`. Other values, and values whose labels are all known, come back as they
|
|
2400
|
+
* are. Ids the resolver does not return keep the label they had.
|
|
2401
|
+
*/
|
|
2402
|
+
declare function resolveFilterLabels(field: FilterField, value: FilterValue | undefined): Promise<FilterValue | undefined>;
|
|
1824
2403
|
/**
|
|
1825
2404
|
* The first of `field.presets` whose values equal the value's as a set, or undefined. Only an
|
|
1826
2405
|
* `enum` value can match a preset.
|
|
@@ -1837,10 +2416,10 @@ interface SummarizeFilterOptions {
|
|
|
1837
2416
|
}
|
|
1838
2417
|
/**
|
|
1839
2418
|
* One line for the filter chip, e.g. "State: Open, Pending", "Priority ≥ 2", "Created:
|
|
1840
|
-
* 01.10.2026 – 05.10.2026", "Escalated: Yes". An enum value equal to one of `field.presets`
|
|
2419
|
+
* 01.10.2026 – 05.10.2026", "Created: before 05.10.2026", "Host: db-01, db-02 +1", "Escalated: Yes". An enum value equal to one of `field.presets`
|
|
1841
2420
|
* gives that preset's label (the `preset` label). Empty values give an empty string.
|
|
1842
2421
|
*/
|
|
1843
|
-
declare function summarizeFilter(field: FilterField,
|
|
2422
|
+
declare function summarizeFilter(field: FilterField, input: FilterValue | undefined, options?: SummarizeFilterOptions): string;
|
|
1844
2423
|
|
|
1845
2424
|
interface FilterEditorLabels {
|
|
1846
2425
|
apply: string;
|
|
@@ -1867,7 +2446,15 @@ interface FilterEditorLabels {
|
|
|
1867
2446
|
remove: string;
|
|
1868
2447
|
/** Names the row of `field.presets` chips. Optional so existing label objects still type-check; default "Presets". */
|
|
1869
2448
|
presets?: string;
|
|
2449
|
+
/** `tags` (HAR-1832): the field that takes a new value, and its hint. Optional, like `presets`. */
|
|
2450
|
+
addTag?: string;
|
|
2451
|
+
/** `tags`: how to add one, read with the field. */
|
|
2452
|
+
addTagHint?: string;
|
|
2453
|
+
/** `date` (HAR-1832): the date of on / before / after. Optional, like `presets`. */
|
|
2454
|
+
date?: string;
|
|
1870
2455
|
operators: Record<TextFilterOperator | NumberFilterOperator, string>;
|
|
2456
|
+
/** `date` conditions (HAR-1832). Optional, like `presets`. */
|
|
2457
|
+
dateOperators?: Partial<Record<DateFilterOperator, string>>;
|
|
1871
2458
|
}
|
|
1872
2459
|
declare const DEFAULT_FILTER_EDITOR_LABELS: FilterEditorLabels;
|
|
1873
2460
|
interface FilterEditorProps {
|
|
@@ -1875,7 +2462,12 @@ interface FilterEditorProps {
|
|
|
1875
2462
|
/** Undefined means "not filtered yet". */
|
|
1876
2463
|
value: FilterValue | undefined;
|
|
1877
2464
|
onValueChange: (value: FilterValue) => void;
|
|
1878
|
-
|
|
2465
|
+
/**
|
|
2466
|
+
* Apply the filter: the Apply button, or Enter in any field (HAR-1832). Gets the value to
|
|
2467
|
+
* apply, which already holds a tag still being typed: read it rather than your state, which
|
|
2468
|
+
* has not caught up when Enter applies in the same event.
|
|
2469
|
+
*/
|
|
2470
|
+
onApply: (value: FilterValue) => void;
|
|
1879
2471
|
onClear: () => void;
|
|
1880
2472
|
labels?: Partial<FilterEditorLabels>;
|
|
1881
2473
|
/** Show an option filter above an enum list once it has more options than this. Default 8. */
|
|
@@ -1885,8 +2477,9 @@ interface FilterEditorProps {
|
|
|
1885
2477
|
}
|
|
1886
2478
|
/**
|
|
1887
2479
|
* Editor content for one typed column filter (HAR-1365; TENSOR C6, MOTUS C-1): an enum
|
|
1888
|
-
* multi-select, text or number with a condition, a date range,
|
|
1889
|
-
*
|
|
2480
|
+
* multi-select, text or number with a condition, a date range, a date with a condition
|
|
2481
|
+
* (on / before / after / between), yes/no, free-text tags, or records found by an async search
|
|
2482
|
+
* (restored ids get their labels from `field.resolveLabels`). Enter applies in every kind. The product owns the popover trigger and the query; `summarizeFilter`
|
|
1890
2483
|
* turns the applied value into the chip text. `FilterPopover` stays for the one-string case.
|
|
1891
2484
|
* An enum field's `presets` (HAR-1505) render as toggle chips above its options. Words come
|
|
1892
2485
|
* from `labels`, or from `UixLabelsProvider`'s `filterEditor` entry.
|
|
@@ -1941,7 +2534,8 @@ interface SelectLabels {
|
|
|
1941
2534
|
results: string;
|
|
1942
2535
|
}
|
|
1943
2536
|
interface SelectProps extends Omit<SelectHTMLAttributes<HTMLSelectElement>, 'size'> {
|
|
1944
|
-
|
|
2537
|
+
/** `sm` 28 px, `md` 36 px (default), `lg` 44 px, the public touch-target size (HAR-1812). */
|
|
2538
|
+
size?: 'sm' | 'md' | 'lg';
|
|
1945
2539
|
/** The options as data, instead of `<option>` / `<optgroup>` children. */
|
|
1946
2540
|
options?: readonly (SelectOption | SelectGroup)[];
|
|
1947
2541
|
/**
|
|
@@ -1978,7 +2572,7 @@ interface SelectProps extends Omit<SelectHTMLAttributes<HTMLSelectElement>, 'siz
|
|
|
1978
2572
|
* A select that draws its own list (HAR-1572): the WAI-ARIA APG select-only combobox — focus
|
|
1979
2573
|
* stays on the trigger, `aria-activedescendant` marks the active option — in a top-layer popover
|
|
1980
2574
|
* placed with `useAnchoredPosition`, or a bottom sheet on a phone. A visually hidden native
|
|
1981
|
-
*
|
|
2575
|
+
* select element (the form proxy) carries `name`, `required`, `form`, `multiple` and the value, so `<option>` children,
|
|
1982
2576
|
* `onChange(e)` with `e.target.value`, FormData, `form.reset()`, `ref` and react-hook-form keep
|
|
1983
2577
|
* working; `ref` points at that select.
|
|
1984
2578
|
*/
|
|
@@ -2374,8 +2968,19 @@ interface SearchSuggestProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onCha
|
|
|
2374
2968
|
onValueChange: (value: string) => void;
|
|
2375
2969
|
/** The suggestions to show, best first. The consumer filters; this component only renders. */
|
|
2376
2970
|
options: readonly SearchSuggestOption[];
|
|
2377
|
-
/**
|
|
2378
|
-
|
|
2971
|
+
/**
|
|
2972
|
+
* Called when a row is chosen by click or Enter. The list closes afterwards. Optional with
|
|
2973
|
+
* `freeText`, where choosing a row also puts its title in the field.
|
|
2974
|
+
*/
|
|
2975
|
+
onSelect?: (id: string, option: SearchSuggestOption) => void;
|
|
2976
|
+
/**
|
|
2977
|
+
* A text field with suggestions, not a search (HAR-2465): the value is the text. Enter keeps
|
|
2978
|
+
* what was typed and never submits the surrounding form; no row is picked unless the person
|
|
2979
|
+
* moves to it (ArrowDown / ArrowUp, then Enter) or clicks it, and then its title replaces the
|
|
2980
|
+
* text (`onValueChange`) without submitting either. Blur, Tab and Escape keep the text; while
|
|
2981
|
+
* `loading`, Enter does nothing. No magnifier is drawn.
|
|
2982
|
+
*/
|
|
2983
|
+
freeText?: boolean;
|
|
2379
2984
|
/** Accessible name of the field (there is no visible label; the placeholder is not a label). */
|
|
2380
2985
|
label: string;
|
|
2381
2986
|
placeholder?: string;
|
|
@@ -2434,6 +3039,15 @@ interface SearchSuggestProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onCha
|
|
|
2434
3039
|
inputId?: string;
|
|
2435
3040
|
/** `aria-describedby` of the input (hint and error text from a `Field`). */
|
|
2436
3041
|
inputDescribedBy?: string;
|
|
3042
|
+
/**
|
|
3043
|
+
* Ids of the visible label(s) that name the input (HAR-1834). With them, or with a
|
|
3044
|
+
* `<label for={inputId}>`, the input gets no `aria-label`, so the visible label is its name.
|
|
3045
|
+
*/
|
|
3046
|
+
inputLabelledBy?: string;
|
|
3047
|
+
/** The field cannot be typed in and the list never opens (HAR-1834). */
|
|
3048
|
+
disabled?: boolean;
|
|
3049
|
+
/** Marks the input `aria-invalid` (an empty required field with an error, HAR-1834). */
|
|
3050
|
+
invalid?: boolean;
|
|
2437
3051
|
}
|
|
2438
3052
|
/**
|
|
2439
3053
|
* A search field with a suggestion list underneath: the "search and jump" pattern of Windows
|
|
@@ -2442,7 +3056,7 @@ interface SearchSuggestProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onCha
|
|
|
2442
3056
|
* (`aria-activedescendant`), Enter opens it (the first row when none is active), Escape closes the
|
|
2443
3057
|
* list and a second Escape clears the text.
|
|
2444
3058
|
*/
|
|
2445
|
-
declare function SearchSuggest({ value, onValueChange, options, onSelect, label, placeholder, highlight, heading, headingAction, footer, loading, loadingLabel, empty, idle, note, error, shortcutHint, clearLabel: clearLabelProp, status, size, open: openProp, strategy, onOpenChange, inputRef, autoFocus, name, inputId, inputDescribedBy, className, onBlur, ...props }: SearchSuggestProps): react.JSX.Element;
|
|
3059
|
+
declare function SearchSuggest({ value, onValueChange, options, onSelect, freeText, label, placeholder, highlight, heading, headingAction, footer, loading, loadingLabel, empty, idle, note, error, shortcutHint, clearLabel: clearLabelProp, status, size, open: openProp, strategy, onOpenChange, inputRef, autoFocus, name, inputId, inputDescribedBy, inputLabelledBy, disabled, invalid, className, onBlur, ...props }: SearchSuggestProps): react.JSX.Element;
|
|
2446
3060
|
|
|
2447
3061
|
interface EntityPickerLabels {
|
|
2448
3062
|
/** Accessible name of the search field while picking. */
|
|
@@ -2466,12 +3080,23 @@ interface EntityPickerLabels {
|
|
|
2466
3080
|
more: string;
|
|
2467
3081
|
/** Polite count when there are more matches than shown. `{count}` is the number shown. */
|
|
2468
3082
|
resultsMore: string;
|
|
3083
|
+
/**
|
|
3084
|
+
* Shown, with no Retry, when the search failed for good (HAR-1834): `onSearch` rejected with
|
|
3085
|
+
* `{ retryable: false }` (and no `message`), or `isRetryable` said no. E.g. no permission.
|
|
3086
|
+
*/
|
|
3087
|
+
forbidden: string;
|
|
2469
3088
|
/** Shown in the open list while the query is shorter than `minQueryLength`. `{count}`. */
|
|
2470
3089
|
tooShort: string;
|
|
2471
3090
|
/** The same when `minQueryLength` is 1. */
|
|
2472
3091
|
typeToSearch: string;
|
|
2473
3092
|
}
|
|
2474
3093
|
declare const DEFAULT_ENTITY_PICKER_LABELS: EntityPickerLabels;
|
|
3094
|
+
/** What `onSearch` may reject with when trying again cannot help (HAR-1834). */
|
|
3095
|
+
interface EntityPickerSearchError {
|
|
3096
|
+
retryable: false;
|
|
3097
|
+
/** Shown instead of the `forbidden` words. */
|
|
3098
|
+
message?: string;
|
|
3099
|
+
}
|
|
2475
3100
|
/** What `onSearch` may resolve to when it knows its list was cut off. */
|
|
2476
3101
|
interface EntityPickerSearchResult {
|
|
2477
3102
|
options: readonly SearchSuggestOption[];
|
|
@@ -2485,9 +3110,15 @@ interface EntityPickerProps {
|
|
|
2485
3110
|
/**
|
|
2486
3111
|
* Finds records for the query; a rejection shows the error state with a Retry row. Resolve
|
|
2487
3112
|
* with the options, or with `{ options, hasMore: true }` when the list was cut off (a page of
|
|
2488
|
-
* 20 out of many): the list then says that more match.
|
|
3113
|
+
* 20 out of many): the list then says that more match. Reject with
|
|
3114
|
+
* `{ retryable: false, message? }` (an {@link EntityPickerSearchError}) when trying again
|
|
3115
|
+
* cannot help, e.g. no permission: the error shows without Retry.
|
|
2489
3116
|
*/
|
|
2490
3117
|
onSearch: (query: string) => Promise<readonly SearchSuggestOption[] | EntityPickerSearchResult>;
|
|
3118
|
+
/** Decide from the rejection whether Retry is offered. Default: not for `{ retryable: false }`. */
|
|
3119
|
+
isRetryable?: (error: unknown) => boolean;
|
|
3120
|
+
/** Ids of the visible label that names the search field (instead of `label`). */
|
|
3121
|
+
'aria-labelledby'?: string;
|
|
2491
3122
|
/** The field's name (the visible label usually comes from a surrounding `Field`). */
|
|
2492
3123
|
label: string;
|
|
2493
3124
|
/** Id of the control, for `Field htmlFor`/`label for`. */
|
|
@@ -2518,13 +3149,19 @@ interface EntityPickerProps {
|
|
|
2518
3149
|
* clear ×; choosing again or typing opens a `SearchSuggest` list with loading, empty and error
|
|
2519
3150
|
* states, and Retry is a list row, so the keyboard reaches it. Stale results are ignored.
|
|
2520
3151
|
*/
|
|
2521
|
-
declare function EntityPicker({ value, onValueChange, onSearch, label, id, name, placeholder, minQueryLength, delay, disabled, invalid, 'aria-describedby': describedBy, renderValue, labels: labelOverrides, className, }: EntityPickerProps): react.JSX.Element;
|
|
3152
|
+
declare function EntityPicker({ value, onValueChange, onSearch, isRetryable, label, id, name, placeholder, minQueryLength, delay, disabled, invalid, 'aria-describedby': describedBy, 'aria-labelledby': labelledBy, renderValue, labels: labelOverrides, className, }: EntityPickerProps): react.JSX.Element;
|
|
2522
3153
|
|
|
2523
3154
|
interface TreeNodeData {
|
|
2524
3155
|
id: string;
|
|
2525
3156
|
label: ReactNode;
|
|
2526
3157
|
/** Plain-text label for keyboard typeahead when `label` is not a string (UIX-A11Y-2). */
|
|
2527
3158
|
typeaheadLabel?: string;
|
|
3159
|
+
/**
|
|
3160
|
+
* The row's accessible name when `label` is rich (an avatar, a name and a meta line) and only
|
|
3161
|
+
* part of it should be spoken, e.g. the person's name (HAR-1828). By default a row is named by
|
|
3162
|
+
* its own `label`, never by its children.
|
|
3163
|
+
*/
|
|
3164
|
+
ariaLabel?: string;
|
|
2528
3165
|
icon?: ReactNode;
|
|
2529
3166
|
children?: TreeNodeData[];
|
|
2530
3167
|
/**
|
|
@@ -2558,6 +3195,8 @@ interface TreeNodeProps {
|
|
|
2558
3195
|
rowToggles?: boolean;
|
|
2559
3196
|
/** Ids of nodes whose children are loading (`aria-busy`). */
|
|
2560
3197
|
busy?: ReadonlySet<string>;
|
|
3198
|
+
/** Scopes the ids that name each row by its own label (HAR-1828). Set by `Tree`. */
|
|
3199
|
+
treeId?: string;
|
|
2561
3200
|
}
|
|
2562
3201
|
interface TreeProps extends Omit<HTMLAttributes<HTMLUListElement>, 'onSelect' | 'onChange'> {
|
|
2563
3202
|
nodes: TreeNodeData[];
|
|
@@ -2720,11 +3359,11 @@ declare function OrgChart({ nodes, expanded: controlledExpanded, defaultExpanded
|
|
|
2720
3359
|
|
|
2721
3360
|
/** Every word `InlineEdit` renders or announces. `{label}` is the field's name. */
|
|
2722
3361
|
interface InlineEditLabels {
|
|
2723
|
-
/** Added to the view button's name after the value: "…, Edit {label}". */
|
|
3362
|
+
/** Added to the view button's name after the value: "…, Edit {label}"; the icon trigger's whole name. */
|
|
2724
3363
|
edit: string;
|
|
2725
3364
|
save: string;
|
|
2726
3365
|
cancel: string;
|
|
2727
|
-
/** Polite status while `onSave` runs. */
|
|
3366
|
+
/** Polite status while `onSave` runs (shown after 300 ms, so a fast save does not flash it). */
|
|
2728
3367
|
saving: string;
|
|
2729
3368
|
/** Polite status after a save. */
|
|
2730
3369
|
saved: string;
|
|
@@ -2732,50 +3371,114 @@ interface InlineEditLabels {
|
|
|
2732
3371
|
failed: string;
|
|
2733
3372
|
/** What the view shows when the value is empty and no `placeholder` was given. */
|
|
2734
3373
|
empty: string;
|
|
3374
|
+
/** Visually hidden before a `readOnlyReason`, so it is read as one: "Read-only: …". */
|
|
3375
|
+
readOnly: string;
|
|
2735
3376
|
}
|
|
2736
3377
|
declare const DEFAULT_INLINE_EDIT_LABELS: InlineEditLabels;
|
|
3378
|
+
/** Where an `InlineEdit` is (HAR-1833). `saved` holds until the field is opened again. */
|
|
3379
|
+
type InlineEditState = 'idle' | 'editing' | 'saving' | 'saved' | 'error';
|
|
2737
3380
|
/** What a custom editor receives. Spread the field props onto your control. */
|
|
2738
|
-
interface InlineEditEditorProps {
|
|
3381
|
+
interface InlineEditEditorProps<T = string> {
|
|
2739
3382
|
/** The draft. */
|
|
2740
|
-
value:
|
|
2741
|
-
|
|
2742
|
-
|
|
2743
|
-
|
|
3383
|
+
value: T;
|
|
3384
|
+
/** Change the draft. With `commit="change"` this also saves it. Ignored while a save runs. */
|
|
3385
|
+
onChange: (next: T) => void;
|
|
3386
|
+
/**
|
|
3387
|
+
* Save the draft (what Enter does in the default editor). Pass the value to save one you
|
|
3388
|
+
* just chose: `save(next)` does not wait for the draft to update, so it never saves a stale one.
|
|
3389
|
+
*/
|
|
3390
|
+
save: (next?: T) => void;
|
|
2744
3391
|
cancel: () => void;
|
|
2745
|
-
/** `id`, the accessible name, the error wiring and
|
|
3392
|
+
/** `id`, the accessible name, the error wiring, and the busy state while saving. */
|
|
2746
3393
|
field: {
|
|
2747
3394
|
id: string;
|
|
2748
3395
|
'aria-label': string;
|
|
2749
3396
|
'aria-describedby': string | undefined;
|
|
2750
3397
|
'aria-invalid': true | undefined;
|
|
3398
|
+
/** True once a save has run for 300 ms (changes are ignored from its start, so a fast save never greys the control). */
|
|
2751
3399
|
disabled: boolean;
|
|
3400
|
+
/** The same moment as `disabled`, for a text control that should keep focus and its text selectable. */
|
|
3401
|
+
readOnly: boolean;
|
|
2752
3402
|
};
|
|
2753
3403
|
}
|
|
2754
|
-
|
|
3404
|
+
/** What `renderError` receives besides the rejection itself. */
|
|
3405
|
+
interface InlineEditErrorContext<T = string> {
|
|
3406
|
+
/** The rejection's message, else `labels.failed`: what the default rendering shows. */
|
|
3407
|
+
message: ReactNode;
|
|
3408
|
+
/** The draft that failed. */
|
|
3409
|
+
draft: T;
|
|
3410
|
+
/** Send the draft again. Show it when a retry can help (a timeout, not a refusal). */
|
|
3411
|
+
retry: () => void;
|
|
3412
|
+
/** Close the editor and drop the draft, e.g. after "Reload latest" on a version conflict. */
|
|
3413
|
+
cancel: () => void;
|
|
3414
|
+
}
|
|
3415
|
+
interface InlineEditProps<T = string> {
|
|
2755
3416
|
/** The saved value. */
|
|
2756
|
-
value:
|
|
3417
|
+
value: T;
|
|
2757
3418
|
/**
|
|
2758
3419
|
* Save the new value. Return a promise to show the pending state; a rejection keeps the
|
|
2759
3420
|
* editor open with the error under it (the rejection's message, else `labels.failed`).
|
|
3421
|
+
* The editor waits for it: the value shows as saved only once it resolves.
|
|
2760
3422
|
*/
|
|
2761
|
-
onSave: (next:
|
|
3423
|
+
onSave: (next: T) => void | Promise<unknown>;
|
|
2762
3424
|
/** The field's name: "Title", "Due date". It names the edit button and the editor. */
|
|
2763
3425
|
label: string;
|
|
2764
|
-
/**
|
|
2765
|
-
|
|
3426
|
+
/**
|
|
3427
|
+
* How the saved value shows. Default: the text itself (`String(value)`); pass it for any
|
|
3428
|
+
* value that is not a string (an option, a person, a time window).
|
|
3429
|
+
*/
|
|
3430
|
+
renderView?: (value: T) => ReactNode;
|
|
2766
3431
|
/**
|
|
2767
3432
|
* A custom editor: a `Select`, a `Combobox`, a date field. Spread `field` onto the control.
|
|
2768
|
-
* Default: an `Input`, or a `Textarea` with `multiline
|
|
3433
|
+
* Default: an `Input`, or a `Textarea` with `multiline` (string values only).
|
|
2769
3434
|
*/
|
|
2770
|
-
renderEditor?: (props: InlineEditEditorProps) => ReactNode;
|
|
3435
|
+
renderEditor?: (props: InlineEditEditorProps<T>) => ReactNode;
|
|
2771
3436
|
/** Edit in a textarea: Enter adds a line, Ctrl/⌘+Enter saves. */
|
|
2772
3437
|
multiline?: boolean;
|
|
2773
3438
|
/** Return a message to refuse the draft; nothing is saved while it returns one. */
|
|
2774
|
-
validate?: (next:
|
|
3439
|
+
validate?: (next: T) => ReactNode | undefined;
|
|
3440
|
+
/** Whether two values are the same (an unchanged draft saves nothing). Default `Object.is`. */
|
|
3441
|
+
equals?: (a: T, b: T) => boolean;
|
|
3442
|
+
/** Whether a value counts as empty (the view then shows `placeholder`). Default: `null`, `undefined` or `''`. */
|
|
3443
|
+
isEmpty?: (value: T) => boolean;
|
|
3444
|
+
/**
|
|
3445
|
+
* When the draft is saved (HAR-1833).
|
|
3446
|
+
* `'explicit'` (default): Enter or Save only; leaving the field keeps the draft open.
|
|
3447
|
+
* `'blur'`: also when focus leaves the editor (text fields of a record).
|
|
3448
|
+
* `'change'`: as soon as the editor reports a change (a select, a toggle, a date), with no
|
|
3449
|
+
* Save button; leaving it unchanged closes it.
|
|
3450
|
+
*/
|
|
3451
|
+
commit?: 'explicit' | 'blur' | 'change';
|
|
2775
3452
|
/** Shown in the view while the value is empty, e.g. "Add a description". */
|
|
2776
3453
|
placeholder?: ReactNode;
|
|
2777
|
-
/** Read-only: the value shows as plain text, with no edit
|
|
3454
|
+
/** Read-only: the value shows as plain text, with no edit control. */
|
|
2778
3455
|
disabled?: boolean;
|
|
3456
|
+
/**
|
|
3457
|
+
* Why the field cannot be edited here ("Set by the integration"). Makes it read-only and
|
|
3458
|
+
* shows the reason under the value, which is described by it.
|
|
3459
|
+
*/
|
|
3460
|
+
readOnlyReason?: ReactNode;
|
|
3461
|
+
/**
|
|
3462
|
+
* `'value'` (default): the whole value is the button, named "{value}, Edit {label}".
|
|
3463
|
+
* `'icon'`: the value is plain text and a pencil button after it is named only "Edit {label}"
|
|
3464
|
+
* (for a value that is itself a link, a chip or long text).
|
|
3465
|
+
*/
|
|
3466
|
+
trigger?: 'value' | 'icon';
|
|
3467
|
+
/** Controlled open state, e.g. one field of a record open at a time. */
|
|
3468
|
+
editing?: boolean;
|
|
3469
|
+
/** Called when the field asks to open (`true`) or close (`false`). */
|
|
3470
|
+
onEditingChange?: (editing: boolean) => void;
|
|
3471
|
+
/** Controlled draft, e.g. to report unsaved input. Reset to `value` on open. */
|
|
3472
|
+
draft?: T;
|
|
3473
|
+
/** Called with every change of the draft, and with `value` when the field opens. */
|
|
3474
|
+
onDraftChange?: (draft: T) => void;
|
|
3475
|
+
/**
|
|
3476
|
+
* Renders a failed save under the editor, in place of the message: a Try again button that
|
|
3477
|
+
* calls `retry`, or a Reload latest after a version conflict.
|
|
3478
|
+
*/
|
|
3479
|
+
renderError?: (error: unknown, context: InlineEditErrorContext<T>) => ReactNode;
|
|
3480
|
+
/** Called on every change of `InlineEditState`. */
|
|
3481
|
+
onStateChange?: (state: InlineEditState) => void;
|
|
2779
3482
|
/** Each word defaults to `UixLabelsProvider` `inlineEdit`, then to English. */
|
|
2780
3483
|
labels?: Partial<InlineEditLabels>;
|
|
2781
3484
|
className?: string;
|
|
@@ -2784,9 +3487,12 @@ interface InlineEditProps {
|
|
|
2784
3487
|
* A value that is edited in place (HAR-1381; TENSOR C16 `editable-record.tsx`): the value is
|
|
2785
3488
|
* a button that says what it edits; activating it swaps in an editor with Save and Cancel.
|
|
2786
3489
|
* Enter saves and Escape cancels; while `onSave` runs the editor is busy; a failed save keeps
|
|
2787
|
-
* the draft and shows why; afterwards focus is back on the value
|
|
3490
|
+
* the draft and shows why; afterwards focus is back on the value, which shows what was saved
|
|
3491
|
+
* until `value` catches up. HAR-1833: any value type (`equals`, `renderView`, `renderEditor`),
|
|
3492
|
+
* saving on blur or on change (`commit`), controllable `editing` and `draft`, `renderError`
|
|
3493
|
+
* with retry, `onStateChange`, an icon trigger, and a `readOnlyReason`.
|
|
2788
3494
|
*/
|
|
2789
|
-
declare function InlineEdit({ value, onSave, label, renderView, renderEditor, multiline, validate, placeholder, disabled, labels: labelOverrides, className, }: InlineEditProps): react.JSX.Element;
|
|
3495
|
+
declare function InlineEdit<T = string>({ value, onSave, label, renderView, renderEditor, multiline, validate, equals, isEmpty, commit, placeholder, disabled, readOnlyReason, trigger, editing: editingProp, onEditingChange, draft: draftProp, onDraftChange, renderError, onStateChange, labels: labelOverrides, className, }: InlineEditProps<T>): react.JSX.Element;
|
|
2790
3496
|
|
|
2791
3497
|
/** The words of the "Discard changes?" step a `dirty` Drawer or Modal asks before it closes (HAR-2029). */
|
|
2792
3498
|
interface DiscardPromptLabels {
|
|
@@ -2874,39 +3580,1542 @@ interface SearchBarProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onSubmit'
|
|
|
2874
3580
|
*/
|
|
2875
3581
|
declare function SearchBar({ label, value: valueProp, defaultValue, onValueChange, onSubmit, onClear, placeholder, size, submitButton, submitVariant, landmark, inputDescribedBy, labels: labelsProp, name, inputId, inputRef, autoFocus, disabled, className, ...props }: SearchBarProps): react.JSX.Element;
|
|
2876
3582
|
|
|
3583
|
+
interface LightboxItem {
|
|
3584
|
+
src: string;
|
|
3585
|
+
/** Alternative text for an image; the video's name for a video. */
|
|
3586
|
+
alt: string;
|
|
3587
|
+
caption?: ReactNode;
|
|
3588
|
+
kind?: 'image' | 'video';
|
|
3589
|
+
/** Intrinsic size, so an SVG or a slow image keeps its box. */
|
|
3590
|
+
width?: number;
|
|
3591
|
+
height?: number;
|
|
3592
|
+
}
|
|
3593
|
+
interface LightboxLabels {
|
|
3594
|
+
region: string;
|
|
3595
|
+
previous: string;
|
|
3596
|
+
next: string;
|
|
3597
|
+
close: string;
|
|
3598
|
+
/** `{index}`, `{total}`. */
|
|
3599
|
+
counter: string;
|
|
3600
|
+
zoomIn: string;
|
|
3601
|
+
zoomOut: string;
|
|
3602
|
+
}
|
|
3603
|
+
declare const DEFAULT_LIGHTBOX_LABELS: LightboxLabels;
|
|
3604
|
+
/** What `renderOverlay` receives (HAR-1826). */
|
|
3605
|
+
interface LightboxOverlayContext {
|
|
3606
|
+
/** The item on show (0-based) and the item itself. */
|
|
3607
|
+
index: number;
|
|
3608
|
+
item: LightboxItem;
|
|
3609
|
+
/** The rendered `<img>` or `<video>`; `naturalWidth` / `videoWidth` give the bitmap size. */
|
|
3610
|
+
media: HTMLImageElement | HTMLVideoElement | null;
|
|
3611
|
+
/**
|
|
3612
|
+
* The overlay's size in CSS pixels. The overlay covers exactly the picture (not the letterbox
|
|
3613
|
+
* around a fitted one), so a point at `(x, y)` in it is bitmap pixel
|
|
3614
|
+
* `(x / width * naturalWidth, y / height * naturalHeight)`. 0 until the media has loaded.
|
|
3615
|
+
*/
|
|
3616
|
+
width: number;
|
|
3617
|
+
height: number;
|
|
3618
|
+
}
|
|
3619
|
+
interface LightboxProps {
|
|
3620
|
+
items: readonly LightboxItem[];
|
|
3621
|
+
/** The item on show (0-based). */
|
|
3622
|
+
index: number;
|
|
3623
|
+
onIndexChange: (index: number) => void;
|
|
3624
|
+
open: boolean;
|
|
3625
|
+
onClose: () => void;
|
|
3626
|
+
/** Wrap from the last item to the first. Default false. */
|
|
3627
|
+
loop?: boolean;
|
|
3628
|
+
labels?: Partial<LightboxLabels>;
|
|
3629
|
+
className?: string;
|
|
3630
|
+
/**
|
|
3631
|
+
* Buttons for the toolbar beside Close (HAR-1826), e.g. "Hide area" and "Undo" on a viewer
|
|
3632
|
+
* that redacts a screenshot. Tab order: these, then Close. They sit inside the dialog.
|
|
3633
|
+
*/
|
|
3634
|
+
actions?: ReactNode;
|
|
3635
|
+
/**
|
|
3636
|
+
* Content laid over the picture, in the picture's own box: it moves and scales with the
|
|
3637
|
+
* fit / actual-size toggle. Pointer events on it never swipe or page, so it can draw. Each
|
|
3638
|
+
* child positions itself (`position: absolute` in `%`, or px of `width` / `height`).
|
|
3639
|
+
*/
|
|
3640
|
+
renderOverlay?: (context: LightboxOverlayContext) => ReactNode;
|
|
3641
|
+
/**
|
|
3642
|
+
* Runs first for every key in the viewer. Call `event.preventDefault()` to claim the key:
|
|
3643
|
+
* the viewer then neither pages (arrows, Home, End) nor closes (Escape). For a draft that
|
|
3644
|
+
* arrow keys move and Escape cancels.
|
|
3645
|
+
*/
|
|
3646
|
+
onKeyDown?: (event: KeyboardEvent$1<HTMLDialogElement>) => void;
|
|
3647
|
+
/** Escape only: `event.preventDefault()` keeps the viewer open. */
|
|
3648
|
+
onEscapeKeyDown?: (event: KeyboardEvent$1<HTMLDialogElement>) => void;
|
|
3649
|
+
}
|
|
2877
3650
|
/**
|
|
2878
|
-
*
|
|
2879
|
-
*
|
|
2880
|
-
*
|
|
2881
|
-
*
|
|
2882
|
-
*
|
|
2883
|
-
*
|
|
2884
|
-
* on the server.
|
|
3651
|
+
* A full-screen media viewer over `.uix-lightbox` (HAR-1367; TENSOR C12 `capture-viewer.tsx`,
|
|
3652
|
+
* MOTUS C-8 programme gallery): previous/next buttons, ←/→ and Home/End, swipe on touch, an
|
|
3653
|
+
* announced "n of total" counter (not for a single item), a caption, and a fit/actual-size
|
|
3654
|
+
* toggle. Native `<dialog>`, so focus stays inside and Escape closes; focus returns to the
|
|
3655
|
+
* control that opened it. An annotating viewer (HAR-1826) adds toolbar `actions`, draws in
|
|
3656
|
+
* `renderOverlay`, and claims Escape and the arrows with `onKeyDown` while a draft is open.
|
|
2885
3657
|
*/
|
|
2886
|
-
|
|
2887
|
-
|
|
2888
|
-
|
|
2889
|
-
|
|
2890
|
-
|
|
2891
|
-
|
|
2892
|
-
|
|
2893
|
-
|
|
2894
|
-
|
|
2895
|
-
|
|
2896
|
-
|
|
2897
|
-
|
|
2898
|
-
|
|
2899
|
-
|
|
2900
|
-
|
|
2901
|
-
|
|
3658
|
+
declare function Lightbox({ items, index, onIndexChange, open, onClose, loop, labels: labelOverrides, className, actions, renderOverlay, onKeyDown: onKeyDownProp, onEscapeKeyDown, }: LightboxProps): react.JSX.Element;
|
|
3659
|
+
|
|
3660
|
+
/** Every word `SortableList` renders or announces. `{label}` is the row's name. */
|
|
3661
|
+
interface SortableListLabels {
|
|
3662
|
+
/** The drag grip's name. */
|
|
3663
|
+
grip: string;
|
|
3664
|
+
moveUp: string;
|
|
3665
|
+
moveDown: string;
|
|
3666
|
+
/** Polite announcement after a move: `{label}`, `{position}`, `{count}`. */
|
|
3667
|
+
moved: string;
|
|
3668
|
+
}
|
|
3669
|
+
declare const DEFAULT_SORTABLE_LIST_LABELS: SortableListLabels;
|
|
3670
|
+
/** What `renderItem` receives besides the item. */
|
|
3671
|
+
interface SortableListItemContext {
|
|
3672
|
+
index: number;
|
|
3673
|
+
count: number;
|
|
3674
|
+
/** This row is being dragged. */
|
|
3675
|
+
dragging: boolean;
|
|
3676
|
+
}
|
|
3677
|
+
interface SortableListProps<T> extends Omit<HTMLAttributes<HTMLUListElement>, 'children' | 'onChange'> {
|
|
3678
|
+
items: readonly T[];
|
|
3679
|
+
getId: (item: T) => string;
|
|
3680
|
+
/** The row's name in the grip, the move buttons and the announcement. Default: its id. */
|
|
3681
|
+
getLabel?: (item: T) => string;
|
|
3682
|
+
renderItem: (item: T, context: SortableListItemContext) => ReactNode;
|
|
3683
|
+
/** Called with the full new order of ids after each keyboard move, and once when a drag ends. */
|
|
3684
|
+
onReorder: (orderedIds: string[]) => void;
|
|
3685
|
+
/** Rows show no grip and no move buttons. */
|
|
3686
|
+
disabled?: boolean;
|
|
3687
|
+
/** Each word defaults to `UixLabelsProvider` `sortableList`, then to English. */
|
|
3688
|
+
labels?: Partial<SortableListLabels>;
|
|
3689
|
+
}
|
|
3690
|
+
/**
|
|
3691
|
+
* A list the person reorders (HAR-1375; MOTUS C-16 photo order, TENSOR preset and start-page
|
|
3692
|
+
* order): media, priorities, steps. Each row has a grip to drag with a pointer, and Move up /
|
|
3693
|
+
* Move down buttons that are always there (a drag is never the only way). With focus anywhere
|
|
3694
|
+
* in a row, Alt+↑ / Alt+↓ move it; a focused grip moves with ↑ / ↓ alone. Focus stays with the
|
|
3695
|
+
* moved row, and a polite status says where it went. Keyboard moves are instant; a drag places
|
|
3696
|
+
* the row under the pointer with no animation. Shares its order model with `ViewMenu`,
|
|
3697
|
+
* `SavedViewMenu` and `NavFavourites`.
|
|
3698
|
+
*/
|
|
3699
|
+
declare function SortableList<T>({ items, getId, getLabel, renderItem, onReorder, disabled, labels: labelOverrides, className, ...props }: SortableListProps<T>): react.JSX.Element;
|
|
3700
|
+
|
|
3701
|
+
type DiffKind = 'added' | 'removed' | 'changed' | 'conflicted';
|
|
3702
|
+
type DiffResolution = 'accept' | 'skip' | 'pending';
|
|
3703
|
+
interface DiffEntry {
|
|
3704
|
+
path: string;
|
|
3705
|
+
kind: DiffKind;
|
|
3706
|
+
base?: JsonValue;
|
|
3707
|
+
current?: JsonValue;
|
|
3708
|
+
incoming?: JsonValue;
|
|
3709
|
+
}
|
|
3710
|
+
interface DiffSummary {
|
|
3711
|
+
added: number;
|
|
3712
|
+
removed: number;
|
|
3713
|
+
changed: number;
|
|
3714
|
+
conflicted: number;
|
|
3715
|
+
resolved: number;
|
|
3716
|
+
pending: number;
|
|
3717
|
+
}
|
|
3718
|
+
declare function buildThreeWayDiff(base: JsonValue | undefined, current: JsonValue | undefined, incoming: JsonValue | undefined, path?: string): DiffEntry[];
|
|
3719
|
+
declare function summarizeDiff(entries: DiffEntry[], resolutions?: Record<string, DiffResolution>): DiffSummary;
|
|
3720
|
+
|
|
3721
|
+
/**
|
|
3722
|
+
* Every word the diff viewer renders (TENSOR RX-125, UIX-12). `base` / `current` /
|
|
3723
|
+
* `incoming` keep their meaning from before; `{path}`, `{version}`, `{resolved}` and
|
|
3724
|
+
* `{total}` are placeholders.
|
|
3725
|
+
*
|
|
3726
|
+
* `acceptIncomingFor` / `keepCurrentFor` / `markPendingFor` are the accessible names of
|
|
3727
|
+
* the three action buttons, so a screen reader hears which entry each one resolves. Keep
|
|
3728
|
+
* the visible word inside the translated name (WCAG 2.5.3 Label in Name): speech-input
|
|
3729
|
+
* users say what they see.
|
|
3730
|
+
*/
|
|
3731
|
+
interface DiffViewerLabels {
|
|
3732
|
+
base: string;
|
|
3733
|
+
current: string;
|
|
3734
|
+
incoming: string;
|
|
3735
|
+
region: string;
|
|
3736
|
+
summary: string;
|
|
3737
|
+
noDifferences: string;
|
|
3738
|
+
noDifferencesDetail: string;
|
|
3739
|
+
conflicted: string;
|
|
3740
|
+
changed: string;
|
|
3741
|
+
added: string;
|
|
3742
|
+
removed: string;
|
|
3743
|
+
resolved: string;
|
|
3744
|
+
pending: string;
|
|
3745
|
+
valueFor: string;
|
|
3746
|
+
resolve: string;
|
|
3747
|
+
acceptIncoming: string;
|
|
3748
|
+
keepCurrent: string;
|
|
3749
|
+
markPending: string;
|
|
3750
|
+
acceptIncomingFor: string;
|
|
3751
|
+
keepCurrentFor: string;
|
|
3752
|
+
markPendingFor: string;
|
|
3753
|
+
resolutionAccept: string;
|
|
3754
|
+
resolutionSkip: string;
|
|
3755
|
+
resolutionPending: string;
|
|
3756
|
+
notPresent: string;
|
|
3757
|
+
progress: string;
|
|
3758
|
+
}
|
|
3759
|
+
declare const DEFAULT_DIFF_VIEWER_LABELS: DiffViewerLabels;
|
|
3760
|
+
interface DiffViewerProps {
|
|
3761
|
+
base?: JsonValue;
|
|
3762
|
+
current?: JsonValue;
|
|
3763
|
+
incoming?: JsonValue;
|
|
3764
|
+
entries?: DiffEntry[];
|
|
3765
|
+
resolutions?: Record<string, DiffResolution>;
|
|
3766
|
+
onResolutionChange?: (path: string, resolution: DiffResolution) => void;
|
|
3767
|
+
labels?: Partial<DiffViewerLabels>;
|
|
3768
|
+
/**
|
|
3769
|
+
* Height of the resolution buttons and the entry disclosure rows. `sm` (the default) is
|
|
3770
|
+
* the compact 28px kit size; `md` follows `--uix-control-h`, so a theme that sets its
|
|
3771
|
+
* own control height (for example 60px touch targets) gets it here too; `lg` is 44px.
|
|
3772
|
+
*/
|
|
3773
|
+
controlSize?: 'sm' | 'md' | 'lg';
|
|
3774
|
+
className?: string;
|
|
3775
|
+
/**
|
|
3776
|
+
* The name of an entry for people (HAR-1369): "First author" for `$.authors[0].name`. Shown
|
|
3777
|
+
* instead of the path; a string also names the entry's regions and buttons (anything else
|
|
3778
|
+
* leaves the path there). Default: the path.
|
|
3779
|
+
*/
|
|
3780
|
+
labelFor?: (path: string) => ReactNode;
|
|
3781
|
+
/**
|
|
3782
|
+
* How a value shows: a name, a date, a chip, instead of `JSON.stringify`. `undefined` is a
|
|
3783
|
+
* value that is not there in that version. Default: the JSON, or `labels.notPresent`.
|
|
3784
|
+
*/
|
|
3785
|
+
renderValue?: (value: JsonValue | undefined, path: string, side: DiffSide) => ReactNode;
|
|
3786
|
+
/** Where a version's value came from, shown under it ("Edited by Ana, 12 Oct"). Nothing for none. */
|
|
3787
|
+
provenance?: (path: string, side: DiffSide) => ReactNode;
|
|
3788
|
+
}
|
|
3789
|
+
/** One of the three versions a `DiffViewer` entry compares. */
|
|
3790
|
+
type DiffSide = 'base' | 'current' | 'incoming';
|
|
3791
|
+
/**
|
|
3792
|
+
* Three-way configuration diff with per-entry keyboard-operable resolution. For people who do
|
|
3793
|
+
* not read JSON paths (HAR-1369, MOTUS B-A9): `labelFor` names an entry, `renderValue` shows a
|
|
3794
|
+
* value as a name, a date or a chip, and `provenance` says where each version came from.
|
|
3795
|
+
*/
|
|
3796
|
+
declare function DiffViewer({ base, current, incoming, entries: providedEntries, resolutions: controlledResolutions, onResolutionChange, labels: labelOverrides, controlSize, className, labelFor, renderValue, provenance, }: DiffViewerProps): react.JSX.Element;
|
|
3797
|
+
|
|
3798
|
+
interface MatchReviewField {
|
|
3799
|
+
id: string;
|
|
3800
|
+
label: string;
|
|
3801
|
+
render?: (value: JsonValue | undefined, record: Record<string, JsonValue>) => ReactNode;
|
|
3802
|
+
}
|
|
3803
|
+
interface MatchReviewCandidate {
|
|
3804
|
+
id: string;
|
|
3805
|
+
record: Record<string, JsonValue>;
|
|
3806
|
+
confidence?: number;
|
|
3807
|
+
status?: 'pending' | 'resolved';
|
|
3808
|
+
decision?: 'accepted' | 'dismissed' | 'split' | 'other';
|
|
3809
|
+
}
|
|
3810
|
+
type MatchReviewAction = 'accept' | 'dismiss' | 'split' | 'pick-other';
|
|
3811
|
+
interface MatchBulkResult {
|
|
3812
|
+
succeeded: number;
|
|
3813
|
+
failed?: number;
|
|
3814
|
+
}
|
|
3815
|
+
/**
|
|
3816
|
+
* Every word the match review renders or announces (TENSOR RX-125, UIX-12). Plural
|
|
3817
|
+
* pairs are `…One` / `…Many`; `{count}`, `{pending}`, `{total}`, `{id}` are placeholders.
|
|
3818
|
+
*/
|
|
3819
|
+
interface MatchReviewLabels {
|
|
3820
|
+
region: string;
|
|
3821
|
+
loading: string;
|
|
3822
|
+
retry: string;
|
|
3823
|
+
empty: string;
|
|
3824
|
+
emptyDetail: string;
|
|
3825
|
+
pendingOf: string;
|
|
3826
|
+
bulk: string;
|
|
3827
|
+
selectedCount: string;
|
|
3828
|
+
applying: string;
|
|
3829
|
+
acceptSelected: string;
|
|
3830
|
+
dismissSelected: string;
|
|
3831
|
+
caption: string;
|
|
3832
|
+
select: string;
|
|
3833
|
+
confidence: string;
|
|
3834
|
+
status: string;
|
|
3835
|
+
actions: string;
|
|
3836
|
+
selectCandidate: string;
|
|
3837
|
+
notScored: string;
|
|
3838
|
+
resolved: string;
|
|
3839
|
+
pending: string;
|
|
3840
|
+
decisionAccepted: string;
|
|
3841
|
+
decisionDismissed: string;
|
|
3842
|
+
decisionSplit: string;
|
|
3843
|
+
decisionOther: string;
|
|
3844
|
+
accept: string;
|
|
3845
|
+
dismiss: string;
|
|
3846
|
+
split: string;
|
|
3847
|
+
pickOther: string;
|
|
3848
|
+
acceptingOne: string;
|
|
3849
|
+
acceptingMany: string;
|
|
3850
|
+
dismissingOne: string;
|
|
3851
|
+
dismissingMany: string;
|
|
3852
|
+
acceptedOne: string;
|
|
3853
|
+
acceptedMany: string;
|
|
3854
|
+
dismissedOne: string;
|
|
3855
|
+
dismissedMany: string;
|
|
3856
|
+
failedSuffix: string;
|
|
3857
|
+
bulkAcceptFailed: string;
|
|
3858
|
+
bulkDismissFailed: string;
|
|
3859
|
+
/** Adopt mode (HAR-1369): a candidate's heading when `candidateLabel` gives none. `{id}`. */
|
|
3860
|
+
candidate: string;
|
|
3861
|
+
/** Adopt mode: the compare table's caption. `{candidate}`. */
|
|
3862
|
+
compareCaption: string;
|
|
3863
|
+
field: string;
|
|
3864
|
+
/** Adopt mode: the column of the record as it is now. */
|
|
3865
|
+
currentValue: string;
|
|
3866
|
+
/** Adopt mode: the column of the candidate's values. */
|
|
3867
|
+
candidateValue: string;
|
|
3868
|
+
/** Adopt mode: the column of checkboxes. */
|
|
3869
|
+
adopt: string;
|
|
3870
|
+
/** Adopt mode: one checkbox's name. `{field}`, `{candidate}`. */
|
|
3871
|
+
adoptField: string;
|
|
3872
|
+
/** Adopt mode: shown instead of a checkbox when the candidate has the same value. */
|
|
3873
|
+
same: string;
|
|
3874
|
+
/** Adopt mode: the button with one field chosen. `{count}`. */
|
|
3875
|
+
adoptSelectedOne: string;
|
|
3876
|
+
/** Adopt mode: the button with any other number of fields chosen (0 too). `{count}`. */
|
|
3877
|
+
adoptSelectedMany: string;
|
|
3878
|
+
/** Adopt mode: the provenance disclosure. */
|
|
3879
|
+
provenance: string;
|
|
3880
|
+
/** Adopt mode: announced after `onAdopt` resolves, one field. `{count}`, `{candidate}`. */
|
|
3881
|
+
adoptedOne: string;
|
|
3882
|
+
/** Adopt mode: announced after `onAdopt` resolves, more fields. `{count}`, `{candidate}`. */
|
|
3883
|
+
adoptedMany: string;
|
|
3884
|
+
/** Adopt mode: shown when `onAdopt` rejects. */
|
|
3885
|
+
adoptFailed: string;
|
|
3886
|
+
}
|
|
3887
|
+
declare const DEFAULT_MATCH_REVIEW_LABELS: MatchReviewLabels;
|
|
3888
|
+
interface MatchReviewProps {
|
|
3889
|
+
incoming: Record<string, JsonValue>;
|
|
3890
|
+
incomingLabel?: string;
|
|
3891
|
+
fields: MatchReviewField[];
|
|
3892
|
+
candidates: MatchReviewCandidate[];
|
|
3893
|
+
selectedIds?: Set<string>;
|
|
3894
|
+
onSelectionChange?: (ids: Set<string>) => void;
|
|
3895
|
+
onDecision: (candidateId: string, action: MatchReviewAction) => void;
|
|
3896
|
+
onBulkDecision?: (candidateIds: string[], action: Extract<MatchReviewAction, 'accept' | 'dismiss'>) => void | MatchBulkResult | Promise<void | MatchBulkResult>;
|
|
3897
|
+
loading?: boolean;
|
|
3898
|
+
error?: string;
|
|
3899
|
+
onRetry?: () => void;
|
|
3900
|
+
className?: string;
|
|
3901
|
+
labels?: Partial<MatchReviewLabels>;
|
|
3902
|
+
/**
|
|
3903
|
+
* `decide` (default): one row per candidate, decided as a whole. `adopt` (HAR-1369, MOTUS B-A9
|
|
3904
|
+
* registry candidates): per candidate a table of the record now against the candidate, field
|
|
3905
|
+
* by field, a checkbox per field that differs, and an Adopt button that calls `onAdopt`.
|
|
3906
|
+
*/
|
|
3907
|
+
fieldMode?: 'decide' | 'adopt';
|
|
3908
|
+
/** Adopt mode: take the chosen fields from the candidate. A promise keeps the button busy until it settles. */
|
|
3909
|
+
onAdopt?: (candidateId: string, fieldIds: string[]) => void | Promise<unknown>;
|
|
3910
|
+
/** Adopt mode: the candidate's heading, e.g. its source ("DNB", "Wikidata"). Default `labels.candidate`. */
|
|
3911
|
+
candidateLabel?: (candidate: MatchReviewCandidate) => ReactNode;
|
|
3912
|
+
/** Adopt mode: where a candidate comes from, in a disclosure under its table (source, retrieved, match reason). */
|
|
3913
|
+
provenance?: (candidate: MatchReviewCandidate) => ReactNode;
|
|
3914
|
+
}
|
|
3915
|
+
/** Generic descriptor-driven incoming-record to candidate-match decision surface. */
|
|
3916
|
+
declare function MatchReview({ incoming, incomingLabel, fields, candidates, selectedIds, onSelectionChange, onDecision, onBulkDecision, loading, error, onRetry, className, labels: labelOverrides, fieldMode, onAdopt, candidateLabel, provenance, }: MatchReviewProps): react.JSX.Element;
|
|
3917
|
+
|
|
3918
|
+
/**
|
|
3919
|
+
* A QR Code encoder (ISO/IEC 18004) for `QrCode` (HAR-1251): byte mode (UTF-8), the four
|
|
3920
|
+
* error-correction levels, versions 1 to 40, all eight masks scored by the standard's
|
|
3921
|
+
* penalty rules. Pure and dependency-free, so a consumer never pulls a QR library in for a
|
|
3922
|
+
* poster or a voucher. `qr-model.test.mjs` decodes its output with a reference decoder.
|
|
3923
|
+
*
|
|
3924
|
+
* The algorithm follows the standard's own construction (function patterns, Reed-Solomon over
|
|
3925
|
+
* GF(256) with 0x11D, zig-zag placement, BCH-coded format and version information).
|
|
3926
|
+
*/
|
|
3927
|
+
/** How much of the symbol can be lost and still read: about 7, 15, 25 and 30 % of codewords. */
|
|
3928
|
+
type QrErrorCorrection = 'L' | 'M' | 'Q' | 'H';
|
|
3929
|
+
interface QrMatrix {
|
|
3930
|
+
/** 1 to 40. Each version is 4 modules wider than the one before (version 1 is 21 × 21). */
|
|
3931
|
+
version: number;
|
|
3932
|
+
/** Modules per side, without the quiet zone. */
|
|
3933
|
+
size: number;
|
|
3934
|
+
errorCorrection: QrErrorCorrection;
|
|
3935
|
+
/** The mask the penalty rules chose, 0 to 7. */
|
|
3936
|
+
mask: number;
|
|
3937
|
+
/** `modules[y][x]` is true for a dark module. */
|
|
3938
|
+
modules: boolean[][];
|
|
3939
|
+
}
|
|
3940
|
+
interface QrEncodeOptions {
|
|
3941
|
+
/** Default `M`: survives a crease or a smudge on a printed poster. */
|
|
3942
|
+
errorCorrection?: QrErrorCorrection;
|
|
3943
|
+
/**
|
|
3944
|
+
* The smallest version to use (1 to 40); a larger one is chosen when the text needs it. A
|
|
3945
|
+
* value that is not a finite number throws a `RangeError` (it is a mistake, not a long text).
|
|
3946
|
+
*/
|
|
3947
|
+
minVersion?: number;
|
|
3948
|
+
/**
|
|
3949
|
+
* Mark text with characters beyond ASCII as UTF-8 with an ECI 26 designator (12 bits before
|
|
3950
|
+
* the data). Off by default: most scanners read UTF-8 without it and a few old ones misread a
|
|
3951
|
+
* symbol that has one; turn it on for a scanner that assumes ISO 8859-1 otherwise.
|
|
3952
|
+
*/
|
|
3953
|
+
eci?: boolean;
|
|
3954
|
+
/** Force a mask (0 to 7) instead of the lowest-penalty one; for tests. */
|
|
3955
|
+
mask?: number;
|
|
3956
|
+
}
|
|
3957
|
+
/** Thrown when the text does not fit in version 40 at the requested level. */
|
|
3958
|
+
declare class QrCapacityError extends Error {
|
|
3959
|
+
readonly bytes: number;
|
|
3960
|
+
readonly errorCorrection: QrErrorCorrection;
|
|
3961
|
+
constructor(bytes: number, errorCorrection: QrErrorCorrection);
|
|
3962
|
+
}
|
|
3963
|
+
/** Data codewords (bytes) a version holds at a level. */
|
|
3964
|
+
declare function qrDataCapacity(version: number, errorCorrection: QrErrorCorrection): number;
|
|
3965
|
+
/**
|
|
3966
|
+
* The smallest version that holds `bytes` bytes at a level, or undefined past version 40.
|
|
3967
|
+
* `headerBits` counts bits before the byte segment (12 for an ECI designator).
|
|
3968
|
+
*/
|
|
3969
|
+
declare function qrVersionFor(bytes: number, errorCorrection: QrErrorCorrection, minVersion?: number, headerBits?: number): number | undefined;
|
|
3970
|
+
/**
|
|
3971
|
+
* Encodes `text` (as UTF-8 bytes) into a QR matrix: the smallest version that fits at the
|
|
3972
|
+
* level, the mask with the lowest penalty. Throws `QrCapacityError` past version 40
|
|
3973
|
+
* (2,953 bytes at L, 1,273 at H).
|
|
3974
|
+
*/
|
|
3975
|
+
declare function encodeQr(text: string, options?: QrEncodeOptions): QrMatrix;
|
|
3976
|
+
/**
|
|
3977
|
+
* The dark modules as one SVG path in module units, offset by `margin` (the quiet zone):
|
|
3978
|
+
* one `h`-run per stretch of dark modules in a row, so a version-10 symbol is one short path.
|
|
3979
|
+
*/
|
|
3980
|
+
declare function qrPath(matrix: QrMatrix, margin?: number): string;
|
|
3981
|
+
|
|
3982
|
+
/** The words of a `QrCode` (HAR-1251). */
|
|
3983
|
+
interface QrCodeLabels {
|
|
3984
|
+
/** Shown in place of the symbol when `value` does not fit in a QR code at the chosen level. */
|
|
3985
|
+
tooLong: string;
|
|
3986
|
+
}
|
|
3987
|
+
/** The English words of `QrCode`, the base `UixLabelsProvider` `qrCode` and `labels` override. */
|
|
3988
|
+
declare const DEFAULT_QR_CODE_LABELS: QrCodeLabels;
|
|
3989
|
+
interface QrCodeProps extends Omit<SVGAttributes<SVGSVGElement>, 'children' | 'width' | 'height' | 'viewBox'> {
|
|
3990
|
+
/** The text to encode, e.g. the campaign URL. Encoded as UTF-8 bytes. */
|
|
3991
|
+
value: string;
|
|
3992
|
+
/**
|
|
3993
|
+
* The symbol's accessible name, e.g. "QR code: open the summer campaign". Say where it leads;
|
|
3994
|
+
* the image itself tells a screen-reader user nothing.
|
|
3995
|
+
*/
|
|
3996
|
+
label: string;
|
|
3997
|
+
/**
|
|
3998
|
+
* `L` 7 %, `M` 15 % (default), `Q` 25 %, `H` 30 % of the symbol may be lost and still read.
|
|
3999
|
+
* Use `Q` or `H` for a poster that may be creased, scuffed or partly covered.
|
|
4000
|
+
*/
|
|
4001
|
+
errorCorrection?: QrErrorCorrection;
|
|
4002
|
+
/**
|
|
4003
|
+
* The rendered width and height, quiet zone included: a number of CSS pixels (default 160) or
|
|
4004
|
+
* any CSS length (`'32mm'` on paper). Keep at least 2 px per module on a screen and 0.4 mm per
|
|
4005
|
+
* module on paper: a 30-character URL at `M` is version 3, 37 modules with the quiet zone, so
|
|
4006
|
+
* at least 74 px or 15 mm.
|
|
4007
|
+
*/
|
|
4008
|
+
size?: number | string;
|
|
4009
|
+
/** The smallest version to use, so a set of posters gets symbols of one size. */
|
|
4010
|
+
minVersion?: number;
|
|
4011
|
+
/** Mark non-ASCII text as UTF-8 with an ECI designator (see `QrEncodeOptions.eci`). Default false. */
|
|
4012
|
+
eci?: boolean;
|
|
4013
|
+
/** The words. Default: `UixLabelsProvider` `qrCode`, then English. */
|
|
4014
|
+
labels?: Partial<QrCodeLabels>;
|
|
4015
|
+
}
|
|
4016
|
+
/**
|
|
4017
|
+
* A scannable, print-safe QR code (HAR-1251; SHOPx PRE-01 poster, voucher): `value` as an SVG
|
|
4018
|
+
* with the standard four-module quiet zone, dark modules on light paper in every theme, in print
|
|
4019
|
+
* and in forced colours (scanners read dark on light; an inverted symbol fails many of them).
|
|
4020
|
+
* The encoder is the kit's own (`encodeQr`), so nothing is fetched and no library is added.
|
|
4021
|
+
*/
|
|
4022
|
+
declare function QrCode({ value, label, errorCorrection, size, minVersion, eci, labels: labelsProp, className, style, ...props }: QrCodeProps): react.JSX.Element;
|
|
4023
|
+
|
|
4024
|
+
/** The words of a `CodeDisplay` (HAR-1253). */
|
|
4025
|
+
interface CodeDisplayLabels {
|
|
4026
|
+
/** The live countdown; `{time}` is `m:ss` (or `h:mm:ss`). */
|
|
4027
|
+
expiresIn: string;
|
|
4028
|
+
/** Announced once when `warnBefore` seconds are left; `{time}` is that time as `m:ss`. */
|
|
4029
|
+
expiresSoon: string;
|
|
4030
|
+
/** Shown, and announced once, when the code has expired. Text, so the state never rests on colour. */
|
|
4031
|
+
expired: string;
|
|
4032
|
+
/** The copy button's accessible name. */
|
|
4033
|
+
copy: string;
|
|
4034
|
+
/** Announced after a copy. */
|
|
4035
|
+
copied: string;
|
|
4036
|
+
/** Announced when the copy failed. */
|
|
4037
|
+
copyFailed: string;
|
|
4038
|
+
}
|
|
4039
|
+
declare const DEFAULT_CODE_DISPLAY_LABELS: CodeDisplayLabels;
|
|
4040
|
+
interface CodeDisplayProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
|
|
4041
|
+
/**
|
|
4042
|
+
* The code, e.g. `"K7Q4PX9MW"` or `"K7Q-4PX-9MW"`. A code that already contains spaces or
|
|
4043
|
+
* hyphens is shown in those groups; otherwise it is cut into groups of `groupSize`.
|
|
4044
|
+
*/
|
|
4045
|
+
code: string;
|
|
4046
|
+
/** The visible name above the code, e.g. "Pairing code"; it also names the group. */
|
|
4047
|
+
label: ReactNode;
|
|
4048
|
+
/** Characters per group, or the length of each group in turn (`[4, 4, 4]`). Default 3. */
|
|
4049
|
+
groupSize?: number | readonly number[];
|
|
4050
|
+
/** Drawn between groups, never read out. Default `-`. */
|
|
4051
|
+
separator?: string;
|
|
4052
|
+
/** `md` (default) for a panel; `lg` for a code read across a counter. */
|
|
4053
|
+
size?: 'md' | 'lg';
|
|
4054
|
+
/** When the code stops working (an ISO instant, epoch milliseconds or a Date): shows a countdown, then the expired state. */
|
|
4055
|
+
expiresAt?: string | number | Date;
|
|
4056
|
+
/**
|
|
4057
|
+
* Seconds before expiry when the countdown turns to a warning and a screen reader hears it
|
|
4058
|
+
* once (`labels.expiresSoon`). Default 60; 0 turns the warning off.
|
|
4059
|
+
*/
|
|
4060
|
+
warnBefore?: number;
|
|
4061
|
+
/** Called once when the countdown reaches zero while the component is on screen. */
|
|
4062
|
+
onExpire?: () => void;
|
|
4063
|
+
/** Adds a copy button while the code is live. */
|
|
4064
|
+
copyable?: boolean;
|
|
4065
|
+
/**
|
|
4066
|
+
* What a screen reader says for one character. Default: the character itself, so "K7Q" is
|
|
4067
|
+
* read "K, 7, Q". Use it for a spelling alphabet or to tell O from 0.
|
|
4068
|
+
*/
|
|
4069
|
+
spell?: (character: string) => string;
|
|
4070
|
+
/** The words. Default: `UixLabelsProvider` `codeDisplay`, then English. */
|
|
4071
|
+
labels?: Partial<CodeDisplayLabels>;
|
|
4072
|
+
}
|
|
4073
|
+
/** The code in its display groups. */
|
|
4074
|
+
declare function codeGroups(code: string, groupSize?: number | readonly number[]): string[];
|
|
4075
|
+
/** `m:ss`, or `h:mm:ss` from an hour up, for a number of whole seconds. */
|
|
4076
|
+
declare function formatCountdown(seconds: number): string;
|
|
4077
|
+
/**
|
|
4078
|
+
* A one-time code shown large (HAR-1253; SHOPx PRE-08 till pairing, the shopper's voucher):
|
|
4079
|
+
* monospace characters in groups, spelled character by character to a screen reader, an
|
|
4080
|
+
* optional countdown that ends in an expired state said in words, and an optional copy button.
|
|
4081
|
+
* The consumer makes the code and enforces its expiry; this only shows it.
|
|
4082
|
+
*/
|
|
4083
|
+
declare function CodeDisplay({ code, label, groupSize, separator, size, expiresAt, warnBefore, onExpire, copyable, spell, labels: labelsProp, className, ...props }: CodeDisplayProps): react.JSX.Element;
|
|
4084
|
+
|
|
4085
|
+
/** The words of a `ContactCard` (HAR-1379). */
|
|
4086
|
+
interface ContactCardLabels {
|
|
4087
|
+
/** The email action's visible text. */
|
|
4088
|
+
email: string;
|
|
4089
|
+
/** The phone action's visible text. */
|
|
4090
|
+
call: string;
|
|
4091
|
+
/** The email action's accessible name; `{name}` is the contact's name. Starts with the visible text (WCAG 2.5.3). */
|
|
4092
|
+
emailName: string;
|
|
4093
|
+
/** The phone action's accessible name; `{name}`. */
|
|
4094
|
+
callName: string;
|
|
4095
|
+
/** Shown in place of the name when the person's data was erased and no name is left. */
|
|
4096
|
+
purgedName: string;
|
|
4097
|
+
/** The line under the name of an erased contact. */
|
|
4098
|
+
purged: string;
|
|
4099
|
+
/** The line under the name of a contact whose details cannot be shown (no access, or not loaded). */
|
|
4100
|
+
unavailable: string;
|
|
4101
|
+
}
|
|
4102
|
+
declare const DEFAULT_CONTACT_CARD_LABELS: ContactCardLabels;
|
|
4103
|
+
/**
|
|
4104
|
+
* `active` shows everything given. `purged`: the person's data was erased; a neutral
|
|
4105
|
+
* placeholder, no details and no actions. `unavailable`: the name stays, the details and actions
|
|
4106
|
+
* do not (no access, or they could not be loaded).
|
|
4107
|
+
*/
|
|
4108
|
+
type ContactCardState = 'active' | 'purged' | 'unavailable';
|
|
4109
|
+
interface ContactCardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'role'> {
|
|
4110
|
+
/** The person's or the organisation's name. Leave it out for an erased contact. */
|
|
4111
|
+
name?: string;
|
|
4112
|
+
/** Role or relation, e.g. "Practice manager · Dom zdravlja Centar". */
|
|
4113
|
+
role?: ReactNode;
|
|
4114
|
+
/** An `Avatar` (size `lg` reads best). An erased contact always gets the placeholder. */
|
|
4115
|
+
avatar?: ReactNode;
|
|
4116
|
+
/** Shown as text and offered as a `mailto:` action. */
|
|
4117
|
+
email?: string;
|
|
4118
|
+
/** Shown as written and offered as a `tel:` action (spaces, dashes and brackets are dropped from the link). */
|
|
4119
|
+
phone?: string;
|
|
4120
|
+
/** More actions after Email and Call, e.g. a `ButtonLink` to the record. */
|
|
4121
|
+
actions?: ReactNode;
|
|
4122
|
+
/** Figures under the role (`.uix-contact__stats`). */
|
|
4123
|
+
stats?: ReactNode;
|
|
4124
|
+
/** The name as a link to the person's record. */
|
|
4125
|
+
href?: string;
|
|
4126
|
+
/** Your router's link for `href`. */
|
|
4127
|
+
renderLink?: UixRenderLink;
|
|
4128
|
+
/** The element of the name: a heading when the card stands for a section. Default `div`. */
|
|
4129
|
+
nameAs?: 'h2' | 'h3' | 'h4' | 'div';
|
|
4130
|
+
state?: ContactCardState;
|
|
4131
|
+
/** Without the card frame, for a peek, a popover or a sidebar that is already a surface. */
|
|
4132
|
+
bare?: boolean;
|
|
4133
|
+
/** The words. Default: `UixLabelsProvider` `contactCard`, then English. */
|
|
4134
|
+
labels?: Partial<ContactCardLabels>;
|
|
4135
|
+
}
|
|
4136
|
+
/** The digits and a leading + of a phone number, for a `tel:` link. */
|
|
4137
|
+
declare const telHref: (phone: string) => string;
|
|
4138
|
+
/**
|
|
4139
|
+
* A person or an organisation at a glance (HAR-1379; MOTUS C-15, TENSOR incident people card):
|
|
4140
|
+
* avatar, name, role, the email address and phone number as text, and Email / Call actions as
|
|
4141
|
+
* `mailto:` / `tel:` links. An erased contact (`state="purged"`) shows a neutral placeholder
|
|
4142
|
+
* and no way to reach anyone, so a purge is never undone on screen by a stale address.
|
|
4143
|
+
*/
|
|
4144
|
+
declare function ContactCard({ name, role, avatar, email, phone, actions, stats, href, renderLink, nameAs: NameTag, state, bare, labels: labelsProp, className, ...props }: ContactCardProps): react.JSX.Element;
|
|
4145
|
+
|
|
4146
|
+
/** The words of `PrintSignature` (HAR-986). */
|
|
4147
|
+
interface PrintLayoutLabels {
|
|
4148
|
+
/** The caption under the signature line. */
|
|
4149
|
+
signature: string;
|
|
4150
|
+
/** The caption of the stamp box. */
|
|
4151
|
+
stamp: string;
|
|
4152
|
+
}
|
|
4153
|
+
declare const DEFAULT_PRINT_LAYOUT_LABELS: PrintLayoutLabels;
|
|
4154
|
+
type PrintPageSize = 'A4' | 'A5';
|
|
4155
|
+
interface PrintLayoutProps extends HTMLAttributes<HTMLDivElement> {
|
|
4156
|
+
/** The paper. Default `A4` (210 × 297 mm); `A5` is 148 × 210 mm (a poster, a slip). */
|
|
4157
|
+
size?: PrintPageSize;
|
|
4158
|
+
/** Default `portrait`. */
|
|
4159
|
+
orientation?: 'portrait' | 'landscape';
|
|
4160
|
+
/** Repeats at the top of every printed page: the practice or store identity. */
|
|
4161
|
+
header?: ReactNode;
|
|
4162
|
+
/** Repeats at the foot of every printed page, before the page number. */
|
|
4163
|
+
footer?: ReactNode;
|
|
4164
|
+
/** "page / pages" in the bottom-right page margin of every printed page. Default `true`; never on a `singlePage` layout. */
|
|
4165
|
+
pageNumbers?: boolean;
|
|
4166
|
+
/**
|
|
4167
|
+
* One page and no more (a poster, a one-page readout): the header and footer are not
|
|
4168
|
+
* repeated, the layout is kept in one piece, and the screen preview is exactly one page tall.
|
|
4169
|
+
* When the content does not fit, the preview is outlined and `onOverflowChange(true)` is called,
|
|
4170
|
+
* so the product can shorten it before anyone prints.
|
|
4171
|
+
*/
|
|
4172
|
+
singlePage?: boolean;
|
|
4173
|
+
/** Called with `true` when a `singlePage` layout's content is taller than its page, and `false` once it fits again. */
|
|
4174
|
+
onOverflowChange?: (overflowing: boolean) => void;
|
|
4175
|
+
/**
|
|
4176
|
+
* When printing, show only print layouts: everything else on the page (the app shell, the
|
|
4177
|
+
* toolbar with the Print button, toasts, dialogs) is hidden. Default `true`.
|
|
4178
|
+
*/
|
|
4179
|
+
isolate?: boolean;
|
|
4180
|
+
}
|
|
4181
|
+
/**
|
|
4182
|
+
* A print document frame (HAR-986, HAR-1252; MEDx S20 "Nalaz i mišljenje" and the day list,
|
|
4183
|
+
* SHOPx PRE-01 A5 poster and SHOP-03 one-page readout): an A4 or A5 page with the paper's margins,
|
|
4184
|
+
* a header and a footer that repeat on every printed page, page numbers in the page margin, and
|
|
4185
|
+
* black-on-white tokens for everything inside, on screen (as a paper preview) and on paper. The
|
|
4186
|
+
* consumer supplies the sections; the browser's own print (`window.print()`) makes the pages.
|
|
4187
|
+
*/
|
|
4188
|
+
declare function PrintLayout({ size, orientation, header, footer, pageNumbers, singlePage, onOverflowChange, isolate, className, children, style, ...props }: PrintLayoutProps): react.JSX.Element;
|
|
4189
|
+
interface PrintSignatureProps extends HTMLAttributes<HTMLDivElement> {
|
|
4190
|
+
/** The caption under the line. Default `labels.signature`. */
|
|
4191
|
+
label?: ReactNode;
|
|
4192
|
+
/** The signer's printed name and title under the caption, e.g. "dr. Amra Hadžić, spec. pedijatrije". */
|
|
4193
|
+
name?: ReactNode;
|
|
4194
|
+
/** Place and date at the start of the block, e.g. "Sarajevo, 22. 10. 2026.". */
|
|
4195
|
+
placeAndDate?: ReactNode;
|
|
4196
|
+
/** A box for the stamp beside the signature. */
|
|
4197
|
+
stamp?: boolean;
|
|
4198
|
+
labels?: Partial<PrintLayoutLabels>;
|
|
4199
|
+
}
|
|
4200
|
+
/** A signature line (and an optional stamp box) that is never split across two pages. */
|
|
4201
|
+
declare function PrintSignature({ label, name, placeAndDate, stamp, labels: labelsProp, className, ...props }: PrintSignatureProps): react.JSX.Element;
|
|
4202
|
+
/** Starts a new printed page here. On screen it is a dashed line, so the preview shows where the page ends. */
|
|
4203
|
+
declare function PrintPageBreak({ className, ...props }: HTMLAttributes<HTMLDivElement>): react.JSX.Element;
|
|
4204
|
+
|
|
4205
|
+
/** The words of a `QrScanner` (HAR-1254). */
|
|
4206
|
+
interface QrScannerLabels {
|
|
4207
|
+
/** The viewfinder region's name. */
|
|
4208
|
+
viewfinder: string;
|
|
4209
|
+
/** Starts the camera (the browser asks for permission after it). */
|
|
4210
|
+
start: string;
|
|
4211
|
+
/** Stops the camera. */
|
|
4212
|
+
stop: string;
|
|
4213
|
+
/** While the browser's permission prompt is open. */
|
|
4214
|
+
asking: string;
|
|
4215
|
+
/** While the camera runs and nothing was read yet. */
|
|
4216
|
+
scanning: string;
|
|
4217
|
+
/** Camera access was refused. */
|
|
4218
|
+
deniedTitle: string;
|
|
4219
|
+
/** How to allow it again: the browser keeps the refusal until the person changes it. */
|
|
4220
|
+
deniedBody: string;
|
|
4221
|
+
/** No camera API (an old browser, or a page not served over HTTPS). */
|
|
4222
|
+
unsupportedTitle: string;
|
|
4223
|
+
unsupportedBody: string;
|
|
4224
|
+
/** No camera found, or it is in use by another app. */
|
|
4225
|
+
noCameraTitle: string;
|
|
4226
|
+
noCameraBody: string;
|
|
4227
|
+
/** The camera started but sends no picture. */
|
|
4228
|
+
noFrameTitle: string;
|
|
4229
|
+
noFrameBody: string;
|
|
4230
|
+
/** Shown after `hintAfter` ms of frames without a code. */
|
|
4231
|
+
unreadable: string;
|
|
4232
|
+
/** Tries the camera again. */
|
|
4233
|
+
retry: string;
|
|
4234
|
+
/** The torch toggle's name. */
|
|
4235
|
+
torch: string;
|
|
4236
|
+
/** Announced once when a code was read; `{value}` is the text. */
|
|
4237
|
+
read: string;
|
|
4238
|
+
}
|
|
4239
|
+
declare const DEFAULT_QR_SCANNER_LABELS: QrScannerLabels;
|
|
4240
|
+
/**
|
|
4241
|
+
* What the scanner is doing. `idle` shows the explainer and the start button; `asking` waits for
|
|
4242
|
+
* the browser's prompt; `scanning` shows the picture; `denied`, `unsupported`, `no-camera` and
|
|
4243
|
+
* `no-frame` say what went wrong and how to go on.
|
|
4244
|
+
*/
|
|
4245
|
+
type QrScannerStatus = 'idle' | 'asking' | 'scanning' | 'denied' | 'unsupported' | 'no-camera' | 'no-frame';
|
|
4246
|
+
/** One camera frame for the consumer's decoder. It never leaves the device unless the decoder sends it. */
|
|
4247
|
+
interface QrScannerFrame {
|
|
4248
|
+
/** The frame's pixels, at most `maxFrameSize` on the long side. */
|
|
4249
|
+
imageData: ImageData;
|
|
4250
|
+
/** The live video element, for a decoder that reads it directly (`BarcodeDetector.detect(video)`). */
|
|
4251
|
+
video: HTMLVideoElement;
|
|
4252
|
+
}
|
|
4253
|
+
/** Returns the text it read, or nothing. Throwing counts as nothing read. */
|
|
4254
|
+
type QrScannerDecoder = (frame: QrScannerFrame) => string | null | undefined | Promise<string | null | undefined>;
|
|
4255
|
+
interface QrScannerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onError'> {
|
|
4256
|
+
/** Your decoder (a WASM or JS QR reader, or `BarcodeDetector`). The kit ships none and calls it with frames only. */
|
|
4257
|
+
decode: QrScannerDecoder;
|
|
4258
|
+
/** Called with each new text read. The same text again is ignored for `repeatAfter` ms. */
|
|
4259
|
+
onResult: (value: string) => void;
|
|
4260
|
+
/** Why the page wants the camera, shown before the browser's own prompt (and after a refusal). */
|
|
4261
|
+
explainer?: ReactNode;
|
|
4262
|
+
/** The manual entry (a field and a button): always rendered, in every state, after the viewfinder. */
|
|
4263
|
+
manualEntry?: ReactNode;
|
|
4264
|
+
/**
|
|
4265
|
+
* Starts the camera without the start button when the browser says permission was already
|
|
4266
|
+
* given (`navigator.permissions`). Default `true`; the explainer is still shown first otherwise.
|
|
4267
|
+
*/
|
|
4268
|
+
autoStart?: boolean;
|
|
4269
|
+
/** Called on every status change, e.g. to log it or to move focus to the manual field after a refusal. */
|
|
4270
|
+
onStatusChange?: (status: QrScannerStatus) => void;
|
|
4271
|
+
/** Milliseconds between decode attempts. Default 200. */
|
|
4272
|
+
interval?: number;
|
|
4273
|
+
/** The long side of the frame handed to the decoder, in pixels. Default 640. */
|
|
4274
|
+
maxFrameSize?: number;
|
|
4275
|
+
/** The same text read again within this many milliseconds is not reported twice. Default 2000. */
|
|
4276
|
+
repeatAfter?: number;
|
|
4277
|
+
/** Milliseconds of frames without a code before the "still nothing read" hint. Default 8000. */
|
|
4278
|
+
hintAfter?: number;
|
|
4279
|
+
/** Milliseconds after the camera started without a single frame before `no-frame`. Default 5000. */
|
|
4280
|
+
frameTimeout?: number;
|
|
4281
|
+
/** `environment` (default, the back camera) or `user`. */
|
|
4282
|
+
facingMode?: 'environment' | 'user';
|
|
4283
|
+
/** The words. Default: `UixLabelsProvider` `qrScanner`, then English. */
|
|
4284
|
+
labels?: Partial<QrScannerLabels>;
|
|
4285
|
+
}
|
|
4286
|
+
/**
|
|
4287
|
+
* A camera viewfinder that reads QR codes with a decoder the product supplies (HAR-1254; SHOPx
|
|
4288
|
+
* SHOP-07 receipt scan, SHOP-09 till; MOTUS circulation intake). It explains why it wants the
|
|
4289
|
+
* camera before the browser asks, says plainly when access is blocked, missing or unsupported
|
|
4290
|
+
* and how to go on, and always keeps the manual entry next to it. Frames go to `decode` and
|
|
4291
|
+
* nowhere else: the component makes no network request. The camera stops on unmount, on Stop
|
|
4292
|
+
* and while the page is hidden.
|
|
4293
|
+
*/
|
|
4294
|
+
declare function QrScanner({ decode, onResult, explainer, manualEntry, autoStart, onStatusChange, interval, maxFrameSize, repeatAfter, hintAfter, frameTimeout, facingMode, labels: labelsProp, className, ...props }: QrScannerProps): react.JSX.Element;
|
|
4295
|
+
|
|
4296
|
+
interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
|
|
4297
|
+
/**
|
|
4298
|
+
* `sm` 28 px, `md` 36 px (default), `lg` 44 px: the touch-target floor of a public page, the
|
|
4299
|
+
* same height as `Button size="lg"` (HAR-1812).
|
|
4300
|
+
*/
|
|
4301
|
+
size?: 'sm' | 'md' | 'lg';
|
|
4302
|
+
invalid?: boolean;
|
|
4303
|
+
valid?: boolean;
|
|
4304
|
+
/**
|
|
4305
|
+
* "Check this": a value the reader should confirm, not an error, e.g. one an assistant filled
|
|
4306
|
+
* in (HAR-1814). Draws the warning border; `invalid` wins when both are set.
|
|
4307
|
+
*/
|
|
4308
|
+
warning?: boolean;
|
|
4309
|
+
}
|
|
4310
|
+
declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
|
|
4311
|
+
interface InputGroupProps {
|
|
4312
|
+
children: ReactNode;
|
|
4313
|
+
leadingIcon?: ReactNode;
|
|
4314
|
+
trailingIcon?: ReactNode;
|
|
4315
|
+
/**
|
|
4316
|
+
* A control at the end of the field, inside its border: a reveal toggle, a clear or a copy
|
|
4317
|
+
* button (HAR-1376). Give it the class `uix-input-group__action` (an icon button sized to the
|
|
4318
|
+
* field) and an accessible name. It takes the place of `trailingIcon`.
|
|
4319
|
+
*/
|
|
4320
|
+
trailingAction?: ReactNode;
|
|
4321
|
+
className?: string;
|
|
4322
|
+
/** Injected by `<Field>` when it wraps the group; forwarded onto the child control. */
|
|
4323
|
+
id?: string;
|
|
4324
|
+
'aria-describedby'?: string;
|
|
4325
|
+
'aria-invalid'?: AriaAttributes['aria-invalid'];
|
|
4326
|
+
'aria-required'?: AriaAttributes['aria-required'];
|
|
4327
|
+
}
|
|
4328
|
+
/**
|
|
4329
|
+
* Icon-adorned wrapper for a child `<Input>`. The control is passed as `children`, so
|
|
4330
|
+
* `<Field>`'s injected `id`/`aria-*` land on this wrapper — they're forwarded onto the
|
|
4331
|
+
* single child element (the child's own props win) so label/message association survives
|
|
4332
|
+
* the extra div (UIX-A11Y-3).
|
|
4333
|
+
*/
|
|
4334
|
+
declare function InputGroup({ children, leadingIcon, trailingIcon, trailingAction, className, id, 'aria-describedby': describedBy, 'aria-invalid': invalid, 'aria-required': required, }: InputGroupProps): react.JSX.Element;
|
|
4335
|
+
|
|
4336
|
+
/** The words `PasswordInput` renders. */
|
|
4337
|
+
interface PasswordInputLabels {
|
|
4338
|
+
/**
|
|
4339
|
+
* Name of the reveal toggle. It stays the same while the password shows: the toggle's pressed
|
|
4340
|
+
* state (`aria-pressed`) says whether it is on.
|
|
4341
|
+
*/
|
|
4342
|
+
show: string;
|
|
4343
|
+
}
|
|
4344
|
+
declare const DEFAULT_PASSWORD_INPUT_LABELS: PasswordInputLabels;
|
|
4345
|
+
interface PasswordInputProps extends Omit<InputProps, 'type'> {
|
|
4346
|
+
/** Controlled: whether the password shows as text. */
|
|
4347
|
+
revealed?: boolean;
|
|
4348
|
+
/** Uncontrolled: shown as text at first. Default `false`. */
|
|
4349
|
+
defaultRevealed?: boolean;
|
|
4350
|
+
onRevealedChange?: (revealed: boolean) => void;
|
|
4351
|
+
/** Each word defaults to `UixLabelsProvider` `passwordInput`, then to English. */
|
|
4352
|
+
labels?: Partial<PasswordInputLabels>;
|
|
4353
|
+
/** Class of the wrapping `InputGroup` (`className` goes on the input). */
|
|
4354
|
+
groupClassName?: string;
|
|
4355
|
+
}
|
|
4356
|
+
/**
|
|
4357
|
+
* A password field with a reveal toggle (HAR-1376): an `Input type="password"` and, inside its end,
|
|
4358
|
+
* a toggle button (`aria-pressed`) that shows the password as text and hides it again. A pointer
|
|
4359
|
+
* press leaves focus in the field; the keyboard reaches the toggle with Tab. The password is
|
|
4360
|
+
* hidden again when its form submits, so a password manager sees a password field. `autoComplete`
|
|
4361
|
+
* passes through (`current-password`, `new-password`); inside `Field` the label, hint and error
|
|
4362
|
+
* land on the input. `ref` is the input.
|
|
4363
|
+
*/
|
|
4364
|
+
declare const PasswordInput: react.ForwardRefExoticComponent<PasswordInputProps & react.RefAttributes<HTMLInputElement>>;
|
|
4365
|
+
|
|
4366
|
+
/** Every word `TagInput` renders or announces. */
|
|
4367
|
+
interface TagInputLabels {
|
|
4368
|
+
/** Name of a chip's × button; `{tag}`. */
|
|
4369
|
+
remove: string;
|
|
4370
|
+
/** Announced after a tag was added; `{tag}`. */
|
|
4371
|
+
added: string;
|
|
4372
|
+
/** Announced after a tag was removed; `{tag}`. */
|
|
4373
|
+
removed: string;
|
|
4374
|
+
/** Shown when the tag is already there; `{tag}`. */
|
|
4375
|
+
duplicate: string;
|
|
4376
|
+
/** Shown when `maxTags` are there; `{max}`. */
|
|
4377
|
+
max: string;
|
|
4378
|
+
/** Name of the suggestion list. */
|
|
4379
|
+
suggestions: string;
|
|
4380
|
+
/** Name of the list of chips. */
|
|
4381
|
+
list: string;
|
|
4382
|
+
/** Part of the field's description: how many tags there are; `{count}`. */
|
|
4383
|
+
count: string;
|
|
4384
|
+
}
|
|
4385
|
+
declare const DEFAULT_TAG_INPUT_LABELS: TagInputLabels;
|
|
4386
|
+
interface TagInputProps {
|
|
4387
|
+
/** The tags, in order. */
|
|
4388
|
+
value: readonly string[];
|
|
4389
|
+
onValueChange: (value: string[]) => void;
|
|
4390
|
+
/** Offered while typing (those already added are left out); ArrowDown reaches them. */
|
|
4391
|
+
suggestions?: readonly string[];
|
|
4392
|
+
/**
|
|
4393
|
+
* Check a tag before it is added: return a message to refuse it (shown under the field), or
|
|
4394
|
+
* `null` to accept it. Runs after the duplicate and `maxTags` checks.
|
|
4395
|
+
*/
|
|
4396
|
+
validate?: (tag: string, value: readonly string[]) => string | null | undefined;
|
|
4397
|
+
/** The most tags; past it, adding is refused with the `max` message. */
|
|
4398
|
+
maxTags?: number;
|
|
4399
|
+
/** Keys that add the typed text. Default Enter and comma. */
|
|
4400
|
+
separators?: readonly string[];
|
|
4401
|
+
/** Submits each tag as its own value under this name (hidden inputs). */
|
|
4402
|
+
name?: string;
|
|
4403
|
+
/** Lands on the text input, so a `<label htmlFor>` or `<Field>` names it. */
|
|
4404
|
+
id?: string;
|
|
4405
|
+
placeholder?: string;
|
|
4406
|
+
disabled?: boolean;
|
|
4407
|
+
invalid?: boolean;
|
|
4408
|
+
'aria-label'?: string;
|
|
4409
|
+
'aria-labelledby'?: string;
|
|
4410
|
+
'aria-describedby'?: string;
|
|
4411
|
+
'aria-invalid'?: AriaAttributes['aria-invalid'];
|
|
4412
|
+
'aria-required'?: AriaAttributes['aria-required'];
|
|
4413
|
+
/** Translatable words; English defaults in {@link DEFAULT_TAG_INPUT_LABELS}. */
|
|
4414
|
+
labels?: Partial<TagInputLabels>;
|
|
4415
|
+
className?: string;
|
|
4416
|
+
}
|
|
4417
|
+
/**
|
|
4418
|
+
* Several short tags in one field (HAR-1377): type and press Enter (or a comma) to add a chip;
|
|
4419
|
+
* pasting "a, b, c" adds three. A duplicate (ignoring case and accents), a refusal from `validate`
|
|
4420
|
+
* or one past `maxTags` keeps the text and says why. Suggestions open under the field as a
|
|
4421
|
+
* top-layer list once the person types (or presses ArrowDown): ArrowDown / ArrowUp move, Enter adds
|
|
4422
|
+
* the active one, Escape closes it. Backspace in the empty field
|
|
4423
|
+
* goes to the last chip; ArrowLeft / ArrowRight move between chips and back to the field;
|
|
4424
|
+
* Backspace or Delete on a chip removes it. Each change is announced politely. Works in `Field`
|
|
4425
|
+
* (the text input gets the label, hint and error) and submits each tag under `name`.
|
|
4426
|
+
*/
|
|
4427
|
+
declare function TagInput({ value, onValueChange, suggestions, validate, maxTags, separators, name, id: idProp, placeholder, disabled, invalid, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, 'aria-invalid': ariaInvalid, 'aria-required': ariaRequired, labels: labelOverrides, className, }: TagInputProps): react.JSX.Element;
|
|
4428
|
+
|
|
4429
|
+
/** Presence of a person (HAR-1374). Each state has its own shape as well as its own colour. */
|
|
4430
|
+
type AvatarPresence = 'online' | 'busy' | 'away' | 'offline';
|
|
4431
|
+
/** The words read for each presence state. English; pass translations as `presenceLabels`. */
|
|
4432
|
+
declare const DEFAULT_PRESENCE_LABELS: Record<AvatarPresence, string>;
|
|
4433
|
+
interface AvatarProps extends HTMLAttributes<HTMLSpanElement> {
|
|
4434
|
+
/** TENSOR RX-125 (UIX-04): translatable; English default. Still honoured for `online`. */
|
|
4435
|
+
onlineLabel?: string;
|
|
4436
|
+
size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl';
|
|
4437
|
+
src?: string;
|
|
4438
|
+
alt?: string;
|
|
4439
|
+
/** Initials / fallback shown when there is no `src`. */
|
|
4440
|
+
children?: ReactNode;
|
|
4441
|
+
/** Online status dot. The same as `presence="online"`; kept for existing callers. */
|
|
4442
|
+
status?: boolean;
|
|
4443
|
+
/**
|
|
4444
|
+
* A presence dot: `online` (filled green), `busy` (red with a bar), `away` (an amber ring),
|
|
4445
|
+
* `offline` (a grey ring). The state is also in visually hidden text, so it is never colour
|
|
4446
|
+
* alone.
|
|
4447
|
+
*/
|
|
4448
|
+
presence?: AvatarPresence;
|
|
4449
|
+
/** Translations of the presence words. */
|
|
4450
|
+
presenceLabels?: Partial<Record<AvatarPresence, string>>;
|
|
4451
|
+
}
|
|
4452
|
+
/** Avatar over `.uix-avatar`. Renders an image when `src` is set, else children (initials). */
|
|
4453
|
+
declare function Avatar({ size, src, alt, children, status, presence, presenceLabels, onlineLabel, className, ...props }: AvatarProps): react.JSX.Element;
|
|
4454
|
+
interface PresenceDotProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {
|
|
4455
|
+
presence: AvatarPresence;
|
|
4456
|
+
/**
|
|
4457
|
+
* The state in words for assistive technology. Default: the English word. Pass `null` when
|
|
4458
|
+
* the state is already written next to the dot, to make the dot decorative.
|
|
4459
|
+
*/
|
|
4460
|
+
label?: string | null;
|
|
4461
|
+
}
|
|
4462
|
+
/** The presence dot on its own, for a row or a menu that shows no avatar (HAR-1374). */
|
|
4463
|
+
declare function PresenceDot({ presence, label, className, ...props }: PresenceDotProps): react.JSX.Element;
|
|
4464
|
+
interface AvatarGroupProps extends HTMLAttributes<HTMLSpanElement> {
|
|
4465
|
+
children?: ReactNode;
|
|
4466
|
+
}
|
|
4467
|
+
/** Overlapping avatar stack over `.uix-avatar-group`. */
|
|
4468
|
+
declare function AvatarGroup({ children, className, ...props }: AvatarGroupProps): react.JSX.Element;
|
|
4469
|
+
interface UserChipProps extends HTMLAttributes<HTMLSpanElement> {
|
|
4470
|
+
/** Usually an `<Avatar />`. */
|
|
4471
|
+
avatar?: ReactNode;
|
|
4472
|
+
name?: ReactNode;
|
|
4473
|
+
/** Secondary line (role, email). */
|
|
4474
|
+
sub?: ReactNode;
|
|
4475
|
+
}
|
|
4476
|
+
/** Avatar + name (+ optional sub-line) over `.uix-user-chip`. */
|
|
4477
|
+
declare function UserChip({ avatar, name, sub, className, children, ...props }: UserChipProps): react.JSX.Element;
|
|
4478
|
+
|
|
4479
|
+
interface AccountMenuUser {
|
|
4480
|
+
/** The person's name, shown on the trigger and used for the avatar's initials. */
|
|
4481
|
+
name: string;
|
|
4482
|
+
/** A second line: an email, a role, a branch. */
|
|
4483
|
+
sub?: ReactNode;
|
|
4484
|
+
/** A photo URL, or your own avatar content. Without it the avatar shows the initials. */
|
|
4485
|
+
avatar?: string | ReactNode;
|
|
4486
|
+
/** A presence dot on the avatar (`online`, `busy`, `away`, `offline`). */
|
|
4487
|
+
status?: AvatarPresence;
|
|
4488
|
+
}
|
|
4489
|
+
interface AccountMenuLabels {
|
|
4490
|
+
/** The menu's name (`aria-label` of the list). Default "Account". */
|
|
4491
|
+
menu: string;
|
|
4492
|
+
}
|
|
4493
|
+
declare const DEFAULT_ACCOUNT_MENU_LABELS: AccountMenuLabels;
|
|
4494
|
+
interface AccountMenuProps {
|
|
4495
|
+
user: AccountMenuUser;
|
|
4496
|
+
/**
|
|
4497
|
+
* The menu's rows: `MenuItem` (profile, preferences, sign out with `tone="danger"`),
|
|
4498
|
+
* `MenuRadioGroup` for a presence choice, `MenuSeparator`.
|
|
4499
|
+
*/
|
|
4500
|
+
items?: ReactNode;
|
|
4501
|
+
/**
|
|
4502
|
+
* The rail form: the trigger shows the avatar only; the name stays the button's accessible
|
|
4503
|
+
* name. Pair it with `Sidebar nav="rail"`.
|
|
4504
|
+
*/
|
|
4505
|
+
collapsed?: boolean;
|
|
4506
|
+
/** Where the menu opens. Default `top-start`: the trigger usually sits at the bottom of a sidebar. */
|
|
4507
|
+
placement?: Placement;
|
|
4508
|
+
labels?: Partial<AccountMenuLabels>;
|
|
4509
|
+
/** The spoken presence words (after the name and second line), e.g. `{ online: 'Dostupan' }`. */
|
|
4510
|
+
presenceLabels?: Partial<Record<AvatarPresence, string>>;
|
|
4511
|
+
className?: string;
|
|
4512
|
+
}
|
|
4513
|
+
/** Up to two initials from a name, first and last word: "Ada Lovelace" → "AL", "Dževad Hodžić" → "DH". */
|
|
4514
|
+
declare function accountInitials(name: string): string;
|
|
4515
|
+
declare function AccountMenu({ user, items, collapsed, placement, labels: labelOverrides, presenceLabels, className }: AccountMenuProps): react.JSX.Element;
|
|
4516
|
+
|
|
4517
|
+
type PillTone = 'neutral' | 'success' | 'info' | 'warning' | 'danger' | 'critical' | 'muted' | 'progress' | 'attention' | 'overdue' | 'sla-ok' | 'sla-at-risk' | 'sla-breached' | 'p1' | 'p2' | 'p3' | 'p4' | 'p5';
|
|
4518
|
+
/**
|
|
4519
|
+
* How loud the pill is (HAR-1563). `soft` (default) is the tinted wash; `filled` is its old name
|
|
4520
|
+
* and still works. `dot` is the quiet one for tables: no fill, a neutral label and a coloured dot.
|
|
4521
|
+
* `outline` is a neutral hairline with a hushed label and a dot; only `critical` keeps a toned
|
|
4522
|
+
* border.
|
|
4523
|
+
*/
|
|
4524
|
+
type PillTreatment = 'soft' | 'filled' | 'dot' | 'outline';
|
|
4525
|
+
type PillSize = 'sm' | 'md' | 'lg';
|
|
4526
|
+
interface StatusPillProps extends HTMLAttributes<HTMLSpanElement> {
|
|
4527
|
+
tone?: PillTone;
|
|
4528
|
+
/**
|
|
4529
|
+
* `soft` (default; `filled` is an alias) = tinted wash; `dot` = a coloured dot beside a neutral
|
|
4530
|
+
* label, for dense tables; `outline` = a neutral hairline, a hushed label and a dot. `dot` and
|
|
4531
|
+
* `outline` always draw the dot.
|
|
4532
|
+
*/
|
|
4533
|
+
treatment?: PillTreatment;
|
|
4534
|
+
/**
|
|
4535
|
+
* `sm` for a dense table cell or beside small text, `lg` for a page header (the public status
|
|
4536
|
+
* page). Default `md`, the size every pill had before (HAR-1614).
|
|
4537
|
+
*/
|
|
4538
|
+
size?: PillSize;
|
|
4539
|
+
/** Draws the tone's dot before the label. Always on for the `dot` and `outline` treatments. */
|
|
4540
|
+
dot?: boolean;
|
|
4541
|
+
children?: ReactNode;
|
|
4542
|
+
}
|
|
4543
|
+
declare function StatusPill({ tone, treatment, size, dot, children, className, ...props }: StatusPillProps): react.JSX.Element;
|
|
4544
|
+
|
|
4545
|
+
/** One entry of an access or change history. The consumer supplies it free of personal health data. */
|
|
4546
|
+
interface AuditLogEvent {
|
|
4547
|
+
id: string;
|
|
4548
|
+
/** Who did it: a name, or a node (an avatar and a name). */
|
|
4549
|
+
actor: ReactNode;
|
|
4550
|
+
/** What they did: a key of `actions`. */
|
|
4551
|
+
action: string;
|
|
4552
|
+
/** What it was done to: "Patient record 1042", "Invoice R-2026-118". */
|
|
4553
|
+
target?: ReactNode;
|
|
4554
|
+
/**
|
|
4555
|
+
* When: a `Date`, epoch ms or an ISO string. An ISO date-time without an offset
|
|
4556
|
+
* (`2026-10-22T09:30:00`) is read as UTC, as audit stores keep it, not as the viewer's local time.
|
|
4557
|
+
*/
|
|
4558
|
+
at: Date | number | string;
|
|
4559
|
+
/** More about it, behind a Details disclosure: fields changed, the reason given, the IP. */
|
|
4560
|
+
detail?: ReactNode;
|
|
4561
|
+
}
|
|
4562
|
+
/** How an action reads and looks; the consumer labels its own action enum. */
|
|
4563
|
+
interface AuditLogAction {
|
|
4564
|
+
label: string;
|
|
4565
|
+
tone?: StatusPillProps['tone'];
|
|
4566
|
+
}
|
|
4567
|
+
/** The filters the person chose: `when` (a date range), `actor` and `action` (sets of ids). */
|
|
4568
|
+
interface AuditLogFilters {
|
|
4569
|
+
when?: Extract<FilterValue, {
|
|
4570
|
+
kind: 'date-range';
|
|
4571
|
+
}>;
|
|
4572
|
+
actor?: Extract<FilterValue, {
|
|
4573
|
+
kind: 'enum';
|
|
4574
|
+
}>;
|
|
4575
|
+
action?: Extract<FilterValue, {
|
|
4576
|
+
kind: 'enum';
|
|
4577
|
+
}>;
|
|
4578
|
+
}
|
|
4579
|
+
interface AuditLogLabels {
|
|
4580
|
+
/** Names the list. */
|
|
4581
|
+
list: string;
|
|
4582
|
+
/** Names the filter group. */
|
|
4583
|
+
filters: string;
|
|
4584
|
+
when: string;
|
|
4585
|
+
actor: string;
|
|
4586
|
+
action: string;
|
|
4587
|
+
clearFilters: string;
|
|
4588
|
+
details: string;
|
|
4589
|
+
loadMore: string;
|
|
4590
|
+
/** Polite status while more entries load. */
|
|
4591
|
+
loadingMore: string;
|
|
4592
|
+
/** Polite status after more entries arrived. `{count}`. */
|
|
4593
|
+
loaded: string;
|
|
4594
|
+
/** Shown (as an alert) when `loadMoreError` is set; the Show older entries button retries. */
|
|
4595
|
+
loadMoreFailed: string;
|
|
4596
|
+
loading: string;
|
|
4597
|
+
empty: string;
|
|
4598
|
+
emptyDetail: string;
|
|
4599
|
+
filteredEmpty: string;
|
|
4600
|
+
filteredEmptyDetail: string;
|
|
4601
|
+
error: string;
|
|
4602
|
+
retry: string;
|
|
4603
|
+
forbidden: string;
|
|
4604
|
+
forbiddenDetail: string;
|
|
4605
|
+
}
|
|
4606
|
+
declare const DEFAULT_AUDIT_LOG_LABELS: AuditLogLabels;
|
|
4607
|
+
interface AuditLogProps extends Omit<HTMLAttributes<HTMLElement>, 'children'> {
|
|
4608
|
+
events: readonly AuditLogEvent[];
|
|
4609
|
+
/** Every action the log can show, by key: its label and the tone of its pill. */
|
|
4610
|
+
actions: Readonly<Record<string, AuditLogAction>>;
|
|
4611
|
+
/**
|
|
4612
|
+
* `ready` (default), `loading` (the first load: skeleton rows), `error`, or `forbidden`.
|
|
4613
|
+
* A reload with rows on show is `refreshing`, not `loading`.
|
|
4614
|
+
*/
|
|
4615
|
+
status?: 'ready' | 'loading' | 'error' | 'forbidden';
|
|
4616
|
+
/**
|
|
4617
|
+
* A reload is running (the filters changed): the rows on show stay in a `BusyRegion`, busy at
|
|
4618
|
+
* once, dimmed under a running bar after 300 ms. Skeleton rows are for `status="loading"` only.
|
|
4619
|
+
*/
|
|
4620
|
+
refreshing?: boolean;
|
|
4621
|
+
onRetry?: () => void;
|
|
4622
|
+
/** The actors offered in the Who filter. Without them there is no Who filter. */
|
|
4623
|
+
actors?: readonly FilterChoice[];
|
|
4624
|
+
/**
|
|
4625
|
+
* Names for actor ids in `filters.actor` that are not among `actors` (restored from a URL or a
|
|
4626
|
+
* saved view): the Who chip shows the names, not the ids.
|
|
4627
|
+
*/
|
|
4628
|
+
resolveActorLabels?: (ids: readonly string[]) => Promise<readonly FilterChoice[]>;
|
|
4629
|
+
/** The filters in effect (controlled). With `onFiltersChange`, the filter bar shows. */
|
|
4630
|
+
filters?: AuditLogFilters;
|
|
4631
|
+
onFiltersChange?: (filters: AuditLogFilters) => void;
|
|
4632
|
+
/** More, older entries exist: a Show older entries button calls `onLoadMore` (keyset paging). */
|
|
4633
|
+
hasMore?: boolean;
|
|
4634
|
+
onLoadMore?: () => void;
|
|
4635
|
+
loadingMore?: boolean;
|
|
4636
|
+
/** Loading older entries failed: the button stays to try again, with `labels.loadMoreFailed` beside it. */
|
|
4637
|
+
loadMoreError?: boolean;
|
|
4638
|
+
/** Locale of times and dates; a list falls back in order. */
|
|
4639
|
+
locale?: string | readonly string[];
|
|
4640
|
+
/**
|
|
4641
|
+
* The exact time shown beside the relative one. Default: `Intl` medium date and short time in
|
|
4642
|
+
* `locale`. Pass it where the browser lacks the locale's data (Chromium has none for `bs` and
|
|
4643
|
+
* prints "2026 M10 22"), or for a fixed product format.
|
|
4644
|
+
*/
|
|
4645
|
+
formatExact?: (date: Date) => string;
|
|
4646
|
+
/**
|
|
4647
|
+
* Time zone of the times shown, e.g. the practice's `Europe/Sarajevo`. Default: the viewer's.
|
|
4648
|
+
* A zone the browser does not know falls back to the viewer's (with a warning in development).
|
|
4649
|
+
*/
|
|
4650
|
+
timeZone?: string;
|
|
4651
|
+
/** Formats `YYYY-MM-DD` in a filter chip. Default: as given. */
|
|
4652
|
+
formatDate?: (date: string) => string;
|
|
4653
|
+
/** The current time, for stable relative times in tests and server renders. */
|
|
4654
|
+
now?: Date | number;
|
|
4655
|
+
labels?: Partial<AuditLogLabels>;
|
|
4656
|
+
}
|
|
4657
|
+
/**
|
|
4658
|
+
* Who opened or changed what, and when (HAR-987; MEDx S50 "Historija pristupa", POSx PRT-01 /
|
|
4659
|
+
* INT-01): an ordered list of entries (actor, a labelled action, the target, a relative time
|
|
4660
|
+
* with the exact one beside it, and an optional Details disclosure), filters by period, person
|
|
4661
|
+
* and action (chips that open `FilterEditor`s), keyset "Show older entries", and the first-load,
|
|
4662
|
+
* empty, filtered-empty, error and forbidden states. Presentational: the consumer fetches, keeps
|
|
4663
|
+
* the audit semantics, and supplies entries free of health data.
|
|
4664
|
+
*/
|
|
4665
|
+
declare function AuditLog({ events, actions, status, refreshing, onRetry, actors, resolveActorLabels, filters, onFiltersChange, hasMore, onLoadMore, loadingMore, loadMoreError, locale, formatExact, timeZone: zoneProp, formatDate, now, labels: labelOverrides, className, ...props }: AuditLogProps): react.JSX.Element;
|
|
4666
|
+
|
|
4667
|
+
interface TableWrapProps extends HTMLAttributes<HTMLDivElement> {
|
|
4668
|
+
/**
|
|
4669
|
+
* Polite live-region text for table state changes — "Sorted by …", "N results",
|
|
4670
|
+
* "N selected". Pass `useTable().announcement` straight through (UIX-A11Y-2).
|
|
4671
|
+
*/
|
|
4672
|
+
announcement?: string;
|
|
4673
|
+
/**
|
|
4674
|
+
* The rows are being fetched again (a filter, sort, page or saved-view change; HAR-2582). The
|
|
4675
|
+
* current rows stay and dim under an indeterminate bar along the top, and the wrap is
|
|
4676
|
+
* `aria-busy`; after 300 ms, held at least 500 ms. Keep the previous rows while fetching
|
|
4677
|
+
* (TanStack Query `placeholderData: keepPreviousData`); skeleton rows are for a first load.
|
|
4678
|
+
*/
|
|
4679
|
+
refreshing?: boolean;
|
|
4680
|
+
children?: ReactNode;
|
|
4681
|
+
}
|
|
4682
|
+
declare const TableWrap: react.ForwardRefExoticComponent<TableWrapProps & react.RefAttributes<HTMLDivElement>>;
|
|
4683
|
+
type TableDensity = 'compact' | 'standard' | 'comfortable';
|
|
4684
|
+
type SortDirection = 'ascending' | 'descending' | 'none';
|
|
4685
|
+
interface TableProps extends TableHTMLAttributes<HTMLTableElement> {
|
|
4686
|
+
density?: TableDensity;
|
|
4687
|
+
zebra?: boolean;
|
|
4688
|
+
pinnedCol?: boolean;
|
|
4689
|
+
/**
|
|
4690
|
+
* Freeze the last column at the right edge while the wrap scrolls sideways, so a trailing
|
|
4691
|
+
* row-actions column (peek, kebab) stays one click away. Pin the row's state with
|
|
4692
|
+
* `Tr selected` / `Tr pinned`: the frozen cell repaints those, not a consumer's own row class.
|
|
4693
|
+
*/
|
|
4694
|
+
pinnedActions?: boolean;
|
|
4695
|
+
/** table-layout: fixed — required for reliable column widths + primary-column truncation */
|
|
4696
|
+
fixed?: boolean;
|
|
4697
|
+
rowPeek?: boolean;
|
|
4698
|
+
v2?: boolean;
|
|
4699
|
+
}
|
|
4700
|
+
declare function Table({ density, zebra, pinnedCol, pinnedActions, fixed, rowPeek, v2, className, children, ...props }: TableProps): react.JSX.Element;
|
|
4701
|
+
interface ThProps extends ThHTMLAttributes<HTMLTableCellElement> {
|
|
4702
|
+
sortable?: boolean;
|
|
4703
|
+
sortDirection?: SortDirection;
|
|
4704
|
+
/** 1-based ordinal shown when this column is a secondary key in a multi-sort */
|
|
4705
|
+
sortOrder?: number;
|
|
4706
|
+
onSort?: () => void;
|
|
4707
|
+
}
|
|
4708
|
+
declare function Th({ sortable, sortDirection, sortOrder, onSort, className, children, onClick, ...props }: ThProps): react.JSX.Element;
|
|
4709
|
+
interface TdProps extends TdHTMLAttributes<HTMLTableCellElement> {
|
|
4710
|
+
pinned?: boolean;
|
|
4711
|
+
}
|
|
4712
|
+
declare function Td({ pinned, className, children, ...props }: TdProps): react.JSX.Element;
|
|
4713
|
+
interface TrProps extends HTMLAttributes<HTMLTableRowElement> {
|
|
4714
|
+
selected?: boolean;
|
|
4715
|
+
pinned?: boolean;
|
|
4716
|
+
}
|
|
4717
|
+
declare function Tr({ selected, pinned, className, children, ...props }: TrProps): react.JSX.Element;
|
|
4718
|
+
interface BulkBarProps extends HTMLAttributes<HTMLDivElement> {
|
|
4719
|
+
/** number of selected rows, rendered through `selectedLabel` */
|
|
4720
|
+
count?: number;
|
|
4721
|
+
children?: ReactNode;
|
|
4722
|
+
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4723
|
+
label?: string;
|
|
4724
|
+
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4725
|
+
selectedLabel?: (count: number) => ReactNode;
|
|
4726
|
+
}
|
|
4727
|
+
/** Contextual action bar shown above the table when ≥1 row is selected. */
|
|
4728
|
+
declare function BulkBar({ count, children, label, selectedLabel, className, ...props }: BulkBarProps): react.JSX.Element;
|
|
4729
|
+
interface RowActionsProps extends TdHTMLAttributes<HTMLTableCellElement> {
|
|
4730
|
+
children?: ReactNode;
|
|
4731
|
+
}
|
|
4732
|
+
/** Trailing cell that holds the row's hover actions (kebab, quick actions). */
|
|
4733
|
+
declare function RowActions({ children, className, ...props }: RowActionsProps): react.JSX.Element;
|
|
4734
|
+
interface RowActionProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
4735
|
+
children?: ReactNode;
|
|
4736
|
+
}
|
|
4737
|
+
/** A single hover-revealed row action button (icon inside). */
|
|
4738
|
+
declare function RowAction({ children, className, type, ...props }: RowActionProps): react.JSX.Element;
|
|
4739
|
+
interface ExpandToggleProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
4740
|
+
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4741
|
+
expandLabel?: string;
|
|
4742
|
+
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4743
|
+
collapseLabel?: string;
|
|
4744
|
+
expanded?: boolean;
|
|
4745
|
+
/** id of the detail row this toggle controls → `aria-controls` (UIX-A11Y-2). */
|
|
4746
|
+
controls?: string;
|
|
4747
|
+
}
|
|
4748
|
+
/** Chevron button that expands/collapses an inline detail row. */
|
|
4749
|
+
declare function ExpandToggle({ expanded, controls, expandLabel, collapseLabel, className, type, ...props }: ExpandToggleProps): react.JSX.Element;
|
|
4750
|
+
/** Emphasised primary cell text. */
|
|
4751
|
+
declare function CellStrong({ children, className, ...props }: HTMLAttributes<HTMLSpanElement>): react.JSX.Element;
|
|
4752
|
+
interface CellSubProps extends HTMLAttributes<HTMLSpanElement> {
|
|
4753
|
+
/**
|
|
4754
|
+
* Tabular numerals (HAR-1815): for a read-back code, a reference or a time, so digits line up
|
|
4755
|
+
* down the column and a 1 is as wide as an 8.
|
|
4756
|
+
*/
|
|
4757
|
+
tabular?: boolean;
|
|
4758
|
+
}
|
|
4759
|
+
/** Secondary line under a primary cell value (muted, meta size). */
|
|
4760
|
+
declare function CellSub({ tabular, children, className, ...props }: CellSubProps): react.JSX.Element;
|
|
4761
|
+
interface MarkProps extends HTMLAttributes<HTMLElement> {
|
|
4762
|
+
children?: ReactNode;
|
|
4763
|
+
}
|
|
4764
|
+
/** A search-match highlight span. */
|
|
4765
|
+
declare function Mark({ children, className, ...props }: MarkProps): react.JSX.Element;
|
|
4766
|
+
interface HighlightedProps {
|
|
4767
|
+
text: string;
|
|
4768
|
+
query: string;
|
|
4769
|
+
}
|
|
4770
|
+
/** Render `text` with case-insensitive matches of `query` wrapped in <mark>. */
|
|
4771
|
+
declare function Highlighted({ text, query }: HighlightedProps): react.JSX.Element;
|
|
4772
|
+
|
|
4773
|
+
interface ViewMenuColumn {
|
|
4774
|
+
id: string;
|
|
4775
|
+
label: ReactNode;
|
|
4776
|
+
visible: boolean;
|
|
4777
|
+
disabled?: boolean;
|
|
4778
|
+
/** Always shown (e.g. the record id): the row has no checkbox and no Hide / Show, its name sits in the checkbox's slot. */
|
|
4779
|
+
required?: boolean;
|
|
4780
|
+
/** Plain-text name for the `{label}` templates in `columnLabels` when `label` is not a string. */
|
|
4781
|
+
textLabel?: string;
|
|
4782
|
+
}
|
|
4783
|
+
/**
|
|
4784
|
+
* Words for the column rows. `{label}` is replaced by the column name; `moved` also gets
|
|
4785
|
+
* `{position}` and `{count}`. Every key has an English default.
|
|
4786
|
+
*/
|
|
4787
|
+
interface ViewMenuColumnLabels {
|
|
4788
|
+
/** Name of a row's ⋯ menu button and of the menu. Default `Column actions: {label}`. */
|
|
4789
|
+
rowActions: string;
|
|
4790
|
+
/** Name of a row's drag grip. Default `Drag to reorder: {label}`. */
|
|
4791
|
+
reorder: string;
|
|
4792
|
+
moveUp: string;
|
|
4793
|
+
moveDown: string;
|
|
4794
|
+
hide: string;
|
|
4795
|
+
show: string;
|
|
4796
|
+
/** Tooltip on a required column's name. Default `Always shown`. */
|
|
4797
|
+
required: string;
|
|
4798
|
+
/** Polite announcement after a move. Default `{label} moved to position {position} of {count}`. */
|
|
4799
|
+
moved: string;
|
|
4800
|
+
}
|
|
4801
|
+
interface ViewMenuProps {
|
|
4802
|
+
/** The density section renders when `densityOptions` and `onDensityChange` are given. */
|
|
4803
|
+
density?: string;
|
|
4804
|
+
densityLabel?: ReactNode;
|
|
4805
|
+
densityOptions?: readonly {
|
|
4806
|
+
value: string;
|
|
4807
|
+
label: ReactNode;
|
|
4808
|
+
}[];
|
|
4809
|
+
onDensityChange?: (value: string) => void;
|
|
4810
|
+
/** Optional title over the zebra / freeze switches. */
|
|
4811
|
+
displayLabel?: ReactNode;
|
|
4812
|
+
zebra?: {
|
|
4813
|
+
checked: boolean;
|
|
4814
|
+
label: ReactNode;
|
|
4815
|
+
onChange: (checked: boolean) => void;
|
|
4816
|
+
};
|
|
4817
|
+
freeze?: {
|
|
4818
|
+
checked: boolean;
|
|
4819
|
+
label: ReactNode;
|
|
4820
|
+
onChange: (checked: boolean) => void;
|
|
4821
|
+
};
|
|
4822
|
+
columns?: readonly ViewMenuColumn[];
|
|
4823
|
+
columnsLabel?: ReactNode;
|
|
4824
|
+
onColumnVisibilityChange?: (id: string, visible: boolean) => void;
|
|
4825
|
+
/**
|
|
4826
|
+
* Turns on reordering: every column row gets a drag grip (pointer; ArrowUp / ArrowDown once
|
|
4827
|
+
* focused) and a ⋯ menu with Move up · Move down · Hide / Show, which is the keyboard path.
|
|
4828
|
+
* Receives every column id, first to last. The order is the application's to persist.
|
|
4829
|
+
*/
|
|
4830
|
+
onReorder?: (orderedIds: string[]) => void;
|
|
4831
|
+
columnLabels?: Partial<ViewMenuColumnLabels>;
|
|
4832
|
+
/** Pinned under the columns, e.g. a Reset sort `.uix-menu__item` button. */
|
|
4833
|
+
footer?: ReactNode;
|
|
4834
|
+
className?: string;
|
|
4835
|
+
}
|
|
4836
|
+
/**
|
|
4837
|
+
* Controlled table presentation panel with its own surface: density, zebra / freeze and a column
|
|
4838
|
+
* list under sticky section titles. A column row is grip · checkbox · name · ⋯ (grip and ⋯ with
|
|
4839
|
+
* `onReorder`). Usable inside a Popover or any overlay shell, including one that adds no chrome.
|
|
4840
|
+
*/
|
|
4841
|
+
declare function ViewMenu({ density, densityLabel, densityOptions, onDensityChange, displayLabel, zebra, freeze, columns, columnsLabel, onColumnVisibilityChange, onReorder, columnLabels, footer, className, }: ViewMenuProps): react.JSX.Element;
|
|
4842
|
+
interface FilterOption {
|
|
4843
|
+
value: string;
|
|
4844
|
+
label: string;
|
|
4845
|
+
}
|
|
4846
|
+
interface FilterPopoverProps {
|
|
4847
|
+
label: ReactNode;
|
|
4848
|
+
type?: 'text' | 'number' | 'date' | 'select' | 'enum' | 'boolean';
|
|
4849
|
+
value: string;
|
|
4850
|
+
onValueChange: (value: string) => void;
|
|
4851
|
+
options?: readonly FilterOption[];
|
|
4852
|
+
applyLabel: ReactNode;
|
|
4853
|
+
clearLabel: ReactNode;
|
|
4854
|
+
onApply: () => void;
|
|
4855
|
+
onClear: () => void;
|
|
4856
|
+
placeholder?: string;
|
|
4857
|
+
}
|
|
4858
|
+
/** Controlled filter editor content; applications own query serialization and the popover trigger. */
|
|
4859
|
+
declare function FilterPopover({ label, type, value, onValueChange, options, applyLabel, clearLabel, onApply, onClear, placeholder }: FilterPopoverProps): react.JSX.Element;
|
|
4860
|
+
interface SavedViewItem {
|
|
4861
|
+
id: string;
|
|
4862
|
+
label: ReactNode;
|
|
4863
|
+
active?: boolean;
|
|
4864
|
+
pinned?: boolean;
|
|
4865
|
+
}
|
|
4866
|
+
/** A titled group of saved views, e.g. the user's custom views above the built-in presets. */
|
|
4867
|
+
interface SavedViewSection {
|
|
4868
|
+
id: string;
|
|
4869
|
+
label: ReactNode;
|
|
4870
|
+
items: readonly SavedViewItem[];
|
|
4871
|
+
}
|
|
4872
|
+
interface SavedViewMenuBaseProps {
|
|
4873
|
+
onSelect: (id: string) => void;
|
|
4874
|
+
emptyLabel?: ReactNode;
|
|
4875
|
+
/** The row's overflow slot (e.g. a ⋯ menu trigger). It stays quiet until the row is hovered or focused, or its menu is open. */
|
|
4876
|
+
actions?: (item: SavedViewItem) => ReactNode;
|
|
4877
|
+
footer?: ReactNode;
|
|
4878
|
+
}
|
|
4879
|
+
type SavedViewMenuProps = SavedViewMenuBaseProps & ({
|
|
4880
|
+
items: readonly SavedViewItem[];
|
|
4881
|
+
sections?: never;
|
|
4882
|
+
} | {
|
|
4883
|
+
sections: readonly SavedViewSection[];
|
|
4884
|
+
items?: never;
|
|
4885
|
+
}) & ({
|
|
4886
|
+
onPinChange: (id: string, pinned: boolean) => void;
|
|
4887
|
+
pinLabel: string;
|
|
4888
|
+
unpinLabel: string;
|
|
4889
|
+
} | {
|
|
4890
|
+
onPinChange?: undefined;
|
|
4891
|
+
pinLabel?: never;
|
|
4892
|
+
unpinLabel?: never;
|
|
4893
|
+
}) & ({
|
|
4894
|
+
/**
|
|
4895
|
+
* Adds a drag grip to every row. Rows move only within their own section; the
|
|
4896
|
+
* callback receives that section's full id order (and its id when `sections` is used).
|
|
4897
|
+
* The grip also moves its row with ArrowUp / ArrowDown.
|
|
4898
|
+
*/
|
|
4899
|
+
onReorder: (orderedIds: string[], sectionId: string | undefined) => void;
|
|
4900
|
+
/** Accessible name of the grip; the row's name is attached as its description. */
|
|
4901
|
+
reorderLabel: string;
|
|
4902
|
+
} | {
|
|
4903
|
+
onReorder?: undefined;
|
|
4904
|
+
reorderLabel?: never;
|
|
4905
|
+
});
|
|
4906
|
+
/**
|
|
4907
|
+
* Generic saved-view selector: optional titled sections inside one `.uix-menu`, rows of
|
|
4908
|
+
* grip · name · overflow. The selected row is tinted as a whole (no check glyph). Persistence,
|
|
4909
|
+
* ownership, permissions and labels remain application concerns.
|
|
4910
|
+
*/
|
|
4911
|
+
declare function SavedViewMenu({ items, sections, onSelect, onPinChange, pinLabel, unpinLabel, onReorder, reorderLabel, emptyLabel, actions, footer }: SavedViewMenuProps): react.JSX.Element;
|
|
4912
|
+
|
|
4913
|
+
/** Every word the workspace renders or announces. `{…}` are placeholders. */
|
|
4914
|
+
interface DataWorkspaceLabels {
|
|
4915
|
+
search: string;
|
|
4916
|
+
searchPlaceholder: string;
|
|
4917
|
+
addFilter: string;
|
|
4918
|
+
clearFilters: string;
|
|
4919
|
+
/** The saved-view trigger's name before the current view: "View: {name}". */
|
|
4920
|
+
savedView: string;
|
|
4921
|
+
view: string;
|
|
4922
|
+
saveView: string;
|
|
4923
|
+
saveViewAs: string;
|
|
4924
|
+
maximize: string;
|
|
4925
|
+
restore: string;
|
|
4926
|
+
selectAll: string;
|
|
4927
|
+
/** `{label}`: the row's id. */
|
|
4928
|
+
selectRow: string;
|
|
4929
|
+
/** `{count}` selected, in the bulk bar. */
|
|
4930
|
+
selected: string;
|
|
4931
|
+
bulkActions: string;
|
|
4932
|
+
/** The record-id cell's ↗ button. `{label}`. */
|
|
4933
|
+
open: string;
|
|
4934
|
+
rowActions: string;
|
|
4935
|
+
/** Offset footer: `{from}`, `{to}`, `{total}`. */
|
|
4936
|
+
range: string;
|
|
4937
|
+
rowsPerPage: string;
|
|
4938
|
+
loading: string;
|
|
4939
|
+
empty: string;
|
|
4940
|
+
emptyDetail: string;
|
|
4941
|
+
filteredEmpty: string;
|
|
4942
|
+
filteredEmptyDetail: string;
|
|
4943
|
+
error: string;
|
|
4944
|
+
retry: string;
|
|
4945
|
+
}
|
|
4946
|
+
declare const DEFAULT_DATA_WORKSPACE_LABELS: DataWorkspaceLabels;
|
|
4947
|
+
interface DataWorkspaceColumn<T> {
|
|
4948
|
+
id: string;
|
|
4949
|
+
header: ReactNode;
|
|
4950
|
+
cell: (row: T) => ReactNode;
|
|
4951
|
+
sortable?: boolean;
|
|
4952
|
+
/** `end` for numbers and amounts. */
|
|
4953
|
+
align?: 'start' | 'end';
|
|
4954
|
+
/** A CSS width for the column, e.g. `12rem`. */
|
|
4955
|
+
width?: string;
|
|
4956
|
+
}
|
|
4957
|
+
interface DataWorkspaceSort {
|
|
4958
|
+
columnId: string;
|
|
4959
|
+
direction: 'ascending' | 'descending';
|
|
4960
|
+
}
|
|
4961
|
+
/** The record-id column: the first column, the row's way into its record. */
|
|
4962
|
+
interface DataWorkspaceIdColumn<T> {
|
|
4963
|
+
header: ReactNode;
|
|
4964
|
+
/** The id as shown, e.g. "INC-20418". Also names the row's checkbox and ↗ button. */
|
|
4965
|
+
text: (row: T) => string;
|
|
4966
|
+
/** The id button opens a peek of the record. */
|
|
4967
|
+
onPeek?: (row: T) => void;
|
|
4968
|
+
/** The ↗ link goes to the full record. */
|
|
4969
|
+
href?: (row: T) => string;
|
|
4970
|
+
renderLink?: UixRenderLink;
|
|
4971
|
+
}
|
|
4972
|
+
type DataWorkspacePagination = {
|
|
4973
|
+
mode: 'offset';
|
|
4974
|
+
page: number;
|
|
4975
|
+
pageSize: number;
|
|
4976
|
+
total: number;
|
|
4977
|
+
onPageChange: (page: number) => void;
|
|
4978
|
+
pageSizes?: readonly number[];
|
|
4979
|
+
onPageSizeChange?: (size: number) => void;
|
|
4980
|
+
} | {
|
|
4981
|
+
mode: 'cursor';
|
|
4982
|
+
hasPrevious: boolean;
|
|
4983
|
+
hasNext: boolean;
|
|
4984
|
+
onFirst?: () => void;
|
|
4985
|
+
onPrevious: () => void;
|
|
4986
|
+
onNext: () => void;
|
|
4987
|
+
summary?: ReactNode;
|
|
4988
|
+
pageSize?: number;
|
|
4989
|
+
pageSizes?: readonly number[];
|
|
4990
|
+
onPageSizeChange?: (size: number) => void;
|
|
4991
|
+
};
|
|
4992
|
+
interface DataWorkspaceProps<T> extends Omit<HTMLAttributes<HTMLElement>, 'children'> {
|
|
4993
|
+
/** Names the workspace region and the table. */
|
|
4994
|
+
label: string;
|
|
4995
|
+
rows: readonly T[];
|
|
4996
|
+
getRowId: (row: T) => string;
|
|
4997
|
+
columns: readonly DataWorkspaceColumn<T>[];
|
|
4998
|
+
idColumn?: DataWorkspaceIdColumn<T>;
|
|
4999
|
+
sort?: DataWorkspaceSort | null;
|
|
5000
|
+
onSortChange?: (sort: DataWorkspaceSort | null) => void;
|
|
5001
|
+
/** The selected row ids. Kept by id, so a refresh or a new page keeps them. */
|
|
5002
|
+
selection?: ReadonlySet<string>;
|
|
5003
|
+
onSelectionChange?: (selection: Set<string>) => void;
|
|
5004
|
+
/** The bulk bar's actions for the selection (a `Menu` for the overflow). */
|
|
5005
|
+
bulkActions?: (selectedIds: string[]) => ReactNode;
|
|
5006
|
+
/**
|
|
5007
|
+
* A row's actions (a `Menu`, quick buttons), in a column frozen at the right edge and sized to
|
|
5008
|
+
* them. Return `null` for a row without actions; with none on the page there is no column.
|
|
5009
|
+
*/
|
|
5010
|
+
rowActions?: (row: T) => ReactNode;
|
|
5011
|
+
/** More props for a row, e.g. a data attribute that marks it changed (see ChangeHighlight, PR #164). */
|
|
5012
|
+
getRowProps?: (row: T) => HTMLAttributes<HTMLTableRowElement> & Record<`data-${string}`, string | undefined>;
|
|
5013
|
+
density?: TableDensity;
|
|
5014
|
+
/**
|
|
5015
|
+
* Toolbar: the search field. Ctrl/⌘ + / focuses it from inside the workspace, or from the page
|
|
5016
|
+
* when nothing has focus and this is the page's first workspace.
|
|
5017
|
+
*/
|
|
5018
|
+
search?: {
|
|
5019
|
+
value: string;
|
|
5020
|
+
onChange: (value: string) => void;
|
|
5021
|
+
label?: string;
|
|
5022
|
+
placeholder?: string;
|
|
5023
|
+
};
|
|
5024
|
+
/**
|
|
5025
|
+
* Toolbar: filter chips and "+ Filter" over `FilterEditor`. A chip whose value holds ids
|
|
5026
|
+
* restored from a URL or saved view asks `field.resolveLabels` for their names.
|
|
5027
|
+
*/
|
|
5028
|
+
filters?: {
|
|
5029
|
+
fields: readonly FilterField[];
|
|
5030
|
+
values: Readonly<Record<string, FilterValue | undefined>>;
|
|
5031
|
+
onChange: (fieldId: string, value: FilterValue | undefined) => void;
|
|
5032
|
+
/** Rows matching each filter, shown on its chip. */
|
|
5033
|
+
counts?: Readonly<Record<string, number>>;
|
|
5034
|
+
summary?: SummarizeFilterOptions;
|
|
5035
|
+
};
|
|
5036
|
+
/** Toolbar: the saved-view trigger, named by the current view, opening a `SavedViewMenu`. */
|
|
5037
|
+
savedViews?: {
|
|
5038
|
+
current: ReactNode;
|
|
5039
|
+
menu: SavedViewMenuProps;
|
|
5040
|
+
};
|
|
5041
|
+
/** Toolbar: the View button, opening a `ViewMenu` (columns, density). */
|
|
5042
|
+
viewMenu?: ViewMenuProps;
|
|
5043
|
+
/** The view differs from its saved version: Save changes and Save as show. */
|
|
5044
|
+
viewChanged?: boolean;
|
|
5045
|
+
onSaveView?: () => void;
|
|
5046
|
+
onSaveViewAs?: () => void;
|
|
5047
|
+
/** Toolbar: a maximize toggle; Escape restores, unless an open popover or menu takes it first. */
|
|
5048
|
+
maximized?: boolean;
|
|
5049
|
+
onMaximizedChange?: (maximized: boolean) => void;
|
|
5050
|
+
/** Toolbar: the product's own actions at the end ("New incident"). */
|
|
5051
|
+
toolbarEnd?: ReactNode;
|
|
5052
|
+
pagination?: DataWorkspacePagination;
|
|
5053
|
+
/** `loading`: the first load (skeleton rows). `error`: with `onRetry`. */
|
|
5054
|
+
status?: 'ready' | 'loading' | 'error';
|
|
5055
|
+
/** A refetch (filter, sort, page, saved view): the rows stay under `TableWrap refreshing`. */
|
|
5056
|
+
refreshing?: boolean;
|
|
5057
|
+
onRetry?: () => void;
|
|
5058
|
+
labels?: Partial<DataWorkspaceLabels>;
|
|
5059
|
+
}
|
|
5060
|
+
/**
|
|
5061
|
+
* The generic presentation half of a product's data table (HAR-1388; TENSOR `data-table.tsx`,
|
|
5062
|
+
* MOTUS `UixDataWorkspace.tsx`; UIx ADR-0005). Composes the kit's pieces in one order: saved
|
|
5063
|
+
* view · Save changes / Save as (when the view changed) · filter chips and "+ Filter" ·
|
|
5064
|
+
* search (Ctrl/⌘ + /) · View · maximize · the product's actions; a `Table` with a record-id cell (id → peek, ↗ → record),
|
|
5065
|
+
* selection with Shift-click ranges, a frozen row-actions column and a `BulkBar`; an "x–y of N"
|
|
5066
|
+
* footer with rows per page and `Pagination` (offset or cursor); first-load, empty,
|
|
5067
|
+
* filtered-empty and error states, and a refetch that keeps the rows. Prop-driven: the product
|
|
5068
|
+
* keeps its surface registry, URL state, data fetching and permissions.
|
|
5069
|
+
*/
|
|
5070
|
+
declare function DataWorkspace<T>({ label, rows, getRowId, columns, idColumn, sort, onSortChange, selection, onSelectionChange, bulkActions, rowActions, getRowProps, density, search, filters, savedViews, viewMenu, viewChanged, onSaveView, onSaveViewAs, maximized, onMaximizedChange, toolbarEnd, pagination, status, refreshing, onRetry, labels: labelOverrides, className, ...props }: DataWorkspaceProps<T>): react.JSX.Element;
|
|
5071
|
+
|
|
5072
|
+
/**
|
|
5073
|
+
* Kit chrome strings by component (HAR-1358; TENSOR C20, MOTUS executive summary #3).
|
|
5074
|
+
* Each entry overrides that component's English defaults for every instance below the
|
|
5075
|
+
* provider; an explicit prop on one instance still wins.
|
|
5076
|
+
*
|
|
5077
|
+
* Client components read the provider. Server-renderable ones (`Pagination`, `BulkBar`)
|
|
5078
|
+
* cannot read context: pass `labels` from `useUixLabels()` in a client parent, or translate
|
|
5079
|
+
* on the server.
|
|
5080
|
+
*/
|
|
5081
|
+
interface UixLabels {
|
|
5082
|
+
/** The words a `Button` with `result` shows for a moment after its action (HAR-2581). */
|
|
5083
|
+
buttonResult?: Partial<ButtonResultLabels>;
|
|
5084
|
+
modal?: {
|
|
5085
|
+
close?: string;
|
|
5086
|
+
};
|
|
5087
|
+
drawer?: {
|
|
5088
|
+
close?: string;
|
|
5089
|
+
};
|
|
5090
|
+
/** The "Discard changes?" step of a `dirty` Drawer or Modal (HAR-2029). */
|
|
5091
|
+
discardPrompt?: Partial<DiscardPromptLabels>;
|
|
5092
|
+
peek?: {
|
|
5093
|
+
previous?: string;
|
|
5094
|
+
next?: string;
|
|
5095
|
+
close?: string;
|
|
5096
|
+
};
|
|
5097
|
+
/** `Lightbox` (HAR-1826): previous / next / close, the counter, the zoom toggle. */
|
|
5098
|
+
lightbox?: Partial<LightboxLabels>;
|
|
5099
|
+
toast?: {
|
|
5100
|
+
dismiss?: string;
|
|
2902
5101
|
};
|
|
2903
5102
|
toaster?: {
|
|
2904
5103
|
region?: string;
|
|
2905
5104
|
};
|
|
5105
|
+
/**
|
|
5106
|
+
* `openNav`: the phone-tier button that opens the navigation drawer; `navigation`: that
|
|
5107
|
+
* drawer's title (HAR-1371).
|
|
5108
|
+
*/
|
|
2906
5109
|
appShell?: {
|
|
2907
5110
|
skipToContent?: string;
|
|
2908
5111
|
exitFocus?: string;
|
|
5112
|
+
openNav?: string;
|
|
5113
|
+
navigation?: string;
|
|
2909
5114
|
};
|
|
5115
|
+
/** `ThemeSwitcher` and `DisplayPreferences` (HAR-1372): the setting names and their choices. */
|
|
5116
|
+
displayPreferences?: Partial<DisplayPreferencesLabels>;
|
|
5117
|
+
/** `AccountMenu` (HAR-1371): the menu's name. */
|
|
5118
|
+
accountMenu?: Partial<AccountMenuLabels>;
|
|
2910
5119
|
sidebar?: {
|
|
2911
5120
|
expand?: string;
|
|
2912
5121
|
collapse?: string;
|
|
@@ -2916,32 +5125,65 @@ interface UixLabels {
|
|
|
2916
5125
|
};
|
|
2917
5126
|
/** `SearchBar` (HAR-2030): the clear button's name and the submit button's text. */
|
|
2918
5127
|
searchBar?: Partial<SearchBarLabels>;
|
|
2919
|
-
/**
|
|
5128
|
+
/**
|
|
5129
|
+
* `resultsOne` / `resultsMany`: the polite result count; `{count}`. Items mode (HAR-1378):
|
|
5130
|
+
* `empty` when nothing matches, `recent` the heading of the recent items.
|
|
5131
|
+
*/
|
|
2920
5132
|
commandPalette?: {
|
|
2921
5133
|
input?: string;
|
|
2922
5134
|
resultsOne?: string;
|
|
2923
5135
|
resultsMany?: string;
|
|
5136
|
+
empty?: string;
|
|
5137
|
+
recent?: string;
|
|
2924
5138
|
};
|
|
5139
|
+
/** `QrCode` (HAR-1251): the text shown when the value is too long for a QR code. */
|
|
5140
|
+
qrCode?: Partial<QrCodeLabels>;
|
|
5141
|
+
/** `CodeDisplay` (HAR-1253): the countdown, the expiry announcements, the copy button's words. */
|
|
5142
|
+
codeDisplay?: Partial<CodeDisplayLabels>;
|
|
5143
|
+
/** `ContactCard` (HAR-1379): the Email / Call actions and the erased and unavailable states. */
|
|
5144
|
+
contactCard?: Partial<ContactCardLabels>;
|
|
5145
|
+
/** `PrintSignature` (HAR-986): the captions of the signature line and the stamp box. */
|
|
5146
|
+
printLayout?: Partial<PrintLayoutLabels>;
|
|
5147
|
+
/** `QrScanner` (HAR-1254): the start / stop buttons, every state's title and text, the read announcement. */
|
|
5148
|
+
qrScanner?: Partial<QrScannerLabels>;
|
|
2925
5149
|
entityPicker?: Partial<EntityPickerLabels>;
|
|
2926
5150
|
tree?: Partial<TreeLabels>;
|
|
2927
5151
|
/** `OrgChart` (HAR-1807): loading and error rows, the report count, the zoom toolbar. */
|
|
2928
5152
|
orgChart?: Partial<OrgChartLabels>;
|
|
2929
5153
|
inlineEdit?: Partial<InlineEditLabels>;
|
|
5154
|
+
/** `SortableList` (HAR-1375): the grip, Move up / Move down, the move announcement. */
|
|
5155
|
+
sortableList?: Partial<SortableListLabels>;
|
|
5156
|
+
/** `typeToConfirmMismatch` (HAR-1831): `{value}` is the text to type. */
|
|
2930
5157
|
confirmDialog?: {
|
|
2931
5158
|
typeToConfirm?: string;
|
|
2932
5159
|
compensation?: string;
|
|
5160
|
+
typeToConfirmMismatch?: string;
|
|
2933
5161
|
};
|
|
2934
5162
|
schedulingCalendar?: Partial<SchedulingCalendarLabels>;
|
|
2935
5163
|
dateRangePicker?: Partial<DateRangePickerLabels>;
|
|
2936
5164
|
datePicker?: Partial<DatePickerLabels>;
|
|
2937
5165
|
dateTimePicker?: Partial<DateTimePickerLabels>;
|
|
5166
|
+
/** `TimePicker` (HAR-1835), also the time part of `DateTimePicker`. */
|
|
5167
|
+
timePicker?: Partial<TimePickerLabels>;
|
|
2938
5168
|
schedulingTimeline?: Partial<SchedulingTimelineLabels>;
|
|
2939
5169
|
textDiff?: Partial<TextDiffLabels>;
|
|
5170
|
+
/** `DiffViewer` (HAR-1369): the version names, the resolution buttons, the summary. */
|
|
5171
|
+
diffViewer?: Partial<DiffViewerLabels>;
|
|
5172
|
+
/** `MatchReview` (HAR-1369): the decision table, bulk actions and the adopt mode. */
|
|
5173
|
+
matchReview?: Partial<MatchReviewLabels>;
|
|
5174
|
+
/** `AuditLog` (HAR-987): the filters, Details, Show older entries, and every state. */
|
|
5175
|
+
auditLog?: Partial<AuditLogLabels>;
|
|
5176
|
+
/** `DataWorkspace` (HAR-1388): the toolbar, selection, footer and states. */
|
|
5177
|
+
dataWorkspace?: Partial<DataWorkspaceLabels>;
|
|
2940
5178
|
filterEditor?: Partial<FilterEditorLabels>;
|
|
2941
5179
|
select?: Partial<SelectLabels>;
|
|
2942
5180
|
ruleBuilder?: Partial<RuleBuilderLabels>;
|
|
2943
5181
|
fileUpload?: Partial<FileUploadLabels>;
|
|
2944
5182
|
attachment?: Partial<AttachmentLabels>;
|
|
5183
|
+
/** `TagInput` (HAR-1377): the chips' × names, the announcements and the refusals. */
|
|
5184
|
+
tagInput?: Partial<TagInputLabels>;
|
|
5185
|
+
/** `PasswordInput` (HAR-1376): the reveal toggle's name. */
|
|
5186
|
+
passwordInput?: Partial<PasswordInputLabels>;
|
|
2945
5187
|
/** `remove`: the name of a removable chip's × button; `{label}` is the chip text. */
|
|
2946
5188
|
chip?: {
|
|
2947
5189
|
remove?: string;
|
|
@@ -2950,6 +5192,8 @@ interface UixLabels {
|
|
|
2950
5192
|
alert?: {
|
|
2951
5193
|
dismiss?: string;
|
|
2952
5194
|
};
|
|
5195
|
+
/** Not words: the date format of every date field (HAR-2432). See {@link UixDateFormat}. */
|
|
5196
|
+
dateFormat?: UixDateFormat;
|
|
2953
5197
|
/** Read by `useUixLabels()` callers; `Pagination` itself is server-safe and takes `labels`. */
|
|
2954
5198
|
pagination?: Partial<PaginationLabels>;
|
|
2955
5199
|
/** Read by `useUixLabels()` callers; `BulkBar` itself is server-safe and takes `label`. */
|
|
@@ -2957,44 +5201,57 @@ interface UixLabels {
|
|
|
2957
5201
|
region?: string;
|
|
2958
5202
|
};
|
|
2959
5203
|
}
|
|
5204
|
+
/**
|
|
5205
|
+
* One date format for every date field below the provider (HAR-2432): `DatePicker`,
|
|
5206
|
+
* `DateTimePicker`, `DateRangePicker` and `TimePicker` (its `locale`). Each field's own prop wins.
|
|
5207
|
+
*/
|
|
5208
|
+
interface UixDateFormat {
|
|
5209
|
+
/** The locale of the field's text, month and weekday names, and the clock. */
|
|
5210
|
+
locale?: string;
|
|
5211
|
+
/** How a field writes a `YYYY-MM-DD` date, e.g. `(d) => d.split('-').reverse().join('.')`. */
|
|
5212
|
+
formatDate?: (date: string) => string;
|
|
5213
|
+
/** Read typed text into `YYYY-MM-DD`, or `null` when it is not a date. Pass it with `formatDate`. */
|
|
5214
|
+
parseDate?: (text: string) => string | null;
|
|
5215
|
+
/** The date field's placeholder, e.g. `TT.MM.JJJJ`. */
|
|
5216
|
+
placeholder?: string;
|
|
5217
|
+
}
|
|
2960
5218
|
interface UixLabelsProviderProps {
|
|
2961
5219
|
labels: UixLabels;
|
|
2962
5220
|
children?: ReactNode;
|
|
2963
5221
|
}
|
|
2964
|
-
/** Translates kit chrome once for a subtree. Nested providers merge per component. */
|
|
2965
|
-
declare function UixLabelsProvider({ labels, children }: UixLabelsProviderProps): react.JSX.Element;
|
|
2966
|
-
/** The chrome strings in effect here (empty outside a provider). */
|
|
2967
|
-
declare function useUixLabels(): UixLabels;
|
|
2968
|
-
|
|
2969
|
-
interface
|
|
2970
|
-
|
|
2971
|
-
|
|
2972
|
-
|
|
2973
|
-
|
|
2974
|
-
|
|
2975
|
-
|
|
2976
|
-
|
|
2977
|
-
|
|
2978
|
-
|
|
2979
|
-
|
|
2980
|
-
|
|
2981
|
-
|
|
2982
|
-
|
|
2983
|
-
|
|
2984
|
-
className?: string;
|
|
2985
|
-
/** Injected by `<Field>` when it wraps the group; forwarded onto the child control. */
|
|
2986
|
-
id?: string;
|
|
2987
|
-
'aria-describedby'?: string;
|
|
5222
|
+
/** Translates kit chrome once for a subtree. Nested providers merge per component. */
|
|
5223
|
+
declare function UixLabelsProvider({ labels, children }: UixLabelsProviderProps): react.JSX.Element;
|
|
5224
|
+
/** The chrome strings in effect here (empty outside a provider). */
|
|
5225
|
+
declare function useUixLabels(): UixLabels;
|
|
5226
|
+
|
|
5227
|
+
interface OtpInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'onChange' | 'type' | 'size' | 'maxLength' | 'pattern' | 'inputMode'> {
|
|
5228
|
+
/** How many characters the code has. Default 6. */
|
|
5229
|
+
length?: number;
|
|
5230
|
+
/** Controlled value: the characters typed so far. */
|
|
5231
|
+
value?: string;
|
|
5232
|
+
defaultValue?: string;
|
|
5233
|
+
/** Every change, with the cleaned code (only allowed characters, at most `length`). */
|
|
5234
|
+
onValueChange?: (value: string) => void;
|
|
5235
|
+
/** Called once each time the code reaches `length` characters. */
|
|
5236
|
+
onComplete?: (code: string) => void;
|
|
5237
|
+
/** `numeric` (default): digits, with the phone's number pad. `alphanumeric`: letters and digits, upper-cased. */
|
|
5238
|
+
mode?: 'numeric' | 'alphanumeric';
|
|
5239
|
+
/** Draw a gap after every n cells (3 → "123 456"). Visual only: the value has no separator. */
|
|
5240
|
+
groupSize?: number;
|
|
5241
|
+
invalid?: boolean;
|
|
2988
5242
|
'aria-invalid'?: AriaAttributes['aria-invalid'];
|
|
2989
|
-
|
|
5243
|
+
className?: string;
|
|
5244
|
+
style?: CSSProperties;
|
|
2990
5245
|
}
|
|
2991
5246
|
/**
|
|
2992
|
-
*
|
|
2993
|
-
*
|
|
2994
|
-
*
|
|
2995
|
-
* the
|
|
5247
|
+
* A one-time code (HAR-1376): ONE native input, so screen readers, the phone's code autofill
|
|
5248
|
+
* (`autoComplete="one-time-code"`) and password managers see a single field, drawn as `length`
|
|
5249
|
+
* cells. Pasting "123 456" or "123-456" keeps the characters; typing past the end is ignored;
|
|
5250
|
+
* Backspace deletes the last one. `onComplete(code)` runs when the last character arrives. Put it in
|
|
5251
|
+
* a `Field` for its label, hint and error (the cells turn red with `aria-invalid`). `name` submits
|
|
5252
|
+
* the code. `ref` is the input.
|
|
2996
5253
|
*/
|
|
2997
|
-
declare
|
|
5254
|
+
declare const OtpInput: react.ForwardRefExoticComponent<OtpInputProps & react.RefAttributes<HTMLInputElement>>;
|
|
2998
5255
|
|
|
2999
5256
|
interface ComboboxOption {
|
|
3000
5257
|
value: string;
|
|
@@ -3002,21 +5259,50 @@ interface ComboboxOption {
|
|
|
3002
5259
|
keywords?: readonly string[];
|
|
3003
5260
|
disabled?: boolean;
|
|
3004
5261
|
}
|
|
5262
|
+
/** A titled group of options (HAR-1588). */
|
|
5263
|
+
interface ComboboxGroup {
|
|
5264
|
+
label: string;
|
|
5265
|
+
options: readonly ComboboxOption[];
|
|
5266
|
+
/** Disables every option in the group. */
|
|
5267
|
+
disabled?: boolean;
|
|
5268
|
+
}
|
|
3005
5269
|
declare function filterComboboxOptions(options: readonly ComboboxOption[], query: string): ComboboxOption[];
|
|
5270
|
+
/** Options and groups that match `query` (label, value or keywords); a group stays when any of its options does. */
|
|
5271
|
+
declare function filterComboboxItems(items: readonly (ComboboxOption | ComboboxGroup)[], query: string): (ComboboxOption | ComboboxGroup)[];
|
|
3006
5272
|
|
|
3007
5273
|
interface ComboboxProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
|
|
3008
|
-
options
|
|
5274
|
+
/** The options, and groups of options (`{ label, options }`, HAR-1588). */
|
|
5275
|
+
options: readonly (ComboboxOption | ComboboxGroup)[];
|
|
3009
5276
|
value?: string;
|
|
3010
5277
|
defaultValue?: string;
|
|
3011
5278
|
onValueChange?: (value: string, option: ComboboxOption) => void;
|
|
5279
|
+
/** The field's name. Not used as its name when `aria-labelledby` points at a visible label. */
|
|
3012
5280
|
label: string;
|
|
3013
5281
|
placeholder?: string;
|
|
5282
|
+
/** Shown in the open list when nothing matches (outside the listbox, so it is never an option). */
|
|
3014
5283
|
emptyLabel: string;
|
|
3015
5284
|
name?: string;
|
|
3016
5285
|
disabled?: boolean;
|
|
5286
|
+
/** Ids of the visible label(s) that name the field; replaces `label` as its name. */
|
|
5287
|
+
'aria-labelledby'?: string;
|
|
5288
|
+
/** Ids of hint or error text; lands on the input. */
|
|
5289
|
+
'aria-describedby'?: string;
|
|
5290
|
+
'aria-invalid'?: AriaAttributes['aria-invalid'];
|
|
5291
|
+
/** Id of the input itself (for a `<label for>`); `id` stays on the wrapper. */
|
|
5292
|
+
inputId?: string;
|
|
5293
|
+
/** Preferred side of the list. Default `'bottom-start'`; it flips when there is no room. */
|
|
5294
|
+
placement?: Placement;
|
|
3017
5295
|
}
|
|
3018
|
-
/**
|
|
3019
|
-
|
|
5296
|
+
/**
|
|
5297
|
+
* An editable combobox (HAR-1588): type to filter, choose with the keyboard or the pointer. It
|
|
5298
|
+
* follows the WAI-ARIA APG combobox with a listbox popup, at parity with `Select`: the list is a
|
|
5299
|
+
* top-layer popover placed with `useAnchoredPosition`, so a Drawer, a Popover or an
|
|
5300
|
+
* `overflow: hidden` cell never clips it; ↑ ↓ PageUp PageDown move (Home and End too while an
|
|
5301
|
+
* option is active), disabled options are skipped and the list does not wrap; Enter chooses;
|
|
5302
|
+
* Escape closes the list and puts the chosen option's text back, as leaving the field does.
|
|
5303
|
+
* Groups render as `role="group"`; the no-match row sits outside the listbox.
|
|
5304
|
+
*/
|
|
5305
|
+
declare function Combobox({ options, value, defaultValue, onValueChange, label, placeholder, emptyLabel, name, disabled, className, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, 'aria-invalid': ariaInvalid, inputId, placement, ...props }: ComboboxProps): react.JSX.Element;
|
|
3020
5306
|
|
|
3021
5307
|
/** One run of a result's text, emphasised or not. */
|
|
3022
5308
|
interface SearchSegment {
|
|
@@ -3039,14 +5325,48 @@ declare function searchSegments(text: string, query: string): SearchSegment[];
|
|
|
3039
5325
|
|
|
3040
5326
|
interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
|
|
3041
5327
|
invalid?: boolean;
|
|
5328
|
+
/**
|
|
5329
|
+
* `lg`: the public-page size beside `Input size="lg"` and `Button size="lg"` (HAR-1812): larger
|
|
5330
|
+
* text and padding, never shorter than 44 px. It still grows with `rows` and the resize handle.
|
|
5331
|
+
*/
|
|
5332
|
+
size?: 'md' | 'lg';
|
|
3042
5333
|
}
|
|
3043
5334
|
declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
|
|
3044
5335
|
|
|
5336
|
+
/** Move `id` to `index` within `ids`. Returns `ids` itself when nothing moves. */
|
|
5337
|
+
declare function placeId(ids: readonly string[], id: string, index: number): readonly string[];
|
|
5338
|
+
|
|
3045
5339
|
interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
|
|
3046
5340
|
label?: ReactNode;
|
|
3047
5341
|
indeterminate?: boolean;
|
|
3048
5342
|
}
|
|
3049
5343
|
declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.RefAttributes<HTMLInputElement>>;
|
|
5344
|
+
interface CheckboxGroupProps {
|
|
5345
|
+
children: ReactNode;
|
|
5346
|
+
/** The group's name, rendered as the `<legend>`: announced with each checkbox (HAR-1799). */
|
|
5347
|
+
label: ReactNode;
|
|
5348
|
+
/** Help under the boxes, tied to the group with `aria-describedby`. */
|
|
5349
|
+
hint?: ReactNode;
|
|
5350
|
+
/** Shown instead of the hint and announced (`role="alert"`). */
|
|
5351
|
+
error?: ReactNode;
|
|
5352
|
+
/** Draws the required marker after the legend. Which boxes must be ticked is your rule to check. */
|
|
5353
|
+
required?: boolean;
|
|
5354
|
+
/** Disables every checkbox in the group (a disabled `<fieldset>`). */
|
|
5355
|
+
disabled?: boolean;
|
|
5356
|
+
/**
|
|
5357
|
+
* The most columns the boxes form. Default 1. A column is never narrower than 10rem: on a phone,
|
|
5358
|
+
* or in a narrow card, the boxes fall back to fewer columns.
|
|
5359
|
+
*/
|
|
5360
|
+
columns?: number;
|
|
5361
|
+
id?: string;
|
|
5362
|
+
className?: string;
|
|
5363
|
+
}
|
|
5364
|
+
/**
|
|
5365
|
+
* Checkboxes under one name (HAR-1799; MOTUS UXR-05): a `<fieldset>` whose `<legend>` names the
|
|
5366
|
+
* group, so a screen reader says "Tags, group" before each box, with the field's hint and error
|
|
5367
|
+
* slot below. The checkbox counterpart of `<RadioGroup label>`. Put `Checkbox`es inside.
|
|
5368
|
+
*/
|
|
5369
|
+
declare function CheckboxGroup({ children, label, hint, error, required, disabled, columns, id, className }: CheckboxGroupProps): react.JSX.Element;
|
|
3050
5370
|
|
|
3051
5371
|
interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
|
|
3052
5372
|
label?: ReactNode;
|
|
@@ -3141,8 +5461,17 @@ interface ModalProps extends Omit<HTMLAttributes<HTMLDialogElement>, 'title'> {
|
|
|
3141
5461
|
*/
|
|
3142
5462
|
instant?: boolean;
|
|
3143
5463
|
}
|
|
3144
|
-
|
|
5464
|
+
/** A modal `<dialog>`; the ref reaches it (HAR-1831). */
|
|
5465
|
+
declare const Modal: react.ForwardRefExoticComponent<ModalProps & react.RefAttributes<HTMLDialogElement>>;
|
|
3145
5466
|
|
|
5467
|
+
/**
|
|
5468
|
+
* Attributes for a dialog's confirm button (HAR-1831): `data-*` (TENSOR puts `data-action-id`
|
|
5469
|
+
* there), `id`, `className`, an `aria-describedby`. Its `onClick` runs first; `preventDefault()`
|
|
5470
|
+
* there stops the confirm. `disabled` adds to the dialog's own reasons to disable it.
|
|
5471
|
+
*/
|
|
5472
|
+
type ConfirmButtonProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'type'> & {
|
|
5473
|
+
[dataAttribute: `data-${string}`]: string | number | boolean | undefined;
|
|
5474
|
+
};
|
|
3146
5475
|
interface ConfirmDialogProps {
|
|
3147
5476
|
open: boolean;
|
|
3148
5477
|
title: ReactNode;
|
|
@@ -3153,6 +5482,11 @@ interface ConfirmDialogProps {
|
|
|
3153
5482
|
closeLabel?: string;
|
|
3154
5483
|
onConfirm: () => void | Promise<void>;
|
|
3155
5484
|
onCancel: () => void;
|
|
5485
|
+
/**
|
|
5486
|
+
* The confirmed action is running: Confirm shows its loading state, Cancel is disabled, and
|
|
5487
|
+
* Escape, the × and a press on Cancel do nothing until it settles (HAR-1831), so the person
|
|
5488
|
+
* cannot walk away from an action that is still being carried out.
|
|
5489
|
+
*/
|
|
3156
5490
|
pending?: boolean;
|
|
3157
5491
|
destructive?: boolean;
|
|
3158
5492
|
/**
|
|
@@ -3175,21 +5509,47 @@ interface ConfirmDialogProps {
|
|
|
3175
5509
|
* this text, e.g. the record's name.
|
|
3176
5510
|
*/
|
|
3177
5511
|
typeToConfirm?: string;
|
|
3178
|
-
/**
|
|
3179
|
-
|
|
5512
|
+
/**
|
|
5513
|
+
* Label of the type-to-confirm field. In a string, `{value}` is replaced by `typeToConfirm`;
|
|
5514
|
+
* pass a node for markup, e.g. the value in `<code>` (HAR-1831).
|
|
5515
|
+
*/
|
|
5516
|
+
typeToConfirmLabel?: ReactNode;
|
|
5517
|
+
/** Placeholder of the type-to-confirm field, e.g. the value itself (HAR-1831). */
|
|
5518
|
+
typeToConfirmPlaceholder?: string;
|
|
5519
|
+
/**
|
|
5520
|
+
* Shown under the field (and its description) once the typed text stops matching; `{value}` is
|
|
5521
|
+
* replaced by `typeToConfirm` (HAR-1831). Default: `UixLabelsProvider` `confirmDialog`, then
|
|
5522
|
+
* "That does not match {value}."
|
|
5523
|
+
*/
|
|
5524
|
+
typeToConfirmMismatch?: string;
|
|
3180
5525
|
/** How the action is undone or compensated, shown as its own labelled block (TENSOR C2). */
|
|
3181
5526
|
compensation?: ReactNode;
|
|
3182
5527
|
/** Heading of the compensation block. Default "How to undo this". */
|
|
3183
5528
|
compensationLabel?: string;
|
|
5529
|
+
/** Attributes for the confirm button, e.g. `{ 'data-action-id': 'ci.delete' }` (HAR-1831). */
|
|
5530
|
+
confirmProps?: ConfirmButtonProps;
|
|
3184
5531
|
}
|
|
3185
|
-
/**
|
|
3186
|
-
|
|
5532
|
+
/**
|
|
5533
|
+
* Generic confirmation shell. Audit, authorization and compensation policy remain application-owned.
|
|
5534
|
+
* The ref reaches the `<dialog>` (HAR-1831).
|
|
5535
|
+
*/
|
|
5536
|
+
declare const ConfirmDialog: react.ForwardRefExoticComponent<ConfirmDialogProps & react.RefAttributes<HTMLDialogElement>>;
|
|
3187
5537
|
interface PopconfirmProps {
|
|
3188
5538
|
open: boolean;
|
|
3189
5539
|
/** The control that asked for confirmation; the step is placed against it and focus returns to it. */
|
|
3190
5540
|
anchor: RefObject<HTMLElement | null> | HTMLElement | null;
|
|
3191
|
-
|
|
5541
|
+
/**
|
|
5542
|
+
* The question. Optional (HAR-1831): without it the step is named by its confirm button
|
|
5543
|
+
* ("Delete"), which then has to say what it does.
|
|
5544
|
+
*/
|
|
5545
|
+
title?: ReactNode;
|
|
3192
5546
|
description?: ReactNode;
|
|
5547
|
+
/**
|
|
5548
|
+
* Content between the text and the buttons, e.g. a required reason field (HAR-1831). When it
|
|
5549
|
+
* holds a field, that field has focus when the step opens, and the step takes its full width.
|
|
5550
|
+
* Pair a required field with `confirmDisabled` until it is filled.
|
|
5551
|
+
*/
|
|
5552
|
+
children?: ReactNode;
|
|
3193
5553
|
confirmLabel: ReactNode;
|
|
3194
5554
|
cancelLabel: ReactNode;
|
|
3195
5555
|
onConfirm: () => void | Promise<void>;
|
|
@@ -3197,17 +5557,39 @@ interface PopconfirmProps {
|
|
|
3197
5557
|
onCancel: () => void;
|
|
3198
5558
|
pending?: boolean;
|
|
3199
5559
|
destructive?: boolean;
|
|
5560
|
+
/** Confirm cannot be pressed yet, e.g. while a required reason is empty (HAR-1831). */
|
|
5561
|
+
confirmDisabled?: boolean;
|
|
5562
|
+
/** Attributes for the confirm button, as on `ConfirmDialog` (HAR-1831). */
|
|
5563
|
+
confirmProps?: ConfirmButtonProps;
|
|
3200
5564
|
/** How the action is undone, under its own heading (TENSOR C2 "single_click" tier). */
|
|
3201
5565
|
compensation?: ReactNode;
|
|
3202
5566
|
compensationLabel?: string;
|
|
3203
5567
|
placement?: Placement;
|
|
5568
|
+
/** Default: `'alertdialog'` when `destructive`, else `'dialog'` (HAR-1831). */
|
|
5569
|
+
role?: 'dialog' | 'alertdialog';
|
|
5570
|
+
/**
|
|
5571
|
+
* What names the step: its `title` (default when there is one) or its confirm button
|
|
5572
|
+
* (default without a title) (HAR-1831).
|
|
5573
|
+
*/
|
|
5574
|
+
labelledBy?: 'title' | 'confirm';
|
|
5575
|
+
/**
|
|
5576
|
+
* Called with the Escape keydown before the step cancels; `event.preventDefault()` keeps it open
|
|
5577
|
+
* (HAR-1831). The step only takes an Escape that is its own: not while a popup inside it is open
|
|
5578
|
+
* (a Select's list), not one meant for a dialog opened above it, and only the newest open step.
|
|
5579
|
+
*/
|
|
5580
|
+
onEscapeKeyDown?: (event: KeyboardEvent) => void;
|
|
5581
|
+
/**
|
|
5582
|
+
* Cancel when the anchor has scrolled out of view (outside the viewport or a clipping ancestor),
|
|
5583
|
+
* rather than leave the step floating over unrelated content (HAR-1831). Default `false`.
|
|
5584
|
+
*/
|
|
5585
|
+
closeWhenAnchorHidden?: boolean;
|
|
3204
5586
|
}
|
|
3205
5587
|
/**
|
|
3206
5588
|
* An anchored, single-step confirmation for low-risk actions (HAR-1356; TENSOR C2): a small
|
|
3207
|
-
*
|
|
3208
|
-
* and focus returns to the anchor. Use `ConfirmDialog` when the action is hard to undo.
|
|
5589
|
+
* dialog on the kit `Popover`, focus on Cancel (or on a field in its content), Escape or a press
|
|
5590
|
+
* outside cancels, and focus returns to the anchor. Use `ConfirmDialog` when the action is hard to undo.
|
|
3209
5591
|
*/
|
|
3210
|
-
declare function Popconfirm({ open, anchor, title, description, confirmLabel, cancelLabel, onConfirm, onCancel, pending, destructive, compensation, compensationLabel: compensationLabelProp, placement, }: PopconfirmProps): react.JSX.Element;
|
|
5592
|
+
declare function Popconfirm({ open, anchor, title, description, children, confirmLabel, cancelLabel, onConfirm, onCancel, pending, destructive, confirmDisabled, confirmProps, compensation, compensationLabel: compensationLabelProp, placement, role, labelledBy, onEscapeKeyDown, closeWhenAnchorHidden, }: PopconfirmProps): react.JSX.Element;
|
|
3211
5593
|
interface PromptDialogProps {
|
|
3212
5594
|
open: boolean;
|
|
3213
5595
|
title: ReactNode;
|
|
@@ -3301,47 +5683,6 @@ interface PeekProps extends Omit<HTMLAttributes<HTMLDialogElement>, 'title'> {
|
|
|
3301
5683
|
}
|
|
3302
5684
|
declare function Peek({ open, onClose, title, children, footer, onNavPrev, onNavNext, hint, previousLabel: previousLabelProp, nextLabel: nextLabelProp, closeLabel: closeLabelProp, className, onClick, ...rest }: PeekProps): react.JSX.Element;
|
|
3303
5685
|
|
|
3304
|
-
interface LightboxItem {
|
|
3305
|
-
src: string;
|
|
3306
|
-
/** Alternative text for an image; the video's name for a video. */
|
|
3307
|
-
alt: string;
|
|
3308
|
-
caption?: ReactNode;
|
|
3309
|
-
kind?: 'image' | 'video';
|
|
3310
|
-
/** Intrinsic size, so an SVG or a slow image keeps its box. */
|
|
3311
|
-
width?: number;
|
|
3312
|
-
height?: number;
|
|
3313
|
-
}
|
|
3314
|
-
interface LightboxLabels {
|
|
3315
|
-
region: string;
|
|
3316
|
-
previous: string;
|
|
3317
|
-
next: string;
|
|
3318
|
-
close: string;
|
|
3319
|
-
/** `{index}`, `{total}`. */
|
|
3320
|
-
counter: string;
|
|
3321
|
-
zoomIn: string;
|
|
3322
|
-
zoomOut: string;
|
|
3323
|
-
}
|
|
3324
|
-
declare const DEFAULT_LIGHTBOX_LABELS: LightboxLabels;
|
|
3325
|
-
interface LightboxProps {
|
|
3326
|
-
items: readonly LightboxItem[];
|
|
3327
|
-
/** The item on show (0-based). */
|
|
3328
|
-
index: number;
|
|
3329
|
-
onIndexChange: (index: number) => void;
|
|
3330
|
-
open: boolean;
|
|
3331
|
-
onClose: () => void;
|
|
3332
|
-
/** Wrap from the last item to the first. Default false. */
|
|
3333
|
-
loop?: boolean;
|
|
3334
|
-
labels?: Partial<LightboxLabels>;
|
|
3335
|
-
className?: string;
|
|
3336
|
-
}
|
|
3337
|
-
/**
|
|
3338
|
-
* A full-screen media viewer over `.uix-lightbox` (HAR-1367; TENSOR C12 `capture-viewer.tsx`,
|
|
3339
|
-
* MOTUS C-8 programme gallery): previous/next buttons, ←/→ and Home/End, swipe on touch, an
|
|
3340
|
-
* announced "n of total" counter, a caption, and a fit/actual-size toggle. Native `<dialog>`,
|
|
3341
|
-
* so focus stays inside and Escape closes; focus returns to the control that opened it.
|
|
3342
|
-
*/
|
|
3343
|
-
declare function Lightbox({ items, index, onIndexChange, open, onClose, loop, labels: labelOverrides, className }: LightboxProps): react.JSX.Element;
|
|
3344
|
-
|
|
3345
5686
|
interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
|
|
3346
5687
|
title?: ReactNode;
|
|
3347
5688
|
/** Element for the title — pick a real heading to slot the card into the page outline (UIX-A11Y-4). Default `div` keeps legacy rendering. */
|
|
@@ -3374,6 +5715,23 @@ interface CardLinkProps extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 't
|
|
|
3374
5715
|
}
|
|
3375
5716
|
/** A whole-card anchor with visible hover and keyboard focus affordances. */
|
|
3376
5717
|
declare function CardLink({ title, subtitle, headerAction, footer, children, className, ...props }: CardLinkProps): react.JSX.Element;
|
|
5718
|
+
interface InsetProps extends HTMLAttributes<HTMLDivElement> {
|
|
5719
|
+
/** `md` (default) pads with `--uix-space-4`; `sm` with `--uix-space-3`, for a dense card. */
|
|
5720
|
+
padding?: 'sm' | 'md';
|
|
5721
|
+
/**
|
|
5722
|
+
* `sunken` (default) is `--uix-bg-subtle` on the card's surface; `surface` is for a well on a
|
|
5723
|
+
* panel that is already subtle.
|
|
5724
|
+
*/
|
|
5725
|
+
tone?: 'sunken' | 'surface';
|
|
5726
|
+
children?: ReactNode;
|
|
5727
|
+
}
|
|
5728
|
+
/**
|
|
5729
|
+
* A bordered, sunken well inside a card body (HAR-1818), over `.uix-inset`: for a preview or a
|
|
5730
|
+
* specimen (a rendered header, an image crop, a code sample). Use it instead of a `Card` in a
|
|
5731
|
+
* `Card`, which brings a second shadow, card padding and card semantics. It lays out nothing:
|
|
5732
|
+
* the content is yours. Give it `role="group"` and an `aria-label` when the preview needs a name.
|
|
5733
|
+
*/
|
|
5734
|
+
declare function Inset({ padding, tone, children, className, ...props }: InsetProps): react.JSX.Element;
|
|
3377
5735
|
|
|
3378
5736
|
/** Columns at one width. */
|
|
3379
5737
|
type DashboardGridColumnCount = 1 | 2 | 3 | 4;
|
|
@@ -3617,9 +5975,15 @@ interface BreadcrumbsProps extends Omit<HTMLAttributes<HTMLElement>, 'children'>
|
|
|
3617
5975
|
items: readonly BreadcrumbItem[];
|
|
3618
5976
|
label: string;
|
|
3619
5977
|
separator?: ReactNode;
|
|
5978
|
+
/**
|
|
5979
|
+
* Renders each item's link with your router (HAR-1385): `renderLink={(p) => <NextLink {...p} />}`
|
|
5980
|
+
* keeps client navigation and prefetch, and a locale-aware link adds the locale prefix. The
|
|
5981
|
+
* same `UixRenderLink` adapter as `ButtonLink`, `Stat`, `Pagination` and `Steps`. Default: `<a>`.
|
|
5982
|
+
*/
|
|
5983
|
+
renderLink?: UixRenderLink;
|
|
3620
5984
|
}
|
|
3621
|
-
/** Framework-neutral breadcrumb navigation
|
|
3622
|
-
declare function Breadcrumbs({ items, label, separator, className, ...props }: BreadcrumbsProps): react.JSX.Element;
|
|
5985
|
+
/** Framework-neutral breadcrumb navigation; `renderLink` renders the links with the app's router. */
|
|
5986
|
+
declare function Breadcrumbs({ items, label, separator, renderLink, className, ...props }: BreadcrumbsProps): react.JSX.Element;
|
|
3623
5987
|
|
|
3624
5988
|
interface PageHeaderProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
|
|
3625
5989
|
eyebrow?: ReactNode;
|
|
@@ -3637,12 +6001,18 @@ interface PageHeaderProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
|
|
|
3637
6001
|
helpLabel?: string;
|
|
3638
6002
|
/** Right-aligned action area (buttons, menus). */
|
|
3639
6003
|
actions?: ReactNode;
|
|
6004
|
+
/**
|
|
6005
|
+
* `display` is the staff type preset (HAR-1815; TENSOR, MOTUS ADR-0047): a 40 px heading-font
|
|
6006
|
+
* title, a bold hushed eyebrow, a body-size hushed subtitle up to 42rem, and the actions
|
|
6007
|
+
* aligned to the bottom of the titles. `default` is the 24 px header.
|
|
6008
|
+
*/
|
|
6009
|
+
size?: 'default' | 'display';
|
|
3640
6010
|
}
|
|
3641
6011
|
/**
|
|
3642
6012
|
* Page header — eyebrow / title (+ optional `help` ?) / subtitle + actions row, over `.uix-page-header`.
|
|
3643
6013
|
* The hairline + breathing room below come from the component CSS.
|
|
3644
6014
|
*/
|
|
3645
|
-
declare function PageHeader({ eyebrow, title, subtitle, help, helpLabel, actions, as: TitleTag, className, ...props }: PageHeaderProps): react.JSX.Element;
|
|
6015
|
+
declare function PageHeader({ eyebrow, title, subtitle, help, helpLabel, actions, as: TitleTag, size, className, ...props }: PageHeaderProps): react.JSX.Element;
|
|
3646
6016
|
|
|
3647
6017
|
interface DetailLayoutProps extends HTMLAttributes<HTMLDivElement> {
|
|
3648
6018
|
/** The narrow trailing column (record meta, side panels). */
|
|
@@ -3700,9 +6070,15 @@ interface DetailPageProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
|
|
|
3700
6070
|
* modified click, no JS).
|
|
3701
6071
|
*/
|
|
3702
6072
|
onTabSelect?: (id: string) => void;
|
|
6073
|
+
/**
|
|
6074
|
+
* `staff` is the staff type preset (HAR-1815): the title at h2 with its 1.15 leading, the back
|
|
6075
|
+
* link an inline hushed link without an underline, and each metric's label an eyebrow over an
|
|
6076
|
+
* h3-size, regular-weight, tabular value. `default` is the plain record page.
|
|
6077
|
+
*/
|
|
6078
|
+
variant?: 'default' | 'staff';
|
|
3703
6079
|
}
|
|
3704
6080
|
/** Framework-neutral record-detail scaffold; routing and data policy stay with the application. */
|
|
3705
|
-
declare function DetailPage({ back, eyebrow, title, subtitle, actions, tabs, metrics, side, children, tabsLabel, renderLink, onTabSelect, className, ...props }: DetailPageProps): react.JSX.Element;
|
|
6081
|
+
declare function DetailPage({ back, eyebrow, title, subtitle, actions, tabs, metrics, side, children, tabsLabel, renderLink, onTabSelect, variant, className, ...props }: DetailPageProps): react.JSX.Element;
|
|
3706
6082
|
|
|
3707
6083
|
interface RelatedLinkItem {
|
|
3708
6084
|
id: string;
|
|
@@ -3885,7 +6261,8 @@ interface TabsProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'r
|
|
|
3885
6261
|
children?: ReactNode;
|
|
3886
6262
|
className?: string;
|
|
3887
6263
|
/**
|
|
3888
|
-
* What happens when the tabs don't fit. `'wrap'` (default)
|
|
6264
|
+
* What happens when the tabs don't fit. `'wrap'` (default): the tab row wraps onto more rows,
|
|
6265
|
+
* and no tab is wider than its row, so one long label wraps inside its tab (HAR-1754).
|
|
3889
6266
|
* `'scroll'` keeps one row that scrolls sideways, with pointer-only edge buttons
|
|
3890
6267
|
* shown on the side that has hidden tabs. The selected tab is always scrolled into view.
|
|
3891
6268
|
*/
|
|
@@ -3927,8 +6304,47 @@ declare function TabPanel({ value, children, keepMounted, ...props }: TabPanelPr
|
|
|
3927
6304
|
|
|
3928
6305
|
type ShellNav = 'full' | 'rail' | 'hidden';
|
|
3929
6306
|
interface AppShellProps extends HTMLAttributes<HTMLDivElement> {
|
|
3930
|
-
/**
|
|
6307
|
+
/**
|
|
6308
|
+
* `frame` (default) is the bordered, rounded box the docs show a shell in. `viewport` is an
|
|
6309
|
+
* application's shell (HAR-1815): no frame, the full dynamic viewport height (`100dvh`), no fixed
|
|
6310
|
+
* top-bar row (the sidebar and main both run the full height; a `topbar`, if given, sits at the
|
|
6311
|
+
* top of the main column), main padding that widens on wide screens, and the phone nav tier by
|
|
6312
|
+
* default (`phoneNav`), so below 40rem it is one column with the sidebar in a drawer.
|
|
6313
|
+
*/
|
|
6314
|
+
layout?: 'frame' | 'viewport';
|
|
6315
|
+
/**
|
|
6316
|
+
* Sidebar width tier: 'full' (default) → 'rail' (icon only) → 'hidden' (0). Controlled when
|
|
6317
|
+
* set; leave it out to let the shell keep the tier (`defaultNav`, `navHotkey`,
|
|
6318
|
+
* `navTierStorageKey`).
|
|
6319
|
+
*/
|
|
3931
6320
|
nav?: ShellNav;
|
|
6321
|
+
/** The starting tier when `nav` is not controlled. Default `full`. */
|
|
6322
|
+
defaultNav?: ShellNav;
|
|
6323
|
+
/**
|
|
6324
|
+
* Called with the tier the hotkey asks for, and once on mount with a remembered tier that
|
|
6325
|
+
* differs from `defaultNav` (HAR-1371), so a `Sidebar nav` you render can follow. With `nav`
|
|
6326
|
+
* controlled, set it from here.
|
|
6327
|
+
*/
|
|
6328
|
+
onNavChange?: (nav: ShellNav) => void;
|
|
6329
|
+
/**
|
|
6330
|
+
* A key that switches the sidebar between `full` and `rail` (HAR-1371; MOTUS StaffShell), e.g.
|
|
6331
|
+
* `"["`. It is ignored while typing in a field or with Ctrl/⌘/Alt held, and from `hidden` it
|
|
6332
|
+
* goes to `full`. The switch is instant.
|
|
6333
|
+
*/
|
|
6334
|
+
navHotkey?: string;
|
|
6335
|
+
/**
|
|
6336
|
+
* Remember the tier in `localStorage` under this key (HAR-1371), so a reload keeps the rail.
|
|
6337
|
+
* Applied before the first paint on the client; the server renders `defaultNav`.
|
|
6338
|
+
*/
|
|
6339
|
+
navTierStorageKey?: string;
|
|
6340
|
+
/**
|
|
6341
|
+
* The phone nav tier (HAR-1371): at 40rem and under, the sidebar column is hidden and a menu
|
|
6342
|
+
* button (at the start of the topbar, or at the top of main) opens the sidebar in a start-side
|
|
6343
|
+
* `Drawer`, shown full whatever the tier. Following a link in it closes the drawer. Default
|
|
6344
|
+
* `drawer` with `layout="viewport"`, `none` with the frame; `none` keeps the sidebar column at
|
|
6345
|
+
* every width.
|
|
6346
|
+
*/
|
|
6347
|
+
phoneNav?: 'drawer' | 'none';
|
|
3932
6348
|
/** Back-compat alias for nav="rail". Ignored when `nav` is set. */
|
|
3933
6349
|
collapsed?: boolean;
|
|
3934
6350
|
/**
|
|
@@ -3950,20 +6366,48 @@ interface AppShellProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
3950
6366
|
skipToContentLabel?: ReactNode;
|
|
3951
6367
|
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
3952
6368
|
exitFocusLabel?: ReactNode;
|
|
6369
|
+
/** The phone menu button's name. Default: `UixLabelsProvider` `appShell.openNav`, then "Open navigation". */
|
|
6370
|
+
openNavLabel?: string;
|
|
6371
|
+
/** The navigation drawer's title. Default: `appShell.navigation`, then "Navigation". */
|
|
6372
|
+
navigationLabel?: ReactNode;
|
|
3953
6373
|
}
|
|
3954
|
-
declare function AppShell({ nav, collapsed, focus, onExitFocus, mainBleed, mainId, sidebar, topbar, children, skipToContentLabel: skipToContentLabelProp, exitFocusLabel: exitFocusLabelProp, className, ...props }: AppShellProps): react.JSX.Element;
|
|
6374
|
+
declare function AppShell({ layout, nav, defaultNav, onNavChange, navHotkey, navTierStorageKey, phoneNav: phoneNavProp, collapsed, focus, onExitFocus, mainBleed, mainId, sidebar, topbar, children, skipToContentLabel: skipToContentLabelProp, exitFocusLabel: exitFocusLabelProp, openNavLabel: openNavLabelProp, navigationLabel: navigationLabelProp, className, ...props }: AppShellProps): react.JSX.Element;
|
|
3955
6375
|
|
|
6376
|
+
/** The search row under the sidebar head (HAR-1371): it opens your search or command palette. */
|
|
6377
|
+
interface SidebarSearch {
|
|
6378
|
+
/** The row's words, e.g. "Search". In the rail they are the button's name only. */
|
|
6379
|
+
label: ReactNode;
|
|
6380
|
+
/**
|
|
6381
|
+
* The keys that open the same search, shown at the end of the row and given to assistive
|
|
6382
|
+
* technology as `aria-keyshortcuts`, e.g. `['Mod', 'K']`. Showing them does not bind them:
|
|
6383
|
+
* your command palette (or app) listens for the keys.
|
|
6384
|
+
*/
|
|
6385
|
+
shortcut?: KeyShortcut;
|
|
6386
|
+
onActivate: () => void;
|
|
6387
|
+
}
|
|
3956
6388
|
interface SidebarProps extends HTMLAttributes<HTMLElement> {
|
|
3957
6389
|
collapsed?: boolean;
|
|
3958
6390
|
nav?: 'full' | 'rail';
|
|
3959
6391
|
onToggle?: () => void;
|
|
3960
6392
|
brand?: ReactNode;
|
|
3961
6393
|
toggleIcon?: ReactNode;
|
|
6394
|
+
/**
|
|
6395
|
+
* Controls in the head beside the brand (HAR-1371): a mode toggle, a "…" utility `Menu`,
|
|
6396
|
+
* collapse-all. Icon buttons (`Button icon size="sm"`) fit the row. Hidden in the rail.
|
|
6397
|
+
*/
|
|
6398
|
+
actions?: ReactNode;
|
|
6399
|
+
/** A search row under the head that opens your search (HAR-1371). */
|
|
6400
|
+
search?: SidebarSearch;
|
|
6401
|
+
/**
|
|
6402
|
+
* A slot pinned to the bottom of the sidebar (HAR-1371), for an `AccountMenu`. In the rail it
|
|
6403
|
+
* keeps what it renders; give an `AccountMenu` `collapsed` there.
|
|
6404
|
+
*/
|
|
6405
|
+
footer?: ReactNode;
|
|
3962
6406
|
children?: ReactNode;
|
|
3963
6407
|
expandLabel?: string;
|
|
3964
6408
|
collapseLabel?: string;
|
|
3965
6409
|
}
|
|
3966
|
-
declare function Sidebar({ collapsed, nav, onToggle, brand, toggleIcon, children, expandLabel: expandLabelProp, collapseLabel: collapseLabelProp, className, ...props }: SidebarProps): react.JSX.Element;
|
|
6410
|
+
declare function Sidebar({ collapsed, nav, onToggle, brand, toggleIcon, actions, search, footer, children, expandLabel: expandLabelProp, collapseLabel: collapseLabelProp, className, ...props }: SidebarProps): react.JSX.Element;
|
|
3967
6411
|
interface SidebarSectionProps {
|
|
3968
6412
|
label?: string;
|
|
3969
6413
|
children?: ReactNode;
|
|
@@ -3981,7 +6425,13 @@ interface NavItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
|
3981
6425
|
description?: ReactNode;
|
|
3982
6426
|
children?: ReactNode;
|
|
3983
6427
|
}
|
|
3984
|
-
|
|
6428
|
+
/**
|
|
6429
|
+
* One navigation row: a link (`as="a"`, default) or, for a row that acts in place (a mode toggle,
|
|
6430
|
+
* an account menu), a `button`. The forwarded ref reaches the rendered `<a>` or `<button>`
|
|
6431
|
+
* (HAR-1810), so a row can anchor a `Popover` (`anchor={ref}`); `popoverTarget` and other button
|
|
6432
|
+
* attributes pass through with `as="button"`.
|
|
6433
|
+
*/
|
|
6434
|
+
declare const NavItem: react.ForwardRefExoticComponent<NavItemProps & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
|
|
3985
6435
|
interface NavGroupProps {
|
|
3986
6436
|
icon?: ReactNode;
|
|
3987
6437
|
label: ReactNode;
|
|
@@ -3996,7 +6446,8 @@ interface SubNavItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
|
3996
6446
|
as?: 'a' | 'button';
|
|
3997
6447
|
children?: ReactNode;
|
|
3998
6448
|
}
|
|
3999
|
-
|
|
6449
|
+
/** A nested navigation row. Like `NavItem`, it forwards its ref to the `<a>` or `<button>` (HAR-1810). */
|
|
6450
|
+
declare const SubNavItem: react.ForwardRefExoticComponent<SubNavItemProps & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
|
|
4000
6451
|
|
|
4001
6452
|
interface StarButtonProps {
|
|
4002
6453
|
/** Pinned state — drives the filled, warning-toned, always-visible look via `data-on`. */
|
|
@@ -4067,6 +6518,11 @@ interface NavFavouritesLabels {
|
|
|
4067
6518
|
readonly remove: string;
|
|
4068
6519
|
/** Per-row overflow-trigger accessible-name template with `{label}`. Defaults to "{label} favourite options". */
|
|
4069
6520
|
readonly options?: string;
|
|
6521
|
+
/**
|
|
6522
|
+
* Polite announcement after a move: `{label}`, `{position}`, `{count}`. Defaults to
|
|
6523
|
+
* "{label} moved to position {position} of {count}" (it was English only before HAR-1375).
|
|
6524
|
+
*/
|
|
6525
|
+
readonly moved?: string;
|
|
4070
6526
|
}
|
|
4071
6527
|
interface NavFavouritesProps {
|
|
4072
6528
|
/** The already-resolved favourites, in display order. */
|
|
@@ -4186,8 +6642,14 @@ interface SpinnerProps extends HTMLAttributes<HTMLSpanElement> {
|
|
|
4186
6642
|
accent?: boolean;
|
|
4187
6643
|
/** Announced loading text (default "Loading…"). */
|
|
4188
6644
|
label?: string;
|
|
6645
|
+
/**
|
|
6646
|
+
* Show the spinner only after it has been mounted this long: `true` is 300 ms, a number is
|
|
6647
|
+
* milliseconds (HAR-2580). Work that ends sooner never flashes a spinner. To also hold it at
|
|
6648
|
+
* least 500 ms once shown, mount it from `useDelayedPending(pending)` instead.
|
|
6649
|
+
*/
|
|
6650
|
+
delay?: boolean | number;
|
|
4189
6651
|
}
|
|
4190
|
-
declare function Spinner({
|
|
6652
|
+
declare function Spinner({ delay, ...props }: SpinnerProps): react.JSX.Element;
|
|
4191
6653
|
|
|
4192
6654
|
type HeartbeatState = 'live' | 'idle' | 'warning' | 'danger';
|
|
4193
6655
|
interface HeartbeatProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {
|
|
@@ -4241,6 +6703,13 @@ interface ToastOptions {
|
|
|
4241
6703
|
* Defaults: success/info/default 5 s, warning 8 s, error and loading stay.
|
|
4242
6704
|
*/
|
|
4243
6705
|
duration?: number | null;
|
|
6706
|
+
/**
|
|
6707
|
+
* `false`: a fixed timer (HAR-1831). The toast closes `duration` after it appears, even while the
|
|
6708
|
+
* pointer or focus is on it or the tab is hidden; for an undo window that must end on time
|
|
6709
|
+
* (TENSOR's `useUndoableAction` commits after exactly 5 s). A toast waiting beyond the
|
|
6710
|
+
* Toaster's `limit` starts its timer when it appears. Default `true`: the timer pauses.
|
|
6711
|
+
*/
|
|
6712
|
+
pauseOnHover?: boolean;
|
|
4244
6713
|
action?: ToastAction;
|
|
4245
6714
|
/** Replaces the tone glyph. */
|
|
4246
6715
|
icon?: ReactNode;
|
|
@@ -4253,6 +6722,8 @@ interface ToastRecord {
|
|
|
4253
6722
|
message: ReactNode;
|
|
4254
6723
|
description?: ReactNode;
|
|
4255
6724
|
duration: number | null;
|
|
6725
|
+
/** `false`: the timer does not pause (see {@link ToastOptions.pauseOnHover}). */
|
|
6726
|
+
pauseOnHover?: boolean;
|
|
4256
6727
|
action?: ToastAction;
|
|
4257
6728
|
icon?: ReactNode;
|
|
4258
6729
|
/** Set while the leave animation runs; the record is removed after it. */
|
|
@@ -4300,155 +6771,53 @@ interface ToastApi {
|
|
|
4300
6771
|
promise: <T>(promise: Promise<T>, messages: ToastPromiseMessages<T>, options?: ToastOptions) => Promise<T>;
|
|
4301
6772
|
/**
|
|
4302
6773
|
* An optimistic action with an Undo button (TENSOR C2 `useUndoableAction`): `onCommit` runs
|
|
4303
|
-
* when the toast closes without Undo; `onUndo` runs instead when Undo is pressed.
|
|
6774
|
+
* when the toast closes without Undo; `onUndo` runs instead when Undo is pressed. Pass
|
|
6775
|
+
* `pauseOnHover: false` for a commit that happens exactly `duration` after the toast appears.
|
|
4304
6776
|
*/
|
|
4305
6777
|
undoable: (message: ReactNode, options: UndoableToastOptions) => string;
|
|
4306
|
-
/** The store this API writes to; pass it to `<Toaster store>` for a non-default queue. */
|
|
4307
|
-
store: ToastStore;
|
|
4308
|
-
}
|
|
4309
|
-
/** Binds the `toast()` API to a store. */
|
|
4310
|
-
declare function createToastApi(store: ToastStore): ToastApi;
|
|
4311
|
-
/** The default queue; a `<Toaster />` without a `store` prop renders it. */
|
|
4312
|
-
declare const toast: ToastApi;
|
|
4313
|
-
|
|
4314
|
-
type ToastTone = 'success' | 'danger' | 'info' | 'warning';
|
|
4315
|
-
interface ToastProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
|
|
4316
|
-
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4317
|
-
dismissLabel?: string;
|
|
4318
|
-
title?: ReactNode;
|
|
4319
|
-
message?: ReactNode;
|
|
4320
|
-
tone?: ToastTone;
|
|
4321
|
-
icon?: ReactNode;
|
|
4322
|
-
/** A button (or link) after the text, e.g. "Undo" or "Copy details" (HAR-1363). */
|
|
4323
|
-
action?: ReactNode;
|
|
4324
|
-
onClose?: () => void;
|
|
4325
|
-
leaving?: boolean;
|
|
4326
|
-
}
|
|
4327
|
-
declare function Toast({ title, message, tone, icon, action, onClose, leaving, dismissLabel: dismissLabelProp, className, ...props }: ToastProps): react.JSX.Element;
|
|
4328
|
-
interface ToasterProps extends HTMLAttributes<HTMLDivElement> {
|
|
4329
|
-
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4330
|
-
regionLabel?: string;
|
|
4331
|
-
/**
|
|
4332
|
-
* The queue to render (HAR-1363). Default: the store behind the exported `toast()`.
|
|
4333
|
-
* Children still render first, so a hand-managed `<Toast>` keeps working.
|
|
4334
|
-
*/
|
|
4335
|
-
store?: ToastStore;
|
|
4336
|
-
/** At most this many store toasts on screen; later ones wait their turn. Default 3. */
|
|
4337
|
-
limit?: number;
|
|
4338
|
-
/** Corner of the viewport. Default `bottom-end`. */
|
|
4339
|
-
position?: 'bottom-end' | 'bottom-start' | 'bottom-center' | 'top-end' | 'top-start' | 'top-center';
|
|
4340
|
-
children?: ReactNode;
|
|
4341
|
-
}
|
|
4342
|
-
declare function Toaster({ children, regionLabel: regionLabelProp, store, limit, position, className, onMouseEnter, onMouseLeave, onFocus, onBlur, onKeyDown, ...props }: ToasterProps): react.JSX.Element;
|
|
4343
|
-
|
|
4344
|
-
interface TableWrapProps extends HTMLAttributes<HTMLDivElement> {
|
|
4345
|
-
/**
|
|
4346
|
-
* Polite live-region text for table state changes — "Sorted by …", "N results",
|
|
4347
|
-
* "N selected". Pass `useTable().announcement` straight through (UIX-A11Y-2).
|
|
4348
|
-
*/
|
|
4349
|
-
announcement?: string;
|
|
4350
|
-
children?: ReactNode;
|
|
4351
|
-
}
|
|
4352
|
-
declare const TableWrap: react.ForwardRefExoticComponent<TableWrapProps & react.RefAttributes<HTMLDivElement>>;
|
|
4353
|
-
type TableDensity = 'compact' | 'standard' | 'comfortable';
|
|
4354
|
-
type SortDirection = 'ascending' | 'descending' | 'none';
|
|
4355
|
-
interface TableProps extends TableHTMLAttributes<HTMLTableElement> {
|
|
4356
|
-
density?: TableDensity;
|
|
4357
|
-
zebra?: boolean;
|
|
4358
|
-
pinnedCol?: boolean;
|
|
4359
6778
|
/**
|
|
4360
|
-
*
|
|
4361
|
-
*
|
|
4362
|
-
*
|
|
6779
|
+
* Undo an `undoable` toast from code, as if its Undo were pressed (HAR-1831): `onUndo` runs,
|
|
6780
|
+
* `onCommit` does not, and the toast closes. Returns `false` when `id` is not an open undoable
|
|
6781
|
+
* toast (it was already undone or committed). `dismiss(id)` commits instead.
|
|
4363
6782
|
*/
|
|
4364
|
-
|
|
4365
|
-
/**
|
|
4366
|
-
|
|
4367
|
-
rowPeek?: boolean;
|
|
4368
|
-
v2?: boolean;
|
|
4369
|
-
}
|
|
4370
|
-
declare function Table({ density, zebra, pinnedCol, pinnedActions, fixed, rowPeek, v2, className, children, ...props }: TableProps): react.JSX.Element;
|
|
4371
|
-
interface ThProps extends ThHTMLAttributes<HTMLTableCellElement> {
|
|
4372
|
-
sortable?: boolean;
|
|
4373
|
-
sortDirection?: SortDirection;
|
|
4374
|
-
/** 1-based ordinal shown when this column is a secondary key in a multi-sort */
|
|
4375
|
-
sortOrder?: number;
|
|
4376
|
-
onSort?: () => void;
|
|
4377
|
-
}
|
|
4378
|
-
declare function Th({ sortable, sortDirection, sortOrder, onSort, className, children, onClick, ...props }: ThProps): react.JSX.Element;
|
|
4379
|
-
interface TdProps extends TdHTMLAttributes<HTMLTableCellElement> {
|
|
4380
|
-
pinned?: boolean;
|
|
4381
|
-
}
|
|
4382
|
-
declare function Td({ pinned, className, children, ...props }: TdProps): react.JSX.Element;
|
|
4383
|
-
interface TrProps extends HTMLAttributes<HTMLTableRowElement> {
|
|
4384
|
-
selected?: boolean;
|
|
4385
|
-
pinned?: boolean;
|
|
4386
|
-
}
|
|
4387
|
-
declare function Tr({ selected, pinned, className, children, ...props }: TrProps): react.JSX.Element;
|
|
4388
|
-
interface BulkBarProps extends HTMLAttributes<HTMLDivElement> {
|
|
4389
|
-
/** number of selected rows, rendered through `selectedLabel` */
|
|
4390
|
-
count?: number;
|
|
4391
|
-
children?: ReactNode;
|
|
4392
|
-
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4393
|
-
label?: string;
|
|
4394
|
-
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4395
|
-
selectedLabel?: (count: number) => ReactNode;
|
|
4396
|
-
}
|
|
4397
|
-
/** Contextual action bar shown above the table when ≥1 row is selected. */
|
|
4398
|
-
declare function BulkBar({ count, children, label, selectedLabel, className, ...props }: BulkBarProps): react.JSX.Element;
|
|
4399
|
-
interface RowActionsProps extends TdHTMLAttributes<HTMLTableCellElement> {
|
|
4400
|
-
children?: ReactNode;
|
|
4401
|
-
}
|
|
4402
|
-
/** Trailing cell that holds the row's hover actions (kebab, quick actions). */
|
|
4403
|
-
declare function RowActions({ children, className, ...props }: RowActionsProps): react.JSX.Element;
|
|
4404
|
-
interface RowActionProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
4405
|
-
children?: ReactNode;
|
|
6783
|
+
undo: (id: string) => boolean;
|
|
6784
|
+
/** The store this API writes to; pass it to `<Toaster store>` for a non-default queue. */
|
|
6785
|
+
store: ToastStore;
|
|
4406
6786
|
}
|
|
4407
|
-
/**
|
|
4408
|
-
declare function
|
|
4409
|
-
|
|
4410
|
-
|
|
4411
|
-
|
|
6787
|
+
/** Binds the `toast()` API to a store. */
|
|
6788
|
+
declare function createToastApi(store: ToastStore): ToastApi;
|
|
6789
|
+
/** The default queue; a `<Toaster />` without a `store` prop renders it. */
|
|
6790
|
+
declare const toast: ToastApi;
|
|
6791
|
+
|
|
6792
|
+
type ToastTone = 'success' | 'danger' | 'info' | 'warning';
|
|
6793
|
+
interface ToastProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
|
|
4412
6794
|
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4413
|
-
|
|
4414
|
-
|
|
4415
|
-
|
|
4416
|
-
|
|
4417
|
-
|
|
4418
|
-
/**
|
|
4419
|
-
|
|
4420
|
-
|
|
4421
|
-
|
|
4422
|
-
/** Secondary line under a primary cell value (muted, meta size). */
|
|
4423
|
-
declare function CellSub({ children, className, ...props }: HTMLAttributes<HTMLSpanElement>): react.JSX.Element;
|
|
4424
|
-
interface MarkProps extends HTMLAttributes<HTMLElement> {
|
|
4425
|
-
children?: ReactNode;
|
|
4426
|
-
}
|
|
4427
|
-
/** A search-match highlight span. */
|
|
4428
|
-
declare function Mark({ children, className, ...props }: MarkProps): react.JSX.Element;
|
|
4429
|
-
interface HighlightedProps {
|
|
4430
|
-
text: string;
|
|
4431
|
-
query: string;
|
|
6795
|
+
dismissLabel?: string;
|
|
6796
|
+
title?: ReactNode;
|
|
6797
|
+
message?: ReactNode;
|
|
6798
|
+
tone?: ToastTone;
|
|
6799
|
+
icon?: ReactNode;
|
|
6800
|
+
/** A button (or link) after the text, e.g. "Undo" or "Copy details" (HAR-1363). */
|
|
6801
|
+
action?: ReactNode;
|
|
6802
|
+
onClose?: () => void;
|
|
6803
|
+
leaving?: boolean;
|
|
4432
6804
|
}
|
|
4433
|
-
|
|
4434
|
-
|
|
4435
|
-
|
|
4436
|
-
|
|
4437
|
-
type PillTreatment = 'filled' | 'outline';
|
|
4438
|
-
type PillSize = 'sm' | 'md' | 'lg';
|
|
4439
|
-
interface StatusPillProps extends HTMLAttributes<HTMLSpanElement> {
|
|
4440
|
-
tone?: PillTone;
|
|
4441
|
-
/** 'filled' (default) = tinted wash; 'outline' = transparent fill + tone-tinted border. */
|
|
4442
|
-
treatment?: PillTreatment;
|
|
6805
|
+
declare function Toast({ title, message, tone, icon, action, onClose, leaving, dismissLabel: dismissLabelProp, className, ...props }: ToastProps): react.JSX.Element;
|
|
6806
|
+
interface ToasterProps extends HTMLAttributes<HTMLDivElement> {
|
|
6807
|
+
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
6808
|
+
regionLabel?: string;
|
|
4443
6809
|
/**
|
|
4444
|
-
*
|
|
4445
|
-
*
|
|
6810
|
+
* The queue to render (HAR-1363). Default: the store behind the exported `toast()`.
|
|
6811
|
+
* Children still render first, so a hand-managed `<Toast>` keeps working.
|
|
4446
6812
|
*/
|
|
4447
|
-
|
|
4448
|
-
|
|
6813
|
+
store?: ToastStore;
|
|
6814
|
+
/** At most this many store toasts on screen; later ones wait their turn. Default 3. */
|
|
6815
|
+
limit?: number;
|
|
6816
|
+
/** Corner of the viewport. Default `bottom-end`. */
|
|
6817
|
+
position?: 'bottom-end' | 'bottom-start' | 'bottom-center' | 'top-end' | 'top-start' | 'top-center';
|
|
4449
6818
|
children?: ReactNode;
|
|
4450
6819
|
}
|
|
4451
|
-
declare function
|
|
6820
|
+
declare function Toaster({ children, regionLabel: regionLabelProp, store, limit, position, className, onMouseEnter, onMouseLeave, onFocus, onBlur, onKeyDown, ...props }: ToasterProps): react.JSX.Element;
|
|
4452
6821
|
|
|
4453
6822
|
interface ProgressProps extends HTMLAttributes<HTMLDivElement> {
|
|
4454
6823
|
/** 0..max. Ignored when `indeterminate`. */
|
|
@@ -4482,8 +6851,15 @@ interface MeterProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
4482
6851
|
declare function Meter({ value, tone, label, toneLabels, className, ...props }: MeterProps): react.JSX.Element;
|
|
4483
6852
|
|
|
4484
6853
|
interface StatTrend {
|
|
6854
|
+
/** Which way the figure moved: the arrow, and the spoken "up" / "down". */
|
|
4485
6855
|
direction: 'up' | 'down';
|
|
4486
6856
|
label: ReactNode;
|
|
6857
|
+
/**
|
|
6858
|
+
* What the change means, which sets the colour (HAR-1563): `positive` green, `negative` red,
|
|
6859
|
+
* `neutral` (default) grey. A rise in breached SLAs is `negative`; direction never picks the
|
|
6860
|
+
* colour.
|
|
6861
|
+
*/
|
|
6862
|
+
sentiment?: 'positive' | 'negative' | 'neutral';
|
|
4487
6863
|
}
|
|
4488
6864
|
interface StatProps extends HTMLAttributes<HTMLElement> {
|
|
4489
6865
|
label: ReactNode;
|
|
@@ -4494,7 +6870,10 @@ interface StatProps extends HTMLAttributes<HTMLElement> {
|
|
|
4494
6870
|
meta?: ReactNode;
|
|
4495
6871
|
/** Trend chip rendered before the meta text. */
|
|
4496
6872
|
trend?: StatTrend;
|
|
4497
|
-
/**
|
|
6873
|
+
/**
|
|
6874
|
+
* `warning` / `danger` colour the value and put a dot of that tone before it; the border stays
|
|
6875
|
+
* neutral (HAR-1563). `neutral` (default) is the plain tile.
|
|
6876
|
+
*/
|
|
4498
6877
|
tone?: 'neutral' | 'warning' | 'danger';
|
|
4499
6878
|
/** `hero` (default) is today's KPI size; `compact` is for dense fact bands. */
|
|
4500
6879
|
size?: 'hero' | 'compact';
|
|
@@ -4527,7 +6906,8 @@ interface StatProps extends HTMLAttributes<HTMLElement> {
|
|
|
4527
6906
|
/**
|
|
4528
6907
|
* Makes the whole tile a link (HAR-1350; TENSOR B7, MOTUS B-A7). Server-renderable, unlike
|
|
4529
6908
|
* `onActivate`. Ignored when `onActivate` is set. The forwarded ref reaches the `<a>` only
|
|
4530
|
-
* without `renderLink`.
|
|
6909
|
+
* without `renderLink`. A trailing chevron in the label row marks the tile as a link at rest,
|
|
6910
|
+
* since a touch screen has no hover (HAR-1803).
|
|
4531
6911
|
*/
|
|
4532
6912
|
href?: string;
|
|
4533
6913
|
/** The link tile is the current page (`aria-current="page"`). */
|
|
@@ -4540,6 +6920,20 @@ interface StatProps extends HTMLAttributes<HTMLElement> {
|
|
|
4540
6920
|
* ref then points at that button, so a popover can anchor to it.
|
|
4541
6921
|
*/
|
|
4542
6922
|
declare const Stat: react.ForwardRefExoticComponent<StatProps & react.RefAttributes<HTMLElement>>;
|
|
6923
|
+
interface StatRowProps extends HTMLAttributes<HTMLDivElement> {
|
|
6924
|
+
/**
|
|
6925
|
+
* The narrowest a tile may get before the row puts fewer tiles side by side, as a CSS length
|
|
6926
|
+
* (`--stat-row-min`). Default `8.5rem`, and `12rem` once a hero tile is in the row.
|
|
6927
|
+
*/
|
|
6928
|
+
minTileWidth?: string;
|
|
6929
|
+
children?: ReactNode;
|
|
6930
|
+
}
|
|
6931
|
+
/**
|
|
6932
|
+
* A row of `Stat` tiles over `.uix-stat-row` (HAR-1803 review): as many tiles per row as fit at
|
|
6933
|
+
* `minTileWidth`, all the same height, down to one per row on a phone. Use it instead of a fixed
|
|
6934
|
+
* column count, which squeezes tiles until their labels break letter by letter.
|
|
6935
|
+
*/
|
|
6936
|
+
declare function StatRow({ minTileWidth, className, style, children, ...props }: StatRowProps): react.JSX.Element;
|
|
4543
6937
|
|
|
4544
6938
|
type InsightStatusTone = 'ok' | 'warning' | 'critical' | 'unknown';
|
|
4545
6939
|
interface InsightStatus {
|
|
@@ -4756,10 +7150,11 @@ interface TooltipProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'content'>
|
|
|
4756
7150
|
placement?: Placement;
|
|
4757
7151
|
/**
|
|
4758
7152
|
* The trigger's keyboard shortcut, in `KbdCombo` key names, e.g. `['Mod', 'K']` (HAR-2031):
|
|
4759
|
-
* shown with `Kbd` after the text
|
|
4760
|
-
*
|
|
4761
|
-
*
|
|
4762
|
-
*
|
|
7153
|
+
* shown with `Kbd` after the text. Screen readers hear it once, in the trigger's description
|
|
7154
|
+
* after the text ("Keyboard shortcuts, Shift+?"), the same rule as a `Button` with `shortcut`
|
|
7155
|
+
* (HAR-2416). Default: the `shortcut` of a `Button` child, so a Tooltip around a Button with a
|
|
7156
|
+
* shortcut shows one bubble with the label and the keys. The kit only shows it: the product
|
|
7157
|
+
* binds the key.
|
|
4763
7158
|
*/
|
|
4764
7159
|
shortcut?: KeyShortcut;
|
|
4765
7160
|
children?: ReactNode;
|
|
@@ -4771,6 +7166,9 @@ interface TooltipProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'content'>
|
|
|
4771
7166
|
* (flip/shift), shown on hover and keyboard focus, dismissed on blur or Escape
|
|
4772
7167
|
* (document-level, per WCAG 1.4.13), and hoverable: the bubble stays open while
|
|
4773
7168
|
* the pointer is over it (UIX-A11Y-1).
|
|
7169
|
+
*
|
|
7170
|
+
* While the bubble is open it takes the first Escape (HAR-2415), also on a combobox-style trigger
|
|
7171
|
+
* whose list is open (a Select, a date field): one Escape closes the bubble, the next one the list.
|
|
4774
7172
|
*/
|
|
4775
7173
|
declare function Tooltip({ label, content, placement, shortcut, className, children, ...props }: TooltipProps): react.JSX.Element;
|
|
4776
7174
|
|
|
@@ -4848,9 +7246,15 @@ interface LoadingStateProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
4848
7246
|
density?: 'compact' | 'comfortable';
|
|
4849
7247
|
/** Announced loading text (default "Loading"). */
|
|
4850
7248
|
label?: string;
|
|
7249
|
+
/**
|
|
7250
|
+
* Show the skeleton only after it has been mounted this long: `true` is 300 ms, a number is
|
|
7251
|
+
* milliseconds (HAR-2580). A first load that answers sooner goes straight to the content.
|
|
7252
|
+
* Skeletons are for a first load; a refetch keeps its rows in a `BusyRegion`.
|
|
7253
|
+
*/
|
|
7254
|
+
delay?: boolean | number;
|
|
4851
7255
|
}
|
|
4852
7256
|
/** A stack of skeleton rows for list/section loading. `role="status"`. */
|
|
4853
|
-
declare function LoadingState({
|
|
7257
|
+
declare function LoadingState({ delay, ...props }: LoadingStateProps): react.JSX.Element;
|
|
4854
7258
|
|
|
4855
7259
|
interface RelativeTimeFormatContext {
|
|
4856
7260
|
date: Date;
|
|
@@ -4900,56 +7304,6 @@ interface LabelProps extends HTMLAttributes<HTMLSpanElement> {
|
|
|
4900
7304
|
/** Colored label / tag over `.uix-label`. */
|
|
4901
7305
|
declare function Label({ color, dot, children, className, style, ...props }: LabelProps): react.JSX.Element;
|
|
4902
7306
|
|
|
4903
|
-
/** Presence of a person (HAR-1374). Each state has its own shape as well as its own colour. */
|
|
4904
|
-
type AvatarPresence = 'online' | 'busy' | 'away' | 'offline';
|
|
4905
|
-
/** The words read for each presence state. English; pass translations as `presenceLabels`. */
|
|
4906
|
-
declare const DEFAULT_PRESENCE_LABELS: Record<AvatarPresence, string>;
|
|
4907
|
-
interface AvatarProps extends HTMLAttributes<HTMLSpanElement> {
|
|
4908
|
-
/** TENSOR RX-125 (UIX-04): translatable; English default. Still honoured for `online`. */
|
|
4909
|
-
onlineLabel?: string;
|
|
4910
|
-
size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl';
|
|
4911
|
-
src?: string;
|
|
4912
|
-
alt?: string;
|
|
4913
|
-
/** Initials / fallback shown when there is no `src`. */
|
|
4914
|
-
children?: ReactNode;
|
|
4915
|
-
/** Online status dot. The same as `presence="online"`; kept for existing callers. */
|
|
4916
|
-
status?: boolean;
|
|
4917
|
-
/**
|
|
4918
|
-
* A presence dot: `online` (filled green), `busy` (red with a bar), `away` (an amber ring),
|
|
4919
|
-
* `offline` (a grey ring). The state is also in visually hidden text, so it is never colour
|
|
4920
|
-
* alone.
|
|
4921
|
-
*/
|
|
4922
|
-
presence?: AvatarPresence;
|
|
4923
|
-
/** Translations of the presence words. */
|
|
4924
|
-
presenceLabels?: Partial<Record<AvatarPresence, string>>;
|
|
4925
|
-
}
|
|
4926
|
-
/** Avatar over `.uix-avatar`. Renders an image when `src` is set, else children (initials). */
|
|
4927
|
-
declare function Avatar({ size, src, alt, children, status, presence, presenceLabels, onlineLabel, className, ...props }: AvatarProps): react.JSX.Element;
|
|
4928
|
-
interface PresenceDotProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {
|
|
4929
|
-
presence: AvatarPresence;
|
|
4930
|
-
/**
|
|
4931
|
-
* The state in words for assistive technology. Default: the English word. Pass `null` when
|
|
4932
|
-
* the state is already written next to the dot, to make the dot decorative.
|
|
4933
|
-
*/
|
|
4934
|
-
label?: string | null;
|
|
4935
|
-
}
|
|
4936
|
-
/** The presence dot on its own, for a row or a menu that shows no avatar (HAR-1374). */
|
|
4937
|
-
declare function PresenceDot({ presence, label, className, ...props }: PresenceDotProps): react.JSX.Element;
|
|
4938
|
-
interface AvatarGroupProps extends HTMLAttributes<HTMLSpanElement> {
|
|
4939
|
-
children?: ReactNode;
|
|
4940
|
-
}
|
|
4941
|
-
/** Overlapping avatar stack over `.uix-avatar-group`. */
|
|
4942
|
-
declare function AvatarGroup({ children, className, ...props }: AvatarGroupProps): react.JSX.Element;
|
|
4943
|
-
interface UserChipProps extends HTMLAttributes<HTMLSpanElement> {
|
|
4944
|
-
/** Usually an `<Avatar />`. */
|
|
4945
|
-
avatar?: ReactNode;
|
|
4946
|
-
name?: ReactNode;
|
|
4947
|
-
/** Secondary line (role, email). */
|
|
4948
|
-
sub?: ReactNode;
|
|
4949
|
-
}
|
|
4950
|
-
/** Avatar + name (+ optional sub-line) over `.uix-user-chip`. */
|
|
4951
|
-
declare function UserChip({ avatar, name, sub, className, children, ...props }: UserChipProps): react.JSX.Element;
|
|
4952
|
-
|
|
4953
7307
|
interface CommentsProps extends HTMLAttributes<HTMLDivElement> {
|
|
4954
7308
|
children?: ReactNode;
|
|
4955
7309
|
}
|
|
@@ -5003,6 +7357,12 @@ interface SaveStatusProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children
|
|
|
5003
7357
|
labels?: Partial<SaveStatusLabels>;
|
|
5004
7358
|
/** Offered as a button only while `state` is `failed`. */
|
|
5005
7359
|
onRetry?: () => void;
|
|
7360
|
+
/**
|
|
7361
|
+
* Milliseconds before "Saving…" shows (default 300; HAR-2580). Until then the previous words
|
|
7362
|
+
* stay, so a fast save goes straight to "Saved" without a flash; once "Saving…" shows it
|
|
7363
|
+
* stays at least 500 ms. `0` shows every state at once and holds none.
|
|
7364
|
+
*/
|
|
7365
|
+
delay?: number;
|
|
5006
7366
|
}
|
|
5007
7367
|
/**
|
|
5008
7368
|
* Inline save feedback over `.uix-save-status`: saving → saved → failed, with a retry.
|
|
@@ -5014,7 +7374,67 @@ interface SaveStatusProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children
|
|
|
5014
7374
|
* rendering null while idle would silence the first "Saving…". The retry button sits
|
|
5015
7375
|
* outside the region so its label is not read out on every change.
|
|
5016
7376
|
*/
|
|
5017
|
-
declare function SaveStatus({ state, labels, onRetry, className, ...props }: SaveStatusProps): react.JSX.Element;
|
|
7377
|
+
declare function SaveStatus({ state, labels, onRetry, delay, className, ...props }: SaveStatusProps): react.JSX.Element;
|
|
7378
|
+
|
|
7379
|
+
interface BusyRegionProps extends HTMLAttributes<HTMLDivElement> {
|
|
7380
|
+
/** The content is being fetched again (a filter, sort, page or saved-view change). */
|
|
7381
|
+
busy: boolean;
|
|
7382
|
+
children?: ReactNode;
|
|
7383
|
+
}
|
|
7384
|
+
/**
|
|
7385
|
+
* Keeps what is on screen while it is fetched again (HAR-2582, motion standard §2.5): the
|
|
7386
|
+
* children stay, dim, and an indeterminate bar runs along the top; `aria-busy` is set at
|
|
7387
|
+
* once. The bar and the dim wait 300 ms, so a quick refetch shows nothing, and then stay at
|
|
7388
|
+
* least 500 ms. A skeleton is for a first load only: swapping rows for skeletons on every
|
|
7389
|
+
* refetch hides what changed. For a table, `TableWrap refreshing` does the same.
|
|
7390
|
+
*/
|
|
7391
|
+
declare function BusyRegion({ busy, className, children, ...props }: BusyRegionProps): react.JSX.Element;
|
|
7392
|
+
|
|
7393
|
+
interface ChangeHighlightProps extends HTMLAttributes<HTMLElement> {
|
|
7394
|
+
/** The value shown inside. When it changes after mount the element flashes; never on the first render. */
|
|
7395
|
+
value: unknown;
|
|
7396
|
+
/** The element to render (default `span`): `td`, `tr`, `div`, `li`… A `tr` tints its cells. */
|
|
7397
|
+
as?: keyof HTMLElementTagNameMap;
|
|
7398
|
+
/**
|
|
7399
|
+
* `tint` (default) fades a background tint, for a row, a cell or a field; `ring` fades an
|
|
7400
|
+
* outline instead, for something with a colour of its own, such as a status pill.
|
|
7401
|
+
*/
|
|
7402
|
+
variant?: 'tint' | 'ring';
|
|
7403
|
+
/** Said politely when the value changes, e.g. "Status changed to Resolved by A. Novak". */
|
|
7404
|
+
announce?: string;
|
|
7405
|
+
/** No highlight, e.g. while the person is editing this value themselves. */
|
|
7406
|
+
disabled?: boolean;
|
|
7407
|
+
children?: ReactNode;
|
|
7408
|
+
}
|
|
7409
|
+
/**
|
|
7410
|
+
* Shows that a value changed in place (HAR-2585, motion standard §2.5): a live update, the
|
|
7411
|
+
* result of a transition, a rolled-back optimistic change. The element is tinted at once and
|
|
7412
|
+
* the tint fades; under reduced motion or forced colours it is outlined for the same time
|
|
7413
|
+
* instead. The flash is the signal and its place the location; pass `announce` for the
|
|
7414
|
+
* description. For an element you render yourself, use `useChangeHighlight`; on plain markup,
|
|
7415
|
+
* add `.uix-changed` (remove it, force a reflow and add it again to replay).
|
|
7416
|
+
*/
|
|
7417
|
+
declare const ChangeHighlight: react.ForwardRefExoticComponent<ChangeHighlightProps & react.RefAttributes<HTMLElement | null>>;
|
|
7418
|
+
|
|
7419
|
+
interface CountProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {
|
|
7420
|
+
/** The number shown. */
|
|
7421
|
+
value: number;
|
|
7422
|
+
/**
|
|
7423
|
+
* Formats the number, e.g. `n > 99 ? '99+' : String(n)` or your i18n formatter. The default is
|
|
7424
|
+
* `toLocaleString()` in the runtime's locale: pass `format` when the server renders it, so the
|
|
7425
|
+
* server's and the browser's thousands separators cannot differ.
|
|
7426
|
+
*/
|
|
7427
|
+
format?: (value: number) => string;
|
|
7428
|
+
}
|
|
7429
|
+
/**
|
|
7430
|
+
* A number that ticks once when it changes (HAR-2587, motion standard §2.8): a badge count, a
|
|
7431
|
+
* stat tile's value, an unread total. The new figure slides 4 px in from below when it went
|
|
7432
|
+
* up and from above when it went down, with a fade; never on the first render, never a loop,
|
|
7433
|
+
* never a count-up through the numbers between. Tabular figures, so neighbours do not shift.
|
|
7434
|
+
* Under reduced motion it only fades. It announces nothing: say what changed where it
|
|
7435
|
+
* matters (a toast, `ChangeHighlight announce`).
|
|
7436
|
+
*/
|
|
7437
|
+
declare function Count({ value, format, className, ...props }: CountProps): react.JSX.Element;
|
|
5018
7438
|
|
|
5019
7439
|
interface ComposerProps extends HTMLAttributes<HTMLDivElement> {
|
|
5020
7440
|
children?: ReactNode;
|
|
@@ -5055,8 +7475,15 @@ interface SegmentedProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'
|
|
|
5055
7475
|
* toggle bar. `'radio'`: `role="radiogroup"` of `role="radio"` with `aria-checked`, for a
|
|
5056
7476
|
* setting with exactly one value (theme, density, language). Name the group with
|
|
5057
7477
|
* `aria-label` or `aria-labelledby` in either mode. The keyboard model is the same in both.
|
|
5058
|
-
|
|
5059
|
-
|
|
7478
|
+
*
|
|
7479
|
+
* `'link'` (HAR-1380): navigation, not a choice, such as a language switcher where each
|
|
7480
|
+
* option is a URL. A `<nav>` (named by your `aria-label`) around a list of links, each
|
|
7481
|
+
* option needs an `href`, and the one whose `value` is `value` carries `aria-current="page"`.
|
|
7482
|
+
* The same pill look; every link is its own tab stop and Enter follows it, like any nav.
|
|
7483
|
+
*/
|
|
7484
|
+
selection?: 'toggle' | 'radio' | 'link';
|
|
7485
|
+
/** `selection="link"`: renders each option's link with your router. Default: `<a>`. */
|
|
7486
|
+
renderLink?: UixRenderLink;
|
|
5060
7487
|
children?: ReactNode;
|
|
5061
7488
|
}
|
|
5062
7489
|
/**
|
|
@@ -5070,9 +7497,13 @@ interface SegmentedProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'
|
|
|
5070
7497
|
* enabled option and select it, wrapping at the ends; Home and End jump; Left/Right swap in
|
|
5071
7498
|
* a right-to-left group. Before 2.32.0 every option was its own tab stop.
|
|
5072
7499
|
*/
|
|
5073
|
-
declare function Segmented({ value, onChange, selection, children, className, onKeyDown, ...props }: SegmentedProps): react.JSX.Element;
|
|
7500
|
+
declare function Segmented({ value, onChange, selection, renderLink, children, className, onKeyDown, ...props }: SegmentedProps): react.JSX.Element;
|
|
5074
7501
|
interface SegmentedOptionProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'onChange'> {
|
|
5075
7502
|
value: string;
|
|
7503
|
+
/** In a `selection="link"` group: where the option goes. Required there, ignored otherwise. */
|
|
7504
|
+
href?: string;
|
|
7505
|
+
/** In a `selection="link"` group: the target's language, e.g. `de` on a locale switcher. */
|
|
7506
|
+
hrefLang?: string;
|
|
5076
7507
|
children?: ReactNode;
|
|
5077
7508
|
}
|
|
5078
7509
|
/**
|
|
@@ -5081,147 +7512,30 @@ interface SegmentedOptionProps extends Omit<ButtonHTMLAttributes<HTMLButtonEleme
|
|
|
5081
7512
|
* `.uix-segmented__option[aria-pressed="true"]` (or `[aria-checked="true"]` in a
|
|
5082
7513
|
* `selection="radio"` group).
|
|
5083
7514
|
*/
|
|
5084
|
-
declare function SegmentedOption({ value, children, className, onClick, ...props }: SegmentedOptionProps): react.JSX.Element;
|
|
5085
|
-
|
|
5086
|
-
|
|
5087
|
-
|
|
7515
|
+
declare function SegmentedOption({ value, href, hrefLang, children, className, onClick, ...props }: SegmentedOptionProps): react.JSX.Element;
|
|
7516
|
+
interface LocaleSwitcherLocale {
|
|
7517
|
+
/** BCP 47 code: `de`, `bs`, `en-GB`. Sets the link's `lang` and `hreflang`. */
|
|
7518
|
+
code: string;
|
|
7519
|
+
/** What the option shows: "Deutsch", or a short "DE". */
|
|
5088
7520
|
label: ReactNode;
|
|
5089
|
-
|
|
5090
|
-
|
|
5091
|
-
/** Always shown (e.g. the record id): the row has no checkbox and no Hide / Show, its name sits in the checkbox's slot. */
|
|
5092
|
-
required?: boolean;
|
|
5093
|
-
/** Plain-text name for the `{label}` templates in `columnLabels` when `label` is not a string. */
|
|
5094
|
-
textLabel?: string;
|
|
5095
|
-
}
|
|
5096
|
-
/**
|
|
5097
|
-
* Words for the column rows. `{label}` is replaced by the column name; `moved` also gets
|
|
5098
|
-
* `{position}` and `{count}`. Every key has an English default.
|
|
5099
|
-
*/
|
|
5100
|
-
interface ViewMenuColumnLabels {
|
|
5101
|
-
/** Name of a row's ⋯ menu button and of the menu. Default `Column actions: {label}`. */
|
|
5102
|
-
rowActions: string;
|
|
5103
|
-
/** Name of a row's drag grip. Default `Drag to reorder: {label}`. */
|
|
5104
|
-
reorder: string;
|
|
5105
|
-
moveUp: string;
|
|
5106
|
-
moveDown: string;
|
|
5107
|
-
hide: string;
|
|
5108
|
-
show: string;
|
|
5109
|
-
/** Tooltip on a required column's name. Default `Always shown`. */
|
|
5110
|
-
required: string;
|
|
5111
|
-
/** Polite announcement after a move. Default `{label} moved to position {position} of {count}`. */
|
|
5112
|
-
moved: string;
|
|
5113
|
-
}
|
|
5114
|
-
interface ViewMenuProps {
|
|
5115
|
-
/** The density section renders when `densityOptions` and `onDensityChange` are given. */
|
|
5116
|
-
density?: string;
|
|
5117
|
-
densityLabel?: ReactNode;
|
|
5118
|
-
densityOptions?: readonly {
|
|
5119
|
-
value: string;
|
|
5120
|
-
label: ReactNode;
|
|
5121
|
-
}[];
|
|
5122
|
-
onDensityChange?: (value: string) => void;
|
|
5123
|
-
/** Optional title over the zebra / freeze switches. */
|
|
5124
|
-
displayLabel?: ReactNode;
|
|
5125
|
-
zebra?: {
|
|
5126
|
-
checked: boolean;
|
|
5127
|
-
label: ReactNode;
|
|
5128
|
-
onChange: (checked: boolean) => void;
|
|
5129
|
-
};
|
|
5130
|
-
freeze?: {
|
|
5131
|
-
checked: boolean;
|
|
5132
|
-
label: ReactNode;
|
|
5133
|
-
onChange: (checked: boolean) => void;
|
|
5134
|
-
};
|
|
5135
|
-
columns?: readonly ViewMenuColumn[];
|
|
5136
|
-
columnsLabel?: ReactNode;
|
|
5137
|
-
onColumnVisibilityChange?: (id: string, visible: boolean) => void;
|
|
5138
|
-
/**
|
|
5139
|
-
* Turns on reordering: every column row gets a drag grip (pointer; ArrowUp / ArrowDown once
|
|
5140
|
-
* focused) and a ⋯ menu with Move up · Move down · Hide / Show, which is the keyboard path.
|
|
5141
|
-
* Receives every column id, first to last. The order is the application's to persist.
|
|
5142
|
-
*/
|
|
5143
|
-
onReorder?: (orderedIds: string[]) => void;
|
|
5144
|
-
columnLabels?: Partial<ViewMenuColumnLabels>;
|
|
5145
|
-
/** Pinned under the columns, e.g. a Reset sort `.uix-menu__item` button. */
|
|
5146
|
-
footer?: ReactNode;
|
|
5147
|
-
className?: string;
|
|
7521
|
+
/** This page in that language. */
|
|
7522
|
+
href: string;
|
|
5148
7523
|
}
|
|
5149
|
-
|
|
5150
|
-
|
|
5151
|
-
|
|
5152
|
-
|
|
5153
|
-
|
|
5154
|
-
|
|
5155
|
-
interface FilterOption {
|
|
5156
|
-
value: string;
|
|
7524
|
+
interface LocaleSwitcherProps extends Omit<HTMLAttributes<HTMLElement>, 'children' | 'onChange'> {
|
|
7525
|
+
/** One link per language, in the order shown. */
|
|
7526
|
+
locales: readonly LocaleSwitcherLocale[];
|
|
7527
|
+
/** The code of the page's language; that link is `aria-current="page"`. */
|
|
7528
|
+
current: string;
|
|
7529
|
+
/** Names the navigation, in the page's language: "Language", "Sprache". */
|
|
5157
7530
|
label: string;
|
|
7531
|
+
/** Renders each link with your router (locale-aware links keep client navigation). */
|
|
7532
|
+
renderLink?: UixRenderLink;
|
|
5158
7533
|
}
|
|
5159
|
-
interface FilterPopoverProps {
|
|
5160
|
-
label: ReactNode;
|
|
5161
|
-
type?: 'text' | 'number' | 'date' | 'select' | 'enum' | 'boolean';
|
|
5162
|
-
value: string;
|
|
5163
|
-
onValueChange: (value: string) => void;
|
|
5164
|
-
options?: readonly FilterOption[];
|
|
5165
|
-
applyLabel: ReactNode;
|
|
5166
|
-
clearLabel: ReactNode;
|
|
5167
|
-
onApply: () => void;
|
|
5168
|
-
onClear: () => void;
|
|
5169
|
-
placeholder?: string;
|
|
5170
|
-
}
|
|
5171
|
-
/** Controlled filter editor content; applications own query serialization and the popover trigger. */
|
|
5172
|
-
declare function FilterPopover({ label, type, value, onValueChange, options, applyLabel, clearLabel, onApply, onClear, placeholder }: FilterPopoverProps): react.JSX.Element;
|
|
5173
|
-
interface SavedViewItem {
|
|
5174
|
-
id: string;
|
|
5175
|
-
label: ReactNode;
|
|
5176
|
-
active?: boolean;
|
|
5177
|
-
pinned?: boolean;
|
|
5178
|
-
}
|
|
5179
|
-
/** A titled group of saved views, e.g. the user's custom views above the built-in presets. */
|
|
5180
|
-
interface SavedViewSection {
|
|
5181
|
-
id: string;
|
|
5182
|
-
label: ReactNode;
|
|
5183
|
-
items: readonly SavedViewItem[];
|
|
5184
|
-
}
|
|
5185
|
-
interface SavedViewMenuBaseProps {
|
|
5186
|
-
onSelect: (id: string) => void;
|
|
5187
|
-
emptyLabel?: ReactNode;
|
|
5188
|
-
/** The row's overflow slot (e.g. a ⋯ menu trigger). It stays quiet until the row is hovered or focused, or its menu is open. */
|
|
5189
|
-
actions?: (item: SavedViewItem) => ReactNode;
|
|
5190
|
-
footer?: ReactNode;
|
|
5191
|
-
}
|
|
5192
|
-
type SavedViewMenuProps = SavedViewMenuBaseProps & ({
|
|
5193
|
-
items: readonly SavedViewItem[];
|
|
5194
|
-
sections?: never;
|
|
5195
|
-
} | {
|
|
5196
|
-
sections: readonly SavedViewSection[];
|
|
5197
|
-
items?: never;
|
|
5198
|
-
}) & ({
|
|
5199
|
-
onPinChange: (id: string, pinned: boolean) => void;
|
|
5200
|
-
pinLabel: string;
|
|
5201
|
-
unpinLabel: string;
|
|
5202
|
-
} | {
|
|
5203
|
-
onPinChange?: undefined;
|
|
5204
|
-
pinLabel?: never;
|
|
5205
|
-
unpinLabel?: never;
|
|
5206
|
-
}) & ({
|
|
5207
|
-
/**
|
|
5208
|
-
* Adds a drag grip to every row. Rows move only within their own section; the
|
|
5209
|
-
* callback receives that section's full id order (and its id when `sections` is used).
|
|
5210
|
-
* The grip also moves its row with ArrowUp / ArrowDown.
|
|
5211
|
-
*/
|
|
5212
|
-
onReorder: (orderedIds: string[], sectionId: string | undefined) => void;
|
|
5213
|
-
/** Accessible name of the grip; the row's name is attached as its description. */
|
|
5214
|
-
reorderLabel: string;
|
|
5215
|
-
} | {
|
|
5216
|
-
onReorder?: undefined;
|
|
5217
|
-
reorderLabel?: never;
|
|
5218
|
-
});
|
|
5219
7534
|
/**
|
|
5220
|
-
*
|
|
5221
|
-
*
|
|
5222
|
-
* ownership, permissions and labels remain application concerns.
|
|
7535
|
+
* A language switcher (HAR-1380; MOTUS C-12): a `Segmented selection="link"` whose links carry
|
|
7536
|
+
* `lang` and `hreflang`, so each language's name is read in that language.
|
|
5223
7537
|
*/
|
|
5224
|
-
declare function
|
|
7538
|
+
declare function LocaleSwitcher({ locales, current, label, renderLink, ...props }: LocaleSwitcherProps): react.JSX.Element;
|
|
5225
7539
|
|
|
5226
7540
|
interface TimelineProps extends HTMLAttributes<HTMLOListElement> {
|
|
5227
7541
|
children?: ReactNode;
|
|
@@ -5460,6 +7774,47 @@ interface MenuGroupProps {
|
|
|
5460
7774
|
declare function MenuGroup({ label, children }: MenuGroupProps): react.JSX.Element;
|
|
5461
7775
|
declare function MenuSeparator(): react.JSX.Element;
|
|
5462
7776
|
|
|
7777
|
+
/** One command of a `CommandPalette` in items mode. */
|
|
7778
|
+
interface CommandPaletteItem {
|
|
7779
|
+
/** Unique among the items; also the option's id suffix. */
|
|
7780
|
+
id: string;
|
|
7781
|
+
label: string;
|
|
7782
|
+
/** Group heading the item is listed under. Items without one form a group without a heading. */
|
|
7783
|
+
group?: string;
|
|
7784
|
+
/** More words that find the item but are not shown: synonyms, an old name, a record number. */
|
|
7785
|
+
keywords?: readonly string[];
|
|
7786
|
+
/** A second line, e.g. where the command leads. Not searched. */
|
|
7787
|
+
description?: string;
|
|
7788
|
+
/** Leading icon (decorative). */
|
|
7789
|
+
icon?: ReactNode;
|
|
7790
|
+
/** Key names (`['Mod', 'K']`) shown at the end of the row and set as `aria-keyshortcuts`. */
|
|
7791
|
+
shortcut?: readonly string[];
|
|
7792
|
+
/** Runs when the item is chosen. */
|
|
7793
|
+
onSelect?: () => void;
|
|
7794
|
+
/** Where the item leads: `onNavigate(href)`, else the browser goes there. */
|
|
7795
|
+
href?: string;
|
|
7796
|
+
/** Shown but not choosable; skipped by the arrow keys. */
|
|
7797
|
+
disabled?: boolean;
|
|
7798
|
+
}
|
|
7799
|
+
/** A group of found commands, in the order they are shown. */
|
|
7800
|
+
interface CommandPaletteGroup {
|
|
7801
|
+
/** The group heading; `undefined` for items without a group. */
|
|
7802
|
+
label: string | undefined;
|
|
7803
|
+
items: CommandPaletteItem[];
|
|
7804
|
+
}
|
|
7805
|
+
/**
|
|
7806
|
+
* The commands `query` finds, best first (HAR-1378): a label that starts with the query, then
|
|
7807
|
+
* labels where every word of the query starts a word, then labels that contain every word, then
|
|
7808
|
+
* matches through `keywords`. Equal matches keep the order they were given in. An empty query
|
|
7809
|
+
* finds every item, in order.
|
|
7810
|
+
*/
|
|
7811
|
+
declare function filterCommandItems(items: readonly CommandPaletteItem[], query: string): CommandPaletteItem[];
|
|
7812
|
+
/**
|
|
7813
|
+
* `items` in groups, each group where its first item is, its items in their given order. With a
|
|
7814
|
+
* ranked list (from `filterCommandItems`) the group of the best match comes first.
|
|
7815
|
+
*/
|
|
7816
|
+
declare function groupCommandItems(items: readonly CommandPaletteItem[]): CommandPaletteGroup[];
|
|
7817
|
+
|
|
5463
7818
|
interface CommandPaletteProps extends HTMLAttributes<HTMLDivElement> {
|
|
5464
7819
|
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
5465
7820
|
inputLabel?: string;
|
|
@@ -5471,6 +7826,40 @@ interface CommandPaletteProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
5471
7826
|
/** Props for the search input (value/onChange/placeholder wired by the consumer). */
|
|
5472
7827
|
inputProps?: InputHTMLAttributes<HTMLInputElement>;
|
|
5473
7828
|
children?: ReactNode;
|
|
7829
|
+
/**
|
|
7830
|
+
* Items mode (HAR-1378): pass the commands and the palette filters them itself (case and
|
|
7831
|
+
* diacritics folded, best match first), groups them, moves the active one with ↑ / ↓ (Home / End
|
|
7832
|
+
* while the query is empty) through `aria-activedescendant`, and runs it on Enter or a click.
|
|
7833
|
+
* Without `items`, `children` render as before and the consumer wires everything.
|
|
7834
|
+
*/
|
|
7835
|
+
items?: readonly CommandPaletteItem[];
|
|
7836
|
+
/** Items mode: the query (controlled). Pair with `onQueryChange`. */
|
|
7837
|
+
query?: string;
|
|
7838
|
+
/** Items mode: the query as it changes (also when the palette clears it on close). */
|
|
7839
|
+
onQueryChange?: (query: string) => void;
|
|
7840
|
+
/** Items mode: what an empty query shows above all items, under the `recentLabel` heading. */
|
|
7841
|
+
recent?: readonly CommandPaletteItem[];
|
|
7842
|
+
/** Items mode: your own matching instead of the built-in one (`filterCommandItems`). */
|
|
7843
|
+
filter?: (items: readonly CommandPaletteItem[], query: string) => CommandPaletteItem[];
|
|
7844
|
+
/** Items mode: called with every chosen item, after its own `onSelect`, e.g. to record it as recent. */
|
|
7845
|
+
onItemSelect?: (item: CommandPaletteItem) => void;
|
|
7846
|
+
/** Items mode: follow an item's `href` with your router. Default: the browser goes there. */
|
|
7847
|
+
onNavigate?: (href: string, item: CommandPaletteItem) => void;
|
|
7848
|
+
/** Items mode: shown when nothing matches. Default: `UixLabelsProvider` `commandPalette.empty`, then "No results". */
|
|
7849
|
+
emptyLabel?: ReactNode;
|
|
7850
|
+
/** Items mode: the heading of `recent`. Default: `commandPalette.recent`, then "Recent". */
|
|
7851
|
+
recentLabel?: string;
|
|
7852
|
+
/** Items mode: the input's placeholder. */
|
|
7853
|
+
placeholder?: string;
|
|
7854
|
+
/**
|
|
7855
|
+
* Items mode: host the palette in a modal native `<dialog>` (focus stays inside, Escape and a
|
|
7856
|
+
* click outside close it, focus returns to the opener). Closing it clears the query. Without
|
|
7857
|
+
* `open`, the palette renders in place.
|
|
7858
|
+
*/
|
|
7859
|
+
open?: boolean;
|
|
7860
|
+
onOpenChange?: (open: boolean) => void;
|
|
7861
|
+
/** Items mode: render at most this many found items (the count still says how many were found). Default 100. */
|
|
7862
|
+
limit?: number;
|
|
5474
7863
|
}
|
|
5475
7864
|
/**
|
|
5476
7865
|
* ⌘K command palette surface over `.uix-cmdk`. Presentational: mount it inside a
|
|
@@ -5482,7 +7871,7 @@ interface CommandPaletteProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
5482
7871
|
* popover it sits in `[data-uix-instant]`: it opens and closes with no animation, without the
|
|
5483
7872
|
* consumer knowing the attribute (or the older `data-uix-cmdk-dialog`).
|
|
5484
7873
|
*/
|
|
5485
|
-
declare function CommandPalette(
|
|
7874
|
+
declare function CommandPalette(props: CommandPaletteProps): react.JSX.Element;
|
|
5486
7875
|
interface CommandGroupProps {
|
|
5487
7876
|
label?: ReactNode;
|
|
5488
7877
|
children?: ReactNode;
|
|
@@ -5655,9 +8044,16 @@ interface SectionHeadProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'>
|
|
|
5655
8044
|
helpLabel?: string;
|
|
5656
8045
|
/** Right-aligned slot — a `.uix-section-link` anchor, a button, a pill. */
|
|
5657
8046
|
action?: ReactNode;
|
|
8047
|
+
/**
|
|
8048
|
+
* `compact` is the in-card section preset (HAR-1815): a 15 px / 1.3 / 600 title in place of
|
|
8049
|
+
* the 24 px editorial h2. Default `default`.
|
|
8050
|
+
*/
|
|
8051
|
+
size?: 'default' | 'compact';
|
|
8052
|
+
/** Heading level of the title. Default `h2`; an in-card section is often an `h3`. */
|
|
8053
|
+
as?: 'h2' | 'h3';
|
|
5658
8054
|
}
|
|
5659
8055
|
/** Section head — title row (+ optional `help` ?) with an optional trailing action (`.uix-section-head`). */
|
|
5660
|
-
declare function SectionHead({ title, titleId, help, helpLabel, action, className, ...props }: SectionHeadProps): react.JSX.Element;
|
|
8056
|
+
declare function SectionHead({ title, titleId, help, helpLabel, action, size, as: Heading, className, ...props }: SectionHeadProps): react.JSX.Element;
|
|
5661
8057
|
interface NoticeQueueProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
|
|
5662
8058
|
/** Leading icon slot. */
|
|
5663
8059
|
icon?: ReactNode;
|
|
@@ -5794,9 +8190,22 @@ interface EventRowProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
|
|
|
5794
8190
|
day: ReactNode;
|
|
5795
8191
|
title: ReactNode;
|
|
5796
8192
|
meta?: ReactNode;
|
|
8193
|
+
/** Weekday above the month in the date tile, e.g. "Sri" (HAR-1370). */
|
|
8194
|
+
weekday?: ReactNode;
|
|
8195
|
+
/** Year under the day in the date tile, for a list that crosses a year (HAR-1370). */
|
|
8196
|
+
year?: ReactNode;
|
|
8197
|
+
/** Start time at the foot of the date tile, e.g. "18:00" (HAR-1370). */
|
|
8198
|
+
time?: ReactNode;
|
|
8199
|
+
/**
|
|
8200
|
+
* The machine-readable date (and time) of the tile, e.g. `"2026-10-22T18:00+02:00"`: the tile
|
|
8201
|
+
* becomes a `<time>` element, so the date is not only words.
|
|
8202
|
+
*/
|
|
8203
|
+
dateTime?: string;
|
|
8204
|
+
/** A thumbnail at the end of the row (an `<img>`), drawn 4:3 and cropped to fill (HAR-1370). */
|
|
8205
|
+
media?: ReactNode;
|
|
5797
8206
|
}
|
|
5798
|
-
/** Event row — date block + title/meta (`.uix-event-row`). */
|
|
5799
|
-
declare function EventRow({ month, day, title, meta, className, ...props }: EventRowProps): react.JSX.Element;
|
|
8207
|
+
/** Event row — date block + title/meta (`.uix-event-row`), with an optional thumbnail. */
|
|
8208
|
+
declare function EventRow({ month, day, title, meta, weekday, year, time, dateTime, media, className, ...props }: EventRowProps): react.JSX.Element;
|
|
5800
8209
|
interface StatusRowProps extends HTMLAttributes<HTMLDivElement> {
|
|
5801
8210
|
/** Leading indicator slot (e.g. a `.uix-dot`). */
|
|
5802
8211
|
indicator?: ReactNode;
|
|
@@ -5902,11 +8311,63 @@ declare function joinDateTime(date: string | null, time: string, fallbackTime?:
|
|
|
5902
8311
|
/** The short name of `timeZone` on that day ("CEST", "GMT+2"), for the label beside a time. */
|
|
5903
8312
|
declare function timeZoneName(timeZone: string, date: string | null, locale?: string | readonly string[]): string;
|
|
5904
8313
|
|
|
8314
|
+
/**
|
|
8315
|
+
* uix time-field model — pure helpers behind `TimePicker` (HAR-1835): how a locale writes a time
|
|
8316
|
+
* of day, how a typed time is read, and how the arrow keys step it. No DOM, no React, no runtime
|
|
8317
|
+
* import, so the unit test loads this file directly (time-field-model.test.mjs).
|
|
8318
|
+
*
|
|
8319
|
+
* A time is a wall-clock `HH:mm` string (what `<input type="time">` holds): 24-hour, zero-padded,
|
|
8320
|
+
* no seconds, no zone.
|
|
8321
|
+
*/
|
|
8322
|
+
/** Whether `HH:mm` names a time of day (00:00 to 23:59). */
|
|
8323
|
+
declare function isValidTimeKey(value: string | null | undefined): value is string;
|
|
8324
|
+
/** Minutes since midnight of `HH:mm`. */
|
|
8325
|
+
declare const timeToMinutes: (value: string) => number;
|
|
8326
|
+
/** `HH:mm` of a minute of the day (wrapped into 0 … 1439). */
|
|
8327
|
+
declare const minutesToTime: (minutes: number) => string;
|
|
8328
|
+
/** Whether `locale` writes times on a 12-hour clock (en-US: yes; de, en-GB, bs: no). */
|
|
8329
|
+
declare function uses12Hour(locale?: string | readonly string[]): boolean;
|
|
8330
|
+
/** A time in the locale's own shape: 14:30 in German, 2:30 PM in en-US. `hour12` overrides the locale. */
|
|
8331
|
+
declare function formatTimeKey(value: string, locale?: string | readonly string[], hour12?: boolean): string;
|
|
8332
|
+
/**
|
|
8333
|
+
* Where the hour and the minutes end in `formatTimeKey(value, locale, hour12)` (character offsets),
|
|
8334
|
+
* found from the formatter's own parts, so "오후 2:30" (ko, the day period first) and "2:30 PM"
|
|
8335
|
+
* both work. `null` when the value is not a time.
|
|
8336
|
+
*/
|
|
8337
|
+
declare function timePartEnds(value: string, locale?: string | readonly string[], hour12?: boolean): {
|
|
8338
|
+
hour: number;
|
|
8339
|
+
minute: number;
|
|
8340
|
+
} | null;
|
|
8341
|
+
/**
|
|
8342
|
+
* Read a typed time. Accepts `14:30`, `14.30`, `14h30`, `1430`, `930`, `9` and, with a day period,
|
|
8343
|
+
* `2:30 pm`, `2pm`, `2:30 p.m.` (and the locale's own words). Without a day period the hour is
|
|
8344
|
+
* read on the 24-hour clock. Returns `HH:mm`, or `null` when the text is not a time.
|
|
8345
|
+
*/
|
|
8346
|
+
declare function parseTimeInput(text: string, locale?: string | readonly string[]): string | null;
|
|
8347
|
+
/** Whether `min` is after `max`: an overnight range (22:00 to 06:00) that wraps round midnight. */
|
|
8348
|
+
declare const isOvernightRange: (min?: string, max?: string) => boolean;
|
|
8349
|
+
/** Whether `value` is outside `min` / `max` (both `HH:mm`, inclusive; `min` after `max` wraps midnight). */
|
|
8350
|
+
declare function isTimeOutOfRange(value: string, min?: string, max?: string): boolean;
|
|
8351
|
+
/**
|
|
8352
|
+
* The time `delta` minutes from `value`, for the arrow keys. Between `min` and `max` it stops at
|
|
8353
|
+
* the ends; with neither it wraps round midnight. From an empty field it starts at `min`, or 00:00.
|
|
8354
|
+
*/
|
|
8355
|
+
declare function stepTime(value: string | null, delta: number, min?: string, max?: string): string;
|
|
8356
|
+
/** The times a list offers: every `step` minutes from `min` (or 00:00) to `max` (or 23:59). */
|
|
8357
|
+
declare function timeSlots(step: number, min?: string, max?: string): string[];
|
|
8358
|
+
|
|
8359
|
+
/**
|
|
8360
|
+
* A colour that a node or an edge shares with a legend item (HAR-1639). Colour is never the only
|
|
8361
|
+
* signal: say the same thing in the node's text, the edge's `description` or its `variant`.
|
|
8362
|
+
*/
|
|
8363
|
+
type RelationshipGraphTone = 'neutral' | 'info' | 'success' | 'warning' | 'danger' | 'accent';
|
|
5905
8364
|
interface RelationshipGraphNode {
|
|
5906
8365
|
id: string;
|
|
5907
8366
|
label: string;
|
|
5908
8367
|
type?: string;
|
|
5909
8368
|
description?: string;
|
|
8369
|
+
/** Layered layout: the node's border and edge mark take this tone (HAR-1639). */
|
|
8370
|
+
tone?: RelationshipGraphTone;
|
|
5910
8371
|
x?: number;
|
|
5911
8372
|
y?: number;
|
|
5912
8373
|
/** Layered layout: the node's column. Omitted → BFS distance from the root along source→target. */
|
|
@@ -5924,6 +8385,18 @@ interface RelationshipGraphEdge {
|
|
|
5924
8385
|
arrow?: RelationshipGraphArrow;
|
|
5925
8386
|
/** Layered layout: always draw this edge's label, whatever the label policy. */
|
|
5926
8387
|
emphasis?: boolean;
|
|
8388
|
+
/**
|
|
8389
|
+
* `dashed` draws the line dashed, e.g. an expected relation that is missing (HAR-1639). Default
|
|
8390
|
+
* `solid`; a lateral or cycle edge is dashed either way.
|
|
8391
|
+
*/
|
|
8392
|
+
variant?: 'solid' | 'dashed';
|
|
8393
|
+
/** The line and arrowhead take this tone (HAR-1639). */
|
|
8394
|
+
tone?: RelationshipGraphTone;
|
|
8395
|
+
/**
|
|
8396
|
+
* Said to assistive technology with the relationship, on both nodes it joins, e.g. "expected,
|
|
8397
|
+
* missing" (HAR-1639). The drawn line itself is decoration; the nodes carry the relationship.
|
|
8398
|
+
*/
|
|
8399
|
+
description?: string;
|
|
5927
8400
|
}
|
|
5928
8401
|
interface PositionedRelationshipNode extends RelationshipGraphNode {
|
|
5929
8402
|
x: number;
|
|
@@ -5939,7 +8412,12 @@ declare function boundRelationshipGraph(nodes: RelationshipGraphNode[], edges: R
|
|
|
5939
8412
|
declare function relationshipNeighbors(nodeId: string, edges: RelationshipGraphEdge[]): string[];
|
|
5940
8413
|
declare function layoutRelationshipGraph(nodes: RelationshipGraphNode[], edges: RelationshipGraphEdge[], rootId?: string): PositionedRelationshipNode[];
|
|
5941
8414
|
declare function traverseRelationshipNode(nodes: RelationshipGraphNode[], currentId: string | undefined, direction: -1 | 1): string | undefined;
|
|
5942
|
-
|
|
8415
|
+
/**
|
|
8416
|
+
* `forward` steps one column right; `skip` goes right across more than one column; `lateral`
|
|
8417
|
+
* stays in its column; `back` goes left without closing a loop; `cycle` goes left and closes one
|
|
8418
|
+
* (HAR-1639: only a cycle is flagged as one, and only lateral and cycle edges are dashed).
|
|
8419
|
+
*/
|
|
8420
|
+
type LayeredEdgeKind = 'forward' | 'skip' | 'lateral' | 'back' | 'cycle';
|
|
5943
8421
|
interface LayeredLayoutOptions {
|
|
5944
8422
|
rootId?: string;
|
|
5945
8423
|
/** Minimum sibling group size that collapses into a cluster. Default 6; 0 disables. */
|
|
@@ -5974,7 +8452,7 @@ interface LayeredItem {
|
|
|
5974
8452
|
children: string[];
|
|
5975
8453
|
/** Set on the first member of an expanded cluster: the group its collapse control belongs to. */
|
|
5976
8454
|
expandedGroup?: RelationshipGraphCluster;
|
|
5977
|
-
/** True when a
|
|
8455
|
+
/** True when a cycle edge touches this node (HAR-1639: no longer set by skip, lateral or back edges). */
|
|
5978
8456
|
inCycle: boolean;
|
|
5979
8457
|
/** Edges (any kind) touching this item. */
|
|
5980
8458
|
degree: number;
|
|
@@ -5991,6 +8469,10 @@ interface RoutedEdge {
|
|
|
5991
8469
|
label?: string;
|
|
5992
8470
|
arrow: RelationshipGraphArrow;
|
|
5993
8471
|
emphasis: boolean;
|
|
8472
|
+
/** The first underlying edge's `variant`, `tone` and `description`. */
|
|
8473
|
+
variant: 'solid' | 'dashed';
|
|
8474
|
+
tone?: RelationshipGraphTone;
|
|
8475
|
+
description?: string;
|
|
5994
8476
|
path: string;
|
|
5995
8477
|
labelX: number;
|
|
5996
8478
|
labelY: number;
|
|
@@ -6000,6 +8482,17 @@ interface RoutedEdge {
|
|
|
6000
8482
|
arrowAngle: number;
|
|
6001
8483
|
/** Label policy `auto` shows this label without interaction. */
|
|
6002
8484
|
autoLabel: boolean;
|
|
8485
|
+
/**
|
|
8486
|
+
* The label is said once by the target column's header (`LayeredColumn.edgeLabel`), so the
|
|
8487
|
+
* edge itself never draws it under `edgeLabels="auto"` (HAR-1387: 197 of 200 labels on a
|
|
8488
|
+
* 300-node map read "depends on").
|
|
8489
|
+
*/
|
|
8490
|
+
columnLabel: boolean;
|
|
8491
|
+
/**
|
|
8492
|
+
* One of a busy node's forward edges, drawn as a bus: along a shared trunk in the column gap
|
|
8493
|
+
* and a short stub into the target, so a fan-out reads as one line, not a black fan (HAR-1387).
|
|
8494
|
+
*/
|
|
8495
|
+
bus: boolean;
|
|
6003
8496
|
/** The label wrapped to fit the column gap (at most two lines). */
|
|
6004
8497
|
labelLines: string[];
|
|
6005
8498
|
}
|
|
@@ -6008,6 +8501,11 @@ interface LayeredColumn {
|
|
|
6008
8501
|
x: number;
|
|
6009
8502
|
/** Underlying nodes in the column, cluster members included. */
|
|
6010
8503
|
count: number;
|
|
8504
|
+
/**
|
|
8505
|
+
* The relation most forward edges into this column share, when the column takes more than a
|
|
8506
|
+
* few of them: the header says it once and those edges draw no label (HAR-1387).
|
|
8507
|
+
*/
|
|
8508
|
+
edgeLabel?: string;
|
|
6011
8509
|
}
|
|
6012
8510
|
interface LayeredLayout {
|
|
6013
8511
|
rootId: string | undefined;
|
|
@@ -6039,6 +8537,37 @@ declare function classifyLayeredEdges(nodes: RelationshipGraphNode[], edges: Rel
|
|
|
6039
8537
|
declare function clusterIdFor(parentId: string, type: string | undefined, edgeType: string | undefined): string;
|
|
6040
8538
|
/** Layered, clustered, crossing-reduced layout for `RelationshipGraph layout="layered"`. */
|
|
6041
8539
|
declare function layoutLayeredGraph(nodes: RelationshipGraphNode[], edges: RelationshipGraphEdge[], options?: LayeredLayoutOptions): LayeredLayout;
|
|
8540
|
+
/** An edge label's box on the stage, for `separateEdgeLabels`. */
|
|
8541
|
+
interface EdgeLabelBox {
|
|
8542
|
+
id: string;
|
|
8543
|
+
/** Centre of the label. */
|
|
8544
|
+
x: number;
|
|
8545
|
+
y: number;
|
|
8546
|
+
width: number;
|
|
8547
|
+
height: number;
|
|
8548
|
+
}
|
|
8549
|
+
/** Where a label is drawn after `separateEdgeLabels`, or that it is left out. */
|
|
8550
|
+
interface PlacedEdgeLabel {
|
|
8551
|
+
x: number;
|
|
8552
|
+
y: number;
|
|
8553
|
+
hidden: boolean;
|
|
8554
|
+
}
|
|
8555
|
+
/** The box a wrapped edge label takes, from its lines (the meta type size, as `wrapEdgeLabel` assumes). */
|
|
8556
|
+
declare function edgeLabelSize(lines: readonly string[]): {
|
|
8557
|
+
width: number;
|
|
8558
|
+
height: number;
|
|
8559
|
+
};
|
|
8560
|
+
/**
|
|
8561
|
+
* Moves edge labels apart where they would be drawn over each other (HAR-1639: two labels on top
|
|
8562
|
+
* of each other in a dense layered column). Labels are taken top to bottom; one that overlaps a
|
|
8563
|
+
* label already placed moves down just below it. A label that would have to move further than
|
|
8564
|
+
* `maxShift` from its edge is left out instead (the relationship is still in the nodes'
|
|
8565
|
+
* descriptions and in the list). Deterministic: the same boxes give the same placement.
|
|
8566
|
+
*/
|
|
8567
|
+
declare function separateEdgeLabels(boxes: readonly EdgeLabelBox[], options?: {
|
|
8568
|
+
gap?: number;
|
|
8569
|
+
maxShift?: number;
|
|
8570
|
+
}): Map<string, PlacedEdgeLabel>;
|
|
6042
8571
|
type LayeredNavigationKey = 'ArrowUp' | 'ArrowDown' | 'ArrowLeft' | 'ArrowRight' | 'Home' | 'End';
|
|
6043
8572
|
/** Keyboard traversal over a layered layout: ←/→ along forward edges, ↑/↓ within a column. */
|
|
6044
8573
|
declare function layeredNeighbor(layout: LayeredLayout, currentId: string | undefined, key: LayeredNavigationKey): string | undefined;
|
|
@@ -6046,6 +8575,12 @@ declare function layeredNeighbor(layout: LayeredLayout, currentId: string | unde
|
|
|
6046
8575
|
interface RelationshipGraphLegendItem {
|
|
6047
8576
|
id: string;
|
|
6048
8577
|
label: string;
|
|
8578
|
+
/** Layered: the swatch takes the tone the matching nodes or edges take (HAR-1639). */
|
|
8579
|
+
tone?: RelationshipGraphTone;
|
|
8580
|
+
/** Layered: the swatch is a line (`edge`, default) or a node box (`node`). */
|
|
8581
|
+
shape?: 'edge' | 'node';
|
|
8582
|
+
/** Layered: a dashed line swatch for an edge `variant="dashed"`. */
|
|
8583
|
+
variant?: 'solid' | 'dashed';
|
|
6049
8584
|
}
|
|
6050
8585
|
/** Every visible or announced string. Pass translations; English defaults fill the gaps. */
|
|
6051
8586
|
interface RelationshipGraphLabels {
|
|
@@ -6078,7 +8613,17 @@ interface RelationshipGraphLabels {
|
|
|
6078
8613
|
graphSummary: (nodes: number, edges: number) => string;
|
|
6079
8614
|
relationship: string;
|
|
6080
8615
|
conflict: string;
|
|
8616
|
+
/** @deprecated No longer read: the list names a node's neighbours under `connectedHeading`. A
|
|
8617
|
+
* `connectedTo` supplied without `connectedHeading` still sets that heading, from its words. */
|
|
6081
8618
|
connectedTo: (names: string) => string;
|
|
8619
|
+
/** The relationship list: the heading of a node's neighbours, e.g. "Connected to". */
|
|
8620
|
+
connectedHeading: string;
|
|
8621
|
+
/** The relationship list: shows every neighbour of a node with more than eight. */
|
|
8622
|
+
showAllRelations: (count: number) => string;
|
|
8623
|
+
/** The relationship list: back to the first eight neighbours. */
|
|
8624
|
+
showFewerRelations: string;
|
|
8625
|
+
/** Layered: ends a hub's description, which names only its first five relationships. */
|
|
8626
|
+
moreRelations: (count: number, inList: boolean) => string;
|
|
6082
8627
|
noConnections: string;
|
|
6083
8628
|
expandNeighbors: string;
|
|
6084
8629
|
openDetails: string;
|
|
@@ -6095,6 +8640,10 @@ interface RelationshipGraphLabels {
|
|
|
6095
8640
|
retry: string;
|
|
6096
8641
|
emptyTitle: string;
|
|
6097
8642
|
emptyHint: string;
|
|
8643
|
+
/** Layered: a node's outgoing relationship in its description (HAR-1639), e.g. "depends on Payments DB". */
|
|
8644
|
+
relationTo: (relation: string, target: string) => string;
|
|
8645
|
+
/** Layered: a node's incoming relationship in its description, e.g. "depends on, from Checkout". */
|
|
8646
|
+
relationFrom: (relation: string, source: string) => string;
|
|
6098
8647
|
}
|
|
6099
8648
|
declare const DEFAULT_RELATIONSHIP_GRAPH_LABELS: RelationshipGraphLabels;
|
|
6100
8649
|
interface RelationshipGraphProps {
|
|
@@ -6161,91 +8710,21 @@ interface RelationshipGraphProps {
|
|
|
6161
8710
|
/** Layered: controlled roving focus. */
|
|
6162
8711
|
focusId?: string;
|
|
6163
8712
|
onFocusChange?: (id: string) => void;
|
|
8713
|
+
/**
|
|
8714
|
+
* Layered: brings this node into view without moving focus (HAR-1639), e.g. the row picked in
|
|
8715
|
+
* a table beside the map while the keyboard stays in the table. Smooth, or at once with reduced
|
|
8716
|
+
* motion. Changing it again scrolls again; `focusId` focuses as well.
|
|
8717
|
+
*/
|
|
8718
|
+
revealId?: string;
|
|
8719
|
+
/**
|
|
8720
|
+
* Layered: draws the root with a heavier border. Default: when `rootId` is given. A map with
|
|
8721
|
+
* several starting points (no `rootId`) has no one root, so nothing is marked (HAR-1639).
|
|
8722
|
+
*/
|
|
8723
|
+
markRoot?: boolean;
|
|
6164
8724
|
}
|
|
6165
8725
|
/** Bounded, deterministic SVG relationship view with an equivalent accessible list. */
|
|
6166
8726
|
declare function RelationshipGraph(props: RelationshipGraphProps): react.JSX.Element;
|
|
6167
8727
|
|
|
6168
|
-
interface MatchReviewField {
|
|
6169
|
-
id: string;
|
|
6170
|
-
label: string;
|
|
6171
|
-
render?: (value: JsonValue | undefined, record: Record<string, JsonValue>) => ReactNode;
|
|
6172
|
-
}
|
|
6173
|
-
interface MatchReviewCandidate {
|
|
6174
|
-
id: string;
|
|
6175
|
-
record: Record<string, JsonValue>;
|
|
6176
|
-
confidence?: number;
|
|
6177
|
-
status?: 'pending' | 'resolved';
|
|
6178
|
-
decision?: 'accepted' | 'dismissed' | 'split' | 'other';
|
|
6179
|
-
}
|
|
6180
|
-
type MatchReviewAction = 'accept' | 'dismiss' | 'split' | 'pick-other';
|
|
6181
|
-
interface MatchBulkResult {
|
|
6182
|
-
succeeded: number;
|
|
6183
|
-
failed?: number;
|
|
6184
|
-
}
|
|
6185
|
-
/**
|
|
6186
|
-
* Every word the match review renders or announces (TENSOR RX-125, UIX-12). Plural
|
|
6187
|
-
* pairs are `…One` / `…Many`; `{count}`, `{pending}`, `{total}`, `{id}` are placeholders.
|
|
6188
|
-
*/
|
|
6189
|
-
interface MatchReviewLabels {
|
|
6190
|
-
region: string;
|
|
6191
|
-
loading: string;
|
|
6192
|
-
retry: string;
|
|
6193
|
-
empty: string;
|
|
6194
|
-
emptyDetail: string;
|
|
6195
|
-
pendingOf: string;
|
|
6196
|
-
bulk: string;
|
|
6197
|
-
selectedCount: string;
|
|
6198
|
-
applying: string;
|
|
6199
|
-
acceptSelected: string;
|
|
6200
|
-
dismissSelected: string;
|
|
6201
|
-
caption: string;
|
|
6202
|
-
select: string;
|
|
6203
|
-
confidence: string;
|
|
6204
|
-
status: string;
|
|
6205
|
-
actions: string;
|
|
6206
|
-
selectCandidate: string;
|
|
6207
|
-
notScored: string;
|
|
6208
|
-
resolved: string;
|
|
6209
|
-
pending: string;
|
|
6210
|
-
decisionAccepted: string;
|
|
6211
|
-
decisionDismissed: string;
|
|
6212
|
-
decisionSplit: string;
|
|
6213
|
-
decisionOther: string;
|
|
6214
|
-
accept: string;
|
|
6215
|
-
dismiss: string;
|
|
6216
|
-
split: string;
|
|
6217
|
-
pickOther: string;
|
|
6218
|
-
acceptingOne: string;
|
|
6219
|
-
acceptingMany: string;
|
|
6220
|
-
dismissingOne: string;
|
|
6221
|
-
dismissingMany: string;
|
|
6222
|
-
acceptedOne: string;
|
|
6223
|
-
acceptedMany: string;
|
|
6224
|
-
dismissedOne: string;
|
|
6225
|
-
dismissedMany: string;
|
|
6226
|
-
failedSuffix: string;
|
|
6227
|
-
bulkAcceptFailed: string;
|
|
6228
|
-
bulkDismissFailed: string;
|
|
6229
|
-
}
|
|
6230
|
-
declare const DEFAULT_MATCH_REVIEW_LABELS: MatchReviewLabels;
|
|
6231
|
-
interface MatchReviewProps {
|
|
6232
|
-
incoming: Record<string, JsonValue>;
|
|
6233
|
-
incomingLabel?: string;
|
|
6234
|
-
fields: MatchReviewField[];
|
|
6235
|
-
candidates: MatchReviewCandidate[];
|
|
6236
|
-
selectedIds?: Set<string>;
|
|
6237
|
-
onSelectionChange?: (ids: Set<string>) => void;
|
|
6238
|
-
onDecision: (candidateId: string, action: MatchReviewAction) => void;
|
|
6239
|
-
onBulkDecision?: (candidateIds: string[], action: Extract<MatchReviewAction, 'accept' | 'dismiss'>) => void | MatchBulkResult | Promise<void | MatchBulkResult>;
|
|
6240
|
-
loading?: boolean;
|
|
6241
|
-
error?: string;
|
|
6242
|
-
onRetry?: () => void;
|
|
6243
|
-
className?: string;
|
|
6244
|
-
labels?: Partial<MatchReviewLabels>;
|
|
6245
|
-
}
|
|
6246
|
-
/** Generic descriptor-driven incoming-record to candidate-match decision surface. */
|
|
6247
|
-
declare function MatchReview({ incoming, incomingLabel, fields, candidates, selectedIds, onSelectionChange, onDecision, onBulkDecision, loading, error, onRetry, className, labels: labelOverrides, }: MatchReviewProps): react.JSX.Element;
|
|
6248
|
-
|
|
6249
8728
|
interface MetricInputProps {
|
|
6250
8729
|
value: number | null;
|
|
6251
8730
|
onValueChange: (value: number | null) => void;
|
|
@@ -6363,84 +8842,6 @@ declare function BrandProfileEditor({ value, onChange, profiles, onSelectProfile
|
|
|
6363
8842
|
/** Canonical Phase 46.9 export; equivalent to BrandProfileEditor. */
|
|
6364
8843
|
declare const BrandProfiles: typeof BrandProfileEditor;
|
|
6365
8844
|
|
|
6366
|
-
type DiffKind = 'added' | 'removed' | 'changed' | 'conflicted';
|
|
6367
|
-
type DiffResolution = 'accept' | 'skip' | 'pending';
|
|
6368
|
-
interface DiffEntry {
|
|
6369
|
-
path: string;
|
|
6370
|
-
kind: DiffKind;
|
|
6371
|
-
base?: JsonValue;
|
|
6372
|
-
current?: JsonValue;
|
|
6373
|
-
incoming?: JsonValue;
|
|
6374
|
-
}
|
|
6375
|
-
interface DiffSummary {
|
|
6376
|
-
added: number;
|
|
6377
|
-
removed: number;
|
|
6378
|
-
changed: number;
|
|
6379
|
-
conflicted: number;
|
|
6380
|
-
resolved: number;
|
|
6381
|
-
pending: number;
|
|
6382
|
-
}
|
|
6383
|
-
declare function buildThreeWayDiff(base: JsonValue | undefined, current: JsonValue | undefined, incoming: JsonValue | undefined, path?: string): DiffEntry[];
|
|
6384
|
-
declare function summarizeDiff(entries: DiffEntry[], resolutions?: Record<string, DiffResolution>): DiffSummary;
|
|
6385
|
-
|
|
6386
|
-
/**
|
|
6387
|
-
* Every word the diff viewer renders (TENSOR RX-125, UIX-12). `base` / `current` /
|
|
6388
|
-
* `incoming` keep their meaning from before; `{path}`, `{version}`, `{resolved}` and
|
|
6389
|
-
* `{total}` are placeholders.
|
|
6390
|
-
*
|
|
6391
|
-
* `acceptIncomingFor` / `keepCurrentFor` / `markPendingFor` are the accessible names of
|
|
6392
|
-
* the three action buttons, so a screen reader hears which entry each one resolves. Keep
|
|
6393
|
-
* the visible word inside the translated name (WCAG 2.5.3 Label in Name): speech-input
|
|
6394
|
-
* users say what they see.
|
|
6395
|
-
*/
|
|
6396
|
-
interface DiffViewerLabels {
|
|
6397
|
-
base: string;
|
|
6398
|
-
current: string;
|
|
6399
|
-
incoming: string;
|
|
6400
|
-
region: string;
|
|
6401
|
-
summary: string;
|
|
6402
|
-
noDifferences: string;
|
|
6403
|
-
noDifferencesDetail: string;
|
|
6404
|
-
conflicted: string;
|
|
6405
|
-
changed: string;
|
|
6406
|
-
added: string;
|
|
6407
|
-
removed: string;
|
|
6408
|
-
resolved: string;
|
|
6409
|
-
pending: string;
|
|
6410
|
-
valueFor: string;
|
|
6411
|
-
resolve: string;
|
|
6412
|
-
acceptIncoming: string;
|
|
6413
|
-
keepCurrent: string;
|
|
6414
|
-
markPending: string;
|
|
6415
|
-
acceptIncomingFor: string;
|
|
6416
|
-
keepCurrentFor: string;
|
|
6417
|
-
markPendingFor: string;
|
|
6418
|
-
resolutionAccept: string;
|
|
6419
|
-
resolutionSkip: string;
|
|
6420
|
-
resolutionPending: string;
|
|
6421
|
-
notPresent: string;
|
|
6422
|
-
progress: string;
|
|
6423
|
-
}
|
|
6424
|
-
declare const DEFAULT_DIFF_VIEWER_LABELS: DiffViewerLabels;
|
|
6425
|
-
interface DiffViewerProps {
|
|
6426
|
-
base?: JsonValue;
|
|
6427
|
-
current?: JsonValue;
|
|
6428
|
-
incoming?: JsonValue;
|
|
6429
|
-
entries?: DiffEntry[];
|
|
6430
|
-
resolutions?: Record<string, DiffResolution>;
|
|
6431
|
-
onResolutionChange?: (path: string, resolution: DiffResolution) => void;
|
|
6432
|
-
labels?: Partial<DiffViewerLabels>;
|
|
6433
|
-
/**
|
|
6434
|
-
* Height of the resolution buttons and the entry disclosure rows. `sm` (the default) is
|
|
6435
|
-
* the compact 28px kit size; `md` follows `--uix-control-h`, so a theme that sets its
|
|
6436
|
-
* own control height (for example 60px touch targets) gets it here too; `lg` is 44px.
|
|
6437
|
-
*/
|
|
6438
|
-
controlSize?: 'sm' | 'md' | 'lg';
|
|
6439
|
-
className?: string;
|
|
6440
|
-
}
|
|
6441
|
-
/** Three-way configuration diff with per-entry keyboard-operable resolution. */
|
|
6442
|
-
declare function DiffViewer({ base, current, incoming, entries: providedEntries, resolutions: controlledResolutions, onResolutionChange, labels: labelOverrides, controlSize, className, }: DiffViewerProps): react.JSX.Element;
|
|
6443
|
-
|
|
6444
8845
|
/**
|
|
6445
8846
|
* Every word the colour picker renders (TENSOR RX-125, UIX-12). `{label}`, `{color}`,
|
|
6446
8847
|
* `{ratio}` and `{minimum}` are placeholders; `sample` is the contrast preview text.
|
|
@@ -6496,4 +8897,4 @@ declare function hsvToHex(value: HsvColor): string;
|
|
|
6496
8897
|
declare function contrastRatio(background: string, foreground: string): number | undefined;
|
|
6497
8898
|
declare function meetsContrast(background: string, foreground: string, minimum?: number): boolean;
|
|
6498
8899
|
|
|
6499
|
-
export { type AccessStateProps, Alert, type AlertProps, type AlertTone, AppShell, type AppShellProps, type AppliedBrandProfileSnapshot, type AsyncOperationState, AsyncOperationStatus, type AsyncOperationStatusProps, Attachment, type AttachmentLabels, AttachmentList, type AttachmentListProps, type AttachmentProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarPresence, type AvatarProps, type BoundedRelationshipGraph, type BrandProfile, BrandProfileEditor, type BrandProfileEditorLabels, type BrandProfileEditorProps, type BrandProfileLogo, type BrandProfileTypography, BrandProfiles, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, BuilderCanvas, type BuilderCanvasItem, type BuilderCanvasLabels, type BuilderCanvasProps, type BuilderPaletteItem, BulkBar, type BulkBarProps, Bullet, type BulletProps, Button, ButtonGroup, type ButtonGroupProps, ButtonLink, type ButtonLinkProps, type ButtonProps, type ButtonSize, type ButtonVariant, type CalendarDay, type CalendarWeekday, Card, CardLink, type CardLinkProps, type CardProps, CellStrong, CellSub, Checkbox, type CheckboxProps, Chip, ChipGroup, type ChipGroupProps, type ChipProps, CollapsibleSection, type CollapsibleSectionProps, ColorPicker, type ColorPickerLabels, type ColorPickerProps, type ColumnFilter, Combobox, type ComboboxOption, type ComboboxProps, CommandGroup, type CommandGroupProps, CommandItem, type CommandItemProps, CommandPalette, type CommandPaletteProps, Comment, type CommentProps, Comments, type CommentsProps, Composer, ComposerBar, type ComposerBarProps, type ComposerProps, ConfirmDialog, type ConfirmDialogProps, ContentList, ContentListItem, type ContentListItemProps, type ContentListProps, CopyButton, type CopyButtonProps, DASHBOARD_CANVAS_COLUMNS, DAY, DEFAULT_ATTACHMENT_LABELS, DEFAULT_BRAND_PROFILE_EDITOR_LABELS, DEFAULT_BUILDER_CANVAS_LABELS, DEFAULT_COLOR_PICKER_LABELS, DEFAULT_DASHBOARD_CANVAS_LABELS, DEFAULT_DATE_PICKER_LABELS, DEFAULT_DATE_RANGE_PICKER_LABELS, DEFAULT_DATE_TIME_PICKER_LABELS, DEFAULT_DIFF_VIEWER_LABELS, DEFAULT_ENTITY_PICKER_LABELS, DEFAULT_FILE_UPLOAD_LABELS, DEFAULT_FILTER_EDITOR_LABELS, DEFAULT_FILTER_SUMMARY_LABELS, DEFAULT_INLINE_EDIT_LABELS, DEFAULT_INSIGHT_CARD_LABELS, DEFAULT_LIGHTBOX_LABELS, DEFAULT_MATCH_REVIEW_LABELS, DEFAULT_ORG_CHART_LABELS, DEFAULT_PAGINATION_LABELS, DEFAULT_PRESENCE_LABELS, DEFAULT_RELATIONSHIP_GRAPH_LABELS, DEFAULT_RULE_BUILDER_LABELS, DEFAULT_RULE_SUMMARY_WORDS, DEFAULT_RULE_VALIDATION_MESSAGES, DEFAULT_SAVE_STATUS_LABELS, DEFAULT_SCHEDULING_CALENDAR_LABELS, DEFAULT_SCHEDULING_TIMELINE_LABELS, DEFAULT_STEP_STATE_LABELS, DEFAULT_TEXT_DIFF_LABELS, DEFAULT_TREE_LABELS, DashboardCanvas, type DashboardCanvasChange, type DashboardCanvasDirection, type DashboardCanvasGap, type DashboardCanvasItem, type DashboardCanvasLabels, type DashboardCanvasPlacement, type DashboardCanvasProps, type DashboardCanvasResize, DashboardGrid, type DashboardGridBreakpoint, type DashboardGridColumnCount, type DashboardGridColumns, type DashboardGridGap, DashboardGridItem, type DashboardGridItemProps, type DashboardGridProps, type DashboardGridSpan, type DateInputProblem, type DatePart, DatePicker, type DatePickerLabels, type DatePickerProps, DateRangePicker, type DateRangePickerLabels, type DateRangePickerProps, type DateRangeValue, DateTimePicker, type DateTimePickerLabels, type DateTimePickerProps, type DaySpanLayout, DescriptionItem, type DescriptionItemProps, DescriptionList, type DescriptionListItem, type DescriptionListProps, DetailLayout, type DetailLayoutProps, DetailPage, type DetailPageLinkProps, type DetailPageMetric, type DetailPageProps, type DetailPageTab, DialogClose, type DialogCloseEvent, type DialogCloseProps, type DiffEntry, type DiffKind, type DiffResolution, type DiffSummary, DiffViewer, type DiffViewerLabels, type DiffViewerProps, type DiscardPromptLabels, Drawer, type DrawerProps, EmptyState, type EmptyStateProps, EntityPicker, type EntityPickerLabels, type EntityPickerProps, type EntityPickerSearchResult, ErrorState, type ErrorStateProps, EventRow, type EventRowProps, ExpandToggle, type ExpandToggleProps, FeaturedRundown, FeaturedRundownItem, type FeaturedRundownItemProps, type FeaturedRundownProps, FeaturedStage, type FeaturedStageProps, Field, type FieldProps, type FileRejection, type FileRejectionReason, type FileSizeFormatter, type FileSizeOptions, FileUpload, type FileUploadItem, type FileUploadLabels, type FileUploadProps, type FileUploadStatus, type FilterChoice, FilterEditor, type FilterEditorLabels, type FilterEditorProps, type FilterField, type FilterKind, type FilterOp, type FilterOption, FilterPopover, type FilterPopoverProps, type FilterPreset, type FilterSummaryLabels, type FilterValue, type FilterValueKind, FilteredEmptyState, type FlatNode, Flow, FlowNode, type FlowNodeProps, type FlowNodeState, type FlowProps, type FlowVariant, type FoldedText, ForbiddenState, HOUR, Heartbeat, type HeartbeatProps, type HeartbeatState, Highlighted, type HighlightedProps, type HsvColor, Inbox, InboxDetail, type InboxDetailProps, InboxItem, type InboxItemProps, InboxList, type InboxListProps, type InboxProps, InfoTip, type InfoTipProps, InlineEdit, type InlineEditEditorProps, type InlineEditLabels, type InlineEditProps, Input, InputGroup, type InputGroupProps, type InputProps, InsightCard, type InsightCardLabels, type InsightCardProps, type InsightComparison, type InsightCoverage, type InsightKpi, type InsightStatus, type InsightStatusTone, type InsightTarget, type JsonPrimitive, type JsonValue, Kanban, KanbanCard, type KanbanCardProps, KanbanColumn, type KanbanColumnProps, type KanbanMoveDirection, type KanbanProps, Kbd, KbdCombo, type KbdComboProps, type KbdPlatform, type KbdProps, type KeyShortcut, Label, type LabelProps, type LaneCluster, type LaneInterval, type LanePlacement, type LayeredColumn, type LayeredEdgeClassification, type LayeredEdgeKind, type LayeredItem, type LayeredLayout, type LayeredLayoutOptions, type LayeredNavigationKey, type LayoutLaneOptions, type LayoutMonthSpansOptions, LicensePositionBar, type LicensePositionBarProps, Lightbox, type LightboxItem, type LightboxLabels, type LightboxProps, List, ListItem, type ListItemProps, type ListProps, LiveIndicator, type LiveIndicatorProps, LoadingState, type LoadingStateProps, Mark, type MarkProps, type MatchBulkResult, MatchReview, type MatchReviewAction, type MatchReviewCandidate, type MatchReviewField, type MatchReviewLabels, type MatchReviewProps, Menu, MenuGroup, type MenuGroupProps, MenuItem, type MenuItemAttributes, MenuItemCheckbox, type MenuItemCheckboxProps, type MenuItemProps, MenuItemRadio, type MenuItemRadioProps, type MenuProps, MenuRadioGroup, type MenuRadioGroupProps, MenuSeparator, Meter, type MeterProps, type MeterTone, MetricInput, type MetricInputProps, Modal, type ModalProps, type MonthSpanGroup, type MonthSpanInput, type MonthSpanLayout, type MoveProposal, NUMBER_FILTER_OPERATORS, type NavFavouriteItem, NavFavourites, type NavFavouritesLabels, type NavFavouritesProps, NavGroup, type NavGroupProps, NavItem, type NavItemProps, NewsLead, type NewsLeadProps, NotFoundState, Note, type NoteProps, type NoteTone, NoticeQueue, type NoticeQueueProps, type NumberFilterOperator, OrgChart, type OrgChartLabels, type OrgChartNode, type OrgChartProps, type PackLanesOptions, type PackedLanes, PageHeader, type PageHeaderProps, PageIntro, type PageIntroProps, Pagination, type PaginationLabels, type PaginationProps, Peek, type PeekProps, type PillSize, type PillTone, type PillTreatment, Pipeline, type PipelineProps, PipelineStage, type PipelineStageProps, type PipelineStageState, type PlacedDaySpan, type PlacedMonthSpan, type PlacedSpan, Placement, Popconfirm, type PopconfirmProps, Popover, type PopoverProps, type PositionedRelationshipNode, PresenceDot, type PresenceDotProps, type Primitive, Progress, type ProgressProps, PromptDialog, type PromptDialogProps, Prose, type ProseProps, Radio, RadioCard, type RadioCardProps, RadioGroup, type RadioGroupProps, type RadioProps, type RelatedLinkItem, RelatedLinks, type RelatedLinksProps, RelationshipGraph, type RelationshipGraphArrow, type RelationshipGraphCluster, type RelationshipGraphEdge, type RelationshipGraphLabels, type RelationshipGraphLegendItem, type RelationshipGraphNode, type RelationshipGraphProps, RelativeTime, type RelativeTimeFormatContext, type RelativeTimeProps, type RelativeTimeUnit, type RelativeTimeValue, ResourceGrid, type ResourceGridProps, type RgbColor, type RoutedEdge, type Row, RowAction, type RowActionProps, RowActions, type RowActionsProps, type RuleAction, type RuleActionDefinition, RuleBuilder, type RuleBuilderLabels, type RuleBuilderProps, type RuleCheck, type RuleCondition, type RuleDefinition, type RuleFieldDefinition, type RuleGroup, type RuleOperatorDefinition, type RuleSummaryWords, type RuleValidationIssue, type RuleValidationOptions, type RuleValueEditorProps, SaveStatus, type SaveStatusLabels, type SaveStatusProps, type SaveStatusState, type SavedViewItem, SavedViewMenu, type SavedViewMenuProps, type SavedViewSection, type SchedulingAgendaGroup, type SchedulingBand, SchedulingCalendar, type SchedulingCalendarDay, type SchedulingCalendarEntry, type SchedulingCalendarLabels, type SchedulingCalendarOverlay, type SchedulingCalendarProps, type SchedulingCalendarView, type SchedulingDatePart, type SchedulingEntryState, type SchedulingLegendItem, type SchedulingMarker, type SchedulingMarkerEmphasis, type SchedulingOverlayKind, type SchedulingOverlayPattern, type SchedulingStatus, SchedulingTimeline, type SchedulingTimelineGroup, type SchedulingTimelineItem, type SchedulingTimelineLabels, type SchedulingTimelineLane, type SchedulingTimelineMarker, type SchedulingTimelineOverlay, type SchedulingTimelineOverlayKind, type SchedulingTimelineProps, SearchBar, type SearchBarLabels, type SearchBarProps, type SearchSegment, SearchSuggest, type SearchSuggestAction, type SearchSuggestOption, type SearchSuggestProps, SectionHead, type SectionHeadProps, type Segment, Segmented, SegmentedOption, type SegmentedOptionProps, type SegmentedProps, Select, type SelectAllState, type SelectGroup, type SelectLabels, type SelectOption, type SelectProps, type ShellNav, Sidebar, type SidebarProps, SidebarSection, type SidebarSectionProps, Skeleton, type SkeletonProps, type SortDir, type SortDirection, type SortKey, Spinner, type SpinnerProps, StarButton, type StarButtonProps, Stat, StatLine, type StatLineItem, type StatLineProps, type StatProps, type StatTrend, type StateVariant, StatusPill, type StatusPillProps, StatusRow, type StatusRowProps, Step, type StepProps, type StepState, type StepStateLabels, Steps, type StepsProps, SubNavItem, type SubNavItemProps, type SummarizeFilterOptions, Switch, type SwitchProps, TEXT_FILTER_OPERATORS, TOAST_LEAVE_MS, TOP_LANE_CROSS_MIDNIGHT_MINUTES, Tab, TabPanel, type TabPanelProps, type TabProps, Table, type TableDensity, type TableProps, TableWrap, type TableWrapProps, Tabs, type TabsProps, Td, type TdProps, TextDiff, type TextDiffGranularity, type TextDiffLabels, type TextDiffLine, type TextDiffOp, type TextDiffOptions, type TextDiffProps, type TextDiffResult, type TextDiffRow, type TextDiffSegment, type TextFilterOperator, Textarea, type TextareaProps, Th, type ThProps, type TimeGridDayLayout, type TimeGridEntryContext, type TimeGridEntryInput, type TimeGridPart, type TimeGridSegment, Timeline, TimelineItem, type TimelineItemProps, type TimelineProps, type TimelineRange, type TimelineScale, type TimelineSpan, type TimelineSubTick, type TimelineTick, Toast, type ToastAction, type ToastApi, type ToastDismissReason, type ToastKind, type ToastOptions, type ToastPromiseMessages, type ToastProps, type ToastRecord, type ToastStore, type ToastTone, Toaster, type ToasterProps, ToggleRow, type ToggleRowProps, Tooltip, type TooltipProps, Tr, type TrProps, Tree, type TreeLabels, type TreeLike, type TreeNavAction, type TreeNodeData, type TreeNodeProps, type TreeProps, type UixLabels, UixLabelsProvider, type UixLabelsProviderProps, type UixLinkProps, type UixRenderLink, type UndoableToastOptions, type UseAnchoredPositionOptions, type UseTableOptions, type UseTableResult, type UseVirtualRowsOptions, type UseVirtualRowsResult, UserChip, type UserChipProps, ViewMenu, type ViewMenuColumn, type ViewMenuColumnLabels, type ViewMenuProps, type ViewState, type VirtualWindow, type ZonedDateSpan, type ZonedDayBounds, type ZonedDayShift, type ZonedDaySpan, type ZonedHourSlot, addCalendarDays, addCalendarMonths, addZonedDays, appendRuleNode, applyBrandProfile, applyFilters, ariaKeyShortcuts, boundRelationshipGraph, buildMonthGrid, buildThreeWayDiff, cachedDateTimeFormat, canvasItemLimits, canvasItemsOverlap, canvasMoveTarget, canvasReadingOrder, canvasResizeTarget, canvasRowCount, clampCanvasItem, clampMetricValue, clampWidth, classifyLayeredEdges, clusterIdFor, compactCanvas, contrastRatio, createToastApi, createToastStore, cx, dashboardGridClassName, dashboardGridItemClassName, dateOrder, datePattern, defaultTimelineStep, diffText, diffTokens, emptyFilterValue, enumerateDateKeys, enumerateDateSpan, fileKind, fileMatchesAccept, filterComboboxOptions, findRuleNodeDepth, flattenTree, foldForSearch, formatDateKey, formatFileSize, hexToRgb, highlightSegments, hsvToHex, hsvToRgb, isDateInRange, isDateUnavailable, isFilterEmpty, isRuleGroup, isValidDateKey, itemDaySpan, joinDateTime, layeredNeighbor, layoutDaySpans, layoutLane, layoutLayeredGraph, layoutMonthSpans, layoutRelationshipGraph, layoutTimeGridDay, mapRuleGroup, matchFilter, matchFilterPreset, meetsContrast, mergePinned, moveCanvasItem, moveRuleNode, multiSort, nextSortDir, normalizeCanvas, normalizeHex, orgChartInitials, orgChartZoomStep, packLanes, parseDateInput, parseDateValue, parseMetricValue, parseView, partitionFiles, pixelsToMs, placeCanvasItem, placeSpan, placesInTopLane, prefersReducedMotion, proposeMove, rankOverflow, relationshipNeighbors, relativeTimeValue, removeRuleNode, renderPlainLink, reorder, resizeCanvasItem, restoreBrandProfile, rgbToHex, rgbToHsv, ruleDepth, schedulingGridDays, searchRows, searchSegments, selectAllState, selectRangeDate, serializeView, setRuleCombinator, shiftSpan, shouldVirtualize, snapToStep, splitDateTime, startOfMonth, stepMetricValue, summarizeDiff, summarizeFilter, summarizeRule, textDiffRows, timeZoneName, timelineRepeatedHourOffset, timelineStepDelta, timelineSubTicks, timelineTicks, toDateKey, toast, toggleId, togglePage, toggleSort, tokenizeText, traverseRelationshipNode, treeNav, useAnchoredPosition, useDialog, useReducedMotion, useTable, useUixLabels, useVirtualRows, validateRuleDefinition, virtualWindow, wrapEdgeLabel, zonedDateKey, zonedDateSpan, zonedDayBounds, zonedDaySpan, zonedHourSlots, zonedTimeOfDay };
|
|
8900
|
+
export { type AccessStateProps, AccountMenu, type AccountMenuLabels, type AccountMenuProps, type AccountMenuUser, Alert, type AlertProps, type AlertTone, AppShell, type AppShellProps, type AppliedBrandProfileSnapshot, type AsyncOperationState, AsyncOperationStatus, type AsyncOperationStatusProps, Attachment, type AttachmentLabels, AttachmentList, type AttachmentListProps, type AttachmentProps, AuditLog, type AuditLogAction, type AuditLogEvent, type AuditLogFilters, type AuditLogLabels, type AuditLogProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarPresence, type AvatarProps, type BoundedRelationshipGraph, type BrandProfile, BrandProfileEditor, type BrandProfileEditorLabels, type BrandProfileEditorProps, type BrandProfileLogo, type BrandProfileTypography, BrandProfiles, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, BuilderCanvas, type BuilderCanvasItem, type BuilderCanvasLabels, type BuilderCanvasProps, type BuilderPaletteItem, BulkBar, type BulkBarProps, Bullet, type BulletProps, BusyRegion, type BusyRegionProps, Button, ButtonGroup, type ButtonGroupProps, ButtonLink, type ButtonLinkProps, type ButtonProps, type ButtonResult, type ButtonResultLabels, type ButtonSize, type ButtonVariant, type CalendarDay, type CalendarWeekday, Card, CardLink, type CardLinkProps, type CardProps, CellStrong, CellSub, type CellSubProps, ChangeHighlight, type ChangeHighlightOptions, type ChangeHighlightProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, Chip, ChipGroup, type ChipGroupProps, type ChipProps, CodeDisplay, type CodeDisplayLabels, type CodeDisplayProps, CollapsibleSection, type CollapsibleSectionProps, ColorPicker, type ColorPickerLabels, type ColorPickerProps, type ColumnFilter, Combobox, type ComboboxGroup, type ComboboxOption, type ComboboxProps, CommandGroup, type CommandGroupProps, CommandItem, type CommandItemProps, CommandPalette, type CommandPaletteGroup, type CommandPaletteItem, type CommandPaletteProps, Comment, type CommentProps, Comments, type CommentsProps, Composer, ComposerBar, type ComposerBarProps, type ComposerProps, type ConfirmButtonProps, ConfirmDialog, type ConfirmDialogProps, ContactCard, type ContactCardLabels, type ContactCardProps, type ContactCardState, ContentList, ContentListItem, type ContentListItemProps, type ContentListProps, type ContrastPreference, CopyButton, type CopyButtonProps, Count, type CountProps, DASHBOARD_CANVAS_COLUMNS, DATE_FILTER_OPERATORS, DAY, DEFAULT_ACCOUNT_MENU_LABELS, DEFAULT_ATTACHMENT_LABELS, DEFAULT_AUDIT_LOG_LABELS, DEFAULT_BRAND_PROFILE_EDITOR_LABELS, DEFAULT_BUILDER_CANVAS_LABELS, DEFAULT_BUTTON_RESULT_LABELS, DEFAULT_CODE_DISPLAY_LABELS, DEFAULT_COLOR_PICKER_LABELS, DEFAULT_CONTACT_CARD_LABELS, DEFAULT_DASHBOARD_CANVAS_LABELS, DEFAULT_DATA_WORKSPACE_LABELS, DEFAULT_DATE_PICKER_LABELS, DEFAULT_DATE_RANGE_PICKER_LABELS, DEFAULT_DATE_TIME_PICKER_LABELS, DEFAULT_DIFF_VIEWER_LABELS, DEFAULT_DISPLAY_PREFERENCES, DEFAULT_DISPLAY_PREFERENCES_LABELS, DEFAULT_ENTITY_PICKER_LABELS, DEFAULT_FILE_UPLOAD_LABELS, DEFAULT_FILTER_EDITOR_LABELS, DEFAULT_FILTER_SUMMARY_LABELS, DEFAULT_INLINE_EDIT_LABELS, DEFAULT_INSIGHT_CARD_LABELS, DEFAULT_LIGHTBOX_LABELS, DEFAULT_MATCH_REVIEW_LABELS, DEFAULT_ORG_CHART_LABELS, DEFAULT_PAGINATION_LABELS, DEFAULT_PASSWORD_INPUT_LABELS, DEFAULT_PRESENCE_LABELS, DEFAULT_PRINT_LAYOUT_LABELS, DEFAULT_QR_CODE_LABELS, DEFAULT_QR_SCANNER_LABELS, DEFAULT_RELATIONSHIP_GRAPH_LABELS, DEFAULT_RULE_BUILDER_LABELS, DEFAULT_RULE_SUMMARY_WORDS, DEFAULT_RULE_VALIDATION_MESSAGES, DEFAULT_SAVE_STATUS_LABELS, DEFAULT_SCHEDULING_CALENDAR_LABELS, DEFAULT_SCHEDULING_TIMELINE_LABELS, DEFAULT_SORTABLE_LIST_LABELS, DEFAULT_STEP_STATE_LABELS, DEFAULT_TAG_INPUT_LABELS, DEFAULT_TEXT_DIFF_LABELS, DEFAULT_TIME_PICKER_LABELS, DEFAULT_TREE_LABELS, DISPLAY_PREFERENCES_STORAGE_KEY, DISPLAY_PREFERENCE_OPTIONS, DashboardCanvas, type DashboardCanvasChange, type DashboardCanvasDirection, type DashboardCanvasGap, type DashboardCanvasItem, type DashboardCanvasLabels, type DashboardCanvasPlacement, type DashboardCanvasProps, type DashboardCanvasResize, DashboardGrid, type DashboardGridBreakpoint, type DashboardGridColumnCount, type DashboardGridColumns, type DashboardGridGap, DashboardGridItem, type DashboardGridItemProps, type DashboardGridProps, type DashboardGridSpan, DataWorkspace, type DataWorkspaceColumn, type DataWorkspaceIdColumn, type DataWorkspaceLabels, type DataWorkspacePagination, type DataWorkspaceProps, type DataWorkspaceSort, type DateFilterOperator, type DateInputProblem, type DatePart, DatePicker, type DatePickerLabels, type DatePickerProps, DateRangePicker, type DateRangePickerLabels, type DateRangePickerProps, type DateRangeValue, DateTimePicker, type DateTimePickerLabels, type DateTimePickerProps, type DaySpanLayout, type DelayedPendingOptions, type DensityPreference, DescriptionItem, type DescriptionItemProps, DescriptionList, type DescriptionListItem, type DescriptionListProps, DetailLayout, type DetailLayoutProps, DetailPage, type DetailPageLinkProps, type DetailPageMetric, type DetailPageProps, type DetailPageTab, DialogClose, type DialogCloseEvent, type DialogCloseProps, type DiffEntry, type DiffKind, type DiffResolution, type DiffSide, type DiffSummary, DiffViewer, type DiffViewerLabels, type DiffViewerProps, type DiscardPromptLabels, type DisplayAttributes, type DisplayPreferenceValues, DisplayPreferences, type DisplayPreferencesLabels, type DisplayPreferencesProps, Drawer, type DrawerProps, type EdgeLabelBox, EmptyState, type EmptyStateProps, EntityPicker, type EntityPickerLabels, type EntityPickerProps, type EntityPickerSearchError, type EntityPickerSearchResult, ErrorState, type ErrorStateProps, EventRow, type EventRowProps, ExpandToggle, type ExpandToggleProps, FeaturedRundown, FeaturedRundownItem, type FeaturedRundownItemProps, type FeaturedRundownProps, FeaturedStage, type FeaturedStageProps, Field, type FieldProps, type FileRejection, type FileRejectionReason, type FileSizeFormatter, type FileSizeOptions, FileUpload, type FileUploadItem, type FileUploadLabels, type FileUploadProps, type FileUploadStatus, type FilterChoice, FilterEditor, type FilterEditorLabels, type FilterEditorProps, type FilterField, type FilterKind, type FilterOp, type FilterOption, FilterPopover, type FilterPopoverProps, type FilterPreset, type FilterSummaryLabels, type FilterValue, type FilterValueKind, FilteredEmptyState, type FlatNode, Flow, FlowNode, type FlowNodeProps, type FlowNodeState, type FlowProps, type FlowVariant, type FoldedText, ForbiddenState, HOUR, Heartbeat, type HeartbeatProps, type HeartbeatState, Highlighted, type HighlightedProps, type HsvColor, Inbox, InboxDetail, type InboxDetailProps, InboxItem, type InboxItemProps, InboxList, type InboxListProps, type InboxProps, InfoTip, type InfoTipProps, InlineEdit, type InlineEditEditorProps, type InlineEditErrorContext, type InlineEditLabels, type InlineEditProps, type InlineEditState, Input, InputGroup, type InputGroupProps, type InputProps, Inset, type InsetProps, InsightCard, type InsightCardLabels, type InsightCardProps, type InsightComparison, type InsightCoverage, type InsightKpi, type InsightStatus, type InsightStatusTone, type InsightTarget, type JsonPrimitive, type JsonValue, Kanban, KanbanCard, type KanbanCardProps, KanbanColumn, type KanbanColumnProps, type KanbanMoveDirection, type KanbanProps, Kbd, KbdCombo, type KbdComboProps, type KbdPlatform, type KbdProps, type KeyShortcut, Label, type LabelProps, type LaneCluster, type LaneInterval, type LanePlacement, type LayeredColumn, type LayeredEdgeClassification, type LayeredEdgeKind, type LayeredItem, type LayeredLayout, type LayeredLayoutOptions, type LayeredNavigationKey, type LayoutLaneOptions, type LayoutMonthSpansOptions, LicensePositionBar, type LicensePositionBarProps, Lightbox, type LightboxItem, type LightboxLabels, type LightboxOverlayContext, type LightboxProps, List, ListItem, type ListItemProps, type ListProps, LiveIndicator, type LiveIndicatorProps, LoadingState, type LoadingStateProps, LocaleSwitcher, type LocaleSwitcherLocale, type LocaleSwitcherProps, Mark, type MarkProps, type MatchBulkResult, MatchReview, type MatchReviewAction, type MatchReviewCandidate, type MatchReviewField, type MatchReviewLabels, type MatchReviewProps, Menu, MenuGroup, type MenuGroupProps, MenuItem, type MenuItemAttributes, MenuItemCheckbox, type MenuItemCheckboxProps, type MenuItemProps, MenuItemRadio, type MenuItemRadioProps, type MenuProps, MenuRadioGroup, type MenuRadioGroupProps, MenuSeparator, Meter, type MeterProps, type MeterTone, MetricInput, type MetricInputProps, Modal, type ModalProps, type MonthSpanGroup, type MonthSpanInput, type MonthSpanLayout, type MotionPreference, type MoveProposal, NUMBER_FILTER_OPERATORS, type NavFavouriteItem, NavFavourites, type NavFavouritesLabels, type NavFavouritesProps, NavGroup, type NavGroupProps, NavItem, type NavItemProps, NewsLead, type NewsLeadProps, NotFoundState, Note, type NoteProps, type NoteTone, NoticeQueue, type NoticeQueueProps, type NumberFilterOperator, type OptimisticRollback, OrgChart, type OrgChartLabels, type OrgChartNode, type OrgChartProps, OtpInput, type OtpInputProps, PENDING_DELAY_MS, PENDING_MIN_VISIBLE_MS, type PackLanesOptions, type PackedLanes, PageHeader, type PageHeaderProps, PageIntro, type PageIntroProps, Pagination, type PaginationLabels, type PaginationProps, PasswordInput, type PasswordInputLabels, type PasswordInputProps, Peek, type PeekProps, type PillSize, type PillTone, type PillTreatment, Pipeline, type PipelineProps, PipelineStage, type PipelineStageProps, type PipelineStageState, type PlacedDaySpan, type PlacedEdgeLabel, type PlacedMonthSpan, type PlacedSpan, Placement, Popconfirm, type PopconfirmProps, Popover, type PopoverProps, type PositionedRelationshipNode, PresenceDot, type PresenceDotProps, type Primitive, PrintLayout, type PrintLayoutLabels, type PrintLayoutProps, PrintPageBreak, type PrintPageSize, PrintSignature, type PrintSignatureProps, Progress, type ProgressProps, PromptDialog, type PromptDialogProps, Prose, type ProseProps, QrCapacityError, QrCode, type QrCodeLabels, type QrCodeProps, type QrEncodeOptions, type QrErrorCorrection, type QrMatrix, QrScanner, type QrScannerDecoder, type QrScannerFrame, type QrScannerLabels, type QrScannerProps, type QrScannerStatus, RESULT_HOLD_MS, Radio, RadioCard, type RadioCardProps, RadioGroup, type RadioGroupProps, type RadioProps, type RelatedLinkItem, RelatedLinks, type RelatedLinksProps, RelationshipGraph, type RelationshipGraphArrow, type RelationshipGraphCluster, type RelationshipGraphEdge, type RelationshipGraphLabels, type RelationshipGraphLegendItem, type RelationshipGraphNode, type RelationshipGraphProps, type RelationshipGraphTone, RelativeTime, type RelativeTimeFormatContext, type RelativeTimeProps, type RelativeTimeUnit, type RelativeTimeValue, type ResourceDayItem, type ResourceDaySlot, type ResourceDaySlotOptions, ResourceGrid, type ResourceGridProps, type RgbColor, type RoutedEdge, type Row, RowAction, type RowActionProps, RowActions, type RowActionsProps, type RuleAction, type RuleActionDefinition, RuleBuilder, type RuleBuilderLabels, type RuleBuilderProps, type RuleCheck, type RuleCondition, type RuleDefinition, type RuleFieldDefinition, type RuleGroup, type RuleOperatorDefinition, type RuleSummaryWords, type RuleValidationIssue, type RuleValidationOptions, type RuleValueEditorProps, SaveStatus, type SaveStatusLabels, type SaveStatusProps, type SaveStatusState, type SavedViewItem, SavedViewMenu, type SavedViewMenuProps, type SavedViewSection, type SchedulingAgendaGroup, type SchedulingAvailabilityKind, type SchedulingBand, SchedulingCalendar, type SchedulingCalendarDay, type SchedulingCalendarEntry, type SchedulingCalendarLabels, type SchedulingCalendarOverlay, type SchedulingCalendarProps, type SchedulingCalendarView, type SchedulingDatePart, type SchedulingEntryState, type SchedulingLegendItem, type SchedulingMarker, type SchedulingMarkerEmphasis, type SchedulingOverlayKind, type SchedulingOverlayPattern, type SchedulingResource, type SchedulingResourceSpan, type SchedulingSlotSelection, type SchedulingStatus, SchedulingTimeline, type SchedulingTimelineGroup, type SchedulingTimelineItem, type SchedulingTimelineLabels, type SchedulingTimelineLane, type SchedulingTimelineMarker, type SchedulingTimelineOverlay, type SchedulingTimelineOverlayKind, type SchedulingTimelineProps, SearchBar, type SearchBarLabels, type SearchBarProps, type SearchSegment, SearchSuggest, type SearchSuggestAction, type SearchSuggestOption, type SearchSuggestProps, SectionHead, type SectionHeadProps, type Segment, Segmented, SegmentedOption, type SegmentedOptionProps, type SegmentedProps, Select, type SelectAllState, type SelectGroup, type SelectLabels, type SelectOption, type SelectProps, type ShellNav, Sidebar, type SidebarProps, type SidebarSearch, SidebarSection, type SidebarSectionProps, Skeleton, type SkeletonProps, type SortDir, type SortDirection, type SortKey, SortableList, type SortableListItemContext, type SortableListLabels, type SortableListProps, Spinner, type SpinnerProps, StarButton, type StarButtonProps, Stat, StatLine, type StatLineItem, type StatLineProps, type StatProps, StatRow, type StatRowProps, type StatTrend, type StateVariant, StatusPill, type StatusPillProps, StatusRow, type StatusRowProps, Step, type StepProps, type StepState, type StepStateLabels, Steps, type StepsProps, SubNavItem, type SubNavItemProps, type SummarizeFilterOptions, Switch, type SwitchProps, type SystemDisplayPreferences, TEXT_FILTER_OPERATORS, TOAST_LEAVE_MS, TOP_LANE_CROSS_MIDNIGHT_MINUTES, Tab, TabPanel, type TabPanelProps, type TabProps, Table, type TableDensity, type TableProps, TableWrap, type TableWrapProps, Tabs, type TabsProps, TagInput, type TagInputLabels, type TagInputProps, Td, type TdProps, TextDiff, type TextDiffGranularity, type TextDiffLabels, type TextDiffLine, type TextDiffOp, type TextDiffOptions, type TextDiffProps, type TextDiffResult, type TextDiffRow, type TextDiffSegment, type TextFilterOperator, type TextScalePreference, Textarea, type TextareaProps, Th, type ThProps, type ThemePreference, ThemeSwitcher, type ThemeSwitcherProps, type TimeGridDayLayout, type TimeGridEntryContext, type TimeGridEntryInput, type TimeGridPart, type TimeGridSegment, type TimeInputProblem, TimePicker, type TimePickerLabels, type TimePickerProps, Timeline, TimelineItem, type TimelineItemProps, type TimelineProps, type TimelineRange, type TimelineScale, type TimelineSpan, type TimelineSubTick, type TimelineTick, Toast, type ToastAction, type ToastApi, type ToastDismissReason, type ToastKind, type ToastOptions, type ToastPromiseMessages, type ToastProps, type ToastRecord, type ToastStore, type ToastTone, Toaster, type ToasterProps, ToggleRow, type ToggleRowProps, Tooltip, type TooltipProps, Tr, type TrProps, Tree, type TreeLabels, type TreeLike, type TreeNavAction, type TreeNodeData, type TreeNodeProps, type TreeProps, type UixDateFormat, type UixLabels, UixLabelsProvider, type UixLabelsProviderProps, type UixLinkProps, type UixRenderLink, type UndoableToastOptions, type UseAnchoredPositionOptions, type UseDisplayPreferencesOptions, type UseDisplayPreferencesResult, type UseOptimisticValueOptions, type UseOptimisticValueResult, type UseTableOptions, type UseTableResult, type UseVirtualRowsOptions, type UseVirtualRowsResult, UserChip, type UserChipProps, ViewMenu, type ViewMenuColumn, type ViewMenuColumnLabels, type ViewMenuProps, type ViewState, type VirtualWindow, type ZonedDateSpan, type ZonedDayBounds, type ZonedDayShift, type ZonedDaySpan, type ZonedHourSlot, accountInitials, addCalendarDays, addCalendarMonths, addZonedDays, announcePolite, appendRuleNode, applyBrandProfile, applyDisplayAttributes, applyFilters, ariaKeyShortcuts, boundRelationshipGraph, buildMonthGrid, buildThreeWayDiff, cachedDateTimeFormat, canvasItemLimits, canvasItemsOverlap, canvasMoveTarget, canvasReadingOrder, canvasResizeTarget, canvasRowCount, clampCanvasItem, clampMetricValue, clampWidth, classifyLayeredEdges, clusterIdFor, codeGroups, compactCanvas, contrastRatio, createToastApi, createToastStore, cx, dashboardGridClassName, dashboardGridItemClassName, dateFilterBounds, dateOrder, datePattern, defaultTimelineStep, diffText, diffTokens, displayPreferencesScript, edgeLabelSize, emptyFilterValue, encodeQr, enumerateDateKeys, enumerateDateSpan, fileKind, fileMatchesAccept, filterComboboxItems, filterComboboxOptions, filterCommandItems, findRuleNodeDepth, flashChanged, flattenTree, foldForSearch, formatCountdown, formatDateKey, formatFileSize, formatTimeKey, groupCommandItems, hexToRgb, highlightSegments, hsvToHex, hsvToRgb, isDateInRange, isDateUnavailable, isFilterEmpty, isOvernightRange, isRuleGroup, isTimeOutOfRange, isUnresolvedChoice, isValidDateKey, isValidTimeKey, itemDaySpan, joinDateTime, layeredNeighbor, layoutDaySpans, layoutLane, layoutLayeredGraph, layoutMonthSpans, layoutRelationshipGraph, layoutResourceColumn, layoutTimeGridDay, mapRuleGroup, matchFilter, matchFilterPreset, meetsContrast, mergePinned, minutesToTime, moveCanvasItem, moveRuleNode, multiSort, nextSortDir, normalizeCanvas, normalizeHex, orgChartInitials, orgChartZoomStep, packLanes, parseDateInput, parseDateValue, parseDisplayPreferences, parseMetricValue, parseTimeInput, parseView, partitionFiles, pixelsToMs, placeCanvasItem, placeId, placeSpan, placesInTopLane, prefersReducedMotion, proposeMove, qrDataCapacity, qrPath, qrVersionFor, rankOverflow, readSystemDisplayPreferences, relationshipNeighbors, relativeTimeValue, removeRuleNode, renderPlainLink, reorder, resizeCanvasItem, resolveDisplayAttributes, resolveFilterLabels, resourceDayGaps, resourceDaySlots, restoreBrandProfile, rgbToHex, rgbToHsv, ruleDepth, schedulingGridDays, searchRows, searchSegments, selectAllState, selectRangeDate, separateEdgeLabels, serializeView, setRuleCombinator, shiftSpan, shouldVirtualize, snapToStep, splitDateTime, startOfMonth, stepMetricValue, stepTime, summarizeDiff, summarizeFilter, summarizeRule, telHref, textDiffRows, timePartEnds, timeSlots, timeToMinutes, timeZoneName, timelineRepeatedHourOffset, timelineStepDelta, timelineSubTicks, timelineTicks, toDateKey, toast, toggleId, togglePage, toggleSort, tokenizeText, traverseRelationshipNode, treeNav, useAnchoredPosition, useChangeHighlight, useDelayedPending, useDialog, useDisplayPreferences, useOptimisticValue, useReducedMotion, useTable, useUixLabels, useVirtualRows, uses12Hour, validateRuleDefinition, virtualWindow, wrapEdgeLabel, zonedDateKey, zonedDateSpan, zonedDayBounds, zonedDaySpan, zonedHourSlots, zonedTimeOfDay };
|