@naptics/vue-collection 0.0.4 → 0.0.5

package/i18n/index.js

@@ -6,7 +6,7 @@ let provider = undefined;
  * @param newProvider
  */
 export function registerTranslationProvider(newProvider) {
-  provider = newProvider;
+    provider = newProvider;
 }
 /**
  * Translates the specified key with the according message.
@@ -15,7 +15,7 @@ export function registerTranslationProvider(newProvider) {
  * @returns the translated message.
  */
 export function trsl(key, params) {
-  return provider?.trsl(key, params) ?? key;
+    return provider?.trsl(key, params) ?? key;
 }
 /**
  * Translates the specified key using pluralization.
@@ -27,5 +27,5 @@ export function trsl(key, params) {
  * @see trsl
  */
 export function trslc(key, count, params) {
-  return provider?.trslc(key, count, params) ?? key;
-}
+    return provider?.trslc(key, count, params) ?? key;
+}

package/index.js

@@ -64,4 +64,4 @@ export { NValInput };
 import { createValidatedForm } from './components/ValidatedForm';
 export { createValidatedForm };
 import { createComponent, createView, createProps } from './utils/component';
-export { createComponent, createView, createProps };
+export { createComponent, createView, createProps };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@naptics/vue-collection",
-    "version": "0.0.4",
+    "version": "0.0.5",
     "main": "./index.js",
     "repository": {
         "type": "git",

package/utils/breakpoints.js

@@ -1,10 +1,10 @@
 import { computed, ref } from 'vue';
 export const breakpoints = {
-  sm: 640,
-  md: 768,
-  lg: 1024,
-  xl: 1280,
-  '2xl': 1536
+    sm: 640,
+    md: 768,
+    lg: 1024,
+    xl: 1280,
+    '2xl': 1536,
 };
 export const bodyWidth = ref(document.body.clientWidth);
 /**
@@ -12,26 +12,26 @@ export const bodyWidth = ref(document.body.clientWidth);
  * It sets a `window.onresize` listener.
  */
 export function addDocumentResizeEventListener() {
-  window.onresize = () => {
-    bodyWidth.value = document.body.clientWidth;
-  };
+    window.onresize = () => {
+        bodyWidth.value = document.body.clientWidth;
+    };
 }
 export function isWidthBreakpoint(breakpoint) {
-  switch (breakpoint) {
-    case 'sm':
-      return isWidthSm;
-    case 'md':
-      return isWidthMd;
-    case 'lg':
-      return isWidthLg;
-    case 'xl':
-      return isWidthXl;
-    case '2xl':
-      return isWidth2xl;
-  }
+    switch (breakpoint) {
+        case 'sm':
+            return isWidthSm;
+        case 'md':
+            return isWidthMd;
+        case 'lg':
+            return isWidthLg;
+        case 'xl':
+            return isWidthXl;
+        case '2xl':
+            return isWidth2xl;
+    }
 }
 export const isWidth2xl = computed(() => bodyWidth.value > breakpoints['2xl']);
 export const isWidthXl = computed(() => bodyWidth.value > breakpoints.xl);
 export const isWidthLg = computed(() => bodyWidth.value > breakpoints.lg);
 export const isWidthMd = computed(() => bodyWidth.value > breakpoints.md);
-export const isWidthSm = computed(() => bodyWidth.value > breakpoints.sm);
+export const isWidthSm = computed(() => bodyWidth.value > breakpoints.sm);

package/utils/component.js

@@ -1,4 +1,4 @@
-import { defineComponent, reactive, toRef } from 'vue';
+import { defineComponent, reactive, toRef, } from 'vue';
 /**
  * Components should be created using this helper function.
  * It only takes three arguments, the name and the props of the component and the setup function.
@@ -10,12 +10,7 @@ import { defineComponent, reactive, toRef } from 'vue';
  * @returns the created vue-component.
  */
 export function createComponent(name, props, setup) {
-  return defineComponent({
-    name,
-    props,
-    emits: [],
-    setup
-  });
+    return defineComponent({ name, props, emits: [], setup });
 }
 /**
  * Views should be created using this helper function. Views are special components, which don't have props.
@@ -26,11 +21,7 @@ export function createComponent(name, props, setup) {
  * @returns the created vue-component.
  */
 export function createView(name, setup) {
-  return defineComponent({
-    name,
-    emits: [],
-    setup: (props, context) => setup(context)
-  });
+    return defineComponent({ name, emits: [], setup: (props, context) => setup(context) });
 }
 /**
  * If props are specified outside of the {@link createComponent}
@@ -40,7 +31,7 @@ export function createView(name, setup) {
  * @returns the created props, with correct typing.
  */
 export function createProps(props) {
-  return props;
+    return props;
 }
 /**
  * Extracts props from another prop object and returns a reactive object with the specified props.
@@ -53,7 +44,8 @@ export function createProps(props) {
  * console.log(childProps) // { title: 'hi' }
  */
 export function extractProps(props, ...keys) {
-  const partial = {};
-  for (const key of keys) partial[key] = toRef(props, key);
-  return reactive(partial);
-}
+    const partial = {};
+    for (const key of keys)
+        partial[key] = toRef(props, key);
+    return reactive(partial);
+}

