sprintify-ui 0.1.15 → 0.1.17

package/src/composables/clickOutside.ts

@@ -1,80 +1,80 @@
-import { MaybeElementRef, unrefElement, tryOnScopeDispose } from '@vueuse/core';
-import { isString } from 'lodash';
-
-interface UseClickOutsideOptions {
-  includes?: () => (MaybeElementRef | string)[];
-}
-
-export function useClickOutside(
-  element: MaybeElementRef,
-  callback: () => void,
-  options: UseClickOutsideOptions = {}
-) {
-  function cleanup() {
-    window.removeEventListener('mousedown', onClick, { capture: true });
-  }
-
-  const stopWatch = watch(
-    () => unrefElement(element),
-    (el) => {
-      if (el) {
-        cleanup();
-        window.addEventListener('mousedown', onClick, { capture: true });
-      }
-    },
-    { immediate: true }
-  );
-
-  function onClick(e: Event) {
-    const el = unrefElement(element);
-
-    const includeEls = [] as Element[];
-
-    const optionIncludes = [];
-
-    if (options.includes) {
-      optionIncludes.push(...options.includes());
-    }
-
-    optionIncludes.forEach((include) => {
-      if (isString(include)) {
-        includeEls.push(...document.querySelectorAll(include));
-      } else {
-        const element = unrefElement(include);
-        if (element) {
-          includeEls.push(element);
-        }
-      }
-    });
-
-    if (!el) {
-      return;
-    }
-
-    const contains = el.contains(e.target as HTMLElement);
-
-    let containsIncludes = false;
-    if (includeEls.length > 0) {
-      containsIncludes = includeEls.some((exceptionEl) =>
-        exceptionEl?.contains(e.target as HTMLElement)
-      );
-    }
-
-    const outside = !contains && !containsIncludes;
-
-    if (outside) {
-      callback();
-    }
-  }
-
-  const stop = () => {
-    cleanup();
-    stopWatch();
-  };
-
-  tryOnScopeDispose(stop);
-
-  return {
-    stop,
-  };
-}
+import { MaybeElementRef, unrefElement, tryOnScopeDispose } from '@vueuse/core';
+import { isString } from 'lodash';
+
+interface UseClickOutsideOptions {
+  includes?: () => (MaybeElementRef | string)[];
+}
+
+export function useClickOutside(
+  element: MaybeElementRef,
+  callback: () => void,
+  options: UseClickOutsideOptions = {}
+) {
+  function cleanup() {
+    window.removeEventListener('mousedown', onClick, { capture: true });
+  }
+
+  const stopWatch = watch(
+    () => unrefElement(element),
+    (el) => {
+      if (el) {
+        cleanup();
+        window.addEventListener('mousedown', onClick, { capture: true });
+      }
+    },
+    { immediate: true }
+  );
+
+  function onClick(e: Event) {
+    const el = unrefElement(element);
+
+    const includeEls = [] as Element[];
+
+    const optionIncludes = [];
+
+    if (options.includes) {
+      optionIncludes.push(...options.includes());
+    }
+
+    optionIncludes.forEach((include) => {
+      if (isString(include)) {
+        includeEls.push(...document.querySelectorAll(include));
+      } else {
+        const element = unrefElement(include);
+        if (element) {
+          includeEls.push(element);
+        }
+      }
+    });
+
+    if (!el) {
+      return;
+    }
+
+    const contains = el.contains(e.target as HTMLElement);
+
+    let containsIncludes = false;
+    if (includeEls.length > 0) {
+      containsIncludes = includeEls.some((exceptionEl) =>
+        exceptionEl?.contains(e.target as HTMLElement)
+      );
+    }
+
+    const outside = !contains && !containsIncludes;
+
+    if (outside) {
+      callback();
+    }
+  }
+
+  const stop = () => {
+    cleanup();
+    stopWatch();
+  };
+
+  tryOnScopeDispose(stop);
+
+  return {
+    stop,
+  };
+}

package/src/composables/field.ts

