@alepha/ui 0.11.9 → 0.11.11
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/AlephaMantineProvider-DCF5kidi.cjs +3 -0
- package/dist/AlephaMantineProvider-DlOEv9f0.cjs +173 -0
- package/dist/AlephaMantineProvider-DlOEv9f0.cjs.map +1 -0
- package/dist/index.cjs +2444 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +813 -0
- package/dist/index.d.cts.map +1 -0
- package/dist/index.d.ts +19 -19
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/package.json +14 -13
- package/src/components/form/ControlQueryBuilder.tsx +1 -1
package/dist/index.d.cts
ADDED
|
@@ -0,0 +1,813 @@
|
|
|
1
|
+
import * as _alepha_core0 from "@alepha/core";
|
|
2
|
+
import { Alepha, Async, Page, PageMetadata, Static, TObject, TProperties } from "@alepha/core";
|
|
3
|
+
import { ComponentType, ReactNode } from "react";
|
|
4
|
+
import * as react_jsx_runtime5 from "react/jsx-runtime";
|
|
5
|
+
import { AppShellFooterProps, AppShellHeaderProps, AppShellMainProps, AppShellNavbarProps, AppShellProps, AutocompleteProps, ButtonProps, ColorInputProps, ColorSchemeScriptProps, FileInputProps, Flex, FlexProps, MantineBreakpoint, MantineProviderProps, MantineSize, MenuProps, MenuTargetProps, ModalProps, MultiSelectProps, NumberInputProps, PasswordInputProps, SegmentedControlProps, SelectProps, SliderProps, SwitchProps, TableProps, TableTrProps, TagsInputProps, Text, TextInputProps, TextareaProps, ThemeIconProps, TooltipProps } from "@mantine/core";
|
|
6
|
+
import { DateInputProps, DateTimePickerProps, TimeInputProps } from "@mantine/dates";
|
|
7
|
+
import { FormModel, InputField } from "@alepha/react-form";
|
|
8
|
+
import * as _alepha_react0 from "@alepha/react";
|
|
9
|
+
import { RouterGoOptions, UseActionReturn, UseActiveOptions } from "@alepha/react";
|
|
10
|
+
import { ModalsProviderProps } from "@mantine/modals";
|
|
11
|
+
import * as _mantine_notifications0 from "@mantine/notifications";
|
|
12
|
+
import { NotificationData, NotificationsProps } from "@mantine/notifications";
|
|
13
|
+
import { NavigationProgressProps } from "@mantine/nprogress";
|
|
14
|
+
import { DurationLike } from "@alepha/datetime";
|
|
15
|
+
|
|
16
|
+
//#region src/utils/parseInput.d.ts
|
|
17
|
+
interface GenericControlProps {
|
|
18
|
+
input: InputField;
|
|
19
|
+
title?: string;
|
|
20
|
+
description?: string;
|
|
21
|
+
icon?: ReactNode;
|
|
22
|
+
}
|
|
23
|
+
//#endregion
|
|
24
|
+
//#region src/components/form/ControlNumber.d.ts
|
|
25
|
+
interface ControlNumberProps extends GenericControlProps {
|
|
26
|
+
numberInputProps?: Partial<NumberInputProps>;
|
|
27
|
+
sliderProps?: Partial<SliderProps>;
|
|
28
|
+
}
|
|
29
|
+
//#endregion
|
|
30
|
+
//#region src/components/form/ControlSelect.d.ts
|
|
31
|
+
type SelectValueLabel = string | {
|
|
32
|
+
value: string;
|
|
33
|
+
label: string;
|
|
34
|
+
icon?: string;
|
|
35
|
+
};
|
|
36
|
+
interface ControlSelectProps extends GenericControlProps {
|
|
37
|
+
select?: boolean | SelectProps;
|
|
38
|
+
multi?: boolean | MultiSelectProps;
|
|
39
|
+
tags?: boolean | TagsInputProps;
|
|
40
|
+
autocomplete?: boolean | AutocompleteProps;
|
|
41
|
+
segmented?: boolean | Partial<SegmentedControlProps>;
|
|
42
|
+
loader?: () => Promise<SelectValueLabel[]>;
|
|
43
|
+
}
|
|
44
|
+
/**
|
|
45
|
+
* ControlSelect component for handling Select, MultiSelect, and TagsInput.
|
|
46
|
+
*
|
|
47
|
+
* Features:
|
|
48
|
+
* - Basic Select with enum support
|
|
49
|
+
* - MultiSelect for array of enums
|
|
50
|
+
* - TagsInput for array of strings (no enum)
|
|
51
|
+
* - Future: Lazy loading
|
|
52
|
+
* - Future: Searchable/filterable options
|
|
53
|
+
* - Future: Custom option rendering
|
|
54
|
+
*
|
|
55
|
+
* Automatically detects enum values and array types from schema.
|
|
56
|
+
*/
|
|
57
|
+
declare const ControlSelect: (props: ControlSelectProps) => react_jsx_runtime5.JSX.Element | null;
|
|
58
|
+
//#endregion
|
|
59
|
+
//#region src/components/form/Control.d.ts
|
|
60
|
+
interface ControlProps extends GenericControlProps {
|
|
61
|
+
text?: TextInputProps;
|
|
62
|
+
area?: boolean | TextareaProps;
|
|
63
|
+
select?: boolean | Partial<ControlSelectProps>;
|
|
64
|
+
password?: boolean | PasswordInputProps;
|
|
65
|
+
switch?: boolean | SwitchProps;
|
|
66
|
+
number?: boolean | Partial<ControlNumberProps>;
|
|
67
|
+
file?: boolean | FileInputProps;
|
|
68
|
+
color?: boolean | ColorInputProps;
|
|
69
|
+
date?: boolean | DateInputProps;
|
|
70
|
+
datetime?: boolean | DateTimePickerProps;
|
|
71
|
+
time?: boolean | TimeInputProps;
|
|
72
|
+
query?: any;
|
|
73
|
+
custom?: ComponentType<CustomControlProps>;
|
|
74
|
+
}
|
|
75
|
+
/**
|
|
76
|
+
* Generic form control that renders the appropriate input based on the schema and props.
|
|
77
|
+
*
|
|
78
|
+
* Supports:
|
|
79
|
+
* - TextInput (with format detection: email, url, tel)
|
|
80
|
+
* - Textarea
|
|
81
|
+
* - NumberInput (for number/integer types)
|
|
82
|
+
* - FileInput
|
|
83
|
+
* - ColorInput (for color format)
|
|
84
|
+
* - Select (for enum types)
|
|
85
|
+
* - Autocomplete
|
|
86
|
+
* - PasswordInput
|
|
87
|
+
* - Switch (for boolean types)
|
|
88
|
+
* - SegmentedControl (for enum types)
|
|
89
|
+
* - DateInput (for date format)
|
|
90
|
+
* - DateTimePicker (for date-time format)
|
|
91
|
+
* - TimeInput (for time format)
|
|
92
|
+
* - QueryBuilder (for building type-safe queries with autocomplete)
|
|
93
|
+
* - Custom component
|
|
94
|
+
*
|
|
95
|
+
* Automatically handles labels, descriptions, error messages, required state, and default icons.
|
|
96
|
+
*/
|
|
97
|
+
declare const Control: (_props: ControlProps) => react_jsx_runtime5.JSX.Element | null;
|
|
98
|
+
type CustomControlProps = {
|
|
99
|
+
defaultValue: any;
|
|
100
|
+
onChange: (value: any) => void;
|
|
101
|
+
};
|
|
102
|
+
//#endregion
|
|
103
|
+
//#region src/components/buttons/ActionButton.d.ts
|
|
104
|
+
interface ActionMenuItem {
|
|
105
|
+
/**
|
|
106
|
+
* Menu item type
|
|
107
|
+
*/
|
|
108
|
+
type?: "item" | "divider" | "label";
|
|
109
|
+
/**
|
|
110
|
+
* Label text for the menu item
|
|
111
|
+
*/
|
|
112
|
+
label?: string | ReactNode;
|
|
113
|
+
/**
|
|
114
|
+
* Icon element to display before the label
|
|
115
|
+
*/
|
|
116
|
+
icon?: ReactNode;
|
|
117
|
+
/**
|
|
118
|
+
* Click handler for menu items
|
|
119
|
+
*/
|
|
120
|
+
onClick?: () => void;
|
|
121
|
+
/**
|
|
122
|
+
* Href for navigation menu items
|
|
123
|
+
*/
|
|
124
|
+
href?: string;
|
|
125
|
+
/**
|
|
126
|
+
* Color for the menu item (e.g., "red" for danger actions)
|
|
127
|
+
*/
|
|
128
|
+
color?: string;
|
|
129
|
+
/**
|
|
130
|
+
* Nested submenu items
|
|
131
|
+
*/
|
|
132
|
+
children?: ActionMenuItem[];
|
|
133
|
+
/**
|
|
134
|
+
* Whether the menu item is active
|
|
135
|
+
*/
|
|
136
|
+
active?: boolean;
|
|
137
|
+
}
|
|
138
|
+
interface ActionMenuConfig {
|
|
139
|
+
/**
|
|
140
|
+
* Array of menu items to display
|
|
141
|
+
*/
|
|
142
|
+
items: ActionMenuItem[];
|
|
143
|
+
/**
|
|
144
|
+
* Menu position relative to the button
|
|
145
|
+
*/
|
|
146
|
+
position?: "bottom" | "bottom-start" | "bottom-end" | "top" | "top-start" | "top-end" | "left" | "right";
|
|
147
|
+
/**
|
|
148
|
+
* Menu width
|
|
149
|
+
*/
|
|
150
|
+
width?: number | string;
|
|
151
|
+
/**
|
|
152
|
+
* Menu shadow
|
|
153
|
+
*/
|
|
154
|
+
shadow?: "xs" | "sm" | "md" | "lg" | "xl";
|
|
155
|
+
on?: "hover" | "click";
|
|
156
|
+
targetProps?: MenuTargetProps;
|
|
157
|
+
menuProps?: MenuProps;
|
|
158
|
+
}
|
|
159
|
+
interface ActionCommonProps extends ButtonProps {
|
|
160
|
+
children?: ReactNode;
|
|
161
|
+
textVisibleFrom?: "xs" | "sm" | "md" | "lg" | "xl";
|
|
162
|
+
/**
|
|
163
|
+
* Tooltip to display on hover. Can be a string for simple tooltips
|
|
164
|
+
* or a TooltipProps object for advanced configuration.
|
|
165
|
+
*/
|
|
166
|
+
tooltip?: string | TooltipProps;
|
|
167
|
+
/**
|
|
168
|
+
* Menu configuration. When provided, the action will display a dropdown menu.
|
|
169
|
+
*/
|
|
170
|
+
menu?: ActionMenuConfig;
|
|
171
|
+
/**
|
|
172
|
+
* If set, a confirmation dialog will be shown before performing the action.
|
|
173
|
+
* If `true`, a default title and message will be used.
|
|
174
|
+
* If a string, it will be used as the message with a default title.
|
|
175
|
+
* If an object, it can contain `title` and `message` properties to customize the dialog.
|
|
176
|
+
*/
|
|
177
|
+
confirm?: boolean | string | {
|
|
178
|
+
title?: string;
|
|
179
|
+
message: string;
|
|
180
|
+
};
|
|
181
|
+
/**
|
|
182
|
+
* Icon to display on the left side of the button.
|
|
183
|
+
* If no children are provided, the button will be styled as an icon-only button.
|
|
184
|
+
*/
|
|
185
|
+
icon?: ReactNode;
|
|
186
|
+
/**
|
|
187
|
+
* Additional props to pass to the ThemeIcon wrapping the icon.
|
|
188
|
+
*/
|
|
189
|
+
themeIconProps?: ThemeIconProps;
|
|
190
|
+
}
|
|
191
|
+
type ActionProps = ActionCommonProps & (ActionNavigationButtonProps | ActionClickButtonProps | ActionSubmitButtonProps | ActionHookButtonProps | {});
|
|
192
|
+
declare const ActionButton: (_props: ActionProps) => react_jsx_runtime5.JSX.Element;
|
|
193
|
+
interface ActionSubmitButtonProps extends ButtonProps {
|
|
194
|
+
form: FormModel<any>;
|
|
195
|
+
type?: "submit" | "reset";
|
|
196
|
+
}
|
|
197
|
+
interface ActionHookButtonProps extends ButtonProps {
|
|
198
|
+
action: UseActionReturn<any[], any>;
|
|
199
|
+
}
|
|
200
|
+
interface ActionClickButtonProps extends ButtonProps {
|
|
201
|
+
onClick: (e: any) => any;
|
|
202
|
+
}
|
|
203
|
+
interface ActionNavigationButtonProps extends ButtonProps {
|
|
204
|
+
href: string;
|
|
205
|
+
active?: Partial<UseActiveOptions> | false;
|
|
206
|
+
routerGoOptions?: RouterGoOptions;
|
|
207
|
+
classNameActive?: string;
|
|
208
|
+
variantActive?: ButtonProps["variant"];
|
|
209
|
+
target?: string;
|
|
210
|
+
}
|
|
211
|
+
//#endregion
|
|
212
|
+
//#region src/components/buttons/DarkModeButton.d.ts
|
|
213
|
+
interface DarkModeButtonProps {
|
|
214
|
+
mode?: "minimal" | "segmented";
|
|
215
|
+
size?: MantineBreakpoint;
|
|
216
|
+
variant?: "filled" | "light" | "outline" | "default" | "subtle" | "transparent";
|
|
217
|
+
fullWidth?: boolean;
|
|
218
|
+
segmentedProps?: Partial<SegmentedControlProps>;
|
|
219
|
+
actionProps?: Partial<ActionProps>;
|
|
220
|
+
}
|
|
221
|
+
declare const DarkModeButton: (props: DarkModeButtonProps) => react_jsx_runtime5.JSX.Element;
|
|
222
|
+
//#endregion
|
|
223
|
+
//#region src/components/buttons/OmnibarButton.d.ts
|
|
224
|
+
interface OmnibarButtonProps {
|
|
225
|
+
actionProps?: ActionProps;
|
|
226
|
+
collapsed?: boolean;
|
|
227
|
+
}
|
|
228
|
+
declare const OmnibarButton: (props: OmnibarButtonProps) => react_jsx_runtime5.JSX.Element;
|
|
229
|
+
//#endregion
|
|
230
|
+
//#region src/components/data/JsonViewer.d.ts
|
|
231
|
+
interface JsonViewerProps {
|
|
232
|
+
data: any;
|
|
233
|
+
defaultExpanded?: boolean;
|
|
234
|
+
maxDepth?: number;
|
|
235
|
+
copyable?: boolean;
|
|
236
|
+
size?: MantineSize;
|
|
237
|
+
}
|
|
238
|
+
declare const JsonViewer: ({
|
|
239
|
+
data,
|
|
240
|
+
defaultExpanded,
|
|
241
|
+
maxDepth,
|
|
242
|
+
copyable,
|
|
243
|
+
size
|
|
244
|
+
}: JsonViewerProps) => react_jsx_runtime5.JSX.Element;
|
|
245
|
+
//#endregion
|
|
246
|
+
//#region src/services/DialogService.d.ts
|
|
247
|
+
interface BaseDialogOptions extends Partial<ModalProps> {
|
|
248
|
+
title?: ReactNode;
|
|
249
|
+
message?: ReactNode;
|
|
250
|
+
content?: any;
|
|
251
|
+
}
|
|
252
|
+
interface AlertDialogOptions extends BaseDialogOptions {
|
|
253
|
+
okLabel?: string;
|
|
254
|
+
}
|
|
255
|
+
interface ConfirmDialogOptions extends BaseDialogOptions {
|
|
256
|
+
confirmLabel?: string;
|
|
257
|
+
cancelLabel?: string;
|
|
258
|
+
confirmColor?: string;
|
|
259
|
+
}
|
|
260
|
+
interface PromptDialogOptions extends BaseDialogOptions {
|
|
261
|
+
placeholder?: string;
|
|
262
|
+
defaultValue?: string;
|
|
263
|
+
label?: string;
|
|
264
|
+
required?: boolean;
|
|
265
|
+
submitLabel?: string;
|
|
266
|
+
cancelLabel?: string;
|
|
267
|
+
}
|
|
268
|
+
interface AlertDialogProps {
|
|
269
|
+
options?: AlertDialogOptions;
|
|
270
|
+
onClose: () => void;
|
|
271
|
+
}
|
|
272
|
+
interface ConfirmDialogProps {
|
|
273
|
+
options?: ConfirmDialogOptions;
|
|
274
|
+
onConfirm: (confirmed: boolean) => void;
|
|
275
|
+
}
|
|
276
|
+
interface PromptDialogProps {
|
|
277
|
+
options?: PromptDialogOptions;
|
|
278
|
+
onSubmit: (value: string | null) => void;
|
|
279
|
+
}
|
|
280
|
+
interface DialogServiceOptions {
|
|
281
|
+
default?: Partial<BaseDialogOptions>;
|
|
282
|
+
}
|
|
283
|
+
declare class DialogService {
|
|
284
|
+
readonly options: DialogServiceOptions;
|
|
285
|
+
/**
|
|
286
|
+
* Show an alert dialog with a message
|
|
287
|
+
*/
|
|
288
|
+
alert(options?: AlertDialogOptions): Promise<void>;
|
|
289
|
+
/**
|
|
290
|
+
* Show a confirmation dialog that returns a promise
|
|
291
|
+
*/
|
|
292
|
+
confirm(options?: ConfirmDialogOptions): Promise<boolean>;
|
|
293
|
+
/**
|
|
294
|
+
* Show a prompt dialog to get user input
|
|
295
|
+
*/
|
|
296
|
+
prompt(options?: PromptDialogOptions): Promise<string | null>;
|
|
297
|
+
/**
|
|
298
|
+
* Open a custom dialog with provided content
|
|
299
|
+
*/
|
|
300
|
+
open(options?: BaseDialogOptions): string;
|
|
301
|
+
/**
|
|
302
|
+
* Close the currently open dialog or a specific dialog by ID
|
|
303
|
+
*/
|
|
304
|
+
close(modalId?: string): void;
|
|
305
|
+
/**
|
|
306
|
+
* Show a JSON editor/viewer dialog
|
|
307
|
+
*/
|
|
308
|
+
json(data?: any, options?: BaseDialogOptions): void;
|
|
309
|
+
/**
|
|
310
|
+
* Show a form dialog for structured input
|
|
311
|
+
*/
|
|
312
|
+
form(options?: BaseDialogOptions): Promise<any>;
|
|
313
|
+
/**
|
|
314
|
+
* Show a loading/progress dialog with optional progress percentage
|
|
315
|
+
*/
|
|
316
|
+
loading(options?: BaseDialogOptions & {
|
|
317
|
+
progress?: number;
|
|
318
|
+
}): void;
|
|
319
|
+
/**
|
|
320
|
+
* Show an image viewer/gallery dialog
|
|
321
|
+
*/
|
|
322
|
+
image(src: string | string[], options?: BaseDialogOptions): void;
|
|
323
|
+
}
|
|
324
|
+
//#endregion
|
|
325
|
+
//#region src/components/dialogs/AlertDialog.d.ts
|
|
326
|
+
declare const AlertDialog: ({
|
|
327
|
+
options,
|
|
328
|
+
onClose
|
|
329
|
+
}: AlertDialogProps) => react_jsx_runtime5.JSX.Element;
|
|
330
|
+
//#endregion
|
|
331
|
+
//#region src/components/dialogs/ConfirmDialog.d.ts
|
|
332
|
+
declare const ConfirmDialog: ({
|
|
333
|
+
options,
|
|
334
|
+
onConfirm
|
|
335
|
+
}: ConfirmDialogProps) => react_jsx_runtime5.JSX.Element;
|
|
336
|
+
//#endregion
|
|
337
|
+
//#region src/components/dialogs/PromptDialog.d.ts
|
|
338
|
+
declare const PromptDialog: ({
|
|
339
|
+
options,
|
|
340
|
+
onSubmit
|
|
341
|
+
}: PromptDialogProps) => react_jsx_runtime5.JSX.Element;
|
|
342
|
+
//#endregion
|
|
343
|
+
//#region src/components/form/ControlDate.d.ts
|
|
344
|
+
interface ControlDateProps extends GenericControlProps {
|
|
345
|
+
date?: boolean | DateInputProps;
|
|
346
|
+
datetime?: boolean | DateTimePickerProps;
|
|
347
|
+
time?: boolean | TimeInputProps;
|
|
348
|
+
}
|
|
349
|
+
/**
|
|
350
|
+
* ControlDate component for handling date, datetime, and time inputs.
|
|
351
|
+
*
|
|
352
|
+
* Features:
|
|
353
|
+
* - DateInput for date format
|
|
354
|
+
* - DateTimePicker for date-time format
|
|
355
|
+
* - TimeInput for time format
|
|
356
|
+
*
|
|
357
|
+
* Automatically detects date formats from schema and renders appropriate picker.
|
|
358
|
+
*/
|
|
359
|
+
declare const ControlDate: (props: ControlDateProps) => react_jsx_runtime5.JSX.Element | null;
|
|
360
|
+
//#endregion
|
|
361
|
+
//#region src/components/form/ControlQueryBuilder.d.ts
|
|
362
|
+
interface ControlQueryBuilderProps extends Omit<TextInputProps, "value" | "onChange"> {
|
|
363
|
+
schema?: TObject;
|
|
364
|
+
value?: string;
|
|
365
|
+
onChange?: (value: string) => void;
|
|
366
|
+
placeholder?: string;
|
|
367
|
+
}
|
|
368
|
+
/**
|
|
369
|
+
* Query builder with text input and help popover.
|
|
370
|
+
* Generates query strings for parseQueryString syntax.
|
|
371
|
+
*/
|
|
372
|
+
declare const ControlQueryBuilder: ({
|
|
373
|
+
schema,
|
|
374
|
+
value,
|
|
375
|
+
onChange,
|
|
376
|
+
placeholder,
|
|
377
|
+
...textInputProps
|
|
378
|
+
}: ControlQueryBuilderProps) => react_jsx_runtime5.JSX.Element;
|
|
379
|
+
//#endregion
|
|
380
|
+
//#region src/components/form/TypeForm.d.ts
|
|
381
|
+
interface TypeFormProps<T extends TObject> {
|
|
382
|
+
form: FormModel<T>;
|
|
383
|
+
columns?: number | {
|
|
384
|
+
base?: number;
|
|
385
|
+
xs?: number;
|
|
386
|
+
sm?: number;
|
|
387
|
+
md?: number;
|
|
388
|
+
lg?: number;
|
|
389
|
+
xl?: number;
|
|
390
|
+
};
|
|
391
|
+
schema?: TObject;
|
|
392
|
+
children?: (input: FormModel<T>["input"]) => ReactNode;
|
|
393
|
+
controlProps?: Partial<Omit<ControlProps, "input">>;
|
|
394
|
+
skipFormElement?: boolean;
|
|
395
|
+
skipSubmitButton?: boolean;
|
|
396
|
+
submitButtonProps?: Partial<Omit<ActionSubmitButtonProps, "form">>;
|
|
397
|
+
resetButtonProps?: Partial<Omit<ActionSubmitButtonProps, "form">>;
|
|
398
|
+
}
|
|
399
|
+
/**
|
|
400
|
+
* TypeForm component that automatically renders all form inputs based on schema.
|
|
401
|
+
* Uses the Control component to render individual fields and Mantine Grid for responsive layout.
|
|
402
|
+
*
|
|
403
|
+
* @example
|
|
404
|
+
* ```tsx
|
|
405
|
+
* import { t } from "alepha";
|
|
406
|
+
* import { useForm } from "@alepha/react-form";
|
|
407
|
+
* import { TypeForm } from "@alepha/ui";
|
|
408
|
+
*
|
|
409
|
+
* const form = useForm({
|
|
410
|
+
* schema: t.object({
|
|
411
|
+
* username: t.text(),
|
|
412
|
+
* email: t.text(),
|
|
413
|
+
* age: t.integer(),
|
|
414
|
+
* subscribe: t.boolean(),
|
|
415
|
+
* }),
|
|
416
|
+
* handler: (values) => {
|
|
417
|
+
* console.log(values);
|
|
418
|
+
* },
|
|
419
|
+
* });
|
|
420
|
+
*
|
|
421
|
+
* return <TypeForm form={form} columns={2} />;
|
|
422
|
+
* ```
|
|
423
|
+
*/
|
|
424
|
+
declare const TypeForm: <T extends TObject>(props: TypeFormProps<T>) => react_jsx_runtime5.JSX.Element | null;
|
|
425
|
+
//#endregion
|
|
426
|
+
//#region src/components/buttons/LanguageButton.d.ts
|
|
427
|
+
interface LanguageButtonProps {
|
|
428
|
+
languages?: string[];
|
|
429
|
+
actionProps?: ActionProps;
|
|
430
|
+
}
|
|
431
|
+
//#endregion
|
|
432
|
+
//#region src/components/layout/AppBar.d.ts
|
|
433
|
+
type AppBarItem = AppBarElement | AppBarBurger | AppBarDark | AppBarSearch | AppBarLang | AppBarSpacer | AppBarDivider;
|
|
434
|
+
interface AppBarElement {
|
|
435
|
+
position: "left" | "center" | "right";
|
|
436
|
+
element: ReactNode;
|
|
437
|
+
}
|
|
438
|
+
interface AppBarBurger {
|
|
439
|
+
position: "left" | "center" | "right";
|
|
440
|
+
type: "burger";
|
|
441
|
+
}
|
|
442
|
+
interface AppBarDark {
|
|
443
|
+
position: "left" | "center" | "right";
|
|
444
|
+
type: "dark";
|
|
445
|
+
props?: DarkModeButtonProps;
|
|
446
|
+
}
|
|
447
|
+
interface AppBarSearch {
|
|
448
|
+
position: "left" | "center" | "right";
|
|
449
|
+
type: "search";
|
|
450
|
+
props?: OmnibarButtonProps;
|
|
451
|
+
}
|
|
452
|
+
interface AppBarLang {
|
|
453
|
+
position: "left" | "center" | "right";
|
|
454
|
+
type: "lang";
|
|
455
|
+
props?: LanguageButtonProps;
|
|
456
|
+
}
|
|
457
|
+
interface AppBarSpacer {
|
|
458
|
+
position: "left" | "center" | "right";
|
|
459
|
+
type: "spacer";
|
|
460
|
+
}
|
|
461
|
+
interface AppBarDivider {
|
|
462
|
+
position: "left" | "center" | "right";
|
|
463
|
+
type: "divider";
|
|
464
|
+
}
|
|
465
|
+
interface AppBarProps {
|
|
466
|
+
flexProps?: FlexProps;
|
|
467
|
+
items?: AppBarItem[];
|
|
468
|
+
}
|
|
469
|
+
declare const AppBar: (props: AppBarProps) => react_jsx_runtime5.JSX.Element;
|
|
470
|
+
//#endregion
|
|
471
|
+
//#region src/components/layout/Sidebar.d.ts
|
|
472
|
+
interface SidebarProps {
|
|
473
|
+
menu?: SidebarNode[];
|
|
474
|
+
top?: SidebarNode[];
|
|
475
|
+
bottom?: SidebarNode[];
|
|
476
|
+
onItemClick?: (item: SidebarMenuItem) => void;
|
|
477
|
+
onSearchClick?: () => void;
|
|
478
|
+
theme?: SidebarTheme;
|
|
479
|
+
flexProps?: Partial<FlexProps>;
|
|
480
|
+
collapsed?: boolean;
|
|
481
|
+
gap?: MantineBreakpoint;
|
|
482
|
+
}
|
|
483
|
+
declare const Sidebar: (props: SidebarProps) => react_jsx_runtime5.JSX.Element;
|
|
484
|
+
interface SidebarItemProps {
|
|
485
|
+
item: SidebarMenuItem;
|
|
486
|
+
level: number;
|
|
487
|
+
onItemClick?: (item: SidebarMenuItem) => void;
|
|
488
|
+
theme: SidebarTheme;
|
|
489
|
+
}
|
|
490
|
+
interface SidebarItemProps {
|
|
491
|
+
item: SidebarMenuItem;
|
|
492
|
+
level: number;
|
|
493
|
+
onItemClick?: (item: SidebarMenuItem) => void;
|
|
494
|
+
theme: SidebarTheme;
|
|
495
|
+
}
|
|
496
|
+
type SidebarNode = SidebarMenuItem | SidebarSpacer | SidebarDivider | SidebarSearch | SidebarElement | SidebarSection;
|
|
497
|
+
interface SidebarAbstractItem {
|
|
498
|
+
position?: "top" | "bottom";
|
|
499
|
+
}
|
|
500
|
+
interface SidebarElement extends SidebarAbstractItem {
|
|
501
|
+
element: ReactNode;
|
|
502
|
+
}
|
|
503
|
+
interface SidebarSpacer extends SidebarAbstractItem {
|
|
504
|
+
type: "spacer";
|
|
505
|
+
}
|
|
506
|
+
interface SidebarDivider extends SidebarAbstractItem {
|
|
507
|
+
type: "divider";
|
|
508
|
+
}
|
|
509
|
+
interface SidebarSearch extends SidebarAbstractItem {
|
|
510
|
+
type: "search";
|
|
511
|
+
}
|
|
512
|
+
interface SidebarSection extends SidebarAbstractItem {
|
|
513
|
+
type: "section";
|
|
514
|
+
label: string;
|
|
515
|
+
icon?: ReactNode;
|
|
516
|
+
}
|
|
517
|
+
interface SidebarMenuItem extends SidebarAbstractItem {
|
|
518
|
+
label: string | ReactNode;
|
|
519
|
+
description?: string;
|
|
520
|
+
icon?: ReactNode;
|
|
521
|
+
href?: string;
|
|
522
|
+
target?: "_blank" | "_self" | "_parent" | "_top";
|
|
523
|
+
activeStartsWith?: boolean;
|
|
524
|
+
onClick?: () => void;
|
|
525
|
+
children?: SidebarMenuItem[];
|
|
526
|
+
rightSection?: ReactNode;
|
|
527
|
+
theme?: SidebarButtonTheme;
|
|
528
|
+
actionProps?: ActionProps;
|
|
529
|
+
}
|
|
530
|
+
interface SidebarButtonTheme {
|
|
531
|
+
radius?: MantineBreakpoint;
|
|
532
|
+
size?: MantineBreakpoint;
|
|
533
|
+
}
|
|
534
|
+
interface SidebarTheme {
|
|
535
|
+
button?: SidebarButtonTheme;
|
|
536
|
+
search?: SidebarButtonTheme;
|
|
537
|
+
}
|
|
538
|
+
//#endregion
|
|
539
|
+
//#region src/components/layout/AdminShell.d.ts
|
|
540
|
+
interface AdminShellProps {
|
|
541
|
+
appShellProps?: Partial<AppShellProps>;
|
|
542
|
+
appShellMainProps?: Partial<AppShellMainProps>;
|
|
543
|
+
appShellHeaderProps?: Partial<AppShellHeaderProps>;
|
|
544
|
+
appShellNavbarProps?: Partial<AppShellNavbarProps>;
|
|
545
|
+
appShellFooterProps?: Partial<AppShellFooterProps>;
|
|
546
|
+
sidebarProps?: Partial<SidebarProps>;
|
|
547
|
+
appBarProps?: Partial<AppBarProps>;
|
|
548
|
+
header?: ReactNode;
|
|
549
|
+
footer?: ReactNode;
|
|
550
|
+
children?: ReactNode;
|
|
551
|
+
}
|
|
552
|
+
declare module "@alepha/core" {
|
|
553
|
+
interface State {
|
|
554
|
+
/**
|
|
555
|
+
* Whether the sidebar is opened or closed.
|
|
556
|
+
*/
|
|
557
|
+
"alepha.ui.sidebar.opened"?: boolean;
|
|
558
|
+
/**
|
|
559
|
+
* Whether the sidebar is collapsed (narrow) or expanded (wide).
|
|
560
|
+
*/
|
|
561
|
+
"alepha.ui.sidebar.collapsed"?: boolean;
|
|
562
|
+
}
|
|
563
|
+
}
|
|
564
|
+
declare const AdminShell: (props: AdminShellProps) => react_jsx_runtime5.JSX.Element;
|
|
565
|
+
//#endregion
|
|
566
|
+
//#region src/components/layout/Omnibar.d.ts
|
|
567
|
+
interface OmnibarProps {
|
|
568
|
+
shortcut?: string | string[];
|
|
569
|
+
searchPlaceholder?: string;
|
|
570
|
+
nothingFound?: ReactNode;
|
|
571
|
+
}
|
|
572
|
+
declare const Omnibar: (props: OmnibarProps) => react_jsx_runtime5.JSX.Element;
|
|
573
|
+
//#endregion
|
|
574
|
+
//#region src/components/layout/AlephaMantineProvider.d.ts
|
|
575
|
+
interface AlephaMantineProviderProps {
|
|
576
|
+
children?: ReactNode;
|
|
577
|
+
mantine?: MantineProviderProps;
|
|
578
|
+
colorSchemeScript?: ColorSchemeScriptProps;
|
|
579
|
+
navigationProgress?: NavigationProgressProps;
|
|
580
|
+
notifications?: NotificationsProps;
|
|
581
|
+
modals?: ModalsProviderProps;
|
|
582
|
+
omnibar?: OmnibarProps;
|
|
583
|
+
}
|
|
584
|
+
declare const AlephaMantineProvider: (props: AlephaMantineProviderProps) => react_jsx_runtime5.JSX.Element;
|
|
585
|
+
//#endregion
|
|
586
|
+
//#region src/components/table/DataTable.d.ts
|
|
587
|
+
interface DataTableColumnContext<Filters extends TObject> {
|
|
588
|
+
index: number;
|
|
589
|
+
form: FormModel<Filters>;
|
|
590
|
+
alepha: Alepha;
|
|
591
|
+
}
|
|
592
|
+
interface DataTableColumn<T extends object, Filters extends TObject> {
|
|
593
|
+
label: string;
|
|
594
|
+
value: (item: T, ctx: DataTableColumnContext<Filters>) => ReactNode;
|
|
595
|
+
fit?: boolean;
|
|
596
|
+
}
|
|
597
|
+
type MaybePage<T> = Omit<Page<T>, "page"> & {
|
|
598
|
+
page?: Partial<PageMetadata>;
|
|
599
|
+
};
|
|
600
|
+
interface DataTableSubmitContext<T extends object> {
|
|
601
|
+
items: T[];
|
|
602
|
+
}
|
|
603
|
+
interface DataTableProps<T extends object, Filters extends TObject> {
|
|
604
|
+
/**
|
|
605
|
+
* The items to display in the table. Can be a static page of items or a function that returns a promise resolving to a page of items.
|
|
606
|
+
*/
|
|
607
|
+
items: MaybePage<T> | ((filters: Static<Filters> & {
|
|
608
|
+
page: number;
|
|
609
|
+
size: number;
|
|
610
|
+
sort?: string;
|
|
611
|
+
}, ctx: DataTableSubmitContext<T>) => Async<MaybePage<T>>);
|
|
612
|
+
/**
|
|
613
|
+
* The columns to display in the table. Each column is defined by a key and a DataTableColumn object.
|
|
614
|
+
*/
|
|
615
|
+
columns: {
|
|
616
|
+
[key: string]: DataTableColumn<T, Filters>;
|
|
617
|
+
};
|
|
618
|
+
defaultSize?: number;
|
|
619
|
+
typeFormProps?: Partial<Omit<TypeFormProps<Filters>, "form">>;
|
|
620
|
+
onFilterChange?: (key: string, value: unknown, form: FormModel<Filters>) => void;
|
|
621
|
+
/**
|
|
622
|
+
* Optional filters to apply to the data.
|
|
623
|
+
*/
|
|
624
|
+
filters?: TObject;
|
|
625
|
+
panel?: (item: T) => ReactNode;
|
|
626
|
+
canPanel?: (item: T) => boolean;
|
|
627
|
+
submitOnInit?: boolean;
|
|
628
|
+
submitEvery?: DurationLike;
|
|
629
|
+
withLineNumbers?: boolean;
|
|
630
|
+
withCheckbox?: boolean;
|
|
631
|
+
checkboxActions?: any[];
|
|
632
|
+
actions?: any[];
|
|
633
|
+
/**
|
|
634
|
+
* Enable infinity scroll mode. When true, pagination controls are hidden and new items are loaded automatically when scrolling to the bottom.
|
|
635
|
+
*/
|
|
636
|
+
infinityScroll?: boolean;
|
|
637
|
+
/**
|
|
638
|
+
* Props to pass to the Mantine Table component.
|
|
639
|
+
*/
|
|
640
|
+
tableProps?: TableProps;
|
|
641
|
+
/**
|
|
642
|
+
* Function to generate props for each table row based on the item.
|
|
643
|
+
*/
|
|
644
|
+
tableTrProps?: (item: T) => TableTrProps;
|
|
645
|
+
}
|
|
646
|
+
declare const DataTable: <T extends object, Filters extends TObject>(props: DataTableProps<T, Filters>) => react_jsx_runtime5.JSX.Element;
|
|
647
|
+
//#endregion
|
|
648
|
+
//#region src/constants/ui.d.ts
|
|
649
|
+
declare const ui: {
|
|
650
|
+
colors: {
|
|
651
|
+
transparent: string;
|
|
652
|
+
background: string;
|
|
653
|
+
surface: string;
|
|
654
|
+
elevated: string;
|
|
655
|
+
border: string;
|
|
656
|
+
};
|
|
657
|
+
};
|
|
658
|
+
//#endregion
|
|
659
|
+
//#region src/hooks/useDialog.d.ts
|
|
660
|
+
/**
|
|
661
|
+
* Use this hook to access the Dialog Service for showing various dialog types.
|
|
662
|
+
*
|
|
663
|
+
* @example
|
|
664
|
+
* const dialog = useDialog();
|
|
665
|
+
* await dialog.alert({ title: "Alert", message: "This is an alert message" });
|
|
666
|
+
* const confirmed = await dialog.confirm({ title: "Confirm", message: "Are you sure?" });
|
|
667
|
+
* const input = await dialog.prompt({ title: "Input", message: "Enter your name:" });
|
|
668
|
+
*/
|
|
669
|
+
declare const useDialog: () => DialogService;
|
|
670
|
+
//#endregion
|
|
671
|
+
//#region src/services/ToastService.d.ts
|
|
672
|
+
interface ToastServiceOptions {
|
|
673
|
+
default?: Partial<NotificationData>;
|
|
674
|
+
}
|
|
675
|
+
declare class ToastService {
|
|
676
|
+
protected readonly raw: {
|
|
677
|
+
readonly show: typeof _mantine_notifications0.showNotification;
|
|
678
|
+
readonly hide: typeof _mantine_notifications0.hideNotification;
|
|
679
|
+
readonly update: typeof _mantine_notifications0.updateNotification;
|
|
680
|
+
readonly clean: typeof _mantine_notifications0.cleanNotifications;
|
|
681
|
+
readonly cleanQueue: typeof _mantine_notifications0.cleanNotificationsQueue;
|
|
682
|
+
readonly updateState: typeof _mantine_notifications0.updateNotificationsState;
|
|
683
|
+
};
|
|
684
|
+
readonly options: ToastServiceOptions;
|
|
685
|
+
show(options: NotificationData): void;
|
|
686
|
+
info(options: Partial<NotificationData> | string): void;
|
|
687
|
+
success(options: Partial<NotificationData> | string): void;
|
|
688
|
+
warning(options: Partial<NotificationData> | string): void;
|
|
689
|
+
danger(options: Partial<NotificationData> | string): void;
|
|
690
|
+
}
|
|
691
|
+
//#endregion
|
|
692
|
+
//#region src/hooks/useToast.d.ts
|
|
693
|
+
/**
|
|
694
|
+
* Use this hook to access the Toast Service for showing notifications.
|
|
695
|
+
*
|
|
696
|
+
* @example
|
|
697
|
+
* const toast = useToast();
|
|
698
|
+
* toast.success({ message: "Operation completed successfully!" });
|
|
699
|
+
* toast.error({ title: "Error", message: "Something went wrong" });
|
|
700
|
+
*/
|
|
701
|
+
declare const useToast: () => ToastService;
|
|
702
|
+
//#endregion
|
|
703
|
+
//#region src/RootRouter.d.ts
|
|
704
|
+
declare class RootRouter {
|
|
705
|
+
readonly root: _alepha_react0.PageDescriptor<_alepha_react0.PageConfigSchema, any, _alepha_react0.TPropsParentDefault>;
|
|
706
|
+
}
|
|
707
|
+
//#endregion
|
|
708
|
+
//#region src/utils/extractSchemaFields.d.ts
|
|
709
|
+
interface SchemaField {
|
|
710
|
+
name: string;
|
|
711
|
+
path: string;
|
|
712
|
+
type: string;
|
|
713
|
+
enum?: readonly any[];
|
|
714
|
+
format?: string;
|
|
715
|
+
description?: string;
|
|
716
|
+
nested?: SchemaField[];
|
|
717
|
+
}
|
|
718
|
+
/**
|
|
719
|
+
* Extract field information from a TypeBox schema for query building.
|
|
720
|
+
* Supports nested objects and provides field metadata for autocomplete.
|
|
721
|
+
*/
|
|
722
|
+
declare function extractSchemaFields(schema: TObject | TProperties, prefix?: string): SchemaField[];
|
|
723
|
+
/**
|
|
724
|
+
* Get suggested operators based on field type
|
|
725
|
+
*/
|
|
726
|
+
declare function getOperatorsForField(field: SchemaField): string[];
|
|
727
|
+
/**
|
|
728
|
+
* Get operator symbol and description
|
|
729
|
+
*/
|
|
730
|
+
declare const OPERATOR_INFO: Record<string, {
|
|
731
|
+
symbol: string;
|
|
732
|
+
label: string;
|
|
733
|
+
example: string;
|
|
734
|
+
}>;
|
|
735
|
+
//#endregion
|
|
736
|
+
//#region src/utils/icons.d.ts
|
|
737
|
+
/**
|
|
738
|
+
* Icon size presets following Mantine's size conventions
|
|
739
|
+
*/
|
|
740
|
+
declare const ICON_SIZES: {
|
|
741
|
+
readonly xs: 12;
|
|
742
|
+
readonly sm: 16;
|
|
743
|
+
readonly md: 20;
|
|
744
|
+
readonly lg: 24;
|
|
745
|
+
readonly xl: 28;
|
|
746
|
+
};
|
|
747
|
+
type IconSize = keyof typeof ICON_SIZES;
|
|
748
|
+
/**
|
|
749
|
+
* Get the default icon for an input based on its type, format, or name.
|
|
750
|
+
*/
|
|
751
|
+
declare const getDefaultIcon: (params: {
|
|
752
|
+
type?: string;
|
|
753
|
+
format?: string;
|
|
754
|
+
name?: string;
|
|
755
|
+
isEnum?: boolean;
|
|
756
|
+
isArray?: boolean;
|
|
757
|
+
size?: IconSize;
|
|
758
|
+
}) => ReactNode;
|
|
759
|
+
//#endregion
|
|
760
|
+
//#region src/utils/string.d.ts
|
|
761
|
+
/**
|
|
762
|
+
* Capitalizes the first letter of a string.
|
|
763
|
+
*
|
|
764
|
+
* @example
|
|
765
|
+
* capitalize("hello") // "Hello"
|
|
766
|
+
*/
|
|
767
|
+
declare const capitalize: (str: string) => string;
|
|
768
|
+
/**
|
|
769
|
+
* Converts a path or identifier string into a pretty display name.
|
|
770
|
+
* Removes slashes and capitalizes the first letter.
|
|
771
|
+
*
|
|
772
|
+
* @example
|
|
773
|
+
* prettyName("/userName") // "UserName"
|
|
774
|
+
* prettyName("email") // "Email"
|
|
775
|
+
*/
|
|
776
|
+
declare const prettyName: (name: string) => string;
|
|
777
|
+
//#endregion
|
|
778
|
+
//#region src/index.d.ts
|
|
779
|
+
declare module "typebox" {
|
|
780
|
+
interface TSchemaOptions {
|
|
781
|
+
$control?: Omit<ControlProps, "input">;
|
|
782
|
+
}
|
|
783
|
+
}
|
|
784
|
+
declare module "@alepha/react" {
|
|
785
|
+
interface PageDescriptorOptions {
|
|
786
|
+
/**
|
|
787
|
+
* Human-readable title for the page.
|
|
788
|
+
* - for Sidebar navigation
|
|
789
|
+
* - for Omnibar navigation
|
|
790
|
+
* (soon)
|
|
791
|
+
* - for Breadcrumbs
|
|
792
|
+
* - for document title (with AlephaReactHead)
|
|
793
|
+
*/
|
|
794
|
+
label?: string;
|
|
795
|
+
/**
|
|
796
|
+
* Optional description of the page.
|
|
797
|
+
*/
|
|
798
|
+
description?: string;
|
|
799
|
+
/**
|
|
800
|
+
* Optional icon for the page.
|
|
801
|
+
*/
|
|
802
|
+
icon?: ReactNode;
|
|
803
|
+
}
|
|
804
|
+
}
|
|
805
|
+
/**
|
|
806
|
+
* Mantine
|
|
807
|
+
*
|
|
808
|
+
* @module alepha.ui
|
|
809
|
+
*/
|
|
810
|
+
declare const AlephaUI: _alepha_core0.Service<_alepha_core0.Module>;
|
|
811
|
+
//#endregion
|
|
812
|
+
export { ActionButton, type ActionClickButtonProps, type ActionCommonProps, type ActionMenuConfig, type ActionMenuItem, type ActionNavigationButtonProps, type ActionProps, type ActionSubmitButtonProps, AdminShell, AlephaMantineProvider, AlephaUI, AlertDialog, type AlertDialogOptions, type AlertDialogProps, AppBar, type AppBarBurger, type AppBarDark, type AppBarDivider, type AppBarElement, type AppBarItem, type AppBarLang, type AppBarProps, type AppBarSearch, type AppBarSpacer, type BaseDialogOptions, ConfirmDialog, type ConfirmDialogOptions, type ConfirmDialogProps, Control, ControlDate, ControlQueryBuilder, ControlSelect, DarkModeButton, DataTable, type DataTableColumn, type DataTableProps, DialogService, Flex, ICON_SIZES, IconSize, JsonViewer, OPERATOR_INFO, Omnibar, OmnibarButton, PromptDialog, type PromptDialogOptions, type PromptDialogProps, RootRouter, SchemaField, Sidebar, type SidebarAbstractItem, type SidebarButtonTheme, type SidebarDivider, type SidebarElement, type SidebarItemProps, type SidebarMenuItem, type SidebarNode, type SidebarProps, type SidebarSearch, type SidebarSection, type SidebarSpacer, type SidebarTheme, Text, ToastService, TypeForm, capitalize, extractSchemaFields, getDefaultIcon, getOperatorsForField, prettyName, ui, useDialog, useToast };
|
|
813
|
+
//# sourceMappingURL=index.d.cts.map
|