@alepha/ui 0.18.3 → 0.19.0

package/dist/admin/{core-CYaRQ8O-.js → core-D1AbU50V.js}

@@ -1,9 +1,9 @@
-import { $atom, $context, $inject, $module, Alepha, AlephaError, TypeBoxError, t } from "alepha";
-import { AlephaReactForm, FormValidationError, useFieldValue, useForm, useFormState } from "alepha/react/form";
+import { $atom, $inject, $module, Alepha, AlephaError, TypeBoxError, t } from "alepha";
+import { AlephaReactForm, FormModel, FormValidationError, useFieldValue, useForm, useFormState } from "alepha/react/form";
 import { $head, AlephaReactHead, BrowserHeadProvider } from "alepha/react/head";
 import { AlephaReactI18n, useI18n } from "alepha/react/i18n";
 import { $cookie } from "alepha/server/cookies";
-import { ActionIcon, Anchor, AppShell, Autocomplete, Badge, Burger, Button, Card, Checkbox, ColorInput, ColorSchemeScript, ColorSwatch, Container, CopyButton, Divider, Drawer, Fieldset, FileInput, Flex, Grid, Image, Input, Kbd, Loader, MantineProvider, Menu, MultiSelect, NumberInput, Pagination, Paper, PasswordInput, Popover, ScrollArea, SegmentedControl, Select, SimpleGrid, Slider, Switch, Table, Tabs, TagsInput, Text, TextInput, Textarea, Tooltip, UnstyledButton, useMantineColorScheme, useMantineTheme } from "@mantine/core";
+import { ActionIcon, Anchor, AppShell, Autocomplete, Badge, Burger, Button, Card, Checkbox, ColorInput, ColorSchemeScript, ColorSwatch, Container, CopyButton, Divider, Drawer, Fieldset, FileInput, Flex, Grid, Image, Input, Kbd, Loader, MantineProvider, Menu, MultiSelect, NumberInput, Pagination, Paper, PasswordInput, Popover, ScrollArea, SegmentedControl, Select, SimpleGrid, Slider, Switch, Table, TagsInput, Text, TextInput, Textarea, Tooltip, UnstyledButton, useMantineColorScheme, useMantineTheme } from "@mantine/core";
 import { ModalsProvider, modals } from "@mantine/modals";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Children, Fragment as Fragment$1, createElement, forwardRef, isValidElement, useCallback, useEffect, useMemo, useRef, useState } from "react";
@@ -18,7 +18,6 @@ import { useOs } from "@mantine/hooks";
 import { DateInput, DateTimePicker, TimeInput } from "@mantine/dates";
 import { parseQueryString } from "alepha/orm";
 import { DateTimeProvider } from "alepha/datetime";
