various-ui/es/components/input/default/src/composable.mjs.map

This is a test version of the Vue 3 component library

{"version":3,"file":"composable.mjs","sources":["../../../../../../packages/components/input/default/src/composable.ts"],"sourcesContent":["//* 按需导入插件\r\nimport { SetupContext, nextTick, computed, inject, ref, reactive } from \"vue\";\r\n//* 组件属性\r\nimport { UiInputProps, UiInputEmits } from \"../index\";\r\n//* 公共属性\r\nimport { UiTypes, UiFormEmitterKey } from \"@various/constants\";\r\n//* 公共函数\r\nimport { node, utility, animations } from \"@various/utils\";\r\n\r\nexport const useComposable = (define: UiInputProps, emits: SetupContext<typeof UiInputEmits>[\"emit\"]) => {\r\n    //* 初始化mitt\r\n    const emitter = inject(UiFormEmitterKey, undefined);\r\n\r\n    //* 静态变量\r\n    const vars = {\r\n        timeout: <NodeJS.Timeout | undefined>undefined,\r\n        observer: <ResizeObserver | undefined>undefined,\r\n    };\r\n\r\n    //* 响应式变量\r\n    const refs = {\r\n        visible: ref<boolean>(false),\r\n    };\r\n\r\n    //* 节点\r\n    const nodes = {\r\n        main: ref<HTMLElement>(),\r\n        body: ref<HTMLElement>(),\r\n        container: ref<HTMLElement>(),\r\n    };\r\n\r\n    //* 工具函数\r\n    const utils = {\r\n        //* 候选框显示事件\r\n        show: () => {\r\n            //* 检测是否满足运行条件\r\n            if (refs.visible.value) return;\r\n            else {\r\n                //* 显示候选项列表\r\n                refs.visible.value = true;\r\n                //* 下一帧运行\r\n                nextTick(() => {\r\n                    //* 检测是否向下执行\r\n                    if (!nodes.container.value || !nodes.body.value) return;\r\n                    else if (define.detach) {\r\n                        //* 检测候选菜单是否脱离文档流\r\n                        vars.observer?.disconnect();\r\n                        vars.observer = node.menus.open({\r\n                            widthExtra: define.widthExtra,\r\n                            container: nodes.container.value,\r\n                            content: nodes.body.value,\r\n                            option: {\r\n                                direction: \"bottom\",\r\n                                height: define.height,\r\n                                offset: 8,\r\n                                align: \"start\",\r\n                            },\r\n                        });\r\n                    }\r\n                });\r\n            }\r\n        },\r\n\r\n        //* 候选框隐藏事件\r\n        hidden: (ev?: Event) => {\r\n            if (!nodes.container.value) return;\r\n            if (ev?.target && node.includes(ev.target as HTMLElement, nodes.container.value)) return;\r\n            else {\r\n                //* 状态更新\r\n                refs.visible.value = false;\r\n                //* 注销观察者\r\n                vars.observer?.disconnect();\r\n            }\r\n        },\r\n    };\r\n\r\n    //* 函数列表\r\n    const methods = {\r\n        //* Input失去焦点事件\r\n        blur: (ev?: FocusEvent) => {\r\n            //* 当ev不存在时, 触发Input失去焦点\r\n            if (!ev) return nodes.main.value?.blur();\r\n            else {\r\n                //* 触发blur回调\r\n                emits(\"blur\", ev);\r\n                //* 触发表单blur相关校验\r\n                emitter?.emit(define.name || \"\", \"blur\");\r\n                //* 延迟0.1s延迟下拉菜单，确保click顺利执行\r\n                vars.timeout && clearTimeout(vars.timeout);\r\n                vars.timeout = setTimeout(() => {\r\n                    utils.hidden(), (vars.timeout = undefined);\r\n                }, 100);\r\n            }\r\n        },\r\n\r\n        //* Input获取焦点事件\r\n        focus: (ev?: FocusEvent | Event) => {\r\n            //* 当ev不存在时, 触发Input获取焦点\r\n            if (!ev) return nodes.main.value?.focus();\r\n            else {\r\n                //* 显示候选项\r\n                utils.show();\r\n                //* 触发focus回调\r\n                emits(\"focus\", ev);\r\n            }\r\n        },\r\n\r\n        //* 清空事件\r\n        clear: () => {\r\n            emits(\"update:modelValue\", \"\");\r\n            emits(\"clear\");\r\n            if (emitter?.emit) {\r\n                emitter.emit(define.name || \"\", \"change\");\r\n            }\r\n        },\r\n\r\n        //* Input触发input事件\r\n        input: (ev: InputEvent | Event) => {\r\n            //* 获取Target对象\r\n            const target = ev.target as HTMLInputElement;\r\n\r\n            //* 显示候选项窗口, 针对某些情况下提前隐藏候选项, 但触发input时候选项需要显示的场景\r\n            utils.show();\r\n\r\n            //* 触发v-model变更和input回调\r\n            emits(\"update:modelValue\", target.value);\r\n            emits(\"input\", ev as InputEvent);\r\n        },\r\n\r\n        //* Input触发回车事件\r\n        enter: (ev: KeyboardEvent | Event) => {\r\n            emits(\"enter\", ev);\r\n        },\r\n\r\n        //* Input触发change事件\r\n        change: (ev: Event) => {\r\n            //* 触发change回调\r\n            emits(\"change\", ev);\r\n            //* 触发表单change相关校验\r\n            emitter?.emit(define.name || \"\", \"change\");\r\n        },\r\n    };\r\n\r\n    //* 计算属性\r\n    const computeds = {\r\n        //* 禁用状态\r\n        disabled: computed(() => define.loading || define.disabled),\r\n\r\n        //* 组件类\r\n        className: computed(() => {\r\n            //* 初始化数据\r\n            const className: string[] = [];\r\n            //* 判断是否需要添加size类名\r\n            if (define.size != \"default\") className.push(`ui-${define.size}`);\r\n            //* 判断是否需要添加clearable类名\r\n            if (define.clearable) className.push(\"ui-clearable\");\r\n            //* 判断候选项是否处于展示状态\r\n            if (refs.visible.value && define.candidates?.length) className.push(\"ui-form-selector\");\r\n            //* 判断是否是禁用或只读状态\r\n            if (define.loading) className.push(\"ui-loading-status\");\r\n            else if (define.disabled) className.push(\"ui-disabled-status\");\r\n            else if (define.readonly) {\r\n                className.push(\"ui-readonly-status\");\r\n            }\r\n\r\n            return className.join(\" \");\r\n        }),\r\n    };\r\n\r\n    //* 属性\r\n    const binds = reactive({\r\n        //* 主体\r\n        main: computed(() => {\r\n            return {\r\n                type: define.type,\r\n                disabled: computeds.disabled.value,\r\n                readonly: define.readonly,\r\n                maxlength: define.maxlength,\r\n                placeholder: define.placeholder,\r\n                autocomplete: define.autocomplete,\r\n            };\r\n        }),\r\n\r\n        //* 候选项容器\r\n        body: computed(() => {\r\n            //* 数据初始化\r\n            const classify = [\"ui-form-candidates\"];\r\n            const styles: Record<string, string | number> = {\r\n                zIndex: define.zIndex,\r\n            };\r\n\r\n            if (define.classExtraName) classify.push(define.classExtraName);\r\n            if (!define.detach) {\r\n                classify.push(\"ui-form-candidates-detach\");\r\n                if (define.widthExtra == \"content\") styles.width = \"100%\";\r\n                else {\r\n                    styles.minWidth = \"100%\";\r\n                }\r\n            }\r\n\r\n            return { class: classify, style: styles };\r\n        }),\r\n\r\n        //* 容器\r\n        container: computed(() => {\r\n            return {\r\n                class: computeds.className.value,\r\n                style: {\r\n                    width: utility.isNumber(define.width) ? define.width + \"px\" : define.width,\r\n                },\r\n            };\r\n        }),\r\n\r\n        //* 候选项列表\r\n        candidates: computed(() => {\r\n            return {\r\n                style: {\r\n                    maxHeight: define.height + \"px\",\r\n                },\r\n            };\r\n        }),\r\n    });\r\n\r\n    //* 响应事件\r\n    const ons = {\r\n        //* 主体\r\n        main: {\r\n            change: methods.change,\r\n            focus: methods.focus,\r\n            input: methods.input,\r\n            blur: methods.blur,\r\n        },\r\n\r\n        //* 候选项\r\n        candidate: (option: UiTypes.candidate) => {\r\n            return {\r\n                click: (ev: Event) => {\r\n                    emits(\"update:modelValue\", option.value);\r\n                    emits(\"select\", ev, option);\r\n                    emits(\"change\", ev);\r\n                    emitter?.emit(define.name || \"\", \"change\");\r\n                },\r\n            };\r\n        },\r\n\r\n        //* 动画函数\r\n        animation: animations.selector(define.animation, {\r\n            beforeEnter: () => emits(\"before-enter\"),\r\n            beforeLeave: () => emits(\"before-leave\"),\r\n            afterEnter: () => emits(\"after-enter\"),\r\n            afterLeave: () => emits(\"after-leave\"),\r\n        }),\r\n    };\r\n\r\n    return { ons, vars, refs, binds, nodes, methods, computeds, animations };\r\n};\r\n"],"names":["node.menus","node.includes","utility.isNumber","animations.selector","animations"],"mappings":"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"}