cnhis-design-vue 3.1.13-beta.2 → 3.1.13-beta.3
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/es/packages/form-render/src/components/renderer/input.js +3 -3
- package/es/packages/form-render/src/components/renderer/simpleComponent.js +2 -15
- package/es/packages/form-render/src/utils/index.d.ts +5 -2
- package/es/packages/form-render/src/utils/index.js +16 -2
- package/es/packages/index.css +11 -0
- package/es/packages/index.d.ts +4 -1
- package/es/packages/index.js +9 -1
- package/es/packages/shortcut-provider/index.d.ts +17 -0
- package/es/packages/shortcut-provider/index.js +13 -0
- package/es/packages/shortcut-provider/src/ShortcutProvider.js +4 -0
- package/es/packages/shortcut-provider/src/ShortcutProvider.vue.d.ts +15 -0
- package/es/packages/shortcut-provider/src/ShortcutProvider.vue_vue_type_script_setup_true_lang.js +32 -0
- package/es/packages/shortcut-provider/src/constants/index.d.ts +7 -0
- package/es/packages/shortcut-provider/src/constants/index.js +8 -0
- package/es/packages/shortcut-provider/src/hooks/index.d.ts +2 -0
- package/es/packages/shortcut-provider/src/hooks/index.js +2 -0
- package/es/packages/shortcut-provider/src/hooks/useShortcutSignature.d.ts +4 -0
- package/es/packages/shortcut-provider/src/hooks/useShortcutSignature.js +12 -0
- package/es/packages/shortcut-provider/src/hooks/useShortcuts.d.ts +30 -0
- package/es/packages/shortcut-provider/src/hooks/useShortcuts.js +157 -0
- package/es/packages/shortcut-provider/src/types/index.d.ts +30 -0
- package/es/packages/shortcut-provider/src/types/index.js +1 -0
- package/es/packages/shortcut-provider/src/utils/index.d.ts +7 -0
- package/es/packages/shortcut-provider/src/utils/index.js +49 -0
- package/es/packages/shortcut-provider/style/index.css +3 -0
- package/es/packages/shortcut-setter/constant/index.d.ts +4 -0
- package/es/packages/shortcut-setter/constant/index.js +7 -0
- package/es/packages/shortcut-setter/index.d.ts +4258 -0
- package/es/packages/shortcut-setter/index.js +11 -0
- package/es/packages/shortcut-setter/src/ShortcutSetter.js +4 -0
- package/es/packages/shortcut-setter/src/ShortcutSetter.vue.d.ts +4258 -0
- package/es/packages/shortcut-setter/src/ShortcutSetter.vue_vue_type_script_setup_true_lang.js +38 -0
- package/es/packages/shortcut-setter/src/ShortcutSetterItem.js +4 -0
- package/es/packages/shortcut-setter/src/ShortcutSetterItem.vue.d.ts +4238 -0
- package/es/packages/shortcut-setter/src/ShortcutSetterItem.vue_vue_type_script_setup_true_lang.js +125 -0
- package/es/packages/shortcut-setter/style/index.css +8 -0
- package/es/src/types/index.d.ts +1 -0
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { defineComponent, computed, createVNode, Fragment } from 'vue';
|
|
2
|
-
import { assignUpdateValue } from '../../utils/index.js';
|
|
2
|
+
import { createSlot, assignUpdateValue } from '../../utils/index.js';
|
|
3
3
|
import { connect, mapProps } from '@formily/vue';
|
|
4
4
|
import { NInput } from 'naive-ui';
|
|
5
5
|
|
|
@@ -19,10 +19,10 @@ const script = defineComponent({
|
|
|
19
19
|
const _slots = computed(() => {
|
|
20
20
|
const res = {};
|
|
21
21
|
if (props.prefix) {
|
|
22
|
-
res.prefix = () => createVNode(Fragment, null, [props.prefix]);
|
|
22
|
+
res.prefix = () => createVNode(Fragment, null, [createSlot(props.prefix, props).default()]);
|
|
23
23
|
}
|
|
24
24
|
if (props.suffix) {
|
|
25
|
-
res.suffix = () => createVNode(Fragment, null, [props.suffix]);
|
|
25
|
+
res.suffix = () => createVNode(Fragment, null, [createSlot(props.suffix, props).default()]);
|
|
26
26
|
}
|
|
27
27
|
return res;
|
|
28
28
|
});
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { createVNode, mergeProps, isVNode } from 'vue';
|
|
2
2
|
import { connect, mapProps } from '@formily/vue';
|
|
3
|
-
import {
|
|
3
|
+
import { isFunction } from 'lodash-es';
|
|
4
4
|
import { NButton } from 'naive-ui';
|
|
5
|
+
import { createSlot } from '../../../../../packages/form-render/src/utils';
|
|
5
6
|
|
|
6
7
|
function _isSlot(s) {
|
|
7
8
|
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
|
|
@@ -12,20 +13,6 @@ function createPropFor(props) {
|
|
|
12
13
|
return (_a = props.fieldItem) == null ? void 0 : _a[property];
|
|
13
14
|
};
|
|
14
15
|
}
|
|
15
|
-
function createSlot(renderer, props) {
|
|
16
|
-
if (isObject(renderer)) {
|
|
17
|
-
const result = {};
|
|
18
|
-
Object.entries(renderer).forEach(([key, renderer2]) => {
|
|
19
|
-
isFunction(renderer2) && (result[key] = () => renderer2(props));
|
|
20
|
-
});
|
|
21
|
-
return result;
|
|
22
|
-
}
|
|
23
|
-
return {
|
|
24
|
-
default() {
|
|
25
|
-
return isFunction(renderer) ? renderer(props) : renderer;
|
|
26
|
-
}
|
|
27
|
-
};
|
|
28
|
-
}
|
|
29
16
|
const textScript = (props) => {
|
|
30
17
|
var _a, _b, _c;
|
|
31
18
|
const propFor = createPropFor(props);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { AnyObject } from '../../../../../es/src/types';
|
|
1
|
+
import { AnyObject, ArrayAble } from '../../../../../es/src/types';
|
|
2
2
|
import { ISchema } from '@formily/json-schema/esm/types';
|
|
3
3
|
import { GeneralField } from '@formily/core';
|
|
4
|
-
import { InjectionKey } from 'vue';
|
|
4
|
+
import { InjectionKey, VNode } from 'vue';
|
|
5
5
|
import { AgeContext, IdCardParseInfo } from '../types';
|
|
6
6
|
export declare function formRenderLog(message: string, type?: keyof Console): void;
|
|
7
7
|
export declare function arrayed<T>(maybeArray: T): T extends Array<any> ? T : [T];
|
|
@@ -17,3 +17,6 @@ export declare function injectOrProvide<T>(key: InjectionKey<T>, creator: () =>
|
|
|
17
17
|
export declare function generateUrlParams(field: GeneralField, dependKeys?: string | string[]): AnyObject;
|
|
18
18
|
export declare function traverseSchema(schema: ISchema, handler: (_s: ISchema) => void): void;
|
|
19
19
|
export declare function uuidGenerator(): string;
|
|
20
|
+
export declare function createSlot(renderer: unknown, props: any): Record<string, () => ArrayAble<VNode>> | {
|
|
21
|
+
default(): any;
|
|
22
|
+
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { isObject } from 'lodash-es';
|
|
1
|
+
import { isObject, isFunction } from 'lodash-es';
|
|
2
2
|
import { FIELD_SEX_VALUE } from '../constants/index.js';
|
|
3
3
|
import { isField } from '@formily/core';
|
|
4
4
|
import differenceInDays from '../../../../node_modules/date-fns/esm/differenceInDays/index.js';
|
|
@@ -95,5 +95,19 @@ function uuidGenerator() {
|
|
|
95
95
|
return v.toString(16);
|
|
96
96
|
});
|
|
97
97
|
}
|
|
98
|
+
function createSlot(renderer, props) {
|
|
99
|
+
if (isObject(renderer) && !isFunction(renderer)) {
|
|
100
|
+
const result = {};
|
|
101
|
+
Object.entries(renderer).forEach(([key, renderer2]) => {
|
|
102
|
+
isFunction(renderer2) && (result[key] = () => renderer2(props));
|
|
103
|
+
});
|
|
104
|
+
return result;
|
|
105
|
+
}
|
|
106
|
+
return {
|
|
107
|
+
default() {
|
|
108
|
+
return isFunction(renderer) ? renderer(props) : renderer;
|
|
109
|
+
}
|
|
110
|
+
};
|
|
111
|
+
}
|
|
98
112
|
|
|
99
|
-
export { arrayed, assignUpdateValue, formRenderLog, generateUrlParams, injectOrProvide, isIdCard, isMobile, parseBirthday, parseIdCard, transformDateFormat, traverseSchema, uuidGenerator };
|
|
113
|
+
export { arrayed, assignUpdateValue, createSlot, formRenderLog, generateUrlParams, injectOrProvide, isIdCard, isMobile, parseBirthday, parseIdCard, transformDateFormat, traverseSchema, uuidGenerator };
|
package/es/packages/index.css
CHANGED
|
@@ -2775,3 +2775,14 @@ body > .vxe-table--tooltip-wrapper {
|
|
|
2775
2775
|
.c-fabric-chart-popup-menu > li.no-click:hover {
|
|
2776
2776
|
background: #fff;
|
|
2777
2777
|
}
|
|
2778
|
+
.shortcut-provider {
|
|
2779
|
+
outline: none;
|
|
2780
|
+
}
|
|
2781
|
+
.shortcut-setter-item__wrapper {
|
|
2782
|
+
display: flex;
|
|
2783
|
+
}
|
|
2784
|
+
.shortcut-setter-item__operation {
|
|
2785
|
+
margin-left: 12px;
|
|
2786
|
+
display: flex;
|
|
2787
|
+
gap: 12px;
|
|
2788
|
+
}
|
package/es/packages/index.d.ts
CHANGED
|
@@ -16,9 +16,12 @@ import CBpmnWorkflow from './bpmn-workflow';
|
|
|
16
16
|
import Editor from './editor';
|
|
17
17
|
import CFormRender from './form-render';
|
|
18
18
|
import CFabricChart from './fabric-chart';
|
|
19
|
+
import CShortcutProvider from './shortcut-provider';
|
|
20
|
+
import CShortcutSetter from './shortcut-setter';
|
|
19
21
|
export * from './form-render';
|
|
22
|
+
export * from './shortcut-provider';
|
|
20
23
|
declare function install(app: App): void;
|
|
21
|
-
export { CGrid, CBigTable, CFieldSet, CDragLayout, CButtonPrint, CSelectPerson, CSelectLabel, CLabelFormContent, CScaleView, CMap, CVodChunkUpload, CRadio, CCheckbox, CSelect, CDatetime, CFormTable, CInfoHeader, CTimeLine, CBpmnWorkflow, Editor, CFormRender, CFabricChart };
|
|
24
|
+
export { CGrid, CBigTable, CFieldSet, CDragLayout, CButtonPrint, CSelectPerson, CSelectLabel, CLabelFormContent, CScaleView, CMap, CVodChunkUpload, CRadio, CCheckbox, CSelect, CDatetime, CFormTable, CInfoHeader, CTimeLine, CBpmnWorkflow, Editor, CFormRender, CFabricChart, CShortcutProvider, CShortcutSetter };
|
|
22
25
|
declare const _default: {
|
|
23
26
|
install: typeof install;
|
|
24
27
|
};
|
package/es/packages/index.js
CHANGED
|
@@ -32,6 +32,10 @@ import FormRender from './form-render/index.js';
|
|
|
32
32
|
export { default as CFormRender } from './form-render/index.js';
|
|
33
33
|
import FabricChart from './fabric-chart/index.js';
|
|
34
34
|
export { default as CFabricChart } from './fabric-chart/index.js';
|
|
35
|
+
import ShortcutProvider from './shortcut-provider/index.js';
|
|
36
|
+
export { default as CShortcutProvider } from './shortcut-provider/index.js';
|
|
37
|
+
import ShortcutSetter from './shortcut-setter/index.js';
|
|
38
|
+
export { default as CShortcutSetter } from './shortcut-setter/index.js';
|
|
35
39
|
export { useFieldListAdaptor } from './form-render/src/hooks/useFieldListAdaptor.js';
|
|
36
40
|
export { useFormRequest } from './form-render/src/hooks/useFormRequest.js';
|
|
37
41
|
export { useCommonLog } from './form-render/src/hooks/useCommonLog.js';
|
|
@@ -46,6 +50,8 @@ export { FormItemDepsCollector, useFormItemDeps } from './form-render/src/hooks/
|
|
|
46
50
|
export { useInitialData } from './form-render/src/hooks/useInitialData.js';
|
|
47
51
|
export { useAnchor } from './form-render/src/hooks/useAnchor.js';
|
|
48
52
|
export { useFormContext } from './form-render/src/hooks/useFormContext.js';
|
|
53
|
+
export { ShortcutManager, useShortcuts } from './shortcut-provider/src/hooks/useShortcuts.js';
|
|
54
|
+
export { useShortcutSignature } from './shortcut-provider/src/hooks/useShortcutSignature.js';
|
|
49
55
|
|
|
50
56
|
const components = {
|
|
51
57
|
CGrid: Grid,
|
|
@@ -69,7 +75,9 @@ const components = {
|
|
|
69
75
|
CBpmnWorkflow: BpmnWorkflow,
|
|
70
76
|
Editor,
|
|
71
77
|
CFormRender: FormRender,
|
|
72
|
-
CFabricChart: FabricChart
|
|
78
|
+
CFabricChart: FabricChart,
|
|
79
|
+
CShortcutProvider: ShortcutProvider,
|
|
80
|
+
CShortcutSetter: ShortcutSetter
|
|
73
81
|
};
|
|
74
82
|
function install(app) {
|
|
75
83
|
Object.values(components).forEach((component) => {
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { SFCWithInstall } from '../../../es/src/types';
|
|
2
|
+
export * from './src/hooks';
|
|
3
|
+
export * from './src/types';
|
|
4
|
+
declare const ShortcutProvider: SFCWithInstall<import("vue").DefineComponent<{
|
|
5
|
+
cacheKey: StringConstructor;
|
|
6
|
+
}, {
|
|
7
|
+
shortcutWrapperRef: import("vue").Ref<HTMLElement | undefined>;
|
|
8
|
+
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
|
|
9
|
+
cacheKey: StringConstructor;
|
|
10
|
+
}>> & {
|
|
11
|
+
[x: `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
|
|
12
|
+
}>>;
|
|
13
|
+
manager: import("./src/hooks").ShortcutManager;
|
|
14
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
15
|
+
cacheKey: StringConstructor;
|
|
16
|
+
}>>, {}>>;
|
|
17
|
+
export default ShortcutProvider;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { COMPONENT_NAMESPACE } from '../../src/global/variable';
|
|
2
|
+
import { safeComponentRegister } from '../../src/utils';
|
|
3
|
+
import './src/ShortcutProvider.js';
|
|
4
|
+
import script from './src/ShortcutProvider.vue_vue_type_script_setup_true_lang.js';
|
|
5
|
+
export { ShortcutManager, useShortcuts } from './src/hooks/useShortcuts.js';
|
|
6
|
+
export { useShortcutSignature } from './src/hooks/useShortcutSignature.js';
|
|
7
|
+
|
|
8
|
+
const ShortcutProvider = script;
|
|
9
|
+
ShortcutProvider.install = function(app) {
|
|
10
|
+
safeComponentRegister(app, ShortcutProvider, COMPONENT_NAMESPACE + "ShortcutProvider");
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
export { ShortcutProvider as default };
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { ShortcutManager } from '../../../../es/packages/shortcut-provider';
|
|
2
|
+
declare const _default: import("vue").DefineComponent<{
|
|
3
|
+
cacheKey: StringConstructor;
|
|
4
|
+
}, {
|
|
5
|
+
shortcutWrapperRef: import("vue").Ref<HTMLElement | undefined>;
|
|
6
|
+
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
|
|
7
|
+
cacheKey: StringConstructor;
|
|
8
|
+
}>> & {
|
|
9
|
+
[x: `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
|
|
10
|
+
}>>;
|
|
11
|
+
manager: ShortcutManager;
|
|
12
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
13
|
+
cacheKey: StringConstructor;
|
|
14
|
+
}>>, {}>;
|
|
15
|
+
export default _default;
|
package/es/packages/shortcut-provider/src/ShortcutProvider.vue_vue_type_script_setup_true_lang.js
ADDED
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { defineComponent, ref, provide, onBeforeUnmount, openBlock, createElementBlock, renderSlot } from 'vue';
|
|
2
|
+
import { InjectionShortcutManager } from '../../../packages/shortcut-provider/src/constants';
|
|
3
|
+
import { ShortcutManager } from '../../../packages/shortcut-provider';
|
|
4
|
+
|
|
5
|
+
var script = /* @__PURE__ */ defineComponent({
|
|
6
|
+
__name: "ShortcutProvider",
|
|
7
|
+
props: {
|
|
8
|
+
cacheKey: String
|
|
9
|
+
},
|
|
10
|
+
setup(__props) {
|
|
11
|
+
const props = __props;
|
|
12
|
+
const shortcutWrapperRef = ref();
|
|
13
|
+
const manager = new ShortcutManager(shortcutWrapperRef, props.cacheKey).start();
|
|
14
|
+
provide(InjectionShortcutManager, manager);
|
|
15
|
+
onBeforeUnmount(() => {
|
|
16
|
+
manager.destroy();
|
|
17
|
+
});
|
|
18
|
+
return (_ctx, _cache) => {
|
|
19
|
+
return openBlock(), createElementBlock("section", {
|
|
20
|
+
ref_key: "shortcutWrapperRef",
|
|
21
|
+
ref: shortcutWrapperRef,
|
|
22
|
+
"is-shortcut-capture": "",
|
|
23
|
+
class: "shortcut-provider",
|
|
24
|
+
tabindex: -9999
|
|
25
|
+
}, [
|
|
26
|
+
renderSlot(_ctx.$slots, "default")
|
|
27
|
+
], 512);
|
|
28
|
+
};
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
|
|
32
|
+
export { script as default };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { InjectionKey } from 'vue';
|
|
2
|
+
import { ShortcutManager } from '../../../../../es/packages/shortcut-provider/src/hooks';
|
|
3
|
+
export declare enum ShortcutStatus {
|
|
4
|
+
INACTIVE = 0,
|
|
5
|
+
ACTIVE = 1
|
|
6
|
+
}
|
|
7
|
+
export declare const InjectionShortcutManager: InjectionKey<ShortcutManager>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
var ShortcutStatus = /* @__PURE__ */ ((ShortcutStatus2) => {
|
|
2
|
+
ShortcutStatus2[ShortcutStatus2["INACTIVE"] = 0] = "INACTIVE";
|
|
3
|
+
ShortcutStatus2[ShortcutStatus2["ACTIVE"] = 1] = "ACTIVE";
|
|
4
|
+
return ShortcutStatus2;
|
|
5
|
+
})(ShortcutStatus || {});
|
|
6
|
+
const InjectionShortcutManager = Symbol("InjectionShortcutManager");
|
|
7
|
+
|
|
8
|
+
export { InjectionShortcutManager, ShortcutStatus };
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { ref, computed } from 'vue';
|
|
2
|
+
import { transformKey2DisplaySignature } from '../../../../packages/shortcut-provider/src/utils';
|
|
3
|
+
|
|
4
|
+
function useShortcutSignature() {
|
|
5
|
+
const signatureRef = ref(() => "");
|
|
6
|
+
const shortcut = computed(() => {
|
|
7
|
+
return transformKey2DisplaySignature(signatureRef.value());
|
|
8
|
+
});
|
|
9
|
+
return { signatureRef, shortcut };
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
export { useShortcutSignature };
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { ShortcutItem, ShortcutOption, ShortcutSignatureInfo } from '../../../../../es/packages/shortcut-provider/src/types';
|
|
2
|
+
import { MaybeRef } from '@vueuse/core';
|
|
3
|
+
export declare class ShortcutManager {
|
|
4
|
+
private readonly shortcutCallbackMap;
|
|
5
|
+
private readonly shortcutCache;
|
|
6
|
+
private readonly environmentEle;
|
|
7
|
+
private handle?;
|
|
8
|
+
static log(message: string, dryRun?: boolean): string;
|
|
9
|
+
constructor(environmentEle?: MaybeRef<HTMLElement | undefined>, cacheKey?: string);
|
|
10
|
+
get traverse(): unknown[];
|
|
11
|
+
query(key: string): any;
|
|
12
|
+
updateState(key: string, state?: boolean): void;
|
|
13
|
+
update(key: string, info: KeyboardEvent | Partial<ShortcutSignatureInfo>): void;
|
|
14
|
+
register(shortcutItem: ShortcutItem): {
|
|
15
|
+
stop: () => void;
|
|
16
|
+
signature: () => string;
|
|
17
|
+
};
|
|
18
|
+
start(): this;
|
|
19
|
+
destroy(): void;
|
|
20
|
+
}
|
|
21
|
+
export declare function useShortcuts(glob?: boolean): {
|
|
22
|
+
register: (shortcut: ShortcutOption) => {
|
|
23
|
+
stop: () => void;
|
|
24
|
+
signature: () => string;
|
|
25
|
+
};
|
|
26
|
+
traverse: () => unknown[];
|
|
27
|
+
query: (key: string) => any;
|
|
28
|
+
update: (key: string, info: KeyboardEvent | Partial<ShortcutSignatureInfo>) => void;
|
|
29
|
+
updateState: (key: string, state?: boolean) => void;
|
|
30
|
+
};
|
|
@@ -0,0 +1,157 @@
|
|
|
1
|
+
import { ShortcutStatus, InjectionShortcutManager } from '../../../../packages/shortcut-provider/src/constants';
|
|
2
|
+
import { getKeySignature, getDisplaySignature, isKeyboardEvent, findAncestor, isShortcutProvider } from '../../../../packages/shortcut-provider/src/utils';
|
|
3
|
+
import { reactive, unref, getCurrentInstance, inject, onBeforeUnmount } from 'vue';
|
|
4
|
+
import { useStorage, useEventListener, useDebounceFn } from '@vueuse/core';
|
|
5
|
+
import { pick, omit, isFunction, isString } from 'lodash-es';
|
|
6
|
+
|
|
7
|
+
class ShortcutManager {
|
|
8
|
+
constructor(environmentEle, cacheKey = "__shortcut__glob") {
|
|
9
|
+
this.shortcutCallbackMap = reactive(/* @__PURE__ */ new Map());
|
|
10
|
+
this.environmentEle = environmentEle || window;
|
|
11
|
+
this.shortcutCache = useStorage(cacheKey, {}, localStorage, {
|
|
12
|
+
listenToStorageChanges: true,
|
|
13
|
+
deep: true
|
|
14
|
+
});
|
|
15
|
+
}
|
|
16
|
+
static log(message, dryRun = false) {
|
|
17
|
+
const _message = `[ShortcutManager] ${message}`;
|
|
18
|
+
!dryRun && console.warn(_message);
|
|
19
|
+
return _message;
|
|
20
|
+
}
|
|
21
|
+
get traverse() {
|
|
22
|
+
return [...Object.values(this.shortcutCache.value)].sort((a, b) => (a.order || 0) - (b.order || 0));
|
|
23
|
+
}
|
|
24
|
+
query(key) {
|
|
25
|
+
return this.shortcutCache.value[key];
|
|
26
|
+
}
|
|
27
|
+
updateState(key, state) {
|
|
28
|
+
this.query(key) && (this.query(key).disabled = !!state);
|
|
29
|
+
}
|
|
30
|
+
update(key, info) {
|
|
31
|
+
var _a;
|
|
32
|
+
const oldKeySignature = (_a = this.query(key)) == null ? void 0 : _a.currentKeySignature;
|
|
33
|
+
if (oldKeySignature === getKeySignature(info))
|
|
34
|
+
return;
|
|
35
|
+
if (Object.values(this.shortcutCache.value).some((v) => v.currentKeySignature === getKeySignature(info))) {
|
|
36
|
+
throw `\u91CD\u590D\u7684\u5FEB\u6377\u952E=> ${getDisplaySignature(info)}`;
|
|
37
|
+
}
|
|
38
|
+
const item = this.query(key);
|
|
39
|
+
if (!item)
|
|
40
|
+
return;
|
|
41
|
+
item.currentKeySignature = getKeySignature(info);
|
|
42
|
+
this.shortcutCallbackMap.set(getKeySignature(info), this.shortcutCallbackMap.get(oldKeySignature));
|
|
43
|
+
this.shortcutCallbackMap.delete(oldKeySignature);
|
|
44
|
+
}
|
|
45
|
+
register(shortcutItem) {
|
|
46
|
+
const item = this.query(shortcutItem.key);
|
|
47
|
+
if (item) {
|
|
48
|
+
item.status = ShortcutStatus.ACTIVE;
|
|
49
|
+
this.shortcutCallbackMap.set(item.currentKeySignature, shortcutItem.callback);
|
|
50
|
+
Object.assign(item, pick(shortcutItem, ["debounce", "debounceOption", "label", "defaultShortcut", "order", "key"]));
|
|
51
|
+
return createHandler(item);
|
|
52
|
+
}
|
|
53
|
+
this.shortcutCache.value[shortcutItem.key] = omit(shortcutItem, ["callback"]);
|
|
54
|
+
this.shortcutCallbackMap.set(shortcutItem.currentKeySignature, shortcutItem.callback);
|
|
55
|
+
return createHandler(this.shortcutCache.value[shortcutItem.key]);
|
|
56
|
+
function createHandler(shortcut) {
|
|
57
|
+
return {
|
|
58
|
+
stop: () => {
|
|
59
|
+
shortcut.status = ShortcutStatus.INACTIVE;
|
|
60
|
+
},
|
|
61
|
+
signature: () => shortcut.currentKeySignature
|
|
62
|
+
};
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
start() {
|
|
66
|
+
if (this.handle) {
|
|
67
|
+
ShortcutManager.log(`\u8BF7\u52FF\u91CD\u590D\u542F\u52A8=>${this}`);
|
|
68
|
+
return this;
|
|
69
|
+
}
|
|
70
|
+
this.handle = async (event) => {
|
|
71
|
+
if (!isKeyboardEvent(event))
|
|
72
|
+
return;
|
|
73
|
+
const providerWrapper = findAncestor(event.target, isShortcutProvider);
|
|
74
|
+
if (providerWrapper && providerWrapper !== unref(this.environmentEle)) {
|
|
75
|
+
return;
|
|
76
|
+
}
|
|
77
|
+
const keySignature = getKeySignature(event);
|
|
78
|
+
const callback = this.shortcutCallbackMap.get(keySignature);
|
|
79
|
+
if (!callback)
|
|
80
|
+
return;
|
|
81
|
+
const shortcutItem = Object.values(this.shortcutCache.value).find((item) => item.currentKeySignature === keySignature);
|
|
82
|
+
if (!shortcutItem || shortcutItem.status !== ShortcutStatus.ACTIVE || shortcutItem.disabled)
|
|
83
|
+
return;
|
|
84
|
+
callback();
|
|
85
|
+
};
|
|
86
|
+
useEventListener(this.environmentEle, "keyup", this.handle, { capture: true });
|
|
87
|
+
return this;
|
|
88
|
+
}
|
|
89
|
+
destroy() {
|
|
90
|
+
var _a;
|
|
91
|
+
this.handle && ((_a = unref(this.environmentEle)) == null ? void 0 : _a.removeEventListener("keyup", this.handle, { capture: true }));
|
|
92
|
+
this.handle = void 0;
|
|
93
|
+
this.shortcutCallbackMap.clear();
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
const globManager = new ShortcutManager().start();
|
|
97
|
+
function useShortcuts(glob = false) {
|
|
98
|
+
function useManager() {
|
|
99
|
+
if (getCurrentInstance() && !glob) {
|
|
100
|
+
return inject(InjectionShortcutManager, globManager);
|
|
101
|
+
} else {
|
|
102
|
+
ShortcutManager.log("\u975Esetup\u8BED\u5883\u4E0B\u7684shortcut\u5C06\u5F71\u54CD\u5168\u5C40");
|
|
103
|
+
return globManager;
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
const manager = useManager();
|
|
107
|
+
function createShortcutItem(shortcut) {
|
|
108
|
+
return {
|
|
109
|
+
...shortcut,
|
|
110
|
+
currentKeySignature: getKeySignature(shortcut.defaultShortcut),
|
|
111
|
+
key: keyFor(shortcut),
|
|
112
|
+
status: ShortcutStatus.ACTIVE,
|
|
113
|
+
disabled: false,
|
|
114
|
+
callback: callbackFor(shortcut)
|
|
115
|
+
};
|
|
116
|
+
function callbackFor(shortcut2) {
|
|
117
|
+
var _a, _b;
|
|
118
|
+
if (!isFunction(shortcut2.callback)) {
|
|
119
|
+
throw new Error(ShortcutManager.log(`\u975E\u6CD5\u7684callback\u7C7B\u578B=>${shortcut2.callback}`, true));
|
|
120
|
+
}
|
|
121
|
+
if (!shortcut2.debounce)
|
|
122
|
+
return shortcut2.callback;
|
|
123
|
+
return useDebounceFn(shortcut2.callback, (_b = (_a = shortcut2.debounceOption) == null ? void 0 : _a.duration) != null ? _b : 300);
|
|
124
|
+
}
|
|
125
|
+
function keyFor(shortcut2) {
|
|
126
|
+
const key = shortcut2.key || shortcut2.label;
|
|
127
|
+
if (!isString(key)) {
|
|
128
|
+
throw new Error(ShortcutManager.log(`\u975E\u6CD5\u7684key\u7C7B\u578B=>${key}`, true));
|
|
129
|
+
}
|
|
130
|
+
return key;
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
function register(shortcut) {
|
|
134
|
+
const { stop, signature } = manager.register(createShortcutItem(shortcut));
|
|
135
|
+
if (getCurrentInstance()) {
|
|
136
|
+
onBeforeUnmount(stop);
|
|
137
|
+
} else {
|
|
138
|
+
ShortcutManager.log("\u5728\u975Esetup\u8BED\u5883\u4E0B\u4F7F\u7528register\u51FD\u6570,\u7EC4\u4EF6\u9500\u6BC1\u65F6\u9700\u8981\u624B\u52A8\u8C03\u7528stop\u51FD\u6570\u4F7F\u5FEB\u6377\u952E\u5931\u6D3B");
|
|
139
|
+
}
|
|
140
|
+
return { stop, signature };
|
|
141
|
+
}
|
|
142
|
+
function traverse() {
|
|
143
|
+
return glob ? globManager.traverse : manager.traverse;
|
|
144
|
+
}
|
|
145
|
+
function query(key) {
|
|
146
|
+
return manager.query(key);
|
|
147
|
+
}
|
|
148
|
+
function update(key, info) {
|
|
149
|
+
manager.update(key, info);
|
|
150
|
+
}
|
|
151
|
+
function updateState(key, state) {
|
|
152
|
+
manager.updateState(key, state);
|
|
153
|
+
}
|
|
154
|
+
return { register, traverse, query, update, updateState };
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
export { ShortcutManager, useShortcuts };
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { ArrayAble } from '../../../../../es/src/types';
|
|
2
|
+
import { VNode } from 'vue';
|
|
3
|
+
import { ShortcutStatus } from '../../../../../es/packages/shortcut-provider/src/constants';
|
|
4
|
+
declare type Render = () => ArrayAble<VNode>;
|
|
5
|
+
export interface ShortcutSignatureInfo {
|
|
6
|
+
ctrl?: boolean;
|
|
7
|
+
shift?: boolean;
|
|
8
|
+
alt?: boolean;
|
|
9
|
+
key: string;
|
|
10
|
+
}
|
|
11
|
+
export interface ShortcutOption {
|
|
12
|
+
label: string | Render;
|
|
13
|
+
key?: string;
|
|
14
|
+
defaultShortcut: ShortcutSignatureInfo;
|
|
15
|
+
order?: number;
|
|
16
|
+
debounce?: boolean;
|
|
17
|
+
debounceOption?: {
|
|
18
|
+
duration?: number;
|
|
19
|
+
};
|
|
20
|
+
beforeTrigger?(): void | Promise<unknown>;
|
|
21
|
+
callback(): void;
|
|
22
|
+
afterTrigger?(): void | Promise<unknown>;
|
|
23
|
+
}
|
|
24
|
+
export interface ShortcutItem extends ShortcutOption {
|
|
25
|
+
status: ShortcutStatus;
|
|
26
|
+
currentKeySignature: string;
|
|
27
|
+
key: string;
|
|
28
|
+
disabled: boolean;
|
|
29
|
+
}
|
|
30
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { ShortcutSignatureInfo } from '../../../../../es/packages/shortcut-provider/src/types';
|
|
2
|
+
export declare function isKeyboardEvent(event: any): event is KeyboardEvent;
|
|
3
|
+
export declare function getKeySignature(info: KeyboardEvent | Partial<ShortcutSignatureInfo>): string;
|
|
4
|
+
export declare function getDisplaySignature(info: KeyboardEvent | Partial<ShortcutSignatureInfo>): string;
|
|
5
|
+
export declare function transformKey2DisplaySignature(keySignature: string): string;
|
|
6
|
+
export declare function isShortcutProvider(ele: HTMLElement): boolean;
|
|
7
|
+
export declare function findAncestor(ele: HTMLElement | null, finder: (ele: HTMLElement) => boolean): HTMLElement | null;
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
function isKeyboardEvent(event) {
|
|
2
|
+
return Reflect.get(event, "view") === window && Reflect.get(event, "shiftKey") != void 0;
|
|
3
|
+
}
|
|
4
|
+
function normalizeSignatureInfo(info) {
|
|
5
|
+
var _a, _b;
|
|
6
|
+
let ctrl, shift, alt;
|
|
7
|
+
const key = (_b = (_a = info.key) == null ? void 0 : _a.toLowerCase()) != null ? _b : "";
|
|
8
|
+
if (isKeyboardEvent(info)) {
|
|
9
|
+
ctrl = info.ctrlKey;
|
|
10
|
+
shift = info.shiftKey;
|
|
11
|
+
alt = info.altKey;
|
|
12
|
+
} else {
|
|
13
|
+
ctrl = !!info.ctrl;
|
|
14
|
+
shift = !!info.shift;
|
|
15
|
+
alt = !!info.alt;
|
|
16
|
+
}
|
|
17
|
+
return { ctrl, shift, alt, key };
|
|
18
|
+
}
|
|
19
|
+
function getKeySignature(info) {
|
|
20
|
+
const { ctrl, shift, alt, key } = normalizeSignatureInfo(info);
|
|
21
|
+
return `${ctrl ? "CTRL_" : ""}${shift ? "SHIFT_" : ""}${alt ? "ALT_" : ""}${key}`;
|
|
22
|
+
}
|
|
23
|
+
const keyBlackList = ["control", "alt", "shift"];
|
|
24
|
+
const inBlackList = (key) => {
|
|
25
|
+
return keyBlackList.includes(key);
|
|
26
|
+
};
|
|
27
|
+
function getDisplaySignature(info) {
|
|
28
|
+
const { ctrl, shift, alt, key } = normalizeSignatureInfo(info);
|
|
29
|
+
return `${ctrl ? "ctrl+ " : ""}${alt ? "alt + " : ""}${shift ? "shift + " : ""}${inBlackList(key) ? "" : key}`;
|
|
30
|
+
}
|
|
31
|
+
function transformKey2DisplaySignature(keySignature) {
|
|
32
|
+
return keySignature.toLowerCase().replace(/_/g, " + ");
|
|
33
|
+
}
|
|
34
|
+
function isShortcutProvider(ele) {
|
|
35
|
+
return ele && ele.getAttribute("is-shortcut-capture") != void 0;
|
|
36
|
+
}
|
|
37
|
+
function findAncestor(ele, finder) {
|
|
38
|
+
if (!ele)
|
|
39
|
+
return ele;
|
|
40
|
+
if (finder(ele))
|
|
41
|
+
return ele;
|
|
42
|
+
let next = ele.parentElement;
|
|
43
|
+
while (next && !finder(next)) {
|
|
44
|
+
next = next.parentElement;
|
|
45
|
+
}
|
|
46
|
+
return next;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
export { findAncestor, getDisplaySignature, getKeySignature, isKeyboardEvent, isShortcutProvider, transformKey2DisplaySignature };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
var ShortcutInputState = /* @__PURE__ */ ((ShortcutInputState2) => {
|
|
2
|
+
ShortcutInputState2[ShortcutInputState2["STATIC"] = 0] = "STATIC";
|
|
3
|
+
ShortcutInputState2[ShortcutInputState2["EDIT"] = 1] = "EDIT";
|
|
4
|
+
return ShortcutInputState2;
|
|
5
|
+
})(ShortcutInputState || {});
|
|
6
|
+
|
|
7
|
+
export { ShortcutInputState };
|