chore(Dialog): rename unreleased API (#10783)

packages/vant/docs/markdown/migrate-from-v3.zh-CN.md

@@ -66,7 +66,7 @@ Area 组件是基于 Picker 组件进行封装的，因此本次升级也对 Are
 
 在 Vant 3 中，`Dialog` 是一个函数，调用函数可以快速唤起全局的弹窗组件，而 `Dialog.Component` 才是 `Dialog` 组件对象，这与大部分组件的用法存在差异，容易导致使用错误。
 
-为了更符合直觉，我们在 Vant 4 中调整了 `Dialog` 的调用方式，将 `Dialog()` 函数重命名为 `openDialog()`。
+为了更符合直觉，我们在 Vant 4 中调整了 `Dialog` 的调用方式，将 `Dialog()` 函数重命名为 `showDialog()`。
 
 ```js
 // Vant 3
@@ -74,17 +74,17 @@ Dialog(); // 函数调用
 Dialog.Component; // 组件对象
 
 // Vant 4
-openDialog(); // 函数调用
+showDialog(); // 函数调用
 Dialog; // 组件对象
 ```
 
 `Dialog` 上挂载的其他方法也进行了重命名，新旧 API 的映射关系如下：
 
 ```js
-Dialog(); // -> openDialog()
-Dialog.alert(); // -> openDialog()
-Dialog.confirm(); // -> openConfirmDialog()
-Dialog.close(); // -> closeDialog();
+Dialog(); // -> showDialog()
+Dialog.alert(); // -> showDialog()
+Dialog.confirm(); // -> showConfirmDialog()
+Dialog.close(); // -> hideDialog();
 Dialog.setDefaultOptions(); // -> setDialogDefaultOptions()
 Dialog.resetDefaultOptions(); // -> resetDialogDefaultOptions()
 ```
@@ -107,15 +107,15 @@ export default {
 如果需要全局方法，可以手动在 `app` 对象上注册：
 
 ```js
-import { openDialog } from 'vant';
+import { showDialog } from 'vant';
 
 // 注册 $dialog 方法
-app.config.globalProperties.$dialog = openDialog;
+app.config.globalProperties.$dialog = showDialog;
 
 // 添加 TS 类型定义
 declare module '@vue/runtime-core' {
   interface ComponentCustomProperties {
-    $dialog: typeof openDialog;
+    $dialog: typeof showDialog;
   }
 }
 ```

packages/vant/src/dialog/README.md

@@ -20,12 +20,12 @@ app.use(Dialog);
 
 Vant provides some utility functions that can quickly evoke global `Dialog` components.
 
-For example, calling the `openDialog` function will render a Dialog directly in the page.
+For example, calling the `showDialog` function will render a Dialog directly in the page.
 
 ```js
-import { openDialog } from 'vant';
+import { showDialog } from 'vant';
 
-openDialog({ message: 'Content' });
+showDialog({ message: 'Content' });
 ```
 
 ## Usage
@@ -35,14 +35,14 @@ openDialog({ message: 'Content' });
 Used to prompt for some messages, only including one confirm button.
 
 ```js
-openDialog({
+showDialog({
   title: 'Title',
   message: 'Content',
 }).then(() => {
   // on close
 });
 
-openDialog({
+showDialog({
   message: 'Content',
 }).then(() => {
   // on close
@@ -54,7 +54,7 @@ openDialog({
 Used to confirm some messages, including a confirm button and a cancel button.
 
 ```js
-openConfirmDialog({
+showConfirmDialog({
   title: 'Title',
   message: 'Content',
 })
@@ -71,7 +71,7 @@ openConfirmDialog({
 Use round button style.
 
 ```js
-openDialog({
+showDialog({
   title: 'Title',
   message: 'Content',
   theme: 'round-button',
@@ -79,7 +79,7 @@ openDialog({
   // on close
 });
 
-openDialog({
+showDialog({
   message: 'Content',
   theme: 'round-button',
 }).then(() => {
@@ -97,7 +97,7 @@ const beforeClose = (action) =>
     }, 1000);
   });
 
-openConfirmDialog({
+showConfirmDialog({
   title: 'Title',
   message: 'Content',
   beforeClose,
@@ -131,9 +131,9 @@ export default {
 
 | Name | Description | Attribute | Return value |
 | --- | --- | --- | --- |
-| openDialog | Show dialog | _options: DialogOptions_ | `Promise<void>` |
-| openConfirmDialog | Show confirm dialog | _options: DialogOptions_ | `Promise<void>` |
-| closeDialog | Close dialog | - | `void` |
+| showDialog | Show dialog | _options: DialogOptions_ | `Promise<void>` |
+| showConfirmDialog | Show confirm dialog | _options: DialogOptions_ | `Promise<void>` |
+| hideDialog | Close dialog | - | `void` |
 | setDialogDefaultOptions | Set default options of all dialogs | _options: DialogOptions_ | `void` |
 | resetDialogDefaultOptions | Reset default options of all dialogs | - | `void` |
 

packages/vant/src/dialog/README.zh-CN.md

@@ -20,12 +20,12 @@ app.use(Dialog);
 
 为了便于使用 `Dialog`，Vant 提供了一系列辅助函数，通过辅助函数可以快速唤起全局的弹窗组件。
 
-比如使用 `openDialog` 函数，调用后会直接在页面中渲染对应的弹出框。
+比如使用 `showDialog` 函数，调用后会直接在页面中渲染对应的弹出框。
 
 ```js
-import { openDialog } from 'vant';
+import { showDialog } from 'vant';
 
-openDialog({ message: '提示' });
+showDialog({ message: '提示' });
 ```
 
 ## 代码演示
@@ -35,16 +35,16 @@ openDialog({ message: '提示' });
 用于提示一些消息，只包含一个确认按钮。
 
 ```js
-import { openDialog } from 'vant';
+import { showDialog } from 'vant';
 
-openDialog({
+showDialog({
   title: '标题',
   message: '代码是写出来给人看的，附带能在机器上运行。',
 }).then(() => {
   // on close
 });
 
-openDialog({
+showDialog({
   message: '生命远不止连轴转和忙到极限，人类的体验远比这辽阔、丰富得多。',
 }).then(() => {
   // on close
@@ -56,9 +56,9 @@ openDialog({
 用于确认消息，包含取消和确认按钮。
 
 ```js
-import { openConfirmDialog } from 'vant';
+import { showConfirmDialog } from 'vant';
 
-openConfirmDialog({
+showConfirmDialog({
   title: '标题',
   message:
     '如果解决方法是丑陋的，那就肯定还有更好的解决方法，只是还没有发现而已。',
@@ -76,9 +76,9 @@ openConfirmDialog({
 将 theme 选项设置为 `round-button` 可以展示圆角按钮风格的弹窗。
 
 ```js
-import { openDialog } from 'vant';
+import { showDialog } from 'vant';
 
-openDialog({
+showDialog({
   title: '标题',
   message: '代码是写出来给人看的，附带能在机器上运行。',
   theme: 'round-button',
@@ -86,7 +86,7 @@ openDialog({
   // on close
 });
 
-openDialog({
+showDialog({
   message: '生命远不止连轴转和忙到极限，人类的体验远比这辽阔、丰富得多。',
   theme: 'round-button',
 }).then(() => {
@@ -99,7 +99,7 @@ openDialog({
 通过 `beforeClose` 属性可以传入一个回调函数，在弹窗关闭前进行特定操作。
 
 ```js
-import { openConfirmDialog } from 'vant';
+import { showConfirmDialog } from 'vant';
 
 const beforeClose = (action) =>
   new Promise((resolve) => {
@@ -113,7 +113,7 @@ const beforeClose = (action) =>
     }, 1000);
   });
 
-openConfirmDialog({
+showConfirmDialog({
   title: '标题',
   message:
     '如果解决方法是丑陋的，那就肯定还有更好的解决方法，只是还没有发现而已。',
@@ -148,11 +148,11 @@ export default {
 
 | 方法名 | 说明 | 参数 | 返回值 |
 | --- | --- | --- | --- |
-| openDialog | 展示弹窗 | _options: DialogOptions_ | `Promise<void>` |
-| openConfirmDialog | 展示消息确认弹窗 | _options: DialogOptions_ | `Promise<void>` |
-| closeDialog | 关闭弹窗 | - | `void` |
-| setDialogDefaultOptions | 修改默认配置，影响所有的 `openDialog` 调用 | _options: DialogOptions_ | `void` |
-| resetDialogDefaultOptions | 重置默认配置，影响所有的 `openDialog` 调用 | - | `void` |
+| showDialog | 展示弹窗 | _options: DialogOptions_ | `Promise<void>` |
+| showConfirmDialog | 展示消息确认弹窗 | _options: DialogOptions_ | `Promise<void>` |
+| hideDialog | 关闭弹窗 | - | `void` |
+| setDialogDefaultOptions | 修改默认配置，影响所有的 `showDialog` 调用 | _options: DialogOptions_ | `void` |
+| resetDialogDefaultOptions | 重置默认配置，影响所有的 `showDialog` 调用 | - | `void` |
 
 ### DialogOptions
 

packages/vant/src/dialog/demo/index.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import VanCell from '../../cell';
-import { openDialog, openConfirmDialog, Dialog as VanDialog } from '..';
+import { showDialog, showConfirmDialog, Dialog as VanDialog } from '..';
 import { ref } from 'vue';
 import { cdnURL, useTranslate } from '../../../docs/site';
 import type { DialogAction } from '../types';
@@ -37,20 +37,20 @@ const show = ref(false);
 const image = cdnURL('apple-3.jpeg');
 
 const onClickAlert = () => {
-  openDialog({
+  showDialog({
     title: t('title'),
     message: t('content1'),
   });
 };
 
 const onClickAlert2 = () => {
-  openDialog({
+  showDialog({
     message: t('content2'),
   });
 };
 
 const onClickRound = () => {
-  openDialog({
+  showDialog({
     theme: 'round-button',
     title: t('title'),
     message: t('content1'),
@@ -58,14 +58,14 @@ const onClickRound = () => {
 };
 
 const onClickRound2 = () => {
-  openDialog({
+  showDialog({
     theme: 'round-button',
     message: t('content2'),
   });
 };
 
 const onClickConfirm = () => {
-  openConfirmDialog({
+  showConfirmDialog({
     title: t('title'),
     message: t('content3'),
   });
@@ -77,7 +77,7 @@ const onClickBeforeClose = () => {
       setTimeout(() => resolve(action === 'confirm'), 1000);
     });
 
-  openConfirmDialog({
+  showConfirmDialog({
     title: t('title'),
     message: t('content3'),
     beforeClose,

packages/vant/src/dialog/function-call.tsx

@@ -46,7 +46,7 @@ function initInstance() {
   ({ instance } = mountComponent(Wrapper));
 }
 
-export function openDialog(options: DialogOptions) {
+export function showDialog(options: DialogOptions) {
   /* istanbul ignore if */
   if (!inBrowser) {
     return Promise.resolve();
@@ -75,10 +75,10 @@ export const resetDialogDefaultOptions = () => {
   currentOptions = extend({}, DEFAULT_OPTIONS);
 };
 
-export const openConfirmDialog = (options: DialogOptions) =>
-  openDialog(extend({ showCancelButton: true }, options));
+export const showConfirmDialog = (options: DialogOptions) =>
+  showDialog(extend({ showCancelButton: true }, options));
 
-export const closeDialog = () => {
+export const hideDialog = () => {
   if (instance) {
     instance.toggle(false);
   }

packages/vant/src/dialog/index.ts

@@ -4,9 +4,9 @@ import _Dialog from './Dialog';
 export const Dialog = withInstall(_Dialog);
 export default Dialog;
 export {
-  openDialog,
-  closeDialog,
-  openConfirmDialog,
+  showDialog,
+  hideDialog,
+  showConfirmDialog,
   setDialogDefaultOptions,
   resetDialogDefaultOptions,
 } from './function-call';

packages/vant/src/dialog/test/function-call.jsx

@@ -1,7 +1,7 @@
 import { later } from '../../../test';
 import {
-  openDialog,
-  closeDialog,
+  showDialog,
+  hideDialog,
   setDialogDefaultOptions,
   resetDialogDefaultOptions,
 } from '../function-call';
@@ -10,21 +10,21 @@ test('should update default options when calling setDefaultOptions method', () =
   const wrapper = document.createElement('div');
 
   setDialogDefaultOptions({ message: 'foo', teleport: wrapper, });
-  openDialog();
+  showDialog();
   await later();
   const dialog = wrapper.querySelector('.van-dialog');
   expect(dialog.innerHTML.includes('foo')).toBeTruthy();
 
   resetDialogDefaultOptions();
-  openDialog({ teleport: wrapper });
+  showDialog({ teleport: wrapper });
   await later();
   const dialog2 = wrapper.querySelector('.van-dialog');
   expect(dialog2.innerHTML.includes('foo')).toBeFalsy();
 });
 
-test('should render dialog after calling openDialog', async () => {
+test('should render dialog after calling showDialog', async () => {
   const wrapper = document.createElement('div');
-  openDialog({
+  showDialog({
     message: '1',
     teleport: wrapper,
   });
@@ -34,9 +34,9 @@ test('should render dialog after calling openDialog', async () => {
   expect(dialog).toBeTruthy();
 });
 
-test('should close dialog after calling closeDialog', async () => {
+test('should close dialog after calling hideDialog', async () => {
   const wrapper = document.createElement('div');
-  openDialog({
+  showDialog({
     message: '1',
     teleport: wrapper,
   });
@@ -45,7 +45,7 @@ test('should close dialog after calling closeDialog', async () => {
   const dialog = wrapper.querySelector('.van-dialog');
   expect(dialog.style.display).toEqual('');
 
-  closeDialog();
+  hideDialog();
   await later();
   expect(dialog.className.split(' ')).toContain(
     'van-dialog-bounce-leave-active'
@@ -54,7 +54,7 @@ test('should close dialog after calling closeDialog', async () => {
 
 test('should allow to render JSX message', async () => {
   const wrapper = document.createElement('div');
-  openDialog({
+  showDialog({
     message: () => <div>foo</div>,
     teleport: wrapper,
   });

packages/vant/src/swipe-cell/README.md

@@ -77,7 +77,7 @@ app.use(SwipeCell);
 ```
 
 ```js
-import { openConfirmDialog } from 'vant';
+import { showConfirmDialog } from 'vant';
 
 export default {
   setup() {
@@ -89,7 +89,7 @@ export default {
           return true;
         case 'right':
           return new Promise((resolve) => {
-            openConfirmDialog({
+            showConfirmDialog({
               title: 'Are you sure to delete?',
             }).then(resolve);
           });

packages/vant/src/swipe-cell/README.zh-CN.md

@@ -83,7 +83,7 @@ app.use(SwipeCell);
 ```
 
 ```js
-import { openConfirmDialog } from 'vant';
+import { showConfirmDialog } from 'vant';
 
 export default {
   setup() {
@@ -96,7 +96,7 @@ export default {
           return true;
         case 'right':
           return new Promise((resolve) => {
-            openConfirmDialog({
+            showConfirmDialog({
               title: '确定删除吗？',
             }).then(resolve);
           });

packages/vant/src/swipe-cell/demo/index.vue

@@ -4,7 +4,7 @@ import VanButton from '../../button';
 import VanCell from '../../cell';
 import VanCard from '../../card';
 import { cdnURL, useTranslate } from '../../../docs/site';
-import { openConfirmDialog } from '../../dialog';
+import { showConfirmDialog } from '../../dialog';
 
 const t = useTranslate({
   'zh-CN': {
@@ -39,7 +39,7 @@ const beforeClose = ({ position }: { position: string }) => {
       return true;
     case 'right':
       return new Promise<boolean>((resolve) => {
-        openConfirmDialog({
+        showConfirmDialog({
           title: t('confirm'),
         }).then(() => {
           resolve(true);

packages/vant/src/switch/README.md

@@ -100,13 +100,13 @@ Using `node` slot to custom the content of the node.
 
 ```js
 import { ref } from 'vue';
-import { openConfirmDialog } from 'vant';
+import { showConfirmDialog } from 'vant';
 
 export default {
   setup() {
     const checked = ref(true);
     const onUpdateValue = (newValue) => {
-      openConfirmDialog({
+      showConfirmDialog({
         title: 'Confirm',
         message: 'Are you sure to toggle switch?',
       }).then(() => {

packages/vant/src/switch/README.zh-CN.md

@@ -112,13 +112,13 @@ export default {
 
 ```js
 import { ref } from 'vue';
-import { openConfirmDialog } from 'vant';
+import { showConfirmDialog } from 'vant';
 
 export default {
   setup() {
     const checked = ref(true);
     const onUpdateValue = (newValue) => {
-      openConfirmDialog({
+      showConfirmDialog({
         title: '提醒',
         message: '是否切换开关？',
       }).then(() => {

packages/vant/src/switch/demo/index.vue

@@ -4,7 +4,7 @@ import VanCell from '../../cell';
 import VanIcon from '../../icon';
 import { ref } from 'vue';
 import { useTranslate } from '../../../docs/site';
-import { openConfirmDialog } from '../../dialog';
+import { showConfirmDialog } from '../../dialog';
 
 const t = useTranslate({
   'zh-CN': {
@@ -36,7 +36,7 @@ const checked4 = ref(true);
 const checked5 = ref(true);
 
 const onUpdateValue = (checked: boolean) => {
-  openConfirmDialog({
+  showConfirmDialog({
     title: t('title'),
     message: t('message'),
   }).then(() => {