@gx-design-vue/pro-layout-components 0.1.0-alpha.0

package/dist/RightContent/Search/style.js

@@ -0,0 +1,96 @@
+import { unit, useStyle as useStyle$1 } from "@gx-design-vue/pro-provider";
+
+//#region src/RightContent/Search/style.ts
+const getStyle = (token) => {
+	const fontSize = unit(token.layout?.menuItemIconSize || token.fontSize);
+	return { [token.componentCls]: {
+		display: "flex",
+		alignItems: "center",
+		justifyContent: "center",
+		height: 36,
+		gap: 12,
+		cursor: "pointer",
+		fontSize: token.fontSizeSM,
+		color: token.colorTextTertiary,
+		paddingBlock: token.paddingXXS / 2,
+		paddingInline: token.paddingXS,
+		borderRadius: token.borderRadiusLG * 2,
+		backgroundColor: token.layout?.header?.colorBgRightActionsItemHover,
+		transition: `all ${token.motionDurationMid} ${token.motionEaseInOut}`,
+		">.anticon": {
+			fontSize: token.fontSize,
+			color: token.colorTextTertiary
+		},
+		"&-word-icon": {
+			padding: "4px 6px",
+			lineHeight: unit(token.fontSizeSM),
+			borderTopLeftRadius: token.borderRadiusSM,
+			borderBottomLeftRadius: token.borderRadiusSM,
+			borderTopRightRadius: token.borderRadiusLG * 2,
+			borderBottomRightRadius: token.borderRadiusLG * 2,
+			backgroundColor: token.colorBgContainer
+		},
+		"&:hover": { color: token.colorTextSecondary },
+		"&-panel": {
+			"&-title": {
+				color: token.colorTextQuaternary,
+				lineHeight: token.lineHeight,
+				marginBlockEnd: token.marginXS
+			},
+			"&-list": {
+				display: "flex",
+				flexDirection: "column",
+				gap: 12
+			},
+			"&-item": {
+				display: "flex",
+				alignItems: "center",
+				justifyContent: "space-between",
+				cursor: "pointer",
+				fontSize: token.fontSize,
+				lineHeight: token.lineHeight,
+				padding: token.paddingXS,
+				borderRadius: token.borderRadiusLG,
+				backgroundColor: token.colorBgContainer,
+				transition: `all ${token.motionDurationFast} ${token.motionEaseInOut}`,
+				"&-left": {
+					display: "flex",
+					alignItems: "center",
+					gap: token.sizeStep,
+					">.anticon": { fontSize }
+				},
+				"&.active": {
+					backgroundColor: token.colorPrimary,
+					color: token.colorTextLightSolid
+				}
+			}
+		},
+		"&-result": {
+			display: "flex",
+			alignItems: "center",
+			justifyContent: "center",
+			paddingBlockStart: 60,
+			color: token.colorTextQuaternary
+		},
+		"&-modal-footer": {
+			display: "flex",
+			alignItems: "center",
+			gap: token.marginXS,
+			fontSize: 12,
+			color: token.colorTextSecondary
+		},
+		"&-modal-footer-icon": {
+			display: "flex",
+			alignItems: "center",
+			gap: 4
+		}
+	} };
+};
+function useStyle(componentCls) {
+	return useStyle$1("SearchPageInput", (token) => {
+		return [getStyle(token)];
+	}, componentCls);
+}
+
+//#endregion
+export { useStyle };

package/dist/RightContent/index.d.ts

