@refinedev/antd 5.40.0 → 5.41.0

package/dist/interfaces/field.d.mts.map

@@ -1 +1,4 @@
-{"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../../src/interfaces/field.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,UAAU,CAAC,CAAC,IAAI;IAC1B,KAAK,EAAE,CAAC,CAAC;CACV,CAAC"}
+export type FieldProps<T> = {
+    value: T;
+};
+//# sourceMappingURL=field.d.ts.map

package/dist/interfaces/index.d.mts.map

@@ -1 +1,19 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/interfaces/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAErD,MAAM,MAAM,UAAU,GAAG;IACvB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB,CAAC;AACF,MAAM,WAAW,MAAM;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG;IAClC,QAAQ,EAAE,SAAS,EAAE,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,aAAa,GAAG;IACtC,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC"}
+import type { IResourceItem } from "@refinedev/core";
+export type BaseRecord = {
+    id?: string;
+    [key: string]: any;
+};
+export interface Option {
+    label: string;
+    value: string;
+}
+export type ITreeMenu = IMenuItem & {
+    children: ITreeMenu[];
+};
+export type IMenuItem = IResourceItem & {
+    key: string;
+    route: string;
+};
+export * from "./field";
+export * from "./upload";
+//# sourceMappingURL=index.d.ts.map

package/dist/interfaces/upload.d.mts.map

