aloha-vue 2.76.0 → 2.78.0

package/src/ui/ADatepicker/panel/APanelTime/compositionAPI/TimesAPI.js

@@ -1,169 +1,169 @@
-import {
-  computed,
-  toRef,
-} from "vue";
-
-import {
-  isFunction,
-  range,
-} from "lodash-es";
-
-export default function TimesAPI(props) {
-  const currentLanguage = toRef(props, "currentLanguage");
-  const disabledTime = toRef(props, "disabledTime");
-  const id = toRef(props, "id");
-  const minuteStep = toRef(props, "minuteStep");
-  const timePrecision = toRef(props, "timePrecision");
-  const value = toRef(props, "value");
-
-  const isDisabledTimeFunction = computed(() => {
-    return isFunction(disabledTime.value);
-  });
-
-  const stringifyText = value => {
-    return ("00" + value).slice(String(value).length);
-  };
-
-  const date = computed(() => {
-    return value.value ?
-      new Date(value.value) :
-      new Date().setHours(0, 0, 0, 0);
-  });
-
-  const getCurrentId = ({ columnIndex, rowIndex }) => {
-    return `${ id.value }_time_${ columnIndex }_${ rowIndex }`;
-  };
-
-  const hours = computed(() => {
-    return range(24);
-  });
-
-  const currentHours = computed(() => {
-    return value.value ?
-      new Date(value.value).getHours() :
-      0;
-  });
-
-  const timePrecisionLocal = computed(() => {
-    if (timePrecision.value) {
-      return timePrecision.value;
-    }
-
-    return minuteStep.value === 0 ? "second" : "minute";
-  });
-
-  const minuteStepLocal = computed(() => {
-    return minuteStep.value || 1;
-  });
-
-  const minuteLength = computed(() => {
-    return parseInt(60 / minuteStepLocal.value);
-  });
-
-  const minutes = computed(() => {
-    if (timePrecisionLocal.value === "hour") {
-      return [];
-    }
-
-    return range(0, minuteLength.value * minuteStepLocal.value, minuteStepLocal.value);
-  });
-
-  const currentMinutes = computed(() => {
-    return value.value ?
-      new Date(value.value).getMinutes() :
-      0;
-  });
-
-  const seconds = computed(() => {
-    return timePrecisionLocal.value === "second" ?
-      range(0, 60) :
-      [];
-  });
-
-  const normalizeTimeByPrecision = time => {
-    const TIME_LOCAL = new Date(time);
-
-    if (timePrecisionLocal.value === "hour") {
-      TIME_LOCAL.setMinutes(0, 0, 0);
-    } else if (timePrecisionLocal.value === "minute") {
-      TIME_LOCAL.setSeconds(0, 0);
-    }
-
-    return TIME_LOCAL;
-  };
-
-  const currentSeconds = computed(() => {
-    return value.value ?
-      new Date(value.value).getSeconds() :
-      0;
-  });
-
-  const setColumn = ({ times, timeFunctionName, currentTime, ariaLabel, columnIndex }) => {
-    const TIMES_COLUMN = [];
-    times.forEach((time, timeIndex) => {
-      const CURRENT_TIME_LOCAL = new Date(date.value);
-      CURRENT_TIME_LOCAL[timeFunctionName](time);
-      const CURRENT_TIME = normalizeTimeByPrecision(CURRENT_TIME_LOCAL).getTime();
-      const IS_ACTIVE = time === currentTime;
-      const IS_DISABLED = isDisabledTimeFunction.value && disabledTime.value(CURRENT_TIME);
-      const LABEL = stringifyText(time);
-      TIMES_COLUMN.push({
-        label: LABEL,
-        time: CURRENT_TIME,
-        isActive: IS_ACTIVE,
-        isDisabled: IS_DISABLED,
-        ariaLabel: `${ ariaLabel }: ${ LABEL }`,
-        id: getCurrentId({
-          columnIndex,
-          rowIndex: timeIndex,
-        }),
-      });
-    });
-
-    return TIMES_COLUMN;
-  };
-
-  const timesFiltered = computed(() => {
-    const TIMES_FILTERED = [];
-    let columnIndex = 0;
-    const HOURS_COLUMN = setColumn({
-      times: hours.value,
-      timeFunctionName: "setHours",
-      currentTime: currentHours.value,
-      ariaLabel: currentLanguage.value.hours,
-      columnIndex,
-    });
-    if (HOURS_COLUMN.length) {
-      TIMES_FILTERED.push(HOURS_COLUMN);
-      columnIndex++;
-    }
-    const MINUTES_COLUMN = setColumn({
-      times: minutes.value,
-      timeFunctionName: "setMinutes",
-      currentTime: currentMinutes.value,
-      ariaLabel: currentLanguage.value.minutes,
-      columnIndex,
-    });
-    if (MINUTES_COLUMN.length) {
-      TIMES_FILTERED.push(MINUTES_COLUMN);
-      columnIndex++;
-    }
-    const SECONDS_COLUMN = setColumn({
-      times: seconds.value,
-      timeFunctionName: "setSeconds",
-      currentTime: currentSeconds.value,
-      ariaLabel: currentLanguage.value.seconds,
-      columnIndex,
-    });
-    if (SECONDS_COLUMN.length) {
-      TIMES_FILTERED.push(SECONDS_COLUMN);
-    }
-
-    return TIMES_FILTERED;
-  });
-
-  return {
-    getCurrentId,
-    timesFiltered,
-  };
-}
+import {
+  computed,
+  toRef,
+} from "vue";
+
+import {
+  isFunction,
+  range,
+} from "lodash-es";
+
+export default function TimesAPI(props) {
+  const currentLanguage = toRef(props, "currentLanguage");
+  const disabledTime = toRef(props, "disabledTime");
+  const id = toRef(props, "id");
+  const minuteStep = toRef(props, "minuteStep");
+  const timePrecision = toRef(props, "timePrecision");
+  const value = toRef(props, "value");
+
+  const isDisabledTimeFunction = computed(() => {
+    return isFunction(disabledTime.value);
+  });
+
+  const stringifyText = value => {
+    return ("00" + value).slice(String(value).length);
+  };
+
+  const date = computed(() => {
+    return value.value ?
+      new Date(value.value) :
+      new Date().setHours(0, 0, 0, 0);
+  });
+
+  const getCurrentId = ({ columnIndex, rowIndex }) => {
+    return `${ id.value }_time_${ columnIndex }_${ rowIndex }`;
+  };
+
+  const hours = computed(() => {
+    return range(24);
+  });
+
+  const currentHours = computed(() => {
+    return value.value ?
+      new Date(value.value).getHours() :
+      0;
+  });
+
+  const timePrecisionLocal = computed(() => {
+    if (timePrecision.value) {
+      return timePrecision.value;
+    }
+
+    return minuteStep.value === 0 ? "second" : "minute";
+  });
+
+  const minuteStepLocal = computed(() => {
+    return minuteStep.value || 1;
+  });
+
+  const minuteLength = computed(() => {
+    return parseInt(60 / minuteStepLocal.value);
+  });
+
+  const minutes = computed(() => {
+    if (timePrecisionLocal.value === "hour") {
+      return [];
+    }
+
+    return range(0, minuteLength.value * minuteStepLocal.value, minuteStepLocal.value);
+  });
+
+  const currentMinutes = computed(() => {
+    return value.value ?
+      new Date(value.value).getMinutes() :
+      0;
+  });
+
+  const seconds = computed(() => {
+    return timePrecisionLocal.value === "second" ?
+      range(0, 60) :
+      [];
+  });
+
+  const normalizeTimeByPrecision = time => {
+    const TIME_LOCAL = new Date(time);
+
+    if (timePrecisionLocal.value === "hour") {
+      TIME_LOCAL.setMinutes(0, 0, 0);
+    } else if (timePrecisionLocal.value === "minute") {
+      TIME_LOCAL.setSeconds(0, 0);
+    }
+
+    return TIME_LOCAL;
+  };
+
+  const currentSeconds = computed(() => {
+    return value.value ?
+      new Date(value.value).getSeconds() :
+      0;
+  });
+
+  const setColumn = ({ times, timeFunctionName, currentTime, ariaLabel, columnIndex }) => {
+    const TIMES_COLUMN = [];
+    times.forEach((time, timeIndex) => {
+      const CURRENT_TIME_LOCAL = new Date(date.value);
+      CURRENT_TIME_LOCAL[timeFunctionName](time);
+      const CURRENT_TIME = normalizeTimeByPrecision(CURRENT_TIME_LOCAL).getTime();
+      const IS_ACTIVE = time === currentTime;
+      const IS_DISABLED = isDisabledTimeFunction.value && disabledTime.value(CURRENT_TIME);
+      const LABEL = stringifyText(time);
+      TIMES_COLUMN.push({
+        label: LABEL,
+        time: CURRENT_TIME,
+        isActive: IS_ACTIVE,
+        isDisabled: IS_DISABLED,
+        ariaLabel: `${ ariaLabel }: ${ LABEL }`,
+        id: getCurrentId({
+          columnIndex,
+          rowIndex: timeIndex,
+        }),
+      });
+    });
+
+    return TIMES_COLUMN;
+  };
+
+  const timesFiltered = computed(() => {
+    const TIMES_FILTERED = [];
+    let columnIndex = 0;
+    const HOURS_COLUMN = setColumn({
+      times: hours.value,
+      timeFunctionName: "setHours",
+      currentTime: currentHours.value,
+      ariaLabel: currentLanguage.value.hours,
+      columnIndex,
+    });
+    if (HOURS_COLUMN.length) {
+      TIMES_FILTERED.push(HOURS_COLUMN);
+      columnIndex++;
+    }
+    const MINUTES_COLUMN = setColumn({
+      times: minutes.value,
+      timeFunctionName: "setMinutes",
+      currentTime: currentMinutes.value,
+      ariaLabel: currentLanguage.value.minutes,
+      columnIndex,
+    });
+    if (MINUTES_COLUMN.length) {
+      TIMES_FILTERED.push(MINUTES_COLUMN);
+      columnIndex++;
+    }
+    const SECONDS_COLUMN = setColumn({
+      times: seconds.value,
+      timeFunctionName: "setSeconds",
+      currentTime: currentSeconds.value,
+      ariaLabel: currentLanguage.value.seconds,
+      columnIndex,
+    });
+    if (SECONDS_COLUMN.length) {
+      TIMES_FILTERED.push(SECONDS_COLUMN);
+    }
+
+    return TIMES_FILTERED;
+  });
+
+  return {
+    getCurrentId,
+    timesFiltered,
+  };
+}

