@tensor_1/react 2.47.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 +470 -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/Button.d.ts +12 -5
- package/dist/components/Button.js +7 -3
- 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/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.js +16 -0
- package/dist/components/DisplayPreferences.d.ts +83 -0
- package/dist/components/DisplayPreferences.js +185 -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 +2 -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/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/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/Stat.d.ts +28 -3
- package/dist/components/Stat.js +13 -3
- 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 +9 -2
- package/dist/components/Table.js +4 -2
- 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/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 +18644 -13210
- package/dist/index.d.cts +3003 -699
- package/dist/index.d.ts +42 -16
- package/dist/index.js +139 -7
- package/dist/labels-context.d.ts +90 -3
- 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,144 @@ 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
|
+
|
|
253
410
|
interface DelayedPendingOptions {
|
|
254
411
|
/** Wait this long before showing anything (default 300 ms). `0` shows at once. */
|
|
255
412
|
delay?: number;
|
|
@@ -278,6 +435,93 @@ declare const PENDING_MIN_VISIBLE_MS = 500;
|
|
|
278
435
|
/** How long an in-place result ("Saved", "Couldn't save") holds before the control returns. */
|
|
279
436
|
declare const RESULT_HOLD_MS = 1500;
|
|
280
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
|
+
|
|
281
525
|
/**
|
|
282
526
|
* What a `renderLink` callback receives (HAR-1348). Spread it onto your router's link
|
|
283
527
|
* so it keeps client navigation and prefetch: `renderLink={(p) => <NextLink {...p} />}`.
|
|
@@ -372,10 +616,11 @@ interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
|
372
616
|
/**
|
|
373
617
|
* The button's keyboard shortcut, in `KbdCombo` key names: `['A']`, `['Mod', 'Enter']`
|
|
374
618
|
* (HAR-2031). Hover or focus shows the keys in a hint above the button (an icon button's
|
|
375
|
-
* `aria-label` before them
|
|
376
|
-
*
|
|
377
|
-
*
|
|
378
|
-
*
|
|
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.
|
|
379
624
|
*/
|
|
380
625
|
shortcut?: KeyShortcut;
|
|
381
626
|
children?: ReactNode;
|
|
@@ -396,13 +641,19 @@ interface ButtonLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
|
396
641
|
disabled?: boolean;
|
|
397
642
|
/** Your router's link (`(p) => <NextLink {...p} />`); default a plain `<a>`. */
|
|
398
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;
|
|
399
650
|
children?: ReactNode;
|
|
400
651
|
}
|
|
401
652
|
/**
|
|
402
653
|
* A link that looks like a `Button` (HAR-1348; TENSOR A4/B5, MOTUS C-3). Use it when the
|
|
403
654
|
* action navigates; use `Button` when it acts in place.
|
|
404
655
|
*/
|
|
405
|
-
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;
|
|
406
657
|
interface ButtonGroupProps {
|
|
407
658
|
children?: ReactNode;
|
|
408
659
|
className?: string;
|
|
@@ -792,6 +1043,91 @@ declare function proposeMove(span: {
|
|
|
792
1043
|
minutes?: number;
|
|
793
1044
|
}, timeZone: string): MoveProposal;
|
|
794
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
|
+
|
|
795
1131
|
interface TimeGridEntryContext {
|
|
796
1132
|
/** Whole text lines that fit in the item: 0 shows the markers only. */
|
|
797
1133
|
availableLines: number;
|
|
@@ -991,6 +1327,18 @@ interface SchedulingCalendarLabels {
|
|
|
991
1327
|
moveCancelled?: string;
|
|
992
1328
|
/** Announced when the time asked for does not exist that day. `{time}` is the time used instead. */
|
|
993
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;
|
|
994
1342
|
}
|
|
995
1343
|
declare const DEFAULT_SCHEDULING_CALENDAR_LABELS: SchedulingCalendarLabels;
|
|
996
1344
|
interface SchedulingCalendarProps {
|
|
@@ -1131,14 +1479,49 @@ interface SchedulingCalendarProps {
|
|
|
1131
1479
|
topLaneCap?: number;
|
|
1132
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. */
|
|
1133
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
|
+
*/
|
|
1134
1514
|
loading?: boolean;
|
|
1135
1515
|
error?: string;
|
|
1136
1516
|
onRetry?: () => void;
|
|
1137
1517
|
className?: string;
|
|
1138
1518
|
labels?: Partial<SchedulingCalendarLabels>;
|
|
1139
1519
|
}
|
|
1140
|
-
/**
|
|
1141
|
-
|
|
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;
|
|
1142
1525
|
|
|
1143
1526
|
/**
|
|
1144
1527
|
* Every word the picker renders or announces (TENSOR RX-125, UIX-13). `{start}` and
|
|
@@ -1161,6 +1544,13 @@ interface DateRangePickerLabels {
|
|
|
1161
1544
|
fieldStart: string;
|
|
1162
1545
|
/** Field mode: the trigger's text for a range; `{start}`, `{end}`. */
|
|
1163
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;
|
|
1164
1554
|
}
|
|
1165
1555
|
declare const DEFAULT_DATE_RANGE_PICKER_LABELS: DateRangePickerLabels;
|
|
1166
1556
|
interface DateRangePickerProps {
|
|
@@ -1172,9 +1562,12 @@ interface DateRangePickerProps {
|
|
|
1172
1562
|
min?: string;
|
|
1173
1563
|
max?: string;
|
|
1174
1564
|
isDateDisabled?: (date: string) => boolean;
|
|
1565
|
+
/** Default: `UixLabelsProvider` `dateFormat.locale`, then the viewer's. */
|
|
1175
1566
|
locale?: string;
|
|
1567
|
+
/** Default: `labels.label` ("Choose date range"). */
|
|
1176
1568
|
label?: string;
|
|
1177
1569
|
invalid?: boolean;
|
|
1570
|
+
/** Default: `labels.invalidMessage`. */
|
|
1178
1571
|
invalidMessage?: string;
|
|
1179
1572
|
disabled?: boolean;
|
|
1180
1573
|
className?: string;
|
|
@@ -1194,7 +1587,7 @@ interface DateRangePickerProps {
|
|
|
1194
1587
|
* bars. It closes once the range has both ends; Escape closes it and returns focus.
|
|
1195
1588
|
*/
|
|
1196
1589
|
mode?: 'inline' | 'field';
|
|
1197
|
-
/** 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. */
|
|
1198
1591
|
formatDate?: (date: string) => string;
|
|
1199
1592
|
/** Field mode: lands on the trigger, so a `<label htmlFor>` or `<Field>` names it. */
|
|
1200
1593
|
id?: string;
|
|
@@ -1211,7 +1604,82 @@ interface DateRangePickerProps {
|
|
|
1211
1604
|
* Controlled date-range picker using the UIx calendar language: two months inline, or with
|
|
1212
1605
|
* `mode="field"` a form control that opens them in a popover.
|
|
1213
1606
|
*/
|
|
1214
|
-
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>>;
|
|
1215
1683
|
|
|
1216
1684
|
/** Every word `DatePicker` renders or announces. */
|
|
1217
1685
|
interface DatePickerLabels {
|
|
@@ -1248,6 +1716,8 @@ interface DatePickerProps {
|
|
|
1248
1716
|
/**
|
|
1249
1717
|
* How the field writes a date. Default: the locale's numeric date (22.11.2026, 11/22/2026).
|
|
1250
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).
|
|
1251
1721
|
*/
|
|
1252
1722
|
formatDate?: (date: string) => string;
|
|
1253
1723
|
/** Read typed text into `YYYY-MM-DD`, or `null` when it is not a date. Default: ISO or the locale's order. */
|
|
@@ -1322,14 +1792,18 @@ interface DateTimePickerProps extends Omit<DatePickerProps, 'value' | 'onValueCh
|
|
|
1322
1792
|
timeZone?: string;
|
|
1323
1793
|
/** Text shown instead of the zone's short name ("Vienna time", "UTC+2"); `null` shows none. */
|
|
1324
1794
|
timeZoneLabel?: string | null;
|
|
1325
|
-
/** Minutes
|
|
1795
|
+
/** Minutes the time's arrow keys step by, and between the times in its list. Default 15. */
|
|
1326
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;
|
|
1327
1801
|
/** The time a date gets when it is chosen before any time. Default `'00:00'`. */
|
|
1328
1802
|
defaultTime?: string;
|
|
1329
1803
|
labels?: Partial<DateTimePickerLabels>;
|
|
1330
1804
|
}
|
|
1331
1805
|
/**
|
|
1332
|
-
* 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
|
|
1333
1807
|
* time zone the pair is in shown beside them. The value is `YYYY-MM-DDTHH:mm`, the shape
|
|
1334
1808
|
* `datetime-local` uses, so it replaces that input without changing what a form submits.
|
|
1335
1809
|
* Clearing the date clears the value; a time alone is not a value.
|
|
@@ -1798,6 +2272,12 @@ interface FilterChoice {
|
|
|
1798
2272
|
}
|
|
1799
2273
|
type TextFilterOperator = 'contains' | 'not-contains' | 'is' | 'is-not' | 'starts-with';
|
|
1800
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';
|
|
1801
2281
|
type FilterValue = {
|
|
1802
2282
|
kind: 'enum';
|
|
1803
2283
|
values: string[];
|
|
@@ -1814,12 +2294,24 @@ type FilterValue = {
|
|
|
1814
2294
|
kind: 'date-range';
|
|
1815
2295
|
from?: string;
|
|
1816
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;
|
|
1817
2304
|
} | {
|
|
1818
2305
|
kind: 'boolean';
|
|
1819
2306
|
value?: boolean;
|
|
1820
2307
|
} | {
|
|
1821
2308
|
kind: 'reference';
|
|
1822
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[];
|
|
1823
2315
|
};
|
|
1824
2316
|
type FilterValueKind = FilterValue['kind'];
|
|
1825
2317
|
/**
|
|
@@ -1841,8 +2333,15 @@ interface FilterField {
|
|
|
1841
2333
|
options?: readonly FilterChoice[];
|
|
1842
2334
|
/** `reference`: finds records to pick; rejected promises show the error state. */
|
|
1843
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[]>;
|
|
1844
2341
|
/** `text` / `number`: the operators offered, in order. Default: all of the kind. */
|
|
1845
2342
|
operators?: readonly (TextFilterOperator | NumberFilterOperator)[];
|
|
2343
|
+
/** `date`: the conditions offered, in order. Default: on, before, after, between. */
|
|
2344
|
+
dateOperators?: readonly DateFilterOperator[];
|
|
1846
2345
|
/** `number`: a unit shown after the value, e.g. "days". */
|
|
1847
2346
|
unit?: string;
|
|
1848
2347
|
/** `boolean`: words for true and false, e.g. Escalated / Not escalated. Default from labels. */
|
|
@@ -1869,14 +2368,38 @@ interface FilterSummaryLabels {
|
|
|
1869
2368
|
more: string;
|
|
1870
2369
|
/** An `enum` value equal to a preset: `{label}` (the preset), `{field}`. Default `{label}`. */
|
|
1871
2370
|
preset?: string;
|
|
2371
|
+
/** `date` conditions (HAR-1832), `{date}`. Default "{date}", "before {date}", "after {date}". */
|
|
2372
|
+
on?: string;
|
|
2373
|
+
before?: string;
|
|
2374
|
+
after?: string;
|
|
1872
2375
|
}
|
|
1873
2376
|
declare const DEFAULT_FILTER_SUMMARY_LABELS: FilterSummaryLabels;
|
|
1874
2377
|
declare const TEXT_FILTER_OPERATORS: readonly TextFilterOperator[];
|
|
1875
2378
|
declare const NUMBER_FILTER_OPERATORS: readonly NumberFilterOperator[];
|
|
2379
|
+
declare const DATE_FILTER_OPERATORS: readonly DateFilterOperator[];
|
|
1876
2380
|
/** The empty value for a field kind (what Clear resets to). */
|
|
1877
2381
|
declare function emptyFilterValue(kind: FilterValueKind): FilterValue;
|
|
1878
2382
|
/** True when the value filters nothing (so the chip goes away). */
|
|
1879
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>;
|
|
1880
2403
|
/**
|
|
1881
2404
|
* The first of `field.presets` whose values equal the value's as a set, or undefined. Only an
|
|
1882
2405
|
* `enum` value can match a preset.
|
|
@@ -1893,10 +2416,10 @@ interface SummarizeFilterOptions {
|
|
|
1893
2416
|
}
|
|
1894
2417
|
/**
|
|
1895
2418
|
* One line for the filter chip, e.g. "State: Open, Pending", "Priority ≥ 2", "Created:
|
|
1896
|
-
* 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`
|
|
1897
2420
|
* gives that preset's label (the `preset` label). Empty values give an empty string.
|
|
1898
2421
|
*/
|
|
1899
|
-
declare function summarizeFilter(field: FilterField,
|
|
2422
|
+
declare function summarizeFilter(field: FilterField, input: FilterValue | undefined, options?: SummarizeFilterOptions): string;
|
|
1900
2423
|
|
|
1901
2424
|
interface FilterEditorLabels {
|
|
1902
2425
|
apply: string;
|
|
@@ -1923,7 +2446,15 @@ interface FilterEditorLabels {
|
|
|
1923
2446
|
remove: string;
|
|
1924
2447
|
/** Names the row of `field.presets` chips. Optional so existing label objects still type-check; default "Presets". */
|
|
1925
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;
|
|
1926
2455
|
operators: Record<TextFilterOperator | NumberFilterOperator, string>;
|
|
2456
|
+
/** `date` conditions (HAR-1832). Optional, like `presets`. */
|
|
2457
|
+
dateOperators?: Partial<Record<DateFilterOperator, string>>;
|
|
1927
2458
|
}
|
|
1928
2459
|
declare const DEFAULT_FILTER_EDITOR_LABELS: FilterEditorLabels;
|
|
1929
2460
|
interface FilterEditorProps {
|
|
@@ -1931,7 +2462,12 @@ interface FilterEditorProps {
|
|
|
1931
2462
|
/** Undefined means "not filtered yet". */
|
|
1932
2463
|
value: FilterValue | undefined;
|
|
1933
2464
|
onValueChange: (value: FilterValue) => void;
|
|
1934
|
-
|
|
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;
|
|
1935
2471
|
onClear: () => void;
|
|
1936
2472
|
labels?: Partial<FilterEditorLabels>;
|
|
1937
2473
|
/** Show an option filter above an enum list once it has more options than this. Default 8. */
|
|
@@ -1941,8 +2477,9 @@ interface FilterEditorProps {
|
|
|
1941
2477
|
}
|
|
1942
2478
|
/**
|
|
1943
2479
|
* Editor content for one typed column filter (HAR-1365; TENSOR C6, MOTUS C-1): an enum
|
|
1944
|
-
* multi-select, text or number with a condition, a date range,
|
|
1945
|
-
*
|
|
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`
|
|
1946
2483
|
* turns the applied value into the chip text. `FilterPopover` stays for the one-string case.
|
|
1947
2484
|
* An enum field's `presets` (HAR-1505) render as toggle chips above its options. Words come
|
|
1948
2485
|
* from `labels`, or from `UixLabelsProvider`'s `filterEditor` entry.
|
|
@@ -1997,7 +2534,8 @@ interface SelectLabels {
|
|
|
1997
2534
|
results: string;
|
|
1998
2535
|
}
|
|
1999
2536
|
interface SelectProps extends Omit<SelectHTMLAttributes<HTMLSelectElement>, 'size'> {
|
|
2000
|
-
|
|
2537
|
+
/** `sm` 28 px, `md` 36 px (default), `lg` 44 px, the public touch-target size (HAR-1812). */
|
|
2538
|
+
size?: 'sm' | 'md' | 'lg';
|
|
2001
2539
|
/** The options as data, instead of `<option>` / `<optgroup>` children. */
|
|
2002
2540
|
options?: readonly (SelectOption | SelectGroup)[];
|
|
2003
2541
|
/**
|
|
@@ -2034,7 +2572,7 @@ interface SelectProps extends Omit<SelectHTMLAttributes<HTMLSelectElement>, 'siz
|
|
|
2034
2572
|
* A select that draws its own list (HAR-1572): the WAI-ARIA APG select-only combobox — focus
|
|
2035
2573
|
* stays on the trigger, `aria-activedescendant` marks the active option — in a top-layer popover
|
|
2036
2574
|
* placed with `useAnchoredPosition`, or a bottom sheet on a phone. A visually hidden native
|
|
2037
|
-
*
|
|
2575
|
+
* select element (the form proxy) carries `name`, `required`, `form`, `multiple` and the value, so `<option>` children,
|
|
2038
2576
|
* `onChange(e)` with `e.target.value`, FormData, `form.reset()`, `ref` and react-hook-form keep
|
|
2039
2577
|
* working; `ref` points at that select.
|
|
2040
2578
|
*/
|
|
@@ -2430,8 +2968,19 @@ interface SearchSuggestProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onCha
|
|
|
2430
2968
|
onValueChange: (value: string) => void;
|
|
2431
2969
|
/** The suggestions to show, best first. The consumer filters; this component only renders. */
|
|
2432
2970
|
options: readonly SearchSuggestOption[];
|
|
2433
|
-
/**
|
|
2434
|
-
|
|
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;
|
|
2435
2984
|
/** Accessible name of the field (there is no visible label; the placeholder is not a label). */
|
|
2436
2985
|
label: string;
|
|
2437
2986
|
placeholder?: string;
|
|
@@ -2490,6 +3039,15 @@ interface SearchSuggestProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onCha
|
|
|
2490
3039
|
inputId?: string;
|
|
2491
3040
|
/** `aria-describedby` of the input (hint and error text from a `Field`). */
|
|
2492
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;
|
|
2493
3051
|
}
|
|
2494
3052
|
/**
|
|
2495
3053
|
* A search field with a suggestion list underneath: the "search and jump" pattern of Windows
|
|
@@ -2498,7 +3056,7 @@ interface SearchSuggestProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onCha
|
|
|
2498
3056
|
* (`aria-activedescendant`), Enter opens it (the first row when none is active), Escape closes the
|
|
2499
3057
|
* list and a second Escape clears the text.
|
|
2500
3058
|
*/
|
|
2501
|
-
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;
|
|
2502
3060
|
|
|
2503
3061
|
interface EntityPickerLabels {
|
|
2504
3062
|
/** Accessible name of the search field while picking. */
|
|
@@ -2522,12 +3080,23 @@ interface EntityPickerLabels {
|
|
|
2522
3080
|
more: string;
|
|
2523
3081
|
/** Polite count when there are more matches than shown. `{count}` is the number shown. */
|
|
2524
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;
|
|
2525
3088
|
/** Shown in the open list while the query is shorter than `minQueryLength`. `{count}`. */
|
|
2526
3089
|
tooShort: string;
|
|
2527
3090
|
/** The same when `minQueryLength` is 1. */
|
|
2528
3091
|
typeToSearch: string;
|
|
2529
3092
|
}
|
|
2530
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
|
+
}
|
|
2531
3100
|
/** What `onSearch` may resolve to when it knows its list was cut off. */
|
|
2532
3101
|
interface EntityPickerSearchResult {
|
|
2533
3102
|
options: readonly SearchSuggestOption[];
|
|
@@ -2541,9 +3110,15 @@ interface EntityPickerProps {
|
|
|
2541
3110
|
/**
|
|
2542
3111
|
* Finds records for the query; a rejection shows the error state with a Retry row. Resolve
|
|
2543
3112
|
* with the options, or with `{ options, hasMore: true }` when the list was cut off (a page of
|
|
2544
|
-
* 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.
|
|
2545
3116
|
*/
|
|
2546
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;
|
|
2547
3122
|
/** The field's name (the visible label usually comes from a surrounding `Field`). */
|
|
2548
3123
|
label: string;
|
|
2549
3124
|
/** Id of the control, for `Field htmlFor`/`label for`. */
|
|
@@ -2574,13 +3149,19 @@ interface EntityPickerProps {
|
|
|
2574
3149
|
* clear ×; choosing again or typing opens a `SearchSuggest` list with loading, empty and error
|
|
2575
3150
|
* states, and Retry is a list row, so the keyboard reaches it. Stale results are ignored.
|
|
2576
3151
|
*/
|
|
2577
|
-
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;
|
|
2578
3153
|
|
|
2579
3154
|
interface TreeNodeData {
|
|
2580
3155
|
id: string;
|
|
2581
3156
|
label: ReactNode;
|
|
2582
3157
|
/** Plain-text label for keyboard typeahead when `label` is not a string (UIX-A11Y-2). */
|
|
2583
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;
|
|
2584
3165
|
icon?: ReactNode;
|
|
2585
3166
|
children?: TreeNodeData[];
|
|
2586
3167
|
/**
|
|
@@ -2614,6 +3195,8 @@ interface TreeNodeProps {
|
|
|
2614
3195
|
rowToggles?: boolean;
|
|
2615
3196
|
/** Ids of nodes whose children are loading (`aria-busy`). */
|
|
2616
3197
|
busy?: ReadonlySet<string>;
|
|
3198
|
+
/** Scopes the ids that name each row by its own label (HAR-1828). Set by `Tree`. */
|
|
3199
|
+
treeId?: string;
|
|
2617
3200
|
}
|
|
2618
3201
|
interface TreeProps extends Omit<HTMLAttributes<HTMLUListElement>, 'onSelect' | 'onChange'> {
|
|
2619
3202
|
nodes: TreeNodeData[];
|
|
@@ -2776,11 +3359,11 @@ declare function OrgChart({ nodes, expanded: controlledExpanded, defaultExpanded
|
|
|
2776
3359
|
|
|
2777
3360
|
/** Every word `InlineEdit` renders or announces. `{label}` is the field's name. */
|
|
2778
3361
|
interface InlineEditLabels {
|
|
2779
|
-
/** 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. */
|
|
2780
3363
|
edit: string;
|
|
2781
3364
|
save: string;
|
|
2782
3365
|
cancel: string;
|
|
2783
|
-
/** Polite status while `onSave` runs. */
|
|
3366
|
+
/** Polite status while `onSave` runs (shown after 300 ms, so a fast save does not flash it). */
|
|
2784
3367
|
saving: string;
|
|
2785
3368
|
/** Polite status after a save. */
|
|
2786
3369
|
saved: string;
|
|
@@ -2788,50 +3371,114 @@ interface InlineEditLabels {
|
|
|
2788
3371
|
failed: string;
|
|
2789
3372
|
/** What the view shows when the value is empty and no `placeholder` was given. */
|
|
2790
3373
|
empty: string;
|
|
3374
|
+
/** Visually hidden before a `readOnlyReason`, so it is read as one: "Read-only: …". */
|
|
3375
|
+
readOnly: string;
|
|
2791
3376
|
}
|
|
2792
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';
|
|
2793
3380
|
/** What a custom editor receives. Spread the field props onto your control. */
|
|
2794
|
-
interface InlineEditEditorProps {
|
|
3381
|
+
interface InlineEditEditorProps<T = string> {
|
|
2795
3382
|
/** The draft. */
|
|
2796
|
-
value:
|
|
2797
|
-
|
|
2798
|
-
|
|
2799
|
-
|
|
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;
|
|
2800
3391
|
cancel: () => void;
|
|
2801
|
-
/** `id`, the accessible name, the error wiring and
|
|
3392
|
+
/** `id`, the accessible name, the error wiring, and the busy state while saving. */
|
|
2802
3393
|
field: {
|
|
2803
3394
|
id: string;
|
|
2804
3395
|
'aria-label': string;
|
|
2805
3396
|
'aria-describedby': string | undefined;
|
|
2806
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). */
|
|
2807
3399
|
disabled: boolean;
|
|
3400
|
+
/** The same moment as `disabled`, for a text control that should keep focus and its text selectable. */
|
|
3401
|
+
readOnly: boolean;
|
|
2808
3402
|
};
|
|
2809
3403
|
}
|
|
2810
|
-
|
|
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> {
|
|
2811
3416
|
/** The saved value. */
|
|
2812
|
-
value:
|
|
3417
|
+
value: T;
|
|
2813
3418
|
/**
|
|
2814
3419
|
* Save the new value. Return a promise to show the pending state; a rejection keeps the
|
|
2815
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.
|
|
2816
3422
|
*/
|
|
2817
|
-
onSave: (next:
|
|
3423
|
+
onSave: (next: T) => void | Promise<unknown>;
|
|
2818
3424
|
/** The field's name: "Title", "Due date". It names the edit button and the editor. */
|
|
2819
3425
|
label: string;
|
|
2820
|
-
/**
|
|
2821
|
-
|
|
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;
|
|
2822
3431
|
/**
|
|
2823
3432
|
* A custom editor: a `Select`, a `Combobox`, a date field. Spread `field` onto the control.
|
|
2824
|
-
* Default: an `Input`, or a `Textarea` with `multiline
|
|
3433
|
+
* Default: an `Input`, or a `Textarea` with `multiline` (string values only).
|
|
2825
3434
|
*/
|
|
2826
|
-
renderEditor?: (props: InlineEditEditorProps) => ReactNode;
|
|
3435
|
+
renderEditor?: (props: InlineEditEditorProps<T>) => ReactNode;
|
|
2827
3436
|
/** Edit in a textarea: Enter adds a line, Ctrl/⌘+Enter saves. */
|
|
2828
3437
|
multiline?: boolean;
|
|
2829
3438
|
/** Return a message to refuse the draft; nothing is saved while it returns one. */
|
|
2830
|
-
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';
|
|
2831
3452
|
/** Shown in the view while the value is empty, e.g. "Add a description". */
|
|
2832
3453
|
placeholder?: ReactNode;
|
|
2833
|
-
/** Read-only: the value shows as plain text, with no edit
|
|
3454
|
+
/** Read-only: the value shows as plain text, with no edit control. */
|
|
2834
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;
|
|
2835
3482
|
/** Each word defaults to `UixLabelsProvider` `inlineEdit`, then to English. */
|
|
2836
3483
|
labels?: Partial<InlineEditLabels>;
|
|
2837
3484
|
className?: string;
|
|
@@ -2840,9 +3487,12 @@ interface InlineEditProps {
|
|
|
2840
3487
|
* A value that is edited in place (HAR-1381; TENSOR C16 `editable-record.tsx`): the value is
|
|
2841
3488
|
* a button that says what it edits; activating it swaps in an editor with Save and Cancel.
|
|
2842
3489
|
* Enter saves and Escape cancels; while `onSave` runs the editor is busy; a failed save keeps
|
|
2843
|
-
* 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`.
|
|
2844
3494
|
*/
|
|
2845
|
-
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;
|
|
2846
3496
|
|
|
2847
3497
|
/** The words of the "Discard changes?" step a `dirty` Drawer or Modal asks before it closes (HAR-2029). */
|
|
2848
3498
|
interface DiscardPromptLabels {
|
|
@@ -2930,43 +3580,1544 @@ interface SearchBarProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onSubmit'
|
|
|
2930
3580
|
*/
|
|
2931
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;
|
|
2932
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
|
+
}
|
|
2933
3650
|
/**
|
|
2934
|
-
*
|
|
2935
|
-
*
|
|
2936
|
-
*
|
|
2937
|
-
*
|
|
2938
|
-
*
|
|
2939
|
-
*
|
|
2940
|
-
* 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.
|
|
2941
3657
|
*/
|
|
2942
|
-
|
|
2943
|
-
|
|
2944
|
-
|
|
2945
|
-
|
|
2946
|
-
|
|
2947
|
-
|
|
2948
|
-
|
|
2949
|
-
|
|
2950
|
-
}
|
|
2951
|
-
|
|
2952
|
-
|
|
2953
|
-
|
|
2954
|
-
|
|
2955
|
-
|
|
2956
|
-
|
|
2957
|
-
|
|
2958
|
-
|
|
2959
|
-
|
|
2960
|
-
|
|
2961
|
-
|
|
2962
|
-
|
|
2963
|
-
|
|
2964
|
-
|
|
2965
|
-
|
|
2966
|
-
|
|
2967
|
-
|
|
2968
|
-
|
|
2969
|
-
|
|
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;
|
|
5101
|
+
};
|
|
5102
|
+
toaster?: {
|
|
5103
|
+
region?: string;
|
|
5104
|
+
};
|
|
5105
|
+
/**
|
|
5106
|
+
* `openNav`: the phone-tier button that opens the navigation drawer; `navigation`: that
|
|
5107
|
+
* drawer's title (HAR-1371).
|
|
5108
|
+
*/
|
|
5109
|
+
appShell?: {
|
|
5110
|
+
skipToContent?: string;
|
|
5111
|
+
exitFocus?: string;
|
|
5112
|
+
openNav?: string;
|
|
5113
|
+
navigation?: string;
|
|
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>;
|
|
5119
|
+
sidebar?: {
|
|
5120
|
+
expand?: string;
|
|
2970
5121
|
collapse?: string;
|
|
2971
5122
|
};
|
|
2972
5123
|
searchSuggest?: {
|
|
@@ -2974,32 +5125,65 @@ interface UixLabels {
|
|
|
2974
5125
|
};
|
|
2975
5126
|
/** `SearchBar` (HAR-2030): the clear button's name and the submit button's text. */
|
|
2976
5127
|
searchBar?: Partial<SearchBarLabels>;
|
|
2977
|
-
/**
|
|
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
|
+
*/
|
|
2978
5132
|
commandPalette?: {
|
|
2979
5133
|
input?: string;
|
|
2980
5134
|
resultsOne?: string;
|
|
2981
5135
|
resultsMany?: string;
|
|
5136
|
+
empty?: string;
|
|
5137
|
+
recent?: string;
|
|
2982
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>;
|
|
2983
5149
|
entityPicker?: Partial<EntityPickerLabels>;
|
|
2984
5150
|
tree?: Partial<TreeLabels>;
|
|
2985
5151
|
/** `OrgChart` (HAR-1807): loading and error rows, the report count, the zoom toolbar. */
|
|
2986
5152
|
orgChart?: Partial<OrgChartLabels>;
|
|
2987
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. */
|
|
2988
5157
|
confirmDialog?: {
|
|
2989
5158
|
typeToConfirm?: string;
|
|
2990
5159
|
compensation?: string;
|
|
5160
|
+
typeToConfirmMismatch?: string;
|
|
2991
5161
|
};
|
|
2992
5162
|
schedulingCalendar?: Partial<SchedulingCalendarLabels>;
|
|
2993
5163
|
dateRangePicker?: Partial<DateRangePickerLabels>;
|
|
2994
5164
|
datePicker?: Partial<DatePickerLabels>;
|
|
2995
5165
|
dateTimePicker?: Partial<DateTimePickerLabels>;
|
|
5166
|
+
/** `TimePicker` (HAR-1835), also the time part of `DateTimePicker`. */
|
|
5167
|
+
timePicker?: Partial<TimePickerLabels>;
|
|
2996
5168
|
schedulingTimeline?: Partial<SchedulingTimelineLabels>;
|
|
2997
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>;
|
|
2998
5178
|
filterEditor?: Partial<FilterEditorLabels>;
|
|
2999
5179
|
select?: Partial<SelectLabels>;
|
|
3000
5180
|
ruleBuilder?: Partial<RuleBuilderLabels>;
|
|
3001
5181
|
fileUpload?: Partial<FileUploadLabels>;
|
|
3002
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>;
|
|
3003
5187
|
/** `remove`: the name of a removable chip's × button; `{label}` is the chip text. */
|
|
3004
5188
|
chip?: {
|
|
3005
5189
|
remove?: string;
|
|
@@ -3008,6 +5192,8 @@ interface UixLabels {
|
|
|
3008
5192
|
alert?: {
|
|
3009
5193
|
dismiss?: string;
|
|
3010
5194
|
};
|
|
5195
|
+
/** Not words: the date format of every date field (HAR-2432). See {@link UixDateFormat}. */
|
|
5196
|
+
dateFormat?: UixDateFormat;
|
|
3011
5197
|
/** Read by `useUixLabels()` callers; `Pagination` itself is server-safe and takes `labels`. */
|
|
3012
5198
|
pagination?: Partial<PaginationLabels>;
|
|
3013
5199
|
/** Read by `useUixLabels()` callers; `BulkBar` itself is server-safe and takes `label`. */
|
|
@@ -3015,6 +5201,20 @@ interface UixLabels {
|
|
|
3015
5201
|
region?: string;
|
|
3016
5202
|
};
|
|
3017
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
|
+
}
|
|
3018
5218
|
interface UixLabelsProviderProps {
|
|
3019
5219
|
labels: UixLabels;
|
|
3020
5220
|
children?: ReactNode;
|
|
@@ -3024,35 +5224,34 @@ declare function UixLabelsProvider({ labels, children }: UixLabelsProviderProps)
|
|
|
3024
5224
|
/** The chrome strings in effect here (empty outside a provider). */
|
|
3025
5225
|
declare function useUixLabels(): UixLabels;
|
|
3026
5226
|
|
|
3027
|
-
interface
|
|
3028
|
-
|
|
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;
|
|
3029
5241
|
invalid?: boolean;
|
|
3030
|
-
valid?: boolean;
|
|
3031
|
-
/**
|
|
3032
|
-
* "Check this": a value the reader should confirm, not an error, e.g. one an assistant filled
|
|
3033
|
-
* in (HAR-1814). Draws the warning border; `invalid` wins when both are set.
|
|
3034
|
-
*/
|
|
3035
|
-
warning?: boolean;
|
|
3036
|
-
}
|
|
3037
|
-
declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
|
|
3038
|
-
interface InputGroupProps {
|
|
3039
|
-
children: ReactNode;
|
|
3040
|
-
leadingIcon?: ReactNode;
|
|
3041
|
-
trailingIcon?: ReactNode;
|
|
3042
|
-
className?: string;
|
|
3043
|
-
/** Injected by `<Field>` when it wraps the group; forwarded onto the child control. */
|
|
3044
|
-
id?: string;
|
|
3045
|
-
'aria-describedby'?: string;
|
|
3046
5242
|
'aria-invalid'?: AriaAttributes['aria-invalid'];
|
|
3047
|
-
|
|
5243
|
+
className?: string;
|
|
5244
|
+
style?: CSSProperties;
|
|
3048
5245
|
}
|
|
3049
5246
|
/**
|
|
3050
|
-
*
|
|
3051
|
-
*
|
|
3052
|
-
*
|
|
3053
|
-
* 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.
|
|
3054
5253
|
*/
|
|
3055
|
-
declare
|
|
5254
|
+
declare const OtpInput: react.ForwardRefExoticComponent<OtpInputProps & react.RefAttributes<HTMLInputElement>>;
|
|
3056
5255
|
|
|
3057
5256
|
interface ComboboxOption {
|
|
3058
5257
|
value: string;
|
|
@@ -3060,21 +5259,50 @@ interface ComboboxOption {
|
|
|
3060
5259
|
keywords?: readonly string[];
|
|
3061
5260
|
disabled?: boolean;
|
|
3062
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
|
+
}
|
|
3063
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)[];
|
|
3064
5272
|
|
|
3065
5273
|
interface ComboboxProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
|
|
3066
|
-
options
|
|
5274
|
+
/** The options, and groups of options (`{ label, options }`, HAR-1588). */
|
|
5275
|
+
options: readonly (ComboboxOption | ComboboxGroup)[];
|
|
3067
5276
|
value?: string;
|
|
3068
5277
|
defaultValue?: string;
|
|
3069
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. */
|
|
3070
5280
|
label: string;
|
|
3071
5281
|
placeholder?: string;
|
|
5282
|
+
/** Shown in the open list when nothing matches (outside the listbox, so it is never an option). */
|
|
3072
5283
|
emptyLabel: string;
|
|
3073
5284
|
name?: string;
|
|
3074
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;
|
|
3075
5295
|
}
|
|
3076
|
-
/**
|
|
3077
|
-
|
|
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;
|
|
3078
5306
|
|
|
3079
5307
|
/** One run of a result's text, emphasised or not. */
|
|
3080
5308
|
interface SearchSegment {
|
|
@@ -3097,14 +5325,48 @@ declare function searchSegments(text: string, query: string): SearchSegment[];
|
|
|
3097
5325
|
|
|
3098
5326
|
interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
|
|
3099
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';
|
|
3100
5333
|
}
|
|
3101
5334
|
declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
|
|
3102
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
|
+
|
|
3103
5339
|
interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
|
|
3104
5340
|
label?: ReactNode;
|
|
3105
5341
|
indeterminate?: boolean;
|
|
3106
5342
|
}
|
|
3107
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;
|
|
3108
5370
|
|
|
3109
5371
|
interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
|
|
3110
5372
|
label?: ReactNode;
|
|
@@ -3199,8 +5461,17 @@ interface ModalProps extends Omit<HTMLAttributes<HTMLDialogElement>, 'title'> {
|
|
|
3199
5461
|
*/
|
|
3200
5462
|
instant?: boolean;
|
|
3201
5463
|
}
|
|
3202
|
-
|
|
5464
|
+
/** A modal `<dialog>`; the ref reaches it (HAR-1831). */
|
|
5465
|
+
declare const Modal: react.ForwardRefExoticComponent<ModalProps & react.RefAttributes<HTMLDialogElement>>;
|
|
3203
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
|
+
};
|
|
3204
5475
|
interface ConfirmDialogProps {
|
|
3205
5476
|
open: boolean;
|
|
3206
5477
|
title: ReactNode;
|
|
@@ -3211,6 +5482,11 @@ interface ConfirmDialogProps {
|
|
|
3211
5482
|
closeLabel?: string;
|
|
3212
5483
|
onConfirm: () => void | Promise<void>;
|
|
3213
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
|
+
*/
|
|
3214
5490
|
pending?: boolean;
|
|
3215
5491
|
destructive?: boolean;
|
|
3216
5492
|
/**
|
|
@@ -3233,21 +5509,47 @@ interface ConfirmDialogProps {
|
|
|
3233
5509
|
* this text, e.g. the record's name.
|
|
3234
5510
|
*/
|
|
3235
5511
|
typeToConfirm?: string;
|
|
3236
|
-
/**
|
|
3237
|
-
|
|
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;
|
|
3238
5525
|
/** How the action is undone or compensated, shown as its own labelled block (TENSOR C2). */
|
|
3239
5526
|
compensation?: ReactNode;
|
|
3240
5527
|
/** Heading of the compensation block. Default "How to undo this". */
|
|
3241
5528
|
compensationLabel?: string;
|
|
5529
|
+
/** Attributes for the confirm button, e.g. `{ 'data-action-id': 'ci.delete' }` (HAR-1831). */
|
|
5530
|
+
confirmProps?: ConfirmButtonProps;
|
|
3242
5531
|
}
|
|
3243
|
-
/**
|
|
3244
|
-
|
|
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>>;
|
|
3245
5537
|
interface PopconfirmProps {
|
|
3246
5538
|
open: boolean;
|
|
3247
5539
|
/** The control that asked for confirmation; the step is placed against it and focus returns to it. */
|
|
3248
5540
|
anchor: RefObject<HTMLElement | null> | HTMLElement | null;
|
|
3249
|
-
|
|
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;
|
|
3250
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;
|
|
3251
5553
|
confirmLabel: ReactNode;
|
|
3252
5554
|
cancelLabel: ReactNode;
|
|
3253
5555
|
onConfirm: () => void | Promise<void>;
|
|
@@ -3255,17 +5557,39 @@ interface PopconfirmProps {
|
|
|
3255
5557
|
onCancel: () => void;
|
|
3256
5558
|
pending?: boolean;
|
|
3257
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;
|
|
3258
5564
|
/** How the action is undone, under its own heading (TENSOR C2 "single_click" tier). */
|
|
3259
5565
|
compensation?: ReactNode;
|
|
3260
5566
|
compensationLabel?: string;
|
|
3261
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;
|
|
3262
5586
|
}
|
|
3263
5587
|
/**
|
|
3264
5588
|
* An anchored, single-step confirmation for low-risk actions (HAR-1356; TENSOR C2): a small
|
|
3265
|
-
*
|
|
3266
|
-
* 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.
|
|
3267
5591
|
*/
|
|
3268
|
-
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;
|
|
3269
5593
|
interface PromptDialogProps {
|
|
3270
5594
|
open: boolean;
|
|
3271
5595
|
title: ReactNode;
|
|
@@ -3359,47 +5683,6 @@ interface PeekProps extends Omit<HTMLAttributes<HTMLDialogElement>, 'title'> {
|
|
|
3359
5683
|
}
|
|
3360
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;
|
|
3361
5685
|
|
|
3362
|
-
interface LightboxItem {
|
|
3363
|
-
src: string;
|
|
3364
|
-
/** Alternative text for an image; the video's name for a video. */
|
|
3365
|
-
alt: string;
|
|
3366
|
-
caption?: ReactNode;
|
|
3367
|
-
kind?: 'image' | 'video';
|
|
3368
|
-
/** Intrinsic size, so an SVG or a slow image keeps its box. */
|
|
3369
|
-
width?: number;
|
|
3370
|
-
height?: number;
|
|
3371
|
-
}
|
|
3372
|
-
interface LightboxLabels {
|
|
3373
|
-
region: string;
|
|
3374
|
-
previous: string;
|
|
3375
|
-
next: string;
|
|
3376
|
-
close: string;
|
|
3377
|
-
/** `{index}`, `{total}`. */
|
|
3378
|
-
counter: string;
|
|
3379
|
-
zoomIn: string;
|
|
3380
|
-
zoomOut: string;
|
|
3381
|
-
}
|
|
3382
|
-
declare const DEFAULT_LIGHTBOX_LABELS: LightboxLabels;
|
|
3383
|
-
interface LightboxProps {
|
|
3384
|
-
items: readonly LightboxItem[];
|
|
3385
|
-
/** The item on show (0-based). */
|
|
3386
|
-
index: number;
|
|
3387
|
-
onIndexChange: (index: number) => void;
|
|
3388
|
-
open: boolean;
|
|
3389
|
-
onClose: () => void;
|
|
3390
|
-
/** Wrap from the last item to the first. Default false. */
|
|
3391
|
-
loop?: boolean;
|
|
3392
|
-
labels?: Partial<LightboxLabels>;
|
|
3393
|
-
className?: string;
|
|
3394
|
-
}
|
|
3395
|
-
/**
|
|
3396
|
-
* A full-screen media viewer over `.uix-lightbox` (HAR-1367; TENSOR C12 `capture-viewer.tsx`,
|
|
3397
|
-
* MOTUS C-8 programme gallery): previous/next buttons, ←/→ and Home/End, swipe on touch, an
|
|
3398
|
-
* announced "n of total" counter, a caption, and a fit/actual-size toggle. Native `<dialog>`,
|
|
3399
|
-
* so focus stays inside and Escape closes; focus returns to the control that opened it.
|
|
3400
|
-
*/
|
|
3401
|
-
declare function Lightbox({ items, index, onIndexChange, open, onClose, loop, labels: labelOverrides, className }: LightboxProps): react.JSX.Element;
|
|
3402
|
-
|
|
3403
5686
|
interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
|
|
3404
5687
|
title?: ReactNode;
|
|
3405
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. */
|
|
@@ -3432,6 +5715,23 @@ interface CardLinkProps extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 't
|
|
|
3432
5715
|
}
|
|
3433
5716
|
/** A whole-card anchor with visible hover and keyboard focus affordances. */
|
|
3434
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;
|
|
3435
5735
|
|
|
3436
5736
|
/** Columns at one width. */
|
|
3437
5737
|
type DashboardGridColumnCount = 1 | 2 | 3 | 4;
|
|
@@ -3675,9 +5975,15 @@ interface BreadcrumbsProps extends Omit<HTMLAttributes<HTMLElement>, 'children'>
|
|
|
3675
5975
|
items: readonly BreadcrumbItem[];
|
|
3676
5976
|
label: string;
|
|
3677
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;
|
|
3678
5984
|
}
|
|
3679
|
-
/** Framework-neutral breadcrumb navigation
|
|
3680
|
-
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;
|
|
3681
5987
|
|
|
3682
5988
|
interface PageHeaderProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
|
|
3683
5989
|
eyebrow?: ReactNode;
|
|
@@ -3695,12 +6001,18 @@ interface PageHeaderProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
|
|
|
3695
6001
|
helpLabel?: string;
|
|
3696
6002
|
/** Right-aligned action area (buttons, menus). */
|
|
3697
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';
|
|
3698
6010
|
}
|
|
3699
6011
|
/**
|
|
3700
6012
|
* Page header — eyebrow / title (+ optional `help` ?) / subtitle + actions row, over `.uix-page-header`.
|
|
3701
6013
|
* The hairline + breathing room below come from the component CSS.
|
|
3702
6014
|
*/
|
|
3703
|
-
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;
|
|
3704
6016
|
|
|
3705
6017
|
interface DetailLayoutProps extends HTMLAttributes<HTMLDivElement> {
|
|
3706
6018
|
/** The narrow trailing column (record meta, side panels). */
|
|
@@ -3758,9 +6070,15 @@ interface DetailPageProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
|
|
|
3758
6070
|
* modified click, no JS).
|
|
3759
6071
|
*/
|
|
3760
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';
|
|
3761
6079
|
}
|
|
3762
6080
|
/** Framework-neutral record-detail scaffold; routing and data policy stay with the application. */
|
|
3763
|
-
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;
|
|
3764
6082
|
|
|
3765
6083
|
interface RelatedLinkItem {
|
|
3766
6084
|
id: string;
|
|
@@ -3943,7 +6261,8 @@ interface TabsProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'r
|
|
|
3943
6261
|
children?: ReactNode;
|
|
3944
6262
|
className?: string;
|
|
3945
6263
|
/**
|
|
3946
|
-
* 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).
|
|
3947
6266
|
* `'scroll'` keeps one row that scrolls sideways, with pointer-only edge buttons
|
|
3948
6267
|
* shown on the side that has hidden tabs. The selected tab is always scrolled into view.
|
|
3949
6268
|
*/
|
|
@@ -3985,8 +6304,47 @@ declare function TabPanel({ value, children, keepMounted, ...props }: TabPanelPr
|
|
|
3985
6304
|
|
|
3986
6305
|
type ShellNav = 'full' | 'rail' | 'hidden';
|
|
3987
6306
|
interface AppShellProps extends HTMLAttributes<HTMLDivElement> {
|
|
3988
|
-
/**
|
|
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
|
+
*/
|
|
3989
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';
|
|
3990
6348
|
/** Back-compat alias for nav="rail". Ignored when `nav` is set. */
|
|
3991
6349
|
collapsed?: boolean;
|
|
3992
6350
|
/**
|
|
@@ -4008,20 +6366,48 @@ interface AppShellProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
4008
6366
|
skipToContentLabel?: ReactNode;
|
|
4009
6367
|
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4010
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;
|
|
4011
6373
|
}
|
|
4012
|
-
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;
|
|
4013
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
|
+
}
|
|
4014
6388
|
interface SidebarProps extends HTMLAttributes<HTMLElement> {
|
|
4015
6389
|
collapsed?: boolean;
|
|
4016
6390
|
nav?: 'full' | 'rail';
|
|
4017
6391
|
onToggle?: () => void;
|
|
4018
6392
|
brand?: ReactNode;
|
|
4019
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;
|
|
4020
6406
|
children?: ReactNode;
|
|
4021
6407
|
expandLabel?: string;
|
|
4022
6408
|
collapseLabel?: string;
|
|
4023
6409
|
}
|
|
4024
|
-
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;
|
|
4025
6411
|
interface SidebarSectionProps {
|
|
4026
6412
|
label?: string;
|
|
4027
6413
|
children?: ReactNode;
|
|
@@ -4039,7 +6425,13 @@ interface NavItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
|
4039
6425
|
description?: ReactNode;
|
|
4040
6426
|
children?: ReactNode;
|
|
4041
6427
|
}
|
|
4042
|
-
|
|
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>>;
|
|
4043
6435
|
interface NavGroupProps {
|
|
4044
6436
|
icon?: ReactNode;
|
|
4045
6437
|
label: ReactNode;
|
|
@@ -4054,7 +6446,8 @@ interface SubNavItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
|
4054
6446
|
as?: 'a' | 'button';
|
|
4055
6447
|
children?: ReactNode;
|
|
4056
6448
|
}
|
|
4057
|
-
|
|
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>>;
|
|
4058
6451
|
|
|
4059
6452
|
interface StarButtonProps {
|
|
4060
6453
|
/** Pinned state — drives the filled, warning-toned, always-visible look via `data-on`. */
|
|
@@ -4125,6 +6518,11 @@ interface NavFavouritesLabels {
|
|
|
4125
6518
|
readonly remove: string;
|
|
4126
6519
|
/** Per-row overflow-trigger accessible-name template with `{label}`. Defaults to "{label} favourite options". */
|
|
4127
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;
|
|
4128
6526
|
}
|
|
4129
6527
|
interface NavFavouritesProps {
|
|
4130
6528
|
/** The already-resolved favourites, in display order. */
|
|
@@ -4305,6 +6703,13 @@ interface ToastOptions {
|
|
|
4305
6703
|
* Defaults: success/info/default 5 s, warning 8 s, error and loading stay.
|
|
4306
6704
|
*/
|
|
4307
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;
|
|
4308
6713
|
action?: ToastAction;
|
|
4309
6714
|
/** Replaces the tone glyph. */
|
|
4310
6715
|
icon?: ReactNode;
|
|
@@ -4317,6 +6722,8 @@ interface ToastRecord {
|
|
|
4317
6722
|
message: ReactNode;
|
|
4318
6723
|
description?: ReactNode;
|
|
4319
6724
|
duration: number | null;
|
|
6725
|
+
/** `false`: the timer does not pause (see {@link ToastOptions.pauseOnHover}). */
|
|
6726
|
+
pauseOnHover?: boolean;
|
|
4320
6727
|
action?: ToastAction;
|
|
4321
6728
|
icon?: ReactNode;
|
|
4322
6729
|
/** Set while the leave animation runs; the record is removed after it. */
|
|
@@ -4343,183 +6750,74 @@ interface ToastStore {
|
|
|
4343
6750
|
update: (id: string, patch: Partial<Omit<ToastRecord, 'id' | 'version'>>) => void;
|
|
4344
6751
|
dismiss: (id?: string, reason?: ToastDismissReason) => void;
|
|
4345
6752
|
subscribe: (listener: () => void) => () => void;
|
|
4346
|
-
getSnapshot: () => readonly ToastRecord[];
|
|
4347
|
-
}
|
|
4348
|
-
/** How long the leave animation gets before the record is removed. */
|
|
4349
|
-
declare const TOAST_LEAVE_MS = 200;
|
|
4350
|
-
/** A separate queue, e.g. per test or per embedded app. Most products use the default `toast`. */
|
|
4351
|
-
declare function createToastStore(): ToastStore;
|
|
4352
|
-
interface ToastApi {
|
|
4353
|
-
(message: ReactNode, options?: ToastOptions): string;
|
|
4354
|
-
success: (message: ReactNode, options?: ToastOptions) => string;
|
|
4355
|
-
error: (message: ReactNode, options?: ToastOptions) => string;
|
|
4356
|
-
warning: (message: ReactNode, options?: ToastOptions) => string;
|
|
4357
|
-
info: (message: ReactNode, options?: ToastOptions) => string;
|
|
4358
|
-
loading: (message: ReactNode, options?: ToastOptions) => string;
|
|
4359
|
-
/** Close one toast, or every toast without an id. */
|
|
4360
|
-
dismiss: (id?: string) => void;
|
|
4361
|
-
/** Change a toast in place (message, kind, description, duration, action). */
|
|
4362
|
-
update: (id: string, patch: Partial<Omit<ToastRecord, 'id' | 'version'>>) => void;
|
|
4363
|
-
/** A loading toast that turns into success or error when the promise settles. Returns the promise. */
|
|
4364
|
-
promise: <T>(promise: Promise<T>, messages: ToastPromiseMessages<T>, options?: ToastOptions) => Promise<T>;
|
|
4365
|
-
/**
|
|
4366
|
-
* An optimistic action with an Undo button (TENSOR C2 `useUndoableAction`): `onCommit` runs
|
|
4367
|
-
* when the toast closes without Undo; `onUndo` runs instead when Undo is pressed.
|
|
4368
|
-
*/
|
|
4369
|
-
undoable: (message: ReactNode, options: UndoableToastOptions) => string;
|
|
4370
|
-
/** The store this API writes to; pass it to `<Toaster store>` for a non-default queue. */
|
|
4371
|
-
store: ToastStore;
|
|
4372
|
-
}
|
|
4373
|
-
/** Binds the `toast()` API to a store. */
|
|
4374
|
-
declare function createToastApi(store: ToastStore): ToastApi;
|
|
4375
|
-
/** The default queue; a `<Toaster />` without a `store` prop renders it. */
|
|
4376
|
-
declare const toast: ToastApi;
|
|
4377
|
-
|
|
4378
|
-
type ToastTone = 'success' | 'danger' | 'info' | 'warning';
|
|
4379
|
-
interface ToastProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
|
|
4380
|
-
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4381
|
-
dismissLabel?: string;
|
|
4382
|
-
title?: ReactNode;
|
|
4383
|
-
message?: ReactNode;
|
|
4384
|
-
tone?: ToastTone;
|
|
4385
|
-
icon?: ReactNode;
|
|
4386
|
-
/** A button (or link) after the text, e.g. "Undo" or "Copy details" (HAR-1363). */
|
|
4387
|
-
action?: ReactNode;
|
|
4388
|
-
onClose?: () => void;
|
|
4389
|
-
leaving?: boolean;
|
|
4390
|
-
}
|
|
4391
|
-
declare function Toast({ title, message, tone, icon, action, onClose, leaving, dismissLabel: dismissLabelProp, className, ...props }: ToastProps): react.JSX.Element;
|
|
4392
|
-
interface ToasterProps extends HTMLAttributes<HTMLDivElement> {
|
|
4393
|
-
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4394
|
-
regionLabel?: string;
|
|
4395
|
-
/**
|
|
4396
|
-
* The queue to render (HAR-1363). Default: the store behind the exported `toast()`.
|
|
4397
|
-
* Children still render first, so a hand-managed `<Toast>` keeps working.
|
|
4398
|
-
*/
|
|
4399
|
-
store?: ToastStore;
|
|
4400
|
-
/** At most this many store toasts on screen; later ones wait their turn. Default 3. */
|
|
4401
|
-
limit?: number;
|
|
4402
|
-
/** Corner of the viewport. Default `bottom-end`. */
|
|
4403
|
-
position?: 'bottom-end' | 'bottom-start' | 'bottom-center' | 'top-end' | 'top-start' | 'top-center';
|
|
4404
|
-
children?: ReactNode;
|
|
4405
|
-
}
|
|
4406
|
-
declare function Toaster({ children, regionLabel: regionLabelProp, store, limit, position, className, onMouseEnter, onMouseLeave, onFocus, onBlur, onKeyDown, ...props }: ToasterProps): react.JSX.Element;
|
|
4407
|
-
|
|
4408
|
-
interface TableWrapProps extends HTMLAttributes<HTMLDivElement> {
|
|
4409
|
-
/**
|
|
4410
|
-
* Polite live-region text for table state changes — "Sorted by …", "N results",
|
|
4411
|
-
* "N selected". Pass `useTable().announcement` straight through (UIX-A11Y-2).
|
|
4412
|
-
*/
|
|
4413
|
-
announcement?: string;
|
|
4414
|
-
/**
|
|
4415
|
-
* The rows are being fetched again (a filter, sort, page or saved-view change; HAR-2582). The
|
|
4416
|
-
* current rows stay and dim under an indeterminate bar along the top, and the wrap is
|
|
4417
|
-
* `aria-busy`; after 300 ms, held at least 500 ms. Keep the previous rows while fetching
|
|
4418
|
-
* (TanStack Query `placeholderData: keepPreviousData`); skeleton rows are for a first load.
|
|
4419
|
-
*/
|
|
4420
|
-
refreshing?: boolean;
|
|
4421
|
-
children?: ReactNode;
|
|
4422
|
-
}
|
|
4423
|
-
declare const TableWrap: react.ForwardRefExoticComponent<TableWrapProps & react.RefAttributes<HTMLDivElement>>;
|
|
4424
|
-
type TableDensity = 'compact' | 'standard' | 'comfortable';
|
|
4425
|
-
type SortDirection = 'ascending' | 'descending' | 'none';
|
|
4426
|
-
interface TableProps extends TableHTMLAttributes<HTMLTableElement> {
|
|
4427
|
-
density?: TableDensity;
|
|
4428
|
-
zebra?: boolean;
|
|
4429
|
-
pinnedCol?: boolean;
|
|
4430
|
-
/**
|
|
4431
|
-
* Freeze the last column at the right edge while the wrap scrolls sideways, so a trailing
|
|
4432
|
-
* row-actions column (peek, kebab) stays one click away. Pin the row's state with
|
|
4433
|
-
* `Tr selected` / `Tr pinned`: the frozen cell repaints those, not a consumer's own row class.
|
|
4434
|
-
*/
|
|
4435
|
-
pinnedActions?: boolean;
|
|
4436
|
-
/** table-layout: fixed — required for reliable column widths + primary-column truncation */
|
|
4437
|
-
fixed?: boolean;
|
|
4438
|
-
rowPeek?: boolean;
|
|
4439
|
-
v2?: boolean;
|
|
4440
|
-
}
|
|
4441
|
-
declare function Table({ density, zebra, pinnedCol, pinnedActions, fixed, rowPeek, v2, className, children, ...props }: TableProps): react.JSX.Element;
|
|
4442
|
-
interface ThProps extends ThHTMLAttributes<HTMLTableCellElement> {
|
|
4443
|
-
sortable?: boolean;
|
|
4444
|
-
sortDirection?: SortDirection;
|
|
4445
|
-
/** 1-based ordinal shown when this column is a secondary key in a multi-sort */
|
|
4446
|
-
sortOrder?: number;
|
|
4447
|
-
onSort?: () => void;
|
|
4448
|
-
}
|
|
4449
|
-
declare function Th({ sortable, sortDirection, sortOrder, onSort, className, children, onClick, ...props }: ThProps): react.JSX.Element;
|
|
4450
|
-
interface TdProps extends TdHTMLAttributes<HTMLTableCellElement> {
|
|
4451
|
-
pinned?: boolean;
|
|
4452
|
-
}
|
|
4453
|
-
declare function Td({ pinned, className, children, ...props }: TdProps): react.JSX.Element;
|
|
4454
|
-
interface TrProps extends HTMLAttributes<HTMLTableRowElement> {
|
|
4455
|
-
selected?: boolean;
|
|
4456
|
-
pinned?: boolean;
|
|
4457
|
-
}
|
|
4458
|
-
declare function Tr({ selected, pinned, className, children, ...props }: TrProps): react.JSX.Element;
|
|
4459
|
-
interface BulkBarProps extends HTMLAttributes<HTMLDivElement> {
|
|
4460
|
-
/** number of selected rows, rendered through `selectedLabel` */
|
|
4461
|
-
count?: number;
|
|
4462
|
-
children?: ReactNode;
|
|
4463
|
-
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4464
|
-
label?: string;
|
|
4465
|
-
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4466
|
-
selectedLabel?: (count: number) => ReactNode;
|
|
4467
|
-
}
|
|
4468
|
-
/** Contextual action bar shown above the table when ≥1 row is selected. */
|
|
4469
|
-
declare function BulkBar({ count, children, label, selectedLabel, className, ...props }: BulkBarProps): react.JSX.Element;
|
|
4470
|
-
interface RowActionsProps extends TdHTMLAttributes<HTMLTableCellElement> {
|
|
4471
|
-
children?: ReactNode;
|
|
4472
|
-
}
|
|
4473
|
-
/** Trailing cell that holds the row's hover actions (kebab, quick actions). */
|
|
4474
|
-
declare function RowActions({ children, className, ...props }: RowActionsProps): react.JSX.Element;
|
|
4475
|
-
interface RowActionProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
4476
|
-
children?: ReactNode;
|
|
4477
|
-
}
|
|
4478
|
-
/** A single hover-revealed row action button (icon inside). */
|
|
4479
|
-
declare function RowAction({ children, className, type, ...props }: RowActionProps): react.JSX.Element;
|
|
4480
|
-
interface ExpandToggleProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
4481
|
-
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4482
|
-
expandLabel?: string;
|
|
4483
|
-
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
4484
|
-
collapseLabel?: string;
|
|
4485
|
-
expanded?: boolean;
|
|
4486
|
-
/** id of the detail row this toggle controls → `aria-controls` (UIX-A11Y-2). */
|
|
4487
|
-
controls?: string;
|
|
4488
|
-
}
|
|
4489
|
-
/** Chevron button that expands/collapses an inline detail row. */
|
|
4490
|
-
declare function ExpandToggle({ expanded, controls, expandLabel, collapseLabel, className, type, ...props }: ExpandToggleProps): react.JSX.Element;
|
|
4491
|
-
/** Emphasised primary cell text. */
|
|
4492
|
-
declare function CellStrong({ children, className, ...props }: HTMLAttributes<HTMLSpanElement>): react.JSX.Element;
|
|
4493
|
-
/** Secondary line under a primary cell value (muted, meta size). */
|
|
4494
|
-
declare function CellSub({ children, className, ...props }: HTMLAttributes<HTMLSpanElement>): react.JSX.Element;
|
|
4495
|
-
interface MarkProps extends HTMLAttributes<HTMLElement> {
|
|
4496
|
-
children?: ReactNode;
|
|
6753
|
+
getSnapshot: () => readonly ToastRecord[];
|
|
4497
6754
|
}
|
|
4498
|
-
/**
|
|
4499
|
-
declare
|
|
4500
|
-
|
|
4501
|
-
|
|
4502
|
-
|
|
6755
|
+
/** How long the leave animation gets before the record is removed. */
|
|
6756
|
+
declare const TOAST_LEAVE_MS = 200;
|
|
6757
|
+
/** A separate queue, e.g. per test or per embedded app. Most products use the default `toast`. */
|
|
6758
|
+
declare function createToastStore(): ToastStore;
|
|
6759
|
+
interface ToastApi {
|
|
6760
|
+
(message: ReactNode, options?: ToastOptions): string;
|
|
6761
|
+
success: (message: ReactNode, options?: ToastOptions) => string;
|
|
6762
|
+
error: (message: ReactNode, options?: ToastOptions) => string;
|
|
6763
|
+
warning: (message: ReactNode, options?: ToastOptions) => string;
|
|
6764
|
+
info: (message: ReactNode, options?: ToastOptions) => string;
|
|
6765
|
+
loading: (message: ReactNode, options?: ToastOptions) => string;
|
|
6766
|
+
/** Close one toast, or every toast without an id. */
|
|
6767
|
+
dismiss: (id?: string) => void;
|
|
6768
|
+
/** Change a toast in place (message, kind, description, duration, action). */
|
|
6769
|
+
update: (id: string, patch: Partial<Omit<ToastRecord, 'id' | 'version'>>) => void;
|
|
6770
|
+
/** A loading toast that turns into success or error when the promise settles. Returns the promise. */
|
|
6771
|
+
promise: <T>(promise: Promise<T>, messages: ToastPromiseMessages<T>, options?: ToastOptions) => Promise<T>;
|
|
6772
|
+
/**
|
|
6773
|
+
* An optimistic action with an Undo button (TENSOR C2 `useUndoableAction`): `onCommit` runs
|
|
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.
|
|
6776
|
+
*/
|
|
6777
|
+
undoable: (message: ReactNode, options: UndoableToastOptions) => string;
|
|
6778
|
+
/**
|
|
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.
|
|
6782
|
+
*/
|
|
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;
|
|
4503
6786
|
}
|
|
4504
|
-
/**
|
|
4505
|
-
declare function
|
|
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;
|
|
4506
6791
|
|
|
4507
|
-
type
|
|
4508
|
-
|
|
4509
|
-
|
|
4510
|
-
|
|
4511
|
-
|
|
4512
|
-
|
|
4513
|
-
|
|
6792
|
+
type ToastTone = 'success' | 'danger' | 'info' | 'warning';
|
|
6793
|
+
interface ToastProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
|
|
6794
|
+
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
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;
|
|
6804
|
+
}
|
|
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;
|
|
4514
6809
|
/**
|
|
4515
|
-
*
|
|
4516
|
-
*
|
|
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.
|
|
4517
6812
|
*/
|
|
4518
|
-
|
|
4519
|
-
|
|
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';
|
|
4520
6818
|
children?: ReactNode;
|
|
4521
6819
|
}
|
|
4522
|
-
declare function
|
|
6820
|
+
declare function Toaster({ children, regionLabel: regionLabelProp, store, limit, position, className, onMouseEnter, onMouseLeave, onFocus, onBlur, onKeyDown, ...props }: ToasterProps): react.JSX.Element;
|
|
4523
6821
|
|
|
4524
6822
|
interface ProgressProps extends HTMLAttributes<HTMLDivElement> {
|
|
4525
6823
|
/** 0..max. Ignored when `indeterminate`. */
|
|
@@ -4553,8 +6851,15 @@ interface MeterProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
4553
6851
|
declare function Meter({ value, tone, label, toneLabels, className, ...props }: MeterProps): react.JSX.Element;
|
|
4554
6852
|
|
|
4555
6853
|
interface StatTrend {
|
|
6854
|
+
/** Which way the figure moved: the arrow, and the spoken "up" / "down". */
|
|
4556
6855
|
direction: 'up' | 'down';
|
|
4557
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';
|
|
4558
6863
|
}
|
|
4559
6864
|
interface StatProps extends HTMLAttributes<HTMLElement> {
|
|
4560
6865
|
label: ReactNode;
|
|
@@ -4565,7 +6870,10 @@ interface StatProps extends HTMLAttributes<HTMLElement> {
|
|
|
4565
6870
|
meta?: ReactNode;
|
|
4566
6871
|
/** Trend chip rendered before the meta text. */
|
|
4567
6872
|
trend?: StatTrend;
|
|
4568
|
-
/**
|
|
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
|
+
*/
|
|
4569
6877
|
tone?: 'neutral' | 'warning' | 'danger';
|
|
4570
6878
|
/** `hero` (default) is today's KPI size; `compact` is for dense fact bands. */
|
|
4571
6879
|
size?: 'hero' | 'compact';
|
|
@@ -4598,7 +6906,8 @@ interface StatProps extends HTMLAttributes<HTMLElement> {
|
|
|
4598
6906
|
/**
|
|
4599
6907
|
* Makes the whole tile a link (HAR-1350; TENSOR B7, MOTUS B-A7). Server-renderable, unlike
|
|
4600
6908
|
* `onActivate`. Ignored when `onActivate` is set. The forwarded ref reaches the `<a>` only
|
|
4601
|
-
* 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).
|
|
4602
6911
|
*/
|
|
4603
6912
|
href?: string;
|
|
4604
6913
|
/** The link tile is the current page (`aria-current="page"`). */
|
|
@@ -4611,6 +6920,20 @@ interface StatProps extends HTMLAttributes<HTMLElement> {
|
|
|
4611
6920
|
* ref then points at that button, so a popover can anchor to it.
|
|
4612
6921
|
*/
|
|
4613
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;
|
|
4614
6937
|
|
|
4615
6938
|
type InsightStatusTone = 'ok' | 'warning' | 'critical' | 'unknown';
|
|
4616
6939
|
interface InsightStatus {
|
|
@@ -4827,10 +7150,11 @@ interface TooltipProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'content'>
|
|
|
4827
7150
|
placement?: Placement;
|
|
4828
7151
|
/**
|
|
4829
7152
|
* The trigger's keyboard shortcut, in `KbdCombo` key names, e.g. `['Mod', 'K']` (HAR-2031):
|
|
4830
|
-
* shown with `Kbd` after the text
|
|
4831
|
-
*
|
|
4832
|
-
*
|
|
4833
|
-
*
|
|
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.
|
|
4834
7158
|
*/
|
|
4835
7159
|
shortcut?: KeyShortcut;
|
|
4836
7160
|
children?: ReactNode;
|
|
@@ -4842,6 +7166,9 @@ interface TooltipProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'content'>
|
|
|
4842
7166
|
* (flip/shift), shown on hover and keyboard focus, dismissed on blur or Escape
|
|
4843
7167
|
* (document-level, per WCAG 1.4.13), and hoverable: the bubble stays open while
|
|
4844
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.
|
|
4845
7172
|
*/
|
|
4846
7173
|
declare function Tooltip({ label, content, placement, shortcut, className, children, ...props }: TooltipProps): react.JSX.Element;
|
|
4847
7174
|
|
|
@@ -4977,56 +7304,6 @@ interface LabelProps extends HTMLAttributes<HTMLSpanElement> {
|
|
|
4977
7304
|
/** Colored label / tag over `.uix-label`. */
|
|
4978
7305
|
declare function Label({ color, dot, children, className, style, ...props }: LabelProps): react.JSX.Element;
|
|
4979
7306
|
|
|
4980
|
-
/** Presence of a person (HAR-1374). Each state has its own shape as well as its own colour. */
|
|
4981
|
-
type AvatarPresence = 'online' | 'busy' | 'away' | 'offline';
|
|
4982
|
-
/** The words read for each presence state. English; pass translations as `presenceLabels`. */
|
|
4983
|
-
declare const DEFAULT_PRESENCE_LABELS: Record<AvatarPresence, string>;
|
|
4984
|
-
interface AvatarProps extends HTMLAttributes<HTMLSpanElement> {
|
|
4985
|
-
/** TENSOR RX-125 (UIX-04): translatable; English default. Still honoured for `online`. */
|
|
4986
|
-
onlineLabel?: string;
|
|
4987
|
-
size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl';
|
|
4988
|
-
src?: string;
|
|
4989
|
-
alt?: string;
|
|
4990
|
-
/** Initials / fallback shown when there is no `src`. */
|
|
4991
|
-
children?: ReactNode;
|
|
4992
|
-
/** Online status dot. The same as `presence="online"`; kept for existing callers. */
|
|
4993
|
-
status?: boolean;
|
|
4994
|
-
/**
|
|
4995
|
-
* A presence dot: `online` (filled green), `busy` (red with a bar), `away` (an amber ring),
|
|
4996
|
-
* `offline` (a grey ring). The state is also in visually hidden text, so it is never colour
|
|
4997
|
-
* alone.
|
|
4998
|
-
*/
|
|
4999
|
-
presence?: AvatarPresence;
|
|
5000
|
-
/** Translations of the presence words. */
|
|
5001
|
-
presenceLabels?: Partial<Record<AvatarPresence, string>>;
|
|
5002
|
-
}
|
|
5003
|
-
/** Avatar over `.uix-avatar`. Renders an image when `src` is set, else children (initials). */
|
|
5004
|
-
declare function Avatar({ size, src, alt, children, status, presence, presenceLabels, onlineLabel, className, ...props }: AvatarProps): react.JSX.Element;
|
|
5005
|
-
interface PresenceDotProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {
|
|
5006
|
-
presence: AvatarPresence;
|
|
5007
|
-
/**
|
|
5008
|
-
* The state in words for assistive technology. Default: the English word. Pass `null` when
|
|
5009
|
-
* the state is already written next to the dot, to make the dot decorative.
|
|
5010
|
-
*/
|
|
5011
|
-
label?: string | null;
|
|
5012
|
-
}
|
|
5013
|
-
/** The presence dot on its own, for a row or a menu that shows no avatar (HAR-1374). */
|
|
5014
|
-
declare function PresenceDot({ presence, label, className, ...props }: PresenceDotProps): react.JSX.Element;
|
|
5015
|
-
interface AvatarGroupProps extends HTMLAttributes<HTMLSpanElement> {
|
|
5016
|
-
children?: ReactNode;
|
|
5017
|
-
}
|
|
5018
|
-
/** Overlapping avatar stack over `.uix-avatar-group`. */
|
|
5019
|
-
declare function AvatarGroup({ children, className, ...props }: AvatarGroupProps): react.JSX.Element;
|
|
5020
|
-
interface UserChipProps extends HTMLAttributes<HTMLSpanElement> {
|
|
5021
|
-
/** Usually an `<Avatar />`. */
|
|
5022
|
-
avatar?: ReactNode;
|
|
5023
|
-
name?: ReactNode;
|
|
5024
|
-
/** Secondary line (role, email). */
|
|
5025
|
-
sub?: ReactNode;
|
|
5026
|
-
}
|
|
5027
|
-
/** Avatar + name (+ optional sub-line) over `.uix-user-chip`. */
|
|
5028
|
-
declare function UserChip({ avatar, name, sub, className, children, ...props }: UserChipProps): react.JSX.Element;
|
|
5029
|
-
|
|
5030
7307
|
interface CommentsProps extends HTMLAttributes<HTMLDivElement> {
|
|
5031
7308
|
children?: ReactNode;
|
|
5032
7309
|
}
|
|
@@ -5113,6 +7390,52 @@ interface BusyRegionProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
5113
7390
|
*/
|
|
5114
7391
|
declare function BusyRegion({ busy, className, children, ...props }: BusyRegionProps): react.JSX.Element;
|
|
5115
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;
|
|
7438
|
+
|
|
5116
7439
|
interface ComposerProps extends HTMLAttributes<HTMLDivElement> {
|
|
5117
7440
|
children?: ReactNode;
|
|
5118
7441
|
/** Accessible name for the child `<textarea>`; applied as its `aria-label`. */
|
|
@@ -5152,8 +7475,15 @@ interface SegmentedProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'
|
|
|
5152
7475
|
* toggle bar. `'radio'`: `role="radiogroup"` of `role="radio"` with `aria-checked`, for a
|
|
5153
7476
|
* setting with exactly one value (theme, density, language). Name the group with
|
|
5154
7477
|
* `aria-label` or `aria-labelledby` in either mode. The keyboard model is the same in both.
|
|
5155
|
-
|
|
5156
|
-
|
|
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;
|
|
5157
7487
|
children?: ReactNode;
|
|
5158
7488
|
}
|
|
5159
7489
|
/**
|
|
@@ -5167,9 +7497,13 @@ interface SegmentedProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'
|
|
|
5167
7497
|
* enabled option and select it, wrapping at the ends; Home and End jump; Left/Right swap in
|
|
5168
7498
|
* a right-to-left group. Before 2.32.0 every option was its own tab stop.
|
|
5169
7499
|
*/
|
|
5170
|
-
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;
|
|
5171
7501
|
interface SegmentedOptionProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'onChange'> {
|
|
5172
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;
|
|
5173
7507
|
children?: ReactNode;
|
|
5174
7508
|
}
|
|
5175
7509
|
/**
|
|
@@ -5178,147 +7512,30 @@ interface SegmentedOptionProps extends Omit<ButtonHTMLAttributes<HTMLButtonEleme
|
|
|
5178
7512
|
* `.uix-segmented__option[aria-pressed="true"]` (or `[aria-checked="true"]` in a
|
|
5179
7513
|
* `selection="radio"` group).
|
|
5180
7514
|
*/
|
|
5181
|
-
declare function SegmentedOption({ value, children, className, onClick, ...props }: SegmentedOptionProps): react.JSX.Element;
|
|
5182
|
-
|
|
5183
|
-
|
|
5184
|
-
|
|
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". */
|
|
5185
7520
|
label: ReactNode;
|
|
5186
|
-
|
|
5187
|
-
|
|
5188
|
-
/** Always shown (e.g. the record id): the row has no checkbox and no Hide / Show, its name sits in the checkbox's slot. */
|
|
5189
|
-
required?: boolean;
|
|
5190
|
-
/** Plain-text name for the `{label}` templates in `columnLabels` when `label` is not a string. */
|
|
5191
|
-
textLabel?: string;
|
|
5192
|
-
}
|
|
5193
|
-
/**
|
|
5194
|
-
* Words for the column rows. `{label}` is replaced by the column name; `moved` also gets
|
|
5195
|
-
* `{position}` and `{count}`. Every key has an English default.
|
|
5196
|
-
*/
|
|
5197
|
-
interface ViewMenuColumnLabels {
|
|
5198
|
-
/** Name of a row's ⋯ menu button and of the menu. Default `Column actions: {label}`. */
|
|
5199
|
-
rowActions: string;
|
|
5200
|
-
/** Name of a row's drag grip. Default `Drag to reorder: {label}`. */
|
|
5201
|
-
reorder: string;
|
|
5202
|
-
moveUp: string;
|
|
5203
|
-
moveDown: string;
|
|
5204
|
-
hide: string;
|
|
5205
|
-
show: string;
|
|
5206
|
-
/** Tooltip on a required column's name. Default `Always shown`. */
|
|
5207
|
-
required: string;
|
|
5208
|
-
/** Polite announcement after a move. Default `{label} moved to position {position} of {count}`. */
|
|
5209
|
-
moved: string;
|
|
5210
|
-
}
|
|
5211
|
-
interface ViewMenuProps {
|
|
5212
|
-
/** The density section renders when `densityOptions` and `onDensityChange` are given. */
|
|
5213
|
-
density?: string;
|
|
5214
|
-
densityLabel?: ReactNode;
|
|
5215
|
-
densityOptions?: readonly {
|
|
5216
|
-
value: string;
|
|
5217
|
-
label: ReactNode;
|
|
5218
|
-
}[];
|
|
5219
|
-
onDensityChange?: (value: string) => void;
|
|
5220
|
-
/** Optional title over the zebra / freeze switches. */
|
|
5221
|
-
displayLabel?: ReactNode;
|
|
5222
|
-
zebra?: {
|
|
5223
|
-
checked: boolean;
|
|
5224
|
-
label: ReactNode;
|
|
5225
|
-
onChange: (checked: boolean) => void;
|
|
5226
|
-
};
|
|
5227
|
-
freeze?: {
|
|
5228
|
-
checked: boolean;
|
|
5229
|
-
label: ReactNode;
|
|
5230
|
-
onChange: (checked: boolean) => void;
|
|
5231
|
-
};
|
|
5232
|
-
columns?: readonly ViewMenuColumn[];
|
|
5233
|
-
columnsLabel?: ReactNode;
|
|
5234
|
-
onColumnVisibilityChange?: (id: string, visible: boolean) => void;
|
|
5235
|
-
/**
|
|
5236
|
-
* Turns on reordering: every column row gets a drag grip (pointer; ArrowUp / ArrowDown once
|
|
5237
|
-
* focused) and a ⋯ menu with Move up · Move down · Hide / Show, which is the keyboard path.
|
|
5238
|
-
* Receives every column id, first to last. The order is the application's to persist.
|
|
5239
|
-
*/
|
|
5240
|
-
onReorder?: (orderedIds: string[]) => void;
|
|
5241
|
-
columnLabels?: Partial<ViewMenuColumnLabels>;
|
|
5242
|
-
/** Pinned under the columns, e.g. a Reset sort `.uix-menu__item` button. */
|
|
5243
|
-
footer?: ReactNode;
|
|
5244
|
-
className?: string;
|
|
7521
|
+
/** This page in that language. */
|
|
7522
|
+
href: string;
|
|
5245
7523
|
}
|
|
5246
|
-
|
|
5247
|
-
|
|
5248
|
-
|
|
5249
|
-
|
|
5250
|
-
|
|
5251
|
-
|
|
5252
|
-
interface FilterOption {
|
|
5253
|
-
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". */
|
|
5254
7530
|
label: string;
|
|
7531
|
+
/** Renders each link with your router (locale-aware links keep client navigation). */
|
|
7532
|
+
renderLink?: UixRenderLink;
|
|
5255
7533
|
}
|
|
5256
|
-
interface FilterPopoverProps {
|
|
5257
|
-
label: ReactNode;
|
|
5258
|
-
type?: 'text' | 'number' | 'date' | 'select' | 'enum' | 'boolean';
|
|
5259
|
-
value: string;
|
|
5260
|
-
onValueChange: (value: string) => void;
|
|
5261
|
-
options?: readonly FilterOption[];
|
|
5262
|
-
applyLabel: ReactNode;
|
|
5263
|
-
clearLabel: ReactNode;
|
|
5264
|
-
onApply: () => void;
|
|
5265
|
-
onClear: () => void;
|
|
5266
|
-
placeholder?: string;
|
|
5267
|
-
}
|
|
5268
|
-
/** Controlled filter editor content; applications own query serialization and the popover trigger. */
|
|
5269
|
-
declare function FilterPopover({ label, type, value, onValueChange, options, applyLabel, clearLabel, onApply, onClear, placeholder }: FilterPopoverProps): react.JSX.Element;
|
|
5270
|
-
interface SavedViewItem {
|
|
5271
|
-
id: string;
|
|
5272
|
-
label: ReactNode;
|
|
5273
|
-
active?: boolean;
|
|
5274
|
-
pinned?: boolean;
|
|
5275
|
-
}
|
|
5276
|
-
/** A titled group of saved views, e.g. the user's custom views above the built-in presets. */
|
|
5277
|
-
interface SavedViewSection {
|
|
5278
|
-
id: string;
|
|
5279
|
-
label: ReactNode;
|
|
5280
|
-
items: readonly SavedViewItem[];
|
|
5281
|
-
}
|
|
5282
|
-
interface SavedViewMenuBaseProps {
|
|
5283
|
-
onSelect: (id: string) => void;
|
|
5284
|
-
emptyLabel?: ReactNode;
|
|
5285
|
-
/** 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. */
|
|
5286
|
-
actions?: (item: SavedViewItem) => ReactNode;
|
|
5287
|
-
footer?: ReactNode;
|
|
5288
|
-
}
|
|
5289
|
-
type SavedViewMenuProps = SavedViewMenuBaseProps & ({
|
|
5290
|
-
items: readonly SavedViewItem[];
|
|
5291
|
-
sections?: never;
|
|
5292
|
-
} | {
|
|
5293
|
-
sections: readonly SavedViewSection[];
|
|
5294
|
-
items?: never;
|
|
5295
|
-
}) & ({
|
|
5296
|
-
onPinChange: (id: string, pinned: boolean) => void;
|
|
5297
|
-
pinLabel: string;
|
|
5298
|
-
unpinLabel: string;
|
|
5299
|
-
} | {
|
|
5300
|
-
onPinChange?: undefined;
|
|
5301
|
-
pinLabel?: never;
|
|
5302
|
-
unpinLabel?: never;
|
|
5303
|
-
}) & ({
|
|
5304
|
-
/**
|
|
5305
|
-
* Adds a drag grip to every row. Rows move only within their own section; the
|
|
5306
|
-
* callback receives that section's full id order (and its id when `sections` is used).
|
|
5307
|
-
* The grip also moves its row with ArrowUp / ArrowDown.
|
|
5308
|
-
*/
|
|
5309
|
-
onReorder: (orderedIds: string[], sectionId: string | undefined) => void;
|
|
5310
|
-
/** Accessible name of the grip; the row's name is attached as its description. */
|
|
5311
|
-
reorderLabel: string;
|
|
5312
|
-
} | {
|
|
5313
|
-
onReorder?: undefined;
|
|
5314
|
-
reorderLabel?: never;
|
|
5315
|
-
});
|
|
5316
7534
|
/**
|
|
5317
|
-
*
|
|
5318
|
-
*
|
|
5319
|
-
* 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.
|
|
5320
7537
|
*/
|
|
5321
|
-
declare function
|
|
7538
|
+
declare function LocaleSwitcher({ locales, current, label, renderLink, ...props }: LocaleSwitcherProps): react.JSX.Element;
|
|
5322
7539
|
|
|
5323
7540
|
interface TimelineProps extends HTMLAttributes<HTMLOListElement> {
|
|
5324
7541
|
children?: ReactNode;
|
|
@@ -5557,6 +7774,47 @@ interface MenuGroupProps {
|
|
|
5557
7774
|
declare function MenuGroup({ label, children }: MenuGroupProps): react.JSX.Element;
|
|
5558
7775
|
declare function MenuSeparator(): react.JSX.Element;
|
|
5559
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
|
+
|
|
5560
7818
|
interface CommandPaletteProps extends HTMLAttributes<HTMLDivElement> {
|
|
5561
7819
|
/** TENSOR RX-125 (UIX-04): translatable; English default. */
|
|
5562
7820
|
inputLabel?: string;
|
|
@@ -5568,6 +7826,40 @@ interface CommandPaletteProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
5568
7826
|
/** Props for the search input (value/onChange/placeholder wired by the consumer). */
|
|
5569
7827
|
inputProps?: InputHTMLAttributes<HTMLInputElement>;
|
|
5570
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;
|
|
5571
7863
|
}
|
|
5572
7864
|
/**
|
|
5573
7865
|
* ⌘K command palette surface over `.uix-cmdk`. Presentational: mount it inside a
|
|
@@ -5579,7 +7871,7 @@ interface CommandPaletteProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
5579
7871
|
* popover it sits in `[data-uix-instant]`: it opens and closes with no animation, without the
|
|
5580
7872
|
* consumer knowing the attribute (or the older `data-uix-cmdk-dialog`).
|
|
5581
7873
|
*/
|
|
5582
|
-
declare function CommandPalette(
|
|
7874
|
+
declare function CommandPalette(props: CommandPaletteProps): react.JSX.Element;
|
|
5583
7875
|
interface CommandGroupProps {
|
|
5584
7876
|
label?: ReactNode;
|
|
5585
7877
|
children?: ReactNode;
|
|
@@ -5752,9 +8044,16 @@ interface SectionHeadProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'>
|
|
|
5752
8044
|
helpLabel?: string;
|
|
5753
8045
|
/** Right-aligned slot — a `.uix-section-link` anchor, a button, a pill. */
|
|
5754
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';
|
|
5755
8054
|
}
|
|
5756
8055
|
/** Section head — title row (+ optional `help` ?) with an optional trailing action (`.uix-section-head`). */
|
|
5757
|
-
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;
|
|
5758
8057
|
interface NoticeQueueProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
|
|
5759
8058
|
/** Leading icon slot. */
|
|
5760
8059
|
icon?: ReactNode;
|
|
@@ -5891,9 +8190,22 @@ interface EventRowProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
|
|
|
5891
8190
|
day: ReactNode;
|
|
5892
8191
|
title: ReactNode;
|
|
5893
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;
|
|
5894
8206
|
}
|
|
5895
|
-
/** Event row — date block + title/meta (`.uix-event-row`). */
|
|
5896
|
-
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;
|
|
5897
8209
|
interface StatusRowProps extends HTMLAttributes<HTMLDivElement> {
|
|
5898
8210
|
/** Leading indicator slot (e.g. a `.uix-dot`). */
|
|
5899
8211
|
indicator?: ReactNode;
|
|
@@ -5999,11 +8311,63 @@ declare function joinDateTime(date: string | null, time: string, fallbackTime?:
|
|
|
5999
8311
|
/** The short name of `timeZone` on that day ("CEST", "GMT+2"), for the label beside a time. */
|
|
6000
8312
|
declare function timeZoneName(timeZone: string, date: string | null, locale?: string | readonly string[]): string;
|
|
6001
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';
|
|
6002
8364
|
interface RelationshipGraphNode {
|
|
6003
8365
|
id: string;
|
|
6004
8366
|
label: string;
|
|
6005
8367
|
type?: string;
|
|
6006
8368
|
description?: string;
|
|
8369
|
+
/** Layered layout: the node's border and edge mark take this tone (HAR-1639). */
|
|
8370
|
+
tone?: RelationshipGraphTone;
|
|
6007
8371
|
x?: number;
|
|
6008
8372
|
y?: number;
|
|
6009
8373
|
/** Layered layout: the node's column. Omitted → BFS distance from the root along source→target. */
|
|
@@ -6021,6 +8385,18 @@ interface RelationshipGraphEdge {
|
|
|
6021
8385
|
arrow?: RelationshipGraphArrow;
|
|
6022
8386
|
/** Layered layout: always draw this edge's label, whatever the label policy. */
|
|
6023
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;
|
|
6024
8400
|
}
|
|
6025
8401
|
interface PositionedRelationshipNode extends RelationshipGraphNode {
|
|
6026
8402
|
x: number;
|
|
@@ -6036,7 +8412,12 @@ declare function boundRelationshipGraph(nodes: RelationshipGraphNode[], edges: R
|
|
|
6036
8412
|
declare function relationshipNeighbors(nodeId: string, edges: RelationshipGraphEdge[]): string[];
|
|
6037
8413
|
declare function layoutRelationshipGraph(nodes: RelationshipGraphNode[], edges: RelationshipGraphEdge[], rootId?: string): PositionedRelationshipNode[];
|
|
6038
8414
|
declare function traverseRelationshipNode(nodes: RelationshipGraphNode[], currentId: string | undefined, direction: -1 | 1): string | undefined;
|
|
6039
|
-
|
|
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';
|
|
6040
8421
|
interface LayeredLayoutOptions {
|
|
6041
8422
|
rootId?: string;
|
|
6042
8423
|
/** Minimum sibling group size that collapses into a cluster. Default 6; 0 disables. */
|
|
@@ -6071,7 +8452,7 @@ interface LayeredItem {
|
|
|
6071
8452
|
children: string[];
|
|
6072
8453
|
/** Set on the first member of an expanded cluster: the group its collapse control belongs to. */
|
|
6073
8454
|
expandedGroup?: RelationshipGraphCluster;
|
|
6074
|
-
/** True when a
|
|
8455
|
+
/** True when a cycle edge touches this node (HAR-1639: no longer set by skip, lateral or back edges). */
|
|
6075
8456
|
inCycle: boolean;
|
|
6076
8457
|
/** Edges (any kind) touching this item. */
|
|
6077
8458
|
degree: number;
|
|
@@ -6088,6 +8469,10 @@ interface RoutedEdge {
|
|
|
6088
8469
|
label?: string;
|
|
6089
8470
|
arrow: RelationshipGraphArrow;
|
|
6090
8471
|
emphasis: boolean;
|
|
8472
|
+
/** The first underlying edge's `variant`, `tone` and `description`. */
|
|
8473
|
+
variant: 'solid' | 'dashed';
|
|
8474
|
+
tone?: RelationshipGraphTone;
|
|
8475
|
+
description?: string;
|
|
6091
8476
|
path: string;
|
|
6092
8477
|
labelX: number;
|
|
6093
8478
|
labelY: number;
|
|
@@ -6097,6 +8482,17 @@ interface RoutedEdge {
|
|
|
6097
8482
|
arrowAngle: number;
|
|
6098
8483
|
/** Label policy `auto` shows this label without interaction. */
|
|
6099
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;
|
|
6100
8496
|
/** The label wrapped to fit the column gap (at most two lines). */
|
|
6101
8497
|
labelLines: string[];
|
|
6102
8498
|
}
|
|
@@ -6105,6 +8501,11 @@ interface LayeredColumn {
|
|
|
6105
8501
|
x: number;
|
|
6106
8502
|
/** Underlying nodes in the column, cluster members included. */
|
|
6107
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;
|
|
6108
8509
|
}
|
|
6109
8510
|
interface LayeredLayout {
|
|
6110
8511
|
rootId: string | undefined;
|
|
@@ -6136,6 +8537,37 @@ declare function classifyLayeredEdges(nodes: RelationshipGraphNode[], edges: Rel
|
|
|
6136
8537
|
declare function clusterIdFor(parentId: string, type: string | undefined, edgeType: string | undefined): string;
|
|
6137
8538
|
/** Layered, clustered, crossing-reduced layout for `RelationshipGraph layout="layered"`. */
|
|
6138
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>;
|
|
6139
8571
|
type LayeredNavigationKey = 'ArrowUp' | 'ArrowDown' | 'ArrowLeft' | 'ArrowRight' | 'Home' | 'End';
|
|
6140
8572
|
/** Keyboard traversal over a layered layout: ←/→ along forward edges, ↑/↓ within a column. */
|
|
6141
8573
|
declare function layeredNeighbor(layout: LayeredLayout, currentId: string | undefined, key: LayeredNavigationKey): string | undefined;
|
|
@@ -6143,6 +8575,12 @@ declare function layeredNeighbor(layout: LayeredLayout, currentId: string | unde
|
|
|
6143
8575
|
interface RelationshipGraphLegendItem {
|
|
6144
8576
|
id: string;
|
|
6145
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';
|
|
6146
8584
|
}
|
|
6147
8585
|
/** Every visible or announced string. Pass translations; English defaults fill the gaps. */
|
|
6148
8586
|
interface RelationshipGraphLabels {
|
|
@@ -6175,7 +8613,17 @@ interface RelationshipGraphLabels {
|
|
|
6175
8613
|
graphSummary: (nodes: number, edges: number) => string;
|
|
6176
8614
|
relationship: string;
|
|
6177
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. */
|
|
6178
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;
|
|
6179
8627
|
noConnections: string;
|
|
6180
8628
|
expandNeighbors: string;
|
|
6181
8629
|
openDetails: string;
|
|
@@ -6192,6 +8640,10 @@ interface RelationshipGraphLabels {
|
|
|
6192
8640
|
retry: string;
|
|
6193
8641
|
emptyTitle: string;
|
|
6194
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;
|
|
6195
8647
|
}
|
|
6196
8648
|
declare const DEFAULT_RELATIONSHIP_GRAPH_LABELS: RelationshipGraphLabels;
|
|
6197
8649
|
interface RelationshipGraphProps {
|
|
@@ -6258,91 +8710,21 @@ interface RelationshipGraphProps {
|
|
|
6258
8710
|
/** Layered: controlled roving focus. */
|
|
6259
8711
|
focusId?: string;
|
|
6260
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;
|
|
6261
8724
|
}
|
|
6262
8725
|
/** Bounded, deterministic SVG relationship view with an equivalent accessible list. */
|
|
6263
8726
|
declare function RelationshipGraph(props: RelationshipGraphProps): react.JSX.Element;
|
|
6264
8727
|
|
|
6265
|
-
interface MatchReviewField {
|
|
6266
|
-
id: string;
|
|
6267
|
-
label: string;
|
|
6268
|
-
render?: (value: JsonValue | undefined, record: Record<string, JsonValue>) => ReactNode;
|
|
6269
|
-
}
|
|
6270
|
-
interface MatchReviewCandidate {
|
|
6271
|
-
id: string;
|
|
6272
|
-
record: Record<string, JsonValue>;
|
|
6273
|
-
confidence?: number;
|
|
6274
|
-
status?: 'pending' | 'resolved';
|
|
6275
|
-
decision?: 'accepted' | 'dismissed' | 'split' | 'other';
|
|
6276
|
-
}
|
|
6277
|
-
type MatchReviewAction = 'accept' | 'dismiss' | 'split' | 'pick-other';
|
|
6278
|
-
interface MatchBulkResult {
|
|
6279
|
-
succeeded: number;
|
|
6280
|
-
failed?: number;
|
|
6281
|
-
}
|
|
6282
|
-
/**
|
|
6283
|
-
* Every word the match review renders or announces (TENSOR RX-125, UIX-12). Plural
|
|
6284
|
-
* pairs are `…One` / `…Many`; `{count}`, `{pending}`, `{total}`, `{id}` are placeholders.
|
|
6285
|
-
*/
|
|
6286
|
-
interface MatchReviewLabels {
|
|
6287
|
-
region: string;
|
|
6288
|
-
loading: string;
|
|
6289
|
-
retry: string;
|
|
6290
|
-
empty: string;
|
|
6291
|
-
emptyDetail: string;
|
|
6292
|
-
pendingOf: string;
|
|
6293
|
-
bulk: string;
|
|
6294
|
-
selectedCount: string;
|
|
6295
|
-
applying: string;
|
|
6296
|
-
acceptSelected: string;
|
|
6297
|
-
dismissSelected: string;
|
|
6298
|
-
caption: string;
|
|
6299
|
-
select: string;
|
|
6300
|
-
confidence: string;
|
|
6301
|
-
status: string;
|
|
6302
|
-
actions: string;
|
|
6303
|
-
selectCandidate: string;
|
|
6304
|
-
notScored: string;
|
|
6305
|
-
resolved: string;
|
|
6306
|
-
pending: string;
|
|
6307
|
-
decisionAccepted: string;
|
|
6308
|
-
decisionDismissed: string;
|
|
6309
|
-
decisionSplit: string;
|
|
6310
|
-
decisionOther: string;
|
|
6311
|
-
accept: string;
|
|
6312
|
-
dismiss: string;
|
|
6313
|
-
split: string;
|
|
6314
|
-
pickOther: string;
|
|
6315
|
-
acceptingOne: string;
|
|
6316
|
-
acceptingMany: string;
|
|
6317
|
-
dismissingOne: string;
|
|
6318
|
-
dismissingMany: string;
|
|
6319
|
-
acceptedOne: string;
|
|
6320
|
-
acceptedMany: string;
|
|
6321
|
-
dismissedOne: string;
|
|
6322
|
-
dismissedMany: string;
|
|
6323
|
-
failedSuffix: string;
|
|
6324
|
-
bulkAcceptFailed: string;
|
|
6325
|
-
bulkDismissFailed: string;
|
|
6326
|
-
}
|
|
6327
|
-
declare const DEFAULT_MATCH_REVIEW_LABELS: MatchReviewLabels;
|
|
6328
|
-
interface MatchReviewProps {
|
|
6329
|
-
incoming: Record<string, JsonValue>;
|
|
6330
|
-
incomingLabel?: string;
|
|
6331
|
-
fields: MatchReviewField[];
|
|
6332
|
-
candidates: MatchReviewCandidate[];
|
|
6333
|
-
selectedIds?: Set<string>;
|
|
6334
|
-
onSelectionChange?: (ids: Set<string>) => void;
|
|
6335
|
-
onDecision: (candidateId: string, action: MatchReviewAction) => void;
|
|
6336
|
-
onBulkDecision?: (candidateIds: string[], action: Extract<MatchReviewAction, 'accept' | 'dismiss'>) => void | MatchBulkResult | Promise<void | MatchBulkResult>;
|
|
6337
|
-
loading?: boolean;
|
|
6338
|
-
error?: string;
|
|
6339
|
-
onRetry?: () => void;
|
|
6340
|
-
className?: string;
|
|
6341
|
-
labels?: Partial<MatchReviewLabels>;
|
|
6342
|
-
}
|
|
6343
|
-
/** Generic descriptor-driven incoming-record to candidate-match decision surface. */
|
|
6344
|
-
declare function MatchReview({ incoming, incomingLabel, fields, candidates, selectedIds, onSelectionChange, onDecision, onBulkDecision, loading, error, onRetry, className, labels: labelOverrides, }: MatchReviewProps): react.JSX.Element;
|
|
6345
|
-
|
|
6346
8728
|
interface MetricInputProps {
|
|
6347
8729
|
value: number | null;
|
|
6348
8730
|
onValueChange: (value: number | null) => void;
|
|
@@ -6460,84 +8842,6 @@ declare function BrandProfileEditor({ value, onChange, profiles, onSelectProfile
|
|
|
6460
8842
|
/** Canonical Phase 46.9 export; equivalent to BrandProfileEditor. */
|
|
6461
8843
|
declare const BrandProfiles: typeof BrandProfileEditor;
|
|
6462
8844
|
|
|
6463
|
-
type DiffKind = 'added' | 'removed' | 'changed' | 'conflicted';
|
|
6464
|
-
type DiffResolution = 'accept' | 'skip' | 'pending';
|
|
6465
|
-
interface DiffEntry {
|
|
6466
|
-
path: string;
|
|
6467
|
-
kind: DiffKind;
|
|
6468
|
-
base?: JsonValue;
|
|
6469
|
-
current?: JsonValue;
|
|
6470
|
-
incoming?: JsonValue;
|
|
6471
|
-
}
|
|
6472
|
-
interface DiffSummary {
|
|
6473
|
-
added: number;
|
|
6474
|
-
removed: number;
|
|
6475
|
-
changed: number;
|
|
6476
|
-
conflicted: number;
|
|
6477
|
-
resolved: number;
|
|
6478
|
-
pending: number;
|
|
6479
|
-
}
|
|
6480
|
-
declare function buildThreeWayDiff(base: JsonValue | undefined, current: JsonValue | undefined, incoming: JsonValue | undefined, path?: string): DiffEntry[];
|
|
6481
|
-
declare function summarizeDiff(entries: DiffEntry[], resolutions?: Record<string, DiffResolution>): DiffSummary;
|
|
6482
|
-
|
|
6483
|
-
/**
|
|
6484
|
-
* Every word the diff viewer renders (TENSOR RX-125, UIX-12). `base` / `current` /
|
|
6485
|
-
* `incoming` keep their meaning from before; `{path}`, `{version}`, `{resolved}` and
|
|
6486
|
-
* `{total}` are placeholders.
|
|
6487
|
-
*
|
|
6488
|
-
* `acceptIncomingFor` / `keepCurrentFor` / `markPendingFor` are the accessible names of
|
|
6489
|
-
* the three action buttons, so a screen reader hears which entry each one resolves. Keep
|
|
6490
|
-
* the visible word inside the translated name (WCAG 2.5.3 Label in Name): speech-input
|
|
6491
|
-
* users say what they see.
|
|
6492
|
-
*/
|
|
6493
|
-
interface DiffViewerLabels {
|
|
6494
|
-
base: string;
|
|
6495
|
-
current: string;
|
|
6496
|
-
incoming: string;
|
|
6497
|
-
region: string;
|
|
6498
|
-
summary: string;
|
|
6499
|
-
noDifferences: string;
|
|
6500
|
-
noDifferencesDetail: string;
|
|
6501
|
-
conflicted: string;
|
|
6502
|
-
changed: string;
|
|
6503
|
-
added: string;
|
|
6504
|
-
removed: string;
|
|
6505
|
-
resolved: string;
|
|
6506
|
-
pending: string;
|
|
6507
|
-
valueFor: string;
|
|
6508
|
-
resolve: string;
|
|
6509
|
-
acceptIncoming: string;
|
|
6510
|
-
keepCurrent: string;
|
|
6511
|
-
markPending: string;
|
|
6512
|
-
acceptIncomingFor: string;
|
|
6513
|
-
keepCurrentFor: string;
|
|
6514
|
-
markPendingFor: string;
|
|
6515
|
-
resolutionAccept: string;
|
|
6516
|
-
resolutionSkip: string;
|
|
6517
|
-
resolutionPending: string;
|
|
6518
|
-
notPresent: string;
|
|
6519
|
-
progress: string;
|
|
6520
|
-
}
|
|
6521
|
-
declare const DEFAULT_DIFF_VIEWER_LABELS: DiffViewerLabels;
|
|
6522
|
-
interface DiffViewerProps {
|
|
6523
|
-
base?: JsonValue;
|
|
6524
|
-
current?: JsonValue;
|
|
6525
|
-
incoming?: JsonValue;
|
|
6526
|
-
entries?: DiffEntry[];
|
|
6527
|
-
resolutions?: Record<string, DiffResolution>;
|
|
6528
|
-
onResolutionChange?: (path: string, resolution: DiffResolution) => void;
|
|
6529
|
-
labels?: Partial<DiffViewerLabels>;
|
|
6530
|
-
/**
|
|
6531
|
-
* Height of the resolution buttons and the entry disclosure rows. `sm` (the default) is
|
|
6532
|
-
* the compact 28px kit size; `md` follows `--uix-control-h`, so a theme that sets its
|
|
6533
|
-
* own control height (for example 60px touch targets) gets it here too; `lg` is 44px.
|
|
6534
|
-
*/
|
|
6535
|
-
controlSize?: 'sm' | 'md' | 'lg';
|
|
6536
|
-
className?: string;
|
|
6537
|
-
}
|
|
6538
|
-
/** Three-way configuration diff with per-entry keyboard-operable resolution. */
|
|
6539
|
-
declare function DiffViewer({ base, current, incoming, entries: providedEntries, resolutions: controlledResolutions, onResolutionChange, labels: labelOverrides, controlSize, className, }: DiffViewerProps): react.JSX.Element;
|
|
6540
|
-
|
|
6541
8845
|
/**
|
|
6542
8846
|
* Every word the colour picker renders (TENSOR RX-125, UIX-12). `{label}`, `{color}`,
|
|
6543
8847
|
* `{ratio}` and `{minimum}` are placeholders; `sample` is the contrast preview text.
|
|
@@ -6593,4 +8897,4 @@ declare function hsvToHex(value: HsvColor): string;
|
|
|
6593
8897
|
declare function contrastRatio(background: string, foreground: string): number | undefined;
|
|
6594
8898
|
declare function meetsContrast(background: string, foreground: string, minimum?: number): boolean;
|
|
6595
8899
|
|
|
6596
|
-
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, 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, 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_BUTTON_RESULT_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, type DelayedPendingOptions, 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, PENDING_DELAY_MS, PENDING_MIN_VISIBLE_MS, 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, 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, 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, useDelayedPending, 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 };
|