@evance/evance-ui 1.0.3 → 1.0.4

package/dist/esm/EvInfiniteScroll.mjs

@@ -0,0 +1,438 @@
+/*! Evance UI v1.0.4 | MIT License */
+import { m as makeTagProps } from "./tag-B_pb7K30.mjs";
+import { m as makeDimensionsProps, u as useDimensions } from "./dimensions-BR2pwRcF.mjs";
+import { p as propsFactory } from "./props-DwRGNAyc.mjs";
+import { defineComponent, useSlots, computed, openBlock, createElementBlock, renderSlot, normalizeProps, mergeProps, createElementVNode, toDisplayString, unref, Fragment, createVNode, withCtx, createTextVNode, ref, shallowRef, onBeforeUnmount, watch, onMounted, createBlock, resolveDynamicComponent, normalizeClass, normalizeStyle, createSlots, createCommentVNode, nextTick } from "vue";
+import { _ as _sfc_main$3 } from "./EvButton.vue_vue_type_script_setup_true_lang-CMtKziL1.mjs";
+import { _ as _sfc_main$4 } from "./EvProgressCircular.vue_vue_type_script_setup_true_lang-CeWn9au7.mjs";
+import { u as useLocaleFunctions } from "./locale-BlwtSDSz.mjs";
+import { B as Browser } from "./helpers-BBJ8aYIT.mjs";
+import { t as toWebUnit } from "./units-BfGYqMlE.mjs";
+const makeEvInfiniteScrollProps = propsFactory(
+  {
+    direction: {
+      type: String,
+      default: "vertical",
+      validator: (v) => ["vertical", "horizontal"].includes(v)
+    },
+    margin: [Number, String],
+    mode: {
+      type: String,
+      default: "intersect",
+      validator: (v) => ["intersect", "manual"].includes(v)
+    },
+    side: {
+      type: String,
+      default: "end",
+      validator: (v) => ["start", "end", "both"].includes(v)
+    },
+    textMore: {
+      type: String,
+      default: "infiniteScroll.more"
+    },
+    textFinished: {
+      type: String,
+      default: "infiniteScroll.finished"
+    },
+    ...makeTagProps(),
+    ...makeDimensionsProps()
+  },
+  "EvInfiniteScroll"
+);
+const _hoisted_1 = { class: "ev-infinite-scroll-side" };
+const _hoisted_2 = { class: "ev-infinite-scroll-finished" };
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  __name: "EvInfiniteScrollSide",
+  props: {
+    mode: {
+      type: String,
+      default: void 0
+    },
+    side: {
+      type: String,
+      default: void 0
+    },
+    status: {
+      type: String,
+      default: void 0
+    },
+    textFinished: {
+      type: String,
+      default: void 0
+    },
+    textMore: {
+      type: String,
+      default: void 0
+    }
+  },
+  emits: ["click:more"],
+  setup(__props, { emit }) {
+    const props = __props;
+    useSlots();
+    const onClick = () => {
+      emit("click:more");
+    };
+    const slotProps = {
+      side: props.side,
+      props: {
+        onClick
+      }
+    };
+    const { t } = useLocaleFunctions();
+    const isError = computed(() => props.status === "error");
+    const isFinished = computed(() => props.status === "finished");
+    const isManual = computed(() => props.mode === "manual");
+    const isLoading = computed(() => props.status === "loading");
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        isError.value ? renderSlot(_ctx.$slots, "error", normalizeProps(mergeProps({ key: 0 }, slotProps))) : isFinished.value ? renderSlot(_ctx.$slots, "finished", normalizeProps(mergeProps({ key: 1 }, slotProps)), () => [
+          createElementVNode("div", _hoisted_2, toDisplayString(unref(t)(props.textFinished)), 1)
+        ]) : isManual.value ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
+          !isLoading.value ? renderSlot(_ctx.$slots, "more", normalizeProps(mergeProps({ key: 0 }, slotProps)), () => [
+            createVNode(unref(_sfc_main$3), { onClick }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(unref(t)(props.textMore)), 1)
+              ]),
+              _: 1
+            })
+          ]) : renderSlot(_ctx.$slots, "loading", normalizeProps(mergeProps({ key: 1 }, slotProps)), () => [
+            createVNode(unref(_sfc_main$3), { loading: "" }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(unref(t)(props.textMore)), 1)
+              ]),
+              _: 1
+            })
+          ])
+        ], 64)) : renderSlot(_ctx.$slots, "loading", normalizeProps(mergeProps({ key: 3 }, slotProps)), () => [
+          createVNode(unref(_sfc_main$4), { indeterminate: "" })
+        ])
+      ]);
+    };
+  }
+});
+function useIntersectionObserver(callback, options) {
+  const intersectionRef = ref();
+  const isIntersecting = shallowRef(false);
+  if (Browser.supportsIntersection) {
+    const observer = new IntersectionObserver(
+      (entries) => {
+        isIntersecting.value = !!entries.find(
+          (entry) => entry.isIntersecting
+        );
+      },
+      options
+    );
+    onBeforeUnmount(() => {
+      observer.disconnect();
+    });
+    watch(
+      intersectionRef,
+      (newValue, oldValue) => {
+        if (oldValue) {
+          observer.unobserve(oldValue);
+          isIntersecting.value = false;
+        }
+        if (newValue) {
+          observer.observe(newValue);
+        }
+      },
+      {
+        flush: "post"
+      }
+    );
+  }
+  return { intersectionRef, isIntersecting };
+}
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  __name: "EvInfiniteScrollIntersect",
+  props: {
+    side: {
+      type: String,
+      required: true
+    },
+    rootRef: {
+      type: Object,
+      default: null
+    },
+    rootMargin: {
+      type: String,
+      default: void 0
+    }
+  },
+  emits: ["intersect"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const { intersectionRef, isIntersecting } = useIntersectionObserver(
+      () => {
+      },
+      props.rootMargin ? { rootMargin: props.rootMargin } : void 0
+    );
+    watch(isIntersecting, async (val) => {
+      emit("intersect", props.side, val);
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        ref_key: "intersectionRef",
+        ref: intersectionRef,
+        class: "ev-infinite-scroll-intersect"
+      }, " ", 512);
+    };
+  }
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "EvInfiniteScroll",
+  props: { ...makeEvInfiniteScrollProps() },
+  emits: ["load"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const slots = useSlots();
+    const dimensions = useDimensions(props);
+    const rootEl = ref();
+    const startStatus = shallowRef("ok");
+    const endStatus = shallowRef("ok");
+    const margin = computed(() => toWebUnit(props.margin));
+    const isIntersecting = shallowRef(false);
+    useLocaleFunctions();
+    let previousScrollSize = 0;
+    const hasStartIntersect = computed(() => {
+      return props.side === "start" || props.side === "both";
+    });
+    const hasEndIntersect = computed(() => {
+      return props.side === "end" || props.side === "both";
+    });
+    const intersectMode = computed(() => {
+      return props.mode === "intersect";
+    });
+    function getContainerSize() {
+      if (!rootEl.value) {
+        return 0;
+      }
+      const property = props.direction === "vertical" ? "clientHeight" : "clientWidth";
+      return rootEl.value[property];
+    }
+    function getScrollAmount() {
+      if (!rootEl.value) {
+        return 0;
+      }
+      const property = props.direction === "vertical" ? "scrollTop" : "scrollLeft";
+      return rootEl.value[property];
+    }
+    function getScrollSize() {
+      if (!rootEl.value) {
+        return 0;
+      }
+      const property = props.direction === "vertical" ? "scrollHeight" : "scrollWidth";
+      return rootEl.value[property];
+    }
+    function getStatus(side) {
+      return side === "start" ? startStatus.value : endStatus.value;
+    }
+    function handleIntersect(side, _isIntersecting) {
+      isIntersecting.value = _isIntersecting;
+      if (isIntersecting.value) {
+        intersecting(side);
+      }
+    }
+    function intersecting(side) {
+      if (props.mode !== "manual" && !isIntersecting.value) {
+        return;
+      }
+      const status = getStatus(side);
+      if (!rootEl.value || status === "loading") {
+        return;
+      }
+      previousScrollSize = getScrollSize();
+      setStatus(side, "loading");
+      function state(status2) {
+        setStatus(side, status2);
+        rootEl.value.dispatchEvent(new Event("scroll"));
+        nextTick(() => {
+          if (status2 === "finished" || status2 === "error") {
+            return;
+          }
+          if (status2 === "ok" && side === "start") {
+            setScrollAmount(
+              getScrollSize() - previousScrollSize + getScrollAmount()
+            );
+          }
+          if (props.mode !== "manual") {
+            nextTick(() => {
+              window.requestAnimationFrame(() => {
+                window.requestAnimationFrame(() => {
+                  window.requestAnimationFrame(() => {
+                    intersecting(side);
+                  });
+                });
+              });
+            });
+          }
+        });
+      }
+      emit("load", { side, state });
+    }
+    function setScrollAmount(amount) {
+      if (!rootEl.value) {
+        return;
+      }
+      const property = props.direction === "vertical" ? "scrollTop" : "scrollLeft";
+      rootEl.value[property] = amount;
+    }
+    function setStatus(side, status) {
+      if (side === "start") {
+        startStatus.value = status;
+      } else if (side === "end") {
+        endStatus.value = status;
+      }
+    }
+    onMounted(() => {
+      if (!rootEl.value) {
+        return;
+      }
+      if (props.side === "start") {
+        setScrollAmount(getScrollSize());
+      } else if (props.side === "both") {
+        setScrollAmount(getScrollSize() / 2 - getContainerSize() / 2);
+      }
+    });
+    const sideProps = computed(() => ({
+      mode: props.mode,
+      textFinished: props.textFinished,
+      textMore: props.textMore
+    }));
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(resolveDynamicComponent(props.tag), {
+        ref_key: "rootEl",
+        ref: rootEl,
+        class: normalizeClass([
+          "ev-infinite-scroll",
+          `ev-infinite-scroll--${props.direction}`,
+          {
+            "ev-infinite-scroll--start": hasStartIntersect.value,
+            "ev-infinite-scroll-end": hasEndIntersect.value
+          }
+        ]),
+        style: normalizeStyle([unref(dimensions)])
+      }, {
+        default: withCtx(() => [
+          ["start", "both"].includes(props.side) ? (openBlock(), createBlock(_sfc_main$2, mergeProps({
+            key: 0,
+            side: "start"
+          }, sideProps.value, {
+            status: startStatus.value,
+            "onClick:more": _cache[0] || (_cache[0] = ($event) => intersecting("start"))
+          }), createSlots({ _: 2 }, [
+            unref(slots).finished ? {
+              name: "finished",
+              fn: withCtx(({ side, props: props2 }) => [
+                renderSlot(_ctx.$slots, "finished", {
+                  side,
+                  props: props2
+                })
+              ]),
+              key: "0"
+            } : void 0,
+            unref(slots).error ? {
+              name: "error",
+              fn: withCtx(({ side, props: props2 }) => [
+                renderSlot(_ctx.$slots, "error", {
+                  side,
+                  props: props2
+                })
+              ]),
+              key: "1"
+            } : void 0,
+            unref(slots).loading ? {
+              name: "loading",
+              fn: withCtx(({ side, props: props2 }) => [
+                renderSlot(_ctx.$slots, "loading", {
+                  side,
+                  props: props2
+                })
+              ]),
+              key: "2"
+            } : void 0,
+            unref(slots).more ? {
+              name: "more",
+              fn: withCtx(({ side, props: props2 }) => [
+                renderSlot(_ctx.$slots, "more", {
+                  side,
+                  props: props2
+                })
+              ]),
+              key: "3"
+            } : void 0
+          ]), 1040, ["status"])) : createCommentVNode("", true),
+          rootEl.value && hasStartIntersect.value && intersectMode.value ? (openBlock(), createBlock(_sfc_main$1, {
+            key: "start",
+            side: "start",
+            "root-ref": rootEl.value,
+            "root-margin": margin.value,
+            onIntersect: handleIntersect
+          }, null, 8, ["root-ref", "root-margin"])) : createCommentVNode("", true),
+          renderSlot(_ctx.$slots, "default"),
+          rootEl.value && hasEndIntersect.value && intersectMode.value ? (openBlock(), createBlock(_sfc_main$1, {
+            key: "end",
+            side: "end",
+            "root-ref": rootEl.value,
+            "root-margin": margin.value,
+            onIntersect: handleIntersect
+          }, null, 8, ["root-ref", "root-margin"])) : createCommentVNode("", true),
+          ["end", "both"].includes(props.side) ? (openBlock(), createBlock(_sfc_main$2, mergeProps({
+            key: 3,
+            side: "end"
+          }, sideProps.value, {
+            status: endStatus.value,
+            "onClick:more": _cache[1] || (_cache[1] = ($event) => intersecting("end"))
+          }), createSlots({ _: 2 }, [
+            unref(slots).finished ? {
+              name: "finished",
+              fn: withCtx(({ side, props: props2 }) => [
+                renderSlot(_ctx.$slots, "finished", {
+                  side,
+                  props: props2
+                })
+              ]),
+              key: "0"
+            } : void 0,
+            unref(slots).error ? {
+              name: "error",
+              fn: withCtx(({ side, props: props2 }) => [
+                renderSlot(_ctx.$slots, "error", {
+                  side,
+                  props: props2
+                })
+              ]),
+              key: "1"
+            } : void 0,
+            unref(slots).loading ? {
+              name: "loading",
+              fn: withCtx(({ side, props: props2 }) => [
+                renderSlot(_ctx.$slots, "loading", {
+                  side,
+                  props: props2
+                })
+              ]),
+              key: "2"
+            } : void 0,
+            unref(slots).more ? {
+              name: "more",
+              fn: withCtx(({ side, props: props2 }) => [
+                renderSlot(_ctx.$slots, "more", {
+                  side,
+                  props: props2
+                })
+              ]),
+              key: "3"
+            } : void 0
+          ]), 1040, ["status"])) : createCommentVNode("", true)
+        ]),
+        _: 3
+      }, 8, ["class", "style"]);
+    };
+  }
+});
+export {
+  _sfc_main as EvInfiniteScroll,
+  makeEvInfiniteScrollProps
+};
+//# sourceMappingURL=EvInfiniteScroll.mjs.map

