vft 0.0.374 → 0.0.375

package/lib/components/carousel/use-carousel.cjs

@@ -1 +1,286 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),b=require("lodash-es"),te=require("@vueuse/core"),ne=require("@vft/utils"),re=require("../../utils/error.cjs");require("../config-provider/hooks/use-global-config.cjs");const le=require("../../constants/event.cjs"),ae=require("../../utils/vue/vnode.cjs");require("../../hooks/use-model-toggle/index.cjs");const ue=require("../../hooks/use-ordered-children/index.cjs");require("@popperjs/core");require("../../hooks/use-z-index/index.cjs");const E=require("./constants.cjs"),y=300,oe=(n,A,M)=>{const{children:u,addChild:N,removeChild:O,ChildrenSorter:L}=ue.useOrderedChildren(t.getCurrentInstance(),E.CAROUSEL_ITEM_NAME),H=t.useSlots(),l=t.ref(-1),s=t.ref(null),m=t.ref(!1),f=t.ref(),T=t.ref(0),c=t.ref(!0),_=t.computed(()=>n.arrow!=="never"&&!t.unref(v)),R=t.computed(()=>u.value.some(e=>e.props.label&&e.props.label?.toString().length>0)),I=t.computed(()=>n.type==="card"),v=t.computed(()=>n.direction==="vertical"),P=t.computed(()=>n.height!=="auto"?{height:n.height}:{height:`${T.value}px`,overflow:"hidden"}),z=b.throttle(e=>{i(e)},y,{trailing:!0}),B=b.throttle(e=>{W(e)},y),U=e=>c.value?l.value<=1?e<=1:e>1:!0;function h(){s.value&&(clearInterval(s.value),s.value=null)}function d(){n.interval<=0||!n.autoplay||s.value||(s.value=setInterval(()=>V(),n.interval))}const V=()=>{l.value<u.value.length-1?l.value=l.value+1:n.loop&&(l.value=0)};function i(e){if(ne.isString(e)){const o=u.value.filter(C=>C.props.name===e);o.length>0&&(e=u.value.indexOf(o[0]))}if(e=Number(e),Number.isNaN(e)||e!==Math.floor(e)){re.debugWarn(M,"index must be integer.");return}const r=u.value.length,a=l.value;e<0?l.value=n.loop?r-1:0:e>=r?l.value=n.loop?0:r-1:l.value=e,a===l.value&&g(a),q()}function g(e){u.value.forEach((r,a)=>{r.translateItem(a,l.value,e)})}function k(e,r){const a=t.unref(u),o=a.length;if(o===0||!e.states.inStage)return!1;const C=r+1,Y=r-1,w=o-1,Z=a[w].states.active,x=a[0].states.active,p=a[C]?.states?.active,ee=a[Y]?.states?.active;return r===w&&x||p?"left":r===0&&Z||ee?"right":!1}function j(){m.value=!0,n.pauseOnHover&&h()}function D(){m.value=!1,d()}function F(e){t.unref(v)||u.value.forEach((r,a)=>{e===k(r,a)&&(r.states.hover=!0)})}function G(){t.unref(v)||u.value.forEach(e=>{e.states.hover=!1})}function K(e){l.value=e}function W(e){n.trigger==="hover"&&e!==l.value&&(l.value=e)}function $(){i(l.value-1)}function J(){i(l.value+1)}function q(){h(),n.pauseOnHover||d()}function Q(e){n.height==="auto"&&(T.value=e)}function X(){const e=H.default?.();if(!e)return null;const a=ae.flattedChildren(e).filter(o=>t.isVNode(o)&&o.type.name===E.CAROUSEL_ITEM_NAME);return a?.length===2&&n.loop&&!I.value?(c.value=!0,a):(c.value=!1,null)}t.watch(()=>l.value,(e,r)=>{g(r),c.value&&(e=e%2,r=r%2),r>-1&&A(le.CHANGE_EVENT,e,r)}),t.watch(()=>n.autoplay,e=>{e?d():h()}),t.watch(()=>n.loop,()=>{i(l.value)}),t.watch(()=>n.interval,()=>{q()});const S=t.shallowRef();return t.onMounted(()=>{t.watch(()=>u.value,()=>{u.value.length>0&&i(n.initialIndex)},{immediate:!0}),S.value=te.useResizeObserver(f.value,()=>{g()}),d()}),t.onBeforeUnmount(()=>{h(),f.value&&S.value&&S.value.stop()}),t.provide(E.carouselContextKey,{root:f,isCardType:I,isVertical:v,items:u,loop:n.loop,cardScale:n.cardScale,addItem:N,removeItem:O,setActiveItem:i,setContainerHeight:Q}),{root:f,activeIndex:l,arrowDisplay:_,hasLabel:R,hover:m,isCardType:I,items:u,isVertical:v,containerStyle:P,isItemsTwoLength:c,handleButtonEnter:F,handleButtonLeave:G,handleIndicatorClick:K,handleMouseEnter:j,handleMouseLeave:D,setActiveItem:i,prev:$,next:J,PlaceholderItem:X,isTwoLengthShow:U,ItemsSorter:L,throttledArrowClick:z,throttledIndicatorHover:B}};exports.useCarousel=oe;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const vue = require("vue");
+const lodashEs = require("lodash-es");
+const core = require("@vueuse/core");
+const utils = require("@vft/utils");
+const error = require("../../utils/error.cjs");
+require("../config-provider/hooks/use-global-config.cjs");
+const event = require("../../constants/event.cjs");
+const vnode = require("../../utils/vue/vnode.cjs");
+require("../../hooks/use-model-toggle/index.cjs");
+const index = require("../../hooks/use-ordered-children/index.cjs");
+require("@popperjs/core");
+require("../../hooks/use-z-index/index.cjs");
+const constants = require("./constants.cjs");
+const THROTTLE_TIME = 300;
+const useCarousel = (props, emit, componentName) => {
+  const {
+    children: items,
+    addChild: addItem,
+    removeChild: removeItem,
+    ChildrenSorter: ItemsSorter
+  } = index.useOrderedChildren(
+    vue.getCurrentInstance(),
+    constants.CAROUSEL_ITEM_NAME
+  );
+  const slots = vue.useSlots();
+  const activeIndex = vue.ref(-1);
+  const timer = vue.ref(null);
+  const hover = vue.ref(false);
+  const root = vue.ref();
+  const containerHeight = vue.ref(0);
+  const isItemsTwoLength = vue.ref(true);
+  const arrowDisplay = vue.computed(
+    () => props.arrow !== "never" && !vue.unref(isVertical)
+  );
+  const hasLabel = vue.computed(() => {
+    return items.value.some(
+      (item) => item.props.label && item.props.label?.toString().length > 0
+    );
+  });
+  const isCardType = vue.computed(() => props.type === "card");
+  const isVertical = vue.computed(() => props.direction === "vertical");
+  const containerStyle = vue.computed(() => {
+    if (props.height !== "auto") {
+      return {
+        height: props.height
+      };
+    }
+    return {
+      height: `${containerHeight.value}px`,
+      overflow: "hidden"
+    };
+  });
+  const throttledArrowClick = lodashEs.throttle(
+    (index2) => {
+      setActiveItem(index2);
+    },
+    THROTTLE_TIME,
+    { trailing: true }
+  );
+  const throttledIndicatorHover = lodashEs.throttle((index2) => {
+    handleIndicatorHover(index2);
+  }, THROTTLE_TIME);
+  const isTwoLengthShow = (index2) => {
+    if (!isItemsTwoLength.value) return true;
+    return activeIndex.value <= 1 ? index2 <= 1 : index2 > 1;
+  };
+  function pauseTimer() {
+    if (timer.value) {
+      clearInterval(timer.value);
+      timer.value = null;
+    }
+  }
+  function startTimer() {
+    if (props.interval <= 0 || !props.autoplay || timer.value) return;
+    timer.value = setInterval(() => playSlides(), props.interval);
+  }
+  const playSlides = () => {
+    if (activeIndex.value < items.value.length - 1) {
+      activeIndex.value = activeIndex.value + 1;
+    } else if (props.loop) {
+      activeIndex.value = 0;
+    }
+  };
+  function setActiveItem(index2) {
+    if (utils.isString(index2)) {
+      const filteredItems = items.value.filter(
+        (item) => item.props.name === index2
+      );
+      if (filteredItems.length > 0) {
+        index2 = items.value.indexOf(filteredItems[0]);
+      }
+    }
+    index2 = Number(index2);
+    if (Number.isNaN(index2) || index2 !== Math.floor(index2)) {
+      error.debugWarn(componentName, "index must be integer.");
+      return;
+    }
+    const itemCount = items.value.length;
+    const oldIndex = activeIndex.value;
+    if (index2 < 0) {
+      activeIndex.value = props.loop ? itemCount - 1 : 0;
+    } else if (index2 >= itemCount) {
+      activeIndex.value = props.loop ? 0 : itemCount - 1;
+    } else {
+      activeIndex.value = index2;
+    }
+    if (oldIndex === activeIndex.value) {
+      resetItemPosition(oldIndex);
+    }
+    resetTimer();
+  }
+  function resetItemPosition(oldIndex) {
+    items.value.forEach((item, index2) => {
+      item.translateItem(index2, activeIndex.value, oldIndex);
+    });
+  }
+  function itemInStage(item, index2) {
+    const _items = vue.unref(items);
+    const itemCount = _items.length;
+    if (itemCount === 0 || !item.states.inStage) return false;
+    const nextItemIndex = index2 + 1;
+    const prevItemIndex = index2 - 1;
+    const lastItemIndex = itemCount - 1;
+    const isLastItemActive = _items[lastItemIndex].states.active;
+    const isFirstItemActive = _items[0].states.active;
+    const isNextItemActive = _items[nextItemIndex]?.states?.active;
+    const isPrevItemActive = _items[prevItemIndex]?.states?.active;
+    if (index2 === lastItemIndex && isFirstItemActive || isNextItemActive) {
+      return "left";
+    } else if (index2 === 0 && isLastItemActive || isPrevItemActive) {
+      return "right";
+    }
+    return false;
+  }
+  function handleMouseEnter() {
+    hover.value = true;
+    if (props.pauseOnHover) {
+      pauseTimer();
+    }
+  }
+  function handleMouseLeave() {
+    hover.value = false;
+    startTimer();
+  }
+  function handleButtonEnter(arrow) {
+    if (vue.unref(isVertical)) return;
+    items.value.forEach((item, index2) => {
+      if (arrow === itemInStage(item, index2)) {
+        item.states.hover = true;
+      }
+    });
+  }
+  function handleButtonLeave() {
+    if (vue.unref(isVertical)) return;
+    items.value.forEach((item) => {
+      item.states.hover = false;
+    });
+  }
+  function handleIndicatorClick(index2) {
+    activeIndex.value = index2;
+  }
+  function handleIndicatorHover(index2) {
+    if (props.trigger === "hover" && index2 !== activeIndex.value) {
+      activeIndex.value = index2;
+    }
+  }
+  function prev() {
+    setActiveItem(activeIndex.value - 1);
+  }
+  function next() {
+    setActiveItem(activeIndex.value + 1);
+  }
+  function resetTimer() {
+    pauseTimer();
+    if (!props.pauseOnHover) startTimer();
+  }
+  function setContainerHeight(height) {
+    if (props.height !== "auto") return;
+    containerHeight.value = height;
+  }
+  function PlaceholderItem() {
+    const defaultSlots = slots.default?.();
+    if (!defaultSlots) return null;
+    const flatSlots = vnode.flattedChildren(defaultSlots);
+    const normalizeSlots = flatSlots.filter((slot) => {
+      return vue.isVNode(slot) && slot.type.name === constants.CAROUSEL_ITEM_NAME;
+    });
+    if (normalizeSlots?.length === 2 && props.loop && !isCardType.value) {
+      isItemsTwoLength.value = true;
+      return normalizeSlots;
+    }
+    isItemsTwoLength.value = false;
+    return null;
+  }
+  vue.watch(
+    () => activeIndex.value,
+    (current, prev2) => {
+      resetItemPosition(prev2);
+      if (isItemsTwoLength.value) {
+        current = current % 2;
+        prev2 = prev2 % 2;
+      }
+      if (prev2 > -1) {
+        emit(event.CHANGE_EVENT, current, prev2);
+      }
+    }
+  );
+  vue.watch(
+    () => props.autoplay,
+    (autoplay) => {
+      autoplay ? startTimer() : pauseTimer();
+    }
+  );
+  vue.watch(
+    () => props.loop,
+    () => {
+      setActiveItem(activeIndex.value);
+    }
+  );
+  vue.watch(
+    () => props.interval,
+    () => {
+      resetTimer();
+    }
+  );
+  const resizeObserver = vue.shallowRef();
+  vue.onMounted(() => {
+    vue.watch(
+      () => items.value,
+      () => {
+        if (items.value.length > 0) setActiveItem(props.initialIndex);
+      },
+      {
+        immediate: true
+      }
+    );
+    resizeObserver.value = core.useResizeObserver(root.value, () => {
+      resetItemPosition();
+    });
+    startTimer();
+  });
+  vue.onBeforeUnmount(() => {
+    pauseTimer();
+    if (root.value && resizeObserver.value) resizeObserver.value.stop();
+  });
+  vue.provide(constants.carouselContextKey, {
+    root,
+    isCardType,
+    isVertical,
+    items,
+    loop: props.loop,
+    cardScale: props.cardScale,
+    addItem,
+    removeItem,
+    setActiveItem,
+    setContainerHeight
+  });
+  return {
+    root,
+    activeIndex,
+    arrowDisplay,
+    hasLabel,
+    hover,
+    isCardType,
+    items,
+    isVertical,
+    containerStyle,
+    isItemsTwoLength,
+    handleButtonEnter,
+    handleButtonLeave,
+    handleIndicatorClick,
+    handleMouseEnter,
+    handleMouseLeave,
+    setActiveItem,
+    prev,
+    next,
+    PlaceholderItem,
+    isTwoLengthShow,
+    ItemsSorter,
+    throttledArrowClick,
+    throttledIndicatorHover
+  };
+};
+exports.useCarousel = useCarousel;

