types(CheckboxGroup): add CheckboxGroupInstance type (#9142)

src/checkbox-group/CheckboxGroup.tsx

@@ -4,11 +4,18 @@ import {
   InjectionKey,
   defineComponent,
   ExtractPropTypes,
+  ComponentPublicInstance,
 } from 'vue';
+
+// Utils
 import { createNamespace } from '../utils';
+
+// Composables
 import { useChildren } from '@vant/use';
 import { useExpose } from '../composables/use-expose';
 import { useLinkField } from '../composables/use-link-field';
+
+// Types
 import { CheckerParent, CheckerDirection } from '../checkbox/Checker';
 
 const [name, bem] = createNamespace('checkbox-group');
@@ -32,8 +39,19 @@ export type CheckboxGroupToggleAllOptions =
       skipDisabled?: boolean;
     };
 
+type CheckboxGroupProps = ExtractPropTypes<typeof props>;
+
+type CheckboxGroupExpose = {
+  toggleAll: (options?: CheckboxGroupToggleAllOptions) => void;
+};
+
+export type CheckboxGroupInstance = ComponentPublicInstance<
+  CheckboxGroupProps,
+  CheckboxGroupExpose
+>;
+
 export type CheckboxGroupProvide = CheckerParent & {
-  props: ExtractPropTypes<typeof props>;
+  props: CheckboxGroupProps;
   updateValue: (value: unknown[]) => void;
 };
 
@@ -79,7 +97,7 @@ export default defineComponent({
       (value) => emit('change', value)
     );
 
-    useExpose({ toggleAll });
+    useExpose<CheckboxGroupExpose>({ toggleAll });
     useLinkField(() => props.modelValue);
     linkChildren({
       props,

src/checkbox-group/index.ts

@@ -5,4 +5,7 @@ const CheckboxGroup = withInstall<typeof _CheckboxGroup>(_CheckboxGroup);
 
 export default CheckboxGroup;
 export { CheckboxGroup };
-export type { CheckboxGroupToggleAllOptions } from './CheckboxGroup';
+export type {
+  CheckboxGroupInstance,
+  CheckboxGroupToggleAllOptions,
+} from './CheckboxGroup';

src/checkbox/README.md

@@ -329,15 +329,17 @@ Use [ref](https://v3.vuejs.org/guide/component-template-refs.html) to get Checkb
 
 ### Types
 
-Get the type definition of the Checkbox instance through `CheckboxInstance`.
+Get the type definition of the Checkbox instance through `CheckboxInstance` and `CheckboxGroupInstance`.
 
 ```ts
 import { ref } from 'vue';
-import type { CheckboxInstance } from 'vant';
+import type { CheckboxInstance, CheckboxGroupInstance } from 'vant';
 
 const checkboxRef = ref<CheckboxInstance>();
+const checkboxGroupRef = ref<CheckboxGroupInstance>();
 
 checkboxRef.value?.toggle();
+checkboxGroupRef.value?.toggleAll();
 ```
 
 ### CSS Variables

src/checkbox/README.zh-CN.md

@@ -345,17 +345,19 @@ checkboxGroup.toggleAll({
 | --- | --- | --- | --- |
 | toggle | 切换选中状态，传 `true` 为选中，`false` 为取消选中，不传参为取反 | _checked?: boolean_ | - |
 
-### Checkbox 类型定义
+### 类型定义
 
-通过 `CheckboxInstance` 获取 Checkbox 实例的类型定义。
+通过 `CheckboxInstance` 和 `CheckboxGroupInstance` 获取 Checkbox 实例的类型定义。
 
 ```ts
 import { ref } from 'vue';
-import type { CheckboxInstance } from 'vant';
+import type { CheckboxInstance, CheckboxGroupInstance } from 'vant';
 
 const checkboxRef = ref<CheckboxInstance>();
+const checkboxGroupRef = ref<CheckboxGroupInstance>();
 
 checkboxRef.value?.toggle();
+checkboxGroupRef.value?.toggleAll();
 ```
 
 ### 样式变量