aloha-vue 2.74.0 → 2.75.0

package/src/AVerticalScroll/AVerticalScroll.js

@@ -1,177 +1,182 @@
-import {
-  h,
-  onBeforeUnmount,
-  onMounted,
-  toRef,
-  watch,
-} from "vue";
-
-import AButton from "../AButton/AButton";
-
-import ListenerAPI from "./compositionAPI/ListenerAPI";
-import ObserverAPI from "./compositionAPI/ObserverAPI";
-import ScrollAPI from "./compositionAPI/ScrollAPI";
-
-import ChevronDown from "aloha-svg/dist/js/bootstrap/ChevronDown";
-import ChevronUp from "aloha-svg/dist/js/bootstrap/ChevronUp";
-
-export default {
-  name: "AVerticalScroll",
-  props: {
-    btnDownProps: {
-      type: Object,
-      required: false,
-      default: () => ({}),
-    },
-    btnUpProps: {
-      type: Object,
-      required: false,
-      default: () => ({}),
-    },
-    disabled: {
-      type: Boolean,
-      required: false,
-      default: undefined,
-    },
-    scrollContentAttributes: {
-      type: Object,
-      required: false,
-      default: () => ({}),
-    },
-    scrollDistance: {
-      type: Number,
-      required: false,
-      default: 100,
-    },
-    tag: {
-      type: String,
-      required: false,
-      default: "div",
-    },
-    tagScrollContent: {
-      type: String,
-      required: false,
-      default: "div",
-    },
-  },
-  setup(props) {
-    const disabled = toRef(props, "disabled");
-
-    const {
-      canScrollDown,
-      canScrollUp,
-      checkScroll,
-      containerRef,
-      hasScroll,
-      onScroll,
-      scrollContentChildRef,
-      scrollContentRef,
-      scrollDown,
-      scrollUp,
-    } = ScrollAPI(props);
-
-    const {
-      connectObservers,
-      destroyObservers,
-      disconnectObservers,
-      initObservers,
-    } = ObserverAPI({
-      checkScroll,
-      containerRef,
-      scrollContentChildRef,
-    });
-
-    const {
-      addScrollListener,
-      destroyScrollListener,
-    } = ListenerAPI({
-      onScroll,
-      scrollContentRef,
-    });
-
-    onMounted(() => {
-      initObservers();
-      if (!disabled.value) {
-        connectObservers();
-        addScrollListener();
-      }
-    });
-
-    onBeforeUnmount(() => {
-      destroyObservers();
-      destroyScrollListener();
-    });
-
-    watch(disabled, newValue => {
-      if (newValue) {
-        disconnectObservers();
-        destroyScrollListener();
-      } else {
-        connectObservers();
-        addScrollListener();
-      }
-    });
-
-    return {
-      canScrollDown,
-      canScrollUp,
-      containerRef,
-      hasScroll,
-      scrollContentChildRef,
-      scrollContentRef,
-      scrollDown,
-      scrollUp,
-    };
-  },
-  render() {
-    return h(this.tag, {
-      ref: "containerRef",
-      class: [
-        "a_vertical_scroll",
-        {
-          a_vertical_scroll_scrollable: this.hasScroll && !this.disabled,
-        },
-      ],
-    }, [
-      h("div", {
-        class: "a_vertical_scroll__btn__wrapper a_vertical_scroll__btn__wrapper_up",
-      }, [
-        h(AButton, {
-          class: "a_btn a_btn_transparent_secondary a_btn_small a_vertical_scroll__btn a_vertical_scroll__btn_up",
-          iconLeft: ChevronUp,
-          disabled: !this.canScrollUp,
-          tabindex: -1,
-          title: "_A_VERTICAL_SCROLL_BTN_UP_TITLE_",
-          textScreenReader: "_A_VERTICAL_SCROLL_BTN_UP_TITLE_",
-          onClick: this.scrollUp,
-          ...this.btnUpProps,
-        }),
-      ]),
-      h(this.tagScrollContent, {
-        ref: "scrollContentRef",
-        class: "a_scroll_content",
-        ...this.scrollContentAttributes,
-      }, [
-        h("div", {
-          ref: "scrollContentChildRef",
-        }, [
-          this.$slots.default && this.$slots.default(),
-        ]),
-      ]),
-      h("div", {
-        class: "a_vertical_scroll__btn__wrapper a_vertical_scroll__btn__wrapper_down",
-      }, [
-        h(AButton, {
-          class: "a_btn a_btn_transparent_secondary a_btn_small a_vertical_scroll__btn a_vertical_scroll__btn_down",
-          iconLeft: ChevronDown,
-          disabled: !this.canScrollDown,
-          title: "_A_VERTICAL_SCROLL_BTN_DOWN_TITLE_",
-          textScreenReader: "_A_VERTICAL_SCROLL_BTN_DOWN_TITLE_",
-          tabindex: -1,
-          onClick: this.scrollDown,
-          ...this.btnDownProps,
-        }),
-      ]),
-    ]);
-  },
-};
+import {
+  h,
+  onBeforeUnmount,
+  onMounted,
+  toRef,
+  watch,
+} from "vue";
+
+import AButton from "../AButton/AButton";
+
+import ListenerAPI from "./compositionAPI/ListenerAPI";
+import ObserverAPI from "./compositionAPI/ObserverAPI";
+import ScrollAPI from "./compositionAPI/ScrollAPI";
+
+const ChevronDown = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-down" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708"/>
+</svg>`;
+const ChevronUp = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-up" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M7.646 4.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 5.707l-5.646 5.647a.5.5 0 0 1-.708-.708z"/>
+</svg>`;
+
+
+export default {
+  name: "AVerticalScroll",
+  props: {
+    btnDownProps: {
+      type: Object,
+      required: false,
+      default: () => ({}),
+    },
+    btnUpProps: {
+      type: Object,
+      required: false,
+      default: () => ({}),
+    },
+    disabled: {
+      type: Boolean,
+      required: false,
+      default: undefined,
+    },
+    scrollContentAttributes: {
+      type: Object,
+      required: false,
+      default: () => ({}),
+    },
+    scrollDistance: {
+      type: Number,
+      required: false,
+      default: 100,
+    },
+    tag: {
+      type: String,
+      required: false,
+      default: "div",
+    },
+    tagScrollContent: {
+      type: String,
+      required: false,
+      default: "div",
+    },
+  },
+  setup(props) {
+    const disabled = toRef(props, "disabled");
+
+    const {
+      canScrollDown,
+      canScrollUp,
+      checkScroll,
+      containerRef,
+      hasScroll,
+      onScroll,
+      scrollContentChildRef,
+      scrollContentRef,
+      scrollDown,
+      scrollUp,
+    } = ScrollAPI(props);
+
+    const {
+      connectObservers,
+      destroyObservers,
+      disconnectObservers,
+      initObservers,
+    } = ObserverAPI({
+      checkScroll,
+      containerRef,
+      scrollContentChildRef,
+    });
+
+    const {
+      addScrollListener,
+      destroyScrollListener,
+    } = ListenerAPI({
+      onScroll,
+      scrollContentRef,
+    });
+
+    onMounted(() => {
+      initObservers();
+      if (!disabled.value) {
+        connectObservers();
+        addScrollListener();
+      }
+    });
+
+    onBeforeUnmount(() => {
+      destroyObservers();
+      destroyScrollListener();
+    });
+
+    watch(disabled, newValue => {
+      if (newValue) {
+        disconnectObservers();
+        destroyScrollListener();
+      } else {
+        connectObservers();
+        addScrollListener();
+      }
+    });
+
+    return {
+      canScrollDown,
+      canScrollUp,
+      containerRef,
+      hasScroll,
+      scrollContentChildRef,
+      scrollContentRef,
+      scrollDown,
+      scrollUp,
+    };
+  },
+  render() {
+    return h(this.tag, {
+      ref: "containerRef",
+      class: [
+        "a_vertical_scroll",
+        {
+          a_vertical_scroll_scrollable: this.hasScroll && !this.disabled,
+        },
+      ],
+    }, [
+      h("div", {
+        class: "a_vertical_scroll__btn__wrapper a_vertical_scroll__btn__wrapper_up",
+      }, [
+        h(AButton, {
+          class: "a_btn a_btn_transparent_secondary a_btn_small a_vertical_scroll__btn a_vertical_scroll__btn_up",
+          iconLeft: ChevronUp,
+          disabled: !this.canScrollUp,
+          tabindex: -1,
+          title: "_A_VERTICAL_SCROLL_BTN_UP_TITLE_",
+          textScreenReader: "_A_VERTICAL_SCROLL_BTN_UP_TITLE_",
+          onClick: this.scrollUp,
+          ...this.btnUpProps,
+        }),
+      ]),
+      h(this.tagScrollContent, {
+        ref: "scrollContentRef",
+        class: "a_scroll_content",
+        ...this.scrollContentAttributes,
+      }, [
+        h("div", {
+          ref: "scrollContentChildRef",
+        }, [
+          this.$slots.default && this.$slots.default(),
+        ]),
+      ]),
+      h("div", {
+        class: "a_vertical_scroll__btn__wrapper a_vertical_scroll__btn__wrapper_down",
+      }, [
+        h(AButton, {
+          class: "a_btn a_btn_transparent_secondary a_btn_small a_vertical_scroll__btn a_vertical_scroll__btn_down",
+          iconLeft: ChevronDown,
+          disabled: !this.canScrollDown,
+          title: "_A_VERTICAL_SCROLL_BTN_DOWN_TITLE_",
+          textScreenReader: "_A_VERTICAL_SCROLL_BTN_DOWN_TITLE_",
+          tabindex: -1,
+          onClick: this.scrollDown,
+          ...this.btnDownProps,
+        }),
+      ]),
+    ]);
+  },
+};

