diff --git a/packages/wiz-ui-next/src/components/base/inputs/date-picker/date-picker.vue b/packages/wiz-ui-next/src/components/base/inputs/date-picker/date-picker.vue
index c29c4b8dc..1f80c9c78 100644
--- a/packages/wiz-ui-next/src/components/base/inputs/date-picker/date-picker.vue
+++ b/packages/wiz-ui-next/src/components/base/inputs/date-picker/date-picker.vue
@@ -319,7 +319,7 @@ const borderState = computed(() => {
 
 const variant = computed(() => {
   if (props.disabled) return "disabled";
-  if (tempDate.value) return "selected";
+  if (calendarValue.value) return "selected";
   return "default";
 });
 
@@ -329,7 +329,7 @@ const onClickCancel = (e: MouseEvent) => {
   e.stopPropagation();
   tempDate.value = null;
   currentMonth.value = new Date(defaultCurrentMonth);
-  calendarValue.value = null;
+  emit("update:modelValue", null);
   setIsOpen(false);
 };