@antsoo-lib/components 0.1.2 → 0.1.4

package/src/vc-picker/utils/dateUtil.ts

@@ -0,0 +1,320 @@
+import type { GenerateConfig } from '../generate'
+import type { CustomFormat, Locale, NullableDateType, PanelMode, PickerMode } from '../interface'
+import { DECADE_UNIT_DIFF } from '../panels/DecadePanel/index'
+
+export const WEEK_DAY_COUNT = 7
+
+export function isNullEqual<T>(value1: T, value2: T): boolean | undefined {
+  if (!value1 && !value2) {
+    return true
+  }
+  if (!value1 || !value2) {
+    return false
+  }
+  return undefined
+}
+
+export function isSameDecade<DateType>(
+  generateConfig: GenerateConfig<DateType>,
+  decade1: NullableDateType<DateType>,
+  decade2: NullableDateType<DateType>,
+) {
+  const equal = isNullEqual(decade1, decade2)
+  if (typeof equal === 'boolean') {
+    return equal
+  }
+
+  const num1 = Math.floor(generateConfig.getYear(decade1!) / 10)
+  const num2 = Math.floor(generateConfig.getYear(decade2!) / 10)
+  return num1 === num2
+}
+
+export function isSameYear<DateType>(
+  generateConfig: GenerateConfig<DateType>,
+  year1: NullableDateType<DateType>,
+  year2: NullableDateType<DateType>,
+) {
+  const equal = isNullEqual(year1, year2)
+  if (typeof equal === 'boolean') {
+    return equal
+  }
+
+  return generateConfig.getYear(year1!) === generateConfig.getYear(year2!)
+}
+
+export function getQuarter<DateType>(generateConfig: GenerateConfig<DateType>, date: DateType) {
+  const quota = Math.floor(generateConfig.getMonth(date) / 3)
+  return quota + 1
+}
+
+export function isSameQuarter<DateType>(
+  generateConfig: GenerateConfig<DateType>,
+  quarter1: NullableDateType<DateType>,
+  quarter2: NullableDateType<DateType>,
+) {
+  const equal = isNullEqual(quarter1, quarter2)
+  if (typeof equal === 'boolean') {
+    return equal
+  }
+
+  return (
+    isSameYear(generateConfig, quarter1, quarter2) &&
+    getQuarter(generateConfig, quarter1!) === getQuarter(generateConfig, quarter2!)
+  )
+}
+
+export function isSameMonth<DateType>(
+  generateConfig: GenerateConfig<DateType>,
+  month1: NullableDateType<DateType>,
+  month2: NullableDateType<DateType>,
+) {
+  const equal = isNullEqual(month1, month2)
+  if (typeof equal === 'boolean') {
+    return equal
+  }
+
+  return (
+    isSameYear(generateConfig, month1, month2) &&
+    generateConfig.getMonth(month1!) === generateConfig.getMonth(month2!)
+  )
+}
+
+export function isSameDate<DateType>(
+  generateConfig: GenerateConfig<DateType>,
+  date1: NullableDateType<DateType>,
+  date2: NullableDateType<DateType>,
+) {
+  const equal = isNullEqual(date1, date2)
+  if (typeof equal === 'boolean') {
+    return equal
+  }
+
+  return (
+    generateConfig.getYear(date1!) === generateConfig.getYear(date2!) &&
+    generateConfig.getMonth(date1!) === generateConfig.getMonth(date2!) &&
+    generateConfig.getDate(date1!) === generateConfig.getDate(date2!)
+  )
+}
+
+export function isSameTime<DateType>(
+  generateConfig: GenerateConfig<DateType>,
+  time1: NullableDateType<DateType>,
+  time2: NullableDateType<DateType>,
+) {
+  const equal = isNullEqual(time1, time2)
+  if (typeof equal === 'boolean') {
+    return equal
+  }
+
+  return (
+    generateConfig.getHour(time1!) === generateConfig.getHour(time2!) &&
+    generateConfig.getMinute(time1!) === generateConfig.getMinute(time2!) &&
+    generateConfig.getSecond(time1!) === generateConfig.getSecond(time2!)
+  )
+}
+
+export function isSameWeek<DateType>(
+  generateConfig: GenerateConfig<DateType>,
+  locale: string,
+  date1: NullableDateType<DateType>,
+  date2: NullableDateType<DateType>,
+) {
+  const equal = isNullEqual(date1, date2)
+  if (typeof equal === 'boolean') {
+    return equal
+  }
+
+  return (
+    generateConfig.locale.getWeek(locale, date1!) === generateConfig.locale.getWeek(locale, date2!)
+  )
+}
+
+export function isEqual<DateType>(
+  generateConfig: GenerateConfig<DateType>,
+  value1: NullableDateType<DateType>,
+  value2: NullableDateType<DateType>,
+) {
+  return isSameDate(generateConfig, value1, value2) && isSameTime(generateConfig, value1, value2)
+}
+
+/** Between in date but not equal of date */
+export function isInRange<DateType>(
+  generateConfig: GenerateConfig<DateType>,
+  startDate: NullableDateType<DateType>,
+  endDate: NullableDateType<DateType>,
+  current: NullableDateType<DateType>,
+) {
+  if (!startDate || !endDate || !current) {
+    return false
+  }
+
+  return (
+    !isSameDate(generateConfig, startDate, current) &&
+    !isSameDate(generateConfig, endDate, current) &&
+    generateConfig.isAfter(current, startDate) &&
+    generateConfig.isAfter(endDate, current)
+  )
+}
+
+export function getWeekStartDate<DateType>(
+  locale: string,
+  generateConfig: GenerateConfig<DateType>,
+  value: DateType,
+) {
+  const weekFirstDay = generateConfig.locale.getWeekFirstDay(locale)
+  const monthStartDate = generateConfig.setDate(value, 1)
+  const startDateWeekDay = generateConfig.getWeekDay(monthStartDate)
+
+  let alignStartDate = generateConfig.addDate(monthStartDate, weekFirstDay - startDateWeekDay)
+
+  if (
+    generateConfig.getMonth(alignStartDate) === generateConfig.getMonth(value) &&
+    generateConfig.getDate(alignStartDate) > 1
+  ) {
+    alignStartDate = generateConfig.addDate(alignStartDate, -7)
+  }
+
+  return alignStartDate
+}
+
+export function getClosingViewDate<DateType>(
+  viewDate: DateType,
+  picker: PickerMode,
+  generateConfig: GenerateConfig<DateType>,
+  offset = 1,
+): DateType {
+  switch (picker) {
+    case 'year':
+      return generateConfig.addYear(viewDate, offset * 10)
+    case 'quarter':
+    case 'month':
+      return generateConfig.addYear(viewDate, offset)
+    default:
+      return generateConfig.addMonth(viewDate, offset)
+  }
+}
+
+export function formatValue<DateType>(
+  value: DateType,
+  {
+    generateConfig,
+    locale,
+    format,
+  }: {
+    generateConfig: GenerateConfig<DateType>
+    locale: Locale
+    format: string | CustomFormat<DateType>
+  },
+) {
+  return typeof format === 'function'
+    ? format(value)
+    : generateConfig.locale.format(locale.locale, value, format)
+}
+
+export function parseValue<DateType>(
+  value: string,
+  {
+    generateConfig,
+    locale,
+    formatList,
+  }: {
+    generateConfig: GenerateConfig<DateType>
+    locale: Locale
+    formatList: (string | CustomFormat<DateType>)[]
+  },
+) {
+  if (!value || typeof formatList[0] === 'function') {
+    return null
+  }
+
+  return generateConfig.locale.parse(locale.locale, value, formatList as string[])
+}
+
+export function getCellDateDisabled<DateType>({
+  cellDate,
+  mode,
+  disabledDate,
+  generateConfig,
+}: {
+  cellDate: DateType
+  mode: Omit<PanelMode, 'time'>
+  generateConfig: GenerateConfig<DateType>
+  disabledDate?: (date: DateType) => boolean
+}): boolean {
+  if (!disabledDate) return false
+  // Whether cellDate is disabled in range
+  const getDisabledFromRange = (
+    currentMode: 'date' | 'month' | 'year',
+    start: number,
+    end: number,
+  ) => {
+    let current = start
+    while (current <= end) {
+      let date: DateType
+      switch (currentMode) {
+        case 'date': {
+          date = generateConfig.setDate(cellDate, current)
+          if (!disabledDate(date)) {
+            return false
+          }
+          break
+        }
+        case 'month': {
+          date = generateConfig.setMonth(cellDate, current)
+          if (
+            !getCellDateDisabled({
+              cellDate: date,
+              mode: 'month',
+              generateConfig,
+              disabledDate,
+            })
+          ) {
+            return false
+          }
+          break
+        }
+        case 'year': {
+          date = generateConfig.setYear(cellDate, current)
+          if (
+            !getCellDateDisabled({
+              cellDate: date,
+              mode: 'year',
+              generateConfig,
+              disabledDate,
+            })
+          ) {
+            return false
+          }
+          break
+        }
+      }
+      current += 1
+    }
+    return true
+  }
+  switch (mode) {
+    case 'date':
+    case 'week': {
+      return disabledDate(cellDate)
+    }
+    case 'month': {
+      const startDate = 1
+      const endDate = generateConfig.getDate(generateConfig.getEndDate(cellDate))
+      return getDisabledFromRange('date', startDate, endDate)
+    }
+    case 'quarter': {
+      const startMonth = Math.floor(generateConfig.getMonth(cellDate) / 3) * 3
+      const endMonth = startMonth + 2
+      return getDisabledFromRange('month', startMonth, endMonth)
+    }
+    case 'year': {
+      return getDisabledFromRange('month', 0, 11)
+    }
+    case 'decade': {
+      const year = generateConfig.getYear(cellDate)
+      const startYear = Math.floor(year / DECADE_UNIT_DIFF) * DECADE_UNIT_DIFF
+      const endYear = startYear + DECADE_UNIT_DIFF - 1
+      return getDisabledFromRange('year', startYear, endYear)
+    }
+  }
+}

