@ctzy-web-client/plugin-component-vue 1.0.0 → 1.0.2

package/lib/advance-select/advance-select.js

@@ -0,0 +1,363 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+var rxjs = require('rxjs');
+var webBaseClientVue = require('web-base-client-vue');
+var index = require('../hooks/use-data/index.js');
+var advanceOperation = require('./advance-operation.js');
+var advanceOption = require('./advance-option.js');
+var useAdvanceSelect = require('./use-advance-select.js');
+var _pluginVue_exportHelper = require('../_virtual/_plugin-vue_export-helper.js');
+
+const __default__ = vue.defineComponent({
+  name: "BwaAdvanceSelect"
+});
+const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
+  props: {
+    ...index.dataProps,
+    options: {
+      type: Array
+    },
+    modelValue: {
+      type: [Array, String, Number, Boolean]
+    },
+    listHeight: {
+      type: String,
+      default: "300px"
+    },
+    width: {
+      type: String,
+      default: "240px"
+    },
+    multiple: {
+      type: Boolean,
+      default: true
+    },
+    multipleLimit: {
+      type: Number,
+      default: 0
+    },
+    required: {
+      type: Boolean,
+      default: false
+    },
+    showSearch: {
+      type: Boolean,
+      default: true
+    },
+    searchPlaceholder: {
+      type: String,
+      default: ""
+    },
+    showSelection: {
+      type: Boolean,
+      default: true
+    },
+    showSelectIcon: {
+      type: Boolean,
+      default: true
+    },
+    closeAfterSelection: {
+      typoe: Boolean,
+      default: false
+    },
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    virtualRef: null,
+    virtualTriggering: {
+      type: Boolean,
+      default: false
+    },
+    source: "",
+    borderRadius: {
+      type: String,
+      default: "0px"
+    }
+  },
+  emits: ["update:modelValue", "search", "visible-change"],
+  setup(__props, { expose, emit }) {
+    const props = __props;
+    const debounceDelay = webBaseClientVue.useGlobalConfig("debounceDelay", 500);
+    const filterPanelItem = vue.inject(webBaseClientVue.filterPanelItemKey, null);
+    const { listHeight, width, showSearch, showSelection, multiple, modelValue, borderRadius } = vue.toRefs(props);
+    const slots = vue.useSlots();
+    const ns = webBaseClientVue.useNamespace("advance");
+    const states = useAdvanceSelect.useAdvanceSelectStates(props);
+    const {
+      options: optionInstances,
+      optionsCount,
+      search,
+      isShowPopper,
+      selected
+    } = vue.toRefs(states);
+    const column = vue.computed(() => {
+      var _a;
+      return (_a = filterPanelItem == null ? void 0 : filterPanelItem.column) != null ? _a : null;
+    });
+    const {
+      selectedLabel,
+      onOptionCreate,
+      onOptionDestroy,
+      handleClearClick,
+      handleOptionSelect,
+      hidePoppper
+    } = useAdvanceSelect.useAdvanceSelect(props, states, {
+      emit
+    });
+    const disabled = vue.computed(() => !vue.unref(isShowPopper));
+    const { data: itfData, loading: dataLoading } = index.useData(disabled, search);
+    const loading = vue.computed(() => props.loading || vue.unref(dataLoading));
+    const data = vue.computed(() => props.options || vue.unref(itfData));
+    if (multiple.value && !Array.isArray(modelValue.value)) {
+      emit("update:modelValue", []);
+    }
+    if (!multiple.value && Array.isArray(modelValue.value)) {
+      emit("update:modelValue", "");
+    }
+    vue.watch(isShowPopper, (isShowPopper2) => {
+      emit("visible-change", isShowPopper2);
+    });
+    const subscription = new rxjs.Observable(
+      (observer) => vue.watch(search, observer.next.bind(observer))
+    ).pipe(rxjs.debounceTime(vue.unref(debounceDelay))).subscribe(emit.bind(null, "search"));
+    vue.onBeforeUnmount(subscription.unsubscribe.bind(subscription));
+    vue.provide(
+      webBaseClientVue.advanceSelectKey,
+      vue.reactive({
+        props,
+        options: optionInstances,
+        selected,
+        onOptionCreate,
+        onOptionDestroy,
+        handleOptionSelect,
+        hidePoppper,
+        select: vue.getCurrentInstance()
+      })
+    );
+    const popperStyle = vue.reactive({
+      padding: "0",
+      borderRadius,
+      width,
+      border: "none",
+      boxShadow: `0 3px 12px 0 rgb(0 0 0 / 12%), 0 0.5px 1.5px 0 rgb(0 0 0 / 8%)`
+    });
+    expose({
+      handleClearClick
+    });
+    return (_ctx, _cache) => {
+      const _component_CaretBottom = vue.resolveComponent("CaretBottom");
+      const _component_ElIcon = vue.resolveComponent("ElIcon");
+      const _component_ElInput = vue.resolveComponent("ElInput");
+      const _component_ElButton = vue.resolveComponent("ElButton");
+      const _component_ElScrollbar = vue.resolveComponent("ElScrollbar");
+      const _component_ElTooltip = vue.resolveComponent("ElTooltip");
+      const _directive_loading = vue.resolveDirective("loading");
+      return vue.openBlock(), vue.createElementBlock("div", {
+        class: vue.normalizeClass(vue.unref(ns).b("select")),
+        "data-prefix": "el",
+        ref: "selectWrapper"
+      }, [
+        vue.createVNode(_component_ElTooltip, {
+          class: vue.normalizeClass(vue.unref(ns).be("select", "tooltip")),
+          effect: "light",
+          trigger: "click",
+          placement: "bottom-start",
+          "show-arrow": false,
+          "append-to": ".bwa-application",
+          "popper-style": popperStyle,
+          "popper-class": vue.unref(ns).be("select", "popper"),
+          persistent: true,
+          visible: vue.unref(isShowPopper),
+          "onUpdate:visible": _cache[1] || (_cache[1] = ($event) => vue.isRef(isShowPopper) ? isShowPopper.value = $event : null),
+          "virtual-ref": __props.virtualRef,
+          "virtual-triggering": __props.virtualTriggering
+        }, {
+          default: vue.withCtx(() => [
+            vue.renderSlot(_ctx.$slots, "reference", {
+              label: vue.unref(selectedLabel),
+              column: vue.unref(column)
+            }, () => [
+              __props.source ? (vue.openBlock(), vue.createElementBlock("div", {
+                key: 0,
+                class: vue.normalizeClass([
+                  vue.unref(ns).be("select", "pct-reference"),
+                  vue.unref(ns).is("active", vue.unref(isShowPopper))
+                ])
+              }, [
+                vue.renderSlot(_ctx.$slots, "reference-content", {
+                  label: vue.unref(selectedLabel),
+                  column: vue.unref(column),
+                  selected: vue.unref(selected)
+                }, () => [
+                  vue.renderSlot(_ctx.$slots, "label", {}, () => [
+                    vue.unref(column) ? (vue.openBlock(), vue.createElementBlock("span", {
+                      key: 0,
+                      class: vue.normalizeClass(vue.unref(ns).be("select", "label"))
+                    }, vue.toDisplayString(vue.unref(column).title), 3)) : vue.createCommentVNode("v-if", true)
+                  ]),
+                  vue.renderSlot(_ctx.$slots, "value", { selected: vue.unref(selected) }, () => [
+                    vue.unref(multiple) ? (vue.openBlock(), vue.createElementBlock("span", {
+                      key: 0,
+                      class: vue.normalizeClass(vue.unref(ns).be("select", "content"))
+                    }, vue.toDisplayString(vue.unref(selectedLabel).length ? vue.unref(selectedLabel).join(",") : "\u5168\u90E8"), 3)) : (vue.openBlock(), vue.createElementBlock("span", {
+                      key: 1,
+                      class: vue.normalizeClass(vue.unref(ns).be("select", "content"))
+                    }, vue.toDisplayString(vue.unref(selectedLabel) ? vue.unref(selectedLabel) : "\u5168\u90E8"), 3))
+                  ]),
+                  __props.showSelectIcon ? (vue.openBlock(), vue.createBlock(_component_ElIcon, {
+                    key: 0,
+                    class: vue.normalizeClass(vue.unref(ns).be("select", "caret"))
+                  }, {
+                    default: vue.withCtx(() => [
+                      vue.renderSlot(_ctx.$slots, "icon", {}, () => [
+                        vue.createVNode(_component_CaretBottom)
+                      ])
+                    ]),
+                    _: 3
+                  }, 8, ["class"])) : vue.createCommentVNode("v-if", true)
+                ])
+              ], 2)) : (vue.openBlock(), vue.createElementBlock("div", {
+                key: 1,
+                class: vue.normalizeClass([
+                  vue.unref(ns).be("select", "reference"),
+                  vue.unref(ns).is("active", vue.unref(isShowPopper))
+                ])
+              }, [
+                vue.renderSlot(_ctx.$slots, "reference-content", {
+                  label: vue.unref(selectedLabel),
+                  column: vue.unref(column),
+                  selected: vue.unref(selected)
+                }, () => [
+                  vue.renderSlot(_ctx.$slots, "label", {}, () => [
+                    vue.unref(column) ? (vue.openBlock(), vue.createElementBlock("span", {
+                      key: 0,
+                      class: vue.normalizeClass(vue.unref(ns).be("select", "label"))
+                    }, vue.toDisplayString(vue.unref(column).title), 3)) : vue.createCommentVNode("v-if", true)
+                  ]),
+                  vue.renderSlot(_ctx.$slots, "value", { selected: vue.unref(selected) }, () => [
+                    vue.unref(multiple) ? (vue.openBlock(), vue.createElementBlock("span", {
+                      key: 0,
+                      class: vue.normalizeClass(vue.unref(ns).be("select", "content"))
+                    }, vue.toDisplayString(vue.unref(selectedLabel).length ? vue.unref(selectedLabel).join(",") : "\u5168\u90E8"), 3)) : (vue.openBlock(), vue.createElementBlock("span", {
+                      key: 1,
+                      class: vue.normalizeClass(vue.unref(ns).be("select", "content"))
+                    }, vue.toDisplayString(vue.unref(selectedLabel) ? vue.unref(selectedLabel) : "\u5168\u90E8"), 3))
+                  ])
+                ]),
+                __props.showSelectIcon ? (vue.openBlock(), vue.createBlock(_component_ElIcon, {
+                  key: 0,
+                  class: vue.normalizeClass(vue.unref(ns).be("select", "caret"))
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.renderSlot(_ctx.$slots, "icon", {}, () => [
+                      vue.createVNode(_component_CaretBottom)
+                    ])
+                  ]),
+                  _: 3
+                }, 8, ["class"])) : vue.createCommentVNode("v-if", true)
+              ], 2))
+            ])
+          ]),
+          content: vue.withCtx(() => [
+            vue.createElementVNode("div", {
+              class: vue.normalizeClass([vue.unref(ns).be("select", "content"), vue.unref(ns).is("single", !vue.unref(multiple))]),
+              style: { "margin": "6px" }
+            }, [
+              vue.renderSlot(_ctx.$slots, "contentTop"),
+              vue.unref(showSearch) ? (vue.openBlock(), vue.createElementBlock("div", {
+                key: 0,
+                class: vue.normalizeClass(vue.unref(ns).be("select", "input-wrapper"))
+              }, [
+                vue.createVNode(_component_ElInput, {
+                  modelValue: vue.unref(search),
+                  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => vue.isRef(search) ? search.value = $event : null),
+                  class: vue.normalizeClass(vue.unref(ns).be("select", "input")),
+                  placeholder: __props.searchPlaceholder,
+                  type: "text",
+                  "prefix-icon": "Search",
+                  clearable: ""
+                }, null, 8, ["modelValue", "class", "placeholder"])
+              ], 2)) : vue.createCommentVNode("v-if", true),
+              vue.createElementVNode("div", {
+                class: vue.normalizeClass(vue.unref(ns).be("select", "operation-wrapper"))
+              }, [
+                vue.unref(multiple) || !__props.required ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
+                  vue.unref(showSelection) ? (vue.openBlock(), vue.createBlock(advanceOperation["default"], {
+                    key: 0,
+                    class: vue.normalizeClass(vue.unref(ns).be("select", "selection-wrapper")),
+                    type: "selection",
+                    border: true
+                  }, {
+                    default: vue.withCtx(() => [
+                      vue.unref(multiple) ? (vue.openBlock(), vue.createElementBlock("span", {
+                        key: 0,
+                        class: vue.normalizeClass([
+                          vue.unref(ns).be("select", "selection"),
+                          vue.unref(ns).is("has-selected", !!vue.unref(selected).length)
+                        ])
+                      }, " \u5DF2\u9009" + vue.toDisplayString(vue.unref(selected).length) + "\u9879 ", 3)) : vue.createCommentVNode("v-if", true),
+                      !__props.required ? (vue.openBlock(), vue.createBlock(_component_ElButton, {
+                        key: 1,
+                        link: "",
+                        type: "primary",
+                        class: vue.normalizeClass(vue.unref(ns).be("select", "clear")),
+                        onClick: vue.unref(handleClearClick)
+                      }, {
+                        default: vue.withCtx(() => [
+                          vue.createTextVNode(" \u6E05\u9664\u9009\u9879 ")
+                        ]),
+                        _: 1
+                      }, 8, ["class", "onClick"])) : vue.createCommentVNode("v-if", true)
+                    ]),
+                    _: 1
+                  }, 8, ["class"])) : vue.createCommentVNode("v-if", true)
+                ], 64)) : vue.createCommentVNode("v-if", true),
+                vue.renderSlot(_ctx.$slots, "operation")
+              ], 2),
+              vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
+                class: vue.normalizeClass(vue.unref(ns).be("select", "list"))
+              }, [
+                vue.createVNode(_component_ElScrollbar, { "max-height": vue.unref(listHeight) }, {
+                  default: vue.withCtx(() => [
+                    vue.renderSlot(_ctx.$slots, "default", {}, () => [
+                      (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(data), (item) => {
+                        return vue.openBlock(), vue.createBlock(advanceOption["default"], {
+                          key: item.value,
+                          value: item.value,
+                          label: item.label
+                        }, null, 8, ["value", "label"]);
+                      }), 128))
+                    ])
+                  ]),
+                  _: 3
+                }, 8, ["max-height"]),
+                !vue.unref(optionsCount) ? vue.renderSlot(_ctx.$slots, "empy", { key: 0 }, () => [
+                  vue.createElementVNode("div", {
+                    class: vue.normalizeClass(vue.unref(ns).be("select", "empty"))
+                  }, "\u672A\u5339\u914D\u5230\u76F8\u5173\u6761\u76EE", 2)
+                ]) : vue.createCommentVNode("v-if", true)
+              ], 2)), [
+                [_directive_loading, vue.unref(loading)]
+              ]),
+              vue.unref(slots).contentBottom ? (vue.openBlock(), vue.createElementBlock("div", {
+                key: 1,
+                class: vue.normalizeClass(vue.unref(ns).be("select", "bottom")),
+                style: vue.normalizeStyle({ "boxShadow": __props.source ? "none" : "", "padding": __props.source ? "0" : "4px 0px" })
+              }, [
+                vue.renderSlot(_ctx.$slots, "contentBottom")
+              ], 6)) : vue.createCommentVNode("v-if", true)
+            ], 2)
+          ]),
+          _: 3
+        }, 8, ["class", "popper-style", "popper-class", "visible", "virtual-ref", "virtual-triggering"])
+      ], 2);
+    };
+  }
+});
+var AdvanceSelect = /* @__PURE__ */ _pluginVue_exportHelper["default"](_sfc_main, [["__file", "advance-select.vue"]]);
+
+exports["default"] = AdvanceSelect;