@@ -1,117 +1,117 @@
-import { uniqueId } from 'lodash';
-import { Ref } from 'vue';
-
-interface Config {
-  name: Ref<string | null | undefined>;
-  required: Ref<boolean>;
-  hasError: Ref<boolean | undefined>;
-  emit: any;
-  errorType?: string;
-  labelClass?: string;
-}
-
-export function useField(config: Config) {
-  const uuid = uniqueId();
-  const name = config.name;
-  const required = config.required;
-  const hasError = config.hasError;
-  const emit = config.emit;
-  const errorType = config.errorType ?? null;
-  const labelClass = config.labelClass ?? null;
-
-  // Injections
-
-  const fieldRequired = inject('field:required', ref(false)) as Ref<boolean>;
-  const fieldName = inject('field:name', ref('')) as Ref<string>;
-
-  const fieldOnUpdate = inject('field:onUpdate', () => {
-    return;
-  }) as () => void;
-
-  const getErrorMessageByName = inject(
-    'form:getErrorMessageByName',
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    (name: string) => {
-      return null;
-    }
-  ) as (name: string) => string | null | undefined;
-
-  const setErrorType = inject(
-    'field:setErrorType',
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    (errorType: string | null) => {
-      return;
-    }
-  ) as (errorType: string | null) => void;
-
-  if (errorType) {
-    setErrorType(errorType);
-  }
-
-  const setLabelClass = inject(
-    'field:setLabelClass',
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    (labelClass: string | string[]) => {
-      return;
-    }
-  ) as (errorType: string | string[]) => void;
-
-  if (labelClass) {
-    setLabelClass(labelClass);
-  }
-
-  const disableForm = inject('form:disable', () => {
-    return;
-  }) as (uuid: string) => void;
-
-  const enableForm = inject('form:enable', () => {
-    return;
-  }) as (uuid: string) => void;
-
-  onBeforeUnmount(() => {
-    enableForm(uuid);
-  });
-
-  const requiredInternal = computed((): boolean => {
-    if (required.value) {
-      return required.value;
-    }
-
-    return fieldRequired.value;
-  });
-
-  const nameInternal = computed((): string => {
-    if (name.value) {
-      return name.value;
-    }
-
-    return fieldName.value;
-  });
-
-  const errorMessageInternal = computed((): string | null | undefined => {
-    return getErrorMessageByName(nameInternal.value);
-  });
-
-  const hasErrorInternal = computed((): boolean => {
-    if (hasError.value) {
-      return hasError.value;
-    }
-
-    return !!errorMessageInternal.value;
-  });
-
-  function emitUpdate(value: any) {
-    emit('update:modelValue', value);
-    fieldOnUpdate();
-  }
-
-  return {
-    requiredInternal,
-    nameInternal,
-    hasErrorInternal,
-    errorMessageInternal,
-    emitUpdate,
-    enableForm: () => enableForm(uuid),
-    disableForm: () => disableForm(uuid),
-  };
-}
+import { uniqueId } from 'lodash';
+import { Ref } from 'vue';
+
+interface Config {
+  name: Ref<string | null | undefined>;
+  required: Ref<boolean>;
+  hasError: Ref<boolean | undefined>;
+  emit: any;
+  errorType?: string;
+  labelClass?: string;
+}
+
+export function useField(config: Config) {
+  const uuid = uniqueId();
+  const name = config.name;
+  const required = config.required;
+  const hasError = config.hasError;
+  const emit = config.emit;
+  const errorType = config.errorType ?? null;
+  const labelClass = config.labelClass ?? null;
+
+  // Injections
+
+  const fieldRequired = inject('field:required', ref(false)) as Ref<boolean>;
+  const fieldName = inject('field:name', ref('')) as Ref<string>;
+
+  const fieldOnUpdate = inject('field:onUpdate', () => {
+    return;
+  }) as () => void;
+
+  const getErrorMessageByName = inject(
+    'form:getErrorMessageByName',
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    (name: string) => {
+      return null;
+    }
+  ) as (name: string) => string | null | undefined;
+
+  const setErrorType = inject(
+    'field:setErrorType',
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    (errorType: string | null) => {
+      return;
+    }
+  ) as (errorType: string | null) => void;
+
+  if (errorType) {
+    setErrorType(errorType);
+  }
+
+  const setLabelClass = inject(
+    'field:setLabelClass',
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    (labelClass: string | string[]) => {
+      return;
+    }
+  ) as (errorType: string | string[]) => void;
+
+  if (labelClass) {
+    setLabelClass(labelClass);
+  }
+
+  const disableForm = inject('form:disable', () => {
+    return;
+  }) as (uuid: string) => void;
+
+  const enableForm = inject('form:enable', () => {
+    return;
+  }) as (uuid: string) => void;
+
+  onBeforeUnmount(() => {
+    enableForm(uuid);
+  });
+
+  const requiredInternal = computed((): boolean => {
+    if (required.value) {
+      return required.value;
+    }
+
+    return fieldRequired.value;
+  });
+
+  const nameInternal = computed((): string => {
+    if (name.value) {
+      return name.value;
+    }
+
+    return fieldName.value;
+  });
+
+  const errorMessageInternal = computed((): string | null | undefined => {
+    return getErrorMessageByName(nameInternal.value);
+  });
+
+  const hasErrorInternal = computed((): boolean => {
+    if (hasError.value) {
+      return hasError.value;
+    }
+
+    return !!errorMessageInternal.value;
+  });
+
+  function emitUpdate(value: any) {
+    emit('update:modelValue', value);
+    fieldOnUpdate();
+  }
+
+  return {
+    requiredInternal,
+    nameInternal,
+    hasErrorInternal,
+    errorMessageInternal,
+    emitUpdate,
+    enableForm: () => enableForm(uuid),
+    disableForm: () => disableForm(uuid),
+  };
+}