package/utils/deferred.js

@@ -3,15 +3,15 @@
  * @returns promise, resolve and reject
  */
 export function deferred() {
-  let resolve;
-  let reject;
-  const promise = new Promise((_resolve, _reject) => {
-    resolve = _resolve;
-    reject = _reject;
-  });
-  return {
-    promise,
-    resolve,
-    reject
-  };
-}
+    let resolve;
+    let reject;
+    const promise = new Promise((_resolve, _reject) => {
+        resolve = _resolve;
+        reject = _reject;
+    });
+    return {
+        promise,
+        resolve,
+        reject,
+    };
+}

package/utils/identifiable.js

@@ -6,8 +6,11 @@ import { markReadonly } from './utils';
  * @returns The first item with the specified `id` or `undefined` if none exists.
  */
 function find(array, id) {
-  const filtered = array.filter(item => item.id === id);
-  if (filtered.length > 0) return filtered[0];else return undefined;
+    const filtered = array.filter(item => item.id === id);
+    if (filtered.length > 0)
+        return filtered[0];
+    else
+        return undefined;
 }
 /**
  * Checks if the given array contains an item with the `id`.
@@ -16,11 +19,11 @@ function find(array, id) {
  * @returns `true` if there is at least one item in the array with the given `id`.
  */
 function contains(array, id) {
-  return find(array, id) !== undefined;
+    return find(array, id) !== undefined;
 }
 function insertSingle(baseArray, insertItem) {
-  const index = baseArray.findIndex(item => item.id === insertItem.id);
-  index === -1 ? baseArray.push(insertItem) : baseArray.splice(index, 1, insertItem);
+    const index = baseArray.findIndex(item => item.id === insertItem.id);
+    index === -1 ? baseArray.push(insertItem) : baseArray.splice(index, 1, insertItem);
 }
 /**
  * Inserts the items into the given array, replacing items with the same `id`.
@@ -31,8 +34,8 @@ function insertSingle(baseArray, insertItem) {
  * @returns The reference to the same array, which was passed.
  */
 function insert(array, ...insertItems) {
-  insertItems.forEach(item => insertSingle(array, item));
-  return array;
+    insertItems.forEach(item => insertSingle(array, item));
+    return array;
 }
 /**
  * Removes all items with the specified `ids` from the given array.
@@ -41,14 +44,17 @@ function insert(array, ...insertItems) {
  * @returns The reference to the same array, which was passed.
  */
 function remove(array, ...ids) {
-  ids.forEach(id => {
-    let noMatches = false;
-    while (!noMatches) {
-      const index = array.findIndex(item => item.id === id);
-      if (index != -1) array.splice(index, 1);else noMatches = true;
-    }
-  });
-  return array;
+    ids.forEach(id => {
+        let noMatches = false;
+        while (!noMatches) {
+            const index = array.findIndex(item => item.id === id);
+            if (index != -1)
+                array.splice(index, 1);
+            else
+                noMatches = true;
+        }
+    });
+    return array;
 }
 /**
  * Compares the two arrays and checks if they both have
@@ -58,19 +64,15 @@ function remove(array, ...ids) {
  * @returns `true` if the arrays contain item with the same `ids` in the same order.
  */
 function areSameArrays(first, second) {
-  if (first.length != second.length) return false;
-  for (let i = 0; i < first.length; i++) {
-    if (first[i]?.id !== second[i]?.id) return false;
-  }
-  return true;
+    if (first.length != second.length)
+        return false;
+    for (let i = 0; i < first.length; i++) {
+        if (first[i]?.id !== second[i]?.id)
+            return false;
+    }
+    return true;
 }
 /**
  * This object contains utility functions to deal with {@link Identifiable} objects.
  */
