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

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 };