@varlet/ui 2.20.1 → 2.20.2

package/es/image-preview/ImagePreview.mjs

@@ -0,0 +1,348 @@
+import VarSwipe from "../swipe/index.mjs";
+import VarSwipeItem from "../swipe-item/index.mjs";
+import VarIcon from "../icon/index.mjs";
+import VarPopup from "../popup/index.mjs";
+import { defineComponent, ref, computed, watch } from "vue";
+import { toNumber, clamp, preventDefault, call } from "@varlet/shared";
+import { useEventListener, useTouch } from "@varlet/use";
+import { props } from "./props.mjs";
+import { createNamespace } from "../utils/components.mjs";
+const { name, n, classes } = createNamespace("image-preview");
+const DISTANCE_OFFSET = 12;
+const EVENT_DELAY = 200;
+const TAP_DELAY = 350;
+const ANIMATION_DURATION = 200;
+const LONG_PRESS_DELAY = 500;
+const BASE_RATIO = 1;
+import { renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, normalizeStyle as _normalizeStyle, resolveComponent as _resolveComponent, withCtx as _withCtx, createBlock as _createBlock, renderSlot as _renderSlot, toDisplayString as _toDisplayString, createCommentVNode as _createCommentVNode, mergeProps as _mergeProps, createVNode as _createVNode, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
+const _withScopeId = (n2) => (_pushScopeId(""), n2 = n2(), _popScopeId(), n2);
+const _hoisted_1 = ["onTouchstart"];
+const _hoisted_2 = ["src", "alt"];
+function __render__(_ctx, _cache) {
+  const _component_var_swipe_item = _resolveComponent("var-swipe-item");
+  const _component_var_swipe = _resolveComponent("var-swipe");
+  const _component_var_icon = _resolveComponent("var-icon");
+  const _component_var_popup = _resolveComponent("var-popup");
+  return _openBlock(), _createBlock(_component_var_popup, {
+    class: _normalizeClass(_ctx.n("popup")),
+    "var-image-preview-cover": "",
+    transition: _ctx.n("$-fade"),
+    show: _ctx.popupShow,
+    overlay: false,
+    "close-on-click-overlay": false,
+    "lock-scroll": _ctx.lockScroll,
+    teleport: _ctx.teleport,
+    onOpen: _ctx.onOpen,
+    onClose: _ctx.onClose,
+    onClosed: _ctx.onClosed,
+    onOpened: _ctx.onOpened,
+    onRouteChange: _ctx.onRouteChange
+  }, {
+    default: _withCtx(() => [
+      _createVNode(_component_var_swipe, _mergeProps({
+        ref: "swipeRef",
+        class: _ctx.n("swipe"),
+        "var-image-preview-cover": "",
+        touchable: _ctx.canSwipe,
+        indicator: _ctx.indicator && _ctx.images.length > 1,
+        "initial-index": _ctx.initialIndex,
+        loop: _ctx.loop,
+        onChange: _ctx.onChange
+      }, _ctx.$attrs), {
+        default: _withCtx(() => [
+          (_openBlock(true), _createElementBlock(
+            _Fragment,
+            null,
+            _renderList(_ctx.images, (image, idx) => {
+              return _openBlock(), _createBlock(_component_var_swipe_item, {
+                class: _normalizeClass(_ctx.n("swipe-item")),
+                "var-image-preview-cover": "",
+                key: image
+              }, {
+                default: _withCtx(() => [
+                  _createElementVNode("div", {
+                    class: _normalizeClass(_ctx.n("zoom-container")),
+                    style: _normalizeStyle({
+                      transform: `scale(${_ctx.scale}) translate(${_ctx.translateX}px, ${_ctx.translateY}px)`,
+                      transitionTimingFunction: _ctx.transitionTimingFunction,
+                      transitionDuration: _ctx.transitionDuration
+                    }),
+                    onTouchstart: ($event) => _ctx.handleTouchstart($event, idx),
+                    onTouchmove: _cache[0] || (_cache[0] = (...args) => _ctx.handleTouchmove && _ctx.handleTouchmove(...args)),
+                    onTouchend: _cache[1] || (_cache[1] = (...args) => _ctx.handleTouchend && _ctx.handleTouchend(...args)),
+                    onTouchcancel: _cache[2] || (_cache[2] = (...args) => _ctx.handleTouchcancel && _ctx.handleTouchcancel(...args))
+                  }, [
+                    _createElementVNode("img", {
+                      class: _normalizeClass(_ctx.classes(_ctx.n("image"), [_ctx.isPreventDefault, _ctx.n("--prevent")])),
+                      src: image,
+                      alt: image
+                    }, null, 10, _hoisted_2)
+                  ], 46, _hoisted_1)
+                ]),
+                _: 2
+                /* DYNAMIC */
+              }, 1032, ["class"]);
+            }),
+            128
+            /* KEYED_FRAGMENT */
+          ))
+        ]),
+        indicator: _withCtx(({ index, length }) => [
+          _renderSlot(_ctx.$slots, "indicator", {
+            index,
+            length
+          }, () => [
+            _ctx.indicator && _ctx.images.length > 1 ? (_openBlock(), _createElementBlock(
+              "div",
+              {
+                key: 0,
+                class: _normalizeClass(_ctx.n("indicators"))
+              },
+              _toDisplayString(index + 1) + " / " + _toDisplayString(length),
+              3
+              /* TEXT, CLASS */
+            )) : _createCommentVNode("v-if", true)
+          ])
+        ]),
+        _: 3
+        /* FORWARDED */
+      }, 16, ["class", "touchable", "indicator", "initial-index", "loop", "onChange"]),
+      _renderSlot(_ctx.$slots, "close-icon", {}, () => [
+        _ctx.closeable ? (_openBlock(), _createBlock(_component_var_icon, {
+          key: 0,
+          class: _normalizeClass(_ctx.n("close-icon")),
+          name: "close-circle",
+          "var-image-preview-cover": "",
+          onClick: _ctx.close
+        }, null, 8, ["class", "onClick"])) : _createCommentVNode("v-if", true)
+      ]),
+      _createElementVNode(
+        "div",
+        {
+          class: _normalizeClass(_ctx.n("extra"))
+        },
+        [
+          _renderSlot(_ctx.$slots, "extra")
+        ],
+        2
+        /* CLASS */
+      )
+    ]),
+    _: 3
+    /* FORWARDED */
+  }, 8, ["class", "transition", "show", "lock-scroll", "teleport", "onOpen", "onClose", "onClosed", "onOpened", "onRouteChange"]);
+}
+const __sfc__ = defineComponent({
+  name,
+  components: {
+    VarSwipe,
+    VarSwipeItem,
+    VarPopup,
+    VarIcon
+  },
+  inheritAttrs: false,
+  props,
+  setup(props2) {
+    const popupShow = ref(false);
+    const scale = ref(1);
+    const translateX = ref(0);
+    const translateY = ref(0);
+    const transitionTimingFunction = ref();
+    const transitionDuration = ref();
+    const canSwipe = ref(true);
+    const swipeRef = ref(null);
+    const { moveX, moveY, distance, startTime, startTouch, moveTouch, endTouch } = useTouch();
+    const initialIndex = computed(() => {
+      const { images, current, initialIndex: initialIndex2 } = props2;
+      if (initialIndex2 != null) {
+        return toNumber(initialIndex2);
+      }
+      const index = images.findIndex((image) => image === current);
+      return Math.max(index, 0);
+    });
+    const isPreventDefault = computed(() => {
+      const { imagePreventDefault, show } = props2;
+      return show && imagePreventDefault;
+    });
+    let closeRunner = null;
+    let longPressRunner = null;
+    let isLongPress = false;
+    const targets = {
+      start: null,
+      prev: null
+    };
+    useEventListener(() => document, "contextmenu", preventImageDefault);
+    watch(
+      () => props2.show,
+      (newShow) => {
+        popupShow.value = newShow;
+      },
+      { immediate: true }
+    );
+    function zoomIn(ratio) {
+      scale.value = toNumber(ratio);
+      canSwipe.value = false;
+      targets.prev = null;
+      window.setTimeout(() => {
+        transitionTimingFunction.value = "linear";
+        transitionDuration.value = "0s";
+      }, ANIMATION_DURATION);
+    }
+    function zoomOut() {
+      scale.value = 1;
+      translateX.value = 0;
+      translateY.value = 0;
+      canSwipe.value = true;
+      targets.prev = null;
+      transitionTimingFunction.value = void 0;
+      transitionDuration.value = void 0;
+    }
+    function isDoubleTouch(target) {
+      if (!targets.prev) {
+        return false;
+      }
+      return distance.value <= DISTANCE_OFFSET && performance.now() - startTime.value <= EVENT_DELAY && targets.prev === target;
+    }
+    function isTapTouch(target) {
+      if (!target || !targets.start || !targets.prev) {
+        return false;
+      }
+      return distance.value <= DISTANCE_OFFSET && performance.now() - startTime.value < TAP_DELAY && (target === targets.start || target.parentNode === targets.start);
+    }
+    function handleTouchcancel() {
+      endTouch();
+      window.clearTimeout(longPressRunner);
+      isLongPress = false;
+      targets.start = null;
+    }
+    function handleTouchend(event) {
+      endTouch();
+      window.clearTimeout(longPressRunner);
+      if (isLongPress) {
+        isLongPress = false;
+        return;
+      }
+      const isTap = isTapTouch(event.target);
+      closeRunner = window.setTimeout(() => {
+        isTap && close();
+        targets.start = null;
+      }, EVENT_DELAY);
+    }
+    function handleTouchstart(event, idx) {
+      window.clearTimeout(closeRunner);
+      window.clearTimeout(longPressRunner);
+      const target = event.currentTarget;
+      targets.start = target;
+      longPressRunner = window.setTimeout(() => {
+        isLongPress = true;
+        call(props2.onLongPress, idx);
+      }, LONG_PRESS_DELAY);
+      if (isDoubleTouch(target)) {
+        scale.value > BASE_RATIO ? zoomOut() : zoomIn(props2.zoom);
+        return;
+      }
+      startTouch(event);
+      targets.prev = target;
+    }
+    function getZoom(target) {
+      const { offsetWidth, offsetHeight } = target;
+      const { naturalWidth, naturalHeight } = target.querySelector(`.${n("image")}`);
+      return {
+        width: offsetWidth,
+        height: offsetHeight,
+        imageRadio: naturalHeight / naturalWidth,
+        rootRadio: offsetHeight / offsetWidth,
+        zoom: toNumber(props2.zoom)
+      };
+    }
+    function getLimitX(target) {
+      const { zoom: zoom2, imageRadio, rootRadio, width, height } = getZoom(target);
+      if (!imageRadio) {
+        return 0;
+      }
+      const displayWidth = imageRadio > rootRadio ? height / imageRadio : width;
+      return Math.max(0, (zoom2 * displayWidth - width) / 2) / zoom2;
+    }
+    function getLimitY(target) {
+      const { zoom: zoom2, imageRadio, rootRadio, width, height } = getZoom(target);
+      if (!imageRadio) {
+        return 0;
+      }
+      const displayHeight = imageRadio > rootRadio ? height : width * imageRadio;
+      return Math.max(0, (zoom2 * displayHeight - height) / 2) / zoom2;
+    }
+    function handleTouchmove(event) {
+      if (!targets.prev) {
+        return;
+      }
+      moveTouch(event);
+      const target = event.currentTarget;
+      if (distance.value > DISTANCE_OFFSET) {
+        window.clearTimeout(longPressRunner);
+      }
+      if (scale.value > BASE_RATIO) {
+        const limitX = getLimitX(target);
+        const limitY = getLimitY(target);
+        translateX.value = clamp(translateX.value + moveX.value, -limitX, limitX);
+        translateY.value = clamp(translateY.value + moveY.value, -limitY, limitY);
+      }
+      targets.prev = target;
+    }
+    function close() {
+      if (scale.value > BASE_RATIO) {
+        zoomOut();
+        setTimeout(() => call(props2["onUpdate:show"], false), ANIMATION_DURATION);
+        return;
+      }
+      call(props2["onUpdate:show"], false);
+    }
+    function preventImageDefault(event) {
+      if (isPreventDefault.value) {
+        preventDefault(event);
+      }
+    }
+    function prev(options) {
+      var _a;
+      (_a = swipeRef.value) == null ? void 0 : _a.prev(options);
+    }
+    function next(options) {
+      var _a;
+      (_a = swipeRef.value) == null ? void 0 : _a.next(options);
+    }
+    function to(idx, options) {
+      var _a;
+      (_a = swipeRef.value) == null ? void 0 : _a.to(idx, options);
+    }
+    function zoom(ratio) {
+      ratio <= BASE_RATIO ? zoomOut() : zoomIn(ratio);
+    }
+    return {
+      swipeRef,
+      isPreventDefault,
+      initialIndex,
+      popupShow,
+      scale,
+      translateX,
+      translateY,
+      canSwipe,
+      transitionTimingFunction,
+      transitionDuration,
+      n,
+      classes,
+      handleTouchstart,
+      handleTouchmove,
+      handleTouchend,
+      handleTouchcancel,
+      close,
+      prev,
+      next,
+      to,
+      zoom
+    };
+  }
+});
+__sfc__.render = __render__;
+var stdin_default = __sfc__;
+export {
+  stdin_default as default
+};

package/es/image-preview/imagePreview.css

@@ -0,0 +1 @@
+:root { --image-preview-swipe-indicators-text-color: #ddd; --image-preview-swipe-indicators-padding: 16px 0; --image-preview-zoom-container-background: #000; --image-preview-close-icon-top: 14px; --image-preview-close-icon-right: 14px; --image-preview-extra-top: 14px; --image-preview-extra-left: 14px; --image-preview-close-icon-size: 22px; --image-preview-close-icon-color: #fff;}.var-image-preview__popup[var-image-preview-cover] { height: 100%; background: var(--image-preview-zoom-container-background);}.var-image-preview__swipe[var-image-preview-cover] { width: 100vw; height: 100%;}.var-image-preview__swipe-item[var-image-preview-cover] { overflow: hidden;}.var-image-preview__close-icon[var-image-preview-cover] { position: absolute; top: var(--image-preview-close-icon-top); right: var(--image-preview-close-icon-right); color: var(--image-preview-close-icon-color); font-size: var(--image-preview-close-icon-size);}.var-image-preview__extra { position: absolute; top: var(--image-preview-extra-top); left: var(--image-preview-extra-left);}.var-image-preview__indicators { position: absolute; top: 0; width: 100%; padding: var(--image-preview-swipe-indicators-padding); color: var(--image-preview-swipe-indicators-text-color); text-align: center;}.var-image-preview__image { width: 100%; height: 100%; object-fit: contain; -webkit-user-drag: none;}.var-image-preview--prevent { -webkit-touch-callout: none; pointer-events: none;}.var-image-preview__zoom-container { display: flex; justify-content: center; align-items: center; width: 100vw; height: 100%; transition: transform 0.2s;}

package/es/image-preview/index.mjs

@@ -0,0 +1,87 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import VarImagePreview from "./ImagePreview.mjs";
+import { nextTick, reactive } from "vue";
+import { inBrowser, isArray, isString, call } from "@varlet/shared";
+import { mountInstance, withInstall, withPropsDefaultsSetter } from "../utils/components.mjs";
+import { props as imagePreviewProps } from "./props.mjs";
+let singletonOptions;
+let defaultOptions = {};
+function normalizeOptions(options = {}) {
+  if (isString(options)) {
+    return __spreadProps(__spreadValues({}, defaultOptions), { images: [options] });
+  }
+  if (isArray(options)) {
+    return __spreadProps(__spreadValues({}, defaultOptions), { images: options });
+  }
+  return __spreadValues(__spreadValues({}, defaultOptions), options);
+}
+function ImagePreview(options) {
+  if (!inBrowser()) {
+    return;
+  }
+  ImagePreview.close();
+  const imagePreviewOptions = normalizeOptions(options);
+  const reactiveImagePreviewOptions = reactive(imagePreviewOptions);
+  reactiveImagePreviewOptions.teleport = "body";
+  singletonOptions = reactiveImagePreviewOptions;
+  const { unmountInstance } = mountInstance(VarImagePreview, reactiveImagePreviewOptions, {
+    onClose: () => call(reactiveImagePreviewOptions.onClose),
+    onClosed: () => {
+      call(reactiveImagePreviewOptions.onClosed);
+      unmountInstance();
+      singletonOptions === reactiveImagePreviewOptions && (singletonOptions = null);
+    },
+    onRouteChange: () => {
+      unmountInstance();
+      singletonOptions === reactiveImagePreviewOptions && (singletonOptions = null);
+    },
+    "onUpdate:show": (value) => {
+      reactiveImagePreviewOptions.show = value;
+    }
+  });
+  reactiveImagePreviewOptions.show = true;
+}
+ImagePreview.close = () => {
+  if (singletonOptions != null) {
+    const prevSingletonOptions = singletonOptions;
+    singletonOptions = null;
+    nextTick().then(() => {
+      prevSingletonOptions.show = false;
+    });
+  }
+};
+ImagePreview.setDefaultOptions = (options) => {
+  defaultOptions = options;
+};
+ImagePreview.resetDefaultOptions = () => {
+  defaultOptions = {};
+};
+ImagePreview.Component = VarImagePreview;
+withInstall(VarImagePreview);
+withInstall(VarImagePreview, ImagePreview);
+withPropsDefaultsSetter(ImagePreview, imagePreviewProps);
+const _ImagePreviewComponent = VarImagePreview;
+var stdin_default = ImagePreview;
+export {
+  _ImagePreviewComponent,
+  stdin_default as default,
+  imagePreviewProps
+};

package/es/image-preview/props.mjs

@@ -0,0 +1,52 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+import { defineListenerProp, pickProps } from "../utils/components.mjs";
+import { swipeProps } from "../swipe/index.mjs";
+import { popupProps } from "../popup/index.mjs";
+const props = __spreadValues(__spreadValues({
+  show: Boolean,
+  imagePreventDefault: Boolean,
+  images: {
+    type: Array,
+    default: () => []
+  },
+  /** @deprecated Use initialIndex to instead. */
+  current: String,
+  initialIndex: {
+    type: [String, Number],
+    default: 0
+  },
+  zoom: {
+    type: [String, Number],
+    default: 2
+  },
+  closeable: Boolean,
+  "onUpdate:show": defineListenerProp(),
+  onLongPress: defineListenerProp()
+}, pickProps(swipeProps, ["loop", "indicator", "onChange"])), pickProps(popupProps, [
+  "lockScroll",
+  "teleport",
+  "onOpen",
+  "onClose",
+  "onOpened",
+  "onClosed",
+  // internal for function call closes the dialog
+  "onRouteChange"
+]));
+export {
+  props
+};

package/es/image-preview/style/index.mjs

@@ -0,0 +1,7 @@
+import '../../styles/common.css'
+import '../../icon/icon.css'
+import '../../swipe/swipe.css'
+import '../../swipe-item/swipeItem.css'
+import '../../popup/popup.css'
+import '../imagePreview.css'
+import '../ImagePreviewSfc.css'

package/es/index-anchor/IndexAnchor.mjs

@@ -0,0 +1,87 @@
+import VarSticky from "../sticky/index.mjs";
+import { computed, defineComponent, ref, Transition } from "vue";
+import { useIndexBar } from "./provide.mjs";
+import { props } from "./props.mjs";
+import { createNamespace } from "../utils/components.mjs";
+const { name, n, classes } = createNamespace("index-anchor");
+import { renderSlot as _renderSlot, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, mergeProps as _mergeProps, createElementVNode as _createElementVNode, resolveDynamicComponent as _resolveDynamicComponent, withCtx as _withCtx, openBlock as _openBlock, createBlock as _createBlock } from "vue";
+function __render__(_ctx, _cache) {
+  return _openBlock(), _createBlock(_resolveDynamicComponent(_ctx.sticky ? _ctx.n("$-sticky") : _ctx.Transition), {
+    "offset-top": _ctx.sticky ? _ctx.stickyOffsetTop : null,
+    "z-index": _ctx.sticky ? _ctx.zIndex : null,
+    disabled: _ctx.disabled && !_ctx.cssMode,
+    "css-mode": _ctx.cssMode,
+    ref: "anchorEl"
+  }, {
+    default: _withCtx(() => [
+      _createElementVNode(
+        "div",
+        _mergeProps({
+          class: _ctx.n()
+        }, _ctx.$attrs),
+        [
+          _renderSlot(_ctx.$slots, "default", {}, () => [
+            _createTextVNode(
+              _toDisplayString(_ctx.name),
+              1
+              /* TEXT */
+            )
+          ])
+        ],
+        16
+        /* FULL_PROPS */
+      )
+    ]),
+    _: 3
+    /* FORWARDED */
+  }, 8, ["offset-top", "z-index", "disabled", "css-mode"]);
+}
+const __sfc__ = defineComponent({
+  name,
+  components: { VarSticky },
+  inheritAttrs: false,
+  props,
+  setup(props2) {
+    const ownTop = ref(0);
+    const disabled = ref(false);
+    const name2 = computed(() => props2.index);
+    const anchorEl = ref(null);
+    const { index, indexBar, bindIndexBar } = useIndexBar();
+    const { active, sticky, cssMode, stickyOffsetTop, zIndex } = indexBar;
+    const indexAnchorProvider = {
+      index,
+      name: name2,
+      ownTop,
+      setOwnTop,
+      setDisabled
+    };
+    bindIndexBar(indexAnchorProvider);
+    function setOwnTop() {
+      if (!anchorEl.value) {
+        return;
+      }
+      ownTop.value = anchorEl.value.$el ? anchorEl.value.$el.offsetTop : anchorEl.value.offsetTop;
+    }
+    function setDisabled(value) {
+      disabled.value = value;
+    }
+    return {
+      n,
+      classes,
+      name: name2,
+      anchorEl,
+      active,
+      sticky,
+      zIndex,
+      disabled,
+      cssMode,
+      stickyOffsetTop,
+      Transition
+    };
+  }
+});
+__sfc__.render = __render__;
+var stdin_default = __sfc__;
+export {
+  stdin_default as default
+};

package/es/index-anchor/IndexAnchorSfc.css

@@ -0,0 +1 @@
+.var-index-anchor { position: relative;}

package/es/index-anchor/index.mjs

@@ -0,0 +1,12 @@
+import IndexAnchor from "./IndexAnchor.mjs";
+import { withInstall, withPropsDefaultsSetter } from "../utils/components.mjs";
+import { props as indexAnchorProps } from "./props.mjs";
+withInstall(IndexAnchor);
+withPropsDefaultsSetter(IndexAnchor, indexAnchorProps);
+const _IndexAnchorComponent = IndexAnchor;
+var stdin_default = IndexAnchor;
+export {
+  _IndexAnchorComponent,
+  stdin_default as default,
+  indexAnchorProps
+};

package/es/index-anchor/props.mjs

@@ -0,0 +1,6 @@
+const props = {
+  index: [Number, String]
+};
+export {
+  props
+};

package/es/index-anchor/provide.mjs

@@ -0,0 +1,19 @@
+import { useParent } from "@varlet/use";
+import { error } from "../utils/logger.mjs";
+import { INDEX_BAR_BIND_INDEX_ANCHOR_KEY } from "../index-bar/provide.mjs";
+function useIndexBar() {
+  const { parentProvider, index, bindParent } = useParent(
+    INDEX_BAR_BIND_INDEX_ANCHOR_KEY
+  );
+  if (!bindParent) {
+    error("IndexAnchor", 'You should use this component in "IndexBar"');
+  }
+  return {
+    index,
+    indexBar: parentProvider,
+    bindIndexBar: bindParent
+  };
+}
+export {
+  useIndexBar
+};

package/es/index-anchor/style/index.mjs

@@ -0,0 +1,3 @@
+import '../../styles/common.css'
+import '../../sticky/sticky.css'
+import '../IndexAnchorSfc.css'