ant-design/e24dee00-async.1a05e66f.js

(("undefined"!=typeof globalThis?globalThis:self).makoChunk_antd=("undefined"!=typeof globalThis?globalThis:self).makoChunk_antd||[]).push([["e24dee00"],{e24dee00:function(e,a,n){"use strict";n.d(a,"__esModule",{value:!0}),n.d(a,"texts",{enumerable:!0,get:function(){return t;}}),n("1cb60770");let t=[{value:"Provide reset styles based on ",paraId:0,tocIndex:0},{value:".ant-app",paraId:0,tocIndex:0},{value:" element.",paraId:0,tocIndex:0},{value:"You could use static methods of ",paraId:0,tocIndex:0},{value:"message/notification/Modal",paraId:0,tocIndex:0},{value:" from ",paraId:0,tocIndex:0},{value:"useApp",paraId:0,tocIndex:0},{value:" without writing ",paraId:0,tocIndex:0},{value:"contextHolder",paraId:0,tocIndex:0},{value:" manually.",paraId:0,tocIndex:0},{value:"App provides upstream and downstream method calls through ",paraId:1,tocIndex:5},{value:"Context",paraId:1,tocIndex:5},{value:", because useApp needs to be used as a subcomponent, we recommend encapsulating App at the top level in the application.",paraId:1,tocIndex:5},{value:"import React from 'react';\nimport { App } from 'antd';\n\nconst MyPage: React.FC = () => {\n  const { message, notification, modal } = App.useApp();\n  message.success('Good!');\n  notification.info({ message: 'Good' });\n  modal.warning({ title: 'Good' });\n  // ....\n  // other message, notification, modal static function\n  return <div>Hello word</div>;\n};\n\nconst MyApp: React.FC = () => (\n  <App>\n    <MyPage />\n  </App>\n);\n\nexport default MyApp;\n",paraId:2,tocIndex:5},{value:"Note: App.useApp must be available under App.",paraId:3,tocIndex:5},{value:"The App component can only use the token in the ",paraId:4,tocIndex:6},{value:"ConfigProvider",paraId:4,tocIndex:6},{value:", if you need to use the Token, the ConfigProvider and the App component must appear in pairs.",paraId:4,tocIndex:6},{value:"<ConfigProvider theme={{ ... }}>\n  <App>\n    ...\n  </App>\n</ConfigProvider>\n",paraId:5,tocIndex:6},{value:"<App>\n  <Space>\n    ...\n    <App>...</App>\n  </Space>\n</App>\n",paraId:6,tocIndex:7},{value:"// Entry component\nimport { App } from 'antd';\nimport type { MessageInstance } from 'antd/es/message/interface';\nimport type { ModalStaticFunctions } from 'antd/es/modal/confirm';\nimport type { NotificationInstance } from 'antd/es/notification/interface';\n\nlet message: MessageInstance;\nlet notification: NotificationInstance;\nlet modal: Omit<ModalStaticFunctions, 'warn'>;\n\nexport default () => {\n  const staticFunction = App.useApp();\n  message = staticFunction.message;\n  modal = staticFunction.modal;\n  notification = staticFunction.notification;\n  return null;\n};\n\nexport { message, modal, notification };\n",paraId:7,tocIndex:8},{value:"// sub page\nimport React from 'react';\nimport { Button, Space } from 'antd';\n\nimport { message } from './store';\n\nexport default () => {\n  const showMessage = () => {\n    message.success('Success!');\n  };\n\n  return (\n    <Space>\n      <Button type=\"primary\" onClick={showMessage}>\n        Open message\n      </Button>\n    </Space>\n  );\n};\n",paraId:8,tocIndex:8},{value:"Common props ref\uFF1A",paraId:9,tocIndex:9},{value:"Common props",paraId:10,tocIndex:9},{value:"This component is available since ",paraId:11,tocIndex:9},{value:"antd@5.1.0",paraId:11,tocIndex:9},{value:".",paraId:11,tocIndex:9},{value:"Property",paraId:12,tocIndex:10},{value:"Description",paraId:12,tocIndex:10},{value:"Type",paraId:12,tocIndex:10},{value:"Default",paraId:12,tocIndex:10},{value:"Version",paraId:12,tocIndex:10},{value:"component",paraId:12,tocIndex:10},{value:"Config render element, if ",paraId:12,tocIndex:10},{value:"false",paraId:12,tocIndex:10},{value:" will not create DOM node",paraId:12,tocIndex:10},{value:"ComponentType | false",paraId:12,tocIndex:10},{value:"div",paraId:12,tocIndex:10},{value:"5.11.0",paraId:12,tocIndex:10},{value:"message",paraId:12,tocIndex:10},{value:"Global config for Message",paraId:12,tocIndex:10},{value:"MessageConfig",paraId:13,tocIndex:10},{value:"-",paraId:12,tocIndex:10},{value:"5.3.0",paraId:12,tocIndex:10},{value:"notification",paraId:12,tocIndex:10},{value:"Global config for Notification",paraId:12,tocIndex:10},{value:"NotificationConfig",paraId:14,tocIndex:10},{value:"-",paraId:12,tocIndex:10},{value:"5.3.0",paraId:12,tocIndex:10},{value:"<App component={false}>",paraId:15},{value:"Make sure the App ",paraId:16,tocIndex:13},{value:"component",paraId:16,tocIndex:13},{value:" is a legit React component string, so when you're turning on CSS variables, there's a container to hold the CSS class name.",paraId:16,tocIndex:13}];}}]);