@g1cloud/open-bluesea-core 1.0.0-alpha.8 → 1.0.0-alpha.9

package/dist/open-bluesea-core.es.js

@@ -1,4 +1,4 @@
-import { inject, ref, markRaw, provide, reactive, defineAsyncComponent, defineComponent, withDirectives, createBlock, openBlock, resolveDynamicComponent, normalizeClass, withCtx, createElementBlock, createCommentVNode, createElementVNode, toDisplayString, unref, computed, withModifiers, Fragment, renderList, onMounted, onBeforeUnmount, Teleport, createVNode, Transition, normalizeStyle, renderSlot, watch, nextTick, withKeys, shallowRef, useTemplateRef, mergeProps, isRef, toHandlers, vModelDynamic, vModelText, useSlots, vShow, TransitionGroup, resolveComponent } from "vue";
+import { inject, ref, markRaw, provide, reactive, defineAsyncComponent, defineComponent, useSlots, computed, withDirectives, createBlock, openBlock, resolveDynamicComponent, normalizeClass, withCtx, createElementBlock, createCommentVNode, createElementVNode, renderSlot, toDisplayString, unref, withModifiers, createVNode, Fragment, renderList, onMounted, onBeforeUnmount, Teleport, Transition, normalizeStyle, watch, nextTick, withKeys, shallowRef, useTemplateRef, mergeProps, isRef, toHandlers, vModelDynamic, vModelText, vShow, TransitionGroup, resolveComponent } from "vue";
 import dayjs from "dayjs";
 const ContextMenuPluginKey = Symbol("BlueseaContextMenuPlugin");
 class BSContextMenuPlugin {
@@ -300,14 +300,12 @@ const vTooltip = {
     hideTooltip();
   }
 };
