aloha-vue 2.74.0 → 2.75.0

package/src/ui/ADatepickerAlt/utils/index.js

@@ -1,98 +1,98 @@
-// import fecha from "fecha";
-import moment from "moment";
-
-export function isPlainObject(obj) {
-  return Object.prototype.toString.call(obj) === "[object Object]";
-}
-
-export function isDateObject(value) {
-  return value instanceof Date;
-}
-
-export function isValidDate(date) {
-  if (date === null || date === undefined) {
-    return false;
-  }
-  return !isNaN(new Date(date).getTime());
-}
-
-export function isValidRangeDate(date) {
-  return (
-    Array.isArray(date) &&
-    date.length === 2 &&
-    isValidDate(date[0]) &&
-    isValidDate(date[1]) &&
-    (new Date(date[1]).getTime() >= new Date(date[0]).getTime())
-  );
-}
-
-export function parseTime(time) {
-  const VALUES = (time || "").split(":");
-  if (VALUES.length >= 2) {
-    const hours = parseInt(VALUES[0], 10);
-    const minutes = parseInt(VALUES[1], 10);
-    return {
-      hours,
-      minutes,
-    };
-  }
-  return null;
-}
-
-export function formatTime(time, type = "24", a = "a") {
-  let hours = time.hours;
-  hours = (type === "24") ? hours : (hours % 12 || 12);
-  hours = hours < 10 ? "0" + hours : hours;
-  const minutes = time.minutes < 10 ? "0" + time.minutes : time.minutes;
-  let result = hours + ":" + minutes;
-  if (type === "12") {
-    let suffix = time.hours >= 12 ? "pm" : "am";
-    if (a === "A") {
-      suffix = suffix.toUpperCase();
-    }
-    result = `${ result } ${ suffix }`;
-  }
-  return result;
-}
-
-export function formatDate(date, format) {
-  if (!date) {
-    return "";
-  }
-  try {
-    return moment(date).format(format);
-    // return fecha.format(new Date(date), format);
-  } catch (e) {
-    return "";
-  }
-}
-
-export function parseDate(value, format, formatSave) {
-  try {
-    return moment(value, formatSave).format(format) || null;
-  } catch (e) {
-    return null;
-  }
-}
-
-export function throttle(action, delay) {
-  let lastRun = 0;
-  let timeout = null;
-  return function() {
-    if (timeout) {
-      return;
-    }
-    const args = arguments;
-    const elapsed = Date.now() - lastRun;
-    const callBack = () => {
-      lastRun = Date.now();
-      timeout = null;
-      action.apply(this, args);
-    };
-    if (elapsed >= delay) {
-      callBack();
-    } else {
-      timeout = setTimeout(callBack, delay);
-    }
-  };
-}
+// import fecha from "fecha";
+import moment from "moment";
+
+export function isPlainObject(obj) {
+  return Object.prototype.toString.call(obj) === "[object Object]";
+}
+
+export function isDateObject(value) {
+  return value instanceof Date;
+}
+
+export function isValidDate(date) {
+  if (date === null || date === undefined) {
+    return false;
+  }
+  return !isNaN(new Date(date).getTime());
+}
+
+export function isValidRangeDate(date) {
+  return (
+    Array.isArray(date) &&
+    date.length === 2 &&
+    isValidDate(date[0]) &&
+    isValidDate(date[1]) &&
+    (new Date(date[1]).getTime() >= new Date(date[0]).getTime())
+  );
+}
+
+export function parseTime(time) {
+  const VALUES = (time || "").split(":");
+  if (VALUES.length >= 2) {
+    const hours = parseInt(VALUES[0], 10);
+    const minutes = parseInt(VALUES[1], 10);
+    return {
+      hours,
+      minutes,
+    };
+  }
+  return null;
+}
+
+export function formatTime(time, type = "24", a = "a") {
+  let hours = time.hours;
+  hours = (type === "24") ? hours : (hours % 12 || 12);
+  hours = hours < 10 ? "0" + hours : hours;
+  const minutes = time.minutes < 10 ? "0" + time.minutes : time.minutes;
+  let result = hours + ":" + minutes;
+  if (type === "12") {
+    let suffix = time.hours >= 12 ? "pm" : "am";
+    if (a === "A") {
+      suffix = suffix.toUpperCase();
+    }
+    result = `${ result } ${ suffix }`;
+  }
+  return result;
+}
+
+export function formatDate(date, format) {
+  if (!date) {
+    return "";
+  }
+  try {
+    return moment(date).format(format);
+    // return fecha.format(new Date(date), format);
+  } catch(e) {
+    return "";
+  }
+}
+
+export function parseDate(value, format, formatSave) {
+  try {
+    return moment(value, formatSave).format(format) || null;
+  } catch(e) {
+    return null;
+  }
+}
+
+export function throttle(action, delay) {
+  let lastRun = 0;
+  let timeout = null;
+  return function() {
+    if (timeout) {
+      return;
+    }
+    const args = arguments;
+    const elapsed = Date.now() - lastRun;
+    const callBack = () => {
+      lastRun = Date.now();
+      timeout = null;
+      action.apply(this, args);
+    };
+    if (elapsed >= delay) {
+      callBack();
+    } else {
+      timeout = setTimeout(callBack, delay);
+    }
+  };
+}