-
 //#region ../../src/core/atoms/alephaSidebarAtom.ts
 const alephaSidebarAtom = $atom({
 	name: "alepha.ui.sidebar",
@@ -35,7 +34,6 @@ const alephaSidebarAtom = $atom({
 		collapsedWidth: 72
 	}
 });
-
 //#endregion
 //#region ../../src/core/atoms/alephaThemeAtom.ts
 const alephaThemeAtom = $atom({
@@ -43,7 +41,6 @@ const alephaThemeAtom = $atom({
 	schema: t.object({ index: t.integer() }),
 	default: { index: 0 }
 });
-
 //#endregion
 //#region ../../src/core/atoms/alephaThemeOverridesAtom.ts
 const alephaThemeOverridesAtom = $atom({
@@ -57,14 +54,12 @@ const alephaThemeOverridesAtom = $atom({
 	}),
 	default: {}
 });
-
 //#endregion
 //#region ../../src/core/atoms/themes/default.ts
 const defaultTheme = {
 	name: "Default",
 	description: "Default Alepha Theme"
 };
-
 //#endregion
 //#region ../../src/core/atoms/themes/editorial.ts
 /**
@@ -219,7 +214,6 @@ const editorialTheme = {
 		})
 	}
 };
-
 //#endregion
 //#region ../../src/core/atoms/themes/midnight.ts
 const midnightTheme = {
@@ -334,7 +328,6 @@ const midnightTheme = {
 		]
 	}
 };
-
 //#endregion
 //#region ../../src/core/atoms/themes/monochrome.ts
 /**
@@ -502,7 +495,6 @@ const monochromeTheme = {
 		})
 	}
 };
-
 //#endregion
 //#region ../../src/core/atoms/themes/rosePine.ts
 /**
@@ -674,7 +666,6 @@ const rosePineTheme = {
 		Badge: Badge.extend({ defaultProps: { fw: 500 } })
 	}
 };
-
 //#endregion
 //#region ../../src/core/atoms/themes/softBrutalism.ts
 /**
@@ -861,7 +852,6 @@ const softBrutalismTheme = {
 		})
 	}
 };
-
 //#endregion
 //#region ../../src/core/atoms/themes/terminal.ts
 /**
@@ -1017,7 +1007,6 @@ const terminalTheme = {
 		})
 	}
 };
-
 //#endregion
 //#region ../../src/core/atoms/alephaThemeListAtom.ts
 const alephaThemeListAtom = $atom({
@@ -1033,7 +1022,6 @@ const alephaThemeListAtom = $atom({
 		monochromeTheme
 	]
 });
-
 //#endregion
 //#region ../../src/core/providers/ThemeProvider.ts
 var ThemeProvider = class ThemeProvider {
@@ -1131,7 +1119,6 @@ var ThemeProvider = class ThemeProvider {
 		}
 	}
 };
-
 //#endregion
 //#region ../../src/core/components/dialogs/AlertDialog.tsx
 const AlertDialog = ({ options, onClose }) => /* @__PURE__ */ jsxs(Fragment, { children: [options?.message && /* @__PURE__ */ jsx(Text, {
@@ -1144,7 +1131,6 @@ const AlertDialog = ({ options, onClose }) => /* @__PURE__ */ jsxs(Fragment, { c
 		children: options?.okLabel || "OK"
 	})
 })] });
-
 //#endregion
 //#region ../../src/core/components/dialogs/ConfirmDialog.tsx
 const ConfirmDialog = ({ options, onConfirm }) => /* @__PURE__ */ jsxs(Fragment, { children: [options?.message && /* @__PURE__ */ jsx(Text, {
@@ -1162,7 +1148,6 @@ const ConfirmDialog = ({ options, onConfirm }) => /* @__PURE__ */ jsxs(Fragment,
 		children: options?.confirmLabel || "Confirm"
 	})]
 })] });
-
 //#endregion
 //#region ../../src/core/components/dialogs/PromptDialog.tsx
 const PromptDialog = ({ options, onSubmit }) => {
@@ -1194,6 +1179,7 @@ const PromptDialog = ({ options, onSubmit }) => {
 		}),
 		/* @__PURE__ */ jsxs(Flex, {
 			justify: "flex-end",
+			gap: "xs",
 			children: [/* @__PURE__ */ jsx(Button, {
 				variant: "subtle",
 				onClick: () => onSubmit(null),
@@ -1206,7 +1192,6 @@ const PromptDialog = ({ options, onSubmit }) => {
 		})
 	] });
 };
-
 //#endregion
 //#region ../../src/core/services/DialogService.tsx
 var DialogService = class {
@@ -1268,8 +1253,8 @@ var DialogService = class {
 				content: /* @__PURE__ */ jsx(ConfirmDialog, {
 					options,
 					onConfirm: (confirmed) => {
-						this.close(modalId);
 						done(confirmed);
+						this.close(modalId);
 					}
 				})
 			});
@@ -1295,8 +1280,8 @@ var DialogService = class {
 				content: /* @__PURE__ */ jsx(PromptDialog, {
 					options,
 					onSubmit: (value) => {
-						this.close(modalId);
 						done(value);
+						this.close(modalId);
 					}
 				})
 			});
@@ -1320,7 +1305,6 @@ var DialogService = class {
 		else modals.closeAll();
 	}
 };
-
 //#endregion
 //#region ../../src/core/services/ToastService.tsx
 var ToastService = class {
@@ -1379,7 +1363,6 @@ var ToastService = class {
 		});
 	}
 };