package/src/ui/ADatepicker/panel/APanelYear/APanelYear.js

@@ -1,123 +1,123 @@
-/* eslint vue/component-api-style: off */
-import {
-  h,
-  onBeforeUnmount,
-} from "vue";
-
-import APanelYearItem from "../APanelYearItem/APanelYearItem";
-
-import FocusAPI from "./compositionAPI/FocusAPI";
-import FocusActiveAPI from "./compositionAPI/FocusActiveAPI";
-import PanelAPI from "../compositionAPI/PanelAPI";
-import SelectAPI from "./compositionAPI/SelectAPI";
-
-import {
-  range,
-} from "lodash-es";
-
-// @vue/component
-export default {
-  name: "APanelYear",
-  props: {
-    disabledYear: {
-      type: Function,
-      required: false,
-      default: undefined,
-    },
-    firstYear: {
-      type: Number,
-      required: true,
-    },
-    id: {
-      type: String,
-      required: true,
-    },
-    value: {
-      type: [String, Number, Boolean, Array, Object, Date, Function, Symbol],
-      required: false,
-      default: undefined,
-    },
-  },
-  emits: [
-    "handleIconYear",
-    "select",
-  ],
-  setup(props, context) {
-    const {
-      isDisabled,
-      selectYear,
-    } = SelectAPI(props, context);
-
-    const {
-      idForFocus,
-      prefixForId,
-      pressButton,
-      yearIndexForFocus,
-    } = FocusAPI(props, context);
-
-    const {
-      attributesForMainElement,
-      destroyEventBus,
-      destroyListenerForPressButtons,
-      idForHeader,
-      setEventBus,
-      setListenerForPressButtons,
-    } = PanelAPI(props, {
-      idForFocus,
-      pressButton,
-    });
-
-    const {
-      firstYearLocal,
-      setFocusToActiveYear,
-      yearFromValue,
-    } = FocusActiveAPI(props, {
-      idForFocus,
-      setListenerForPressButtons,
-      yearIndexForFocus,
-    });
-
-    setEventBus();
-
-    onBeforeUnmount(() => {
-      destroyEventBus();
-      destroyListenerForPressButtons();
-    });
-
-    return {
-      attributesForMainElement,
-      firstYearLocal,
-      idForFocus,
-      idForHeader,
-      isDisabled,
-      prefixForId,
-      selectYear,
-      setFocusToActiveYear,
-      yearFromValue,
-      yearIndexForFocus,
-    };
-  },
-  render() {
-    return h("ul", {
-      class: "pux_datepicker__panel pux_datepicker__panel_year pux_datepicker__panel__list",
-      role: "listbox",
-      "aria-labelledby": this.idForHeader,
-      ...this.attributesForMainElement,
-    }, [
-      range(10).map(index => {
-        return h(APanelYearItem, {
-          key: index,
-          class: {
-            pux_datepicker__panel__cell_focus: index === this.yearIndexForFocus,
-          },
-          year: this.firstYearLocal + index,
-          yearFromValue: this.yearFromValue,
-          yearIndex: index,
-          prefixForId: this.prefixForId,
-          isDisabled: this.isDisabled,
-          onSelectYear: this.selectYear,
-        });
-      }),
-    ]);
-  },
-};
+/* eslint vue/component-api-style: off */
+import {
+  h,
+  onBeforeUnmount,
+} from "vue";
+
+import APanelYearItem from "../APanelYearItem/APanelYearItem";
+
+import FocusAPI from "./compositionAPI/FocusAPI";
+import FocusActiveAPI from "./compositionAPI/FocusActiveAPI";
+import PanelAPI from "../compositionAPI/PanelAPI";
+import SelectAPI from "./compositionAPI/SelectAPI";
+
+import {
+  range,
+} from "lodash-es";
+
+// @vue/component
+export default {
+  name: "APanelYear",
+  props: {
+    disabledYear: {
+      type: Function,
+      required: false,
+      default: undefined,
+    },
+    firstYear: {
+      type: Number,
+      required: true,
+    },
+    id: {
+      type: String,
+      required: true,
+    },
+    value: {
+      type: [String, Number, Boolean, Array, Object, Date, Function, Symbol],
+      required: false,
+      default: undefined,
+    },
+  },
+  emits: [
+    "handleIconYear",
+    "select",
+  ],
+  setup(props, context) {
+    const {
+      isDisabled,
+      selectYear,
+    } = SelectAPI(props, context);
+
+    const {
+      idForFocus,
+      prefixForId,
+      pressButton,
+      yearIndexForFocus,
+    } = FocusAPI(props, context);
+
+    const {
+      attributesForMainElement,
+      destroyEventBus,
+      destroyListenerForPressButtons,
+      idForHeader,
+      setEventBus,
+      setListenerForPressButtons,
+    } = PanelAPI(props, {
+      idForFocus,
+      pressButton,
+    });
+
+    const {
+      firstYearLocal,
+      setFocusToActiveYear,
+      yearFromValue,
+    } = FocusActiveAPI(props, {
+      idForFocus,
+      setListenerForPressButtons,
+      yearIndexForFocus,
+    });
+
+    setEventBus();
+
+    onBeforeUnmount(() => {
+      destroyEventBus();
+      destroyListenerForPressButtons();
+    });
+
+    return {
+      attributesForMainElement,
+      firstYearLocal,
+      idForFocus,
+      idForHeader,
+      isDisabled,
+      prefixForId,
+      selectYear,
+      setFocusToActiveYear,
+      yearFromValue,
+      yearIndexForFocus,
+    };
+  },
+  render() {
+    return h("ul", {
+      class: "pux_datepicker__panel pux_datepicker__panel_year pux_datepicker__panel__list",
+      role: "listbox",
+      "aria-labelledby": this.idForHeader,
+      ...this.attributesForMainElement,
+    }, [
+      range(10).map(index => {
+        return h(APanelYearItem, {
+          key: index,
+          class: {
+            pux_datepicker__panel__cell_focus: index === this.yearIndexForFocus,
+          },
+          year: this.firstYearLocal + index,
+          yearFromValue: this.yearFromValue,
+          yearIndex: index,
+          prefixForId: this.prefixForId,
+          isDisabled: this.isDisabled,
+          onSelectYear: this.selectYear,
+        });
+      }),
+    ]);
+  },
+};

