bkui-vue 0.0.1-beta.39 → 0.0.1-beta.390

package/lib/overflow-title/index.js

@@ -0,0 +1,476 @@
+import * as __WEBPACK_EXTERNAL_MODULE__shared_65459f0a__ from "../shared";
+import * as __WEBPACK_EXTERNAL_MODULE_vue__ from "vue";
+import * as __WEBPACK_EXTERNAL_MODULE__popover_cf5f8dce__ from "../popover";
+/******/ var __webpack_modules__ = ({
+
+/***/ 35:
+/***/ ((module, __unused_webpack___webpack_exports__, __webpack_require__) => {
+
+/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9601);
+/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(2609);
+/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);
+// Imports
+
+
+var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
+// Module
+___CSS_LOADER_EXPORT___.push([module.id, ".text-ov {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.position-relative {\n  position: relative;\n}\n.position-absolute {\n  position: absolute;\n}\n", ""]);
+// Exports
+/* unused harmony default export */ var __WEBPACK_DEFAULT_EXPORT__ = ((/* unused pure expression or super */ null && (___CSS_LOADER_EXPORT___)));
+
+
+/***/ }),
+
+/***/ 2609:
+/***/ ((module) => {
+
+
+
+/*
+  MIT License http://www.opensource.org/licenses/mit-license.php
+  Author Tobias Koppers @sokra
+*/
+module.exports = function (cssWithMappingToString) {
+  var list = []; // return the list of modules as css string
+
+  list.toString = function toString() {
+    return this.map(function (item) {
+      var content = "";
+      var needLayer = typeof item[5] !== "undefined";
+
+      if (item[4]) {
+        content += "@supports (".concat(item[4], ") {");
+      }
+
+      if (item[2]) {
+        content += "@media ".concat(item[2], " {");
+      }
+
+      if (needLayer) {
+        content += "@layer".concat(item[5].length > 0 ? " ".concat(item[5]) : "", " {");
+      }
+
+      content += cssWithMappingToString(item);
+
+      if (needLayer) {
+        content += "}";
+      }
+
+      if (item[2]) {
+        content += "}";
+      }
+
+      if (item[4]) {
+        content += "}";
+      }
+
+      return content;
+    }).join("");
+  }; // import a list of modules into the list
+
+
+  list.i = function i(modules, media, dedupe, supports, layer) {
+    if (typeof modules === "string") {
+      modules = [[null, modules, undefined]];
+    }
+
+    var alreadyImportedModules = {};
+
+    if (dedupe) {
+      for (var k = 0; k < this.length; k++) {
+        var id = this[k][0];
+
+        if (id != null) {
+          alreadyImportedModules[id] = true;
+        }
+      }
+    }
+
+    for (var _k = 0; _k < modules.length; _k++) {
+      var item = [].concat(modules[_k]);
+
+      if (dedupe && alreadyImportedModules[item[0]]) {
+        continue;
+      }
+
+      if (typeof layer !== "undefined") {
+        if (typeof item[5] === "undefined") {
+          item[5] = layer;
+        } else {
+          item[1] = "@layer".concat(item[5].length > 0 ? " ".concat(item[5]) : "", " {").concat(item[1], "}");
+          item[5] = layer;
+        }
+      }
+
+      if (media) {
+        if (!item[2]) {
+          item[2] = media;
+        } else {
+          item[1] = "@media ".concat(item[2], " {").concat(item[1], "}");
+          item[2] = media;
+        }
+      }
+
+      if (supports) {
+        if (!item[4]) {
+          item[4] = "".concat(supports);
+        } else {
+          item[1] = "@supports (".concat(item[4], ") {").concat(item[1], "}");
+          item[4] = supports;
+        }
+      }
+
+      list.push(item);
+    }
+  };
+
+  return list;
+};
+
+/***/ }),
+
+/***/ 9601:
+/***/ ((module) => {
+
+
+
+module.exports = function (i) {
+  return i[1];
+};
+
+/***/ })
+
+/******/ });
+/************************************************************************/
+/******/ // The module cache
+/******/ var __webpack_module_cache__ = {};
+/******/ 
+/******/ // The require function
+/******/ function __webpack_require__(moduleId) {
+/******/ 	// Check if module is in cache
+/******/ 	var cachedModule = __webpack_module_cache__[moduleId];
+/******/ 	if (cachedModule !== undefined) {
+/******/ 		return cachedModule.exports;
+/******/ 	}
+/******/ 	// Create a new module (and put it into the cache)
+/******/ 	var module = __webpack_module_cache__[moduleId] = {
+/******/ 		id: moduleId,
+/******/ 		// no module.loaded needed
+/******/ 		exports: {}
+/******/ 	};
+/******/ 
+/******/ 	// Execute the module function
+/******/ 	__webpack_modules__[moduleId](module, module.exports, __webpack_require__);
+/******/ 
+/******/ 	// Return the exports of the module
+/******/ 	return module.exports;
+/******/ }
+/******/ 
+/************************************************************************/
+/******/ /* webpack/runtime/compat get default export */
+/******/ (() => {
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = (module) => {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			() => (module['default']) :
+/******/ 			() => (module);
+/******/ 		__webpack_require__.d(getter, { a: getter });
+/******/ 		return getter;
+/******/ 	};
+/******/ })();
+/******/ 
+/******/ /* 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__ = {};
+// This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
+(() => {
+
+// EXPORTS
+__webpack_require__.d(__webpack_exports__, {
+  "p1": () => (/* reexport */ OverflowTitle),
+  "ZP": () => (/* binding */ src),
+  "si": () => (/* reexport */ utils_getActualWidthByCanvas),
+  "ZF": () => (/* reexport */ utils_getActualWidthByDom),
+  "$s": () => (/* reexport */ directive_overflowTitle)
+});
+
+;// 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({ ["debounce"]: () => __WEBPACK_EXTERNAL_MODULE__shared_65459f0a__.debounce, ["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({ ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["mergeProps"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.mergeProps, ["onMounted"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onMounted, ["onUnmounted"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onUnmounted, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref, ["shallowRef"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.shallowRef });
+;// CONCATENATED MODULE: external "../popover"
+var external_popover_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
+var external_popover_y = x => () => x
+const external_popover_namespaceObject = external_popover_x({ ["default"]: () => __WEBPACK_EXTERNAL_MODULE__popover_cf5f8dce__["default"] });
+;// CONCATENATED MODULE: ../../packages/overflow-title/src/props.ts
+/* harmony default export */ const props = ({
+  content: String,
+  type: {
+    type: String,
+    "default": 'title'
+  },
+  calType: {
+    type: String,
+    "default": 'dom'
+  },
+  resizeable: Boolean
+});
+;// CONCATENATED MODULE: ../../packages/overflow-title/src/utils/getActualWidthByCanvas.ts
+function getActualWidthByCanvas(text, options) {
+  var _options$fontSize = options.fontSize,
+      fontSize = _options$fontSize === void 0 ? 14 : _options$fontSize,
+      _options$fontFamily = options.fontFamily,
+      fontFamily = _options$fontFamily === void 0 ? 'Microsoft YaHei' : _options$fontFamily;
+  var canvas = document.createElement('canvas');
+  var ctx = canvas.getContext('2d');
+  ctx.font = "".concat(fontSize, "px ").concat(fontFamily);
+  var metrics = ctx.measureText(text);
+  var actual = Math.abs(metrics.actualBoundingBoxLeft) + Math.abs(metrics.actualBoundingBoxRight);
+  return Math.max(metrics.width, actual);
+}
+
+/* harmony default export */ const utils_getActualWidthByCanvas = (getActualWidthByCanvas);
+;// CONCATENATED MODULE: ../../packages/overflow-title/src/utils/getActualWidthByDom.ts
+function getActualWidthByDom(text, options) {
+  var dom = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : document.body;
+
+  var _ref = options || {},
+      fontSize = _ref.fontSize,
+      fontFamily = _ref.fontFamily;
+
+  var tempDom = document.createElement('div');
+  tempDom.style.cssText = "position: absolute;left: -999em;top:-999em;z-index: -1;text-overflow: initial;\n    ".concat(fontSize ? "font-size:".concat(fontSize, " ;") : '', "\n    ").concat(fontFamily ? "font-family:".concat(fontFamily, " ") : '', "\n  ");
+  tempDom.innerText = text;
+  dom.append(tempDom);
+  var clientWidth = tempDom.clientWidth;
+  dom.removeChild(tempDom);
+  return clientWidth;
+}
+
+/* harmony default export */ const utils_getActualWidthByDom = (getActualWidthByDom);
+// EXTERNAL MODULE: ../../packages/overflow-title/src/overflow.less
+var overflow = __webpack_require__(35);
+;// CONCATENATED MODULE: ../../packages/overflow-title/src/components/OverflowTitle.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 OverflowTitle = ((0,external_vue_namespaceObject.defineComponent)({
+  name: 'OverflowTitle',
+  props: props,
+  setup: function setup(props, _ref) {
+    var slots = _ref.slots;
+    var boxRef = (0,external_vue_namespaceObject.ref)(null);
+    var textRef = (0,external_vue_namespaceObject.ref)(null);
+    var isShowTips = (0,external_vue_namespaceObject.ref)(false);
+    var textProps = (0,external_vue_namespaceObject.shallowRef)();
+    var contentText = (0,external_vue_namespaceObject.computed)(function () {
+      var _a;
+
+      if (props.content) {
+        return props.content;
+      }
+
+      return (_a = slots === null || slots === void 0 ? void 0 : slots["default"]) === null || _a === void 0 ? void 0 : _a.call(slots);
+    });
+    (0,external_vue_namespaceObject.onMounted)(function () {
+      var clientWidth = boxRef.value.clientWidth;
+      var resizeHandler = (0,external_shared_namespaceObject.debounce)(500, function () {
+        isShowTips.value = false;
+        textProps.value = {};
+        var textWidth = 0;
+
+        if (props.calType === 'dom') {
+          textWidth = utils_getActualWidthByDom(textRef.value.textContent, null, boxRef.value);
+        } else {
+          var _getComputedStyle = getComputedStyle(boxRef.value),
+              fontSize = _getComputedStyle.fontSize,
+              fontFamily = _getComputedStyle.fontFamily;
+
+          textWidth = utils_getActualWidthByCanvas(contentText.value, {
+            fontSize: fontSize,
+            fontFamily: fontFamily
+          });
+        }
+
+        if (textWidth > clientWidth) {
+          isShowTips.value = true;
+
+          if (props.type === 'title') {
+            textProps.value = {
+              title: textRef.value.innerText
+            };
+          }
+        }
+      });
+      resizeHandler();
+
+      if (props.resizeable) {
+        var observer = new ResizeObserver(resizeHandler);
+        observer.observe(boxRef.value);
+        (0,external_vue_namespaceObject.onUnmounted)(function () {
+          observer.unobserve(boxRef.value);
+          observer.disconnect();
+        });
+      }
+    });
+    return {
+      boxRef: boxRef,
+      textRef: textRef,
+      isShowTips: isShowTips,
+      contentText: contentText,
+      textProps: textProps
+    };
+  },
+  render: function render() {
+    var _this = this;
+
+    return (0,external_vue_namespaceObject.createVNode)("div", {
+      "ref": "boxRef",
+      "class": "position-relative"
+    }, [(0,external_vue_namespaceObject.createVNode)(external_popover_namespaceObject["default"], {
+      "disabled": this.type === 'title'
+    }, {
+      "default": function _default() {
+        return (0,external_vue_namespaceObject.createVNode)("div", (0,external_vue_namespaceObject.mergeProps)({
+          "ref": "textRef",
+          "class": "text-ov"
+        }, _this.textProps), [_this.contentText]);
+      },
+      content: function content() {
+        return _this.contentText;
+      }
+    })]);
+  }
+}));
+;// CONCATENATED MODULE: ../../packages/overflow-title/src/directive/overflowTitle.ts
+
+
+var overflowTitle = {
+  mounted: function mounted(el, _ref) {
+    var _ref$value = _ref.value,
+        value = _ref$value === void 0 ? {} : _ref$value;
+    var clientWidth = el.parentElement.clientWidth;
+
+    if (!clientWidth) {
+      return;
+    }
+
+    var content = value.content,
+        _value$calType = value.calType,
+        calType = _value$calType === void 0 ? 'dom' : _value$calType;
+    var text = content || el.innerText;
+    var textWidth = 0;
+
+    if (calType === 'dom') {
+      textWidth = utils_getActualWidthByDom(el.textContent, null, el.parentElement);
+    } else {
+      var _getComputedStyle = getComputedStyle(el),
+          fontSize = _getComputedStyle.fontSize,
+          fontFamily = _getComputedStyle.fontFamily;
+
+      textWidth = utils_getActualWidthByCanvas(text, {
+        fontSize: fontSize,
+        fontFamily: fontFamily
+      });
+    }
+
+    if (textWidth > clientWidth) {
+      el.setAttribute('title', text);
+    }
+  }
+};
+/* harmony default export */ const directive_overflowTitle = (overflowTitle);
+;// CONCATENATED MODULE: ../../packages/overflow-title/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 BkOverflowTitle = (0,external_shared_namespaceObject.withInstall)(OverflowTitle);
+
+/* harmony default export */ const src = (BkOverflowTitle);
+})();
+
+var __webpack_exports__OverflowTitle = __webpack_exports__.p1;
+var __webpack_exports__default = __webpack_exports__.ZP;
+var __webpack_exports__getActualWidthByCanvas = __webpack_exports__.si;
+var __webpack_exports__getActualWidthByDom = __webpack_exports__.ZF;
+var __webpack_exports__overflowTitle = __webpack_exports__.$s;
+export { __webpack_exports__OverflowTitle as OverflowTitle, __webpack_exports__default as default, __webpack_exports__getActualWidthByCanvas as getActualWidthByCanvas, __webpack_exports__getActualWidthByDom as getActualWidthByDom, __webpack_exports__overflowTitle as overflowTitle };

