adverich-kun-ui 0.1.347 → 0.1.349
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import { useSlots as C, useAttrs as j, computed as
|
|
2
|
-
import { RouterLink as
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
const
|
|
1
|
+
import { useSlots as C, useAttrs as j, computed as s, ref as I, createBlock as l, openBlock as a, resolveDynamicComponent as o, mergeProps as A, unref as O, withCtx as E, createElementVNode as f, renderSlot as i, createCommentVNode as c, createVNode as N, normalizeClass as V, createElementBlock as p, createTextVNode as W, toDisplayString as F, h as T } from "vue";
|
|
2
|
+
import { RouterLink as D } from "vue-router";
|
|
3
|
+
import L from "../../../KunLoaderCircular/src/components/KunLoaderCircular.vue.js";
|
|
4
|
+
import q from "../../../KunIcon/src/components/KunIcon.vue.js";
|
|
5
|
+
const K = { class: "relative flex items-center justify-center w-full h-full" }, P = { class: "absolute inset-0 flex items-center justify-center z-10" }, R = {
|
|
6
6
|
key: 0,
|
|
7
7
|
class: "mr-2 flex items-center"
|
|
8
|
-
},
|
|
8
|
+
}, G = {
|
|
9
9
|
key: 1,
|
|
10
10
|
class: "truncate flex items-center justify-center"
|
|
11
|
-
},
|
|
11
|
+
}, H = {
|
|
12
12
|
key: 2,
|
|
13
13
|
class: "ml-2 flex items-center"
|
|
14
|
-
},
|
|
14
|
+
}, X = {
|
|
15
15
|
__name: "KunBtn",
|
|
16
16
|
props: {
|
|
17
17
|
text: String,
|
|
@@ -49,13 +49,13 @@ const q = { class: "relative flex items-center justify-center w-full h-full" },
|
|
|
49
49
|
appendIcon: [String, Function, Object, Array],
|
|
50
50
|
iconSize: { type: String, default: null }
|
|
51
51
|
},
|
|
52
|
-
setup(n, { expose:
|
|
53
|
-
const
|
|
52
|
+
setup(n, { expose: m }) {
|
|
53
|
+
const h = C(), t = n, u = j(), b = s(() => !!t.to || !!t.href), y = s(() => !b.value), v = s(() => t.href ? "a" : t.to ? D : "button"), d = (e) => !e || e === !1 || e === !0 && !t.icon ? null : T(q, {
|
|
54
54
|
icon: e,
|
|
55
|
-
size:
|
|
55
|
+
size: $.value,
|
|
56
56
|
color: t.textColor ?? "text-font-color",
|
|
57
57
|
disabled: t.disabled
|
|
58
|
-
}),
|
|
58
|
+
}), k = s(() => t.href ? {
|
|
59
59
|
href: t.href,
|
|
60
60
|
target: t.target ?? "_self",
|
|
61
61
|
rel: t.target === "_blank" ? "noopener noreferrer" : null
|
|
@@ -65,7 +65,7 @@ const q = { class: "relative flex items-center justify-center w-full h-full" },
|
|
|
65
65
|
} : {
|
|
66
66
|
type: "button",
|
|
67
67
|
disabled: t.loading || t.disabled
|
|
68
|
-
}),
|
|
68
|
+
}), S = (e) => {
|
|
69
69
|
switch (e) {
|
|
70
70
|
case "xxs":
|
|
71
71
|
return "px-1 py-1 text-xs";
|
|
@@ -84,7 +84,7 @@ const q = { class: "relative flex items-center justify-center w-full h-full" },
|
|
|
84
84
|
default:
|
|
85
85
|
return "px-3 py-2 text-sm";
|
|
86
86
|
}
|
|
87
|
-
},
|
|
87
|
+
}, $ = s(() => {
|
|
88
88
|
if (t.iconSize) return t.iconSize;
|
|
89
89
|
switch (t.size) {
|
|
90
90
|
case "xxs":
|
|
@@ -104,32 +104,32 @@ const q = { class: "relative flex items-center justify-center w-full h-full" },
|
|
|
104
104
|
default:
|
|
105
105
|
return "text-base";
|
|
106
106
|
}
|
|
107
|
-
}),
|
|
108
|
-
const e = t.bgColor,
|
|
107
|
+
}), w = s(() => {
|
|
108
|
+
const e = t.bgColor, r = t.textColor;
|
|
109
109
|
switch (t.variant) {
|
|
110
110
|
case "default":
|
|
111
|
-
return `${e} ${
|
|
111
|
+
return `${e} ${r} shadow hover:brightness-95`;
|
|
112
112
|
case "tonal":
|
|
113
|
-
return `${e} ${
|
|
113
|
+
return `${e} ${r} shadow-sm hover:shadow-md`;
|
|
114
114
|
case "soft":
|
|
115
|
-
return `${e} ${
|
|
115
|
+
return `${e} ${r} hover:bg-opacity-30 shadow-sm`;
|
|
116
116
|
case "outlined":
|
|
117
|
-
return `bg-transparent ${
|
|
117
|
+
return `bg-transparent ${r} border ${e} border-opacity-40 hover:bg-black/5`;
|
|
118
118
|
case "plain":
|
|
119
|
-
return `bg-transparent ${
|
|
119
|
+
return `bg-transparent ${r} hover:bg-transparent active:bg-black/10`;
|
|
120
120
|
case "text":
|
|
121
|
-
return `${e} ${
|
|
121
|
+
return `${e} ${r} hover:bg-opacity-10 active:bg-black/5`;
|
|
122
122
|
default:
|
|
123
|
-
return `${e} ${
|
|
123
|
+
return `${e} ${r}`;
|
|
124
124
|
}
|
|
125
|
-
}),
|
|
125
|
+
}), z = s(() => !!t.text), B = s(() => {
|
|
126
126
|
const e = [
|
|
127
127
|
"inline-flex items-center justify-center break-keep transition-all whitespace-nowrap",
|
|
128
|
-
x.value ? "" :
|
|
128
|
+
x.value ? "" : S(t.size),
|
|
129
129
|
t.fontWeight,
|
|
130
130
|
t.rounded,
|
|
131
131
|
t.textAlign,
|
|
132
|
-
|
|
132
|
+
w.value,
|
|
133
133
|
"relative"
|
|
134
134
|
// 🔹 Hace que los hijos `absolute` se posicionen correctamente
|
|
135
135
|
];
|
|
@@ -166,23 +166,26 @@ const q = { class: "relative flex items-center justify-center w-full h-full" },
|
|
|
166
166
|
"active:scale-[.98]",
|
|
167
167
|
"transition duration-100 ease-in-out",
|
|
168
168
|
"cursor-pointer"
|
|
169
|
-
) : (e.push("pointer-events-none"), t.disabled && e.push("opacity-50 cursor-not-allowed")),
|
|
170
|
-
}), x =
|
|
171
|
-
return
|
|
169
|
+
) : (e.push("pointer-events-none"), t.disabled && e.push("opacity-50 cursor-not-allowed")), z.value && e.push(t.minWidth), e.filter(Boolean);
|
|
170
|
+
}), x = s(() => !!t.icon && !t.text && !h.default), g = I(null);
|
|
171
|
+
return m({
|
|
172
172
|
focus: () => {
|
|
173
|
-
var e,
|
|
174
|
-
return (
|
|
173
|
+
var e, r;
|
|
174
|
+
return (r = (e = g.value) == null ? void 0 : e.focus) == null ? void 0 : r.call(e);
|
|
175
175
|
}
|
|
176
|
-
}), (e,
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
176
|
+
}), (e, r) => (a(), l(o(v.value), A({
|
|
177
|
+
ref_key: "rootEl",
|
|
178
|
+
ref: g
|
|
179
|
+
}, k.value, {
|
|
180
|
+
class: B.value,
|
|
181
|
+
style: O(u).style,
|
|
182
|
+
disabled: y.value && (n.loading || n.disabled)
|
|
180
183
|
}), {
|
|
181
|
-
default:
|
|
182
|
-
f("div",
|
|
184
|
+
default: E(() => [
|
|
185
|
+
f("div", K, [
|
|
183
186
|
n.loading ? i(e.$slots, "loader", { key: 0 }, () => [
|
|
184
|
-
f("div",
|
|
185
|
-
N(
|
|
187
|
+
f("div", P, [
|
|
188
|
+
N(L, {
|
|
186
189
|
size: "20",
|
|
187
190
|
width: "5"
|
|
188
191
|
})
|
|
@@ -191,16 +194,16 @@ const q = { class: "relative flex items-center justify-center w-full h-full" },
|
|
|
191
194
|
f("div", {
|
|
192
195
|
class: V([{ "opacity-50": n.loading }, "flex items-center justify-center w-full h-full"])
|
|
193
196
|
}, [
|
|
194
|
-
e.$slots.prepend || n.prependIcon ? (a(), p("span",
|
|
197
|
+
e.$slots.prepend || n.prependIcon ? (a(), p("span", R, [
|
|
195
198
|
i(e.$slots, "prepend"),
|
|
196
199
|
(a(), l(o(d(n.prependIcon))))
|
|
197
200
|
])) : c("", !0),
|
|
198
|
-
n.text || e.$slots.default || n.icon ? (a(), p("span",
|
|
201
|
+
n.text || e.$slots.default || n.icon ? (a(), p("span", G, [
|
|
199
202
|
n.icon && !n.text && !e.$slots.default ? (a(), l(o(d(n.icon)), { key: 0 })) : i(e.$slots, "default", { key: 1 }, () => [
|
|
200
|
-
W(
|
|
203
|
+
W(F(n.text), 1)
|
|
201
204
|
])
|
|
202
205
|
])) : c("", !0),
|
|
203
|
-
e.$slots.append || n.appendIcon ? (a(), p("span",
|
|
206
|
+
e.$slots.append || n.appendIcon ? (a(), p("span", H, [
|
|
204
207
|
i(e.$slots, "append"),
|
|
205
208
|
(a(), l(o(d(n.appendIcon))))
|
|
206
209
|
])) : c("", !0)
|
|
@@ -212,5 +215,5 @@ const q = { class: "relative flex items-center justify-center w-full h-full" },
|
|
|
212
215
|
}
|
|
213
216
|
};
|
|
214
217
|
export {
|
|
215
|
-
|
|
218
|
+
X as default
|
|
216
219
|
};
|