package/src/ui/ADatepicker/utils/scroll-into-view.js

@@ -1,23 +1,23 @@
-export default function scrollIntoView(container, selected) {
-  if (!selected) {
-    container.scrollTop = 0;
-    return;
-  }
-
-  const OFFSET_PARENTS = [];
-  let pointer = selected.offsetParent;
-  while (pointer && container !== pointer && container.contains(pointer)) {
-    OFFSET_PARENTS.push(pointer);
-    pointer = pointer.offsetParent;
-  }
-  const TOP = selected.offsetTop + OFFSET_PARENTS.reduce((prev, curr) => (prev + curr.offsetTop), 0);
-  const BOTTOM = TOP + selected.offsetHeight;
-  const VIEW_RECT_TOP = container.scrollTop;
-  const VIEW_RECT_BOTTOM = VIEW_RECT_TOP + container.clientHeight;
-
-  if (TOP < VIEW_RECT_TOP) {
-    container.scrollTop = TOP;
-  } else if (BOTTOM > VIEW_RECT_BOTTOM) {
-    container.scrollTop = BOTTOM - container.clientHeight;
-  }
-}
+export default function scrollIntoView(container, selected) {
+  if (!selected) {
+    container.scrollTop = 0;
+    return;
+  }
+
+  const OFFSET_PARENTS = [];
+  let pointer = selected.offsetParent;
+  while (pointer && container !== pointer && container.contains(pointer)) {
+    OFFSET_PARENTS.push(pointer);
+    pointer = pointer.offsetParent;
+  }
+  const TOP = selected.offsetTop + OFFSET_PARENTS.reduce((prev, curr) => (prev + curr.offsetTop), 0);
+  const BOTTOM = TOP + selected.offsetHeight;
+  const VIEW_RECT_TOP = container.scrollTop;
+  const VIEW_RECT_BOTTOM = VIEW_RECT_TOP + container.clientHeight;
+
+  if (TOP < VIEW_RECT_TOP) {
+    container.scrollTop = TOP;
+  } else if (BOTTOM > VIEW_RECT_BOTTOM) {
+    container.scrollTop = BOTTOM - container.clientHeight;
+  }
+}

package/src/ui/ADatepicker/utils/transform.js

@@ -1,14 +1,14 @@
-import {
-  isValidDate,
-} from "./index";
-
-export const transformDate = {
-  date: {
-    value2date: value => isValidDate(value) ? new Date(value) : null,
-    date2value: date => date,
-  },
-  timestamp: {
-    value2date: value => isValidDate(value) ? new Date(value) : null,
-    date2value: date => date && new Date(date).getTime(),
-  },
-};
+import {
+  isValidDate,
+} from "./index";
+
+export const transformDate = {
+  date: {
+    value2date: value => isValidDate(value) ? new Date(value) : null,
+    date2value: date => date,
+  },
+  timestamp: {
+    value2date: value => isValidDate(value) ? new Date(value) : null,
+    date2value: date => date && new Date(date).getTime(),
+  },
+};