package/lib/overflow-title/overflow.css

@@ -0,0 +1,11 @@
+.text-ov {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.position-relative {
+  position: relative;
+}
+.position-absolute {
+  position: absolute;
+}

package/lib/overflow-title/overflow.less

@@ -0,0 +1,13 @@
+.text-ov {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.position-relative {
+  position: relative;
+}
+
+.position-absolute {
+  position: absolute;
+}

package/lib/overflow-title/overflow.variable.css

@@ -0,0 +1,11 @@
+.text-ov {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.position-relative {
+  position: relative;
+}
+.position-absolute {
+  position: absolute;
+}

package/lib/overflow-title/props.d.ts

@@ -0,0 +1,16 @@
+import { PropType } from 'vue';
+export declare type TipsType = 'tips' | 'title';
+export declare type CalType = 'dom' | 'canvas';
+declare const _default: {
+    content: StringConstructor;
+    type: {
+        type: PropType<TipsType>;
+        default: string;
+    };
+    calType: {
+        type: PropType<CalType>;
+        default: string;
+    };
+    resizeable: BooleanConstructor;
+};
+export default _default;

package/lib/overflow-title/utils/getActualWidthByCanvas.d.ts

@@ -0,0 +1,3 @@
+import { CSSProperties } from 'vue';
+declare function getActualWidthByCanvas(text: string, options: CSSProperties): number;
+export default getActualWidthByCanvas;

package/lib/overflow-title/utils/getActualWidthByDom.d.ts

@@ -0,0 +1,3 @@
+import { CSSProperties } from 'vue';
+declare function getActualWidthByDom(text: string, options: CSSProperties, dom?: HTMLElement): number;
+export default getActualWidthByDom;