package/src/ui/AFieldset/__tests__/AFieldset.ClassColumn.test.js

@@ -1,114 +1,113 @@
-import {
-  h,
-} from "vue";
-import {
-  afterEach,
-  describe,
-  expect,
-  it,
-  jest,
-} from "@jest/globals";
-import {
-  mount,
-} from "@vue/test-utils";
-
-import AFieldset from "../AFieldset";
-import {
-  AFormPluginOptions,
-} from "../../../plugins/AFormPlugin";
-
-jest.mock("../../../index", () => {
-  const {
-    computed,
-    h: hLocal,
-    ref,
-  } = require("vue");
-  const {
-    AFormPluginOptions: pluginOptions,
-  } = require("../../../plugins/AFormPlugin");
-
-  const componentStub = {
-    render() {
-      return hLocal("div");
-    },
-  };
-
-  return {
-    AElement: componentStub,
-    AErrorsText: componentStub,
-    AFormHelpText: componentStub,
-    AFormLabelDescription: componentStub,
-    AFormPluginOptions: pluginOptions,
-    AFormReadonly: componentStub,
-    AGroup: componentStub,
-    AUiTypes_typesContainer: ref({}),
-    UiAPI: props => ({
-      ariaDescribedbyLocal: computed(() => undefined),
-      errorsId: computed(() => `${ props.id }_errors`),
-      helpTextId: computed(() => `${ props.id }_help`),
-      htmlIdLocal: computed(() => props.htmlId || props.id),
-      isErrors: computed(() => false),
-      labelDescriptionId: computed(() => `${ props.id }_description`),
-    }),
-    UiCollapseAPI: () => ({
-      iconCollapse: computed(() => undefined),
-      initIsCollapsedLocal: () => {},
-      isCollapsedLocal: ref(false),
-      titleCollapse: computed(() => undefined),
-      toggleCollapse: () => {},
-    }),
-    UIExcludeRenderAttributesAPI: () => ({
-      attributesToExcludeFromRender: computed(() => ({})),
-    }),
-    UiStyleHideAPI: () => ({
-      componentStyleHide: computed(() => ""),
-    }),
-    UiTextAfterLabelAPI: () => ({
-      textAfterLabel: computed(() => ""),
-    }),
-  };
-});
-
-jest.mock("../../AUiComponents", () => ({
-  __esModule: true,
-  default: {},
-}));
-
-const COMPONENTS_ORIGINAL = AFormPluginOptions.components;
-
-afterEach(() => {
-  AFormPluginOptions.components = COMPONENTS_ORIGINAL;
-});
-
-describe("AFieldset classColumn", () => {
-  it("applies classColumn to the child component without a wrapper element", () => {
-    AFormPluginOptions.components = {
-      testColumn: {
-        inheritAttrs: false,
-        render() {
-          return h("section", {
-            ...this.$attrs,
-            "data-testid": "child",
-          });
-        },
-      },
-    };
-
-    const wrapper = mount(AFieldset, {
-      props: {
-        children: [{
-          classColumn: "test_column",
-          id: "child",
-          type: "testColumn",
-        }],
-        modelValue: {},
-      },
-    });
-
-    const content = wrapper.get(".a_fieldset__content");
-    const child = content.get("[data-testid='child']");
-
-    expect(child.classes()).toContain("test_column");
-    expect(child.element.parentElement).toBe(content.element);
-  });
-});
+import {
+  h,
+} from "vue";
+import {
+  afterEach,
+  describe,
+  expect,
+  it,
+  vi,
+} from "vitest";
+import {
+  mount,
+} from "@vue/test-utils";
+
+import AFieldset from "../AFieldset";
+import {
+  AFormPluginOptions,
+} from "../../../plugins/AFormPlugin";
+
+vi.mock("../../../index", async() => {
+  const {
+    computed,
+    h: hLocal,
+    ref,
+  } = await vi.importActual("vue");
+  const {
+    AFormPluginOptions: pluginOptions,
+  } = await vi.importActual("../../../plugins/AFormPlugin");
+
+  const componentStub = {
+    render() {
+      return hLocal("div");
+    },
+  };
+
+  return {
+    AElement: componentStub,
+    AErrorsText: componentStub,
+    AFormHelpText: componentStub,
+    AFormLabelDescription: componentStub,
+    AFormPluginOptions: pluginOptions,
+    AFormReadonly: componentStub,
+    AGroup: componentStub,
+    AUiTypes_typesContainer: ref({}),
+    UiAPI: props => ({
+      ariaDescribedbyLocal: computed(() => undefined),
+      errorsId: computed(() => `${ props.id }_errors`),
+      helpTextId: computed(() => `${ props.id }_help`),
+      htmlIdLocal: computed(() => props.htmlId || props.id),
+      isErrors: computed(() => false),
+      labelDescriptionId: computed(() => `${ props.id }_description`),
+    }),
+    UiCollapseAPI: () => ({
+      iconCollapse: computed(() => undefined),
+      initIsCollapsedLocal: () => {},
+      isCollapsedLocal: ref(false),
+      titleCollapse: computed(() => undefined),
+      toggleCollapse: () => {},
+    }),
+    UIExcludeRenderAttributesAPI: () => ({
+      attributesToExcludeFromRender: computed(() => ({})),
+    }),
+    UiStyleHideAPI: () => ({
+      componentStyleHide: computed(() => ""),
+    }),
+    UiTextAfterLabelAPI: () => ({
+      textAfterLabel: computed(() => ""),
+    }),
+  };
+});
+
+vi.mock("../../AUiComponents", () => ({
+  default: {},
+}));
+
+const COMPONENTS_ORIGINAL = AFormPluginOptions.components;
+
+afterEach(() => {
+  AFormPluginOptions.components = COMPONENTS_ORIGINAL;
+});
+
+describe("AFieldset classColumn", () => {
+  it("applies classColumn to the child component without a wrapper element", () => {
+    AFormPluginOptions.components = {
+      testColumn: {
+        inheritAttrs: false,
+        render() {
+          return h("section", {
+            ...this.$attrs,
+            "data-testid": "child",
+          });
+        },
+      },
+    };
+
+    const wrapper = mount(AFieldset, {
+      props: {
+        children: [{
+          classColumn: "test_column",
+          id: "child",
+          type: "testColumn",
+        }],
+        modelValue: {},
+      },
+    });
+
+    const content = wrapper.get(".a_fieldset__content");
+    const child = content.get("[data-testid='child']");
+
+    expect(child.classes()).toContain("test_column");
+    expect(child.element.parentElement).toBe(content.element);
+  });
+});

