@evance/evance-ui 1.0.39 → 1.0.41

package/dist/esm/src/components/EvSelect/useScrolling.mjs

@@ -0,0 +1,79 @@
+/*! Evance UI v1.0.40 | MIT License */
+import { shallowRef, watch } from "vue";
+function useScrolling(listRef, textFieldRef) {
+  const isScrolling = shallowRef(false);
+  let scrollTimeout;
+  function onListScroll(e) {
+    cancelAnimationFrame(scrollTimeout);
+    isScrolling.value = true;
+    scrollTimeout = requestAnimationFrame(() => {
+      scrollTimeout = requestAnimationFrame(() => {
+        isScrolling.value = false;
+      });
+    });
+  }
+  async function finishScrolling() {
+    await new Promise((resolve) => requestAnimationFrame(resolve));
+    await new Promise((resolve) => requestAnimationFrame(resolve));
+    await new Promise((resolve) => requestAnimationFrame(resolve));
+    await new Promise((resolve) => {
+      if (isScrolling.value) {
+        const stop = watch(isScrolling, () => {
+          stop();
+          resolve();
+        });
+      } else {
+        resolve();
+      }
+    });
+  }
+  async function onListKeydown(e) {
+    var _a, _b;
+    if (e.key === "Tab") {
+      (_a = textFieldRef.value) == null ? void 0 : _a.focus();
+      return;
+    }
+    if (!["PageDown", "PageUp", "Home", "End"].includes(e.key)) {
+      return;
+    }
+    const el = (_b = listRef.value) == null ? void 0 : _b.$el;
+    if (!el) {
+      return;
+    }
+    if (e.key === "Home" || e.key === "End") {
+      el.scrollTo({
+        top: e.key === "Home" ? 0 : el.scrollHeight,
+        behavior: "smooth"
+      });
+    }
+    await finishScrolling();
+    const children = el.querySelectorAll(
+      ":scope > :not(.ev-virtual-scroll--spacer)"
+    );
+    if (e.key === "PageDown" || e.key === "Home") {
+      const top = el.getBoundingClientRect().top;
+      for (const child of children) {
+        if (child.getBoundingClientRect().top >= top) {
+          child.focus();
+          break;
+        }
+      }
+    } else {
+      const bottom = el.getBoundingClientRect().bottom;
+      for (const child of [...children].reverse()) {
+        if (child.getBoundingClientRect().bottom <= bottom) {
+          child.focus();
+          break;
+        }
+      }
+    }
+  }
+  return {
+    onListScroll,
+    onListKeydown
+  };
+}
+export {
+  useScrolling
+};
+//# sourceMappingURL=useScrolling.mjs.map

package/dist/esm/src/components/EvSelect/useScrolling.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useScrolling.mjs","sources":["../../../../../src/components/EvSelect/useScrolling.ts"],"sourcesContent":["// Utilities\nimport { shallowRef, watch } from \"vue\";\n\n// Types\nimport type { Ref } from \"vue\";\nimport { EvList } from \"../EvList\";\nimport { EvTextfield } from \"../EvTextfield\";\n\n/**\n * # Use Scrolling\n *\n * @param listRef\n * @param textFieldRef\n */\nexport function useScrolling(\n    listRef: Ref<typeof EvList | undefined>,\n    textFieldRef: Ref<typeof EvTextfield | undefined>,\n) {\n    const isScrolling = shallowRef(false);\n    let scrollTimeout: number;\n\n    function onListScroll(e: Event) {\n        cancelAnimationFrame(scrollTimeout);\n        isScrolling.value = true;\n        scrollTimeout = requestAnimationFrame(() => {\n            scrollTimeout = requestAnimationFrame(() => {\n                isScrolling.value = false;\n            });\n        });\n    }\n\n    async function finishScrolling() {\n        await new Promise((resolve) => requestAnimationFrame(resolve));\n        await new Promise((resolve) => requestAnimationFrame(resolve));\n        await new Promise((resolve) => requestAnimationFrame(resolve));\n        await new Promise<void>((resolve) => {\n            if (isScrolling.value) {\n                const stop = watch(isScrolling, () => {\n                    stop();\n                    resolve();\n                });\n            } else {\n                resolve();\n            }\n        });\n    }\n\n    async function onListKeydown(e: KeyboardEvent) {\n        if (e.key === \"Tab\") {\n            textFieldRef.value?.focus();\n            return;\n        }\n\n        if (![\"PageDown\", \"PageUp\", \"Home\", \"End\"].includes(e.key)) {\n            return;\n        }\n        const el: HTMLElement = listRef.value?.$el;\n        if (!el) {\n            return;\n        }\n\n        if (e.key === \"Home\" || e.key === \"End\") {\n            el.scrollTo({\n                top: e.key === \"Home\" ? 0 : el.scrollHeight,\n                behavior: \"smooth\",\n            });\n        }\n\n        await finishScrolling();\n\n        const children = el.querySelectorAll(\n            \":scope > :not(.ev-virtual-scroll--spacer)\",\n        );\n\n        if (e.key === \"PageDown\" || e.key === \"Home\") {\n            const top = el.getBoundingClientRect().top;\n            for (const child of children) {\n                if (child.getBoundingClientRect().top >= top) {\n                    (child as HTMLElement).focus();\n                    break;\n                }\n            }\n        } else {\n            const bottom = el.getBoundingClientRect().bottom;\n            for (const child of [...children].reverse()) {\n                if (child.getBoundingClientRect().bottom <= bottom) {\n                    (child as HTMLElement).focus();\n                    break;\n                }\n            }\n        }\n    }\n\n    return {\n        onListScroll,\n        onListKeydown,\n    };\n}\n"],"names":[],"mappings":";;AAcgB,SAAA,aACZ,SACA,cACF;AACQ,QAAA,cAAc,WAAW,KAAK;AAChC,MAAA;AAEJ,WAAS,aAAa,GAAU;AAC5B,yBAAqB,aAAa;AAClC,gBAAY,QAAQ;AACpB,oBAAgB,sBAAsB,MAAM;AACxC,sBAAgB,sBAAsB,MAAM;AACxC,oBAAY,QAAQ;AAAA,MAAA,CACvB;AAAA,IAAA,CACJ;AAAA,EAAA;AAGL,iBAAe,kBAAkB;AAC7B,UAAM,IAAI,QAAQ,CAAC,YAAY,sBAAsB,OAAO,CAAC;AAC7D,UAAM,IAAI,QAAQ,CAAC,YAAY,sBAAsB,OAAO,CAAC;AAC7D,UAAM,IAAI,QAAQ,CAAC,YAAY,sBAAsB,OAAO,CAAC;AACvD,UAAA,IAAI,QAAc,CAAC,YAAY;AACjC,UAAI,YAAY,OAAO;AACb,cAAA,OAAO,MAAM,aAAa,MAAM;AAC7B,eAAA;AACG,kBAAA;AAAA,QAAA,CACX;AAAA,MAAA,OACE;AACK,gBAAA;AAAA,MAAA;AAAA,IACZ,CACH;AAAA,EAAA;AAGL,iBAAe,cAAc,GAAkB;;AACvC,QAAA,EAAE,QAAQ,OAAO;AACjB,yBAAa,UAAb,mBAAoB;AACpB;AAAA,IAAA;AAGA,QAAA,CAAC,CAAC,YAAY,UAAU,QAAQ,KAAK,EAAE,SAAS,EAAE,GAAG,GAAG;AACxD;AAAA,IAAA;AAEE,UAAA,MAAkB,aAAQ,UAAR,mBAAe;AACvC,QAAI,CAAC,IAAI;AACL;AAAA,IAAA;AAGJ,QAAI,EAAE,QAAQ,UAAU,EAAE,QAAQ,OAAO;AACrC,SAAG,SAAS;AAAA,QACR,KAAK,EAAE,QAAQ,SAAS,IAAI,GAAG;AAAA,QAC/B,UAAU;AAAA,MAAA,CACb;AAAA,IAAA;AAGL,UAAM,gBAAgB;AAEtB,UAAM,WAAW,GAAG;AAAA,MAChB;AAAA,IACJ;AAEA,QAAI,EAAE,QAAQ,cAAc,EAAE,QAAQ,QAAQ;AACpC,YAAA,MAAM,GAAG,sBAAA,EAAwB;AACvC,iBAAW,SAAS,UAAU;AAC1B,YAAI,MAAM,wBAAwB,OAAO,KAAK;AACzC,gBAAsB,MAAM;AAC7B;AAAA,QAAA;AAAA,MACJ;AAAA,IACJ,OACG;AACG,YAAA,SAAS,GAAG,sBAAA,EAAwB;AAC1C,iBAAW,SAAS,CAAC,GAAG,QAAQ,EAAE,WAAW;AACzC,YAAI,MAAM,wBAAwB,UAAU,QAAQ;AAC/C,gBAAsB,MAAM;AAC7B;AAAA,QAAA;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ;AAGG,SAAA;AAAA,IACH;AAAA,IACA;AAAA,EACJ;AACJ;"}

