@globalbrain/sefirot 2.5.0 → 2.6.0

package/lib/components/SDropdownSectionFilter.vue

@@ -25,7 +25,7 @@ const fuse = computed(() => {
 const filteredOptions = computed(() => {
   return !props.search || !query.value
     ? unref(props.options)
-    : fuse.value.search(query.value).map(r => r.item)
+    : fuse.value.search(query.value).map((r) => r.item)
 })
 
 onMounted(() => {
@@ -144,7 +144,7 @@ function handleClick(option: DropdownSectionFilterOption, value: string | number
 
 .checkbox {
   display: block;
-  padding-top: 9px;
+  padding-top: 8px;
 }
 
 .checkbox-box {

package/lib/components/SDropdownSectionFilterItemText.vue

@@ -14,9 +14,12 @@ defineProps<{
 .SDropdownSectionFilterItemText {
   display: inline-block;
   padding: 6px 0;
+  line-height: 20px;
+  font-size: 12px;
 }
 
 .text {
+  display: inline-block;
   line-height: 20px;
   font-size: 12px;
   font-weight: 500;

package/lib/components/SInputCheckboxes.vue

@@ -28,7 +28,7 @@ function isChecked(value: unknown): boolean {
 
 function handleChange(value: unknown): void {
   const distinct = props.modelValue
-    .filter(v => v !== value)
+    .filter((v) => v !== value)
     .concat(props.modelValue.includes(value) ? [] : [value])
 
   emit('update:modelValue', distinct)

package/lib/components/SInputDropdown.vue

@@ -71,10 +71,10 @@ const dropdownOptions = computed<DropdownSectionFilter[]>(() => [{
 
 const selected = computed(() => {
   if (isArray(props.modelValue)) {
-    return props.options.filter(o => (props.modelValue as ArrayValue).includes(o.value))
+    return props.options.filter((o) => (props.modelValue as ArrayValue).includes(o.value))
   }
 
-  const item = props.options.find(o => o.value === props.modelValue)
+  const item = props.options.find((o) => o.value === props.modelValue)
 
   return item ? [item] : []
 })

package/lib/components/SInputHMS.vue

@@ -87,7 +87,7 @@ function emitTouch(type: ValueType): void {
 
   touched[type] = true
 
-  if (createRequiredTouched().every(v => v)) {
+  if (createRequiredTouched().every((v) => v)) {
     props.validation.$touch()
   }
 }

package/lib/components/SInputSwitches.vue

@@ -38,7 +38,7 @@ function isChecked(value: string | number | boolean): boolean {
 
 function handleChange(value: string | number | boolean): void {
   const difference = props.modelValue
-    .filter(v => v !== value)
+    .filter((v) => v !== value)
     .concat(props.modelValue.includes(value) ? [] : [value])
 
   emit('update:modelValue', difference)

package/lib/components/SInputYMD.vue

@@ -77,7 +77,7 @@ function emitTouch(type: ValueType): void {
 
   touched[type] = true
 
-  if (createRequiredTouched().every(v => v)) {
+  if (createRequiredTouched().every((v) => v)) {
     props.validation.$touch()
   }
 }

package/lib/components/SMarkdown.vue

@@ -29,7 +29,7 @@ watch(
   { immediate: true }
 )
 
-subscribe(payload => emit('clicked', payload))
+subscribe((payload) => emit('clicked', payload))
 </script>
 
 <template>

package/lib/components/STableFooter.vue

@@ -6,9 +6,9 @@ import { format } from '../support/Num'
 import SIcon from './SIcon.vue'
 
 const props = defineProps<{
-  total?: number
-  page?: number
-  perPage?: number
+  total?: number | null
+  page?: number | null
+  perPage?: number | null
   borderless?: boolean
   onPrev?(): void
   onNext?(): void

package/lib/components/STableHeader.vue

@@ -2,7 +2,7 @@
 import { format } from '../support/Num'
 
 defineProps<{
-  total?: number
+  total?: number | null
   reset?: boolean
   borderless?: boolean
   onReset?(): void

package/lib/composables/Data.ts

@@ -1,7 +1,7 @@
 import { watchOnce } from '@vueuse/core'
 import cloneDeep from 'lodash-es/cloneDeep'
 import { WatchSource, reactive } from 'vue'
-import { isObject } from '../support/Utils'
+import { isNullish, isObject } from '../support/Utils'
 
 export interface Data<T extends Record<string, any>> {
   state: T
@@ -25,7 +25,7 @@ export interface UseDataInputUtils {
   def<T>(
     value: any,
     source: WatchSource<T>,
-    cb: (value: Exclude<T, undefined>) => void
+    cb: (value: Exclude<T, null | undefined>) => void
   ): Def<T>
 }
 
@@ -81,11 +81,14 @@ function createState<T extends Record<string, any>>(
 }
 
 function handleDefs<T extends Record<string, any>>(
-  defs: [string, Def][], state: T
+  defs: [string, Def][],
+  state: T
 ): void {
   defs.forEach(([key, def]) => {
     watchOnce(def.source, (value: any) => {
-      (state as any)[key] = def.cb(value)
+      if (!isNullish(value)) {
+        (state as any)[key] = def.cb(value)
+      }
     })
   })
 }
@@ -93,7 +96,7 @@ function handleDefs<T extends Record<string, any>>(
 function def<T>(
   value: any,
   source: WatchSource<T>,
-  cb: (value: Exclude<T, undefined>) => void
+  cb: (value: Exclude<T, null | undefined>) => void
 ): Def {
   return {
     __isDef: true,

package/lib/composables/Grid.ts

@@ -46,7 +46,7 @@ export function useGrid(options: UseGridOptions): Grid {
 
   function adjustSpacer() {
     container.value?.querySelectorAll(`${toClassSelector(spacerClass)}`)
-      .forEach(n => n.remove())
+      .forEach((n) => n.remove())
 
     const track = container.value?.firstElementChild
 

package/lib/composables/Markdown.ts

@@ -70,7 +70,7 @@ export function useLink({ container, callbacks }: UseLinkOptions): UseLink {
     const isExternal = isExternalUrl(href)
     const isCallback = isCallbackUrl(href)
 
-    subscribers.forEach(sub => sub({
+    subscribers.forEach((sub) => sub({
       event,
       target,
       isExternal,

package/lib/composables/Table.ts

@@ -5,10 +5,10 @@ import { DropdownSection } from './Dropdown'
 export interface Table {
   orders: string[]
   columns: TableColumns
-  records?: Record<string, any>[]
-  total?: number
-  page?: number
-  perPage?: number
+  records?: Record<string, any>[] | null
+  total?: number | null
+  page?: number | null
+  perPage?: number | null
   reset?: boolean
   borderless?: boolean
   loading?: boolean
@@ -93,10 +93,10 @@ export interface TableCellAvatarsOption {
 export interface UseTableOptions {
   orders: string[]
   columns: TableColumns
-  records?: MaybeRef<Record<string, any>[] | undefined>
-  total?: MaybeRef<number | undefined>
-  page?: MaybeRef<number | undefined>
-  perPage?: MaybeRef<number | undefined>
+  records?: MaybeRef<Record<string, any>[] | null | undefined>
+  total?: MaybeRef<number | null | undefined>
+  page?: MaybeRef<number | null | undefined>
+  perPage?: MaybeRef<number | null | undefined>
   reset?: MaybeRef<boolean | undefined>
   borderless?: boolean
   loading?: MaybeRef<boolean | undefined>

package/lib/stores/Snackbars.ts

@@ -37,7 +37,7 @@ export const useSnackbars = defineStore('snackbars', () => {
   }
 
   function pop(id: number): void {
-    items.value = items.value.filter(item => item.id !== id)
+    items.value = items.value.filter((item) => item.id !== id)
   }
 
   return {

package/lib/support/Time.ts

@@ -1,7 +1,7 @@
 type Awaited<T> = T extends undefined ? T : T extends PromiseLike<infer U> ? U : T
 
 export function sleep(ms = 500): Promise<undefined> {
-  return new Promise<undefined>(resolve => setTimeout(resolve, ms))
+  return new Promise<undefined>((resolve) => setTimeout(resolve, ms))
 }
 
 export function delay<T extends any[]>(

package/lib/validation/validators/requiredHms.ts

@@ -13,5 +13,5 @@ export const HmsMap = {
 } as const
 
 export function requiredHms(hms: Hms, required: HmsType[] = ['h', 'm', 's']): boolean {
-  return required.every(r => hms[HmsMap[r]] !== undefined)
+  return required.every((r) => hms[HmsMap[r]] !== undefined)
 }

package/lib/validation/validators/requiredYmd.ts

@@ -3,5 +3,5 @@ import { Ymd, YmdMap, YmdType } from './ymd'
 export type { Ymd, YmdType, YmdMap }
 
 export function requiredYmd(ymd: Ymd, required: YmdType[] = ['y', 'm', 'd']): boolean {
-  return required.every(r => ymd[YmdMap[r]] !== null)
+  return required.every((r) => ymd[YmdMap[r]] !== null)
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@globalbrain/sefirot",
-  "version": "2.5.0",
+  "version": "2.6.0",
   "description": "Vue Components for Global Brain Design System.",
   "author": "Kia Ishii <ka.ishii@globalbrains.com>",
   "license": "MIT",
@@ -43,7 +43,7 @@
     "vue-router": "^4.1.5"
   },
   "devDependencies": {
-    "@globalbrain/eslint-config": "^0.1.0",
+    "@globalbrain/eslint-config": "^1.0.0",
     "@histoire/plugin-vue": "^0.10.7",
     "@iconify-icons/ph": "^1.2.2",
     "@iconify/vue": "^4.0.0",
@@ -52,8 +52,8 @@
     "@types/markdown-it": "^12.2.3",
     "@types/node": "^18.8.0",
     "@vitejs/plugin-vue": "^3.1.2",
-    "@vitest/coverage-c8": "^0.23.4",
-    "@vue/test-utils": "^2.1.0",
+    "@vitest/coverage-c8": "^0.25.1",
+    "@vue/test-utils": "^2.2.1",
     "@vuelidate/core": "^2.0.0",
     "@vuelidate/validators": "^2.0.0",
     "@vueuse/core": "^9.3.0",
@@ -62,7 +62,7 @@
     "conventional-changelog-cli": "^2.2.2",
     "dayjs": "^1.11.5",
     "enquirer": "^2.3.6",
-    "eslint": "^8.23.1",
+    "eslint": "^8.27.0",
     "execa": "^5.1.1",
     "fuse.js": "^6.6.2",
     "happy-dom": "^6.0.4",
@@ -78,7 +78,7 @@
     "v-calendar": "3.0.0-alpha.8",
     "vite": "^3.1.4",
     "vitepress": "1.0.0-alpha.19",
-    "vitest": "^0.23.4",
+    "vitest": "^0.25.1",
     "vue": "^3.2.40",
     "vue-router": "^4.1.5",
     "vue-tsc": "^1.0.8"