aloha-vue 2.52.0 → 2.53.0

package/src/ui/AInputCurrency/compositionAPI/ModelAPI.js

@@ -1,82 +1,82 @@
-import {
-  computed,
-  ref,
-  toRef,
-} from "vue";
-
-import {
-  isNil,
-  times,
-} from "lodash-es";
-
-export default function ModelAPI(props, {
-  adjustFloatPartAndDivider = () => {},
-  changeModel = () => {},
-}) {
-  const required = toRef(props, "required");
-  const modelValue = toRef(props, "modelValue");
-  const modelType = toRef(props, "modelType");
-  const modelUndefined = toRef(props, "modelUndefined");
-  const decimalDivider = toRef(props, "decimalDivider");
-  const disabled = toRef(props, "disabled");
-  const decimalPartLength = toRef(props, "decimalPartLength");
-  const thousandDivider = toRef(props, "thousandDivider");
-
-  const displayValue = ref(undefined);
-  const isInternalChange = ref(false);
-  const localModel = ref(undefined);
-
-  const initLocalVars = () => {
-    displayValue.value = adjustFloatPartAndDivider(modelValue.value);
-    localModel.value = modelValue.value;
-  };
-
-  const modelNumber = computed(() => {
-    return Number(`${ displayValue.value }`.replaceAll(thousandDivider.value, "").replace(decimalDivider.value, "."));
-  });
-
-  const modelUndefinedLocal = computed(() => {
-    return required.value
-      ? [
-        "0",
-        decimalDivider.value,
-        times(decimalPartLength.value, () => "0").join(""),
-      ].join("")
-      : modelUndefined.value;
-  });
-
-  const setCurrentValue = (value, updateOutside = false) => {
-    displayValue.value = isNil(value) ? "" : value;
-    let newVal;
-    if (!required.value && isNil(value)) {
-      newVal = modelUndefinedLocal.value;
-    } else {
-      newVal = modelType.value === "number" ?
-        Number(`${ value }`.replaceAll(thousandDivider.value, "").replace(decimalDivider.value, ".")) :
-        value;
-    }
-    if (!updateOutside) {
-      isInternalChange.value = true;
-      localModel.value = newVal;
-      changeModel({ model: newVal });
-    }
-  };
-
-  const clearModel = () => {
-    if (disabled.value) {
-      return;
-    }
-    setCurrentValue(modelUndefinedLocal.value);
-  };
-
-  return {
-    clearModel,
-    displayValue,
-    initLocalVars,
-    isInternalChange,
-    localModel,
-    modelNumber,
-    modelUndefinedLocal,
-    setCurrentValue,
-  };
-}
+import {
+  computed,
+  ref,
+  toRef,
+} from "vue";
+
+import {
+  isNil,
+  times,
+} from "lodash-es";
+
+export default function ModelAPI(props, {
+  adjustFloatPartAndDivider = () => {},
+  changeModel = () => {},
+}) {
+  const required = toRef(props, "required");
+  const modelValue = toRef(props, "modelValue");
+  const modelType = toRef(props, "modelType");
+  const modelUndefined = toRef(props, "modelUndefined");
+  const decimalDivider = toRef(props, "decimalDivider");
+  const disabled = toRef(props, "disabled");
+  const decimalPartLength = toRef(props, "decimalPartLength");
+  const thousandDivider = toRef(props, "thousandDivider");
+
+  const displayValue = ref(undefined);
+  const isInternalChange = ref(false);
+  const localModel = ref(undefined);
+
+  const initLocalVars = () => {
+    displayValue.value = adjustFloatPartAndDivider(modelValue.value);
+    localModel.value = modelValue.value;
+  };
+
+  const modelNumber = computed(() => {
+    return Number(`${ displayValue.value }`.replaceAll(thousandDivider.value, "").replace(decimalDivider.value, "."));
+  });
+
+  const modelUndefinedLocal = computed(() => {
+    return required.value
+      ? [
+        "0",
+        decimalDivider.value,
+        times(decimalPartLength.value, () => "0").join(""),
+      ].join("")
+      : modelUndefined.value;
+  });
+
+  const setCurrentValue = ({ value, updateOutside = false, trigger, triggerDetails } = {}) => {
+    displayValue.value = isNil(value) ? "" : value;
+    let newVal;
+    if (!required.value && isNil(value)) {
+      newVal = modelUndefinedLocal.value;
+    } else {
+      newVal = modelType.value === "number" ?
+        Number(`${ value }`.replaceAll(thousandDivider.value, "").replace(decimalDivider.value, ".")) :
+        value;
+    }
+    if (!updateOutside) {
+      isInternalChange.value = true;
+      localModel.value = newVal;
+      changeModel({ model: newVal, trigger, triggerDetails });
+    }
+  };
+
+  const clearModel = () => {
+    if (disabled.value) {
+      return;
+    }
+    setCurrentValue({ value: modelUndefinedLocal.value, triggerDetails: "clear" });
+  };
+
+  return {
+    clearModel,
+    displayValue,
+    initLocalVars,
+    isInternalChange,
+    localModel,
+    modelNumber,
+    modelUndefinedLocal,
+    setCurrentValue,
+  };
+}

