@flyanra/vue-core 1.0.2 → 1.2.0

package/src/components/form/form.utils.ts

@@ -1,72 +1,72 @@
-import type { FormInstance } from 'element-plus'
-
-import { UseLocaleInjector } from '../../composables/UseLocaleInjector'
-
-export type ValidateFieldsError = { [K: string]: { message?: string }[] }
-
-/**
- * @returns Translated error message based on active locale
- */
-export function formFieldErrorMessageFormatter(errors: ValidateFieldsError) {
-  const { t, locale } = UseLocaleInjector()
-  const keys = Object.keys(errors)
-
-  if (keys.length) {
-    const requiredFieldNames: (string | undefined)[] = []
-    const otherErrors: (string | undefined)[] = []
-    let formFieldErrorMessage = ''
-
-    keys.forEach((k) => {
-      const msg = errors[k][0].message
-      const index = msg?.indexOf(t ? t('validation.isRequired') : 'validation.isRequired')
-
-      if (index && index >= 0) {
-        requiredFieldNames.push(msg?.slice(0, index)?.trim())
-      } else {
-        otherErrors.push(msg)
-      }
-    })
-
-    const requiredFieldsLength = requiredFieldNames.length
-    const otherErrorsLength = otherErrors.length
-
-    if (requiredFieldsLength >= 1) {
-      const joinedList = new Intl.ListFormat(locale, {
-        style: 'long',
-        type: 'conjunction'
-      }).format(requiredFieldNames.filter((item): item is string => Boolean(item)))
-
-      formFieldErrorMessage = t
-        ? t('validation.requiredFields', {
-            field: joinedList,
-            count: requiredFieldNames.length
-          })
-        : joinedList
-    }
-
-    if (otherErrorsLength) {
-      if (formFieldErrorMessage) formFieldErrorMessage += ' || ' // temporary
-      otherErrors.forEach((e, i) => {
-        formFieldErrorMessage += e + `${i === otherErrorsLength - 1 ? '' : ' || '}` // temporary
-      })
-    }
-
-    return formFieldErrorMessage
-  }
-
-  return t ? t('validation.someInputsInvalid') : 'validation.someInputsInvalid'
-}
-
-export async function genericFormValidator(formRef: FormInstance): Promise<true> {
-  return new Promise((resolve, reject) => {
-    formRef.validate((valid, errors) => {
-      if (!valid) {
-        if (errors) {
-          return reject(formFieldErrorMessageFormatter(errors))
-        }
-      } else {
-        return resolve(true)
-      }
-    })
-  })
-}
+import type { FormInstance } from 'element-plus'
+
+import { UseLocaleInjector } from '../../composables/UseLocaleInjector'
+
+export type ValidateFieldsError = { [K: string]: { message?: string }[] }
+
+/**
+ * @returns Translated error message based on active locale
+ */
+export function formFieldErrorMessageFormatter(errors: ValidateFieldsError) {
+  const { t, locale } = UseLocaleInjector()
+  const keys = Object.keys(errors)
+
+  if (keys.length) {
+    const requiredFieldNames: (string | undefined)[] = []
+    const otherErrors: (string | undefined)[] = []
+    let formFieldErrorMessage = ''
+
+    keys.forEach((k) => {
+      const msg = errors[k][0].message
+      const index = msg?.indexOf(t ? t('validation.isRequired') : 'validation.isRequired')
+
+      if (index && index >= 0) {
+        requiredFieldNames.push(msg?.slice(0, index)?.trim())
+      } else {
+        otherErrors.push(msg)
+      }
+    })
+
+    const requiredFieldsLength = requiredFieldNames.length
+    const otherErrorsLength = otherErrors.length
+
+    if (requiredFieldsLength >= 1) {
+      const joinedList = new Intl.ListFormat(locale, {
+        style: 'long',
+        type: 'conjunction'
+      }).format(requiredFieldNames.filter((item): item is string => Boolean(item)))
+
+      formFieldErrorMessage = t
+        ? t('validation.requiredFields', {
+            field: joinedList,
+            count: requiredFieldNames.length
+          })
+        : joinedList
+    }
+
+    if (otherErrorsLength) {
+      if (formFieldErrorMessage) formFieldErrorMessage += ' || ' // temporary
+      otherErrors.forEach((e, i) => {
+        formFieldErrorMessage += e + `${i === otherErrorsLength - 1 ? '' : ' || '}` // temporary
+      })
+    }
+
+    return formFieldErrorMessage
+  }
+
+  return t ? t('validation.someInputsInvalid') : 'validation.someInputsInvalid'
+}
+
+export async function genericFormValidator(formRef: FormInstance): Promise<true> {
+  return new Promise((resolve, reject) => {
+    formRef.validate((valid, errors) => {
+      if (!valid) {
+        if (errors) {
+          return reject(formFieldErrorMessageFormatter(errors))
+        }
+      } else {
+        return resolve(true)
+      }
+    })
+  })
+}