package/dist/esm/src/components/EvSlideGroup/EvSlideGroup.mjs

@@ -0,0 +1,38 @@
+/*! Evance UI v1.0.40 | MIT License */
+import { makeGroupProps } from "../../composables/group.mjs";
+import { makeComponentProps } from "../../composables/component.mjs";
+import { makeTagProps } from "../../composables/tag.mjs";
+import { IconProp } from "../../composables/icons.mjs";
+import { propsFactory } from "../../util/props.mjs";
+const EvSlideGroupSymbol = Symbol.for("ev:slide-group");
+const makeEvSlideGroupProps = propsFactory(
+  {
+    arrowsAlign: {
+      type: String,
+      default: "around"
+    },
+    arrowsHidden: [Boolean, String, Array],
+    centerActive: Boolean,
+    direction: {
+      type: String,
+      default: "horizontal"
+    },
+    iconNext: IconProp,
+    iconPrevious: IconProp,
+    symbol: {
+      type: null,
+      default: EvSlideGroupSymbol
+    },
+    ...makeComponentProps(),
+    ...makeTagProps(),
+    ...makeGroupProps({
+      selectedClass: "is-active"
+    })
+  },
+  "EvSlideGroup"
+);
+export {
+  EvSlideGroupSymbol,
+  makeEvSlideGroupProps
+};
+//# sourceMappingURL=EvSlideGroup.mjs.map

package/dist/esm/src/components/EvSlideGroup/EvSlideGroup.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvSlideGroup.mjs","sources":["../../../../../src/components/EvSlideGroup/EvSlideGroup.ts"],"sourcesContent":["import { InjectionKey, PropType } from \"vue\";\nimport { GroupProvide, makeGroupProps } from \"@/composables/group\";\nimport { propsFactory } from \"@/util\";\nimport { makeComponentProps } from \"@/composables/component\";\nimport { makeTagProps } from \"@/composables/tag\";\nimport { IconProp } from \"@/composables/icons\";\nimport { VisibilityRuleProp } from \"@/composables/display\";\n\nexport const EvSlideGroupSymbol: InjectionKey<GroupProvide> =\n    Symbol.for(\"ev:slide-group\");\n\nexport interface SlideGroupSlot {\n    next: GroupProvide[\"next\"];\n    previous: GroupProvide[\"previous\"];\n    select: GroupProvide[\"select\"];\n    isSelected: GroupProvide[\"isSelected\"];\n}\n\nexport type EvSlideGroupSlot = {\n    default: SlideGroupSlot;\n    previous: SlideGroupSlot;\n    next: SlideGroupSlot;\n};\n\nexport const makeEvSlideGroupProps = propsFactory(\n    {\n        arrowsAlign: {\n            type: String as PropType<\"start\" | \"end\" | \"around\">,\n            default: \"around\",\n        },\n        arrowsHidden: [Boolean, String, Array] as PropType<VisibilityRuleProp>,\n        centerActive: Boolean,\n        direction: {\n            type: String as PropType<\"horizontal\" | \"vertical\">,\n            default: \"horizontal\",\n        },\n        iconNext: IconProp,\n        iconPrevious: IconProp,\n        symbol: {\n            type: null,\n            default: EvSlideGroupSymbol,\n        },\n\n        ...makeComponentProps(),\n        ...makeTagProps(),\n        ...makeGroupProps({\n            selectedClass: \"is-active\",\n        }),\n    },\n    \"EvSlideGroup\",\n);\n"],"names":[],"mappings":";;;;;;AAQa,MAAA,qBACT,OAAO,IAAI,gBAAgB;AAexB,MAAM,wBAAwB;AAAA,EACjC;AAAA,IACI,aAAa;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IACb;AAAA,IACA,cAAc,CAAC,SAAS,QAAQ,KAAK;AAAA,IACrC,cAAc;AAAA,IACd,WAAW;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,IACb;AAAA,IACA,UAAU;AAAA,IACV,cAAc;AAAA,IACd,QAAQ;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACb;AAAA,IAEA,GAAG,mBAAmB;AAAA,IACtB,GAAG,aAAa;AAAA,IAChB,GAAG,eAAe;AAAA,MACd,eAAe;AAAA,IAClB,CAAA;AAAA,EACL;AAAA,EACA;AACJ;"}

