layplux 1.0.1 → 2.0.1

package/dist/cjs/components/panel-view/index.cjs

@@ -1,33 +1,15 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var panel_view_exports = {};
-__export(panel_view_exports, {
-  PanelView: () => PanelView
-});
-module.exports = __toCommonJS(panel_view_exports);
-var import_jsx_runtime = require("vue/jsx-runtime");
-var import_vue = require("vue");
-var import_dropdown = require("../dropdown");
-var import_icon = require("../icon");
-var import_utils = require("../../utils");
-var import_locales = require("../../locales");
-const viewModeKeys = /* @__PURE__ */ new Set(["DockPinned", "DockUnpinned", "Undock"]);
+'use strict';
+
+var vue = require('vue');
+var index$1 = require('../dropdown/index.cjs');
+var index$2 = require('../icon/index.cjs');
+var index = require('../../locales/index.cjs');
+var vue$1 = require('../../utils/vue.cjs');
+
+function _isSlot(s) {
+  return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
+}
+const viewModeKeys = new Set(['DockPinned', 'DockUnpinned', 'Undock']);
 function findItem(items, key) {
   if (!items) return;
   for (const item of items) {
@@ -38,21 +20,26 @@ function findItem(items, key) {
     }
   }
 }
-const PanelView = (0, import_vue.defineComponent)({
-  name: "PanelView",
+const PanelView = vue.defineComponent({
+  name: 'PanelView',
   props: {
     anchor: String,
     title: String,
     widget: Object,
     menuItems: Array
   },
-  setup(props, { slots }) {
-    const panelRef = (0, import_vue.ref)();
-    const defaultLocale = (0, import_vue.ref)((0, import_locales.getBuiltInLocale)("zh-CN"));
-    const locale = (0, import_vue.inject)("layplux-locale", defaultLocale);
-    const handleClick = (key) => {
+  setup(props, {
+    slots
+  }) {
+    const panelRef = vue.ref();
+    const defaultLocale = vue.ref(index.getBuiltInLocale('zh-CN'));
+    const locale = vue.inject('layplux-locale', defaultLocale);
+    const handleClick = key => {
       const widget = props.widget;
-      widget?.event?.emitGlobal(`panel:${widget.name}:menu-click`, { widget, key });
+      widget?.event?.emitGlobal(`panel:${widget.name}:menu-click`, {
+        widget,
+        key
+      });
       const widgetProps = widget?.config.props;
       const panelItems = widgetProps?.panelMenuItems;
       const panelItem = findItem(panelItems, key);
@@ -62,7 +49,7 @@ const PanelView = (0, import_vue.defineComponent)({
       }
       if (viewModeKeys.has(key)) {
         widget?.pane.setViewMode(key);
-      } else if (key === "help") {
+      } else if (key === 'help') {
         widgetProps?.onHelpClick?.();
       }
     };
@@ -70,29 +57,32 @@ const PanelView = (0, import_vue.defineComponent)({
       props.widget?.focusable.active();
     }
     function renderItems(items, currentMode) {
-      return items.map((item) => {
-        if (item.type === "divider") {
-          return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_dropdown.DropdownDivider, {}, item.key ?? "divider");
+      return items.map(item => {
+        if (item.type === 'divider') {
+          return vue.createVNode(index$1.DropdownDivider, {
+            "key": item.key ?? 'divider'
+          }, null);
         }
-        const k = item.key ?? "";
+        const k = item.key ?? '';
         if (item.children?.length) {
-          return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-            import_dropdown.DropdownSubmenu,
-            {
-              title: item.label,
-              icon: item.icon,
-              getContainer: () => panelRef.value,
-              children: renderItems(item.children, currentMode)
-            },
-            k
-          );
+          let _slot;
+          return vue.createVNode(index$1.DropdownSubmenu, {
+            "key": k,
+            "title": item.label,
+            "icon": item.icon,
+            "getContainer": () => panelRef.value
+          }, _isSlot(_slot = renderItems(item.children, currentMode)) ? _slot : {
+            default: () => [_slot]
+          });
         }
-        const disabled = currentMode !== void 0 && viewModeKeys.has(k) && currentMode === k;
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_dropdown.DropdownItem, { eventKey: k, disabled, children: [
-          item.icon,
-          " ",
-          item.label
-        ] }, k);
+        const disabled = currentMode !== undefined && viewModeKeys.has(k) && currentMode === k;
+        return vue.createVNode(index$1.DropdownItem, {
+          "key": k,
+          "eventKey": k,
+          "disabled": disabled
+        }, {
+          default: () => [item.icon, vue.createTextVNode(" "), item.label]
+        });
       });
     }
     return () => {
@@ -104,63 +94,70 @@ const PanelView = (0, import_vue.defineComponent)({
       const hasPanelMenuItems = panelMenuItems && panelMenuItems.length > 0;
       const showHelp = widgetProps?.showHelp !== false;
       const loc = locale.value.panel;
-      const finalInnerItems = [
-        {
-          key: "viewMode",
-          label: loc.viewMode,
-          children: [
-            { key: "DockPinned", label: loc.dockPinned },
-            { key: "DockUnpinned", label: loc.dockUnpinned },
-            { key: "Undock", label: loc.undock }
-          ]
-        },
-        { type: "divider" },
-        ...showHelp ? [{ key: "help", label: loc.help }] : []
-      ];
+      const finalInnerItems = [{
+        key: 'viewMode',
+        label: loc.viewMode,
+        children: [{
+          key: 'DockPinned',
+          label: loc.dockPinned
+        }, {
+          key: 'DockUnpinned',
+          label: loc.dockUnpinned
+        }, {
+          key: 'Undock',
+          label: loc.undock
+        }]
+      }, {
+        type: 'divider'
+      }, ...(showHelp ? [{
+        key: 'help',
+        label: loc.help
+      }] : [])];
       const panelTitleExtra = widgetProps?.panelTitleExtra;
       const panelActionsExtra = widgetProps?.panelActionsExtra;
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { ref: panelRef, id: widget?.id, class: "layplux-panel", onClick: handlePanelClick, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { class: "layplux-panel__header", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { class: "layplux-panel__title", children: props.title ?? widget?.name }),
-          panelTitleExtra && (0, import_utils.createContent)(panelTitleExtra),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { class: "layplux-panel__actions", children: [
-            panelActionsExtra && (0, import_utils.createContent)(panelActionsExtra),
-            slots.actionsExtra?.(),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-              import_dropdown.Dropdown,
-              {
-                trigger: "click",
-                placement: "bottom-start",
-                onClick: handleClick,
-                getContainer: () => panelRef.value,
-                children: {
-                  default: () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { class: "layplux-panel__action-btn", title: loc.more, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.MoreIcon, { size: 16 }) }),
-                  overlay: () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_dropdown.DropdownMenu, { children: [
-                    hasPanelMenuItems && renderItems(panelMenuItems),
-                    hasPanelMenuItems && hasCustomItems && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_dropdown.DropdownDivider, {}),
-                    hasCustomItems && renderItems(props.menuItems),
-                    (hasPanelMenuItems || hasCustomItems) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_dropdown.DropdownDivider, {}),
-                    renderItems(finalInnerItems, currentMode)
-                  ] })
-                }
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-              "button",
-              {
-                class: "layplux-panel__action-btn",
-                title: loc.minimize,
-                onClick: () => {
-                  widget?.event?.emitGlobal(`panel:${widget.name}:minimize`, { widget });
-                  widget?.container?.deactivate();
-                },
-                children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.MinimizeIcon, { size: 16 })
-              }
-            )
-          ] })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { id: props.anchor, class: "layplux-panel__body" })
-      ] });
+      return vue.createVNode("div", {
+        "ref": panelRef,
+        "id": widget?.id,
+        "class": "layplux-panel",
+        "onClick": handlePanelClick
+      }, [vue.createVNode("div", {
+        "class": "layplux-panel__header"
+      }, [vue.createVNode("span", {
+        "class": "layplux-panel__title"
+      }, [props.title ?? widget?.name]), panelTitleExtra && vue$1.createContent(panelTitleExtra), vue.createVNode("div", {
+        "class": "layplux-panel__actions"
+      }, [panelActionsExtra && vue$1.createContent(panelActionsExtra), slots.actionsExtra?.(), vue.createVNode(index$1.Dropdown, {
+        "trigger": "click",
+        "placement": "bottom-start",
+        "onClick": handleClick,
+        "getContainer": () => panelRef.value
+      }, {
+        default: () => vue.createVNode("button", {
+          "class": "layplux-panel__action-btn",
+          "title": loc.more
+        }, [vue.createVNode(index$2.MoreIcon, {
+          "size": 16
+        }, null)]),
+        overlay: () => vue.createVNode(index$1.DropdownMenu, null, {
+          default: () => [hasPanelMenuItems && renderItems(panelMenuItems), hasPanelMenuItems && hasCustomItems && vue.createVNode(index$1.DropdownDivider, null, null), hasCustomItems && renderItems(props.menuItems), (hasPanelMenuItems || hasCustomItems) && vue.createVNode(index$1.DropdownDivider, null, null), renderItems(finalInnerItems, currentMode)]
+        })
+      }), vue.createVNode("button", {
+        "class": "layplux-panel__action-btn",
+        "title": loc.minimize,
+        "onClick": () => {
+          widget?.event?.emitGlobal(`panel:${widget.name}:minimize`, {
+            widget
+          });
+          widget?.container?.deactivate();
+        }
+      }, [vue.createVNode(index$2.MinimizeIcon, {
+        "size": 16
+      }, null)])])]), vue.createVNode("div", {
+        "id": props.anchor,
+        "class": "layplux-panel__body"
+      }, null)]);
     };
   }
 });
+
+exports.PanelView = PanelView;