package/dist/esm/EvInfiniteScroll.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvInfiniteScroll.mjs","sources":["../../src/components/EvInfiniteScroll/EvInfiniteScroll.ts","../../src/components/EvInfiniteScroll/EvInfiniteScrollSide.vue","../../src/composables/intersectionObserver.ts","../../src/components/EvInfiniteScroll/EvInfiniteScrollIntersect.vue","../../src/components/EvInfiniteScroll/EvInfiniteScroll.vue"],"sourcesContent":["import { propsFactory } from \"@/util\";\nimport { makeTagProps } from \"@/composables/tag.ts\";\nimport { makeDimensionsProps } from \"@/composables/dimensions.ts\";\nimport { PropType } from \"vue\";\n\nexport type InfiniteScrollSide = \"start\" | \"end\" | \"both\";\nexport type InfiniteScrollMode = \"intersect\" | \"manual\";\nexport type InfiniteScrollDirection = \"vertical\" | \"horizontal\";\nexport type InfiniteScrollStatus = \"ok\" | \"finished\" | \"loading\" | \"error\";\n\nexport const makeEvInfiniteScrollProps = propsFactory(\n    {\n        direction: {\n            type: String as PropType<InfiniteScrollDirection>,\n            default: \"vertical\",\n            validator: (v: any) => [\"vertical\", \"horizontal\"].includes(v),\n        },\n        margin: [Number, String],\n        mode: {\n            type: String as PropType<InfiniteScrollMode>,\n            default: \"intersect\",\n            validator: (v: any) => [\"intersect\", \"manual\"].includes(v),\n        },\n        side: {\n            type: String as PropType<InfiniteScrollSide>,\n            default: \"end\",\n            validator: (v: any) => [\"start\", \"end\", \"both\"].includes(v),\n        },\n        textMore: {\n            type: String,\n            default: \"infiniteScroll.more\",\n        },\n        textFinished: {\n            type: String,\n            default: \"infiniteScroll.finished\",\n        },\n        ...makeTagProps(),\n        ...makeDimensionsProps(),\n    },\n    \"EvInfiniteScroll\",\n);\n","<script setup lang=\"ts\">\nimport { computed, PropType } from \"vue\";\nimport {\n    InfiniteScrollMode,\n    InfiniteScrollSide,\n    InfiniteScrollStatus,\n} from \"./EvInfiniteScroll.ts\";\nimport { useLocaleFunctions } from \"@/composables\";\nimport { EvButton } from \"@/components/EvButton\";\nimport { EvProgressCircular } from \"@/components/EvProgressCircular\";\n\nconst props = defineProps({\n    mode: {\n        type: String as PropType<InfiniteScrollMode>,\n        default: undefined,\n    },\n    side: {\n        type: String as PropType<InfiniteScrollSide>,\n        default: undefined,\n    },\n    status: {\n        type: String as PropType<InfiniteScrollStatus>,\n        default: undefined,\n    },\n    textFinished: {\n        type: String,\n        default: undefined,\n    },\n    textMore: {\n        type: String,\n        default: undefined,\n    },\n});\n\nconst slots = defineSlots<{\n    error(props: {\n        side: InfiniteScrollSide;\n        props: { onClick: () => void };\n    }): never;\n    finished(props: {\n        side: InfiniteScrollSide;\n        props: { onClick: () => void };\n    }): never;\n    loading(props: {\n        side: InfiniteScrollSide;\n        props: { onClick: () => void };\n    }): never;\n    more(props: {\n        side: InfiniteScrollSide;\n        props: { onClick: () => void };\n    }): never;\n}>();\n\nconst emit = defineEmits([\"click:more\"]);\n\nconst onClick = () => {\n    emit(\"click:more\");\n};\n\nconst slotProps = {\n    side: props.side,\n    props: {\n        onClick,\n    },\n};\n\nconst { t } = useLocaleFunctions();\n\nconst isError = computed(() => props.status === \"error\");\nconst isFinished = computed(() => props.status === \"finished\");\nconst isManual = computed(() => props.mode === \"manual\");\nconst isLoading = computed(() => props.status === \"loading\");\n</script>\n\n<template>\n    <div class=\"ev-infinite-scroll-side\">\n        <template v-if=\"isError\">\n            <slot name=\"error\" v-bind=\"slotProps\" />\n        </template>\n        <template v-else-if=\"isFinished\">\n            <slot name=\"finished\" v-bind=\"slotProps\">\n                <div class=\"ev-infinite-scroll-finished\">\n                    {{ t(props.textFinished) }}\n                </div>\n            </slot>\n        </template>\n        <template v-else-if=\"isManual\">\n            <slot v-if=\"!isLoading\" name=\"more\" v-bind=\"slotProps\">\n                <ev-button @click=\"onClick\">\n                    {{ t(props.textMore) }}\n                </ev-button>\n            </slot>\n            <slot v-else name=\"loading\" v-bind=\"slotProps\">\n                <ev-button loading>\n                    {{ t(props.textMore) }}\n                </ev-button>\n            </slot>\n        </template>\n        <template v-else>\n            <slot name=\"loading\" v-bind=\"slotProps\">\n                <ev-progress-circular indeterminate />\n            </slot>\n        </template>\n    </div>\n</template>\n","import { onBeforeUnmount, ref, shallowRef, watch } from \"vue\";\nimport { Browser } from \"@/util\";\n\nexport function useIntersectionObserver(\n    callback?: IntersectionObserverCallback,\n    options?: IntersectionObserverInit,\n) {\n    const intersectionRef = ref<HTMLElement>();\n    const isIntersecting = shallowRef(false);\n\n    if (Browser.supportsIntersection) {\n        const observer = new IntersectionObserver(\n            (entries: IntersectionObserverEntry[]) => {\n                callback?.(entries, observer);\n                isIntersecting.value = !!entries.find(\n                    (entry) => entry.isIntersecting,\n                );\n            },\n            options,\n        );\n\n        onBeforeUnmount(() => {\n            observer.disconnect();\n        });\n\n        watch(\n            intersectionRef,\n            (newValue, oldValue) => {\n                if (oldValue) {\n                    observer.unobserve(oldValue);\n                    isIntersecting.value = false;\n                }\n                if (newValue) {\n                    observer.observe(newValue);\n                }\n            },\n            {\n                flush: \"post\",\n            },\n        );\n    }\n\n    return { intersectionRef, isIntersecting };\n}\n","<script setup lang=\"ts\">\nimport { useIntersectionObserver } from \"@/composables/intersectionObserver.ts\";\nimport { InfiniteScrollSide } from \"@/components/EvInfiniteScroll\";\nimport { PropType, watch } from \"vue\";\n\nconst props = defineProps({\n    side: {\n        type: String as PropType<InfiniteScrollSide>,\n        required: true,\n    },\n    rootRef: {\n        type: Object as PropType<HTMLDivElement>,\n        default: null,\n    },\n    rootMargin: {\n        type: String,\n        default: undefined,\n    },\n});\n\nconst emit = defineEmits<{\n    (e: \"intersect\", side: InfiniteScrollSide, isIntersecting: boolean): true;\n}>();\n\nconst { intersectionRef, isIntersecting } = useIntersectionObserver(\n    () => {},\n    props.rootMargin ? { rootMargin: props.rootMargin } : undefined,\n);\n\nwatch(isIntersecting, async (val) => {\n    emit(\"intersect\", props.side, val);\n});\n</script>\n\n<template>\n    <div ref=\"intersectionRef\" class=\"ev-infinite-scroll-intersect\">&nbsp;</div>\n</template>\n","<script setup lang=\"ts\">\nimport \"./EvInfiniteScroll.scss\";\nimport {\n    InfiniteScrollSide,\n    InfiniteScrollStatus,\n    makeEvInfiniteScrollProps,\n} from \"./EvInfiniteScroll.ts\";\nimport { useDimensions } from \"@/composables/dimensions.ts\";\nimport { computed, nextTick, onMounted, ref, shallowRef } from \"vue\";\nimport { toWebUnit } from \"@/util\";\nimport { useLocaleFunctions } from \"@/composables\";\nimport EvInfiniteScrollSide from \"@/components/EvInfiniteScroll/EvInfiniteScrollSide.vue\";\nimport EvInfiniteScrollIntersect from \"@/components/EvInfiniteScroll/EvInfiniteScrollIntersect.vue\";\n\nconst props = defineProps({ ...makeEvInfiniteScrollProps() });\nconst slots = defineSlots<{\n    default(): never;\n    error(): never;\n    finished(): never;\n    loading(): never;\n    more(): never;\n}>();\nconst emit = defineEmits<{\n    (\n        e: \"load\",\n        options: {\n            side: InfiniteScrollSide;\n            state: (status: InfiniteScrollStatus) => void;\n        },\n    ): true;\n}>();\nconst dimensions = useDimensions(props);\nconst rootEl = ref<HTMLDivElement>();\nconst startStatus = shallowRef<InfiniteScrollStatus>(\"ok\");\nconst endStatus = shallowRef<InfiniteScrollStatus>(\"ok\");\nconst margin = computed(() => toWebUnit(props.margin));\nconst isIntersecting = shallowRef(false);\nconst { t } = useLocaleFunctions();\nlet previousScrollSize = 0;\n\nconst hasStartIntersect = computed(() => {\n    return props.side === \"start\" || props.side === \"both\";\n});\n\nconst hasEndIntersect = computed(() => {\n    return props.side === \"end\" || props.side === \"both\";\n});\n\nconst intersectMode = computed(() => {\n    return props.mode === \"intersect\";\n});\n\nfunction getContainerSize() {\n    if (!rootEl.value) {\n        return 0;\n    }\n    const property =\n        props.direction === \"vertical\" ? \"clientHeight\" : \"clientWidth\";\n    return rootEl.value[property];\n}\n\nfunction getScrollAmount() {\n    if (!rootEl.value) {\n        return 0;\n    }\n    const property =\n        props.direction === \"vertical\" ? \"scrollTop\" : \"scrollLeft\";\n    return rootEl.value[property];\n}\n\nfunction getScrollSize() {\n    if (!rootEl.value) {\n        return 0;\n    }\n    const property =\n        props.direction === \"vertical\" ? \"scrollHeight\" : \"scrollWidth\";\n    return rootEl.value[property];\n}\n\nfunction getStatus(side: string) {\n    return side === \"start\" ? startStatus.value : endStatus.value;\n}\n\nfunction handleIntersect(side: InfiniteScrollSide, _isIntersecting: boolean) {\n    isIntersecting.value = _isIntersecting;\n    if (isIntersecting.value) {\n        intersecting(side);\n    }\n}\n\nfunction intersecting(side: InfiniteScrollSide) {\n    if (props.mode !== \"manual\" && !isIntersecting.value) {\n        return;\n    }\n    const status = getStatus(side);\n    if (!rootEl.value || status === \"loading\") {\n        return;\n    }\n    previousScrollSize = getScrollSize();\n    setStatus(side, \"loading\");\n\n    function state(status: InfiniteScrollStatus) {\n        setStatus(side, status);\n        // Triggering a scroll event here allows InfiniteScroll to work with VirtualScroll\n        // without any additional listeners\n        rootEl.value.dispatchEvent(new Event(\"scroll\"));\n\n        nextTick(() => {\n            if (status === \"finished\" || status === \"error\") {\n                return;\n            }\n            if (status === \"ok\" && side === \"start\") {\n                setScrollAmount(\n                    getScrollSize() - previousScrollSize + getScrollAmount(),\n                );\n            }\n            if (props.mode !== \"manual\") {\n                nextTick(() => {\n                    window.requestAnimationFrame(() => {\n                        window.requestAnimationFrame(() => {\n                            window.requestAnimationFrame(() => {\n                                intersecting(side);\n                            });\n                        });\n                    });\n                });\n            }\n        });\n    }\n\n    emit(\"load\", { side, state });\n}\n\nfunction setScrollAmount(amount: number) {\n    if (!rootEl.value) {\n        return;\n    }\n    const property =\n        props.direction === \"vertical\" ? \"scrollTop\" : \"scrollLeft\";\n    rootEl.value[property] = amount;\n}\n\nfunction setStatus(side: InfiniteScrollSide, status: InfiniteScrollStatus) {\n    if (side === \"start\") {\n        startStatus.value = status;\n    } else if (side === \"end\") {\n        endStatus.value = status;\n    }\n}\n\nonMounted(() => {\n    if (!rootEl.value) {\n        return;\n    }\n    if (props.side === \"start\") {\n        setScrollAmount(getScrollSize());\n    } else if (props.side === \"both\") {\n        setScrollAmount(getScrollSize() / 2 - getContainerSize() / 2);\n    }\n});\n\nconst sideProps = computed(() => ({\n    mode: props.mode,\n    textFinished: props.textFinished,\n    textMore: props.textMore,\n}));\n</script>\n\n<template>\n    <component\n        :is=\"props.tag\"\n        ref=\"rootEl\"\n        :class=\"[\n            'ev-infinite-scroll',\n            `ev-infinite-scroll--${props.direction}`,\n            {\n                'ev-infinite-scroll--start': hasStartIntersect,\n                'ev-infinite-scroll-end': hasEndIntersect,\n            },\n        ]\"\n        :style=\"[dimensions]\">\n        <ev-infinite-scroll-side\n            v-if=\"['start', 'both'].includes(props.side)\"\n            side=\"start\"\n            v-bind=\"sideProps\"\n            :status=\"startStatus\"\n            @click:more=\"intersecting('start')\">\n            <template v-if=\"slots.finished\" #finished=\"{ side, props }\">\n                <slot name=\"finished\" :side=\"side\" :props=\"props\" />\n            </template>\n            <template v-if=\"slots.error\" #error=\"{ side, props }\">\n                <slot name=\"error\" :side=\"side\" :props=\"props\" />\n            </template>\n            <template v-if=\"slots.loading\" #loading=\"{ side, props }\">\n                <slot name=\"loading\" :side=\"side\" :props=\"props\" />\n            </template>\n            <template v-if=\"slots.more\" #more=\"{ side, props }\">\n                <slot name=\"more\" :side=\"side\" :props=\"props\" />\n            </template>\n        </ev-infinite-scroll-side>\n\n        <ev-infinite-scroll-intersect\n            v-if=\"rootEl && hasStartIntersect && intersectMode\"\n            key=\"start\"\n            side=\"start\"\n            :root-ref=\"rootEl\"\n            :root-margin=\"margin\"\n            @intersect=\"handleIntersect\" />\n\n        <slot name=\"default\" />\n\n        <ev-infinite-scroll-intersect\n            v-if=\"rootEl && hasEndIntersect && intersectMode\"\n            key=\"end\"\n            side=\"end\"\n            :root-ref=\"rootEl\"\n            :root-margin=\"margin\"\n            @intersect=\"handleIntersect\" />\n\n        <ev-infinite-scroll-side\n            v-if=\"['end', 'both'].includes(props.side)\"\n            side=\"end\"\n            v-bind=\"sideProps\"\n            :status=\"endStatus\"\n            @click:more=\"intersecting('end')\">\n            <template v-if=\"slots.finished\" #finished=\"{ side, props }\">\n                <slot name=\"finished\" :side=\"side\" :props=\"props\" />\n            </template>\n            <template v-if=\"slots.error\" #error=\"{ side, props }\">\n                <slot name=\"error\" :side=\"side\" :props=\"props\" />\n            </template>\n            <template v-if=\"slots.loading\" #loading=\"{ side, props }\">\n                <slot name=\"loading\" :side=\"side\" :props=\"props\" />\n            </template>\n            <template v-if=\"slots.more\" #more=\"{ side, props }\">\n                <slot name=\"more\" :side=\"side\" :props=\"props\" />\n            </template>\n        </ev-infinite-scroll-side>\n    </component>\n</template>\n"],"names":["_useSlots","status"],"mappings":"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"}

