bkui-vue 0.0.1-beta.30 → 0.0.1-beta.31

package/dist/bkui-vue.umd.js

@@ -81,6 +81,7 @@ var __publicField = (obj, key, value) => {
   var transfer = "";
   var pagination = "";
   var timeline = "";
+  var codeDiff = "";
   var resizeLayout = "";
   var tagInput = "";
   const BKLAYERD_INDEX_EFAULT_VALUE = {
@@ -8462,6 +8463,7 @@ ${$(r2)}`), n2;
       type: Function
     },
     loading: PropTypes.bool,
+    inline: PropTypes.bool.def(true),
     theme: PropTypes.theme(["white", "primary", "warning", "success", "danger"]),
     title: PropTypes.string.def(""),
     size: PropTypes.commonType(Object.values(BkLoadingSize)).def(BkLoadingSize.Normal),
@@ -8480,9 +8482,9 @@ ${$(r2)}`), n2;
         "class": `oval oval-${i2}`
       }, null))]);
       const loadingWrapperCls = vue.computed(() => classes({
+        "bk-loading-wrapper": props.loading,
         "bk-nested-loading": !!ctx.slots.default
-      }, "bk-loading-wrapper"));
-      console.log(props.theme);
+      }));
       const containerCls = vue.computed(() => classes({
         [`bk-loading-size-${props.size}`]: !!props.size,
         [`bk-loading-${props.theme}`]: !!props.theme
@@ -8500,15 +8502,15 @@ ${$(r2)}`), n2;
       });
       return () => {
         var _a, _b;
-        return ctx.slots.default && !props.loading ? (_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a) : vue.createVNode("div", {
+        return vue.createVNode("div", {
           "class": loadingWrapperCls.value
-        }, [vue.createVNode("div", {
+        }, [props.loading && vue.createVNode(vue.Fragment, null, [vue.createVNode("div", {
           "class": containerCls.value
         }, [indicator.value, hasTitle.value && vue.createVNode("div", {
           "class": "bk-loading-title"
         }, [props.title])]), ctx.slots.default && vue.createVNode("div", {
           "class": "bk-loading-mask"
-        }, [ctx.slots.default()])]);
+        }, null)]), (_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)]);
       };
     }
   });
@@ -11712,7 +11714,7 @@ ${$(r2)}`), n2;
     }
   });
   const BkSwitcher = withInstall(Component$7);
-  const EventProps$1 = {
+  const EventProps = {
     onContentScroll: Function
   };
   const virtualRenderProps = __spreadValues({
@@ -11735,7 +11737,7 @@ ${$(r2)}`), n2;
     scrollPosition: PropTypes.string.def("content"),
     abosuteHeight: PropTypes.oneOfType([PropTypes.string.def("auto"), PropTypes.number]).def("auto"),
     throttleDelay: PropTypes.number.def(60)
-  }, EventProps$1);
+  }, EventProps);
   function getMatchedIndex(maxCount, maxHeight, groupItemCount, callback) {
     let startIndex = 0;
     let height = 0;
@@ -11964,10 +11966,7 @@ ${$(r2)}`), n2;
   });
   const BkVirtualRender = withInstall(Component$6);
   const BORDER_OPRIONS = ["none", "row", "col", "outer"];
