various-ui
Version:
This is a test version of the Vue 3 component library
149 lines (146 loc) • 5.84 kB
JavaScript
import { defineComponent, onBeforeUnmount, openBlock, createElementBlock, mergeProps, unref, createCommentVNode, createElementVNode, toHandlers, withKeys, createBlock, createVNode, Transition, withCtx, withDirectives, Fragment, renderList, renderSlot, createTextVNode, toDisplayString, vShow } from 'vue';
import { UiInputPropsOption, UiInputEmits } from './index.mjs';
import { useComposable } from './src/composable.mjs';
import '../../../utils/index.mjs';
import { UiIcon } from '../../icon/index.mjs';
import { remove } from '../../../utils/src/node/index.mjs';
const _hoisted_1 = ["value"];
const _hoisted_2 = { class: "ui-form-candidate-container" };
const _hoisted_3 = {
key: 0,
class: "ui-mask ui-loading"
};
const __default__ = defineComponent({ name: "UiInput" });
var _sfc_main = /* @__PURE__ */ defineComponent({
...__default__,
props: UiInputPropsOption,
emits: UiInputEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const define = __props;
const emits = __emit;
const { ons, vars, refs, binds, nodes, methods } = useComposable(define, emits);
const { visible } = refs;
const { main, body, container } = nodes;
const { blur, clear, enter, focus } = methods;
onBeforeUnmount(() => {
var _a;
body.value && remove(document.body, body.value);
(_a = vars.observer) == null ? void 0 : _a.disconnect();
});
;
__expose({ clear, focus, blur });
return (_ctx, _cache) => {
return openBlock(), createElementBlock(
"div",
mergeProps({
class: "ui-input",
ref_key: "container",
ref: container
}, unref(binds).container),
[
createCommentVNode(" * \u8F93\u5165\u6846\u4E3B\u4F53 "),
createElementVNode("input", mergeProps({
ref_key: "main",
ref: main,
class: "ui-form-control",
value: _ctx.modelValue
}, unref(binds).main, toHandlers(unref(ons).main, true), {
onKeydown: _cache[0] || (_cache[0] = withKeys(
//@ts-ignore
(...args) => unref(enter) && unref(enter)(...args),
["enter"]
))
}), null, 16, _hoisted_1),
createCommentVNode(" * \u6E05\u7A7A\u6309\u94AE "),
_ctx.clearable && _ctx.modelValue ? (openBlock(), createBlock(unref(UiIcon), {
key: 0,
name: "error",
class: "ui-form-clearable",
onClick: unref(clear)
}, null, 8, ["onClick"])) : createCommentVNode("v-if", true),
createCommentVNode(" * \u5019\u9009\u9879 "),
createVNode(
Transition,
toHandlers(unref(ons).animation),
{
default: withCtx(() => [
unref(visible) ? withDirectives((openBlock(), createElementBlock(
"div",
mergeProps({
key: 0,
class: "ui-form-candidates",
ref_key: "body",
ref: body
}, unref(binds).body),
[
createCommentVNode(" * \u5019\u9009\u9879\u7684\u5185\u5BB9\u5BB9\u5668 "),
createElementVNode("div", _hoisted_2, [
createElementVNode(
"div",
mergeProps({ class: "ui-form-candidate-content" }, unref(binds).candidates),
[
(openBlock(true), createElementBlock(
Fragment,
null,
renderList(_ctx.candidates, (value) => {
return openBlock(), createElementBlock(
"div",
mergeProps({
class: ["ui-form-candidate", { "ui-active": define.modelValue == value.value }]
}, toHandlers(unref(ons).candidate(value), true)),
[
renderSlot(_ctx.$slots, "candidate", { data: value }, () => [
createTextVNode(
toDisplayString(value.label),
1
/* TEXT */
)
])
],
16
/* FULL_PROPS */
);
}),
256
/* UNKEYED_FRAGMENT */
))
],
16
/* FULL_PROPS */
)
])
],
16
/* FULL_PROPS */
)), [
[vShow, _ctx.candidates.length]
]) : createCommentVNode("v-if", true)
]),
_: 3
/* FORWARDED */
},
16
/* FULL_PROPS */
),
createCommentVNode(" \u906E\u7F69\u5C42 "),
createVNode(Transition, null, {
default: withCtx(() => [
_ctx.loading ? (openBlock(), createElementBlock("div", _hoisted_3, [
createVNode(unref(UiIcon), {
name: "loading",
class: "ui-mask-icon"
})
])) : createCommentVNode("v-if", true)
]),
_: 1
/* STABLE */
})
],
16
/* FULL_PROPS */
);
};
}
});
export { _sfc_main as default };
//# sourceMappingURL=index.vue2.mjs.map