package/dist/esm/EvKbd.mjs

@@ -1,5 +1,5 @@
-/*! Evance UI v1.0.2 | MIT License */
-import { _, m } from "./EvKbd.vue_vue_type_script_setup_true_lang-GtKzXAew.mjs";
+/*! Evance UI v1.0.4 | MIT License */
+import { _, m } from "./EvKbd.vue_vue_type_script_setup_true_lang-CkrpG6Or.mjs";
 export {
   _ as EvKbd,
   m as makeEvKbdProps

package/dist/esm/EvKbd.vue_vue_type_script_setup_true_lang-CkrpG6Or.mjs

@@ -0,0 +1,42 @@
+/*! Evance UI v1.0.4 | MIT License */
+import { defineComponent, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, renderSlot, createTextVNode, toDisplayString } from "vue";
+import { m as makeComponentProps } from "./component-B_H9WGvL.mjs";
+import { p as propsFactory } from "./props-DwRGNAyc.mjs";
+import { s as sizeModifier } from "./modifiers-VukLygRU.mjs";
+import { I as InputSize } from "./appearance-Da2f3tZo.mjs";
+const makeEvKbdProps = propsFactory(
+  {
+    value: String,
+    size: String,
+    ...makeComponentProps()
+  },
+  "EvKbd"
+);
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "EvKbd",
+  props: {
+    ...makeEvKbdProps()
+  },
+  setup(__props) {
+    const props = __props;
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("kbd", {
+        class: normalizeClass([
+          "ev-kbd",
+          props.class,
+          unref(sizeModifier)(props.size, [unref(InputSize).default])
+        ]),
+        style: normalizeStyle(props.style)
+      }, [
+        renderSlot(_ctx.$slots, "default", {}, () => [
+          createTextVNode(toDisplayString(props.value), 1)
+        ])
+      ], 6);
+    };
+  }
+});
+export {
+  _sfc_main as _,
+  makeEvKbdProps as m
+};
+//# sourceMappingURL=EvKbd.vue_vue_type_script_setup_true_lang-CkrpG6Or.mjs.map