-const _hoisted_1$u = ["textContent"];
-const _sfc_main$w = /* @__PURE__ */ defineComponent({
+const _hoisted_1$v = ["textContent"];
+const _sfc_main$x = /* @__PURE__ */ defineComponent({
   __name: "BSButton",
   props: {
     caption: {},
     buttonColor: { default: "default" },
-    leftIcon: {},
-    rightIcon: {},
     disabled: { type: Boolean, default: false },
     linkUrl: {},
     linkTarget: {},
@@ -315,6 +313,9 @@ const _sfc_main$w = /* @__PURE__ */ defineComponent({
     tooltip: {}
   },
   setup(__props) {
+    const slots = useSlots();
+    const hasLeftSlot = computed(() => !!slots.left);
+    const hasRightSlot = computed(() => !!slots.right);
     return (_ctx, _cache) => {
       return withDirectives((openBlock(), createBlock(resolveDynamicComponent(__props.linkUrl ? "a" : __props.routePath ? "router-link" : "button"), {
         class: normalizeClass([[__props.buttonColor], "bs-button position-relative"]),
@@ -324,25 +325,118 @@ const _sfc_main$w = /* @__PURE__ */ defineComponent({
         to: __props.routePath
       }, {
         default: withCtx(() => [
-          __props.leftIcon ? (openBlock(), createElementBlock("span", {
+          hasLeftSlot.value ? (openBlock(), createElementBlock("span", {
             key: 0,
-            class: normalizeClass([{ "mr-1": !!__props.caption }, "font-icon left"])
-          }, toDisplayString(__props.leftIcon), 3)) : createCommentVNode("", true),
+            class: normalizeClass([{ "mr-1": !!__props.caption }, "left"])
+          }, [
+            renderSlot(_ctx.$slots, "left")
+          ], 2)) : createCommentVNode("", true),
           createElementVNode("span", {
             textContent: toDisplayString(__props.caption)
-          }, null, 8, _hoisted_1$u),
-          __props.rightIcon ? (openBlock(), createElementBlock("span", {
+          }, null, 8, _hoisted_1$v),
+          hasRightSlot.value ? (openBlock(), createElementBlock("span", {
             key: 1,
-            class: normalizeClass([{ "ml-1": !!__props.caption }, "font-icon right"])
-          }, toDisplayString(__props.rightIcon), 3)) : createCommentVNode("", true)
+            class: normalizeClass([{ "ml-1": !!__props.caption }, "right"])
+          }, [
+            renderSlot(_ctx.$slots, "right")
+          ], 2)) : createCommentVNode("", true)
         ]),
-        _: 1
+        _: 3
       }, 8, ["class", "disabled", "href", "target", "to"])), [
         [unref(vTooltip), { content: __props.tooltip }]
       ]);
     };
   }
 });
+const Add = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>';
+const CalendarMonth = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 4h-1V2h-2v2H8V2H6v2H5c-1.11 0-1.99.9-1.99 2L3 20a2 2 0 0 0 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V10h14v10zm0-12H5V6h14v2zM9 14H7v-2h2v2zm4 0h-2v-2h2v2zm4 0h-2v-2h2v2zm-8 4H7v-2h2v2zm4 0h-2v-2h2v2zm4 0h-2v-2h2v2z"/></svg>';
+const Check = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19L21 7l-1.41-1.41L9 16.17z"/></svg>';
+const CheckBox = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2zm-9 14l-5-5l1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>';
+const CheckBoxOutlineBlank = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"/></svg>';
+const CheckCircle = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8s8 3.59 8 8s-3.59 8-8 8zm4.59-12.42L10 14.17l-2.59-2.58L6 13l4 4l8-8z"/></svg>';
+const Close = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12L19 6.41z"/></svg>';
+const Cancel = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10s10-4.47 10-10S17.53 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8s8 3.59 8 8s-3.59 8-8 8zm3.59-13L12 10.59L8.41 7L7 8.41L10.59 12L7 15.59L8.41 17L12 13.41L15.59 17L17 15.59L13.41 12L17 8.41z"/></svg>';
+const DragHandle = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20 9H4v2h16V9zM4 15h16v-2H4v2z"/></svg>';
+const Edit = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M14.06 9.02l.92.92L5.92 19H5v-.92l9.06-9.06M17.66 3c-.25 0-.51.1-.7.29l-1.83 1.83l3.75 3.75l1.83-1.83a.996.996 0 0 0 0-1.41l-2.34-2.34c-.2-.2-.45-.29-.71-.29zm-3.6 3.19L3 17.25V21h3.75L17.81 9.94l-3.75-3.75z"/></svg>';
+const ExpandMore = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M16.59 8.59L12 13.17L7.41 8.59L6 10l6 6l6-6l-1.41-1.41z"/></svg>';
+const KeyboardArrowLeft = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M15.41 16.59L10.83 12l4.58-4.59L14 6l-6 6l6 6l1.41-1.41z"/></svg>';
+const KeyboardArrowRight = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M8.59 16.59L13.17 12L8.59 7.41L10 6l6 6l-6 6l-1.41-1.41z"/></svg>';
+const KeyboardDoubleArrowLeft = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M17.59 18L19 16.59L14.42 12L19 7.41L17.59 6l-6 6z"/><path d="M11 18l1.41-1.41L7.83 12l4.58-4.59L11 6l-6 6z"/></svg>';
+const KeyboardDoubleArrowRight = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M6.41 6L5 7.41L9.58 12L5 16.59L6.41 18l6-6z"/><path d="M13 6l-1.41 1.41L16.17 12l-4.58 4.59L13 18l6-6z"/></svg>';
+const Label = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M17.63 5.84C17.27 5.33 16.67 5 16 5L5 5.01C3.9 5.01 3 5.9 3 7v10c0 1.1.9 1.99 2 1.99L16 19c.67 0 1.27-.33 1.63-.84L22 12l-4.37-6.16z"/></svg>';
+const Maximize = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M21 11V3h-8l3.29 3.29l-10 10L3 13v8h8l-3.29-3.29l10-10z"/></svg>';
+const Minimize = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M22 3.41L16.71 8.7L20 12h-8V4l3.29 3.29L20.59 2L22 3.41zM3.41 22l5.29-5.29L12 20v-8H4l3.29 3.29L2 20.59L3.41 22z"/></svg>';
+const North = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M5 9l1.41 1.41L11 5.83V22h2V5.83l4.59 4.59L19 9l-7-7l-7 7z"/></svg>';
+const Numbers = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.5 10l.5-2h-4l1-4h-2l-1 4h-4l1-4h-2L9 8H5l-.5 2h4l-1 4h-4L3 16h4l-1 4h2l1-4h4l-1 4h2l1-4h4l.5-2h-4l1-4h4zm-7 4h-4l1-4h4l-1 4z"/></svg>';
+const ProgressActivity = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 6v3l4-4l-4-4v3c-4.42 0-8 3.58-8 8c0 1.57.46 3.03 1.24 4.26L6.7 14.8A5.87 5.87 0 0 1 6 12c0-3.31 2.69-6 6-6zm6.76 1.74L17.3 9.2c.44.84.7 1.79.7 2.8c0 3.31-2.69 6-6 6v-3l-4 4l4 4v-3c4.42 0 8-3.58 8-8c0-1.57-.46-3.03-1.24-4.26z"/></svg>';
+const RadioButtonChecked = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5s5-2.24 5-5s-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8s8 3.58 8 8s-3.58 8-8 8z"/></svg>';
+const RadioButtonUnchecked = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8s8 3.58 8 8s-3.58 8-8 8z"/></svg>';
+const Remove = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 13H5v-2h14v2z"/></svg>';
+const Replay = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6s-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8s-3.58-8-8-8z"/></svg>';
+const South = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 15l-1.41-1.41L13 18.17V2h-2v16.17l-4.59-4.59L5 15l7 7l7-7z"/></svg>';
+const Straight = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M11 6.83L9.41 8.41L8 7l4-4l4 4l-1.41 1.41L13 6.83V21h-2z"/></svg>';
+const SwapVert = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M16 17.01V10h-2v7.01h-3L15 21l4-3.99h-3zM9 3L5 6.99h3V14h2V6.99h3L9 3zm7 14.01V10h-2v7.01h-3L15 21l4-3.99h-3zM9 3L5 6.99h3V14h2V6.99h3L9 3z"/></svg>';
+const iconRegistry = {
+  add: Add,
+  calendar_month: CalendarMonth,
+  check: Check,
+  check_box: CheckBox,
+  check_box_outline_blank: CheckBoxOutlineBlank,
+  check_circle: CheckCircle,
+  close: Close,
+  cancel: Cancel,
+  drag_handle: DragHandle,
+  edit: Edit,
+  expand_more: ExpandMore,
+  keyboard_arrow_left: KeyboardArrowLeft,
+  keyboard_arrow_right: KeyboardArrowRight,
+  keyboard_double_arrow_left: KeyboardDoubleArrowLeft,
+  keyboard_double_arrow_right: KeyboardDoubleArrowRight,
+  label: Label,
+  maximize: Maximize,
+  minimize: Minimize,
+  north: North,
+  numbers: Numbers,
+  progress_activity: ProgressActivity,
+  radio_button_checked: RadioButtonChecked,
+  radio_button_unchecked: RadioButtonUnchecked,
+  remove: Remove,
+  replay: Replay,
+  south: South,
+  straight: Straight,
+  swap_vert: SwapVert
+};
+const registerIcon = (name, svg) => {
+  iconRegistry[name] = svg;
+};
+const registerIcons = (icons2) => {
+  Object.entries(icons2).forEach(([name, svg]) => {
+    iconRegistry[name] = svg;
+  });
+};
+const getIcon = (name) => {
+  return iconRegistry[name];
+};
+const _hoisted_1$u = ["innerHTML"];
+const _sfc_main$w = /* @__PURE__ */ defineComponent({
+  __name: "BSIcon",
+  props: {
+    name: {},
+    spin: { type: Boolean, default: false }
+  },
+  setup(__props) {
+    const props = __props;
+    const svgContent = computed(() => {
+      return getIcon(props.name) || "";
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("span", {
+        class: normalizeClass(["bs-icon", { spin: __props.spin }]),
+        innerHTML: svgContent.value
+      }, null, 10, _hoisted_1$u);
+    };
+  }
+});
 const _hoisted_1$t = { class: "page-navigation" };
 const _hoisted_2$o = ["data-page", "onClick"];
 const _sfc_main$v = /* @__PURE__ */ defineComponent({
@@ -407,13 +501,17 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$t, [
         createElementVNode("span", {
-          class: normalizeClass([{ "disabled": isFirstSet.value }, "font-icon first"]),
+          class: normalizeClass([{ "disabled": isFirstSet.value }, "nav-icon first"]),
           onClick: _cache[0] || (_cache[0] = withModifiers(($event) => !isFirstSet.value && goToPage(1), ["prevent"]))
-        }, "keyboard_double_arrow_left", 2),
+        }, [
+          createVNode(_sfc_main$w, { name: "keyboard_double_arrow_left" })
+        ], 2),
         createElementVNode("span", {
-          class: normalizeClass([{ "disabled": isFirstSet.value }, "font-icon prev"]),
+          class: normalizeClass([{ "disabled": isFirstSet.value }, "nav-icon prev"]),
           onClick: _cache[1] || (_cache[1] = withModifiers(($event) => !isFirstSet.value && goToPage(prevArrowPage.value), ["prevent"]))
-        }, "keyboard_arrow_left", 2),
+        }, [
+          createVNode(_sfc_main$w, { name: "keyboard_arrow_left" })
+        ], 2),
         (openBlock(true), createElementBlock(Fragment, null, renderList(visiblePages.value, (page) => {
           return openBlock(), createElementBlock("span", {
             key: page,
@@ -423,32 +521,35 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
           }, toDisplayString(page), 11, _hoisted_2$o);
         }), 128)),
         createElementVNode("span", {
-          class: normalizeClass([{ "disabled": isLastSet.value }, "font-icon next"]),
+          class: normalizeClass([{ "disabled": isLastSet.value }, "nav-icon next"]),
           onClick: _cache[2] || (_cache[2] = withModifiers(($event) => !isLastSet.value && goToPage(nextArrowPage.value), ["prevent"]))
-        }, "keyboard_arrow_right", 2),
+        }, [
+          createVNode(_sfc_main$w, { name: "keyboard_arrow_right" })
+        ], 2),
         createElementVNode("span", {
-          class: normalizeClass([{ "disabled": isLastSet.value }, "font-icon last"]),
+          class: normalizeClass([{ "disabled": isLastSet.value }, "nav-icon last"]),
           onClick: _cache[3] || (_cache[3] = withModifiers(($event) => !isLastSet.value && goToPage(totalPage.value), ["prevent"]))
-        }, "keyboard_double_arrow_right", 2)
+        }, [
+          createVNode(_sfc_main$w, { name: "keyboard_double_arrow_right" })
+        ], 2)
       ]);
     };
   }
 });