@@ -0,0 +1,407 @@
+import { ShortcutKeyProps } from "../PageLock/props.js";
+import { RightContentActions } from "./props.js";
+import * as vue65 from "vue";
+import { SlotsType } from "vue";
+import * as _gx_design_vue_pro_utils0 from "@gx-design-vue/pro-utils";
+import { CustomRender } from "@gx-design-vue/pro-utils";
+import * as ant_design_vue0 from "ant-design-vue";
+import * as _gx_design_vue_pro_layout0 from "@gx-design-vue/pro-layout";
+import * as ant_design_vue_es__util_type1 from "ant-design-vue/es/_util/type";
+import * as ant_design_vue_es_dropdown_props0 from "ant-design-vue/es/dropdown/props";
+import * as ant_design_vue_es__util_transition0 from "ant-design-vue/es/_util/transition";
+import * as ant_design_vue_es_menu_src_interface0 from "ant-design-vue/es/menu/src/interface";
+import * as ant_design_vue_es__util_EventInterface0 from "ant-design-vue/es/_util/EventInterface";
+
+//#region src/RightContent/index.d.ts
+declare const GlobalRightContent: vue65.DefineComponent<vue65.ExtractPropTypes<{
+  actions: {
+    type: vue65.PropType<RightContentActions | false>;
+    default: () => {};
+  };
+  shortsKey: {
+    type: vue65.PropType<ShortcutKeyProps["search"]>;
+    default: () => ShortcutKeyProps["search"];
+  };
+  name: {
+    type: vue65.PropType<string>;
+    default: any;
+  };
+  avatar: vue65.PropType<string>;
+  actionsRender: {
+    type: vue65.PropType<_gx_design_vue_pro_utils0.WithFalse<(classNames: string[]) => CustomRender>>;
+    default: any;
+  };
+  dropdownProps: {
+    type: vue65.PropType<{
+      arrow?: boolean | ant_design_vue_es_dropdown_props0.DropdownArrowOptions;
+      trigger?: ant_design_vue_es_dropdown_props0.Trigger | ant_design_vue_es_dropdown_props0.Trigger[];
+      menu?: Partial<vue65.ExtractPropTypes<{
+        id: StringConstructor;
+        prefixCls: StringConstructor;
+        items: vue65.PropType<ant_design_vue0.ItemType[]>;
+        disabled: BooleanConstructor;
+        inlineCollapsed: BooleanConstructor;
+        disabledOverflow: BooleanConstructor;
+        forceSubMenuRender: BooleanConstructor;
+        openKeys: vue65.PropType<ant_design_vue_es__util_type1.Key[]>;
+        selectedKeys: vue65.PropType<ant_design_vue_es__util_type1.Key[]>;
+        activeKey: StringConstructor;
+        selectable: {
+          type: BooleanConstructor;
+          default: boolean;
+        };
+        multiple: {
+          type: BooleanConstructor;
+          default: boolean;
+        };
+        tabindex: {
+          type: (StringConstructor | NumberConstructor)[];
+        };
+        motion: vue65.PropType<ant_design_vue_es__util_transition0.CSSMotionProps>;
+        role: StringConstructor;
+        theme: {
+          type: vue65.PropType<ant_design_vue0.MenuTheme>;
+          default: string;
+        };
+        mode: {
+          type: vue65.PropType<ant_design_vue0.MenuMode>;
+          default: string;
+        };
+        inlineIndent: {
+          type: NumberConstructor;
+          default: number;
+        };
+        subMenuOpenDelay: {
+          type: NumberConstructor;
+          default: number;
+        };
+        subMenuCloseDelay: {
+          type: NumberConstructor;
+          default: number;
+        };
+        builtinPlacements: {
+          type: vue65.PropType<ant_design_vue_es_menu_src_interface0.BuiltinPlacements>;
+        };
+        triggerSubMenuAction: {
+          type: vue65.PropType<ant_design_vue_es_menu_src_interface0.TriggerSubMenuAction>;
+          default: string;
+        };
+        getPopupContainer: vue65.PropType<(node: HTMLElement) => HTMLElement>;
+        expandIcon: vue65.PropType<(p?: {
+          [key: string]: any;
+          isOpen: boolean;
+        }) => any>;
+        onOpenChange: vue65.PropType<(keys: ant_design_vue_es__util_type1.Key[]) => void>;
+        onSelect: vue65.PropType<ant_design_vue_es_menu_src_interface0.SelectEventHandler>;
+        onDeselect: vue65.PropType<ant_design_vue_es_menu_src_interface0.SelectEventHandler>;
+        onClick: vue65.PropType<ant_design_vue_es_menu_src_interface0.MenuClickEventHandler>;
+        onFocus: vue65.PropType<ant_design_vue_es__util_EventInterface0.FocusEventHandler>;
+        onBlur: vue65.PropType<ant_design_vue_es__util_EventInterface0.FocusEventHandler>;
+        onMousedown: vue65.PropType<ant_design_vue_es__util_EventInterface0.MouseEventHandler>;
+        'onUpdate:openKeys': vue65.PropType<(keys: ant_design_vue_es__util_type1.Key[]) => void>;
+        'onUpdate:selectedKeys': vue65.PropType<(keys: ant_design_vue_es__util_type1.Key[]) => void>;
+        'onUpdate:activeKey': vue65.PropType<(key: ant_design_vue_es__util_type1.Key) => void>;
+      }>>;
+      visible?: boolean;
+      open?: boolean;
+      disabled?: boolean;
+      danger?: boolean;
+      autofocus?: boolean;
+      align?: ant_design_vue_es_dropdown_props0.Align;
+      getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
+      prefixCls?: string;
+      transitionName?: string;
+      overlayClassName?: string;
+      overlayStyle?: vue65.CSSProperties;
+      forceRender?: boolean;
+      mouseEnterDelay?: number;
+      mouseLeaveDelay?: number;
+      openClassName?: string;
+      minOverlayWidthMatchTrigger?: boolean;
+      destroyPopupOnHide?: boolean;
+      onVisibleChange?: (val: boolean) => void;
+      'onUpdate:visible'?: (val: boolean) => void;
+      onOpenChange?: (val: boolean) => void;
+      'onUpdate:open'?: (val: boolean) => void;
+    }>;
+    default: () => {};
+  };
+  dropdownRender: {
+    type: vue65.PropType<_gx_design_vue_pro_utils0.WithFalse<CustomRender>>;
+    default: any;
+  };
+  dropdownMenuRender: {
+    type: vue65.PropType<_gx_design_vue_pro_utils0.WithFalse<CustomRender>>;
+    default: any;
+  };
+  dropdownMenuExtraItemRender: {
+    type: vue65.PropType<_gx_design_vue_pro_utils0.WithFalse<CustomRender>>;
+    default: any;
+  };
+  onLogout: vue65.PropType<(callback?: () => void) => void>;
+  onClick: vue65.PropType<(type: keyof RightContentActions) => void>;
+  dataSource: {
+    type: vue65.PropType<_gx_design_vue_pro_layout0.AppRouteModule[]>;
+    default: () => any[];
+  };
+  historyKey: vue65.PropType<string>;
+  emptyProps: {
+    type: vue65.PropType<any>;
+    default: () => {};
+  };
+}>, () => ant_design_vue_es__util_type1.VueNode, {}, {}, {}, vue65.ComponentOptionsMixin, vue65.ComponentOptionsMixin, {
+  click: (type: keyof RightContentActions) => boolean;
+  logout: (callback?: () => void) => boolean;
+}, string, vue65.PublicProps, Readonly<vue65.ExtractPropTypes<{
+  actions: {
+    type: vue65.PropType<RightContentActions | false>;
+    default: () => {};
+  };
+  shortsKey: {
+    type: vue65.PropType<ShortcutKeyProps["search"]>;
+    default: () => ShortcutKeyProps["search"];
+  };
+  name: {
+    type: vue65.PropType<string>;
+    default: any;
+  };
+  avatar: vue65.PropType<string>;
+  actionsRender: {
+    type: vue65.PropType<_gx_design_vue_pro_utils0.WithFalse<(classNames: string[]) => CustomRender>>;
+    default: any;
+  };
+  dropdownProps: {
+    type: vue65.PropType<{
+      arrow?: boolean | ant_design_vue_es_dropdown_props0.DropdownArrowOptions;
+      trigger?: ant_design_vue_es_dropdown_props0.Trigger | ant_design_vue_es_dropdown_props0.Trigger[];
+      menu?: Partial<vue65.ExtractPropTypes<{
+        id: StringConstructor;
+        prefixCls: StringConstructor;
+        items: vue65.PropType<ant_design_vue0.ItemType[]>;
+        disabled: BooleanConstructor;
+        inlineCollapsed: BooleanConstructor;
+        disabledOverflow: BooleanConstructor;
+        forceSubMenuRender: BooleanConstructor;
+        openKeys: vue65.PropType<ant_design_vue_es__util_type1.Key[]>;
+        selectedKeys: vue65.PropType<ant_design_vue_es__util_type1.Key[]>;
+        activeKey: StringConstructor;
+        selectable: {
+          type: BooleanConstructor;
+          default: boolean;
+        };
+        multiple: {
+          type: BooleanConstructor;
+          default: boolean;
+        };
+        tabindex: {
+          type: (StringConstructor | NumberConstructor)[];
+        };
+        motion: vue65.PropType<ant_design_vue_es__util_transition0.CSSMotionProps>;
+        role: StringConstructor;
+        theme: {
+          type: vue65.PropType<ant_design_vue0.MenuTheme>;
+          default: string;
+        };
+        mode: {
+          type: vue65.PropType<ant_design_vue0.MenuMode>;
+          default: string;
+        };
+        inlineIndent: {
+          type: NumberConstructor;
+          default: number;
+        };
+        subMenuOpenDelay: {
+          type: NumberConstructor;
+          default: number;
+        };
+        subMenuCloseDelay: {
+          type: NumberConstructor;
+          default: number;
+        };
+        builtinPlacements: {
+          type: vue65.PropType<ant_design_vue_es_menu_src_interface0.BuiltinPlacements>;
+        };
+        triggerSubMenuAction: {
+          type: vue65.PropType<ant_design_vue_es_menu_src_interface0.TriggerSubMenuAction>;
+          default: string;
+        };
+        getPopupContainer: vue65.PropType<(node: HTMLElement) => HTMLElement>;
+        expandIcon: vue65.PropType<(p?: {
+          [key: string]: any;
+          isOpen: boolean;
+        }) => any>;
+        onOpenChange: vue65.PropType<(keys: ant_design_vue_es__util_type1.Key[]) => void>;
+        onSelect: vue65.PropType<ant_design_vue_es_menu_src_interface0.SelectEventHandler>;
+        onDeselect: vue65.PropType<ant_design_vue_es_menu_src_interface0.SelectEventHandler>;
+        onClick: vue65.PropType<ant_design_vue_es_menu_src_interface0.MenuClickEventHandler>;
+        onFocus: vue65.PropType<ant_design_vue_es__util_EventInterface0.FocusEventHandler>;
+        onBlur: vue65.PropType<ant_design_vue_es__util_EventInterface0.FocusEventHandler>;
+        onMousedown: vue65.PropType<ant_design_vue_es__util_EventInterface0.MouseEventHandler>;
+        'onUpdate:openKeys': vue65.PropType<(keys: ant_design_vue_es__util_type1.Key[]) => void>;
+        'onUpdate:selectedKeys': vue65.PropType<(keys: ant_design_vue_es__util_type1.Key[]) => void>;
+        'onUpdate:activeKey': vue65.PropType<(key: ant_design_vue_es__util_type1.Key) => void>;
+      }>>;
+      visible?: boolean;
+      open?: boolean;
+      disabled?: boolean;
+      danger?: boolean;
+      autofocus?: boolean;
+      align?: ant_design_vue_es_dropdown_props0.Align;
+      getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
+      prefixCls?: string;
+      transitionName?: string;
+      overlayClassName?: string;
+      overlayStyle?: vue65.CSSProperties;
+      forceRender?: boolean;
+      mouseEnterDelay?: number;
+      mouseLeaveDelay?: number;
+      openClassName?: string;
+      minOverlayWidthMatchTrigger?: boolean;
+      destroyPopupOnHide?: boolean;
+      onVisibleChange?: (val: boolean) => void;
+      'onUpdate:visible'?: (val: boolean) => void;
+      onOpenChange?: (val: boolean) => void;
+      'onUpdate:open'?: (val: boolean) => void;
+    }>;
+    default: () => {};
+  };
+  dropdownRender: {
+    type: vue65.PropType<_gx_design_vue_pro_utils0.WithFalse<CustomRender>>;
+    default: any;
+  };
+  dropdownMenuRender: {
+    type: vue65.PropType<_gx_design_vue_pro_utils0.WithFalse<CustomRender>>;
+    default: any;
+  };
+  dropdownMenuExtraItemRender: {
+    type: vue65.PropType<_gx_design_vue_pro_utils0.WithFalse<CustomRender>>;
+    default: any;
+  };
+  onLogout: vue65.PropType<(callback?: () => void) => void>;
+  onClick: vue65.PropType<(type: keyof RightContentActions) => void>;
+  dataSource: {
+    type: vue65.PropType<_gx_design_vue_pro_layout0.AppRouteModule[]>;
+    default: () => any[];
+  };
+  historyKey: vue65.PropType<string>;
+  emptyProps: {
+    type: vue65.PropType<any>;
+    default: () => {};
+  };
+}>> & Readonly<{
+  onClick?: (type: keyof RightContentActions) => any;
+  onLogout?: (callback?: () => void) => any;
+}>, {
+  name: string;
+  actions: {};
+  shortsKey: {
+    keys?: string;
+    disabled?: boolean;
+  };
+  actionsRender: _gx_design_vue_pro_utils0.WithFalse<(classNames: string[]) => CustomRender>;
+  dropdownProps: {
+    arrow?: boolean | ant_design_vue_es_dropdown_props0.DropdownArrowOptions;
+    trigger?: ant_design_vue_es_dropdown_props0.Trigger | ant_design_vue_es_dropdown_props0.Trigger[];
+    menu?: Partial<vue65.ExtractPropTypes<{
+      id: StringConstructor;
+      prefixCls: StringConstructor;
+      items: vue65.PropType<ant_design_vue0.ItemType[]>;
+      disabled: BooleanConstructor;
+      inlineCollapsed: BooleanConstructor;
+      disabledOverflow: BooleanConstructor;
+      forceSubMenuRender: BooleanConstructor;
+      openKeys: vue65.PropType<ant_design_vue_es__util_type1.Key[]>;
+      selectedKeys: vue65.PropType<ant_design_vue_es__util_type1.Key[]>;
+      activeKey: StringConstructor;
+      selectable: {
+        type: BooleanConstructor;
+        default: boolean;
+      };
+      multiple: {
+        type: BooleanConstructor;
+        default: boolean;
+      };
+      tabindex: {
+        type: (StringConstructor | NumberConstructor)[];
+      };
+      motion: vue65.PropType<ant_design_vue_es__util_transition0.CSSMotionProps>;
+      role: StringConstructor;
+      theme: {
+        type: vue65.PropType<ant_design_vue0.MenuTheme>;
+        default: string;
+      };
+      mode: {
+        type: vue65.PropType<ant_design_vue0.MenuMode>;
+        default: string;
+      };
+      inlineIndent: {
+        type: NumberConstructor;
+        default: number;
+      };
+      subMenuOpenDelay: {
+        type: NumberConstructor;
+        default: number;
+      };
+      subMenuCloseDelay: {
+        type: NumberConstructor;
+        default: number;
+      };
+      builtinPlacements: {
+        type: vue65.PropType<ant_design_vue_es_menu_src_interface0.BuiltinPlacements>;
+      };
+      triggerSubMenuAction: {
+        type: vue65.PropType<ant_design_vue_es_menu_src_interface0.TriggerSubMenuAction>;
+        default: string;
+      };
+      getPopupContainer: vue65.PropType<(node: HTMLElement) => HTMLElement>;
+      expandIcon: vue65.PropType<(p?: {
+        [key: string]: any;
+        isOpen: boolean;
+      }) => any>;
+      onOpenChange: vue65.PropType<(keys: ant_design_vue_es__util_type1.Key[]) => void>;
+      onSelect: vue65.PropType<ant_design_vue_es_menu_src_interface0.SelectEventHandler>;
+      onDeselect: vue65.PropType<ant_design_vue_es_menu_src_interface0.SelectEventHandler>;
+      onClick: vue65.PropType<ant_design_vue_es_menu_src_interface0.MenuClickEventHandler>;
+      onFocus: vue65.PropType<ant_design_vue_es__util_EventInterface0.FocusEventHandler>;
+      onBlur: vue65.PropType<ant_design_vue_es__util_EventInterface0.FocusEventHandler>;
+      onMousedown: vue65.PropType<ant_design_vue_es__util_EventInterface0.MouseEventHandler>;
+      'onUpdate:openKeys': vue65.PropType<(keys: ant_design_vue_es__util_type1.Key[]) => void>;
+      'onUpdate:selectedKeys': vue65.PropType<(keys: ant_design_vue_es__util_type1.Key[]) => void>;
+      'onUpdate:activeKey': vue65.PropType<(key: ant_design_vue_es__util_type1.Key) => void>;
+    }>>;
+    visible?: boolean;
+    open?: boolean;
+    disabled?: boolean;
+    danger?: boolean;
+    autofocus?: boolean;
+    align?: ant_design_vue_es_dropdown_props0.Align;
+    getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
+    prefixCls?: string;
+    transitionName?: string;
+    overlayClassName?: string;
+    overlayStyle?: vue65.CSSProperties;
+    forceRender?: boolean;
+    mouseEnterDelay?: number;
+    mouseLeaveDelay?: number;
+    openClassName?: string;
+    minOverlayWidthMatchTrigger?: boolean;
+    destroyPopupOnHide?: boolean;
+    onVisibleChange?: (val: boolean) => void;
+    'onUpdate:visible'?: (val: boolean) => void;
+    onOpenChange?: (val: boolean) => void;
+    'onUpdate:open'?: (val: boolean) => void;
+  };
+  dropdownRender: CustomRender;
+  dropdownMenuRender: CustomRender;
+  dropdownMenuExtraItemRender: CustomRender;
+  dataSource: _gx_design_vue_pro_layout0.AppRouteModule[];
+  emptyProps: any;
+}, SlotsType<{
+  default: () => CustomRender;
+  actionsRender: (classNames: string[]) => CustomRender;
+  dropdownRender: () => CustomRender;
+  dropdownMenuRender: () => CustomRender;
+  dropdownMenuExtraItemRender: () => CustomRender;
+}>, {}, {}, string, vue65.ComponentProvideOptions, true, {}, any>;
+//#endregion
+export { GlobalRightContent as default };

