@greypan/web-ui 1.4.2 → 2.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.CN.md +674 -232
- package/README.md +683 -237
- package/dist/_virtual/{_@oxc-project_runtime@0.138.0 → _@oxc-project_runtime@0.140.0}/helpers/esm/decorate.js +1 -1
- package/dist/assets/glass.js +6 -0
- package/dist/assets/glass.js.map +1 -0
- package/dist/assets/menu-portal.js +6 -0
- package/dist/assets/menu-portal.js.map +1 -0
- package/dist/assets/overlay-motion.js +6 -0
- package/dist/assets/overlay-motion.js.map +1 -0
- package/dist/assets/toast-containers.js +6 -0
- package/dist/assets/toast-containers.js.map +1 -0
- package/dist/components/avatar/index.d.ts +30 -0
- package/dist/components/avatar/index.js +112 -0
- package/dist/components/avatar/index.js.map +1 -0
- package/dist/components/avatar/style.js +6 -0
- package/dist/components/avatar/style.js.map +1 -0
- package/dist/components/back-top/index.d.ts +8 -7
- package/dist/components/back-top/index.js +37 -32
- package/dist/components/back-top/index.js.map +1 -1
- package/dist/components/back-top/style.js +1 -1
- package/dist/components/back-top/style.js.map +1 -1
- package/dist/components/badge/index.d.ts +27 -0
- package/dist/components/badge/index.js +121 -0
- package/dist/components/badge/index.js.map +1 -0
- package/dist/components/badge/style.js +6 -0
- package/dist/components/badge/style.js.map +1 -0
- package/dist/components/button/index.d.ts +16 -3
- package/dist/components/button/index.js +56 -17
- package/dist/components/button/index.js.map +1 -1
- package/dist/components/button/style.js +1 -1
- package/dist/components/button/style.js.map +1 -1
- package/dist/components/button-group/index.d.ts +16 -0
- package/dist/components/button-group/index.js +49 -0
- package/dist/components/button-group/index.js.map +1 -0
- package/dist/components/button-group/style.js +6 -0
- package/dist/components/button-group/style.js.map +1 -0
- package/dist/components/checkbox/index.d.ts +39 -0
- package/dist/components/checkbox/index.js +111 -0
- package/dist/components/checkbox/index.js.map +1 -0
- package/dist/components/checkbox/style.js +6 -0
- package/dist/components/checkbox/style.js.map +1 -0
- package/dist/components/checkbox-group/index.d.ts +35 -0
- package/dist/components/checkbox-group/index.js +99 -0
- package/dist/components/checkbox-group/index.js.map +1 -0
- package/dist/components/checkbox-group/style.js +6 -0
- package/dist/components/checkbox-group/style.js.map +1 -0
- package/dist/components/context-menu/index.d.ts +84 -0
- package/dist/components/context-menu/index.js +294 -0
- package/dist/components/context-menu/index.js.map +1 -0
- package/dist/components/context-menu/style.js +6 -0
- package/dist/components/context-menu/style.js.map +1 -0
- package/dist/components/dialog/index.d.ts +41 -0
- package/dist/components/dialog/index.js +118 -0
- package/dist/components/dialog/index.js.map +1 -0
- package/dist/components/dialog/style.js +6 -0
- package/dist/components/dialog/style.js.map +1 -0
- package/dist/components/drawer/index.d.ts +57 -0
- package/dist/components/drawer/index.js +172 -0
- package/dist/components/drawer/index.js.map +1 -0
- package/dist/components/drawer/style.js +6 -0
- package/dist/components/drawer/style.js.map +1 -0
- package/dist/components/dropdown/index.d.ts +87 -0
- package/dist/components/dropdown/index.js +324 -0
- package/dist/components/dropdown/index.js.map +1 -0
- package/dist/components/dropdown/style.js +6 -0
- package/dist/components/dropdown/style.js.map +1 -0
- package/dist/components/dropdown-divider/index.d.ts +11 -0
- package/dist/components/dropdown-divider/index.js +18 -0
- package/dist/components/dropdown-divider/index.js.map +1 -0
- package/dist/components/dropdown-divider/style.js +6 -0
- package/dist/components/dropdown-divider/style.js.map +1 -0
- package/dist/components/dropdown-header/index.d.ts +11 -0
- package/dist/components/dropdown-header/index.js +18 -0
- package/dist/components/dropdown-header/index.js.map +1 -0
- package/dist/components/dropdown-header/style.js +6 -0
- package/dist/components/dropdown-header/style.js.map +1 -0
- package/dist/components/dropdown-item/index.d.ts +17 -0
- package/dist/components/dropdown-item/index.js +44 -0
- package/dist/components/dropdown-item/index.js.map +1 -0
- package/dist/components/dropdown-item/style.js +6 -0
- package/dist/components/dropdown-item/style.js.map +1 -0
- package/dist/components/empty/index.d.ts +23 -0
- package/dist/components/empty/index.js +83 -0
- package/dist/components/empty/index.js.map +1 -0
- package/dist/components/empty/style.js +6 -0
- package/dist/components/empty/style.js.map +1 -0
- package/dist/components/icon/index.d.ts +16 -0
- package/dist/components/icon/index.js +45 -0
- package/dist/components/icon/index.js.map +1 -0
- package/dist/components/icon/style.js +6 -0
- package/dist/components/icon/style.js.map +1 -0
- package/dist/components/index.d.ts +34 -0
- package/dist/components/index.js +37 -0
- package/dist/components/input/index.d.ts +47 -0
- package/dist/components/input/index.js +140 -0
- package/dist/components/input/index.js.map +1 -0
- package/dist/components/input/style.js +6 -0
- package/dist/components/input/style.js.map +1 -0
- package/dist/components/input-number/index.d.ts +52 -0
- package/dist/components/input-number/index.js +178 -0
- package/dist/components/input-number/index.js.map +1 -0
- package/dist/components/input-number/style.js +6 -0
- package/dist/components/input-number/style.js.map +1 -0
- package/dist/components/layout/index.d.ts +11 -1
- package/dist/components/layout/index.js +55 -21
- package/dist/components/layout/index.js.map +1 -1
- package/dist/components/layout/style.js +1 -1
- package/dist/components/layout/style.js.map +1 -1
- package/dist/components/option/index.d.ts +33 -0
- package/dist/components/option/index.js +78 -0
- package/dist/components/option/index.js.map +1 -0
- package/dist/components/option/style.js +6 -0
- package/dist/components/option/style.js.map +1 -0
- package/dist/components/popover/index.d.ts +69 -0
- package/dist/components/popover/index.js +231 -0
- package/dist/components/popover/index.js.map +1 -0
- package/dist/components/popover/style.js +6 -0
- package/dist/components/popover/style.js.map +1 -0
- package/dist/components/radio/index.d.ts +39 -0
- package/dist/components/radio/index.js +105 -0
- package/dist/components/radio/index.js.map +1 -0
- package/dist/components/radio/style.js +6 -0
- package/dist/components/radio/style.js.map +1 -0
- package/dist/components/radio-group/index.d.ts +35 -0
- package/dist/components/radio-group/index.js +87 -0
- package/dist/components/radio-group/index.js.map +1 -0
- package/dist/components/radio-group/style.js +6 -0
- package/dist/components/radio-group/style.js.map +1 -0
- package/dist/components/segmented/index.d.ts +33 -0
- package/dist/components/segmented/index.js +95 -0
- package/dist/components/segmented/index.js.map +1 -0
- package/dist/components/segmented/style.js +6 -0
- package/dist/components/segmented/style.js.map +1 -0
- package/dist/components/segmented-trigger/index.d.ts +18 -0
- package/dist/components/segmented-trigger/index.js +52 -0
- package/dist/components/segmented-trigger/index.js.map +1 -0
- package/dist/components/segmented-trigger/style.js +6 -0
- package/dist/components/segmented-trigger/style.js.map +1 -0
- package/dist/components/select/index.d.ts +80 -0
- package/dist/components/select/index.js +291 -0
- package/dist/components/select/index.js.map +1 -0
- package/dist/components/select/style.js +6 -0
- package/dist/components/select/style.js.map +1 -0
- package/dist/components/slider/index.d.ts +61 -0
- package/dist/components/slider/index.js +219 -0
- package/dist/components/slider/index.js.map +1 -0
- package/dist/components/slider/style.js +6 -0
- package/dist/components/slider/style.js.map +1 -0
- package/dist/components/spinner/index.d.ts +32 -0
- package/dist/components/spinner/index.js +52 -0
- package/dist/components/spinner/index.js.map +1 -0
- package/dist/components/spinner/style.js +6 -0
- package/dist/components/spinner/style.js.map +1 -0
- package/dist/components/svg-draw-lines/index.d.ts +30 -9
- package/dist/components/svg-draw-lines/index.js +87 -62
- package/dist/components/svg-draw-lines/index.js.map +1 -1
- package/dist/components/svg-draw-lines/style.js +1 -1
- package/dist/components/svg-draw-lines/style.js.map +1 -1
- package/dist/components/switch/index.d.ts +37 -0
- package/dist/components/switch/index.js +117 -0
- package/dist/components/switch/index.js.map +1 -0
- package/dist/components/switch/style.js +6 -0
- package/dist/components/switch/style.js.map +1 -0
- package/dist/components/textarea/index.d.ts +65 -0
- package/dist/components/textarea/index.js +204 -0
- package/dist/components/textarea/index.js.map +1 -0
- package/dist/components/textarea/style.js +6 -0
- package/dist/components/textarea/style.js.map +1 -0
- package/dist/components/theme/index.d.ts +29 -0
- package/dist/components/theme/index.js +78 -0
- package/dist/components/theme/index.js.map +1 -0
- package/dist/components/theme/style.js +6 -0
- package/dist/components/theme/style.js.map +1 -0
- package/dist/components/toast/index.d.ts +3 -0
- package/dist/components/toast/index.js +3 -0
- package/dist/components/toast/manager.d.ts +15 -0
- package/dist/components/toast/manager.js +98 -0
- package/dist/components/toast/manager.js.map +1 -0
- package/dist/components/toast/style.js +6 -0
- package/dist/components/toast/style.js.map +1 -0
- package/dist/components/toast/toast.d.ts +42 -0
- package/dist/components/toast/toast.js +122 -0
- package/dist/components/toast/toast.js.map +1 -0
- package/dist/components/toast/types.d.ts +23 -0
- package/dist/components/tooltip/index.d.ts +59 -0
- package/dist/components/tooltip/index.js +190 -0
- package/dist/components/tooltip/index.js.map +1 -0
- package/dist/components/tooltip/style.js +6 -0
- package/dist/components/tooltip/style.js.map +1 -0
- package/dist/icons/generated/heroicons-check-16-solid.d.ts +6 -0
- package/dist/icons/generated/heroicons-check-16-solid.js +10 -0
- package/dist/icons/generated/heroicons-check-16-solid.js.map +1 -0
- package/dist/icons/generated/heroicons-x-mark-16-solid.d.ts +6 -0
- package/dist/icons/generated/heroicons-x-mark-16-solid.js +10 -0
- package/dist/icons/generated/heroicons-x-mark-16-solid.js.map +1 -0
- package/dist/icons/generated/jam-close-circle-f.d.ts +8 -0
- package/dist/icons/generated/jam-close-circle-f.js +12 -0
- package/dist/icons/generated/jam-close-circle-f.js.map +1 -0
- package/dist/icons/generated/jam-volume.d.ts +8 -0
- package/dist/icons/generated/jam-watch-f.d.ts +8 -0
- package/dist/icons/generated/lucide-arrow-down-to-line.d.ts +6 -0
- package/dist/icons/generated/lucide-arrow-down-to-line.js +10 -0
- package/dist/icons/generated/lucide-arrow-down-to-line.js.map +1 -0
- package/dist/icons/generated/lucide-arrow-up-to-line.d.ts +6 -0
- package/dist/icons/generated/lucide-arrow-up-to-line.js +10 -0
- package/dist/icons/generated/lucide-arrow-up-to-line.js.map +1 -0
- package/dist/icons/generated/lucide-bell.d.ts +6 -0
- package/dist/icons/generated/lucide-bell.js +10 -0
- package/dist/icons/generated/lucide-bell.js.map +1 -0
- package/dist/icons/generated/lucide-check.d.ts +6 -0
- package/dist/icons/generated/lucide-check.js +10 -0
- package/dist/icons/generated/lucide-check.js.map +1 -0
- package/dist/icons/generated/lucide-chevron-down.d.ts +6 -0
- package/dist/icons/generated/lucide-chevron-down.js +10 -0
- package/dist/icons/generated/lucide-chevron-down.js.map +1 -0
- package/dist/icons/generated/lucide-chevron-left.d.ts +6 -0
- package/dist/icons/generated/lucide-chevron-left.js +10 -0
- package/dist/icons/generated/lucide-chevron-left.js.map +1 -0
- package/dist/icons/generated/lucide-chevron-right.d.ts +6 -0
- package/dist/icons/generated/lucide-chevron-right.js +10 -0
- package/dist/icons/generated/lucide-chevron-right.js.map +1 -0
- package/dist/icons/generated/lucide-chevron-up.d.ts +6 -0
- package/dist/icons/generated/lucide-chevron-up.js +10 -0
- package/dist/icons/generated/lucide-chevron-up.js.map +1 -0
- package/dist/icons/generated/lucide-circle-alert.d.ts +6 -0
- package/dist/icons/generated/lucide-circle-alert.js +10 -0
- package/dist/icons/generated/lucide-circle-alert.js.map +1 -0
- package/dist/icons/generated/lucide-clipboard-paste.d.ts +6 -0
- package/dist/icons/generated/lucide-clipboard-paste.js +10 -0
- package/dist/icons/generated/lucide-clipboard-paste.js.map +1 -0
- package/dist/icons/generated/lucide-copy.d.ts +6 -0
- package/dist/icons/generated/lucide-copy.js +10 -0
- package/dist/icons/generated/lucide-copy.js.map +1 -0
- package/dist/icons/generated/lucide-download.d.ts +6 -0
- package/dist/icons/generated/lucide-download.js +10 -0
- package/dist/icons/generated/lucide-download.js.map +1 -0
- package/dist/icons/generated/lucide-file.d.ts +6 -0
- package/dist/icons/generated/lucide-file.js +10 -0
- package/dist/icons/generated/lucide-file.js.map +1 -0
- package/dist/icons/generated/lucide-folder.d.ts +6 -0
- package/dist/icons/generated/lucide-folder.js +10 -0
- package/dist/icons/generated/lucide-folder.js.map +1 -0
- package/dist/icons/generated/lucide-globe.d.ts +6 -0
- package/dist/icons/generated/lucide-globe.js +10 -0
- package/dist/icons/generated/lucide-globe.js.map +1 -0
- package/dist/icons/generated/lucide-heart.d.ts +6 -0
- package/dist/icons/generated/lucide-heart.js +10 -0
- package/dist/icons/generated/lucide-heart.js.map +1 -0
- package/dist/icons/generated/lucide-image.d.ts +6 -0
- package/dist/icons/generated/lucide-image.js +10 -0
- package/dist/icons/generated/lucide-image.js.map +1 -0
- package/dist/icons/generated/lucide-inbox.d.ts +6 -0
- package/dist/icons/generated/lucide-inbox.js +10 -0
- package/dist/icons/generated/lucide-inbox.js.map +1 -0
- package/dist/icons/generated/lucide-info.d.ts +6 -0
- package/dist/icons/generated/lucide-info.js +10 -0
- package/dist/icons/generated/lucide-info.js.map +1 -0
- package/dist/icons/generated/lucide-loader-circle.d.ts +6 -0
- package/dist/icons/generated/lucide-loader-circle.js +10 -0
- package/dist/icons/generated/lucide-loader-circle.js.map +1 -0
- package/dist/icons/generated/lucide-mail.d.ts +6 -0
- package/dist/icons/generated/lucide-mail.js +10 -0
- package/dist/icons/generated/lucide-mail.js.map +1 -0
- package/dist/icons/generated/lucide-minus.d.ts +6 -0
- package/dist/icons/generated/lucide-minus.js +10 -0
- package/dist/icons/generated/lucide-minus.js.map +1 -0
- package/dist/icons/generated/lucide-plus.d.ts +6 -0
- package/dist/icons/generated/lucide-plus.js +10 -0
- package/dist/icons/generated/lucide-plus.js.map +1 -0
- package/dist/icons/generated/lucide-printer.d.ts +6 -0
- package/dist/icons/generated/lucide-printer.js +10 -0
- package/dist/icons/generated/lucide-printer.js.map +1 -0
- package/dist/icons/generated/lucide-redo-2.d.ts +6 -0
- package/dist/icons/generated/lucide-redo-2.js +10 -0
- package/dist/icons/generated/lucide-redo-2.js.map +1 -0
- package/dist/icons/generated/lucide-scissors.d.ts +6 -0
- package/dist/icons/generated/lucide-scissors.js +10 -0
- package/dist/icons/generated/lucide-scissors.js.map +1 -0
- package/dist/icons/generated/lucide-search.d.ts +6 -0
- package/dist/icons/generated/lucide-search.js +10 -0
- package/dist/icons/generated/lucide-search.js.map +1 -0
- package/dist/icons/generated/lucide-settings.d.ts +6 -0
- package/dist/icons/generated/lucide-settings.js +10 -0
- package/dist/icons/generated/lucide-settings.js.map +1 -0
- package/dist/icons/generated/lucide-star.d.ts +6 -0
- package/dist/icons/generated/lucide-star.js +10 -0
- package/dist/icons/generated/lucide-star.js.map +1 -0
- package/dist/icons/generated/lucide-trash-2.d.ts +6 -0
- package/dist/icons/generated/lucide-trash-2.js +10 -0
- package/dist/icons/generated/lucide-trash-2.js.map +1 -0
- package/dist/icons/generated/lucide-triangle-alert.d.ts +6 -0
- package/dist/icons/generated/lucide-triangle-alert.js +10 -0
- package/dist/icons/generated/lucide-triangle-alert.js.map +1 -0
- package/dist/icons/generated/lucide-undo-2.d.ts +6 -0
- package/dist/icons/generated/lucide-undo-2.js +10 -0
- package/dist/icons/generated/lucide-undo-2.js.map +1 -0
- package/dist/icons/generated/lucide-upload.d.ts +6 -0
- package/dist/icons/generated/lucide-upload.js +10 -0
- package/dist/icons/generated/lucide-upload.js.map +1 -0
- package/dist/icons/generated/lucide-user.d.ts +6 -0
- package/dist/icons/generated/lucide-user.js +10 -0
- package/dist/icons/generated/lucide-user.js.map +1 -0
- package/dist/icons/generated/lucide-x.d.ts +6 -0
- package/dist/icons/generated/lucide-x.js +10 -0
- package/dist/icons/generated/lucide-x.js.map +1 -0
- package/dist/icons/generated/ooui-check.d.ts +6 -0
- package/dist/icons/generated/radix-icons-check.d.ts +6 -0
- package/dist/icons/generated/radix-icons-panel-left-minimized.d.ts +6 -0
- package/dist/icons/generated/radix-icons-panel-left-minimized.js +10 -0
- package/dist/icons/generated/radix-icons-panel-left-minimized.js.map +1 -0
- package/dist/icons/generated/si-check-alt-fill.d.ts +6 -0
- package/dist/icons/index.d.ts +39 -0
- package/dist/icons/index.js +40 -0
- package/dist/node_modules/.pnpm/@floating-ui_core@1.8.0/node_modules/@floating-ui/core/dist/floating-ui.core.js +248 -0
- package/dist/node_modules/.pnpm/@floating-ui_core@1.8.0/node_modules/@floating-ui/core/dist/floating-ui.core.js.map +1 -0
- package/dist/node_modules/.pnpm/@floating-ui_dom@1.8.0/node_modules/@floating-ui/dom/dist/floating-ui.dom.js +324 -0
- package/dist/node_modules/.pnpm/@floating-ui_dom@1.8.0/node_modules/@floating-ui/dom/dist/floating-ui.dom.js.map +1 -0
- package/dist/node_modules/.pnpm/@floating-ui_utils@0.2.12/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.js +99 -0
- package/dist/node_modules/.pnpm/@floating-ui_utils@0.2.12/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.js.map +1 -0
- package/dist/node_modules/.pnpm/@floating-ui_utils@0.2.12/node_modules/@floating-ui/utils/dist/floating-ui.utils.js +102 -0
- package/dist/node_modules/.pnpm/@floating-ui_utils@0.2.12/node_modules/@floating-ui/utils/dist/floating-ui.utils.js.map +1 -0
- package/dist/shared/menu-portal/menu-portal.js +11 -0
- package/dist/shared/menu-portal/menu-portal.js.map +1 -0
- package/dist/shared/normalize/index.js +11 -0
- package/dist/shared/normalize/index.js.map +1 -0
- package/dist/shared/overlay/overlay.js +68 -0
- package/dist/shared/overlay/overlay.js.map +1 -0
- package/dist/shared/overlay/portal.js +29 -0
- package/dist/shared/overlay/portal.js.map +1 -0
- package/dist/shared/overlay/presence.js +34 -0
- package/dist/shared/overlay/presence.js.map +1 -0
- package/dist/shared/property-converters/boolean-with-false-string.js +9 -0
- package/dist/shared/property-converters/boolean-with-false-string.js.map +1 -0
- package/dist/shared/scroll-lock/scroll-lock.js +12 -0
- package/dist/shared/scroll-lock/scroll-lock.js.map +1 -0
- package/dist/shared/theme/overlay-root.js +28 -0
- package/dist/shared/theme/overlay-root.js.map +1 -0
- package/dist/shared/theme/theme-scope.js +27 -0
- package/dist/shared/theme/theme-scope.js.map +1 -0
- package/dist/types/iconify.d.ts +1 -0
- package/dist/types/react.d.ts +35 -9
- package/dist/types/utils.d.ts +14 -0
- package/dist/types/vue.d.ts +47 -7
- package/package.json +29 -13
- package/dist/index.d.ts +0 -4
- package/dist/index.js +0 -5
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
import { LitElement } from 'lit';
|
|
2
|
+
export declare class WebUiContextMenu extends LitElement {
|
|
3
|
+
static styles: import('lit').CSSResult[];
|
|
4
|
+
disabled: boolean;
|
|
5
|
+
lockScroll: boolean;
|
|
6
|
+
private _isOpen;
|
|
7
|
+
private _x;
|
|
8
|
+
private _y;
|
|
9
|
+
private _activeSubmenus;
|
|
10
|
+
private _activeSubmenuItems;
|
|
11
|
+
private readonly _closingSubmenus;
|
|
12
|
+
private _submenuTimer?;
|
|
13
|
+
private _ignoreOutsideClick;
|
|
14
|
+
private _ignoreOutsideClickTimer?;
|
|
15
|
+
private _hoverCleanupFns;
|
|
16
|
+
private _menu?;
|
|
17
|
+
private _hasScrollLock;
|
|
18
|
+
private _restoreFocusTarget?;
|
|
19
|
+
private _shouldOpenInstantly;
|
|
20
|
+
/** 当前菜单是否打开 */
|
|
21
|
+
get isOpen(): boolean;
|
|
22
|
+
connectedCallback(): void;
|
|
23
|
+
disconnectedCallback(): void;
|
|
24
|
+
protected updated(changed: Map<string, unknown>): void;
|
|
25
|
+
/**
|
|
26
|
+
* 在指定视口坐标打开菜单。
|
|
27
|
+
* @param x 水平坐标(px)。
|
|
28
|
+
* @param y 垂直坐标(px)。
|
|
29
|
+
* @returns 无返回值;打开后派发 `open-change` 事件。
|
|
30
|
+
*/
|
|
31
|
+
openAt(x: number, y: number): void;
|
|
32
|
+
private _openAt;
|
|
33
|
+
/**
|
|
34
|
+
* 关闭菜单。
|
|
35
|
+
* @returns 无返回值;关闭后派发 `open-change` 事件。
|
|
36
|
+
*/
|
|
37
|
+
close(): void;
|
|
38
|
+
private _positionMenu;
|
|
39
|
+
private _focusFirstItem;
|
|
40
|
+
private _setupMenuItems;
|
|
41
|
+
private _returnItemsToSlot;
|
|
42
|
+
private _closeMenuAfterPresence;
|
|
43
|
+
private _hideMenuItems;
|
|
44
|
+
private _openSubmenu;
|
|
45
|
+
private _closeSubmenusFrom;
|
|
46
|
+
private _closeSubmenuAfterPresence;
|
|
47
|
+
private _restoreSubmenuItems;
|
|
48
|
+
private _restoreClosingSubmenus;
|
|
49
|
+
private _getItemLevel;
|
|
50
|
+
private _positionSubmenu;
|
|
51
|
+
private _dispatchChange;
|
|
52
|
+
private _isInsideShadowRoot;
|
|
53
|
+
private _onContextMenu;
|
|
54
|
+
private _onContextMenuOutside;
|
|
55
|
+
private _onKeydown;
|
|
56
|
+
private _onClickOutside;
|
|
57
|
+
private _onMenuClick;
|
|
58
|
+
private _getDropdownItemFromEvent;
|
|
59
|
+
private _getLevelItems;
|
|
60
|
+
private _bindLevelHovers;
|
|
61
|
+
private _ignoreCurrentOutsideClick;
|
|
62
|
+
private _onWheel;
|
|
63
|
+
private _onTouchMove;
|
|
64
|
+
private _onDocumentKeydown;
|
|
65
|
+
private _closeLastSubmenuOrMenu;
|
|
66
|
+
private _preventBackgroundScroll;
|
|
67
|
+
private _syncScrollLock;
|
|
68
|
+
private _getEnabledLevelItems;
|
|
69
|
+
private _getFocusedItem;
|
|
70
|
+
private _getFocusedLevel;
|
|
71
|
+
private _focusMenuItem;
|
|
72
|
+
private _isMenuPanelEvent;
|
|
73
|
+
render(): import('lit').TemplateResult<1>;
|
|
74
|
+
readonly $events: {
|
|
75
|
+
'open-change': CustomEvent<{
|
|
76
|
+
open: boolean;
|
|
77
|
+
}>;
|
|
78
|
+
};
|
|
79
|
+
}
|
|
80
|
+
declare global {
|
|
81
|
+
interface HTMLElementTagNameMap {
|
|
82
|
+
'web-ui-context-menu': WebUiContextMenu;
|
|
83
|
+
}
|
|
84
|
+
}
|
|
@@ -0,0 +1,294 @@
|
|
|
1
|
+
import e from "../../_virtual/_@oxc-project_runtime@0.140.0/helpers/esm/decorate.js";
|
|
2
|
+
import t from "../../assets/glass.js";
|
|
3
|
+
import { booleanWithFalseString as n } from "../../shared/property-converters/boolean-with-false-string.js";
|
|
4
|
+
import "../dropdown-divider/index.js";
|
|
5
|
+
import "../dropdown-header/index.js";
|
|
6
|
+
import "../dropdown-item/index.js";
|
|
7
|
+
import { createMenuPortalOverlay as r } from "../../shared/menu-portal/menu-portal.js";
|
|
8
|
+
import { hideOverlayPresence as i, showOverlayPresence as a } from "../../shared/overlay/presence.js";
|
|
9
|
+
import { lockScroll as o, unlockScroll as s } from "../../shared/scroll-lock/scroll-lock.js";
|
|
10
|
+
import c from "./style.js";
|
|
11
|
+
import { LitElement as l, html as u, unsafeCSS as d } from "lit";
|
|
12
|
+
import { customElement as f, property as p, state as m } from "lit/decorators.js";
|
|
13
|
+
//#region src/components/context-menu/index.ts
|
|
14
|
+
var h = class extends l {
|
|
15
|
+
constructor(...e) {
|
|
16
|
+
super(...e), this.disabled = !1, this.lockScroll = !0, this._isOpen = !1, this._x = 0, this._y = 0, this._activeSubmenus = [], this._activeSubmenuItems = [], this._closingSubmenus = /* @__PURE__ */ new Map(), this._ignoreOutsideClick = !1, this._hoverCleanupFns = [], this._hasScrollLock = !1, this._shouldOpenInstantly = !0, this._onContextMenu = (e) => {
|
|
17
|
+
this.disabled || (e.preventDefault(), this._restoreFocusTarget = e.target instanceof HTMLElement ? e.target : void 0, this._openAt(e.clientX, e.clientY, !1));
|
|
18
|
+
}, this._onContextMenuOutside = (e) => {
|
|
19
|
+
this._isOpen && !this._isInsideShadowRoot(e) && this.close();
|
|
20
|
+
}, this._onKeydown = (e) => {
|
|
21
|
+
if (!this.disabled && (e.key === "ContextMenu" || e.shiftKey && e.key === "F10")) {
|
|
22
|
+
e.preventDefault();
|
|
23
|
+
let t = document.activeElement;
|
|
24
|
+
if (t && t !== document.body) {
|
|
25
|
+
let e = t.getBoundingClientRect();
|
|
26
|
+
this._openAt(e.left, e.bottom, !0);
|
|
27
|
+
} else this._openAt(window.innerWidth / 2, window.innerHeight / 2, !0);
|
|
28
|
+
return;
|
|
29
|
+
}
|
|
30
|
+
}, this._onClickOutside = (e) => {
|
|
31
|
+
!this._isOpen || this._ignoreOutsideClick || this._isInsideShadowRoot(e) || this.close();
|
|
32
|
+
}, this._onMenuClick = (e) => {
|
|
33
|
+
let t = this._getDropdownItemFromEvent(e);
|
|
34
|
+
if (!(!t || t.hasAttribute("disabled"))) {
|
|
35
|
+
if (t.hasAttribute("submenu")) {
|
|
36
|
+
this._openSubmenu(t);
|
|
37
|
+
return;
|
|
38
|
+
}
|
|
39
|
+
this.close();
|
|
40
|
+
}
|
|
41
|
+
}, this._onWheel = (e) => {
|
|
42
|
+
this._preventBackgroundScroll(e);
|
|
43
|
+
}, this._onTouchMove = (e) => {
|
|
44
|
+
this._preventBackgroundScroll(e);
|
|
45
|
+
}, this._onDocumentKeydown = (e) => {
|
|
46
|
+
if (!this._isOpen) return;
|
|
47
|
+
if (e.key === "Escape" && e.target === this) {
|
|
48
|
+
this._closeLastSubmenuOrMenu(), e.preventDefault();
|
|
49
|
+
return;
|
|
50
|
+
}
|
|
51
|
+
let t = this._getFocusedLevel();
|
|
52
|
+
if (t === void 0) return;
|
|
53
|
+
let n = this._getEnabledLevelItems(t), r = this._getFocusedItem(), i = r ? n.indexOf(r) : -1;
|
|
54
|
+
switch (e.key) {
|
|
55
|
+
case "ArrowDown":
|
|
56
|
+
this._focusMenuItem(n[(i + 1 + n.length) % n.length]);
|
|
57
|
+
break;
|
|
58
|
+
case "ArrowUp":
|
|
59
|
+
this._focusMenuItem(n[(i - 1 + n.length) % n.length]);
|
|
60
|
+
break;
|
|
61
|
+
case "Home":
|
|
62
|
+
this._focusMenuItem(n[0]);
|
|
63
|
+
break;
|
|
64
|
+
case "End":
|
|
65
|
+
this._focusMenuItem(n.at(-1));
|
|
66
|
+
break;
|
|
67
|
+
case "ArrowRight":
|
|
68
|
+
r?.hasAttribute("submenu") && (this._openSubmenu(r, !0), requestAnimationFrame(() => this._focusMenuItem(this._getEnabledLevelItems(t + 1)[0])));
|
|
69
|
+
break;
|
|
70
|
+
case "ArrowLeft":
|
|
71
|
+
if (t > 0) {
|
|
72
|
+
let e = this._activeSubmenuItems[t - 1];
|
|
73
|
+
this._closeSubmenusFrom(t - 1), this._focusMenuItem(e), this._bindLevelHovers();
|
|
74
|
+
}
|
|
75
|
+
break;
|
|
76
|
+
case "Enter":
|
|
77
|
+
case " ":
|
|
78
|
+
r?.click();
|
|
79
|
+
break;
|
|
80
|
+
case "Escape":
|
|
81
|
+
this._closeLastSubmenuOrMenu();
|
|
82
|
+
break;
|
|
83
|
+
default: return;
|
|
84
|
+
}
|
|
85
|
+
e.preventDefault();
|
|
86
|
+
};
|
|
87
|
+
}
|
|
88
|
+
static {
|
|
89
|
+
this.styles = [d(t), d(c)];
|
|
90
|
+
}
|
|
91
|
+
get isOpen() {
|
|
92
|
+
return this._isOpen;
|
|
93
|
+
}
|
|
94
|
+
connectedCallback() {
|
|
95
|
+
super.connectedCallback(), this._hideMenuItems(), this.addEventListener("contextmenu", this._onContextMenu), this.addEventListener("keydown", this._onKeydown), this.addEventListener("click", this._onMenuClick), document.addEventListener("click", this._onClickOutside), document.addEventListener("contextmenu", this._onContextMenuOutside), document.addEventListener("wheel", this._onWheel, {
|
|
96
|
+
capture: !0,
|
|
97
|
+
passive: !1
|
|
98
|
+
}), document.addEventListener("touchmove", this._onTouchMove, {
|
|
99
|
+
capture: !0,
|
|
100
|
+
passive: !1
|
|
101
|
+
}), document.addEventListener("keydown", this._onDocumentKeydown);
|
|
102
|
+
}
|
|
103
|
+
disconnectedCallback() {
|
|
104
|
+
super.disconnectedCallback(), this.removeEventListener("contextmenu", this._onContextMenu), this.removeEventListener("keydown", this._onKeydown), this.removeEventListener("click", this._onMenuClick), document.removeEventListener("click", this._onClickOutside), document.removeEventListener("contextmenu", this._onContextMenuOutside), document.removeEventListener("wheel", this._onWheel, !0), document.removeEventListener("touchmove", this._onTouchMove, !0), document.removeEventListener("keydown", this._onDocumentKeydown), clearTimeout(this._submenuTimer), clearTimeout(this._ignoreOutsideClickTimer), this._hoverCleanupFns.forEach((e) => e()), this._hasScrollLock &&= (s(), !1), this._returnItemsToSlot(), this._menu?.remove(), this._menu = void 0, this._closeSubmenusFrom(0, !0), this._restoreClosingSubmenus();
|
|
105
|
+
}
|
|
106
|
+
updated(e) {
|
|
107
|
+
if (!this.isConnected) {
|
|
108
|
+
this._syncScrollLock(!1);
|
|
109
|
+
return;
|
|
110
|
+
}
|
|
111
|
+
e.has("_isOpen") && (this._isOpen ? (this._syncScrollLock(), this._menu || (this._menu = r("context-menu", this), this._menu.setAttribute("role", "menu"), this._menu.setAttribute("aria-label", "上下文菜单"), this._menu.addEventListener("click", this._onMenuClick)), requestAnimationFrame(() => {
|
|
112
|
+
!this._isOpen || !this._menu || (this._setupMenuItems(), this._positionMenu(), a(this._menu, { isInstant: this._shouldOpenInstantly }), this._shouldOpenInstantly = !0, this._focusFirstItem(), this._bindLevelHovers());
|
|
113
|
+
})) : (this._syncScrollLock(!1), this._closeMenuAfterPresence()), this._dispatchChange(this._isOpen)), e.has("lockScroll") && this._syncScrollLock();
|
|
114
|
+
}
|
|
115
|
+
openAt(e, t) {
|
|
116
|
+
this._openAt(e, t, !0);
|
|
117
|
+
}
|
|
118
|
+
_openAt(e, t, n) {
|
|
119
|
+
if (!this.disabled) {
|
|
120
|
+
if (this._x = e, this._y = t, this._shouldOpenInstantly = n, this._ignoreCurrentOutsideClick(), this._isOpen) {
|
|
121
|
+
requestAnimationFrame(() => this._positionMenu());
|
|
122
|
+
return;
|
|
123
|
+
}
|
|
124
|
+
this._restoreFocusTarget ??= document.activeElement instanceof HTMLElement ? document.activeElement : void 0, this._isOpen = !0;
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
close() {
|
|
128
|
+
this._isOpen &&= !1;
|
|
129
|
+
}
|
|
130
|
+
_positionMenu() {
|
|
131
|
+
let e = this._menu;
|
|
132
|
+
if (!e) return;
|
|
133
|
+
e.style.visibility = "hidden", e.style.display = "";
|
|
134
|
+
let { width: t, height: n } = e.getBoundingClientRect(), r = window.innerWidth, i = window.innerHeight, a = this._x, o = this._y;
|
|
135
|
+
a + t > r && (a = r - t - 8), o + n > i && (o = i - n - 8), a < 0 && (a = 8), o < 0 && (o = 8), e.style.left = `${a}px`, e.style.top = `${o}px`;
|
|
136
|
+
let s = a < this._x ? "right" : "left", c = o < this._y ? "bottom" : "top";
|
|
137
|
+
e.style.setProperty("--wui-overlay-transform-origin", `${c} ${s}`), e.style.visibility = "";
|
|
138
|
+
}
|
|
139
|
+
_focusFirstItem() {
|
|
140
|
+
let e = this._menu?.querySelectorAll("web-ui-dropdown-item:not([disabled])")?.[0];
|
|
141
|
+
e && this._focusMenuItem(e);
|
|
142
|
+
}
|
|
143
|
+
_setupMenuItems() {
|
|
144
|
+
let e = this._menu;
|
|
145
|
+
e && (this._hideMenuItems(), Array.from(this.children).forEach((t) => {
|
|
146
|
+
t.matches("web-ui-dropdown-item, web-ui-dropdown-divider, web-ui-dropdown-header") && e.appendChild(t);
|
|
147
|
+
}));
|
|
148
|
+
}
|
|
149
|
+
_returnItemsToSlot() {
|
|
150
|
+
let e = this._menu;
|
|
151
|
+
e && (this._closeSubmenusFrom(0, !0), this._restoreClosingSubmenus(), Array.from(e.children).forEach((e) => {
|
|
152
|
+
this.appendChild(e);
|
|
153
|
+
}));
|
|
154
|
+
}
|
|
155
|
+
async _closeMenuAfterPresence() {
|
|
156
|
+
let e = this._menu;
|
|
157
|
+
e && !await i(e) || this._isOpen || !this.isConnected || this._menu !== e || (this._returnItemsToSlot(), e?.remove(), this._menu = void 0, this._restoreFocusTarget?.focus(), this._restoreFocusTarget = void 0);
|
|
158
|
+
}
|
|
159
|
+
_hideMenuItems() {
|
|
160
|
+
Array.from(this.children).forEach((e) => {
|
|
161
|
+
e.matches("web-ui-dropdown-item, web-ui-dropdown-divider, web-ui-dropdown-header") && e.setAttribute("slot", "context-menu-hidden");
|
|
162
|
+
}), this.querySelectorAll("web-ui-dropdown-item[submenu]").forEach((e) => {
|
|
163
|
+
Array.from(e.children).forEach((e) => {
|
|
164
|
+
e.matches("web-ui-dropdown-item, web-ui-dropdown-divider, web-ui-dropdown-header") && e.setAttribute("slot", "context-menu-hidden");
|
|
165
|
+
});
|
|
166
|
+
});
|
|
167
|
+
}
|
|
168
|
+
_openSubmenu(e, t = !1) {
|
|
169
|
+
if (!this._isOpen || !e.hasAttribute("submenu") || e.hasAttribute("disabled")) return;
|
|
170
|
+
let n = this._getItemLevel(e);
|
|
171
|
+
if (n === -1 || this._activeSubmenuItems[n] === e) return;
|
|
172
|
+
this._closeSubmenusFrom(n);
|
|
173
|
+
let i = this._closingSubmenus.get(e);
|
|
174
|
+
if (i) {
|
|
175
|
+
this._closingSubmenus.delete(e), this._activeSubmenus[n] = i, this._activeSubmenuItems[n] = e, e.setAttribute("active", ""), this._positionSubmenu(e, i), a(i, { isInstant: t }), this._bindLevelHovers();
|
|
176
|
+
return;
|
|
177
|
+
}
|
|
178
|
+
let o = Array.from(e.children).filter((e) => e.matches("web-ui-dropdown-item, web-ui-dropdown-divider, web-ui-dropdown-header"));
|
|
179
|
+
if (o.length === 0) return;
|
|
180
|
+
let s = r("context-submenu", this);
|
|
181
|
+
s.dataset.level = String(n), s.setAttribute("role", "menu"), s.setAttribute("aria-label", "子菜单"), s.style.visibility = "hidden", s.addEventListener("click", this._onMenuClick), o.forEach((e) => s.appendChild(e)), this._activeSubmenus[n] = s, this._activeSubmenuItems[n] = e, e.setAttribute("active", ""), this._positionSubmenu(e, s), a(s, { isInstant: t }), this._bindLevelHovers();
|
|
182
|
+
}
|
|
183
|
+
_closeSubmenusFrom(e, t = !1) {
|
|
184
|
+
for (let n = this._activeSubmenus.length - 1; n >= e; n--) {
|
|
185
|
+
let e = this._activeSubmenus[n], r = this._activeSubmenuItems[n];
|
|
186
|
+
r?.removeAttribute("active"), !r || t ? (this._restoreSubmenuItems(e, r), e.remove()) : (this._closingSubmenus.set(r, e), this._closeSubmenuAfterPresence(e, r));
|
|
187
|
+
}
|
|
188
|
+
this._activeSubmenus.length = e, this._activeSubmenuItems.length = e;
|
|
189
|
+
}
|
|
190
|
+
async _closeSubmenuAfterPresence(e, t) {
|
|
191
|
+
await i(e) && this._closingSubmenus.get(t) === e && (this._closingSubmenus.delete(t), this._restoreSubmenuItems(e, t), e.remove());
|
|
192
|
+
}
|
|
193
|
+
_restoreSubmenuItems(e, t) {
|
|
194
|
+
Array.from(e.children).forEach((e) => t?.appendChild(e));
|
|
195
|
+
}
|
|
196
|
+
_restoreClosingSubmenus() {
|
|
197
|
+
this._closingSubmenus.forEach((e, t) => {
|
|
198
|
+
this._restoreSubmenuItems(e, t), e.remove();
|
|
199
|
+
}), this._closingSubmenus.clear();
|
|
200
|
+
}
|
|
201
|
+
_getItemLevel(e) {
|
|
202
|
+
if (this._menu?.contains(e)) return 0;
|
|
203
|
+
let t = this._activeSubmenus.findIndex((t) => t.contains(e));
|
|
204
|
+
return t === -1 ? -1 : t + 1;
|
|
205
|
+
}
|
|
206
|
+
_positionSubmenu(e, t) {
|
|
207
|
+
let n = e.getBoundingClientRect(), r = t.getBoundingClientRect(), i = n.right + r.width + 8 <= window.innerWidth, a = i ? n.right : Math.max(8, n.left - r.width), o = Math.min(Math.max(8, n.top), window.innerHeight - r.height - 8);
|
|
208
|
+
t.style.left = `${a}px`, t.style.top = `${o}px`, t.style.setProperty("--wui-overlay-transform-origin", i ? "top left" : "top right"), t.style.visibility = "";
|
|
209
|
+
}
|
|
210
|
+
_dispatchChange(e) {
|
|
211
|
+
this.dispatchEvent(new CustomEvent("open-change", {
|
|
212
|
+
detail: { open: e },
|
|
213
|
+
bubbles: !0,
|
|
214
|
+
composed: !0
|
|
215
|
+
}));
|
|
216
|
+
}
|
|
217
|
+
_isInsideShadowRoot(e) {
|
|
218
|
+
for (let t of e.composedPath()) if (t === this || t === this.shadowRoot || t instanceof Node && t.getRootNode() === this.shadowRoot || t instanceof Node && (this._menu?.contains(t) || this._activeSubmenus.some((e) => e.contains(t)))) return !0;
|
|
219
|
+
return !1;
|
|
220
|
+
}
|
|
221
|
+
_getDropdownItemFromEvent(e) {
|
|
222
|
+
return e.composedPath().find((e) => e instanceof HTMLElement && e.matches("web-ui-dropdown-item")) ?? null;
|
|
223
|
+
}
|
|
224
|
+
_getLevelItems(e) {
|
|
225
|
+
let t = e === 0 ? this._menu : this._activeSubmenus[e - 1];
|
|
226
|
+
return t ? Array.from(t.children).filter((e) => e.matches("web-ui-dropdown-item, web-ui-dropdown-divider, web-ui-dropdown-header")) : [];
|
|
227
|
+
}
|
|
228
|
+
_bindLevelHovers() {
|
|
229
|
+
this._hoverCleanupFns.forEach((e) => e()), this._hoverCleanupFns.length = 0;
|
|
230
|
+
for (let e = 0; e <= this._activeSubmenus.length; e++) this._getLevelItems(e).forEach((t) => {
|
|
231
|
+
if (!t.matches("web-ui-dropdown-item") || t.hasAttribute("disabled")) return;
|
|
232
|
+
let n = (n) => {
|
|
233
|
+
n.pointerType !== "touch" && (clearTimeout(this._submenuTimer), t.hasAttribute("submenu") ? this._activeSubmenuItems[e] !== t && (this._submenuTimer = setTimeout(() => this._openSubmenu(t), 200)) : this._activeSubmenus.length > e && (this._closeSubmenusFrom(e), this._bindLevelHovers()));
|
|
234
|
+
};
|
|
235
|
+
t.addEventListener("pointerenter", n, { passive: !0 }), this._hoverCleanupFns.push(() => t.removeEventListener("pointerenter", n));
|
|
236
|
+
});
|
|
237
|
+
}
|
|
238
|
+
_ignoreCurrentOutsideClick() {
|
|
239
|
+
this._ignoreOutsideClick = !0, clearTimeout(this._ignoreOutsideClickTimer), this._ignoreOutsideClickTimer = setTimeout(() => {
|
|
240
|
+
this._ignoreOutsideClick = !1;
|
|
241
|
+
});
|
|
242
|
+
}
|
|
243
|
+
_closeLastSubmenuOrMenu() {
|
|
244
|
+
if (this._activeSubmenus.length > 0) {
|
|
245
|
+
let e = this._activeSubmenus.length - 1, t = this._activeSubmenuItems[e];
|
|
246
|
+
this._closeSubmenusFrom(e), this._focusMenuItem(t), this._bindLevelHovers();
|
|
247
|
+
} else this.close();
|
|
248
|
+
}
|
|
249
|
+
_preventBackgroundScroll(e) {
|
|
250
|
+
!this._isOpen || !this.lockScroll || this._isMenuPanelEvent(e) || e.preventDefault();
|
|
251
|
+
}
|
|
252
|
+
_syncScrollLock(e = this._isOpen) {
|
|
253
|
+
let t = e && this.lockScroll;
|
|
254
|
+
t !== this._hasScrollLock && (t ? o() : s(), this._hasScrollLock = t);
|
|
255
|
+
}
|
|
256
|
+
_getEnabledLevelItems(e) {
|
|
257
|
+
return this._getLevelItems(e).filter((e) => e.matches("web-ui-dropdown-item:not([disabled])"));
|
|
258
|
+
}
|
|
259
|
+
_getFocusedItem() {
|
|
260
|
+
return [this._menu, ...this._activeSubmenus].filter((e) => e !== void 0).flatMap((e) => Array.from(e.querySelectorAll("web-ui-dropdown-item"))).find((e) => !!e.shadowRoot?.activeElement);
|
|
261
|
+
}
|
|
262
|
+
_getFocusedLevel() {
|
|
263
|
+
let e = this._getFocusedItem();
|
|
264
|
+
if (!e) return;
|
|
265
|
+
if (this._menu?.contains(e)) return 0;
|
|
266
|
+
let t = this._activeSubmenus.findIndex((t) => t.contains(e));
|
|
267
|
+
return t < 0 ? void 0 : t + 1;
|
|
268
|
+
}
|
|
269
|
+
_focusMenuItem(e) {
|
|
270
|
+
!e || e.hasAttribute("disabled") || e.focusItem?.();
|
|
271
|
+
}
|
|
272
|
+
_isMenuPanelEvent(e) {
|
|
273
|
+
return e.composedPath().some((e) => e instanceof HTMLElement && (e.classList.contains("context-menu") || e.classList.contains("context-submenu")));
|
|
274
|
+
}
|
|
275
|
+
render() {
|
|
276
|
+
return u`
|
|
277
|
+
<div class="context-menu-anchor">
|
|
278
|
+
<slot @slotchange=${this._hideMenuItems}></slot>
|
|
279
|
+
</div>
|
|
280
|
+
`;
|
|
281
|
+
}
|
|
282
|
+
};
|
|
283
|
+
e([p({
|
|
284
|
+
type: Boolean,
|
|
285
|
+
reflect: !0
|
|
286
|
+
})], h.prototype, "disabled", void 0), e([p({
|
|
287
|
+
reflect: !0,
|
|
288
|
+
attribute: "lock-scroll",
|
|
289
|
+
converter: n
|
|
290
|
+
})], h.prototype, "lockScroll", void 0), e([m()], h.prototype, "_isOpen", void 0), e([m()], h.prototype, "_x", void 0), e([m()], h.prototype, "_y", void 0), h = e([f("web-ui-context-menu")], h);
|
|
291
|
+
//#endregion
|
|
292
|
+
export { h as WebUiContextMenu };
|
|
293
|
+
|
|
294
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/context-menu/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport '@/components/dropdown-divider'\nimport '@/components/dropdown-header'\nimport '@/components/dropdown-item'\nimport glass from '@/assets/glass.css?inline'\nimport { createMenuPortalOverlay } from '@/shared/menu-portal/menu-portal'\nimport { hideOverlayPresence, showOverlayPresence } from '@/shared/overlay/presence'\nimport { booleanWithFalseString } from '@/shared/property-converters/boolean-with-false-string'\nimport { lockScroll, unlockScroll } from '@/shared/scroll-lock/scroll-lock'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-context-menu')\nexport class WebUiContextMenu extends LitElement {\n static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n\n @property({ type: Boolean, reflect: true }) disabled = false\n @property({ reflect: true, attribute: 'lock-scroll', converter: booleanWithFalseString }) lockScroll = true\n\n @state() private _isOpen = false\n @state() private _x = 0\n @state() private _y = 0\n\n private _activeSubmenus: HTMLElement[] = []\n private _activeSubmenuItems: HTMLElement[] = []\n private readonly _closingSubmenus = new Map<HTMLElement, HTMLElement>()\n private _submenuTimer?: ReturnType<typeof setTimeout>\n private _ignoreOutsideClick = false\n private _ignoreOutsideClickTimer?: ReturnType<typeof setTimeout>\n private _hoverCleanupFns: (() => void)[] = []\n private _menu?: HTMLElement\n private _hasScrollLock = false\n private _restoreFocusTarget?: HTMLElement\n private _shouldOpenInstantly = true\n\n /** 当前菜单是否打开 */\n get isOpen(): boolean {\n return this._isOpen\n }\n\n override connectedCallback() {\n super.connectedCallback()\n this._hideMenuItems()\n this.addEventListener('contextmenu', this._onContextMenu)\n this.addEventListener('keydown', this._onKeydown)\n this.addEventListener('click', this._onMenuClick)\n document.addEventListener('click', this._onClickOutside)\n document.addEventListener('contextmenu', this._onContextMenuOutside)\n document.addEventListener('wheel', this._onWheel, { capture: true, passive: false })\n document.addEventListener('touchmove', this._onTouchMove, { capture: true, passive: false })\n document.addEventListener('keydown', this._onDocumentKeydown)\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this.removeEventListener('contextmenu', this._onContextMenu)\n this.removeEventListener('keydown', this._onKeydown)\n this.removeEventListener('click', this._onMenuClick)\n document.removeEventListener('click', this._onClickOutside)\n document.removeEventListener('contextmenu', this._onContextMenuOutside)\n document.removeEventListener('wheel', this._onWheel, true)\n document.removeEventListener('touchmove', this._onTouchMove, true)\n document.removeEventListener('keydown', this._onDocumentKeydown)\n clearTimeout(this._submenuTimer)\n clearTimeout(this._ignoreOutsideClickTimer)\n this._hoverCleanupFns.forEach(cleanup => cleanup())\n if (this._hasScrollLock) {\n unlockScroll()\n this._hasScrollLock = false\n }\n this._returnItemsToSlot()\n this._menu?.remove()\n this._menu = undefined\n this._closeSubmenusFrom(0, true)\n this._restoreClosingSubmenus()\n }\n\n protected override updated(changed: Map<string, unknown>) {\n // Lit 的已排队更新可在卸载后执行,不能让已失效实例重新获取全局滚动锁。\n if (!this.isConnected) {\n this._syncScrollLock(false)\n return\n }\n\n if (changed.has('_isOpen')) {\n if (this._isOpen) {\n this._syncScrollLock()\n if (!this._menu) {\n this._menu = createMenuPortalOverlay('context-menu', this)\n this._menu.setAttribute('role', 'menu')\n this._menu.setAttribute('aria-label', '上下文菜单')\n this._menu.addEventListener('click', this._onMenuClick)\n }\n requestAnimationFrame(() => {\n if (!this._isOpen || !this._menu) return\n this._setupMenuItems()\n this._positionMenu()\n showOverlayPresence(this._menu, { isInstant: this._shouldOpenInstantly })\n this._shouldOpenInstantly = true\n this._focusFirstItem()\n this._bindLevelHovers()\n })\n } else {\n this._syncScrollLock(false)\n void this._closeMenuAfterPresence()\n }\n this._dispatchChange(this._isOpen)\n }\n if (changed.has('lockScroll')) this._syncScrollLock()\n }\n\n /**\n * 在指定视口坐标打开菜单。\n * @param x 水平坐标(px)。\n * @param y 垂直坐标(px)。\n * @returns 无返回值;打开后派发 `open-change` 事件。\n */\n openAt(x: number, y: number) {\n this._openAt(x, y, true)\n }\n\n private _openAt(x: number, y: number, isInstant: boolean) {\n if (this.disabled) return\n this._x = x\n this._y = y\n this._shouldOpenInstantly = isInstant\n this._ignoreCurrentOutsideClick()\n if (this._isOpen) {\n requestAnimationFrame(() => this._positionMenu())\n return\n }\n this._restoreFocusTarget ??= document.activeElement instanceof HTMLElement ? document.activeElement : undefined\n this._isOpen = true\n }\n\n /**\n * 关闭菜单。\n * @returns 无返回值;关闭后派发 `open-change` 事件。\n */\n close() {\n if (!this._isOpen) return\n this._isOpen = false\n }\n\n private _positionMenu() {\n const menu = this._menu\n if (!menu) return\n\n menu.style.visibility = 'hidden'\n menu.style.display = ''\n\n const { width, height } = menu.getBoundingClientRect()\n const vw = window.innerWidth\n const vh = window.innerHeight\n\n let x = this._x\n let y = this._y\n\n if (x + width > vw) x = vw - width - 8\n if (y + height > vh) y = vh - height - 8\n if (x < 0) x = 8\n if (y < 0) y = 8\n\n menu.style.left = `${x}px`\n menu.style.top = `${y}px`\n const horizontalOrigin = x < this._x ? 'right' : 'left'\n const verticalOrigin = y < this._y ? 'bottom' : 'top'\n menu.style.setProperty('--wui-overlay-transform-origin', `${verticalOrigin} ${horizontalOrigin}`)\n menu.style.visibility = ''\n }\n\n private _focusFirstItem() {\n const menu = this._menu\n const items = menu?.querySelectorAll<HTMLElement>('web-ui-dropdown-item:not([disabled])')\n const firstItem = items?.[0]\n if (firstItem) {\n this._focusMenuItem(firstItem)\n }\n }\n\n private _setupMenuItems() {\n const menu = this._menu\n if (!menu) return\n\n this._hideMenuItems()\n Array.from(this.children).forEach(child => {\n if (child.matches('web-ui-dropdown-item, web-ui-dropdown-divider, web-ui-dropdown-header')) {\n menu.appendChild(child)\n }\n })\n }\n\n private _returnItemsToSlot() {\n const menu = this._menu\n if (!menu) return\n\n this._closeSubmenusFrom(0, true)\n this._restoreClosingSubmenus()\n Array.from(menu.children).forEach(child => {\n this.appendChild(child)\n })\n }\n\n private async _closeMenuAfterPresence() {\n const menu = this._menu\n if (menu && !(await hideOverlayPresence(menu))) return\n if (this._isOpen || !this.isConnected || this._menu !== menu) return\n\n this._returnItemsToSlot()\n menu?.remove()\n this._menu = undefined\n this._restoreFocusTarget?.focus()\n this._restoreFocusTarget = undefined\n }\n\n private _hideMenuItems() {\n Array.from(this.children).forEach(child => {\n if (child.matches('web-ui-dropdown-item, web-ui-dropdown-divider, web-ui-dropdown-header')) {\n child.setAttribute('slot', 'context-menu-hidden')\n }\n })\n this.querySelectorAll<HTMLElement>('web-ui-dropdown-item[submenu]').forEach(item => {\n Array.from(item.children).forEach(child => {\n if (child.matches('web-ui-dropdown-item, web-ui-dropdown-divider, web-ui-dropdown-header')) {\n child.setAttribute('slot', 'context-menu-hidden')\n }\n })\n })\n }\n\n private _openSubmenu(item: HTMLElement, isInstant = false) {\n if (!this._isOpen || !item.hasAttribute('submenu') || item.hasAttribute('disabled')) return\n\n const level = this._getItemLevel(item)\n if (level === -1 || this._activeSubmenuItems[level] === item) return\n\n this._closeSubmenusFrom(level)\n const closingSubmenu = this._closingSubmenus.get(item)\n if (closingSubmenu) {\n this._closingSubmenus.delete(item)\n this._activeSubmenus[level] = closingSubmenu\n this._activeSubmenuItems[level] = item\n item.setAttribute('active', '')\n this._positionSubmenu(item, closingSubmenu)\n showOverlayPresence(closingSubmenu, { isInstant })\n this._bindLevelHovers()\n return\n }\n const children = Array.from(item.children).filter(child =>\n child.matches('web-ui-dropdown-item, web-ui-dropdown-divider, web-ui-dropdown-header')\n )\n if (children.length === 0) return\n\n const submenu = createMenuPortalOverlay('context-submenu', this)\n submenu.dataset.level = String(level)\n submenu.setAttribute('role', 'menu')\n submenu.setAttribute('aria-label', '子菜单')\n submenu.style.visibility = 'hidden'\n submenu.addEventListener('click', this._onMenuClick)\n children.forEach(child => submenu.appendChild(child))\n\n this._activeSubmenus[level] = submenu\n this._activeSubmenuItems[level] = item\n item.setAttribute('active', '')\n this._positionSubmenu(item, submenu)\n showOverlayPresence(submenu, { isInstant })\n this._bindLevelHovers()\n }\n\n private _closeSubmenusFrom(level: number, isInstant = false) {\n for (let index = this._activeSubmenus.length - 1; index >= level; index--) {\n const submenu = this._activeSubmenus[index]\n const item = this._activeSubmenuItems[index]\n item?.removeAttribute('active')\n if (!item || isInstant) {\n this._restoreSubmenuItems(submenu, item)\n submenu.remove()\n } else {\n this._closingSubmenus.set(item, submenu)\n void this._closeSubmenuAfterPresence(submenu, item)\n }\n }\n this._activeSubmenus.length = level\n this._activeSubmenuItems.length = level\n }\n\n private async _closeSubmenuAfterPresence(submenu: HTMLElement, item: HTMLElement) {\n if (!(await hideOverlayPresence(submenu))) return\n if (this._closingSubmenus.get(item) !== submenu) return\n\n this._closingSubmenus.delete(item)\n this._restoreSubmenuItems(submenu, item)\n submenu.remove()\n }\n\n private _restoreSubmenuItems(submenu: HTMLElement, item?: HTMLElement) {\n Array.from(submenu.children).forEach(child => item?.appendChild(child))\n }\n\n private _restoreClosingSubmenus() {\n this._closingSubmenus.forEach((submenu, item) => {\n this._restoreSubmenuItems(submenu, item)\n submenu.remove()\n })\n this._closingSubmenus.clear()\n }\n\n private _getItemLevel(item: HTMLElement): number {\n const menu = this._menu\n if (menu?.contains(item)) return 0\n const parentLevel = this._activeSubmenus.findIndex(submenu => submenu.contains(item))\n return parentLevel === -1 ? -1 : parentLevel + 1\n }\n\n private _positionSubmenu(item: HTMLElement, submenu: HTMLElement) {\n const itemRect = item.getBoundingClientRect()\n const submenuRect = submenu.getBoundingClientRect()\n const padding = 8\n const canOpenRight = itemRect.right + submenuRect.width + padding <= window.innerWidth\n const left = canOpenRight ? itemRect.right : Math.max(padding, itemRect.left - submenuRect.width)\n const top = Math.min(Math.max(padding, itemRect.top), window.innerHeight - submenuRect.height - padding)\n\n submenu.style.left = `${left}px`\n submenu.style.top = `${top}px`\n submenu.style.setProperty('--wui-overlay-transform-origin', canOpenRight ? 'top left' : 'top right')\n submenu.style.visibility = ''\n }\n\n private _dispatchChange(open: boolean) {\n this.dispatchEvent(\n new CustomEvent('open-change', {\n detail: { open },\n bubbles: true,\n composed: true\n })\n )\n }\n\n private _isInsideShadowRoot(e: MouseEvent): boolean {\n for (const node of e.composedPath()) {\n if (node === this || node === this.shadowRoot) return true\n if (node instanceof Node && node.getRootNode() === this.shadowRoot) return true\n if (\n node instanceof Node &&\n (this._menu?.contains(node) || this._activeSubmenus.some(menu => menu.contains(node)))\n ) {\n return true\n }\n }\n return false\n }\n\n private _onContextMenu = (e: MouseEvent) => {\n if (this.disabled) return\n e.preventDefault()\n this._restoreFocusTarget = e.target instanceof HTMLElement ? e.target : undefined\n this._openAt(e.clientX, e.clientY, false)\n }\n\n private _onContextMenuOutside = (e: MouseEvent) => {\n if (this._isOpen && !this._isInsideShadowRoot(e)) {\n this.close()\n }\n }\n\n private _onKeydown = (e: KeyboardEvent) => {\n if (this.disabled) return\n\n // 键盘 ContextMenu 键或 Shift+F10\n if (e.key === 'ContextMenu' || (e.shiftKey && e.key === 'F10')) {\n e.preventDefault()\n const focused = document.activeElement\n if (focused && focused !== document.body) {\n const rect = focused.getBoundingClientRect()\n this._openAt(rect.left, rect.bottom, true)\n } else {\n this._openAt(window.innerWidth / 2, window.innerHeight / 2, true)\n }\n return\n }\n }\n\n private _onClickOutside = (e: MouseEvent) => {\n if (!this._isOpen || this._ignoreOutsideClick) return\n if (this._isInsideShadowRoot(e)) return\n this.close()\n }\n\n private _onMenuClick = (e: MouseEvent) => {\n const item = this._getDropdownItemFromEvent(e)\n if (!item || item.hasAttribute('disabled')) return\n if (item.hasAttribute('submenu')) {\n this._openSubmenu(item)\n return\n }\n this.close()\n }\n\n private _getDropdownItemFromEvent(e: Event): HTMLElement | null {\n return (\n e\n .composedPath()\n .find((node): node is HTMLElement => node instanceof HTMLElement && node.matches('web-ui-dropdown-item')) ??\n null\n )\n }\n\n private _getLevelItems(level: number): HTMLElement[] {\n const container = level === 0 ? this._menu : this._activeSubmenus[level - 1]\n if (!container) return []\n return Array.from(container.children).filter((child): child is HTMLElement =>\n child.matches('web-ui-dropdown-item, web-ui-dropdown-divider, web-ui-dropdown-header')\n )\n }\n\n private _bindLevelHovers() {\n this._hoverCleanupFns.forEach(cleanup => cleanup())\n this._hoverCleanupFns.length = 0\n\n for (let level = 0; level <= this._activeSubmenus.length; level++) {\n this._getLevelItems(level).forEach(item => {\n if (!item.matches('web-ui-dropdown-item') || item.hasAttribute('disabled')) return\n const handler = (event: PointerEvent) => {\n if (event.pointerType === 'touch') return\n clearTimeout(this._submenuTimer)\n if (item.hasAttribute('submenu')) {\n if (this._activeSubmenuItems[level] !== item) {\n this._submenuTimer = setTimeout(() => this._openSubmenu(item), 200)\n }\n } else if (this._activeSubmenus.length > level) {\n this._closeSubmenusFrom(level)\n this._bindLevelHovers()\n }\n }\n item.addEventListener('pointerenter', handler, { passive: true })\n this._hoverCleanupFns.push(() => item.removeEventListener('pointerenter', handler))\n })\n }\n }\n\n private _ignoreCurrentOutsideClick() {\n this._ignoreOutsideClick = true\n clearTimeout(this._ignoreOutsideClickTimer)\n this._ignoreOutsideClickTimer = setTimeout(() => {\n this._ignoreOutsideClick = false\n })\n }\n\n private _onWheel = (e: WheelEvent) => {\n this._preventBackgroundScroll(e)\n }\n\n private _onTouchMove = (e: TouchEvent) => {\n this._preventBackgroundScroll(e)\n }\n\n private _onDocumentKeydown = (e: KeyboardEvent) => {\n if (!this._isOpen) return\n if (e.key === 'Escape' && e.target === this) {\n this._closeLastSubmenuOrMenu()\n e.preventDefault()\n return\n }\n const level = this._getFocusedLevel()\n if (level === undefined) return\n const items = this._getEnabledLevelItems(level)\n const focused = this._getFocusedItem()\n const currentIndex = focused ? items.indexOf(focused) : -1\n\n switch (e.key) {\n case 'ArrowDown':\n this._focusMenuItem(items[(currentIndex + 1 + items.length) % items.length])\n break\n case 'ArrowUp':\n this._focusMenuItem(items[(currentIndex - 1 + items.length) % items.length])\n break\n case 'Home':\n this._focusMenuItem(items[0])\n break\n case 'End':\n this._focusMenuItem(items.at(-1))\n break\n case 'ArrowRight':\n if (focused?.hasAttribute('submenu')) {\n this._openSubmenu(focused, true)\n requestAnimationFrame(() => this._focusMenuItem(this._getEnabledLevelItems(level + 1)[0]))\n }\n break\n case 'ArrowLeft':\n if (level > 0) {\n const parent = this._activeSubmenuItems[level - 1]\n this._closeSubmenusFrom(level - 1)\n this._focusMenuItem(parent)\n this._bindLevelHovers()\n }\n break\n case 'Enter':\n case ' ':\n focused?.click()\n break\n case 'Escape':\n this._closeLastSubmenuOrMenu()\n break\n default:\n return\n }\n e.preventDefault()\n }\n\n private _closeLastSubmenuOrMenu() {\n if (this._activeSubmenus.length > 0) {\n const level = this._activeSubmenus.length - 1\n const parent = this._activeSubmenuItems[level]\n this._closeSubmenusFrom(level)\n this._focusMenuItem(parent)\n this._bindLevelHovers()\n } else {\n this.close()\n }\n }\n\n private _preventBackgroundScroll(e: Event) {\n if (!this._isOpen || !this.lockScroll || this._isMenuPanelEvent(e)) return\n e.preventDefault()\n }\n\n private _syncScrollLock(isOpen = this._isOpen) {\n const shouldLock = isOpen && this.lockScroll\n if (shouldLock === this._hasScrollLock) return\n\n if (shouldLock) lockScroll()\n else unlockScroll()\n this._hasScrollLock = shouldLock\n }\n\n private _getEnabledLevelItems(level: number) {\n return this._getLevelItems(level).filter(item => item.matches('web-ui-dropdown-item:not([disabled])'))\n }\n\n private _getFocusedItem(): HTMLElement | undefined {\n return [this._menu, ...this._activeSubmenus]\n .filter((menu): menu is HTMLElement => menu !== undefined)\n .flatMap(menu => Array.from(menu.querySelectorAll<HTMLElement>('web-ui-dropdown-item')))\n .find(item => Boolean(item.shadowRoot?.activeElement))\n }\n\n private _getFocusedLevel(): number | undefined {\n const item = this._getFocusedItem()\n if (!item) return undefined\n if (this._menu?.contains(item)) return 0\n const submenuIndex = this._activeSubmenus.findIndex(menu => menu.contains(item))\n return submenuIndex < 0 ? undefined : submenuIndex + 1\n }\n\n private _focusMenuItem(item: HTMLElement | undefined) {\n if (!item || item.hasAttribute('disabled')) return\n const focusable = item as HTMLElement & { focusItem?: () => void }\n focusable.focusItem?.()\n }\n\n private _isMenuPanelEvent(e: Event): boolean {\n return e\n .composedPath()\n .some(\n node =>\n node instanceof HTMLElement &&\n (node.classList.contains('context-menu') || node.classList.contains('context-submenu'))\n )\n }\n\n override render() {\n return html`\n <div class=\"context-menu-anchor\">\n <slot @slotchange=${this._hideMenuItems}></slot>\n </div>\n `\n }\n\n declare readonly $events: {\n 'open-change': CustomEvent<{ open: boolean }>\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-context-menu': WebUiContextMenu\n }\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
//#region src/components/context-menu/style.css?inline
|
|
2
|
+
var e = "*,:before,:after{box-sizing:border-box}:host{display:inline-block}:host([disabled]){cursor:not-allowed;opacity:.4}.context-menu-anchor{display:contents}.context-menu{--wui-glass-shadow:var(--wui-shadow-pop,0 3px 9px #00000045);-webkit-user-select:none;user-select:none;background-color:var(--wui-color-surface-overlay,#f6f6f6e0);border-radius:20px;min-width:200px;max-width:90vw;max-height:80vh;padding:4px;position:fixed;overflow-y:auto}.context-menu:not(.is-open){display:none}.context-submenu{--wui-glass-shadow:var(--wui-shadow-pop,0 3px 9px #00000045);-webkit-user-select:none;user-select:none;background-color:var(--wui-color-surface-overlay,#f6f6f6e0);border-radius:20px;min-width:200px;max-width:90vw;max-height:80vh;padding:4px;position:fixed;overflow-y:auto}";
|
|
3
|
+
//#endregion
|
|
4
|
+
export { e as default };
|
|
5
|
+
|
|
6
|
+
//# sourceMappingURL=style.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"style.js","names":[],"sources":["../../../src/components/context-menu/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n:host {\n display: inline-block;\n}\n\n:host([disabled]) {\n cursor: not-allowed;\n opacity: 0.4;\n}\n\n.context-menu-anchor {\n display: contents;\n}\n\n.context-menu {\n --wui-glass-shadow: var(--wui-shadow-pop, 0 3px 9px rgb(0 0 0 / 0.27));\n user-select: none;\n\n position: fixed;\n\n overflow-y: auto;\n\n min-width: 200px;\n max-width: 90vw;\n max-height: 80vh;\n padding: 4px;\n border-radius: 20px;\n\n background-color: var(--wui-color-surface-overlay, rgb(246 246 246 / 0.88));\n}\n\n.context-menu:not(.is-open) {\n display: none;\n}\n\n.context-submenu {\n --wui-glass-shadow: var(--wui-shadow-pop, 0 3px 9px rgb(0 0 0 / 0.27));\n user-select: none;\n\n position: fixed;\n\n overflow-y: auto;\n\n min-width: 200px;\n max-width: 90vw;\n max-height: 80vh;\n padding: 4px;\n border-radius: 20px;\n\n background-color: var(--wui-color-surface-overlay, rgb(246 246 246 / 0.88));\n}\n"],"mappings":""}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { LitElement, PropertyValues } from 'lit';
|
|
2
|
+
export declare class WebUiDialog extends LitElement {
|
|
3
|
+
static styles: import('lit').CSSResult[];
|
|
4
|
+
open: boolean;
|
|
5
|
+
lockScroll: boolean;
|
|
6
|
+
overlayClosable: boolean;
|
|
7
|
+
private _hasBody;
|
|
8
|
+
private _hasScrollLock;
|
|
9
|
+
private _closeFallbackTimer?;
|
|
10
|
+
private _openFrame?;
|
|
11
|
+
private _isClosing;
|
|
12
|
+
private get dialog();
|
|
13
|
+
protected updated(props: PropertyValues): void;
|
|
14
|
+
disconnectedCallback(): void;
|
|
15
|
+
/** 以模态方式打开对话框(命令式) */
|
|
16
|
+
showModal(): void;
|
|
17
|
+
close(): void;
|
|
18
|
+
private handleCancel;
|
|
19
|
+
private handleBackdropClick;
|
|
20
|
+
private emitOpenChange;
|
|
21
|
+
private _startOpening;
|
|
22
|
+
private _startClosing;
|
|
23
|
+
private _finishClosing;
|
|
24
|
+
private _clearCloseFallback;
|
|
25
|
+
private _cancelOpenFrame;
|
|
26
|
+
private _onTransitionEnd;
|
|
27
|
+
private _onNativeClose;
|
|
28
|
+
private _syncScrollLock;
|
|
29
|
+
private _onBodySlotChange;
|
|
30
|
+
render(): import('lit').TemplateResult<1>;
|
|
31
|
+
readonly $events: {
|
|
32
|
+
'open-change': CustomEvent<{
|
|
33
|
+
open: boolean;
|
|
34
|
+
}>;
|
|
35
|
+
};
|
|
36
|
+
}
|
|
37
|
+
declare global {
|
|
38
|
+
interface HTMLElementTagNameMap {
|
|
39
|
+
'web-ui-dialog': WebUiDialog;
|
|
40
|
+
}
|
|
41
|
+
}
|
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
import e from "../../_virtual/_@oxc-project_runtime@0.140.0/helpers/esm/decorate.js";
|
|
2
|
+
import t from "../../assets/glass.js";
|
|
3
|
+
import "../button/index.js";
|
|
4
|
+
import { booleanWithFalseString as n } from "../../shared/property-converters/boolean-with-false-string.js";
|
|
5
|
+
import { getTransitionDuration as r } from "../../shared/overlay/presence.js";
|
|
6
|
+
import { lockScroll as i, unlockScroll as a } from "../../shared/scroll-lock/scroll-lock.js";
|
|
7
|
+
import o from "./style.js";
|
|
8
|
+
import { LitElement as s, html as c, unsafeCSS as l } from "lit";
|
|
9
|
+
import { customElement as u, property as d, state as f } from "lit/decorators.js";
|
|
10
|
+
//#region src/components/dialog/index.ts
|
|
11
|
+
var p = class extends s {
|
|
12
|
+
constructor(...e) {
|
|
13
|
+
super(...e), this.open = !1, this.lockScroll = !0, this.overlayClosable = !0, this._hasBody = !1, this._hasScrollLock = !1, this._isClosing = !1, this._onTransitionEnd = (e) => {
|
|
14
|
+
e.target === this.dialog && e.propertyName === "transform" && this._finishClosing();
|
|
15
|
+
}, this._onNativeClose = () => {
|
|
16
|
+
this.open &&= (this._cancelOpenFrame(), this._clearCloseFallback(), this._isClosing = !1, this.dialog?.classList.remove("is-closing", "is-visible"), !1);
|
|
17
|
+
};
|
|
18
|
+
}
|
|
19
|
+
static {
|
|
20
|
+
this.styles = [l(t), l(o)];
|
|
21
|
+
}
|
|
22
|
+
get dialog() {
|
|
23
|
+
return this.shadowRoot?.querySelector("dialog") ?? null;
|
|
24
|
+
}
|
|
25
|
+
updated(e) {
|
|
26
|
+
super.updated(e), this.isConnected && (e.has("open") && (this.emitOpenChange(), this.open ? this._startOpening() : this._startClosing()), (e.has("open") || e.has("lockScroll")) && this._syncScrollLock());
|
|
27
|
+
}
|
|
28
|
+
disconnectedCallback() {
|
|
29
|
+
super.disconnectedCallback(), this._cancelOpenFrame(), this._clearCloseFallback(), this._syncScrollLock(!1);
|
|
30
|
+
}
|
|
31
|
+
showModal() {
|
|
32
|
+
this.open ||= !0;
|
|
33
|
+
}
|
|
34
|
+
close() {
|
|
35
|
+
this.open = !1;
|
|
36
|
+
}
|
|
37
|
+
handleCancel(e) {
|
|
38
|
+
e.preventDefault(), this.close();
|
|
39
|
+
}
|
|
40
|
+
handleBackdropClick(e) {
|
|
41
|
+
e.target === e.currentTarget && this.overlayClosable && this.close();
|
|
42
|
+
}
|
|
43
|
+
emitOpenChange() {
|
|
44
|
+
this.dispatchEvent(new CustomEvent("open-change", {
|
|
45
|
+
detail: { open: this.open },
|
|
46
|
+
bubbles: !0,
|
|
47
|
+
composed: !0
|
|
48
|
+
}));
|
|
49
|
+
}
|
|
50
|
+
_startOpening() {
|
|
51
|
+
let e = this.dialog;
|
|
52
|
+
e && (this._isClosing = !1, this._clearCloseFallback(), e.classList.remove("is-closing"), e.open || e.showModal?.(), this._cancelOpenFrame(), this._openFrame = requestAnimationFrame(() => {
|
|
53
|
+
this._openFrame = void 0, !(!this.isConnected || !this.open || !e.open) && e.classList.add("is-visible");
|
|
54
|
+
}));
|
|
55
|
+
}
|
|
56
|
+
_startClosing() {
|
|
57
|
+
let e = this.dialog;
|
|
58
|
+
if (e?.open) {
|
|
59
|
+
if (this._cancelOpenFrame(), this._isClosing = !0, !e.classList.contains("is-visible")) {
|
|
60
|
+
this._finishClosing();
|
|
61
|
+
return;
|
|
62
|
+
}
|
|
63
|
+
e.classList.add("is-closing"), e.classList.remove("is-visible"), this._clearCloseFallback(), this._closeFallbackTimer = setTimeout(() => this._finishClosing(), r(e) + 80);
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
_finishClosing() {
|
|
67
|
+
let e = this.dialog;
|
|
68
|
+
!e || !this._isClosing || this.open || (this._clearCloseFallback(), this._isClosing = !1, e.classList.remove("is-closing", "is-visible"), e.open && e.close?.());
|
|
69
|
+
}
|
|
70
|
+
_clearCloseFallback() {
|
|
71
|
+
this._closeFallbackTimer !== void 0 && (clearTimeout(this._closeFallbackTimer), this._closeFallbackTimer = void 0);
|
|
72
|
+
}
|
|
73
|
+
_cancelOpenFrame() {
|
|
74
|
+
this._openFrame !== void 0 && (cancelAnimationFrame(this._openFrame), this._openFrame = void 0);
|
|
75
|
+
}
|
|
76
|
+
_syncScrollLock(e = this.open) {
|
|
77
|
+
let t = e && this.lockScroll;
|
|
78
|
+
t !== this._hasScrollLock && (t ? i() : a(), this._hasScrollLock = t);
|
|
79
|
+
}
|
|
80
|
+
_onBodySlotChange(e) {
|
|
81
|
+
e.target instanceof HTMLSlotElement && (this._hasBody = e.target.assignedElements().length > 0);
|
|
82
|
+
}
|
|
83
|
+
render() {
|
|
84
|
+
return c`
|
|
85
|
+
<dialog
|
|
86
|
+
@cancel=${this.handleCancel}
|
|
87
|
+
@close=${this._onNativeClose}
|
|
88
|
+
@click=${this.handleBackdropClick}
|
|
89
|
+
@transitionend=${this._onTransitionEnd}
|
|
90
|
+
>
|
|
91
|
+
<div class="wui-dialog-body wui-glass">
|
|
92
|
+
${this._hasBody ? c`<slot name="body" @slotchange=${this._onBodySlotChange}></slot>` : c`
|
|
93
|
+
<slot name="body" @slotchange=${this._onBodySlotChange} hidden></slot>
|
|
94
|
+
<div class="title"><slot name="title"></slot></div>
|
|
95
|
+
<div class="desc"><slot></slot></div>
|
|
96
|
+
<div class="wui-dialog-footer"><slot name="footer"></slot></div>
|
|
97
|
+
`}
|
|
98
|
+
</div>
|
|
99
|
+
</dialog>
|
|
100
|
+
`;
|
|
101
|
+
}
|
|
102
|
+
};
|
|
103
|
+
e([d({
|
|
104
|
+
type: Boolean,
|
|
105
|
+
reflect: !0
|
|
106
|
+
})], p.prototype, "open", void 0), e([d({
|
|
107
|
+
reflect: !0,
|
|
108
|
+
attribute: "lock-scroll",
|
|
109
|
+
converter: n
|
|
110
|
+
})], p.prototype, "lockScroll", void 0), e([d({
|
|
111
|
+
reflect: !0,
|
|
112
|
+
attribute: "overlay-closable",
|
|
113
|
+
converter: n
|
|
114
|
+
})], p.prototype, "overlayClosable", void 0), e([f()], p.prototype, "_hasBody", void 0), p = e([u("web-ui-dialog")], p);
|
|
115
|
+
//#endregion
|
|
116
|
+
export { p as WebUiDialog };
|
|
117
|
+
|
|
118
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/dialog/index.ts"],"sourcesContent":["import { html, LitElement, type PropertyValues, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport '@/components/button'\nimport glass from '@/assets/glass.css?inline'\nimport { getTransitionDuration } from '@/shared/overlay/presence'\nimport { booleanWithFalseString } from '@/shared/property-converters/boolean-with-false-string'\nimport { lockScroll, unlockScroll } from '@/shared/scroll-lock/scroll-lock'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-dialog')\nexport class WebUiDialog extends LitElement {\n static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n\n @property({ type: Boolean, reflect: true }) open = false\n @property({ reflect: true, attribute: 'lock-scroll', converter: booleanWithFalseString }) lockScroll = true\n @property({ reflect: true, attribute: 'overlay-closable', converter: booleanWithFalseString }) overlayClosable = true\n\n @state() private _hasBody = false\n\n private _hasScrollLock = false\n private _closeFallbackTimer?: ReturnType<typeof setTimeout>\n private _openFrame?: number\n private _isClosing = false\n\n private get dialog() {\n return this.shadowRoot?.querySelector('dialog') ?? null\n }\n\n protected override updated(props: PropertyValues) {\n super.updated(props)\n if (!this.isConnected) return\n\n if (props.has('open')) {\n this.emitOpenChange()\n if (this.open) this._startOpening()\n else this._startClosing()\n }\n if (props.has('open') || props.has('lockScroll')) this._syncScrollLock()\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this._cancelOpenFrame()\n this._clearCloseFallback()\n this._syncScrollLock(false)\n }\n\n /** 以模态方式打开对话框(命令式) */\n showModal() {\n if (this.open) return\n this.open = true\n }\n\n close() {\n this.open = false\n }\n\n private handleCancel(e: Event) {\n // 保留 top layer 直到视觉退场完成,避免原生关闭跳过退出动画。\n e.preventDefault()\n this.close()\n }\n\n private handleBackdropClick(e: MouseEvent) {\n if (e.target !== (e.currentTarget as HTMLDialogElement)) return\n if (!this.overlayClosable) return\n this.close()\n }\n\n private emitOpenChange() {\n this.dispatchEvent(\n new CustomEvent('open-change', {\n detail: { open: this.open },\n bubbles: true,\n composed: true\n })\n )\n }\n\n private _startOpening() {\n const dialog = this.dialog\n if (!dialog) return\n\n this._isClosing = false\n this._clearCloseFallback()\n dialog.classList.remove('is-closing')\n if (!dialog.open) dialog.showModal?.()\n\n this._cancelOpenFrame()\n this._openFrame = requestAnimationFrame(() => {\n this._openFrame = undefined\n if (!this.isConnected || !this.open || !dialog.open) return\n dialog.classList.add('is-visible')\n })\n }\n\n private _startClosing() {\n const dialog = this.dialog\n if (!dialog?.open) return\n\n this._cancelOpenFrame()\n this._isClosing = true\n if (!dialog.classList.contains('is-visible')) {\n this._finishClosing()\n return\n }\n\n dialog.classList.add('is-closing')\n dialog.classList.remove('is-visible')\n this._clearCloseFallback()\n this._closeFallbackTimer = setTimeout(() => this._finishClosing(), getTransitionDuration(dialog) + 80)\n }\n\n private _finishClosing() {\n const dialog = this.dialog\n if (!dialog || !this._isClosing || this.open) return\n\n this._clearCloseFallback()\n this._isClosing = false\n dialog.classList.remove('is-closing', 'is-visible')\n if (dialog.open) dialog.close?.()\n }\n\n private _clearCloseFallback() {\n if (this._closeFallbackTimer === undefined) return\n clearTimeout(this._closeFallbackTimer)\n this._closeFallbackTimer = undefined\n }\n\n private _cancelOpenFrame() {\n if (this._openFrame === undefined) return\n cancelAnimationFrame(this._openFrame)\n this._openFrame = undefined\n }\n\n private _onTransitionEnd = (event: TransitionEvent) => {\n if (event.target !== this.dialog || event.propertyName !== 'transform') return\n this._finishClosing()\n }\n\n private _onNativeClose = () => {\n if (!this.open) return\n this._cancelOpenFrame()\n this._clearCloseFallback()\n this._isClosing = false\n this.dialog?.classList.remove('is-closing', 'is-visible')\n this.open = false\n }\n\n private _syncScrollLock(isOpen = this.open) {\n const shouldLock = isOpen && this.lockScroll\n if (shouldLock === this._hasScrollLock) return\n\n if (shouldLock) lockScroll()\n else unlockScroll()\n this._hasScrollLock = shouldLock\n }\n\n private _onBodySlotChange(e: Event) {\n if (!(e.target instanceof HTMLSlotElement)) return\n this._hasBody = e.target.assignedElements().length > 0\n }\n\n override render() {\n return html`\n <dialog\n @cancel=${this.handleCancel}\n @close=${this._onNativeClose}\n @click=${this.handleBackdropClick}\n @transitionend=${this._onTransitionEnd}\n >\n <div class=\"wui-dialog-body wui-glass\">\n ${this._hasBody\n ? html`<slot name=\"body\" @slotchange=${this._onBodySlotChange}></slot>`\n : html`\n <slot name=\"body\" @slotchange=${this._onBodySlotChange} hidden></slot>\n <div class=\"title\"><slot name=\"title\"></slot></div>\n <div class=\"desc\"><slot></slot></div>\n <div class=\"wui-dialog-footer\"><slot name=\"footer\"></slot></div>\n `}\n </div>\n </dialog>\n `\n }\n\n declare readonly $events: {\n 'open-change': CustomEvent<{ open: boolean }>\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-dialog': WebUiDialog\n }\n}\n"],"mappings":"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"}
|