package/dist/esm/src/components/EvSlideGroup/EvSlideGroup.vue.mjs

@@ -0,0 +1,355 @@
+/*! Evance UI v1.0.40 | MIT License */
+import { defineComponent, shallowRef, computed, watch, createBlock, openBlock, resolveDynamicComponent, normalizeStyle, normalizeClass, unref, withCtx, createElementVNode, createElementBlock, createCommentVNode, renderSlot, normalizeProps, guardReactiveProps, createVNode } from "vue";
+/* empty css                   */
+import { useDisplayRuleClasses } from "../../composables/display.mjs";
+import { useGroup } from "../../composables/group.mjs";
+import { useResizeObserver } from "../../composables/resizeObserver.mjs";
+import { calculateCenteredOffset, calculateUpdatedOffset, bias } from "./helpers.mjs";
+import ChevronDownIcon from "../../icons/glyph/ChevronDownIcon.svg.mjs";
+import ChevronLeftIcon from "../../icons/glyph/ChevronLeftIcon.svg.mjs";
+import ChevronRightIcon from "../../icons/glyph/ChevronRightIcon.svg.mjs";
+import ChevronUpIcon from "../../icons/glyph/ChevronUpIcon.svg.mjs";
+import { useRtl } from "../../composables/locale.mjs";
+import { makeEvSlideGroupProps } from "./EvSlideGroup.mjs";
+import _sfc_main$1 from "../EvButton/EvButton.vue.mjs";
+import { focusableChildren } from "../../util/children.mjs";
+import { Browser } from "../../util/browser.mjs";
+import { isBoolean } from "../../util/is-functions.mjs";
+import { clamp } from "../../util/helpers.mjs";
+const _hoisted_1 = ["hidden"];
+const _hoisted_2 = ["hidden"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "EvSlideGroup",
+  props: {
+    ...makeEvSlideGroupProps()
+  },
+  setup(__props) {
+    const props = __props;
+    const group = useGroup(props, props.symbol);
+    const { isRtl } = useRtl();
+    const isFocused = shallowRef(false);
+    const isOverflowing = shallowRef(false);
+    const scrollOffset = shallowRef(0);
+    const containerSize = shallowRef(0);
+    const contentSize = shallowRef(0);
+    const isHorizontal = computed(() => props.direction === "horizontal");
+    const disableTransition = shallowRef(false);
+    const { resizeRef: containerRef, contentRect: containerRect } = useResizeObserver();
+    const { resizeRef: contentRef, contentRect } = useResizeObserver();
+    const firstSelectedIndex = computed(() => {
+      if (!group.selected.value.length) {
+        return -1;
+      }
+      return group.items.value.findIndex(
+        (item) => item.id === group.selected.value[0]
+      );
+    });
+    const lastSelectedIndex = computed(() => {
+      if (!group.selected.value.length) {
+        return -1;
+      }
+      return group.items.value.findIndex(
+        (item) => item.id === group.selected.value[group.selected.value.length - 1]
+      );
+    });
+    if (Browser.hasWindow) {
+      let frame = -1;
+      watch(
+        () => [
+          group.selected.value,
+          containerRect.value,
+          contentRect.value,
+          isHorizontal.value
+        ],
+        () => {
+          cancelAnimationFrame(frame);
+          frame = requestAnimationFrame(() => {
+            if (containerRect.value && contentRect.value) {
+              const sizeProperty = isHorizontal.value ? "width" : "height";
+              containerSize.value = containerRect.value[sizeProperty];
+              contentSize.value = contentRect.value[sizeProperty];
+              isOverflowing.value = containerSize.value + 1 < contentSize.value;
+            }
+            if (firstSelectedIndex.value >= 0 && contentRef.value) {
+              const selectedElement = contentRef.value.children[lastSelectedIndex.value];
+              if (firstSelectedIndex.value === 0 || !isOverflowing.value) {
+                scrollOffset.value = 0;
+              } else if (props.centerActive) {
+                scrollOffset.value = calculateCenteredOffset({
+                  selectedElement,
+                  containerSize: containerSize.value,
+                  contentSize: contentSize.value,
+                  isRtl: isRtl.value,
+                  isHorizontal: isHorizontal.value
+                });
+              } else if (isOverflowing.value) {
+                scrollOffset.value = calculateUpdatedOffset({
+                  selectedElement,
+                  containerSize: containerSize.value,
+                  contentSize: contentSize.value,
+                  isRtl: isRtl.value,
+                  currentScrollOffset: scrollOffset.value,
+                  isHorizontal: isHorizontal.value
+                });
+              }
+            }
+          });
+        }
+      );
+    }
+    function focus(location) {
+      var _a, _b, _c, _d, _e;
+      if (!contentRef.value) {
+        return;
+      }
+      if (!location) {
+        const focusable = focusableChildren(contentRef.value);
+        (_a = focusable[0]) == null ? void 0 : _a.focus();
+      } else if (location === "next") {
+        const el = (_b = contentRef.value.querySelector(":focus")) == null ? void 0 : _b.nextElementSibling;
+        if (el) {
+          el.focus();
+        } else {
+          focus("first");
+        }
+      } else if (location === "previous") {
+        const el = (_c = contentRef.value.querySelector(":focus")) == null ? void 0 : _c.previousElementSibling;
+        if (el) {
+          el.focus();
+        } else {
+          focus("last");
+        }
+      } else if (location === "first") {
+        (_d = contentRef.value.firstElementChild) == null ? void 0 : _d.focus();
+      } else if (location === "last") {
+        (_e = contentRef.value.lastElementChild) == null ? void 0 : _e.focus();
+      }
+    }
+    function onFocus(e) {
+      var _a;
+      if (!isFocused.value && !(e.relatedTarget && ((_a = contentRef.value) == null ? void 0 : _a.contains(e.relatedTarget)))) {
+        focus();
+      }
+    }
+    function onFocusin(e) {
+      isFocused.value = true;
+      if (!isOverflowing.value || !contentRef.value) {
+        return;
+      }
+      for (const el of e.composedPath()) {
+        for (const item of contentRef.value.children) {
+          if (item === el) {
+            scrollOffset.value = calculateUpdatedOffset({
+              selectedElement: item,
+              containerSize: containerSize.value,
+              contentSize: contentSize.value,
+              isRtl: isRtl.value,
+              currentScrollOffset: scrollOffset.value,
+              isHorizontal: isHorizontal.value
+            });
+            return;
+          }
+        }
+      }
+    }
+    function onFocusout(e) {
+      isFocused.value = false;
+    }
+    function onKeydown(e) {
+      if (!contentRef.value) {
+        return;
+      }
+      if (isHorizontal.value) {
+        if (e.key === "ArrowRight") {
+          focus(isRtl.value ? "previous" : "next");
+        } else if (e.key === "ArrowLeft") {
+          focus(isRtl.value ? "next" : "previous");
+        }
+      } else {
+        if (e.key === "ArrowDown") {
+          focus("next");
+        } else if (e.key === "ArrowUp") {
+          focus("previous");
+        }
+      }
+      if (e.key === "Home") {
+        focus("first");
+      } else if (e.key === "End") {
+        focus("last");
+      }
+    }
+    function onScroll() {
+      if (!containerRef.value) {
+        return;
+      }
+      containerRef.value[isHorizontal.value ? "scrollLeft" : "scrollTop"] = 0;
+    }
+    let startTouch = 0;
+    let startOffset = 0;
+    function onTouchstart(e) {
+      const sizeProperty = isHorizontal.value ? "clientX" : "clientY";
+      const sign = isRtl.value && isHorizontal.value ? -1 : 1;
+      startOffset = sign * scrollOffset.value;
+      startTouch = e.touches[0][sizeProperty];
+      disableTransition.value = true;
+    }
+    function onTouchmove(e) {
+      if (!isOverflowing.value) {
+        return;
+      }
+      const sizeProperty = isHorizontal.value ? "clientX" : "clientY";
+      const sign = isRtl.value && isHorizontal.value ? -1 : 1;
+      scrollOffset.value = sign * (startOffset + startTouch - e.touches[0][sizeProperty]);
+    }
+    function onTouchend(e) {
+      const maxScrollOffset = contentSize.value - containerSize.value;
+      if (scrollOffset.value < 0 || !isOverflowing.value) {
+        scrollOffset.value = 0;
+      } else if (scrollOffset.value >= maxScrollOffset) {
+        scrollOffset.value = maxScrollOffset;
+      }
+      disableTransition.value = false;
+    }
+    function scrollTo(location) {
+      const newAbsoluteOffset = scrollOffset.value + (location === "previous" ? -1 : 1) * containerSize.value;
+      scrollOffset.value = clamp(
+        newAbsoluteOffset,
+        0,
+        contentSize.value - containerSize.value
+      );
+    }
+    const arrowsHiddenClasses = useDisplayRuleClasses(
+      props,
+      "arrowsHidden",
+      "hidden"
+    );
+    const arrowsHiddenAttribute = computed(() => {
+      return isBoolean(props.arrowsHidden) && props.arrowsHidden;
+    });
+    const contentStyles = computed(() => {
+      let scrollAmount = scrollOffset.value > contentSize.value - containerSize.value ? -(contentSize.value - containerSize.value) + bias(contentSize.value - containerSize.value - scrollOffset.value) : -scrollOffset.value;
+      if (scrollOffset.value <= 0) {
+        scrollAmount = bias(-scrollOffset.value);
+      }
+      const sign = isRtl.value && isHorizontal.value ? -1 : 1;
+      return {
+        transform: `translate${isHorizontal.value ? "X" : "Y"}(${sign * scrollAmount}px)`,
+        transition: disableTransition.value ? "none" : "",
+        willChange: disableTransition.value ? "transform" : ""
+      };
+    });
+    const slotProps = computed(() => ({
+      next: group.next,
+      previous: group.previous,
+      select: group.select,
+      isSelected: group.isSelected
+    }));
+    const hasPrevious = computed(() => {
+      return Math.abs(scrollOffset.value) > 0;
+    });
+    const hasNext = computed(() => {
+      return contentSize.value > Math.abs(scrollOffset.value) + containerSize.value;
+    });
+    const hasAffix = computed(() => {
+      if (isBoolean(props.arrowsHidden) && props.arrowsHidden) {
+        return false;
+      }
+      return isOverflowing.value || Math.abs(scrollOffset.value) > 0;
+    });
+    const arrowsAlignClass = computed(() => {
+      return `is-arrows-${props.arrowsAlign}`;
+    });
+    const iconNext = computed(() => {
+      if (props.iconNext) {
+        return props.iconNext;
+      }
+      return isHorizontal.value ? ChevronRightIcon : ChevronDownIcon;
+    });
+    const iconPrevious = computed(() => {
+      if (props.iconPrevious) {
+        return props.iconPrevious;
+      }
+      return isHorizontal.value ? ChevronLeftIcon : ChevronUpIcon;
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(resolveDynamicComponent(props.tag), {
+        class: normalizeClass([
+          "ev-slide-group",
+          {
+            "is-overflowing": isOverflowing.value,
+            "is-vertical": !isHorizontal.value
+          },
+          arrowsAlignClass.value,
+          props.class
+        ]),
+        style: normalizeStyle(props.style),
+        tabindex: isFocused.value || unref(group).selected.value.length ? -1 : 0,
+        onFocus
+      }, {
+        default: withCtx(() => [
+          createElementVNode("div", {
+            key: "container",
+            ref_key: "containerRef",
+            ref: containerRef,
+            class: "ev-slide-group--container",
+            onScroll
+          }, [
+            createElementVNode("div", {
+              ref_key: "contentRef",
+              ref: contentRef,
+              class: "ev-slide-group--content",
+              style: normalizeStyle(contentStyles.value),
+              onTouchstartPassive: onTouchstart,
+              onTouchmovePassive: onTouchmove,
+              onTouchendPassive: onTouchend,
+              onFocusin,
+              onFocusout,
+              onKeydown
+            }, [
+              renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotProps.value)))
+            ], 36)
+          ], 544),
+          hasAffix.value ? (openBlock(), createElementBlock("div", {
+            key: "previous",
+            class: normalizeClass([
+              "ev-slide-group--previous",
+              { "is-disabled": !hasPrevious.value },
+              ...unref(arrowsHiddenClasses)
+            ]),
+            hidden: arrowsHiddenAttribute.value,
+            onClick: _cache[0] || (_cache[0] = () => scrollTo("previous"))
+          }, [
+            renderSlot(_ctx.$slots, "previous", {}, () => [
+              createVNode(unref(_sfc_main$1), {
+                icon: unref(isRtl) && isHorizontal.value ? iconNext.value : iconPrevious.value,
+                variant: "subtle"
+              }, null, 8, ["icon"])
+            ])
+          ], 10, _hoisted_1)) : createCommentVNode("", true),
+          hasAffix.value ? (openBlock(), createElementBlock("div", {
+            key: "next",
+            class: normalizeClass([
+              "ev-slide-group--next",
+              { "is-disabled": !hasNext.value },
+              ...unref(arrowsHiddenClasses)
+            ]),
+            hidden: arrowsHiddenAttribute.value,
+            onClick: _cache[1] || (_cache[1] = () => scrollTo("next"))
+          }, [
+            renderSlot(_ctx.$slots, "next", {}, () => [
+              createVNode(unref(_sfc_main$1), {
+                icon: unref(isRtl) && isHorizontal.value ? iconPrevious.value : iconNext.value,
+                variant: "subtle"
+              }, null, 8, ["icon"])
+            ])
+          ], 10, _hoisted_2)) : createCommentVNode("", true)
+        ]),
+        _: 3
+      }, 40, ["class", "style", "tabindex"]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=EvSlideGroup.vue.mjs.map

package/dist/esm/src/components/EvSlideGroup/EvSlideGroup.vue.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvSlideGroup.vue.mjs","sources":["../../../../../src/components/EvSlideGroup/EvSlideGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * # EvSlideGroup\n */\nimport \"./EvSlideGroup.scss\";\nimport {\n    EvButton,\n    EvSlideGroupSlot,\n    makeEvSlideGroupProps,\n} from \"@/components\";\nimport { useDisplayRuleClasses } from \"@/composables/display\";\nimport { computed, shallowRef, watch } from \"vue\";\nimport { Browser, clamp, focusableChildren, isBoolean } from \"@/util\";\nimport { GroupProps, useGroup } from \"@/composables/group\";\nimport { useResizeObserver } from \"@/composables/resizeObserver\";\nimport {\n    bias,\n    calculateCenteredOffset,\n    calculateUpdatedOffset,\n} from \"@/components/EvSlideGroup/helpers\";\nimport {\n    ChevronDownIcon,\n    ChevronLeftIcon,\n    ChevronRightIcon,\n    ChevronUpIcon,\n} from \"@/icons\";\nimport { useRtl } from \"@/composables/locale\";\n\ndefineSlots<EvSlideGroupSlot>();\n\nconst props = defineProps({\n    ...makeEvSlideGroupProps(),\n});\nconst group = useGroup(props as any as GroupProps, props.symbol);\nconst { isRtl } = useRtl();\nconst isFocused = shallowRef(false);\nconst isOverflowing = shallowRef(false);\nconst scrollOffset = shallowRef(0);\nconst containerSize = shallowRef(0);\nconst contentSize = shallowRef(0);\nconst isHorizontal = computed(() => props.direction === \"horizontal\");\nconst disableTransition = shallowRef(false);\n\nconst { resizeRef: containerRef, contentRect: containerRect } =\n    useResizeObserver();\nconst { resizeRef: contentRef, contentRect } = useResizeObserver();\n\nconst firstSelectedIndex = computed(() => {\n    if (!group.selected.value.length) {\n        return -1;\n    }\n    return group.items.value.findIndex(\n        (item) => item.id === group.selected.value[0],\n    );\n});\n\nconst lastSelectedIndex = computed(() => {\n    if (!group.selected.value.length) {\n        return -1;\n    }\n    return group.items.value.findIndex(\n        (item) =>\n            item.id === group.selected.value[group.selected.value.length - 1],\n    );\n});\n\nif (Browser.hasWindow) {\n    let frame = -1;\n    watch(\n        () => [\n            group.selected.value,\n            containerRect.value,\n            contentRect.value,\n            isHorizontal.value,\n        ],\n        () => {\n            cancelAnimationFrame(frame);\n            frame = requestAnimationFrame(() => {\n                if (containerRect.value && contentRect.value) {\n                    const sizeProperty = isHorizontal.value\n                        ? \"width\"\n                        : \"height\";\n                    containerSize.value = containerRect.value[sizeProperty];\n                    contentSize.value = contentRect.value[sizeProperty];\n                    isOverflowing.value =\n                        containerSize.value + 1 < contentSize.value;\n                }\n\n                if (firstSelectedIndex.value >= 0 && contentRef.value) {\n                    // @todo: Is this too naive? Should we store element references in group composable?\n                    const selectedElement = contentRef.value.children[\n                        lastSelectedIndex.value\n                    ] as HTMLElement;\n\n                    if (\n                        firstSelectedIndex.value === 0 ||\n                        !isOverflowing.value\n                    ) {\n                        scrollOffset.value = 0;\n                    } else if (props.centerActive) {\n                        scrollOffset.value = calculateCenteredOffset({\n                            selectedElement,\n                            containerSize: containerSize.value,\n                            contentSize: contentSize.value,\n                            isRtl: isRtl.value,\n                            isHorizontal: isHorizontal.value,\n                        });\n                    } else if (isOverflowing.value) {\n                        scrollOffset.value = calculateUpdatedOffset({\n                            selectedElement,\n                            containerSize: containerSize.value,\n                            contentSize: contentSize.value,\n                            isRtl: isRtl.value,\n                            currentScrollOffset: scrollOffset.value,\n                            isHorizontal: isHorizontal.value,\n                        });\n                    }\n                }\n            });\n        },\n    );\n}\n\n/**\n * ## focus\n * @param location\n */\nfunction focus(location?: \"next\" | \"previous\" | \"first\" | \"last\") {\n    if (!contentRef.value) {\n        return;\n    }\n    if (!location) {\n        const focusable = focusableChildren(contentRef.value);\n        focusable[0]?.focus();\n    } else if (location === \"next\") {\n        const el = contentRef.value.querySelector(\":focus\")\n            ?.nextElementSibling as HTMLElement | undefined;\n        if (el) {\n            el.focus();\n        } else {\n            focus(\"first\");\n        }\n    } else if (location === \"previous\") {\n        const el = contentRef.value.querySelector(\":focus\")\n            ?.previousElementSibling as HTMLElement | undefined;\n        if (el) {\n            el.focus();\n        } else {\n            focus(\"last\");\n        }\n    } else if (location === \"first\") {\n        (contentRef.value.firstElementChild as HTMLElement)?.focus();\n    } else if (location === \"last\") {\n        (contentRef.value.lastElementChild as HTMLElement)?.focus();\n    }\n}\n\n/**\n * ## onFocus\n * @param e\n */\nfunction onFocus(e: FocusEvent) {\n    if (\n        !isFocused.value &&\n        !(\n            e.relatedTarget &&\n            contentRef.value?.contains(e.relatedTarget as Node)\n        )\n    ) {\n        focus();\n    }\n}\n\n/**\n * ## onFocusin\n * @param e\n */\nfunction onFocusin(e: FocusEvent) {\n    isFocused.value = true;\n\n    if (!isOverflowing.value || !contentRef.value) {\n        return;\n    }\n\n    // Focused element is likely to be the root of an item, so a\n    // breadth-first search will probably find it in the first iteration\n    for (const el of e.composedPath()) {\n        for (const item of contentRef.value.children) {\n            if (item === el) {\n                scrollOffset.value = calculateUpdatedOffset({\n                    selectedElement: item as HTMLElement,\n                    containerSize: containerSize.value,\n                    contentSize: contentSize.value,\n                    isRtl: isRtl.value,\n                    currentScrollOffset: scrollOffset.value,\n                    isHorizontal: isHorizontal.value,\n                });\n                return;\n            }\n        }\n    }\n}\n\n/**\n * ## onFocusout\n * @param e\n */\nfunction onFocusout(e: FocusEvent) {\n    isFocused.value = false;\n}\n\n/**\n * ## onKeydown\n * @param e\n */\nfunction onKeydown(e: KeyboardEvent) {\n    if (!contentRef.value) {\n        return;\n    }\n    if (isHorizontal.value) {\n        if (e.key === \"ArrowRight\") {\n            focus(isRtl.value ? \"previous\" : \"next\");\n        } else if (e.key === \"ArrowLeft\") {\n            focus(isRtl.value ? \"next\" : \"previous\");\n        }\n    } else {\n        if (e.key === \"ArrowDown\") {\n            focus(\"next\");\n        } else if (e.key === \"ArrowUp\") {\n            focus(\"previous\");\n        }\n    }\n    if (e.key === \"Home\") {\n        focus(\"first\");\n    } else if (e.key === \"End\") {\n        focus(\"last\");\n    }\n}\n\n/**\n * ## onScroll\n */\nfunction onScroll() {\n    if (!containerRef.value) {\n        return;\n    }\n    containerRef.value[isHorizontal.value ? \"scrollLeft\" : \"scrollTop\"] = 0;\n}\n\nlet startTouch = 0;\nlet startOffset = 0;\n\n/**\n * ## onTouchstart\n * @param e\n */\nfunction onTouchstart(e: TouchEvent) {\n    const sizeProperty = isHorizontal.value ? \"clientX\" : \"clientY\";\n    const sign = isRtl.value && isHorizontal.value ? -1 : 1;\n    startOffset = sign * scrollOffset.value;\n    startTouch = e.touches[0][sizeProperty];\n    disableTransition.value = true;\n}\n\n/**\n * ## onTouchmove\n * @param e\n */\nfunction onTouchmove(e: TouchEvent) {\n    if (!isOverflowing.value) {\n        return;\n    }\n    const sizeProperty = isHorizontal.value ? \"clientX\" : \"clientY\";\n    const sign = isRtl.value && isHorizontal.value ? -1 : 1;\n    scrollOffset.value =\n        sign * (startOffset + startTouch - e.touches[0][sizeProperty]);\n}\n\n/**\n * # onTouchend\n * @param e\n */\nfunction onTouchend(e: TouchEvent) {\n    const maxScrollOffset = contentSize.value - containerSize.value;\n    if (scrollOffset.value < 0 || !isOverflowing.value) {\n        scrollOffset.value = 0;\n    } else if (scrollOffset.value >= maxScrollOffset) {\n        scrollOffset.value = maxScrollOffset;\n    }\n    disableTransition.value = false;\n}\n\n/**\n * ## scrollTo\n * @param location\n */\nfunction scrollTo(location: \"previous\" | \"next\") {\n    const newAbsoluteOffset =\n        scrollOffset.value +\n        (location === \"previous\" ? -1 : 1) * containerSize.value;\n    scrollOffset.value = clamp(\n        newAbsoluteOffset,\n        0,\n        contentSize.value - containerSize.value,\n    );\n}\n\n/**\n * Arrows Hidden\n */\nconst arrowsHiddenClasses = useDisplayRuleClasses(\n    props,\n    \"arrowsHidden\",\n    \"hidden\",\n);\nconst arrowsHiddenAttribute = computed(() => {\n    return isBoolean(props.arrowsHidden) && props.arrowsHidden;\n});\n\nconst contentStyles = computed(() => {\n    // This adds friction when scrolling the 'wrong' way when at max offset\n    let scrollAmount =\n        scrollOffset.value > contentSize.value - containerSize.value\n            ? -(contentSize.value - containerSize.value) +\n              bias(contentSize.value - containerSize.value - scrollOffset.value)\n            : -scrollOffset.value;\n\n    // This adds friction when scrolling the 'wrong' way when at min offset\n    if (scrollOffset.value <= 0) {\n        scrollAmount = bias(-scrollOffset.value);\n    }\n\n    const sign = isRtl.value && isHorizontal.value ? -1 : 1;\n    return {\n        transform: `translate${isHorizontal.value ? \"X\" : \"Y\"}(${sign * scrollAmount}px)`,\n        transition: disableTransition.value ? \"none\" : \"\",\n        willChange: disableTransition.value ? \"transform\" : \"\",\n    };\n});\n\nconst slotProps = computed(() => ({\n    next: group.next,\n    previous: group.previous,\n    select: group.select,\n    isSelected: group.isSelected,\n}));\n\nconst hasPrevious = computed(() => {\n    return Math.abs(scrollOffset.value) > 0;\n});\n\nconst hasNext = computed(() => {\n    // Check one scroll ahead to know the width of right-most item\n    return (\n        contentSize.value > Math.abs(scrollOffset.value) + containerSize.value\n    );\n});\n\nconst hasAffix = computed(() => {\n    if (isBoolean(props.arrowsHidden) && props.arrowsHidden) {\n        return false;\n    }\n    return isOverflowing.value || Math.abs(scrollOffset.value) > 0;\n});\n\nconst arrowsAlignClass = computed(() => {\n    return `is-arrows-${props.arrowsAlign}`;\n});\n\nconst iconNext = computed(() => {\n    if (props.iconNext) {\n        return props.iconNext;\n    }\n    return isHorizontal.value ? ChevronRightIcon : ChevronDownIcon;\n});\n\nconst iconPrevious = computed(() => {\n    if (props.iconPrevious) {\n        return props.iconPrevious;\n    }\n    return isHorizontal.value ? ChevronLeftIcon : ChevronUpIcon;\n});\n</script>\n\n<template>\n    <component\n        :is=\"props.tag\"\n        :class=\"[\n            'ev-slide-group',\n            {\n                'is-overflowing': isOverflowing,\n                'is-vertical': !isHorizontal,\n            },\n            arrowsAlignClass,\n            props.class,\n        ]\"\n        :style=\"props.style\"\n        :tabindex=\"isFocused || group.selected.value.length ? -1 : 0\"\n        @focus=\"onFocus\">\n        <div\n            key=\"container\"\n            ref=\"containerRef\"\n            class=\"ev-slide-group--container\"\n            @scroll=\"onScroll\">\n            <div\n                ref=\"contentRef\"\n                class=\"ev-slide-group--content\"\n                :style=\"contentStyles\"\n                @touchstart.passive=\"onTouchstart\"\n                @touchmove.passive=\"onTouchmove\"\n                @touchend.passive=\"onTouchend\"\n                @focusin=\"onFocusin\"\n                @focusout=\"onFocusout\"\n                @keydown=\"onKeydown\">\n                <slot name=\"default\" v-bind=\"slotProps\" />\n            </div>\n        </div>\n\n        <div\n            v-if=\"hasAffix\"\n            key=\"previous\"\n            :class=\"[\n                'ev-slide-group--previous',\n                { 'is-disabled': !hasPrevious },\n                ...arrowsHiddenClasses,\n            ]\"\n            :hidden=\"arrowsHiddenAttribute\"\n            @click=\"() => scrollTo('previous')\">\n            <slot name=\"previous\">\n                <ev-button\n                    :icon=\"isRtl && isHorizontal ? iconNext : iconPrevious\"\n                    variant=\"subtle\" />\n            </slot>\n        </div>\n\n        <div\n            v-if=\"hasAffix\"\n            key=\"next\"\n            :class=\"[\n                'ev-slide-group--next',\n                { 'is-disabled': !hasNext },\n                ...arrowsHiddenClasses,\n            ]\"\n            :hidden=\"arrowsHiddenAttribute\"\n            @click=\"() => scrollTo('next')\">\n            <slot name=\"next\">\n                <ev-button\n                    :icon=\"isRtl && isHorizontal ? iconPrevious : iconNext\"\n                    variant=\"subtle\" />\n            </slot>\n        </div>\n    </component>\n</template>\n"],"names":[],"mappings":"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"}

package/dist/esm/src/components/EvSlideGroup/EvSlideGroup.vue2.mjs

@@ -0,0 +1,6 @@
+/*! Evance UI v1.0.40 | MIT License */
+import _sfc_main from "./EvSlideGroup.vue.mjs";
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=EvSlideGroup.vue2.mjs.map

package/dist/esm/src/components/EvSlideGroup/EvSlideGroup.vue2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvSlideGroup.vue2.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/esm/src/components/EvSlideGroup/EvSlideGroupItem.vue.mjs

@@ -0,0 +1,33 @@
+/*! Evance UI v1.0.40 | MIT License */
+import { defineComponent, computed, renderSlot, normalizeProps, guardReactiveProps } from "vue";
+import { makeGroupItemProps, useGroupItem } from "../../composables/groupItem.mjs";
+import { EvSlideGroupSymbol } from "./EvSlideGroup.mjs";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "EvSlideGroupItem",
+  props: {
+    ...makeGroupItemProps()
+  },
+  emits: ["group:selected"],
+  setup(__props) {
+    const props = __props;
+    const slideGroupItem = useGroupItem(
+      props,
+      EvSlideGroupSymbol
+    );
+    const slotProps = computed(() => {
+      return {
+        isSelected: slideGroupItem.isSelected.value,
+        select: slideGroupItem.select,
+        toggle: slideGroupItem.toggle,
+        selectedClass: slideGroupItem.selectedClass.value
+      };
+    });
+    return (_ctx, _cache) => {
+      return renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotProps.value)));
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=EvSlideGroupItem.vue.mjs.map

package/dist/esm/src/components/EvSlideGroup/EvSlideGroupItem.vue.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvSlideGroupItem.vue.mjs","sources":["../../../../../src/components/EvSlideGroup/EvSlideGroupItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n    GroupItemProps,\n    GroupItemProvide,\n    makeGroupItemProps,\n    useGroupItem,\n} from \"@/composables/groupItem.ts\";\nimport { computed, UnwrapRef } from \"vue\";\nimport { EvSlideGroupSymbol } from \"@/components\";\n\ntype EvSlideGroupItemSlots = {\n    default: {\n        isSelected: UnwrapRef<GroupItemProvide[\"isSelected\"]>;\n        select: GroupItemProvide[\"select\"];\n        toggle: GroupItemProvide[\"toggle\"];\n        selectedClass: UnwrapRef<GroupItemProvide[\"selectedClass\"]>;\n    };\n};\n\ndefineEmits([\"group:selected\"]);\n\ndefineSlots<EvSlideGroupItemSlots>();\n\nconst props = defineProps({\n    ...makeGroupItemProps(),\n});\nconst slideGroupItem = useGroupItem(\n    props as any as GroupItemProps,\n    EvSlideGroupSymbol,\n);\nconst slotProps = computed(() => {\n    return {\n        isSelected: slideGroupItem!.isSelected.value,\n        select: slideGroupItem!.select,\n        toggle: slideGroupItem!.toggle,\n        selectedClass: slideGroupItem!.selectedClass.value,\n    };\n});\n</script>\n\n<template>\n    <slot v-bind=\"slotProps\" />\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;AA0BA,UAAM,iBAAiB;AAAA,MACnB;AAAA,MACA;AAAA,IACJ;AACM,UAAA,YAAY,SAAS,MAAM;AACtB,aAAA;AAAA,QACH,YAAY,eAAgB,WAAW;AAAA,QACvC,QAAQ,eAAgB;AAAA,QACxB,QAAQ,eAAgB;AAAA,QACxB,eAAe,eAAgB,cAAc;AAAA,MACjD;AAAA,IAAA,CACH;;;;;;"}