package/dist/esm/EvKbd.vue_vue_type_script_setup_true_lang-CkrpG6Or.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvKbd.vue_vue_type_script_setup_true_lang-CkrpG6Or.mjs","sources":["../../src/components/EvKbd/EvKbd.ts"],"sourcesContent":["import { InputSizeProp, propsFactory } from \"@/util\";\nimport { makeComponentProps } from \"@/composables/component.ts\";\nimport { PropType } from \"vue\";\n\nexport const makeEvKbdProps = propsFactory(\n    {\n        value: String,\n        size: String as PropType<InputSizeProp>,\n\n        ...makeComponentProps(),\n    },\n    \"EvKbd\",\n);\n"],"names":[],"mappings":";;;;;;AAIO,MAAM,iBAAiB;AAAA,EAC1B;AAAA,IACI,OAAO;AAAA,IACP,MAAM;AAAA,IAEN,GAAG,mBAAmB;AAAA,EAC1B;AAAA,EACA;AACJ;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/EvLabel.mjs

@@ -1,5 +1,5 @@
-/*! Evance UI v1.0.2 | MIT License */
-import { _, a, m } from "./EvLabel.vue_vue_type_script_setup_true_lang-C8P9Xr5q.mjs";
+/*! Evance UI v1.0.4 | MIT License */
+import { _, a, m } from "./EvLabel.vue_vue_type_script_setup_true_lang-CH5qLBDT.mjs";
 export {
   _ as EvLabel,
   a as makeEvLabelProps,

package/dist/esm/EvLabel.vue_vue_type_script_setup_true_lang-CH5qLBDT.mjs

@@ -0,0 +1,61 @@
+/*! Evance UI v1.0.4 | MIT License */
+import { defineComponent, useSlots, openBlock, createElementBlock, normalizeClass, normalizeStyle, renderSlot, toDisplayString, createCommentVNode } from "vue";
+import { m as makeComponentProps } from "./component-B_H9WGvL.mjs";
+import { p as propsFactory } from "./props-DwRGNAyc.mjs";
+const makeLabelProps = propsFactory(
+  {
+    label: String,
+    hint: String
+  },
+  "Label"
+);
+const makeEvLabelProps = propsFactory(
+  {
+    title: String,
+    hint: String,
+    clickable: Boolean,
+    ...makeComponentProps()
+  },
+  "EvLabel"
+);
+const _hoisted_1 = {
+  key: 0,
+  class: "ev-label--title"
+};
+const _hoisted_2 = {
+  key: 1,
+  class: "ev-label--hint"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "EvLabel",
+  props: {
+    ...makeEvLabelProps()
+  },
+  setup(__props) {
+    const props = __props;
+    useSlots();
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("label", {
+        class: normalizeClass([
+          "ev-label",
+          {
+            "is-clickable": props.clickable
+          },
+          props.class
+        ]),
+        style: normalizeStyle(props.style)
+      }, [
+        renderSlot(_ctx.$slots, "default", {}, () => [
+          props.title ? (openBlock(), createElementBlock("div", _hoisted_1, toDisplayString(props.title), 1)) : createCommentVNode("", true),
+          props.hint ? (openBlock(), createElementBlock("div", _hoisted_2, toDisplayString(props.hint), 1)) : createCommentVNode("", true)
+        ])
+      ], 6);
+    };
+  }
+});
+export {
+  _sfc_main as _,
+  makeEvLabelProps as a,
+  makeLabelProps as m
+};
+//# sourceMappingURL=EvLabel.vue_vue_type_script_setup_true_lang-CH5qLBDT.mjs.map

