@shortstravelmgmt/component-lib 0.2.9 → 0.2.12-rc.1
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/dist/index.d.ts +1585 -27
- package/dist/index.esm.js +9311 -643
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +9386 -659
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/styles.css.map +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,10 +1,938 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import React__default, { HTMLAttributes, ButtonHTMLAttributes, InputHTMLAttributes, SVGProps, TextareaHTMLAttributes, SelectHTMLAttributes,
|
|
2
|
+
import React__default, { CSSProperties, HTMLAttributes, ButtonHTMLAttributes, InputHTMLAttributes, ReactNode, SVGProps, TextareaHTMLAttributes, SelectHTMLAttributes, ElementType, ChangeEvent } from 'react';
|
|
3
3
|
|
|
4
|
-
|
|
4
|
+
/**
|
|
5
|
+
* STM Hub Design Tokens
|
|
6
|
+
* TypeScript implementation of the design system tokens
|
|
7
|
+
*
|
|
8
|
+
* These tokens are the single source of truth for all visual values.
|
|
9
|
+
* Components should use these tokens via the useTheme hook or css utility.
|
|
10
|
+
*/
|
|
11
|
+
declare const brandColors: {
|
|
12
|
+
readonly blue: "#15538C";
|
|
13
|
+
readonly blueDeep: "#0E3F6E";
|
|
14
|
+
readonly blueTint: "#E5EDF4";
|
|
15
|
+
};
|
|
16
|
+
declare const primaryColors: {
|
|
17
|
+
readonly primary: "#0A53EF";
|
|
18
|
+
readonly primaryDark: "#1A43D1";
|
|
19
|
+
readonly primaryLight: "#E6ECFB";
|
|
20
|
+
readonly primaryLightHover: "#DAE3F8";
|
|
21
|
+
};
|
|
22
|
+
declare const neutralColors: {
|
|
23
|
+
readonly basecolor: "#F5F5F5";
|
|
24
|
+
readonly subtle: "#EFF0F0";
|
|
25
|
+
readonly card: "#EFEFEF";
|
|
26
|
+
readonly cardalt: "#EBEBEC";
|
|
27
|
+
readonly secondary: "#E4E5E7";
|
|
28
|
+
readonly secondaryDark: "#DFE1E3";
|
|
29
|
+
readonly tableBorder: "#D5D5D5";
|
|
30
|
+
readonly border: "#EDEDED";
|
|
31
|
+
readonly borderDark: "#D5D5D5";
|
|
32
|
+
readonly white: "#FFFFFF";
|
|
33
|
+
};
|
|
34
|
+
declare const textColors: {
|
|
35
|
+
readonly ink: "#282828";
|
|
36
|
+
readonly charcoal: "#3F3F3F";
|
|
37
|
+
readonly slate: "#5C5C5C";
|
|
38
|
+
readonly stone: "#787878";
|
|
39
|
+
readonly pending: "#C7C7CA";
|
|
40
|
+
readonly error: "#940000";
|
|
41
|
+
};
|
|
42
|
+
declare const statusColors: {
|
|
43
|
+
readonly success: "#138660";
|
|
44
|
+
readonly warning: "#9F5500";
|
|
45
|
+
readonly gold: "#FFC179";
|
|
46
|
+
readonly error: "#940000";
|
|
47
|
+
};
|
|
48
|
+
declare const accentColors: {
|
|
49
|
+
readonly mint: "#37C3A4";
|
|
50
|
+
readonly forest: "#003E1B";
|
|
51
|
+
readonly forestLight: "#E2F0EC";
|
|
52
|
+
readonly tangerine: "#FE7C35";
|
|
53
|
+
readonly tangerineLight: "#FFE2C1";
|
|
54
|
+
};
|
|
55
|
+
declare const teamColors: {
|
|
56
|
+
readonly men: "#8AC6D9";
|
|
57
|
+
readonly women: "#FFA99A";
|
|
58
|
+
readonly mixed: "#D1C1C3";
|
|
59
|
+
};
|
|
60
|
+
declare const travelColors: {
|
|
61
|
+
readonly limoBackground: "#EDE9FE";
|
|
62
|
+
readonly limoForeground: "#7C3AED";
|
|
63
|
+
readonly busBackground: "#FEF3C7";
|
|
64
|
+
readonly busForeground: "#D97706";
|
|
65
|
+
};
|
|
66
|
+
declare const vendorColors: {
|
|
67
|
+
readonly DL: {
|
|
68
|
+
readonly bg: "#003366";
|
|
69
|
+
readonly fg: "#FFFFFF";
|
|
70
|
+
};
|
|
71
|
+
readonly AA: {
|
|
72
|
+
readonly bg: "#0078D2";
|
|
73
|
+
readonly fg: "#FFFFFF";
|
|
74
|
+
};
|
|
75
|
+
readonly UA: {
|
|
76
|
+
readonly bg: "#002244";
|
|
77
|
+
readonly fg: "#FFFFFF";
|
|
78
|
+
};
|
|
79
|
+
readonly WN: {
|
|
80
|
+
readonly bg: "#F9B612";
|
|
81
|
+
readonly fg: "#304CB2";
|
|
82
|
+
};
|
|
83
|
+
readonly B6: {
|
|
84
|
+
readonly bg: "#003876";
|
|
85
|
+
readonly fg: "#FFFFFF";
|
|
86
|
+
};
|
|
87
|
+
readonly AS: {
|
|
88
|
+
readonly bg: "#016191";
|
|
89
|
+
readonly fg: "#FFFFFF";
|
|
90
|
+
};
|
|
91
|
+
readonly F9: {
|
|
92
|
+
readonly bg: "#2D8B45";
|
|
93
|
+
readonly fg: "#FFFFFF";
|
|
94
|
+
};
|
|
95
|
+
readonly NK: {
|
|
96
|
+
readonly bg: "#FFC72C";
|
|
97
|
+
readonly fg: "#000000";
|
|
98
|
+
};
|
|
99
|
+
readonly G4: {
|
|
100
|
+
readonly bg: "#00386C";
|
|
101
|
+
readonly fg: "#FFFFFF";
|
|
102
|
+
};
|
|
103
|
+
readonly HA: {
|
|
104
|
+
readonly bg: "#660099";
|
|
105
|
+
readonly fg: "#FFFFFF";
|
|
106
|
+
};
|
|
107
|
+
};
|
|
108
|
+
declare const gradients: {
|
|
109
|
+
readonly avatar: "linear-gradient(135deg, #4F7FFF 0%, #4066E8 100%)";
|
|
110
|
+
};
|
|
111
|
+
declare const alertTokens: {
|
|
112
|
+
readonly primary: {
|
|
113
|
+
readonly fg: "#0A53EF";
|
|
114
|
+
readonly bg: "#E6ECFB";
|
|
115
|
+
readonly border: "#0A53EF";
|
|
116
|
+
};
|
|
117
|
+
readonly success: {
|
|
118
|
+
readonly fg: "#138660";
|
|
119
|
+
readonly bg: "#E2F0EC";
|
|
120
|
+
readonly border: "#138660";
|
|
121
|
+
};
|
|
122
|
+
readonly warning: {
|
|
123
|
+
readonly fg: "#9F5500";
|
|
124
|
+
readonly bg: "#FFE2C1";
|
|
125
|
+
readonly border: "#FE7C35";
|
|
126
|
+
};
|
|
127
|
+
readonly error: {
|
|
128
|
+
readonly fg: "#940000";
|
|
129
|
+
readonly bg: "#FEE2E2";
|
|
130
|
+
readonly border: "#940000";
|
|
131
|
+
};
|
|
132
|
+
};
|
|
133
|
+
declare const semanticColors: {
|
|
134
|
+
readonly fg: {
|
|
135
|
+
readonly 1: "#282828";
|
|
136
|
+
readonly 2: "#3F3F3F";
|
|
137
|
+
readonly 3: "#5C5C5C";
|
|
138
|
+
readonly 4: "#787878";
|
|
139
|
+
readonly disabled: "#C7C7CA";
|
|
140
|
+
readonly link: "#0A53EF";
|
|
141
|
+
readonly linkHover: "#1A43D1";
|
|
142
|
+
};
|
|
143
|
+
readonly bg: {
|
|
144
|
+
readonly page: "#F5F5F5";
|
|
145
|
+
readonly surface: "#FFFFFF";
|
|
146
|
+
readonly card: "#EFEFEF";
|
|
147
|
+
readonly subtle: "#EFF0F0";
|
|
148
|
+
};
|
|
149
|
+
};
|
|
150
|
+
declare const fontFamily: {
|
|
151
|
+
readonly base: "'Roboto Flex', system-ui, -apple-system, 'Segoe UI', sans-serif";
|
|
152
|
+
readonly display: "'Roboto Flex', system-ui, -apple-system, sans-serif";
|
|
153
|
+
readonly mono: "'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace";
|
|
154
|
+
};
|
|
155
|
+
declare const fontSize: {
|
|
156
|
+
readonly xs: "12px";
|
|
157
|
+
readonly sm: "14px";
|
|
158
|
+
readonly base: "16px";
|
|
159
|
+
readonly lg: "18px";
|
|
160
|
+
readonly xl: "20px";
|
|
161
|
+
readonly '2xl': "24px";
|
|
162
|
+
readonly '4xl': "36px";
|
|
163
|
+
};
|
|
164
|
+
declare const lineHeight: {
|
|
165
|
+
readonly xs: "16px";
|
|
166
|
+
readonly sm: "20px";
|
|
167
|
+
readonly base: "24px";
|
|
168
|
+
readonly lg: "28px";
|
|
169
|
+
readonly xl: "28px";
|
|
170
|
+
readonly '2xl': "32px";
|
|
171
|
+
readonly '4xl': "40px";
|
|
172
|
+
readonly tight: 1.25;
|
|
173
|
+
readonly normal: 1.5;
|
|
174
|
+
};
|
|
175
|
+
declare const fontWeight: {
|
|
176
|
+
readonly light: 300;
|
|
177
|
+
readonly regular: 400;
|
|
178
|
+
readonly medium: 500;
|
|
179
|
+
readonly semibold: 600;
|
|
180
|
+
readonly bold: 700;
|
|
181
|
+
};
|
|
182
|
+
declare const spacing: {
|
|
183
|
+
readonly 0: "0";
|
|
184
|
+
readonly '0.5': "2px";
|
|
185
|
+
readonly 1: "4px";
|
|
186
|
+
readonly '1.5': "6px";
|
|
187
|
+
readonly 2: "8px";
|
|
188
|
+
readonly 3: "12px";
|
|
189
|
+
readonly 4: "16px";
|
|
190
|
+
readonly 5: "20px";
|
|
191
|
+
readonly 6: "24px";
|
|
192
|
+
readonly 7: "28px";
|
|
193
|
+
readonly 8: "32px";
|
|
194
|
+
readonly 9: "36px";
|
|
195
|
+
readonly 10: "40px";
|
|
196
|
+
readonly 12: "48px";
|
|
197
|
+
readonly 16: "64px";
|
|
198
|
+
};
|
|
199
|
+
declare const radius: {
|
|
200
|
+
readonly sm: "2px";
|
|
201
|
+
readonly md: "4px";
|
|
202
|
+
readonly lg: "6px";
|
|
203
|
+
readonly xl: "8px";
|
|
204
|
+
readonly '2xl': "12px";
|
|
205
|
+
readonly '3xl': "16px";
|
|
206
|
+
readonly full: "9999px";
|
|
207
|
+
};
|
|
208
|
+
declare const shadow: {
|
|
209
|
+
readonly sm: "0 1px 2px rgba(0, 0, 0, 0.04)";
|
|
210
|
+
readonly md: "0 4px 6px -1px rgba(0, 0, 0, 0.06), 0 2px 4px -2px rgba(0, 0, 0, 0.04)";
|
|
211
|
+
readonly lg: "0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.04)";
|
|
212
|
+
};
|
|
213
|
+
declare const breakpoints: {
|
|
214
|
+
readonly sm: "640px";
|
|
215
|
+
readonly md: "768px";
|
|
216
|
+
readonly lg: "1024px";
|
|
217
|
+
readonly xl: "1280px";
|
|
218
|
+
readonly '2xl': "1536px";
|
|
219
|
+
};
|
|
220
|
+
declare const transition: {
|
|
221
|
+
readonly fast: "150ms ease";
|
|
222
|
+
readonly base: "200ms ease";
|
|
223
|
+
readonly slow: "300ms ease";
|
|
224
|
+
};
|
|
225
|
+
declare const lightTheme: {
|
|
226
|
+
readonly colors: {
|
|
227
|
+
readonly brand: {
|
|
228
|
+
readonly blue: "#15538C";
|
|
229
|
+
readonly blueDeep: "#0E3F6E";
|
|
230
|
+
readonly blueTint: "#E5EDF4";
|
|
231
|
+
};
|
|
232
|
+
readonly primary: {
|
|
233
|
+
readonly primary: "#0A53EF";
|
|
234
|
+
readonly primaryDark: "#1A43D1";
|
|
235
|
+
readonly primaryLight: "#E6ECFB";
|
|
236
|
+
readonly primaryLightHover: "#DAE3F8";
|
|
237
|
+
};
|
|
238
|
+
readonly neutral: {
|
|
239
|
+
readonly basecolor: "#F5F5F5";
|
|
240
|
+
readonly subtle: "#EFF0F0";
|
|
241
|
+
readonly card: "#EFEFEF";
|
|
242
|
+
readonly cardalt: "#EBEBEC";
|
|
243
|
+
readonly secondary: "#E4E5E7";
|
|
244
|
+
readonly secondaryDark: "#DFE1E3";
|
|
245
|
+
readonly tableBorder: "#D5D5D5";
|
|
246
|
+
readonly border: "#EDEDED";
|
|
247
|
+
readonly borderDark: "#D5D5D5";
|
|
248
|
+
readonly white: "#FFFFFF";
|
|
249
|
+
};
|
|
250
|
+
readonly text: {
|
|
251
|
+
readonly ink: "#282828";
|
|
252
|
+
readonly charcoal: "#3F3F3F";
|
|
253
|
+
readonly slate: "#5C5C5C";
|
|
254
|
+
readonly stone: "#787878";
|
|
255
|
+
readonly pending: "#C7C7CA";
|
|
256
|
+
readonly error: "#940000";
|
|
257
|
+
};
|
|
258
|
+
readonly status: {
|
|
259
|
+
readonly success: "#138660";
|
|
260
|
+
readonly warning: "#9F5500";
|
|
261
|
+
readonly gold: "#FFC179";
|
|
262
|
+
readonly error: "#940000";
|
|
263
|
+
};
|
|
264
|
+
readonly accent: {
|
|
265
|
+
readonly mint: "#37C3A4";
|
|
266
|
+
readonly forest: "#003E1B";
|
|
267
|
+
readonly forestLight: "#E2F0EC";
|
|
268
|
+
readonly tangerine: "#FE7C35";
|
|
269
|
+
readonly tangerineLight: "#FFE2C1";
|
|
270
|
+
};
|
|
271
|
+
readonly team: {
|
|
272
|
+
readonly men: "#8AC6D9";
|
|
273
|
+
readonly women: "#FFA99A";
|
|
274
|
+
readonly mixed: "#D1C1C3";
|
|
275
|
+
};
|
|
276
|
+
readonly travel: {
|
|
277
|
+
readonly limoBackground: "#EDE9FE";
|
|
278
|
+
readonly limoForeground: "#7C3AED";
|
|
279
|
+
readonly busBackground: "#FEF3C7";
|
|
280
|
+
readonly busForeground: "#D97706";
|
|
281
|
+
};
|
|
282
|
+
readonly vendor: {
|
|
283
|
+
readonly DL: {
|
|
284
|
+
readonly bg: "#003366";
|
|
285
|
+
readonly fg: "#FFFFFF";
|
|
286
|
+
};
|
|
287
|
+
readonly AA: {
|
|
288
|
+
readonly bg: "#0078D2";
|
|
289
|
+
readonly fg: "#FFFFFF";
|
|
290
|
+
};
|
|
291
|
+
readonly UA: {
|
|
292
|
+
readonly bg: "#002244";
|
|
293
|
+
readonly fg: "#FFFFFF";
|
|
294
|
+
};
|
|
295
|
+
readonly WN: {
|
|
296
|
+
readonly bg: "#F9B612";
|
|
297
|
+
readonly fg: "#304CB2";
|
|
298
|
+
};
|
|
299
|
+
readonly B6: {
|
|
300
|
+
readonly bg: "#003876";
|
|
301
|
+
readonly fg: "#FFFFFF";
|
|
302
|
+
};
|
|
303
|
+
readonly AS: {
|
|
304
|
+
readonly bg: "#016191";
|
|
305
|
+
readonly fg: "#FFFFFF";
|
|
306
|
+
};
|
|
307
|
+
readonly F9: {
|
|
308
|
+
readonly bg: "#2D8B45";
|
|
309
|
+
readonly fg: "#FFFFFF";
|
|
310
|
+
};
|
|
311
|
+
readonly NK: {
|
|
312
|
+
readonly bg: "#FFC72C";
|
|
313
|
+
readonly fg: "#000000";
|
|
314
|
+
};
|
|
315
|
+
readonly G4: {
|
|
316
|
+
readonly bg: "#00386C";
|
|
317
|
+
readonly fg: "#FFFFFF";
|
|
318
|
+
};
|
|
319
|
+
readonly HA: {
|
|
320
|
+
readonly bg: "#660099";
|
|
321
|
+
readonly fg: "#FFFFFF";
|
|
322
|
+
};
|
|
323
|
+
};
|
|
324
|
+
readonly alert: {
|
|
325
|
+
readonly primary: {
|
|
326
|
+
readonly fg: "#0A53EF";
|
|
327
|
+
readonly bg: "#E6ECFB";
|
|
328
|
+
readonly border: "#0A53EF";
|
|
329
|
+
};
|
|
330
|
+
readonly success: {
|
|
331
|
+
readonly fg: "#138660";
|
|
332
|
+
readonly bg: "#E2F0EC";
|
|
333
|
+
readonly border: "#138660";
|
|
334
|
+
};
|
|
335
|
+
readonly warning: {
|
|
336
|
+
readonly fg: "#9F5500";
|
|
337
|
+
readonly bg: "#FFE2C1";
|
|
338
|
+
readonly border: "#FE7C35";
|
|
339
|
+
};
|
|
340
|
+
readonly error: {
|
|
341
|
+
readonly fg: "#940000";
|
|
342
|
+
readonly bg: "#FEE2E2";
|
|
343
|
+
readonly border: "#940000";
|
|
344
|
+
};
|
|
345
|
+
};
|
|
346
|
+
readonly semantic: {
|
|
347
|
+
readonly fg: {
|
|
348
|
+
readonly 1: "#282828";
|
|
349
|
+
readonly 2: "#3F3F3F";
|
|
350
|
+
readonly 3: "#5C5C5C";
|
|
351
|
+
readonly 4: "#787878";
|
|
352
|
+
readonly disabled: "#C7C7CA";
|
|
353
|
+
readonly link: "#0A53EF";
|
|
354
|
+
readonly linkHover: "#1A43D1";
|
|
355
|
+
};
|
|
356
|
+
readonly bg: {
|
|
357
|
+
readonly page: "#F5F5F5";
|
|
358
|
+
readonly surface: "#FFFFFF";
|
|
359
|
+
readonly card: "#EFEFEF";
|
|
360
|
+
readonly subtle: "#EFF0F0";
|
|
361
|
+
};
|
|
362
|
+
};
|
|
363
|
+
};
|
|
364
|
+
readonly typography: {
|
|
365
|
+
readonly fontFamily: {
|
|
366
|
+
readonly base: "'Roboto Flex', system-ui, -apple-system, 'Segoe UI', sans-serif";
|
|
367
|
+
readonly display: "'Roboto Flex', system-ui, -apple-system, sans-serif";
|
|
368
|
+
readonly mono: "'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace";
|
|
369
|
+
};
|
|
370
|
+
readonly fontSize: {
|
|
371
|
+
readonly xs: "12px";
|
|
372
|
+
readonly sm: "14px";
|
|
373
|
+
readonly base: "16px";
|
|
374
|
+
readonly lg: "18px";
|
|
375
|
+
readonly xl: "20px";
|
|
376
|
+
readonly '2xl': "24px";
|
|
377
|
+
readonly '4xl': "36px";
|
|
378
|
+
};
|
|
379
|
+
readonly lineHeight: {
|
|
380
|
+
readonly xs: "16px";
|
|
381
|
+
readonly sm: "20px";
|
|
382
|
+
readonly base: "24px";
|
|
383
|
+
readonly lg: "28px";
|
|
384
|
+
readonly xl: "28px";
|
|
385
|
+
readonly '2xl': "32px";
|
|
386
|
+
readonly '4xl': "40px";
|
|
387
|
+
readonly tight: 1.25;
|
|
388
|
+
readonly normal: 1.5;
|
|
389
|
+
};
|
|
390
|
+
readonly fontWeight: {
|
|
391
|
+
readonly light: 300;
|
|
392
|
+
readonly regular: 400;
|
|
393
|
+
readonly medium: 500;
|
|
394
|
+
readonly semibold: 600;
|
|
395
|
+
readonly bold: 700;
|
|
396
|
+
};
|
|
397
|
+
};
|
|
398
|
+
readonly spacing: {
|
|
399
|
+
readonly 0: "0";
|
|
400
|
+
readonly '0.5': "2px";
|
|
401
|
+
readonly 1: "4px";
|
|
402
|
+
readonly '1.5': "6px";
|
|
403
|
+
readonly 2: "8px";
|
|
404
|
+
readonly 3: "12px";
|
|
405
|
+
readonly 4: "16px";
|
|
406
|
+
readonly 5: "20px";
|
|
407
|
+
readonly 6: "24px";
|
|
408
|
+
readonly 7: "28px";
|
|
409
|
+
readonly 8: "32px";
|
|
410
|
+
readonly 9: "36px";
|
|
411
|
+
readonly 10: "40px";
|
|
412
|
+
readonly 12: "48px";
|
|
413
|
+
readonly 16: "64px";
|
|
414
|
+
};
|
|
415
|
+
readonly radius: {
|
|
416
|
+
readonly sm: "2px";
|
|
417
|
+
readonly md: "4px";
|
|
418
|
+
readonly lg: "6px";
|
|
419
|
+
readonly xl: "8px";
|
|
420
|
+
readonly '2xl': "12px";
|
|
421
|
+
readonly '3xl': "16px";
|
|
422
|
+
readonly full: "9999px";
|
|
423
|
+
};
|
|
424
|
+
readonly shadow: {
|
|
425
|
+
readonly sm: "0 1px 2px rgba(0, 0, 0, 0.04)";
|
|
426
|
+
readonly md: "0 4px 6px -1px rgba(0, 0, 0, 0.06), 0 2px 4px -2px rgba(0, 0, 0, 0.04)";
|
|
427
|
+
readonly lg: "0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.04)";
|
|
428
|
+
};
|
|
429
|
+
readonly breakpoints: {
|
|
430
|
+
readonly sm: "640px";
|
|
431
|
+
readonly md: "768px";
|
|
432
|
+
readonly lg: "1024px";
|
|
433
|
+
readonly xl: "1280px";
|
|
434
|
+
readonly '2xl': "1536px";
|
|
435
|
+
};
|
|
436
|
+
readonly transition: {
|
|
437
|
+
readonly fast: "150ms ease";
|
|
438
|
+
readonly base: "200ms ease";
|
|
439
|
+
readonly slow: "300ms ease";
|
|
440
|
+
};
|
|
441
|
+
readonly gradients: {
|
|
442
|
+
readonly avatar: "linear-gradient(135deg, #4F7FFF 0%, #4066E8 100%)";
|
|
443
|
+
};
|
|
444
|
+
};
|
|
445
|
+
declare const darkTheme: {
|
|
446
|
+
readonly colors: {
|
|
447
|
+
readonly neutral: {
|
|
448
|
+
readonly basecolor: "#1a1a1a";
|
|
449
|
+
readonly subtle: "#2a2a2a";
|
|
450
|
+
readonly card: "#252525";
|
|
451
|
+
readonly cardalt: "#2f2f2f";
|
|
452
|
+
readonly secondary: "#3a3a3a";
|
|
453
|
+
readonly secondaryDark: "#454545";
|
|
454
|
+
readonly tableBorder: "#4a4a4a";
|
|
455
|
+
readonly border: "#3a3a3a";
|
|
456
|
+
readonly borderDark: "#4a4a4a";
|
|
457
|
+
readonly white: "#1a1a1a";
|
|
458
|
+
};
|
|
459
|
+
readonly text: {
|
|
460
|
+
readonly ink: "#f0f0f0";
|
|
461
|
+
readonly charcoal: "#d0d0d0";
|
|
462
|
+
readonly slate: "#a0a0a0";
|
|
463
|
+
readonly stone: "#808080";
|
|
464
|
+
readonly pending: "#606060";
|
|
465
|
+
readonly error: "#ff6b6b";
|
|
466
|
+
};
|
|
467
|
+
readonly semantic: {
|
|
468
|
+
readonly fg: {
|
|
469
|
+
readonly 1: "#f0f0f0";
|
|
470
|
+
readonly 2: "#d0d0d0";
|
|
471
|
+
readonly 3: "#a0a0a0";
|
|
472
|
+
readonly 4: "#808080";
|
|
473
|
+
readonly disabled: "#606060";
|
|
474
|
+
readonly link: "#0A53EF";
|
|
475
|
+
readonly linkHover: "#1A43D1";
|
|
476
|
+
};
|
|
477
|
+
readonly bg: {
|
|
478
|
+
readonly page: "#1a1a1a";
|
|
479
|
+
readonly surface: "#252525";
|
|
480
|
+
readonly card: "#252525";
|
|
481
|
+
readonly subtle: "#2a2a2a";
|
|
482
|
+
};
|
|
483
|
+
};
|
|
484
|
+
readonly brand: {
|
|
485
|
+
readonly blue: "#15538C";
|
|
486
|
+
readonly blueDeep: "#0E3F6E";
|
|
487
|
+
readonly blueTint: "#E5EDF4";
|
|
488
|
+
};
|
|
489
|
+
readonly primary: {
|
|
490
|
+
readonly primary: "#0A53EF";
|
|
491
|
+
readonly primaryDark: "#1A43D1";
|
|
492
|
+
readonly primaryLight: "#E6ECFB";
|
|
493
|
+
readonly primaryLightHover: "#DAE3F8";
|
|
494
|
+
};
|
|
495
|
+
readonly status: {
|
|
496
|
+
readonly success: "#138660";
|
|
497
|
+
readonly warning: "#9F5500";
|
|
498
|
+
readonly gold: "#FFC179";
|
|
499
|
+
readonly error: "#940000";
|
|
500
|
+
};
|
|
501
|
+
readonly accent: {
|
|
502
|
+
readonly mint: "#37C3A4";
|
|
503
|
+
readonly forest: "#003E1B";
|
|
504
|
+
readonly forestLight: "#E2F0EC";
|
|
505
|
+
readonly tangerine: "#FE7C35";
|
|
506
|
+
readonly tangerineLight: "#FFE2C1";
|
|
507
|
+
};
|
|
508
|
+
readonly team: {
|
|
509
|
+
readonly men: "#8AC6D9";
|
|
510
|
+
readonly women: "#FFA99A";
|
|
511
|
+
readonly mixed: "#D1C1C3";
|
|
512
|
+
};
|
|
513
|
+
readonly travel: {
|
|
514
|
+
readonly limoBackground: "#EDE9FE";
|
|
515
|
+
readonly limoForeground: "#7C3AED";
|
|
516
|
+
readonly busBackground: "#FEF3C7";
|
|
517
|
+
readonly busForeground: "#D97706";
|
|
518
|
+
};
|
|
519
|
+
readonly vendor: {
|
|
520
|
+
readonly DL: {
|
|
521
|
+
readonly bg: "#003366";
|
|
522
|
+
readonly fg: "#FFFFFF";
|
|
523
|
+
};
|
|
524
|
+
readonly AA: {
|
|
525
|
+
readonly bg: "#0078D2";
|
|
526
|
+
readonly fg: "#FFFFFF";
|
|
527
|
+
};
|
|
528
|
+
readonly UA: {
|
|
529
|
+
readonly bg: "#002244";
|
|
530
|
+
readonly fg: "#FFFFFF";
|
|
531
|
+
};
|
|
532
|
+
readonly WN: {
|
|
533
|
+
readonly bg: "#F9B612";
|
|
534
|
+
readonly fg: "#304CB2";
|
|
535
|
+
};
|
|
536
|
+
readonly B6: {
|
|
537
|
+
readonly bg: "#003876";
|
|
538
|
+
readonly fg: "#FFFFFF";
|
|
539
|
+
};
|
|
540
|
+
readonly AS: {
|
|
541
|
+
readonly bg: "#016191";
|
|
542
|
+
readonly fg: "#FFFFFF";
|
|
543
|
+
};
|
|
544
|
+
readonly F9: {
|
|
545
|
+
readonly bg: "#2D8B45";
|
|
546
|
+
readonly fg: "#FFFFFF";
|
|
547
|
+
};
|
|
548
|
+
readonly NK: {
|
|
549
|
+
readonly bg: "#FFC72C";
|
|
550
|
+
readonly fg: "#000000";
|
|
551
|
+
};
|
|
552
|
+
readonly G4: {
|
|
553
|
+
readonly bg: "#00386C";
|
|
554
|
+
readonly fg: "#FFFFFF";
|
|
555
|
+
};
|
|
556
|
+
readonly HA: {
|
|
557
|
+
readonly bg: "#660099";
|
|
558
|
+
readonly fg: "#FFFFFF";
|
|
559
|
+
};
|
|
560
|
+
};
|
|
561
|
+
readonly alert: {
|
|
562
|
+
readonly primary: {
|
|
563
|
+
readonly fg: "#0A53EF";
|
|
564
|
+
readonly bg: "#E6ECFB";
|
|
565
|
+
readonly border: "#0A53EF";
|
|
566
|
+
};
|
|
567
|
+
readonly success: {
|
|
568
|
+
readonly fg: "#138660";
|
|
569
|
+
readonly bg: "#E2F0EC";
|
|
570
|
+
readonly border: "#138660";
|
|
571
|
+
};
|
|
572
|
+
readonly warning: {
|
|
573
|
+
readonly fg: "#9F5500";
|
|
574
|
+
readonly bg: "#FFE2C1";
|
|
575
|
+
readonly border: "#FE7C35";
|
|
576
|
+
};
|
|
577
|
+
readonly error: {
|
|
578
|
+
readonly fg: "#940000";
|
|
579
|
+
readonly bg: "#FEE2E2";
|
|
580
|
+
readonly border: "#940000";
|
|
581
|
+
};
|
|
582
|
+
};
|
|
583
|
+
};
|
|
584
|
+
readonly typography: {
|
|
585
|
+
readonly fontFamily: {
|
|
586
|
+
readonly base: "'Roboto Flex', system-ui, -apple-system, 'Segoe UI', sans-serif";
|
|
587
|
+
readonly display: "'Roboto Flex', system-ui, -apple-system, sans-serif";
|
|
588
|
+
readonly mono: "'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace";
|
|
589
|
+
};
|
|
590
|
+
readonly fontSize: {
|
|
591
|
+
readonly xs: "12px";
|
|
592
|
+
readonly sm: "14px";
|
|
593
|
+
readonly base: "16px";
|
|
594
|
+
readonly lg: "18px";
|
|
595
|
+
readonly xl: "20px";
|
|
596
|
+
readonly '2xl': "24px";
|
|
597
|
+
readonly '4xl': "36px";
|
|
598
|
+
};
|
|
599
|
+
readonly lineHeight: {
|
|
600
|
+
readonly xs: "16px";
|
|
601
|
+
readonly sm: "20px";
|
|
602
|
+
readonly base: "24px";
|
|
603
|
+
readonly lg: "28px";
|
|
604
|
+
readonly xl: "28px";
|
|
605
|
+
readonly '2xl': "32px";
|
|
606
|
+
readonly '4xl': "40px";
|
|
607
|
+
readonly tight: 1.25;
|
|
608
|
+
readonly normal: 1.5;
|
|
609
|
+
};
|
|
610
|
+
readonly fontWeight: {
|
|
611
|
+
readonly light: 300;
|
|
612
|
+
readonly regular: 400;
|
|
613
|
+
readonly medium: 500;
|
|
614
|
+
readonly semibold: 600;
|
|
615
|
+
readonly bold: 700;
|
|
616
|
+
};
|
|
617
|
+
};
|
|
618
|
+
readonly spacing: {
|
|
619
|
+
readonly 0: "0";
|
|
620
|
+
readonly '0.5': "2px";
|
|
621
|
+
readonly 1: "4px";
|
|
622
|
+
readonly '1.5': "6px";
|
|
623
|
+
readonly 2: "8px";
|
|
624
|
+
readonly 3: "12px";
|
|
625
|
+
readonly 4: "16px";
|
|
626
|
+
readonly 5: "20px";
|
|
627
|
+
readonly 6: "24px";
|
|
628
|
+
readonly 7: "28px";
|
|
629
|
+
readonly 8: "32px";
|
|
630
|
+
readonly 9: "36px";
|
|
631
|
+
readonly 10: "40px";
|
|
632
|
+
readonly 12: "48px";
|
|
633
|
+
readonly 16: "64px";
|
|
634
|
+
};
|
|
635
|
+
readonly radius: {
|
|
636
|
+
readonly sm: "2px";
|
|
637
|
+
readonly md: "4px";
|
|
638
|
+
readonly lg: "6px";
|
|
639
|
+
readonly xl: "8px";
|
|
640
|
+
readonly '2xl': "12px";
|
|
641
|
+
readonly '3xl': "16px";
|
|
642
|
+
readonly full: "9999px";
|
|
643
|
+
};
|
|
644
|
+
readonly shadow: {
|
|
645
|
+
readonly sm: "0 1px 2px rgba(0, 0, 0, 0.04)";
|
|
646
|
+
readonly md: "0 4px 6px -1px rgba(0, 0, 0, 0.06), 0 2px 4px -2px rgba(0, 0, 0, 0.04)";
|
|
647
|
+
readonly lg: "0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.04)";
|
|
648
|
+
};
|
|
649
|
+
readonly breakpoints: {
|
|
650
|
+
readonly sm: "640px";
|
|
651
|
+
readonly md: "768px";
|
|
652
|
+
readonly lg: "1024px";
|
|
653
|
+
readonly xl: "1280px";
|
|
654
|
+
readonly '2xl': "1536px";
|
|
655
|
+
};
|
|
656
|
+
readonly transition: {
|
|
657
|
+
readonly fast: "150ms ease";
|
|
658
|
+
readonly base: "200ms ease";
|
|
659
|
+
readonly slow: "300ms ease";
|
|
660
|
+
};
|
|
661
|
+
readonly gradients: {
|
|
662
|
+
readonly avatar: "linear-gradient(135deg, #4F7FFF 0%, #4066E8 100%)";
|
|
663
|
+
};
|
|
664
|
+
};
|
|
665
|
+
/**
|
|
666
|
+
* Theme interface - allows both light and dark themes to be assignable.
|
|
667
|
+
* Uses structural typing rather than literal types for color values.
|
|
668
|
+
*/
|
|
669
|
+
interface Theme {
|
|
670
|
+
colors: {
|
|
671
|
+
brand: typeof brandColors;
|
|
672
|
+
primary: typeof primaryColors;
|
|
673
|
+
neutral: {
|
|
674
|
+
basecolor: string;
|
|
675
|
+
subtle: string;
|
|
676
|
+
card: string;
|
|
677
|
+
cardalt: string;
|
|
678
|
+
secondary: string;
|
|
679
|
+
secondaryDark: string;
|
|
680
|
+
tableBorder: string;
|
|
681
|
+
border: string;
|
|
682
|
+
borderDark: string;
|
|
683
|
+
white: string;
|
|
684
|
+
};
|
|
685
|
+
text: {
|
|
686
|
+
ink: string;
|
|
687
|
+
charcoal: string;
|
|
688
|
+
slate: string;
|
|
689
|
+
stone: string;
|
|
690
|
+
pending: string;
|
|
691
|
+
error: string;
|
|
692
|
+
};
|
|
693
|
+
status: typeof statusColors;
|
|
694
|
+
accent: typeof accentColors;
|
|
695
|
+
team: typeof teamColors;
|
|
696
|
+
travel: typeof travelColors;
|
|
697
|
+
vendor: typeof vendorColors;
|
|
698
|
+
alert: typeof alertTokens;
|
|
699
|
+
semantic: {
|
|
700
|
+
fg: {
|
|
701
|
+
1: string;
|
|
702
|
+
2: string;
|
|
703
|
+
3: string;
|
|
704
|
+
4: string;
|
|
705
|
+
disabled: string;
|
|
706
|
+
link: string;
|
|
707
|
+
linkHover: string;
|
|
708
|
+
};
|
|
709
|
+
bg: {
|
|
710
|
+
page: string;
|
|
711
|
+
surface: string;
|
|
712
|
+
card: string;
|
|
713
|
+
subtle: string;
|
|
714
|
+
};
|
|
715
|
+
};
|
|
716
|
+
};
|
|
717
|
+
typography: {
|
|
718
|
+
fontFamily: typeof fontFamily;
|
|
719
|
+
fontSize: typeof fontSize;
|
|
720
|
+
lineHeight: typeof lineHeight;
|
|
721
|
+
fontWeight: typeof fontWeight;
|
|
722
|
+
};
|
|
723
|
+
spacing: typeof spacing;
|
|
724
|
+
radius: typeof radius;
|
|
725
|
+
shadow: typeof shadow;
|
|
726
|
+
breakpoints: typeof breakpoints;
|
|
727
|
+
transition: typeof transition;
|
|
728
|
+
gradients: typeof gradients;
|
|
729
|
+
}
|
|
730
|
+
type ThemeColors = Theme['colors'];
|
|
731
|
+
type ThemeTypography = Theme['typography'];
|
|
732
|
+
type ThemeSpacing = keyof typeof spacing;
|
|
733
|
+
type ThemeRadius = keyof typeof radius;
|
|
734
|
+
type ThemeShadow = keyof typeof shadow;
|
|
735
|
+
type ThemeBreakpoint = keyof typeof breakpoints;
|
|
736
|
+
type ThemeTransition = keyof typeof transition;
|
|
737
|
+
|
|
738
|
+
type ThemeMode = 'light' | 'dark' | 'system';
|
|
739
|
+
interface ThemeContextValue {
|
|
740
|
+
/** Current resolved theme object */
|
|
741
|
+
theme: Theme;
|
|
742
|
+
/** Current theme mode setting */
|
|
743
|
+
mode: ThemeMode;
|
|
744
|
+
/** Whether dark mode is currently active */
|
|
745
|
+
isDark: boolean;
|
|
746
|
+
/** Update the theme mode */
|
|
747
|
+
setMode: (mode: ThemeMode) => void;
|
|
748
|
+
/** Toggle between light and dark modes */
|
|
749
|
+
toggleTheme: () => void;
|
|
750
|
+
}
|
|
751
|
+
/**
|
|
752
|
+
* Access the current theme context.
|
|
753
|
+
*
|
|
754
|
+
* Outside a ThemeProvider this resolves to the light theme with no-op mode
|
|
755
|
+
* setters, so components stay renderable on their own.
|
|
756
|
+
*
|
|
757
|
+
* @example
|
|
758
|
+
* ```tsx
|
|
759
|
+
* const { theme, isDark, toggleTheme } = useTheme();
|
|
760
|
+
*
|
|
761
|
+
* const buttonStyle = css({
|
|
762
|
+
* backgroundColor: theme.colors.primary.primary,
|
|
763
|
+
* color: theme.colors.neutral.white,
|
|
764
|
+
* });
|
|
765
|
+
* ```
|
|
766
|
+
*/
|
|
767
|
+
declare function useTheme(): ThemeContextValue;
|
|
768
|
+
interface ThemeProviderProps {
|
|
769
|
+
/** Child components */
|
|
770
|
+
children: React__default.ReactNode;
|
|
771
|
+
/** Initial theme mode (default: 'system') */
|
|
772
|
+
defaultMode?: ThemeMode;
|
|
773
|
+
/** Storage key for persisting theme preference */
|
|
774
|
+
storageKey?: string;
|
|
775
|
+
/** Whether to add theme class to document root */
|
|
776
|
+
applyToRoot?: boolean;
|
|
777
|
+
}
|
|
778
|
+
/**
|
|
779
|
+
* Provides theme context to child components.
|
|
780
|
+
* Supports light, dark, and system-preference modes.
|
|
781
|
+
*
|
|
782
|
+
* @example
|
|
783
|
+
* ```tsx
|
|
784
|
+
* // Basic usage
|
|
785
|
+
* <ThemeProvider>
|
|
786
|
+
* <App />
|
|
787
|
+
* </ThemeProvider>
|
|
788
|
+
*
|
|
789
|
+
* // With initial dark mode
|
|
790
|
+
* <ThemeProvider defaultMode="dark">
|
|
791
|
+
* <App />
|
|
792
|
+
* </ThemeProvider>
|
|
793
|
+
*
|
|
794
|
+
* // With persistence
|
|
795
|
+
* <ThemeProvider storageKey="stm-theme-mode">
|
|
796
|
+
* <App />
|
|
797
|
+
* </ThemeProvider>
|
|
798
|
+
* ```
|
|
799
|
+
*/
|
|
800
|
+
declare function ThemeProvider({ children, defaultMode, storageKey, applyToRoot, }: ThemeProviderProps): React__default.ReactElement;
|
|
801
|
+
|
|
802
|
+
/**
|
|
803
|
+
* CSS object type - extends React's CSSProperties.
|
|
804
|
+
* Simpler type to avoid complex union issues.
|
|
805
|
+
*/
|
|
806
|
+
type CSSObject = CSSProperties & Record<string, unknown>;
|
|
807
|
+
type StyleFunction<P = object> = (props: P & {
|
|
808
|
+
theme: Theme;
|
|
809
|
+
}) => CSSObject;
|
|
810
|
+
/**
|
|
811
|
+
* Create a CSS object with type safety.
|
|
812
|
+
* Converts nested pseudo-selectors for inline style compatibility.
|
|
813
|
+
*
|
|
814
|
+
* @example
|
|
815
|
+
* ```tsx
|
|
816
|
+
* const buttonStyle = css({
|
|
817
|
+
* backgroundColor: theme.colors.primary.primary,
|
|
818
|
+
* padding: `${theme.spacing[2]} ${theme.spacing[4]}`,
|
|
819
|
+
* borderRadius: theme.radius.full,
|
|
820
|
+
* '&:hover': {
|
|
821
|
+
* backgroundColor: theme.colors.primary.primaryDark,
|
|
822
|
+
* },
|
|
823
|
+
* });
|
|
824
|
+
* ```
|
|
825
|
+
*/
|
|
826
|
+
declare function css(styles: CSSObject): CSSObject;
|
|
827
|
+
/**
|
|
828
|
+
* Merge multiple CSS objects together.
|
|
829
|
+
* Later objects override earlier ones.
|
|
830
|
+
*
|
|
831
|
+
* @example
|
|
832
|
+
* ```tsx
|
|
833
|
+
* const combined = merge(baseStyle, variantStyle, sizeStyle);
|
|
834
|
+
* ```
|
|
835
|
+
*/
|
|
836
|
+
declare function merge(...styles: (CSSObject | CSSProperties | Record<string, unknown> | undefined | null | false)[]): CSSObject;
|
|
837
|
+
/**
|
|
838
|
+
* Convert a CSSObject to inline styles.
|
|
839
|
+
* Strips out pseudo-selectors (they can't be inlined).
|
|
840
|
+
*/
|
|
841
|
+
declare function toInlineStyle(styles: CSSObject): CSSProperties;
|
|
842
|
+
/**
|
|
843
|
+
* Create spacing value from theme tokens.
|
|
844
|
+
*/
|
|
845
|
+
declare function space(value: keyof typeof spacing | number): string;
|
|
846
|
+
/**
|
|
847
|
+
* Create border-radius value from theme tokens.
|
|
848
|
+
*/
|
|
849
|
+
declare function rounded(value: keyof typeof radius): string;
|
|
850
|
+
/**
|
|
851
|
+
* Create box-shadow value from theme tokens.
|
|
852
|
+
*/
|
|
853
|
+
declare function boxShadow(value: keyof typeof shadow): string;
|
|
854
|
+
/**
|
|
855
|
+
* Create transition value from theme tokens.
|
|
856
|
+
*/
|
|
857
|
+
declare function trans(value: keyof typeof transition): string;
|
|
858
|
+
/**
|
|
859
|
+
* Create font-weight value from theme tokens.
|
|
860
|
+
*/
|
|
861
|
+
declare function weight(value: keyof typeof fontWeight): number;
|
|
862
|
+
/**
|
|
863
|
+
* Create font-size value from theme tokens.
|
|
864
|
+
*/
|
|
865
|
+
declare function size(value: keyof typeof fontSize): string;
|
|
866
|
+
/**
|
|
867
|
+
* Create line-height value from theme tokens.
|
|
868
|
+
*/
|
|
869
|
+
declare function leading(value: keyof typeof lineHeight): string | number;
|
|
870
|
+
/**
|
|
871
|
+
* Create font-family value from theme tokens.
|
|
872
|
+
*/
|
|
873
|
+
declare function font(value: keyof typeof fontFamily): string;
|
|
874
|
+
/**
|
|
875
|
+
* Reset button styles.
|
|
876
|
+
*/
|
|
877
|
+
declare const buttonReset: CSSObject;
|
|
878
|
+
/**
|
|
879
|
+
* Flex center alignment.
|
|
880
|
+
*/
|
|
881
|
+
declare const flexCenter: CSSObject;
|
|
882
|
+
/**
|
|
883
|
+
* Flex row with gap.
|
|
884
|
+
*/
|
|
885
|
+
declare function flexRow(gap?: keyof typeof spacing): CSSObject;
|
|
886
|
+
/**
|
|
887
|
+
* Flex column with gap.
|
|
888
|
+
*/
|
|
889
|
+
declare function flexCol(gap?: keyof typeof spacing): CSSObject;
|
|
890
|
+
/**
|
|
891
|
+
* Absolute fill parent.
|
|
892
|
+
*/
|
|
893
|
+
declare const absoluteFill: CSSObject;
|
|
894
|
+
/**
|
|
895
|
+
* Screen reader only (visually hidden but accessible).
|
|
896
|
+
*/
|
|
897
|
+
declare const srOnly: CSSObject;
|
|
898
|
+
/**
|
|
899
|
+
* Truncate text with ellipsis.
|
|
900
|
+
*/
|
|
901
|
+
declare const truncate: CSSObject;
|
|
902
|
+
/**
|
|
903
|
+
* Line clamp for multi-line truncation.
|
|
904
|
+
*/
|
|
905
|
+
declare function lineClamp(lines: number): CSSObject;
|
|
906
|
+
/**
|
|
907
|
+
* Create a style factory that receives the theme.
|
|
908
|
+
* Use with useTheme() hook.
|
|
909
|
+
*
|
|
910
|
+
* @example
|
|
911
|
+
* ```tsx
|
|
912
|
+
* const useButtonStyles = styled((theme) => ({
|
|
913
|
+
* root: css({
|
|
914
|
+
* backgroundColor: theme.colors.primary.primary,
|
|
915
|
+
* color: theme.colors.neutral.white,
|
|
916
|
+
* }),
|
|
917
|
+
* disabled: css({
|
|
918
|
+
* opacity: 0.5,
|
|
919
|
+
* cursor: 'not-allowed',
|
|
920
|
+
* }),
|
|
921
|
+
* }));
|
|
922
|
+
*
|
|
923
|
+
* function Button() {
|
|
924
|
+
* const { theme } = useTheme();
|
|
925
|
+
* const styles = useButtonStyles(theme);
|
|
926
|
+
* return <button style={toInlineStyle(styles.root)}>Click</button>;
|
|
927
|
+
* }
|
|
928
|
+
* ```
|
|
929
|
+
*/
|
|
930
|
+
declare function styled<T extends Record<string, CSSObject>>(factory: (theme: Theme) => T): (theme: Theme) => T;
|
|
931
|
+
|
|
932
|
+
type AlertVariant$1 = 'primary' | 'success' | 'warning' | 'error';
|
|
5
933
|
interface AlertProps {
|
|
6
934
|
/** Visual style variant */
|
|
7
|
-
variant?: AlertVariant;
|
|
935
|
+
variant?: AlertVariant$1;
|
|
8
936
|
/** Optional title for the alert */
|
|
9
937
|
title?: string;
|
|
10
938
|
/** Content of the alert */
|
|
@@ -18,6 +946,42 @@ interface AlertProps {
|
|
|
18
946
|
}
|
|
19
947
|
declare const Alert: React__default.FC<AlertProps>;
|
|
20
948
|
|
|
949
|
+
type AlertVariant = 'primary' | 'success' | 'warning' | 'error';
|
|
950
|
+
|
|
951
|
+
interface AlertStyledProps {
|
|
952
|
+
/** Visual style variant */
|
|
953
|
+
variant?: AlertVariant;
|
|
954
|
+
/** Optional title for the alert */
|
|
955
|
+
title?: string;
|
|
956
|
+
/** Content of the alert */
|
|
957
|
+
children: React__default.ReactNode;
|
|
958
|
+
/** Whether the alert can be dismissed */
|
|
959
|
+
dismissible?: boolean;
|
|
960
|
+
/** Callback when dismiss button is clicked */
|
|
961
|
+
onDismiss?: () => void;
|
|
962
|
+
/** Additional inline styles */
|
|
963
|
+
style?: React__default.CSSProperties;
|
|
964
|
+
/** Data test attribute for testing */
|
|
965
|
+
'data-test'?: string;
|
|
966
|
+
}
|
|
967
|
+
/**
|
|
968
|
+
* Alert component for displaying important messages.
|
|
969
|
+
* Uses CSS-in-JS styling with theme support.
|
|
970
|
+
* Supports primary, success, warning, and error variants.
|
|
971
|
+
*
|
|
972
|
+
* @example
|
|
973
|
+
* ```tsx
|
|
974
|
+
* <AlertStyled variant="success" title="Success!">
|
|
975
|
+
* Your changes have been saved.
|
|
976
|
+
* </AlertStyled>
|
|
977
|
+
*
|
|
978
|
+
* <AlertStyled variant="error" dismissible onDismiss={() => setShow(false)}>
|
|
979
|
+
* An error occurred. Please try again.
|
|
980
|
+
* </AlertStyled>
|
|
981
|
+
* ```
|
|
982
|
+
*/
|
|
983
|
+
declare const AlertStyled: React__default.FC<AlertStyledProps>;
|
|
984
|
+
|
|
21
985
|
type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
22
986
|
interface AvatarProps extends HTMLAttributes<HTMLDivElement> {
|
|
23
987
|
/** Image source URL */
|
|
@@ -29,7 +993,11 @@ interface AvatarProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
29
993
|
/** Name (used to generate initials if not provided) */
|
|
30
994
|
name?: string;
|
|
31
995
|
/** Size of the avatar */
|
|
32
|
-
|
|
996
|
+
/**
|
|
997
|
+
* One of the named sizes, or an explicit pixel value for hosts pinned to a
|
|
998
|
+
* dimension the scale does not carry.
|
|
999
|
+
*/
|
|
1000
|
+
size?: AvatarSize | number;
|
|
33
1001
|
}
|
|
34
1002
|
/**
|
|
35
1003
|
* Avatar component for user profile images or initials.
|
|
@@ -56,9 +1024,34 @@ interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
|
|
|
56
1024
|
*/
|
|
57
1025
|
declare const Badge: React__default.FC<BadgeProps>;
|
|
58
1026
|
|
|
59
|
-
type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'ghost' | 'danger';
|
|
60
|
-
type ButtonSize = 'sm' | 'md' | 'lg';
|
|
1027
|
+
type ButtonVariant$1 = 'primary' | 'secondary' | 'outline' | 'ghost' | 'danger';
|
|
1028
|
+
type ButtonSize$1 = 'sm' | 'md' | 'lg';
|
|
61
1029
|
interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
1030
|
+
/** Visual style variant */
|
|
1031
|
+
variant?: ButtonVariant$1;
|
|
1032
|
+
/** Size of the button */
|
|
1033
|
+
size?: ButtonSize$1;
|
|
1034
|
+
/** Makes button take full width */
|
|
1035
|
+
fullWidth?: boolean;
|
|
1036
|
+
/** Shows loading spinner */
|
|
1037
|
+
loading?: boolean;
|
|
1038
|
+
/** Icon element to show before text */
|
|
1039
|
+
leftIcon?: React__default.ReactNode;
|
|
1040
|
+
/** Icon element to show after text */
|
|
1041
|
+
rightIcon?: React__default.ReactNode;
|
|
1042
|
+
/** Makes button square (equal width/height) */
|
|
1043
|
+
square?: boolean;
|
|
1044
|
+
}
|
|
1045
|
+
/**
|
|
1046
|
+
* Primary button component for user interactions.
|
|
1047
|
+
* Supports multiple variants, sizes, and states.
|
|
1048
|
+
*/
|
|
1049
|
+
declare const Button: React__default.ForwardRefExoticComponent<ButtonProps & React__default.RefAttributes<HTMLButtonElement>>;
|
|
1050
|
+
|
|
1051
|
+
type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'ghost' | 'danger' | 'primary-light' | 'outline-primary' | 'outline-secondary' | 'outline-charcoal' | 'charcoal' | 'text';
|
|
1052
|
+
type ButtonSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1053
|
+
|
|
1054
|
+
interface ButtonStyledProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
62
1055
|
/** Visual style variant */
|
|
63
1056
|
variant?: ButtonVariant;
|
|
64
1057
|
/** Size of the button */
|
|
@@ -76,9 +1069,25 @@ interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
|
76
1069
|
}
|
|
77
1070
|
/**
|
|
78
1071
|
* Primary button component for user interactions.
|
|
1072
|
+
* Uses CSS-in-JS styling with theme support.
|
|
79
1073
|
* Supports multiple variants, sizes, and states.
|
|
1074
|
+
*
|
|
1075
|
+
* @example
|
|
1076
|
+
* ```tsx
|
|
1077
|
+
* <ButtonStyled variant="primary" size="md">
|
|
1078
|
+
* Click me
|
|
1079
|
+
* </ButtonStyled>
|
|
1080
|
+
*
|
|
1081
|
+
* <ButtonStyled variant="outline" leftIcon={<PlusIcon />}>
|
|
1082
|
+
* Add item
|
|
1083
|
+
* </ButtonStyled>
|
|
1084
|
+
*
|
|
1085
|
+
* <ButtonStyled loading>
|
|
1086
|
+
* Processing...
|
|
1087
|
+
* </ButtonStyled>
|
|
1088
|
+
* ```
|
|
80
1089
|
*/
|
|
81
|
-
declare const
|
|
1090
|
+
declare const ButtonStyled: React__default.ForwardRefExoticComponent<ButtonStyledProps & React__default.RefAttributes<HTMLButtonElement>>;
|
|
82
1091
|
|
|
83
1092
|
interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'> {
|
|
84
1093
|
/** Label text for the checkbox */
|
|
@@ -93,6 +1102,30 @@ interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'typ
|
|
|
93
1102
|
indeterminate?: boolean;
|
|
94
1103
|
/** Additional class for wrapper */
|
|
95
1104
|
className?: string;
|
|
1105
|
+
/**
|
|
1106
|
+
* Renders a radio control instead of a checkbox. The visual is the caller's
|
|
1107
|
+
* through `indicator`; this switches the input's type so the browser handles
|
|
1108
|
+
* grouping, arrow-key selection and the announced role.
|
|
1109
|
+
*/
|
|
1110
|
+
type?: 'checkbox' | 'radio';
|
|
1111
|
+
/**
|
|
1112
|
+
* Draws the box itself, replacing the built-in tick.
|
|
1113
|
+
*
|
|
1114
|
+
* This exists so an app can keep its own icon set without forking the
|
|
1115
|
+
* component: the tick below is an inline SVG, so a consumer whose design uses
|
|
1116
|
+
* a different family — Carbon, say — otherwise has no way in. Called with the
|
|
1117
|
+
* current state, and returns whatever should be shown for it.
|
|
1118
|
+
*
|
|
1119
|
+
* Returning the box means owning its whole appearance, so the built-in border
|
|
1120
|
+
* and fill are dropped when this is set. Accessibility is unaffected either
|
|
1121
|
+
* way: the state lives on the real input underneath, which is what assistive
|
|
1122
|
+
* technology reads.
|
|
1123
|
+
*/
|
|
1124
|
+
indicator?: (state: {
|
|
1125
|
+
checked: boolean;
|
|
1126
|
+
indeterminate: boolean;
|
|
1127
|
+
disabled: boolean;
|
|
1128
|
+
}) => ReactNode;
|
|
96
1129
|
}
|
|
97
1130
|
/**
|
|
98
1131
|
* Checkbox component for boolean selections.
|
|
@@ -335,17 +1368,17 @@ interface SpinnerProps {
|
|
|
335
1368
|
declare const Spinner: React__default.FC<SpinnerProps>;
|
|
336
1369
|
|
|
337
1370
|
type StatusBadgeVariant = 'ticketed' | 'itinerary' | 'not-ticketed' | 'submitted' | 'pending' | 'cancelled' | 'approved' | 'rejected' | 'in-review';
|
|
338
|
-
interface StatusBadgeProps {
|
|
1371
|
+
interface StatusBadgeProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {
|
|
339
1372
|
/** The status variant to display */
|
|
340
1373
|
status: StatusBadgeVariant;
|
|
341
1374
|
/** Optional custom label (defaults to formatted status) */
|
|
342
1375
|
label?: string;
|
|
343
|
-
/** Additional CSS class */
|
|
344
|
-
className?: string;
|
|
345
1376
|
}
|
|
346
1377
|
declare const StatusBadge: React__default.FC<StatusBadgeProps>;
|
|
347
1378
|
|
|
348
|
-
type TagVariant = 'default' | 'primary' | 'success' | 'warning' | 'error' | 'info'
|
|
1379
|
+
type TagVariant = 'default' | 'primary' | 'success' | 'warning' | 'error' | 'info'
|
|
1380
|
+
/** No fill or colour of its own — inherits, for grouping content inline. */
|
|
1381
|
+
| 'plain';
|
|
349
1382
|
type TagSize = 'sm' | 'md' | 'lg';
|
|
350
1383
|
interface TagProps {
|
|
351
1384
|
/** Tag content */
|
|
@@ -365,7 +1398,7 @@ interface TagProps {
|
|
|
365
1398
|
/** Inline styles */
|
|
366
1399
|
style?: React__default.CSSProperties;
|
|
367
1400
|
}
|
|
368
|
-
declare const Tag: React__default.
|
|
1401
|
+
declare const Tag: React__default.ForwardRefExoticComponent<TagProps & React__default.RefAttributes<HTMLSpanElement>>;
|
|
369
1402
|
|
|
370
1403
|
type TimepickerSize = 'sm' | 'md' | 'lg';
|
|
371
1404
|
interface TimepickerProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'> {
|
|
@@ -420,6 +1453,21 @@ interface ToggleProps {
|
|
|
420
1453
|
className?: string;
|
|
421
1454
|
/** Accessible name for the toggle */
|
|
422
1455
|
'aria-label'?: string;
|
|
1456
|
+
/**
|
|
1457
|
+
* Field name. Supplying it renders a hidden checkbox so the toggle submits
|
|
1458
|
+
* with a surrounding form; without it the toggle is presentational.
|
|
1459
|
+
*/
|
|
1460
|
+
name?: string;
|
|
1461
|
+
/** Id applied to the hidden checkbox, for an external `<label htmlFor>`. */
|
|
1462
|
+
id?: string;
|
|
1463
|
+
/** Class applied to the label wrapper, when a `label` is given. */
|
|
1464
|
+
wrapperClassName?: string;
|
|
1465
|
+
/**
|
|
1466
|
+
* Indicator shown inside the track while disabled — usually a padlock, to
|
|
1467
|
+
* explain why the control cannot be moved. Takes a node so the component
|
|
1468
|
+
* stays independent of any icon set.
|
|
1469
|
+
*/
|
|
1470
|
+
disabledIcon?: ReactNode;
|
|
423
1471
|
}
|
|
424
1472
|
declare const Toggle: React__default.FC<ToggleProps>;
|
|
425
1473
|
|
|
@@ -444,20 +1492,18 @@ interface TooltipProps {
|
|
|
444
1492
|
declare const Tooltip: React__default.FC<TooltipProps>;
|
|
445
1493
|
|
|
446
1494
|
type TravelType = 'A' | 'C' | 'H' | 'L' | 'R' | 'B' | 'U';
|
|
447
|
-
interface TypeIconProps {
|
|
1495
|
+
interface TypeIconProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {
|
|
448
1496
|
/** Travel type code: A=Air, C=Car, H=Hotel, L=Limo, R=Rail, B=Bus, U=Unknown */
|
|
449
1497
|
type: TravelType;
|
|
450
1498
|
/** Size in pixels */
|
|
451
1499
|
size?: number;
|
|
452
1500
|
/** Show tooltip on hover */
|
|
453
1501
|
showTooltip?: boolean;
|
|
454
|
-
/** Additional CSS class */
|
|
455
|
-
className?: string;
|
|
456
1502
|
}
|
|
457
1503
|
declare const TypeIcon: React__default.FC<TypeIconProps>;
|
|
458
1504
|
|
|
459
1505
|
type VendorCode = 'DL' | 'AA' | 'UA' | 'WN' | 'B6' | 'AS' | 'F9' | 'NK' | 'G4' | 'HA' | string;
|
|
460
|
-
interface TravelServiceIconProps {
|
|
1506
|
+
interface TravelServiceIconProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {
|
|
461
1507
|
/** Travel type: A=Air, C=Car, H=Hotel, L=Limo, R=Rail */
|
|
462
1508
|
type: TravelType;
|
|
463
1509
|
/** Vendor/airline code (e.g., DL, AA, UA) */
|
|
@@ -468,8 +1514,6 @@ interface TravelServiceIconProps {
|
|
|
468
1514
|
size?: number;
|
|
469
1515
|
/** Show multi-segment indicator */
|
|
470
1516
|
multi?: boolean;
|
|
471
|
-
/** Additional CSS class */
|
|
472
|
-
className?: string;
|
|
473
1517
|
}
|
|
474
1518
|
declare const TravelServiceIcon: React__default.FC<TravelServiceIconProps>;
|
|
475
1519
|
|
|
@@ -495,6 +1539,36 @@ interface AccordionProps {
|
|
|
495
1539
|
*/
|
|
496
1540
|
declare const Accordion: React__default.FC<AccordionProps>;
|
|
497
1541
|
|
|
1542
|
+
interface BackLinkProps {
|
|
1543
|
+
/** The arrow, or whatever else marks the way back. */
|
|
1544
|
+
icon: ReactNode;
|
|
1545
|
+
/**
|
|
1546
|
+
* Element to render. Defaults to `a`; pass a router's link component to keep
|
|
1547
|
+
* navigation client-side.
|
|
1548
|
+
*
|
|
1549
|
+
* This is the reason the component takes `as` at all: the library must not
|
|
1550
|
+
* depend on a router, but every app that has one needs its links to go
|
|
1551
|
+
* through it, or the whole page reloads.
|
|
1552
|
+
*/
|
|
1553
|
+
as?: ElementType;
|
|
1554
|
+
/** Accessible name. Defaults to "Back", since an arrow alone announces nothing. */
|
|
1555
|
+
label?: string;
|
|
1556
|
+
/** Additional CSS class */
|
|
1557
|
+
className?: string;
|
|
1558
|
+
/** Inline style overrides, merged after the computed styles. */
|
|
1559
|
+
style?: CSSProperties;
|
|
1560
|
+
/** Anything else — `to` for a router link, `href` for a plain anchor, onClick. */
|
|
1561
|
+
[key: string]: unknown;
|
|
1562
|
+
}
|
|
1563
|
+
/**
|
|
1564
|
+
* The back affordance in a page header: a tap target holding a single arrow.
|
|
1565
|
+
*
|
|
1566
|
+
* It is deliberately not a Button. This navigates, so it should be a link —
|
|
1567
|
+
* middle-clickable, openable in a new tab, and announced as a link rather than
|
|
1568
|
+
* an action.
|
|
1569
|
+
*/
|
|
1570
|
+
declare const BackLink: React__default.FC<BackLinkProps>;
|
|
1571
|
+
|
|
498
1572
|
interface SegmentedSelectorOption {
|
|
499
1573
|
id: string;
|
|
500
1574
|
label?: string;
|
|
@@ -511,8 +1585,14 @@ interface SegmentedSelectorProps {
|
|
|
511
1585
|
ariaLabel?: string;
|
|
512
1586
|
/** Stable hook used by Hub acceptance and Chromatic tests. */
|
|
513
1587
|
dataTest?: string;
|
|
514
|
-
|
|
515
|
-
|
|
1588
|
+
/** Class applied to every option button. */
|
|
1589
|
+
itemClassName?: string;
|
|
1590
|
+
/** Class applied to the selected option, on top of `itemClassName`. */
|
|
1591
|
+
activeItemClassName?: string;
|
|
1592
|
+
/** Which side of the label an option's icon sits on. Defaults to left. */
|
|
1593
|
+
iconPosition?: 'left' | 'right';
|
|
1594
|
+
}
|
|
1595
|
+
declare const SegmentedSelector: ({ options, value, onChange, disabled, size, className, ariaLabel, dataTest, itemClassName, activeItemClassName, iconPosition, }: SegmentedSelectorProps) => React.JSX.Element;
|
|
516
1596
|
type CalendarViewValue = 'calendar' | 'card' | 'list';
|
|
517
1597
|
interface CalendarViewSelectorProps extends Omit<SegmentedSelectorProps, 'options' | 'value' | 'onChange' | 'ariaLabel'> {
|
|
518
1598
|
value: CalendarViewValue;
|
|
@@ -526,6 +1606,67 @@ interface CalendarTypeSelectorProps extends Omit<SegmentedSelectorProps, 'option
|
|
|
526
1606
|
}
|
|
527
1607
|
declare const CalendarTypeSelector: ({ value, onChange, ...props }: CalendarTypeSelectorProps) => React.JSX.Element;
|
|
528
1608
|
|
|
1609
|
+
interface ContactCardProps {
|
|
1610
|
+
/** Person's name. Also seeds the avatar's initials. */
|
|
1611
|
+
name?: string;
|
|
1612
|
+
/** Role or job title, shown under the name. */
|
|
1613
|
+
title?: string;
|
|
1614
|
+
/** Phone number, rendered as a `tel:` link. */
|
|
1615
|
+
phone?: string;
|
|
1616
|
+
/** Email address, rendered as a `mailto:` link. */
|
|
1617
|
+
email?: string;
|
|
1618
|
+
/**
|
|
1619
|
+
* Replaces the plain name with your own control — a button opening a
|
|
1620
|
+
* profile, say. The name is still used for the avatar's initials.
|
|
1621
|
+
*/
|
|
1622
|
+
action?: ReactNode;
|
|
1623
|
+
/** Whether to show the avatar. */
|
|
1624
|
+
showAvatar?: boolean;
|
|
1625
|
+
/** Additional CSS class */
|
|
1626
|
+
className?: string;
|
|
1627
|
+
}
|
|
1628
|
+
/**
|
|
1629
|
+
* A single person's contact details: avatar, name, title, and tappable phone
|
|
1630
|
+
* and email links.
|
|
1631
|
+
*
|
|
1632
|
+
* Renders nothing when there is neither a name nor an action, so callers can
|
|
1633
|
+
* hand it a partially filled record without guarding first.
|
|
1634
|
+
*/
|
|
1635
|
+
declare const ContactCard: React__default.FC<ContactCardProps>;
|
|
1636
|
+
|
|
1637
|
+
type DetailListVariant = 'primary' | 'secondary' | 'success' | 'warning' | 'error';
|
|
1638
|
+
interface DetailListItem {
|
|
1639
|
+
/** Name of the field. Omitted for icon rows, which read as a single line. */
|
|
1640
|
+
label?: ReactNode;
|
|
1641
|
+
/** The value. A row with nothing to show is skipped. */
|
|
1642
|
+
description?: ReactNode;
|
|
1643
|
+
/** Leading icon. Supplying one makes this an icon row rather than a pair. */
|
|
1644
|
+
icon?: ReactNode;
|
|
1645
|
+
/** Tints the value as a status chip. */
|
|
1646
|
+
variant?: DetailListVariant;
|
|
1647
|
+
}
|
|
1648
|
+
interface DetailListProps {
|
|
1649
|
+
/** Rows to show. Items with no description are skipped. */
|
|
1650
|
+
items: DetailListItem[];
|
|
1651
|
+
/** Space between rows, and between an icon and its text, in pixels. */
|
|
1652
|
+
gap?: number;
|
|
1653
|
+
/** Additional CSS class */
|
|
1654
|
+
className?: string;
|
|
1655
|
+
}
|
|
1656
|
+
/**
|
|
1657
|
+
* A compact list of field/value pairs, as used down the side of a trip or
|
|
1658
|
+
* booking summary.
|
|
1659
|
+
*
|
|
1660
|
+
* Rows come in two shapes. A `label` and `description` render as a pair, the
|
|
1661
|
+
* value aligned right and optionally tinted as a status chip. An `icon` and
|
|
1662
|
+
* `description` render as one line, with rows lacking an icon still indented
|
|
1663
|
+
* so the text stays aligned.
|
|
1664
|
+
*
|
|
1665
|
+
* The whole list disappears when no item has a description, so callers can
|
|
1666
|
+
* pass a sparse record without checking whether anything survived.
|
|
1667
|
+
*/
|
|
1668
|
+
declare const DetailList: React__default.FC<DetailListProps>;
|
|
1669
|
+
|
|
529
1670
|
type DropdownAlignment = 'left' | 'center' | 'right';
|
|
530
1671
|
interface DropdownProps {
|
|
531
1672
|
/** Label for the dropdown trigger button */
|
|
@@ -540,6 +1681,16 @@ interface DropdownProps {
|
|
|
540
1681
|
className?: string;
|
|
541
1682
|
/** Whether the dropdown is disabled */
|
|
542
1683
|
disabled?: boolean;
|
|
1684
|
+
/**
|
|
1685
|
+
* Render the trigger yourself, instead of the default labelled button.
|
|
1686
|
+
* Receives the open state and the handler that toggles the menu, so the
|
|
1687
|
+
* host can supply its own button with its own variant, icon and styling.
|
|
1688
|
+
*/
|
|
1689
|
+
trigger?: (state: {
|
|
1690
|
+
isOpen: boolean;
|
|
1691
|
+
toggle: () => void;
|
|
1692
|
+
disabled: boolean;
|
|
1693
|
+
}) => React__default.ReactNode;
|
|
543
1694
|
}
|
|
544
1695
|
interface DropdownItemProps {
|
|
545
1696
|
/** Item label */
|
|
@@ -583,6 +1734,87 @@ interface EmptyStateProps {
|
|
|
583
1734
|
/** Placeholder shown when a list, table, or panel has nothing to display. */
|
|
584
1735
|
declare const EmptyState: ({ title, description, icon, actionLabel, onAction, secondaryActionLabel, onSecondaryAction, size, children, className, }: EmptyStateProps) => React.JSX.Element;
|
|
585
1736
|
|
|
1737
|
+
interface FieldLayoutRenderProps {
|
|
1738
|
+
/** Id to put on the control, so the label points at it. */
|
|
1739
|
+
id: string;
|
|
1740
|
+
/** Value for the control's `aria-describedby`, or undefined when clean. */
|
|
1741
|
+
describedBy?: string;
|
|
1742
|
+
/** Whether an error message is showing. */
|
|
1743
|
+
hasError: boolean;
|
|
1744
|
+
}
|
|
1745
|
+
interface FieldLayoutProps {
|
|
1746
|
+
/** Renders the control. Receives the id and description wiring to apply. */
|
|
1747
|
+
children: (props: FieldLayoutRenderProps) => ReactNode;
|
|
1748
|
+
/** Field label. */
|
|
1749
|
+
label?: ReactNode;
|
|
1750
|
+
/** Whether the label sits above the control or beside it. */
|
|
1751
|
+
labelPosition?: 'top' | 'left';
|
|
1752
|
+
/** Hides the label without removing it from the layout's wiring. */
|
|
1753
|
+
showLabel?: boolean;
|
|
1754
|
+
/** Marks the field required, adding an asterisk to the label. */
|
|
1755
|
+
required?: boolean;
|
|
1756
|
+
/** Greys the field and hides the asterisk and icons. */
|
|
1757
|
+
disabled?: boolean;
|
|
1758
|
+
/** Explanatory text shown from an info icon beside the label. */
|
|
1759
|
+
tooltip?: string;
|
|
1760
|
+
/** Validation message shown beneath the control. */
|
|
1761
|
+
error?: string;
|
|
1762
|
+
/** Hint shown beneath the control, under any error. */
|
|
1763
|
+
note?: ReactNode;
|
|
1764
|
+
/** Decoration inside the leading edge of the control. */
|
|
1765
|
+
leftIcon?: ReactNode;
|
|
1766
|
+
/** Decoration inside the trailing edge of the control. */
|
|
1767
|
+
rightIcon?: ReactNode;
|
|
1768
|
+
/** Additional CSS class for the wrapper. */
|
|
1769
|
+
className?: string;
|
|
1770
|
+
}
|
|
1771
|
+
/**
|
|
1772
|
+
* The chrome around a form control: label, required marker, tooltip, the
|
|
1773
|
+
* icons that sit inside the field, and the error and hint beneath it.
|
|
1774
|
+
*
|
|
1775
|
+
* It owns none of the input's behaviour. The control is supplied as a render
|
|
1776
|
+
* prop and handed the generated id and `aria-describedby`, so any input —
|
|
1777
|
+
* native, third-party, or form-library bound — can sit inside it while keeping
|
|
1778
|
+
* the label and error correctly associated.
|
|
1779
|
+
*/
|
|
1780
|
+
declare const FieldLayout: React__default.FC<FieldLayoutProps>;
|
|
1781
|
+
|
|
1782
|
+
/** Document types a travel workflow usually accepts. */
|
|
1783
|
+
declare const DOCUMENT_FILE_EXTENSIONS: string[];
|
|
1784
|
+
interface FileUploadButtonProps {
|
|
1785
|
+
/** Text on the button, and the accessible name of the file input. */
|
|
1786
|
+
label?: string;
|
|
1787
|
+
/** Comma-separated list of accepted extensions or MIME types. */
|
|
1788
|
+
accept?: string;
|
|
1789
|
+
/** Allow choosing more than one file. */
|
|
1790
|
+
multiple?: boolean;
|
|
1791
|
+
/** Disables the control and removes the file input entirely. */
|
|
1792
|
+
disabled?: boolean;
|
|
1793
|
+
/** Shows the button's spinner, e.g. while an upload is in flight. */
|
|
1794
|
+
loading?: boolean;
|
|
1795
|
+
/** Visual style of the button. */
|
|
1796
|
+
variant?: ButtonVariant;
|
|
1797
|
+
/** Size of the button. */
|
|
1798
|
+
size?: ButtonSize;
|
|
1799
|
+
/** Icon shown after the label. */
|
|
1800
|
+
icon?: ReactNode;
|
|
1801
|
+
/** Called with the change event when files are chosen. */
|
|
1802
|
+
onSelect?: (event: ChangeEvent<HTMLInputElement>) => void;
|
|
1803
|
+
/** Additional CSS class */
|
|
1804
|
+
className?: string;
|
|
1805
|
+
/** Extra attributes for the underlying file input. */
|
|
1806
|
+
inputProps?: Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'accept' | 'multiple' | 'onChange'>;
|
|
1807
|
+
}
|
|
1808
|
+
/**
|
|
1809
|
+
* A styled button that opens the file picker.
|
|
1810
|
+
*
|
|
1811
|
+
* The file input is the control: it sits transparently over the button and
|
|
1812
|
+
* carries the accessible name, so keyboard and screen-reader users get one
|
|
1813
|
+
* "choose file" control rather than a button and an input side by side. The
|
|
1814
|
+
* button underneath is decorative and hidden from assistive technology.
|
|
1815
|
+
*/
|
|
1816
|
+
declare const FileUploadButton: React__default.FC<FileUploadButtonProps>;
|
|
1817
|
+
|
|
586
1818
|
interface FilterOption {
|
|
587
1819
|
value: string;
|
|
588
1820
|
label: string;
|
|
@@ -681,6 +1913,39 @@ interface FormStackProps {
|
|
|
681
1913
|
/** Standard vertical form-field rhythm used by Hub modal forms. */
|
|
682
1914
|
declare const FormStack: ({ children, gap, className }: FormStackProps) => React.JSX.Element;
|
|
683
1915
|
|
|
1916
|
+
/** A side of the tile, used to describe how it joins its neighbours. */
|
|
1917
|
+
type InfoTileEdge = 'left' | 'right' | 'top' | 'bottom';
|
|
1918
|
+
interface InfoTileProps {
|
|
1919
|
+
/** Figure the tile exists to show, e.g. a count or a date. */
|
|
1920
|
+
value: ReactNode;
|
|
1921
|
+
/** Short caption naming what the value measures. */
|
|
1922
|
+
label: ReactNode;
|
|
1923
|
+
/** Optional leading icon, rendered in its own bordered cell. */
|
|
1924
|
+
icon?: ReactNode;
|
|
1925
|
+
/**
|
|
1926
|
+
* Edges whose corners should be square rather than rounded. Use when the
|
|
1927
|
+
* tile sits against another so the pair reads as one control.
|
|
1928
|
+
*/
|
|
1929
|
+
square?: InfoTileEdge[];
|
|
1930
|
+
/**
|
|
1931
|
+
* Edges that should not draw a border. Give this to the second tile of a
|
|
1932
|
+
* pair so the two share a single divider instead of stacking two.
|
|
1933
|
+
*/
|
|
1934
|
+
borderless?: InfoTileEdge[];
|
|
1935
|
+
/** Additional CSS class */
|
|
1936
|
+
className?: string;
|
|
1937
|
+
/** Inline style overrides, merged after the computed tile styles. */
|
|
1938
|
+
style?: CSSProperties;
|
|
1939
|
+
}
|
|
1940
|
+
/**
|
|
1941
|
+
* Compact statistic tile pairing a figure with a caption and an optional icon.
|
|
1942
|
+
*
|
|
1943
|
+
* Tiles are designed to butt together into a strip — horizontally on narrow
|
|
1944
|
+
* screens, vertically on wide ones — by squaring the touching corners and
|
|
1945
|
+
* dropping the duplicated border.
|
|
1946
|
+
*/
|
|
1947
|
+
declare const InfoTile: React__default.FC<InfoTileProps>;
|
|
1948
|
+
|
|
684
1949
|
type ManifestView = 'passengers' | 'equipment';
|
|
685
1950
|
interface ManifestViewToggleProps {
|
|
686
1951
|
view: ManifestView;
|
|
@@ -692,6 +1957,64 @@ interface ManifestViewToggleProps {
|
|
|
692
1957
|
}
|
|
693
1958
|
declare const ManifestViewToggle: ({ view, onView, paxCount, eqCount, locked, className, }: ManifestViewToggleProps) => React.JSX.Element;
|
|
694
1959
|
|
|
1960
|
+
/** A user option that can be searched for and selected. */
|
|
1961
|
+
interface MultiUserSearchOption {
|
|
1962
|
+
/** Unique identifier for the user. */
|
|
1963
|
+
id: string | number;
|
|
1964
|
+
/** Display name. */
|
|
1965
|
+
name: string;
|
|
1966
|
+
/** Email address. */
|
|
1967
|
+
email: string;
|
|
1968
|
+
/** Optional job title or role. */
|
|
1969
|
+
title?: string;
|
|
1970
|
+
/** Whether this option is disabled. */
|
|
1971
|
+
disabled?: boolean;
|
|
1972
|
+
/** Reason the option is disabled, shown as tooltip. */
|
|
1973
|
+
disabledReason?: string;
|
|
1974
|
+
}
|
|
1975
|
+
interface MultiUserSearchProps {
|
|
1976
|
+
/** Label for the search input. */
|
|
1977
|
+
label?: string;
|
|
1978
|
+
/** Placeholder text. */
|
|
1979
|
+
placeholder?: string;
|
|
1980
|
+
/** Options to display when search matches or is empty. */
|
|
1981
|
+
options: MultiUserSearchOption[];
|
|
1982
|
+
/** Currently selected user IDs. */
|
|
1983
|
+
selectedIds: (string | number)[];
|
|
1984
|
+
/** Called when user types in the search input. Debounce in the host if needed. */
|
|
1985
|
+
onSearch?: (query: string) => void;
|
|
1986
|
+
/** Called when selection changes. */
|
|
1987
|
+
onSelectionChange: (ids: (string | number)[]) => void;
|
|
1988
|
+
/** Whether the host is loading search results. */
|
|
1989
|
+
loading?: boolean;
|
|
1990
|
+
/** Whether the component is disabled. */
|
|
1991
|
+
disabled?: boolean;
|
|
1992
|
+
/** Minimum characters before triggering search callback. */
|
|
1993
|
+
minSearchLength?: number;
|
|
1994
|
+
/** Helper text shown below the input. */
|
|
1995
|
+
helperText?: string;
|
|
1996
|
+
/** Error message to display. */
|
|
1997
|
+
error?: string;
|
|
1998
|
+
/** Additional CSS class. */
|
|
1999
|
+
className?: string;
|
|
2000
|
+
/** Test ID for automation. */
|
|
2001
|
+
'data-test'?: string;
|
|
2002
|
+
}
|
|
2003
|
+
/**
|
|
2004
|
+
* Multi-select user search with typeahead dropdown.
|
|
2005
|
+
*
|
|
2006
|
+
* Features:
|
|
2007
|
+
* - Single search input that populates a dropdown of matching users
|
|
2008
|
+
* - Multi-select via checkboxes or clicking options
|
|
2009
|
+
* - Selected users shown as dismissible badges above the input
|
|
2010
|
+
* - Keyboard navigation (arrow keys, enter, escape)
|
|
2011
|
+
* - Loading state while searching
|
|
2012
|
+
*/
|
|
2013
|
+
declare const MultiUserSearch: {
|
|
2014
|
+
({ label, placeholder, options, selectedIds, onSearch, onSelectionChange, loading, disabled, minSearchLength, helperText, error, className, "data-test": dataTest, }: MultiUserSearchProps): React__default.JSX.Element;
|
|
2015
|
+
displayName: string;
|
|
2016
|
+
};
|
|
2017
|
+
|
|
695
2018
|
type NavItemVariant = 'default' | 'pill';
|
|
696
2019
|
type NavItemSize = 'sm' | 'md' | 'lg';
|
|
697
2020
|
interface NavItemProps {
|
|
@@ -726,6 +2049,31 @@ interface NavItemProps {
|
|
|
726
2049
|
}
|
|
727
2050
|
declare const NavItem: React__default.FC<NavItemProps>;
|
|
728
2051
|
|
|
2052
|
+
interface PageHeaderProps {
|
|
2053
|
+
/** The page's heading. */
|
|
2054
|
+
title?: ReactNode;
|
|
2055
|
+
/** Smaller line above the title, naming the section the page sits in. */
|
|
2056
|
+
pretitle?: ReactNode;
|
|
2057
|
+
/** Content directly beneath the title — tabs, a summary line, filters. */
|
|
2058
|
+
after?: ReactNode;
|
|
2059
|
+
/**
|
|
2060
|
+
* Slot for a back control, rendered to the left of the title. Takes a node
|
|
2061
|
+
* so the host supplies its own router link and icon, keeping this component
|
|
2062
|
+
* independent of any router.
|
|
2063
|
+
*/
|
|
2064
|
+
back?: ReactNode;
|
|
2065
|
+
/** Additional CSS class */
|
|
2066
|
+
className?: string;
|
|
2067
|
+
}
|
|
2068
|
+
/**
|
|
2069
|
+
* Standard page heading: an optional back control, a pretitle, the title, and
|
|
2070
|
+
* a slot beneath for anything that belongs with it.
|
|
2071
|
+
*
|
|
2072
|
+
* The header keeps its height while `title` is empty and fades in once one
|
|
2073
|
+
* arrives, so pages do not jump as their data loads.
|
|
2074
|
+
*/
|
|
2075
|
+
declare const PageHeader: React__default.FC<PageHeaderProps>;
|
|
2076
|
+
|
|
729
2077
|
/** A rendered slot in the page list: either a page number or a truncation gap. */
|
|
730
2078
|
type PaginationItem = number | 'ellipsis';
|
|
731
2079
|
interface PaginationProps {
|
|
@@ -791,6 +2139,11 @@ interface ProgressCircleProps {
|
|
|
791
2139
|
showLabel?: boolean;
|
|
792
2140
|
/** Additional CSS class */
|
|
793
2141
|
className?: string;
|
|
2142
|
+
/**
|
|
2143
|
+
* Explicit diameter in pixels, for indicators smaller or larger than the
|
|
2144
|
+
* named ramp. The stroke scales with it.
|
|
2145
|
+
*/
|
|
2146
|
+
diameter?: number;
|
|
794
2147
|
}
|
|
795
2148
|
declare const ProgressBar: React__default.FC<ProgressBarProps>;
|
|
796
2149
|
declare const ProgressCircle: React__default.FC<ProgressCircleProps>;
|
|
@@ -799,6 +2152,32 @@ declare const Progress: {
|
|
|
799
2152
|
Circle: React__default.FC<ProgressCircleProps>;
|
|
800
2153
|
};
|
|
801
2154
|
|
|
2155
|
+
interface ResultCountProps {
|
|
2156
|
+
/** How many rows are on screen right now. */
|
|
2157
|
+
count: number;
|
|
2158
|
+
/**
|
|
2159
|
+
* What is being counted, singular — "trip", "traveler". Pluralised by adding
|
|
2160
|
+
* an "s" unless `pluralNoun` says otherwise.
|
|
2161
|
+
*/
|
|
2162
|
+
noun: string;
|
|
2163
|
+
/** Plural form, for the nouns an "s" does not fit ("person" -> "people"). */
|
|
2164
|
+
pluralNoun?: string;
|
|
2165
|
+
/** Additional CSS class */
|
|
2166
|
+
className?: string;
|
|
2167
|
+
/** Inline style overrides, merged after the computed styles. */
|
|
2168
|
+
style?: CSSProperties;
|
|
2169
|
+
}
|
|
2170
|
+
/**
|
|
2171
|
+
* The "12 trips displayed" line that sits above a filtered list.
|
|
2172
|
+
*
|
|
2173
|
+
* It reports what is on screen, not what exists — the distinction matters when
|
|
2174
|
+
* a filter is applied, which is exactly when someone reads it.
|
|
2175
|
+
*
|
|
2176
|
+
* The count is announced politely so screen-reader users hear the list resize
|
|
2177
|
+
* as they filter, instead of having to go looking for the number.
|
|
2178
|
+
*/
|
|
2179
|
+
declare const ResultCount: React__default.FC<ResultCountProps>;
|
|
2180
|
+
|
|
802
2181
|
interface ToolbarAction {
|
|
803
2182
|
/** Action label */
|
|
804
2183
|
label: string;
|
|
@@ -992,6 +2371,8 @@ interface ServiceToggleListProps {
|
|
|
992
2371
|
onClick?: (key: string) => void;
|
|
993
2372
|
/** Additional CSS class */
|
|
994
2373
|
className?: string;
|
|
2374
|
+
/** Disable every service toggle */
|
|
2375
|
+
disabled?: boolean;
|
|
995
2376
|
}
|
|
996
2377
|
/**
|
|
997
2378
|
* ServiceToggle component for a single service item.
|
|
@@ -1018,6 +2399,25 @@ interface SupplierTypeToggleProps {
|
|
|
1018
2399
|
}
|
|
1019
2400
|
declare const SupplierTypeToggle: ({ value, defaultValue, onChange, disabled, className, }: SupplierTypeToggleProps) => React.JSX.Element;
|
|
1020
2401
|
|
|
2402
|
+
interface TeamCalendarHeaderProps {
|
|
2403
|
+
/** Short team abbreviation, e.g. "MBB". Always shown. */
|
|
2404
|
+
teamCode: string;
|
|
2405
|
+
/** Full team name, shown alongside the code once there is room for it. */
|
|
2406
|
+
teamFullName?: string;
|
|
2407
|
+
/** Content beneath the identity — trip counts, a next-trip date, actions. */
|
|
2408
|
+
children?: ReactNode;
|
|
2409
|
+
/** Additional CSS class */
|
|
2410
|
+
className?: string;
|
|
2411
|
+
}
|
|
2412
|
+
/**
|
|
2413
|
+
* The heading of a team's column in the travel calendar: the team's code, its
|
|
2414
|
+
* full name where space allows, and whatever summary belongs underneath.
|
|
2415
|
+
*
|
|
2416
|
+
* It sticks to the top of its column so the team stays identifiable while the
|
|
2417
|
+
* schedule scrolls.
|
|
2418
|
+
*/
|
|
2419
|
+
declare const TeamCalendarHeader: React__default.FC<TeamCalendarHeaderProps>;
|
|
2420
|
+
|
|
1021
2421
|
interface TeamHeaderProps {
|
|
1022
2422
|
/** Fully composed title. Overrides teamCode/teamName when supplied. */
|
|
1023
2423
|
title?: ReactNode;
|
|
@@ -1595,7 +2995,12 @@ interface DrawerProps {
|
|
|
1595
2995
|
/** Position of the drawer */
|
|
1596
2996
|
position?: DrawerPosition;
|
|
1597
2997
|
/** Size of the drawer */
|
|
1598
|
-
|
|
2998
|
+
/**
|
|
2999
|
+
* One of the named sizes, or an explicit CSS length (e.g. '300px', '50%')
|
|
3000
|
+
* for panels the ramp does not carry. The length applies to width for a
|
|
3001
|
+
* left/right drawer and to height for top/bottom.
|
|
3002
|
+
*/
|
|
3003
|
+
size?: DrawerSize | (string & {});
|
|
1599
3004
|
/** Drawer content */
|
|
1600
3005
|
children: React__default.ReactNode;
|
|
1601
3006
|
/** Whether clicking backdrop closes drawer */
|
|
@@ -1653,6 +3058,8 @@ interface TravelDueDateItem {
|
|
|
1653
3058
|
tripId: string;
|
|
1654
3059
|
tripName: string;
|
|
1655
3060
|
masterTripGUID?: string;
|
|
3061
|
+
/** Set by the API when the due date has passed; used by `overdueOnly`. */
|
|
3062
|
+
pastdue?: boolean;
|
|
1656
3063
|
}
|
|
1657
3064
|
type GroupedTravelDueDates = Record<string, TravelDueDateItem[]>;
|
|
1658
3065
|
interface DueDatesDrawerProps {
|
|
@@ -1660,14 +3067,148 @@ interface DueDatesDrawerProps {
|
|
|
1660
3067
|
dueDates: GroupedTravelDueDates;
|
|
1661
3068
|
selectedDate?: string | null;
|
|
1662
3069
|
selectedTrip?: string | null;
|
|
3070
|
+
/**
|
|
3071
|
+
* NG-702/NG-811: opened via the Overdue Actions card — only past-due,
|
|
3072
|
+
* incomplete items count toward that card's number, so the panel must match
|
|
3073
|
+
* rather than showing every due date.
|
|
3074
|
+
*/
|
|
3075
|
+
overdueOnly?: boolean;
|
|
1663
3076
|
onClose: () => void;
|
|
1664
3077
|
onToggle?: (item: TravelDueDateItem) => void;
|
|
1665
3078
|
onTaskClick?: (masterTripGUID: string) => void;
|
|
1666
3079
|
className?: string;
|
|
1667
3080
|
}
|
|
1668
3081
|
declare const isTravelDueDateCompleted: (item: Pick<TravelDueDateItem, "status" | "completeddatetime">) => boolean;
|
|
3082
|
+
declare const isTravelDueDateOverdue: (item: Pick<TravelDueDateItem, "completeddatetime" | "pastdue">) => boolean;
|
|
1669
3083
|
/** Hub's searchable, status-aware due-dates drawer. */
|
|
1670
|
-
declare const DueDatesDrawer: ({ isOpen, dueDates, selectedDate, selectedTrip, onClose, onToggle, onTaskClick, className }: DueDatesDrawerProps) => React.JSX.Element;
|
|
3084
|
+
declare const DueDatesDrawer: ({ isOpen, dueDates, selectedDate, selectedTrip, overdueOnly, onClose, onToggle, onTaskClick, className }: DueDatesDrawerProps) => React.JSX.Element;
|
|
3085
|
+
|
|
3086
|
+
/** A row is any record; columns address it by key. */
|
|
3087
|
+
type GridRow = Record<string, unknown>;
|
|
3088
|
+
interface GridCellRenderProps<R> {
|
|
3089
|
+
/** The whole row, for renderers that need more than one field. */
|
|
3090
|
+
row: R;
|
|
3091
|
+
/** Position in the sorted data, for numbering or alternating output. */
|
|
3092
|
+
rowIndex: number;
|
|
3093
|
+
/** The column's key. */
|
|
3094
|
+
name?: string;
|
|
3095
|
+
}
|
|
3096
|
+
interface GridColumn<R = GridRow> {
|
|
3097
|
+
/** Key of the field this column shows. */
|
|
3098
|
+
name?: string;
|
|
3099
|
+
/** Column heading. */
|
|
3100
|
+
label?: ReactNode;
|
|
3101
|
+
/** Renders the heading from the column key, for headings that need state. */
|
|
3102
|
+
labelAs?: (props: {
|
|
3103
|
+
name?: string;
|
|
3104
|
+
}) => ReactNode;
|
|
3105
|
+
/** Icon shown before the heading. */
|
|
3106
|
+
icon?: ReactNode;
|
|
3107
|
+
/** Renders the cell instead of printing the field. */
|
|
3108
|
+
as?: (props: GridCellRenderProps<R>) => ReactNode;
|
|
3109
|
+
/** Formats the field for display. Return falsy to show an en dash. */
|
|
3110
|
+
format?: (value: never, row: R) => ReactNode;
|
|
3111
|
+
/** Whether the column can be sorted by clicking its heading. */
|
|
3112
|
+
sortable?: boolean;
|
|
3113
|
+
/** Orders two rows. Defaults to comparing the field directly. */
|
|
3114
|
+
sortComparator?: (a: R, b: R) => number;
|
|
3115
|
+
/** Class applied to the column's cells. */
|
|
3116
|
+
className?: string;
|
|
3117
|
+
/** Class applied to the column's heading. */
|
|
3118
|
+
labelClassName?: string;
|
|
3119
|
+
}
|
|
3120
|
+
interface GridTotalRow {
|
|
3121
|
+
/** Label shown in the first column of the total row. */
|
|
3122
|
+
label: string;
|
|
3123
|
+
/** Column whose values are summed. */
|
|
3124
|
+
columnName: string;
|
|
3125
|
+
}
|
|
3126
|
+
interface GridTableProps<R = GridRow> {
|
|
3127
|
+
/** Column definitions, left to right. */
|
|
3128
|
+
columns: GridColumn<R>[];
|
|
3129
|
+
/** Rows to show. */
|
|
3130
|
+
data: R[];
|
|
3131
|
+
/**
|
|
3132
|
+
* CSS grid template for the columns. Defaults to equal fractions, one per
|
|
3133
|
+
* column.
|
|
3134
|
+
*/
|
|
3135
|
+
gridTemplateColumns?: string;
|
|
3136
|
+
/** Field whose value keys each row. Falls back to `id`, then the index. */
|
|
3137
|
+
rowKey?: string;
|
|
3138
|
+
/** Content above and below the heading row. */
|
|
3139
|
+
header?: {
|
|
3140
|
+
above?: ReactNode;
|
|
3141
|
+
below?: ReactNode;
|
|
3142
|
+
};
|
|
3143
|
+
/** Column sorted on first render. */
|
|
3144
|
+
initialSortColumn?: string;
|
|
3145
|
+
/** Whether that initial sort is ascending. */
|
|
3146
|
+
initialSortAscending?: boolean;
|
|
3147
|
+
/** Tie-breaker applied when the chosen column compares equal. */
|
|
3148
|
+
secondarySortComparator?: (a: R, b: R) => number;
|
|
3149
|
+
/** Draws a rule between rows. */
|
|
3150
|
+
bordered?: boolean;
|
|
3151
|
+
/** Shown in place of the rows when there are none. */
|
|
3152
|
+
emptyMessage?: ReactNode;
|
|
3153
|
+
/** Sums a column into a sticky footer row. */
|
|
3154
|
+
totalRow?: GridTotalRow;
|
|
3155
|
+
/** Additional CSS class */
|
|
3156
|
+
className?: string;
|
|
3157
|
+
}
|
|
3158
|
+
/**
|
|
3159
|
+
* A data table laid out with CSS grid rather than table markup, so a row can
|
|
3160
|
+
* be an arbitrary composition rather than a fixed set of cells.
|
|
3161
|
+
*
|
|
3162
|
+
* It reflows on narrow screens: the heading row is hidden and each row becomes
|
|
3163
|
+
* a card whose cells carry their own labels, which keeps wide datasets legible
|
|
3164
|
+
* on a phone.
|
|
3165
|
+
*
|
|
3166
|
+
* Sorting is held internally — click a sortable heading to sort by it, click
|
|
3167
|
+
* again to reverse — and an optional total row sums a column into a sticky
|
|
3168
|
+
* footer.
|
|
3169
|
+
*/
|
|
3170
|
+
declare function GridTable<R = GridRow>({ columns, data, gridTemplateColumns, rowKey, header, initialSortColumn, initialSortAscending, secondarySortComparator, bordered, emptyMessage, totalRow, className, }: GridTableProps<R>): React__default.JSX.Element;
|
|
3171
|
+
declare namespace GridTable {
|
|
3172
|
+
var displayName: string;
|
|
3173
|
+
}
|
|
3174
|
+
|
|
3175
|
+
interface GridHeaderRowProps<R = GridRow> {
|
|
3176
|
+
/** Columns to head. Takes GridTable's column type, so the two stay in step. */
|
|
3177
|
+
columns: GridColumn<R>[];
|
|
3178
|
+
/**
|
|
3179
|
+
* The grid's track sizes, e.g. `"2fr 1fr 120px"`. Optional: a strip used as a
|
|
3180
|
+
* spanning band over other headings has one cell and no tracks to describe.
|
|
3181
|
+
*/
|
|
3182
|
+
gridTemplateColumns?: string;
|
|
3183
|
+
/** Content above the headings — a spanning band, a group label. */
|
|
3184
|
+
above?: ReactNode;
|
|
3185
|
+
/** Content below the headings. */
|
|
3186
|
+
below?: ReactNode;
|
|
3187
|
+
/** Additional CSS class */
|
|
3188
|
+
className?: string;
|
|
3189
|
+
/** Inline style overrides. */
|
|
3190
|
+
style?: CSSProperties;
|
|
3191
|
+
}
|
|
3192
|
+
/**
|
|
3193
|
+
* A grid heading strip on its own, without a table underneath it.
|
|
3194
|
+
*
|
|
3195
|
+
* GridTable renders its own headings and is the right answer whenever the
|
|
3196
|
+
* headings belong to the rows below them. This is for the cases where they do
|
|
3197
|
+
* not: two header strips side by side above one table, or a band that spans
|
|
3198
|
+
* several columns stacked over the real headings. Both need a heading row that
|
|
3199
|
+
* is not tied to a row set, which GridTable cannot express.
|
|
3200
|
+
*
|
|
3201
|
+
* Headings are plain text here, never sort controls — there are no rows to
|
|
3202
|
+
* sort. `sortable` on a column is ignored rather than rendering a button that
|
|
3203
|
+
* does nothing.
|
|
3204
|
+
*
|
|
3205
|
+
* Hidden below 768px, matching GridTable: at that width each row becomes a card
|
|
3206
|
+
* carrying its own labels, so a detached heading strip would caption nothing.
|
|
3207
|
+
*/
|
|
3208
|
+
declare function GridHeaderRow<R = GridRow>({ columns, gridTemplateColumns, above, below, className, style, }: GridHeaderRowProps<R>): React.JSX.Element;
|
|
3209
|
+
declare namespace GridHeaderRow {
|
|
3210
|
+
var displayName: string;
|
|
3211
|
+
}
|
|
1671
3212
|
|
|
1672
3213
|
interface HubNavigationItem {
|
|
1673
3214
|
key: string;
|
|
@@ -1723,13 +3264,16 @@ interface HubAppShellProps {
|
|
|
1723
3264
|
loading?: boolean;
|
|
1724
3265
|
contentDisabled?: boolean;
|
|
1725
3266
|
showContent?: boolean;
|
|
3267
|
+
/** Logo for expanded sidebar state */
|
|
1726
3268
|
logo?: ReactNode;
|
|
3269
|
+
/** Logo for collapsed sidebar state (icon only, no text) */
|
|
3270
|
+
collapsedLogo?: ReactNode;
|
|
1727
3271
|
defaultExpanded?: boolean;
|
|
1728
3272
|
betaLabel?: string;
|
|
1729
3273
|
className?: string;
|
|
1730
3274
|
}
|
|
1731
3275
|
/** The shared application navigation and content shell used by Hub and its Storybook pages. */
|
|
1732
|
-
declare const HubAppShell: ({ children, navItems, individualTravelItem, agentsItem, sourcingItem, offFleetItem, adminItem, footerNavItems, activeNavKey, onNavigate, onLogoClick, onLegacyPortal, accountSelector, renderTopbarActions, renderMobileExtras, mobileFooter, profileMenu, userInitials, isAdmin, navigationDisabled, loading, contentDisabled, showContent, logo, defaultExpanded, betaLabel, className, }: HubAppShellProps) => React.JSX.Element;
|
|
3276
|
+
declare const HubAppShell: ({ children, navItems, individualTravelItem, agentsItem, sourcingItem, offFleetItem, adminItem, footerNavItems, activeNavKey, onNavigate, onLogoClick, onLegacyPortal, accountSelector, renderTopbarActions, renderMobileExtras, mobileFooter, profileMenu, userInitials, isAdmin, navigationDisabled, loading, contentDisabled, showContent, logo, collapsedLogo, defaultExpanded, betaLabel, className, }: HubAppShellProps) => React.JSX.Element;
|
|
1733
3277
|
|
|
1734
3278
|
/**
|
|
1735
3279
|
* Parses an `YYYY-MM-DD` itinerary date into a *local* calendar date.
|
|
@@ -2327,6 +3871,8 @@ interface RequestSummaryProps {
|
|
|
2327
3871
|
className?: string;
|
|
2328
3872
|
/** Title for the summary panel */
|
|
2329
3873
|
title?: string;
|
|
3874
|
+
/** Stable selector for integration and browser tests */
|
|
3875
|
+
dataTest?: string;
|
|
2330
3876
|
}
|
|
2331
3877
|
/**
|
|
2332
3878
|
* SummarySection component for a group of related summary items.
|
|
@@ -2357,9 +3903,9 @@ interface RequestFormHeaderProps {
|
|
|
2357
3903
|
}
|
|
2358
3904
|
interface RequestFormFooterProps {
|
|
2359
3905
|
/** Callback for cancel/previous button */
|
|
2360
|
-
onPrevious
|
|
3906
|
+
onPrevious?: () => void;
|
|
2361
3907
|
/** Callback for next/submit button */
|
|
2362
|
-
onNext
|
|
3908
|
+
onNext?: () => void;
|
|
2363
3909
|
/** Whether on first page */
|
|
2364
3910
|
isFirstPage?: boolean;
|
|
2365
3911
|
/** Whether on last page */
|
|
@@ -2370,6 +3916,10 @@ interface RequestFormFooterProps {
|
|
|
2370
3916
|
previousText?: string;
|
|
2371
3917
|
/** Custom next button text */
|
|
2372
3918
|
nextText?: string;
|
|
3919
|
+
/** Test hook for the previous button */
|
|
3920
|
+
previousButtonDataTest?: string;
|
|
3921
|
+
/** Test hook for the next button */
|
|
3922
|
+
nextButtonDataTest?: string;
|
|
2373
3923
|
/** Additional CSS class */
|
|
2374
3924
|
className?: string;
|
|
2375
3925
|
}
|
|
@@ -3677,6 +5227,12 @@ interface ChartersAccessManagementPageProps {
|
|
|
3677
5227
|
/**
|
|
3678
5228
|
* Account-scoped access management for the STM Charters workspace.
|
|
3679
5229
|
*
|
|
5230
|
+
* Features:
|
|
5231
|
+
* - Single search input with dropdown for finding and selecting multiple users
|
|
5232
|
+
* - Selected users shown as dismissible badges
|
|
5233
|
+
* - Role assignment before adding
|
|
5234
|
+
* - Bulk add support
|
|
5235
|
+
*
|
|
3680
5236
|
* The page deliberately owns only interaction state. Memberships, authorization guards,
|
|
3681
5237
|
* persistence, routing, and account/global-admin recovery remain controlled by the host.
|
|
3682
5238
|
*/
|
|
@@ -3699,6 +5255,8 @@ interface CharterSectionCard {
|
|
|
3699
5255
|
countLabel?: string;
|
|
3700
5256
|
/** Optional icon override. Unknown keys otherwise use the standard plane icon. */
|
|
3701
5257
|
icon?: ReactNode;
|
|
5258
|
+
/** Whether the count is still loading. When true, shows a spinner instead of count. */
|
|
5259
|
+
loading?: boolean;
|
|
3702
5260
|
}
|
|
3703
5261
|
/** A named STM contact for one of the two bid programs. */
|
|
3704
5262
|
interface CharterContact {
|
|
@@ -5058,5 +6616,5 @@ declare const TripDetailPage: {
|
|
|
5058
6616
|
displayName: string;
|
|
5059
6617
|
};
|
|
5060
6618
|
|
|
5061
|
-
export { ACMI_AIRCRAFT_OPTIONS, ACMI_CARRIER_OPTIONS, ACMI_INSURANCE_FLAT, Accordion, AcmiQuoteCalculator, AdministrationPage, AgentGroupTravelRequestsPage, AgentGroupTravelRequestsTable, AirSegment, Alert, AppLayout, ArrowDownLeftIcon, ArrowUpRightIcon, Avatar, AvatarGroup, BID_TYPE_HEADINGS, Badge, BuildingIcon, BusIcon, Button, CARRIER_CATERING_OPTIONS, CARRIER_CONTACT_TYPES, CHAMPIONSHIP_BID_TYPES, CHAMPIONSHIP_HEADINGS, CHARTER_CONTACT_GROUPS, CHARTER_SECTIONS, CalendarIcon, CalendarTypeSelector, CalendarViewSelector, CarIcon, Card, CardBody, CardFooter, CardHeader, CarrierProfilePage, ChampionshipBidDetailPage, ChampionshipBidsPage, CharterBidResponsePage, CharterBidViewPage, CharterManifestPage, CharterSourcingEmailPreview, ChartersAccessManagementPage, ChartersHomePage, CheckIcon, Checkbox, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, ConfirmModal, ContactList, ContactUsPage, CubeIcon, DashboardIcon, DashboardPage, Datepicker, DocumentIcon, DownloadIcon, Drawer, DrawerBody, DrawerFooter, DrawerHeader, Dropdown, DueDatesDrawer, EditIcon, EmptyState, EyeIcon, FeatureFlagManagementPage, FilterChip, FilterIcon, FormField, FormRow, FormSection, FormStack, GridIcon, GroundSegment, GroupTravelRequestPage, HUB_ADMIN_ITEM, HUB_AGENTS_ITEM, HUB_INDIVIDUAL_TRAVEL_ITEM, HUB_NAV_ITEMS, HUB_OFF_FLEET_ITEM, HUB_SOURCING_ITEM, HUB_STM_CHARTERS_ITEM, HeadsetIcon, HomeIcon, HotelIcon, HotelSegment, HubAppShell, Icons, IndividualTravelPage, IndividualTravelRequestDetailPage, IndividualTravelRequestFormPage, InfoCenterPage, InfoIcon, Input, ItineraryPage, ItinerarySegmentCard, ItineraryTimeline, LightbulbIcon, LimoIcon, LockIcon, LogoIcon, MailIcon, ManifestCapacityStats, ManifestViewToggle, MegaphoneIcon, MembershipPrograms, MenuIcon, Metric, MinusIcon, Modal, ModalFooter, Module, ModuleDivider, ModuleVerticalDivider, NavItem, NotFoundPage, OFF_FLEET_LEARNED_DESCRIPTION, OFF_FLEET_LEARNED_EMPTY_COPY, OFF_FLEET_QUEUE_DESCRIPTION, OffFleetLearnedExamplesPage, OffFleetReviewQueuePage, OffFleetSubmissionDetailPage, PageBanners, Pagination, PhoneIcon, PlaneIcon, PlusIcon, PreferencesPanel, PrinterIcon, Progress, ProgressBar, ProgressCircle, QuoteCostBreakdown, QuoteReviewActions, REGULAR_SEASON_BID_TYPES, RailIcon, RefreshIcon, RegularSeasonBidsPage, RegularSeasonBidsTable, ReportIcon, RequestFormFooter, RequestFormHeader, RequestFormLayout, RequestSummary, RosterProgramNumbersPage, RosterReportsPage, RosterToolbar, SOURCING_COST_CATEGORIES, SOURCING_COST_CATEGORY_LABELS, SUPPLIER_TYPE_OPTIONS, SchoolContactForm, SearchField, SearchIcon, Segment, SegmentedSelector, Select, SelectFilter, ServiceToggle, ServiceToggleList, SettingsIcon, Sidenav, SourcingQuoteDetailPage, SourcingReviewQueuePage, SourcingReviewQueueTable, Spinner, StatusBadge, SummarySection, SupplierTypeToggle, TRIP_MONTH_OPTIONS, Table, Tag, TeamCard, TeamContactsPanel, TeamEquipmentForm, TeamHeader, TeamImportForm, TeamManagementPage, TeamProgramForm, TeamRosterMemberForm, TeamScheduleActions, TeamScheduleCompactTable, TeamScheduleEditor, TeamScheduleExpandedTable, TeamSchedulePage, TeamSubMenu, TeamTravelCalendarCardView, TeamTravelCalendarListView, TeamTravelCalendarPage, TeamTravelCalendarToolbar, TeamTravelCalendarView, TeamUserAccessForm, Textarea, Timepicker, Title, Toggle, Tooltip, Topbar, TrashIcon, TravelServiceIcon, TravelSummaryMetrics, TravelerForm, TrendDownIcon, TrendUpIcon, TripDetailPage, TripSegment, TripTable, TypeIcon, UploadIcon, UserIcon, UsersIcon, WarningIcon, XIcon, buildPaginationItems, computeLineItemTotal, computeQuoteTotals, computeTravelTypeCodes, deriveProgramBidStatus, formatCompactTripCost, formatItineraryDate, formatItineraryDateRange, formatItineraryMoney, formatTeamScheduleDueDate, formatTeamScheduleTravelDates, getCharterSourcingEmailRoute, getCharterSourcingEmailSubject, getPageCount, getSegmentDate, getSegmentStartMinutes, getSegmentTitle, getTeamTravelCalendarPeriodLabel, groupSegmentsByDay, isExpiringSoon, isProgramBiddable, isQuoteActionable, isTravelDueDateCompleted, matchesQuoteSearch, moveTeamTravelCalendarPeriod, parseClockTime, parseItineraryDate };
|
|
5062
|
-
export type { AccordionProps, AccountInfo, AcmiAircraftOption, AcmiLeg, AcmiPositioningMode, AcmiQuoteCalculatorProps, AcmiQuoteInputs, AcmiQuoteResult, AdministrationCard, AdministrationPageProps, AdministrationTab, AgentGroupTravelRequest, AgentGroupTravelRequestSportOption, AgentGroupTravelRequestViewOption, AgentGroupTravelRequestsPageProps, AirSegmentProps, AlertProps, AlertVariant, AppLayoutProps, AvatarGroupProps, AvatarProps, AvatarSize, BadgeProps, BadgeSize, BadgeVariant, ButtonProps, ButtonSize, ButtonVariant, CalendarMetric, CalendarTypeSelectorProps, CalendarTypeValue, CalendarView, CalendarViewSelectorProps, CalendarViewValue, CardBodyProps, CardFooterProps, CardHeaderProps, CardPadding, CardProps, CardVariant, CarrierAircraft, CarrierContact, CarrierProfilePageProps, CarrierProfilePreferences, CarrierProfileTab, ChampionshipBid, ChampionshipBidDetail, ChampionshipBidDetailPageProps, ChampionshipBidType, ChampionshipBidsPageProps, CharterBidLevel, CharterBidResponsePageProps, CharterBidSubmission, CharterBidTarget, CharterBidViewPageProps, CharterContact, CharterContactGroup, CharterFlightProgramBid, CharterManifestEquipment, CharterManifestPageProps, CharterManifestPassenger, CharterManifestSegment, CharterSectionCard, CharterSourcingEmailChange, CharterSourcingEmailChanges, CharterSourcingEmailLeg, CharterSourcingEmailPreviewProps, CharterSourcingEmailQuote, CharterSourcingEmailVariant, CharterSubmissionType, CharterSubmittedBid, CharterTripBid, CharterTripBidStatus, ChartersAccessId, ChartersAccessManagementPageProps, ChartersAccessMembership, ChartersAccessRole, ChartersAccountUser, ChartersHomePageProps, CheckboxProps, ConfirmModalProps, Contact, ContactCardData, ContactInfo, ContactListProps, ContactPair, ContactUsData, ContactUsPageProps, DashboardPageProps, DatepickerProps, DatepickerSize, DrawerBodyProps, DrawerFooterProps, DrawerHeaderProps, DrawerPosition, DrawerProps, DrawerSize, DropdownAlignment, DropdownItemProps, DropdownProps, DueDatesDrawerProps, EmptyStateProps, EmptyStateSize, FeatureFlagDefinition, FeatureFlagIdentifier, FeatureFlagManagementPageProps, FeatureFlagRule, FeatureFlagRuleDeactivateRequest, FeatureFlagRuleEditRequest, FeatureFlagRuleEffect, FeatureFlagRuleFormValue, FeatureFlagTargetOption, FeatureFlagTargetOptions, FeatureFlagTargetType, FilterChipProps, FilterOption, FlightData, FormFieldProps, FormRowProps, FormSectionProps, FormStackProps, GroundData, GroundSegmentProps, GroupTravelDueField, GroupTravelDueStatus, GroupTravelPnr, GroupTravelRequestContact, GroupTravelRequestFieldValue, GroupTravelRequestPageProps, GroupTravelRequestSource, GroupTravelRequestValues, GroupedTravelDueDates, HotelData, HotelSegmentProps, HubAppShellActions, HubAppShellProps, HubNavigationItem, IconName, IconProps, IndividualTravelExportRequest, IndividualTravelExportScope, IndividualTravelFilters, IndividualTravelPageProps, IndividualTravelPagination, IndividualTravelRequestAirLeg, IndividualTravelRequestAirRequest, IndividualTravelRequestAirTripType, IndividualTravelRequestAnswerValue, IndividualTravelRequestBusRequest, IndividualTravelRequestCarLeg, IndividualTravelRequestCarRequest, IndividualTravelRequestCurrentTraveler, IndividualTravelRequestDetail, IndividualTravelRequestDetailPageProps, IndividualTravelRequestFormConfiguration, IndividualTravelRequestFormPageProps, IndividualTravelRequestHotelLeg, IndividualTravelRequestHotelRequest, IndividualTravelRequestLabeledAnswer, IndividualTravelRequestOption, IndividualTravelRequestQuestion, IndividualTravelRequestQuestionType, IndividualTravelRequestService, IndividualTravelRequestSubmitter, IndividualTravelRequestTraveler, IndividualTravelRequestTravelerType, IndividualTravelRequestValues, IndividualTravelTabCounts, InfoCenterArticle, InfoCenterPageProps, InfoCenterPageState, InputProps, InputSize, ItineraryAgent, ItineraryAirSegment, ItineraryCarSegment, ItineraryDay, ItineraryHotelSegment, ItineraryPageProps, ItinerarySegment, ItinerarySegmentCardProps, ItinerarySegmentStatus, ItineraryTimelineProps, ManifestCapacityStatsProps, ManifestSendState, ManifestView, ManifestViewToggleProps, MembershipProgram, MembershipProgramsProps, MetricProps, ModalFooterProps, ModalProps, ModalSize, ModuleProps, ModuleSize, NavItemProps, NavItemSize, NavItemVariant, NotFoundPageProps, OffFleetLearnedExample, OffFleetLearnedExamplesPageProps, OffFleetLeg, OffFleetLegDiagnostic, OffFleetLegMatch, OffFleetPreflightCheck, OffFleetPreflightRow, OffFleetPriceBasis, OffFleetQuoteHeader, OffFleetReviewQueuePageProps, OffFleetSubmission, OffFleetSubmissionDetailPageProps, OffFleetSubmissionStatus, OffFleetTripGrouping, OffFleetTripSegment, PageBannersProps, PaginationItem, PaginationProps, PreferenceField, PreferenceSection, PreferencesPanelProps, ProgressBarProps, ProgressCircleProps, ProgressSize, ProgressVariant, QuoteCostBreakdownProps, QuoteCostTotals, QuoteFieldChange, QuoteReviewActionsProps, RegularSeasonBidType, RegularSeasonBidsPageProps, RegularSeasonBidsTableProps, RequestFormFooterProps, RequestFormHeaderProps, RequestFormLayoutProps, RequestSummaryProps, RosterProgramNumberId, RosterProgramNumberRow, RosterProgramNumbersPageProps, RosterReportOption, RosterReportsPageProps, RosterToolbarProps, ScheduleFilterOption, ScheduleMetric, SchoolContactFormProps, SearchFieldProps, SeasonOption, SegmentOption, SegmentProps, SegmentVariant, SegmentedSelectorOption, SegmentedSelectorProps, SelectFilterOption, SelectFilterProps, SelectOption, SelectOptionGroup, SelectProps, SelectSize, ServiceConfig, ServiceToggleListProps, ServiceToggleProps, SidenavItem, SidenavProps, SourcingCostAdjustment, SourcingCostCategory, SourcingCostLineItem, SourcingQuote, SourcingQuoteDetailPageProps, SourcingQuoteLeg, SourcingQuoteLegType, SourcingQuoteStatus, SourcingReviewQueuePageProps, SourcingReviewQueueTableProps, SpinnerProps, SpinnerSize, StatusBadgeProps, StatusBadgeVariant, SummaryItem, SummarySectionConfig, SummarySegment, SupplierTypeToggleProps, SupplierTypeValue, SystemBanner, TabKey, TableColumn, TableProps, TableRowKey, TagProps, TagSize, TagVariant, TeamCardProps, TeamContactId, TeamContactOption, TeamContactsLoadingState, TeamContactsPanelProps, TeamContactsValue, TeamEquipmentFormProps, TeamEquipmentValues, TeamFormMode, TeamHeaderProps, TeamImportFormProps, TeamImportKind, TeamManagementPageProps, TeamManagementTab, TeamNumericValue, TeamOption, TeamPortalUserOption, TeamProgramFormProps, TeamProgramType, TeamProgramValues, TeamRosterMemberFormProps, TeamRosterMemberValues, TeamScheduleActionsProps, TeamScheduleCompactEvent, TeamScheduleCompactRow, TeamScheduleCompactTableProps, TeamScheduleCompactTrip, TeamScheduleDueDate, TeamScheduleEditorEvent, TeamScheduleEditorProps, TeamScheduleEditorTrip, TeamScheduleExpandedRow, TeamScheduleExpandedTableProps, TeamScheduleHomeAway, TeamSchedulePageProps, TeamSubMenuProps, TeamSubMenuTab, TeamTravelCalendarCardViewProps, TeamTravelCalendarDueDate, TeamTravelCalendarDuration, TeamTravelCalendarEvent, TeamTravelCalendarItemType, TeamTravelCalendarListViewProps, TeamTravelCalendarPageProps, TeamTravelCalendarSportGroup, TeamTravelCalendarToolbarProps, TeamTravelCalendarTrip, TeamTravelCalendarViewProps, TeamUserAccessFormProps, TeamUserAccessValues, TextareaProps, TimepickerProps, TimepickerSize, TitleProps, TitleWeight, ToggleProps, ToggleSize, ToolbarAction, TooltipPosition, TooltipProps, TooltipVariant, TopbarProps, TravelAlertBanner, TravelDueDateItem, TravelServiceIconProps, TravelSummaryMetricsProps, TravelType, TravelerFormData, TravelerFormProps, TripData, TripDetailPageProps, TripSegmentProps, TripTableProps, TypeIconProps, VendorCode };
|
|
6619
|
+
export { ACMI_AIRCRAFT_OPTIONS, ACMI_CARRIER_OPTIONS, ACMI_INSURANCE_FLAT, Accordion, AcmiQuoteCalculator, AdministrationPage, AgentGroupTravelRequestsPage, AgentGroupTravelRequestsTable, AirSegment, Alert, AlertStyled, AppLayout, ArrowDownLeftIcon, ArrowUpRightIcon, Avatar, AvatarGroup, BID_TYPE_HEADINGS, BackLink, Badge, BuildingIcon, BusIcon, Button, ButtonStyled, CARRIER_CATERING_OPTIONS, CARRIER_CONTACT_TYPES, CHAMPIONSHIP_BID_TYPES, CHAMPIONSHIP_HEADINGS, CHARTER_CONTACT_GROUPS, CHARTER_SECTIONS, CalendarIcon, CalendarTypeSelector, CalendarViewSelector, CarIcon, Card, CardBody, CardFooter, CardHeader, CarrierProfilePage, ChampionshipBidDetailPage, ChampionshipBidsPage, CharterBidResponsePage, CharterBidViewPage, CharterManifestPage, CharterSourcingEmailPreview, ChartersAccessManagementPage, ChartersHomePage, CheckIcon, Checkbox, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, ConfirmModal, ContactCard, ContactList, ContactUsPage, CubeIcon, DOCUMENT_FILE_EXTENSIONS, DashboardIcon, DashboardPage, Datepicker, DetailList, DocumentIcon, DownloadIcon, Drawer, DrawerBody, DrawerFooter, DrawerHeader, Dropdown, DueDatesDrawer, EditIcon, EmptyState, EyeIcon, FeatureFlagManagementPage, FieldLayout, FileUploadButton, FilterChip, FilterIcon, FormField, FormRow, FormSection, FormStack, GridHeaderRow, GridIcon, GridTable, GroundSegment, GroupTravelRequestPage, HUB_ADMIN_ITEM, HUB_AGENTS_ITEM, HUB_INDIVIDUAL_TRAVEL_ITEM, HUB_NAV_ITEMS, HUB_OFF_FLEET_ITEM, HUB_SOURCING_ITEM, HUB_STM_CHARTERS_ITEM, HeadsetIcon, HomeIcon, HotelIcon, HotelSegment, HubAppShell, Icons, IndividualTravelPage, IndividualTravelRequestDetailPage, IndividualTravelRequestFormPage, InfoCenterPage, InfoIcon, InfoTile, Input, ItineraryPage, ItinerarySegmentCard, ItineraryTimeline, LightbulbIcon, LimoIcon, LockIcon, LogoIcon, MailIcon, ManifestCapacityStats, ManifestViewToggle, MegaphoneIcon, MembershipPrograms, MenuIcon, Metric, MinusIcon, Modal, ModalFooter, Module, ModuleDivider, ModuleVerticalDivider, MultiUserSearch, NavItem, NotFoundPage, OFF_FLEET_LEARNED_DESCRIPTION, OFF_FLEET_LEARNED_EMPTY_COPY, OFF_FLEET_QUEUE_DESCRIPTION, OffFleetLearnedExamplesPage, OffFleetReviewQueuePage, OffFleetSubmissionDetailPage, PageBanners, PageHeader, Pagination, PhoneIcon, PlaneIcon, PlusIcon, PreferencesPanel, PrinterIcon, Progress, ProgressBar, ProgressCircle, QuoteCostBreakdown, QuoteReviewActions, REGULAR_SEASON_BID_TYPES, RailIcon, RefreshIcon, RegularSeasonBidsPage, RegularSeasonBidsTable, ReportIcon, RequestFormFooter, RequestFormHeader, RequestFormLayout, RequestSummary, ResultCount, RosterProgramNumbersPage, RosterReportsPage, RosterToolbar, SOURCING_COST_CATEGORIES, SOURCING_COST_CATEGORY_LABELS, SUPPLIER_TYPE_OPTIONS, SchoolContactForm, SearchField, SearchIcon, Segment, SegmentedSelector, Select, SelectFilter, ServiceToggle, ServiceToggleList, SettingsIcon, Sidenav, SourcingQuoteDetailPage, SourcingReviewQueuePage, SourcingReviewQueueTable, Spinner, StatusBadge, SummarySection, SupplierTypeToggle, TRIP_MONTH_OPTIONS, Table, Tag, TeamCalendarHeader, TeamCard, TeamContactsPanel, TeamEquipmentForm, TeamHeader, TeamImportForm, TeamManagementPage, TeamProgramForm, TeamRosterMemberForm, TeamScheduleActions, TeamScheduleCompactTable, TeamScheduleEditor, TeamScheduleExpandedTable, TeamSchedulePage, TeamSubMenu, TeamTravelCalendarCardView, TeamTravelCalendarListView, TeamTravelCalendarPage, TeamTravelCalendarToolbar, TeamTravelCalendarView, TeamUserAccessForm, Textarea, ThemeProvider, Timepicker, Title, Toggle, Tooltip, Topbar, TrashIcon, TravelServiceIcon, TravelSummaryMetrics, TravelerForm, TrendDownIcon, TrendUpIcon, TripDetailPage, TripSegment, TripTable, TypeIcon, UploadIcon, UserIcon, UsersIcon, WarningIcon, XIcon, absoluteFill, accentColors, alertTokens, boxShadow, brandColors, breakpoints, buildPaginationItems, buttonReset, computeLineItemTotal, computeQuoteTotals, computeTravelTypeCodes, css, darkTheme, lightTheme as defaultTheme, deriveProgramBidStatus, flexCenter, flexCol, flexRow, font, fontFamily, fontSize, fontWeight, formatCompactTripCost, formatItineraryDate, formatItineraryDateRange, formatItineraryMoney, formatTeamScheduleDueDate, formatTeamScheduleTravelDates, getCharterSourcingEmailRoute, getCharterSourcingEmailSubject, getPageCount, getSegmentDate, getSegmentStartMinutes, getSegmentTitle, getTeamTravelCalendarPeriodLabel, groupSegmentsByDay, isExpiringSoon, isProgramBiddable, isQuoteActionable, isTravelDueDateCompleted, isTravelDueDateOverdue, leading, lightTheme, lineClamp, lineHeight, matchesQuoteSearch, merge, moveTeamTravelCalendarPeriod, neutralColors, parseClockTime, parseItineraryDate, primaryColors, radius, rounded, semanticColors, shadow, size, space, spacing, srOnly, statusColors, styled, teamColors, textColors, toInlineStyle, trans, transition, truncate, useTheme, weight };
|
|
6620
|
+
export type { AccordionProps, AccountInfo, AcmiAircraftOption, AcmiLeg, AcmiPositioningMode, AcmiQuoteCalculatorProps, AcmiQuoteInputs, AcmiQuoteResult, AdministrationCard, AdministrationPageProps, AdministrationTab, AgentGroupTravelRequest, AgentGroupTravelRequestSportOption, AgentGroupTravelRequestViewOption, AgentGroupTravelRequestsPageProps, AirSegmentProps, AlertProps, AlertStyledProps, AlertVariant$1 as AlertVariant, AppLayoutProps, AvatarGroupProps, AvatarProps, AvatarSize, BackLinkProps, BadgeProps, BadgeSize, BadgeVariant, ButtonProps, ButtonSize$1 as ButtonSize, ButtonStyledProps, ButtonVariant$1 as ButtonVariant, CSSObject, CalendarMetric, CalendarTypeSelectorProps, CalendarTypeValue, CalendarView, CalendarViewSelectorProps, CalendarViewValue, CardBodyProps, CardFooterProps, CardHeaderProps, CardPadding, CardProps, CardVariant, CarrierAircraft, CarrierContact, CarrierProfilePageProps, CarrierProfilePreferences, CarrierProfileTab, ChampionshipBid, ChampionshipBidDetail, ChampionshipBidDetailPageProps, ChampionshipBidType, ChampionshipBidsPageProps, CharterBidLevel, CharterBidResponsePageProps, CharterBidSubmission, CharterBidTarget, CharterBidViewPageProps, CharterContact, CharterContactGroup, CharterFlightProgramBid, CharterManifestEquipment, CharterManifestPageProps, CharterManifestPassenger, CharterManifestSegment, CharterSectionCard, CharterSourcingEmailChange, CharterSourcingEmailChanges, CharterSourcingEmailLeg, CharterSourcingEmailPreviewProps, CharterSourcingEmailQuote, CharterSourcingEmailVariant, CharterSubmissionType, CharterSubmittedBid, CharterTripBid, CharterTripBidStatus, ChartersAccessId, ChartersAccessManagementPageProps, ChartersAccessMembership, ChartersAccessRole, ChartersAccountUser, ChartersHomePageProps, CheckboxProps, ConfirmModalProps, Contact, ContactCardData, ContactCardProps, ContactInfo, ContactListProps, ContactPair, ContactUsData, ContactUsPageProps, DashboardPageProps, DatepickerProps, DatepickerSize, DetailListItem, DetailListProps, DetailListVariant, DrawerBodyProps, DrawerFooterProps, DrawerHeaderProps, DrawerPosition, DrawerProps, DrawerSize, DropdownAlignment, DropdownItemProps, DropdownProps, DueDatesDrawerProps, EmptyStateProps, EmptyStateSize, FeatureFlagDefinition, FeatureFlagIdentifier, FeatureFlagManagementPageProps, FeatureFlagRule, FeatureFlagRuleDeactivateRequest, FeatureFlagRuleEditRequest, FeatureFlagRuleEffect, FeatureFlagRuleFormValue, FeatureFlagTargetOption, FeatureFlagTargetOptions, FeatureFlagTargetType, FieldLayoutProps, FieldLayoutRenderProps, FileUploadButtonProps, FilterChipProps, FilterOption, FlightData, FormFieldProps, FormRowProps, FormSectionProps, FormStackProps, GridCellRenderProps, GridColumn, GridHeaderRowProps, GridRow, GridTableProps, GridTotalRow, GroundData, GroundSegmentProps, GroupTravelDueField, GroupTravelDueStatus, GroupTravelPnr, GroupTravelRequestContact, GroupTravelRequestFieldValue, GroupTravelRequestPageProps, GroupTravelRequestSource, GroupTravelRequestValues, GroupedTravelDueDates, HotelData, HotelSegmentProps, HubAppShellActions, HubAppShellProps, HubNavigationItem, IconName, IconProps, IndividualTravelExportRequest, IndividualTravelExportScope, IndividualTravelFilters, IndividualTravelPageProps, IndividualTravelPagination, IndividualTravelRequestAirLeg, IndividualTravelRequestAirRequest, IndividualTravelRequestAirTripType, IndividualTravelRequestAnswerValue, IndividualTravelRequestBusRequest, IndividualTravelRequestCarLeg, IndividualTravelRequestCarRequest, IndividualTravelRequestCurrentTraveler, IndividualTravelRequestDetail, IndividualTravelRequestDetailPageProps, IndividualTravelRequestFormConfiguration, IndividualTravelRequestFormPageProps, IndividualTravelRequestHotelLeg, IndividualTravelRequestHotelRequest, IndividualTravelRequestLabeledAnswer, IndividualTravelRequestOption, IndividualTravelRequestQuestion, IndividualTravelRequestQuestionType, IndividualTravelRequestService, IndividualTravelRequestSubmitter, IndividualTravelRequestTraveler, IndividualTravelRequestTravelerType, IndividualTravelRequestValues, IndividualTravelTabCounts, InfoCenterArticle, InfoCenterPageProps, InfoCenterPageState, InfoTileEdge, InfoTileProps, InputProps, InputSize, ItineraryAgent, ItineraryAirSegment, ItineraryCarSegment, ItineraryDay, ItineraryHotelSegment, ItineraryPageProps, ItinerarySegment, ItinerarySegmentCardProps, ItinerarySegmentStatus, ItineraryTimelineProps, ManifestCapacityStatsProps, ManifestSendState, ManifestView, ManifestViewToggleProps, MembershipProgram, MembershipProgramsProps, MetricProps, ModalFooterProps, ModalProps, ModalSize, ModuleProps, ModuleSize, MultiUserSearchOption, MultiUserSearchProps, NavItemProps, NavItemSize, NavItemVariant, NotFoundPageProps, OffFleetLearnedExample, OffFleetLearnedExamplesPageProps, OffFleetLeg, OffFleetLegDiagnostic, OffFleetLegMatch, OffFleetPreflightCheck, OffFleetPreflightRow, OffFleetPriceBasis, OffFleetQuoteHeader, OffFleetReviewQueuePageProps, OffFleetSubmission, OffFleetSubmissionDetailPageProps, OffFleetSubmissionStatus, OffFleetTripGrouping, OffFleetTripSegment, PageBannersProps, PageHeaderProps, PaginationItem, PaginationProps, PreferenceField, PreferenceSection, PreferencesPanelProps, ProgressBarProps, ProgressCircleProps, ProgressSize, ProgressVariant, QuoteCostBreakdownProps, QuoteCostTotals, QuoteFieldChange, QuoteReviewActionsProps, RegularSeasonBidType, RegularSeasonBidsPageProps, RegularSeasonBidsTableProps, RequestFormFooterProps, RequestFormHeaderProps, RequestFormLayoutProps, RequestSummaryProps, ResultCountProps, RosterProgramNumberId, RosterProgramNumberRow, RosterProgramNumbersPageProps, RosterReportOption, RosterReportsPageProps, RosterToolbarProps, ScheduleFilterOption, ScheduleMetric, SchoolContactFormProps, SearchFieldProps, SeasonOption, SegmentOption, SegmentProps, SegmentVariant, SegmentedSelectorOption, SegmentedSelectorProps, SelectFilterOption, SelectFilterProps, SelectOption, SelectOptionGroup, SelectProps, SelectSize, ServiceConfig, ServiceToggleListProps, ServiceToggleProps, SidenavItem, SidenavProps, SourcingCostAdjustment, SourcingCostCategory, SourcingCostLineItem, SourcingQuote, SourcingQuoteDetailPageProps, SourcingQuoteDraft, SourcingQuoteLeg, SourcingQuoteLegType, SourcingQuoteStatus, SourcingReviewQueuePageProps, SourcingReviewQueueTableProps, SpinnerProps, SpinnerSize, StatusBadgeProps, StatusBadgeVariant, StyleFunction, SummaryItem, SummarySectionConfig, SummarySegment, SupplierTypeToggleProps, SupplierTypeValue, SystemBanner, TabKey, TableColumn, TableProps, TableRowKey, TagProps, TagSize, TagVariant, TeamCalendarHeaderProps, TeamCardProps, TeamContactId, TeamContactOption, TeamContactsLoadingState, TeamContactsPanelProps, TeamContactsValue, TeamEquipmentFormProps, TeamEquipmentValues, TeamFormMode, TeamHeaderProps, TeamImportFormProps, TeamImportKind, TeamManagementPageProps, TeamManagementTab, TeamNumericValue, TeamOption, TeamPortalUserOption, TeamProgramFormProps, TeamProgramType, TeamProgramValues, TeamRosterMemberFormProps, TeamRosterMemberValues, TeamScheduleActionsProps, TeamScheduleCompactEvent, TeamScheduleCompactRow, TeamScheduleCompactTableProps, TeamScheduleCompactTrip, TeamScheduleDueDate, TeamScheduleEditorEvent, TeamScheduleEditorProps, TeamScheduleEditorTrip, TeamScheduleExpandedRow, TeamScheduleExpandedTableProps, TeamScheduleHomeAway, TeamSchedulePageProps, TeamSubMenuProps, TeamSubMenuTab, TeamTravelCalendarCardViewProps, TeamTravelCalendarDueDate, TeamTravelCalendarDuration, TeamTravelCalendarEvent, TeamTravelCalendarItemType, TeamTravelCalendarListViewProps, TeamTravelCalendarPageProps, TeamTravelCalendarSportGroup, TeamTravelCalendarToolbarProps, TeamTravelCalendarTrip, TeamTravelCalendarViewProps, TeamUserAccessFormProps, TeamUserAccessValues, TextareaProps, Theme, ThemeBreakpoint, ThemeColors, ThemeContextValue, ThemeMode, ThemeProviderProps, ThemeRadius, ThemeShadow, ThemeSpacing, ThemeTransition, ThemeTypography, TimepickerProps, TimepickerSize, TitleProps, TitleWeight, ToggleProps, ToggleSize, ToolbarAction, TooltipPosition, TooltipProps, TooltipVariant, TopbarProps, TravelAlertBanner, TravelDueDateItem, TravelServiceIconProps, TravelSummaryMetricsProps, TravelType, TravelerFormData, TravelerFormProps, TripData, TripDetailPageProps, TripSegmentProps, TripTableProps, TypeIconProps, VendorCode };
|