vue-ex-ui
Version:
赛博朋克美学风格 Vue 3 组件库
1,540 lines (1,539 loc) • 185 kB
JavaScript
import { defineComponent as oe, computed as M, createBlock as le, openBlock as l, resolveDynamicComponent as xe, mergeProps as he, withCtx as ie, renderSlot as te, ref as F, watch as ce, createElementBlock as o, normalizeClass as X, createElementVNode as y, createCommentVNode as c, createVNode as U, toDisplayString as V, useSlots as Ve, createTextVNode as fe, Fragment as ue, renderList as de, nextTick as me, unref as Z, normalizeStyle as ae, onUnmounted as ve, onMounted as be, withDirectives as we, withModifiers as pe, vModelText as Be, Transition as ge, vModelDynamic as De, provide as Ie, inject as Me } from "vue";
import { useI18n as se, createI18n as Te } from "vue-i18n";
const ze = /* @__PURE__ */ oe({
__name: "ExTypography",
props: {
variant: { default: "text" },
size: { default: "base" },
color: { default: "text-primary" },
weight: { default: "normal" },
align: { default: "left" },
truncate: { type: Boolean, default: !1 },
selectable: { type: Boolean, default: !0 },
gradient: { type: Boolean, default: !1 },
neon: { type: Boolean, default: !1 },
glow: { type: Boolean, default: !1 },
customStyle: {}
},
setup(v) {
const D = v, { t: n } = se(), e = M(() => {
switch (D.variant) {
case "heading":
switch (D.size) {
case "6xl":
case "5xl":
return "h1";
case "4xl":
case "3xl":
return "h2";
case "2xl":
case "xl":
return "h3";
case "lg":
return "h4";
case "base":
return "h5";
case "sm":
case "xs":
return "h6";
default:
return "h3";
}
case "paragraph":
return "p";
case "code":
return "code";
case "quote":
return "blockquote";
case "caption":
return "span";
default:
return "span";
}
}), r = M(() => {
const _ = {
...D.customStyle
};
if (D.align && (_.textAlign = D.align), D.color && (D.color.startsWith("text-") ? _.color = `var(--ex-color-${D.color})` : _.color = `var(--ex-color-${D.color})`), D.weight && (_.fontWeight = `var(--ex-font-${D.weight})`), D.gradient)
switch (D.color) {
case "primary":
_.background = "linear-gradient(135deg, var(--ex-color-primary-500), var(--ex-color-primary-700))", _.webkitBackgroundClip = "text", _.webkitTextFillColor = "transparent", _.backgroundClip = "text";
break;
case "secondary":
_.background = "linear-gradient(135deg, var(--ex-color-secondary-500), var(--ex-color-secondary-700))", _.webkitBackgroundClip = "text", _.webkitTextFillColor = "transparent", _.backgroundClip = "text";
break;
case "accent":
_.background = "linear-gradient(135deg, var(--ex-color-accent-500), var(--ex-color-accent-700))", _.webkitBackgroundClip = "text", _.webkitTextFillColor = "transparent", _.backgroundClip = "text";
break;
}
return _;
});
return (_, i) => (l(), le(xe(e.value), he({
class: [
"ex-typography",
`ex-typography--${_.variant}`,
`ex-typography--${_.size}`,
{
"ex-typography--truncate": _.truncate,
"ex-typography--selectable": _.selectable,
"ex-typography--gradient": _.gradient,
"ex-typography--neon": _.neon,
"ex-typography--glow": _.glow
}
],
style: r.value
}, _.$attrs), {
default: ie(() => [
te(_.$slots, "default", {}, void 0, !0)
]),
_: 3
}, 16, ["class", "style"]));
}
}), ne = (v, D) => {
const n = v.__vccOpts || v;
for (const [e, r] of D)
n[e] = r;
return n;
}, Fe = /* @__PURE__ */ ne(ze, [["__scopeId", "data-v-a76d27fa"]]), Le = {
install(v) {
v.component("ExTypography", Fe);
}
}, Re = ["src", "alt"], Pe = {
key: 1,
class: "ex-icon__loading"
}, Ae = /* @__PURE__ */ oe({
__name: "ExIcon",
props: {
name: {},
size: { default: "md" },
color: { default: "current" },
collection: { default: "ri" },
loading: { type: Boolean, default: !1 },
spin: { type: Boolean, default: !1 },
pulse: { type: Boolean, default: !1 },
glow: { type: Boolean, default: !1 },
neon: { type: Boolean, default: !1 },
alt: { default: "" },
customStyle: {}
},
emits: ["load", "error"],
setup(v, { emit: D }) {
const n = v, e = D, { t: r } = se(), _ = F(!1), i = F(!1), h = M(() => {
if (n.loading) return "";
const B = n.collection || "ri", S = n.name, k = n.color === "current" ? "currentColor" : `var(--ex-color-${n.color})`;
return `https://api.iconify.design/${B}/${S}.svg?color=${encodeURIComponent(k)}`;
}), x = M(() => {
const B = {
...n.customStyle
};
return n.color && n.color !== "current" && (B.color = `var(--ex-color-${n.color})`), B;
}), C = () => {
_.value = !1, i.value = !1, e("load");
}, g = (B) => {
_.value = !0, i.value = !1, e("error", B);
};
return ce(
() => n.loading,
(B) => {
B && (i.value = !0, _.value = !1);
}
), (B, S) => (l(), o("div", he({
class: [
"ex-icon",
`ex-icon--${B.size}`,
{
"ex-icon--loading": B.loading,
"ex-icon--spin": B.spin,
"ex-icon--pulse": B.pulse,
"ex-icon--glow": B.glow,
"ex-icon--neon": B.neon
}
],
style: x.value
}, B.$attrs), [
B.loading ? (l(), o("div", Pe, [...S[0] || (S[0] = [
y("div", { class: "ex-icon__spinner" }, null, -1)
])])) : (l(), o("img", {
key: 0,
src: h.value,
alt: B.alt,
class: X(["ex-icon__img", { "ex-icon__img--error": _.value }]),
onLoad: C,
onError: g
}, null, 42, Re))
], 16));
}
}), K = /* @__PURE__ */ ne(Ae, [["__scopeId", "data-v-685c761b"]]), Ke = {
install(v) {
v.component("ExIcon", K);
}
}, qe = ["disabled", "type", "aria-disabled", "aria-label"], Oe = { class: "ex-btn__content" }, He = {
key: 2,
class: "ex-btn__text"
}, Ue = {
key: 0,
class: "ex-btn__scan-line"
}, Ne = /* @__PURE__ */ oe({
__name: "ExButton",
props: {
type: { default: "primary" },
size: { default: "md" },
disabled: { type: Boolean, default: !1 },
loading: { type: Boolean, default: !1 },
block: { type: Boolean, default: !1 },
ghost: { type: Boolean, default: !1 },
dashed: { type: Boolean, default: !1 },
round: { type: Boolean, default: !1 },
circle: { type: Boolean, default: !1 },
glow: { type: Boolean, default: !1 },
neon: { type: Boolean, default: !1 },
cyber: { type: Boolean, default: !1 },
icon: {},
suffixIcon: {},
htmlType: { default: "button" },
ariaLabel: {},
customStyle: {}
},
emits: ["click"],
setup(v, { emit: D }) {
const n = v, e = D, { t: r } = se(), _ = M(() => ({
xs: "xs",
sm: "sm",
md: "sm",
lg: "md",
xl: "lg"
})[n.size]), i = (h) => {
if (n.disabled || n.loading) {
h.preventDefault();
return;
}
e("click", h);
};
return (h, x) => (l(), o("button", he({
class: [
"ex-btn",
`ex-btn--${h.type}`,
`ex-btn--${h.size}`,
{
"ex-btn--loading": h.loading,
"ex-btn--disabled": h.disabled,
"ex-btn--block": h.block,
"ex-btn--ghost": h.ghost,
"ex-btn--dashed": h.dashed,
"ex-btn--round": h.round,
"ex-btn--circle": h.circle,
"ex-btn--glow": h.glow,
"ex-btn--neon": h.neon,
"ex-btn--cyber": h.cyber
}
],
disabled: h.disabled || h.loading,
type: h.htmlType,
"aria-disabled": h.disabled || h.loading,
"aria-label": h.ariaLabel
}, h.$attrs, { onClick: i }), [
y("div", Oe, [
h.icon && !h.loading ? (l(), le(K, {
key: 0,
name: h.icon,
size: _.value,
class: X(["ex-btn__icon", "ex-btn__icon--prefix"])
}, null, 8, ["name", "size"])) : c("", !0),
h.loading ? (l(), le(K, {
key: 1,
name: "loader-4-line",
size: _.value,
spin: "",
class: "ex-btn__icon ex-btn__icon--loading"
}, null, 8, ["size"])) : c("", !0),
h.$slots.default ? (l(), o("span", He, [
te(h.$slots, "default", {}, void 0, !0)
])) : c("", !0),
h.suffixIcon && !h.loading ? (l(), le(K, {
key: 3,
name: h.suffixIcon,
size: _.value,
class: X(["ex-btn__icon", "ex-btn__icon--suffix"])
}, null, 8, ["name", "size"])) : c("", !0)
]),
h.cyber ? (l(), o("div", Ue)) : c("", !0)
], 16, qe));
}
}), ye = /* @__PURE__ */ ne(Ne, [["__scopeId", "data-v-310293cd"]]), We = {
install(v) {
v.component("ExButton", ye);
}
}, Ye = { class: "ex-link__content" }, Xe = { class: "ex-link__text" }, je = {
key: 0,
class: "ex-link__scan-line"
}, Qe = /* @__PURE__ */ oe({
__name: "ExLink",
props: {
href: {},
type: { default: "primary" },
size: { default: "md" },
disabled: { type: Boolean, default: !1 },
underline: { type: Boolean, default: !1 },
hoverUnderline: { type: Boolean, default: !0 },
glow: { type: Boolean, default: !1 },
neon: { type: Boolean, default: !1 },
cyber: { type: Boolean, default: !1 },
icon: {},
suffixIcon: {},
target: { default: "_self" },
ariaLabel: {},
customStyle: {}
},
emits: ["click"],
setup(v, { emit: D }) {
const n = v, e = D, { t: r } = se(), _ = M(() => n.href ? "a" : "span"), i = M(() => ({
xs: "xs",
sm: "sm",
md: "sm",
lg: "md",
xl: "lg"
})[n.size]), h = M(() => {
if (n.target === "_blank")
return "noopener noreferrer";
}), x = (C) => {
if (n.disabled) {
C.preventDefault();
return;
}
e("click", C);
};
return (C, g) => (l(), le(xe(_.value), he({
class: [
"ex-link",
`ex-link--${C.type}`,
`ex-link--${C.size}`,
{
"ex-link--disabled": C.disabled,
"ex-link--underline": C.underline,
"ex-link--hover-underline": C.hoverUnderline,
"ex-link--glow": C.glow,
"ex-link--neon": C.neon,
"ex-link--cyber": C.cyber
}
],
href: C.disabled ? void 0 : C.href,
target: C.target,
rel: h.value,
"aria-disabled": C.disabled,
"aria-label": C.ariaLabel
}, C.$attrs, { onClick: x }), {
default: ie(() => [
y("div", Ye, [
C.icon ? (l(), le(K, {
key: 0,
name: C.icon,
size: i.value,
class: X(["ex-link__icon", "ex-link__icon--prefix"])
}, null, 8, ["name", "size"])) : c("", !0),
y("span", Xe, [
te(C.$slots, "default", {}, void 0, !0)
]),
C.suffixIcon ? (l(), le(K, {
key: 1,
name: C.suffixIcon,
size: i.value,
class: X(["ex-link__icon", "ex-link__icon--suffix"])
}, null, 8, ["name", "size"])) : c("", !0)
]),
C.cyber ? (l(), o("div", je)) : c("", !0)
]),
_: 3
}, 16, ["class", "href", "target", "rel", "aria-disabled", "aria-label"]));
}
}), Ge = /* @__PURE__ */ ne(Qe, [["__scopeId", "data-v-f6e55be3"]]), Je = {
install(v) {
v.component("ExLink", Ge);
}
}, Ze = ["src", "alt"], ea = {
key: 1,
class: "ex-avatar__loading"
}, aa = {
key: 2,
class: "ex-avatar__fallback"
}, la = {
key: 3,
class: "ex-avatar__status"
}, ta = {
key: 4,
class: "ex-avatar__badge"
}, oa = { class: "ex-avatar__badge-text" }, sa = {
key: 5,
class: "ex-avatar__scan-line"
}, na = /* @__PURE__ */ oe({
__name: "ExAvatar",
props: {
src: {},
size: { default: "md" },
shape: { default: "circle" },
disabled: { type: Boolean, default: !1 },
loading: { type: Boolean, default: !1 },
glow: { type: Boolean, default: !1 },
neon: { type: Boolean, default: !1 },
cyber: { type: Boolean, default: !1 },
online: { type: Boolean },
offline: { type: Boolean },
badge: {},
alt: {},
fallbackIcon: { default: "user-line" },
customStyle: {}
},
emits: ["load", "error"],
setup(v, { emit: D }) {
const n = v, e = D, { t: r } = se(), _ = F(!1), i = F(!1), h = M(() => ({
...n.customStyle
})), x = () => {
_.value = !1, i.value = !1, e("load");
}, C = (g) => {
_.value = !0, i.value = !1, e("error", g);
};
return ce(
() => n.loading,
(g) => {
g && (i.value = !0, _.value = !1);
}
), (g, B) => (l(), o("div", he({
class: [
"ex-avatar",
`ex-avatar--${g.size}`,
`ex-avatar--${g.shape}`,
{
"ex-avatar--loading": g.loading,
"ex-avatar--disabled": g.disabled,
"ex-avatar--glow": g.glow,
"ex-avatar--neon": g.neon,
"ex-avatar--cyber": g.cyber,
"ex-avatar--online": g.online,
"ex-avatar--offline": g.offline
}
],
style: h.value
}, g.$attrs), [
g.src && !g.loading ? (l(), o("img", {
key: 0,
src: g.src,
alt: g.alt,
class: X(["ex-avatar__img", { "ex-avatar__img--error": _.value }]),
onLoad: x,
onError: C
}, null, 42, Ze)) : c("", !0),
g.loading ? (l(), o("div", ea, [
U(K, {
name: "loader-4-line",
spin: "",
class: "ex-avatar__spinner"
})
])) : c("", !0),
!g.src || g.loading || _.value ? (l(), o("div", aa, [
g.$slots.default ? te(g.$slots, "default", { key: 0 }, void 0, !0) : (l(), le(K, {
key: 1,
name: g.fallbackIcon,
class: "ex-avatar__icon"
}, null, 8, ["name"]))
])) : c("", !0),
g.online !== void 0 ? (l(), o("div", la, [
y("div", {
class: X([
"ex-avatar__status-dot",
{
"ex-avatar__status-dot--online": g.online,
"ex-avatar__status-dot--offline": !g.online
}
])
}, null, 2)
])) : c("", !0),
g.badge ? (l(), o("div", ta, [
y("span", oa, V(g.badge), 1)
])) : c("", !0),
g.cyber ? (l(), o("div", sa)) : c("", !0)
], 16));
}
}), ra = /* @__PURE__ */ ne(na, [["__scopeId", "data-v-1a3a8f92"]]), ia = {
install(v) {
v.component("ExAvatar", ra);
}
}, ua = { class: "ex-badge__content" }, da = {
key: 0,
class: "ex-badge__dot"
}, ca = {
key: 1,
class: "ex-badge__text"
}, pa = {
key: 0,
class: "ex-badge__scan-line"
}, fa = {
key: 1,
class: "ex-badge__pulse"
}, ma = /* @__PURE__ */ oe({
__name: "ExBadge",
props: {
content: {},
type: { default: "error" },
size: { default: "md" },
position: { default: "top-right" },
dot: { type: Boolean, default: !1 },
pulse: { type: Boolean, default: !1 },
glow: { type: Boolean, default: !1 },
neon: { type: Boolean, default: !1 },
cyber: { type: Boolean, default: !1 },
floating: { type: Boolean, default: !1 },
disabled: { type: Boolean, default: !1 },
max: { default: 99 },
customStyle: {}
},
setup(v) {
const D = v, { t: n } = se(), e = M(() => D.dot ? "" : typeof D.content == "number" ? D.content > D.max ? `${D.max}+` : D.content.toString() : D.content ? D.content.toString() : ""), r = M(() => ({
...D.customStyle
}));
return (_, i) => (l(), o("div", he({
class: [
"ex-badge",
`ex-badge--${_.type}`,
`ex-badge--${_.size}`,
`ex-badge--${_.position}`,
{
"ex-badge--dot": _.dot,
"ex-badge--pulse": _.pulse,
"ex-badge--glow": _.glow,
"ex-badge--neon": _.neon,
"ex-badge--cyber": _.cyber,
"ex-badge--floating": _.floating,
"ex-badge--disabled": _.disabled
}
],
style: r.value
}, _.$attrs), [
y("div", ua, [
_.dot ? (l(), o("div", da)) : _.content !== void 0 ? (l(), o("span", ca, V(e.value), 1)) : te(_.$slots, "default", { key: 2 }, void 0, !0)
]),
_.cyber ? (l(), o("div", pa)) : c("", !0),
_.pulse ? (l(), o("div", fa)) : c("", !0)
], 16));
}
}), ha = /* @__PURE__ */ ne(ma, [["__scopeId", "data-v-3f50e5dd"]]), va = {
install(v) {
v.component("ExBadge", ha);
}
}, ya = {
key: 0,
class: "ex-divider__content"
}, ba = { class: "ex-divider__text" }, ga = {
key: 1,
class: "ex-divider__line ex-divider__line--full"
}, _a = {
key: 2,
class: "ex-divider__scan-line"
}, ka = {
key: 3,
class: "ex-divider__animation"
}, xa = /* @__PURE__ */ oe({
__name: "ExDivider",
props: {
type: { default: "text" },
orientation: { default: "horizontal" },
size: { default: "md" },
dashed: { type: Boolean, default: !1 },
solid: { type: Boolean, default: !1 },
glow: { type: Boolean },
neon: { type: Boolean },
cyber: { type: Boolean },
animated: { type: Boolean, default: !1 },
disabled: { type: Boolean, default: !1 },
text: {},
customStyle: {}
},
setup(v) {
const D = v, { t: n } = se(), e = Ve(), r = M(() => D.text || e.default), _ = M(() => ({
...D.customStyle
}));
return (i, h) => (l(), o("div", he({
class: [
"ex-divider",
`ex-divider--${i.type}`,
`ex-divider--${i.orientation}`,
`ex-divider--${i.size}`,
{
"ex-divider--dashed": i.dashed,
"ex-divider--solid": i.solid,
"ex-divider--glow": i.glow,
"ex-divider--neon": i.neon,
"ex-divider--cyber": i.cyber,
"ex-divider--animated": i.animated,
"ex-divider--disabled": i.disabled
}
],
style: _.value
}, i.$attrs), [
r.value ? (l(), o("div", ya, [
h[0] || (h[0] = y("div", { class: "ex-divider__line ex-divider__line--left" }, null, -1)),
y("div", ba, [
te(i.$slots, "default", {}, () => [
fe(V(i.text), 1)
], !0)
]),
h[1] || (h[1] = y("div", { class: "ex-divider__line ex-divider__line--right" }, null, -1))
])) : (l(), o("div", ga)),
i.cyber ? (l(), o("div", _a)) : c("", !0),
i.animated ? (l(), o("div", ka)) : c("", !0)
], 16));
}
}), wa = /* @__PURE__ */ ne(xa, [["__scopeId", "data-v-1fa09b4d"]]), $a = {
install(v) {
v.component("ExDivider", wa);
}
}, Ca = { key: 1 }, Va = {
key: 0,
class: "ex-space__scan-line"
}, Ba = /* @__PURE__ */ oe({
__name: "ExSpace",
props: {
direction: { default: "horizontal" },
size: { default: "md" },
align: { default: "center" },
wrap: { type: Boolean, default: !1 },
fill: { type: Boolean, default: !1 },
glow: { type: Boolean, default: !1 },
neon: { type: Boolean, default: !1 },
cyber: { type: Boolean, default: !1 },
disabled: { type: Boolean, default: !1 },
customSize: {},
customStyle: {}
},
setup(v) {
const D = v, { t: n } = se(), e = Ve(), r = M(() => e.default ? e.default() : []), _ = M(() => {
const i = {
...D.customStyle
};
if (D.customSize) {
const h = typeof D.customSize == "number" ? `${D.customSize}px` : D.customSize;
D.direction, i.gap = h;
}
return i;
});
return (i, h) => (l(), o("div", he({
class: [
"ex-space",
`ex-space--${i.direction}`,
`ex-space--${i.size}`,
`ex-space--${i.align}`,
{
"ex-space--wrap": i.wrap,
"ex-space--fill": i.fill,
"ex-space--glow": i.glow,
"ex-space--neon": i.neon,
"ex-space--cyber": i.cyber,
"ex-space--disabled": i.disabled
}
],
style: _.value
}, i.$attrs), [
(l(!0), o(ue, null, de(r.value, (x, C) => (l(), o("div", {
key: C,
class: X([
"ex-space__item",
{
"ex-space__item--glow": i.glow,
"ex-space__item--neon": i.neon,
"ex-space__item--cyber": i.cyber
}
])
}, [
typeof x == "object" ? (l(), le(xe(x), { key: 0 })) : (l(), o("span", Ca, V(x), 1))
], 2))), 128)),
i.cyber ? (l(), o("div", Va)) : c("", !0)
], 16));
}
}), Ea = /* @__PURE__ */ ne(Ba, [["__scopeId", "data-v-336307e4"]]), Sa = {
install(v) {
v.component("ExSpace", Ea);
}
}, Da = {
key: 0,
class: "ex-input__prefix"
}, Ia = { class: "ex-input__wrapper" }, Ma = ["id", "type", "value", "placeholder", "disabled", "readonly", "maxlength", "minlength", "autocomplete", "autofocus", "spellcheck"], Ta = {
key: 0,
class: "ex-input__suffix"
}, za = ["aria-label"], Fa = {
key: 1,
class: "ex-input__suffix"
}, La = ["aria-label"], Ra = {
key: 2,
class: "ex-input__suffix"
}, Pa = {
key: 3,
class: "ex-input__count"
}, Aa = { class: "ex-input__count-text" }, Ka = {
key: 1,
class: "ex-input__scan-line"
}, qa = {
key: 2,
class: "ex-input__border-animation"
}, Oa = /* @__PURE__ */ oe({
__name: "ExInput",
props: {
modelValue: {},
type: { default: "text" },
size: { default: "md" },
placeholder: {},
disabled: { type: Boolean, default: !1 },
readonly: { type: Boolean, default: !1 },
clearable: { type: Boolean, default: !1 },
showPassword: { type: Boolean, default: !1 },
maxlength: {},
minlength: {},
showWordLimit: { type: Boolean, default: !1 },
autocomplete: {},
autofocus: { type: Boolean, default: !1 },
spellcheck: { type: Boolean, default: !1 },
prefixIcon: {},
suffixIcon: {},
glow: { type: Boolean },
neon: { type: Boolean },
cyber: { type: Boolean },
customStyle: {}
},
emits: ["update:modelValue", "change", "focus", "blur", "keydown", "keyup", "paste", "cut", "clear"],
setup(v, { expose: D, emit: n }) {
const e = v, r = n, { t: _ } = se(), i = F(), h = F(!1), x = F(!1), C = F(!1), g = M(() => `ex-input-${Math.random().toString(36).substr(2, 9)}`), B = M(() => e.type === "password" ? x.value ? "text" : "password" : e.type), S = M(() => String(e.modelValue || "").length), k = M(() => e.maxlength && S.value > e.maxlength), z = M(() => e.maxlength && S.value === e.maxlength), I = M(() => e.maxlength && S.value > e.maxlength * 0.8), A = M(() => ({
...e.customStyle
})), H = (s) => {
if (C.value) return;
const q = s.target.value;
r("update:modelValue", q);
}, L = (s) => {
const q = s.target.value;
r("change", q);
}, Y = (s) => {
h.value = !0, r("focus", s);
}, Q = (s) => {
h.value = !1, r("blur", s);
}, G = (s) => {
r("keydown", s);
}, ee = (s) => {
r("keyup", s);
}, b = (s) => {
r("paste", s);
}, T = (s) => {
r("cut", s);
}, O = () => {
C.value = !0;
}, P = (s) => {
C.value = !1;
const q = s.target.value;
r("update:modelValue", q);
}, d = () => {
x.value = !x.value;
}, f = () => {
r("update:modelValue", ""), r("clear"), me(() => {
i.value?.focus();
});
};
return ce(
() => e.autofocus,
(s) => {
s && me(() => {
i.value?.focus();
});
}
), D({
focus: () => i.value?.focus(),
blur: () => i.value?.blur(),
select: () => i.value?.select(),
clear: f
}), (s, p) => (l(), o("div", he({
class: [
"ex-input",
`ex-input--${s.size}`,
`ex-input--${s.type}`,
{
"ex-input--disabled": s.disabled,
"ex-input--readonly": s.readonly,
"ex-input--error": k.value,
"ex-input--success": z.value,
"ex-input--warning": I.value,
"ex-input--focused": h.value,
"ex-input--glow": s.glow,
"ex-input--neon": s.neon,
"ex-input--cyber": s.cyber,
"ex-input--clearable": s.clearable,
"ex-input--show-password": s.showPassword,
"ex-input--prefix-icon": s.prefixIcon,
"ex-input--suffix-icon": s.suffixIcon
}
],
style: A.value
}, s.$attrs), [
s.prefixIcon ? (l(), o("div", Da, [
U(K, {
name: s.prefixIcon,
class: "ex-input__prefix-icon"
}, null, 8, ["name"])
])) : c("", !0),
y("div", Ia, [
y("input", {
id: g.value,
ref_key: "inputRef",
ref: i,
type: B.value,
value: s.modelValue,
placeholder: s.placeholder,
disabled: s.disabled,
readonly: s.readonly,
maxlength: s.maxlength,
minlength: s.minlength,
autocomplete: s.autocomplete,
autofocus: s.autofocus,
spellcheck: s.spellcheck,
class: X([
"ex-input__inner",
{
"ex-input__inner--focused": h.value,
"ex-input__inner--disabled": s.disabled,
"ex-input__inner--readonly": s.readonly
}
]),
onInput: H,
onChange: L,
onFocus: Y,
onBlur: Q,
onKeydown: G,
onKeyup: ee,
onPaste: b,
onCut: T,
onCompositionstart: O,
onCompositionend: P
}, null, 42, Ma),
s.showPassword && B.value === "password" ? (l(), o("div", Ta, [
y("button", {
type: "button",
class: "ex-input__password-toggle",
"aria-label": x.value ? "隐藏密码" : "显示密码",
onClick: d
}, [
U(K, {
name: x.value ? "eye-off-line" : "eye-line"
}, null, 8, ["name"])
], 8, za)
])) : c("", !0),
s.clearable && s.modelValue && !s.disabled && !s.readonly ? (l(), o("div", Fa, [
y("button", {
type: "button",
class: "ex-input__clear",
"aria-label": Z(_)("ex.input.clear"),
onClick: f
}, [
U(K, { name: "close-line" })
], 8, La)
])) : c("", !0),
s.suffixIcon && !s.clearable && !s.showPassword ? (l(), o("div", Ra, [
U(K, {
name: s.suffixIcon,
class: "ex-input__suffix-icon"
}, null, 8, ["name"])
])) : c("", !0),
s.showWordLimit && s.maxlength ? (l(), o("div", Pa, [
y("span", Aa, V(S.value) + "/" + V(s.maxlength), 1)
])) : c("", !0)
]),
s.cyber && h.value ? (l(), o("div", Ka)) : c("", !0),
h.value ? (l(), o("div", qa)) : c("", !0)
], 16));
}
}), ke = /* @__PURE__ */ ne(Oa, [["__scopeId", "data-v-2fa89814"]]), Ha = {
install(v) {
v.component("ExInput", ke);
}
}, Ua = {
key: 0,
class: "ex-textarea__prefix"
}, Na = { class: "ex-textarea__wrapper" }, Wa = ["id", "value", "placeholder", "disabled", "readonly", "maxlength", "minlength", "rows", "cols", "autofocus", "name", "form", "required", "autocomplete", "spellcheck", "wrap"], Ya = {
key: 0,
class: "ex-textarea__word-limit"
}, Xa = { class: "ex-textarea__word-count" }, ja = { class: "ex-textarea__word-max" }, Qa = {
key: 1,
class: "ex-textarea__suffix"
}, Ga = {
key: 2,
class: "ex-textarea__error"
}, Ja = {
key: 3,
class: "ex-textarea__help"
}, Za = /* @__PURE__ */ oe({
__name: "ExTextarea",
props: {
modelValue: {},
type: { default: "primary" },
size: { default: "md" },
placeholder: {},
disabled: { type: Boolean, default: !1 },
readonly: { type: Boolean, default: !1 },
autofocus: { type: Boolean, default: !1 },
maxlength: {},
minlength: {},
rows: {},
cols: {},
resizable: { type: Boolean, default: !0 },
showWordLimit: { type: Boolean, default: !1 },
autosize: { type: [Boolean, Object], default: !1 },
prefixIcon: {},
suffixIcon: {},
error: { type: Boolean },
errorMessage: {},
helpText: {},
glow: { type: Boolean, default: !1 },
neon: { type: Boolean, default: !1 },
cyber: { type: Boolean, default: !1 },
customStyle: {},
id: {},
name: {},
form: {},
required: { type: Boolean, default: !1 },
autocomplete: {},
spellcheck: { type: Boolean, default: !0 },
wrap: { default: "soft" }
},
emits: ["update:modelValue", "change", "focus", "blur", "keydown", "keyup", "paste", "cut", "compositionstart", "compositionend"],
setup(v, { expose: D, emit: n }) {
const e = v, r = n, { t: _ } = se(), i = F(), h = F(!1), x = F(!1), C = M(
() => e.error || e.errorMessage && e.errorMessage.length > 0
), g = M(() => e.modelValue?.length || 0), B = M(() => ({
...e.customStyle
})), S = M(() => {
const f = {};
return e.autosize ? (f.resize = "none", f.overflow = "hidden") : e.resizable || (f.resize = "none"), f;
}), k = (f) => {
const p = f.target.value;
r("update:modelValue", p), e.autosize && me(() => {
b();
});
}, z = (f) => {
const p = f.target.value;
r("change", p, f);
}, I = (f) => {
h.value = !0, r("focus", f);
}, A = (f) => {
h.value = !1, r("blur", f);
}, H = (f) => {
r("keydown", f);
}, L = (f) => {
r("keyup", f);
}, Y = (f) => {
r("paste", f);
}, Q = (f) => {
r("cut", f);
}, G = (f) => {
x.value = !0, r("compositionstart", f);
}, ee = (f) => {
x.value = !1, r("compositionend", f);
}, b = () => {
if (!i.value || !e.autosize) return;
const f = i.value, s = typeof e.autosize == "object" && e.autosize.minRows || 1, p = typeof e.autosize == "object" && e.autosize.maxRows || 1 / 0;
f.style.height = "auto";
const q = parseInt(getComputedStyle(f).lineHeight) || 20, N = parseInt(getComputedStyle(f).paddingTop) || 0, J = parseInt(getComputedStyle(f).paddingBottom) || 0, re = parseInt(getComputedStyle(f).borderTopWidth) || 0, E = parseInt(getComputedStyle(f).borderBottomWidth) || 0, t = f.scrollHeight - N - J - re - E, w = Math.max(s, Math.min(p, Math.ceil(t / q)));
f.style.height = `${w * q + N + J + re + E}px`;
}, T = () => {
i.value?.focus();
}, O = () => {
i.value?.blur();
}, P = () => {
i.value?.select();
}, d = (f, s) => {
i.value?.setSelectionRange(f, s);
};
return ce(
() => e.autosize,
() => {
e.autosize && me(() => {
b();
});
},
{ immediate: !0 }
), ce(
() => e.modelValue,
() => {
e.autosize && me(() => {
b();
});
}
), D({
focus: T,
blur: O,
select: P,
setSelectionRange: d,
textareaRef: i
}), (f, s) => (l(), o("div", he({
class: [
"ex-textarea",
`ex-textarea--${f.size}`,
`ex-textarea--type-${f.type}`,
{
"ex-textarea--disabled": f.disabled,
"ex-textarea--readonly": f.readonly,
"ex-textarea--focused": h.value,
"ex-textarea--glow": f.glow,
"ex-textarea--neon": f.neon,
"ex-textarea--cyber": f.cyber,
"ex-textarea--resizable": f.resizable,
"ex-textarea--has-error": C.value,
"ex-textarea--has-prefix": f.prefixIcon || f.$slots.prefix,
"ex-textarea--has-suffix": f.suffixIcon || f.$slots.suffix
}
],
style: B.value
}, f.$attrs), [
f.prefixIcon || f.$slots.prefix ? (l(), o("div", Ua, [
f.prefixIcon ? (l(), le(K, {
key: 0,
name: f.prefixIcon,
class: "ex-textarea__prefix-icon"
}, null, 8, ["name"])) : te(f.$slots, "prefix", { key: 1 }, void 0, !0)
])) : c("", !0),
y("div", Na, [
y("textarea", {
id: f.id,
ref_key: "textareaRef",
ref: i,
value: f.modelValue,
placeholder: f.placeholder,
disabled: f.disabled,
readonly: f.readonly,
maxlength: f.maxlength,
minlength: f.minlength,
rows: f.rows,
cols: f.cols,
autofocus: f.autofocus,
name: f.name,
form: f.form,
required: f.required,
autocomplete: f.autocomplete,
spellcheck: f.spellcheck,
wrap: f.wrap,
class: X([
"ex-textarea__input",
{
"ex-textarea__input--error": C.value,
"ex-textarea__input--resizable": f.resizable
}
]),
style: ae(S.value),
onInput: k,
onChange: z,
onFocus: I,
onBlur: A,
onKeydown: H,
onKeyup: L,
onPaste: Y,
onCut: Q,
onCompositionstart: G,
onCompositionend: ee
}, null, 46, Wa),
f.showWordLimit && f.maxlength ? (l(), o("div", Ya, [
y("span", Xa, V(g.value), 1),
s[0] || (s[0] = y("span", { class: "ex-textarea__word-separator" }, "/", -1)),
y("span", ja, V(f.maxlength), 1)
])) : c("", !0)
]),
f.suffixIcon || f.$slots.suffix ? (l(), o("div", Qa, [
f.suffixIcon ? (l(), le(K, {
key: 0,
name: f.suffixIcon,
class: "ex-textarea__suffix-icon"
}, null, 8, ["name"])) : te(f.$slots, "suffix", { key: 1 }, void 0, !0)
])) : c("", !0),
C.value && f.errorMessage ? (l(), o("div", Ga, V(f.errorMessage), 1)) : c("", !0),
f.helpText && !C.value ? (l(), o("div", Ja, V(f.helpText), 1)) : c("", !0)
], 16));
}
}), el = /* @__PURE__ */ ne(Za, [["__scopeId", "data-v-60638e74"]]), al = {
install(v) {
v.component("ExTextarea", el);
}
}, ll = {
key: 0,
class: "ex-input-number__prefix"
}, tl = { class: "ex-input-number__wrapper" }, ol = ["id", "value", "placeholder", "disabled", "readonly", "autofocus", "name", "form", "required", "autocomplete"], sl = {
key: 0,
class: "ex-input-number__controls"
}, nl = ["disabled"], rl = ["disabled"], il = {
key: 1,
class: "ex-input-number__suffix"
}, ul = {
key: 2,
class: "ex-input-number__unit"
}, dl = {
key: 3,
class: "ex-input-number__error"
}, cl = {
key: 4,
class: "ex-input-number__help"
}, pl = /* @__PURE__ */ oe({
__name: "ExInputNumber",
props: {
modelValue: {},
type: { default: "primary" },
size: { default: "md" },
placeholder: {},
disabled: { type: Boolean, default: !1 },
readonly: { type: Boolean, default: !1 },
autofocus: { type: Boolean, default: !1 },
min: { default: -1 / 0 },
max: { default: 1 / 0 },
step: { default: 1 },
precision: { default: 0 },
controls: { type: Boolean, default: !0 },
controlsPosition: { default: "right" },
strict: { type: Boolean, default: !1 },
prefixIcon: {},
suffixIcon: {},
unit: {},
error: { type: Boolean },
errorMessage: {},
helpText: {},
glow: { type: Boolean, default: !1 },
neon: { type: Boolean, default: !1 },
cyber: { type: Boolean, default: !1 },
customStyle: {},
id: {},
name: {},
form: {},
required: { type: Boolean, default: !1 },
autocomplete: {}
},
emits: ["update:modelValue", "change", "focus", "blur", "keydown", "keyup", "paste", "cut", "compositionstart", "compositionend", "increase", "decrease"],
setup(v, { expose: D, emit: n }) {
const e = v, r = n, { t: _ } = se(), i = F(), h = F(!1), x = F(!1), C = F(null), g = M(
() => e.error || e.errorMessage && e.errorMessage.length > 0
), B = M(() => {
if (e.modelValue === void 0 || e.modelValue === null) return "";
const a = Number(e.modelValue);
return isNaN(a) ? "" : e.precision > 0 ? a.toFixed(e.precision) : a.toString();
}), S = M(() => e.modelValue !== void 0 && e.modelValue <= e.min), k = M(() => e.modelValue !== void 0 && e.modelValue >= e.max), z = M(() => ({
...e.customStyle
})), I = M(() => ({})), A = (a) => {
if (a === "" || a === null || a === void 0) return;
const m = parseFloat(a);
return isNaN(m) ? void 0 : m;
}, H = (a) => e.precision > 0 ? Number(a.toFixed(e.precision)) : Math.round(a), L = (a) => Math.min(Math.max(a, e.min), e.max), Y = (a) => {
const m = a.target, $ = m.value;
if (e.strict && !/^-?(\d+\.?\d*)?$/.test($) && $ !== "") {
m.value = B.value;
return;
}
const R = A($);
r("update:modelValue", R);
}, Q = (a) => {
const m = a.target, $ = A(m.value);
if ($ !== void 0) {
const R = L($), W = H(R);
W !== $ && (m.value = W.toString()), r("update:modelValue", W);
}
r("change", $, a);
}, G = (a) => {
h.value = !0, r("focus", a);
}, ee = (a) => {
h.value = !1, r("blur", a);
}, b = (a) => {
if (e.strict && ![
"Backspace",
"Delete",
"Tab",
"Escape",
"Enter",
"ArrowLeft",
"ArrowRight",
"ArrowUp",
"ArrowDown",
"Home",
"End",
"PageUp",
"PageDown"
].includes(a.key) && !a.ctrlKey && !a.metaKey) {
const $ = a.key;
if (!/^[0-9.-]$/.test($)) {
a.preventDefault();
return;
}
}
a.key === "ArrowUp" ? (a.preventDefault(), p()) : a.key === "ArrowDown" && (a.preventDefault(), q()), r("keydown", a);
}, T = (a) => {
r("keyup", a);
}, O = (a) => {
if (e.strict) {
const m = a.clipboardData?.getData("text");
if (m && !/^-?(\d+\.?\d*)?$/.test(m)) {
a.preventDefault();
return;
}
}
r("paste", a);
}, P = (a) => {
r("cut", a);
}, d = (a) => {
x.value = !0, r("compositionstart", a);
}, f = (a) => {
x.value = !1, r("compositionend", a);
}, s = (a) => {
h.value && !e.disabled && !e.readonly && (a.preventDefault(), a.deltaY < 0 ? p() : q());
}, p = () => {
if (e.disabled || e.readonly) return;
const a = e.modelValue || 0, m = H(L(a + e.step));
r("update:modelValue", m), r("increase", m);
}, q = () => {
if (e.disabled || e.readonly) return;
const a = e.modelValue || 0, m = H(L(a - e.step));
r("update:modelValue", m), r("decrease", m);
}, N = (a) => {
if (e.disabled || e.readonly) return;
const m = a === "increase" ? p : q;
m(), C.value = window.setTimeout(() => {
const $ = setInterval(() => {
m();
}, 100);
C.value = $;
}, 500);
}, J = () => {
C.value && (clearTimeout(C.value), clearInterval(C.value), C.value = null);
}, re = () => {
i.value?.focus();
}, E = () => {
i.value?.blur();
}, t = () => {
i.value?.select();
}, w = (a, m) => {
i.value?.setSelectionRange(a, m);
};
ce(
() => e.modelValue,
(a) => {
if (a !== void 0) {
const m = L(a), $ = H(m);
$ !== a && r("update:modelValue", $);
}
}
);
const u = () => {
C.value && (clearTimeout(C.value), clearInterval(C.value), C.value = null);
};
return D({
focus: re,
blur: E,
select: t,
setSelectionRange: w,
inputRef: i,
increase: p,
decrease: q
}), ve(() => {
u();
}), (a, m) => (l(), o("div", he({
class: [
"ex-input-number",
`ex-input-number--${a.size}`,
`ex-input-number--type-${a.type}`,
{
"ex-input-number--disabled": a.disabled,
"ex-input-number--readonly": a.readonly,
"ex-input-number--focused": h.value,
"ex-input-number--glow": a.glow,
"ex-input-number--neon": a.neon,
"ex-input-number--cyber": a.cyber,
"ex-input-number--has-error": g.value,
"ex-input-number--has-prefix": a.prefixIcon || a.$slots.prefix,
"ex-input-number--has-suffix": a.suffixIcon || a.$slots.suffix,
"ex-input-number--controls": a.controls,
"ex-input-number--controls-right": a.controlsPosition === "right"
}
],
style: z.value
}, a.$attrs), [
a.prefixIcon || a.$slots.prefix ? (l(), o("div", ll, [
a.prefixIcon ? (l(), le(K, {
key: 0,
name: a.prefixIcon,
class: "ex-input-number__prefix-icon"
}, null, 8, ["name"])) : te(a.$slots, "prefix", { key: 1 }, void 0, !0)
])) : c("", !0),
y("div", tl, [
y("input", {
id: a.id,
ref_key: "inputRef",
ref: i,
value: B.value,
placeholder: a.placeholder,
disabled: a.disabled,
readonly: a.readonly,
autofocus: a.autofocus,
name: a.name,
form: a.form,
required: a.required,
autocomplete: a.autocomplete,
class: X([
"ex-input-number__input",
{
"ex-input-number__input--error": g.value
}
]),
style: ae(I.value),
onInput: Y,
onChange: Q,
onFocus: G,
onBlur: ee,
onKeydown: b,
onKeyup: T,
onPaste: O,
onCut: P,
onCompositionstart: d,
onCompositionend: f,
onWheel: s
}, null, 46, ol),
a.controls ? (l(), o("div", sl, [
y("button", {
type: "button",
class: "ex-input-number__control ex-input-number__control--increase",
disabled: a.disabled || a.readonly || k.value,
onClick: p,
onMousedown: m[0] || (m[0] = ($) => N("increase")),
onMouseup: J,
onMouseleave: J
}, [
U(K, {
name: "add-line",
class: "ex-input-number__control-icon"
})
], 40, nl),
y("button", {
type: "button",
class: "ex-input-number__control ex-input-number__control--decrease",
disabled: a.disabled || a.readonly || S.value,
onClick: q,
onMousedown: m[1] || (m[1] = ($) => N("decrease")),
onMouseup: J,
onMouseleave: J
}, [
U(K, {
name: "subtract-line",
class: "ex-input-number__control-icon"
})
], 40, rl)
])) : c("", !0)
]),
a.suffixIcon || a.$slots.suffix ? (l(), o("div", il, [
a.suffixIcon ? (l(), le(K, {
key: 0,
name: a.suffixIcon,
class: "ex-input-number__suffix-icon"
}, null, 8, ["name"])) : te(a.$slots, "suffix", { key: 1 }, void 0, !0)
])) : c("", !0),
a.unit ? (l(), o("div", ul, V(a.unit), 1)) : c("", !0),
g.value && a.errorMessage ? (l(), o("div", dl, V(a.errorMessage), 1)) : c("", !0),
a.helpText && !g.value ? (l(), o("div", cl, V(a.helpText), 1)) : c("", !0)
], 16));
}
}), fl = /* @__PURE__ */ ne(pl, [["__scopeId", "data-v-8ee269c1"]]), ml = {
install(v) {
v.component("ExInputNumber", fl);
}
}, hl = { class: "ex-select__input-wrapper" }, vl = {
key: 0,
class: "ex-select__prefix"
}, yl = { class: "ex-select__input" }, bl = {
key: 0,
class: "ex-select__tags"
}, gl = { class: "ex-select__tag-text" }, _l = {
key: 1,
class: "ex-select__single"
}, kl = {
key: 0,
class: "ex-select__single-value"
}, xl = {
key: 1,
class: "ex-select__placeholder"
}, wl = ["placeholder"], $l = {
key: 1,
class: "ex-select__suffix"
}, Cl = {
key: 0,
class: "ex-select__no-data"
}, Vl = {
key: 1,
class: "ex-select__options"
}, Bl = ["onClick", "onMouseenter"], El = { class: "ex-select__option-content" }, Sl = { class: "ex-select__option-label" }, Dl = {
key: 0,
class: "ex-select__option-description"
}, Il = {
key: 0,
class: "ex-select__error"
}, Ml = {
key: 1,
class: "ex-select__help"
}, Tl = /* @__PURE__ */ oe({
__name: "ExSelect",
props: {
modelValue: {},
type: { default: "primary" },
size: { default: "md" },
options: { default: () => [] },
placeholder: { default: "" },
disabled: { type: Boolean, default: !1 },
readonly: { type: Boolean, default: !1 },
multiple: { type: Boolean, default: !1 },
searchable: { type: Boolean, default: !1 },
searchPlaceholder: { default: "" },
clearable: { type: Boolean, default: !1 },
noDataText: { default: "" },
placement: { default: "auto" },
maxOptions: { default: 0 },
virtual: { type: Boolean, default: !1 },
prefixIcon: {},
suffixIcon: {},
error: { type: Boolean },
errorMessage: {},
helpText: {},
glow: { type: Boolean, default: !1 },
neon: { type: Boolean, default: !1 },
cyber: { type: Boolean, default: !1 },
customStyle: {},
id: {},
name: {},
form: {},
required: { type: Boolean, default: !1 },
autocomplete: {}
},
emits: ["update:modelValue", "change", "focus", "blur", "search", "clear", "visible-change"],
setup(v, { expose: D, emit: n }) {
const e = v, r = n, { t: _ } = se(), i = F(), h = F(), x = F(), C = F(!1), g = F(!1), B = F(""), S = F(-1), k = F({}), z = M(
() => e.error || e.errorMessage && e.errorMessage.length > 0
), I = M(() => e.multiple || e.modelValue === void 0 || e.modelValue === null ? null : e.modelValue), A = M(() => e.multiple ? Array.isArray(e.modelValue) ? e.modelValue : [] : []), H = M(() => e.multiple ? A.value.length > 0 : I.value !== null && I.value !== void 0), L = M(() => {
let a = e.options;
if (e.searchable && B.value) {
const m = B.value.toLowerCase();
a = a.filter(($) => G($).toLowerCase().includes(m));
}
return e.maxOptions > 0 && (a = a.slice(0, e.maxOptions)), a;
}), Y = M(() => ({
...e.customStyle
})), Q = (a, m) => a.value ?? m, G = (a) => {
if (a && typeof a == "object")
return a.label || String(a.value);
if (a != null) {
const m = e.options.find(($) => $.value === a);
return m ? m.label || String(m.value) : String(a);
}
return String(a);
}, ee = (a) => e.multiple ? A.value.includes(a.value) : I.value === a.value, b = () => {
e.disabled || e.readonly || (g.value ? O() : T());
}, T = async () => {
g.value || (g.value = !0, r("visible-change", !0), await me(), P(), e.searchable && h.value && h.value.focus(), L.value.length > 0 && (S.value = 0));
}, O = () => {
g.value && (g.value = !1, S.value = -1, B.value = "", r("visible-change", !1), i.value && i.value.focus());
}, P = () => {
if (!i.value || !x.value) return;
const a = i.value.getBoundingClientRect(), m = window.innerHeight, $ = 200;
let R = a.bottom;
if (a.bottom + $ > m)
if (a.top - $ > 0)
R = a.top - $;
else {
const W = m - a.bottom, j = a.top;
j > W && (R = a.top - Math.min($, j));
}
k.value = {
position: "fixed",
top: `${R}px`,
left: `${a.left}px`,
width: `${a.width}px`,
zIndex: 9999
};
}, d = (a) => {
a.disabled || (e.multiple ? s(a) : f(a));
}, f = (a) => {
r("update:modelValue", a.value), r("change", a.value, a), me(() => {
O();
});
}, s = (a) => {
const m = [...A.value], $ = a.value;
if (m.includes($)) {
const W = m.indexOf($);
m.splice(W, 1);
} else
m.push($);
const R = m.map((W) => e.options.find((j) => j.value === W)).filter(Boolean);
r("update:modelValue", m), r("change", m, R);
}, p = (a) => {
if (e.disabled || e.readonly) return;
const m = [...A.value], $ = m.indexOf(a);
if ($ > -1) {
m.splice($, 1);
const R = m.map((W) => e.options.find((j) => j.value === W)).filter(Boolean);
r("update:modelValue", m), r("change", m, R);
}
}, q = () => {
if (e.disabled || e.readonly) return;
const a = e.multiple ? [] : null;
r("update:modelValue", a), r("change", a, e.multiple ? [] : null), r("clear");
}, N = (a) => {
if (!(e.disabled || e.readonly))
switch (a.key) {
case "Enter":
case " ":
a.preventDefault(), g.value ? S.value >= 0 && L.value[S.value] && d(L.value[S.value]) : T();
break;
case "Escape":
g.value && (a.preventDefault(), O());
break;
case "ArrowDown":
a.preventDefault(), g.value ? S.value = Math.min(S.value + 1, L.value.length - 1) : T();
break;
case "ArrowUp":
a.preventDefault(), g.value ? S.value = Math.max(S.value - 1, 0) : T();
break;
case "Tab":
g.value && O();
break;
}
};
ce(B, (a) => {
r("search", a), S.value = 0;
}), ce(
() => L.value,
() => {
S.value = Math.min(S.value, L.value.length - 1);
}
);
const J = (a) => {
g.value && i.value && !i.value.contains(a.target) && O();
}, re = () => {
g.value && P();
};
return be(() => {
document.addEventListener("click", J), window.addEventListener("resize", re);
}), ve(() => {
document.removeEventListener("click", J), window.removeEventListener("resize", re);
}), D({
focus: () => {
i.value?.focus();
},
blur: () => {
i.value?.blur();
},
open: () => {
T();
},
close: () => {
O();
},
selectRef: i
}), (a, m) => (l(), o("div", he({
ref_key: "selectRef",
ref: i,
class: [
"ex-select",
`ex-select--${a.size}`,
`ex-select--type-${a.type}`,
{
"ex-select--disabled": a.disabled,
"ex-select--readonly": a.readonly,
"ex-select--focused": C.value,