package/src/components/form/index.ts

@@ -1,6 +1,6 @@
-export * from './input-renderers/form-item-renderer'
-export * from './input-renderers/input-renderer'
-
-export type { T_InputRendererBase } from './input-renderers/input-renderer.types'
-export * from './input-validators'
-export * from './form.utils'
+export * from './input-renderers/form-item-renderer'
+export * from './input-renderers/input-renderer'
+
+export type { T_InputRendererBase } from './input-renderers/input-renderer.types'
+export * from './input-validators'
+export * from './form.utils'

package/src/components/form/input-renderers/boolean/FlyBoolean.vue

@@ -1,48 +1,48 @@
-<template>
-  <el-switch
-    v-model="inputProxy"
-    v-bind="input?.attrs"
-    @change="(v) => emit('change', v)"
-  ></el-switch>
-</template>
-
-<script setup lang="ts">
-import { computed, watch } from 'vue'
-
-import { ElSwitch } from 'element-plus'
-
-import './FlyBoolean.scss'
-import type { T_InputBoolean, T_InputBooleanValues } from './FlyBoolean.types'
-
-const emit = defineEmits<{
-  (e: 'update:modelValue', v: T_InputBooleanValues): void
-  (e: 'change', v: T_InputBooleanValues): void
-}>()
-
-const props = defineProps<{
-  modelValue?: T_InputBooleanValues
-  input?: T_InputBoolean
-}>()
-
-const inputProxy = computed({
-  get: () => {
-    return Boolean(props.modelValue)
-  },
-  set: (v) => {
-    emit('update:modelValue', Boolean(v))
-  }
-})
-
-watch(
-  () => props.modelValue,
-  () => {
-    const parsed = Boolean(props.modelValue)
-    if (parsed !== props.modelValue) {
-      emit('update:modelValue', parsed)
-    }
-  },
-  {
-    immediate: true
-  }
-)
-</script>
+<template>
+  <el-switch
+    v-model="inputProxy"
+    v-bind="input?.attrs"
+    @change="(v) => emit('change', v)"
+  ></el-switch>
+</template>
+
+<script setup lang="ts">
+import { computed, watch } from 'vue'
+
+import { ElSwitch } from 'element-plus'
+
+import './FlyBoolean.scss'
+import type { T_InputBoolean, T_InputBooleanValues } from './FlyBoolean.types'
+
+const emit = defineEmits<{
+  (e: 'update:modelValue', v: T_InputBooleanValues): void
+  (e: 'change', v: T_InputBooleanValues): void
+}>()
+
+const props = defineProps<{
+  modelValue?: T_InputBooleanValues
+  input?: T_InputBoolean
+}>()
+
+const inputProxy = computed({
+  get: () => {
+    return Boolean(props.modelValue)
+  },
+  set: (v) => {
+    emit('update:modelValue', Boolean(v))
+  }
+})
+
+watch(
+  () => props.modelValue,
+  () => {
+    const parsed = Boolean(props.modelValue)
+    if (parsed !== props.modelValue) {
+      emit('update:modelValue', parsed)
+    }
+  },
+  {
+    immediate: true
+  }
+)
+</script>

package/src/components/form/input-renderers/form-item-renderer/FlyFormItemRenderer.vue

