cnhis-design-vue 3.1.13-beta.0 → 3.1.13-beta.3

package/es/packages/index.js

@@ -32,6 +32,10 @@ import FormRender from './form-render/index.js';
 export { default as CFormRender } from './form-render/index.js';
 import FabricChart from './fabric-chart/index.js';
 export { default as CFabricChart } from './fabric-chart/index.js';
+import ShortcutProvider from './shortcut-provider/index.js';
+export { default as CShortcutProvider } from './shortcut-provider/index.js';
+import ShortcutSetter from './shortcut-setter/index.js';
+export { default as CShortcutSetter } from './shortcut-setter/index.js';
 export { useFieldListAdaptor } from './form-render/src/hooks/useFieldListAdaptor.js';
 export { useFormRequest } from './form-render/src/hooks/useFormRequest.js';
 export { useCommonLog } from './form-render/src/hooks/useCommonLog.js';
@@ -46,6 +50,8 @@ export { FormItemDepsCollector, useFormItemDeps } from './form-render/src/hooks/
 export { useInitialData } from './form-render/src/hooks/useInitialData.js';
 export { useAnchor } from './form-render/src/hooks/useAnchor.js';
 export { useFormContext } from './form-render/src/hooks/useFormContext.js';
+export { ShortcutManager, useShortcuts } from './shortcut-provider/src/hooks/useShortcuts.js';
+export { useShortcutSignature } from './shortcut-provider/src/hooks/useShortcutSignature.js';
 
 const components = {
   CGrid: Grid,
@@ -69,7 +75,9 @@ const components = {
   CBpmnWorkflow: BpmnWorkflow,
   Editor,
   CFormRender: FormRender,
-  CFabricChart: FabricChart
+  CFabricChart: FabricChart,
+  CShortcutProvider: ShortcutProvider,
+  CShortcutSetter: ShortcutSetter
 };
 function install(app) {
   Object.values(components).forEach((component) => {

package/es/packages/shortcut-provider/index.d.ts

@@ -0,0 +1,17 @@
+import { SFCWithInstall } from '../../../es/src/types';
+export * from './src/hooks';
+export * from './src/types';
+declare const ShortcutProvider: SFCWithInstall<import("vue").DefineComponent<{
+    cacheKey: StringConstructor;
+}, {
+    shortcutWrapperRef: import("vue").Ref<HTMLElement | undefined>;
+    props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+        cacheKey: StringConstructor;
+    }>> & {
+        [x: `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
+    }>>;
+    manager: import("./src/hooks").ShortcutManager;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    cacheKey: StringConstructor;
+}>>, {}>>;
+export default ShortcutProvider;

package/es/packages/shortcut-provider/index.js

@@ -0,0 +1,13 @@
+import { COMPONENT_NAMESPACE } from '../../src/global/variable';
+import { safeComponentRegister } from '../../src/utils';
+import './src/ShortcutProvider.js';
+import script from './src/ShortcutProvider.vue_vue_type_script_setup_true_lang.js';
+export { ShortcutManager, useShortcuts } from './src/hooks/useShortcuts.js';
+export { useShortcutSignature } from './src/hooks/useShortcutSignature.js';
+
+const ShortcutProvider = script;
+ShortcutProvider.install = function(app) {
+  safeComponentRegister(app, ShortcutProvider, COMPONENT_NAMESPACE + "ShortcutProvider");
+};
+
+export { ShortcutProvider as default };

package/es/packages/shortcut-provider/src/ShortcutProvider.js

@@ -0,0 +1,4 @@
+import script from './ShortcutProvider.vue_vue_type_script_setup_true_lang.js';
+export { default } from './ShortcutProvider.vue_vue_type_script_setup_true_lang.js';
+
+script.__file = "packages/shortcut-provider/src/ShortcutProvider.vue";

package/es/packages/shortcut-provider/src/ShortcutProvider.vue.d.ts

@@ -0,0 +1,15 @@
+import { ShortcutManager } from '../../../../es/packages/shortcut-provider';
+declare const _default: import("vue").DefineComponent<{
+    cacheKey: StringConstructor;
+}, {
+    shortcutWrapperRef: import("vue").Ref<HTMLElement | undefined>;
+    props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+        cacheKey: StringConstructor;
+    }>> & {
+        [x: `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
+    }>>;
+    manager: ShortcutManager;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    cacheKey: StringConstructor;
+}>>, {}>;
+export default _default;

package/es/packages/shortcut-provider/src/ShortcutProvider.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,32 @@
+import { defineComponent, ref, provide, onBeforeUnmount, openBlock, createElementBlock, renderSlot } from 'vue';
+import { InjectionShortcutManager } from '../../../packages/shortcut-provider/src/constants';
+import { ShortcutManager } from '../../../packages/shortcut-provider';
+
+var script = /* @__PURE__ */ defineComponent({
+  __name: "ShortcutProvider",
+  props: {
+    cacheKey: String
+  },
+  setup(__props) {
+    const props = __props;
+    const shortcutWrapperRef = ref();
+    const manager = new ShortcutManager(shortcutWrapperRef, props.cacheKey).start();
+    provide(InjectionShortcutManager, manager);
+    onBeforeUnmount(() => {
+      manager.destroy();
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("section", {
+        ref_key: "shortcutWrapperRef",
+        ref: shortcutWrapperRef,
+        "is-shortcut-capture": "",
+        class: "shortcut-provider",
+        tabindex: -9999
+      }, [
+        renderSlot(_ctx.$slots, "default")
+      ], 512);
+    };
+  }
+});
+
+export { script as default };

package/es/packages/shortcut-provider/src/constants/index.d.ts

@@ -0,0 +1,7 @@
+import { InjectionKey } from 'vue';
+import { ShortcutManager } from '../../../../../es/packages/shortcut-provider/src/hooks';
+export declare enum ShortcutStatus {
+    INACTIVE = 0,
+    ACTIVE = 1
+}
+export declare const InjectionShortcutManager: InjectionKey<ShortcutManager>;

package/es/packages/shortcut-provider/src/constants/index.js

@@ -0,0 +1,8 @@
+var ShortcutStatus = /* @__PURE__ */ ((ShortcutStatus2) => {
+  ShortcutStatus2[ShortcutStatus2["INACTIVE"] = 0] = "INACTIVE";
+  ShortcutStatus2[ShortcutStatus2["ACTIVE"] = 1] = "ACTIVE";
+  return ShortcutStatus2;
+})(ShortcutStatus || {});
+const InjectionShortcutManager = Symbol("InjectionShortcutManager");
+
+export { InjectionShortcutManager, ShortcutStatus };

package/es/packages/shortcut-provider/src/hooks/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useShortcuts';
+export * from './useShortcutSignature';

package/es/packages/shortcut-provider/src/hooks/index.js

@@ -0,0 +1,2 @@
+export { ShortcutManager, useShortcuts } from './useShortcuts.js';
+export { useShortcutSignature } from './useShortcutSignature.js';

package/es/packages/shortcut-provider/src/hooks/useShortcutSignature.d.ts

@@ -0,0 +1,4 @@
+export declare function useShortcutSignature(): {
+    signatureRef: import("vue").Ref<() => string>;
+    shortcut: import("vue").ComputedRef<string>;
+};

package/es/packages/shortcut-provider/src/hooks/useShortcutSignature.js

@@ -0,0 +1,12 @@
+import { ref, computed } from 'vue';
+import { transformKey2DisplaySignature } from '../../../../packages/shortcut-provider/src/utils';
+
+function useShortcutSignature() {
+  const signatureRef = ref(() => "");
+  const shortcut = computed(() => {
+    return transformKey2DisplaySignature(signatureRef.value());
+  });
+  return { signatureRef, shortcut };
+}
+
+export { useShortcutSignature };

package/es/packages/shortcut-provider/src/hooks/useShortcuts.d.ts

@@ -0,0 +1,30 @@
+import { ShortcutItem, ShortcutOption, ShortcutSignatureInfo } from '../../../../../es/packages/shortcut-provider/src/types';
+import { MaybeRef } from '@vueuse/core';
+export declare class ShortcutManager {
+    private readonly shortcutCallbackMap;
+    private readonly shortcutCache;
+    private readonly environmentEle;
+    private handle?;
+    static log(message: string, dryRun?: boolean): string;
+    constructor(environmentEle?: MaybeRef<HTMLElement | undefined>, cacheKey?: string);
+    get traverse(): unknown[];
+    query(key: string): any;
+    updateState(key: string, state?: boolean): void;
+    update(key: string, info: KeyboardEvent | Partial<ShortcutSignatureInfo>): void;
+    register(shortcutItem: ShortcutItem): {
+        stop: () => void;
+        signature: () => string;
+    };
+    start(): this;
+    destroy(): void;
+}
+export declare function useShortcuts(glob?: boolean): {
+    register: (shortcut: ShortcutOption) => {
+        stop: () => void;
+        signature: () => string;
+    };
+    traverse: () => unknown[];
+    query: (key: string) => any;
+    update: (key: string, info: KeyboardEvent | Partial<ShortcutSignatureInfo>) => void;
+    updateState: (key: string, state?: boolean) => void;
+};

package/es/packages/shortcut-provider/src/hooks/useShortcuts.js

@@ -0,0 +1,157 @@
+import { ShortcutStatus, InjectionShortcutManager } from '../../../../packages/shortcut-provider/src/constants';
+import { getKeySignature, getDisplaySignature, isKeyboardEvent, findAncestor, isShortcutProvider } from '../../../../packages/shortcut-provider/src/utils';
+import { reactive, unref, getCurrentInstance, inject, onBeforeUnmount } from 'vue';
+import { useStorage, useEventListener, useDebounceFn } from '@vueuse/core';
+import { pick, omit, isFunction, isString } from 'lodash-es';
+
+class ShortcutManager {
+  constructor(environmentEle, cacheKey = "__shortcut__glob") {
+    this.shortcutCallbackMap = reactive(/* @__PURE__ */ new Map());
+    this.environmentEle = environmentEle || window;
+    this.shortcutCache = useStorage(cacheKey, {}, localStorage, {
+      listenToStorageChanges: true,
+      deep: true
+    });
+  }
+  static log(message, dryRun = false) {
+    const _message = `[ShortcutManager] ${message}`;
+    !dryRun && console.warn(_message);
+    return _message;
+  }
+  get traverse() {
+    return [...Object.values(this.shortcutCache.value)].sort((a, b) => (a.order || 0) - (b.order || 0));
+  }
+  query(key) {
+    return this.shortcutCache.value[key];
+  }
+  updateState(key, state) {
+    this.query(key) && (this.query(key).disabled = !!state);
+  }
+  update(key, info) {
+    var _a;
+    const oldKeySignature = (_a = this.query(key)) == null ? void 0 : _a.currentKeySignature;
+    if (oldKeySignature === getKeySignature(info))
+      return;
+    if (Object.values(this.shortcutCache.value).some((v) => v.currentKeySignature === getKeySignature(info))) {
+      throw `\u91CD\u590D\u7684\u5FEB\u6377\u952E=> ${getDisplaySignature(info)}`;
+    }
+    const item = this.query(key);
+    if (!item)
+      return;
+    item.currentKeySignature = getKeySignature(info);
+    this.shortcutCallbackMap.set(getKeySignature(info), this.shortcutCallbackMap.get(oldKeySignature));
+    this.shortcutCallbackMap.delete(oldKeySignature);
+  }
+  register(shortcutItem) {
+    const item = this.query(shortcutItem.key);
+    if (item) {
+      item.status = ShortcutStatus.ACTIVE;
+      this.shortcutCallbackMap.set(item.currentKeySignature, shortcutItem.callback);
+      Object.assign(item, pick(shortcutItem, ["debounce", "debounceOption", "label", "defaultShortcut", "order", "key"]));
+      return createHandler(item);
+    }
+    this.shortcutCache.value[shortcutItem.key] = omit(shortcutItem, ["callback"]);
+    this.shortcutCallbackMap.set(shortcutItem.currentKeySignature, shortcutItem.callback);
+    return createHandler(this.shortcutCache.value[shortcutItem.key]);
+    function createHandler(shortcut) {
+      return {
+        stop: () => {
+          shortcut.status = ShortcutStatus.INACTIVE;
+        },
+        signature: () => shortcut.currentKeySignature
+      };
+    }
+  }
+  start() {
+    if (this.handle) {
+      ShortcutManager.log(`\u8BF7\u52FF\u91CD\u590D\u542F\u52A8=>${this}`);
+      return this;
+    }
+    this.handle = async (event) => {
+      if (!isKeyboardEvent(event))
+        return;
+      const providerWrapper = findAncestor(event.target, isShortcutProvider);
+      if (providerWrapper && providerWrapper !== unref(this.environmentEle)) {
+        return;
+      }
+      const keySignature = getKeySignature(event);
+      const callback = this.shortcutCallbackMap.get(keySignature);
+      if (!callback)
+        return;
+      const shortcutItem = Object.values(this.shortcutCache.value).find((item) => item.currentKeySignature === keySignature);
+      if (!shortcutItem || shortcutItem.status !== ShortcutStatus.ACTIVE || shortcutItem.disabled)
+        return;
+      callback();
+    };
+    useEventListener(this.environmentEle, "keyup", this.handle, { capture: true });
+    return this;
+  }
+  destroy() {
+    var _a;
+    this.handle && ((_a = unref(this.environmentEle)) == null ? void 0 : _a.removeEventListener("keyup", this.handle, { capture: true }));
+    this.handle = void 0;
+    this.shortcutCallbackMap.clear();
+  }
+}
+const globManager = new ShortcutManager().start();
+function useShortcuts(glob = false) {
+  function useManager() {
+    if (getCurrentInstance() && !glob) {
+      return inject(InjectionShortcutManager, globManager);
+    } else {
+      ShortcutManager.log("\u975Esetup\u8BED\u5883\u4E0B\u7684shortcut\u5C06\u5F71\u54CD\u5168\u5C40");
+      return globManager;
+    }
+  }
+  const manager = useManager();
+  function createShortcutItem(shortcut) {
+    return {
+      ...shortcut,
+      currentKeySignature: getKeySignature(shortcut.defaultShortcut),
+      key: keyFor(shortcut),
+      status: ShortcutStatus.ACTIVE,
+      disabled: false,
+      callback: callbackFor(shortcut)
+    };
+    function callbackFor(shortcut2) {
+      var _a, _b;
+      if (!isFunction(shortcut2.callback)) {
+        throw new Error(ShortcutManager.log(`\u975E\u6CD5\u7684callback\u7C7B\u578B=>${shortcut2.callback}`, true));
+      }
+      if (!shortcut2.debounce)
+        return shortcut2.callback;
+      return useDebounceFn(shortcut2.callback, (_b = (_a = shortcut2.debounceOption) == null ? void 0 : _a.duration) != null ? _b : 300);
+    }
+    function keyFor(shortcut2) {
+      const key = shortcut2.key || shortcut2.label;
+      if (!isString(key)) {
+        throw new Error(ShortcutManager.log(`\u975E\u6CD5\u7684key\u7C7B\u578B=>${key}`, true));
+      }
+      return key;
+    }
+  }
+  function register(shortcut) {
+    const { stop, signature } = manager.register(createShortcutItem(shortcut));
+    if (getCurrentInstance()) {
+      onBeforeUnmount(stop);
+    } else {
+      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");
+    }
+    return { stop, signature };
+  }
+  function traverse() {
+    return glob ? globManager.traverse : manager.traverse;
+  }
+  function query(key) {
+    return manager.query(key);
+  }
+  function update(key, info) {
+    manager.update(key, info);
+  }
+  function updateState(key, state) {
+    manager.updateState(key, state);
+  }
+  return { register, traverse, query, update, updateState };
+}
+
+export { ShortcutManager, useShortcuts };

package/es/packages/shortcut-provider/src/types/index.d.ts

@@ -0,0 +1,30 @@
+import { ArrayAble } from '../../../../../es/src/types';
+import { VNode } from 'vue';
+import { ShortcutStatus } from '../../../../../es/packages/shortcut-provider/src/constants';
+declare type Render = () => ArrayAble<VNode>;
+export interface ShortcutSignatureInfo {
+    ctrl?: boolean;
+    shift?: boolean;
+    alt?: boolean;
+    key: string;
+}
+export interface ShortcutOption {
+    label: string | Render;
+    key?: string;
+    defaultShortcut: ShortcutSignatureInfo;
+    order?: number;
+    debounce?: boolean;
+    debounceOption?: {
+        duration?: number;
+    };
+    beforeTrigger?(): void | Promise<unknown>;
+    callback(): void;
+    afterTrigger?(): void | Promise<unknown>;
+}
+export interface ShortcutItem extends ShortcutOption {
+    status: ShortcutStatus;
+    currentKeySignature: string;
+    key: string;
+    disabled: boolean;
+}
+export {};

package/es/packages/shortcut-provider/src/types/index.js

@@ -0,0 +1 @@
+

package/es/packages/shortcut-provider/src/utils/index.d.ts

@@ -0,0 +1,7 @@
+import { ShortcutSignatureInfo } from '../../../../../es/packages/shortcut-provider/src/types';
+export declare function isKeyboardEvent(event: any): event is KeyboardEvent;
+export declare function getKeySignature(info: KeyboardEvent | Partial<ShortcutSignatureInfo>): string;
+export declare function getDisplaySignature(info: KeyboardEvent | Partial<ShortcutSignatureInfo>): string;
+export declare function transformKey2DisplaySignature(keySignature: string): string;
+export declare function isShortcutProvider(ele: HTMLElement): boolean;
+export declare function findAncestor(ele: HTMLElement | null, finder: (ele: HTMLElement) => boolean): HTMLElement | null;

package/es/packages/shortcut-provider/src/utils/index.js

@@ -0,0 +1,49 @@
+function isKeyboardEvent(event) {
+  return Reflect.get(event, "view") === window && Reflect.get(event, "shiftKey") != void 0;
+}
+function normalizeSignatureInfo(info) {
+  var _a, _b;
+  let ctrl, shift, alt;
+  const key = (_b = (_a = info.key) == null ? void 0 : _a.toLowerCase()) != null ? _b : "";
+  if (isKeyboardEvent(info)) {
+    ctrl = info.ctrlKey;
+    shift = info.shiftKey;
+    alt = info.altKey;
+  } else {
+    ctrl = !!info.ctrl;
+    shift = !!info.shift;
+    alt = !!info.alt;
+  }
+  return { ctrl, shift, alt, key };
+}
+function getKeySignature(info) {
+  const { ctrl, shift, alt, key } = normalizeSignatureInfo(info);
+  return `${ctrl ? "CTRL_" : ""}${shift ? "SHIFT_" : ""}${alt ? "ALT_" : ""}${key}`;
+}
+const keyBlackList = ["control", "alt", "shift"];
+const inBlackList = (key) => {
+  return keyBlackList.includes(key);
+};
+function getDisplaySignature(info) {
+  const { ctrl, shift, alt, key } = normalizeSignatureInfo(info);
+  return `${ctrl ? "ctrl+ " : ""}${alt ? "alt + " : ""}${shift ? "shift + " : ""}${inBlackList(key) ? "" : key}`;
+}
+function transformKey2DisplaySignature(keySignature) {
+  return keySignature.toLowerCase().replace(/_/g, " + ");
+}
+function isShortcutProvider(ele) {
+  return ele && ele.getAttribute("is-shortcut-capture") != void 0;
+}
+function findAncestor(ele, finder) {
+  if (!ele)
+    return ele;
+  if (finder(ele))
+    return ele;
+  let next = ele.parentElement;
+  while (next && !finder(next)) {
+    next = next.parentElement;
+  }
+  return next;
+}
+
+export { findAncestor, getDisplaySignature, getKeySignature, isKeyboardEvent, isShortcutProvider, transformKey2DisplaySignature };

package/es/packages/shortcut-provider/style/index.css

@@ -0,0 +1,3 @@
+.shortcut-provider {
+  outline: none;
+}

package/es/packages/shortcut-setter/constant/index.d.ts

@@ -0,0 +1,4 @@
+export declare enum ShortcutInputState {
+    STATIC = 0,
+    EDIT = 1
+}

package/es/packages/shortcut-setter/constant/index.js

@@ -0,0 +1,7 @@
+var ShortcutInputState = /* @__PURE__ */ ((ShortcutInputState2) => {
+  ShortcutInputState2[ShortcutInputState2["STATIC"] = 0] = "STATIC";
+  ShortcutInputState2[ShortcutInputState2["EDIT"] = 1] = "EDIT";
+  return ShortcutInputState2;
+})(ShortcutInputState || {});
+
+export { ShortcutInputState };