-
 //#endregion
 //#region ../../src/core/UiRouter.ts
 /**
@@ -1394,7 +1377,6 @@ var UiRouter = class {
 		component: AlephaMantineProvider
 	});
 };
-
 //#endregion
 //#region ../../src/core/hooks/useTheme.ts
 /**
@@ -1429,7 +1411,6 @@ const useTheme = () => {
 		}
 	];
 };
-
 //#endregion
 //#region ../../src/core/hooks/useToast.ts
 /**
@@ -1445,7 +1426,6 @@ const useTheme = () => {
 const useToast = () => {
 	return useInject(ToastService);
 };
-
 //#endregion
 //#region ../../src/core/components/layout/Omnibar.tsx
 const Omnibar = (props) => {
@@ -1477,7 +1457,6 @@ const Omnibar = (props) => {
 		nothingFound
 	});
 };
-
 //#endregion
 //#region ../../src/core/components/AlephaMantineProvider.tsx
 const AlephaMantineProvider = (props) => {
@@ -1519,7 +1498,6 @@ const AlephaMantineProvider = (props) => {
 		]
 	})] });
 };
-
 //#endregion
 //#region ../../src/core/constants/ui.ts
 const ui = {
@@ -1538,14 +1516,12 @@ const ui = {
 		xl: 32
 	} }
 };
-
 //#endregion
 //#region ../../src/core/helpers/isComponentType.ts
 function isComponentType(param) {
 	if (isValidElement(param)) return false;
 	return typeof param === "function" || typeof param === "object" && param !== null && "$$typeof" in param;
 }
-
 //#endregion
 //#region ../../src/core/components/buttons/ActionButton.tsx
 const ActionButton = (_props) => {
@@ -1826,7 +1802,6 @@ const ActionMenuItem = (props) => {
 		children: item.label
 	}, index);
 };
-
 //#endregion
 //#region ../../src/core/components/buttons/BurgerButton.tsx
 const BurgerButton = (props) => {
@@ -1842,7 +1817,6 @@ const BurgerButton = (props) => {
 		...props
 	});
 };
-
 //#endregion
 //#region ../../src/core/components/buttons/ClipboardButton.tsx
 const ClipboardButton = (props) => {
@@ -1863,7 +1837,6 @@ const ClipboardButton = (props) => {
 		})
 	});
 };
-
 //#endregion
 //#region ../../src/core/components/buttons/DarkModeButton.tsx
 /**
@@ -1895,7 +1868,6 @@ const DarkModeButton = (props) => {
 		...props
 	});
 };
-
 //#endregion
 //#region ../../src/core/components/buttons/LanguageButton.tsx
 const LanguageButton = (props) => {
@@ -1911,7 +1883,6 @@ const LanguageButton = (props) => {
 		...props
 	});
 };
-
 //#endregion
 //#region ../../src/core/components/buttons/OmnibarButton.tsx
 const OmnibarButton = (props) => {
@@ -1956,7 +1927,6 @@ const OmnibarButton = (props) => {
 		})
 	});
 };
-
 //#endregion
 //#region ../../src/core/hooks/useDialog.ts
 /**
@@ -1973,7 +1943,6 @@ const OmnibarButton = (props) => {
 const useDialog = () => {
 	return useInject(DialogService);
 };
-
 //#endregion
 //#region ../../src/core/components/buttons/ThemeExpertModal.tsx
 const MANTINE_COLORS = [
@@ -2182,7 +2151,6 @@ const ThemeExpertModal = () => {
 		]
 	});
 };
-
 //#endregion
 //#region ../../src/core/components/buttons/ThemeButton.tsx
 const ThemeButton = (props) => {
@@ -2211,7 +2179,6 @@ const ThemeButton = (props) => {
 		...actionProps
 	});
 };
-
 //#endregion
 //#region ../../src/core/components/buttons/ToggleSidebarButton.tsx
 const ToggleSidebarButton = (props) => {
@@ -2233,7 +2200,6 @@ const ToggleSidebarButton = (props) => {
 		...props
 	});
 };
-
 //#endregion
 //#region ../../src/core/components/data/DetailList.tsx
 const DetailList = (props) => {
@@ -2276,7 +2242,6 @@ const DetailList = (props) => {
 		}, item.label))
 	});
 };
-
 //#endregion
 //#region ../../src/core/components/data/StatCards.tsx
 const StatCards = ({ items }) => /* @__PURE__ */ jsx(Flex, {
@@ -2312,11 +2277,10 @@ const StatCards = ({ items }) => /* @__PURE__ */ jsx(Flex, {
 		}, item.label);
 	})
 });
