adou-ui
Version:
feat:修复了TagInput无法清空的问题
993 lines (945 loc) • 411 kB
JavaScript
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory(require("react"), require("react-dom"));
else if(typeof define === 'function' && define.amd)
define(["react", "react-dom"], factory);
else if(typeof exports === 'object')
exports["RPB"] = factory(require("react"), require("react-dom"));
else
root["RPB"] = factory(root["React"], root["ReactDOM"]);
})(this, (__WEBPACK_EXTERNAL_MODULE__442__, __WEBPACK_EXTERNAL_MODULE__3__) => {
return /******/ (() => { // webpackBootstrap
/******/ var __webpack_modules__ = ({
/***/ 191:
/***/ ((module) => {
"use strict";
/*
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;
};
/***/ }),
/***/ 73:
/***/ ((module) => {
"use strict";
module.exports = function (item) {
var content = item[1];
var cssMapping = item[3];
if (!cssMapping) {
return content;
}
if (typeof btoa === "function") {
var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(cssMapping))));
var data = "sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(base64);
var sourceMapping = "/*# ".concat(data, " */");
return [content].concat([sourceMapping]).join("\n");
}
return [content].join("\n");
};
/***/ }),
/***/ 978:
/***/ ((module) => {
/**
* This file automatically generated from `pre-publish.js`.
* Do not manually edit.
*/
module.exports = {
"area": true,
"base": true,
"br": true,
"col": true,
"embed": true,
"hr": true,
"img": true,
"input": true,
"link": true,
"meta": true,
"param": true,
"source": true,
"track": true,
"wbr": true
};
/***/ }),
/***/ 227:
/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
(function webpackUniversalModuleDefinition(root, factory) {
if (true) module.exports = factory(__webpack_require__(442), __webpack_require__(3));else {}
})(this, (__WEBPACK_EXTERNAL_MODULE__442__, __WEBPACK_EXTERNAL_MODULE__3__) => {
return /******/(() => {
// webpackBootstrap
/******/
"use strict";
/******/
var __webpack_modules__ = {
/***/191: ( /***/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;
};
/***/
}),
/***/73: ( /***/module => {
module.exports = function (item) {
var content = item[1];
var cssMapping = item[3];
if (!cssMapping) {
return content;
}
if (typeof btoa === "function") {
var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(cssMapping))));
var data = "sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(base64);
var sourceMapping = "/*# ".concat(data, " */");
return [content].concat([sourceMapping]).join("\n");
}
return [content].join("\n");
};
/***/
}),
/***/483: ( /***/(module, __nested_webpack_exports__, __nested_webpack_require_4367__) => {
/* harmony export */__nested_webpack_require_4367__.d(__nested_webpack_exports__, {
/* harmony export */A: () => __WEBPACK_DEFAULT_EXPORT__
/* harmony export */
});
/* harmony import */
var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __nested_webpack_require_4367__(73);
/* harmony import */
var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__nested_webpack_require_4367__.n(_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */
var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __nested_webpack_require_4367__(191);
/* harmony import */
var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__nested_webpack_require_4367__.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_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default());
// Module
___CSS_LOADER_EXPORT___.push([module.id, "@charset \"UTF-8\";\n.adou-tooltip-wrapper {\n position: relative;\n width: fit-content;\n}\n.adou-tooltip-wrapper .adou-tooltip-content {\n width: fit-content;\n}\n\n.adou-tooltip {\n height: fit-content;\n position: absolute;\n color: #fff;\n padding: 5px 10px;\n border-radius: 4px;\n font-size: 14px;\n opacity: 0;\n transform: scale(0);\n /* \u521D\u59CB\u72B6\u6001\u4E3A\u7F29\u5C0F */\n transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;\n /* \u6DFB\u52A0 transform \u8FC7\u6E21\u6548\u679C */\n /* \u9632\u6B62\u9F20\u6807\u4E8B\u4EF6\u7A7F\u900F\u5230 Tooltip \u540E\u9762\u7684\u5143\u7D20 */\n z-index: 10000;\n}\n.adou-tooltip .adou-tooltip-arrow {\n position: absolute;\n width: 0;\n height: 0;\n border-style: solid;\n}\n\n.show-tool-tip {\n opacity: 1;\n /* \u663E\u793A\u65F6\u653E\u5927 */\n pointer-events: auto;\n /* \u542F\u7528\u9F20\u6807\u4E8B\u4EF6 */\n}\n\n.adou-tooltip-top,\n.adou-tooltip-top-left,\n.adou-tooltip-top-right {\n bottom: 100%;\n left: 50%;\n transform: translate(-50%, -10px) scale(0);\n /* \u521D\u59CB\u72B6\u6001\u4E3A\u7F29\u5C0F */\n}\n.adou-tooltip-top.show-tool-tip,\n.adou-tooltip-top-left.show-tool-tip,\n.adou-tooltip-top-right.show-tool-tip {\n transform: translate(-50%, -10px) scale(1);\n /* \u663E\u793A\u65F6\u653E\u5927 */\n}\n\n.adou-tooltip-bottom,\n.adou-tooltip-bottom-left,\n.adou-tooltip-bottom-right {\n top: 100%;\n left: 50%;\n transform: translate(-50%, 10px) scale(0);\n /* \u521D\u59CB\u72B6\u6001\u4E3A\u7F29\u5C0F */\n}\n.adou-tooltip-bottom.show-tool-tip,\n.adou-tooltip-bottom-left.show-tool-tip,\n.adou-tooltip-bottom-right.show-tool-tip {\n transform: translate(-50%, 10px) scale(1);\n /* \u663E\u793A\u65F6\u653E\u5927 */\n}\n\n.adou-tooltip-left,\n.adou-tooltip-left-top,\n.adou-tooltip-left-bottom {\n right: 100%;\n top: 50%;\n transform: translate(-10px, -50%) scale(0);\n width: fit-content;\n /* \u521D\u59CB\u72B6\u6001\u4E3A\u7F29\u5C0F */\n}\n.adou-tooltip-left.show-tool-tip,\n.adou-tooltip-left-top.show-tool-tip,\n.adou-tooltip-left-bottom.show-tool-tip {\n transform: translate(-10px, -50%) scale(1);\n /* \u663E\u793A\u65F6\u653E\u5927 */\n}\n\n.adou-tooltip-right,\n.adou-tooltip-right-top,\n.adou-tooltip-right-bottom {\n top: 50%;\n transform: translate(10px, -50%) scale(0);\n /* \u521D\u59CB\u72B6\u6001\u4E3A\u7F29\u5C0F */\n}\n.adou-tooltip-right.show-tool-tip,\n.adou-tooltip-right-top.show-tool-tip,\n.adou-tooltip-right-bottom.show-tool-tip {\n transform: translate(10px, -50%) scale(1);\n /* \u663E\u793A\u65F6\u653E\u5927 */\n}\n\n.adou-tooltip-arrow-top {\n border-width: 9px 9px 0 9px;\n border-color: green transparent transparent transparent;\n bottom: -9px;\n left: 50%;\n transform: translateX(-50%);\n}\n\n.adou-tooltip-arrow-top-left,\n.adou-tooltip-arrow-top-right {\n border-width: 9px 9px 0 9px;\n border-color: green transparent transparent transparent;\n bottom: -9px;\n transform: translateX(-50%);\n}\n\n.adou-tooltip-arrow-bottom {\n border-width: 0 9px 9px 9px;\n border-color: transparent transparent green transparent;\n top: -9px;\n left: 50%;\n transform: translateX(-50%);\n}\n\n.adou-tooltip-arrow-left,\n.adou-tooltip-arrow-left-bottom {\n border-width: 9px 0 9px 9px;\n border-color: transparent transparent transparent green;\n right: -9px;\n top: 50%;\n transform: translateY(-50%);\n}\n\n.adou-tooltip-arrow-right {\n border-width: 9px 9px 9px 0;\n border-color: transparent green transparent transparent;\n left: -9px;\n top: 50%;\n transform: translateY(-50%);\n}\n\n.adou-tooltip-arrow-right-top,\n.adou-tooltip-arrow-right-bottom {\n border-width: 9px 9px 9px 0;\n border-color: transparent green transparent transparent;\n transform: translateY(-50%);\n}\n\n.adou-tooltip-arrow-bottom-left,\n.adou-tooltip-arrow-bottom-right {\n border-width: 0 9px 9px 9px;\n border-color: transparent transparent green transparent;\n top: -9px;\n transform: translateX(-50%);\n}\n\n.adou-tooltip-arrow-left-top {\n border-width: 9px 0 9px 9px;\n border-color: transparent transparent transparent green;\n transform: translateY(-50%);\n}", "", {
"version": 3,
"sources": ["webpack://./src/index.scss"],
"names": [],
"mappings": "AAAA,gBAAgB;AAAhB;EACI,kBAAA;EACA,kBAAA;AAEJ;AAAI;EACI,kBAAA;AAER;;AAEA;EACI,mBAAA;EACA,kBAAA;EACA,WAAA;EACA,iBAAA;EACA,kBAAA;EACA,eAAA;EACA,UAAA;EACA,mBAAA;EACA,YAAA;EACA,gEACI;EAEJ,sBAAA;EAEA,4BAAA;EACA,cAAA;AAFJ;AAII;EACI,kBAAA;EACA,QAAA;EACA,SAAA;EACA,mBAAA;AAFR;;AAMA;EACI,UAAA;EACA,UAAA;EACA,oBAAA;EACA,WAAA;AAHJ;;AAMA;;;EAGI,YAAA;EACA,SAAA;EACA,0CAAA;EACA,YAAA;AAHJ;AAKI;;;EACI,0CAAA;EACA,UAAA;AADR;;AAKA;;;EAGI,SAAA;EACA,SAAA;EACA,yCAAA;EACA,YAAA;AAFJ;AAII;;;EACI,yCAAA;EACA,UAAA;AAAR;;AAIA;;;EAGI,WAAA;EACA,QAAA;EACA,0CAAA;EACA,kBAAA;EACA,YAAA;AADJ;AAGI;;;EACI,0CAAA;EACA,UAAA;AACR;;AAGA;;;EAGI,QAAA;EACA,yCAAA;EACA,YAAA;AAAJ;AAEI;;;EACI,yCAAA;EACA,UAAA;AAER;;AAGA;EACI,2BAAA;EACA,uDAAA;EACA,YAAA;EACA,SAAA;EACA,2BAAA;AAAJ;;AAGA;;EAEI,2BAAA;EACA,uDAAA;EACA,YAAA;EACA,2BAAA;AAAJ;;AAGA;EACI,2BAAA;EACA,uDAAA;EACA,SAAA;EACA,SAAA;EACA,2BAAA;AAAJ;;AAGA;;EAEI,2BAAA;EACA,uDAAA;EACA,WAAA;EACA,QAAA;EACA,2BAAA;AAAJ;;AAGA;EACI,2BAAA;EACA,uDAAA;EACA,UAAA;EACA,QAAA;EACA,2BAAA;AAAJ;;AAIA;;EAEI,2BAAA;EACA,uDAAA;EACA,2BAAA;AADJ;;AAIA;;EAEI,2BAAA;EACA,uDAAA;EACA,SAAA;EACA,2BAAA;AADJ;;AAIA;EACI,2BAAA;EACA,uDAAA;EACA,2BAAA;AADJ",
"sourcesContent": [".adou-tooltip-wrapper {\r\n position: relative;\r\n width: fit-content;\r\n\r\n .adou-tooltip-content {\r\n width: fit-content;\r\n }\r\n}\r\n\r\n.adou-tooltip {\r\n height: fit-content;\r\n position: absolute;\r\n color: #fff;\r\n padding: 5px 10px;\r\n border-radius: 4px;\r\n font-size: 14px;\r\n opacity: 0;\r\n transform: scale(0);\r\n /* 初始状态为缩小 */\r\n transition:\r\n opacity 0.2s ease-in-out,\r\n transform 0.2s ease-in-out;\r\n /* 添加 transform 过渡效果 */\r\n // pointer-events: none;\r\n /* 防止鼠标事件穿透到 Tooltip 后面的元素 */\r\n z-index: 10000;\r\n\r\n .adou-tooltip-arrow {\r\n position: absolute;\r\n width: 0;\r\n height: 0;\r\n border-style: solid;\r\n }\r\n}\r\n\r\n.show-tool-tip {\r\n opacity: 1;\r\n /* 显示时放大 */\r\n pointer-events: auto;\r\n /* 启用鼠标事件 */\r\n}\r\n\r\n.adou-tooltip-top,\r\n.adou-tooltip-top-left,\r\n.adou-tooltip-top-right {\r\n bottom: 100%;\r\n left: 50%;\r\n transform: translate(-50%, -10px) scale(0);\r\n /* 初始状态为缩小 */\r\n\r\n &.show-tool-tip {\r\n transform: translate(-50%, -10px) scale(1);\r\n /* 显示时放大 */\r\n }\r\n}\r\n\r\n.adou-tooltip-bottom,\r\n.adou-tooltip-bottom-left,\r\n.adou-tooltip-bottom-right {\r\n top: 100%;\r\n left: 50%;\r\n transform: translate(-50%, 10px) scale(0);\r\n /* 初始状态为缩小 */\r\n\r\n &.show-tool-tip {\r\n transform: translate(-50%, 10px) scale(1);\r\n /* 显示时放大 */\r\n }\r\n}\r\n\r\n.adou-tooltip-left,\r\n.adou-tooltip-left-top,\r\n.adou-tooltip-left-bottom {\r\n right: 100%;\r\n top: 50%;\r\n transform: translate(-10px, -50%) scale(0);\r\n width: fit-content;\r\n /* 初始状态为缩小 */\r\n\r\n &.show-tool-tip {\r\n transform: translate(-10px, -50%) scale(1);\r\n /* 显示时放大 */\r\n }\r\n}\r\n\r\n.adou-tooltip-right,\r\n.adou-tooltip-right-top,\r\n.adou-tooltip-right-bottom {\r\n top: 50%;\r\n transform: translate(10px, -50%) scale(0);\r\n /* 初始状态为缩小 */\r\n\r\n &.show-tool-tip {\r\n transform: translate(10px, -50%) scale(1);\r\n /* 显示时放大 */\r\n }\r\n}\r\n\r\n\r\n.adou-tooltip-arrow-top {\r\n border-width: 9px 9px 0 9px;\r\n border-color: green transparent transparent transparent;\r\n bottom: -9px;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n}\r\n\r\n.adou-tooltip-arrow-top-left,\r\n.adou-tooltip-arrow-top-right {\r\n border-width: 9px 9px 0 9px;\r\n border-color: green transparent transparent transparent;\r\n bottom: -9px;\r\n transform: translateX(-50%);\r\n}\r\n\r\n.adou-tooltip-arrow-bottom {\r\n border-width: 0 9px 9px 9px;\r\n border-color: transparent transparent green transparent;\r\n top: -9px;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n}\r\n\r\n.adou-tooltip-arrow-left,\r\n.adou-tooltip-arrow-left-bottom {\r\n border-width: 9px 0 9px 9px;\r\n border-color: transparent transparent transparent green;\r\n right: -9px;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n}\r\n\r\n.adou-tooltip-arrow-right {\r\n border-width: 9px 9px 9px 0;\r\n border-color: transparent green transparent transparent;\r\n left: -9px;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n}\r\n\r\n\r\n.adou-tooltip-arrow-right-top,\r\n.adou-tooltip-arrow-right-bottom {\r\n border-width: 9px 9px 9px 0;\r\n border-color: transparent green transparent transparent;\r\n transform: translateY(-50%);\r\n}\r\n\r\n.adou-tooltip-arrow-bottom-left,\r\n.adou-tooltip-arrow-bottom-right {\r\n border-width: 0 9px 9px 9px;\r\n border-color: transparent transparent green transparent;\r\n top: -9px;\r\n transform: translateX(-50%);\r\n}\r\n\r\n.adou-tooltip-arrow-left-top {\r\n border-width: 9px 0 9px 9px;\r\n border-color: transparent transparent transparent green;\r\n transform: translateY(-50%);\r\n}"],
"sourceRoot": ""
}]);
// Exports
/* harmony default export */
const __WEBPACK_DEFAULT_EXPORT__ = ___CSS_LOADER_EXPORT___;
/***/
}),
/***/591: ( /***/module => {
var stylesInDOM = [];
function getIndexByIdentifier(identifier) {
var result = -1;
for (var i = 0; i < stylesInDOM.length; i++) {
if (stylesInDOM[i].identifier === identifier) {
result = i;
break;
}
}
return result;
}
function modulesToDom(list, options) {
var idCountMap = {};
var identifiers = [];
for (var i = 0; i < list.length; i++) {
var item = list[i];
var id = options.base ? item[0] + options.base : item[0];
var count = idCountMap[id] || 0;
var identifier = "".concat(id, " ").concat(count);
idCountMap[id] = count + 1;
var indexByIdentifier = getIndexByIdentifier(identifier);
var obj = {
css: item[1],
media: item[2],
sourceMap: item[3],
supports: item[4],
layer: item[5]
};
if (indexByIdentifier !== -1) {
stylesInDOM[indexByIdentifier].references++;
stylesInDOM[indexByIdentifier].updater(obj);
} else {
var updater = addElementStyle(obj, options);
options.byIndex = i;
stylesInDOM.splice(i, 0, {
identifier: identifier,
updater: updater,
references: 1
});
}
identifiers.push(identifier);
}
return identifiers;
}
function addElementStyle(obj, options) {
var api = options.domAPI(options);
api.update(obj);
var updater = function updater(newObj) {
if (newObj) {
if (newObj.css === obj.css && newObj.media === obj.media && newObj.sourceMap === obj.sourceMap && newObj.supports === obj.supports && newObj.layer === obj.layer) {
return;
}
api.update(obj = newObj);
} else {
api.remove();
}
};
return updater;
}
module.exports = function (list, options) {
options = options || {};
list = list || [];
var lastIdentifiers = modulesToDom(list, options);
return function update(newList) {
newList = newList || [];
for (var i = 0; i < lastIdentifiers.length; i++) {
var identifier = lastIdentifiers[i];
var index = getIndexByIdentifier(identifier);
stylesInDOM[index].references--;
}
var newLastIdentifiers = modulesToDom(newList, options);
for (var _i = 0; _i < lastIdentifiers.length; _i++) {
var _identifier = lastIdentifiers[_i];
var _index = getIndexByIdentifier(_identifier);
if (stylesInDOM[_index].references === 0) {
stylesInDOM[_index].updater();
stylesInDOM.splice(_index, 1);
}
}
lastIdentifiers = newLastIdentifiers;
};
};
/***/
}),
/***/128: ( /***/module => {
var memo = {};
/* istanbul ignore next */
function getTarget(target) {
if (typeof memo[target] === "undefined") {
var styleTarget = document.querySelector(target);
// Special case to return head of iframe instead of iframe itself
if (window.HTMLIFrameElement && styleTarget instanceof window.HTMLIFrameElement) {
try {
// This will throw an exception if access to iframe is blocked
// due to cross-origin restrictions
styleTarget = styleTarget.contentDocument.head;
} catch (e) {
// istanbul ignore next
styleTarget = null;
}
}
memo[target] = styleTarget;
}
return memo[target];
}
/* istanbul ignore next */
function insertBySelector(insert, style) {
var target = getTarget(insert);
if (!target) {
throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");
}
target.appendChild(style);
}
module.exports = insertBySelector;
/***/
}),
/***/51: ( /***/module => {
/* istanbul ignore next */
function insertStyleElement(options) {
var element = document.createElement("style");
options.setAttributes(element, options.attributes);
options.insert(element, options.options);
return element;
}
module.exports = insertStyleElement;
/***/
}),
/***/855: ( /***/(module, __unused_webpack_exports, __nested_webpack_require_20125__) => {
/* istanbul ignore next */
function setAttributesWithoutAttributes(styleElement) {
var nonce = true ? __nested_webpack_require_20125__.nc : 0;
if (nonce) {
styleElement.setAttribute("nonce", nonce);
}
}
module.exports = setAttributesWithoutAttributes;
/***/
}),
/***/740: ( /***/module => {
/* istanbul ignore next */
function apply(styleElement, options, obj) {
var css = "";
if (obj.supports) {
css += "@supports (".concat(obj.supports, ") {");
}
if (obj.media) {
css += "@media ".concat(obj.media, " {");
}
var needLayer = typeof obj.layer !== "undefined";
if (needLayer) {
css += "@layer".concat(obj.layer.length > 0 ? " ".concat(obj.layer) : "", " {");
}
css += obj.css;
if (needLayer) {
css += "}";
}
if (obj.media) {
css += "}";
}
if (obj.supports) {
css += "}";
}
var sourceMap = obj.sourceMap;
if (sourceMap && typeof btoa !== "undefined") {
css += "\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))), " */");
}
// For old IE
/* istanbul ignore if */
options.styleTagTransform(css, styleElement, options.options);
}
function removeStyleElement(styleElement) {
// istanbul ignore if
if (styleElement.parentNode === null) {
return false;
}
styleElement.parentNode.removeChild(styleElement);
}
/* istanbul ignore next */
function domAPI(options) {
if (typeof document === "undefined") {
return {
update: function update() {},
remove: function remove() {}
};
}
var styleElement = options.insertStyleElement(options);
return {
update: function update(obj) {
apply(styleElement, options, obj);
},
remove: function remove() {
removeStyleElement(styleElement);
}
};
}
module.exports = domAPI;
/***/
}),
/***/656: ( /***/module => {
/* istanbul ignore next */
function styleTagTransform(css, styleElement) {
if (styleElement.styleSheet) {
styleElement.styleSheet.cssText = css;
} else {
while (styleElement.firstChild) {
styleElement.removeChild(styleElement.firstChild);
}
styleElement.appendChild(document.createTextNode(css));
}
}
module.exports = styleTagTransform;
/***/
}),
/***/442: ( /***/module => {
module.exports = __WEBPACK_EXTERNAL_MODULE__442__;
/***/
}),
/***/3: ( /***/module => {
module.exports = __WEBPACK_EXTERNAL_MODULE__3__;
/***/
})
/******/
};
/************************************************************************/
/******/ // The module cache
/******/
var __webpack_module_cache__ = {};
/******/
/******/ // The require function
/******/
function __nested_webpack_require_23535__(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, __nested_webpack_require_23535__);
/******/
/******/ // Return the exports of the module
/******/
return module.exports;
/******/
}
/******/
/************************************************************************/
/******/ /* webpack/runtime/compat get default export */
/******/
(() => {
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/__nested_webpack_require_23535__.n = module => {
/******/var getter = module && module.__esModule ? /******/() => module['default'] : /******/() => module;
/******/
__nested_webpack_require_23535__.d(getter, {
a: getter
});
/******/
return getter;
/******/
};
/******/
})();
/******/
/******/ /* webpack/runtime/define property getters */
/******/
(() => {
/******/ // define getter functions for harmony exports
/******/__nested_webpack_require_23535__.d = (exports, definition) => {
/******/for (var key in definition) {
/******/if (__nested_webpack_require_23535__.o(definition, key) && !__nested_webpack_require_23535__.o(exports, key)) {
/******/Object.defineProperty(exports, key, {
enumerable: true,
get: definition[key]
});
/******/
}
/******/
}
/******/
};
/******/
})();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/
(() => {
/******/__nested_webpack_require_23535__.o = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
/******/
})();
/******/
/******/ /* webpack/runtime/make namespace object */
/******/
(() => {
/******/ // define __esModule on exports
/******/__nested_webpack_require_23535__.r = exports => {
/******/if (typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/Object.defineProperty(exports, Symbol.toStringTag, {
value: 'Module'
});
/******/
}
/******/
Object.defineProperty(exports, '__esModule', {
value: true
});
/******/
};
/******/
})();
/******/
/******/ /* webpack/runtime/nonce */
/******/
(() => {
/******/__nested_webpack_require_23535__.nc = undefined;
/******/
})();
/******/
/************************************************************************/
var __nested_webpack_exports__ = {};
// This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
(() => {
// ESM COMPAT FLAG
__nested_webpack_require_23535__.r(__nested_webpack_exports__);
// EXPORTS
__nested_webpack_require_23535__.d(__nested_webpack_exports__, {
"default": () => ( /* binding */src_0)
});
// EXTERNAL MODULE: external {"root":"React","commonjs2":"react","commonjs":"react","amd":"react"}
var external_root_React_commonjs2_react_commonjs_react_amd_react_ = __nested_webpack_require_23535__(442);
var external_root_React_commonjs2_react_commonjs_react_amd_react_default = /*#__PURE__*/__nested_webpack_require_23535__.n(external_root_React_commonjs2_react_commonjs_react_amd_react_);
// EXTERNAL MODULE: ../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js
var injectStylesIntoStyleTag = __nested_webpack_require_23535__(591);
var injectStylesIntoStyleTag_default = /*#__PURE__*/__nested_webpack_require_23535__.n(injectStylesIntoStyleTag);
// EXTERNAL MODULE: ../../node_modules/style-loader/dist/runtime/styleDomAPI.js
var styleDomAPI = __nested_webpack_require_23535__(740);
var styleDomAPI_default = /*#__PURE__*/__nested_webpack_require_23535__.n(styleDomAPI);
// EXTERNAL MODULE: ../../node_modules/style-loader/dist/runtime/insertBySelector.js
var insertBySelector = __nested_webpack_require_23535__(128);
var insertBySelector_default = /*#__PURE__*/__nested_webpack_require_23535__.n(insertBySelector);
// EXTERNAL MODULE: ../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js
var setAttributesWithoutAttributes = __nested_webpack_require_23535__(855);
var setAttributesWithoutAttributes_default = /*#__PURE__*/__nested_webpack_require_23535__.n(setAttributesWithoutAttributes);
// EXTERNAL MODULE: ../../node_modules/style-loader/dist/runtime/insertStyleElement.js
var insertStyleElement = __nested_webpack_require_23535__(51);
var insertStyleElement_default = /*#__PURE__*/__nested_webpack_require_23535__.n(insertStyleElement);
// EXTERNAL MODULE: ../../node_modules/style-loader/dist/runtime/styleTagTransform.js
var styleTagTransform = __nested_webpack_require_23535__(656);
var styleTagTransform_default = /*#__PURE__*/__nested_webpack_require_23535__.n(styleTagTransform);
// EXTERNAL MODULE: ../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./src/index.scss
var cjs_ruleSet_1_rules_1_use_2_src = __nested_webpack_require_23535__(483);
; // CONCATENATED MODULE: ./src/index.scss
var options = {};
options.styleTagTransform = styleTagTransform_default();
options.setAttributes = setAttributesWithoutAttributes_default();
options.insert = insertBySelector_default().bind(null, "head");
options.domAPI = styleDomAPI_default();
options.insertStyleElement = insertStyleElement_default();
var update = injectStylesIntoStyleTag_default()(cjs_ruleSet_1_rules_1_use_2_src /* default */.A, options);
/* harmony default export */
const src = cjs_ruleSet_1_rules_1_use_2_src /* default */.A && cjs_ruleSet_1_rules_1_use_2_src /* default */.A.locals ? cjs_ruleSet_1_rules_1_use_2_src /* default */.A.locals : undefined;
; // CONCATENATED MODULE: ./src/utils/getAbsolutePosition.js
function getAbsolutePosition(domElement) {
let left = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
let top = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
if (!parseInt(left)) {
left = 0;
} else {
left = parseInt(left);
}
if (!parseInt(top)) {
top = 0;
} else {
top = parseInt(top);
}
const box = domElement.getBoundingClientRect();
const body = document.body;
const docElem = document.documentElement;
const scrollTop = window.pageYOffset || docElem.scrollTop || body.scrollTop;
const scrollLeft = window.pageXOffset || docElem.scrollLeft || body.scrollLeft;
const clientTop = docElem.clientTop || body.clientTop || 0;
const clientLeft = docElem.clientLeft || body.clientLeft || 0;
const attr = {};
attr.y = box.top + scrollTop - clientTop + top;
attr.x = box.left + scrollLeft - clientLeft + left;
attr.width = box.width;
attr.height = box.height;
return attr;
}
/* harmony default export */
const utils_getAbsolutePosition = getAbsolutePosition;
// EXTERNAL MODULE: external {"root":"ReactDOM","commonjs2":"react-dom","commonjs":"react-dom","amd":"react-dom"}
var external_root_ReactDOM_commonjs2_react_dom_commonjs_react_dom_amd_react_dom_ = __nested_webpack_require_23535__(3);
var external_root_ReactDOM_commonjs2_react_dom_commonjs_react_dom_amd_react_dom_default = /*#__PURE__*/__nested_webpack_require_23535__.n(external_root_ReactDOM_commonjs2_react_dom_commonjs_react_dom_amd_react_dom_);
; // CONCATENATED MODULE: ./src/index.tsx
// 引入样式文件
const Tooltip = _ref => {
var _text$trim;
let {
left,
right,
top,
bottom,
wrap = false,
width,
arrowOffsetPercent,
wrapperFlex,
mustShow,
show = true,
text,
position = "top",
children,
tooltipBgc = "#333",
tooltipFontColor,
arrowBorderColor = "#333",
wrapperClassname
} = _ref;
const [isShow, setIsShow] = (0, external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(false);
const [isVisible, setIsVisible] = (0, external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(false); // 用来实现当鼠标进入提示区域可以让提示存在的效果
const tooltipRef = (0, external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
// !!!用来记录鼠标是否进入提示区域
// 当鼠标离开内容区域的时候,去判断是否进入了提示区域,如果进入,则不隐藏提示文字
const isEnterTooltipRef = (0, external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(false);
const enterTimeoutRef = (0, external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
const [tooltipWidth, setTooltipWidth] = (0, external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(0);
const [tooltipHeight, setTooltipHeight] = (0, external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(0);
const contentRef = (0, external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
const [tooltipContentPosition, settooltipContentPosition] = (0, external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)({});
const handleMouseEnter = () => {
// 进入的时候,如果存在定时器,也清除掉
if (enterTimeoutRef.current) {
clearTimeout(enterTimeoutRef.current);
}
enterTimeoutRef.current = setTimeout(() => {
setIsShow(true);
setTimeout(() => {
setIsVisible(true);
}, 50);
}, 200); // 延迟100毫秒
};
const handleMouseLeave = () => {
if (mustShow) return;
if (enterTimeoutRef.current) {
clearTimeout(enterTimeoutRef.current);
}
setTimeout(() => {
if (!isEnterTooltipRef.current) {
setIsVisible(false);
}
}, 200);
setTimeout(() => {
if (!isEnterTooltipRef.current) {
setIsShow(false);
}
}, 300);
};
const handleClick = e => {
e.stopPropagation(); // 阻止事件的冒泡
};
/**
* 用来实现当鼠标进入提示区域可以让提示存在的效果
*/
const handleMouseEnterTooltip = () => {
isEnterTooltipRef.current = true;
// 如果当前是显示状态才能设置isVisible为true,不然鼠标移到提示区域也会展示
setIsVisible(true);
setTimeout(() => {
setIsShow(true);
}, 400);
};
const handleMouseLeaveTooltip = () => {
if (mustShow) return;
isEnterTooltipRef.current = false;
setTimeout(() => {
setIsVisible(false);
}, 200);
setTimeout(() => {
setIsShow(false);
}, 300);
};
// 注意:定位完 tooltipContentPosition 和 contentRef 之后,内容是向两边撑开的
// 所以需要计算一下 tooltipRef 的位置(- 是left,+ 是 right)
const calcTooltipContentTopAndLeft = () => {
var _tooltipRef$current, _contentRef$current, _tooltipRef$current2, _contentRef$current2, _tooltipRef$current3, _contentRef$current3;
const verticalTop = tooltipContentPosition.y - ((_tooltipRef$current = tooltipRef.current) === null || _tooltipRef$current === void 0 ? void 0 : _tooltipRef$current.clientHeight) - 8 + "px";
const verticalBottom = tooltipContentPosition.y + ((_contentRef$current = contentRef.current) === null || _contentRef$current === void 0 ? void 0 : _contentRef$current.clientHeight) + 5 + "px";
const horizontalLeft = tooltipContentPosition.x - ((_tooltipRef$current2 = tooltipRef.current) === null || _tooltipRef$current2 === void 0 ? void 0 : _tooltipRef$current2.clientWidth) + "px";
const horizontalTop = tooltipContentPosition.y + ((_contentRef$current2 = contentRef.current) === null || _contentRef$current2 === void 0 ? void 0 : _contentRef$current2.clientHeight) / 2 - ((_tooltipRef$current3 = tooltipRef.current) === null || _tooltipRef$current3 === void 0 ? void 0 : _tooltipRef$current3.clientHeight) / 2 + "px";
const content = tooltipContentPosition.x + ((_contentRef$current3 = contentRef.current) === null || _contentRef$current3 === void 0 ? void 0 : _contentRef$current3.clientWidth) / 2 + "px";
if (position === "top") {
return {
top: verticalTop,
left: content
};
} else if (position === "top-right") {
var _contentRef$current4, _tooltipRef$current4;
return {
top: verticalTop,
left: tooltipContentPosition.x + ((_contentRef$current4 = contentRef.current) === null || _contentRef$current4 === void 0 ? void 0 : _contentRef$current4.clientWidth) / 2 + ((_tooltipRef$current4 = tooltipRef.current) === null || _tooltipRef$current4 === void 0 ? void 0 : _tooltipRef$current4.clientWidth) / 2 + "px"
};
} else if (position === "top-left") {
var _contentRef$current5, _tooltipRef$current5;
return {
top: verticalTop,
left: tooltipContentPosition.x + ((_contentRef$current5 = contentRef.current) === null || _contentRef$current5 === void 0 ? void 0 : _contentRef$current5.clientWidth) / 2 - ((_tooltipRef$current5 = tooltipRef.current) === null || _tooltipRef$current5 === void 0 ? void 0 : _tooltipRef$current5.clientWidth) / 2 + "px"
};
} else if (position === "bottom") {
return {
top: verticalBottom,
left: content
};
} else if (position === "bottom-right") {
var _tooltipRef$current6, _contentRef$current6;
return {
top: verticalBottom,
left: tooltipContentPosition.x + ((_tooltipRef$current6 = tooltipRef.current) === null || _tooltipRef$current6 === void 0 ? void 0 : _tooltipRef$current6.clientWidth) / 2 + ((_contentRef$current6 = contentRef.current) === null || _contentRef$current6 === void 0 ? void 0 : _contentRef$current6.clientWidth) / 2 + "px"
};
} else if (position === "bottom-left") {
var _contentRef$current7, _tooltipRef$current7;
return {
top: verticalBottom,
left: tooltipContentPosition.x + ((_contentRef$current7 = contentRef.current) === null || _contentRef$current7 === void 0 ? void 0 : _contentRef$current7.clientWidth) / 2 - ((_tooltipRef$current7 = tooltipRef.current) === null || _tooltipRef$current7 === void 0 ? void 0 : _tooltipRef$current7.clientWidth) / 2 + "px"
};
} else if (position === "left") {
var _contentRef$current8;
return {
top: tooltipContentPosition.y + ((_contentRef$current8 = contentRef.current) === null || _contentRef$current8 === void 0 ? void 0 : _contentRef$current8.clientHeight) / 2 + "px",
left: horizontalLeft
};
} else if (position === "left-top") {
return {
top: horizontalTop,
left: horizontalLeft
};
} else if (position === "left-bottom") {
var _contentRef$current9, _tooltipRef$current8;
return {
top: tooltipContentPosition.y + ((_contentRef$current9 = contentRef.current) === null || _contentRef$current9 === void 0 ? void 0 : _contentRef$current9.clientHeight) / 2 + ((_tooltipRef$current8 = tooltipRef.current) === null || _tooltipRef$current8 === void 0 ? void 0 : _tooltipRef$current8.clientHeight) / 2 + "px",
left: horizontalLeft
};
} else if (position === "right") {
var _contentRef$current10, _contentRef$current11;
return {
top: tooltipContentPosition.y + ((_contentRef$current10 = contentRef.current) === null || _contentRef$current10 === void 0 ? void 0 : _contentRef$current10.clientHeight) / 2 + "px",
left: tooltipContentPosition.x + ((_contentRef$current11 = contentRef.current) === null || _contentRef$current11 === void 0 ? void 0 : _contentRef$current11.clientWidth) + "px"
};
} else if (position === "right-top") {
var _contentRef$current12;
return {
top: horizontalTop,
left: tooltipContentPosition.x + ((_contentRef$current12 = contentRef.current) === null || _contentRef$current12 === void 0 ? void 0 : _contentRef$current12.clientWidth) + "px"
};
} else if (position === "right-bottom") {
var _contentRef$current13, _tooltipRef$current9, _contentRef$current14;
return {
top: tooltipContentPosition.y + ((_contentRef$current13 = contentRef.current) === null || _contentRef$current13 === void 0 ? void 0 : _contentRef$current13.clientHeight) / 2 + ((_tooltipRef$current9 = tooltipRef.current) === null || _tooltipRef$current9 === void 0 ? void 0 : _tooltipRef$current9.clientHeight) / 2 + "px",
left: tooltipContentPosition.x + ((_contentRef$current14 = contentRef.current) === null || _contentRef$current14 === void 0 ? void 0 : _contentRef$current14.clientWidth) + "px"
};
}
};
const calcTooltipArrowTopAndLeft = () => {
var _contentRef$current15, _contentRef$current16;
// top 和 bottom 的属性
const commonArrowOfsset = "-8px";
const horizontal = tooltipWidth * (arrowOffsetPercent || 0.2);
const minHorizontal = ((_contentRef$current15 = contentRef.current) === null || _contentRef$current15 === void 0 ? void 0 : _contentRef$current15.clientWidth) / 4;
const finalHorizontal = horizontal > minHorizontal ? minHorizontal : horizontal + "px";
// left 和 right 的属性
const vertival = tooltipHeight * (arrowOffsetPercent || 0.2);
const minVertival = ((_contentRef$current16 = contentRef.current) === null || _contentRef$current16 === void 0 ? void 0 : _contentRef$current16.clientHeight) / 4;
const finalVertival = vertival > minVertival ? minVertival : vertival + "px";
if (position === "top") {
return {
bottom: commonArrowOfsset,
left: "50%",
"border-color": "".concat(arrowBorderColor, " transparent transparent transparent")
};
} else if (position === "top-left") {
return {
bottom: commonArrowOfsset,
right: right || finalHorizontal,
"border-color": "".concat(arrowBorderColor, " transparent transparent transparent")
};
} else if (position === "top-right") {
return {
bottom: commonArrowOfsset,
left: left || finalHorizontal,
"border-color": "".concat(arrowBorderColor, " transparent transparent transparent")
};
} else if (position === "bottom") {
return {
top: commonArrowOfsset,
left: "50%",
"border-color": "transparent transparent ".concat(arrowBorderColor, " transparent")
};
} else if (position === "bottom-right") {
return {
top: commonArrowOfsset,
left: left || finalHorizontal,
"border-color": "transparent transparent ".concat(arrowBorderColor, " transparent")
};
} else if (position === "bottom-left") {
return {
top: commonArrowOfsset,
right: right || finalHorizontal,
"border-color": "transparent transparent ".concat(arrowBorderColor, " transparent")
};
} else if (position === "left-top") {
return {
bottom: bottom || finalVertival,
right: commonArrowOfsset,
"border-color": "transparent transparent transparent ".concat(arrowBorderColor)
};
} else if (position === "left-bottom") {
return {
top: top || finalVertival,
right: "-9px",
"border-color": "transparent transparent transparent ".concat(arrowBorderColor)
};
} else if (position === "right") {
return {
top: "50%",
left: commonArrowOfsset,
"border-color": "transparent ".concat(arrowBorderColor, " transparent transparent")
};
} else if (position === "right-top") {
return {
bottom: bottom || finalVertival,
left: commonArrowOfsset,
"border-color": "transparent ".concat(arrowBorderColor, " transparent transparent")
};
} else if (position === "right-bottom") {
return {
top: top || finalVertival,
left: commonArrowOfsset,
"border-color": "transparent ".concat(arrowBorderColor, " transparent transparent")
};
}
};
(0, external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(() => {
if (mustShow) {
handleMouseEnter();
} else {
handleMouseLeave();
}
}, [mustShow]);
(0, external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(() => {
if (tooltipRef.current) {
const tooltipElement = tooltipRef.current;
setTooltipWidth(tooltipElement.offsetWidth);
setTooltipHeight(tooltipElement.offsetHeight);
}
if (isShow) {
const position = utils_getAbsolutePosition(contentRef.current,