-const _export_sfc = (sfc, props) => {
-  const target = sfc.__vccOpts || sfc;
-  for (const [key, val] of props) {
-    target[key] = val;
-  }
-  return target;
-};
-const _sfc_main$u = {};
 const _hoisted_1$s = { class: "bs-loading-icon" };
-function _sfc_render(_ctx, _cache) {
-  return openBlock(), createElementBlock("div", _hoisted_1$s, [..._cache[0] || (_cache[0] = [
-    createElementVNode("span", { class: "font-icon" }, "progress_activity", -1)
-  ])]);
-}
-const BSLoadingIcon = /* @__PURE__ */ _export_sfc(_sfc_main$u, [["render", _sfc_render]]);
+const _sfc_main$u = /* @__PURE__ */ defineComponent({
+  __name: "BSLoadingIcon",
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$s, [
+        createVNode(_sfc_main$w, {
+          name: "progress_activity",
+          spin: ""
+        })
+      ]);
+    };
+  }
+});
 const waitUntil = async (condition, intervalMilliseconds = 200, maxTrial = 15) => {
   return await new Promise((resolve) => {
     let tried = 0;
@@ -747,8 +848,9 @@ const _hoisted_1$p = {
   class: "popup-search"
 };
 const _hoisted_2$n = ["data-value", "onMouseover", "onClick"];
-const _hoisted_3$h = ["textContent"];
-const _hoisted_4$b = ["textContent"];
+const _hoisted_3$g = { class: "checkbox" };
+const _hoisted_4$c = ["textContent"];
+const _hoisted_5$6 = ["textContent"];
 const _sfc_main$r = /* @__PURE__ */ defineComponent({
   __name: "BSSelectPopup",
   props: {
@@ -930,16 +1032,21 @@ const _sfc_main$r = /* @__PURE__ */ defineComponent({
                 onMouseover: ($event) => setHoveredPopupItem(item?.original),
                 onClick: withModifiers(($event) => selectPopupItem(item?.original), ["stop"])
               }, [
-                _cache[3] || (_cache[3] = createElementVNode("span", { class: "checkbox" }, null, -1)),
+                createElementVNode("span", _hoisted_3$g, [
+                  item !== void 0 && __props.selectedItems?.includes(item?.original) ? (openBlock(), createBlock(_sfc_main$w, {
+                    key: 0,
+                    name: "check"
+                  })) : createCommentVNode("", true)
+                ]),
                 item !== void 0 ? (openBlock(), createElementBlock("label", {
                   key: 0,
                   textContent: toDisplayString(item?.label),
                   class: "label"
-                }, null, 8, _hoisted_3$h)) : (openBlock(), createElementBlock("label", {
+                }, null, 8, _hoisted_4$c)) : (openBlock(), createElementBlock("label", {
                   key: 1,
                   textContent: toDisplayString(__props.nullLabel),
                   class: "label null-label"
-                }, null, 8, _hoisted_4$b))
+                }, null, 8, _hoisted_5$6))
               ], 42, _hoisted_2$n);
             }), 128))
           ], 512)
