优化divider组件

Imshann
1 parent ca196a72
Showing 5 changed files with 87 additions and 14 deletions Show diff stats
build/Common/Common.js
build/Divider/Divider.js
dist/ng-antd.js
package.json
yarn.lock
 import baseStyle from "antd/lib/style/index.css";
-angular.module("esNgAntd").directive(function () {
-  return {
-    restrict: "E",
-    replace: true,
-    transclude: true
+angular.module("esNgAntd").service("esNgAntd", ["$compile", function ($compile) {
+  this.styleSheets = null;
+  this.conflictType = null;
+
+  this.createStyle = function (key, style) {
+    if (!document.querySelector("#antd")) {
+      let styleElement = document.createElement("style");
+      styleElement.setAttribute("id", "antd");
+      styleElement.setAttribute("type", "text/css");
+      styleElement.innerHTML = baseStyle.toString();
+      document.head.appendChild(styleElement);
+
+      if (this.styleSheets) {
+        this.disableStyle("anticon");
+      }
+    }
+
+    if (!document.querySelector("#" + key)) {
+      let styleElement = document.createElement("style");
+      styleElement.setAttribute("id", key);
+      styleElement.setAttribute("type", "text/css");
+      styleElement.innerHTML = style.toString();
+      document.head.appendChild(styleElement);
+
+      if (this.styleSheets) {
+        this.disableStyle(key);
+      }
+    }
   };
-});
 \ No newline at end of file
+
+  this.disableStyle = function (name) {
+    for (let i = 0; i < this.styleSheets.cssRules.length; i++) {
+      let rule = this.styleSheets.cssRules[i];
+
+      if (rule.selectorText && rule.selectorText.indexOf(name) !== -1 && rule.selectorText.indexOf("ant3") === -1) {
+        rule.selectorText = rule.selectorText.split(",").map(function (item) {
+          return ".ant3 " + item;
+        }).join(",");
+      }
+    }
+  };
+
+  this.conflict = function (filename, type) {
+    this.conflictType = type;
+
+    for (let i = 0; i < document.styleSheets.length; i++) {
+      const element = document.styleSheets[i];
+
+      if (element.href && element.href.indexOf(filename) !== -1) {
+        this.styleSheets = element;
+      }
+    }
+  };
+
+  this.clearAttribute = function (element, attrs) {
+    for (const attr of attrs) {
+      element.removeAttribute(attr);
+    }
+  };
+
+  this.createLayer = function (content, scope) {
+    let div = document.createElement("div");
+    div.innerHTML = content;
+    document.body.appendChild(div);
+    $compile(div)(scope);
+  };
+
+  this.getOffset = function (ele) {
+    if (!ele || ele.nodeType != 1) {
+      return;
+    }
+
+    let rect = ele.getBoundingClientRect();
+    let doc = ele.ownerDocument.documentElement;
+    return {
+      top: rect.top + window.pageYOffset - doc.clientTop,
+      left: rect.left + window.pageXOffset - doc.clientLeft
+    };
+  };
+}]);
 \ No newline at end of file
-import style from "antd/lib/divider/style/index.css";
 import template from "./Divider.html";
+import style from "antd/lib/divider/style/index.css";
 angular.module("esNgAntd").directive("antdDivider", ["esNgAntd", function (esNgAntd) {
   return {
     template: template,
@@ -104,7 +104,7 @@ eval(&quot;__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Col
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var antd_lib_style_index_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! antd/lib/style/index.css */ \"./node_modules/antd/lib/style/index.css\");\n\nangular.module(\"esNgAntd\").directive(function () {\n  return {\n    restrict: \"E\",\n    replace: true,\n    transclude: true\n  };\n});\n\n//# sourceURL=webpack://ng-antd/./build/Common/Common.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var antd_lib_style_index_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! antd/lib/style/index.css */ \"./node_modules/antd/lib/style/index.css\");\n\nangular.module(\"esNgAntd\").service(\"esNgAntd\", [\"$compile\", function ($compile) {\n  this.styleSheets = null;\n  this.conflictType = null;\n\n  this.createStyle = function (key, style) {\n    if (!document.querySelector(\"#antd\")) {\n      let styleElement = document.createElement(\"style\");\n      styleElement.setAttribute(\"id\", \"antd\");\n      styleElement.setAttribute(\"type\", \"text/css\");\n      styleElement.innerHTML = antd_lib_style_index_css__WEBPACK_IMPORTED_MODULE_0__[\"default\"].toString();\n      document.head.appendChild(styleElement);\n\n      if (this.styleSheets) {\n        this.disableStyle(\"anticon\");\n      }\n    }\n\n    if (!document.querySelector(\"#\" + key)) {\n      let styleElement = document.createElement(\"style\");\n      styleElement.setAttribute(\"id\", key);\n      styleElement.setAttribute(\"type\", \"text/css\");\n      styleElement.innerHTML = style.toString();\n      document.head.appendChild(styleElement);\n\n      if (this.styleSheets) {\n        this.disableStyle(key);\n      }\n    }\n  };\n\n  this.disableStyle = function (name) {\n    for (let i = 0; i < this.styleSheets.cssRules.length; i++) {\n      let rule = this.styleSheets.cssRules[i];\n\n      if (rule.selectorText && rule.selectorText.indexOf(name) !== -1 && rule.selectorText.indexOf(\"ant3\") === -1) {\n        rule.selectorText = rule.selectorText.split(\",\").map(function (item) {\n          return \".ant3 \" + item;\n        }).join(\",\");\n      }\n    }\n  };\n\n  this.conflict = function (filename, type) {\n    this.conflictType = type;\n\n    for (let i = 0; i < document.styleSheets.length; i++) {\n      const element = document.styleSheets[i];\n\n      if (element.href && element.href.indexOf(filename) !== -1) {\n        this.styleSheets = element;\n      }\n    }\n  };\n\n  this.clearAttribute = function (element, attrs) {\n    for (const attr of attrs) {\n      element.removeAttribute(attr);\n    }\n  };\n\n  this.createLayer = function (content, scope) {\n    let div = document.createElement(\"div\");\n    div.innerHTML = content;\n    document.body.appendChild(div);\n    $compile(div)(scope);\n  };\n\n  this.getOffset = function (ele) {\n    if (!ele || ele.nodeType != 1) {\n      return;\n    }\n\n    let rect = ele.getBoundingClientRect();\n    let doc = ele.ownerDocument.documentElement;\n    return {\n      top: rect.top + window.pageYOffset - doc.clientTop,\n      left: rect.left + window.pageXOffset - doc.clientLeft\n    };\n  };\n}]);\n\n//# sourceURL=webpack://ng-antd/./build/Common/Common.js?");
 /***/ }),
@@ -115,7 +115,7 @@ eval(&quot;__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var antd
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Divider_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Divider.html */ \"./build/Divider/Divider.html\");\n/* harmony import */ var antd_lib_divider_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/divider/style/index.css */ \"./node_modules/antd/lib/divider/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdDivider\", function (esNgAntd) {\n    return {\n        controllerAs: \"antdDivider\",\n        restrict: \"E\",\n        transclude: true,\n        replace: true,\n        template: _Divider_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n        link: function ($scope, $element, $attrs, $controllers, $transclude) {\n            esNgAntd.createStyle(\"ant-divider\", antd_lib_divider_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n        },\n    };\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/Divider/Divider.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Divider_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Divider.html */ \"./build/Divider/Divider.html\");\n/* harmony import */ var antd_lib_divider_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/divider/style/index.css */ \"./node_modules/antd/lib/divider/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdDivider\", [\"esNgAntd\", function (esNgAntd) {\n  return {\n    template: _Divider_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n    restrict: \"E\",\n    replace: true,\n    transclude: true,\n    link: function ($scope) {\n      esNgAntd.createStyle(\"ant-divider\", antd_lib_divider_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n    }\n  };\n}]);\n\n//# sourceURL=webpack://ng-antd/./build/Divider/Divider.js?");
 /***/ }),
@@ -12,7 +12,7 @@
     "devDependencies": {
         "@ant-design/icons-svg": "^4.2.1",
         "antd": "^4.18.2",
-        "beanboom": "^0.9.8",
+        "beanboom": "^0.9.9",
         "css-loader": "^6.5.1",
         "html-loader": "^3.0.1",
         "style-loader": "^3.3.1",
@@ -1320,10 +1320,10 @@ babel-plugin-polyfill-regenerator@^0.2.3:
   dependencies:
     "@babel/helper-define-polyfill-provider" "^0.2.4"
-beanboom@^0.9.8:
-  version "0.9.8"
-  resolved "https://registry.npmmirror.com/beanboom/-/beanboom-0.9.8.tgz#1b6512af484e2e302da9a1d4d48428a0c2bc7763"
-  integrity sha512-liLptwNuZqFxsCjkmQ0AByvQ30mmKqrUYn++DoyErnxKuvfYutWeloXcd3abW3BN6eHlxycrr7ft4Ha+qlXNcw==
+beanboom@^0.9.9:
+  version "0.9.9"
+  resolved "https://registry.npmmirror.com/beanboom/-/beanboom-0.9.9.tgz#a055a5d404cba9e50ada5862bec0bc7f3ae3d427"
+  integrity sha512-hEkZ2IcEXT50T20OeZiaGUjQwlGTY3vMAqVOfKd/HqRzZIXD05Jv6xeimoW43HnFs5QDOveK5n9kahimURvf3w==
   dependencies:
     "@babel/core" "^7.12.10"
     "@babel/plugin-proposal-class-properties" "^7.13.0"