package/lib/advance-select/events-helpers.js

@@ -0,0 +1,33 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+var webBaseClientVue = require('web-base-client-vue');
+var index = require('element-plus/es/utils/index');
+var util = require('element-plus/es/components/table/src/util');
+
+function useEvent(ns) {
+  const {
+    select: advanceSelect
+  } = vue.inject(webBaseClientVue.advanceSelectKey, {});
+  const handleOptionMouseEnter = (event, tooltipEffect) => {
+    const content = event.target.querySelector("." + ns.be("option", "content"));
+    const range = document.createRange();
+    range.setStart(content, 0);
+    range.setEnd(content, content.childNodes.length);
+    const rangeWidth = range.getBoundingClientRect().width;
+    const padding = (Number.parseInt(index.getStyle(content, "paddingLeft"), 10) || 0) + Number.parseInt(index.getStyle(content, "paddingRight"), 10) || 0;
+    if (rangeWidth + padding > content.offsetWidth || content.scrollWidth > content.offsetWidth) {
+      util.createTablePopper(advanceSelect == null ? void 0 : advanceSelect.refs.selectWrapper, content, content.innerText || content.textContent, {
+        placement: "top",
+        strategy: "fixed"
+      }, "dark");
+    }
+  };
+  return {
+    handleOptionMouseEnter
+  };
+}
+
+exports.useEvent = useEvent;