-export const Id = markReadonly({
-  find,
-  contains,
-  insert,
-  remove,
-  areSameArrays
-});
+export const Id = markReadonly({ find, contains, insert, remove, areSameArrays });

package/utils/stringMaxLength.js

@@ -5,7 +5,10 @@
  * @see maxLengthSplitCenter
  */
 export function maxLength(input, maxLength) {
-  if (input && input.length > maxLength) return `${input.substring(0, maxLength - 3).trim()}...`;else return input || '';
+    if (input && input.length > maxLength)
+        return `${input.substring(0, maxLength - 3).trim()}...`;
+    else
+        return input || '';
 }
 /**
  * Returns a shortened string with '...' in the center of the string if it is longer than the given `maxLength`.
@@ -14,10 +17,12 @@ export function maxLength(input, maxLength) {
  * @see maxLength
  */
 export function maxLengthSplitCenter(input, maxLength) {
-  if (input && input.length > maxLength) {
-    const chars = maxLength - 3;
-    const charsAtStart = Math.ceil(chars / 2);
-    const charsAtEnd = Math.floor(chars / 2);
-    return `${input.substring(0, charsAtStart).trim()}...${input.substring(input.length - charsAtEnd).trim()}`;
-  } else return input || '';
-}
+    if (input && input.length > maxLength) {
+        const chars = maxLength - 3;
+        const charsAtStart = Math.ceil(chars / 2);
+        const charsAtEnd = Math.floor(chars / 2);
+        return `${input.substring(0, charsAtStart).trim()}...${input.substring(input.length - charsAtEnd).trim()}`;
+    }
+    else
+        return input || '';
+}

package/utils/tailwind.js

@@ -1 +1 @@
-export {};
+export {};

package/utils/utils.js

@@ -1,12 +1,12 @@
 export function markReadonly(object) {
-  return object;
+    return object;
 }
 let currentId = 1;
 /**
  * Generates and returns a non random but unique id.
  */
 export function uniqueId() {
-  return currentId++;
+    return currentId++;
 }
 /**
  * Determines if a value is not null or undefined.
@@ -14,7 +14,7 @@ export function uniqueId() {
  * @returns `true` if the value is anything but `null` or `undefined`.
  */
 export function notNullish(value) {
-  return value !== null && value !== undefined;
+    return value !== null && value !== undefined;
 }
 /**
  * Determines if a value is null or undefined.
@@ -22,5 +22,5 @@ export function notNullish(value) {
  * @returns `true` if the value is `null` or `undefined`.
  */
 export function isNullish(value) {
-  return value === null || value === undefined;
-}
+    return value === null || value === undefined;
+}

package/utils/vModel.js