package/src/vc-picker/utils/getExtraFooter.tsx

@@ -0,0 +1,13 @@
+import type { PanelMode } from '../interface'
+
+export default function getExtraFooter(
+  prefixCls: string,
+  mode: PanelMode,
+  renderExtraFooter?: (mode: PanelMode) => any,
+) {
+  if (!renderExtraFooter) {
+    return null
+  }
+
+  return <div class={`${prefixCls}-footer-extra`}>{renderExtraFooter(mode)}</div>
+}

package/src/vc-picker/utils/getRanges.tsx

@@ -0,0 +1,66 @@
+import type { VueNode } from '../../_util/type'
+import type { Components, Locale } from '../interface'
+
+export interface RangesProps {
+  prefixCls: string
+  components?: Components
+  needConfirmButton: boolean
+  onNow?: null | (() => void) | false
+  onOk?: null | (() => void) | false
+  okDisabled?: boolean
+  showNow?: boolean
+  locale: Locale
+}
+
+export default function getRanges({
+  prefixCls,
+  components = {},
+  needConfirmButton,
+  onNow,
+  onOk,
+  okDisabled,
+  showNow,
+  locale,
+}: RangesProps) {
+  let presetNode: VueNode
+  let okNode: VueNode
+
+  if (needConfirmButton) {
+    const Button = (components.button || 'button') as any
+
+    if (onNow && showNow !== false) {
+      presetNode = (
+        <li class={`${prefixCls}-now`}>
+          <a class={`${prefixCls}-now-btn`} onClick={onNow}>
+            {locale.now}
+          </a>
+        </li>
+      )
+    }
+
+    okNode = needConfirmButton && (
+      <li class={`${prefixCls}-ok`}>
+        <Button
+          disabled={okDisabled}
+          onClick={(e) => {
+            e.stopPropagation()
+            onOk && onOk()
+          }}
+        >
+          {locale.ok}
+        </Button>
+      </li>
+    )
+  }
+
+  if (!presetNode && !okNode) {
+    return null
+  }
+
+  return (
+    <ul class={`${prefixCls}-ranges`}>
+      {presetNode}
+      {okNode}
+    </ul>
+  )
+}