package/dist/RightContent/index.js

@@ -0,0 +1,152 @@
+import Icon_default from "../Icon/index.js";
+import { getRightContentProps } from "./props.js";
+import PageLock_default from "../PageLock/index.js";
+import { systemTheme } from "../ThemeEditor/utils/config.js";
+import Search_default from "./Search/index.js";
+import { useStyle } from "./style.js";
+import { Fragment, computed, createTextVNode, createVNode, defineComponent, isVNode, mergeProps, ref } from "vue";
+import { useMediaQuery, useState } from "@gx-design-vue/pro-hooks";
+import { getPrefixCls, getSlot, getSlotsProps, isBoolean, isFunction } from "@gx-design-vue/pro-utils";
+import { Avatar, Dropdown, Menu, MenuItem } from "ant-design-vue";
+import { useProLayoutContext } from "@gx-design-vue/pro-layout";
+import { CompressOutlined, ExpandOutlined, LockOutlined, LogoutOutlined, SettingOutlined, UserOutlined } from "@ant-design/icons-vue";
+import { toggleAnimateTheme, useThemeContext } from "@gx-design-vue/context";
+import { useColorMode, useDebounceFn, useFullscreen } from "@vueuse/core";
+import ResizeObserver from "ant-design-vue/es/vc-resize-observer";
+
+//#region src/RightContent/index.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const GlobalRightContent = /* @__PURE__ */ defineComponent({
+	name: "GlobalRightContent",
+	props: getRightContentProps(),
+	inheritAttrs: false,
+	emits: {
+		click: (type) => type.length > 0,
+		logout: (callback) => typeof callback === "function"
+	},
+	slots: Object,
+	setup(props, { slots }) {
+		const { isFullscreen, toggle } = useFullscreen();
+		const layoutContext = useProLayoutContext();
+		const colSize = useMediaQuery();
+		const { system } = useColorMode();
+		const { setTheme, isDark, theme } = useThemeContext();
+		const prefixCls = getPrefixCls({
+			suffixCls: "global",
+			isPor: true
+		});
+		const { wrapSSR, hashId } = useStyle(prefixCls);
+		const toggleEl = ref();
+		const [lock, openLock] = useState(false);
+		const [rightSize, setRightSize] = useState("auto");
+		const isMobile = computed(() => isBoolean(layoutContext?.isMobile?.value) ? layoutContext?.isMobile?.value : colSize.value === "sm" || colSize.value === "xs");
+		const actions = computed(() => {
+			if (props.actions === false) return {};
+			return {
+				lock: true,
+				theme: true,
+				search: true,
+				themeEditor: true,
+				fullScreen: true,
+				...props.actions
+			};
+		});
+		/** 减少一下渲染的次数 */
+		const setRightSizeDebounceFn = useDebounceFn(async (width) => {
+			setRightSize(width);
+		}, 160);
+		const changeTheme = (value) => {
+			const themeValue = value === "system" ? system.value : value;
+			if (toggleEl.value) toggleAnimateTheme(toggleEl.value, {
+				isDark: themeValue === "dark",
+				setTheme: () => setTheme(value)
+			});
+		};
+		function onClick(type) {
+			if (isFunction(props.onClick)) props.onClick?.(type);
+		}
+		return () => {
+			let _slot2;
+			const slotsProps = getSlotsProps({
+				slots,
+				props,
+				keys: [
+					"dropdownRender",
+					"dropdownMenuRender",
+					"dropdownMenuExtraItemRender"
+				],
+				render: true
+			});
+			const actionsRender = getSlot({
+				slots,
+				props,
+				key: "actionsRender"
+			});
+			const FullScreenIcon = isFullscreen.value ? CompressOutlined : ExpandOutlined;
+			return wrapSSR(createVNode("div", {
+				"class": `${prefixCls}-right-content ${hashId.value}`.trim(),
+				"style": {
+					minWidth: rightSize.value,
+					height: "100%"
+				}
+			}, [createVNode("div", { "style": { height: "100%" } }, [createVNode(ResizeObserver, {
+				"key": "resize-observer",
+				"onResize": ({ width }) => {
+					setRightSizeDebounceFn(width);
+				}
+			}, { default: () => [createVNode("div", { "class": `${prefixCls}-header-actions ${hashId.value}`.trim() }, [slots.default?.() ?? createVNode(Fragment, null, [
+				actions.value.search && !isMobile.value && createVNode(Search_default, {
+					"dataSource": props.dataSource,
+					"disabledShortKey": props.shortsKey?.disabled,
+					"emptyProps": props.emptyProps
+				}, null),
+				actions.value.theme && createVNode("div", {
+					"ref": toggleEl,
+					"class": `${prefixCls}-header-actions-item ${prefixCls}-header-actions-theme ${hashId.value}`.trim()
+				}, [createVNode(Dropdown, {
+					"trigger": ["click"],
+					"placement": "bottomRight",
+					"overlay": createVNode(Menu, { "selectedKeys": [theme.value] }, _isSlot(_slot2 = systemTheme.map((item) => {
+						let _slot;
+						return createVNode(Menu.Item, {
+							"key": item.value,
+							"onClick": () => changeTheme(item.value)
+						}, _isSlot(_slot = item.label()) ? _slot : { default: () => [_slot] });
+					})) ? _slot2 : { default: () => [_slot2] })
+				}, { default: () => [createVNode(Icon_default, {
+					"class": `${prefixCls}-header-actions-icon ${hashId.value}`.trim(),
+					"type": isDark.value ? "moon" : "sunny"
+				}, null)] })]),
+				actions.value.themeEditor && !isMobile.value && createVNode("div", { "class": `${prefixCls}-header-actions-item ${hashId.value}`.trim() }, [createVNode(SettingOutlined, { "onClick": () => onClick("themeEditor") }, null)]),
+				actions.value.fullScreen && !isMobile.value && createVNode("div", { "class": `${prefixCls}-header-actions-item ${hashId.value}`.trim() }, [createVNode(FullScreenIcon, { "onClick": () => toggle() }, null)]),
+				actionsRender ? actionsRender?.([`${prefixCls}-header-actions-item`, hashId.value]) : null
+			]), createVNode(Dropdown, mergeProps({ "placement": "bottomRight" }, props.dropdownProps, { "overlay": slotsProps.dropdownMenuRender || createVNode(Menu, null, { default: () => [
+				slotsProps.dropdownMenuExtraItemRender,
+				actions.value.lock && createVNode(Fragment, null, [createVNode(MenuItem, {
+					"key": "lock",
+					"icon": createVNode(LockOutlined, null, null),
+					"onClick": () => openLock(true)
+				}, { default: () => [createTextVNode("锁定屏幕")] }), createVNode(Menu.Divider, null, null)]),
+				createVNode(MenuItem, {
+					"key": "logout",
+					"icon": createVNode(LogoutOutlined, null, null),
+					"onClick": () => props.onLogout?.()
+				}, { default: () => [createTextVNode("退出登录")] })
+			] }) }), { default: () => [slotsProps.dropdownRender || createVNode("div", { "class": `${prefixCls}-header-actions-avatar ${hashId.value}`.trim() }, [createVNode(Avatar, {
+				"size": 28,
+				"icon": createVNode(UserOutlined, null, null),
+				"src": props.avatar
+			}, null), props.name && createVNode("span", { "class": `${prefixCls}-header-actions-name ${hashId.value}`.trim() }, [props.name])])] })])] })]), createVNode(PageLock_default, {
+				"open": lock.value,
+				"name": props.name,
+				"onOpenChange": (val) => openLock(val)
+			}, null)]));
+		};
+	}
+});
+var RightContent_default = GlobalRightContent;
+
+//#endregion
+export { RightContent_default as default };