bkui-vue 0.0.2-beta.78.beta.1 → 0.0.2-beta.79

package/lib/image/index.js

@@ -1,641 +1 @@
-import * as __WEBPACK_EXTERNAL_MODULE__shared_65459f0a__ from "../shared";
-import * as __WEBPACK_EXTERNAL_MODULE_vue__ from "vue";
-import * as __WEBPACK_EXTERNAL_MODULE__config_provider_9d0186d9__ from "../config-provider";
-import * as __WEBPACK_EXTERNAL_MODULE__icon_85385c3e__ from "../icon";
-import * as __WEBPACK_EXTERNAL_MODULE_vue_types_22de060a__ from "vue-types";
-import * as __WEBPACK_EXTERNAL_MODULE_lodash_es_87a6bcbc__ from "lodash-es";
-import * as __WEBPACK_EXTERNAL_MODULE__directives_9cc9ba10__ from "../directives";
-/******/ // The require scope
-/******/ var __webpack_require__ = {};
-/******/ 
-/************************************************************************/
-/******/ /* webpack/runtime/define property getters */
-/******/ (() => {
-/******/ 	// define getter functions for harmony exports
-/******/ 	__webpack_require__.d = (exports, definition) => {
-/******/ 		for(var key in definition) {
-/******/ 			if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
-/******/ 				Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
-/******/ 			}
-/******/ 		}
-/******/ 	};
-/******/ })();
-/******/ 
-/******/ /* webpack/runtime/hasOwnProperty shorthand */
-/******/ (() => {
-/******/ 	__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
-/******/ })();
-/******/ 
-/************************************************************************/
-var __webpack_exports__ = {};
-
-// EXPORTS
-__webpack_require__.d(__webpack_exports__, {
-  Ee: () => (/* reexport */ src_image),
-  OO: () => (/* reexport */ image_viewer),
-  ZP: () => (/* binding */ src)
-});
-
-;// CONCATENATED MODULE: external "../shared"
-var x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var y = x => () => x
-const external_shared_namespaceObject = x({ ["PropTypes"]: () => __WEBPACK_EXTERNAL_MODULE__shared_65459f0a__.PropTypes, ["bkZIndexManager"]: () => __WEBPACK_EXTERNAL_MODULE__shared_65459f0a__.bkZIndexManager, ["withInstall"]: () => __WEBPACK_EXTERNAL_MODULE__shared_65459f0a__.withInstall });
-;// CONCATENATED MODULE: external "vue"
-var external_vue_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var external_vue_y = x => () => x
-const external_vue_namespaceObject = external_vue_x({ ["Fragment"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Fragment, ["Teleport"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Teleport, ["Transition"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Transition, ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["createTextVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createTextVNode, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["effectScope"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.effectScope, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref, ["resolveDirective"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.resolveDirective, ["shallowRef"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.shallowRef, ["watch"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watch, ["withDirectives"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.withDirectives });
-;// CONCATENATED MODULE: external "../config-provider"
-var external_config_provider_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var external_config_provider_y = x => () => x
-const external_config_provider_namespaceObject = external_config_provider_x({ ["usePrefix"]: () => __WEBPACK_EXTERNAL_MODULE__config_provider_9d0186d9__.usePrefix });
-;// CONCATENATED MODULE: external "../icon"
-var external_icon_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var external_icon_y = x => () => x
-const external_icon_namespaceObject = external_icon_x({ ["AngleLeft"]: () => __WEBPACK_EXTERNAL_MODULE__icon_85385c3e__.AngleLeft, ["AngleRight"]: () => __WEBPACK_EXTERNAL_MODULE__icon_85385c3e__.AngleRight, ["Close"]: () => __WEBPACK_EXTERNAL_MODULE__icon_85385c3e__.Close, ["Spinner"]: () => __WEBPACK_EXTERNAL_MODULE__icon_85385c3e__.Spinner });
-;// CONCATENATED MODULE: external "vue-types"
-var external_vue_types_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var external_vue_types_y = x => () => x
-const external_vue_types_namespaceObject = external_vue_types_x({ ["toType"]: () => __WEBPACK_EXTERNAL_MODULE_vue_types_22de060a__.toType });
-;// CONCATENATED MODULE: ../../packages/image/src/props.ts
-
-
-var FitEnum;
-(function (FitEnum) {
-  FitEnum["FILL"] = "fill";
-  FitEnum["CONTAIN"] = "contain";
-  FitEnum["COVER"] = "cover";
-  FitEnum["NONE"] = "none";
-  FitEnum["SCALE_DOWN"] = "scale-down";
-})(FitEnum || (FitEnum = {}));
-var propsImage = {
-  src: external_shared_namespaceObject.PropTypes.string.def(''),
-  fallback: external_shared_namespaceObject.PropTypes.string.def(''),
-  placeholder: external_shared_namespaceObject.PropTypes.any,
-  fit: (0,external_vue_types_namespaceObject.toType)('fit', {}).def(FitEnum.FILL),
-  lazy: external_shared_namespaceObject.PropTypes.bool,
-  urlList: external_shared_namespaceObject.PropTypes.array.def([]),
-  isShowPreviewTitle: external_shared_namespaceObject.PropTypes.bool.def(true),
-  maskClose: external_shared_namespaceObject.PropTypes.bool.def(true),
-  zIndex: external_shared_namespaceObject.PropTypes.number.def(2000)
-};
-var propsImageViever = {
-  urlList: {
-    type: Array,
-    "default": function _default() {
-      return [];
-    }
-  },
-  zIndex: external_shared_namespaceObject.PropTypes.number.def(2000),
-  initialIndex: external_shared_namespaceObject.PropTypes.number.def(0),
-  isShowTitle: external_shared_namespaceObject.PropTypes.bool.def(true),
-  loops: external_shared_namespaceObject.PropTypes.bool.def(true),
-  maskClose: external_shared_namespaceObject.PropTypes.bool.def(true)
-};
-;// CONCATENATED MODULE: ../../packages/image/src/image.tsx
-
-/*
- * Tencent is pleased to support the open source community by making
- * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
- *
- * Copyright (C) 2021 THL A29 Limited, a Tencent company.  All rights reserved.
- *
- * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) is licensed under the MIT License.
- *
- * License for 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition):
- *
- * ---------------------------------------------------
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
- * documentation files (the "Software"), to deal in the Software without restriction, including without limitation
- * the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
- * to permit persons to whom the Software is furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial portions of
- * the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO
- * THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF
- * CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
- * IN THE SOFTWARE.
- */
-
-
-
-
-
-/* harmony default export */ const src_image = ((0,external_vue_namespaceObject.defineComponent)({
-  // eslint-disable-next-line vue/no-reserved-component-names
-  name: 'Image',
-  props: propsImage,
-  emits: ['loaded', 'error', 'close', 'change'],
-  setup: function setup(props, _ref) {
-    var emit = _ref.emit,
-      slots = _ref.slots;
-    var loading = (0,external_vue_namespaceObject.ref)(true);
-    var hasError = (0,external_vue_namespaceObject.ref)(true);
-    var isShowViewer = (0,external_vue_namespaceObject.ref)(false);
-    var prevOverflow = (0,external_vue_namespaceObject.ref)('');
-    var imageSrc = (0,external_vue_namespaceObject.ref)('');
-    function clickHandler() {}
-    (0,external_vue_namespaceObject.watch)(function () {
-      return props.src;
-    }, function () {
-      loadImage();
-    });
-    var preview = (0,external_vue_namespaceObject.computed)(function () {
-      var _props$urlList;
-      return (props === null || props === void 0 || (_props$urlList = props.urlList) === null || _props$urlList === void 0 ? void 0 : _props$urlList.length) > 0;
-    });
-    function closeViewer() {
-      document.body.style.overflow = prevOverflow.value;
-      isShowViewer.value = false;
-      emit('close');
-    }
-    function change(val) {
-      emit('change', val);
-    }
-    function loadImage() {
-      loading.value = true;
-      hasError.value = false;
-      imageSrc.value = props.src;
-    }
-    var _usePrefix = (0,external_config_provider_namespaceObject.usePrefix)(),
-      resolveClassName = _usePrefix.resolveClassName;
-    return function () {
-      function getContent() {
-        if (loading.value) {
-          return (0,external_vue_namespaceObject.createVNode)("div", {
-            "class": "".concat(resolveClassName('image-placeholder'))
-          }, [(0,external_vue_namespaceObject.createVNode)(external_icon_namespaceObject.Spinner, null, null)]);
-        }
-        if (hasError.value) {
-          if (slots.error) {
-            if (typeof slots.error === 'function') {
-              return slots.error();
-            }
-            return slots.error;
-          }
-          return (0,external_vue_namespaceObject.createVNode)("div", {
-            "class": "".concat(resolveClassName('image-placeholder'))
-          }, [props.fallback ? (0,external_vue_namespaceObject.createVNode)("img", {
-            "src": props.fallback,
-            "alt": "\u56FE\u7247\u52A0\u8F7D\u9519\u8BEF"
-          }, null) : '', (0,external_vue_namespaceObject.withDirectives)((0,external_vue_namespaceObject.createVNode)("i", {
-            "class": "".concat(resolveClassName('icon'), " icon-image-fail")
-          }, null), [[(0,external_vue_namespaceObject.resolveDirective)("else")]])]);
-        }
-        return (0,external_vue_namespaceObject.createVNode)("img", {
-          "src": props.src,
-          "onClick": clickHandler
-        }, null);
-      }
-      return (0,external_vue_namespaceObject.createVNode)("div", {
-        "class": "".concat(resolveClassName('image'))
-      }, [getContent(), preview.value && isShowViewer.value ? (0,external_vue_namespaceObject.createVNode)(image_viewer, {
-        "zIndex": props.zIndex,
-        "maskClose": props.maskClose,
-        "is-show-title": props.isShowPreviewTitle,
-        "url-list": props.urlList,
-        "onClose": closeViewer,
-        "onChange": change
-      }, null) : '']);
-    };
-  }
-}));
-;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/typeof.js
-function _typeof(obj) {
-  "@babel/helpers - typeof";
-
-  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
-    return typeof obj;
-  } : function (obj) {
-    return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
-  }, _typeof(obj);
-}
-;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/toPrimitive.js
-
-function _toPrimitive(input, hint) {
-  if (_typeof(input) !== "object" || input === null) return input;
-  var prim = input[Symbol.toPrimitive];
-  if (prim !== undefined) {
-    var res = prim.call(input, hint || "default");
-    if (_typeof(res) !== "object") return res;
-    throw new TypeError("@@toPrimitive must return a primitive value.");
-  }
-  return (hint === "string" ? String : Number)(input);
-}
-;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/toPropertyKey.js
-
-
-function _toPropertyKey(arg) {
-  var key = _toPrimitive(arg, "string");
-  return _typeof(key) === "symbol" ? key : String(key);
-}
-;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/defineProperty.js
-
-function _defineProperty(obj, key, value) {
-  key = _toPropertyKey(key);
-  if (key in obj) {
-    Object.defineProperty(obj, key, {
-      value: value,
-      enumerable: true,
-      configurable: true,
-      writable: true
-    });
-  } else {
-    obj[key] = value;
-  }
-  return obj;
-}
-;// CONCATENATED MODULE: external "lodash-es"
-var external_lodash_es_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var external_lodash_es_y = x => () => x
-const external_lodash_es_namespaceObject = external_lodash_es_x({ ["throttle"]: () => __WEBPACK_EXTERNAL_MODULE_lodash_es_87a6bcbc__.throttle });
-;// CONCATENATED MODULE: external "../directives"
-var external_directives_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var external_directives_y = x => () => x
-const external_directives_namespaceObject = external_directives_x({ ["bkTooltips"]: () => __WEBPACK_EXTERNAL_MODULE__directives_9cc9ba10__.bkTooltips });
-;// CONCATENATED MODULE: ../../packages/image/src/image-viewer.tsx
-
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-/*
- * Tencent is pleased to support the open source community by making
- * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
- *
- * Copyright (C) 2021 THL A29 Limited, a Tencent company.  All rights reserved.
- *
- * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) is licensed under the MIT License.
- *
- * License for 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition):
- *
- * ---------------------------------------------------
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
- * documentation files (the "Software"), to deal in the Software without restriction, including without limitation
- * the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
- * to permit persons to whom the Software is furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial portions of
- * the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO
- * THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF
- * CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
- * IN THE SOFTWARE.
- */
-
-
-
-
-
-
-
-/* harmony default export */ const image_viewer = ((0,external_vue_namespaceObject.defineComponent)({
-  name: 'ImageViewer',
-  directives: {
-    bkTooltips: external_directives_namespaceObject.bkTooltips
-  },
-  props: propsImageViever,
-  emits: ['close', 'change'],
-  setup: function setup(props, _ref) {
-    var emit = _ref.emit;
-    var scopeEventListener = (0,external_vue_namespaceObject.effectScope)();
-    // @ts-ignore
-    var wrapper = (0,external_vue_namespaceObject.ref)();
-    var imgRefs = (0,external_vue_namespaceObject.ref)([]);
-    var mode = (0,external_vue_namespaceObject.ref)('');
-    var index = (0,external_vue_namespaceObject.ref)(props.initialIndex);
-    var loading = (0,external_vue_namespaceObject.ref)(false);
-    var error = (0,external_vue_namespaceObject.ref)(false);
-    var transform = (0,external_vue_namespaceObject.shallowRef)({
-      scale: 1,
-      deg: 0,
-      offsetX: 0,
-      offsetY: 0,
-      enableTransition: false
-    });
-    var isSingle = (0,external_vue_namespaceObject.computed)(function () {
-      var _props$urlList;
-      return (props === null || props === void 0 || (_props$urlList = props.urlList) === null || _props$urlList === void 0 ? void 0 : _props$urlList.length) < 2;
-    });
-    var isFirst = (0,external_vue_namespaceObject.computed)(function () {
-      return index.value === 0;
-    });
-    var isLast = (0,external_vue_namespaceObject.computed)(function () {
-      return index.value === props.urlList.length - 1;
-    });
-    var currentImg = (0,external_vue_namespaceObject.computed)(function () {
-      return props.urlList[index.value];
-    });
-    var currentName = (0,external_vue_namespaceObject.computed)(function () {
-      var arr = currentImg.value.split('/');
-      return arr[arr.length - 1];
-    });
-    var imgStyle = (0,external_vue_namespaceObject.computed)(function () {
-      var _transform$value = transform.value,
-        scale = _transform$value.scale,
-        deg = _transform$value.deg,
-        offsetX = _transform$value.offsetX,
-        offsetY = _transform$value.offsetY,
-        enableTransition = _transform$value.enableTransition;
-      var translateX = offsetX / scale;
-      var translateY = offsetY / scale;
-      switch (deg % 360) {
-        case 90:
-        case -270:
-          var _ref2 = [translateY, -translateX];
-          translateX = _ref2[0];
-          translateY = _ref2[1];
-          break;
-        case 180:
-        case -180:
-          var _ref3 = [-translateX, -translateY];
-          translateX = _ref3[0];
-          translateY = _ref3[1];
-          break;
-        case 270:
-        case -90:
-          var _ref4 = [-translateY, translateX];
-          translateX = _ref4[0];
-          translateY = _ref4[1];
-          break;
-      }
-      var style = {
-        transform: "scale(".concat(scale, ") rotate(").concat(deg, "deg) translate(").concat(translateX, "px, ").concat(translateY, "px)"),
-        transition: enableTransition ? 'transform .3s' : ''
-      };
-      if (mode.value === 'contain') {
-        style.maxWidth = '100%';
-        style.maxHeight = '100%';
-      }
-      return style;
-    });
-    var wrapStyles = (0,external_vue_namespaceObject.computed)(function () {
-      var zIndex = 2000;
-      if (props.zIndex) {
-        zIndex = props.zIndex;
-      } else {
-        zIndex += external_shared_namespaceObject.bkZIndexManager.getModalNextIndex() || 1;
-      }
-      return {
-        zIndex: zIndex
-      };
-    });
-    var keydownHandler = (0,external_lodash_es_namespaceObject.throttle)(function (e) {
-      switch (Number(e.code)) {
-        // ESC
-        case 27:
-          hide();
-          break;
-        // SPACE
-        case 32:
-          toggleMode('original');
-          break;
-        // LEFT_ARROW
-        case 37:
-          prev();
-          break;
-        // UP_ARROW
-        case 38:
-          handleActions('zoomIn');
-          break;
-        // RIGHT_ARROW
-        case 39:
-          next();
-          break;
-        // DOWN_ARROW
-        case 40:
-          handleActions('zoomOut');
-          break;
-      }
-    });
-    var mousewheelHandler = (0,external_lodash_es_namespaceObject.throttle)(function (e /* TODO: wheelDelta is deprecated */) {
-      var delta = e.wheelDelta ? e.wheelDelta : -e.detail;
-      if (delta > 0) {
-        handleActions('zoomIn', {
-          zoomRate: 1.2,
-          enableTransition: false
-        });
-      } else {
-        handleActions('zoomOut', {
-          zoomRate: 1.2,
-          enableTransition: false
-        });
-      }
-    });
-    scopeEventListener.run(function () {
-      document.addEventListener('keydown', keydownHandler);
-      document.addEventListener('mousewheel', mousewheelHandler);
-    });
-    function hide() {
-      document.removeEventListener('keydown', keydownHandler);
-      document.removeEventListener('mousewheel', mousewheelHandler);
-      scopeEventListener.stop();
-      emit('close');
-    }
-    function toggleMode(modeNames) {
-      if (loading.value) return;
-      mode.value = modeNames;
-      reset();
-    }
-    function reset() {
-      transform.value = {
-        scale: 1,
-        deg: 0,
-        offsetX: 0,
-        offsetY: 0,
-        enableTransition: false
-      };
-    }
-    function prev() {
-      if (isFirst.value && !props.loops) return;
-      var len = props.urlList.length;
-      index.value = (index.value - 1 + len) % len;
-    }
-    function next() {
-      if (isLast.value && !props.loops) return;
-      var len = props.urlList.length;
-      index.value = (index.value + 1) % len;
-    }
-    function handleActions(action) {
-      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-      if (loading.value) return;
-      var _zoomRate$rotateDeg$e = _objectSpread({
-          zoomRate: 0.2,
-          rotateDeg: 90,
-          enableTransition: true
-        }, options),
-        zoomRate = _zoomRate$rotateDeg$e.zoomRate,
-        rotateDeg = _zoomRate$rotateDeg$e.rotateDeg,
-        enableTransition = _zoomRate$rotateDeg$e.enableTransition;
-      switch (action) {
-        case 'zoomOut':
-          if (transform.value.scale > 0.2) {
-            transform.value.scale = Number.parseFloat((transform.value.scale - zoomRate).toFixed(3));
-          }
-          break;
-        case 'zoomIn':
-          if (transform.value.scale < 7) {
-            transform.value.scale = Number.parseFloat((transform.value.scale + zoomRate).toFixed(3));
-          }
-          break;
-        case 'clockwise':
-          transform.value.deg += rotateDeg;
-          break;
-        case 'anticlockwise':
-          transform.value.deg -= rotateDeg;
-          break;
-      }
-      transform.value.enableTransition = enableTransition;
-    }
-    function handleImgLoad() {
-      error.value = false;
-      loading.value = false;
-    }
-    function handleImgError(e) {
-      error.value = true;
-      loading.value = false;
-      e.target.alt = '加载失败';
-    }
-    function handleMouseDown(e) {
-      if (loading.value || e.button !== 0 || !wrapper.value) return;
-      transform.value.enableTransition = false;
-      var _transform$value2 = transform.value,
-        offsetX = _transform$value2.offsetX,
-        offsetY = _transform$value2.offsetY;
-      var startX = e.pageX;
-      var startY = e.pageY;
-      var mousemove = (0,external_lodash_es_namespaceObject.throttle)(function (ev) {
-        transform.value = _objectSpread(_objectSpread({}, transform.value), {}, {
-          offsetX: offsetX + ev.pageX - startX,
-          offsetY: offsetY + ev.pageY - startY
-        });
-      });
-      var mouseup = function mouseup() {
-        document.removeEventListener('mousemove', mousemove);
-        document.removeEventListener('mouseup', mouseup);
-      };
-      document.addEventListener('mousemove', mousemove);
-      document.addEventListener('mouseup', mouseup);
-      e.preventDefault();
-    }
-    var _usePrefix = (0,external_config_provider_namespaceObject.usePrefix)(),
-      resolveClassName = _usePrefix.resolveClassName;
-    return function () {
-      return (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Teleport, {
-        "to": "body"
-      }, {
-        "default": function _default() {
-          return [(0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Transition, null, {
-            "default": function _default() {
-              return [(0,external_vue_namespaceObject.createVNode)("div", {
-                "tabindex": "-1",
-                "ref": "wrapper",
-                "class": "".concat(resolveClassName('image-viewer-wrapper')),
-                "style": wrapStyles.value
-              }, [(0,external_vue_namespaceObject.createVNode)("div", {
-                "class": "".concat(resolveClassName('image-viewer-mask')),
-                "onClick": function onClick() {
-                  props.maskClose && hide();
-                }
-              }, null), props.isShowTitle && props.urlList.length ? (0,external_vue_namespaceObject.createVNode)("div", {
-                "class": "".concat(resolveClassName('image-viewer-header'))
-              }, [(0,external_vue_namespaceObject.createVNode)("div", null, [currentName]), (0,external_vue_namespaceObject.createVNode)("div", {
-                "class": "tc "
-              }, [index.value + 1, (0,external_vue_namespaceObject.createTextVNode)("/"), props.urlList.length]), (0,external_vue_namespaceObject.createVNode)("div", {
-                "class": "quit-box tr"
-              }, [(0,external_vue_namespaceObject.createVNode)("div", {
-                "class": "quit-tips mr10"
-              }, [(0,external_vue_namespaceObject.createTextVNode)("ESC \u53EF\u4EE5\u9000\u51FA\u5168\u5C4F")]), (0,external_vue_namespaceObject.createVNode)("div", {
-                "class": "".concat(resolveClassName('image-viewer-close')),
-                "onClick": hide
-              }, [(0,external_vue_namespaceObject.createVNode)(external_icon_namespaceObject.Close, null, null)])])]) : '', !isSingle.value ? (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Fragment, null, [(0,external_vue_namespaceObject.createVNode)("div", {
-                "onClick": prev,
-                "class": "".concat(resolveClassName('image-viewer-btn'), " ").concat(resolveClassName('image-viewer-prev'), " ").concat(!props.loops && isFirst ? 'is-disabled' : '')
-              }, [(0,external_vue_namespaceObject.createVNode)(external_icon_namespaceObject.AngleLeft, null, null)]), (0,external_vue_namespaceObject.createVNode)("div", {
-                "onClick": next,
-                "class": "".concat(resolveClassName('image-viewer-btn'), " ").concat(resolveClassName('image-viewer-prev'), " ").concat(!props.loops && isLast ? 'is-disabled' : '')
-              }, [(0,external_vue_namespaceObject.createVNode)(external_icon_namespaceObject.AngleRight, null, null)]), (0,external_vue_namespaceObject.createVNode)("div", {
-                "class": "".concat(resolveClassName('image-viewer-actions-inner'))
-              }, [(0,external_vue_namespaceObject.withDirectives)((0,external_vue_namespaceObject.createVNode)(external_icon_namespaceObject.AngleLeft, {
-                "onClick": function onClick() {
-                  return handleActions('zoomOut');
-                }
-              }, null), [[(0,external_vue_namespaceObject.resolveDirective)("bk-tooltips"), "{content: '\u63D0\u793A\u4FE1\u606F', placement: 'top'}"]]), (0,external_vue_namespaceObject.withDirectives)((0,external_vue_namespaceObject.createVNode)("i", {
-                "class": "",
-                "onClick": function onClick() {
-                  return handleActions('zoomOut');
-                }
-              }, null), [[(0,external_vue_namespaceObject.resolveDirective)("bk-tooltips"), "{content: '\u63D0\u793A\u4FE1\u606F', placement: 'top'}"]]), (0,external_vue_namespaceObject.withDirectives)((0,external_vue_namespaceObject.createVNode)("i", {
-                "class": "".concat(resolveClassName('icon'), " icon-narrow-line"),
-                "onClick": function onClick() {
-                  return handleActions('zoomOut');
-                }
-              }, null), [[(0,external_vue_namespaceObject.resolveDirective)("bk-tooltips"), "{content: '\u63D0\u793A\u4FE1\u606F', placement: 'top'}"]])])]) : '', (0,external_vue_namespaceObject.createVNode)("div", {
-                "class": "".concat(resolveClassName('image-viewer-canvas'), " ").concat(props.isShowTitle ? resolveClassName('image-viewer-has-header') : '')
-              }, [error.value ? (0,external_vue_namespaceObject.createVNode)("div", {
-                "class": "".concat(resolveClassName('image-viewer-error'))
-              }, [(0,external_vue_namespaceObject.createVNode)("div", null, [(0,external_vue_namespaceObject.createVNode)("i", {
-                "class": "".concat(resolveClassName('icon'), " icon-image-fail")
-              }, null)]), (0,external_vue_namespaceObject.createVNode)("div", null, [(0,external_vue_namespaceObject.createTextVNode)("\u62B1\u6B49\uFF0C\u56FE\u7247\u52A0\u8F7D\u5931\u8D25")])]) : props.urlList.map(function (url, i) {
-                if (i === index.value) {
-                  return '';
-                }
-                return (0,external_vue_namespaceObject.createVNode)("img", {
-                  "key": i,
-                  "ref": function ref(el) {
-                    return imgRefs[i] = el;
-                  },
-                  "class": "".concat(resolveClassName('image-viewer-img')),
-                  "style": imgStyle.value,
-                  "src": url,
-                  "onLoad": handleImgLoad,
-                  "onError": handleImgError,
-                  "onMousedown": handleMouseDown
-                }, null);
-              })])])];
-            }
-          })];
-        }
-      });
-    };
-  }
-}));
-;// CONCATENATED MODULE: ../../packages/image/src/index.ts
-/*
- * Tencent is pleased to support the open source community by making
- * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
- *
- * Copyright (C) 2021 THL A29 Limited, a Tencent company.  All rights reserved.
- *
- * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) is licensed under the MIT License.
- *
- * License for 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition):
- *
- * ---------------------------------------------------
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
- * documentation files (the "Software"), to deal in the Software without restriction, including without limitation
- * the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
- * to permit persons to whom the Software is furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial portions of
- * the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO
- * THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF
- * CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
- * IN THE SOFTWARE.
- */
-
-
-
-
-var BkImage = (0,external_shared_namespaceObject.withInstall)(src_image);
-/* harmony default export */ const src = (BkImage);
-var __webpack_exports__Image = __webpack_exports__.Ee;
-var __webpack_exports__ImageViewer = __webpack_exports__.OO;
-var __webpack_exports__default = __webpack_exports__.ZP;
-export { __webpack_exports__Image as Image, __webpack_exports__ImageViewer as ImageViewer, __webpack_exports__default as default };
+import*as e from"../shared";import*as t from"vue";import*as o from"../config-provider";import*as a from"../icon";import*as r from"vue-types";import*as n from"lodash";import*as l from"../directives";var i={d:(e,t)=>{for(var o in t)i.o(t,o)&&!i.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t)},c={};i.d(c,{Ee:()=>w,OO:()=>V,ZP:()=>k});const s=(u={PropTypes:()=>e.PropTypes,bkZIndexManager:()=>e.bkZIndexManager,withInstall:()=>e.withInstall},d={},i.d(d,u),d);var u,d;const v=(e=>{var t={};return i.d(t,e),t})({Fragment:()=>t.Fragment,Teleport:()=>t.Teleport,Transition:()=>t.Transition,computed:()=>t.computed,createTextVNode:()=>t.createTextVNode,createVNode:()=>t.createVNode,defineComponent:()=>t.defineComponent,effectScope:()=>t.effectScope,ref:()=>t.ref,resolveDirective:()=>t.resolveDirective,shallowRef:()=>t.shallowRef,watch:()=>t.watch,withDirectives:()=>t.withDirectives}),f=(e=>{var t={};return i.d(t,e),t})({usePrefix:()=>o.usePrefix}),m=(e=>{var t={};return i.d(t,e),t})({AngleLeft:()=>a.AngleLeft,AngleRight:()=>a.AngleRight,Close:()=>a.Close,Spinner:()=>a.Spinner}),p=(e=>{var t={};return i.d(t,e),t})({toType:()=>r.toType});var g;!function(e){e.FILL="fill",e.CONTAIN="contain",e.COVER="cover",e.NONE="none",e.SCALE_DOWN="scale-down"}(g||(g={}));var h={src:s.PropTypes.string.def(""),fallback:s.PropTypes.string.def(""),placeholder:s.PropTypes.any,fit:(0,p.toType)("fit",{}).def(g.FILL),lazy:s.PropTypes.bool,urlList:s.PropTypes.array.def([]),isShowPreviewTitle:s.PropTypes.bool.def(!0),maskClose:s.PropTypes.bool.def(!0),zIndex:s.PropTypes.number.def(2e3)},b={urlList:{type:Array,default:function(){return[]}},zIndex:s.PropTypes.number.def(2e3),initialIndex:s.PropTypes.number.def(0),isShowTitle:s.PropTypes.bool.def(!0),loops:s.PropTypes.bool.def(!0),maskClose:s.PropTypes.bool.def(!0)};const w=(0,v.defineComponent)({name:"Image",props:h,emits:["loaded","error","close","change"],setup:function(e,t){var o=t.emit,a=t.slots,r=(0,v.ref)(!0),n=(0,v.ref)(!0),l=(0,v.ref)(!1),i=(0,v.ref)(""),c=(0,v.ref)("");function s(){}(0,v.watch)((function(){return e.src}),(function(){r.value=!0,n.value=!1,c.value=e.src}));var u=(0,v.computed)((function(){var t;return(null===(t=null==e?void 0:e.urlList)||void 0===t?void 0:t.length)>0}));function d(){document.body.style.overflow=i.value,l.value=!1,o("close")}function p(e){o("change",e)}var g=(0,f.usePrefix)().resolveClassName;return function(){return(0,v.createVNode)("div",{class:"".concat(g("image"))},[r.value?(0,v.createVNode)("div",{class:"".concat(g("image-placeholder"))},[(0,v.createVNode)(m.Spinner,null,null)]):n.value?a.error?"function"==typeof a.error?a.error():a.error:(0,v.createVNode)("div",{class:"".concat(g("image-placeholder"))},[e.fallback?(0,v.createVNode)("img",{src:e.fallback,alt:"图片加载错误"},null):"",(0,v.withDirectives)((0,v.createVNode)("i",{class:"".concat(g("icon")," icon-image-fail")},null),[[(0,v.resolveDirective)("else")]])]):(0,v.createVNode)("img",{src:e.src,onClick:s},null),u.value&&l.value?(0,v.createVNode)(V,{zIndex:e.zIndex,maskClose:e.maskClose,"is-show-title":e.isShowPreviewTitle,"url-list":e.urlList,onClose:d,onChange:p},null):""])}}}),N=(e=>{var t={};return i.d(t,e),t})({throttle:()=>n.throttle}),T=(e=>{var t={};return i.d(t,e),t})({bkTooltips:()=>l.bkTooltips}),V=(0,v.defineComponent)({name:"ImageViewer",directives:{bkTooltips:T.bkTooltips},props:b,emits:["close","change"],setup:function(e,t){var o=t.emit,a=(0,v.effectScope)(),r=(0,v.ref)(),n=(0,v.ref)([]),l=(0,v.ref)(""),i=(0,v.ref)(e.initialIndex),c=(0,v.ref)(!1),u=(0,v.ref)(!1),d=(0,v.shallowRef)({scale:1,deg:0,offsetX:0,offsetY:0,enableTransition:!1}),p=(0,v.computed)((function(){var t;return(null===(t=null==e?void 0:e.urlList)||void 0===t?void 0:t.length)<2})),g=(0,v.computed)((function(){return 0===i.value})),h=(0,v.computed)((function(){return i.value===e.urlList.length-1})),b=(0,v.computed)((function(){return e.urlList[i.value]})),w=(0,v.computed)((function(){var e=b.value.split("/");return e[e.length-1]})),T=(0,v.computed)((function(){var e=d.value,t=e.scale,o=e.deg,a=e.offsetX,r=e.offsetY,n=e.enableTransition,i=a/t,c=r/t;switch(o%360){case 90:case-270:var s=[c,-i];i=s[0],c=s[1];break;case 180:case-180:var u=[-i,-c];i=u[0],c=u[1];break;case 270:case-90:var v=[-c,i];i=v[0],c=v[1]}var f={transform:"scale(".concat(t,") rotate(").concat(o,"deg) translate(").concat(i,"px, ").concat(c,"px)"),transition:n?"transform .3s":""};return"contain"===l.value&&(f.maxWidth="100%",f.maxHeight="100%"),f})),V=(0,v.computed)((function(){var t=2e3;return e.zIndex?t=e.zIndex:t+=s.bkZIndexManager.getModalNextIndex()||1,{zIndex:t}})),k=(0,N.throttle)((function(e){switch(Number(e.code)){case 27:x();break;case 32:c.value||(l.value="original",d.value={scale:1,deg:0,offsetX:0,offsetY:0,enableTransition:!1});break;case 37:L();break;case 38:I("zoomIn");break;case 39:C();break;case 40:I("zoomOut")}})),y=(0,N.throttle)((function(e){I((e.wheelDelta?e.wheelDelta:-e.detail)>0?"zoomIn":"zoomOut",{zoomRate:1.2,enableTransition:!1})}));function x(){document.removeEventListener("keydown",k),document.removeEventListener("mousewheel",y),a.stop(),o("close")}function L(){if(!g.value||e.loops){var t=e.urlList.length;i.value=(i.value-1+t)%t}}function C(){if(!h.value||e.loops){var t=e.urlList.length;i.value=(i.value+1)%t}}function I(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(!c.value){var o=Object.assign({zoomRate:.2,rotateDeg:90,enableTransition:!0},t),a=o.zoomRate,r=o.rotateDeg,n=o.enableTransition;switch(e){case"zoomOut":d.value.scale>.2&&(d.value.scale=Number.parseFloat((d.value.scale-a).toFixed(3)));break;case"zoomIn":d.value.scale<7&&(d.value.scale=Number.parseFloat((d.value.scale+a).toFixed(3)));break;case"clockwise":d.value.deg+=r;break;case"anticlockwise":d.value.deg-=r}d.value.enableTransition=n}}function P(){u.value=!1,c.value=!1}function z(e){u.value=!0,c.value=!1,e.target.alt="加载失败"}function O(e){if(!c.value&&0===e.button&&r.value){d.value.enableTransition=!1;var t=d.value,o=t.offsetX,a=t.offsetY,n=e.pageX,l=e.pageY,i=(0,N.throttle)((function(e){d.value=Object.assign(Object.assign({},d.value),{offsetX:o+e.pageX-n,offsetY:a+e.pageY-l})}));document.addEventListener("mousemove",i),document.addEventListener("mouseup",(function e(){document.removeEventListener("mousemove",i),document.removeEventListener("mouseup",e)})),e.preventDefault()}}a.run((function(){document.addEventListener("keydown",k),document.addEventListener("mousewheel",y)}));var D=(0,f.usePrefix)().resolveClassName;return function(){return(0,v.createVNode)(v.Teleport,{to:"body"},{default:function(){return[(0,v.createVNode)(v.Transition,null,{default:function(){return[(0,v.createVNode)("div",{tabindex:"-1",ref:"wrapper",class:"".concat(D("image-viewer-wrapper")),style:V.value},[(0,v.createVNode)("div",{class:"".concat(D("image-viewer-mask")),onClick:function(){e.maskClose&&x()}},null),e.isShowTitle&&e.urlList.length?(0,v.createVNode)("div",{class:"".concat(D("image-viewer-header"))},[(0,v.createVNode)("div",null,[w]),(0,v.createVNode)("div",{class:"tc "},[i.value+1,(0,v.createTextVNode)("/"),e.urlList.length]),(0,v.createVNode)("div",{class:"quit-box tr"},[(0,v.createVNode)("div",{class:"quit-tips mr10"},[(0,v.createTextVNode)("ESC 可以退出全屏")]),(0,v.createVNode)("div",{class:"".concat(D("image-viewer-close")),onClick:x},[(0,v.createVNode)(m.Close,null,null)])])]):"",p.value?"":(0,v.createVNode)(v.Fragment,null,[(0,v.createVNode)("div",{onClick:L,class:"".concat(D("image-viewer-btn")," ").concat(D("image-viewer-prev")," ").concat(!e.loops&&g?"is-disabled":"")},[(0,v.createVNode)(m.AngleLeft,null,null)]),(0,v.createVNode)("div",{onClick:C,class:"".concat(D("image-viewer-btn")," ").concat(D("image-viewer-prev")," ").concat(!e.loops&&h?"is-disabled":"")},[(0,v.createVNode)(m.AngleRight,null,null)]),(0,v.createVNode)("div",{class:"".concat(D("image-viewer-actions-inner"))},[(0,v.withDirectives)((0,v.createVNode)(m.AngleLeft,{onClick:function(){return I("zoomOut")}},null),[[(0,v.resolveDirective)("bk-tooltips"),"{content: '提示信息', placement: 'top'}"]]),(0,v.withDirectives)((0,v.createVNode)("i",{class:"",onClick:function(){return I("zoomOut")}},null),[[(0,v.resolveDirective)("bk-tooltips"),"{content: '提示信息', placement: 'top'}"]]),(0,v.withDirectives)((0,v.createVNode)("i",{class:"".concat(D("icon")," icon-narrow-line"),onClick:function(){return I("zoomOut")}},null),[[(0,v.resolveDirective)("bk-tooltips"),"{content: '提示信息', placement: 'top'}"]])])]),(0,v.createVNode)("div",{class:"".concat(D("image-viewer-canvas")," ").concat(e.isShowTitle?D("image-viewer-has-header"):"")},[u.value?(0,v.createVNode)("div",{class:"".concat(D("image-viewer-error"))},[(0,v.createVNode)("div",null,[(0,v.createVNode)("i",{class:"".concat(D("icon")," icon-image-fail")},null)]),(0,v.createVNode)("div",null,[(0,v.createTextVNode)("抱歉，图片加载失败")])]):e.urlList.map((function(e,t){return t===i.value?"":(0,v.createVNode)("img",{key:t,ref:function(e){return n[t]=e},class:"".concat(D("image-viewer-img")),style:T.value,src:e,onLoad:P,onError:z,onMousedown:O},null)}))])])]}})]}})}}}),k=(0,s.withInstall)(w);var y=c.Ee,x=c.OO,L=c.ZP;export{y as Image,x as ImageViewer,L as default};