-
 //#endregion
 //#region ../../src/core/components/Flex.tsx
 const Flex$1 = forwardRef((props, ref) => {
-	const { fill, center, centerX, centerY, col, ground, surface, elevated, rounded, bordered, borderedTop, borderedBottom, shadowed, overflow, ...rest } = props;
+	const { fill, center, centerX, centerY, col, ground, surface, elevated, rounded, bordered, borderedTop, borderedBottom, shadowed, overflow, form, ...rest } = props;
 	if (fill) rest.flex ??= 1;
 	if (col) rest.direction ??= "column";
 	if (center) {
@@ -2340,13 +2304,22 @@ const Flex$1 = forwardRef((props, ref) => {
 	};
 	if (shadowed) rest.className = `${rest.className ?? ""} shadow-${shadowed === true ? "md" : shadowed}`.trim();
 	if (overflow) rest.className = `${rest.className ?? ""} overflow-auto`.trim();
+	if (form) {
+		let formProps = typeof form === "object" ? form : {};
+		if (formProps instanceof FormModel) formProps = formProps.props;
+		return /* @__PURE__ */ jsx(Flex, {
+			ref,
+			component: "form",
+			...formProps,
+			...rest
+		});
+	}
 	return /* @__PURE__ */ jsx(Flex, {
 		ref,
 		...rest
 	});
 });
 Flex$1.displayName = "Flex";
-
 //#endregion
 //#region ../../src/core/components/layout/AppBar.tsx
 const AppBar = (props) => {
@@ -2461,7 +2434,6 @@ const AppBar = (props) => {
 	});
 	return content;
 };
-
 //#endregion
 //#region ../../src/core/components/layout/Breadcrumb.tsx
 /**
@@ -2471,7 +2443,7 @@ const AppBar = (props) => {
 * Pages should define a `label` in their `$page()` options for best results.
 * Falls back to the page name converted to Title Case.
 */
-const Breadcrumb = (props) => {
+const Breadcrumbs = (props) => {
 	const { home = "Home", separator, size = "sm", ...groupProps } = props;
 	const state = useRouterState();
 	const router = useRouter();
@@ -2516,7 +2488,6 @@ const Breadcrumb = (props) => {
 		}, crumb.href))
 	});
 };
-
 //#endregion
 //#region ../../src/core/components/layout/Container.tsx
 const Container$1 = forwardRef((props, ref) => {
@@ -2526,7 +2497,6 @@ const Container$1 = forwardRef((props, ref) => {
 	});
 });
 Container$1.displayName = "Container";
-
 //#endregion
 //#region ../../src/core/helpers/renderIcon.tsx
 const renderIcon = (icon, size) => {
@@ -2535,7 +2505,6 @@ const renderIcon = (icon, size) => {
 	if (isComponentType(icon)) return /* @__PURE__ */ jsx(icon, { size: size ?? ui.sizes.icon.md });
 	return icon;
 };
-
 //#endregion
 //#region ../../src/core/components/Text.tsx
 const INTENT_COLORS = {
@@ -2564,7 +2533,6 @@ const Text$1 = forwardRef((props, ref) => {
 	});
 });
 Text$1.displayName = "Text";
-
 //#endregion
 //#region ../../src/core/components/layout/SidebarCollapsedItem.tsx
 const SidebarCollapsedItem = (props) => {
@@ -2614,7 +2582,6 @@ const SidebarCollapsedItem = (props) => {
 		})
 	});
 };
-
 //#endregion
 //#region ../../src/core/components/layout/SidebarItem.tsx
 const SidebarItem = (props) => {
@@ -2691,7 +2658,6 @@ const SidebarItem = (props) => {
 		})]
 	});
 };