package/lib/advance-select/index.js

@@ -0,0 +1,20 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var install = require('element-plus/es/utils/vue/install');
+var advanceSelect = require('./advance-select.js');
+var advanceOption = require('./advance-option.js');
+var advanceOperation = require('./advance-operation.js');
+
+const BwaAdvanceSelect = install.withInstall(advanceSelect["default"], {
+  AdvanceOption: advanceOption["default"],
+  AdvanceOperation: advanceOperation["default"]
+});
+const BwaAdvanceOption = install.withInstall(advanceOption["default"]);
+const BwaAdvanceOperation = install.withInstall(advanceOperation["default"]);
+
+exports.BwaAdvanceOperation = BwaAdvanceOperation;
+exports.BwaAdvanceOption = BwaAdvanceOption;
+exports.BwaAdvanceSelect = BwaAdvanceSelect;
+exports["default"] = BwaAdvanceSelect;

package/lib/advance-select/use-advance-option.js

@@ -0,0 +1,47 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+var webBaseClientVue = require('web-base-client-vue');
+
+const useAdvanceOption = (props) => {
+  const advanceSelect = vue.inject(webBaseClientVue.advanceSelectKey);
+  const instance = vue.getCurrentInstance();
+  const currentLabel = vue.computed(() => props.label || props.value);
+  const showSelectIcon = vue.computed(() => {
+    var _a, _b;
+    return (_b = (_a = advanceSelect == null ? void 0 : advanceSelect.props) == null ? void 0 : _a.showSelectIcon) != null ? _b : true;
+  });
+  const itemSelected = vue.computed(() => {
+    if (!advanceSelect.props.multiple) {
+      return advanceSelect.props.modelValue === props.value || advanceSelect.props.modelValue === props.value + "";
+    } else {
+      return (advanceSelect.props.modelValue || []).includes(props.value);
+    }
+  });
+  const source = vue.computed(() => {
+    return advanceSelect.props.source;
+  });
+  vue.watch(() => props.value, (val, oldVal) => {
+    if (!Object.is(val, oldVal)) {
+      advanceSelect.onOptionDestroy(oldVal, instance.proxy);
+      advanceSelect.onOptionCreate(instance.proxy);
+    }
+  });
+  vue.onMounted(() => {
+    advanceSelect.onOptionCreate(instance.proxy);
+  });
+  vue.onUnmounted(() => {
+    advanceSelect.onOptionDestroy(props.value, instance.proxy);
+  });
+  return {
+    advanceSelect,
+    itemSelected,
+    currentLabel,
+    showSelectIcon,
+    source
+  };
+};
+
+exports.useAdvanceOption = useAdvanceOption;

