From 3dba4b6f172dccebb5ad28c17d49d0fea3b5cdd7 Mon Sep 17 00:00:00 2001
From: Alican Erdurmaz <alicanerdurmaz@gmail.com>
Date: Mon, 25 Nov 2024 10:06:22 +0300
Subject: [PATCH] fix: disabled not work on all navigation buttons

---
 .../src/components/buttons/clone/index.tsx    |  9 ++--
 .../src/components/buttons/create/index.tsx   | 11 +++--
 .../src/components/buttons/delete/index.tsx   | 11 ++---
 .../src/components/buttons/edit/index.tsx     |  9 ++--
 .../src/components/buttons/list/index.tsx     | 11 +++--
 .../src/components/buttons/show/index.tsx     |  9 ++--
 .../src/components/buttons/clone/index.tsx    |  9 ++--
 .../src/components/buttons/create/index.tsx   | 13 +++---
 .../src/components/buttons/delete/index.tsx   | 11 +++--
 .../src/components/buttons/edit/index.tsx     | 12 ++---
 .../src/components/buttons/list/index.tsx     | 11 +++--
 .../src/components/buttons/show/index.tsx     | 12 ++---
 .../src/components/buttons/clone/index.tsx    | 11 +++--
 .../src/components/buttons/create/index.tsx   | 11 +++--
 .../src/components/buttons/delete/index.tsx   | 13 +++---
 .../src/components/buttons/edit/index.tsx     | 11 +++--
 .../src/components/buttons/list/index.tsx     |  8 ++--
 .../src/components/buttons/show/index.tsx     | 11 +++--
 .../mantine/src/components/buttons/types.ts   | 44 +++++++------------
 .../src/components/buttons/clone/index.tsx    |  9 ++--
 .../src/components/buttons/create/index.tsx   | 12 ++---
 .../src/components/buttons/delete/index.tsx   |  4 +-
 .../mui/src/components/buttons/edit/index.tsx |  9 ++--
 .../mui/src/components/buttons/list/index.tsx |  9 ++--
 .../mui/src/components/buttons/show/index.tsx |  9 ++--
 packages/mui/tsup.config.ts                   |  2 +-
 packages/ui-tests/src/tests/buttons/clone.tsx | 24 ++++++++++
 .../ui-tests/src/tests/buttons/create.tsx     | 24 ++++++++++
 .../ui-tests/src/tests/buttons/delete.tsx     | 24 ++++++++++
 packages/ui-tests/src/tests/buttons/edit.tsx  | 24 ++++++++++
 packages/ui-tests/src/tests/buttons/list.tsx  | 31 +++++++++++++
 packages/ui-tests/src/tests/buttons/show.tsx  | 24 ++++++++++
 32 files changed, 321 insertions(+), 121 deletions(-)