-
 //#endregion
 //#region ../../src/core/components/layout/Sidebar.tsx
 const Sidebar = (props) => {
@@ -2815,7 +2781,6 @@ const Sidebar = (props) => {
 	})] });
 	return renderSidebar(false);
 };
-
 //#endregion
 //#region ../../src/core/components/layout/DashboardShell.tsx
 const DashboardShell = (props) => {
@@ -2915,7 +2880,6 @@ const DashboardShell = (props) => {
 		]
 	});
 };
-
 //#endregion
 //#region ../../src/core/form/utils/parseInput.ts
 const parseInput = (props, form) => {
@@ -2956,7 +2920,6 @@ const parseInput = (props, form) => {
 		inputProps
 	};
 };
-
 //#endregion
 //#region ../../src/core/form/components/ControlArray.tsx
 /**
@@ -3246,7 +3209,6 @@ const ControlArray = (props) => {
 		})
 	});
 };
-
 //#endregion
 //#region ../../src/core/form/components/ControlDate.tsx
 /**
@@ -3299,7 +3261,6 @@ const ControlDate = (props) => {
 	}
 	return null;
 };
-
 //#endregion
 //#region ../../src/core/form/components/ControlNumber.tsx
 /**
@@ -3344,7 +3305,6 @@ const ControlNumber = (props) => {
 		}
 	});
 };
-
 //#endregion
 //#region ../../src/core/form/components/ControlObject.tsx
 /**
@@ -3421,7 +3381,6 @@ const ControlObject = (props) => {
 		})
 	});
 };
-
 //#endregion
 //#region ../../src/core/form/components/ControlQueryBuilderHelp.tsx
 const ControlQueryBuilderHelp = (props) => {
@@ -3589,7 +3548,6 @@ const ControlQueryBuilderHelp = (props) => {
 		]
 	});
 };
-
 //#endregion
 //#region ../../src/core/form/components/ControlQueryBuilder.tsx
 /**
@@ -3677,7 +3635,6 @@ const ControlQueryBuilder = (props) => {
 		})]
 	});
 };
-
 //#endregion
 //#region ../../src/core/form/components/ControlSelect.tsx
 /**
@@ -3896,7 +3853,6 @@ const useAsyncLoader = (loader, threshold, debounceMs, defaultValue) => {
 		])
 	};
 };
-
 //#endregion
 //#region ../../src/core/form/components/Control.tsx
 /**
@@ -4113,7 +4069,6 @@ const Control = (_props) => {
 		...textInputProps
 	});
 };
-
 //#endregion
 //#region ../../src/core/form/components/TypeForm.tsx
 /**
@@ -4245,11 +4200,6 @@ const TypeForm = (props) => {
 		children: content
 	});
 };
-
-//#endregion
-//#region ../../src/core/table/interfaces/types.ts
-const DEFAULT_MAX_VISIBLE_COLUMNS = 8;
-
 //#endregion
 //#region ../../src/core/table/components/DataTableFilters.tsx
 const DataTableFilters = (props) => {
@@ -4287,7 +4237,6 @@ const DataTableFilters = (props) => {
 		})
 	});
 };
-
 //#endregion
 //#region ../../src/core/table/components/DataTablePagination.tsx
 const DataTablePagination = ({ page, size, totalPages, totalElements, isFirst, isLast, offset, numberOfElements, onPageChange, onSizeChange }) => {
@@ -4350,7 +4299,6 @@ const DataTablePagination = ({ page, size, totalPages, totalElements, isFirst, i
 		})]
 	});
 };
-
 //#endregion
 //#region ../../src/core/table/components/ColumnPicker.tsx
 const ColumnPicker = ({ columns, visibility, onVisibilityChange }) => {
@@ -4366,7 +4314,7 @@ const ColumnPicker = ({ columns, visibility, onVisibilityChange }) => {
 		let count = 0;
 		onVisibilityChange(columnEntries.reduce((acc, [key, col]) => {
 			if (col.defaultHidden) acc[key] = false;
-			else if (count < DEFAULT_MAX_VISIBLE_COLUMNS) {
+			else if (count < 8) {
 				acc[key] = true;
 				count++;
 			} else acc[key] = false;
@@ -4451,7 +4399,6 @@ const ColumnPicker = ({ columns, visibility, onVisibilityChange }) => {
 		})]
 	});
 };
-
 //#endregion
 //#region ../../src/core/table/components/FilterPicker.tsx
 const getFieldLabel = (schema, key) => {
@@ -4552,7 +4499,6 @@ const FilterPicker = ({ schema, visibility, onVisibilityChange }) => {
 		})]
 	});
 };
-
 //#endregion
 //#region ../../src/core/table/components/DataTableToolbar.tsx
 const escapeCsvField = (value) => {
@@ -4679,7 +4625,6 @@ const DataTableToolbar = ({ columns, filters, columnVisibility, filterVisibility
 		]
 	});
 };
-
 //#endregion
 //#region ../../src/core/table/components/useTableSelection.ts
 const useTableSelection = (items, getItemKey, enabled) => {
@@ -4742,7 +4687,6 @@ const useTableSelection = (items, getItemKey, enabled) => {
 		isSelected: useCallback((item) => selectedKeys.has(getItemKey(item)), [selectedKeys, getItemKey])
 	};
 };
-
 //#endregion
 //#region ../../src/core/table/components/DataTable.tsx
 /**
@@ -4795,7 +4739,7 @@ const DataTable = (props) => {
 		let visibleCount = 0;
 		return entries.reduce((acc, [key, col]) => {
 			if (col.defaultHidden) acc[key] = false;
-			else if (visibleCount < DEFAULT_MAX_VISIBLE_COLUMNS) {
+			else if (visibleCount < 8) {
 				acc[key] = true;
 				visibleCount++;
 			} else acc[key] = false;
@@ -5148,8 +5092,7 @@ const DataTable = (props) => {
 							style: {
 								position: "sticky",
 								top: 0,
-								zIndex: 1,
-								backgroundColor: "var(--alepha-elevated)"
+								zIndex: 1
 							},
 							children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
 								panelConfig && /* @__PURE__ */ jsx(Table.Th, { style: { width: 36 } }),