package/dist/esm/EvLabel.vue_vue_type_script_setup_true_lang-CH5qLBDT.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvLabel.vue_vue_type_script_setup_true_lang-CH5qLBDT.mjs","sources":["../../src/components/EvLabel/EvLabel.ts","../../src/components/EvLabel/EvLabel.vue"],"sourcesContent":["import { propsFactory } from \"@/util\";\nimport { makeComponentProps } from \"@/composables/component.ts\";\n\nexport const makeLabelProps = propsFactory(\n    {\n        label: String,\n        hint: String,\n    },\n    \"Label\",\n);\n\nexport const makeEvLabelProps = propsFactory(\n    {\n        title: String,\n        hint: String,\n        clickable: Boolean,\n\n        ...makeComponentProps(),\n    },\n    \"EvLabel\",\n);\n","<script setup lang=\"ts\">\n/**\n * # `<ev-label>`\n */\nimport \"./EvLabel.scss\";\nimport { makeEvLabelProps } from \"./EvLabel.ts\";\n\nconst props = defineProps({\n    ...makeEvLabelProps(),\n});\n\nconst slots = defineSlots<{\n    default(): never;\n}>();\n</script>\n\n<template>\n    <label\n        :class=\"[\n            'ev-label',\n            {\n                'is-clickable': props.clickable,\n            },\n            props.class,\n        ]\"\n        :style=\"props.style\">\n        <slot name=\"default\">\n            <div v-if=\"props.title\" class=\"ev-label--title\">\n                {{ props.title }}\n            </div>\n            <div v-if=\"props.hint\" class=\"ev-label--hint\">\n                {{ props.hint }}\n            </div>\n        </slot>\n    </label>\n</template>\n"],"names":["_useSlots"],"mappings":";;;;AAGO,MAAM,iBAAiB;AAAA,EAC1B;AAAA,IACI,OAAO;AAAA,IACP,MAAM;AAAA,EACV;AAAA,EACA;AACJ;AAEO,MAAM,mBAAmB;AAAA,EAC5B;AAAA,IACI,OAAO;AAAA,IACP,MAAM;AAAA,IACN,WAAW;AAAA,IAEX,GAAG,mBAAmB;AAAA,EAC1B;AAAA,EACA;AACJ;;;;;;;;;;;;;;;;ACTcA;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/EvLayout.mjs

@@ -1,5 +1,5 @@
-/*! Evance UI v1.0.2 | MIT License */
-import { _, m } from "./EvLayout.vue_vue_type_script_setup_true_lang-Svv6l0hd.mjs";
+/*! Evance UI v1.0.4 | MIT License */
+import { _, m } from "./EvLayout.vue_vue_type_script_setup_true_lang-D7YCNoVx.mjs";
 export {
   _ as EvLayout,
   m as makeEvLayoutProps