feat: initial commit - Phase 1 & 2 core features

This commit is contained in:
hiderfong
2026-04-22 17:07:33 +08:00
commit 1773bda06b
25005 changed files with 6252106 additions and 0 deletions
@@ -0,0 +1,36 @@
import * as vue from "vue";
import { ShallowRef } from "vue";
import { MaybeRef } from "@vueuse/core";
//#region ../../packages/hooks/use-focus-controller/index.d.ts
interface UseFocusControllerOptions {
disabled?: MaybeRef<boolean>;
/**
* return true to cancel focus
* @param event FocusEvent
*/
beforeFocus?: (event: FocusEvent) => boolean | undefined;
afterFocus?: () => void;
/**
* return true to cancel blur
* @param event FocusEvent
*/
beforeBlur?: (event: FocusEvent) => boolean | undefined;
afterBlur?: () => void;
}
declare function useFocusController<T extends {
focus: () => void;
}>(target: ShallowRef<T | undefined>, {
disabled,
beforeFocus,
afterFocus,
beforeBlur,
afterBlur
}?: UseFocusControllerOptions): {
isFocused: vue.Ref<boolean, boolean>; /** Avoid using wrapperRef and handleFocus/handleBlur together */
wrapperRef: ShallowRef<HTMLElement | undefined, HTMLElement | undefined>;
handleFocus: (event: FocusEvent) => void;
handleBlur: (event: FocusEvent) => void;
};
//#endregion
export { useFocusController };
@@ -0,0 +1,47 @@
import { isFocusable } from "../../utils/dom/aria.mjs";
import { isFunction } from "../../utils/types.mjs";
import { useEventListener } from "@vueuse/core";
import { getCurrentInstance, onMounted, ref, shallowRef, unref, watch } from "vue";
//#region ../../packages/hooks/use-focus-controller/index.ts
function useFocusController(target, { disabled, beforeFocus, afterFocus, beforeBlur, afterBlur } = {}) {
const { emit } = getCurrentInstance();
const wrapperRef = shallowRef();
const isFocused = ref(false);
const handleFocus = (event) => {
const cancelFocus = isFunction(beforeFocus) ? beforeFocus(event) : false;
if (unref(disabled) || isFocused.value || cancelFocus) return;
isFocused.value = true;
emit("focus", event);
afterFocus?.();
};
const handleBlur = (event) => {
const cancelBlur = isFunction(beforeBlur) ? beforeBlur(event) : false;
if (unref(disabled) || event.relatedTarget && wrapperRef.value?.contains(event.relatedTarget) || cancelBlur) return;
isFocused.value = false;
emit("blur", event);
afterBlur?.();
};
const handleClick = (event) => {
if (unref(disabled) || isFocusable(event.target) || wrapperRef.value?.contains(document.activeElement) && wrapperRef.value !== document.activeElement) return;
target.value?.focus();
};
watch([wrapperRef, () => unref(disabled)], ([el, disabled]) => {
if (!el) return;
if (disabled) el.removeAttribute("tabindex");
else el.setAttribute("tabindex", "-1");
});
useEventListener(wrapperRef, "focus", handleFocus, true);
useEventListener(wrapperRef, "blur", handleBlur, true);
useEventListener(wrapperRef, "click", handleClick, true);
return {
isFocused,
wrapperRef,
handleFocus,
handleBlur
};
}
//#endregion
export { useFocusController };
//# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","names":[],"sources":["../../../../../packages/hooks/use-focus-controller/index.ts"],"sourcesContent":["import {\n getCurrentInstance,\n onMounted,\n ref,\n shallowRef,\n unref,\n watch,\n} from 'vue'\nimport { useEventListener } from '@vueuse/core'\nimport { isElement, isFocusable, isFunction } from '@element-plus/utils'\n\nimport type { ShallowRef } from 'vue'\nimport type { MaybeRef } from '@vueuse/core'\n\ninterface UseFocusControllerOptions {\n disabled?: MaybeRef<boolean>\n /**\n * return true to cancel focus\n * @param event FocusEvent\n */\n beforeFocus?: (event: FocusEvent) => boolean | undefined\n afterFocus?: () => void\n /**\n * return true to cancel blur\n * @param event FocusEvent\n */\n beforeBlur?: (event: FocusEvent) => boolean | undefined\n afterBlur?: () => void\n}\n\nexport function useFocusController<T extends { focus: () => void }>(\n target: ShallowRef<T | undefined>,\n {\n disabled,\n beforeFocus,\n afterFocus,\n beforeBlur,\n afterBlur,\n }: UseFocusControllerOptions = {}\n) {\n const instance = getCurrentInstance()!\n const { emit } = instance\n const wrapperRef = shallowRef<HTMLElement>()\n const isFocused = ref(false)\n\n const handleFocus = (event: FocusEvent) => {\n const cancelFocus = isFunction(beforeFocus) ? beforeFocus(event) : false\n if (unref(disabled) || isFocused.value || cancelFocus) return\n\n isFocused.value = true\n emit('focus', event)\n afterFocus?.()\n }\n\n const handleBlur = (event: FocusEvent) => {\n const cancelBlur = isFunction(beforeBlur) ? beforeBlur(event) : false\n if (\n unref(disabled) ||\n (event.relatedTarget &&\n wrapperRef.value?.contains(event.relatedTarget as Node)) ||\n cancelBlur\n )\n return\n\n isFocused.value = false\n emit('blur', event)\n afterBlur?.()\n }\n\n const handleClick = (event: Event) => {\n if (\n unref(disabled) ||\n isFocusable(event.target as HTMLElement) ||\n (wrapperRef.value?.contains(document.activeElement) &&\n wrapperRef.value !== document.activeElement)\n )\n return\n\n target.value?.focus()\n }\n\n watch([wrapperRef, () => unref(disabled)], ([el, disabled]) => {\n if (!el) return\n if (disabled) {\n el.removeAttribute('tabindex')\n } else {\n el.setAttribute('tabindex', '-1')\n }\n })\n\n useEventListener(wrapperRef, 'focus', handleFocus, true)\n useEventListener(wrapperRef, 'blur', handleBlur, true)\n useEventListener(wrapperRef, 'click', handleClick, true)\n\n // only for test\n if (process.env.NODE_ENV === 'test') {\n onMounted(() => {\n const targetEl = isElement(target.value)\n ? target.value\n : document.querySelector('input,textarea')\n\n if (targetEl) {\n useEventListener(targetEl, 'focus', handleFocus, true)\n useEventListener(targetEl, 'blur', handleBlur, true)\n }\n })\n }\n\n return {\n isFocused,\n /** Avoid using wrapperRef and handleFocus/handleBlur together */\n wrapperRef,\n handleFocus,\n handleBlur,\n }\n}\n"],"mappings":";;;;;;AA8BA,SAAgB,mBACd,QACA,EACE,UACA,aACA,YACA,YACA,cAC6B,EAAE,EACjC;CAEA,MAAM,EAAE,SADS,oBAAoB;CAErC,MAAM,aAAa,YAAyB;CAC5C,MAAM,YAAY,IAAI,MAAM;CAE5B,MAAM,eAAe,UAAsB;EACzC,MAAM,cAAc,WAAW,YAAY,GAAG,YAAY,MAAM,GAAG;AACnE,MAAI,MAAM,SAAS,IAAI,UAAU,SAAS,YAAa;AAEvD,YAAU,QAAQ;AAClB,OAAK,SAAS,MAAM;AACpB,gBAAc;;CAGhB,MAAM,cAAc,UAAsB;EACxC,MAAM,aAAa,WAAW,WAAW,GAAG,WAAW,MAAM,GAAG;AAChE,MACE,MAAM,SAAS,IACd,MAAM,iBACL,WAAW,OAAO,SAAS,MAAM,cAAsB,IACzD,WAEA;AAEF,YAAU,QAAQ;AAClB,OAAK,QAAQ,MAAM;AACnB,eAAa;;CAGf,MAAM,eAAe,UAAiB;AACpC,MACE,MAAM,SAAS,IACf,YAAY,MAAM,OAAsB,IACvC,WAAW,OAAO,SAAS,SAAS,cAAc,IACjD,WAAW,UAAU,SAAS,cAEhC;AAEF,SAAO,OAAO,OAAO;;AAGvB,OAAM,CAAC,kBAAkB,MAAM,SAAS,CAAC,GAAG,CAAC,IAAI,cAAc;AAC7D,MAAI,CAAC,GAAI;AACT,MAAI,SACF,IAAG,gBAAgB,WAAW;MAE9B,IAAG,aAAa,YAAY,KAAK;GAEnC;AAEF,kBAAiB,YAAY,SAAS,aAAa,KAAK;AACxD,kBAAiB,YAAY,QAAQ,YAAY,KAAK;AACtD,kBAAiB,YAAY,SAAS,aAAa,KAAK;AAgBxD,QAAO;EACL;EAEA;EACA;EACA;EACD"}