-  const EventProps = {
-    onRowClick: Function
-  };
-  const tableProps = __spreadValues({
+  const tableProps = {
     data: PropTypes.arrayOf(PropTypes.any).def([]),
     columns: PropTypes.arrayOf(PropTypes.shape({
       label: PropTypes.oneOfType([PropTypes.func.def(() => ""), PropTypes.string.def("")]),
@@ -11986,7 +11985,7 @@ ${$(r2)}`), n2;
     border: PropTypes.arrayOf(PropTypes.commonType(BORDER_OPRIONS, "border")).def(["row"]),
     pagination: PropTypes.oneOfType([PropTypes.bool.def(false), PropTypes.object.def({})]).def(false),
     remotePagination: PropTypes.bool.def(false)
-  }, EventProps);
+  };
   function _isSlot(s2) {
     return typeof s2 === "function" || Object.prototype.toString.call(s2) === "[object Object]" && !vue.isVNode(s2);
   }
@@ -12367,7 +12366,7 @@ ${$(r2)}`), n2;
   var Component$5 = vue.defineComponent({
     name: "Pagination",
     props: paginationProps,
-    emits: ["update:modelValue", "change", "update:limit", "limit-change"],
+    emits: ["update:modelValue", "change", "update:limit", "limitChange"],
     setup(props, context) {
       const totalPageNum = vue.ref(0);
       const {
@@ -12402,7 +12401,7 @@ ${$(r2)}`), n2;
         context.emit("change", smallListCurrent2);
       });
       vue.watch(localLimit, (localLimit2) => {
-        context.emit("limit-change", localLimit2);
+        context.emit("limitChange", localLimit2);
       });
       return {
         totalPageNum,
@@ -12607,14 +12606,14 @@ ${$(r2)}`), n2;
       Object.assign(this.props.pagination, {
         limit
       });
-      this.context.emit("page-limit-change", limit);
+      this.context.emit("pageLimitChange", limit);
     }
     hanlePageChange(current) {
       Object.assign(this.props.pagination, {
         current,
         value: current
       });
-      this.context.emit("page-value-change", current);
+      this.context.emit("pageValueChange", current);
     }
     setColumnActive(index, single = false) {
       const col = this.propActiveCols.find((item) => item.index === index);
@@ -12699,7 +12698,7 @@ ${$(r2)}`), n2;
   var Component$4 = vue.defineComponent({
     name: "Table",
     props: tableProps,
-    emits: ["column-pick", "row-click", "page-limit-change", "page-value-change"],
+    emits: ["columnPick", "rowClick", "pageLimitChange", "pageValueChange"],
     setup(props, ctx) {
       const activeCols = vue.reactive(resolveActiveColumns(props));
       const colgroups = vue.reactive(props.columns.map((col) => __spreadProps(__spreadValues({}, col), {
@@ -13765,15 +13764,16 @@ ${$(r2)}`), n2;
   TagInput.install = (Vue) => {
     Vue.component(TagInput.name, TagInput);
   };
+  const dividerProps = {
+    direction: PropTypes.commonType(["horizontal", "vertical"], "direction").def("horizontal"),
+    align: PropTypes.commonType(["left", "center", "right"], "align").def("center"),
+    color: PropTypes.string.def("#dde4eb"),
+    width: PropTypes.number.def(1),
+    type: PropTypes.commonType(["dashed", "solid"], "lineType").def("dashed")
+  };
   var bkDivider = vue.defineComponent({
     name: "Divider",
-    props: {
-      direction: PropTypes.commonType(["horizontal", "vertical"], "direction").def("horizontal"),
-      align: PropTypes.commonType(["left", "center", "right"], "align").def("center"),
-      color: PropTypes.string.def("#dde4eb"),
-      width: PropTypes.number.def(1),
-      type: PropTypes.commonType(["dashed", "solid"], "lineType").def("dashed")
-    },
+    props: dividerProps,
     render() {
       const styles = () => {
         if (this.direction === "vertical") {
@@ -13798,46 +13798,73 @@ ${$(r2)}`), n2;
     }
   });
   const BkDivider = withInstall(bkDivider);
+  const tabNavEventProps = {
+    tabAdd: {
+      type: Function,
+      default: () => ({})
+    },
+    tabChange: {
+      type: Function,
+      default: (name) => name
+    },
+    tabRemove: {
+      type: Function,
+      default: (name) => name
+    },
+    tabSort: {
+      type: Function,
+      default: () => ({})
+    },
+    tabDrag: {
+      type: Function,
+      default: () => ({})
+    }
+  };
+  const tabProps = {
+    active: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).def(""),
+    type: PropTypes.commonType(["card", "border-card", "unborder-card"], "type").def("border-card"),
+    tabPosition: PropTypes.commonType(["left", "right", "top"], "position").def("top"),
+    closable: Boolean,
+    addable: Boolean,
+    sortable: Boolean,
+    sortType: PropTypes.commonType(["replace", "insert", "top"], "sortType").def("replace"),
+    labelHeight: PropTypes.number.def(50),
+    scrollStep: PropTypes.number.def(200),
+    extCls: PropTypes.string.def(""),
+    validateActive: PropTypes.bool.def(true),
+    showHeader: PropTypes.bool.def(true),
+    changeOnHover: PropTypes.bool.def(false),
+    changeOnHoverDelay: PropTypes.number.def(1e3)
+  };
+  const tabNavProps = __spreadValues({
+    active: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).def(""),
+    panels: {
+      type: Array,
+      default: () => []
+    },
+    closable: Boolean,
+    addable: Boolean,
+    sortable: Boolean,
+    sortType: PropTypes.commonType(["replace", "insert", "top"], "sortType").def("replace"),
+    labelHeight: PropTypes.number.def(50),
+    scrollStep: PropTypes.number.def(200),
+    validateActive: PropTypes.bool.def(true),
+    changeOnHover: PropTypes.bool.def(false),
+    changeOnHoverDelay: PropTypes.number.def(1e3)
+  }, tabNavEventProps);
+  const tabPanelProps = {
+    name: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).def(""),
+    label: PropTypes.string || PropTypes.func,
+    closable: PropTypes.bool,
+    visible: PropTypes.bool.def(true),
+    disabled: PropTypes.bool,
+    sortable: PropTypes.bool,
+    renderDirective: PropTypes.commonType(["if", "show"], "render").def("show"),
+    panel: PropTypes.string || PropTypes.func
+  };
   var TabNav = vue.defineComponent({
     name: "TabNav",
-    props: {
-      active: {
-        type: String || Number
-      },
-      panels: {
-        type: Array,
-        default: () => []
-      },
-      closable: PropTypes.bool.def(false),
-      addable: PropTypes.bool.def(false),
-      sortable: PropTypes.bool.def(false),
-      sortType: PropTypes.commonType(["replace", "insert", "top"], "sortType").def("replace"),
-      labelHeight: PropTypes.number.def(50),
-      scrollStep: PropTypes.number.def(200),
-      validateActive: PropTypes.bool.def(true),
-      changeOnHover: PropTypes.bool.def(false),
-      changeOnHoverDelay: PropTypes.number.def(1e3),
-      tabAdd: {
-        type: Function,
-        default: () => ({})
-      },
-      tabChange: {
-        type: Function,
-        default: () => ({})
-      },
-      tabRemove: {
-        type: Function,
-        default: () => ({})
-      },
-      tabSort: {
-        type: Function,
-        default: () => ({})
-      },
-      tabDrag: {
-        type: Function,
-        default: () => ({})
-      }
-    },
+    props: tabNavProps,
     setup(props) {
       const navs = vue.computed(() => {
         if (!Array.isArray(props.panels) || !props.panels.length) {
@@ -13908,18 +13935,15 @@ ${$(r2)}`), n2;
       distinctRoots(el1, el2) {
         return el1 === el2;
       },
-      swapArr(arr, a2, b2) {
-        const swap = arr[a2];
-        arr[a2] = arr[b2];
-        arr[b2] = swap;
-      },
       handleTabAdd(e) {
         this.tabAdd(e);
       },
       dragstart(index, $event) {
         this.dragStartIndex = index;
         this.draggingEle = this.guid;
-        $event.dataTransfer.effectAllowed = "move";
+        Object.assign($event.dataTransfer, {
+          effectAllowed: "move"
+        });
         this.tabDrag(index, $event);
       },
       dragenter(index) {
@@ -13936,20 +13960,7 @@ ${$(r2)}`), n2;
         if (!this.distinctRoots(this.draggingEle, this.guid)) {
           return false;
         }
-        if (sortType === "insert") {
-          if (this.dragStartIndex < index) {
-            this.panels.splice(index + 1, 0, this.panels[this.dragStartIndex]);
-            this.panels.splice(this.dragStartIndex, 1);
-          } else if (this.dragStartIndex > index) {
-            this.panels.splice(index, 0, this.panels[this.dragStartIndex]);
-            this.panels.splice(this.dragStartIndex + 1, 1);
-          } else {
-            return false;
-          }
-        } else {
-          this.swapArr(this.panels, this.dragStartIndex, index);
-        }
-        this.tabSort(this.dragStartIndex, index);
+        this.tabSort(this.dragStartIndex, index, sortType);
       },
       handleTabChange(name) {
         this.tabChange(name);
@@ -13990,7 +14001,7 @@ ${$(r2)}`), n2;
           }
           return classNames.join(" ");
         };
-        const getValue = (value, value2) => typeof value === "boolean" ? value : value2;
+        const getValue = (curentValue, parentValue) => curentValue || parentValue;
         return vue.createVNode("div", {
           "key": name,
           "onClick": () => this.handleTabChange(name),
@@ -14022,26 +14033,29 @@ ${$(r2)}`), n2;
       });
       const renderSlot = () => {
         var _a, _b, _c, _d;
-        let addSlot;
         const list = [];
         if (typeof this.$slots.add === "function") {
-          addSlot = (_b = (_a = this.$slots).add) == null ? void 0 : _b.call(_a, vue.h);
+          list.push((_b = (_a = this.$slots).add) == null ? void 0 : _b.call(_a, vue.h));
         } else if (addable) {
-          addSlot = vue.createVNode("div", {
+          list.push(vue.createVNode("div", {
             "onClick": this.handleTabAdd
           }, [vue.createVNode(plus, {
             "width": 26,
             "height": 26
-          }, null)]);
+          }, null)]));
         }
-        list.push(addSlot);
         if (typeof this.$slots.setting === "function") {
           list.push((_d = (_c = this.$slots).setting) == null ? void 0 : _d.call(_c, vue.h));
         }
-        return list.map((item, index) => vue.createVNode("div", {
-          "class": "bk-tab-header-item",
-          "key": index
-        }, [item]));
+        if (list.length) {
+          return vue.createVNode("div", {
+            "class": "bk-tab-header-operation"
+          }, [list.map((item, index) => vue.createVNode("div", {
+            "class": "bk-tab-header-item",
+            "key": index
+          }, [item]))]);
+        }
+        return null;
       };
       return vue.createVNode("div", {
         "style": {
@@ -14050,9 +14064,7 @@ ${$(r2)}`), n2;
         "class": "bk-tab-header"
       }, [vue.createVNode("div", {
         "class": "bk-tab-header-nav"
-      }, [renderNavs()]), vue.createVNode("div", {
-        "class": "bk-tab-header-operation"
-      }, [renderSlot()])]);
+      }, [renderNavs()]), renderSlot()]);
     }
   });
   var Tab = vue.defineComponent({
@@ -14060,28 +14072,11 @@ ${$(r2)}`), n2;
     components: {
       TabNav
     },
-    props: {
-      active: {
-        type: String || Number
-      },
-      type: PropTypes.commonType(["card", "border-card", "unborder-card"], "type").def("border-card"),
-      tabPosition: PropTypes.commonType(["left", "right", "top"], "position").def("top"),
-      closable: PropTypes.bool.def(false),
-      addable: PropTypes.bool.def(false),
-      sortable: PropTypes.bool.def(false),
-      sortType: PropTypes.commonType(["replace", "insert", "top"], "sortType").def("replace"),
-      labelHeight: PropTypes.number.def(50),
-      scrollStep: PropTypes.number.def(200),
-      extCls: PropTypes.string.def(""),
-      validateActive: PropTypes.bool.def(true),
-      showHeader: PropTypes.bool.def(true),
-      changeOnHover: PropTypes.bool.def(false),
-      changeOnHoverDelay: PropTypes.number.def(1e3)
-    },
+    props: tabProps,
     emits: [
       "add-panel",
       "tab-change",
-      "close-panel",
+      "remove-panel",
       "sort-change",
       "on-drag-tab",
       "add",
@@ -14098,7 +14093,7 @@ ${$(r2)}`), n2;
       const panels = vue.ref([]);
       const instance = vue.getCurrentInstance();
       if (typeof slots.panel === "function") {
-        panels.value = slots.default();
+        panels.value = slots.panel();
       }
       if (typeof slots.default === "function") {
         panels.value = slots.default();
@@ -14163,11 +14158,26 @@ ${$(r2)}`), n2;
       },
       tabRemove(index, panel) {
         this.$emit("remove", index, panel);
-        this.$emit("close-panel", index, panel);
+        this.$emit("remove-panel", index, panel);
       },
-      tabSort(dragTabIndex, dropTabIndex) {
-        this.$emit("sort", dragTabIndex, dropTabIndex);
-        this.$emit("sort-change", dragTabIndex, dropTabIndex);
+      tabSort(dragTabIndex, dropTabIndex, sortType) {
+        if (sortType === "insert") {
+          if (dragTabIndex < dropTabIndex) {
+            this.panels.splice(dropTabIndex + 1, 0, this.panels[dragTabIndex]);
+            this.panels.splice(dragTabIndex, 1);
+          } else if (dragTabIndex > dropTabIndex) {
+            this.panels.splice(dropTabIndex, 0, this.panels[dragTabIndex]);
+            this.panels.splice(dragTabIndex + 1, 1);
+          } else {
+            return false;
+          }
+        } else {
+          const swap = this.panels[dropTabIndex];
+          this.panels[dropTabIndex] = this.panels[dragTabIndex];
+          this.panels[dragTabIndex] = swap;
+        }
+        this.$emit("sort", dragTabIndex, dropTabIndex, sortType);
+        this.$emit("sort-change", dragTabIndex, dropTabIndex, sortType);
       },
       tabDrag(dragTabIndex, dragEvent) {
         this.$emit("drag", dragTabIndex, dragEvent);
@@ -14235,18 +14245,7 @@ ${$(r2)}`), n2;
   });
   var TabPanel = vue.defineComponent({
     name: "TabPanel",
-    props: {
-      name: {
-        type: String || Number
-      },
-      label: String || Function,
-      closable: Function || Boolean,
-      visible: PropTypes.bool.def(true),
-      disabled: PropTypes.bool.def(null) || void 0,
-      sortable: Function || Boolean,
-      renderDirective: PropTypes.commonType(["if", "show"], "render").def("show"),
-      panel: String || Function
-    },
+    props: tabPanelProps,
     render() {
       const active = this.name === this.$parent.active;
       const getContent = () => {
@@ -14270,8 +14269,7 @@ ${$(r2)}`), n2;
       }, [getContent()]), [[vue.vShow, active]]);
     }
   });
-  const BKTab = withInstall(Tab);
-  const BKTabPanel = withInstall(TabPanel);
+  const BkTab = withInstallProps(Tab, { TabPanel });
   const instances = {
     "top-left": [],
     "top-right": [],
@@ -20128,8 +20126,8 @@ ${$(r2)}`), n2;
     Tag: BkTag,
     TagInput,
     Divider: BkDivider,
-    Tab: BKTab,
-    TabPanel: BKTabPanel,
+    Tab: BkTab,
+    TabPanel,
     Message,
     Notify,
     Menu: BkMenu,
@@ -20197,8 +20195,8 @@ ${$(r2)}`), n2;
   exports2.Steps = BkSteps;
   exports2.Swiper = BkSwiper;
   exports2.Switcher = BkSwitcher;
-  exports2.Tab = BKTab;
-  exports2.TabPanel = BKTabPanel;
+  exports2.Tab = BkTab;
+  exports2.TabPanel = TabPanel;
   exports2.Table = BkTable;
   exports2.Tag = BkTag;
   exports2.TagInput = TagInput;

package/dist/style.css

@@ -1409,13 +1409,18 @@ optgroup {
 }
 .bk-loading-wrapper {
   position: static;
-  display: inline-block;
   font-size: 0;
   vertical-align: middle;
 }
+.bk-loading-wrapper:not(.bk-nested-loading) {
+  display: inline-block;
+}
 .bk-loading-wrapper.bk-nested-loading {
   position: relative;
 }
+.bk-loading-wrapper.bk-nested-loading.is-block {
+  display: block;
+}
 .bk-loading-wrapper.bk-nested-loading .bk-loading-indicator {
   position: absolute;
   top: 50%;
@@ -1449,6 +1454,7 @@ optgroup {
   animation-direction: normal;
 }
 .bk-loading-wrapper .bk-loading-mask {
+  position: absolute;
   width: 100%;
   height: 100%;
   opacity: 0.5;
@@ -1462,7 +1468,7 @@ optgroup {
   z-index: 10;
   width: 100%;
   height: 100%;
-  background-color: rgba(255, 255, 255, 0.9);
+  background-color: rgba(255, 255, 255, 0.8);
   content: '';
 }
 .bk-loading-wrapper .bk-loading-indicator {
@@ -4456,7 +4462,7 @@ span.bk-date-picker-cells-cell-disabled.bk-date-picker-cells-cell-selected em {
 }
 .bk-tab-header-item:hover .bk-tab-header-item-close {
   display: block;
-  margin-left: 10px;
+  margin-left: 5px;
   color: #ea3636;
 }
 .bk-tab--top .bk-tab-header-item {
@@ -4487,6 +4493,7 @@ span.bk-date-picker-cells-cell-disabled.bk-date-picker-cells-cell-selected em {
 }
 .bk-tab-header-item-close {
   display: none;
+  font-size: 16px;
   color: #c4c6cc;
 }
 .bk-tab-header--active {
@@ -5271,6 +5278,94 @@ span.bk-date-picker-cells-cell-disabled.bk-date-picker-cells-cell-selected em {
   text-align: left;
   align-items: center;
 }
+pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{background:#fff;color:#000}.hljs-comment,.hljs-quote{color:#800}.hljs-keyword,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-title{color:#008}.hljs-template-variable,.hljs-variable{color:#660}.hljs-regexp,.hljs-selector-attr,.hljs-selector-pseudo,.hljs-string{color:#080}.hljs-bullet,.hljs-link,.hljs-literal,.hljs-meta,.hljs-number,.hljs-symbol{color:#066}.hljs-attr,.hljs-built_in,.hljs-doctag,.hljs-params,.hljs-title,.hljs-type{color:#606}.hljs-attribute,.hljs-subst{color:#000}.hljs-formula{background-color:#eee;font-style:italic}.hljs-selector-class,.hljs-selector-id{color:#9b703f}.hljs-addition{background-color:#baeeba}.hljs-deletion{background-color:#ffc8bd}.hljs-doctag,.hljs-strong{font-weight:700}.hljs-emphasis{font-style:italic}.d2h-d-none{display:none}.d2h-wrapper{text-align:left}.d2h-file-header{background-color:#f7f7f7;border-bottom:1px solid #d8d8d8;font-family:Source Sans Pro,Helvetica Neue,Helvetica,Arial,sans-serif;height:35px;padding:5px 10px}.d2h-file-header,.d2h-file-stats{display:-webkit-box;display:-ms-flexbox;display:flex}.d2h-file-stats{font-size:14px;margin-left:auto}.d2h-lines-added{border:1px solid #b4e2b4;border-radius:5px 0 0 5px;color:#399839;padding:2px;text-align:right;vertical-align:middle}.d2h-lines-deleted{border:1px solid #e9aeae;border-radius:0 5px 5px 0;color:#c33;margin-left:1px;padding:2px;text-align:left;vertical-align:middle}.d2h-file-name-wrapper{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:15px;width:100%}.d2h-file-name{overflow-x:hidden;text-overflow:ellipsis;white-space:nowrap}.d2h-file-wrapper{border:1px solid #ddd;border-radius:3px;margin-bottom:1em}.d2h-file-collapse{-webkit-box-pack:end;-ms-flex-pack:end;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:1px solid #ddd;border-radius:3px;cursor:pointer;display:none;font-size:12px;justify-content:flex-end;padding:4px 8px}.d2h-file-collapse.d2h-selected{background-color:#c8e1ff}.d2h-file-collapse-input{margin:0 4px 0 0}.d2h-diff-table{border-collapse:collapse;font-family:Menlo,Consolas,monospace;font-size:13px;width:100%}.d2h-files-diff{width:100%}.d2h-file-diff{overflow-y:hidden}.d2h-file-side-diff{display:inline-block;margin-bottom:-8px;margin-right:-4px;overflow-x:scroll;overflow-y:hidden;width:50%}.d2h-code-line{padding:0 8em}.d2h-code-line,.d2h-code-side-line{display:inline-block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap;width:100%}.d2h-code-side-line{padding:0 4.5em}.d2h-code-line-ctn{word-wrap:normal;background:none;display:inline-block;padding:0;-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;vertical-align:middle;white-space:pre;width:100%}.d2h-code-line del,.d2h-code-side-line del{background-color:#ffb6ba}.d2h-code-line del,.d2h-code-line ins,.d2h-code-side-line del,.d2h-code-side-line ins{border-radius:.2em;display:inline-block;margin-top:-1px;text-decoration:none;vertical-align:middle}.d2h-code-line ins,.d2h-code-side-line ins{background-color:#97f295;text-align:left}.d2h-code-line-prefix{word-wrap:normal;background:none;display:inline;padding:0;white-space:pre}.line-num1{float:left}.line-num1,.line-num2{-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden;padding:0 .5em;text-overflow:ellipsis;width:3.5em}.line-num2{float:right}.d2h-code-linenumber{background-color:#fff;border:solid #eee;border-width:0 1px;-webkit-box-sizing:border-box;box-sizing:border-box;color:rgba(0,0,0,.3);cursor:pointer;display:inline-block;position:absolute;text-align:right;width:7.5em}.d2h-code-linenumber:after{content:"\200b"}.d2h-code-side-linenumber{background-color:#fff;border:solid #eee;border-width:0 1px;-webkit-box-sizing:border-box;box-sizing:border-box;color:rgba(0,0,0,.3);cursor:pointer;display:inline-block;overflow:hidden;padding:0 .5em;position:absolute;text-align:right;text-overflow:ellipsis;width:4em}.d2h-code-side-linenumber:after{content:"\200b"}.d2h-code-side-emptyplaceholder,.d2h-emptyplaceholder{background-color:#f1f1f1;border-color:#e1e1e1}.d2h-code-line-prefix,.d2h-code-linenumber,.d2h-code-side-linenumber,.d2h-emptyplaceholder{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.d2h-code-linenumber,.d2h-code-side-linenumber{direction:rtl}.d2h-del{background-color:#fee8e9;border-color:#e9aeae}.d2h-ins{background-color:#dfd;border-color:#b4e2b4}.d2h-info{background-color:#f8fafd;border-color:#d5e4f2;color:rgba(0,0,0,.3)}.d2h-file-diff .d2h-del.d2h-change{background-color:#fdf2d0}.d2h-file-diff .d2h-ins.d2h-change{background-color:#ded}.d2h-file-list-wrapper{margin-bottom:10px}.d2h-file-list-wrapper a{color:#3572b0;text-decoration:none}.d2h-file-list-wrapper a:visited{color:#3572b0}.d2h-file-list-header{text-align:left}.d2h-file-list-title{font-weight:700}.d2h-file-list-line{display:-webkit-box;display:-ms-flexbox;display:flex;text-align:left}.d2h-file-list{display:block;list-style:none;margin:0;padding:0}.d2h-file-list>li{border-bottom:1px solid #ddd;margin:0;padding:5px 10px}.d2h-file-list>li:last-child{border-bottom:none}.d2h-file-switch{cursor:pointer;display:none;font-size:10px}.d2h-icon{fill:currentColor;margin-right:10px;vertical-align:middle}.d2h-deleted{color:#c33}.d2h-added{color:#399839}.d2h-changed{color:#d0b44c}.d2h-moved{color:#3572b0}.d2h-tag{background-color:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:10px;margin-left:5px;padding:0 2px}.d2h-deleted-tag{border:1px solid #c33}.d2h-added-tag{border:1px solid #399839}.d2h-changed-tag{border:1px solid #d0b44c}.d2h-moved-tag{border:1px solid #3572b0}/* stylelint-disable declaration-no-important */.bk-code-diff {
+  position: relative;
+}.bk-code-diff .d2h-file-header {
+  display: none;
+}.bk-code-diff.dark {
+  color: #abb2bf !important;
+  background: #282c34;
+}.bk-code-diff.dark .hljs {
+  color: #abb2bf !important;
+  background: #282c34;
+}.bk-code-diff.dark .d2h-file-side-diff:nth-child(n + 2) .d2h-code-wrapper {
+  border-left-color: #313238;
+}.bk-code-diff.dark pre code.hljs {
+  display: block;
+  padding: 1em;
+  overflow-x: auto;
+}.bk-code-diff.dark code.hljs {
+  padding: 3px 5px;
+}.bk-code-diff.dark .hljs-comment,
+.bk-code-diff.dark .hljs-quote {
+  font-style: italic;
+  color: #5c6370;
+}.bk-code-diff.dark .hljs-doctag,
+.bk-code-diff.dark .hljs-formula,
+.bk-code-diff.dark .hljs-keyword,
+.bk-code-diff.dark .hljs-params {
+  color: #c678dd;
+}.bk-code-diff.dark .hljs-deletion,
+.bk-code-diff.dark .hljs-name,
+.bk-code-diff.dark .hljs-section,
+.bk-code-diff.dark .hljs-selector-tag,
+.bk-code-diff.dark .hljs-subst {
+  color: #e06c75;
+}.bk-code-diff.dark .hljs-literal {
+  color: #56b6c2;
+}.bk-code-diff.dark .hljs-addition,
+.bk-code-diff.dark .hljs-attribute,
+.bk-code-diff.dark .hljs-meta .hljs-string,
+.bk-code-diff.dark .hljs-regexp,
+.bk-code-diff.dark .hljs-string {
+  color: #98c379;
+}.bk-code-diff.dark .hljs-attr,
+.bk-code-diff.dark .hljs-number,
+.bk-code-diff.dark .hljs-selector-attr,
+.bk-code-diff.dark .hljs-selector-class,
+.bk-code-diff.dark .hljs-selector-pseudo,
+.bk-code-diff.dark .hljs-template-variable,
+.bk-code-diff.dark .hljs-type,
+.bk-code-diff.dark .hljs-variable {
+  color: #d19a66;
+}.bk-code-diff.dark .hljs-bullet,
+.bk-code-diff.dark .hljs-link,
+.bk-code-diff.dark .hljs-meta,
+.bk-code-diff.dark .hljs-selector-id,
+.bk-code-diff.dark .hljs-symbol,
+.bk-code-diff.dark .hljs-title {
+  color: #61aeee;
+}.bk-code-diff.dark .hljs-built_in,
+.bk-code-diff.dark .hljs-class .hljs-title,
+.bk-code-diff.dark .hljs-title.class_ {
+  color: #e6c07b;
+}.bk-code-diff.dark .hljs-emphasis {
+  font-style: italic;
+}.bk-code-diff.dark .hljs-strong {
+  font-weight: 700;
+}.bk-code-diff.dark .hljs-link {
+  text-decoration: underline;
+}.bk-code-diff.dark .d2h-code-linenumber,
+.bk-code-diff.dark .d2h-code-side-linenumber {
+  font-size: 12px;
+  color: #8f8f89;
+  background: #282c34;
+  border: none;
+}.bk-code-diff.dark .d2h-info {
+  color: inherit;
+  background-color: transparent;
+}.bk-code-diff.dark .d2h-del {
+  background-color: #422321 !important;
+}.bk-code-diff.dark .d2h-del .hljs {
+  background: transparent;
+}.bk-code-diff.dark .d2h-ins {
+  background: #2d3324 !important;
+}.bk-code-diff.dark .d2h-ins .hljs {
+  background: transparent;
+}.bk-code-diff.dark .d2h-code-side-emptyplaceholder,
+.bk-code-diff.dark .d2h-emptyplaceholder {
+  background-color: #292929 !important;
+}
 .bk-resize-layout {
   display: flex;
 }