package/lib/advance-select/use-advance-select.js

@@ -0,0 +1,122 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+require('lodash');
+
+const useAdvanceSelectStates = (props) => {
+  return vue.reactive({
+    options: /* @__PURE__ */ new Map(),
+    cachedOptions: /* @__PURE__ */ new Map(),
+    optionsCount: 0,
+    selected: props.multiple ? [] : {},
+    search: "",
+    isShowPopper: false
+  });
+};
+const useAdvanceSelect = (props, states, ctx) => {
+  const cachedOptions = vue.computed(() => Array.from(states.cachedOptions.values()));
+  vue.watch(vue.computed(() => states.isShowPopper), (isShowPopper) => {
+    if (!isShowPopper) {
+      states.search = "";
+    }
+  });
+  vue.watch(() => props.modelValue, () => {
+    setSelected();
+  }, {
+    flush: "post",
+    deep: true
+  });
+  const selectedLabel = vue.computed(() => {
+    return props.multiple ? states.selected.map((selected) => selected.label) : states.selected.label || props.modelValue;
+  });
+  const getOption = (value) => {
+    let option = null;
+    for (const item of cachedOptions.value) {
+      if (item.value === value) {
+        option = {
+          value,
+          label: item.currentLabel
+        };
+        break;
+      }
+    }
+    if (option) {
+      return option;
+    }
+    return {
+      value,
+      label: value
+    };
+  };
+  const setSelected = () => {
+    if (!props.multiple) {
+      const option = getOption(props.modelValue);
+      states.selected = option;
+      return;
+    }
+    const result = [];
+    if (Array.isArray(props.modelValue)) {
+      props.modelValue.forEach((value) => {
+        result.push(getOption(value));
+      });
+    }
+    states.selected = result;
+  };
+  const onOptionCreate = (option) => {
+    states.optionsCount++;
+    states.options.set(option.value, option);
+    states.cachedOptions.set(option.value, option);
+  };
+  const onOptionDestroy = (key, option) => {
+    if (states.options.get(key) === option) {
+      states.optionsCount--;
+      states.options.delete(key);
+    }
+  };
+  const handleClearClick = () => {
+    ctx.emit("update:modelValue", props.multiple ? [] : "");
+    if (props.closeAfterSelection) {
+      states.isShowPopper = false;
+    }
+  };
+  const handleOptionSelect = (option) => {
+    if (props.multiple) {
+      const value = (props.modelValue || []).slice();
+      const optionIndex = value.indexOf(option.value);
+      if (optionIndex > -1) {
+        if (props.required && value.length === 1) {
+          return;
+        }
+        value.splice(optionIndex, 1);
+      } else if (props.multipleLimit <= 0 || value.length < props.multipleLimit) {
+        value.push(option.value);
+      }
+      ctx.emit("update:modelValue", value);
+      if (props.closeAfterSelection) {
+        states.isShowPopper = false;
+      }
+    } else {
+      ctx.emit("update:modelValue", option.value);
+      states.isShowPopper = false;
+    }
+  };
+  const hidePoppper = () => {
+    states.isShowPopper = false;
+  };
+  vue.watch(vue.computed(() => states.options.entries()), () => {
+    setSelected();
+  });
+  return {
+    selectedLabel,
+    onOptionCreate,
+    onOptionDestroy,
+    handleClearClick,
+    handleOptionSelect,
+    hidePoppper
+  };
+};
+
+exports.useAdvanceSelect = useAdvanceSelect;
+exports.useAdvanceSelectStates = useAdvanceSelectStates;

