types: reduce non-null assertion (#9355)

* types: reduce non-null assertion

* chore: upd

* chore: fix typing

src/address-edit/AddressEditDetail.tsx

@@ -41,9 +41,7 @@ export default defineComponent({
       emit('input', `${express.address || ''} ${express.name || ''}`.trim());
     };
 
-    const onFinish = () => {
-      field.value!.blur();
-    };
+    const onFinish = () => field.value?.blur();
 
     const renderFinish = () => {
       if (props.value && props.focused && android) {

src/area/Area.tsx

@@ -285,8 +285,10 @@ export default defineComponent({
       state.code = values[index].code;
       setValues();
 
-      const parsedValues = parseValues(pickerRef.value!.getValues());
-      emit('change', parsedValues, index);
+      if (pickerRef.value) {
+        const parsedValues = parseValues(pickerRef.value.getValues());
+        emit('change', parsedValues, index);
+      }
     };
 
     const onConfirm = (values: AreaColumnOption[], index: number) => {

src/calendar/CalendarMonth.tsx

@@ -94,12 +94,14 @@ export default defineComponent({
     const scrollIntoView = (body: Element) => {
       const el = props.showSubtitle ? daysRef.value : monthRef.value;
 
-      const scrollTop =
-        el!.getBoundingClientRect().top -
-        body.getBoundingClientRect().top +
-        body.scrollTop;
+      if (el) {
+        const scrollTop =
+          el.getBoundingClientRect().top -
+          body.getBoundingClientRect().top +
+          body.scrollTop;
 
-      setScrollTop(body, scrollTop);
+        setScrollTop(body, scrollTop);
+      }
     };
 
     const getMultipleDayType = (day: Date) => {

src/collapse-item/CollapseItem.tsx

@@ -61,8 +61,8 @@ export default defineComponent({
     const onTransitionEnd = () => {
       if (!expanded.value) {
         show.value = false;
-      } else {
-        wrapperRef.value!.style.height = '';
+      } else if (wrapperRef.value) {
+        wrapperRef.value.style.height = '';
       }
     };
 

src/composables/use-height.ts

@@ -4,11 +4,11 @@ import { Ref, ref, onMounted, nextTick } from 'vue';
 export const useHeight = (element: Element | Ref<Element | undefined>) => {
   const height = ref<number>();
 
-  onMounted(() => {
+  onMounted(() =>
     nextTick(() => {
       height.value = useRect(element).height;
-    });
-  });
+    })
+  );
 
   return height;
 };

src/composables/use-lock-scroll.ts

@@ -71,17 +71,9 @@ export function useLockScroll(
     }
   };
 
-  const init = () => {
-    if (shouldLock()) {
-      lock();
-    }
-  };
+  const init = () => shouldLock() && lock();
 
-  const destroy = () => {
-    if (shouldLock()) {
-      unlock();
-    }
-  };
+  const destroy = () => shouldLock() && unlock();
 
   onMountedOrActivated(init);
   onDeactivated(destroy);

src/contact-edit/ContactEdit.tsx

@@ -54,11 +54,10 @@ export default defineComponent({
       }
     };
 
-    const onDelete = () => {
+    const onDelete = () =>
       Dialog.confirm({
         title: t('confirmDelete'),
       }).then(() => emit('delete', contact));
-    };
 
     const renderButtons = () => (
       <div class={bem('buttons')}>

src/datetime-picker/DatePicker.tsx

@@ -222,7 +222,7 @@ export default defineComponent({
       });
 
       nextTick(() => {
-        picker.value!.setValues(values);
+        picker.value?.setValues(values);
       });
     };
 

src/datetime-picker/TimePicker.tsx

@@ -106,7 +106,7 @@ export default defineComponent({
       ];
 
       nextTick(() => {
-        picker.value!.setValues(values);
+        picker.value?.setValues(values);
       });
     };
 

src/notify/Notify.tsx

@@ -23,25 +23,21 @@ export default defineComponent({
   }),
 
   setup(props, { slots }) {
-    return () => {
-      const style = {
-        color: props.color,
-        background: props.background,
-      };
-
-      return (
-        <Popup
-          show={props.show}
-          class={[bem([props.type]), props.className]}
-          style={style}
-          overlay={false}
-          position="top"
-          duration={0.2}
-          lockScroll={props.lockScroll}
-        >
-          {slots.default ? slots.default() : props.message}
-        </Popup>
-      );
-    };
+    return () => (
+      <Popup
+        show={props.show}
+        class={[bem([props.type]), props.className]}
+        style={{
+          color: props.color,
+          background: props.background,
+        }}
+        overlay={false}
+        position="top"
+        duration={0.2}
+        lockScroll={props.lockScroll}
+      >
+        {slots.default ? slots.default() : props.message}
+      </Popup>
+    );
   },
 });

src/popover/Popover.tsx

@@ -79,7 +79,7 @@ export default defineComponent({
     closeOnClickOverlay: truthProp,
     closeOnClickOutside: truthProp,
     offset: {
-      type: (Array as unknown) as PropType<[number, number]>,
+      type: Array as unknown as PropType<[number, number]>,
       default: () => [0, 8],
     },
     theme: {
@@ -112,24 +112,28 @@ export default defineComponent({
     const wrapperRef = ref<HTMLElement>();
     const popoverRef = ref<ComponentInstance>();
 
-    const createPopperInstance = () =>
-      createPopper(wrapperRef.value!, popoverRef.value!.popupRef.value, {
-        placement: props.placement,
-        modifiers: [
-          {
-            name: 'computeStyles',
-            options: {
-              adaptive: false,
-              gpuAcceleration: false,
+    const createPopperInstance = () => {
+      if (wrapperRef.value && popoverRef.value) {
+        return createPopper(wrapperRef.value, popoverRef.value.popupRef.value, {
+          placement: props.placement,
+          modifiers: [
+            {
+              name: 'computeStyles',
+              options: {
+                adaptive: false,
+                gpuAcceleration: false,
+              },
             },
-          },
-          extend({}, offsetModifier, {
-            options: {
-              offset: props.offset,
-            },
-          }),
-        ],
-      });
+            extend({}, offsetModifier, {
+              options: {
+                offset: props.offset,
+              },
+            }),
+          ],
+        });
+      }
+      return null;
+    };
 
     const updateLocation = () => {
       nextTick(() => {

src/toast/Toast.tsx

@@ -78,9 +78,7 @@ export default defineComponent({
       }
     };
 
-    const clearTimer = () => {
-      clearTimeout(timer);
-    };
+    const clearTimer = () => clearTimeout(timer);
 
     const renderIcon = () => {
       const { icon, type, iconSize, iconPrefix, loadingType } = props;

src/toast/function-call.tsx

@@ -155,7 +155,7 @@ Toast.clear = (all?: boolean) => {
     } else if (!allowMultiple) {
       queue[0].clear();
     } else {
-      queue.shift()!.clear();
+      queue.shift()?.clear();
     }
   }
 };