remoraid 2.2.1 → 2.2.6

package/dist/core/index.cjs

@@ -53,14 +53,13 @@ __export(exports_core, {
   WidgetWrapper: () => WidgetWrapper,
   WidgetSelectionHeader: () => WidgetSelectionHeader,
   Widget: () => Widget,
-  ResponsiveButton: () => ResponsiveButton,
   RemoraidProvider: () => RemoraidProvider,
+  RemoraidButton: () => RemoraidButton,
   PageContainer: () => PageContainer,
   Page: () => Page,
   NotFoundPage: () => NotFoundPage,
   EnvironmentShell: () => EnvironmentShell,
   CloseButton: () => CloseButton,
-  Button: () => Button,
   BadgeMinimal: () => BadgeMinimal,
   BadgeGroup: () => BadgeGroup,
   AppShell: () => AppShell,
@@ -81,15 +80,6 @@ var import_react2 = require("react");
 
 // src/core/lib/utils.ts
 var co = (condition, value, fallback) => condition(value) ? value : fallback;
-var isRemoraidButtonProps = (e) => {
-  if (typeof e !== "object") {
-    return false;
-  }
-  if (!("label" in e)) {
-    return false;
-  }
-  return true;
-};
 
 // src/core/components/RemoraidProvider/ThemeProvider/index.tsx
 var import_core = require("@mantine/core");
@@ -983,20 +973,30 @@ function AlertMinimal({
     }, undefined, true, undefined, this)
   }, undefined, false, undefined, this);
 }
-// src/core/components/ResponsiveButton/index.tsx
-var import_core12 = require("@mantine/core");
-
-// src/core/components/Button/index.tsx
+// src/core/components/RemoraidButton/index.tsx
 var import_core11 = require("@mantine/core");
 var import_icons_react6 = require("@tabler/icons-react");
 var jsx_dev_runtime15 = require("react/jsx-dev-runtime");