package/src/vc-picker/utils/miscUtil.ts

@@ -0,0 +1,55 @@
+export function leftPad(str: string | number, length: number, fill = '0') {
+  let current = String(str)
+  while (current.length < length) {
+    current = `${fill}${str}`
+  }
+  return current
+}
+
+export const tuple = <T extends string[]>(...args: T) => args
+
+export function toArray<T>(val: T | T[]): T[] {
+  if (val === null || val === undefined) {
+    return []
+  }
+
+  return Array.isArray(val) ? val : [val]
+}
+
+export default function getDataOrAriaProps(props: any) {
+  const retProps: any = {}
+
+  Object.keys(props).forEach((key) => {
+    if (
+      (key.startsWith('data-') || key.startsWith('aria-') || key === 'role' || key === 'name') &&
+      !key.startsWith('data-__')
+    ) {
+      retProps[key] = props[key]
+    }
+  })
+
+  return retProps
+}
+
+export function getValue<T>(values: null | undefined | (T | null)[], index: number): T | null {
+  return values ? values[index] : null
+}
+
+type UpdateValue<T> = (prev: T) => T
+
+export function updateValues<T, R = [T | null, T | null] | null>(
+  values: [T | null, T | null] | null,
+  value: T | UpdateValue<T>,
+  index: number,
+): R {
+  const newValues: [T | null, T | null] = [getValue(values, 0), getValue(values, 1)]
+
+  newValues[index] =
+    typeof value === 'function' ? (value as UpdateValue<T | null>)(newValues[index]) : value
+
+  if (!newValues[0] && !newValues[1]) {
+    return null as unknown as R
+  }
+
+  return newValues as unknown as R
+}