package/dist/esm/src/components/EvSlideGroup/EvSlideGroupItem.vue2.mjs

@@ -0,0 +1,6 @@
+/*! Evance UI v1.0.40 | MIT License */
+import _sfc_main from "./EvSlideGroupItem.vue.mjs";
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=EvSlideGroupItem.vue2.mjs.map

package/dist/esm/src/components/EvSlideGroup/EvSlideGroupItem.vue2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvSlideGroupItem.vue2.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/esm/src/components/EvSlideGroup/helpers.mjs

@@ -0,0 +1,51 @@
+/*! Evance UI v1.0.40 | MIT License */
+function bias(val) {
+  const c = 0.501;
+  const x = Math.abs(val);
+  return Math.sign(val) * (x / ((1 / c - 2) * (1 - x) + 1));
+}
+function calculateUpdatedOffset({
+  selectedElement,
+  containerSize,
+  contentSize,
+  isRtl,
+  currentScrollOffset,
+  isHorizontal
+}) {
+  const clientSize = isHorizontal ? selectedElement.clientWidth : selectedElement.clientHeight;
+  const offsetStart = isHorizontal ? selectedElement.offsetLeft : selectedElement.offsetTop;
+  const adjustedOffsetStart = isRtl && isHorizontal ? contentSize - offsetStart - clientSize : offsetStart;
+  const totalSize = containerSize + currentScrollOffset;
+  const itemOffset = clientSize + adjustedOffsetStart;
+  const additionalOffset = clientSize * 0.4;
+  if (adjustedOffsetStart <= currentScrollOffset) {
+    currentScrollOffset = Math.max(
+      adjustedOffsetStart - additionalOffset,
+      0
+    );
+  } else if (totalSize <= itemOffset) {
+    currentScrollOffset = Math.min(
+      currentScrollOffset - (totalSize - itemOffset - additionalOffset),
+      contentSize - containerSize
+    );
+  }
+  return currentScrollOffset;
+}
+function calculateCenteredOffset({
+  selectedElement,
+  containerSize,
+  contentSize,
+  isRtl,
+  isHorizontal
+}) {
+  const clientSize = isHorizontal ? selectedElement.clientWidth : selectedElement.clientHeight;
+  const offsetStart = isHorizontal ? selectedElement.offsetLeft : selectedElement.offsetTop;
+  const offsetCentered = isRtl && isHorizontal ? contentSize - offsetStart - clientSize / 2 - containerSize / 2 : offsetStart + clientSize / 2 - containerSize / 2;
+  return Math.min(contentSize - containerSize, Math.max(0, offsetCentered));
+}
+export {
+  bias,
+  calculateCenteredOffset,
+  calculateUpdatedOffset
+};
+//# sourceMappingURL=helpers.mjs.map