package/src/AWizard/AWizard.js

@@ -8,9 +8,9 @@ import AWizardStep from "./AWizardStep/AWizardStep";
 import AWizardTab from "./AWizardTab/AWizardTab";
 import AWizardToolbar from "./AWizardToolbar/AWizardToolbar";
 
-import AttributesAPI from "./compositionAPI/AttributesAPI";
-import ChangeStepAPI from "./compositionAPI/ChangeStepAPI";
-import ClassAPI from "./compositionAPI/ClassAPI";
+import AttributesAPI from "./compositionAPI/AttributesAPI";
+import ChangeStepAPI from "./compositionAPI/ChangeStepAPI";
+import ClassAPI from "./compositionAPI/ClassAPI";
 import EventsAPI from "./compositionAPI/EventsAPI";
 import FocusAPI from "./compositionAPI/FocusAPI";
 import LocalAPI from "./compositionAPI/LocalAPI";
@@ -19,13 +19,18 @@ import StepsAPI from "./compositionAPI/StepsAPI";
 import TeleportAPI from "./compositionAPI/TeleportAPI";
 import TypeAPI from "./compositionAPI/TypeAPI";
 
-import ExclamationCircleFill from "aloha-svg/dist/js/bootstrap/ExclamationCircleFill";
-import XCircleFill from "aloha-svg/dist/js/bootstrap/XCircleFill";
 import {
   isNil,
   uniqueId,
 } from "lodash-es";
 
