remoraid 2.44.2 → 3.1.1

package/README.md

@@ -1,12 +1,27 @@
 # Usage
 
-`RemoraidProvider` must be rendered at the root of your application and should be used only once.
+Import Mantine and Remoraid styles once at the root of your application.
+`@mantine/dates/styles.css` is required when using `remoraid/jsonforms`.
 
 ```typescript
-import { RemoraidProvider } from "remoraid";
+import "@mantine/core/styles.css";
+import "@mantine/dates/styles.css";
+import "remoraid/core/styles.css";
+```
+
+`RemoraidProvider` must be rendered inside `MantineProvider` at the root of
+your application and should be used only once.
+
+```tsx
+import { MantineProvider } from "@mantine/core";
+import { RemoraidProvider } from "remoraid/core";
 
 function Demo() {
-  return <RemoraidProvider>{/_ Your app here _/}</RemoraidProvider>;
+  return (
+    <MantineProvider>
+      <RemoraidProvider>{/* Your app here */}</RemoraidProvider>
+    </MantineProvider>
+  );
 }
 ```
 

package/dist/core/index.cjs

@@ -6050,7 +6050,12 @@ function UserExperienceProviderWrapper({
   initialValue
 }) {
   const [cookies, setCookie] = import_react_cookie.useCookies();
-  const initialUserExperience = import_lodash3.merge(defaultUserExperience, initialValue);
+  const initialUserExperience = import_lodash3.mergeWith({}, defaultUserExperience, initialValue, (_objValue, srcValue) => {
+    if (Array.isArray(srcValue)) {
+      return [...srcValue];
+    }
+    return;
+  });
   const [userExperience, setUserExperience] = import_react5.useState(initialUserExperience);
   const [processedCookie, setProcessedCookie] = import_react5.useState(false);
   const updateUserExperience = (p) => {
@@ -6527,7 +6532,7 @@ function FooterMinimal({
     ...componentsProps?.container,
     children: /* @__PURE__ */ jsx_runtime13.jsx(import_core6.Center, {
       children: /* @__PURE__ */ jsx_runtime13.jsx(Icon2, {
-        color: "var(--mantine-color-default-border)",
+        color: "var(--mantine-color-disabled)",
         ...theme.componentsProps.icons.huge,
         ...componentsProps?.icon
       })
@@ -6594,10 +6599,10 @@ function NavigationMenu({
   const mantineTheme = import_core7.useMantineTheme();
   const router = useRemoraidRouter();
   const { pathname } = router;
-  const item = (element) => /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Transition, {
-    mounted: element.mounted ?? true,
-    ...componentsProps?.transition,
-    children: (transitionStyle) => /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Menu.Item, {
+  const item = (element, style) => {
+    const isLeaf2 = element.children === undefined || element.children.length === 0;
+    const Menu2 = isLeaf2 ? import_core7.Menu : import_core7.Menu.Sub;
+    return /* @__PURE__ */ jsx_runtime15.jsx(Menu2.Item, {
       leftSection: element.icon ? /* @__PURE__ */ jsx_runtime15.jsx(element.icon, {
         ...theme.componentsProps.icons.small
       }) : undefined,
@@ -6610,36 +6615,48 @@ function NavigationMenu({
           element.onClick(e);
         }
       },
-      style: transitionStyle,
+      style,
       children: element.label
-    })
-  });
-  const targetElement = import_react12.isValidElement(target) ? target : item(target);
-  if (elements === undefined || elements.length === 0) {
-    return targetElement;
-  }
-  return /* @__PURE__ */ jsx_runtime15.jsxs(import_core7.Menu, {
-    trigger: "click-hover",
-    ...componentsProps?.Menu,
-    children: [
-      /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Menu.Target, {
-        children: /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Box, {
-          children: targetElement
-        })
-      }),
-      /* @__PURE__ */ jsx_runtime15.jsxs(import_core7.Menu.Dropdown, {
+    });
+  };
+  const isRoot = import_react12.isValidElement(target);
+  const isLeaf = elements === undefined || elements.length === 0;
+  const Menu = isRoot ? import_core7.Menu : import_core7.Menu.Sub;
+  const menuProps = isRoot ? { trigger: "click-hover", ...componentsProps?.Menu } : { ...componentsProps?.MenuSub };
+  return /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Transition, {
+    mounted: isRoot ? true : target.mounted ?? true,
+    ...componentsProps?.transition,
+    children: (transitionStyle) => {
+      if (isLeaf) {
+        if (isRoot) {
+          return target;
+        }
+        return item(target, transitionStyle);
+      }
+      return /* @__PURE__ */ jsx_runtime15.jsxs(Menu, {
+        ...menuProps,
         children: [
-          label !== undefined && /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Menu.Label, {
-            children: label
+          /* @__PURE__ */ jsx_runtime15.jsx(Menu.Target, {
+            children: isRoot ? /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Box, {
+              ...componentsProps?.rootTargetContainer,
+              children: target
+            }) : item(target, transitionStyle)
           }),
-          elements.map((element, i) => /* @__PURE__ */ jsx_runtime15.jsx(NavigationMenu, {
-            target: item(element),
-            elements: element.children,
-            componentsProps
-          }, `navigation-menu-${i}`))
+          /* @__PURE__ */ jsx_runtime15.jsxs(Menu.Dropdown, {
+            children: [
+              label !== undefined && /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Menu.Label, {
+                children: label
+              }),
+              elements.map((element, i) => /* @__PURE__ */ jsx_runtime15.jsx(NavigationMenu, {
+                target: element,
+                elements: element.children,
+                componentsProps
+              }, `navigation-menu-${i}`))
+            ]
+          })
         ]
-      })
-    ]
+      });
+    }
   });
 }
 
@@ -7447,7 +7464,7 @@ function Page({
     }
   }, []);
   return /* @__PURE__ */ jsx_runtime25.jsx(pageContext.Provider, {
-    value: { name: name ?? pathname, pageId, ...config },
+    value: { name: name ?? pageId, pageId, ...config },
     children: /* @__PURE__ */ jsx_runtime25.jsx(PageContainer, {
       ...componentsProps?.PageContainer,
       children: /* @__PURE__ */ jsx_runtime25.jsx(import_core14.Stack, {
@@ -7554,7 +7571,8 @@ function WidgetSelectionHeader({
         children: title ?? page.name
       }),
       /* @__PURE__ */ jsx_runtime27.jsx(import_core16.Divider, {
-        orientation: "vertical"
+        orientation: "vertical",
+        ...componentsProps?.divider
       }),
       isPageRegistered(page.pageId) && /* @__PURE__ */ jsx_runtime27.jsx(ScrollableChipGroup, {
         value: selectedWidgets,
@@ -7832,6 +7850,7 @@ function AlertMinimal({
       icon: Icon4 ? /* @__PURE__ */ jsx_runtime30.jsx(Icon4, {
         ...import_lodash16.merge({}, theme.componentsProps.icons[iconSize], componentsProps?.icon)
       }) : undefined,
+      ...componentsProps?.alert,
       style: import_lodash16.merge(transitionStyle, componentsProps?.alert?.style),
       children: [
         text,

package/dist/core/index.d.ts

@@ -294,7 +294,7 @@ interface RemoraidProviderProps {
 	};
 }
 declare function RemoraidProvider({ children, theme, initialUserExperience, router, componentsProps }: PropsWithChildren7<RemoraidProviderProps>): ReactNode7;
-import { BoxProps as BoxProps2 } from "@mantine/core";
+import { BoxProps as BoxProps3 } from "@mantine/core";
 import { ComponentProps as ComponentProps7, PropsWithChildren as PropsWithChildren13, ReactNode as ReactNode22 } from "react";
 import { PropsWithChildren as PropsWithChildren8, ReactNode as ReactNode8 } from "react";
 import { SetOptional } from "type-fest";
@@ -307,7 +307,7 @@ declare function AppProvider2<V extends CustomAppVariables>({ appContext: appCon
 import { ComponentProps as ComponentProps4, ReactNode as ReactNode18 } from "react";
 import { ReactNode as ReactNode17 } from "react";
 import { MantineBreakpoint as MantineBreakpoint3, PaperProps } from "@mantine/core";
-import { MenuProps, TransitionProps as TransitionProps2 } from "@mantine/core";
+import { BoxProps, MenuProps, MenuSubProps, TransitionProps as TransitionProps2 } from "@mantine/core";
 import { ReactElement as ReactElement2 } from "react";
 interface NavigationMenuProps {
 	target: ReactElement2 | NavigationElement;
@@ -315,7 +315,9 @@ interface NavigationMenuProps {
 	label?: string;
 	componentsProps?: {
 		transition?: Partial<TransitionProps2>
+		rootTargetContainer?: Partial<BoxProps>
 		Menu?: Partial<MenuProps>
+		MenuSub?: Partial<MenuSubProps>
 	};
 }
 import { ActionIconProps, ActionIconVariant, ButtonProps, ButtonVariant, MantineBreakpoint as MantineBreakpoint2, MantineColor, MantineSize as MantineSize3, TooltipProps, TransitionProps as TransitionProps3 } from "@mantine/core";
@@ -414,7 +416,7 @@ interface PageContainerProps {
 }
 declare function PageContainer2({ children, p, hidden, componentsProps }: PropsWithChildren9<PageContainerProps>): ReactNode12;
 import { PropsWithChildren as PropsWithChildren10, ReactNode as ReactNode13 } from "react";
-import { BoxProps } from "@mantine/core";
+import { BoxProps as BoxProps2 } from "@mantine/core";
 declare const useFrameLayoutElement: () => LayoutElementContext<LayoutType.Frame> | null;
 interface FrameLayoutElementProps {
 	section: FrameLayoutSection;
@@ -423,7 +425,7 @@ interface FrameLayoutElementProps {
 	layoutId?: string;
 	hidden?: boolean;
 	componentsProps?: {
-		container?: Partial<BoxProps>
+		container?: Partial<BoxProps2>
 		PageContainer?: Partial<PageContainerProps>
 	};
 }
@@ -564,7 +566,7 @@ interface AppShellProps<V extends CustomAppVariables> {
 	initialUserExperience?: UserExperienceProviderProps<AppShellUserExperience>["initialValue"];
 	gutter?: FrameLayoutProps["gutter"];
 	componentsProps?: {
-		container?: Partial<BoxProps2>
+		container?: Partial<BoxProps3>
 		layout?: Partial<FrameLayoutProps>
 		navbar?: Partial<NavbarProps>
 		footer?: Partial<FooterProps>
@@ -596,7 +598,7 @@ declare function UserExperienceProviderWrapper<T extends UserExperience>({ child
 declare const defaultUserExperience: CoreUserExperience;
 declare const defaultUserExperienceCookieName = "remoraid-core-user-experience";
 declare const useRemoraidUserExperience: () => UserExperienceContext<CoreUserExperience>;
-import { ChipProps, FlexProps as FlexProps2, MenuProps as MenuProps2, TextProps } from "@mantine/core";
+import { ChipProps, DividerProps, FlexProps as FlexProps2, MenuProps as MenuProps2, TextProps } from "@mantine/core";
 import { ReactNode as ReactNode27 } from "react";
 import { ChipGroupProps, FlexProps, MantineSize as MantineSize7, ScrollAreaProps as ScrollAreaProps2 } from "@mantine/core";
 import { PropsWithChildren as PropsWithChildren17, ReactNode as ReactNode26, RefObject as RefObject2 } from "react";
@@ -621,6 +623,7 @@ interface WidgetSelectionHeaderProps {
 		container?: Partial<FlexProps2>
 		widgetMenu?: Partial<MenuProps2>
 		title?: Partial<TextProps>
+		divider?: Partial<DividerProps>
 		ScrollableChipGroup?: Partial<ScrollableChipGroupProps>
 		Chip?: Partial<ChipProps>
 		Pinnable?: Partial<PinnableProps>
@@ -671,7 +674,7 @@ interface WidgetWrapperProps {
 	};
 }
 declare function WidgetWrapper({ config, mt, withCloseButton, pinnableSection, componentsProps, children }: PropsWithChildren18<WidgetWrapperProps>): ReactNode30;
-import { MantineSize as MantineSize10, LoaderProps, DividerProps, StackProps as StackProps3, TitleProps, ScrollAreaAutosizeProps, TextProps as TextProps2 } from "@mantine/core";
+import { MantineSize as MantineSize10, LoaderProps, DividerProps as DividerProps2, StackProps as StackProps3, TitleProps, ScrollAreaAutosizeProps, TextProps as TextProps2 } from "@mantine/core";
 import { PropsWithChildren as PropsWithChildren19, ReactNode as ReactNode31 } from "react";
 interface WidgetProps {
 	id: string;
@@ -697,7 +700,7 @@ interface WidgetProps {
 		title?: Partial<TitleProps>
 		description?: Partial<TextProps2>
 		badgeGroup?: Partial<BadgeGroupProps>
-		divider?: Partial<DividerProps>
+		divider?: Partial<DividerProps2>
 		alertsContainer?: Partial<StackProps3>
 	};
 }
@@ -820,7 +823,7 @@ declare function ContextClusterProvider<
 	Context,
 	StaticID extends string = never
 >({ cluster, values, children }: PropsWithChildren25<ContextClusterProviderProps<Context, StaticID>>): ReactNode41;
-import { BoxProps as BoxProps3, InputWrapperProps, ScrollAreaProps as ScrollAreaProps3 } from "@mantine/core";
+import { BoxProps as BoxProps4, InputWrapperProps, ScrollAreaProps as ScrollAreaProps3 } from "@mantine/core";
 import { PropsWithChildren as PropsWithChildren26, ReactNode as ReactNode42 } from "react";
 interface InputWrapperScrollAreaProps {
 	label?: string;
@@ -831,7 +834,7 @@ interface InputWrapperScrollAreaProps {
 	componentsProps?: {
 		container?: Partial<InputWrapperProps>
 		ScrollArea?: Partial<ScrollAreaProps3>
-		childrenContainer?: Partial<BoxProps3>
+		childrenContainer?: Partial<BoxProps4>
 	};
 }
 declare function InputWrapperScrollArea({ children, label, mah, description, error, required, componentsProps }: PropsWithChildren26<InputWrapperScrollAreaProps>): ReactNode42;

package/dist/core/index.js

@@ -5953,7 +5953,12 @@ function UserExperienceProviderWrapper({
   initialValue
 }) {
   const [cookies, setCookie] = useCookies();
-  const initialUserExperience = import_lodash3.merge(defaultUserExperience, initialValue);
+  const initialUserExperience = import_lodash3.mergeWith({}, defaultUserExperience, initialValue, (_objValue, srcValue) => {
+    if (Array.isArray(srcValue)) {
+      return [...srcValue];
+    }
+    return;
+  });
   const [userExperience, setUserExperience] = useState3(initialUserExperience);
   const [processedCookie, setProcessedCookie] = useState3(false);
   const updateUserExperience = (p) => {
@@ -6446,7 +6451,7 @@ function FooterMinimal({
     ...componentsProps?.container,
     children: /* @__PURE__ */ jsx13(Center, {
       children: /* @__PURE__ */ jsx13(Icon2, {
-        color: "var(--mantine-color-default-border)",
+        color: "var(--mantine-color-disabled)",
         ...theme.componentsProps.icons.huge,
         ...componentsProps?.icon
       })
@@ -6508,7 +6513,7 @@ var import_lodash8 = __toESM(require_lodash(), 1);
 // src/core/components/AppShell/Navbar/NavbarMinimal/NavbarMinimalContent/NavigationMenu/index.tsx
 import {
   Box as Box2,
-  Menu,
+  Menu as MantineMenu,
   Transition,
   useMantineTheme as useMantineTheme2
 } from "@mantine/core";
@@ -6524,10 +6529,10 @@ function NavigationMenu({
   const mantineTheme = useMantineTheme2();
   const router = useRemoraidRouter();
   const { pathname } = router;
-  const item = (element) => /* @__PURE__ */ jsx15(Transition, {
-    mounted: element.mounted ?? true,
-    ...componentsProps?.transition,
-    children: (transitionStyle) => /* @__PURE__ */ jsx15(Menu.Item, {
+  const item = (element, style) => {
+    const isLeaf2 = element.children === undefined || element.children.length === 0;
+    const Menu2 = isLeaf2 ? MantineMenu : MantineMenu.Sub;
+    return /* @__PURE__ */ jsx15(Menu2.Item, {
       leftSection: element.icon ? /* @__PURE__ */ jsx15(element.icon, {
         ...theme.componentsProps.icons.small
       }) : undefined,
@@ -6540,36 +6545,48 @@ function NavigationMenu({
           element.onClick(e);
         }
       },
-      style: transitionStyle,
+      style,
       children: element.label
-    })
-  });
-  const targetElement = isValidElement2(target) ? target : item(target);
-  if (elements === undefined || elements.length === 0) {
-    return targetElement;
-  }
-  return /* @__PURE__ */ jsxs2(Menu, {
-    trigger: "click-hover",
-    ...componentsProps?.Menu,
-    children: [
-      /* @__PURE__ */ jsx15(Menu.Target, {
-        children: /* @__PURE__ */ jsx15(Box2, {
-          children: targetElement
-        })
-      }),
-      /* @__PURE__ */ jsxs2(Menu.Dropdown, {
+    });
+  };
+  const isRoot = isValidElement2(target);
+  const isLeaf = elements === undefined || elements.length === 0;
+  const Menu = isRoot ? MantineMenu : MantineMenu.Sub;
+  const menuProps = isRoot ? { trigger: "click-hover", ...componentsProps?.Menu } : { ...componentsProps?.MenuSub };
+  return /* @__PURE__ */ jsx15(Transition, {
+    mounted: isRoot ? true : target.mounted ?? true,
+    ...componentsProps?.transition,
+    children: (transitionStyle) => {
+      if (isLeaf) {
+        if (isRoot) {
+          return target;
+        }
+        return item(target, transitionStyle);
+      }
+      return /* @__PURE__ */ jsxs2(Menu, {
+        ...menuProps,
         children: [
-          label !== undefined && /* @__PURE__ */ jsx15(Menu.Label, {
-            children: label
+          /* @__PURE__ */ jsx15(Menu.Target, {
+            children: isRoot ? /* @__PURE__ */ jsx15(Box2, {
+              ...componentsProps?.rootTargetContainer,
+              children: target
+            }) : item(target, transitionStyle)
           }),
-          elements.map((element, i) => /* @__PURE__ */ jsx15(NavigationMenu, {
-            target: item(element),
-            elements: element.children,
-            componentsProps
-          }, `navigation-menu-${i}`))
+          /* @__PURE__ */ jsxs2(Menu.Dropdown, {
+            children: [
+              label !== undefined && /* @__PURE__ */ jsx15(MantineMenu.Label, {
+                children: label
+              }),
+              elements.map((element, i) => /* @__PURE__ */ jsx15(NavigationMenu, {
+                target: element,
+                elements: element.children,
+                componentsProps
+              }, `navigation-menu-${i}`))
+            ]
+          })
         ]
-      })
-    ]
+      });
+    }
   });
 }
 
@@ -7373,7 +7390,7 @@ import {
   Chip as Chip2,
   Divider,
   Flex as Flex2,
-  Menu as Menu2,
+  Menu,
   Text,
   useMantineTheme as useMantineTheme3
 } from "@mantine/core";
@@ -7408,7 +7425,7 @@ function Page({
     }
   }, []);
   return /* @__PURE__ */ jsx25(pageContext.Provider, {
-    value: { name: name ?? pathname, pageId, ...config },
+    value: { name: name ?? pageId, pageId, ...config },
     children: /* @__PURE__ */ jsx25(PageContainer, {
       ...componentsProps?.PageContainer,
       children: /* @__PURE__ */ jsx25(Stack3, {
@@ -7519,7 +7536,8 @@ function WidgetSelectionHeader({
         children: title ?? page.name
       }),
       /* @__PURE__ */ jsx27(Divider, {
-        orientation: "vertical"
+        orientation: "vertical",
+        ...componentsProps?.divider
       }),
       isPageRegistered(page.pageId) && /* @__PURE__ */ jsx27(ScrollableChipGroup, {
         value: selectedWidgets,
@@ -7534,11 +7552,11 @@ function WidgetSelectionHeader({
           if (!widget) {
             return;
           }
-          return /* @__PURE__ */ jsxs8(Menu2, {
+          return /* @__PURE__ */ jsxs8(Menu, {
             trigger: "hover",
             ...componentsProps?.widgetMenu,
             children: [
-              /* @__PURE__ */ jsx27(Menu2.Target, {
+              /* @__PURE__ */ jsx27(Menu.Target, {
                 children: /* @__PURE__ */ jsx27(Box6, {
                   children: /* @__PURE__ */ jsx27(Chip2, {
                     variant: selectedWidgets.includes(widgetId) ? "filled" : "outline",
@@ -7560,9 +7578,9 @@ function WidgetSelectionHeader({
                   })
                 })
               }),
-              /* @__PURE__ */ jsxs8(Menu2.Dropdown, {
+              /* @__PURE__ */ jsxs8(Menu.Dropdown, {
                 children: [
-                  /* @__PURE__ */ jsx27(Menu2.Item, {
+                  /* @__PURE__ */ jsx27(Menu.Item, {
                     leftSection: /* @__PURE__ */ jsx27(IconNavigation, {
                       ...theme.componentsProps.icons.small
                     }),
@@ -7573,7 +7591,7 @@ function WidgetSelectionHeader({
                     disabled: !widget.selected,
                     children: "Scroll to widget"
                   }),
-                  /* @__PURE__ */ jsx27(Menu2.Item, {
+                  /* @__PURE__ */ jsx27(Menu.Item, {
                     leftSection: /* @__PURE__ */ jsx27(IconFocus, {
                       ...theme.componentsProps.icons.small
                     }),
@@ -7807,6 +7825,7 @@ function AlertMinimal({
       icon: Icon4 ? /* @__PURE__ */ jsx30(Icon4, {
         ...import_lodash16.merge({}, theme.componentsProps.icons[iconSize], componentsProps?.icon)
       }) : undefined,
+      ...componentsProps?.alert,
       style: import_lodash16.merge(transitionStyle, componentsProps?.alert?.style),
       children: [
         text,

package/dist/jsonforms/index.cjs

@@ -5664,7 +5664,12 @@ function UserExperienceProviderWrapper({
   initialValue
 }) {
   const [cookies, setCookie] = import_react_cookie.useCookies();
-  const initialUserExperience = import_lodash3.merge(defaultUserExperience, initialValue);
+  const initialUserExperience = import_lodash3.mergeWith({}, defaultUserExperience, initialValue, (_objValue, srcValue) => {
+    if (Array.isArray(srcValue)) {
+      return [...srcValue];
+    }
+    return;
+  });
   const [userExperience, setUserExperience] = import_react5.useState(initialUserExperience);
   const [processedCookie, setProcessedCookie] = import_react5.useState(false);
   const updateUserExperience = (p) => {
@@ -6043,7 +6048,7 @@ function FooterMinimal({
     ...componentsProps?.container,
     children: /* @__PURE__ */ jsx_runtime13.jsx(import_core6.Center, {
       children: /* @__PURE__ */ jsx_runtime13.jsx(Icon2, {
-        color: "var(--mantine-color-default-border)",
+        color: "var(--mantine-color-disabled)",
         ...theme.componentsProps.icons.huge,
         ...componentsProps?.icon
       })
@@ -6110,10 +6115,10 @@ function NavigationMenu({
   const mantineTheme = import_core7.useMantineTheme();
   const router = useRemoraidRouter();
   const { pathname } = router;
-  const item = (element) => /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Transition, {
-    mounted: element.mounted ?? true,
-    ...componentsProps?.transition,
-    children: (transitionStyle) => /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Menu.Item, {
+  const item = (element, style) => {
+    const isLeaf2 = element.children === undefined || element.children.length === 0;
+    const Menu2 = isLeaf2 ? import_core7.Menu : import_core7.Menu.Sub;
+    return /* @__PURE__ */ jsx_runtime15.jsx(Menu2.Item, {
       leftSection: element.icon ? /* @__PURE__ */ jsx_runtime15.jsx(element.icon, {
         ...theme.componentsProps.icons.small
       }) : undefined,
@@ -6126,36 +6131,48 @@ function NavigationMenu({
           element.onClick(e);
         }
       },
-      style: transitionStyle,
+      style,
       children: element.label
-    })
-  });
-  const targetElement = import_react12.isValidElement(target) ? target : item(target);
-  if (elements === undefined || elements.length === 0) {
-    return targetElement;
-  }
-  return /* @__PURE__ */ jsx_runtime15.jsxs(import_core7.Menu, {
-    trigger: "click-hover",
-    ...componentsProps?.Menu,
-    children: [
-      /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Menu.Target, {
-        children: /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Box, {
-          children: targetElement
-        })
-      }),
-      /* @__PURE__ */ jsx_runtime15.jsxs(import_core7.Menu.Dropdown, {
+    });
+  };
+  const isRoot = import_react12.isValidElement(target);
+  const isLeaf = elements === undefined || elements.length === 0;
+  const Menu = isRoot ? import_core7.Menu : import_core7.Menu.Sub;
+  const menuProps = isRoot ? { trigger: "click-hover", ...componentsProps?.Menu } : { ...componentsProps?.MenuSub };
+  return /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Transition, {
+    mounted: isRoot ? true : target.mounted ?? true,
+    ...componentsProps?.transition,
+    children: (transitionStyle) => {
+      if (isLeaf) {
+        if (isRoot) {
+          return target;
+        }
+        return item(target, transitionStyle);
+      }
+      return /* @__PURE__ */ jsx_runtime15.jsxs(Menu, {
+        ...menuProps,
         children: [
-          label !== undefined && /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Menu.Label, {
-            children: label
+          /* @__PURE__ */ jsx_runtime15.jsx(Menu.Target, {
+            children: isRoot ? /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Box, {
+              ...componentsProps?.rootTargetContainer,
+              children: target
+            }) : item(target, transitionStyle)
           }),
-          elements.map((element, i) => /* @__PURE__ */ jsx_runtime15.jsx(NavigationMenu, {
-            target: item(element),
-            elements: element.children,
-            componentsProps
-          }, `navigation-menu-${i}`))
+          /* @__PURE__ */ jsx_runtime15.jsxs(Menu.Dropdown, {
+            children: [
+              label !== undefined && /* @__PURE__ */ jsx_runtime15.jsx(import_core7.Menu.Label, {
+                children: label
+              }),
+              elements.map((element, i) => /* @__PURE__ */ jsx_runtime15.jsx(NavigationMenu, {
+                target: element,
+                elements: element.children,
+                componentsProps
+              }, `navigation-menu-${i}`))
+            ]
+          })
         ]
-      })
-    ]
+      });
+    }
   });
 }
 
@@ -7100,6 +7117,7 @@ function AlertMinimal({
       icon: Icon4 ? /* @__PURE__ */ jsx_runtime30.jsx(Icon4, {
         ...import_lodash16.merge({}, theme.componentsProps.icons[iconSize], componentsProps?.icon)
       }) : undefined,
+      ...componentsProps?.alert,
       style: import_lodash16.merge(transitionStyle, componentsProps?.alert?.style),
       children: [
         text,
@@ -8295,6 +8313,7 @@ var TextControl_default = TextControl;
 // src/jsonforms/renderers/TimestampControl.tsx
 var import_react40 = require("@jsonforms/react");
 var import_dates = require("@mantine/dates");
+var import_dayjs = __toESM(require("dayjs"));
 var jsx_runtime52 = require("react/jsx-runtime");
 function PlainTimestampControl2({
   data,
@@ -8308,15 +8327,14 @@ function PlainTimestampControl2({
     formOptions: { withDescriptions }
   } = useFormOptions();
   return /* @__PURE__ */ jsx_runtime52.jsx(jsx_runtime52.Fragment, {
-    children: /* @__PURE__ */ jsx_runtime52.jsx(import_dates.DatePickerInput, {
+    children: /* @__PURE__ */ jsx_runtime52.jsx(import_dates.DateTimePicker, {
       variant: "default",
       label,
-      placeholder: "Pick a date",
-      value: new Date(data * 1000),
+      placeholder: "Pick date and time",
+      value: data === null || data === undefined ? data : import_dates.toDateTimeString(new Date(data * 1000)),
+      withSeconds: true,
       onChange: (newValue) => {
-        if (newValue) {
-          handleChange(path, newValue.getTime() / 1000);
-        }
+        handleChange(path, newValue === null || newValue === undefined ? newValue : import_dayjs.default(newValue).toDate().getTime() / 1000);
       },
       required,
       description: withDescriptions ? schema.description || null : null

package/dist/jsonforms/index.js

@@ -5649,7 +5649,12 @@ function UserExperienceProviderWrapper({
   initialValue
 }) {
   const [cookies, setCookie] = useCookies();
-  const initialUserExperience = import_lodash3.merge(defaultUserExperience, initialValue);
+  const initialUserExperience = import_lodash3.mergeWith({}, defaultUserExperience, initialValue, (_objValue, srcValue) => {
+    if (Array.isArray(srcValue)) {
+      return [...srcValue];
+    }
+    return;
+  });
   const [userExperience, setUserExperience] = useState3(initialUserExperience);
   const [processedCookie, setProcessedCookie] = useState3(false);
   const updateUserExperience = (p) => {
@@ -6044,7 +6049,7 @@ function FooterMinimal({
     ...componentsProps?.container,
     children: /* @__PURE__ */ jsx13(Center, {
       children: /* @__PURE__ */ jsx13(Icon2, {
-        color: "var(--mantine-color-default-border)",
+        color: "var(--mantine-color-disabled)",
         ...theme.componentsProps.icons.huge,
         ...componentsProps?.icon
       })
@@ -6106,7 +6111,7 @@ var import_lodash8 = __toESM(require_lodash(), 1);
 // src/core/components/AppShell/Navbar/NavbarMinimal/NavbarMinimalContent/NavigationMenu/index.tsx
 import {
   Box as Box2,
-  Menu,
+  Menu as MantineMenu,
   Transition,
   useMantineTheme as useMantineTheme2
 } from "@mantine/core";
@@ -6122,10 +6127,10 @@ function NavigationMenu({
   const mantineTheme = useMantineTheme2();
   const router = useRemoraidRouter();
   const { pathname } = router;
-  const item = (element) => /* @__PURE__ */ jsx15(Transition, {
-    mounted: element.mounted ?? true,
-    ...componentsProps?.transition,
-    children: (transitionStyle) => /* @__PURE__ */ jsx15(Menu.Item, {
+  const item = (element, style) => {
+    const isLeaf2 = element.children === undefined || element.children.length === 0;
+    const Menu2 = isLeaf2 ? MantineMenu : MantineMenu.Sub;
+    return /* @__PURE__ */ jsx15(Menu2.Item, {
       leftSection: element.icon ? /* @__PURE__ */ jsx15(element.icon, {
         ...theme.componentsProps.icons.small
       }) : undefined,
@@ -6138,36 +6143,48 @@ function NavigationMenu({
           element.onClick(e);
         }
       },
-      style: transitionStyle,
+      style,
       children: element.label
-    })
-  });
-  const targetElement = isValidElement2(target) ? target : item(target);
-  if (elements === undefined || elements.length === 0) {
-    return targetElement;
-  }
-  return /* @__PURE__ */ jsxs2(Menu, {
-    trigger: "click-hover",
-    ...componentsProps?.Menu,
-    children: [
-      /* @__PURE__ */ jsx15(Menu.Target, {
-        children: /* @__PURE__ */ jsx15(Box2, {
-          children: targetElement
-        })
-      }),
-      /* @__PURE__ */ jsxs2(Menu.Dropdown, {
+    });
+  };
+  const isRoot = isValidElement2(target);
+  const isLeaf = elements === undefined || elements.length === 0;
+  const Menu = isRoot ? MantineMenu : MantineMenu.Sub;
+  const menuProps = isRoot ? { trigger: "click-hover", ...componentsProps?.Menu } : { ...componentsProps?.MenuSub };
+  return /* @__PURE__ */ jsx15(Transition, {
+    mounted: isRoot ? true : target.mounted ?? true,
+    ...componentsProps?.transition,
+    children: (transitionStyle) => {
+      if (isLeaf) {
+        if (isRoot) {
+          return target;
+        }
+        return item(target, transitionStyle);
+      }
+      return /* @__PURE__ */ jsxs2(Menu, {
+        ...menuProps,
         children: [
-          label !== undefined && /* @__PURE__ */ jsx15(Menu.Label, {
-            children: label
+          /* @__PURE__ */ jsx15(Menu.Target, {
+            children: isRoot ? /* @__PURE__ */ jsx15(Box2, {
+              ...componentsProps?.rootTargetContainer,
+              children: target
+            }) : item(target, transitionStyle)
           }),
-          elements.map((element, i) => /* @__PURE__ */ jsx15(NavigationMenu, {
-            target: item(element),
-            elements: element.children,
-            componentsProps
-          }, `navigation-menu-${i}`))
+          /* @__PURE__ */ jsxs2(Menu.Dropdown, {
+            children: [
+              label !== undefined && /* @__PURE__ */ jsx15(MantineMenu.Label, {
+                children: label
+              }),
+              elements.map((element, i) => /* @__PURE__ */ jsx15(NavigationMenu, {
+                target: element,
+                elements: element.children,
+                componentsProps
+              }, `navigation-menu-${i}`))
+            ]
+          })
         ]
-      })
-    ]
+      });
+    }
   });
 }
 
@@ -6971,7 +6988,7 @@ import {
   Chip as Chip2,
   Divider,
   Flex as Flex2,
-  Menu as Menu2,
+  Menu,
   Text,
   useMantineTheme as useMantineTheme3
 } from "@mantine/core";
@@ -7157,6 +7174,7 @@ function AlertMinimal({
       icon: Icon4 ? /* @__PURE__ */ jsx30(Icon4, {
         ...import_lodash16.merge({}, theme.componentsProps.icons[iconSize], componentsProps?.icon)
       }) : undefined,
+      ...componentsProps?.alert,
       style: import_lodash16.merge(transitionStyle, componentsProps?.alert?.style),
       children: [
         text,
@@ -8454,7 +8472,8 @@ var TextControl_default = TextControl;
 
 // src/jsonforms/renderers/TimestampControl.tsx
 import { withJsonFormsControlProps as withJsonFormsControlProps9 } from "@jsonforms/react";
-import { DatePickerInput } from "@mantine/dates";
+import { DateTimePicker, toDateTimeString } from "@mantine/dates";
+import dayjs from "dayjs";
 import { jsx as jsx52, Fragment as Fragment10 } from "react/jsx-runtime";
 function PlainTimestampControl2({
   data,
@@ -8468,15 +8487,14 @@ function PlainTimestampControl2({
     formOptions: { withDescriptions }
   } = useFormOptions();
   return /* @__PURE__ */ jsx52(Fragment10, {
-    children: /* @__PURE__ */ jsx52(DatePickerInput, {
+    children: /* @__PURE__ */ jsx52(DateTimePicker, {
       variant: "default",
       label,
-      placeholder: "Pick a date",
-      value: new Date(data * 1000),
+      placeholder: "Pick date and time",
+      value: data === null || data === undefined ? data : toDateTimeString(new Date(data * 1000)),
+      withSeconds: true,
       onChange: (newValue) => {
-        if (newValue) {
-          handleChange(path, newValue.getTime() / 1000);
-        }
+        handleChange(path, newValue === null || newValue === undefined ? newValue : dayjs(newValue).toDate().getTime() / 1000);
       },
       required,
       description: withDescriptions ? schema.description || null : null

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "remoraid",
-  "version": "2.44.2",
+  "version": "3.1.1",
   "author": "Konrad Goldammer",
   "repository": {
     "type": "git",
@@ -8,32 +8,48 @@
   },
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
+  "dependencies": {
+    "clsx": "^2.1.1",
+    "lodash": "^4.17.21",
+    "type-fest": "^4.41.0"
+  },
   "devDependencies": {
-    "@types/bun": "^1.1.10",
+    "@jsonforms/core": "^3.5.1",
+    "@jsonforms/react": "^3.5.1",
+    "@jsonforms/vanilla-renderers": "^3.5.1",
+    "@mantine/core": "^9.1.1",
+    "@mantine/dates": "^9.1.1",
+    "@mantine/hooks": "^9.1.1",
+    "@mantine/modals": "^9.1.1",
+    "@tabler/icons-react": "^3.42.0",
+    "@types/bun": "^1.3.13",
     "@types/css-modules": "^1.0.5",
     "@types/lodash": "^4.17.17",
-    "@types/react": "^19.1.2",
-    "@types/react-dom": "^19.1.6",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
     "bun-dts": "^0.1.22",
-    "next": "16.0.3",
-    "react": "^19.1.0",
+    "dayjs": "^1.11.0",
+    "next": "^16.0.3",
+    "react": "^19.2.0",
     "react-cookie": "^8.0.1",
-    "react-router-dom": "^7.12.0"
+    "react-dom": "^19.2.0",
+    "react-router-dom": "^7.14.2"
   },
   "peerDependencies": {
-    "react": "^19.1.0",
-    "react-dom": "^19.1.0",
-    "react-cookie": "^8.0.1",
-    "next": "16.0.3",
-    "react-router-dom": "^7.12.0",
-    "@mantine/core": "^7.17.4",
-    "@mantine/hooks": "^7.17.4",
-    "@mantine/dates": "7.17.4",
-    "@mantine/modals": "7.17.4",
-    "@tabler/icons-react": "^3.31.0",
     "@jsonforms/core": "^3.5.1",
     "@jsonforms/react": "^3.5.1",
-    "@jsonforms/vanilla-renderers": "^3.5.1"
+    "@jsonforms/vanilla-renderers": "^3.5.1",
+    "@mantine/core": "^9.1.1",
+    "@mantine/dates": "^9.1.1",
+    "@mantine/hooks": "^9.1.1",
+    "@mantine/modals": "^9.1.1",
+    "@tabler/icons-react": "^3.42.0",
+    "dayjs": "^1.11.0",
+    "next": "^16.0.3",
+    "react": "^19.2.0",
+    "react-cookie": "^8.0.1",
+    "react-dom": "^19.2.0",
+    "react-router-dom": "^7.14.2"
   },
   "peerDependenciesMeta": {
     "next": {
@@ -93,10 +109,5 @@
     "build": "bun run build.ts",
     "prepublishOnly": "bun run build"
   },
-  "type": "module",
-  "dependencies": {
-    "clsx": "^2.1.1",
-    "lodash": "^4.17.21",
-    "type-fest": "^4.41.0"
-  }
+  "type": "module"
 }