@@ -5211,7 +5154,6 @@ const DataTable = (props) => {
 		})]
 	});
 };
-
 //#endregion
 //#region ../../src/core/utils/extractSchemaFields.ts
 /**
@@ -5300,7 +5242,6 @@ const OPERATOR_INFO = {
 		example: "status=[active,pending]"
 	}
 };
-
 //#endregion
 //#region ../../src/core/utils/icons.tsx
 /**
@@ -5342,7 +5283,6 @@ const getDefaultIcon = (params) => {
 	}
 	return /* @__PURE__ */ jsx(IconAt, { size: iconSize });
 };
-
 //#endregion
 //#region ../../src/core/utils/string.ts
 /**
@@ -5380,7 +5320,6 @@ const prettyName = (name) => {
 	const segments = name.split("/").filter((s) => s && !/^\d+$/.test(s));
 	return toTitleCase(segments[segments.length - 1] || name.replaceAll("/", ""));
 };
-
 //#endregion
 //#region ../../src/core/index.ts
 /**
@@ -5419,7 +5358,7 @@ const AlephaUI = $module({
 		alepha.with(ToastService);
 	}
 });
-
 //#endregion
-export { ActionButton as _, Control as a, useToast as b, Breadcrumb as c, DetailList as d, ToggleSidebarButton as f, ClipboardButton as g, LanguageButton as h, TypeForm as i, Flex$1 as l, useDialog as m, capitalize as n, DashboardShell as o, ThemeButton as p, DataTable as r, Text$1 as s, AlephaUI as t, StatCards as u, ui as v, alephaSidebarAtom as x, AlephaMantineProvider as y };
-//# sourceMappingURL=core-CYaRQ8O-.js.map
+export { ActionButton as _, Control as a, useToast as b, Breadcrumbs as c, DetailList as d, ToggleSidebarButton as f, ClipboardButton as g, LanguageButton as h, TypeForm as i, Flex$1 as l, useDialog as m, capitalize as n, DashboardShell as o, ThemeButton as p, DataTable as r, Text$1 as s, AlephaUI as t, StatCards as u, ui as v, alephaSidebarAtom as x, AlephaMantineProvider as y };
+
+//# sourceMappingURL=core-D1AbU50V.js.map