patch release

Author: Blackman99

.changeset/selfish-dryers-wonder.md

@@ -0,0 +1,5 @@
+---
+"@casual-ui/vue": patch
+---
+
+fix: date picker formatter ensure

packages/ui/src/components/form/date-picker/CDatePanel.vue

@@ -1,11 +1,11 @@
 <script lang="ts">
-export type Formatter = (origin: Date | null, format: string) => string
+type Formatter = (origin: Date | null, format: string) => string
 </script>
 
 <script setup lang="ts">
 import { computed, ref, toRefs } from 'vue'
-import dayjs from 'dayjs'
 import { useMessage } from '../../../usable/useI18n'
+import defaultFormatter from './defaultFormatter'
 
 const props = withDefaults(defineProps<{
   year?: number
@@ -23,11 +23,7 @@ const props = withDefaults(defineProps<{
   dateRange: () => [null, null],
   formattedDateRange: () => ['', ''],
   format: 'YYYY-MM-DD',
-  formatter: () => (d: Date | null, f: string) => {
-    if (!d)
-      return ''
-    return dayjs(d).format(f)
-  },
+  formatter: defaultFormatter,
   range: false,
 })
 
@@ -36,9 +32,11 @@ const emit = defineEmits<{
   (e: 'update:dateRange', dateRange: [Date | null, Date | null]): void
 }>()
 
+const formatter = typeof props.formatter === 'function' ? props.formatter : defaultFormatter
+
 const messages = useMessage()
 
-const innerFormatter = (d: Date | null) => props.formatter(d, props.format)
+const innerFormatter = (d: Date | null) => formatter(d, props.format)
 /**
  * 比较两个日期是否相等
  */

packages/ui/src/components/form/date-picker/CDatePicker.vue

@@ -3,7 +3,6 @@ export type Unit = 'year' | 'month' | 'day'
 </script>
 
 <script setup lang="ts">
-import dayjs from 'dayjs'
 import {
   CDatePanel,
   CDatePanelHeader,
@@ -21,6 +20,7 @@ import type { CSize } from '@casual-ui/types'
 import { matCalendarToday } from '@quasar/extras/material-icons/index'
 import useValidator from '../useValidator'
 import useUnit from './useUnit'
+import defaultFormatter from './defaultFormatter'
 
 const props = withDefaults(defineProps<{
   /**
@@ -87,11 +87,7 @@ const props = withDefaults(defineProps<{
   unit?: Unit
 }>(), {
   format: 'YYYY-MM-DD',
-  formatter: () => (d: Date | null, f: string) => {
-    if (!d)
-      return ''
-    return dayjs(d).format(f)
-  },
+  formatter: defaultFormatter,
   hideOnSelect: true,
   formattedValue: '',
   dateRange: () => [null, null],
@@ -145,7 +141,9 @@ const emit = defineEmits<{
   (e: 'update:unit', newUnit: Unit): void
 }>()
 
-const innerFormatter = (d: Date | null) => props.formatter(d, props.format)
+const formatter = typeof props.formatter === 'function' ? props.formatter : defaultFormatter
+
+const innerFormatter = (d: Date | null) => formatter(d, props.format)
 
 const { provideSize: size } = useInjectSize(props)
 

packages/ui/src/components/form/date-picker/defaultFormatter.ts

@@ -0,0 +1,8 @@
+import dayjs from 'dayjs'
+const defaultFormatter = (d: Date | null, f: string) => {
+  if (!d)
+    return ''
+  return dayjs(d).format(f)
+}
+
+export default defaultFormatter