diff --git a/packages/antd/src/components/buttons/clone/index.tsx b/packages/antd/src/components/buttons/clone/index.tsx
index fbb9aeb30780a..e0f10bcb16883 100644
--- a/packages/antd/src/components/buttons/clone/index.tsx
+++ b/packages/antd/src/components/buttons/clone/index.tsx
@@ -34,14 +34,17 @@ export const CloneButton: React.FC<CloneButtonProps> = ({
     meta,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <LinkComponent
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -53,7 +56,7 @@ export const CloneButton: React.FC<CloneButtonProps> = ({
     >
       <Button
         icon={<PlusSquareOutlined />}
-        disabled={disabled}
+        disabled={isDisabled}
         title={title}
         data-testid={RefineButtonTestIds.CloneButton}
         className={RefineButtonClassNames.CloneButton}
diff --git a/packages/antd/src/components/buttons/create/index.tsx b/packages/antd/src/components/buttons/create/index.tsx
index 3b7ecf03a48ae..268cf27f9a914 100644
--- a/packages/antd/src/components/buttons/create/index.tsx
+++ b/packages/antd/src/components/buttons/create/index.tsx
@@ -29,19 +29,22 @@ export const CreateButton: React.FC<CreateButtonProps> = ({
   const { hidden, disabled, label, title, LinkComponent, to } = useCreateButton(
     {
       resource: resourceNameFromProps ?? propResourceNameOrRouteName,
-      accessControl,
       meta,
+      accessControl,
     },
   );
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <LinkComponent
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -53,7 +56,7 @@ export const CreateButton: React.FC<CreateButtonProps> = ({
     >
       <Button
         icon={<PlusSquareOutlined />}
-        disabled={disabled}
+        disabled={isDisabled}
         title={title}
         data-testid={RefineButtonTestIds.CreateButton}
         className={RefineButtonClassNames.CreateButton}
diff --git a/packages/antd/src/components/buttons/delete/index.tsx b/packages/antd/src/components/buttons/delete/index.tsx
index 522c143622ef5..00446945919e7 100644
--- a/packages/antd/src/components/buttons/delete/index.tsx
+++ b/packages/antd/src/components/buttons/delete/index.tsx
@@ -58,7 +58,10 @@ export const DeleteButton: React.FC<DeleteButtonProps> = ({
     accessControl,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <Popconfirm
@@ -69,16 +72,14 @@ export const DeleteButton: React.FC<DeleteButtonProps> = ({
       title={confirmTitle ?? defaultConfirmTitle}
       okButtonProps={{ disabled: loading }}
       onConfirm={onConfirm}
-      disabled={
-        typeof rest?.disabled !== "undefined" ? rest.disabled : disabled
-      }
+      disabled={isDisabled}
     >
       <Button
         danger
         loading={loading}
         icon={<DeleteOutlined />}
         title={title}
-        disabled={disabled}
+        disabled={isDisabled}
         data-testid={RefineButtonTestIds.DeleteButton}
         className={RefineButtonClassNames.DeleteButton}
         {...rest}
diff --git a/packages/antd/src/components/buttons/edit/index.tsx b/packages/antd/src/components/buttons/edit/index.tsx
index 6ab3a93adae7c..ff7cb7d49bd43 100644
--- a/packages/antd/src/components/buttons/edit/index.tsx
+++ b/packages/antd/src/components/buttons/edit/index.tsx
@@ -34,14 +34,17 @@ export const EditButton: React.FC<EditButtonProps> = ({
     accessControl,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <LinkComponent
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -53,7 +56,7 @@ export const EditButton: React.FC<EditButtonProps> = ({
     >
       <Button
         icon={<EditOutlined />}
-        disabled={disabled}
+        disabled={isDisabled}
         title={title}
         data-testid={RefineButtonTestIds.EditButton}
         className={RefineButtonClassNames.EditButton}
diff --git a/packages/antd/src/components/buttons/list/index.tsx b/packages/antd/src/components/buttons/list/index.tsx
index fc64e5f1b0fa2..0dd228a7a137f 100644
--- a/packages/antd/src/components/buttons/list/index.tsx
+++ b/packages/antd/src/components/buttons/list/index.tsx
@@ -28,18 +28,21 @@ export const ListButton: React.FC<ListButtonProps> = ({
 }) => {
   const { to, label, title, hidden, disabled, LinkComponent } = useListButton({
     resource: resourceNameFromProps ?? propResourceNameOrRouteName,
-    accessControl,
     meta,
+    accessControl,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <LinkComponent
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -51,7 +54,7 @@ export const ListButton: React.FC<ListButtonProps> = ({
     >
       <Button
         icon={<BarsOutlined />}
-        disabled={disabled}
+        disabled={isDisabled}
         title={title}
         data-testid={RefineButtonTestIds.ListButton}
         className={RefineButtonClassNames.ListButton}
diff --git a/packages/antd/src/components/buttons/show/index.tsx b/packages/antd/src/components/buttons/show/index.tsx
index bfffbe00f877b..64e9bf36dfe81 100644
--- a/packages/antd/src/components/buttons/show/index.tsx
+++ b/packages/antd/src/components/buttons/show/index.tsx
@@ -34,14 +34,17 @@ export const ShowButton: React.FC<ShowButtonProps> = ({
     meta,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <LinkComponent
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -52,8 +55,8 @@ export const ShowButton: React.FC<ShowButtonProps> = ({
       }}
     >
       <Button
+        disabled={isDisabled}
         icon={<EyeOutlined />}
-        disabled={disabled}
         title={title}
         data-testid={RefineButtonTestIds.ShowButton}
         className={RefineButtonClassNames.ShowButton}
diff --git a/packages/chakra-ui/src/components/buttons/clone/index.tsx b/packages/chakra-ui/src/components/buttons/clone/index.tsx
index 0b927c274dfc5..384c722e6fe2c 100644
--- a/packages/chakra-ui/src/components/buttons/clone/index.tsx
+++ b/packages/chakra-ui/src/components/buttons/clone/index.tsx
@@ -36,14 +36,17 @@ export const CloneButton: React.FC<CloneButtonProps> = ({
     meta,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <LinkComponent
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -56,7 +59,7 @@ export const CloneButton: React.FC<CloneButtonProps> = ({
       {hideText ? (
         <IconButton
           variant="outline"
-          isDisabled={disabled}
+          isDisabled={isDisabled}
           aria-label={label}
           title={title}
           data-testid={RefineButtonTestIds.CloneButton}
diff --git a/packages/chakra-ui/src/components/buttons/create/index.tsx b/packages/chakra-ui/src/components/buttons/create/index.tsx
index b11a77c2ac901..be4e3afa34432 100644
--- a/packages/chakra-ui/src/components/buttons/create/index.tsx
+++ b/packages/chakra-ui/src/components/buttons/create/index.tsx
@@ -23,19 +23,22 @@ export const CreateButton: React.FC<CreateButtonProps> = ({
   const { to, label, title, hidden, disabled, LinkComponent } = useCreateButton(
     {
       resource: resourceNameFromProps ?? resourceNameOrRouteName,
-      accessControl,
       meta,
+      accessControl,
     },
   );
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <LinkComponent
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -49,9 +52,9 @@ export const CreateButton: React.FC<CreateButtonProps> = ({
         <IconButton
           colorScheme="brand"
           variant="outline"
+          isDisabled={isDisabled}
           aria-label={label}
           title={title}
-          isDisabled={disabled}
           data-testid={RefineButtonTestIds.CreateButton}
           className={RefineButtonClassNames.CreateButton}
           {...rest}
@@ -61,7 +64,7 @@ export const CreateButton: React.FC<CreateButtonProps> = ({
       ) : (
         <Button
           colorScheme="brand"
-          isDisabled={disabled}
+          isDisabled={isDisabled}
           leftIcon={<IconSquarePlus size={20} />}
           title={title}
           data-testid={RefineButtonTestIds.CreateButton}
diff --git a/packages/chakra-ui/src/components/buttons/delete/index.tsx b/packages/chakra-ui/src/components/buttons/delete/index.tsx
index af67f95264dc2..f1a3596075bbf 100644
--- a/packages/chakra-ui/src/components/buttons/delete/index.tsx
+++ b/packages/chakra-ui/src/components/buttons/delete/index.tsx
@@ -72,7 +72,10 @@ export const DeleteButton: React.FC<DeleteButtonProps> = ({
 
   const [opened, setOpened] = useState(false);
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <Popover isOpen={opened} isLazy>
@@ -83,7 +86,7 @@ export const DeleteButton: React.FC<DeleteButtonProps> = ({
             variant="outline"
             aria-label={title}
             onClick={() => setOpened((o) => !o)}
-            isDisabled={loading || disabled}
+            isDisabled={loading || isDisabled}
             isLoading={loading}
             data-testid={RefineButtonTestIds.DeleteButton}
             className={RefineButtonClassNames.DeleteButton}
@@ -96,9 +99,9 @@ export const DeleteButton: React.FC<DeleteButtonProps> = ({
             colorScheme="red"
             variant="outline"
             onClick={() => setOpened((o) => !o)}
-            isDisabled={loading || disabled}
+            isDisabled={loading || isDisabled}
             isLoading={loading}
-            leftIcon={<IconTrash size={20} {...svgIconProps} />}
+            leftIcon={<IconTrash size={20} />}
             title={title}
             data-testid={RefineButtonTestIds.DeleteButton}
             className={RefineButtonClassNames.DeleteButton}
diff --git a/packages/chakra-ui/src/components/buttons/edit/index.tsx b/packages/chakra-ui/src/components/buttons/edit/index.tsx
index 69c563e028988..6baa1bff22a05 100644
--- a/packages/chakra-ui/src/components/buttons/edit/index.tsx
+++ b/packages/chakra-ui/src/components/buttons/edit/index.tsx
@@ -32,17 +32,19 @@ export const EditButton: React.FC<EditButtonProps> = ({
     resource: resourceNameFromProps ?? resourceNameOrRouteName,
     id: recordItemId,
     accessControl,
-    meta,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <LinkComponent
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -57,7 +59,7 @@ export const EditButton: React.FC<EditButtonProps> = ({
           variant="outline"
           aria-label={label}
           title={title}
-          isDisabled={disabled}
+          isDisabled={isDisabled}
           data-testid={RefineButtonTestIds.EditButton}
           className={RefineButtonClassNames.EditButton}
           {...rest}
@@ -67,7 +69,7 @@ export const EditButton: React.FC<EditButtonProps> = ({
       ) : (
         <Button
           variant="outline"
-          isDisabled={disabled}
+          isDisabled={isDisabled}
           leftIcon={<IconPencil size={20} {...svgIconProps} />}
           title={title}
           data-testid={RefineButtonTestIds.EditButton}
diff --git a/packages/chakra-ui/src/components/buttons/list/index.tsx b/packages/chakra-ui/src/components/buttons/list/index.tsx
index 81c98ddc0040a..4083c44008305 100644
--- a/packages/chakra-ui/src/components/buttons/list/index.tsx
+++ b/packages/chakra-ui/src/components/buttons/list/index.tsx
@@ -33,14 +33,17 @@ export const ListButton: React.FC<ListButtonProps> = ({
     meta,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <LinkComponent
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -54,7 +57,7 @@ export const ListButton: React.FC<ListButtonProps> = ({
         <IconButton
           variant="outline"
           aria-label={label}
-          isDisabled={disabled}
+          isDisabled={isDisabled}
           title={title}
           data-testid={RefineButtonTestIds.ListButton}
           className={RefineButtonClassNames.ListButton}
@@ -65,7 +68,7 @@ export const ListButton: React.FC<ListButtonProps> = ({
       ) : (
         <Button
           variant="outline"
-          isDisabled={disabled}
+          isDisabled={isDisabled}
           leftIcon={<IconList size={20} {...svgIconProps} />}
           title={title}
           data-testid={RefineButtonTestIds.ListButton}
diff --git a/packages/chakra-ui/src/components/buttons/show/index.tsx b/packages/chakra-ui/src/components/buttons/show/index.tsx
index c2e67be4b515c..a0e461e96fdbe 100644
--- a/packages/chakra-ui/src/components/buttons/show/index.tsx
+++ b/packages/chakra-ui/src/components/buttons/show/index.tsx
@@ -32,17 +32,19 @@ export const ShowButton: React.FC<ShowButtonProps> = ({
     resource: resourceNameFromProps ?? resourceNameOrRouteName,
     id: recordItemId,
     accessControl,
-    meta,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <LinkComponent
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -56,7 +58,7 @@ export const ShowButton: React.FC<ShowButtonProps> = ({
         <IconButton
           variant="outline"
           aria-label={label}
-          isDisabled={disabled}
+          isDisabled={isDisabled}
           title={title}
           data-testid={RefineButtonTestIds.ShowButton}
           className={RefineButtonClassNames.ShowButton}
@@ -67,7 +69,7 @@ export const ShowButton: React.FC<ShowButtonProps> = ({
       ) : (
         <Button
           variant="outline"
-          isDisabled={disabled}
+          isDisabled={isDisabled}
           leftIcon={<IconEye size={20} {...svgIconProps} />}
           title={title}
           data-testid={RefineButtonTestIds.ShowButton}
diff --git a/packages/mantine/src/components/buttons/clone/index.tsx b/packages/mantine/src/components/buttons/clone/index.tsx
index f2a6121a62a90..d990711f824b1 100644
--- a/packages/mantine/src/components/buttons/clone/index.tsx
+++ b/packages/mantine/src/components/buttons/clone/index.tsx
@@ -37,7 +37,10 @@ export const CloneButton: React.FC<CloneButtonProps> = ({
     meta,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   const { variant, styles, ...commonProps } = rest;
 
@@ -47,7 +50,7 @@ export const CloneButton: React.FC<CloneButtonProps> = ({
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -59,7 +62,7 @@ export const CloneButton: React.FC<CloneButtonProps> = ({
     >
       {hideText ? (
         <ActionIcon
-          disabled={disabled}
+          disabled={isDisabled}
           title={title}
           aria-label={label}
           {...(variant
@@ -75,7 +78,7 @@ export const CloneButton: React.FC<CloneButtonProps> = ({
         </ActionIcon>
       ) : (
         <Button
-          disabled={disabled}
+          disabled={isDisabled}
           variant="default"
           leftIcon={<IconSquarePlus size={18} {...svgIconProps} />}
           title={title}
diff --git a/packages/mantine/src/components/buttons/create/index.tsx b/packages/mantine/src/components/buttons/create/index.tsx
index 687355fc7b72e..3a9d4510bc6c6 100644
--- a/packages/mantine/src/components/buttons/create/index.tsx
+++ b/packages/mantine/src/components/buttons/create/index.tsx
@@ -29,7 +29,10 @@ export const CreateButton: React.FC<CreateButtonProps> = ({
     },
   );
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   const { variant, styles, ...commonProps } = rest;
 
@@ -39,7 +42,7 @@ export const CreateButton: React.FC<CreateButtonProps> = ({
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -52,7 +55,7 @@ export const CreateButton: React.FC<CreateButtonProps> = ({
       {hideText ? (
         <ActionIcon
           title={title}
-          disabled={disabled}
+          disabled={isDisabled}
           aria-label={label}
           color="primary"
           {...(variant
@@ -68,7 +71,7 @@ export const CreateButton: React.FC<CreateButtonProps> = ({
         </ActionIcon>
       ) : (
         <Button
-          disabled={disabled}
+          disabled={isDisabled}
           leftIcon={<IconSquarePlus size={18} {...svgIconProps} />}
           title={title}
           data-testid={RefineButtonTestIds.CreateButton}
diff --git a/packages/mantine/src/components/buttons/delete/index.tsx b/packages/mantine/src/components/buttons/delete/index.tsx
index 31a8868ad973a..048ac1d4cb7c9 100644
--- a/packages/mantine/src/components/buttons/delete/index.tsx
+++ b/packages/mantine/src/components/buttons/delete/index.tsx
@@ -64,7 +64,10 @@ export const DeleteButton: React.FC<DeleteButtonProps> = ({
 
   const { variant, styles, ...commonProps } = rest;
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <Popover
@@ -72,16 +75,14 @@ export const DeleteButton: React.FC<DeleteButtonProps> = ({
       onChange={setOpened}
       withArrow
       withinPortal
-      disabled={
-        typeof rest?.disabled !== "undefined" ? rest.disabled : disabled
-      }
+      disabled={isDisabled}
     >
       <Popover.Target>
         {hideText ? (
           <ActionIcon
             color="red"
             onClick={() => setOpened((o) => !o)}
-            disabled={loading || disabled}
+            disabled={loading || isDisabled}
             loading={loading}
             data-testid={RefineButtonTestIds.DeleteButton}
             className={RefineButtonClassNames.DeleteButton}
@@ -99,7 +100,7 @@ export const DeleteButton: React.FC<DeleteButtonProps> = ({
             color="red"
             variant="outline"
             onClick={() => setOpened((o) => !o)}
-            disabled={loading || disabled}
+            disabled={loading || isDisabled}
             loading={loading}
             title={title}
             leftIcon={<IconTrash size={18} {...svgIconProps} />}
diff --git a/packages/mantine/src/components/buttons/edit/index.tsx b/packages/mantine/src/components/buttons/edit/index.tsx
index 5aaeb1811f0c9..487f7b519cac3 100644
--- a/packages/mantine/src/components/buttons/edit/index.tsx
+++ b/packages/mantine/src/components/buttons/edit/index.tsx
@@ -36,7 +36,10 @@ export const EditButton: React.FC<EditButtonProps> = ({
     meta,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   const { variant, styles, ...commonProps } = rest;
 
@@ -46,7 +49,7 @@ export const EditButton: React.FC<EditButtonProps> = ({
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -59,7 +62,7 @@ export const EditButton: React.FC<EditButtonProps> = ({
       {hideText ? (
         <ActionIcon
           title={title}
-          disabled={disabled}
+          disabled={isDisabled}
           aria-label={label}
           data-testid={RefineButtonTestIds.EditButton}
           className={RefineButtonClassNames.EditButton}
@@ -75,7 +78,7 @@ export const EditButton: React.FC<EditButtonProps> = ({
       ) : (
         <Button
           variant="default"
-          disabled={disabled}
+          disabled={isDisabled}
           leftIcon={<IconPencil size={18} {...svgIconProps} />}
           title={title}
           data-testid={RefineButtonTestIds.EditButton}
diff --git a/packages/mantine/src/components/buttons/list/index.tsx b/packages/mantine/src/components/buttons/list/index.tsx
index ad31d58e7c2ab..ccf15e694ce79 100644
--- a/packages/mantine/src/components/buttons/list/index.tsx
+++ b/packages/mantine/src/components/buttons/list/index.tsx
@@ -33,10 +33,12 @@ export const ListButton: React.FC<ListButtonProps> = ({
     accessControl,
     meta,
   });
-
   const { variant, styles, ...commonProps } = rest;
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <Anchor
@@ -44,7 +46,7 @@ export const ListButton: React.FC<ListButtonProps> = ({
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
diff --git a/packages/mantine/src/components/buttons/show/index.tsx b/packages/mantine/src/components/buttons/show/index.tsx
index 4f04e315e6f0d..50a5c930a68d6 100644
--- a/packages/mantine/src/components/buttons/show/index.tsx
+++ b/packages/mantine/src/components/buttons/show/index.tsx
@@ -38,7 +38,10 @@ export const ShowButton: React.FC<ShowButtonProps> = ({
 
   const { variant, styles, ...commonProps } = rest;
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <Anchor
@@ -46,7 +49,7 @@ export const ShowButton: React.FC<ShowButtonProps> = ({
       to={to}
       replace={false}
       onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -63,7 +66,7 @@ export const ShowButton: React.FC<ShowButtonProps> = ({
                 variant: mapButtonVariantToActionIconVariant(variant),
               }
             : { variant: "default" })}
-          disabled={disabled}
+          disabled={isDisabled}
           title={title}
           data-testid={RefineButtonTestIds.ShowButton}
           className={RefineButtonClassNames.ShowButton}
@@ -74,7 +77,7 @@ export const ShowButton: React.FC<ShowButtonProps> = ({
       ) : (
         <Button
           variant="default"
-          disabled={disabled}
+          disabled={isDisabled}
           leftIcon={<IconEye size={18} {...svgIconProps} />}
           title={title}
           data-testid={RefineButtonTestIds.ShowButton}
diff --git a/packages/mantine/src/components/buttons/types.ts b/packages/mantine/src/components/buttons/types.ts
index 112b94d5878f7..f0c379db5b14a 100644
--- a/packages/mantine/src/components/buttons/types.ts
+++ b/packages/mantine/src/components/buttons/types.ts
@@ -14,73 +14,59 @@ import type {
 } from "@refinedev/ui-types";
 import type { IconProps } from "@tabler/icons-react";
 
+type CommonButtonProps = {
+  hidden?: boolean;
+  svgIconProps?: Omit<IconProps, "ref">;
+};
+
 export type ShowButtonProps = RefineShowButtonProps<
   ButtonProps,
-  {
-    svgIconProps?: Omit<IconProps, "ref">;
-  }
+  CommonButtonProps
 >;
 
 export type SaveButtonProps = RefineSaveButtonProps<
   ButtonProps,
-  {
-    svgIconProps?: Omit<IconProps, "ref">;
-  }
+  CommonButtonProps
 >;
 
 export type RefreshButtonProps = RefineRefreshButtonProps<
   ButtonProps,
-  {
-    svgIconProps?: Omit<IconProps, "ref">;
-  }
+  CommonButtonProps
 >;
 
 export type ListButtonProps = RefineListButtonProps<
   ButtonProps,
-  {
-    svgIconProps?: Omit<IconProps, "ref">;
-  }
+  CommonButtonProps
 >;
 
 export type ImportButtonProps = RefineImportButtonProps<
   ButtonProps,
-  {
+  CommonButtonProps & {
     inputProps: UseImportInputPropsType;
-    svgIconProps?: Omit<IconProps, "ref">;
   }
 >;
 
 export type ExportButtonProps = RefineExportButtonProps<
   ButtonProps,
-  {
-    svgIconProps?: Omit<IconProps, "ref">;
-  }
+  CommonButtonProps
 >;
 
 export type EditButtonProps = RefineEditButtonProps<
   ButtonProps,
-  {
-    svgIconProps?: Omit<IconProps, "ref">;
-  }
+  CommonButtonProps
 >;
 
 export type DeleteButtonProps = RefineDeleteButtonProps<
   ButtonProps,
-  {
-    svgIconProps?: Omit<IconProps, "ref">;
-  }
+  CommonButtonProps
 >;
 
 export type CreateButtonProps = RefineCreateButtonProps<
   ButtonProps,
-  {
-    svgIconProps?: Omit<IconProps, "ref">;
-  }
+  CommonButtonProps
 >;
 
 export type CloneButtonProps = RefineCloneButtonProps<
   ButtonProps,
-  {
-    svgIconProps?: Omit<IconProps, "ref">;
-  }
+  CommonButtonProps
 >;
diff --git a/packages/mui/src/components/buttons/clone/index.tsx b/packages/mui/src/components/buttons/clone/index.tsx
index 41299bc33471f..083f5309ec18d 100644
--- a/packages/mui/src/components/buttons/clone/index.tsx
+++ b/packages/mui/src/components/buttons/clone/index.tsx
@@ -37,7 +37,10 @@ export const CloneButton: React.FC<CloneButtonProps> = ({
     accessControl,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   const { sx, ...restProps } = rest;
 
@@ -46,7 +49,7 @@ export const CloneButton: React.FC<CloneButtonProps> = ({
       to={to}
       replace={false}
       onClick={(e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -58,7 +61,7 @@ export const CloneButton: React.FC<CloneButtonProps> = ({
       style={{ textDecoration: "none" }}
     >
       <Button
-        disabled={disabled}
+        disabled={isDisabled}
         startIcon={!hideText && <AddBoxOutlined {...svgIconProps} />}
         title={title}
         sx={{ minWidth: 0, ...sx }}
diff --git a/packages/mui/src/components/buttons/create/index.tsx b/packages/mui/src/components/buttons/create/index.tsx
index 16d975df337c1..d702369eac92a 100644
--- a/packages/mui/src/components/buttons/create/index.tsx
+++ b/packages/mui/src/components/buttons/create/index.tsx
@@ -26,7 +26,7 @@ export const CreateButton: React.FC<CreateButtonProps> = ({
   meta,
   children,
   onClick,
-  ...rest
+  ...props
 }) => {
   const { to, label, title, disabled, hidden, LinkComponent } = useCreateButton(
     {
@@ -35,17 +35,19 @@ export const CreateButton: React.FC<CreateButtonProps> = ({
       accessControl,
     },
   );
+  const isDisabled = disabled || props.disabled;
+  const isHidden = hidden || props.hidden;
 
-  if (hidden) return null;
+  if (isHidden) return null;
 
-  const { sx, ...restProps } = rest;
+  const { sx, ...restProps } = props;
 
   return (
     <LinkComponent
       to={to}
       replace={false}
       onClick={(e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -57,7 +59,7 @@ export const CreateButton: React.FC<CreateButtonProps> = ({
       style={{ textDecoration: "none" }}
     >
       <Button
-        disabled={disabled}
+        disabled={isDisabled}
         startIcon={!hideText && <AddBoxOutlined {...svgIconProps} />}
         title={title}
         variant="contained"
diff --git a/packages/mui/src/components/buttons/delete/index.tsx b/packages/mui/src/components/buttons/delete/index.tsx
index 211d4209c00d4..051caf4d6e599 100644
--- a/packages/mui/src/components/buttons/delete/index.tsx
+++ b/packages/mui/src/components/buttons/delete/index.tsx
@@ -70,7 +70,9 @@ export const DeleteButton: React.FC<DeleteButtonProps> = ({
 
   const { sx, ...restProps } = rest;
 
-  if (hidden) return null;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   return (
     <div>
diff --git a/packages/mui/src/components/buttons/edit/index.tsx b/packages/mui/src/components/buttons/edit/index.tsx
index c7b335f10db17..c0fa8808c3470 100644
--- a/packages/mui/src/components/buttons/edit/index.tsx
+++ b/packages/mui/src/components/buttons/edit/index.tsx
@@ -36,7 +36,10 @@ export const EditButton: React.FC<EditButtonProps> = ({
     meta,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   const { sx, ...restProps } = rest;
 
@@ -45,7 +48,7 @@ export const EditButton: React.FC<EditButtonProps> = ({
       to={to}
       replace={false}
       onClick={(e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -57,7 +60,7 @@ export const EditButton: React.FC<EditButtonProps> = ({
       style={{ textDecoration: "none" }}
     >
       <Button
-        disabled={disabled}
+        disabled={isDisabled}
         startIcon={
           !hideText && (
             <EditOutlined sx={{ selfAlign: "center" }} {...svgIconProps} />
diff --git a/packages/mui/src/components/buttons/list/index.tsx b/packages/mui/src/components/buttons/list/index.tsx
index 26decbeb582f9..9c535bd958879 100644
--- a/packages/mui/src/components/buttons/list/index.tsx
+++ b/packages/mui/src/components/buttons/list/index.tsx
@@ -34,7 +34,10 @@ export const ListButton: React.FC<ListButtonProps> = ({
     accessControl,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   const { sx, ...restProps } = rest;
 
@@ -43,7 +46,7 @@ export const ListButton: React.FC<ListButtonProps> = ({
       to={to}
       replace={false}
       onClick={(e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -55,7 +58,7 @@ export const ListButton: React.FC<ListButtonProps> = ({
       style={{ textDecoration: "none" }}
     >
       <Button
-        disabled={disabled}
+        disabled={isDisabled}
         startIcon={!hideText && <ListOutlined {...svgIconProps} />}
         title={title}
         sx={{ minWidth: 0, ...sx }}
diff --git a/packages/mui/src/components/buttons/show/index.tsx b/packages/mui/src/components/buttons/show/index.tsx
index b0475c085bc67..269cd15c0a208 100644
--- a/packages/mui/src/components/buttons/show/index.tsx
+++ b/packages/mui/src/components/buttons/show/index.tsx
@@ -36,7 +36,10 @@ export const ShowButton: React.FC<ShowButtonProps> = ({
     meta,
   });
 
-  if (hidden) return null;
+  const isDisabled = disabled || rest.disabled;
+  const isHidden = hidden || rest.hidden;
+
+  if (isHidden) return null;
 
   const { sx, ...restProps } = rest;
 
@@ -45,7 +48,7 @@ export const ShowButton: React.FC<ShowButtonProps> = ({
       to={to}
       replace={false}
       onClick={(e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
-        if (disabled) {
+        if (isDisabled) {
           e.preventDefault();
           return;
         }
@@ -57,7 +60,7 @@ export const ShowButton: React.FC<ShowButtonProps> = ({
       style={{ textDecoration: "none" }}
     >
       <Button
-        disabled={disabled}
+        disabled={isDisabled}
         startIcon={!hideText && <VisibilityOutlined {...svgIconProps} />}
         title={title}
         sx={{ minWidth: 0, ...sx }}
diff --git a/packages/mui/tsup.config.ts b/packages/mui/tsup.config.ts
index af94f138e282b..f660251152b91 100644
--- a/packages/mui/tsup.config.ts
+++ b/packages/mui/tsup.config.ts
@@ -10,8 +10,8 @@ export default defineConfig((options) => ({
   entry: ["src/index.tsx"],
   splitting: false,
   sourcemap: true,
-  clean: true,
   minify: false,
+  dts: true,
   format: ["cjs", "esm"],
   outExtension: ({ format }) => ({ js: format === "cjs" ? ".cjs" : ".mjs" }),
   platform: "browser",
diff --git a/packages/ui-tests/src/tests/buttons/clone.tsx b/packages/ui-tests/src/tests/buttons/clone.tsx
index d66b219090d1d..8c577302bef9d 100644
--- a/packages/ui-tests/src/tests/buttons/clone.tsx
+++ b/packages/ui-tests/src/tests/buttons/clone.tsx
@@ -25,6 +25,30 @@ export const buttonCloneTests = (
       expect(getByText("Clone").closest("button")).not.toBeDisabled();
     });
 
+    it("should be disabled by prop", async () => {
+      const mockOnClick = jest.fn();
+
+      const { getByText } = render(
+        <CloneButton disabled onClick={mockOnClick} />,
+        {
+          wrapper: TestWrapper({}),
+        },
+      );
+
+      expect(getByText("Clone").closest("button")).toBeDisabled();
+
+      fireEvent.click(getByText("Clone").closest("button") as Element);
+      expect(mockOnClick).not.toHaveBeenCalled();
+    });
+
+    it("should be hidden by prop", async () => {
+      const { queryByText } = render(<CloneButton disabled hidden />, {
+        wrapper: TestWrapper({}),
+      });
+
+      expect(queryByText("Clone")).not.toBeInTheDocument();
+    });
+
     it("should have the correct test-id", async () => {
       const { queryByTestId } = render(<CloneButton />, {
         wrapper: TestWrapper({}),
diff --git a/packages/ui-tests/src/tests/buttons/create.tsx b/packages/ui-tests/src/tests/buttons/create.tsx
index 8153e269ecfcd..982b5d942d76f 100644
--- a/packages/ui-tests/src/tests/buttons/create.tsx
+++ b/packages/ui-tests/src/tests/buttons/create.tsx
@@ -27,6 +27,30 @@ export const buttonCreateTests = (
       expect(getByText("Create").closest("button")).not.toBeDisabled();
     });
 
+    it("should be disabled by prop", async () => {
+      const mockOnClick = jest.fn();
+
+      const { getByText } = render(
+        <CreateButton disabled onClick={mockOnClick} />,
+        {
+          wrapper: TestWrapper({}),
+        },
+      );
+
+      expect(getByText("Create").closest("button")).toBeDisabled();
+
+      fireEvent.click(getByText("Create").closest("button") as Element);
+      expect(mockOnClick).not.toHaveBeenCalled();
+    });
+
+    it("should be hidden by prop", async () => {
+      const { queryByText } = render(<CreateButton disabled hidden />, {
+        wrapper: TestWrapper({}),
+      });
+
+      expect(queryByText("Create")).not.toBeInTheDocument();
+    });
+
     it("should have the correct test-id", async () => {
       const { queryByTestId } = render(<CreateButton />, {
         wrapper: TestWrapper({}),
diff --git a/packages/ui-tests/src/tests/buttons/delete.tsx b/packages/ui-tests/src/tests/buttons/delete.tsx
index 2634c8d9848e4..5c9f5f57667cd 100644
--- a/packages/ui-tests/src/tests/buttons/delete.tsx
+++ b/packages/ui-tests/src/tests/buttons/delete.tsx
@@ -33,6 +33,30 @@ export const buttonDeleteTests = (
       expect(getByText("Delete").closest("button")).not.toBeDisabled();
     });
 
+    it("should be disabled by prop", async () => {
+      const mockOnClick = jest.fn();
+
+      const { getByText } = render(
+        <DeleteButton disabled onClick={mockOnClick} />,
+        {
+          wrapper: TestWrapper({}),
+        },
+      );
+
+      expect(getByText("Delete").closest("button")).toBeDisabled();
+
+      fireEvent.click(getByText("Delete").closest("button") as Element);
+      expect(mockOnClick).not.toHaveBeenCalled();
+    });
+
+    it("should be hidden by prop", async () => {
+      const { queryByText } = render(<DeleteButton disabled hidden />, {
+        wrapper: TestWrapper({}),
+      });
+
+      expect(queryByText("Delete")).not.toBeInTheDocument();
+    });
+
     it("should have the correct test-id", async () => {
       const { getByTestId } = render(<DeleteButton />, {
         wrapper: TestWrapper({}),
diff --git a/packages/ui-tests/src/tests/buttons/edit.tsx b/packages/ui-tests/src/tests/buttons/edit.tsx
index 8442644e409c5..6cb91f1b32ce4 100644
--- a/packages/ui-tests/src/tests/buttons/edit.tsx
+++ b/packages/ui-tests/src/tests/buttons/edit.tsx
@@ -27,6 +27,30 @@ export const buttonEditTests = (
       expect(getByText("Edit").closest("button")).not.toBeDisabled();
     });
 
+    it("should be disabled by prop", async () => {
+      const mockOnClick = jest.fn();
+
+      const { getByText } = render(
+        <EditButton disabled onClick={mockOnClick} />,
+        {
+          wrapper: TestWrapper({}),
+        },
+      );
+
+      expect(getByText("Edit").closest("button")).toBeDisabled();
+
+      fireEvent.click(getByText("Edit").closest("button") as Element);
+      expect(mockOnClick).not.toHaveBeenCalled();
+    });
+
+    it("should be hidden by prop", async () => {
+      const { queryByText } = render(<EditButton disabled hidden />, {
+        wrapper: TestWrapper({}),
+      });
+
+      expect(queryByText("Edit")).not.toBeInTheDocument();
+    });
+
     it("should have the correct test-id", async () => {
       const { queryByTestId } = render(<EditButton />, {
         wrapper: TestWrapper({}),
diff --git a/packages/ui-tests/src/tests/buttons/list.tsx b/packages/ui-tests/src/tests/buttons/list.tsx
index 641d0cf298768..8ef263e4f1073 100644
--- a/packages/ui-tests/src/tests/buttons/list.tsx
+++ b/packages/ui-tests/src/tests/buttons/list.tsx
@@ -31,6 +31,37 @@ export const buttonListTests = (
       expect(queryByTestId(RefineButtonTestIds.ListButton)).toBeTruthy();
     });
 
+    it("should be disabled by prop", async () => {
+      const mockOnClick = jest.fn();
+
+      const { getByText } = render(
+        <ListButton disabled onClick={mockOnClick}>
+          List
+        </ListButton>,
+        {
+          wrapper: TestWrapper({}),
+        },
+      );
+
+      expect(getByText("List").closest("button")).toBeDisabled();
+
+      fireEvent.click(getByText("List").closest("button") as Element);
+      expect(mockOnClick).not.toHaveBeenCalled();
+    });
+
+    it("should be hidden by prop", async () => {
+      const { queryByText } = render(
+        <ListButton disabled hidden>
+          List
+        </ListButton>,
+        {
+          wrapper: TestWrapper({}),
+        },
+      );
+
+      expect(queryByText("List")).not.toBeInTheDocument();
+    });
+
     it("should render text by children", async () => {
       const { container, getByText } = render(<ListButton>refine</ListButton>, {
         wrapper: TestWrapper({}),
diff --git a/packages/ui-tests/src/tests/buttons/show.tsx b/packages/ui-tests/src/tests/buttons/show.tsx
index d97d486324acd..2f418d405ba50 100644
--- a/packages/ui-tests/src/tests/buttons/show.tsx
+++ b/packages/ui-tests/src/tests/buttons/show.tsx
@@ -27,6 +27,30 @@ export const buttonShowTests = (
       expect(getByText("Show").closest("button")).not.toBeDisabled();
     });
 
+    it("should be disabled by prop", async () => {
+      const mockOnClick = jest.fn();
+
+      const { getByText } = render(
+        <ShowButton disabled onClick={mockOnClick} />,
+        {
+          wrapper: TestWrapper({}),
+        },
+      );
+
+      expect(getByText("Show").closest("button")).toBeDisabled();
+
+      fireEvent.click(getByText("Show").closest("button") as Element);
+      expect(mockOnClick).not.toHaveBeenCalled();
+    });
+
+    it("should be hidden by prop", async () => {
+      const { queryByText } = render(<ShowButton disabled hidden />, {
+        wrapper: TestWrapper({}),
+      });
+
+      expect(queryByText("Show")).not.toBeInTheDocument();
+    });
+
     it("should have the correct test-id", async () => {
       const { queryByTestId } = render(<ShowButton />, {
         wrapper: TestWrapper({}),