@@ -1345,13 +1452,9 @@ const executeKeyProviderOrDefault = (item, keyProvider, defaultKey) => {
 };
 const _hoisted_1$n = ["tabindex", "onKeydown"];
 const _hoisted_2$l = ["textContent"];
-const _hoisted_3$g = ["data-field-name"];
-const _hoisted_4$a = ["textContent"];
+const _hoisted_3$f = ["data-field-name"];
+const _hoisted_4$b = ["textContent"];
 const _hoisted_5$5 = ["textContent"];
-const _hoisted_6$2 = {
-  key: 2,
-  class: "small-progress"
-};
 const _sfc_main$p = /* @__PURE__ */ defineComponent({
   __name: "BSSelect",
   props: {
@@ -1499,14 +1602,22 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
               key: 0,
               textContent: toDisplayString(__props.placeholder),
               class: "placeholder grow"
-            }, null, 8, _hoisted_4$a)) : (openBlock(), createElementBlock("span", {
+            }, null, 8, _hoisted_4$b)) : (openBlock(), createElementBlock("span", {
               key: 1,
               textContent: toDisplayString(selectedItemLabel.value),
               class: "label"
             }, null, 8, _hoisted_5$5)),
-            _cache[4] || (_cache[4] = createElementVNode("span", { class: "dropdown-btn" }, "expand_more", -1)),
-            loadingItems.value ? (openBlock(), createElementBlock("span", _hoisted_6$2, "progress_activity")) : createCommentVNode("", true)
-          ], 8, _hoisted_3$g),
+            createVNode(_sfc_main$w, {
+              name: "expand_more",
+              class: "dropdown-btn"
+            }),
+            loadingItems.value ? (openBlock(), createBlock(_sfc_main$w, {
+              key: 2,
+              name: "progress_activity",
+              class: "small-progress",
+              spin: ""
+            })) : createCommentVNode("", true)
+          ], 8, _hoisted_3$f),
           !__props.disabled && showPopup.value ? (openBlock(), createBlock(_sfc_main$r, {
             key: 0,
             ref_key: "selectPopup",
@@ -1543,8 +1654,8 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$m = { class: "bs-calendar" };
 const _hoisted_2$k = { class: "bs-calendar-head" };
-const _hoisted_3$f = { class: "year-month" };
-const _hoisted_4$9 = {
+const _hoisted_3$e = { class: "year-month" };
+const _hoisted_4$a = {
   key: 0,
   class: "timezone"
 };
@@ -1747,11 +1858,15 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$m, [
         createElementVNode("div", _hoisted_2$k, [
-          createElementVNode("div", _hoisted_3$f, [
-            createVNode(_sfc_main$w, {
-              class: "",
-              "left-icon": "chevron_left",
+          createElementVNode("div", _hoisted_3$e, [
+            createVNode(_sfc_main$x, {
+              class: "min-w-[2em]",
               onClick: prevMonth
+            }, {
+              left: withCtx(() => [
+                createVNode(_sfc_main$w, { name: "chevron_left" })
+              ]),
+              _: 1
             }),
             createVNode(_sfc_main$p, {
               modelValue: year.value,
@@ -1765,13 +1880,17 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
               disabled: __props.disabled,
               items: unref(months)
             }, null, 8, ["modelValue", "disabled", "items"]),
-            createVNode(_sfc_main$w, {
-              class: "",
-              "left-icon": "chevron_right",
+            createVNode(_sfc_main$x, {
+              class: "min-w-[2em]",
               onClick: nextMonth
+            }, {
+              left: withCtx(() => [
+                createVNode(_sfc_main$w, { name: "chevron_right" })
+              ]),
+              _: 1
             })
           ]),
-          __props.showTimeZone ? (openBlock(), createElementBlock("div", _hoisted_4$9, "(" + toDisplayString(actualTimeZone.value) + ")", 1)) : createCommentVNode("", true)
+          __props.showTimeZone ? (openBlock(), createElementBlock("div", _hoisted_4$a, "(" + toDisplayString(actualTimeZone.value) + ")", 1)) : createCommentVNode("", true)
         ]),
         createElementVNode("table", {
           class: normalizeClass([{ disabled: __props.disabled }, "align-self-center"])
@@ -1832,7 +1951,7 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$l = { class: "bs-calendar-range flex flex-row" };
 const _hoisted_2$j = { class: "flex flex-col" };
-const _hoisted_3$e = { class: "flex flex-row items-center" };
+const _hoisted_3$d = { class: "flex flex-row items-center" };
 const _sfc_main$n = /* @__PURE__ */ defineComponent({
   __name: "BSCalendarRange",
   props: {
@@ -1873,7 +1992,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$l, [
         createElementVNode("div", _hoisted_2$j, [
-          createElementVNode("div", _hoisted_3$e, [
+          createElementVNode("div", _hoisted_3$d, [
             createVNode(_sfc_main$o, {
               modelValue: fromValue.value,
               "onUpdate:modelValue": [
@@ -1972,8 +2091,7 @@ const componentUtil = {
   }
 };
 const _hoisted_1$k = ["textContent"];
-const _hoisted_2$i = { class: "font-icon" };
-const _hoisted_3$d = ["src", "alt"];
+const _hoisted_2$i = ["src", "alt"];
 const _sfc_main$m = /* @__PURE__ */ defineComponent({
   __name: "BSPrefixSuffix",
   props: {
@@ -1990,11 +2108,13 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
             textContent: toDisplayString(item.value),
             key: JSON.stringify(item.value),
             class: normalizeClass(__props.type)
-          }, null, 10, _hoisted_1$k)) : item.type === "font-icon" ? (openBlock(), createElementBlock("span", {
+          }, null, 10, _hoisted_1$k)) : item.type === "icon" ? (openBlock(), createElementBlock("span", {
             key: 1,
             class: normalizeClass(__props.type)
           }, [
-            createElementVNode("span", _hoisted_2$i, toDisplayString(item.value), 1)
+            createVNode(_sfc_main$w, {
+              name: item.value
+            }, null, 8, ["name"])
           ], 2)) : item.type === "image-url" ? (openBlock(), createElementBlock("span", {
             key: 2,
             class: normalizeClass(__props.type)
@@ -2002,7 +2122,7 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
             createElementVNode("img", {
               src: item.value,
               alt: __props.type
-            }, null, 8, _hoisted_3$d)
+            }, null, 8, _hoisted_2$i)
           ], 2)) : createCommentVNode("", true)
         ], 64);
       }), 256);
@@ -2018,7 +2138,7 @@ const _hoisted_3$c = {
   key: 1,
   class: "input-area"
 };
-const _hoisted_4$8 = ["id", "placeholder", "autocomplete", "disabled", "maxlength", "name", "tabindex", "type"];
+const _hoisted_4$9 = ["id", "placeholder", "autocomplete", "disabled", "maxlength", "name", "tabindex", "type"];
 const _sfc_main$l = /* @__PURE__ */ defineComponent({
   __name: "BSTextInput",
   props: {
@@ -2172,7 +2292,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
             name: __props.name,
             tabindex: __props.tabindex,
             type: __props.inputType
-          }, toHandlers(handlers, true)), null, 16, _hoisted_4$8), [
+          }, toHandlers(handlers, true)), null, 16, _hoisted_4$9), [
             [vModelDynamic, unref(stringValue)]
           ]),
           createVNode(_sfc_main$m, {
@@ -2471,7 +2591,7 @@ const _hoisted_3$b = {
   key: 1,
   class: "input-area"
 };
-const _hoisted_4$7 = ["id", "placeholder", "autocomplete", "disabled", "maxlength", "name", "tabindex", "value"];
+const _hoisted_4$8 = ["id", "placeholder", "autocomplete", "disabled", "maxlength", "name", "tabindex", "value"];
 const _sfc_main$k = /* @__PURE__ */ defineComponent({
   __name: "BSNumberInput",
   props: {
@@ -2633,7 +2753,7 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
             tabindex: __props.tabindex,
             value: focused.value || !__props.formatOnBlur ? unref(stringValue) : formattedStringValue.value,
             type: "text"
-          }, toHandlers(handlers, true)), null, 16, _hoisted_4$7),
+          }, toHandlers(handlers, true)), null, 16, _hoisted_4$8),
           createVNode(_sfc_main$m, {
             value: __props.suffix,
             type: "suffix"
@@ -2657,7 +2777,7 @@ const _hoisted_3$a = {
   key: 1,
   class: "input-area flex flex-row items-start"
 };
-const _hoisted_4$6 = ["placeholder", "disabled", "maxlength", "name", "tabindex"];
+const _hoisted_4$7 = ["placeholder", "disabled", "maxlength", "name", "tabindex"];
 const _sfc_main$j = /* @__PURE__ */ defineComponent({
   __name: "BSTextArea",
   props: {
@@ -2803,7 +2923,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
             class: "grow",
             onPointerdown: capturePointer,
             onPointerup: preserveResizedHeight
-          }, toHandlers(handlers, true)), null, 16, _hoisted_4$6), [
+          }, toHandlers(handlers, true)), null, 16, _hoisted_4$7), [
             [vModelText, unref(stringValue)]
           ]),
           createVNode(_sfc_main$m, {
@@ -2821,8 +2941,9 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$g = ["id", "checked", "disabled", "name", "tabindex"];
-const _hoisted_2$e = ["textContent", "for"];
-const _hoisted_3$9 = ["for"];
+const _hoisted_2$e = ["for"];
+const _hoisted_3$9 = ["textContent", "for"];
+const _hoisted_4$6 = ["for"];
 const _sfc_main$i = /* @__PURE__ */ defineComponent({
   __name: "BSCheckbox",
   props: {
@@ -2880,19 +3001,27 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
           class: "",
           type: "checkbox"
         }, toHandlers(handlers, true)), null, 16, _hoisted_1$g),
+        createElementVNode("label", {
+          for: __props.id,
+          class: "icon-label"
+        }, [
+          createVNode(_sfc_main$w, {
+            name: checked.value ? "check_box" : "check_box_outline_blank"
+          }, null, 8, ["name"])
+        ], 8, _hoisted_2$e),
         __props.label ? (openBlock(), createElementBlock("label", {
           key: 0,
           textContent: toDisplayString(__props.label),
           for: __props.id,
           class: "text-label"
-        }, null, 8, _hoisted_2$e)) : createCommentVNode("", true),
+        }, null, 8, _hoisted_3$9)) : createCommentVNode("", true),
         hasLabelSlot.value ? (openBlock(), createElementBlock("label", {
           key: 1,
           for: __props.id,
           class: "slot-label cursor-pointer"
         }, [
           renderSlot(_ctx.$slots, "default", { disabled: __props.disabled })
-        ], 8, _hoisted_3$9)) : createCommentVNode("", true)
+        ], 8, _hoisted_4$6)) : createCommentVNode("", true)
       ], 2);
     };
   }
@@ -3035,10 +3164,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$e = ["id", "checked", "disabled", "name", "tabindex"];
 const _hoisted_2$c = ["for"];
-const _hoisted_3$7 = {
-  key: 0,
-  class: "font-icon"
-};
+const _hoisted_3$7 = ["for"];
 const _hoisted_4$5 = ["textContent"];
 const _hoisted_5$3 = ["for"];
 const _sfc_main$g = /* @__PURE__ */ defineComponent({
@@ -3085,14 +3211,25 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
           role: "radio",
           type: "radio"
         }, toHandlers(handlers, true)), null, 16, _hoisted_1$e),
+        createElementVNode("label", {
+          for: __props.id,
+          class: "icon-label"
+        }, [
+          createVNode(_sfc_main$w, {
+            name: checked.value ? "radio_button_checked" : "radio_button_unchecked"
+          }, null, 8, ["name"])
+        ], 8, _hoisted_2$c),
         createElementVNode("label", { for: __props.id }, [
-          __props.icon ? (openBlock(), createElementBlock("span", _hoisted_3$7, toDisplayString(__props.icon), 1)) : createCommentVNode("", true),
+          __props.icon ? (openBlock(), createBlock(_sfc_main$w, {
+            key: 0,
+            name: __props.icon
+          }, null, 8, ["name"])) : createCommentVNode("", true),
           __props.label ? (openBlock(), createElementBlock("span", {
             key: 1,
             textContent: toDisplayString(__props.label),
             class: "text-label"
           }, null, 8, _hoisted_4$5)) : createCommentVNode("", true)
-        ], 8, _hoisted_2$c),
+        ], 8, _hoisted_3$7),
         hasLabelSlot.value ? (openBlock(), createElementBlock("label", {
           key: 0,
           for: __props.id,
@@ -3232,10 +3369,6 @@ const _hoisted_7 = {
 };
 const _hoisted_8 = ["textContent"];
 const _hoisted_9 = ["textContent"];
-const _hoisted_10 = {
-  key: 2,
-  class: "small-progress"
-};
 const _sfc_main$e = /* @__PURE__ */ defineComponent({
   __name: "BSMultiSelect",
   props: {
@@ -3396,8 +3529,16 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
                 }, null, 8, _hoisted_9);
               }), 128))
             ])),