package/src/vc-picker/utils/timeUtil.ts

@@ -0,0 +1,60 @@
+import type { GenerateConfig } from '../generate'
+import type { NullableDateType } from '../interface'
+
+export function setTime<DateType>(
+  generateConfig: GenerateConfig<DateType>,
+  date: DateType,
+  hour: number,
+  minute: number,
+  second: number,
+): DateType {
+  let nextTime = generateConfig.setHour(date, hour)
+  nextTime = generateConfig.setMinute(nextTime, minute)
+  nextTime = generateConfig.setSecond(nextTime, second)
+  return nextTime
+}
+
+export function setDateTime<DateType>(
+  generateConfig: GenerateConfig<DateType>,
+  date: DateType,
+  defaultDate: NullableDateType<DateType>,
+) {
+  if (!defaultDate) {
+    return date
+  }
+
+  let newDate = date
+  newDate = generateConfig.setHour(newDate, generateConfig.getHour(defaultDate))
+  newDate = generateConfig.setMinute(newDate, generateConfig.getMinute(defaultDate))
+  newDate = generateConfig.setSecond(newDate, generateConfig.getSecond(defaultDate))
+  return newDate
+}
+
+export function getLowerBoundTime(
+  hour: number,
+  minute: number,
+  second: number,
+  hourStep: number,
+  minuteStep: number,
+  secondStep: number,
+): [number, number, number] {
+  const lowerBoundHour = Math.floor(hour / hourStep) * hourStep
+  if (lowerBoundHour < hour) {
+    return [lowerBoundHour, 60 - minuteStep, 60 - secondStep]
+  }
+  const lowerBoundMinute = Math.floor(minute / minuteStep) * minuteStep
+  if (lowerBoundMinute < minute) {
+    return [lowerBoundHour, lowerBoundMinute, 60 - secondStep]
+  }
+  const lowerBoundSecond = Math.floor(second / secondStep) * secondStep
+  return [lowerBoundHour, lowerBoundMinute, lowerBoundSecond]
+}
+
+export function getLastDay<DateType>(generateConfig: GenerateConfig<DateType>, date: DateType) {
+  const year = generateConfig.getYear(date)
+  const month = generateConfig.getMonth(date) + 1
+  const endDate = generateConfig.getEndDate(generateConfig.getFixedDate(`${year}-${month}-01`))
+  const lastDay = generateConfig.getDate(endDate)
+  const monthShow = month < 10 ? `0${month}` : `${month}`
+  return `${year}-${monthShow}-${lastDay}`
+}