package/src/composables/hasOptions.ts

@@ -1,68 +1,68 @@
-import { Ref } from 'vue';
-import { NormalizedOption, Option } from '@/types';
-import { isArray, isObject } from 'lodash';
-
-export function useHasOptions(
-  modelValue: Ref<Option[] | Option | null | undefined>,
-  options: Ref<Option[]>,
-  labelKey: Ref<string>,
-  valueKey: Ref<string>,
-  multiple: Ref<boolean> = ref(false)
-) {
-  const normalizedModelValue = computed(
-    (): NormalizedOption[] | NormalizedOption | null => {
-      if (multiple.value) {
-        if (!isArray(modelValue.value)) {
-          return [];
-        }
-        return modelValue.value.map((option) => {
-          return {
-            label: option[labelKey.value] as string,
-            value: option[valueKey.value] as string | number,
-            option: option,
-          } as NormalizedOption;
-        });
-      } else {
-        if (!isObject(modelValue.value)) {
-          return null;
-        }
-
-        return {
-          label: modelValue.value[labelKey.value as never] as string,
-          value: modelValue.value[valueKey.value as never] as string | number,
-          option: modelValue.value,
-        } as NormalizedOption;
-      }
-    }
-  );
-
-  const normalizedOptions = computed((): NormalizedOption[] => {
-    return options.value.map((option) => {
-      return {
-        label: option[labelKey.value] as string,
-        value: option[valueKey.value] as string | number,
-        option: option,
-      } as NormalizedOption;
-    });
-  });
-
-  function isSelected(option: NormalizedOption): boolean {
-    if (isArray(normalizedModelValue.value)) {
-      return normalizedModelValue.value.some((modelValue) => {
-        return modelValue.value === option.value;
-      });
-    }
-
-    if (isObject(normalizedModelValue.value)) {
-      return normalizedModelValue.value.value == option.value;
-    }
-
-    return false;
-  }
-
-  return {
-    normalizedOptions,
-    normalizedModelValue,
-    isSelected,
-  };
-}
+import { Ref } from 'vue';
+import { NormalizedOption, Option } from '@/types';
+import { isArray, isObject } from 'lodash';
+
+export function useHasOptions(
+  modelValue: Ref<Option[] | Option | null | undefined>,
+  options: Ref<Option[]>,
+  labelKey: Ref<string>,
+  valueKey: Ref<string>,
+  multiple: Ref<boolean> = ref(false)
+) {
+  const normalizedModelValue = computed(
+    (): NormalizedOption[] | NormalizedOption | null => {
+      if (multiple.value) {
+        if (!isArray(modelValue.value)) {
+          return [];
+        }
+        return modelValue.value.map((option) => {
+          return {
+            label: option[labelKey.value] as string,
+            value: option[valueKey.value] as string | number,
+            option: option,
+          } as NormalizedOption;
+        });
+      } else {
+        if (!isObject(modelValue.value)) {
+          return null;
+        }
+
+        return {
+          label: modelValue.value[labelKey.value as never] as string,
+          value: modelValue.value[valueKey.value as never] as string | number,
+          option: modelValue.value,
+        } as NormalizedOption;
+      }
+    }
+  );
+
+  const normalizedOptions = computed((): NormalizedOption[] => {
+    return options.value.map((option) => {
+      return {
+        label: option[labelKey.value] as string,
+        value: option[valueKey.value] as string | number,
+        option: option,
+      } as NormalizedOption;
+    });
+  });
+
+  function isSelected(option: NormalizedOption): boolean {
+    if (isArray(normalizedModelValue.value)) {
+      return normalizedModelValue.value.some((modelValue) => {
+        return modelValue.value === option.value;
+      });
+    }
+
+    if (isObject(normalizedModelValue.value)) {
+      return normalizedModelValue.value.value == option.value;
+    }
+
+    return false;
+  }
+
+  return {
+    normalizedOptions,
+    normalizedModelValue,
+    isSelected,
+  };
+}