+const ExclamationCircleFill = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-exclamation-circle-fill" viewBox="0 0 16 16">
+  <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0M8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4m.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2"/>
+</svg>`;
+const XCircleFill = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-x-circle-fill" viewBox="0 0 16 16">
+  <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0M5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293z"/>
+</svg>`;
+
 export default {
   name: "AWizard",
   props: {
@@ -274,9 +279,9 @@ export default {
       validator: value => ["arrows", "line", "round", "basic"].indexOf(value) !== -1,
     },
   },
-  emits: [
-    "changeStep",
-    "goStepBack",
+  emits: [
+    "changeStep",
+    "goStepBack",
     "goStepForward",
   ],
   setup(props, context) {
@@ -290,24 +295,24 @@ export default {
       subTypeLocal,
     });
 
-    const {
-      setFocusToActiveStep,
-      wizardTabsRef,
-    } = FocusAPI(props);
-
-    const {
-      changeStep,
-    } = ChangeStepAPI(props, context);
-
-    const {
+    const {
+      setFocusToActiveStep,
+      wizardTabsRef,
+    } = FocusAPI(props);
+
+    const {
+      changeStep,
+    } = ChangeStepAPI(props, context);
+
+    const {
       initStepActive,
       stepActiveComputed,
       stepActiveLocal,
       stepsVisitedComputed,
       stepsVisitedLocal,
-    } = LocalAPI(props, {
-      changeStep,
-      setFocusToActiveStep,
+    } = LocalAPI(props, {
+      changeStep,
+      setFocusToActiveStep,
     });
 
     const {