package/dist/esm/src/components/EvSlideGroup/helpers.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.mjs","sources":["../../../../../src/components/EvSlideGroup/helpers.ts"],"sourcesContent":["/**\n * # bias\n *\n * @param val\n */\nexport function bias(val: number) {\n    const c = 0.501;\n    const x = Math.abs(val);\n    return Math.sign(val) * (x / ((1 / c - 2) * (1 - x) + 1));\n}\n\n/**\n * # calculateUpdatedOffset\n *\n * @param selectedElement\n * @param containerSize\n * @param contentSize\n * @param isRtl\n * @param currentScrollOffset\n * @param isHorizontal\n */\nexport function calculateUpdatedOffset({\n    selectedElement,\n    containerSize,\n    contentSize,\n    isRtl,\n    currentScrollOffset,\n    isHorizontal,\n}: {\n    selectedElement: HTMLElement;\n    containerSize: number;\n    contentSize: number;\n    isRtl: boolean;\n    currentScrollOffset: number;\n    isHorizontal: boolean;\n}): number {\n    const clientSize = isHorizontal\n        ? selectedElement.clientWidth\n        : selectedElement.clientHeight;\n    const offsetStart = isHorizontal\n        ? selectedElement.offsetLeft\n        : selectedElement.offsetTop;\n    const adjustedOffsetStart =\n        isRtl && isHorizontal\n            ? contentSize - offsetStart - clientSize\n            : offsetStart;\n\n    const totalSize = containerSize + currentScrollOffset;\n    const itemOffset = clientSize + adjustedOffsetStart;\n    const additionalOffset = clientSize * 0.4; // @todo: why 0.4?\n\n    if (adjustedOffsetStart <= currentScrollOffset) {\n        currentScrollOffset = Math.max(\n            adjustedOffsetStart - additionalOffset,\n            0,\n        );\n    } else if (totalSize <= itemOffset) {\n        currentScrollOffset = Math.min(\n            currentScrollOffset - (totalSize - itemOffset - additionalOffset),\n            contentSize - containerSize,\n        );\n    }\n\n    return currentScrollOffset;\n}\n\n/**\n * # calculateCenteredOffset\n *\n * @param selectedElement\n * @param containerSize\n * @param contentSize\n * @param isRtl\n * @param isHorizontal\n */\nexport function calculateCenteredOffset({\n    selectedElement,\n    containerSize,\n    contentSize,\n    isRtl,\n    isHorizontal,\n}: {\n    selectedElement: HTMLElement;\n    containerSize: number;\n    contentSize: number;\n    isRtl: boolean;\n    isHorizontal: boolean;\n}): number {\n    const clientSize = isHorizontal\n        ? selectedElement.clientWidth\n        : selectedElement.clientHeight;\n    const offsetStart = isHorizontal\n        ? selectedElement.offsetLeft\n        : selectedElement.offsetTop;\n\n    const offsetCentered =\n        isRtl && isHorizontal\n            ? contentSize - offsetStart - clientSize / 2 - containerSize / 2\n            : offsetStart + clientSize / 2 - containerSize / 2;\n\n    return Math.min(contentSize - containerSize, Math.max(0, offsetCentered));\n}\n"],"names":[],"mappings":";AAKO,SAAS,KAAK,KAAa;AAC9B,QAAM,IAAI;AACJ,QAAA,IAAI,KAAK,IAAI,GAAG;AACf,SAAA,KAAK,KAAK,GAAG,KAAK,MAAM,IAAI,IAAI,MAAM,IAAI,KAAK;AAC1D;AAYO,SAAS,uBAAuB;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ,GAOW;AACP,QAAM,aAAa,eACb,gBAAgB,cAChB,gBAAgB;AACtB,QAAM,cAAc,eACd,gBAAgB,aAChB,gBAAgB;AACtB,QAAM,sBACF,SAAS,eACH,cAAc,cAAc,aAC5B;AAEV,QAAM,YAAY,gBAAgB;AAClC,QAAM,aAAa,aAAa;AAChC,QAAM,mBAAmB,aAAa;AAEtC,MAAI,uBAAuB,qBAAqB;AAC5C,0BAAsB,KAAK;AAAA,MACvB,sBAAsB;AAAA,MACtB;AAAA,IACJ;AAAA,EAAA,WACO,aAAa,YAAY;AAChC,0BAAsB,KAAK;AAAA,MACvB,uBAAuB,YAAY,aAAa;AAAA,MAChD,cAAc;AAAA,IAClB;AAAA,EAAA;AAGG,SAAA;AACX;AAWO,SAAS,wBAAwB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ,GAMW;AACP,QAAM,aAAa,eACb,gBAAgB,cAChB,gBAAgB;AACtB,QAAM,cAAc,eACd,gBAAgB,aAChB,gBAAgB;AAEtB,QAAM,iBACF,SAAS,eACH,cAAc,cAAc,aAAa,IAAI,gBAAgB,IAC7D,cAAc,aAAa,IAAI,gBAAgB;AAElD,SAAA,KAAK,IAAI,cAAc,eAAe,KAAK,IAAI,GAAG,cAAc,CAAC;AAC5E;"}