@refinedev/antd 5.43.0 → 5.44.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@refinedev/antd",
-  "version": "5.43.0",
+  "version": "5.44.0",
   "private": false,
   "description": "refine is a React-based framework for building internal tools, rapidly. It ships with Ant Design System, an enterprise-level UI toolkit.",
   "repository": {
@@ -33,8 +33,8 @@
   "module": "dist/index.mjs",
   "typings": "dist/index.d.ts",
   "dependencies": {
-    "@ant-design/icons": "5.0.1",
-    "@ant-design/pro-layout": "7.17.12",
+    "@ant-design/icons": "^5.5.1",
+    "@ant-design/pro-layout": "^7.21.1",
     "@refinedev/ui-types": "^1.22.9",
     "@tanstack/react-query": "^4.10.1",
     "antd": "^5.17.0",
@@ -46,8 +46,8 @@
   },
   "devDependencies": {
     "@esbuild-plugins/node-resolve": "^0.1.4",
-    "@refinedev/cli": "^2.16.37",
-    "@refinedev/core": "^4.54.0",
+    "@refinedev/cli": "^2.16.38",
+    "@refinedev/core": "^4.56.0",
     "@refinedev/ui-tests": "^1.14.9",
     "@testing-library/jest-dom": "^5.16.4",
     "@testing-library/react": "^13.1.1",

package/src/components/autoSaveIndicator/index.tsx

@@ -19,7 +19,6 @@ export const AutoSaveIndicator: React.FC<AutoSaveIndicatorProps> = ({
       <Message
         translationKey="autoSave.success"
         defaultMessage="saved"
-        // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
         icon={<CheckCircleOutlined />}
       />
     ),
@@ -27,7 +26,6 @@ export const AutoSaveIndicator: React.FC<AutoSaveIndicatorProps> = ({
       <Message
         translationKey="autoSave.error"
         defaultMessage="auto save failure"
-        // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
         icon={<ExclamationCircleOutlined />}
       />
     ),
@@ -35,7 +33,6 @@ export const AutoSaveIndicator: React.FC<AutoSaveIndicatorProps> = ({
       <Message
         translationKey="autoSave.loading"
         defaultMessage="saving..."
-        // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
         icon={<SyncOutlined />}
       />
     ),
@@ -43,7 +40,6 @@ export const AutoSaveIndicator: React.FC<AutoSaveIndicatorProps> = ({
       <Message
         translationKey="autoSave.idle"
         defaultMessage="waiting for changes"
-        // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
         icon={<EllipsisOutlined />}
       />
     ),

package/src/components/breadcrumb/index.tsx

@@ -70,7 +70,6 @@ export const Breadcrumb: React.FC<BreadcrumbProps> = ({
           key: "breadcrumb-item-home",
           title: (
             <ActiveLink to="/">
-              {/* @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66 */}
               {rootRouteResource?.resource?.meta?.icon ?? <HomeOutlined />}
             </ActiveLink>
           ),

package/src/components/buttons/clone/index.tsx

@@ -52,7 +52,6 @@ export const CloneButton: React.FC<CloneButtonProps> = ({
       }}
     >
       <Button
-        // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
         icon={<PlusSquareOutlined />}
         disabled={disabled}
         title={title}

package/src/components/buttons/create/index.tsx

@@ -52,7 +52,6 @@ export const CreateButton: React.FC<CreateButtonProps> = ({
       }}
     >
       <Button
-        // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
         icon={<PlusSquareOutlined />}
         disabled={disabled}
         title={title}

package/src/components/buttons/delete/index.tsx

@@ -76,7 +76,6 @@ export const DeleteButton: React.FC<DeleteButtonProps> = ({
       <Button
         danger
         loading={loading}
-        // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
         icon={<DeleteOutlined />}
         title={title}
         disabled={disabled}

package/src/components/buttons/edit/index.tsx

@@ -52,7 +52,6 @@ export const EditButton: React.FC<EditButtonProps> = ({
       }}
     >
       <Button
-        // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
         icon={<EditOutlined />}
         disabled={disabled}
         title={title}

package/src/components/buttons/export/index.tsx

@@ -25,7 +25,6 @@ export const ExportButton: React.FC<ExportButtonProps> = ({
   return (
     <Button
       type="default"
-      // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
       icon={<ExportOutlined />}
       data-testid={RefineButtonTestIds.ExportButton}
       className={RefineButtonClassNames.ExportButton}

package/src/components/buttons/import/index.tsx

@@ -28,7 +28,6 @@ export const ImportButton: React.FC<ImportButtonProps> = ({
   return (
     <Upload {...uploadProps}>
       <Button
-        // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
         icon={<ImportOutlined />}
         data-testid={RefineButtonTestIds.ImportButton}
         className={RefineButtonClassNames.ImportButton}

package/src/components/buttons/list/index.tsx

@@ -50,7 +50,6 @@ export const ListButton: React.FC<ListButtonProps> = ({
       }}
     >
       <Button
-        // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
         icon={<BarsOutlined />}
         disabled={disabled}
         title={title}

package/src/components/buttons/refresh/index.tsx

@@ -35,7 +35,6 @@ export const RefreshButton: React.FC<RefreshButtonProps> = ({
   return (
     <Button
       onClick={onClick}
-      // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
       icon={<RedoOutlined spin={loading} />}
       data-testid={RefineButtonTestIds.RefreshButton}
       className={RefineButtonClassNames.RefreshButton}

package/src/components/buttons/save/index.tsx

@@ -25,7 +25,6 @@ export const SaveButton: React.FC<SaveButtonProps> = ({
   return (
     <Button
       type="primary"
-      // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
       icon={<SaveOutlined />}
       data-testid={RefineButtonTestIds.SaveButton}
       className={RefineButtonClassNames.SaveButton}

package/src/components/buttons/show/index.tsx

@@ -52,7 +52,6 @@ export const ShowButton: React.FC<ShowButtonProps> = ({
       }}
     >
       <Button
-        // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
         icon={<EyeOutlined />}
         disabled={disabled}
         title={title}

package/src/components/crud/create/index.tsx

@@ -72,7 +72,6 @@ export const Create: React.FC<CreateProps> = ({
   return (
     <div {...(wrapperProps ?? {})}>
       <PageHeader
-        ghost={false}
         backIcon={goBackFromProps}
         onBack={
           action !== "list" || typeof action !== "undefined"

package/src/components/crud/edit/index.tsx

@@ -150,7 +150,6 @@ export const Edit: React.FC<EditProps> = ({
   return (
     <div {...(wrapperProps ?? {})}>
       <PageHeader
-        ghost={false}
         backIcon={goBackFromProps}
         onBack={
           action !== "list" && typeof action !== "undefined"

package/src/components/crud/list/index.tsx

@@ -69,7 +69,6 @@ export const List: React.FC<ListProps> = ({
   return (
     <div {...(wrapperProps ?? {})}>
       <PageHeader
-        ghost={false}
         title={
           title ??
           translate(

package/src/components/crud/show/index.tsx

@@ -133,7 +133,6 @@ export const Show: React.FC<ShowProps> = ({
   return (
     <div {...(wrapperProps ?? {})}>
       <PageHeader
-        ghost={false}
         backIcon={goBackFromProps}
         onBack={
           action !== "list" && typeof action !== "undefined"

package/src/components/fields/boolean/index.tsx

@@ -14,9 +14,7 @@ export const BooleanField: React.FC<BooleanFieldProps> = ({
   value,
   valueLabelTrue = "true",
   valueLabelFalse = "false",
-  // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
   trueIcon = <CheckOutlined />,
-  // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
   falseIcon = <CloseOutlined />,
   ...rest
 }) => {

package/src/components/layout/sider/index.tsx

@@ -82,7 +82,6 @@ export const Sider: React.FC<RefineLayoutSiderProps> = ({
           >
             <Menu.SubMenu
               key={item.key}
-              // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
               icon={icon ?? <UnorderedListOutlined />}
               title={label}
             >
@@ -110,7 +109,6 @@ export const Sider: React.FC<RefineLayoutSiderProps> = ({
             style={{
               fontWeight: isSelected ? "bold" : "normal",
             }}
-            // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
             icon={icon ?? (isRoute && <UnorderedListOutlined />)}
           >
             <Link to={route ?? ""}>{label}</Link>
@@ -142,7 +140,6 @@ export const Sider: React.FC<RefineLayoutSiderProps> = ({
   };
 
   const logout = isExistAuthentication && (
-    // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
     <Menu.Item key="logout" onClick={handleLogout} icon={<LogoutOutlined />}>
       {translate("buttons.logout", "Logout")}
     </Menu.Item>
@@ -154,7 +151,6 @@ export const Sider: React.FC<RefineLayoutSiderProps> = ({
       style={{
         fontWeight: selectedKey === "/" ? "bold" : "normal",
       }}
-      // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
       icon={<DashboardOutlined />}
     >
       <Link to="/">{translate("dashboard.title", "Dashboard")}</Link>
@@ -230,7 +226,6 @@ export const Sider: React.FC<RefineLayoutSiderProps> = ({
           style={drawerButtonStyles}
           size="large"
           onClick={() => setDrawerOpen(true)}
-          // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
           icon={<BarsOutlined />}
         />
       </>

package/src/components/pageHeader/index.tsx

@@ -15,7 +15,6 @@ export const PageHeader: FC<AntdPageHeaderProps> = ({ children, ...props }) => {
     const BackIcon =
       direction === "rtl" ? ArrowRightOutlined : ArrowLeftOutlined;
 
-    // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
     return <Button type="text" icon={<BackIcon />} />;
   };
   const backIcon =

package/src/components/pages/auth/components/forgotPassword/index.tsx

@@ -52,6 +52,7 @@ export const ForgotPasswordPage: React.FC<ResetPassworProps> = ({
   renderContent,
   formProps,
   title,
+  mutationVariables,
 }) => {
   const { token } = theme.useToken();
   const [form] = Form.useForm<ForgotPasswordFormTypes>();
@@ -104,7 +105,9 @@ export const ForgotPasswordPage: React.FC<ResetPassworProps> = ({
       <Form<ForgotPasswordFormTypes>
         layout="vertical"
         form={form}
-        onFinish={(values) => forgotPassword(values)}
+        onFinish={(values) =>
+          forgotPassword({ ...values, ...mutationVariables })
+        }
         requiredMark={false}
         {...formProps}
       >

package/src/components/pages/auth/components/login/index.tsx

@@ -50,6 +50,7 @@ export const LoginPage: React.FC<LoginProps> = ({
   formProps,
   title,
   hideForm,
+  mutationVariables,
 }) => {
   const { token } = theme.useToken();
   const [form] = Form.useForm<LoginFormTypes>();
@@ -111,6 +112,7 @@ export const LoginPage: React.FC<LoginProps> = ({
                 }}
                 onClick={() =>
                   login({
+                    ...mutationVariables,
                     providerName: provider.name,
                   })
                 }
@@ -152,7 +154,7 @@ export const LoginPage: React.FC<LoginProps> = ({
         <Form<LoginFormTypes>
           layout="vertical"
           form={form}
-          onFinish={(values) => login(values)}
+          onFinish={(values) => login({ ...values, ...mutationVariables })}
           requiredMark={false}
           initialValues={{
             remember: false,

package/src/components/pages/auth/components/register/index.tsx

@@ -47,6 +47,7 @@ export const RegisterPage: React.FC<RegisterProps> = ({
   formProps,
   title,
   hideForm,
+  mutationVariables,
 }) => {
   const { token } = theme.useToken();
   const [form] = Form.useForm<RegisterFormTypes>();
@@ -108,6 +109,7 @@ export const RegisterPage: React.FC<RegisterProps> = ({
                 }}
                 onClick={() =>
                   register({
+                    ...mutationVariables,
                     providerName: provider.name,
                   })
                 }
@@ -152,7 +154,7 @@ export const RegisterPage: React.FC<RegisterProps> = ({
         <Form<RegisterFormTypes>
           layout="vertical"
           form={form}
-          onFinish={(values) => register(values)}
+          onFinish={(values) => register({ ...mutationVariables, ...values })}
           requiredMark={false}
           {...formProps}
         >

package/src/components/pages/auth/components/updatePassword/index.tsx

@@ -46,6 +46,7 @@ export const UpdatePasswordPage: React.FC<UpdatePasswordProps> = ({
   renderContent,
   formProps,
   title,
+  mutationVariables,
 }) => {
   const { token } = theme.useToken();
   const [form] = Form.useForm<UpdatePasswordFormTypes>();
@@ -96,7 +97,9 @@ export const UpdatePasswordPage: React.FC<UpdatePasswordProps> = ({
       <Form<UpdatePasswordFormTypes>
         layout="vertical"
         form={form}
-        onFinish={(values) => updatePassword(values)}
+        onFinish={(values) =>
+          updatePassword({ ...values, ...mutationVariables })
+        }
         requiredMark={false}
         {...formProps}
       >

package/src/components/pages/error/index.tsx

@@ -52,7 +52,6 @@ export const ErrorComponent: React.FC<RefineErrorPageProps> = () => {
             </Typography.Text>
             {errorMessage && (
               <Tooltip title={errorMessage}>
-                {/* @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66 */}
                 <InfoCircleOutlined data-testid="error-component-tooltip" />
               </Tooltip>
             )}

package/src/components/pages/ready/index.tsx

@@ -62,7 +62,6 @@ export const ReadyPage: React.FC<RefineReadyPageProps> = () => {
           style={{ marginTop: "70px", justifyContent: "center" }}
         >
           <a href="https://refine.dev" target="_blank" rel="noreferrer">
-            {/* @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66 */}
             <Button size="large" icon={<ReadOutlined />}>
               Documentation
             </Button>
@@ -72,13 +71,11 @@ export const ReadyPage: React.FC<RefineReadyPageProps> = () => {
             target="_blank"
             rel="noreferrer"
           >
-            {/* @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66 */}
             <Button size="large" icon={<FolderOutlined />}>
               Examples
             </Button>
           </a>
           <a href="https://discord.gg/refine" target="_blank" rel="noreferrer">
-            {/* @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66 */}
             <Button size="large" icon={<TeamOutlined />}>
               Community
             </Button>

package/src/components/table/components/filterDropdown/index.tsx

@@ -94,7 +94,6 @@ export const FilterDropdown: React.FC<FilterDropdownProps> = (props) => {
       <div style={{ marginBottom: 15 }}>{childrenWithProps}</div>
       <Space>
         <Button type="primary" size="small" onClick={() => onFilter()}>
-          {/* @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66 */}
           <FilterOutlined /> {translate("buttons.filter", "Filter")}
         </Button>
         <Button danger size="small" onClick={() => clearFilter()}>

package/src/components/themedLayout/sider/index.tsx

@@ -88,7 +88,6 @@ export const ThemedSider: React.FC<RefineThemedLayoutSiderProps> = ({
           >
             <Menu.SubMenu
               key={item.key}
-              // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
               icon={icon ?? <UnorderedListOutlined />}
               title={label}
             >
@@ -114,7 +113,6 @@ export const ThemedSider: React.FC<RefineThemedLayoutSiderProps> = ({
         >
           <Menu.Item
             key={item.key}
-            // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
             icon={icon ?? (isRoute && <UnorderedListOutlined />)}
           >
             <Link to={route ?? ""}>{label}</Link>
@@ -149,7 +147,6 @@ export const ThemedSider: React.FC<RefineThemedLayoutSiderProps> = ({
     <Menu.Item
       key="logout"
       onClick={() => handleLogout()}
-      // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
       icon={<LogoutOutlined />}
     >
       {translate("buttons.logout", "Logout")}
@@ -157,7 +154,6 @@ export const ThemedSider: React.FC<RefineThemedLayoutSiderProps> = ({
   );
 
   const dashboard = hasDashboard ? (
-    // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
     <Menu.Item key="dashboard" icon={<DashboardOutlined />}>
       <Link to="/">{translate("dashboard.title", "Dashboard")}</Link>
       {!collapsed && selectedKey === "/" && (
@@ -254,7 +250,6 @@ export const ThemedSider: React.FC<RefineThemedLayoutSiderProps> = ({
           style={drawerButtonStyles}
           size="large"
           onClick={() => setDrawerOpen(true)}
-          // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
           icon={<BarsOutlined />}
         />
       </>
@@ -287,14 +282,12 @@ export const ThemedSider: React.FC<RefineThemedLayoutSiderProps> = ({
           }}
         >
           {collapsed ? (
-            // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
             <RightOutlined
               style={{
                 color: token.colorPrimary,
               }}
             />
           ) : (
-            // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
             <LeftOutlined
               style={{
                 color: token.colorPrimary,

package/src/components/themedLayoutV2/sider/index.tsx

@@ -101,7 +101,6 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
           >
             <Menu.SubMenu
               key={item.key}
-              // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
               icon={icon ?? <UnorderedListOutlined />}
               title={label}
             >
@@ -130,7 +129,6 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
         >
           <Menu.Item
             key={item.key}
-            // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
             icon={icon ?? (isRoute && <UnorderedListOutlined />)}
             style={linkStyle}
           >
@@ -168,7 +166,6 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
     <Menu.Item
       key="logout"
       onClick={() => handleLogout()}
-      // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
       icon={<LogoutOutlined />}
     >
       {translate("buttons.logout", "Logout")}
@@ -176,7 +173,6 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
   );
 
   const dashboard = hasDashboard ? (
-    // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
     <Menu.Item key="dashboard" icon={<DashboardOutlined />}>
       <Link to="/">{translate("dashboard.title", "Dashboard")}</Link>
       {!siderCollapsed && selectedKey === "/" && (
@@ -232,7 +228,7 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
         <Drawer
           open={mobileSiderOpen}
           onClose={() => setMobileSiderOpen(false)}
-          placement="left"
+          placement={direction === "rtl" ? "right" : "left"}
           closable={false}
           width={200}
           bodyStyle={{
@@ -269,7 +265,6 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
           style={drawerButtonStyles}
           size="large"
           onClick={() => setMobileSiderOpen(true)}
-          // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
           icon={<BarsOutlined />}
         />
       </>
@@ -297,7 +292,6 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
     const CollapsedIcon = direction === "rtl" ? LeftOutlined : RightOutlined;
     const IconComponent = siderCollapsed ? CollapsedIcon : OpenIcon;
 
-    // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
     return <IconComponent {...iconProps} />;
   };
 

package/src/components/themedLayoutV2/sider/styles.ts

@@ -1,8 +1,8 @@
 import type { CSSProperties } from "react";
 
 export const drawerButtonStyles: CSSProperties = {
-  borderTopLeftRadius: 0,
-  borderBottomLeftRadius: 0,
+  borderStartStartRadius: 0,
+  borderEndStartRadius: 0,
   position: "fixed",
   top: 64,
   zIndex: 999,

package/src/components/undoableNotification/index.tsx

@@ -36,7 +36,6 @@ export const UndoableNotification: React.FC<UndoableNotificationProps> = ({
       style={{ flexShrink: 0 }}
       onClick={cancelMutation}
       disabled={undoableTimeout === 0}
-      // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
       icon={<UndoOutlined />}
     />
   </div>

package/src/hooks/form/useForm.ts

@@ -179,11 +179,10 @@ export const useForm = <
         return;
       }
 
+      type FieldData = Parameters<typeof form.setFields>[0];
+      type NamePath = FieldData[number]["name"];
       // antd form expects error object to be in a specific format.
-      let parsedErrors: {
-        name: string | number | (string | number)[];
-        errors?: string[] | undefined;
-      }[] = [];
+      let parsedErrors: FieldData = [];
 
       // reset antd errors before setting new errors
       const fieldsValue = form.getFieldsValue() as unknown as object;
@@ -192,7 +191,7 @@ export const useForm = <
 
       parsedErrors = fields.map((field) => {
         return {
-          name: propertyPathToArray(field),
+          name: propertyPathToArray(field) as NamePath,
           errors: undefined,
         };
       });
@@ -228,7 +227,7 @@ export const useForm = <
         }
 
         parsedErrors.push({
-          name: propertyPathToArray(key),
+          name: propertyPathToArray(key) as NamePath,
           errors: newError,
         });
       }