package/src/composables/mediaQuery.ts

@@ -1,42 +1,42 @@
-import { ref, watchEffect } from 'vue';
-import type { MaybeComputedRef } from '@vueuse/shared';
-import { resolveRef, tryOnScopeDispose } from '@vueuse/shared';
-
-export function useMediaQuery(query: MaybeComputedRef<string>) {
-  const isSupported = () =>
-    window && 'matchMedia' in window && typeof window.matchMedia === 'function';
-
-  let mediaQuery: MediaQueryList | undefined;
-  const matches = ref(false);
-
-  const cleanup = () => {
-    if (!mediaQuery) return;
-    if ('removeEventListener' in mediaQuery)
-      // eslint-disable-next-line @typescript-eslint/no-use-before-define
-      mediaQuery.removeEventListener('change', update);
-    // @ts-expect-error deprecated API
-    // eslint-disable-next-line @typescript-eslint/no-use-before-define
-    else mediaQuery.removeListener(update);
-  };
-
-  const update = () => {
-    if (!isSupported()) return;
-
-    cleanup();
-
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    mediaQuery = window.matchMedia(resolveRef(query).value) as MediaQueryList;
-    matches.value = mediaQuery.matches;
-
-    if ('addEventListener' in mediaQuery)
-      mediaQuery.addEventListener('change', update);
-    // @ts-expect-error deprecated API
-    else mediaQuery.addListener(update);
-  };
-
-  watchEffect(update);
-
-  tryOnScopeDispose(() => cleanup());
-
-  return matches;
-}
+import { ref, watchEffect } from 'vue';
+import type { MaybeRefOrGetter } from '@vueuse/shared';
+import { resolveRef, tryOnScopeDispose } from '@vueuse/shared';
+
+export function useMediaQuery(query: MaybeRefOrGetter<string>) {
+  const isSupported = () =>
+    window && 'matchMedia' in window && typeof window.matchMedia === 'function';
+
+  let mediaQuery: MediaQueryList | undefined;
+  const matches = ref(false);
+
+  const cleanup = () => {
+    if (!mediaQuery) return;
+    if ('removeEventListener' in mediaQuery)
+      // eslint-disable-next-line @typescript-eslint/no-use-before-define
+      mediaQuery.removeEventListener('change', update);
+    // @ts-expect-error deprecated API
+    // eslint-disable-next-line @typescript-eslint/no-use-before-define
+    else mediaQuery.removeListener(update);
+  };
+
+  const update = () => {
+    if (!isSupported()) return;
+
+    cleanup();
+
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    mediaQuery = window.matchMedia(resolveRef(query).value) as MediaQueryList;
+    matches.value = mediaQuery.matches;
+
+    if ('addEventListener' in mediaQuery)
+      mediaQuery.addEventListener('change', update);
+    // @ts-expect-error deprecated API
+    else mediaQuery.addListener(update);
+  };
+
+  watchEffect(update);
+
+  tryOnScopeDispose(() => cleanup());
+
+  return matches;
+}