-function Button({
+var isRemoraidButtonProps = (e) => {
+  if (typeof e !== "object") {
+    return false;
+  }
+  if (!("label" in e)) {
+    return false;
+  }
+  return true;
+};
+function RemoraidButton({
   label,
+  responsive,
+  breakpoint,
   collapsed,
-  componentsProps,
+  size,
+  color,
   onClick,
   loading,
   variant,
+  componentsProps,
   ...props
 }) {
   const theme = useRemoraidTheme();
@@ -1006,81 +1006,45 @@ function Button({
   }, undefined, false, undefined, this) : /* @__PURE__ */ jsx_dev_runtime15.jsxDEV(import_icons_react6.IconClick, {
     ...iconProps
   }, undefined, false, undefined, this);
-  if (collapsed === true) {
-    return /* @__PURE__ */ jsx_dev_runtime15.jsxDEV(import_core11.Tooltip, {
-      label,
-      ...componentsProps?.tooltip,
-      children: /* @__PURE__ */ jsx_dev_runtime15.jsxDEV(import_core11.ActionIcon, {
-        variant: variant ?? "default",
-        onClick,
-        loading,
-        size: "input-sm",
-        "aria-label": "Refresh",
-        ...componentsProps?.actionIcon,
-        children: icon
-      }, undefined, false, undefined, this)
-    }, undefined, false, undefined, this);
-  }
-  return /* @__PURE__ */ jsx_dev_runtime15.jsxDEV(import_core11.Button, {
-    onClick,
-    loading,
-    variant: variant ?? "default",
-    leftSection: props.icon ? icon : undefined,
-    ...componentsProps?.button,
-    children: label
-  }, undefined, false, undefined, this);
-}
-
-// src/core/components/ResponsiveButton/index.tsx
-var jsx_dev_runtime16 = require("react/jsx-dev-runtime");
-function ResponsiveButton({
-  breakpoint,
-  componentsProps,
-  ...remoraidButtonProps
-}) {
-  return /* @__PURE__ */ jsx_dev_runtime16.jsxDEV(jsx_dev_runtime16.Fragment, {
+  return /* @__PURE__ */ jsx_dev_runtime15.jsxDEV(jsx_dev_runtime15.Fragment, {
     children: [
-      /* @__PURE__ */ jsx_dev_runtime16.jsxDEV(import_core12.Box, {
-        hiddenFrom: breakpoint ?? "md",
-        children: /* @__PURE__ */ jsx_dev_runtime16.jsxDEV(Button, {
-          ...remoraidButtonProps,
-          ...componentsProps?.Button,
-          componentsProps: {
-            tooltip: componentsProps?.tooltip,
-            icon: componentsProps?.icon,
-            ...componentsProps?.Button?.componentsProps,
-            actionIcon: {
-              ...componentsProps?.button,
-              ...componentsProps?.Button?.componentsProps?.actionIcon
-            }
-          },
-          collapsed: true
+      /* @__PURE__ */ jsx_dev_runtime15.jsxDEV(import_core11.Tooltip, {
+        label,
+        ...componentsProps?.tooltip,
+        children: /* @__PURE__ */ jsx_dev_runtime15.jsxDEV(import_core11.ActionIcon, {
+          "aria-label": label,
+          variant: variant ?? "default",
+          onClick,
+          loading,
+          size: size ? `input-${size}` : "input-sm",
+          color,
+          ...componentsProps?.button,
+          ...componentsProps?.ActionIcon,
+          hiddenFrom: responsive === false ? undefined : breakpoint ?? "md",
+          display: responsive === false && collapsed !== true ? "none" : componentsProps?.ActionIcon?.display ?? componentsProps?.button?.display,
+          children: icon
         }, undefined, false, undefined, this)
       }, undefined, false, undefined, this),
-      /* @__PURE__ */ jsx_dev_runtime16.jsxDEV(import_core12.Box, {
-        visibleFrom: breakpoint ?? "md",
-        children: /* @__PURE__ */ jsx_dev_runtime16.jsxDEV(Button, {
-          ...remoraidButtonProps,
-          ...componentsProps?.Button,
-          componentsProps: {
-            tooltip: componentsProps?.tooltip,
-            icon: componentsProps?.icon,
-            ...componentsProps?.Button?.componentsProps,
-            button: {
-              ...componentsProps?.button,
-              ...componentsProps?.Button?.componentsProps?.button
-            }
-          },
-          collapsed: false
-        }, undefined, false, undefined, this)
+      /* @__PURE__ */ jsx_dev_runtime15.jsxDEV(import_core11.Button, {
+        onClick,
+        loading,
+        variant: variant ?? "default",
+        size,
+        color,
+        leftSection: props.icon ? icon : undefined,
+        ...componentsProps?.button,
+        ...componentsProps?.Button,
+        visibleFrom: responsive === false ? undefined : breakpoint ?? "md",
+        display: responsive === false && collapsed ? "none" : componentsProps?.Button?.display ?? componentsProps?.button?.display,
+        children: label
       }, undefined, false, undefined, this)
     ]
   }, undefined, true, undefined, this);
 }
 // src/core/components/Widget/WidgetWrapper/index.tsx
-var import_core13 = require("@mantine/core");
+var import_core12 = require("@mantine/core");
 var import_react7 = require("react");
-var jsx_dev_runtime17 = require("react/jsx-dev-runtime");
+var jsx_dev_runtime16 = require("react/jsx-dev-runtime");
 function WidgetWrapper({
   children,
   config,
@@ -1106,12 +1070,12 @@ function WidgetWrapper({
       registerWidget(page.pageId, config);
     }
   }, [pageRegistered]);
-  return /* @__PURE__ */ jsx_dev_runtime17.jsxDEV(import_core13.Transition, {
+  return /* @__PURE__ */ jsx_dev_runtime16.jsxDEV(import_core12.Transition, {
     mounted: page !== null && isWidgetSelected(page.pageId, config.widgetId),
     transition: "fade-left",
     duration: theme.transitionDurations.medium,
     timingFunction: "ease",
-    children: (transitionStyle) => /* @__PURE__ */ jsx_dev_runtime17.jsxDEV(import_core13.Paper, {
+    children: (transitionStyle) => /* @__PURE__ */ jsx_dev_runtime16.jsxDEV(import_core12.Paper, {
       p: "md",
       shadow: "md",
       bg: theme.transparentBackground,
@@ -1127,7 +1091,7 @@ function WidgetWrapper({
         updateActiveWidget(null);
       },
       children: [
-        withCloseButton !== false && /* @__PURE__ */ jsx_dev_runtime17.jsxDEV(CloseButton, {
+        withCloseButton !== false && /* @__PURE__ */ jsx_dev_runtime16.jsxDEV(CloseButton, {
           widgetId: config.widgetId
         }, undefined, false, undefined, this),
         children
@@ -1136,8 +1100,8 @@ function WidgetWrapper({
   }, undefined, false, undefined, this);
 }
 // src/core/components/Widget/index.tsx
-var import_core14 = require("@mantine/core");
-var jsx_dev_runtime18 = require("react/jsx-dev-runtime");
+var import_core13 = require("@mantine/core");
+var jsx_dev_runtime17 = require("react/jsx-dev-runtime");
 var react2 = require("react");
 function Widget({
   children,
@@ -1155,7 +1119,7 @@ function Widget({
   const badgesGap = (typeof gaps === "object" ? gaps.badges : gaps) ?? "xs";
   const buttonsGap = (typeof gaps === "object" ? gaps.buttons : gaps) ?? "xs";
   const alertsGap = (typeof gaps === "object" ? gaps.alerts : gaps) ?? "xs";
-  return /* @__PURE__ */ jsx_dev_runtime18.jsxDEV(WidgetWrapper, {
+  return /* @__PURE__ */ jsx_dev_runtime17.jsxDEV(WidgetWrapper, {
     config: {
       widgetId: id,
       name: title,
@@ -1168,33 +1132,33 @@ function Widget({
     },
     ...componentsProps?.wrapper,
     children: [
-      /* @__PURE__ */ jsx_dev_runtime18.jsxDEV(import_core14.Group, {
+      /* @__PURE__ */ jsx_dev_runtime17.jsxDEV(import_core13.Group, {
         justify: "space-between",
         wrap: "nowrap",
         children: [
-          /* @__PURE__ */ jsx_dev_runtime18.jsxDEV(import_core14.Group, {
+          /* @__PURE__ */ jsx_dev_runtime17.jsxDEV(import_core13.Group, {
             gap: badgesGap,
             wrap: "nowrap",
             children: [
-              /* @__PURE__ */ jsx_dev_runtime18.jsxDEV(import_core14.Title, {
+              /* @__PURE__ */ jsx_dev_runtime17.jsxDEV(import_core13.Title, {
                 order: 1,
                 size: "h3",
                 lineClamp: 1,
                 children: title
               }, undefined, false, undefined, this),
-              badges !== undefined && /* @__PURE__ */ jsx_dev_runtime18.jsxDEV(BadgeGroup, {
+              badges !== undefined && /* @__PURE__ */ jsx_dev_runtime17.jsxDEV(BadgeGroup, {
                 badges,
                 gap: badgesGap,
                 ...componentsProps?.badgeGroup
               }, undefined, false, undefined, this)
             ]
           }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsx_dev_runtime18.jsxDEV(import_core14.Group, {
+          /* @__PURE__ */ jsx_dev_runtime17.jsxDEV(import_core13.Group, {
             gap: buttonsGap,
             wrap: "nowrap",
             children: buttons !== undefined && buttons.map((e, i) => {
               if (isRemoraidButtonProps(e)) {
-                return /* @__PURE__ */ react2.createElement(ResponsiveButton, {
+                return /* @__PURE__ */ react2.createElement(RemoraidButton, {
                   ...e,
                   key: i
                 });
@@ -1204,7 +1168,7 @@ function Widget({
           }, undefined, false, undefined, this)
         ]
       }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsx_dev_runtime18.jsxDEV(import_core14.Divider, {
+      /* @__PURE__ */ jsx_dev_runtime17.jsxDEV(import_core13.Divider, {
         my: "md"
       }, undefined, false, undefined, this),
       alerts !== undefined && alerts.map((a, i) => {
@@ -1217,20 +1181,20 @@ function Widget({
         }
         return a;
       }),
-      loading ? /* @__PURE__ */ jsx_dev_runtime18.jsxDEV(import_core14.Center, {
-        children: /* @__PURE__ */ jsx_dev_runtime18.jsxDEV(import_core14.Loader, {
+      loading ? /* @__PURE__ */ jsx_dev_runtime17.jsxDEV(import_core13.Center, {
+        children: /* @__PURE__ */ jsx_dev_runtime17.jsxDEV(import_core13.Loader, {
           ...componentsProps?.loader
         }, undefined, false, undefined, this)
-      }, undefined, false, undefined, this) : /* @__PURE__ */ jsx_dev_runtime18.jsxDEV(jsx_dev_runtime18.Fragment, {
+      }, undefined, false, undefined, this) : /* @__PURE__ */ jsx_dev_runtime17.jsxDEV(jsx_dev_runtime17.Fragment, {
         children
       }, undefined, false, undefined, this)
     ]
   }, undefined, true, undefined, this);
 }
 // src/core/components/Page/NotFoundPage/index.tsx
-var import_core15 = require("@mantine/core");
+var import_core14 = require("@mantine/core");
 var import_navigation3 = require("next/navigation");
-var jsx_dev_runtime19 = require("react/jsx-dev-runtime");
+var jsx_dev_runtime18 = require("react/jsx-dev-runtime");
 function NotFoundPage({
   children,
   message,
@@ -1238,11 +1202,11 @@ function NotFoundPage({
 }) {
   const pathname = import_navigation3.usePathname();
   const theme = useRemoraidTheme();
-  return /* @__PURE__ */ jsx_dev_runtime19.jsxDEV(Page, {
+  return /* @__PURE__ */ jsx_dev_runtime18.jsxDEV(Page, {
     name: "Not Found",
     ...componentsProps?.page,
     children: [
-      /* @__PURE__ */ jsx_dev_runtime19.jsxDEV(import_core15.Alert, {
+      /* @__PURE__ */ jsx_dev_runtime18.jsxDEV(import_core14.Alert, {
         ...theme.alertProps.negative,
         title: "404 - Page Not Found",
         children: message ?? `Could not find page ${pathname}.`
@@ -1252,8 +1216,8 @@ function NotFoundPage({
   }, undefined, true, undefined, this);
 }
 // src/core/components/EnvironmentShell/index.tsx
-var import_core16 = require("@mantine/core");
-var jsx_dev_runtime20 = require("react/jsx-dev-runtime");
+var import_core15 = require("@mantine/core");
+var jsx_dev_runtime19 = require("react/jsx-dev-runtime");
 function EnvironmentShell({
   children,
   environment,
@@ -1267,7 +1231,7 @@ function EnvironmentShell({
   const undefinedKeys = Object.keys(environment).filter((key) => environment[key] === undefined);
   const alertTitle = `Please Specify Environment Variable${undefinedKeys.length > 1 ? "s" : ""}`;
   const alertMessage = `Components could not be rendered because the following environment variables are not specified: ${undefinedKeys.join(", ")}.`;
-  const alert = /* @__PURE__ */ jsx_dev_runtime20.jsxDEV(import_core16.Alert, {
+  const alert = /* @__PURE__ */ jsx_dev_runtime19.jsxDEV(import_core15.Alert, {
     ...theme.alertProps.neutral,
     title: alertTitle,
     m,
@@ -1275,12 +1239,12 @@ function EnvironmentShell({
     children: message ?? alertMessage
   }, undefined, false, undefined, this);
   if (undefinedKeys.length === 0) {
-    return /* @__PURE__ */ jsx_dev_runtime20.jsxDEV(jsx_dev_runtime20.Fragment, {
+    return /* @__PURE__ */ jsx_dev_runtime19.jsxDEV(jsx_dev_runtime19.Fragment, {
       children
     }, undefined, false, undefined, this);
   }
   if (withContainer) {
-    return /* @__PURE__ */ jsx_dev_runtime20.jsxDEV(PageContainer, {
+    return /* @__PURE__ */ jsx_dev_runtime19.jsxDEV(PageContainer, {
       componentsProps: { container: componentsProps?.container },
       children: alert
     }, undefined, false, undefined, this);

package/dist/core/index.d.ts

@@ -1,5 +1,5 @@
 import { PropsWithChildren as PropsWithChildren4, ReactNode as ReactNode5 } from "react";
-import { ActionIconVariant, AlertProps, ButtonVariant, IndicatorProps, MantineBreakpoint, MantineColorScheme, MantineSize, MantineTheme, ScrollAreaProps } from "@mantine/core";
+import { AlertProps, IndicatorProps, MantineBreakpoint, MantineColorScheme, MantineSize, MantineTheme, ScrollAreaProps } from "@mantine/core";
 import { Icon, IconProps } from "@tabler/icons-react";
 import { ImageProps } from "next/image";
 import { ReactNode } from "react";
@@ -60,14 +60,6 @@ interface PageConfiguration {
 	name: string;
 	registerPageDirectly?: boolean;
 }
-type ResponsiveButtonSize = "small" | "medium";
-interface RemoraidButtonProps {
-	label: string;
-	icon?: Icon;
-	onClick?: () => void;
-	loading?: boolean;
-	variant?: Extract<ButtonVariant, ActionIconVariant>;
-}
 declare const defaultNavbarSettings: { [V in NavbarVariant] : NavbarSettings };
 declare const defaultUserExperience: UserExperience;
 interface UserExperienceContext {
@@ -182,51 +174,48 @@ interface AlertMinimalProps {
 	};
 }
 declare function AlertMinimal({ children, title, category, text, onClose, mounted, mt, mb, componentsProps }: PropsWithChildren6<AlertMinimalProps>): ReactNode11;
-import { ActionIconProps as ActionIconProps2, ButtonProps as MantineButtonProps, MantineBreakpoint as MantineBreakpoint3, TooltipProps as TooltipProps4 } from "@mantine/core";
-import { IconProps as IconProps3 } from "@tabler/icons-react";
-import { ReactNode as ReactNode13 } from "react";
+import { ActionIconProps, ActionIconVariant, ButtonProps, ButtonVariant, MantineBreakpoint as MantineBreakpoint3, MantineColor, MantineSize as MantineSize5, TooltipProps as TooltipProps3 } from "@mantine/core";
+import { Icon as Icon2, IconProps as IconProps2 } from "@tabler/icons-react";
+import { ReactNode as ReactNode12 } from "react";
 type Common<
 	A,
 	B
 > = Pick<A & B, keyof A & keyof B>;
-import { TooltipProps as TooltipProps3, ActionIconProps } from "@mantine/core";
-import { IconProps as IconProps2 } from "@tabler/icons-react";
-import { ReactNode as ReactNode12 } from "react";
-interface ButtonProps extends RemoraidButtonProps {
+interface RemoraidButtonProps {
+	label: string;
+	responsive?: boolean;
+	breakpoint?: MantineBreakpoint3;
 	collapsed?: boolean;
+	size?: MantineSize5;
+	color?: MantineColor;
+	icon?: Icon2;
+	onClick?: () => void;
+	loading?: boolean;
+	variant?: Extract<ButtonVariant, ActionIconVariant>;
 	componentsProps?: {
 		tooltip?: Partial<TooltipProps3>
 		icon?: Partial<IconProps2>
-		button?: Partial<ButtonProps>
-		actionIcon?: Partial<ActionIconProps>
-	};
-}
-declare function Button2({ label, collapsed, componentsProps, onClick, loading, variant,...props }: ButtonProps): ReactNode12;
-interface ResponsiveButtonProps extends RemoraidButtonProps {
-	breakpoint?: MantineBreakpoint3;
-	componentsProps?: {
+		button: Omit<Partial<Common<ButtonProps, ActionIconProps>>, "variant" | "onClick" | "size" | "color" | "loading">
 		Button?: Partial<ButtonProps>
-		button?: Omit<Partial<Common<MantineButtonProps, ActionIconProps2>>, "variant">
-		tooltip?: Partial<TooltipProps4>
-		icon?: Partial<IconProps3>
+		ActionIcon?: Partial<ActionIconProps>
 	};
 }
-declare function ResponsiveButton({ breakpoint, componentsProps,...remoraidButtonProps }: ResponsiveButtonProps): ReactNode13;
-import { MantineSize as MantineSize5, PaperProps, TransitionProps as TransitionProps3 } from "@mantine/core";
-import { PropsWithChildren as PropsWithChildren7, ReactNode as ReactNode14 } from "react";
+declare function RemoraidButton({ label, responsive, breakpoint, collapsed, size, color, onClick, loading, variant, componentsProps,...props }: RemoraidButtonProps): ReactNode12;
+import { MantineSize as MantineSize6, PaperProps, TransitionProps as TransitionProps3 } from "@mantine/core";
+import { PropsWithChildren as PropsWithChildren7, ReactNode as ReactNode13 } from "react";
 interface WidgetWrapperComponentsProps {
 	container?: Partial<PaperProps>;
 	transition?: Partial<Omit<TransitionProps3, "mounted">>;
 }
 interface WidgetWrapperProps {
 	config: WidgetConfiguration;
-	mt?: MantineSize5 | number;
+	mt?: MantineSize6 | number;
 	withCloseButton?: boolean;
 	componentsProps?: WidgetWrapperComponentsProps;
 }
-declare function WidgetWrapper({ children, config, mt, withCloseButton, componentsProps }: PropsWithChildren7<WidgetWrapperProps>): ReactNode14;
-import { MantineSize as MantineSize6, LoaderProps } from "@mantine/core";
-import { PropsWithChildren as PropsWithChildren8, ReactNode as ReactNode15 } from "react";
+declare function WidgetWrapper({ children, config, mt, withCloseButton, componentsProps }: PropsWithChildren7<WidgetWrapperProps>): ReactNode13;
+import { MantineSize as MantineSize7, LoaderProps } from "@mantine/core";
+import { PropsWithChildren as PropsWithChildren8, ReactNode as ReactNode14 } from "react";
 interface WidgetComponentsProps extends WidgetWrapperComponentsProps {
 	wrapper?: Partial<Omit<WidgetWrapperProps, "widgetId">>;
 	loader?: Partial<LoaderProps>;
@@ -236,40 +225,40 @@ interface WidgetProps {
 	id: string;
 	title: string;
 	config?: Partial<Omit<WidgetConfiguration, "widgetId">>;
-	badges?: (BadgeMinimalProps | ReactNode15)[];
-	buttons?: (ResponsiveButtonProps | ReactNode15)[];
-	alerts?: (AlertMinimalProps | ReactNode15)[];
-	gaps?: MantineSize6 | number | {
-		badges?: MantineSize6 | number
-		buttons?: MantineSize6 | number
-		alerts?: MantineSize6 | number
+	badges?: (BadgeMinimalProps | ReactNode14)[];
+	buttons?: (RemoraidButtonProps | ReactNode14)[];
+	alerts?: (AlertMinimalProps | ReactNode14)[];
+	gaps?: MantineSize7 | number | {
+		badges?: MantineSize7 | number
+		buttons?: MantineSize7 | number
+		alerts?: MantineSize7 | number
 	};
 	loading?: boolean;
-	mt?: MantineSize6 | number;
+	mt?: MantineSize7 | number;
 	componentsProps?: WidgetComponentsProps;
 }
-declare function Widget({ children, id, config, title, badges, buttons, alerts, gaps, loading, mt, componentsProps }: PropsWithChildren8<WidgetProps>): ReactNode15;
-import { ContainerProps, MantineSize as MantineSize7 } from "@mantine/core";
-import { PropsWithChildren as PropsWithChildren9, ReactNode as ReactNode16 } from "react";
+declare function Widget({ children, id, config, title, badges, buttons, alerts, gaps, loading, mt, componentsProps }: PropsWithChildren8<WidgetProps>): ReactNode14;
+import { ContainerProps, MantineSize as MantineSize8 } from "@mantine/core";
+import { PropsWithChildren as PropsWithChildren9, ReactNode as ReactNode15 } from "react";
 interface PageProps {
 	name?: string;
 	config?: Partial<Omit<PageConfiguration, "name">>;
-	pt?: MantineSize7 | number;
+	pt?: MantineSize8 | number;
 	componentsProps?: {
 		container?: ContainerProps
 	};
 }
-declare function Page({ children, name, config, pt, componentsProps }: PropsWithChildren9<PageProps>): ReactNode16;
-import { ContainerProps as ContainerProps2, MantineSize as MantineSize8 } from "@mantine/core";
-import { PropsWithChildren as PropsWithChildren10, ReactNode as ReactNode17 } from "react";
+declare function Page({ children, name, config, pt, componentsProps }: PropsWithChildren9<PageProps>): ReactNode15;
+import { ContainerProps as ContainerProps2, MantineSize as MantineSize9 } from "@mantine/core";
+import { PropsWithChildren as PropsWithChildren10, ReactNode as ReactNode16 } from "react";
 interface PageContainerProps {
-	pt?: MantineSize8 | number;
+	pt?: MantineSize9 | number;
 	componentsProps?: {
 		container?: ContainerProps2
 	};
 }
-declare function PageContainer({ children, pt, componentsProps }: PropsWithChildren10<PageContainerProps>): ReactNode17;
-import { PropsWithChildren as PropsWithChildren11, ReactNode as ReactNode18 } from "react";
+declare function PageContainer({ children, pt, componentsProps }: PropsWithChildren10<PageContainerProps>): ReactNode16;
+import { PropsWithChildren as PropsWithChildren11, ReactNode as ReactNode17 } from "react";
 import { PageProps as PageProps2 } from "..";
 interface NotFoundPageProps {
 	message?: string;
@@ -277,18 +266,18 @@ interface NotFoundPageProps {
 		page?: PageProps2
 	};
 }
-declare function NotFoundPage({ children, message, componentsProps }: PropsWithChildren11<NotFoundPageProps>): ReactNode18;
-import { ContainerProps as ContainerProps3, MantineSize as MantineSize9 } from "@mantine/core";
-import { PropsWithChildren as PropsWithChildren12, ReactNode as ReactNode19 } from "react";
+declare function NotFoundPage({ children, message, componentsProps }: PropsWithChildren11<NotFoundPageProps>): ReactNode17;
+import { ContainerProps as ContainerProps3, MantineSize as MantineSize10 } from "@mantine/core";
+import { PropsWithChildren as PropsWithChildren12, ReactNode as ReactNode18 } from "react";
 interface EnvironmentShellProps {
 	environment: Record<string, string | undefined>;
 	message?: string;
-	m?: MantineSize9 | number;
-	mt?: MantineSize9 | number;
+	m?: MantineSize10 | number;
+	mt?: MantineSize10 | number;
 	withContainer?: boolean;
 	componentsProps?: {
 		container?: ContainerProps3
 	};
 }
-declare function EnvironmentShell({ children, environment, message, m, mt, withContainer, componentsProps }: PropsWithChildren12<EnvironmentShellProps>): ReactNode19;
-export { userExperienceCookieName, useWidgets, useRemoraidUserExperience, useRemoraidTheme, defaultUserExperience, defaultNavbarSettings, createRemoraidTheme, WidgetsProviderProps, WidgetWrapperProps, WidgetWrapper, WidgetSelectionHeaderProps, WidgetSelectionHeader, WidgetProps, WidgetConfiguration, Widget, UserExperienceProviderProps, UserExperience, TransitionDuration, ThemeProviderProps, ResponsiveButtonSize, ResponsiveButtonProps, ResponsiveButton, RemoraidThemeCallback, RemoraidTheme, RemoraidProviderProps, RemoraidProvider, RemoraidIconSize, RemoraidButtonProps, RemoraidBreakpoint, PartialRemoraidTheme, PageProps, PageContainerProps, PageContainer, PageConfiguration, Page, NotFoundPageProps, NotFoundPage, NavbarVariant, NavbarSettings, NavbarProps, NavbarLink, EnvironmentShellProps, EnvironmentShell, CloseButtonProps, CloseButton, ButtonProps, Button2 as Button, BadgeMinimalProps, BadgeMinimal, BadgeGroupProps, BadgeGroup, AppShellProps, AppShellLogo, AppShell, AlertMinimalProps, AlertMinimal, AlertCategory };
+declare function EnvironmentShell({ children, environment, message, m, mt, withContainer, componentsProps }: PropsWithChildren12<EnvironmentShellProps>): ReactNode18;
+export { userExperienceCookieName, useWidgets, useRemoraidUserExperience, useRemoraidTheme, defaultUserExperience, defaultNavbarSettings, createRemoraidTheme, WidgetsProviderProps, WidgetWrapperProps, WidgetWrapper, WidgetSelectionHeaderProps, WidgetSelectionHeader, WidgetProps, WidgetConfiguration, Widget, UserExperienceProviderProps, UserExperience, TransitionDuration, ThemeProviderProps, RemoraidThemeCallback, RemoraidTheme, RemoraidProviderProps, RemoraidProvider, RemoraidIconSize, RemoraidButtonProps, RemoraidButton, RemoraidBreakpoint, PartialRemoraidTheme, PageProps, PageContainerProps, PageContainer, PageConfiguration, Page, NotFoundPageProps, NotFoundPage, NavbarVariant, NavbarSettings, NavbarProps, NavbarLink, EnvironmentShellProps, EnvironmentShell, CloseButtonProps, CloseButton, BadgeMinimalProps, BadgeMinimal, BadgeGroupProps, BadgeGroup, AppShellProps, AppShellLogo, AppShell, AlertMinimalProps, AlertMinimal, AlertCategory };

package/dist/core/index.js

@@ -31,15 +31,6 @@ import { useState } from "react";
 
 // src/core/lib/utils.ts
 var co = (condition, value, fallback) => condition(value) ? value : fallback;
-var isRemoraidButtonProps = (e) => {
-  if (typeof e !== "object") {
-    return false;
-  }
-  if (!("label" in e)) {
-    return false;
-  }
-  return true;
-};
 
 // src/core/components/RemoraidProvider/ThemeProvider/index.tsx
 import {
@@ -977,26 +968,34 @@ function AlertMinimal({
     }, undefined, true, undefined, this)
   }, undefined, false, undefined, this);
 }
-// src/core/components/ResponsiveButton/index.tsx
-import {
-  Box
-} from "@mantine/core";
-
-// src/core/components/Button/index.tsx
+// src/core/components/RemoraidButton/index.tsx
 import {
   ActionIcon as ActionIcon2,
-  Tooltip as Tooltip4,
-  Button as MantineButton
+  Button,
+  Tooltip as Tooltip4
 } from "@mantine/core";
 import { IconClick } from "@tabler/icons-react";
-import { jsxDEV as jsxDEV15 } from "react/jsx-dev-runtime";
-function Button({
+import { jsxDEV as jsxDEV15, Fragment as Fragment3 } from "react/jsx-dev-runtime";
+var isRemoraidButtonProps = (e) => {
+  if (typeof e !== "object") {
+    return false;
+  }
+  if (!("label" in e)) {
+    return false;
+  }
+  return true;
+};
+function RemoraidButton({
   label,
+  responsive,
+  breakpoint,
   collapsed,
-  componentsProps,
+  size,
+  color,
   onClick,
   loading,
   variant,
+  componentsProps,
   ...props
 }) {
   const theme = useRemoraidTheme();
@@ -1006,73 +1005,37 @@ function Button({
   }, undefined, false, undefined, this) : /* @__PURE__ */ jsxDEV15(IconClick, {
     ...iconProps
   }, undefined, false, undefined, this);
-  if (collapsed === true) {
-    return /* @__PURE__ */ jsxDEV15(Tooltip4, {
-      label,
-      ...componentsProps?.tooltip,
-      children: /* @__PURE__ */ jsxDEV15(ActionIcon2, {
-        variant: variant ?? "default",
-        onClick,
-        loading,
-        size: "input-sm",
-        "aria-label": "Refresh",
-        ...componentsProps?.actionIcon,
-        children: icon
-      }, undefined, false, undefined, this)
-    }, undefined, false, undefined, this);
-  }
-  return /* @__PURE__ */ jsxDEV15(MantineButton, {
-    onClick,
-    loading,
-    variant: variant ?? "default",
-    leftSection: props.icon ? icon : undefined,
-    ...componentsProps?.button,
-    children: label
-  }, undefined, false, undefined, this);
-}
-
-// src/core/components/ResponsiveButton/index.tsx
-import { jsxDEV as jsxDEV16, Fragment as Fragment3 } from "react/jsx-dev-runtime";
-function ResponsiveButton({
-  breakpoint,
-  componentsProps,
-  ...remoraidButtonProps
-}) {
-  return /* @__PURE__ */ jsxDEV16(Fragment3, {
+  return /* @__PURE__ */ jsxDEV15(Fragment3, {
     children: [
-      /* @__PURE__ */ jsxDEV16(Box, {
-        hiddenFrom: breakpoint ?? "md",
-        children: /* @__PURE__ */ jsxDEV16(Button, {
-          ...remoraidButtonProps,
-          ...componentsProps?.Button,
-          componentsProps: {
-            tooltip: componentsProps?.tooltip,
-            icon: componentsProps?.icon,
-            ...componentsProps?.Button?.componentsProps,
-            actionIcon: {
-              ...componentsProps?.button,
-              ...componentsProps?.Button?.componentsProps?.actionIcon
-            }
-          },
-          collapsed: true
+      /* @__PURE__ */ jsxDEV15(Tooltip4, {
+        label,
+        ...componentsProps?.tooltip,
+        children: /* @__PURE__ */ jsxDEV15(ActionIcon2, {
+          "aria-label": label,
+          variant: variant ?? "default",
+          onClick,
+          loading,
+          size: size ? `input-${size}` : "input-sm",
+          color,
+          ...componentsProps?.button,
+          ...componentsProps?.ActionIcon,
+          hiddenFrom: responsive === false ? undefined : breakpoint ?? "md",
+          display: responsive === false && collapsed !== true ? "none" : componentsProps?.ActionIcon?.display ?? componentsProps?.button?.display,
+          children: icon
         }, undefined, false, undefined, this)
       }, undefined, false, undefined, this),
-      /* @__PURE__ */ jsxDEV16(Box, {
-        visibleFrom: breakpoint ?? "md",
-        children: /* @__PURE__ */ jsxDEV16(Button, {
-          ...remoraidButtonProps,
-          ...componentsProps?.Button,
-          componentsProps: {
-            tooltip: componentsProps?.tooltip,
-            icon: componentsProps?.icon,
-            ...componentsProps?.Button?.componentsProps,
-            button: {
-              ...componentsProps?.button,
-              ...componentsProps?.Button?.componentsProps?.button
-            }
-          },
-          collapsed: false
-        }, undefined, false, undefined, this)
+      /* @__PURE__ */ jsxDEV15(Button, {
+        onClick,
+        loading,
+        variant: variant ?? "default",
+        size,
+        color,
+        leftSection: props.icon ? icon : undefined,
+        ...componentsProps?.button,
+        ...componentsProps?.Button,
+        visibleFrom: responsive === false ? undefined : breakpoint ?? "md",
+        display: responsive === false && collapsed ? "none" : componentsProps?.Button?.display ?? componentsProps?.button?.display,
+        children: label
       }, undefined, false, undefined, this)
     ]
   }, undefined, true, undefined, this);
@@ -1083,7 +1046,7 @@ import {
   Transition as Transition4
 } from "@mantine/core";
 import { useEffect as useEffect3 } from "react";
-import { jsxDEV as jsxDEV17 } from "react/jsx-dev-runtime";
+import { jsxDEV as jsxDEV16 } from "react/jsx-dev-runtime";
 function WidgetWrapper({
   children,
   config,
@@ -1109,12 +1072,12 @@ function WidgetWrapper({
       registerWidget(page.pageId, config);
     }
   }, [pageRegistered]);
-  return /* @__PURE__ */ jsxDEV17(Transition4, {
+  return /* @__PURE__ */ jsxDEV16(Transition4, {
     mounted: page !== null && isWidgetSelected(page.pageId, config.widgetId),
     transition: "fade-left",
     duration: theme.transitionDurations.medium,
     timingFunction: "ease",
-    children: (transitionStyle) => /* @__PURE__ */ jsxDEV17(Paper3, {
+    children: (transitionStyle) => /* @__PURE__ */ jsxDEV16(Paper3, {
       p: "md",
       shadow: "md",
       bg: theme.transparentBackground,
@@ -1130,7 +1093,7 @@ function WidgetWrapper({
         updateActiveWidget(null);
       },
       children: [
-        withCloseButton !== false && /* @__PURE__ */ jsxDEV17(CloseButton, {
+        withCloseButton !== false && /* @__PURE__ */ jsxDEV16(CloseButton, {
           widgetId: config.widgetId
         }, undefined, false, undefined, this),
         children
@@ -1146,7 +1109,7 @@ import {
   Loader,
   Title
 } from "@mantine/core";
-import { jsxDEV as jsxDEV18, Fragment as Fragment4 } from "react/jsx-dev-runtime";
+import { jsxDEV as jsxDEV17, Fragment as Fragment4 } from "react/jsx-dev-runtime";
 import { createElement as createElement2 } from "react";
 function Widget({
   children,
@@ -1164,7 +1127,7 @@ function Widget({
   const badgesGap = (typeof gaps === "object" ? gaps.badges : gaps) ?? "xs";
   const buttonsGap = (typeof gaps === "object" ? gaps.buttons : gaps) ?? "xs";
   const alertsGap = (typeof gaps === "object" ? gaps.alerts : gaps) ?? "xs";
-  return /* @__PURE__ */ jsxDEV18(WidgetWrapper, {
+  return /* @__PURE__ */ jsxDEV17(WidgetWrapper, {
     config: {
       widgetId: id,
       name: title,
@@ -1177,33 +1140,33 @@ function Widget({
     },
     ...componentsProps?.wrapper,
     children: [
-      /* @__PURE__ */ jsxDEV18(Group4, {
+      /* @__PURE__ */ jsxDEV17(Group4, {
         justify: "space-between",
         wrap: "nowrap",
         children: [
-          /* @__PURE__ */ jsxDEV18(Group4, {
+          /* @__PURE__ */ jsxDEV17(Group4, {
             gap: badgesGap,
             wrap: "nowrap",
             children: [
-              /* @__PURE__ */ jsxDEV18(Title, {
+              /* @__PURE__ */ jsxDEV17(Title, {
                 order: 1,
                 size: "h3",
                 lineClamp: 1,
                 children: title
               }, undefined, false, undefined, this),
-              badges !== undefined && /* @__PURE__ */ jsxDEV18(BadgeGroup, {
+              badges !== undefined && /* @__PURE__ */ jsxDEV17(BadgeGroup, {
                 badges,
                 gap: badgesGap,
                 ...componentsProps?.badgeGroup
               }, undefined, false, undefined, this)
             ]
           }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV18(Group4, {
+          /* @__PURE__ */ jsxDEV17(Group4, {
             gap: buttonsGap,
             wrap: "nowrap",
             children: buttons !== undefined && buttons.map((e, i) => {
               if (isRemoraidButtonProps(e)) {
-                return /* @__PURE__ */ createElement2(ResponsiveButton, {
+                return /* @__PURE__ */ createElement2(RemoraidButton, {
                   ...e,
                   key: i
                 });
@@ -1213,7 +1176,7 @@ function Widget({
           }, undefined, false, undefined, this)
         ]
       }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV18(Divider3, {
+      /* @__PURE__ */ jsxDEV17(Divider3, {
         my: "md"
       }, undefined, false, undefined, this),
       alerts !== undefined && alerts.map((a, i) => {
@@ -1226,11 +1189,11 @@ function Widget({
         }
         return a;
       }),
-      loading ? /* @__PURE__ */ jsxDEV18(Center, {
-        children: /* @__PURE__ */ jsxDEV18(Loader, {
+      loading ? /* @__PURE__ */ jsxDEV17(Center, {
+        children: /* @__PURE__ */ jsxDEV17(Loader, {
           ...componentsProps?.loader
         }, undefined, false, undefined, this)
-      }, undefined, false, undefined, this) : /* @__PURE__ */ jsxDEV18(Fragment4, {
+      }, undefined, false, undefined, this) : /* @__PURE__ */ jsxDEV17(Fragment4, {
         children
       }, undefined, false, undefined, this)
     ]
@@ -1239,7 +1202,7 @@ function Widget({
 // src/core/components/Page/NotFoundPage/index.tsx
 import { Alert as Alert2 } from "@mantine/core";
 import { usePathname as usePathname3 } from "next/navigation";
-import { jsxDEV as jsxDEV19 } from "react/jsx-dev-runtime";
+import { jsxDEV as jsxDEV18 } from "react/jsx-dev-runtime";
 function NotFoundPage({
   children,
   message,
@@ -1247,11 +1210,11 @@ function NotFoundPage({
 }) {
   const pathname = usePathname3();
   const theme = useRemoraidTheme();
-  return /* @__PURE__ */ jsxDEV19(Page, {
+  return /* @__PURE__ */ jsxDEV18(Page, {
     name: "Not Found",
     ...componentsProps?.page,
     children: [
-      /* @__PURE__ */ jsxDEV19(Alert2, {
+      /* @__PURE__ */ jsxDEV18(Alert2, {
         ...theme.alertProps.negative,
         title: "404 - Page Not Found",
         children: message ?? `Could not find page ${pathname}.`
@@ -1262,7 +1225,7 @@ function NotFoundPage({
 }
 // src/core/components/EnvironmentShell/index.tsx
 import { Alert as Alert3 } from "@mantine/core";
-import { jsxDEV as jsxDEV20, Fragment as Fragment5 } from "react/jsx-dev-runtime";
+import { jsxDEV as jsxDEV19, Fragment as Fragment5 } from "react/jsx-dev-runtime";
 function EnvironmentShell({
   children,
   environment,
@@ -1276,7 +1239,7 @@ function EnvironmentShell({
   const undefinedKeys = Object.keys(environment).filter((key) => environment[key] === undefined);
   const alertTitle = `Please Specify Environment Variable${undefinedKeys.length > 1 ? "s" : ""}`;
   const alertMessage = `Components could not be rendered because the following environment variables are not specified: ${undefinedKeys.join(", ")}.`;
-  const alert = /* @__PURE__ */ jsxDEV20(Alert3, {
+  const alert = /* @__PURE__ */ jsxDEV19(Alert3, {
     ...theme.alertProps.neutral,
     title: alertTitle,
     m,
@@ -1284,12 +1247,12 @@ function EnvironmentShell({
     children: message ?? alertMessage
   }, undefined, false, undefined, this);
   if (undefinedKeys.length === 0) {
-    return /* @__PURE__ */ jsxDEV20(Fragment5, {
+    return /* @__PURE__ */ jsxDEV19(Fragment5, {
       children
     }, undefined, false, undefined, this);
   }
   if (withContainer) {
-    return /* @__PURE__ */ jsxDEV20(PageContainer, {
+    return /* @__PURE__ */ jsxDEV19(PageContainer, {
       componentsProps: { container: componentsProps?.container },
       children: alert
     }, undefined, false, undefined, this);
@@ -1307,14 +1270,13 @@ export {
   WidgetWrapper,
   WidgetSelectionHeader,
   Widget,
-  ResponsiveButton,
   RemoraidProvider,
+  RemoraidButton,
   PageContainer,
   Page,
   NotFoundPage,
   EnvironmentShell,
   CloseButton,
-  Button,
   BadgeMinimal,
   BadgeGroup,
   AppShell,

package/dist/server/index.d.ts

@@ -1,15 +1,15 @@
-import { ContainerProps as ContainerProps3, MantineSize as MantineSize9 } from "@mantine/core";
+import { ContainerProps as ContainerProps3, MantineSize as MantineSize10 } from "@mantine/core";
 interface EnvironmentShellProps {
 	environment: Record<string, string | undefined>;
 	message?: string;
-	m?: MantineSize9 | number;
-	mt?: MantineSize9 | number;
+	m?: MantineSize10 | number;
+	mt?: MantineSize10 | number;
 	withContainer?: boolean;
 	componentsProps?: {
 		container?: ContainerProps3
 	};
 }
-import { PropsWithChildren as PropsWithChildren13, ReactNode as ReactNode20 } from "react";
+import { PropsWithChildren as PropsWithChildren13, ReactNode as ReactNode19 } from "react";
 interface ServerEnvironmentShellProps extends EnvironmentShellProps {}
-declare function EnvironmentShell2({ children, environment, message }: PropsWithChildren13<ServerEnvironmentShellProps>): ReactNode20;
+declare function EnvironmentShell2({ children, environment, message }: PropsWithChildren13<ServerEnvironmentShellProps>): ReactNode19;
 export { ServerEnvironmentShellProps, EnvironmentShell2 as EnvironmentShell };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "remoraid",
-  "version": "2.2.1",
+  "version": "2.2.6",
   "author": "Konrad Goldammer",
   "repository": {
     "type": "git",