@globalbrain/sefirot 3.23.0 → 3.24.1

package/lib/components/SDropdownSectionFilter.vue

@@ -11,7 +11,7 @@ const props = defineProps<{
   search?: boolean
   selected: MaybeRef<DropdownSectionFilterSelectedValue>
   options: MaybeRef<DropdownSectionFilterOption[]>
-  onClick?(value: string | number | boolean): void
+  onClick?(value: any): void
 }>()
 
 const input = ref<HTMLElement | null>(null)
@@ -35,7 +35,7 @@ onMounted(() => {
   input.value?.focus()
 })
 
-function isActive(value: string | number | boolean) {
+function isActive(value: any) {
   const selected = unref(props.selected)
 
   return isArray(selected)
@@ -51,7 +51,7 @@ function focusNext(event: any) {
   event.target.parentNode.nextElementSibling?.firstElementChild?.focus()
 }
 
-function handleClick(option: DropdownSectionFilterOption, value: string | number | boolean) {
+function handleClick(option: DropdownSectionFilterOption, value: any) {
   option.onClick && option.onClick(value)
   props.onClick && props.onClick(value)
 }

package/lib/components/SInputAddon.vue

@@ -1,12 +1,12 @@
 <script setup lang="ts">
 import IconCaretDown from '@iconify-icons/ph/caret-down-bold'
+import { computed, ref } from 'vue'
 import {
   type DropdownSection,
   getSelectedOption,
   useManualDropdownPosition
-} from 'sefirot/composables/Dropdown'
-import { useFlyout } from 'sefirot/composables/Flyout'
-import { computed, ref } from 'vue'
+} from '../composables/Dropdown'
+import { useFlyout } from '../composables/Flyout'
 import { isString } from '../support/Utils'
 import SDropdown from './SDropdown.vue'
 import SIcon from './SIcon.vue'

package/lib/components/SInputCheckboxes.vue

@@ -8,7 +8,7 @@ import SInputCheckbox from './SInputCheckbox.vue'
 export type Size = 'mini' | 'small' | 'medium'
 export type Color = 'neutral' | 'mute' | 'info' | 'success' | 'warning' | 'danger'
 
-export type Value = string | number | boolean
+export type Value = any
 
 export interface Option {
   label: string

package/lib/components/SInputDropdown.vue

@@ -16,9 +16,9 @@ import SInputDropdownItem from './SInputDropdownItem.vue'
 export type Size = 'mini' | 'small' | 'medium'
 export type Color = 'neutral' | 'mute' | 'info' | 'success' | 'warning' | 'danger'
 
-export type PrimitiveValue = string | number | boolean | null
-export type ArrayValue = (string | number | boolean)[]
-export type OptionValue = string | number | boolean
+export type PrimitiveValue = any
+export type ArrayValue = any[]
+export type OptionValue = any
 
 export type Option = OptionText | OptionAvatar
 

package/lib/components/SInputDropdownItem.vue

@@ -6,7 +6,7 @@ export type Item = ItemText | ItemAvatar
 
 export interface ItemBase {
   type?: 'text' | 'avatar'
-  value: string | number | boolean
+  value: any
 }
 
 export interface ItemText extends ItemBase {
@@ -27,7 +27,7 @@ defineProps<{
 }>()
 
 defineEmits<{
-  (e: 'remove', value: string | number | boolean): void
+  (e: 'remove', value: any): void
 }>()
 </script>
 

package/lib/components/SInputDropdownItemAvatar.vue

@@ -6,13 +6,13 @@ import SIcon from './SIcon.vue'
 defineProps<{
   label: string
   image?: string | null
-  value: string | number | boolean
+  value: any
   removable: boolean
   disabled: boolean
 }>()
 
 defineEmits<{
-  (e: 'remove', value: string | number | boolean): void
+  (e: 'remove', value: any): void
 }>()
 </script>
 

package/lib/components/SInputDropdownItemText.vue

@@ -4,13 +4,13 @@ import SIcon from './SIcon.vue'
 
 defineProps<{
   label: string
-  value: string | number | boolean
+  value: any
   removable: boolean
   disabled: boolean
 }>()
 
 defineEmits<{
-  (e: 'remove', value: string | number | boolean): void
+  (e: 'remove', value: any): void
 }>()
 </script>
 

package/lib/components/SInputRadios.vue

@@ -10,7 +10,7 @@ export type Color = 'neutral' | 'mute' | 'info' | 'success' | 'warning' | 'dange
 
 export interface Option {
   label: string
-  value: string | number | boolean
+  value: any
   disabled?: boolean
 }
 
@@ -27,8 +27,8 @@ const props = withDefaults(defineProps<{
   options: Option[]
   nullable?: boolean
   disabled?: boolean
-  value?: string | number | boolean | null
-  modelValue?: string | number | boolean | null
+  value?: any
+  modelValue?: any
   validation?: Validatable
   hideError?: boolean
 }>(), {
@@ -37,8 +37,8 @@ const props = withDefaults(defineProps<{
 })
 
 const emit = defineEmits<{
-  (e: 'update:model-value', value: string | number | boolean | null): void
-  (e: 'change', value: string | number | boolean | null): void
+  (e: 'update:model-value', value: any): void
+  (e: 'change', value: any): void
 }>()
 
 const _value = computed(() => {
@@ -47,11 +47,11 @@ const _value = computed(() => {
     : props.value !== undefined ? props.value : null
 })
 
-function isChecked(value: string | number | boolean) {
+function isChecked(value: any) {
   return value === _value.value
 }
 
-function onUpdate(value: string | number | boolean) {
+function onUpdate(value: any) {
   if (value !== _value.value) {
     emit('update:model-value', value)
     return
@@ -62,7 +62,7 @@ function onUpdate(value: string | number | boolean) {
   }
 }
 
-function onChange(value: string | number | boolean) {
+function onChange(value: any) {
   if (value !== _value.value) {
     emit('change', value)
     return

package/lib/components/SInputSelect.vue

@@ -9,11 +9,11 @@ import SInputBase from './SInputBase.vue'
 
 export type Size = 'mini' | 'small' | 'medium'
 export type Color = 'neutral' | 'mute' | 'info' | 'success' | 'warning' | 'danger'
-export type Value = string | number | boolean | null
+export type Value = any
 
 export interface Option {
   label: string
-  value: string | number | boolean
+  value: any
   disabled?: boolean
 }
 

package/lib/components/SInputSwitches.vue

@@ -10,7 +10,7 @@ export type CheckColor = 'neutral' | 'mute' | 'info' | 'success' | 'warning' | '
 
 export interface Option {
   label: string
-  value: string | number | boolean
+  value: any
 }
 
 const props = defineProps<{
@@ -25,24 +25,24 @@ const props = defineProps<{
   checkColor?: CheckColor
   options: Option[]
   disabled?: boolean
-  modelValue: (string | number | boolean)[]
+  modelValue: any[]
   hideError?: boolean
   validation?: Validatable
 }>()
 
 const emit = defineEmits<{
-  (e: 'update:modelValue', value: (string | number | boolean)[]): void
+  (e: 'update:modelValue', value: any[]): void
 }>()
 
 const classes = computed(() => [
   props.size ?? 'small'
 ])
 
-function isChecked(value: string | number | boolean): boolean {
+function isChecked(value: any): boolean {
   return props.modelValue.includes(value)
 }
 
-function handleChange(value: string | number | boolean): void {
+function handleChange(value: any): void {
   const difference = props.modelValue
     .filter((v) => v !== value)
     .concat(props.modelValue.includes(value) ? [] : [value])

package/lib/components/STableCellNumber.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import { format } from 'sefirot/support/Num'
 import { computed } from 'vue'
 import { type TableCellValueColor } from '../composables/Table'
+import { format } from '../support/Num'
 import SIcon from './SIcon.vue'
 import SLink from './SLink.vue'
 

package/lib/composables/Dropdown.ts

@@ -31,15 +31,10 @@ export interface DropdownSectionFilter extends DropdownSectionBase {
   search?: boolean
   selected: MaybeRef<DropdownSectionFilterSelectedValue>
   options: MaybeRef<DropdownSectionFilterOption[]>
-  onClick?(value: string | number | boolean): void
+  onClick?(value: any): void
 }
 
-export type DropdownSectionFilterSelectedValue =
-  | string
-  | number
-  | boolean
-  | null
-  | (string | number | boolean)[]
+export type DropdownSectionFilterSelectedValue = any
 
 export type DropdownSectionFilterOption =
   | DropdownSectionFilterOptionText
@@ -48,9 +43,9 @@ export type DropdownSectionFilterOption =
 export interface DropdownSectionFilterOptionBase {
   type?: 'text' | 'avatar'
   label: string
-  value: string | number | boolean
+  value: any
   disabled?: boolean
-  onClick?(value: string | number | boolean): void
+  onClick?(value: any): void
 }
 
 export interface DropdownSectionFilterOptionText extends DropdownSectionFilterOptionBase {

package/lib/http/Http.ts

@@ -140,25 +140,23 @@ export class Http {
     const fd = form || new FormData()
     let formKey: string
 
-    for (const property in obj) {
-      if (Reflect.has(obj, property)) {
-        if (namespace) {
-          formKey = `${namespace}[${property}]`
-        } else {
-          formKey = property
-        }
+    Object.keys(obj).forEach((property) => {
+      if (namespace) {
+        formKey = `${namespace}[${property}]`
+      } else {
+        formKey = property
+      }
 
-        if (obj[property] === undefined) {
-          continue
-        }
+      if (obj[property] === undefined) {
+        return
+      }
 
-        if (typeof obj[property] === 'object' && !(obj[property] instanceof Blob)) {
-          this.objectToFormData(obj[property], fd, property)
-        } else {
-          fd.append(formKey, obj[property])
-        }
+      if (typeof obj[property] === 'object' && !(obj[property] instanceof Blob)) {
+        this.objectToFormData(obj[property], fd, property)
+      } else {
+        fd.append(formKey, obj[property])
       }
-    }
+    })
 
     return fd
   }

package/lib/support/Day.ts

@@ -2,6 +2,7 @@ import dayjs, { type ConfigType, type Dayjs } from 'dayjs'
 import PluginRelativeTime from 'dayjs/plugin/relativeTime'
 import PluginTimezone from 'dayjs/plugin/timezone'
 import PluginUtc from 'dayjs/plugin/utc'
+import { isNumber, isObject, isString } from './Utils'
 
 dayjs.extend(PluginUtc)
 dayjs.extend(PluginTimezone)
@@ -19,6 +20,14 @@ export interface Ymd {
   date: number | null
 }
 
+export type YmdType = 'y' | 'm' | 'd'
+
+export const YmdMap = {
+  y: 'year',
+  m: 'month',
+  d: 'date'
+} as const
+
 /**
  * The hour, minute, and second object interface.
  */
@@ -28,6 +37,14 @@ export interface Hms {
   second: string | null
 }
 
+export type HmsType = 'h' | 'm' | 's'
+
+export const HmsMap = {
+  h: 'hour',
+  m: 'minute',
+  s: 'second'
+} as const
+
 export function day(input?: Input): Day {
   return dayjs(input)
 }
@@ -69,3 +86,29 @@ export function createHms(
     second
   }
 }
+
+export function isYmd(value: unknown, required: YmdType[] = ['y', 'm', 'd']): value is Ymd {
+  if (!isObject(value)) {
+    return false
+  }
+
+  return required
+    .reduce<string[]>((keys, type) => {
+      keys.push(YmdMap[type])
+      return keys
+    }, [])
+    .every((key) => value[key] === null || isNumber(value[key]))
+}
+
+export function isHms(value: unknown, required: HmsType[] = ['h', 'm', 's']): value is Hms {
+  if (!isObject(value)) {
+    return false
+  }
+
+  return required
+    .reduce<string[]>((keys, type) => {
+      keys.push(HmsMap[type])
+      return keys
+    }, [])
+    .every((key) => value[key] === null || isString(value[key]))
+}

package/lib/validation/Rule.ts

@@ -5,7 +5,7 @@ import { type Lang, useLang } from '../composables/Lang'
 export interface RuleOptions {
   optional?: boolean
   message(params: MessageProps): string
-  validation(value: unknown): boolean
+  validation(value: unknown): boolean | Promise<boolean>
 }
 
 export interface MessageProps extends VMessageProps {

package/lib/validation/rules/checked.ts

@@ -1,9 +1,15 @@
-import { helpers } from '@vuelidate/validators'
+import { createRule } from '../Rule'
 import { checked as baseChecked } from '../validators/checked'
 
+export const message = {
+  en: 'You must check the field.',
+  ja: 'この項目は選択が必須です。'
+}
+
 export function checked(msg?: string) {
-  return helpers.withMessage(
-    () => msg ?? 'You must check the field.',
-    (value: boolean) => !helpers.req(value) || baseChecked(value)
-  )
+  return createRule({
+    message: ({ lang }) => msg ?? message[lang],
+    optional: true,
+    validation: baseChecked
+  })
 }

package/lib/validation/rules/decimal.ts

@@ -1,9 +1,14 @@
-import { and, decimal as baseDecimal, helpers, not } from '@vuelidate/validators'
-import { hyphen } from '../validators'
+import { createRule } from '../Rule'
+import { decimal as baseDecimal, hyphen } from '../validators'
+
+export const message = {
+  en: 'The value must be valid decimal numbers.',
+  ja: 'この値は小数または10進数である必要があります。'
+}
 
 export function decimal(msg?: string) {
-  return helpers.withMessage(
-    () => msg ?? 'The value must be valid decimal numbers.',
-    and(not(hyphen), baseDecimal)
-  )
+  return createRule({
+    message: ({ lang }) => msg ?? message[lang],
+    validation: (value) => !hyphen(value) && baseDecimal(value)
+  })
 }

package/lib/validation/rules/decimalOrHyphen.ts

@@ -1,8 +1,14 @@
-import { decimal as baseDecimal, helpers } from '@vuelidate/validators'
+import { createRule } from '../Rule'
+import { decimal as baseDecimal, hyphen } from '../validators'
+
+export const message = {
+  en: 'The value must be valid decimal numbers or just a hyphen.',
+  ja: 'この値は小数、10進数、またはハイフンである必要があります。'
+}
 
 export function decimalOrHyphen(msg?: string) {
-  return helpers.withMessage(
-    () => msg ?? 'The value must be valid decimal numbers or just a hyphen.',
-    baseDecimal
-  )
+  return createRule({
+    message: ({ lang }) => msg ?? message[lang],
+    validation: (value) => hyphen(value) || baseDecimal(value)
+  })
 }

package/lib/validation/rules/email.ts

@@ -1,8 +1,14 @@
-import { email as baseEmail, helpers } from '@vuelidate/validators'
+import { createRule } from '../Rule'
+import { email as baseEmail } from '../validators'
+
+export const message = {
+  en: 'The Email is invalid.',
+  ja: 'Emailの形式が正しくありません。'
+}
 
 export function email(msg?: string) {
-  return helpers.withMessage(
-    () => msg ?? 'The Email is invalid.',
-    baseEmail
-  )
+  return createRule({
+    message: ({ lang }) => msg ?? message[lang],
+    validation: baseEmail
+  })
 }

package/lib/validation/rules/fileExtension.ts

@@ -1,11 +1,15 @@
-import { helpers } from '@vuelidate/validators'
+import { createRule } from '../Rule'
 import { fileExtension as baseFileExtension } from '../validators/fileExtension'
 
+export const message = {
+  en: 'The file extension is invalid.',
+  ja: 'ファイル拡張子が正しくありません。'
+}
+
 export function fileExtension(extensions: string[], msg?: string) {
-  return helpers.withMessage(
-    () => msg ?? 'The file extension is invalid.',
-    (value: File) => {
-      return !helpers.req(value) || baseFileExtension(value, extensions)
-    }
-  )
+  return createRule({
+    message: ({ lang }) => msg ?? message[lang],
+    optional: true,
+    validation: (value) => baseFileExtension(value, extensions)
+  })
 }

package/lib/validation/rules/hms.ts

@@ -1,14 +1,17 @@
-import { helpers } from '@vuelidate/validators'
-import { type Hms } from '../../support/Day'
+import { createRule } from '../Rule'
 import { hms as baseHms } from '../validators/hms'
 
 type HmsType = 'h' | 'm' | 's'
 
+export const message = {
+  en: 'The time is invalid.',
+  ja: '時間表記が正しくありません。'
+}
+
 export function hms(required?: HmsType[], msg?: string) {
-  return helpers.withMessage(
-    () => msg ?? 'The time is invalid.',
-    (value: Hms) => {
-      return !helpers.req(value) || baseHms(value, required)
-    }
-  )
+  return createRule({
+    message: ({ lang }) => msg ?? message[lang],
+    optional: true,
+    validation: (value) => baseHms(value, required)
+  })
 }

package/lib/validation/rules/maxFileSize.ts

@@ -1,16 +1,15 @@
-import { helpers } from '@vuelidate/validators'
+import { createRule } from '../Rule'
 import { maxFileSize as baseMaxFileSize } from '../validators/maxFileSize'
 
+export const message = {
+  en: (size: string) => `The file must be smaller than or equal to ${size}.`,
+  ja: (size: string) => `ファイルは${size}よりも小さい必要があります。`
+}
+
 export function maxFileSize(size: string, msg?: string) {
-  return helpers.withParams(
-    { size },
-    helpers.withMessage(
-      ({ $params }) => {
-        return msg ?? `The file must be smaller than ${$params.size}.`
-      },
-      (value: File) => {
-        return !helpers.req(value) || baseMaxFileSize(value, size)
-      }
-    )
-  )
+  return createRule({
+    message: ({ lang }) => msg ?? message[lang](size),
+    optional: true,
+    validation: (value) => baseMaxFileSize(value, size)
+  })
 }

package/lib/validation/rules/maxLength.ts

@@ -1,10 +1,15 @@
-import { maxLength as baseMaxLength, helpers } from '@vuelidate/validators'
+import { createRule } from '../Rule'
+import { maxLength as baseMaxLength } from '../validators'
+
+export const message = {
+  en: (length: number) => `The value must be less than or equal to ${length} characters.`,
+  ja: (length: number) => `この値は、最大${length}文字までです。`
+}
 
 export function maxLength(length: number, msg?: string) {
-  return helpers.withMessage(
-    ({ $params }) => {
-      return msg ?? `The value must be less or equal to ${($params as any).max} characters.`
-    },
-    baseMaxLength(length)
-  )
+  return createRule({
+    message: ({ lang }) => msg ?? message[lang](length),
+    optional: true,
+    validation: (value) => baseMaxLength(value, length)
+  })
 }

package/lib/validation/rules/maxTotalFileSize.ts

@@ -1,16 +1,15 @@
-import { helpers } from '@vuelidate/validators'
+import { createRule } from '../Rule'
 import { maxTotalFileSize as baseMaxTotalFileSize } from '../validators/maxTotalFileSize'
 
+export const message = {
+  en: (size: string) => `The total file size must be smaller than or equal to ${size}.`,
+  ja: (size: string) => `合計ファイルサイズは最大${size}までです。`
+}
+
 export function maxTotalFileSize(size: string, msg?: string) {
-  return helpers.withParams(
-    { size },
-    helpers.withMessage(
-      ({ $params }) => {
-        return msg ?? `The total file size must be smaller than ${$params.size}.`
-      },
-      (files: File[]) => {
-        return !helpers.req(files) || baseMaxTotalFileSize(files, size)
-      }
-    )
-  )
+  return createRule({
+    message: ({ lang }) => msg ?? message[lang](size),
+    optional: true,
+    validation: (value) => baseMaxTotalFileSize(value, size)
+  })
 }

package/lib/validation/rules/maxValue.ts

@@ -1,10 +1,14 @@
-import { maxValue as baseMaxValue, helpers } from '@vuelidate/validators'
+import { createRule } from '../Rule'
+import { maxValue as baseMaxValue } from '../validators'
 
-export function maxValue(value: number, msg?: string) {
-  return helpers.withMessage(
-    ({ $params }) => {
-      return msg ?? `The value must be less or equal to ${($params as any).max}.`
-    },
-    baseMaxValue(value)
-  )
+export const message = {
+  en: (max: number) => `The value must be less than or equal to ${max}.`,
+  ja: (max: number) => `この値は最大${max}です。`
+}
+
+export function maxValue(max: number, msg?: string) {
+  return createRule({
+    message: ({ lang }) => msg ?? message[lang](max),
+    validation: (value) => baseMaxValue(value, max)
+  })
 }

package/lib/validation/rules/minLength.ts

@@ -1,10 +1,15 @@
-import { minLength as baseMinLength, helpers } from '@vuelidate/validators'
+import { createRule } from '../Rule'
+import { minLength as baseMinLength } from '../validators'
+
+export const message = {
+  en: (min: number) => `The value must be greater than or equal to ${min} characters.`,
+  ja: (min: number) => `この値は最小${min}文字です。`
+}
 
 export function minLength(length: number, msg?: string) {
-  return helpers.withMessage(
-    ({ $params }) => {
-      return msg ?? `The value must be greater or equal to ${($params as any).min} characters.`
-    },
-    baseMinLength(length)
-  )
+  return createRule({
+    message: ({ lang }) => msg ?? message[lang](length),
+    optional: true,
+    validation: (value) => baseMinLength(value, length)
+  })
 }