feat: rewrite config with hook and add rtl config (#23759)

* feat: rewrite config with hook and add rtl config

* fix import

* fix lint

components/config-provider/index.tsx

@@ -9,6 +9,8 @@ import LocaleProvider, { Locale, ANT_MARK } from '../locale-provider';
 import LocaleReceiver from '../locale-provider/LocaleReceiver';
 import { ConfigConsumer, ConfigContext, CSPConfig, ConfigConsumerProps } from './context';
 import { SizeType, SizeContextProvider } from './SizeContext';
+import message from '../message';
+import notification from '../notification';
 
 export { RenderEmptyHandler, ConfigContext, ConfigConsumer, CSPConfig, ConfigConsumerProps };
 
@@ -49,10 +51,21 @@ export interface ConfigProviderProps {
   };
 }
 
-class ConfigProvider extends React.Component<ConfigProviderProps> {
-  getPrefixClsWrapper = (context: ConfigConsumerProps) => {
+const ConfigProvider: React.FC<ConfigProviderProps> = props => {
+  React.useEffect(() => {
+    if (props.direction) {
+      message.config({
+        rtl: props.direction === 'rtl',
+      });
+      notification.config({
+        rtl: props.direction === 'rtl',
+      });
+    }
+  }, [props.direction]);
+
+  const getPrefixClsWrapper = (context: ConfigConsumerProps) => {
     return (suffixCls: string, customizePrefixCls?: string) => {
-      const { prefixCls } = this.props;
+      const { prefixCls } = props;
 
       if (customizePrefixCls) return customizePrefixCls;
 
@@ -62,7 +75,7 @@ class ConfigProvider extends React.Component<ConfigProviderProps> {
     };
   };
 
-  renderProvider = (context: ConfigConsumerProps, legacyLocale: Locale) => {
+  const renderProvider = (context: ConfigConsumerProps, legacyLocale: Locale) => {
     const {
       children,
       getTargetContainer,
@@ -77,11 +90,11 @@ class ConfigProvider extends React.Component<ConfigProviderProps> {
       componentSize,
       direction,
       space,
-    } = this.props;
+    } = props;
 
     const config: ConfigConsumerProps = {
       ...context,
-      getPrefixCls: this.getPrefixClsWrapper(context),
+      getPrefixCls: getPrefixClsWrapper(context),
       csp,
       autoInsertSpaceInButton,
       locale: locale || legacyLocale,
@@ -136,17 +149,15 @@ class ConfigProvider extends React.Component<ConfigProviderProps> {
     );
   };
 
-  render() {
   return (
     <LocaleReceiver>
       {(_, __, legacyLocale) => (
         <ConfigConsumer>
-            {context => this.renderProvider(context, legacyLocale as Locale)}
+          {context => renderProvider(context, legacyLocale as Locale)}
         </ConfigConsumer>
       )}
     </LocaleReceiver>
   );
-  }
-}
+};
 
 export default ConfigProvider;