ep-craft 0.1.34 → 0.1.35

package/dist/components/carousel/use-carousel.js

@@ -0,0 +1,200 @@
+import { getCurrentInstance as se, useSlots as ce, ref as c, computed as v, unref as S, watch as h, shallowRef as ve, onMounted as fe, onBeforeUnmount as me, provide as he, isVNode as de } from "vue";
+import { throttle as _ } from "lodash-unified";
+import { useResizeObserver as Ie } from "@vueuse/core";
+import { isString as ge } from "@vue/shared";
+import { debugWarn as Ce } from "../../utils/error.js";
+import { CHANGE_EVENT as Se } from "../../constants/event.js";
+import "@element-plus/icons-vue";
+import { flattedChildren as Ee } from "../../utils/vue/vnode.js";
+import { useOrderedChildren as Te } from "../../hooks/use-ordered-children/index.js";
+import "../../hooks/use-size/index.js";
+import "@popperjs/core";
+import "../../hooks/use-z-index/index.js";
+import "../../hooks/use-delayed-toggle/index.js";
+import "../../hooks/use-aria/index.js";
+import "../../hooks/use-model-toggle/index.js";
+import "../../hooks/use-empty-values/index.js";
+import { carouselContextKey as Ae, CAROUSEL_ITEM_NAME as R } from "./constants.js";
+const B = 300, De = (t, P, V) => {
+  const {
+    children: r,
+    addChild: k,
+    removeChild: U,
+    ChildrenSorter: x
+  } = Te(
+    se(),
+    R
+  ), E = ce(), n = c(-1), f = c(null), d = c(!1), I = c(), y = c(0), u = c(!0), z = v(
+    () => t.arrow !== "never" && !S(m)
+  ), D = v(() => r.value.some((e) => e.props.label.toString().length > 0)), T = v(() => t.type === "card"), m = v(() => t.direction === "vertical"), F = v(() => t.height !== "auto" ? {
+    height: t.height
+  } : {
+    height: `${y.value}px`,
+    overflow: "hidden"
+  }), G = _(
+    (e) => {
+      i(e);
+    },
+    B,
+    { trailing: !0 }
+  ), K = _((e) => {
+    Y(e);
+  }, B), W = (e) => u.value ? n.value <= 1 ? e <= 1 : e > 1 : !0;
+  function g() {
+    f.value && (clearInterval(f.value), f.value = null);
+  }
+  function C() {
+    t.interval <= 0 || !t.autoplay || f.value || (f.value = setInterval(() => $(), t.interval));
+  }
+  const $ = () => {
+    n.value < r.value.length - 1 ? n.value = n.value + 1 : t.loop && (n.value = 0);
+  };
+  function i(e) {
+    if (ge(e)) {
+      const o = r.value.filter(
+        (s) => s.props.name === e
+      );
+      o.length > 0 && (e = r.value.indexOf(o[0]));
+    }
+    if (e = Number(e), Number.isNaN(e) || e !== Math.floor(e)) {
+      Ce(V, "index must be integer.");
+      return;
+    }
+    const a = r.value.length, l = n.value;
+    e < 0 ? n.value = t.loop ? a - 1 : 0 : e >= a ? n.value = t.loop ? 0 : a - 1 : n.value = e, l === n.value && A(l), N();
+  }
+  function A(e) {
+    r.value.forEach((a, l) => {
+      a.translateItem(l, n.value, e);
+    });
+  }
+  function j(e, a) {
+    var H, L, O, M;
+    const l = S(r), o = l.length;
+    if (o === 0 || !e.states.inStage) return !1;
+    const s = a + 1, le = a - 1, b = o - 1, re = l[b].states.active, oe = l[0].states.active, ie = (L = (H = l[s]) == null ? void 0 : H.states) == null ? void 0 : L.active, ue = (M = (O = l[le]) == null ? void 0 : O.states) == null ? void 0 : M.active;
+    return a === b && oe || ie ? "left" : a === 0 && re || ue ? "right" : !1;
+  }
+  function p() {
+    d.value = !0, t.pauseOnHover && g();
+  }
+  function q() {
+    d.value = !1, C();
+  }
+  function J(e) {
+    S(m) || r.value.forEach((a, l) => {
+      e === j(a, l) && (a.states.hover = !0);
+    });
+  }
+  function Q() {
+    S(m) || r.value.forEach((e) => {
+      e.states.hover = !1;
+    });
+  }
+  function X(e) {
+    n.value = e;
+  }
+  function Y(e) {
+    t.trigger === "hover" && e !== n.value && (n.value = e);
+  }
+  function Z() {
+    i(n.value - 1);
+  }
+  function ee() {
+    i(n.value + 1);
+  }
+  function N() {
+    g(), (!t.pauseOnHover || !d.value) && C();
+  }
+  function te(e) {
+    t.height === "auto" && (y.value = e);
+  }
+  function ne() {
+    var o;
+    const e = (o = E.default) == null ? void 0 : o.call(E);
+    if (!e) return null;
+    const l = Ee(e).filter((s) => de(s) && s.type.name === R);
+    return (l == null ? void 0 : l.length) === 2 && t.loop && !T.value ? (u.value = !0, l) : (u.value = !1, null);
+  }
+  h(
+    () => n.value,
+    (e, a) => {
+      A(a), u.value && (e = e % 2, a = a % 2), a > -1 && P(Se, e, a);
+    }
+  );
+  const ae = v({
+    get: () => u.value ? n.value % 2 : n.value,
+    set: (e) => n.value = e
+  });
+  h(
+    () => t.autoplay,
+    (e) => {
+      e ? C() : g();
+    }
+  ), h(
+    () => t.loop,
+    () => {
+      i(n.value);
+    }
+  ), h(
+    () => t.interval,
+    () => {
+      N();
+    }
+  );
+  const w = ve();
+  return fe(() => {
+    h(
+      () => r.value,
+      () => {
+        r.value.length > 0 && i(t.initialIndex);
+      },
+      {
+        immediate: !0
+      }
+    ), w.value = Ie(I.value, () => {
+      A();
+    }), C();
+  }), me(() => {
+    g(), I.value && w.value && w.value.stop();
+  }), he(Ae, {
+    root: I,
+    isCardType: T,
+    isVertical: m,
+    items: r,
+    loop: t.loop,
+    cardScale: t.cardScale,
+    addItem: k,
+    removeItem: U,
+    setActiveItem: i,
+    setContainerHeight: te
+  }), {
+    root: I,
+    activeIndex: n,
+    exposeActiveIndex: ae,
+    arrowDisplay: z,
+    hasLabel: D,
+    hover: d,
+    isCardType: T,
+    items: r,
+    isVertical: m,
+    containerStyle: F,
+    isItemsTwoLength: u,
+    handleButtonEnter: J,
+    handleButtonLeave: Q,
+    handleIndicatorClick: X,
+    handleMouseEnter: p,
+    handleMouseLeave: q,
+    setActiveItem: i,
+    prev: Z,
+    next: ee,
+    PlaceholderItem: ne,
+    isTwoLengthShow: W,
+    ItemsSorter: x,
+    throttledArrowClick: G,
+    throttledIndicatorHover: K
+  };
+};
+export {
+  De as useCarousel
+};