package/lib/application-slot/application-slot.js

@@ -0,0 +1,55 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+var webBaseClientVue = require('web-base-client-vue');
+
+let uuid = 1;
+const ApplicationSlot = {
+  name: "BwaApplicationSlot",
+  props: {
+    type: String
+  },
+  setup(props) {
+    let currentUuid = uuid++;
+    const slots = vue.useSlots();
+    const application = webBaseClientVue.useGlobalConfig(webBaseClientVue.applicationKey);
+    const scope = vue.effectScope();
+    let container = null;
+    vue.onMounted(() => {
+      container = document.createElement("div");
+      scope.run(() => {
+        vue.effect(() => {
+          var _a;
+          const vnodes = (_a = slots.default) == null ? void 0 : _a.call(slots);
+          let _vnodes = [...vnodes];
+          for (let i = 0; i < _vnodes.length; i++) {
+            const vnode2 = _vnodes[i];
+            vnode2.appContext = ApplicationSlot._context;
+            if (Array.isArray(vnode2.children)) {
+              _vnodes = _vnodes.concat(vnode2.children);
+            }
+          }
+          const vnode = vue.h(vue.Fragment, vnodes);
+          vnode.appContext = ApplicationSlot._context;
+          vue.render(vnode, container);
+        });
+      });
+      application.value.addApplicationSlot(props.type, currentUuid, container);
+    });
+    vue.onBeforeUnmount(() => {
+      application.value.removeApplicationSlot(props.type, currentUuid);
+      vue.render(null, container);
+      container = null;
+      scope.stop();
+    });
+    return () => vue.h("i", {
+      style: {
+        display: "none"
+      }
+    });
+  }
+};
+
+exports["default"] = ApplicationSlot;

package/lib/application-slot/breadcrumb-item.js

@@ -0,0 +1,27 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+var applicationSlot = require('./application-slot.js');
+var _pluginVue_exportHelper = require('../_virtual/_plugin-vue_export-helper.js');
+
+const __default__ = vue.defineComponent({
+  name: "BwaBreadcrumbItem"
+});
+const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
+  setup(__props) {
+    ;
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(vue.unref(applicationSlot["default"]), { type: "breadcrumbItem" }, {
+        default: vue.withCtx(() => [
+          vue.renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      });
+    };
+  }
+});
+var BreadcrumbItem = /* @__PURE__ */ _pluginVue_exportHelper["default"](_sfc_main, [["__file", "breadcrumb-item.vue"]]);
+
+exports["default"] = BreadcrumbItem;