@lucasvu/scope-ui 0.1.2 → 0.1.5
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/AI_SETUP.md +1 -1
- package/README.md +182 -0
- package/RULES.md +52 -0
- package/bin/copy-theme-assets.mjs +1 -1
- package/dist/{chunk-CL3F2TWE.js → chunk-QBAHQOOH.js} +1 -7
- package/dist/core/index.js +1 -1
- package/dist/index.cjs +5716 -5721
- package/dist/index.d.cts +1249 -624
- package/dist/index.d.ts +1249 -624
- package/dist/index.js +5792 -5793
- package/dist/styles.css +1 -1
- package/package.json +4 -3
package/dist/index.d.cts
CHANGED
|
@@ -1,50 +1,56 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import { ReactNode, CSSProperties, SVGProps, ButtonHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, HTMLAttributes, FormHTMLAttributes, LabelHTMLAttributes, TableHTMLAttributes, TdHTMLAttributes, ThHTMLAttributes, RefObject, ElementType } from 'react';
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
3
2
|
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
3
|
+
import * as react from 'react';
|
|
4
|
+
import { ReactNode, CSSProperties, SVGProps, HTMLAttributes, ElementType, ButtonHTMLAttributes, TableHTMLAttributes, TdHTMLAttributes, ThHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, FormHTMLAttributes, LabelHTMLAttributes, RefObject } from 'react';
|
|
4
5
|
import { VariantProps } from 'class-variance-authority';
|
|
5
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
6
|
-
import * as SelectPrimitive from '@radix-ui/react-select';
|
|
7
6
|
export { ColorMode, ROOT_CLIENT_THEME_ATTRIBUTE, ROOT_COLOR_MODE_ATTRIBUTE, UiAiComponentDescriptor, UiAiComponentProp, UiScreenBriefField, UiScreenKind, UiThemeLayerAsset, UiThemePreset, UiThemeToken, applyDocumentClientTheme, applyDocumentColorMode, cn, getSystemColorMode, initializeDocumentColorMode, isColorMode, subscribeToSystemColorMode, syncDocumentColorModeToSystem, uiAiManifest, uiDefaultThemePreset, uiProjectAiRules, uiScreenBlueprint, uiScreenBriefFields, uiThemeContract, uiThemeLayerAssets, uiThemePresets } from './core/index.cjs';
|
|
7
|
+
import * as SelectPrimitive from '@radix-ui/react-select';
|
|
8
8
|
|
|
9
9
|
type ComponentSize = 'sm' | 'md' | 'lg';
|
|
10
10
|
interface SharedComponentProps {
|
|
11
|
+
/**
|
|
12
|
+
* Visible label rendered above the component or control.
|
|
13
|
+
*/
|
|
11
14
|
label?: ReactNode;
|
|
15
|
+
/**
|
|
16
|
+
* Helper content shown below the control when there is no error.
|
|
17
|
+
*/
|
|
12
18
|
helperText?: ReactNode;
|
|
19
|
+
/**
|
|
20
|
+
* Error content displayed below the control with higher priority.
|
|
21
|
+
*/
|
|
13
22
|
errorMessage?: ReactNode;
|
|
23
|
+
/**
|
|
24
|
+
* Loading state while the component is processing or waiting for data.
|
|
25
|
+
*/
|
|
14
26
|
loading?: boolean;
|
|
27
|
+
/**
|
|
28
|
+
* Disables user interaction with the component.
|
|
29
|
+
*/
|
|
15
30
|
disabled?: boolean;
|
|
31
|
+
/**
|
|
32
|
+
* Shared visual size of the component.
|
|
33
|
+
*/
|
|
16
34
|
size?: ComponentSize;
|
|
35
|
+
/**
|
|
36
|
+
* Extra class names for extending styles from the outside.
|
|
37
|
+
*/
|
|
17
38
|
className?: string;
|
|
39
|
+
/**
|
|
40
|
+
* Inline styles applied directly to the component root wrapper.
|
|
41
|
+
*/
|
|
18
42
|
style?: CSSProperties;
|
|
19
43
|
}
|
|
20
44
|
declare const spinnerSizes: Record<'xs' | 'sm' | 'md' | 'lg', string>;
|
|
21
45
|
interface LoadingSpinnerProps extends SVGProps<SVGSVGElement> {
|
|
46
|
+
/**
|
|
47
|
+
* Visual size of the loading spinner icon.
|
|
48
|
+
*/
|
|
22
49
|
size?: keyof typeof spinnerSizes;
|
|
23
50
|
}
|
|
24
51
|
|
|
25
|
-
declare const alertVariants: (props?: ({
|
|
26
|
-
variant?: "default" | "info" | "success" | "warning" | "destructive" | null | undefined;
|
|
27
|
-
size?: "sm" | "md" | "lg" | null | undefined;
|
|
28
|
-
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
29
|
-
type AlertVariant = NonNullable<VariantProps<typeof alertVariants>['variant']>;
|
|
30
|
-
type AlertTone = 'neutral' | 'info' | 'success' | 'warning' | 'danger';
|
|
31
|
-
interface AlertProps extends SharedComponentProps {
|
|
32
|
-
description?: ReactNode;
|
|
33
|
-
icon?: ReactNode;
|
|
34
|
-
tone?: AlertTone;
|
|
35
|
-
variant?: AlertVariant;
|
|
36
|
-
title?: ReactNode;
|
|
37
|
-
children?: ReactNode;
|
|
38
|
-
}
|
|
39
|
-
/**
|
|
40
|
-
* Status-aware alert panel with selectable variants, helper text, and optional iconography.
|
|
41
|
-
* @remarks
|
|
42
|
-
* Use `variant` (default/info/success/warning/destructive) and `size` (sm/md/lg) to tune the tone, show `description` or `helperText`, and decorate with a spinner via `loading`.
|
|
43
|
-
*/
|
|
44
|
-
declare const Alert: react.ForwardRefExoticComponent<AlertProps & react.RefAttributes<HTMLDivElement>>;
|
|
45
|
-
|
|
46
52
|
declare const badgeVariants: (props?: ({
|
|
47
|
-
variant?: "
|
|
53
|
+
variant?: "solid" | "outline" | "success" | "warning" | "destructive" | null | undefined;
|
|
48
54
|
size?: "sm" | "md" | "lg" | null | undefined;
|
|
49
55
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
50
56
|
type BadgeVariant = VariantProps<typeof badgeVariants>['variant'];
|
|
@@ -60,95 +66,161 @@ interface BadgeProps extends SharedComponentProps {
|
|
|
60
66
|
*/
|
|
61
67
|
declare function Badge({ variant, size, label, helperText, errorMessage, loading, disabled, className, style, text, children, ...props }: BadgeProps): react_jsx_runtime.JSX.Element;
|
|
62
68
|
|
|
63
|
-
type
|
|
64
|
-
|
|
65
|
-
|
|
69
|
+
type SidebarItem$1 = {
|
|
70
|
+
/**
|
|
71
|
+
* Unique identifier of the sidebar item.
|
|
72
|
+
*/
|
|
73
|
+
id: string;
|
|
74
|
+
/**
|
|
75
|
+
* Title rendered directly in the menu.
|
|
76
|
+
*/
|
|
77
|
+
title?: string;
|
|
78
|
+
/**
|
|
79
|
+
* i18n key when the title is translated outside this component.
|
|
80
|
+
*/
|
|
81
|
+
titleKey?: string;
|
|
82
|
+
/**
|
|
83
|
+
* Item icon, either a ReactNode or a component type.
|
|
84
|
+
*/
|
|
85
|
+
icon?: ReactNode | ElementType;
|
|
86
|
+
/**
|
|
87
|
+
* Navigation target when the item is clicked.
|
|
88
|
+
*/
|
|
66
89
|
href?: string;
|
|
67
|
-
|
|
90
|
+
/**
|
|
91
|
+
* Required permission(s) for the item to be visible.
|
|
92
|
+
*/
|
|
93
|
+
permission?: string | string[];
|
|
94
|
+
/**
|
|
95
|
+
* Nested child items.
|
|
96
|
+
*/
|
|
97
|
+
children?: SidebarItem$1[];
|
|
68
98
|
};
|
|
69
|
-
type
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
99
|
+
type PermissionChecker = (permission: string | string[] | undefined, userPermissions?: string[]) => boolean;
|
|
100
|
+
interface SidebarProps extends HTMLAttributes<HTMLElement> {
|
|
101
|
+
/**
|
|
102
|
+
* Full item tree rendered inside the sidebar.
|
|
103
|
+
*/
|
|
104
|
+
items: SidebarItem$1[];
|
|
105
|
+
/**
|
|
106
|
+
* Current permission list of the active user.
|
|
107
|
+
*/
|
|
108
|
+
userPermissions?: string[];
|
|
109
|
+
/**
|
|
110
|
+
* Custom permission checking function.
|
|
111
|
+
*/
|
|
112
|
+
permissionChecker?: PermissionChecker;
|
|
113
|
+
/**
|
|
114
|
+
* `id` of the currently active item.
|
|
115
|
+
*/
|
|
116
|
+
activeItemId?: string;
|
|
117
|
+
/**
|
|
118
|
+
* Callback fired when the user clicks an item.
|
|
119
|
+
*/
|
|
120
|
+
onItemClick?: (item: SidebarItem$1) => void;
|
|
121
|
+
/**
|
|
122
|
+
* Extra class names for the top-level list.
|
|
123
|
+
*/
|
|
124
|
+
listClassName?: string;
|
|
125
|
+
/**
|
|
126
|
+
* Extra class names for nested lists.
|
|
127
|
+
*/
|
|
128
|
+
nestedListClassName?: string;
|
|
129
|
+
/**
|
|
130
|
+
* Extra class names applied to each item.
|
|
131
|
+
*/
|
|
132
|
+
itemClassName?: string;
|
|
133
|
+
/**
|
|
134
|
+
* Indentation size for each nested level.
|
|
135
|
+
*/
|
|
136
|
+
indentSize?: number;
|
|
137
|
+
/**
|
|
138
|
+
* Accessibility label for the `nav` element.
|
|
139
|
+
*/
|
|
140
|
+
ariaLabel?: string;
|
|
141
|
+
/**
|
|
142
|
+
* Enables collapsing and expanding the sidebar.
|
|
143
|
+
*/
|
|
144
|
+
collapsible?: boolean;
|
|
145
|
+
/**
|
|
146
|
+
* Controlled collapsed state from the parent.
|
|
147
|
+
*/
|
|
148
|
+
collapsed?: boolean;
|
|
149
|
+
/**
|
|
150
|
+
* Default collapsed state in uncontrolled mode.
|
|
151
|
+
*/
|
|
152
|
+
defaultCollapsed?: boolean;
|
|
153
|
+
/**
|
|
154
|
+
* Callback fired when the collapsed state changes.
|
|
155
|
+
*/
|
|
156
|
+
onCollapseChange?: (collapsed: boolean) => void;
|
|
157
|
+
/**
|
|
158
|
+
* Sidebar width when collapsed.
|
|
159
|
+
*/
|
|
160
|
+
collapsedWidth?: number | string;
|
|
161
|
+
/**
|
|
162
|
+
* Sidebar width when expanded.
|
|
163
|
+
*/
|
|
164
|
+
expandedWidth?: number | string;
|
|
165
|
+
/**
|
|
166
|
+
* Accessibility label for the collapse/expand button.
|
|
167
|
+
*/
|
|
168
|
+
collapseButtonLabel?: string;
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
type ArgonSidebarHeaderRender = (state: {
|
|
172
|
+
collapsed: boolean;
|
|
173
|
+
hoverExpanded: boolean;
|
|
174
|
+
}) => React.ReactNode;
|
|
175
|
+
type ArgonSidebarProps = SidebarProps & {
|
|
176
|
+
/**
|
|
177
|
+
* Callback fired when hover-expansion state changes.
|
|
178
|
+
*/
|
|
179
|
+
onHoverChange?: (hovered: boolean) => void;
|
|
180
|
+
/**
|
|
181
|
+
* Header content or a render function for dynamic header content.
|
|
182
|
+
*/
|
|
183
|
+
header?: React.ReactNode | ArgonSidebarHeaderRender;
|
|
73
184
|
};
|
|
74
|
-
|
|
185
|
+
/**
|
|
186
|
+
* Argon-style sidebar for legacy `main-fe` with collapse and permission filtering.
|
|
187
|
+
*/
|
|
188
|
+
declare function ArgonSidebar({ items, userPermissions, permissionChecker, activeItemId, onItemClick, listClassName, nestedListClassName, itemClassName, indentSize, ariaLabel, className, collapsible, collapsed, defaultCollapsed, onCollapseChange, collapsedWidth, expandedWidth, collapseButtonLabel, style, onHoverChange, header, ...rest }: ArgonSidebarProps): react_jsx_runtime.JSX.Element;
|
|
75
189
|
|
|
76
190
|
declare const buttonVariants$1: (props?: ({
|
|
77
|
-
variant?: "link" | "
|
|
191
|
+
variant?: "link" | "outline" | "destructive" | "default" | "confirm" | "secondary" | "ghost" | "create" | null | undefined;
|
|
78
192
|
size?: "sm" | "md" | "lg" | "icon" | null | undefined;
|
|
79
193
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
80
194
|
type ButtonVariant$1 = VariantProps<typeof buttonVariants$1>['variant'];
|
|
81
195
|
type ButtonSize$1 = 'sm' | 'md' | 'lg' | 'icon';
|
|
82
196
|
interface ButtonProps$1 extends Omit<SharedComponentProps, 'size'>, Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'size' | 'className'> {
|
|
197
|
+
/**
|
|
198
|
+
* Visual variant of the button.
|
|
199
|
+
*/
|
|
83
200
|
variant?: ButtonVariant$1;
|
|
201
|
+
/**
|
|
202
|
+
* Visual size of the button.
|
|
203
|
+
*/
|
|
84
204
|
size?: ButtonSize$1;
|
|
85
|
-
|
|
205
|
+
/**
|
|
206
|
+
* Icon rendered before the main content.
|
|
207
|
+
*/
|
|
86
208
|
startIcon?: ReactNode;
|
|
209
|
+
/**
|
|
210
|
+
* Icon rendered after the main content.
|
|
211
|
+
*/
|
|
87
212
|
endIcon?: ReactNode;
|
|
213
|
+
/**
|
|
214
|
+
* Custom button content.
|
|
215
|
+
*/
|
|
88
216
|
children?: ReactNode;
|
|
89
217
|
}
|
|
90
218
|
/**
|
|
91
|
-
*
|
|
92
|
-
*
|
|
93
|
-
* Support `variant` (default/destructive/outline/secondary/ghost/link) and `size` (sm/md/lg), adorn with icons, and surface helper or error text without needing custom wrappers.
|
|
219
|
+
* Button theo visual style legacy `main-fe`.
|
|
220
|
+
* Legacy `main-fe` styled button.
|
|
94
221
|
*/
|
|
95
222
|
declare const Button$1: react.ForwardRefExoticComponent<ButtonProps$1 & react.RefAttributes<HTMLButtonElement>>;
|
|
96
223
|
|
|
97
|
-
declare const inputVariants$1: (props?: ({
|
|
98
|
-
variant?: "default" | "outline" | "ghost" | null | undefined;
|
|
99
|
-
size?: "sm" | "md" | "lg" | null | undefined;
|
|
100
|
-
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
101
|
-
type InputVariant$1 = VariantProps<typeof inputVariants$1>['variant'];
|
|
102
|
-
interface InputProps$1 extends SharedComponentProps, Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'size' | 'prefix'> {
|
|
103
|
-
variant?: InputVariant$1;
|
|
104
|
-
prefix?: ReactNode;
|
|
105
|
-
suffix?: ReactNode;
|
|
106
|
-
inputClassName?: string;
|
|
107
|
-
onValueChange?: (value: string) => void;
|
|
108
|
-
showPasswordToggle?: boolean;
|
|
109
|
-
}
|
|
110
|
-
/**
|
|
111
|
-
* Accessible input surface with shadcn styling, optional prefix/suffix, and helpers for feedback.
|
|
112
|
-
* @remarks
|
|
113
|
-
* Swap `variant` (default/ghost/outline) and `size` (sm/md/lg), keep adornments with `prefix`/`suffix`, display helper/error text, and show a spinner via `loading`.
|
|
114
|
-
*/
|
|
115
|
-
declare const Input$1: react.ForwardRefExoticComponent<InputProps$1 & react.RefAttributes<HTMLInputElement>>;
|
|
116
|
-
|
|
117
|
-
type FormatOnBlur = 'trim' | 'fixed' | 'none';
|
|
118
|
-
type NumericMode = 'integer' | 'decimal';
|
|
119
|
-
type DecimalSeparator = '.' | ',' | 'auto';
|
|
120
|
-
|
|
121
|
-
interface NumericInputProps extends Omit<InputProps$1, 'type' | 'inputMode' | 'value' | 'defaultValue' | 'onChange' | 'onValueChange'>, Pick<InputHTMLAttributes<HTMLInputElement>, 'onBlur' | 'onFocus' | 'name'> {
|
|
122
|
-
value?: string | number;
|
|
123
|
-
defaultValue?: string | number;
|
|
124
|
-
onValueChange?: (raw: string) => void;
|
|
125
|
-
onNumberChange?: (num: number | null) => void;
|
|
126
|
-
mode?: NumericMode;
|
|
127
|
-
decimalScale?: number;
|
|
128
|
-
maxDecimalScale?: number;
|
|
129
|
-
scale?: number;
|
|
130
|
-
min?: number;
|
|
131
|
-
max?: number;
|
|
132
|
-
allowNegative?: boolean;
|
|
133
|
-
decimalSeparator?: DecimalSeparator;
|
|
134
|
-
formatOnBlur?: FormatOnBlur;
|
|
135
|
-
clampOnBlur?: boolean;
|
|
136
|
-
}
|
|
137
|
-
declare const NumericInput: react.ForwardRefExoticComponent<NumericInputProps & react.RefAttributes<HTMLInputElement>>;
|
|
138
|
-
|
|
139
|
-
declare const textareaVariants: (props?: ({
|
|
140
|
-
variant?: "default" | "outline" | "ghost" | null | undefined;
|
|
141
|
-
size?: "sm" | "md" | "lg" | null | undefined;
|
|
142
|
-
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
143
|
-
type TextareaVariant = VariantProps<typeof textareaVariants>['variant'];
|
|
144
|
-
interface TextareaProps extends SharedComponentProps, Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'className'> {
|
|
145
|
-
variant?: TextareaVariant;
|
|
146
|
-
textareaClassName?: string;
|
|
147
|
-
onValueChange?: (value: string) => void;
|
|
148
|
-
suffix?: ReactNode;
|
|
149
|
-
}
|
|
150
|
-
declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
|
|
151
|
-
|
|
152
224
|
declare function Card$1({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
153
225
|
declare function CardHeader$1({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
154
226
|
declare function CardTitle$1({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
@@ -158,521 +230,946 @@ declare function CardContent$1({ className, ...props }: react.ComponentProps<'di
|
|
|
158
230
|
declare function CardFooter$1({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
159
231
|
|
|
160
232
|
type ComboboxOption$2 = {
|
|
233
|
+
/**
|
|
234
|
+
* Visible label shown in the input and dropdown.
|
|
235
|
+
*/
|
|
161
236
|
label: string;
|
|
237
|
+
/**
|
|
238
|
+
* Actual value of the option.
|
|
239
|
+
*/
|
|
162
240
|
value: string | number;
|
|
241
|
+
/**
|
|
242
|
+
* Secondary description for the option when the UI needs extra context.
|
|
243
|
+
*/
|
|
163
244
|
description?: string;
|
|
245
|
+
/**
|
|
246
|
+
* Alternate value used specifically for searching.
|
|
247
|
+
*/
|
|
164
248
|
searchValue?: string;
|
|
249
|
+
/**
|
|
250
|
+
* Marks the option as unavailable for selection.
|
|
251
|
+
*/
|
|
165
252
|
disabled?: boolean;
|
|
166
253
|
};
|
|
254
|
+
type ComboboxAsyncConfig = {
|
|
255
|
+
/**
|
|
256
|
+
* Remote search callback fired when the user types.
|
|
257
|
+
*/
|
|
258
|
+
onSearch?: (value: string) => void;
|
|
259
|
+
/**
|
|
260
|
+
* Callback for loading more data when the dropdown reaches the end.
|
|
261
|
+
*/
|
|
262
|
+
onLoadMore?: () => void;
|
|
263
|
+
/**
|
|
264
|
+
* Indicates whether more remote data is available.
|
|
265
|
+
*/
|
|
266
|
+
hasMore?: boolean;
|
|
267
|
+
/**
|
|
268
|
+
* Whether to reset the search term when the field is focused again.
|
|
269
|
+
*/
|
|
270
|
+
resetSearchOnFocus?: boolean;
|
|
271
|
+
/**
|
|
272
|
+
* Whether to restore the selected option on blur if nothing new is chosen.
|
|
273
|
+
*/
|
|
274
|
+
restoreSelectedOnBlur?: boolean;
|
|
275
|
+
};
|
|
167
276
|
interface ComboboxProps$1 extends SharedComponentProps {
|
|
277
|
+
/**
|
|
278
|
+
* Option list rendered in the dropdown.
|
|
279
|
+
*/
|
|
168
280
|
options: ComboboxOption$2[];
|
|
281
|
+
/**
|
|
282
|
+
* Currently selected value.
|
|
283
|
+
*/
|
|
169
284
|
value?: string | number;
|
|
285
|
+
/**
|
|
286
|
+
* Placeholder shown when no value is selected.
|
|
287
|
+
*/
|
|
170
288
|
placeholder?: string;
|
|
289
|
+
/**
|
|
290
|
+
* Callback fired when the user selects an option.
|
|
291
|
+
*/
|
|
171
292
|
onChange?: (value: ComboboxOption$2['value']) => void;
|
|
293
|
+
/**
|
|
294
|
+
* Callback fired when the input text changes.
|
|
295
|
+
*/
|
|
172
296
|
onInputChange?: (value: string) => void;
|
|
297
|
+
/**
|
|
298
|
+
* Manual callback for loading more items at the end of the list.
|
|
299
|
+
*/
|
|
300
|
+
onLoadMore?: () => void;
|
|
301
|
+
/**
|
|
302
|
+
* Indicates whether more data can be loaded.
|
|
303
|
+
*/
|
|
304
|
+
hasMore?: boolean;
|
|
305
|
+
/**
|
|
306
|
+
* Configuration for async or remote-search behavior.
|
|
307
|
+
*/
|
|
308
|
+
asyncConfig?: ComboboxAsyncConfig;
|
|
309
|
+
/**
|
|
310
|
+
* Loading state while data is being fetched.
|
|
311
|
+
*/
|
|
173
312
|
loading?: boolean;
|
|
313
|
+
/**
|
|
314
|
+
* Disables the entire combobox.
|
|
315
|
+
*/
|
|
174
316
|
disabled?: boolean;
|
|
317
|
+
/**
|
|
318
|
+
* Placeholder specifically for the search input.
|
|
319
|
+
*/
|
|
175
320
|
searchPlaceholder?: string;
|
|
321
|
+
/**
|
|
322
|
+
* `id` used by helper text for accessibility linkage.
|
|
323
|
+
*/
|
|
176
324
|
helperId?: string;
|
|
325
|
+
/**
|
|
326
|
+
* `id` used by error text for accessibility linkage.
|
|
327
|
+
*/
|
|
177
328
|
errorId?: string;
|
|
329
|
+
/**
|
|
330
|
+
* Enables a button for clearing the current value.
|
|
331
|
+
*/
|
|
178
332
|
allowClear?: boolean;
|
|
333
|
+
/**
|
|
334
|
+
* Callback fired when the current value is cleared.
|
|
335
|
+
*/
|
|
179
336
|
onClear?: () => void;
|
|
337
|
+
/**
|
|
338
|
+
* Renders the dropdown in a portal outside the current layout.
|
|
339
|
+
*/
|
|
180
340
|
portal?: boolean;
|
|
341
|
+
/**
|
|
342
|
+
* Extra class names for the dropdown menu.
|
|
343
|
+
*/
|
|
344
|
+
dropdownClassName?: string;
|
|
345
|
+
/**
|
|
346
|
+
* Overrides the maximum height of the dropdown.
|
|
347
|
+
*/
|
|
348
|
+
dropdownMaxHeight?: number;
|
|
349
|
+
/**
|
|
350
|
+
* Keeps error styling without rendering the error text below the field.
|
|
351
|
+
*/
|
|
352
|
+
hideErrorMessage?: boolean;
|
|
181
353
|
}
|
|
354
|
+
/**
|
|
355
|
+
* Legacy `main-fe` combobox with remote search and load-more support.
|
|
356
|
+
*/
|
|
182
357
|
declare const Combobox$1: react.ForwardRefExoticComponent<ComboboxProps$1 & react.RefAttributes<HTMLInputElement>>;
|
|
183
358
|
|
|
184
|
-
type
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
359
|
+
type DataTableSortDirection$1 = 'asc' | 'desc';
|
|
360
|
+
type DataTableAlign$1 = 'left' | 'center' | 'right';
|
|
361
|
+
type DataTableSortState$1 = {
|
|
362
|
+
/**
|
|
363
|
+
* `key` of the column currently being sorted.
|
|
364
|
+
*/
|
|
365
|
+
key: string;
|
|
366
|
+
/**
|
|
367
|
+
* Current sort direction.
|
|
368
|
+
*/
|
|
369
|
+
direction: DataTableSortDirection$1;
|
|
190
370
|
};
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
371
|
+
type DataTableColumn$1<T> = {
|
|
372
|
+
/**
|
|
373
|
+
* Unique identifier of the column.
|
|
374
|
+
*/
|
|
375
|
+
key: string;
|
|
376
|
+
/**
|
|
377
|
+
* Visible header content of the column.
|
|
378
|
+
*/
|
|
379
|
+
title: ReactNode;
|
|
380
|
+
/**
|
|
381
|
+
* Record field used as the default data source.
|
|
382
|
+
*/
|
|
383
|
+
dataIndex?: keyof T;
|
|
384
|
+
/**
|
|
385
|
+
* Fixed or relative width of the column.
|
|
386
|
+
*/
|
|
387
|
+
width?: number | string;
|
|
388
|
+
/**
|
|
389
|
+
* Custom renderer for the cell content.
|
|
390
|
+
*/
|
|
391
|
+
render?: (value: T[keyof T] | undefined, record: T, index: number) => ReactNode;
|
|
392
|
+
/**
|
|
393
|
+
* Enables or disables sorting for the column.
|
|
394
|
+
*/
|
|
395
|
+
sortable?: boolean;
|
|
396
|
+
/**
|
|
397
|
+
* Custom comparator used for client-side sorting.
|
|
398
|
+
*/
|
|
399
|
+
sorter?: (a: T, b: T) => number;
|
|
400
|
+
/**
|
|
401
|
+
* Function that returns a dedicated value for sorting.
|
|
402
|
+
*/
|
|
403
|
+
sortValue?: (record: T) => string | number | Date | null | undefined;
|
|
404
|
+
/**
|
|
405
|
+
* Per-column header alignment override.
|
|
406
|
+
*/
|
|
407
|
+
headerAlign?: DataTableAlign$1;
|
|
408
|
+
/**
|
|
409
|
+
* Per-column cell alignment override.
|
|
410
|
+
*/
|
|
411
|
+
cellAlign?: DataTableAlign$1;
|
|
412
|
+
};
|
|
413
|
+
type DataTablePagination$1 = {
|
|
414
|
+
/**
|
|
415
|
+
* Current page.
|
|
416
|
+
*/
|
|
417
|
+
page: number;
|
|
418
|
+
/**
|
|
419
|
+
* Number of rows per page.
|
|
420
|
+
*/
|
|
421
|
+
pageSize: number;
|
|
422
|
+
/**
|
|
423
|
+
* Total number of records.
|
|
424
|
+
*/
|
|
425
|
+
total: number;
|
|
426
|
+
/**
|
|
427
|
+
* Callback fired when the page changes.
|
|
428
|
+
*/
|
|
429
|
+
onChange: (page: number) => void;
|
|
430
|
+
/**
|
|
431
|
+
* Page-size options shown in the dropdown.
|
|
432
|
+
*/
|
|
433
|
+
pageSizeOptions?: number[];
|
|
434
|
+
/**
|
|
435
|
+
* Callback fired when page size changes.
|
|
436
|
+
*/
|
|
437
|
+
onPageSizeChange?: (pageSize: number) => void;
|
|
438
|
+
};
|
|
439
|
+
type RowKey$1 = string | number;
|
|
440
|
+
type DataTableRowSelection$1 = {
|
|
441
|
+
/**
|
|
442
|
+
* Row keys that are currently selected.
|
|
443
|
+
*/
|
|
444
|
+
selectedRowKeys: Array<RowKey$1>;
|
|
445
|
+
/**
|
|
446
|
+
* Callback fired when the selected rows change.
|
|
447
|
+
*/
|
|
448
|
+
onChange: (selectedRowKeys: Array<RowKey$1>) => void;
|
|
449
|
+
};
|
|
450
|
+
type DataTableProps$1<T> = {
|
|
451
|
+
/**
|
|
452
|
+
* Column configuration of the table.
|
|
453
|
+
*/
|
|
454
|
+
columns: Array<DataTableColumn$1<T>>;
|
|
455
|
+
/**
|
|
456
|
+
* Source data rendered by the table.
|
|
457
|
+
*/
|
|
458
|
+
data: T[];
|
|
459
|
+
/**
|
|
460
|
+
* How to resolve a unique key for each row.
|
|
461
|
+
*/
|
|
462
|
+
rowKey: keyof T | ((record: T) => RowKey$1);
|
|
463
|
+
/**
|
|
464
|
+
* Loading state of the table.
|
|
465
|
+
*/
|
|
199
466
|
loading?: boolean;
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
467
|
+
/**
|
|
468
|
+
* Content shown when the table has no data.
|
|
469
|
+
*/
|
|
470
|
+
emptyText?: ReactNode;
|
|
471
|
+
/**
|
|
472
|
+
* Pagination configuration.
|
|
473
|
+
*/
|
|
474
|
+
pagination?: DataTablePagination$1;
|
|
475
|
+
/**
|
|
476
|
+
* Current sort state when controlled from the parent.
|
|
477
|
+
*/
|
|
478
|
+
sort?: DataTableSortState$1 | null;
|
|
479
|
+
/**
|
|
480
|
+
* Callback fired when sort state changes.
|
|
481
|
+
*/
|
|
482
|
+
onSortChange?: (sort: DataTableSortState$1 | null) => void;
|
|
483
|
+
/**
|
|
484
|
+
* Sorting mode handled on the client or server.
|
|
485
|
+
*/
|
|
486
|
+
sortMode?: 'client' | 'server';
|
|
487
|
+
/**
|
|
488
|
+
* Callback fired when a row is clicked.
|
|
489
|
+
*/
|
|
490
|
+
onRowClick?: (record: T) => void;
|
|
491
|
+
/**
|
|
492
|
+
* Row-selection configuration.
|
|
493
|
+
*/
|
|
494
|
+
rowSelection?: DataTableRowSelection$1;
|
|
495
|
+
/**
|
|
496
|
+
* Renderer for the per-row action column.
|
|
497
|
+
*/
|
|
498
|
+
renderActions?: (record: T) => ReactNode;
|
|
499
|
+
/**
|
|
500
|
+
* Width of the action column.
|
|
501
|
+
*/
|
|
502
|
+
actionColumnWidth?: number | string;
|
|
503
|
+
/**
|
|
504
|
+
* Extra class names for the table wrapper.
|
|
505
|
+
*/
|
|
506
|
+
className?: string;
|
|
507
|
+
/**
|
|
508
|
+
* Default alignment for all headers.
|
|
509
|
+
*/
|
|
510
|
+
headerAlign?: DataTableAlign$1;
|
|
511
|
+
/**
|
|
512
|
+
* Default alignment for all cells.
|
|
513
|
+
*/
|
|
514
|
+
cellAlign?: DataTableAlign$1;
|
|
515
|
+
/**
|
|
516
|
+
* Sticky offset for header or fixed columns when the layout has a top bar.
|
|
517
|
+
*/
|
|
518
|
+
stickyOffset?: number;
|
|
519
|
+
};
|
|
520
|
+
/**
|
|
521
|
+
* Legacy `main-fe` data table with sorting, selection, actions, and pagination.
|
|
522
|
+
*/
|
|
523
|
+
declare function DataTable$1<T>({ columns, data, rowKey, loading, emptyText, pagination, sort, onSortChange, sortMode, onRowClick, rowSelection, renderActions, actionColumnWidth, className, headerAlign, stickyOffset, }: DataTableProps$1<T>): react_jsx_runtime.JSX.Element;
|
|
524
|
+
declare const Table$1: react.ForwardRefExoticComponent<TableHTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
|
|
525
|
+
declare const TableHeader$1: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
526
|
+
declare const TableBody$1: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
527
|
+
declare const TableRow$1: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
|
|
528
|
+
declare const TableCell$1: react.ForwardRefExoticComponent<TdHTMLAttributes<HTMLTableCellElement> & ThHTMLAttributes<HTMLTableCellElement> & {
|
|
529
|
+
as?: "td" | "th";
|
|
530
|
+
} & react.RefAttributes<HTMLTableCellElement>>;
|
|
209
531
|
|
|
210
|
-
type
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
532
|
+
type DateRangePickerValue = {
|
|
533
|
+
/**
|
|
534
|
+
* Start date in string or ISO format.
|
|
535
|
+
*/
|
|
536
|
+
startDate?: string | null;
|
|
537
|
+
/**
|
|
538
|
+
* End date in string or ISO format.
|
|
539
|
+
*/
|
|
540
|
+
endDate?: string | null;
|
|
215
541
|
};
|
|
216
|
-
interface
|
|
217
|
-
|
|
218
|
-
|
|
542
|
+
interface DateRangePickerProps {
|
|
543
|
+
/**
|
|
544
|
+
* Current date range value of the component.
|
|
545
|
+
*/
|
|
546
|
+
value?: DateRangePickerValue;
|
|
547
|
+
/**
|
|
548
|
+
* Callback fired when the user confirms a new date range.
|
|
549
|
+
*/
|
|
550
|
+
onChange: (next: Required<DateRangePickerValue>) => void;
|
|
551
|
+
/**
|
|
552
|
+
* Label shown above the picker.
|
|
553
|
+
*/
|
|
554
|
+
label?: string;
|
|
555
|
+
/**
|
|
556
|
+
* Placeholder shown before a range is selected.
|
|
557
|
+
*/
|
|
219
558
|
placeholder?: string;
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
searchable?: boolean;
|
|
225
|
-
searchPlaceholder?: string;
|
|
559
|
+
/**
|
|
560
|
+
* Extra class names for the picker wrapper.
|
|
561
|
+
*/
|
|
562
|
+
className?: string;
|
|
226
563
|
}
|
|
227
|
-
declare const MultiSelect: react.ForwardRefExoticComponent<MultiSelectProps & react.RefAttributes<HTMLButtonElement>>;
|
|
228
|
-
|
|
229
564
|
/**
|
|
230
|
-
*
|
|
231
|
-
* @remarks
|
|
232
|
-
* Extend `className` or pass native form props while maintaining consistent letter spacing for each child row.
|
|
565
|
+
* Date-range picker for legacy `main-fe` screens.
|
|
233
566
|
*/
|
|
234
|
-
declare function
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
567
|
+
declare function DateRangePicker({ value, onChange, label, placeholder, className, }: DateRangePickerProps): react_jsx_runtime.JSX.Element;
|
|
568
|
+
|
|
569
|
+
type QuickOption = {
|
|
570
|
+
/**
|
|
571
|
+
* Visible label of the quick option.
|
|
572
|
+
*/
|
|
573
|
+
label: string;
|
|
574
|
+
/**
|
|
575
|
+
* Value applied to the picker when the quick option is chosen.
|
|
576
|
+
*/
|
|
577
|
+
value: string;
|
|
578
|
+
};
|
|
579
|
+
interface DateTimePickerProps {
|
|
580
|
+
/**
|
|
581
|
+
* Label shown above the picker.
|
|
582
|
+
*/
|
|
583
|
+
label?: ReactNode;
|
|
584
|
+
/**
|
|
585
|
+
* Placeholder shown when no value is set.
|
|
586
|
+
*/
|
|
587
|
+
placeholder?: string;
|
|
588
|
+
/**
|
|
589
|
+
* Current value of the picker.
|
|
590
|
+
*/
|
|
591
|
+
value?: string;
|
|
592
|
+
/**
|
|
593
|
+
* Callback fired when the date-time value changes.
|
|
594
|
+
*/
|
|
595
|
+
onChange: (value: string) => void;
|
|
596
|
+
/**
|
|
597
|
+
* Disables the entire picker.
|
|
598
|
+
*/
|
|
599
|
+
disabled?: boolean;
|
|
600
|
+
/**
|
|
601
|
+
* Error message shown below the field.
|
|
602
|
+
*/
|
|
603
|
+
errorMessage?: string;
|
|
604
|
+
/**
|
|
605
|
+
* Extra class names for the picker wrapper.
|
|
606
|
+
*/
|
|
607
|
+
className?: string;
|
|
608
|
+
/**
|
|
609
|
+
* Format used to parse the incoming `value`.
|
|
610
|
+
*/
|
|
611
|
+
parseFormat?: string;
|
|
612
|
+
/**
|
|
613
|
+
* Format used for outgoing values passed to `onChange`.
|
|
614
|
+
*/
|
|
615
|
+
outputFormat?: string;
|
|
616
|
+
/**
|
|
617
|
+
* Display format for the text shown in the trigger.
|
|
618
|
+
*/
|
|
619
|
+
displayFormat?: string;
|
|
620
|
+
/**
|
|
621
|
+
* Minimum selectable date-time.
|
|
622
|
+
*/
|
|
623
|
+
minDateTime?: Date;
|
|
624
|
+
/**
|
|
625
|
+
* List of quick-select options.
|
|
626
|
+
*/
|
|
627
|
+
quickOptions?: QuickOption[];
|
|
628
|
+
/**
|
|
629
|
+
* Callback fired when a quick option is selected.
|
|
630
|
+
*/
|
|
631
|
+
onQuickSelect?: (value: string) => void;
|
|
632
|
+
/**
|
|
633
|
+
* Callback fired when the current value is cleared.
|
|
634
|
+
*/
|
|
635
|
+
onClear?: () => void;
|
|
636
|
+
/**
|
|
637
|
+
* Title for the quick-range section.
|
|
638
|
+
*/
|
|
639
|
+
quickRangesLabel?: string;
|
|
640
|
+
/**
|
|
641
|
+
* Label shown for the clear action.
|
|
642
|
+
*/
|
|
643
|
+
clearLabel?: string;
|
|
644
|
+
/**
|
|
645
|
+
* Renders the picker panel in a portal outside the current layout.
|
|
646
|
+
*/
|
|
647
|
+
portal?: boolean;
|
|
242
648
|
}
|
|
243
649
|
/**
|
|
244
|
-
*
|
|
650
|
+
* Legacy `main-fe` date-time picker with quick options and custom formats.
|
|
245
651
|
*/
|
|
246
|
-
declare
|
|
652
|
+
declare function DateTimePicker({ label, placeholder, value, onChange, disabled, errorMessage, className, parseFormat, outputFormat, displayFormat, minDateTime, quickOptions, onQuickSelect, onClear, quickRangesLabel, clearLabel, portal, }: DateTimePickerProps): react_jsx_runtime.JSX.Element;
|
|
653
|
+
|
|
654
|
+
declare const inputVariants$1: (props?: ({
|
|
655
|
+
variant?: "outline" | "default" | "ghost" | null | undefined;
|
|
656
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
657
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
658
|
+
type InputVariant$1 = VariantProps<typeof inputVariants$1>['variant'];
|
|
659
|
+
interface InputProps$1 extends SharedComponentProps, Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'size' | 'prefix'> {
|
|
660
|
+
/**
|
|
661
|
+
* Visual variant of the input.
|
|
662
|
+
*/
|
|
663
|
+
variant?: InputVariant$1;
|
|
664
|
+
/**
|
|
665
|
+
* Content rendered on the left side of the input.
|
|
666
|
+
*/
|
|
667
|
+
prefix?: ReactNode;
|
|
668
|
+
/**
|
|
669
|
+
* Content rendered on the right side of the input.
|
|
670
|
+
*/
|
|
671
|
+
suffix?: ReactNode;
|
|
672
|
+
/**
|
|
673
|
+
* Class names applied directly to the `<input>` element.
|
|
674
|
+
*/
|
|
675
|
+
inputClassName?: string;
|
|
676
|
+
/**
|
|
677
|
+
* Callback that returns the current string value of the input.
|
|
678
|
+
*/
|
|
679
|
+
onValueChange?: (value: string) => void;
|
|
680
|
+
/**
|
|
681
|
+
* Enables or disables the password visibility toggle when `type="password"`.
|
|
682
|
+
*/
|
|
683
|
+
showPasswordToggle?: boolean;
|
|
684
|
+
}
|
|
247
685
|
/**
|
|
248
|
-
*
|
|
686
|
+
* Legacy `main-fe` input with prefix/suffix plus helper/error support.
|
|
249
687
|
*/
|
|
250
|
-
declare const
|
|
688
|
+
declare const Input$1: react.ForwardRefExoticComponent<InputProps$1 & react.RefAttributes<HTMLInputElement>>;
|
|
689
|
+
|
|
690
|
+
type MultiTabItem = {
|
|
691
|
+
/**
|
|
692
|
+
* Visible label rendered on the tab.
|
|
693
|
+
*/
|
|
694
|
+
label: ReactNode;
|
|
695
|
+
/**
|
|
696
|
+
* Identifier value of the tab.
|
|
697
|
+
*/
|
|
698
|
+
value: string;
|
|
699
|
+
};
|
|
700
|
+
interface MultiTabsProps {
|
|
701
|
+
/**
|
|
702
|
+
* List of tabs to render.
|
|
703
|
+
*/
|
|
704
|
+
items: MultiTabItem[];
|
|
705
|
+
/**
|
|
706
|
+
* Currently selected tab value.
|
|
707
|
+
*/
|
|
708
|
+
value: string;
|
|
709
|
+
/**
|
|
710
|
+
* Callback fired when the user switches tabs.
|
|
711
|
+
*/
|
|
712
|
+
onChange: (value: string) => void;
|
|
713
|
+
/**
|
|
714
|
+
* Extra class names for the tab group wrapper.
|
|
715
|
+
*/
|
|
716
|
+
className?: string;
|
|
717
|
+
/**
|
|
718
|
+
* Inline styles for the tab group wrapper.
|
|
719
|
+
*/
|
|
720
|
+
style?: CSSProperties;
|
|
721
|
+
}
|
|
251
722
|
/**
|
|
252
|
-
*
|
|
723
|
+
* Segmented tab control for legacy `main-fe` screens.
|
|
253
724
|
*/
|
|
254
|
-
declare
|
|
725
|
+
declare function MultiTabs({ items, value, onChange, className, style, }: MultiTabsProps): react_jsx_runtime.JSX.Element;
|
|
726
|
+
|
|
727
|
+
type MainFePageTitleProps = {
|
|
728
|
+
/**
|
|
729
|
+
* Main title of the page.
|
|
730
|
+
*/
|
|
731
|
+
title: string;
|
|
732
|
+
/**
|
|
733
|
+
* Short description shown below the title.
|
|
734
|
+
*/
|
|
735
|
+
subtitle?: string;
|
|
736
|
+
/**
|
|
737
|
+
* Visual density of the page header.
|
|
738
|
+
*/
|
|
739
|
+
size?: 'default' | 'compact';
|
|
740
|
+
/**
|
|
741
|
+
* Slot rendered above the title, commonly used for breadcrumbs or status tags.
|
|
742
|
+
*/
|
|
743
|
+
topSlot?: ReactNode;
|
|
744
|
+
/**
|
|
745
|
+
* Slot rendered on the right side of the header.
|
|
746
|
+
*/
|
|
747
|
+
rightSlot?: ReactNode;
|
|
748
|
+
};
|
|
255
749
|
/**
|
|
256
|
-
*
|
|
750
|
+
* Legacy page header for `main-fe` screens.
|
|
257
751
|
*/
|
|
258
|
-
declare
|
|
752
|
+
declare function PageTitle$1({ title, subtitle, size, topSlot, rightSlot, }: MainFePageTitleProps): react_jsx_runtime.JSX.Element;
|
|
753
|
+
|
|
754
|
+
type RemoteLoadingProps = {
|
|
755
|
+
/**
|
|
756
|
+
* Extra class names for the full-page loading wrapper.
|
|
757
|
+
*/
|
|
758
|
+
className?: string;
|
|
759
|
+
};
|
|
259
760
|
/**
|
|
260
|
-
*
|
|
761
|
+
* Full-area loading state for remote or legacy screens.
|
|
261
762
|
*/
|
|
262
|
-
declare
|
|
763
|
+
declare function RemoteLoading({ className }: RemoteLoadingProps): react_jsx_runtime.JSX.Element;
|
|
764
|
+
|
|
765
|
+
type MainFeSectionTitleProps = {
|
|
766
|
+
/**
|
|
767
|
+
* Main title of the section.
|
|
768
|
+
*/
|
|
769
|
+
title: string;
|
|
770
|
+
/**
|
|
771
|
+
* Short description that explains the section.
|
|
772
|
+
*/
|
|
773
|
+
subtitle?: string;
|
|
774
|
+
/**
|
|
775
|
+
* Icon displayed to the left of the title.
|
|
776
|
+
*/
|
|
777
|
+
icon?: ReactNode;
|
|
778
|
+
/**
|
|
779
|
+
* Custom class for the icon wrapper.
|
|
780
|
+
*/
|
|
781
|
+
iconClassName?: string;
|
|
782
|
+
/**
|
|
783
|
+
* Slot rendered on the right side of the section title.
|
|
784
|
+
*/
|
|
785
|
+
rightSlot?: ReactNode;
|
|
786
|
+
};
|
|
263
787
|
/**
|
|
264
|
-
*
|
|
788
|
+
* Section header for legacy `main-fe` cards and panels.
|
|
265
789
|
*/
|
|
266
|
-
declare
|
|
790
|
+
declare function SectionTitle$1({ title, subtitle, icon, iconClassName, rightSlot, }: MainFeSectionTitleProps): react_jsx_runtime.JSX.Element;
|
|
267
791
|
|
|
268
|
-
type
|
|
792
|
+
type StatTone = 'emerald' | 'sky' | 'violet' | 'rose';
|
|
793
|
+
type StatCardProps = {
|
|
794
|
+
/**
|
|
795
|
+
* Label describing what the metric represents.
|
|
796
|
+
*/
|
|
797
|
+
label: ReactNode;
|
|
798
|
+
/**
|
|
799
|
+
* Primary value that should be emphasized.
|
|
800
|
+
*/
|
|
801
|
+
value: ReactNode;
|
|
802
|
+
/**
|
|
803
|
+
* Primary visual tone of the card.
|
|
804
|
+
*/
|
|
805
|
+
tone?: StatTone;
|
|
806
|
+
/**
|
|
807
|
+
* Icon displayed in the right corner of the card.
|
|
808
|
+
*/
|
|
809
|
+
icon?: ReactNode;
|
|
810
|
+
/**
|
|
811
|
+
* Extra class names for the card wrapper.
|
|
812
|
+
*/
|
|
813
|
+
className?: string;
|
|
814
|
+
};
|
|
815
|
+
/**
|
|
816
|
+
* Metric card for highlighted stats in legacy dashboards or lists.
|
|
817
|
+
*/
|
|
818
|
+
declare function StatCard({ label, value, tone, icon, className, }: StatCardProps): react_jsx_runtime.JSX.Element;
|
|
819
|
+
|
|
820
|
+
type StatusAction = {
|
|
269
821
|
label: ReactNode;
|
|
822
|
+
color?: string;
|
|
823
|
+
href?: string;
|
|
824
|
+
onClick?: () => void;
|
|
825
|
+
};
|
|
826
|
+
type StatusOption = {
|
|
270
827
|
value: string | number;
|
|
271
|
-
|
|
828
|
+
label: ReactNode;
|
|
829
|
+
color?: string;
|
|
830
|
+
action?: StatusAction;
|
|
272
831
|
};
|
|
273
|
-
type
|
|
274
|
-
|
|
275
|
-
|
|
832
|
+
type StatusPresentation = {
|
|
833
|
+
label: ReactNode;
|
|
834
|
+
color?: string;
|
|
835
|
+
action?: StatusAction;
|
|
836
|
+
};
|
|
837
|
+
declare function getStatusPresentation(status: string | number | null | undefined, options: StatusOption[]): StatusPresentation | null;
|
|
838
|
+
|
|
839
|
+
interface SwitchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'size' | 'className' | 'onChange'> {
|
|
840
|
+
/**
|
|
841
|
+
* Extra class names for the outer switch wrapper.
|
|
842
|
+
*/
|
|
843
|
+
className?: string;
|
|
844
|
+
/**
|
|
845
|
+
* Custom class for the switch track.
|
|
846
|
+
*/
|
|
847
|
+
trackClassName?: string;
|
|
848
|
+
/**
|
|
849
|
+
* Custom class for the switch thumb.
|
|
850
|
+
*/
|
|
851
|
+
thumbClassName?: string;
|
|
852
|
+
/**
|
|
853
|
+
* Callback that returns the next checked state.
|
|
854
|
+
*/
|
|
855
|
+
onCheckedChange?: (checked: boolean) => void;
|
|
856
|
+
}
|
|
857
|
+
/**
|
|
858
|
+
* Legacy `main-fe` styled switch.
|
|
859
|
+
*/
|
|
860
|
+
declare const Switch: react.ForwardRefExoticComponent<SwitchProps & react.RefAttributes<HTMLInputElement>>;
|
|
861
|
+
|
|
862
|
+
declare const alertVariants: (props?: ({
|
|
863
|
+
variant?: "success" | "warning" | "destructive" | "default" | "info" | null | undefined;
|
|
276
864
|
size?: "sm" | "md" | "lg" | null | undefined;
|
|
277
865
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
278
|
-
type
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
866
|
+
type AlertVariant = NonNullable<VariantProps<typeof alertVariants>['variant']>;
|
|
867
|
+
type AlertTone = 'neutral' | 'info' | 'success' | 'warning' | 'danger';
|
|
868
|
+
interface AlertProps extends SharedComponentProps {
|
|
869
|
+
description?: ReactNode;
|
|
870
|
+
icon?: ReactNode;
|
|
871
|
+
tone?: AlertTone;
|
|
872
|
+
variant?: AlertVariant;
|
|
873
|
+
title?: ReactNode;
|
|
874
|
+
children?: ReactNode;
|
|
286
875
|
}
|
|
287
876
|
/**
|
|
288
|
-
*
|
|
877
|
+
* Status-aware alert panel with selectable variants, helper text, and optional iconography.
|
|
289
878
|
* @remarks
|
|
290
|
-
*
|
|
879
|
+
* Use `variant` (default/info/success/warning/destructive) and `size` (sm/md/lg) to tune the tone, show `description` or `helperText`, and decorate with a spinner via `loading`.
|
|
291
880
|
*/
|
|
292
|
-
declare const
|
|
881
|
+
declare const Alert: react.ForwardRefExoticComponent<AlertProps & react.RefAttributes<HTMLDivElement>>;
|
|
293
882
|
|
|
294
|
-
type
|
|
883
|
+
type BreadcrumbItem = {
|
|
884
|
+
/**
|
|
885
|
+
* Visible content of the breadcrumb item.
|
|
886
|
+
*/
|
|
295
887
|
label: ReactNode;
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
888
|
+
/**
|
|
889
|
+
* Callback fired when the item is clicked as a button.
|
|
890
|
+
*/
|
|
891
|
+
onClick?: () => void;
|
|
892
|
+
/**
|
|
893
|
+
* Navigation URL when the item behaves as a link.
|
|
894
|
+
*/
|
|
895
|
+
href?: string;
|
|
896
|
+
/**
|
|
897
|
+
* Marks the item as the current location.
|
|
898
|
+
*/
|
|
899
|
+
current?: boolean;
|
|
299
900
|
};
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
901
|
+
type BreadcrumbProps = {
|
|
902
|
+
/**
|
|
903
|
+
* List of breadcrumb items.
|
|
904
|
+
*/
|
|
905
|
+
items: BreadcrumbItem[];
|
|
906
|
+
/**
|
|
907
|
+
* Extra class names for the `nav` element.
|
|
908
|
+
*/
|
|
909
|
+
className?: string;
|
|
910
|
+
/**
|
|
911
|
+
* Character or node used to separate items.
|
|
912
|
+
*/
|
|
913
|
+
separator?: ReactNode;
|
|
914
|
+
};
|
|
915
|
+
declare function Breadcrumb({ items, className, separator, }: BreadcrumbProps): react_jsx_runtime.JSX.Element;
|
|
916
|
+
|
|
917
|
+
declare const buttonVariants: (props?: ({
|
|
918
|
+
variant?: "link" | "outline" | "destructive" | "default" | "confirm" | "secondary" | "ghost" | "create" | null | undefined;
|
|
919
|
+
size?: "sm" | "md" | "lg" | "icon" | null | undefined;
|
|
303
920
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
304
|
-
type
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
loading?: boolean;
|
|
314
|
-
size?: 'sm' | 'md' | 'lg';
|
|
315
|
-
searchPlaceholder?: string;
|
|
921
|
+
type ButtonVariant = VariantProps<typeof buttonVariants>['variant'];
|
|
922
|
+
type ButtonSize = 'sm' | 'md' | 'lg' | 'icon';
|
|
923
|
+
interface ButtonProps extends Omit<SharedComponentProps, 'size'>, Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'size' | 'className'> {
|
|
924
|
+
variant?: ButtonVariant;
|
|
925
|
+
size?: ButtonSize;
|
|
926
|
+
block?: boolean;
|
|
927
|
+
startIcon?: ReactNode;
|
|
928
|
+
endIcon?: ReactNode;
|
|
929
|
+
children?: ReactNode;
|
|
316
930
|
}
|
|
317
|
-
|
|
931
|
+
/**
|
|
932
|
+
* Primary action button with shadcn-inspired variants, helper text, and optional loading rewards.
|
|
933
|
+
* @remarks
|
|
934
|
+
* Support `variant` (default/destructive/outline/secondary/ghost/link) and `size` (sm/md/lg), adorn with icons, and surface helper or error text without needing custom wrappers.
|
|
935
|
+
*/
|
|
936
|
+
declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
|
|
318
937
|
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
938
|
+
declare const inputVariants: (props?: ({
|
|
939
|
+
variant?: "outline" | "default" | "ghost" | null | undefined;
|
|
940
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
941
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
942
|
+
type InputVariant = VariantProps<typeof inputVariants>['variant'];
|
|
943
|
+
interface InputProps extends SharedComponentProps, Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'size' | 'prefix'> {
|
|
944
|
+
variant?: InputVariant;
|
|
945
|
+
prefix?: ReactNode;
|
|
946
|
+
suffix?: ReactNode;
|
|
947
|
+
inputClassName?: string;
|
|
948
|
+
onValueChange?: (value: string) => void;
|
|
949
|
+
showPasswordToggle?: boolean;
|
|
325
950
|
}
|
|
326
951
|
/**
|
|
327
|
-
*
|
|
952
|
+
* Accessible input surface with shadcn styling, optional prefix/suffix, and helpers for feedback.
|
|
328
953
|
* @remarks
|
|
329
|
-
*
|
|
954
|
+
* Swap `variant` (default/ghost/outline) and `size` (sm/md/lg), keep adornments with `prefix`/`suffix`, display helper/error text, and show a spinner via `loading`.
|
|
330
955
|
*/
|
|
331
|
-
declare
|
|
956
|
+
declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
|
|
332
957
|
|
|
333
|
-
type
|
|
334
|
-
type
|
|
335
|
-
type
|
|
336
|
-
key: string;
|
|
337
|
-
direction: DataTableSortDirection$1;
|
|
338
|
-
};
|
|
339
|
-
type DataTableColumn$1<T> = {
|
|
340
|
-
key: string;
|
|
341
|
-
title: ReactNode;
|
|
342
|
-
dataIndex?: keyof T;
|
|
343
|
-
width?: number | string;
|
|
344
|
-
render?: (value: T[keyof T] | undefined, record: T, index: number) => ReactNode;
|
|
345
|
-
sortable?: boolean;
|
|
346
|
-
sorter?: (a: T, b: T) => number;
|
|
347
|
-
sortValue?: (record: T) => string | number | Date | null | undefined;
|
|
348
|
-
headerAlign?: DataTableAlign$1;
|
|
349
|
-
cellAlign?: DataTableAlign$1;
|
|
350
|
-
};
|
|
351
|
-
type DataTablePagination$1 = {
|
|
352
|
-
page: number;
|
|
353
|
-
pageSize: number;
|
|
354
|
-
total: number;
|
|
355
|
-
onChange: (page: number) => void;
|
|
356
|
-
pageSizeOptions?: number[];
|
|
357
|
-
onPageSizeChange?: (pageSize: number) => void;
|
|
358
|
-
};
|
|
359
|
-
type RowKey$1 = string | number;
|
|
360
|
-
type DataTableRowSelection$1 = {
|
|
361
|
-
selectedRowKeys: Array<RowKey$1>;
|
|
362
|
-
onChange: (selectedRowKeys: Array<RowKey$1>) => void;
|
|
363
|
-
};
|
|
364
|
-
type DataTableProps$1<T> = {
|
|
365
|
-
columns: Array<DataTableColumn$1<T>>;
|
|
366
|
-
data: T[];
|
|
367
|
-
rowKey: keyof T | ((record: T) => RowKey$1);
|
|
368
|
-
loading?: boolean;
|
|
369
|
-
emptyText?: ReactNode;
|
|
370
|
-
pagination?: DataTablePagination$1;
|
|
371
|
-
sort?: DataTableSortState$1 | null;
|
|
372
|
-
onSortChange?: (sort: DataTableSortState$1 | null) => void;
|
|
373
|
-
sortMode?: 'client' | 'server';
|
|
374
|
-
onRowClick?: (record: T) => void;
|
|
375
|
-
rowSelection?: DataTableRowSelection$1;
|
|
376
|
-
renderActions?: (record: T) => ReactNode;
|
|
377
|
-
className?: string;
|
|
378
|
-
headerAlign?: DataTableAlign$1;
|
|
379
|
-
cellAlign?: DataTableAlign$1;
|
|
380
|
-
stickyOffset?: number;
|
|
381
|
-
/** When false, table container does not scroll (overflow-visible). Default true. */
|
|
382
|
-
scrollable?: boolean;
|
|
383
|
-
};
|
|
384
|
-
declare function DataTable$1<T>({ columns, data, rowKey, loading, emptyText, pagination, sort, onSortChange, sortMode, onRowClick, rowSelection, renderActions, className, headerAlign, stickyOffset, scrollable, }: DataTableProps$1<T>): react_jsx_runtime.JSX.Element;
|
|
385
|
-
declare const Table$1: react.ForwardRefExoticComponent<TableHTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
|
|
386
|
-
declare const TableHeader$1: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
387
|
-
declare const TableBody$1: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
388
|
-
declare const TableRow$1: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
|
|
389
|
-
declare const TableCell$1: react.ForwardRefExoticComponent<TdHTMLAttributes<HTMLTableCellElement> & ThHTMLAttributes<HTMLTableCellElement> & {
|
|
390
|
-
as?: "td" | "th";
|
|
391
|
-
} & react.RefAttributes<HTMLTableCellElement>>;
|
|
392
|
-
|
|
393
|
-
type PaginationInfo = {
|
|
394
|
-
page: number;
|
|
395
|
-
pageSize: number;
|
|
396
|
-
total: number;
|
|
397
|
-
totalPages: number;
|
|
398
|
-
showingStart: number;
|
|
399
|
-
showingEnd: number;
|
|
400
|
-
};
|
|
401
|
-
type PaginationProps = {
|
|
402
|
-
page: number;
|
|
403
|
-
pageSize: number;
|
|
404
|
-
total: number;
|
|
405
|
-
onChange: (page: number) => void;
|
|
406
|
-
pageSizeOptions?: number[];
|
|
407
|
-
onPageSizeChange?: (pageSize: number) => void;
|
|
408
|
-
className?: string;
|
|
409
|
-
showFirstLast?: boolean;
|
|
410
|
-
label?: (info: PaginationInfo) => ReactNode;
|
|
411
|
-
};
|
|
412
|
-
declare const Pagination: ({ page, pageSize, total, onChange, pageSizeOptions, onPageSizeChange, className, showFirstLast, label, }: PaginationProps) => react_jsx_runtime.JSX.Element;
|
|
413
|
-
|
|
414
|
-
type PageTitleProps = {
|
|
415
|
-
title: string;
|
|
416
|
-
subtitle?: string;
|
|
417
|
-
size?: 'default' | 'compact';
|
|
418
|
-
rightSlot?: React.ReactNode;
|
|
419
|
-
};
|
|
420
|
-
declare function PageTitle$1({ title, subtitle, size, rightSlot, }: PageTitleProps): react_jsx_runtime.JSX.Element;
|
|
421
|
-
|
|
422
|
-
type SectionTitleProps$1 = {
|
|
423
|
-
title: string;
|
|
424
|
-
subtitle?: string;
|
|
425
|
-
icon?: ReactNode;
|
|
426
|
-
iconClassName?: string;
|
|
427
|
-
rightSlot?: ReactNode;
|
|
428
|
-
};
|
|
429
|
-
declare function SectionTitle$1({ title, subtitle, icon, iconClassName, rightSlot, }: SectionTitleProps$1): react_jsx_runtime.JSX.Element;
|
|
958
|
+
type FormatOnBlur = 'trim' | 'fixed' | 'none';
|
|
959
|
+
type NumericMode = 'integer' | 'decimal';
|
|
960
|
+
type DecimalSeparator = '.' | ',' | 'auto';
|
|
430
961
|
|
|
431
|
-
interface
|
|
432
|
-
value
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
962
|
+
interface NumericInputProps extends Omit<InputProps, 'type' | 'inputMode' | 'value' | 'defaultValue' | 'onChange' | 'onValueChange'>, Pick<InputHTMLAttributes<HTMLInputElement>, 'onBlur' | 'onFocus' | 'name'> {
|
|
963
|
+
value?: string | number;
|
|
964
|
+
defaultValue?: string | number;
|
|
965
|
+
onValueChange?: (raw: string) => void;
|
|
966
|
+
onNumberChange?: (num: number | null) => void;
|
|
967
|
+
mode?: NumericMode;
|
|
968
|
+
decimalScale?: number;
|
|
969
|
+
maxDecimalScale?: number;
|
|
970
|
+
scale?: number;
|
|
971
|
+
min?: number;
|
|
972
|
+
max?: number;
|
|
973
|
+
allowNegative?: boolean;
|
|
974
|
+
decimalSeparator?: DecimalSeparator;
|
|
975
|
+
formatOnBlur?: FormatOnBlur;
|
|
976
|
+
clampOnBlur?: boolean;
|
|
444
977
|
}
|
|
445
|
-
declare
|
|
978
|
+
declare const NumericInput: react.ForwardRefExoticComponent<NumericInputProps & react.RefAttributes<HTMLInputElement>>;
|
|
446
979
|
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
size?:
|
|
980
|
+
declare const textareaVariants: (props?: ({
|
|
981
|
+
variant?: "outline" | "default" | "ghost" | null | undefined;
|
|
982
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
983
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
984
|
+
type TextareaVariant = VariantProps<typeof textareaVariants>['variant'];
|
|
985
|
+
interface TextareaProps extends SharedComponentProps, Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'className'> {
|
|
986
|
+
variant?: TextareaVariant;
|
|
987
|
+
textareaClassName?: string;
|
|
988
|
+
onValueChange?: (value: string) => void;
|
|
989
|
+
suffix?: ReactNode;
|
|
450
990
|
}
|
|
451
|
-
declare
|
|
991
|
+
declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
|
|
452
992
|
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
className?: string;
|
|
461
|
-
contentClassName?: string;
|
|
462
|
-
wrap?: boolean;
|
|
463
|
-
portal?: boolean;
|
|
464
|
-
};
|
|
465
|
-
declare function Tooltip({ content, children, side, align, className, contentClassName, wrap, portal, }: TooltipProps): react_jsx_runtime.JSX.Element;
|
|
993
|
+
declare function Card({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
994
|
+
declare function CardHeader({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
995
|
+
declare function CardTitle({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
996
|
+
declare function CardDescription({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
997
|
+
declare function CardAction({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
998
|
+
declare function CardContent({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
999
|
+
declare function CardFooter({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
466
1000
|
|
|
467
|
-
type
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
targetRef?: RefObject<HTMLElement | null>;
|
|
473
|
-
side?: TooltipSide$1;
|
|
474
|
-
align?: TooltipAlign$1;
|
|
475
|
-
className?: string;
|
|
476
|
-
contentClassName?: string;
|
|
477
|
-
wrap?: boolean;
|
|
478
|
-
portal?: boolean;
|
|
1001
|
+
type ComboboxOption$1 = {
|
|
1002
|
+
label: string;
|
|
1003
|
+
value: string | number;
|
|
1004
|
+
description?: string;
|
|
1005
|
+
searchValue?: string;
|
|
479
1006
|
disabled?: boolean;
|
|
480
|
-
watch?: ReadonlyArray<unknown>;
|
|
481
1007
|
};
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
1008
|
+
interface ComboboxProps extends SharedComponentProps {
|
|
1009
|
+
options: ComboboxOption$1[];
|
|
1010
|
+
value?: string | number;
|
|
1011
|
+
placeholder?: string;
|
|
1012
|
+
onChange?: (value: ComboboxOption$1['value']) => void;
|
|
1013
|
+
onInputChange?: (value: string) => void;
|
|
1014
|
+
loading?: boolean;
|
|
1015
|
+
disabled?: boolean;
|
|
1016
|
+
searchPlaceholder?: string;
|
|
1017
|
+
helperId?: string;
|
|
1018
|
+
errorId?: string;
|
|
1019
|
+
allowClear?: boolean;
|
|
1020
|
+
onClear?: () => void;
|
|
493
1021
|
portal?: boolean;
|
|
494
|
-
};
|
|
495
|
-
declare function LineClampTooltip({ text, lineClamp, className, side, align, wrap, portal, }: LineClampTooltipProps): react_jsx_runtime.JSX.Element;
|
|
496
|
-
|
|
497
|
-
type TruncatedTextProps = {
|
|
498
|
-
email: string;
|
|
499
|
-
};
|
|
500
|
-
declare function TruncatedText({ email, }: TruncatedTextProps): react_jsx_runtime.JSX.Element;
|
|
501
|
-
|
|
502
|
-
type SidebarItem$1 = {
|
|
503
|
-
id: string;
|
|
504
|
-
title?: string;
|
|
505
|
-
titleKey?: string;
|
|
506
|
-
icon?: ReactNode | ElementType;
|
|
507
|
-
href?: string;
|
|
508
|
-
permission?: string | string[];
|
|
509
|
-
children?: SidebarItem$1[];
|
|
510
|
-
};
|
|
511
|
-
type PermissionChecker = (permission: string | string[] | undefined, userPermissions?: string[]) => boolean;
|
|
512
|
-
interface SidebarProps extends HTMLAttributes<HTMLElement> {
|
|
513
|
-
items: SidebarItem$1[];
|
|
514
|
-
userPermissions?: string[];
|
|
515
|
-
permissionChecker?: PermissionChecker;
|
|
516
|
-
activeItemId?: string;
|
|
517
|
-
onItemClick?: (item: SidebarItem$1) => void;
|
|
518
|
-
listClassName?: string;
|
|
519
|
-
nestedListClassName?: string;
|
|
520
|
-
itemClassName?: string;
|
|
521
|
-
indentSize?: number;
|
|
522
|
-
ariaLabel?: string;
|
|
523
|
-
collapsible?: boolean;
|
|
524
|
-
collapsed?: boolean;
|
|
525
|
-
defaultCollapsed?: boolean;
|
|
526
|
-
onCollapseChange?: (collapsed: boolean) => void;
|
|
527
|
-
collapsedWidth?: number | string;
|
|
528
|
-
expandedWidth?: number | string;
|
|
529
|
-
collapseButtonLabel?: string;
|
|
530
1022
|
}
|
|
1023
|
+
declare const Combobox: react.ForwardRefExoticComponent<ComboboxProps & react.RefAttributes<HTMLInputElement>>;
|
|
531
1024
|
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
onItemClick?: (item: SidebarItem$1) => void;
|
|
539
|
-
indentSize?: number;
|
|
540
|
-
nestedListClassName?: string;
|
|
541
|
-
itemClassName?: string;
|
|
542
|
-
collapsed?: boolean;
|
|
1025
|
+
type ComboboxOption = {
|
|
1026
|
+
label: string;
|
|
1027
|
+
value: string | number;
|
|
1028
|
+
description?: string;
|
|
1029
|
+
searchValue?: string;
|
|
1030
|
+
disabled?: boolean;
|
|
543
1031
|
};
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
1032
|
+
interface AsyncComboboxProps extends SharedComponentProps {
|
|
1033
|
+
options: ComboboxOption[];
|
|
1034
|
+
value?: string | number;
|
|
1035
|
+
placeholder?: string;
|
|
1036
|
+
onChange?: (value: ComboboxOption['value']) => void;
|
|
1037
|
+
onInputChange?: (value: string) => void;
|
|
1038
|
+
onInputFocus?: () => void;
|
|
1039
|
+
onScrollEnd?: () => void;
|
|
1040
|
+
loading?: boolean;
|
|
1041
|
+
disabled?: boolean;
|
|
1042
|
+
searchPlaceholder?: string;
|
|
1043
|
+
helperId?: string;
|
|
1044
|
+
errorId?: string;
|
|
1045
|
+
allowClear?: boolean;
|
|
1046
|
+
onClear?: () => void;
|
|
1047
|
+
portal?: boolean;
|
|
1048
|
+
}
|
|
1049
|
+
declare const AsyncCombobox: react.ForwardRefExoticComponent<AsyncComboboxProps & react.RefAttributes<HTMLInputElement>>;
|
|
549
1050
|
|
|
550
|
-
type
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
onHoverChange?: (hovered: boolean) => void;
|
|
556
|
-
header?: React.ReactNode | ArgonSidebarHeaderRender;
|
|
1051
|
+
type MultiSelectOption = {
|
|
1052
|
+
label: string;
|
|
1053
|
+
value: string | number;
|
|
1054
|
+
disabled?: boolean;
|
|
1055
|
+
searchValue?: string;
|
|
557
1056
|
};
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
size?: ButtonSize;
|
|
569
|
-
startIcon?: ReactNode;
|
|
570
|
-
endIcon?: ReactNode;
|
|
571
|
-
children?: ReactNode;
|
|
1057
|
+
interface MultiSelectProps extends SharedComponentProps {
|
|
1058
|
+
options: MultiSelectOption[];
|
|
1059
|
+
value?: Array<MultiSelectOption['value']>;
|
|
1060
|
+
placeholder?: string;
|
|
1061
|
+
onChange?: (value: Array<MultiSelectOption['value']>) => void;
|
|
1062
|
+
onSearch?: (value: string) => void;
|
|
1063
|
+
loading?: boolean;
|
|
1064
|
+
disabled?: boolean;
|
|
1065
|
+
searchable?: boolean;
|
|
1066
|
+
searchPlaceholder?: string;
|
|
572
1067
|
}
|
|
573
|
-
declare const
|
|
1068
|
+
declare const MultiSelect: react.ForwardRefExoticComponent<MultiSelectProps & react.RefAttributes<HTMLButtonElement>>;
|
|
574
1069
|
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
declare function
|
|
581
|
-
|
|
1070
|
+
/**
|
|
1071
|
+
* Vertical form wrapper that keeps consistent spacing between fields.
|
|
1072
|
+
* @remarks
|
|
1073
|
+
* Extend `className` or pass native form props while maintaining consistent letter spacing for each child row.
|
|
1074
|
+
*/
|
|
1075
|
+
declare function Form({ className, ...props }: FormHTMLAttributes<HTMLFormElement>): react_jsx_runtime.JSX.Element;
|
|
1076
|
+
interface FormFieldProps extends HTMLAttributes<HTMLDivElement> {
|
|
1077
|
+
children: ReactNode;
|
|
1078
|
+
label?: ReactNode;
|
|
1079
|
+
helperText?: ReactNode;
|
|
1080
|
+
errorMessage?: ReactNode;
|
|
1081
|
+
required?: boolean;
|
|
1082
|
+
htmlFor?: string;
|
|
1083
|
+
}
|
|
1084
|
+
/**
|
|
1085
|
+
* Grid-aligned form field wrapper for label/control/description clusters.
|
|
1086
|
+
*/
|
|
1087
|
+
declare const FormField: react.ForwardRefExoticComponent<FormFieldProps & react.RefAttributes<HTMLDivElement>>;
|
|
1088
|
+
/**
|
|
1089
|
+
* Container for a single form item to stack label, control, and messages vertically.
|
|
1090
|
+
*/
|
|
1091
|
+
declare const FormItem: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
|
|
1092
|
+
/**
|
|
1093
|
+
* Styled label with strong typography and surface-aware coloring.
|
|
1094
|
+
*/
|
|
1095
|
+
declare const FormLabel: react.ForwardRefExoticComponent<LabelHTMLAttributes<HTMLLabelElement> & react.RefAttributes<HTMLLabelElement>>;
|
|
1096
|
+
/**
|
|
1097
|
+
* Flex container that aligns inputs and accessory controls horizontally.
|
|
1098
|
+
*/
|
|
1099
|
+
declare const FormControl: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
|
|
1100
|
+
/**
|
|
1101
|
+
* Neutral description text for a form field.
|
|
1102
|
+
*/
|
|
1103
|
+
declare const FormDescription: react.ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & react.RefAttributes<HTMLParagraphElement>>;
|
|
1104
|
+
/**
|
|
1105
|
+
* Inline error message text for destructive validation states.
|
|
1106
|
+
*/
|
|
1107
|
+
declare const FormMessage: react.ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & react.RefAttributes<HTMLParagraphElement>>;
|
|
582
1108
|
|
|
583
|
-
type
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
iconClassName?: string;
|
|
588
|
-
rightSlot?: ReactNode;
|
|
1109
|
+
type SelectOption = {
|
|
1110
|
+
label: ReactNode;
|
|
1111
|
+
value: string | number;
|
|
1112
|
+
disabled?: boolean;
|
|
589
1113
|
};
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
variant?: "default" | "outline" | "ghost" | null | undefined;
|
|
1114
|
+
type Option = SelectOption;
|
|
1115
|
+
declare const triggerVariants$1: (props?: ({
|
|
1116
|
+
variant?: "outline" | "default" | "ghost" | null | undefined;
|
|
594
1117
|
size?: "sm" | "md" | "lg" | null | undefined;
|
|
595
1118
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
596
|
-
type
|
|
597
|
-
interface
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
1119
|
+
type SelectVariant$1 = VariantProps<typeof triggerVariants$1>['variant'];
|
|
1120
|
+
interface SelectProps extends SharedComponentProps, Omit<SelectPrimitive.SelectProps, 'defaultValue' | 'value' | 'children' | 'onValueChange'> {
|
|
1121
|
+
options: SelectOption[];
|
|
1122
|
+
value?: string | number;
|
|
1123
|
+
defaultValue?: string | number;
|
|
1124
|
+
placeholder?: string;
|
|
1125
|
+
onChange?: (value: SelectOption['value']) => void;
|
|
1126
|
+
variant?: SelectVariant$1;
|
|
604
1127
|
}
|
|
605
|
-
|
|
1128
|
+
/**
|
|
1129
|
+
* Select field powered by Radix primitives with customizable trigger variants and accessible helpers.
|
|
1130
|
+
* @remarks
|
|
1131
|
+
* Provide `options`, manage `value`/`defaultValue`, and style via `variant` (default/outline/ghost) plus `size` (sm/md/lg); show helper/error text and `loading`.
|
|
1132
|
+
*/
|
|
1133
|
+
declare const Select: react.ForwardRefExoticComponent<SelectProps & react.RefAttributes<HTMLButtonElement>>;
|
|
606
1134
|
|
|
607
|
-
type
|
|
608
|
-
label:
|
|
1135
|
+
type SearchableSelectOption = {
|
|
1136
|
+
label: ReactNode;
|
|
609
1137
|
value: string | number;
|
|
610
|
-
description?: string;
|
|
611
|
-
searchValue?: string;
|
|
612
1138
|
disabled?: boolean;
|
|
1139
|
+
searchValue?: string;
|
|
613
1140
|
};
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
interface ComboboxProps extends SharedComponentProps {
|
|
622
|
-
options: ComboboxOption[];
|
|
1141
|
+
declare const triggerVariants: (props?: ({
|
|
1142
|
+
variant?: "outline" | "default" | "ghost" | null | undefined;
|
|
1143
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
1144
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1145
|
+
type SelectVariant = VariantProps<typeof triggerVariants>['variant'];
|
|
1146
|
+
interface SearchableSelectProps extends SharedComponentProps, Omit<SelectPrimitive.SelectProps, 'defaultValue' | 'value' | 'children' | 'onValueChange'> {
|
|
1147
|
+
options: SearchableSelectOption[];
|
|
623
1148
|
value?: string | number;
|
|
1149
|
+
defaultValue?: string | number;
|
|
624
1150
|
placeholder?: string;
|
|
625
|
-
onChange?: (value:
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
hasMore?: boolean;
|
|
629
|
-
asyncConfig?: ComboboxAsyncConfig;
|
|
1151
|
+
onChange?: (value: SearchableSelectOption['value']) => void;
|
|
1152
|
+
variant?: SelectVariant;
|
|
1153
|
+
onSearch?: (query: string) => void;
|
|
630
1154
|
loading?: boolean;
|
|
631
|
-
|
|
1155
|
+
size?: 'sm' | 'md' | 'lg';
|
|
632
1156
|
searchPlaceholder?: string;
|
|
633
|
-
helperId?: string;
|
|
634
|
-
errorId?: string;
|
|
635
|
-
allowClear?: boolean;
|
|
636
|
-
onClear?: () => void;
|
|
637
|
-
portal?: boolean;
|
|
638
|
-
dropdownClassName?: string;
|
|
639
|
-
/** Override dropdown max height (e.g. for testing scroll with few items). */
|
|
640
|
-
dropdownMaxHeight?: number;
|
|
641
|
-
/** Keep error state styling but do not render error text below field. */
|
|
642
|
-
hideErrorMessage?: boolean;
|
|
643
|
-
}
|
|
644
|
-
declare const Combobox: react.ForwardRefExoticComponent<ComboboxProps & react.RefAttributes<HTMLInputElement>>;
|
|
645
|
-
|
|
646
|
-
interface SwitchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'size' | 'className' | 'onChange'> {
|
|
647
|
-
className?: string;
|
|
648
|
-
trackClassName?: string;
|
|
649
|
-
thumbClassName?: string;
|
|
650
|
-
onCheckedChange?: (checked: boolean) => void;
|
|
651
|
-
}
|
|
652
|
-
declare const Switch: react.ForwardRefExoticComponent<SwitchProps & react.RefAttributes<HTMLInputElement>>;
|
|
653
|
-
|
|
654
|
-
type MultiTabItem = {
|
|
655
|
-
label: ReactNode;
|
|
656
|
-
value: string;
|
|
657
|
-
};
|
|
658
|
-
interface MultiTabsProps {
|
|
659
|
-
items: MultiTabItem[];
|
|
660
|
-
value: string;
|
|
661
|
-
onChange: (value: string) => void;
|
|
662
|
-
className?: string;
|
|
663
|
-
style?: CSSProperties;
|
|
664
1157
|
}
|
|
665
|
-
declare
|
|
1158
|
+
declare const SearchableSelect: react.ForwardRefExoticComponent<SearchableSelectProps & react.RefAttributes<HTMLButtonElement>>;
|
|
666
1159
|
|
|
667
|
-
type
|
|
668
|
-
|
|
669
|
-
label: ReactNode;
|
|
1160
|
+
type Trend = 'up' | 'down' | 'flat';
|
|
1161
|
+
interface StatProps extends SharedComponentProps {
|
|
670
1162
|
value: ReactNode;
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
}
|
|
675
|
-
|
|
1163
|
+
helper?: ReactNode;
|
|
1164
|
+
delta?: ReactNode;
|
|
1165
|
+
trend?: Trend;
|
|
1166
|
+
}
|
|
1167
|
+
/**
|
|
1168
|
+
* Metric card that exposes a primary `value`, optional `delta`, and severity-aware `trend` indicator.
|
|
1169
|
+
* @remarks
|
|
1170
|
+
* Accepts `size` (sm/md/lg), shows `helper` or helper text, and can render `loading`/`disabled` states while aligning helper/error messaging.
|
|
1171
|
+
*/
|
|
1172
|
+
declare function Stat({ label, value, helper, delta, trend, helperText, errorMessage, loading, disabled, size, className, style, }: StatProps): react_jsx_runtime.JSX.Element;
|
|
676
1173
|
|
|
677
1174
|
type DataTableSortDirection = 'asc' | 'desc';
|
|
678
1175
|
type DataTableAlign = 'left' | 'center' | 'right';
|
|
@@ -718,13 +1215,14 @@ type DataTableProps<T> = {
|
|
|
718
1215
|
onRowClick?: (record: T) => void;
|
|
719
1216
|
rowSelection?: DataTableRowSelection;
|
|
720
1217
|
renderActions?: (record: T) => ReactNode;
|
|
721
|
-
actionColumnWidth?: number | string;
|
|
722
1218
|
className?: string;
|
|
723
1219
|
headerAlign?: DataTableAlign;
|
|
724
1220
|
cellAlign?: DataTableAlign;
|
|
725
1221
|
stickyOffset?: number;
|
|
1222
|
+
/** When false, table container does not scroll (overflow-visible). Default true. */
|
|
1223
|
+
scrollable?: boolean;
|
|
726
1224
|
};
|
|
727
|
-
declare function DataTable<T>({ columns, data, rowKey, loading, emptyText, pagination, sort, onSortChange, sortMode, onRowClick, rowSelection, renderActions,
|
|
1225
|
+
declare function DataTable<T>({ columns, data, rowKey, loading, emptyText, pagination, sort, onSortChange, sortMode, onRowClick, rowSelection, renderActions, className, headerAlign, stickyOffset, scrollable, }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
|
|
728
1226
|
declare const Table: react.ForwardRefExoticComponent<TableHTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
|
|
729
1227
|
declare const TableHeader: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
730
1228
|
declare const TableBody: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
@@ -733,128 +1231,255 @@ declare const TableCell: react.ForwardRefExoticComponent<TdHTMLAttributes<HTMLTa
|
|
|
733
1231
|
as?: "td" | "th";
|
|
734
1232
|
} & react.RefAttributes<HTMLTableCellElement>>;
|
|
735
1233
|
|
|
736
|
-
type
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
value: string | number;
|
|
744
|
-
label: ReactNode;
|
|
745
|
-
color?: string;
|
|
746
|
-
action?: StatusAction;
|
|
1234
|
+
type PaginationInfo = {
|
|
1235
|
+
page: number;
|
|
1236
|
+
pageSize: number;
|
|
1237
|
+
total: number;
|
|
1238
|
+
totalPages: number;
|
|
1239
|
+
showingStart: number;
|
|
1240
|
+
showingEnd: number;
|
|
747
1241
|
};
|
|
748
|
-
type
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
|
|
1242
|
+
type PaginationProps = {
|
|
1243
|
+
page: number;
|
|
1244
|
+
pageSize: number;
|
|
1245
|
+
total: number;
|
|
1246
|
+
onChange: (page: number) => void;
|
|
1247
|
+
pageSizeOptions?: number[];
|
|
1248
|
+
onPageSizeChange?: (pageSize: number) => void;
|
|
1249
|
+
className?: string;
|
|
1250
|
+
showFirstLast?: boolean;
|
|
1251
|
+
label?: (info: PaginationInfo) => ReactNode;
|
|
752
1252
|
};
|
|
753
|
-
declare
|
|
1253
|
+
declare const Pagination: ({ page, pageSize, total, onChange, pageSizeOptions, onPageSizeChange, className, showFirstLast, label, }: PaginationProps) => react_jsx_runtime.JSX.Element;
|
|
754
1254
|
|
|
755
|
-
type
|
|
756
|
-
|
|
1255
|
+
type PageTitleProps = {
|
|
1256
|
+
/**
|
|
1257
|
+
* Main title of the page.
|
|
1258
|
+
*/
|
|
1259
|
+
title: string;
|
|
1260
|
+
/**
|
|
1261
|
+
* Short description shown below the title.
|
|
1262
|
+
*/
|
|
1263
|
+
subtitle?: string;
|
|
1264
|
+
/**
|
|
1265
|
+
* Visual density of the page header.
|
|
1266
|
+
*/
|
|
1267
|
+
size?: 'default' | 'compact';
|
|
1268
|
+
/**
|
|
1269
|
+
* Slot rendered on the right side of the header.
|
|
1270
|
+
*/
|
|
1271
|
+
rightSlot?: ReactNode;
|
|
757
1272
|
};
|
|
758
|
-
declare function
|
|
1273
|
+
declare function PageTitle({ title, subtitle, size, rightSlot, }: PageTitleProps): react_jsx_runtime.JSX.Element;
|
|
759
1274
|
|
|
760
|
-
type
|
|
761
|
-
|
|
762
|
-
|
|
1275
|
+
type SectionTitleProps = {
|
|
1276
|
+
/**
|
|
1277
|
+
* Main title of the section.
|
|
1278
|
+
*/
|
|
1279
|
+
title: string;
|
|
1280
|
+
/**
|
|
1281
|
+
* Short description that explains the section.
|
|
1282
|
+
*/
|
|
1283
|
+
subtitle?: string;
|
|
1284
|
+
/**
|
|
1285
|
+
* Icon displayed to the left of the title.
|
|
1286
|
+
*/
|
|
1287
|
+
icon?: ReactNode;
|
|
1288
|
+
/**
|
|
1289
|
+
* Custom class for the icon wrapper.
|
|
1290
|
+
*/
|
|
1291
|
+
iconClassName?: string;
|
|
1292
|
+
/**
|
|
1293
|
+
* Slot rendered on the right side of the section title.
|
|
1294
|
+
*/
|
|
1295
|
+
rightSlot?: ReactNode;
|
|
763
1296
|
};
|
|
764
|
-
|
|
765
|
-
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
|
|
1297
|
+
declare function SectionTitle({ title, subtitle, icon, iconClassName, rightSlot, }: SectionTitleProps): react_jsx_runtime.JSX.Element;
|
|
1298
|
+
|
|
1299
|
+
interface TabItem {
|
|
1300
|
+
value: string;
|
|
1301
|
+
label: ReactNode;
|
|
1302
|
+
content: ReactNode;
|
|
1303
|
+
badge?: ReactNode;
|
|
1304
|
+
}
|
|
1305
|
+
interface TabsProps {
|
|
1306
|
+
items: TabItem[];
|
|
1307
|
+
defaultValue?: string;
|
|
1308
|
+
onChange?: (value: string) => void;
|
|
769
1309
|
className?: string;
|
|
1310
|
+
listClassName?: string;
|
|
1311
|
+
contentClassName?: string;
|
|
770
1312
|
}
|
|
771
|
-
declare function
|
|
1313
|
+
declare function Tabs({ items, defaultValue, onChange, className, listClassName, contentClassName, }: TabsProps): react_jsx_runtime.JSX.Element;
|
|
772
1314
|
|
|
773
|
-
|
|
774
|
-
label: string;
|
|
775
|
-
value: string;
|
|
776
|
-
};
|
|
777
|
-
interface DateTimePickerProps {
|
|
1315
|
+
interface LoadingProps extends HTMLAttributes<HTMLDivElement> {
|
|
778
1316
|
label?: ReactNode;
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
1317
|
+
size?: LoadingSpinnerProps['size'];
|
|
1318
|
+
}
|
|
1319
|
+
declare function Loading({ label, size, className, ...props }: LoadingProps): react_jsx_runtime.JSX.Element;
|
|
1320
|
+
|
|
1321
|
+
type TooltipSide$2 = 'top' | 'right' | 'bottom' | 'left';
|
|
1322
|
+
type TooltipAlign$2 = 'start' | 'center' | 'end';
|
|
1323
|
+
type TooltipProps = {
|
|
1324
|
+
/**
|
|
1325
|
+
* Tooltip content shown on hover or focus.
|
|
1326
|
+
*/
|
|
1327
|
+
content: ReactNode;
|
|
1328
|
+
/**
|
|
1329
|
+
* Trigger element for the tooltip.
|
|
1330
|
+
*/
|
|
1331
|
+
children: ReactNode;
|
|
1332
|
+
/**
|
|
1333
|
+
* Tooltip side relative to the trigger.
|
|
1334
|
+
*/
|
|
1335
|
+
side?: TooltipSide$2;
|
|
1336
|
+
/**
|
|
1337
|
+
* Tooltip alignment on the secondary axis.
|
|
1338
|
+
*/
|
|
1339
|
+
align?: TooltipAlign$2;
|
|
1340
|
+
/**
|
|
1341
|
+
* Extra class names for the trigger wrapper.
|
|
1342
|
+
*/
|
|
1343
|
+
className?: string;
|
|
1344
|
+
/**
|
|
1345
|
+
* Extra class names for the tooltip panel.
|
|
1346
|
+
*/
|
|
1347
|
+
contentClassName?: string;
|
|
1348
|
+
/**
|
|
1349
|
+
* Allows tooltip content to wrap onto multiple lines.
|
|
1350
|
+
*/
|
|
1351
|
+
wrap?: boolean;
|
|
1352
|
+
/**
|
|
1353
|
+
* Renders the tooltip through a portal into `document.body`.
|
|
1354
|
+
*/
|
|
1355
|
+
portal?: boolean;
|
|
1356
|
+
};
|
|
1357
|
+
declare function Tooltip({ content, children, side, align, className, contentClassName, wrap, portal, }: TooltipProps): react_jsx_runtime.JSX.Element;
|
|
1358
|
+
|
|
1359
|
+
type TooltipSide$1 = 'top' | 'right' | 'bottom' | 'left';
|
|
1360
|
+
type TooltipAlign$1 = 'start' | 'center' | 'end';
|
|
1361
|
+
type OverflowTooltipProps = {
|
|
1362
|
+
content: ReactNode;
|
|
1363
|
+
children: ReactNode;
|
|
1364
|
+
targetRef?: RefObject<HTMLElement | null>;
|
|
1365
|
+
side?: TooltipSide$1;
|
|
1366
|
+
align?: TooltipAlign$1;
|
|
1367
|
+
className?: string;
|
|
1368
|
+
contentClassName?: string;
|
|
1369
|
+
wrap?: boolean;
|
|
1370
|
+
portal?: boolean;
|
|
782
1371
|
disabled?: boolean;
|
|
783
|
-
|
|
1372
|
+
watch?: ReadonlyArray<unknown>;
|
|
1373
|
+
};
|
|
1374
|
+
declare function OverflowTooltip({ content, children, targetRef, side, align, className, contentClassName, wrap, portal, disabled, watch, }: OverflowTooltipProps): react_jsx_runtime.JSX.Element;
|
|
1375
|
+
|
|
1376
|
+
type TooltipSide = 'top' | 'right' | 'bottom' | 'left';
|
|
1377
|
+
type TooltipAlign = 'start' | 'center' | 'end';
|
|
1378
|
+
type LineClampTooltipProps = {
|
|
1379
|
+
text: string;
|
|
1380
|
+
lineClamp?: number;
|
|
784
1381
|
className?: string;
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
minDateTime?: Date;
|
|
789
|
-
quickOptions?: QuickOption[];
|
|
790
|
-
onQuickSelect?: (value: string) => void;
|
|
791
|
-
onClear?: () => void;
|
|
792
|
-
quickRangesLabel?: string;
|
|
793
|
-
clearLabel?: string;
|
|
1382
|
+
side?: TooltipSide;
|
|
1383
|
+
align?: TooltipAlign;
|
|
1384
|
+
wrap?: boolean;
|
|
794
1385
|
portal?: boolean;
|
|
795
|
-
}
|
|
796
|
-
declare function
|
|
1386
|
+
};
|
|
1387
|
+
declare function LineClampTooltip({ text, lineClamp, className, side, align, wrap, portal, }: LineClampTooltipProps): react_jsx_runtime.JSX.Element;
|
|
797
1388
|
|
|
798
|
-
type
|
|
799
|
-
|
|
800
|
-
|
|
801
|
-
|
|
802
|
-
|
|
803
|
-
|
|
804
|
-
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
declare
|
|
816
|
-
|
|
817
|
-
declare const
|
|
818
|
-
declare
|
|
819
|
-
declare
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
1389
|
+
type TruncatedTextProps = {
|
|
1390
|
+
email: string;
|
|
1391
|
+
};
|
|
1392
|
+
declare function TruncatedText({ email, }: TruncatedTextProps): react_jsx_runtime.JSX.Element;
|
|
1393
|
+
|
|
1394
|
+
declare function Sidebar({ items, userPermissions, permissionChecker, activeItemId, onItemClick, listClassName, nestedListClassName, itemClassName, indentSize, ariaLabel, className, collapsible, collapsed, defaultCollapsed, onCollapseChange, collapsedWidth, expandedWidth, collapseButtonLabel, style, ...rest }: SidebarProps): react_jsx_runtime.JSX.Element;
|
|
1395
|
+
|
|
1396
|
+
type SidebarItemProps = {
|
|
1397
|
+
item: SidebarItem$1;
|
|
1398
|
+
depth: number;
|
|
1399
|
+
activeItemId?: string;
|
|
1400
|
+
onItemClick?: (item: SidebarItem$1) => void;
|
|
1401
|
+
indentSize?: number;
|
|
1402
|
+
nestedListClassName?: string;
|
|
1403
|
+
itemClassName?: string;
|
|
1404
|
+
collapsed?: boolean;
|
|
1405
|
+
};
|
|
1406
|
+
declare function SidebarItem({ item, depth, activeItemId, onItemClick, indentSize, nestedListClassName, itemClassName, collapsed, }: SidebarItemProps): react_jsx_runtime.JSX.Element;
|
|
1407
|
+
|
|
1408
|
+
declare const defaultPermissionChecker: PermissionChecker;
|
|
1409
|
+
declare function filterSidebarItems(items: SidebarItem$1[], userPermissions: string[] | undefined, permissionChecker?: PermissionChecker): SidebarItem$1[];
|
|
1410
|
+
declare function hasActiveDescendant(item: SidebarItem$1, activeItemId?: string): boolean;
|
|
1411
|
+
|
|
1412
|
+
interface MainFeNamespace {
|
|
1413
|
+
/**
|
|
1414
|
+
* Legacy page header component.
|
|
1415
|
+
*/
|
|
1416
|
+
PageTitle: typeof PageTitle$1;
|
|
1417
|
+
/**
|
|
1418
|
+
* Section header for legacy `main-fe`.
|
|
1419
|
+
*/
|
|
1420
|
+
SectionTitle: typeof SectionTitle$1;
|
|
1421
|
+
/**
|
|
1422
|
+
* Button theo visual style legacy `main-fe`.
|
|
1423
|
+
* Legacy `main-fe` styled button.
|
|
1424
|
+
*/
|
|
1425
|
+
Button: typeof Button$1;
|
|
1426
|
+
/**
|
|
1427
|
+
* Input theo visual style legacy `main-fe`.
|
|
1428
|
+
* Legacy `main-fe` styled input.
|
|
1429
|
+
*/
|
|
1430
|
+
Input: typeof Input$1;
|
|
1431
|
+
/**
|
|
1432
|
+
* Legacy `main-fe` combobox with search/load-more.
|
|
1433
|
+
*/
|
|
1434
|
+
Combobox: typeof Combobox$1;
|
|
1435
|
+
/**
|
|
1436
|
+
* Switch theo visual style legacy `main-fe`.
|
|
1437
|
+
* Legacy `main-fe` styled switch.
|
|
1438
|
+
*/
|
|
1439
|
+
Switch: typeof Switch;
|
|
1440
|
+
/**
|
|
1441
|
+
* Segmented tab group.
|
|
1442
|
+
*/
|
|
1443
|
+
MultiTabs: typeof MultiTabs;
|
|
1444
|
+
/**
|
|
1445
|
+
* Metric card for legacy dashboards/lists.
|
|
1446
|
+
*/
|
|
1447
|
+
StatCard: typeof StatCard;
|
|
1448
|
+
/**
|
|
1449
|
+
* Legacy `main-fe` data table.
|
|
1450
|
+
*/
|
|
1451
|
+
DataTable: typeof DataTable$1;
|
|
1452
|
+
/**
|
|
1453
|
+
* Full-area loading state for remote or legacy screens.
|
|
1454
|
+
*/
|
|
1455
|
+
RemoteLoading: typeof RemoteLoading;
|
|
1456
|
+
/**
|
|
1457
|
+
* Date-range picker.
|
|
1458
|
+
*/
|
|
1459
|
+
DateRangePicker: typeof DateRangePicker;
|
|
1460
|
+
/**
|
|
1461
|
+
* Date-time picker.
|
|
1462
|
+
*/
|
|
1463
|
+
DateTimePicker: typeof DateTimePicker;
|
|
1464
|
+
/**
|
|
1465
|
+
* Argon-style sidebar for legacy `main-fe`.
|
|
1466
|
+
*/
|
|
1467
|
+
ArgonSidebar: typeof ArgonSidebar;
|
|
1468
|
+
Badge: typeof Badge;
|
|
1469
|
+
Card: typeof Card$1;
|
|
1470
|
+
CardHeader: typeof CardHeader$1;
|
|
1471
|
+
CardFooter: typeof CardFooter$1;
|
|
1472
|
+
CardTitle: typeof CardTitle$1;
|
|
1473
|
+
CardAction: typeof CardAction$1;
|
|
1474
|
+
CardDescription: typeof CardDescription$1;
|
|
1475
|
+
CardContent: typeof CardContent$1;
|
|
1476
|
+
Table: typeof Table$1;
|
|
1477
|
+
TableHeader: typeof TableHeader$1;
|
|
1478
|
+
TableBody: typeof TableBody$1;
|
|
1479
|
+
TableRow: typeof TableRow$1;
|
|
1480
|
+
TableCell: typeof TableCell$1;
|
|
1481
|
+
getStatusPresentation: typeof getStatusPresentation;
|
|
858
1482
|
}
|
|
1483
|
+
declare const MainFe: MainFeNamespace;
|
|
859
1484
|
|
|
860
|
-
export { Alert, type AlertProps, ArgonSidebar, AsyncCombobox, type AsyncComboboxProps, Badge, type BadgeProps, Breadcrumb, type BreadcrumbItem,
|
|
1485
|
+
export { Alert, type AlertProps, ArgonSidebar, type ArgonSidebarHeaderRender, type ArgonSidebarProps, AsyncCombobox, type AsyncComboboxProps, Badge, type BadgeProps, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, type ButtonProps, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Combobox, type ComboboxOption$1 as ComboboxOption, type ComboboxProps, FormControl as Control, DataTable, type DataTableAlign, type DataTableColumn, type DataTablePagination, type DataTableProps, type DataTableRowSelection, type DataTableSortDirection, type DataTableSortState, type DateRangePickerProps, type DateRangePickerValue, type DateTimePickerProps, FormDescription as Description, FormField as Field, Form, FormControl, FormDescription, FormField, type FormFieldProps, FormItem, FormLabel, FormMessage, Input, type InputProps, FormItem as Item, FormLabel as Label, LineClampTooltip, type LineClampTooltipProps, Loading, type LoadingProps, MainFe, type ButtonProps$1 as MainFeButtonProps, type ComboboxAsyncConfig as MainFeComboboxAsyncConfig, type ComboboxOption$2 as MainFeComboboxOption, type ComboboxProps$1 as MainFeComboboxProps, type DataTableAlign$1 as MainFeDataTableAlign, type DataTableColumn$1 as MainFeDataTableColumn, type DataTablePagination$1 as MainFeDataTablePagination, type DataTableProps$1 as MainFeDataTableProps, type DataTableRowSelection$1 as MainFeDataTableRowSelection, type DataTableSortDirection$1 as MainFeDataTableSortDirection, type DataTableSortState$1 as MainFeDataTableSortState, type InputProps$1 as MainFeInputProps, type MainFeNamespace, type MainFePageTitleProps, type QuickOption as MainFeQuickOption, type MainFeSectionTitleProps, type SwitchProps as MainFeSwitchProps, FormMessage as Message, MultiSelect, type MultiSelectOption, type MultiSelectProps, type MultiTabItem, type MultiTabsProps, NumericInput, type NumericInputProps, type Option, OverflowTooltip, type OverflowTooltipProps, PageTitle, type PageTitleProps, Pagination, type PaginationInfo, type PaginationProps, type PermissionChecker, type RemoteLoadingProps, SearchableSelect, type SearchableSelectOption, type SearchableSelectProps, SectionTitle, type SectionTitleProps, Select, type SelectOption, type SelectProps, Sidebar, SidebarItem, type SidebarProps, Stat, type StatCardProps, type StatProps, type StatTone, type TabItem, Table, TableBody, TableCell, TableHeader, TableRow, Tabs, type TabsProps, Textarea, type TextareaProps, Tooltip, type TooltipProps, type Trend, TruncatedText, type TruncatedTextProps, defaultPermissionChecker, filterSidebarItems, hasActiveDescendant };
|