@@ -8,54 +8,54 @@
  * @returns An object containing the value-property and the update-function.
  */
 export function vModelProps(propType) {
-  return {
-    /**
-     * The value of the component.
-     */
-    value: propType,
-    /**
-     * This will be called, when the value of the component has changed.
-     */
-    onUpdateValue: Function
-  };
+    return {
+        /**
+         * The value of the component.
+         */
+        value: propType,
+        /**
+         * This will be called, when the value of the component has changed.
+         */
+        onUpdateValue: Function,
+    };
 }
 /**
  * Creates props for a required `v-model` of the given type.
  * @see {@link vModelProps}
  */
 export function vModelRequiredProps(propType) {
-  return {
-    /**
-     * The value of the component.
-     */
-    value: {
-      type: propType,
-      required: true
-    },
-    /**
-     * This will be called, when the value of the component has changed.
-     */
-    onUpdateValue: Function
-  };
+    return {
+        /**
+         * The value of the component.
+         */
+        value: {
+            type: propType,
+            required: true,
+        },
+        /**
+         * This will be called, when the value of the component has changed.
+         */
+        onUpdateValue: Function,
+    };
 }
 /**
  * Creates props for a `v-model` of the given type with a default value.
  * @see {@link vModelProps}
  */
 export function vModelDefaultProps(propType, defaultValue) {
-  return {
-    /**
-     * The value of the component.
-     */
-    value: {
-      type: propType,
-      default: defaultValue
-    },
-    /**
-     * This will be called, when the value of the component has changed.
-     */
-    onUpdateValue: Function
-  };
+    return {
+        /**
+         * The value of the component.
+         */
+        value: {
+            type: propType,
+            default: defaultValue,
+        },
+        /**
+         * This will be called, when the value of the component has changed.
+         */
+        onUpdateValue: Function,
+    };
 }
 /**
  * Uses the given `ref` as a `v-model`, to create a two-way binding with the `ref`.
@@ -63,12 +63,12 @@ export function vModelDefaultProps(propType, defaultValue) {
  * @returns An object of type {@link VModel}, which connects the `ref` to the `v-model`.
  */
 export function vModelForRef(ref) {
-  return {
-    value: ref.value,
-    onUpdateValue: newValue => {
-      ref.value = newValue;
-    }
-  };
+    return {
+        value: ref.value,
+        onUpdateValue: (newValue) => {
+            ref.value = newValue;
+        },
+    };
 }
 /**
  * This creates a `v-model` for a property of an object. The property of the object is taken as the
@@ -93,15 +93,12 @@ export function vModelForRef(ref) {
  * ```
  */
 export function vModelForObjectProperty(object, key, onUpdate) {
-  return {
-    value: object[key],
-    onUpdateValue: newValue => {
-      onUpdate?.({
-        ...object,
-        [key]: newValue
-      });
-    }
-  };
+    return {
+        value: object[key],
+        onUpdateValue: (newValue) => {
+            onUpdate?.({ ...object, [key]: newValue });
+        },
+    };
 }
 /**
  * This creates a `v-model` which operates on one property of a parent `v-model`. It takes the value of
@@ -133,15 +130,12 @@ export function vModelForObjectProperty(object, key, onUpdate) {
  * ```
  */
 export function vModelForVModelProperty(vModel, key) {
-  return {
-    value: vModel.value[key],
-    onUpdateValue: newValue => {
-      vModel.onUpdateValue?.({
-        ...vModel.value,
-        [key]: newValue
-      });
-    }
-  };
+    return {
+        value: vModel.value[key],
+        onUpdateValue: (newValue) => {
+            vModel.onUpdateValue?.({ ...vModel.value, [key]: newValue });
+        },
+    };
 }
 /**
  * This function does the same thing as {@link vModelForVModelProperty},
@@ -174,15 +168,12 @@ export function vModelForVModelProperty(vModel, key) {
  * ```
  */
 export function vModelForVModelPropertyMapType(vModel, key, mapType) {
-  return {
-    value: vModel.value[key],
-    onUpdateValue: newValue => {
-      vModel.onUpdateValue?.({
-        ...vModel.value,
-        [key]: mapType(newValue)
-      });
-    }
-  };
+    return {
+        value: vModel.value[key],
+        onUpdateValue: (newValue) => {
+            vModel.onUpdateValue?.({ ...vModel.value, [key]: mapType(newValue) });
+        },
+    };
 }
 /**
  * Creates an array of `v-models`, one for every element of an array. All changes in
@@ -209,16 +200,16 @@ export function vModelForVModelPropertyMapType(vModel, key, mapType) {
  * ```
  */
 export function vModelsForArray(array, onUpdate) {
-  return array.map((entry, index) => ({
-    value: entry,
-    onUpdateValue: entry => {
-      const newArray = [...array];
-      newArray[index] = entry;
-      onUpdate?.(newArray);
-    },
-    remove: () => {
-      const newArray = [...array.slice(0, index), ...array.slice(index + 1)];
-      onUpdate?.(newArray);
-    }
-  }));
-}
+    return array.map((entry, index) => ({
+        value: entry,
+        onUpdateValue: (entry) => {
+            const newArray = [...array];
+            newArray[index] = entry;
+            onUpdate?.(newArray);
+        },
+        remove: () => {
+            const newArray = [...array.slice(0, index), ...array.slice(index + 1)];
+            onUpdate?.(newArray);
+        },
+    }));
+}