@@ -1,48 +1,48 @@
-<template>
-  <el-form-item :prop="input.prop || input.key">
-    <template #label>
-      <FlyInfoTooltip v-if="input.tooltip" :content="input.tooltip" />
-      {{ t(input.label) }}
-    </template>
-
-    <FlyInputRenderer
-      v-model="modelProxy"
-      :input="input"
-      @change="(val: unknown) => emit('change', val)"
-      @blur="() => emit('blur')"
-      @focus="() => emit('focus')"
-    />
-  </el-form-item>
-</template>
-
-<script setup lang="ts">
-import { computed } from 'vue'
-
-import { ElFormItem } from 'element-plus'
-
-import { UseLocaleInjector } from '../../../../composables/UseLocaleInjector'
-import FlyInfoTooltip from '../../../feedback/tooltip/FlyInfoTooltip.vue'
-import type { T_InputRendererBase } from '../input-renderer.types'
-import FlyInputRenderer from '../input-renderer/FlyInputRenderer.vue'
-
-import './FlyFormItemRenderer.scss'
-
-const props = defineProps<{
-  modelValue: unknown
-  input: T_InputRendererBase
-}>()
-
-const emit = defineEmits<{
-  (e: 'update:modelValue', value: unknown): void
-  (e: 'change', value: unknown): void
-  (e: 'blur'): void
-  (e: 'focus'): void
-}>()
-
-const { t } = UseLocaleInjector()
-
-const modelProxy = computed({
-  get: () => props.modelValue,
-  set: (val) => emit('update:modelValue', val)
-})
-</script>
+<template>
+  <el-form-item :prop="input.prop || input.key">
+    <template #label>
+      <FlyInfoTooltip v-if="input.tooltip" :content="input.tooltip" />
+      {{ t(input.label) }}
+    </template>
+
+    <FlyInputRenderer
+      v-model="modelProxy"
+      :input="input"
+      @change="(val: unknown) => emit('change', val)"
+      @blur="() => emit('blur')"
+      @focus="() => emit('focus')"
+    />
+  </el-form-item>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+
+import { ElFormItem } from 'element-plus'
+
+import { UseLocaleInjector } from '../../../../composables/UseLocaleInjector'
+import FlyInfoTooltip from '../../../feedback/tooltip/FlyInfoTooltip.vue'
+import type { T_InputRendererBase } from '../input-renderer.types'
+import FlyInputRenderer from '../input-renderer/FlyInputRenderer.vue'
+
+import './FlyFormItemRenderer.scss'
+
+const props = defineProps<{
+  modelValue: unknown
+  input: T_InputRendererBase
+}>()
+
+const emit = defineEmits<{
+  (e: 'update:modelValue', value: unknown): void
+  (e: 'change', value: unknown): void
+  (e: 'blur'): void
+  (e: 'focus'): void
+}>()
+
+const { t } = UseLocaleInjector()
+
+const modelProxy = computed({
+  get: () => props.modelValue,
+  set: (val) => emit('update:modelValue', val)
+})
+</script>

package/src/components/form/input-renderers/form-item-renderer/index.ts

@@ -1,4 +1,4 @@
-import FlyFormItemRenderer from './FlyFormItemRenderer.vue'
-
-export default FlyFormItemRenderer
-export { FlyFormItemRenderer }
+import FlyFormItemRenderer from './FlyFormItemRenderer.vue'
+
+export default FlyFormItemRenderer
+export { FlyFormItemRenderer }

package/src/components/form/input-renderers/form-schema-renderer/FlyFormSchemaRenderer.types.ts

@@ -1,3 +1,3 @@
-import type FlyFormSchemaRenderer from './FlyFormSchemaRenderer.vue'
-
-export type T_FlyFormSchemaRendererInstance = InstanceType<typeof FlyFormSchemaRenderer> | null
+import type FlyFormSchemaRenderer from './FlyFormSchemaRenderer.vue'
+
+export type T_FlyFormSchemaRendererInstance = InstanceType<typeof FlyFormSchemaRenderer> | null