package/src/ui/AFormElementBtnClear/AFormElementBtnClear.js

@@ -7,7 +7,10 @@ import {
 
 import ClearAPI from "./compositionAPI/ClearAPI";
 
-import XLg from "aloha-svg/dist/js/bootstrap/XLg";
+const XLg = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-x-lg" viewBox="0 0 16 16">
+  <path d="M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8z"/>
+</svg>`;
+
 
 export default {
   name: "AFormElementBtnClear",

package/src/ui/AInputCurrency/AInputCurrency.js

@@ -30,12 +30,17 @@ import VerifyAPI from "./compositionAPI/VerifyAPI";
 import WidthAPI from "./compositionAPI/WidthAPI";
 
 import ASafeHtml from "../../directives/ASafeHtml";
-import Dash from "aloha-svg/dist/js/bootstrap/Dash";
-import Plus from "aloha-svg/dist/js/bootstrap/Plus";
 import {
   uniqueId,
 } from "lodash-es";
 
+const Dash = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-dash" viewBox="0 0 16 16">
+  <path d="M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8"/>
+</svg>`;
+const Plus = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-plus" viewBox="0 0 16 16">
+  <path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4"/>
+</svg>`;
+
 export default {
   name: "AInputCurrency",
   inheritAttrs: false,
@@ -353,10 +358,10 @@ export default {
     } = VerifyAPI(props);
 
     const {
-      clearModel,
-      displayValue,
-      displayValueReadonly,
-      initLocalVars,
+      clearModel,
+      displayValue,
+      displayValueReadonly,
+      initLocalVars,
       isInternalChange,
       localModel,
       modelNumber,
@@ -416,10 +421,10 @@ export default {
       attributesToExcludeFromRender,
       clearModel,
       componentStyleHide,
-      decrease,
-      displayValue,
-      displayValueReadonly,
-      errorsId,
+      decrease,
+      displayValue,
+      displayValueReadonly,
+      errorsId,
       hasErrorIcon,
       handleInput,
       handleKeydown,
@@ -454,7 +459,7 @@ export default {
         label: this.label,
         labelClass: this.labelClass,
         labelScreenReader: this.labelScreenReader,
-        modelValue: this.displayValueReadonly,
+        modelValue: this.displayValueReadonly,
         readonlyDefault: this.readonlyDefault,
         required: this.required,
         style: this.componentStyleHide,
@@ -519,10 +524,10 @@ export default {
               },
             }, [
               ((this.label || this.labelScreenReader) && this.isLabelFloat) ?
-                h(ALabel, {
-                  id: this.htmlIdLocal,
-                  extra: this.extra,
-                  isLabelFloat: this.isLabelFloat,
+                h(ALabel, {
+                  id: this.htmlIdLocal,
+                  extra: this.extra,
+                  isLabelFloat: this.isLabelFloat,
                   isError: this.isErrors,
                   label: this.label,
                   labelClass: this.labelClass,

package/src/ui/AInputCurrency/__tests__/AInputCurrency.ModelAPI.test.js

@@ -1,73 +1,73 @@
-import {
-  reactive,
-} from "vue";
-import {
-  describe,
-  expect,
-  it,
-} from "@jest/globals";
-
-import ModelAPI from "../compositionAPI/ModelAPI";
-
-const getModelAPI = () => {
-  const props = reactive({
-    currencySymbol: "€",
-    currencySymbolPosition: "right",
-    decimalDivider: ",",
-    decimalPartLength: 2,
-    disabled: false,
-    modelType: "number",
-    modelUndefined: undefined,
-    modelValue: 1234.5,
-    required: false,
-    skipRequiredModelInit: false,
-    thousandDivider: ".",
-  });
-  const modelAPI = ModelAPI(props, {
-    adjustFloatPartAndDivider: () => "1.234,50",
-  });
-
-  modelAPI.initLocalVars();
-
-  return {
-    modelAPI,
-    props,
-  };
-};
-
-describe("AInputCurrency ModelAPI", () => {
-  it("adds the currency symbol to the readonly display value at the configured position", () => {
-    const {
-      modelAPI,
-      props,
-    } = getModelAPI();
-
-    expect(modelAPI.displayValueReadonly.value).toBe("1.234,50 €");
-
-    props.currencySymbol = "$";
-    props.currencySymbolPosition = "left";
-
-    expect(modelAPI.displayValueReadonly.value).toBe("$ 1.234,50");
-  });
-
-  it("does not add the currency symbol to an empty readonly display value", () => {
-    const {
-      modelAPI,
-    } = getModelAPI();
-
-    modelAPI.displayValue.value = "";
-
-    expect(modelAPI.displayValueReadonly.value).toBe("");
-  });
-
-  it("keeps the readonly display value unchanged when the currency symbol is empty", () => {
-    const {
-      modelAPI,
-      props,
-    } = getModelAPI();
-
-    props.currencySymbol = "";
-
-    expect(modelAPI.displayValueReadonly.value).toBe("1.234,50");
-  });
-});
+import {
+  reactive,
+} from "vue";
+import {
+  describe,
+  expect,
+  it,
+} from "vitest";
+
+import ModelAPI from "../compositionAPI/ModelAPI";
+
+const getModelAPI = () => {
+  const props = reactive({
+    currencySymbol: "€",
+    currencySymbolPosition: "right",
+    decimalDivider: ",",
+    decimalPartLength: 2,
+    disabled: false,
+    modelType: "number",
+    modelUndefined: undefined,
+    modelValue: 1234.5,
+    required: false,
+    skipRequiredModelInit: false,
+    thousandDivider: ".",
+  });
+  const modelAPI = ModelAPI(props, {
+    adjustFloatPartAndDivider: () => "1.234,50",
+  });
+
+  modelAPI.initLocalVars();
+
+  return {
+    modelAPI,
+    props,
+  };
+};
+
+describe("AInputCurrency ModelAPI", () => {
+  it("adds the currency symbol to the readonly display value at the configured position", () => {
+    const {
+      modelAPI,
+      props,
+    } = getModelAPI();
+
+    expect(modelAPI.displayValueReadonly.value).toBe("1.234,50 €");
+
+    props.currencySymbol = "$";
+    props.currencySymbolPosition = "left";
+
+    expect(modelAPI.displayValueReadonly.value).toBe("$ 1.234,50");
+  });
+
+  it("does not add the currency symbol to an empty readonly display value", () => {
+    const {
+      modelAPI,
+    } = getModelAPI();
+
+    modelAPI.displayValue.value = "";
+
+    expect(modelAPI.displayValueReadonly.value).toBe("");
+  });
+
+  it("keeps the readonly display value unchanged when the currency symbol is empty", () => {
+    const {
+      modelAPI,
+      props,
+    } = getModelAPI();
+
+    props.currencySymbol = "";
+
+    expect(modelAPI.displayValueReadonly.value).toBe("1.234,50");
+  });
+});