-            _cache[5] || (_cache[5] = createElementVNode("span", { class: "dropdown-btn" }, "expand_more", -1)),
-            loadingItems.value ? (openBlock(), createElementBlock("span", _hoisted_10, "progress_activity")) : createCommentVNode("", true)
+            createVNode(_sfc_main$w, {
+              name: "expand_more",
+              class: "dropdown-btn"
+            }),
+            loadingItems.value ? (openBlock(), createBlock(_sfc_main$w, {
+              key: 2,
+              name: "progress_activity",
+              class: "small-progress",
+              spin: ""
+            })) : createCommentVNode("", true)
           ], 8, _hoisted_5$2),
           !__props.disabled && showPopup.value ? (openBlock(), createBlock(_sfc_main$r, {
             key: 0,
@@ -3538,13 +3679,13 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
               "time-zone": __props.timeZone
             }, null, 8, ["modelValue", "display-format", "end-year", "resolution", "start-year", "time-zone"]),
             createElementVNode("div", _hoisted_2$9, [
-              createVNode(_sfc_main$w, {
+              createVNode(_sfc_main$x, {
                 caption: __props.okButtonCaption,
                 "button-color": "blue",
                 class: "min-w-80",
                 onClick: emitValue
               }, null, 8, ["caption"]),
-              createVNode(_sfc_main$w, {
+              createVNode(_sfc_main$x, {
                 caption: __props.cancelButtonCaption,
                 class: "min-w-80",
                 onClick: close
@@ -3776,10 +3917,11 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
         __props.viewMode ? (openBlock(), createElementBlock("div", _hoisted_1$a, [
           createElementVNode("span", null, toDisplayString(viewModeValue.value), 1)
         ])) : (openBlock(), createElementBlock("div", _hoisted_2$8, [
-          createElementVNode("span", {
-            class: normalizeClass([{ "bs-clickable": !__props.disabled }, "font-icon"]),
+          createVNode(_sfc_main$w, {
+            name: "calendar_month",
+            class: normalizeClass({ "bs-clickable": !__props.disabled }),
             onClick: _cache[0] || (_cache[0] = ($event) => togglePopup())
-          }, " calendar_month ", 2),
+          }, null, 8, ["class"]),
           createElementVNode("input", mergeProps({
             id: __props.id,
             ref_key: "field",
@@ -3876,13 +4018,13 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
               "time-zone": __props.timeZone
             }, null, 8, ["from", "to", "disabled-from", "disabled-to", "display-format", "end-year", "resolution", "start-year", "time-zone"]),
             createElementVNode("div", _hoisted_2$7, [
-              createVNode(_sfc_main$w, {
+              createVNode(_sfc_main$x, {
                 caption: __props.okButtonCaption,
                 "button-color": "blue",
                 class: "min-w-80",
                 onClick: emitValue
               }, null, 8, ["caption"]),
-              createVNode(_sfc_main$w, {
+              createVNode(_sfc_main$x, {
                 caption: __props.cancelButtonCaption,
                 class: "min-w-80",
                 onClick: close
@@ -4286,10 +4428,11 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
         __props.viewMode ? (openBlock(), createElementBlock("div", _hoisted_1$8, [
           createElementVNode("span", null, toDisplayString(formattedDateRange.value), 1)
         ])) : (openBlock(), createElementBlock("div", _hoisted_2$6, [
-          createElementVNode("span", {
-            class: normalizeClass([{ "bs-clickable": !disabled.value }, "font-icon"]),
+          createVNode(_sfc_main$w, {
+            name: "calendar_month",
+            class: normalizeClass({ "bs-clickable": !disabled.value }),
             onClick: _cache[0] || (_cache[0] = () => togglePopup())
-          }, " calendar_month ", 2),
+          }, null, 8, ["class"]),
           createElementVNode("input", mergeProps({
             id: __props.idFrom,
             ref_key: "fieldFrom",
@@ -4429,10 +4572,11 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
         class: normalizeClass([{ expanded: expanded.value }, "bs-card-layout"])
       }, [
         !__props.hideTitle ? (openBlock(), createElementBlock("div", _hoisted_1$7, [
-          createElementVNode("span", {
-            class: "expand-btn font-icon bs-clickable",
+          createVNode(_sfc_main$w, {
+            name: "label",
+            class: "expand-btn bs-clickable",
             onClick: toggleExpand
-          }, "label"),
+          }),
           createElementVNode("div", {
             textContent: toDisplayString(__props.title),
             class: "card-layout-title"
@@ -4941,20 +5085,30 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
             renderSlot(_ctx.$slots, "title-buttons")
           ]),
           createElementVNode("div", null, [
-            !__props.hideMaximizeButton ? (openBlock(), createBlock(_sfc_main$w, {
+            !__props.hideMaximizeButton ? (openBlock(), createBlock(_sfc_main$x, {
               key: 0,
-              "left-icon": unref(modalHandle).maximized ? "minimize" : "maximize",
               title: unref(modalHandle).maximized ? "Restore" : "Maximize",
               class: "border-0 maximize-btn",
               onClick: toggleMaximize
-            }, null, 8, ["left-icon", "title"])) : createCommentVNode("", true),
-            !__props.hideCloseButton ? (openBlock(), createBlock(_sfc_main$w, {
+            }, {
+              left: withCtx(() => [
+                createVNode(_sfc_main$w, {
+                  name: unref(modalHandle).maximized ? "minimize" : "maximize"
+                }, null, 8, ["name"])
+              ]),
+              _: 1
+            }, 8, ["title"])) : createCommentVNode("", true),
+            !__props.hideCloseButton ? (openBlock(), createBlock(_sfc_main$x, {
               key: 1,
               title: __props.closeCaption,
               class: "border-0 close-btn",
-              "left-icon": "close",
               onClick: closeModal
-            }, null, 8, ["title"])) : createCommentVNode("", true)
+            }, {
+              left: withCtx(() => [
+                createVNode(_sfc_main$w, { name: "close" })
+              ]),
+              _: 1
+            }, 8, ["title"])) : createCommentVNode("", true)
           ])
         ])) : createCommentVNode("", true),
         createElementVNode("div", {
@@ -5006,7 +5160,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
       }, {
         buttons: withCtx(() => [
           createElementVNode("div", _hoisted_2$3, [
-            withDirectives(createVNode(_sfc_main$w, {
+            withDirectives(createVNode(_sfc_main$x, {
               caption: __props.okCaption,
               "button-color": "blue",
               class: "min-w-80",
@@ -5057,13 +5211,13 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
       return openBlock(), createBlock(_sfc_main$5, { title: __props.title }, {
         buttons: withCtx(() => [
           createElementVNode("div", _hoisted_2$2, [
-            createVNode(_sfc_main$w, {
+            createVNode(_sfc_main$x, {
               caption: __props.noCaption,
               class: "min-w-80",
               "data-id": "noBtn",
               onClick: clickNo
             }, null, 8, ["caption"]),
-            createVNode(_sfc_main$w, {
+            createVNode(_sfc_main$x, {
               caption: __props.yesCaption,
               "button-color": "blue",
               class: "ml-8 min-w-80",
@@ -5105,9 +5259,16 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
               (openBlock(true), createElementBlock(Fragment, null, renderList(unref(notificationEntries), (entry) => {
                 return openBlock(), createElementBlock("div", {
                   key: entry.entryId,
-                  textContent: toDisplayString(entry.message),
                   class: normalizeClass(entry.style)
-                }, null, 10, _hoisted_3$1);
+                }, [
+                  createVNode(_sfc_main$w, {
+                    name: entry.style === "error" ? "cancel" : "check_circle",
+                    class: "notification-icon"
+                  }, null, 8, ["name"]),
+                  createElementVNode("span", {
+                    textContent: toDisplayString(entry.message)
+                  }, null, 8, _hoisted_3$1)
+                ], 2);
               }), 128))
             ]),
             _: 1
@@ -5138,7 +5299,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
             onMouseover: _cache[1] || (_cache[1] = ($event) => setCursorInTooltip(true, $event))
           }, null, 8, ["content", "target"])) : createCommentVNode("", true)
         ]),
-        unref(showLoadingIcon) ? (openBlock(), createBlock(BSLoadingIcon, { key: 0 })) : createCommentVNode("", true)
+        unref(showLoadingIcon) ? (openBlock(), createBlock(_sfc_main$u, { key: 0 })) : createCommentVNode("", true)
       ]);
     };
   }
@@ -5298,7 +5459,7 @@ class IllegalAccessError {
 }
 export {
   _sfc_main$4 as BSAlertModal,
-  _sfc_main$w as BSButton,
+  _sfc_main$x as BSButton,
   _sfc_main$o as BSCalendar,
   _sfc_main$n as BSCalendarRange,
   _sfc_main$8 as BSCardLayout,
@@ -5311,7 +5472,8 @@ export {
   _sfc_main$d as BSDateInputPopup,
   _sfc_main$a as BSDateRange,
   _sfc_main$b as BSDateRangeInputPopup,
-  BSLoadingIcon,
+  _sfc_main$w as BSIcon,
+  _sfc_main$u as BSLoadingIcon,
   BSModal,
   _sfc_main$6 as BSModalContainer,
   _sfc_main$5 as BSModalFrame,
@@ -5353,6 +5515,7 @@ export {
   focusLastElement,
   formatUtil,
   getComponentRootElement,
+  getIcon,
   getSelfIndex,
   hideLoading,
   hideTooltip,
@@ -5364,6 +5527,8 @@ export {
   provideFieldContext,
   provideModalHandle,
   provideSavePoint,
+  registerIcon,
+  registerIcons,
   showAlarm,
   showLoading,
   showLoadingIcon,