Merge branch 'dev' into next

src/action-sheet/test/__snapshots__/index.spec.js.snap

@@ -16,6 +16,12 @@ exports[`close-icon prop 1`] = `
 </div>
 `;
 
+exports[`closeable prop 1`] = `
+<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" name="van-popup-slide-bottom">
+  <div class="van-action-sheet__header">Title</div>
+</div>
+`;
+
 exports[`color option 1`] = `<div class="van-popup van-popup--round van-popup--bottom van-popup--safe-area-inset-bottom van-action-sheet" name="van-popup-slide-bottom"><button type="button" class="van-action-sheet__item" style="color: red;"><span class="van-action-sheet__name">Option</span></button></div>`;
 
 exports[`description prop 1`] = `

src/collapse-item/index.js

@@ -1,7 +1,7 @@
 import { ref, watch, computed, nextTick } from 'vue';
 
 // Utils
-import { createNamespace, isDef } from '../utils';
+import { createNamespace } from '../utils';
 import { raf, doubleRaf } from '../utils/dom/raf';
 
 // Composition
@@ -31,9 +31,7 @@ export default createComponent({
     const contentRef = ref();
     const { parent, index } = useParent(COLLAPSE_KEY);
 
-    const currentName = computed(() =>
-      isDef(props.name) ? props.name : index.value
-    );
+    const currentName = computed(() => props.name ?? index.value);
 
     const expanded = computed(() => {
       if (parent) {

src/picker/index.js

@@ -1,5 +1,5 @@
 // Utils
-import { createNamespace, isDef } from '../utils';
+import { createNamespace } from '../utils';
 import { preventDefault } from '../utils/dom/event';
 import { BORDER_UNSET_TOP_BOTTOM } from '../utils/constant';
 import { pickerProps, DEFAULT_ITEM_HEIGHT } from './shared';
@@ -90,9 +90,7 @@ export default createComponent({
       let cursor = { children: this.columns };
 
       while (cursor && cursor.children) {
-        const defaultIndex = isDef(cursor.defaultIndex)
-          ? cursor.defaultIndex
-          : +this.defaultIndex;
+        const defaultIndex = cursor.defaultIndex ?? +this.defaultIndex;
 
         formatted.push({
           values: cursor.children,
@@ -313,9 +311,7 @@ export default createComponent({
           allowHtml={this.allowHtml}
           className={item.className}
           itemHeight={this.itemPxHeight}
-          defaultIndex={
-            isDef(item.defaultIndex) ? item.defaultIndex : +this.defaultIndex
-          }
+          defaultIndex={item.defaultIndex ?? +this.defaultIndex}
           swipeDuration={this.swipeDuration}
           visibleItemCount={this.visibleItemCount}
           initialOptions={item.values}

src/progress/index.js

@@ -1,5 +1,5 @@
 import { ref, watch, computed, nextTick, reactive, onMounted } from 'vue';
-import { createNamespace, isDef, addUnit } from '../utils';
+import { createNamespace, addUnit } from '../utils';
 
 const [createComponent, bem] = createNamespace('progress');
 
@@ -46,7 +46,7 @@ export default createComponent({
     const renderPivot = () => {
       const { rootWidth, pivotWidth } = state;
       const { textColor, pivotText, pivotColor, percentage } = props;
-      const text = isDef(pivotText) ? pivotText : percentage + '%';
+      const text = pivotText ?? percentage + '%';
       const show = props.showPivot && text;
 
       if (show) {

src/share-sheet/index.js

@@ -1,5 +1,5 @@
 // Utils
-import { createNamespace, isDef, pick } from '../utils';
+import { createNamespace, pick } from '../utils';
 
 // Components
 import Popup, { popupSharedProps } from '../popup';
@@ -102,7 +102,7 @@ export default createComponent({
     };
 
     const renderCancelText = () => {
-      const text = isDef(props.cancelText) ? props.cancelText : t('cancel');
+      const text = props.cancelText ?? t('cancel');
       if (text) {
         return (
           <button type="button" class={bem('cancel')} onClick={onCancel}>

src/stepper/index.js

@@ -82,9 +82,7 @@ export default createComponent({
   ],
 
   data() {
-    const defaultValue = isDef(this.modelValue)
-      ? this.value
-      : this.defaultValue;
+    const defaultValue = this.modelValue ?? this.defaultValue;
     const value = this.format(defaultValue);
 
     if (!equal(value, this.modelValue)) {

src/tab/index.js

@@ -1,4 +1,4 @@
-import { isDef, createNamespace } from '../utils';
+import { createNamespace } from '../utils';
 import { ChildrenMixin } from '../mixins/relation';
 import { routeProps } from '../composition/use-route';
 
@@ -25,7 +25,7 @@ export default createComponent({
 
   computed: {
     computedName() {
-      return isDef(this.name) ? this.name : this.index;
+      return this.name ?? this.index;
     },
 
     isActive() {

src/utils/index.ts

@@ -6,7 +6,7 @@ export function noop() {}
 
 export const inBrowser = typeof window !== 'undefined';
 
-export function isDef(val: unknown): boolean {
+export function isDef<T>(val: T): val is NonNullable<T> {
   return val !== undefined && val !== null;
 }
 
@@ -28,7 +28,7 @@ export function get(object: any, path: string): any {
   let result = object;
 
   keys.forEach((key) => {
-    result = isDef(result[key]) ? result[key] : '';
+    result = result[key] ?? '';
   });
 
   return result;