package/dist/components/carousel-item/EpCarouselItem.vue.d.ts

@@ -0,0 +1,16 @@
+import type { CarouselItemProps } from './carousel-item';
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<CarouselItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<CarouselItemProps> & Readonly<{}>, {
+    name: string;
+    label: string | number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/carousel-item/EpCarouselItem.vue.js

@@ -0,0 +1,74 @@
+import { defineComponent as T, computed as n, unref as e, withDirectives as c, openBlock as p, createElementBlock as u, normalizeStyle as N, normalizeClass as v, vShow as f, createCommentVNode as R, renderSlot as w } from "vue";
+import { useNamespace as x } from "../../hooks/use-namespace/index.js";
+import "@vue/shared";
+import "lodash-unified";
+import "@vueuse/core";
+import "@element-plus/icons-vue";
+import "../../hooks/use-size/index.js";
+import "@popperjs/core";
+import "../../hooks/use-z-index/index.js";
+import "../../hooks/use-delayed-toggle/index.js";
+import "../../hooks/use-aria/index.js";
+import "../../hooks/use-model-toggle/index.js";
+import "../../hooks/use-empty-values/index.js";
+import { useCarouselItem as z } from "./use-carousel-item.js";
+import { CAROUSEL_ITEM_NAME as A } from "../carousel/constants.js";
+const J = /* @__PURE__ */ T({
+  name: A,
+  __name: "EpCarouselItem",
+  props: {
+    name: { default: "" },
+    label: { default: "" }
+  },
+  setup(d) {
+    const y = d, t = x("carousel"), {
+      carouselItemRef: C,
+      active: s,
+      animating: _,
+      hover: k,
+      inStage: I,
+      isVertical: l,
+      translate: S,
+      isCardType: r,
+      scale: E,
+      ready: $,
+      handleItemClick: i
+    } = z(y), g = n(() => [
+      t.e("item"),
+      t.is("active", s.value),
+      t.is("in-stage", I.value),
+      t.is("hover", k.value),
+      t.is("animating", _.value),
+      {
+        [t.em("item", "card")]: r.value,
+        [t.em("item", "card-vertical")]: r.value && l.value
+      }
+    ]), h = n(() => {
+      const a = `${`translate${e(l) ? "Y" : "X"}`}(${e(S)}px)`, o = `scale(${e(E)})`;
+      return {
+        transform: [a, o].join(" ")
+      };
+    });
+    return (m, a) => c((p(), u("div", {
+      ref_key: "carouselItemRef",
+      ref: C,
+      class: v(g.value),
+      style: N(h.value),
+      onClick: a[0] || (a[0] = //@ts-ignore
+      (...o) => e(i) && e(i)(...o))
+    }, [
+      e(r) ? c((p(), u("div", {
+        key: 0,
+        class: v(e(t).e("mask"))
+      }, null, 2)), [
+        [f, !e(s)]
+      ]) : R("", !0),
+      w(m.$slots, "default")
+    ], 6)), [
+      [f, e($)]
+    ]);
+  }
+});
+export {
+  J as default
+};

package/dist/components/carousel-item/EpCarouselItem2.vue.js

@@ -0,0 +1,4 @@
+import f from "./EpCarouselItem.vue.js";
+export {
+  f as default
+};

package/dist/components/carousel-item/carousel-item.d.ts

@@ -0,0 +1,22 @@
+import type { ExtractPublicPropTypes } from 'vue';
+export interface CarouselItemProps {
+    /**
+     * @description name of the item, can be used in `setActiveItem`
+     */
+    name?: string;
+    /**
+     * @description text content for the corresponding indicator
+     */
+    label?: string | number;
+}
+/**
+ * @deprecated Removed after 3.0.0, Use `CarouselItemProps` instead.
+ */
+export declare const carouselItemProps: {
+    readonly name: import("@element-plus/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
+    readonly label: import("@element-plus/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "", boolean>;
+};
+/**
+ * @deprecated Removed after 3.0.0, Use `CarouselItemProps` instead.
+ */
+export type CarouselItemPropsPublic = ExtractPublicPropTypes<typeof carouselItemProps>;

package/dist/components/carousel-item/carousel-item.js

@@ -0,0 +1,22 @@
+import "@vue/shared";
+import "lodash-unified";
+import "@vueuse/core";
+import "@element-plus/icons-vue";
+import { buildProps as t } from "../../utils/vue/props/runtime.js";
+import "vue";
+const l = t({
+  /**
+   * @description name of the item, can be used in `setActiveItem`
+   */
+  name: { type: String, default: "" },
+  /**
+   * @description text content for the corresponding indicator
+   */
+  label: {
+    type: [String, Number],
+    default: ""
+  }
+});
+export {
+  l as carouselItemProps
+};

package/dist/components/carousel-item/index.d.ts

@@ -1,4 +1,16 @@
 import type { Plugin } from 'vue';
-import { ElCarouselItem } from 'element-plus';
-export declare const EpCarouselItem: typeof ElCarouselItem & Plugin;
+import _EpCarouselItem from './EpCarouselItem.vue';
+/**
+ * carousel-item 自持 barrel（vendor-batch-2 产出）。
+ *
+ * 子项组件名直接取 `carousel/constants.ts` 的 `CAROUSEL_ITEM_NAME`
+ * （值为 `'EpCarouselItem'`）。父组件 `useCarousel` 的 `useOrderedChildren`
+ * 与 `PlaceholderItem` 均按同一常量匹配，故改名不会让识别再次失效。
+ *
+ * 不导出 `ElCarouselItem` 别名。
+ */
+export declare const EpCarouselItem: typeof _EpCarouselItem & Plugin;
 export default EpCarouselItem;
+export { carouselItemProps } from './carousel-item';
+export type { CarouselItemProps, CarouselItemPropsPublic, } from './carousel-item';
+export type { CarouselItemInstance } from '../carousel/instance';

package/dist/components/carousel-item/index.js

@@ -1,6 +1,11 @@
-import { ElCarouselItem as e } from "element-plus";
-import { withInstall as t } from "../../utils/with-install.js";
-const o = Object.assign({}, e, { name: "EpCarouselItem" }), s = t(o, "ep-carousel-item");
+import { withInstall as o } from "../../utils/with-install.js";
+import r from "./EpCarouselItem.vue.js";
+import { carouselItemProps as a } from "./carousel-item.js";
+const m = o(
+  r,
+  "ep-carousel-item"
+);
 export {
-  s as EpCarouselItem
+  m as EpCarouselItem,
+  a as carouselItemProps
 };

package/dist/components/carousel-item/use-carousel-item.d.ts

@@ -0,0 +1,14 @@
+import type { CarouselItemProps } from './carousel-item';
+export declare const useCarouselItem: (props: Required<CarouselItemProps>) => {
+    carouselItemRef: import("vue").Ref<HTMLElement | undefined, HTMLElement | undefined>;
+    active: import("vue").Ref<boolean, boolean>;
+    animating: import("vue").Ref<boolean, boolean>;
+    hover: import("vue").Ref<boolean, boolean>;
+    inStage: import("vue").Ref<boolean, boolean>;
+    isVertical: import("vue").Ref<boolean, boolean>;
+    translate: import("vue").Ref<number, number>;
+    isCardType: import("vue").Ref<boolean, boolean>;
+    scale: import("vue").Ref<number, number>;
+    ready: import("vue").Ref<boolean, boolean>;
+    handleItemClick: () => void;
+};

package/dist/components/carousel-item/use-carousel-item.js

@@ -0,0 +1,79 @@
+import { inject as S, getCurrentInstance as U, ref as a, reactive as V, onBeforeUnmount as L, unref as u } from "vue";
+import { isUndefined as R } from "../../utils/types.js";
+import "lodash-unified";
+import "@vueuse/core";
+import { debugWarn as A } from "../../utils/error.js";
+import "@vue/shared";
+import "@element-plus/icons-vue";
+import { carouselContextKey as j, CAROUSEL_ITEM_NAME as E } from "../carousel/constants.js";
+const G = (H) => {
+  const o = S(j), c = U();
+  o || A(
+    E,
+    "usage: <el-carousel></el-carousel-item></el-carousel>"
+  ), c || A(
+    E,
+    "compositional hook can only be invoked inside setups"
+  );
+  const h = a(), T = a(!1), i = a(0), C = a(1), f = a(!1), I = a(!1), m = a(!1), g = a(!1), { isCardType: d, isVertical: y, cardScale: p } = o;
+  function M(t, e, s) {
+    const r = s - 1, n = e - 1, l = e + 1, v = s / 2;
+    return e === 0 && t === r ? -1 : e === r && t === 0 ? s : t < n && e - t >= v ? s + 1 : t > l && t - e >= v ? -2 : t;
+  }
+  function N(t, e) {
+    var r, n;
+    const s = u(y) ? ((r = o.root.value) == null ? void 0 : r.offsetHeight) || 0 : ((n = o.root.value) == null ? void 0 : n.offsetWidth) || 0;
+    return m.value ? s * ((2 - p) * (t - e) + 1) / 4 : t < e ? -(1 + p) * s / 4 : (3 + p) * s / 4;
+  }
+  function W(t, e, s) {
+    const r = o.root.value;
+    return r ? ((s ? r.offsetHeight : r.offsetWidth) || 0) * (t - e) : 0;
+  }
+  const _ = (t, e, s) => {
+    const r = u(d), n = o.items.value.length ?? Number.NaN, l = t === e;
+    !r && !R(s) && (g.value = l || t === s), !l && n > 2 && o.loop && (t = M(t, e, n));
+    const v = u(y);
+    f.value = l, r ? (m.value = Math.round(Math.abs(t - e)) <= 1, i.value = N(t, e), C.value = u(f) ? 1 : p) : i.value = W(t, e, v), I.value = !0, l && h.value && o.setContainerHeight(h.value.offsetHeight);
+  };
+  function k() {
+    if (o && u(d)) {
+      const t = o.items.value.findIndex(
+        ({ uid: e }) => e === c.uid
+      );
+      o.setActiveItem(t);
+    }
+  }
+  const b = {
+    props: H,
+    states: V({
+      hover: T,
+      translate: i,
+      scale: C,
+      active: f,
+      ready: I,
+      inStage: m,
+      animating: g
+    }),
+    uid: c.uid,
+    getVnode: () => c.vnode,
+    translateItem: _
+  };
+  return o.addItem(b), L(() => {
+    o.removeItem(b);
+  }), {
+    carouselItemRef: h,
+    active: f,
+    animating: g,
+    hover: T,
+    inStage: m,
+    isVertical: y,
+    translate: i,
+    isCardType: d,
+    scale: C,
+    ready: I,
+    handleItemClick: k
+  };
+};
+export {
+  G as useCarouselItem
+};