package/src/ui/compositionApi/UiAPI.js

@@ -1,176 +1,185 @@
-import {
-  computed,
-  ref,
-  toRef,
-  toRefs,
-} from "vue";
-
-import UiErrorsAPI from "./UiErrorsAPI";
-
-import {
-  isUndefined,
-} from "lodash-es";
-
-export default function UiAPI(props, { emit }, {
-  setFocus = () => {},
-} = {}) {
-  const change = toRef(props, "change");
-  const defaultProps = toRef(props, "default");
-  const disabled = toRef(props, "disabled");
-  const helpText = toRef(props, "helpText");
-  const htmlId = toRef(props, "htmlId");
-  const id = toRef(props, "id");
-  const idPrefix = toRef(props, "idPrefix");
-  const isLabelFloat = toRef(props, "isLabelFloat");
-  const labelDescription = toRef(props, "labelDescription");
-  const modelUndefined = toRef(props, "modelUndefined");
-  const modelValue = toRef(props, "modelValue");
-
-  const isFocus = ref(false);
-  const isFocusIn = ref(false);
-  const rootRef = ref(undefined);
-
-  const htmlIdLocal = computed(() => {
-    return getHtmlId({
-      id: id.value,
-      idPrefix: idPrefix.value,
-      htmlId: htmlId.value,
-    });
-  });
-
-  const {
-    errorsId,
-    isErrors,
-  } = UiErrorsAPI(props, {
-    htmlIdLocal,
-  });
-
-  const changeModel = ({ model, currentModel, item, init }) => {
-    emit("update:modelValue", model);
-    change.value({
-      currentModel,
-      id: id.value,
-      item,
-      model,
-      props: toRefs(props),
-      init,
-    });
-  };
-
-  const isModel = computed(() => {
-    return !!(modelValue.value || modelValue.value === 0);
-  });
-
-  const clearModel = () => {
-    if (disabled.value) {
-      return;
-    }
-
-    changeModel({
-      model: modelUndefined.value,
-    });
-
-    setFocus();
-  };
-
-  const helpTextId = computed(() => {
-    return `${ htmlIdLocal.value }_help_text`;
-  });
-
-  const labelDescriptionId = computed(() => {
-    return `${ htmlIdLocal.value }_label_description`;
-  });
-
-  const ariaDescribedbyLocal = computed(() => {
-    const ariaDescribedby = [];
-    if (labelDescription.value && !isLabelFloat.value) {
-      ariaDescribedby.push(labelDescriptionId.value);
-    }
-    if (helpText.value) {
-      ariaDescribedby.push(helpTextId.value);
-    }
-    if (isErrors.value) {
-      ariaDescribedby.push(errorsId.value);
-    }
-
-    return ariaDescribedby.join(" ") || undefined;
-  });
-
-  const onFocus = $event => {
-    isFocus.value = true;
-    emit("focus", {
-      event: $event,
-      props,
-    });
-  };
-
-  const onBlur = $event => {
-    isFocus.value = false;
-    emit("blur", {
-      event: $event,
-      props,
-    });
-  };
-
-  const onFocusin = $event => {
-    if (!isFocusIn.value) {
-      isFocusIn.value = true;
-      emit("focusin", {
-        event: $event,
-        props,
-      });
-    }
-  };
-
-  const onFocusout = $event => {
-    if (isFocusIn.value) {
-      if (rootRef.value && !rootRef.value.contains($event.relatedTarget)) {
-        isFocusIn.value = false;
-        emit("focusout", {
-          event: $event,
-          props,
-        });
-      }
-    }
-  };
-
-  const initDefaultModel = () => {
-    if (isUndefined(defaultProps.value) ||
-      !isUndefined(modelValue.value)) {
-      return;
-    }
-
-    changeModel({
-      model: defaultProps.value,
-      currentModel: defaultProps.value,
-      init: true,
-    });
-  };
-
-  return {
-    ariaDescribedbyLocal,
-    changeModel,
-    clearModel,
-    errorsId,
-    helpTextId,
-    htmlIdLocal,
-    initDefaultModel,
-    isErrors,
-    isFocus,
-    isFocusIn,
-    isModel,
-    labelDescriptionId,
-    onBlur,
-    onFocus,
-    onFocusin,
-    onFocusout,
-    rootRef,
-  };
-}
-
-export function getHtmlId({ id, idPrefix, htmlId }) {
-  if (htmlId) {
-    return htmlId;
-  }
-  return `${ idPrefix || "" }${ id }`;
-}
+import {
+  computed,
+  ref,
+  toRef,
+  toRefs,
+} from "vue";
+
+import UiErrorsAPI from "./UiErrorsAPI";
+
+import {
+  isUndefined,
+} from "lodash-es";
+
+export default function UiAPI(props, { emit }, {
+  setFocus = () => {},
+} = {}) {
+  const change = toRef(props, "change");
+  const defaultProps = toRef(props, "default");
+  const disabled = toRef(props, "disabled");
+  const helpText = toRef(props, "helpText");
+  const htmlId = toRef(props, "htmlId");
+  const id = toRef(props, "id");
+  const idPrefix = toRef(props, "idPrefix");
+  const isLabelFloat = toRef(props, "isLabelFloat");
+  const labelDescription = toRef(props, "labelDescription");
+  const modelUndefined = toRef(props, "modelUndefined");
+  const modelValue = toRef(props, "modelValue");
+
+  const isFocus = ref(false);
+  const isFocusIn = ref(false);
+  const rootRef = ref(undefined);
+
+  const htmlIdLocal = computed(() => {
+    return getHtmlId({
+      id: id.value,
+      idPrefix: idPrefix.value,
+      htmlId: htmlId.value,
+    });
+  });
+
+  const {
+    errorsId,
+    isErrors,
+  } = UiErrorsAPI(props, {
+    htmlIdLocal,
+  });
+
+  const changeModel = ({ model, currentModel, item, init, trigger = "change", triggerDetails } = {}) => {
+    emit("update:modelValue", model);
+    const RETURN_ARGS = {
+      currentModel,
+      id: id.value,
+      item,
+      model,
+      props: toRefs(props),
+      init,
+      trigger,
+    };
+
+    if (triggerDetails) {
+      RETURN_ARGS.triggerDetails = triggerDetails;
+    }
+
+    change.value(RETURN_ARGS);
+  };
+
+  const isModel = computed(() => {
+    return !!(modelValue.value || modelValue.value === 0);
+  });
+
+  const clearModel = () => {
+    if (disabled.value) {
+      return;
+    }
+
+    changeModel({
+      model: modelUndefined.value,
+      triggerDetails: "clear",
+    });
+
+    setFocus();
+  };
+
+  const helpTextId = computed(() => {
+    return `${ htmlIdLocal.value }_help_text`;
+  });
+
+  const labelDescriptionId = computed(() => {
+    return `${ htmlIdLocal.value }_label_description`;
+  });
+
+  const ariaDescribedbyLocal = computed(() => {
+    const ariaDescribedby = [];
+    if (labelDescription.value && !isLabelFloat.value) {
+      ariaDescribedby.push(labelDescriptionId.value);
+    }
+    if (helpText.value) {
+      ariaDescribedby.push(helpTextId.value);
+    }
+    if (isErrors.value) {
+      ariaDescribedby.push(errorsId.value);
+    }
+
+    return ariaDescribedby.join(" ") || undefined;
+  });
+
+  const onFocus = $event => {
+    isFocus.value = true;
+    emit("focus", {
+      event: $event,
+      props,
+    });
+  };
+
+  const onBlur = $event => {
+    isFocus.value = false;
+    emit("blur", {
+      event: $event,
+      props,
+    });
+  };
+
+  const onFocusin = $event => {
+    if (!isFocusIn.value) {
+      isFocusIn.value = true;
+      emit("focusin", {
+        event: $event,
+        props,
+      });
+    }
+  };
+
+  const onFocusout = $event => {
+    if (isFocusIn.value) {
+      if (rootRef.value && !rootRef.value.contains($event.relatedTarget)) {
+        isFocusIn.value = false;
+        emit("focusout", {
+          event: $event,
+          props,
+        });
+      }
+    }
+  };
+
+  const initDefaultModel = () => {
+    if (isUndefined(defaultProps.value) ||
+      !isUndefined(modelValue.value)) {
+      return;
+    }
+
+    changeModel({
+      model: defaultProps.value,
+      currentModel: defaultProps.value,
+      init: true,
+      triggerDetails: "init",
+    });
+  };
+
+  return {
+    ariaDescribedbyLocal,
+    changeModel,
+    clearModel,
+    errorsId,
+    helpTextId,
+    htmlIdLocal,
+    initDefaultModel,
+    isErrors,
+    isFocus,
+    isFocusIn,
+    isModel,
+    labelDescriptionId,
+    onBlur,
+    onFocus,
+    onFocusin,
+    onFocusout,
+    rootRef,
+  };
+}
+
+export function getHtmlId({ id, idPrefix, htmlId }) {
+  if (htmlId) {
+    return htmlId;
+  }
+  return `${ idPrefix || "" }${ id }`;
+}