package/lib/components/carousel-item/style/css.cjs

@@ -1 +1,3 @@
-"use strict";require("vft/theme-style/base.css");require("vft/theme-style/vft-carousel-item.css");
+"use strict";
+require("vft/theme-style/base.css");
+require("vft/theme-style/vft-carousel-item.css");

package/lib/components/carousel-item/style/index.cjs

@@ -1 +1,3 @@
-"use strict";require("vft/theme-style/src/base.scss");require("vft/theme-style/src/carousel-item.scss");
+"use strict";
+require("vft/theme-style/src/base.scss");
+require("vft/theme-style/src/carousel-item.scss");

package/lib/components/cascader/cascader.cjs

@@ -1 +1,194 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("@popperjs/core");require("../cascader-panel/index.cjs");require("@vueuse/core");const n=require("@vft/utils");require("../config-provider/hooks/use-global-config.cjs");const o=require("../../constants/event.cjs"),i=require("../../constants/size.cjs");require("vue");const t=require("../../utils/vue/props/runtime.cjs"),s=require("../../hooks/use-empty-values/index.cjs"),u=require("../cascader-panel/config.cjs"),p=t.buildProps({...u.CommonProps,size:{type:String,values:i.componentSizes,required:!1},placeholder:String,disabled:Boolean,clearable:Boolean,filterable:Boolean,filterMethod:{type:t.definePropType(Function),default:(e,a)=>e.text.includes(a)},separator:{type:String,default:" / "},showAllLevels:{type:Boolean,default:!0},collapseTags:Boolean,maxCollapseTags:{type:Number,default:1},collapseTagsTooltip:Boolean,maxCollapseTagsTooltipHeight:{type:[String,Number]},debounce:{type:Number,default:300},beforeFilter:{type:t.definePropType(Function),default:()=>!0},placement:{type:t.definePropType(String),values:l.placements,default:"bottom-start"},fallbackPlacements:{type:t.definePropType(Array),default:["bottom-start","bottom","top-start","top","right","left"]},popperClass:{type:String,default:""},teleported:{type:Boolean,default:!0},effect:{type:String,default:"light"},tagType:{type:String,default:"info"},tagEffect:{type:String,default:"light"},validateEvent:{type:Boolean,default:!0},persistent:{type:Boolean,default:!0},showCheckedStrategy:{type:String,values:["parent","child"],default:"child"},checkOnClickNode:Boolean,showPrefix:{type:Boolean,default:!0},...s.useEmptyValuesProps}),r=e=>!0,c={[o.UPDATE_MODEL_EVENT]:r,[o.CHANGE_EVENT]:r,focus:e=>e instanceof FocusEvent,blur:e=>e instanceof FocusEvent,clear:()=>!0,visibleChange:e=>n.isBoolean(e),expandChange:e=>!!e,removeTag:e=>!!e};exports.cascaderEmits=c;exports.cascaderProps=p;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const core = require("@popperjs/core");
+require("../cascader-panel/index.cjs");
+require("@vueuse/core");
+const utils = require("@vft/utils");
+require("../config-provider/hooks/use-global-config.cjs");
+const event = require("../../constants/event.cjs");
+const size = require("../../constants/size.cjs");
+require("vue");
+const runtime = require("../../utils/vue/props/runtime.cjs");
+const index = require("../../hooks/use-empty-values/index.cjs");
+const config = require("../cascader-panel/config.cjs");
+const cascaderProps = runtime.buildProps({
+  ...config.CommonProps,
+  /**
+   * @description size of input
+   */
+  size: {
+    type: String,
+    values: size.componentSizes,
+    required: false
+  },
+  /**
+   * @description placeholder of input
+   */
+  placeholder: String,
+  /**
+   * @description whether Cascader is disabled
+   */
+  disabled: Boolean,
+  /**
+   * @description whether selected value can be cleared
+   */
+  clearable: Boolean,
+  /**
+   * @description whether the options can be searched
+   */
+  filterable: Boolean,
+  /**
+   * @description customize search logic, the first parameter is `node`, the second is `keyword`, and need return a boolean value indicating whether it hits.
+   */
+  filterMethod: {
+    type: runtime.definePropType(
+      Function
+    ),
+    default: (node, keyword) => node.text.includes(keyword)
+  },
+  /**
+   * @description option label separator
+   */
+  separator: {
+    type: String,
+    default: " / "
+  },
+  /**
+   * @description whether to display all levels of the selected value in the input
+   */
+  showAllLevels: {
+    type: Boolean,
+    default: true
+  },
+  /**
+   * @description whether to collapse tags in multiple selection mode
+   */
+  collapseTags: Boolean,
+  /**
+   * @description The max tags number to be shown. To use this, collapse-tags must be true
+   */
+  maxCollapseTags: {
+    type: Number,
+    default: 1
+  },
+  /**
+   * @description native input id
+   */
+  collapseTagsTooltip: Boolean,
+  /**
+   * @description The max height of collapse tags tooltip, in pixels. To use this, collapse-tags-tooltip must be true
+   */
+  maxCollapseTagsTooltipHeight: {
+    type: [String, Number]
+  },
+  /**
+   * @description debounce delay when typing filter keyword, in milliseconds
+   */
+  debounce: {
+    type: Number,
+    default: 300
+  },
+  /**
+   * @description hook function before filtering with the value to be filtered as its parameter. If `false` is returned or a `Promise` is returned and then is rejected, filtering will be aborted
+   */
+  beforeFilter: {
+    type: runtime.definePropType(Function),
+    default: () => true
+  },
+  /**
+   * @description position of dropdown
+   */
+  placement: {
+    type: runtime.definePropType(String),
+    values: core.placements,
+    default: "bottom-start"
+  },
+  /**
+   * @description list of possible positions for dropdown
+   */
+  fallbackPlacements: {
+    type: runtime.definePropType(Array),
+    default: ["bottom-start", "bottom", "top-start", "top", "right", "left"]
+  },
+  /**
+   * @description custom class name for Cascader's dropdown
+   */
+  popperClass: {
+    type: String,
+    default: ""
+  },
+  /**
+   * @description whether cascader popup is teleported
+   */
+  teleported: {
+    type: Boolean,
+    default: true
+  },
+  /**
+   * @description tooltip theme, built-in theme: `dark` / `light`
+   */
+  effect: {
+    type: String,
+    default: "light"
+  },
+  /**
+   * @description tag type
+   */
+  // eslint-disable-next-line vue/require-prop-types
+  tagType: { type: String, default: "info" },
+  /**
+   * @description tag effect
+   */
+  tagEffect: {
+    type: String,
+    default: "light"
+  },
+  /**
+   * @description whether to trigger form validation
+   */
+  validateEvent: {
+    type: Boolean,
+    default: true
+  },
+  /**
+   * @description when dropdown is inactive and `persistent` is `false`, dropdown will be destroyed
+   */
+  persistent: {
+    type: Boolean,
+    default: true
+  },
+  /**
+   * @description Use `parent` when you want things tidy (like "Entire Collection" instead of listing 100 items)
+   * Use `child` when every single item matters (like important settings)
+   */
+  showCheckedStrategy: {
+    type: String,
+    values: ["parent", "child"],
+    default: "child"
+  },
+  /**
+   * @description whether to check or uncheck node when clicking on the node
+   */
+  checkOnClickNode: Boolean,
+  /**
+   * @description whether to show the radio or checkbox prefix
+   */
+  showPrefix: {
+    type: Boolean,
+    default: true
+  },
+  ...index.useEmptyValuesProps
+});
+const emitChangeFn = (value) => true;
+const cascaderEmits = {
+  [event.UPDATE_MODEL_EVENT]: emitChangeFn,
+  [event.CHANGE_EVENT]: emitChangeFn,
+  focus: (evt) => evt instanceof FocusEvent,
+  blur: (evt) => evt instanceof FocusEvent,
+  clear: () => true,
+  visibleChange: (val) => utils.isBoolean(val),
+  expandChange: (val) => !!val,
+  removeTag: (val) => !!val
+};
+exports.cascaderEmits = cascaderEmits;
+exports.cascaderProps = cascaderProps;

package/lib/components/cascader/cascader.vue.cjs

@@ -1 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./cascader.vue2.cjs");exports.default=e.default;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const cascader_vue_vue_type_script_setup_true_lang = require("./cascader.vue2.cjs");
+exports.default = cascader_vue_vue_type_script_setup_true_lang.default;