@@ -1 +1,10 @@
-{"version":3,"file":"upload.d.ts","sourceRoot":"","sources":["../../src/interfaces/upload.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,WAAW,GAAG,SAAS,CAAC;CAChE"}
+export interface UploadedFile {
+    uid: string;
+    name: string;
+    url: string;
+    type: string;
+    size: number;
+    percent: number;
+    status: "error" | "success" | "done" | "uploading" | "removed";
+}
+//# sourceMappingURL=upload.d.ts.map

package/dist/providers/index.d.mts.map

@@ -1 +1,2 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/providers/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC"}
+export * from "./notificationProvider";
+//# sourceMappingURL=index.d.ts.map

package/dist/providers/notificationProvider/index.d.mts.map

@@ -1 +1,8 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/providers/notificationProvider/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAM5D;;;GAGG;AAEH,eAAO,MAAM,oBAAoB,EAAE,oBAqClC,CAAC;AAEF,eAAO,MAAM,uBAAuB,QAAO,oBA+C1C,CAAC"}
+import type { NotificationProvider } from "@refinedev/core";
+/**
+ * @deprecated `notificationProvider` is deprecated due to not being compatible with theme changes in Ant Design. Please use `useNotificationProvider` export as your notification provider.
+ * @see https://refine.dev/docs/api-reference/antd/theming/#usenotificationprovider-compatible-with-theme
+ */
+export declare const notificationProvider: NotificationProvider;
+export declare const useNotificationProvider: () => NotificationProvider;
+//# sourceMappingURL=index.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@refinedev/antd",
-  "version": "5.40.0",
+  "version": "5.41.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": {
@@ -46,9 +46,9 @@
   },
   "devDependencies": {
     "@esbuild-plugins/node-resolve": "^0.1.4",
-    "@refinedev/cli": "^2.16.33",
-    "@refinedev/core": "^4.51.0",
-    "@refinedev/ui-tests": "^1.14.7",
+    "@refinedev/cli": "^2.16.35",
+    "@refinedev/core": "^4.52.0",
+    "@refinedev/ui-tests": "^1.14.8",
     "@testing-library/jest-dom": "^5.16.4",
     "@testing-library/react": "^13.1.1",
     "@testing-library/react-hooks": "^8.0.0",

package/src/components/autoSaveIndicator/index.tsx

@@ -17,7 +17,7 @@ export const AutoSaveIndicator: React.FC<AutoSaveIndicatorProps> = ({
   elements: {
     success = (
       <Message
-        key="autoSave.success"
+        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 />}
@@ -25,7 +25,7 @@ export const AutoSaveIndicator: React.FC<AutoSaveIndicatorProps> = ({
     ),
     error = (
       <Message
-        key="autoSave.error"
+        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 />}
@@ -33,7 +33,7 @@ export const AutoSaveIndicator: React.FC<AutoSaveIndicatorProps> = ({
     ),
     loading = (
       <Message
-        key="autoSave.loading"
+        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 />}
@@ -41,7 +41,7 @@ export const AutoSaveIndicator: React.FC<AutoSaveIndicatorProps> = ({
     ),
     idle = (
       <Message
-        key="autoSave.idle"
+        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 />}
@@ -63,11 +63,11 @@ export const AutoSaveIndicator: React.FC<AutoSaveIndicatorProps> = ({
 };
 
 const Message = ({
-  key,
+  translationKey,
   defaultMessage,
   icon,
 }: {
-  key: string;
+  translationKey: string;
   defaultMessage: string;
   icon: React.ReactNode;
 }) => {
@@ -82,7 +82,7 @@ const Message = ({
         fontSize: ".8rem",
       }}
     >
-      {translate(key, defaultMessage)}
+      {translate(translationKey, defaultMessage)}
       <span style={{ marginLeft: ".2rem" }}>{icon}</span>
     </Typography.Text>
   );

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

@@ -74,7 +74,7 @@ export const Sider: React.FC<RefineLayoutSiderProps> = ({
         return (
           <CanAccess
             key={item.key}
-            resource={name.toLowerCase()}
+            resource={name}
             action="list"
             params={{
               resource: item,
@@ -99,7 +99,7 @@ export const Sider: React.FC<RefineLayoutSiderProps> = ({
       return (
         <CanAccess
           key={item.key}
-          resource={name.toLowerCase()}
+          resource={name}
           action="list"
           params={{
             resource: item,

package/src/components/pageHeader/index.tsx

@@ -1,22 +1,25 @@
-import React, { type FC } from "react";
+import React, { useContext, type FC } from "react";
 import {
   PageHeader as AntdPageHeader,
   type PageHeaderProps as AntdPageHeaderProps,
 } from "@ant-design/pro-layout";
-import { Button, Typography } from "antd";
-import { ArrowLeftOutlined } from "@ant-design/icons";
+import { Button, ConfigProvider, Typography } from "antd";
+import { ArrowLeftOutlined, ArrowRightOutlined } from "@ant-design/icons";
 import { RefinePageHeaderClassNames } from "@refinedev/ui-types";
 
 export type PageHeaderProps = AntdPageHeaderProps;
 
 export const PageHeader: FC<AntdPageHeaderProps> = ({ children, ...props }) => {
+  const direction = useContext(ConfigProvider.ConfigContext)?.direction;
+  const renderBackButton = () => {
+    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 =
-    typeof props.backIcon === "undefined" ? (
-      // @ts-expect-error Ant Design Icon's v5.0.1 has an issue with @types/react@^18.2.66
-      <Button type="text" icon={<ArrowLeftOutlined />} />
-    ) : (
-      props.backIcon
-    );
+    typeof props.backIcon === "undefined" ? renderBackButton() : props.backIcon;
 
   const title =
     typeof props.title === "string" ? (

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

@@ -80,7 +80,7 @@ export const ThemedSider: React.FC<RefineThemedLayoutSiderProps> = ({
         return (
           <CanAccess
             key={item.key}
-            resource={name.toLowerCase()}
+            resource={name}
             action="list"
             params={{
               resource: item,
@@ -106,7 +106,7 @@ export const ThemedSider: React.FC<RefineThemedLayoutSiderProps> = ({
       return (
         <CanAccess
           key={item.key}
-          resource={name.toLowerCase()}
+          resource={name}
           action="list"
           params={{
             resource: item,

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

@@ -1,5 +1,13 @@
-import React from "react";
-import { Layout, Menu, Grid, Drawer, Button, theme } from "antd";
+import React, { useContext } from "react";
+import {
+  Layout,
+  Menu,
+  Grid,
+  Drawer,
+  Button,
+  theme,
+  ConfigProvider,
+} from "antd";
 import {
   DashboardOutlined,
   LogoutOutlined,
@@ -46,6 +54,7 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
   } = useThemedLayoutContext();
 
   const isExistAuthentication = useIsExistAuthentication();
+  const direction = useContext(ConfigProvider.ConfigContext)?.direction;
   const routerType = useRouterType();
   const NewLink = useLink();
   const { warnWhen, setWarnWhen } = useWarnAboutChange();
@@ -84,7 +93,7 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
         return (
           <CanAccess
             key={item.key}
-            resource={name.toLowerCase()}
+            resource={name}
             action="list"
             params={{
               resource: item,
@@ -113,7 +122,7 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
       return (
         <CanAccess
           key={item.key}
-          resource={name.toLowerCase()}
+          resource={name}
           action="list"
           params={{
             resource: item,
@@ -282,6 +291,15 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
     siderStyles.height = "100vh";
     siderStyles.zIndex = 999;
   }
+  const renderClosingIcons = () => {
+    const iconProps = { style: { color: token.colorPrimary } };
+    const OpenIcon = direction === "rtl" ? RightOutlined : LeftOutlined;
+    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} />;
+  };
 
   return (
     <>
@@ -314,21 +332,7 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
               backgroundColor: token.colorBgElevated,
             }}
           >
-            {siderCollapsed ? (
-              // @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,
-                }}
-              />
-            )}
+            {renderClosingIcons()}
           </Button>
         }
       >

package/src/hooks/fields/useCheckboxGroup/index.ts

@@ -63,6 +63,7 @@ export const useCheckboxGroup = <
   pagination,
   liveMode,
   defaultValue,
+  selectedOptionsOrder,
   onLiveEvent,
   liveParams,
   meta,
@@ -90,6 +91,7 @@ export const useCheckboxGroup = <
     pagination,
     liveMode,
     defaultValue,
+    selectedOptionsOrder,
     onLiveEvent,
     liveParams,
     meta: pickNotDeprecated(meta, metaData),

package/src/hooks/fields/useRadioGroup/index.ts

@@ -60,6 +60,7 @@ export const useRadioGroup = <
   pagination,
   liveMode,
   defaultValue,
+  selectedOptionsOrder,
   onLiveEvent,
   liveParams,
   meta,
@@ -86,6 +87,7 @@ export const useRadioGroup = <
     pagination,
     liveMode,
     defaultValue,
+    selectedOptionsOrder,
     onLiveEvent,
     liveParams,
     meta: pickNotDeprecated(meta, metaData),

package/src/hooks/form/useDrawerForm/useDrawerForm.ts

@@ -1,5 +1,4 @@
 import React, { useCallback } from "react";
-import type { UseFormConfig } from "sunflower-antd";
 import type { FormInstance, FormProps, DrawerProps, ButtonProps } from "antd";
 import {
   useTranslate,
@@ -20,7 +19,7 @@ import {
 import { useForm, type UseFormProps, type UseFormReturnType } from "../useForm";
 import type { DeleteButtonProps } from "../../../components";
 
-export interface UseDrawerFormConfig extends UseFormConfig {
+export interface UseDrawerFormConfig {
   action: "show" | "edit" | "create" | "clone";
 }
 

package/src/hooks/form/useForm.ts

@@ -5,7 +5,7 @@ import {
   Form,
   type ButtonProps,
 } from "antd";
-import { useForm as useFormSF } from "sunflower-antd";
+import { useForm as useFormSF, type UseFormConfig } from "sunflower-antd";
 import {
   type AutoSaveProps,
   flattenObjectKeys,
@@ -52,7 +52,8 @@ export type UseFormProps<
    * @see {@link https://refine.dev/docs/advanced-tutorials/forms/server-side-form-validation/}
    */
   disableServerSideValidation?: boolean;
-} & AutoSaveProps<TVariables>;
+} & AutoSaveProps<TVariables> &
+  Pick<UseFormConfig, "defaultFormValues">;
 
 export type UseFormReturnType<
   TQueryFnData extends BaseRecord = BaseRecord,
@@ -77,7 +78,10 @@ export type UseFormReturnType<
   onFinish: (
     values?: TVariables,
   ) => Promise<CreateResponse<TResponse> | UpdateResponse<TResponse> | void>;
-};
+} & Pick<
+    ReturnType<typeof useFormSF<TResponse, TVariables>>,
+    "defaultFormValuesLoading"
+  >;
 
 /**
  * `useForm` is used to manage forms. It uses Ant Design {@link https://ant.design/components/form/ Form} data scope management under the hood and returns the required props for managing the form actions.
@@ -128,6 +132,7 @@ export const useForm = <
   id: idFromProps,
   overtimeOptions,
   optimisticUpdateMap,
+  defaultFormValues,
   disableServerSideValidation: disableServerSideValidationProp = false,
 }: UseFormProps<
   TQueryFnData,
@@ -153,6 +158,7 @@ export const useForm = <
   const [formAnt] = Form.useForm();
   const formSF = useFormSF<TResponse, TVariables>({
     form: formAnt,
+    defaultFormValues,
   });
   const { form } = formSF;
 
@@ -264,6 +270,8 @@ export const useForm = <
   const warnWhenUnsavedChanges =
     warnWhenUnsavedChangesProp ?? warnWhenUnsavedChangesRefine;
 
+  // populate form with data when queryResult is ready or id changes
+  // form populated via initialValues prop
   React.useEffect(() => {
     form.resetFields();
   }, [queryResult?.data?.data, id]);
@@ -310,6 +318,7 @@ export const useForm = <
       initialValues: queryResult?.data?.data,
     },
     saveButtonProps,
+    defaultFormValuesLoading: formSF.defaultFormValuesLoading,
     ...useFormCoreResult,
     onFinish: async (values?: TVariables) => {
       return await onFinish(values ?? formSF.form.getFieldsValue(true));