@ironsource/shared-ui 2.2.0-test.11 → 2.2.0-test.12
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.
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";.font-tab-label2[data-v-4fd00d7c],.font-chart-2[data-v-4fd00d7c],.font-chart-1[data-v-4fd00d7c]{font-family:Inter,sans-serif;font-weight:700}.tag-input-sizer[data-v-4fd00d7c],.tag-input[data-v-4fd00d7c],.font-chip-label[data-v-4fd00d7c],.font-table-label[data-v-4fd00d7c],.font-button[data-v-4fd00d7c],.font-heading-6[data-v-4fd00d7c],.font-heading-5[data-v-4fd00d7c],.font-heading-4[data-v-4fd00d7c],.font-heading-3[data-v-4fd00d7c],.font-heading-2[data-v-4fd00d7c],.font-heading-1[data-v-4fd00d7c],.font-title[data-v-4fd00d7c]{font-family:Inter,sans-serif;font-weight:600}.font-tab-label1[data-v-4fd00d7c],.font-input-label[data-v-4fd00d7c],.font-overline[data-v-4fd00d7c],.font-subtitle-2[data-v-4fd00d7c],.font-subtitle-1[data-v-4fd00d7c]{font-family:Inter,sans-serif;font-weight:500}.font-caption[data-v-4fd00d7c],.font-body-2[data-v-4fd00d7c],.font-body-1[data-v-4fd00d7c]{font-family:Inter,sans-serif;font-weight:400}.font-title[data-v-4fd00d7c]{font-size:2.5rem;line-height:3rem;letter-spacing:-.055rem}.font-heading-1[data-v-4fd00d7c]{font-size:1.5rem;line-height:1.75rem;letter-spacing:-.0285rem}.font-heading-2[data-v-4fd00d7c]{font-size:1.125rem;line-height:1.75rem;letter-spacing:-.01575rem}.font-heading-3[data-v-4fd00d7c]{font-size:1rem;line-height:1.5rem;letter-spacing:-.011rem}.font-heading-4[data-v-4fd00d7c]{font-size:.875rem;line-height:1rem;letter-spacing:unset}.font-heading-5[data-v-4fd00d7c]{font-size:.8125rem;line-height:16px;letter-spacing:unset}.font-heading-6[data-v-4fd00d7c]{font-size:.75rem;line-height:.75rem;letter-spacing:0}.font-body-1[data-v-4fd00d7c]{font-size:.875rem;line-height:1.25rem;letter-spacing:-.00525rem}.font-body-2[data-v-4fd00d7c]{font-size:.8125rem;line-height:1.25rem;letter-spacing:-.00244rem}.font-subtitle-1[data-v-4fd00d7c]{font-size:.875rem;line-height:1.25rem;letter-spacing:-.00525rem}.font-subtitle-2[data-v-4fd00d7c]{font-size:.8125rem;line-height:1.25rem;letter-spacing:-.00244rem}.font-chart-1[data-v-4fd00d7c]{font-size:1.5rem;line-height:1.5rem;letter-spacing:-.015rem}.font-chart-2[data-v-4fd00d7c]{font-size:1.25rem;line-height:1.25rem;letter-spacing:-.0125rem}.font-button[data-v-4fd00d7c]{font-size:.875rem;line-height:1.25rem;letter-spacing:.00875rem}.font-overline[data-v-4fd00d7c]{font-size:.75rem;line-height:1rem;letter-spacing:.045rem;text-transform:uppercase}.font-caption[data-v-4fd00d7c]{font-size:.75rem;line-height:1rem}.font-table-label[data-v-4fd00d7c]{font-size:.8125rem;line-height:1.25rem;letter-spacing:.00813rem}.font-input-label[data-v-4fd00d7c]{font-size:.8125rem;line-height:1rem;letter-spacing:.00813rem}.font-tab-label1[data-v-4fd00d7c],.font-tab-label2[data-v-4fd00d7c]{font-size:.875rem;line-height:1rem}.tag-input-sizer[data-v-4fd00d7c],.tag-input[data-v-4fd00d7c],.font-chip-label[data-v-4fd00d7c]{font-size:.75rem;line-height:1rem}h1[data-v-4fd00d7c],h2[data-v-4fd00d7c],h3[data-v-4fd00d7c],h4[data-v-4fd00d7c],h5[data-v-4fd00d7c],h6[data-v-4fd00d7c]{margin:0}.rounded-tag[data-v-4fd00d7c]{border-radius:100px}.tag-editing[data-v-4fd00d7c]{outline:1px solid var(--outline-color)}.unselected-tag-hover-outline[data-v-4fd00d7c]{background-color:var(--action-hover)}.tag-hover-outline[data-v-4fd00d7c]{outline:1px solid var(--outline-color);cursor:pointer}.unselected-tag[data-v-4fd00d7c]{outline:1px solid var(--action-outlined-border)}.tag-disabled[data-v-4fd00d7c]{background-color:transparent;outline:1px solid var(--action-disabled)}.tag-content[data-v-4fd00d7c]{display:flex;align-items:center;position:relative;min-width:.625rem;max-width:31.25rem}.tag-icon[data-v-4fd00d7c]{margin-right:.25rem}.tag-label[data-v-4fd00d7c]{user-select:none;min-width:.5rem}.tag-label--disabled[data-v-4fd00d7c]{color:var(--action-disabled)}.tag-label--hidden[data-v-4fd00d7c]{visibility:hidden}.tag-input[data-v-4fd00d7c]{position:static;width:auto;background:transparent;min-width:.6rem;padding:0;border:none;max-width:100%;overflow-x:auto;white-space:nowrap}.tag-input[data-v-4fd00d7c]:focus{outline:none}.tag-input-outline[data-v-4fd00d7c]::placeholder{color:var(--action-disabled)}.clear-button[data-v-4fd00d7c]{margin-left:.25rem;color:var(--action-active);cursor:pointer}.clear-button[data-v-4fd00d7c]:hover{color:var(--text-primary)}.clear-button--invalid[data-v-4fd00d7c]{color:var(--error-dark)}.clear-button--invalid[data-v-4fd00d7c]:hover{color:var(--error-darker)}.tag-input-sizer[data-v-4fd00d7c]{position:absolute;visibility:hidden;height:0;white-space:pre;pointer-events:none;padding:0}.editable-tag[data-v-4fd00d7c]{cursor:text}.empty-tag[data-v-4fd00d7c]{background-color:transparent;outline:1px dashed var(--action-outlined-border);color:var(--text-secondary)}.empty-tag[data-v-4fd00d7c]:hover:not(.tag-disabled){outline:1px dashed var(--action-active)}.tag-max-length-tooltip[data-v-4fd00d7c]{display:flex;width:250px;padding:.25rem}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
/* empty css */import
|
|
3
|
-
// import "../../Tag.
|
|
4
|
-
const
|
|
1
|
+
import o from "./Tag.vue2.js";
|
|
2
|
+
/* empty css */import _ from "../../_virtual/_plugin-vue_export-helper.js";
|
|
3
|
+
// import "../../Tag.vue_vue_type_style_index_0_scoped_4fd00d7c_lang.css"; //*');
|
|
4
|
+
const c = /* @__PURE__ */ _(o, [["__scopeId", "data-v-4fd00d7c"]]);
|
|
5
5
|
export {
|
|
6
|
-
|
|
6
|
+
c as default
|
|
7
7
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import "../../Tag.
|
|
1
|
+
import "../../Tag.vue_vue_type_style_index_0_scoped_4fd00d7c_lang.css"; import { defineComponent as J, ref as u, computed as d, watch as N, nextTick as S, openBlock as v, createBlock as C, unref as l, withCtx as f, createElementVNode as E, createVNode as w, createTextVNode as V, toDisplayString as T, normalizeClass as p, normalizeStyle as R, withModifiers as m, createCommentVNode as $, withDirectives as O, createElementBlock as H, isRef as Q, withKeys as K, vModelText as X, vShow as Z } from "vue";
|
|
2
2
|
import D from "../typography/v4/Typography.vue.js";
|
|
3
3
|
import W from "../icon/v4/IconV4.vue.js";
|
|
4
4
|
import "../icon/v4/IconFlag.vue.js";
|
|
@@ -26,34 +26,34 @@ const ae = { class: "tag-max-length-tooltip" }, le = { class: "tag-content" }, t
|
|
|
26
26
|
},
|
|
27
27
|
emits: ["update:label", "remove", "stopEditing"],
|
|
28
28
|
setup(a, { emit: b }) {
|
|
29
|
-
const e = a,
|
|
29
|
+
const e = a, r = u(!1), y = u(null), h = u(void 0), k = u(!1), s = u(!1), o = u(e.isSelected || e.editable), z = d(() => !e.label && !r.value && e.placeholder), I = d(() => (console.log(
|
|
30
30
|
"isTooltipOpen",
|
|
31
|
-
e.maxLength &&
|
|
32
|
-
), e.maxLength &&
|
|
31
|
+
e.maxLength && i.value.length >= e.maxLength && r.value
|
|
32
|
+
), e.maxLength && i.value.length >= e.maxLength && r.value)), g = d(() => e.disabled || !e.selectable || r.value ? "outlined" : s.value ? "filled" : !o.value && !e.editable ? "outlined" : e.variant), F = d(() => e.disabled ? "default" : e.isInvalid ? "error" : o.value || !o.value && e.editable || !e.selectable ? e.color : "default"), i = d({
|
|
33
33
|
get: () => e.label,
|
|
34
34
|
set: (n) => {
|
|
35
35
|
b("update:label", n);
|
|
36
36
|
}
|
|
37
|
-
}),
|
|
38
|
-
e.disabled || !e.selectable || (e.editable ? (
|
|
37
|
+
}), M = u(null), P = () => M.value?.focus(), U = async () => {
|
|
38
|
+
e.disabled || !e.selectable || (e.editable ? (r.value = !0, await S(), P()) : o.value = !o.value);
|
|
39
39
|
}, Y = () => {
|
|
40
|
-
b("stopEditing"),
|
|
41
|
-
},
|
|
42
|
-
|
|
40
|
+
b("stopEditing"), x();
|
|
41
|
+
}, x = () => {
|
|
42
|
+
r.value = !1, !i.value && !e.placeholder && b("remove");
|
|
43
43
|
};
|
|
44
|
-
|
|
45
|
-
() => [
|
|
44
|
+
N(
|
|
45
|
+
() => [i.value, e.placeholder, r.value],
|
|
46
46
|
async () => {
|
|
47
|
-
await
|
|
47
|
+
await S(), r.value && y.value ? h.value = y.value.offsetWidth + "px" : h.value = void 0;
|
|
48
48
|
},
|
|
49
49
|
{ immediate: !0 }
|
|
50
|
-
),
|
|
50
|
+
), N(
|
|
51
51
|
() => e.editable,
|
|
52
52
|
() => {
|
|
53
53
|
e.editable && (o.value = !0);
|
|
54
54
|
}
|
|
55
55
|
);
|
|
56
|
-
const
|
|
56
|
+
const B = {
|
|
57
57
|
default: "var(--default-outlined-border)",
|
|
58
58
|
primary: "var(--primary-main)",
|
|
59
59
|
info: "var(--info-dark)",
|
|
@@ -61,7 +61,7 @@ const ae = { class: "tag-max-length-tooltip" }, le = { class: "tag-content" }, t
|
|
|
61
61
|
warning: "var(--warning-main)",
|
|
62
62
|
success: "var(--success-main)",
|
|
63
63
|
dark: "var(--common-divider)"
|
|
64
|
-
},
|
|
64
|
+
}, L = {
|
|
65
65
|
default: "var(--action-active)",
|
|
66
66
|
primary: "var(--primary-dark)",
|
|
67
67
|
info: "var(--info-dark)",
|
|
@@ -81,143 +81,139 @@ const ae = { class: "tag-max-length-tooltip" }, le = { class: "tag-content" }, t
|
|
|
81
81
|
if (e.disabled)
|
|
82
82
|
return "var(--action-disabled)";
|
|
83
83
|
const n = e.isInvalid ? "error" : e.color;
|
|
84
|
-
return
|
|
84
|
+
return k.value ? j[n] : L[n];
|
|
85
85
|
}), A = d(() => {
|
|
86
86
|
if (e.disabled)
|
|
87
87
|
return "var(--action-disabled)";
|
|
88
88
|
const n = e.isInvalid ? "error" : e.color;
|
|
89
|
-
return o.value || !e.selectable ?
|
|
89
|
+
return o.value || !e.selectable ? L[n] : "var(--action-active)";
|
|
90
90
|
}), G = d(() => {
|
|
91
91
|
if (e.editable && e.variant !== "outlined" || !e.selectable) {
|
|
92
|
-
const n =
|
|
92
|
+
const n = r.value ? B[e.color] : "var(--primary-main-50-p)";
|
|
93
93
|
return {
|
|
94
|
-
"--outline-color": e.isInvalid ?
|
|
94
|
+
"--outline-color": e.isInvalid ? B.error : n
|
|
95
95
|
};
|
|
96
96
|
}
|
|
97
97
|
return s.value && e.variant !== "outlined" && e.color === "primary" && !e.editable ? {
|
|
98
98
|
"--outline-color": o.value ? "var(--primary-main-50-p)" : "var(--action-active)"
|
|
99
99
|
} : {};
|
|
100
100
|
});
|
|
101
|
-
return (n, t) => (v(), C(
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
content: f(() => [
|
|
113
|
-
V("div", ae, [
|
|
114
|
-
y(l(D), { variant: "body2" }, {
|
|
115
|
-
default: f(() => [
|
|
116
|
-
R(z(a.maxLengthTooltip), 1)
|
|
117
|
-
]),
|
|
118
|
-
_: 1
|
|
119
|
-
})
|
|
120
|
-
])
|
|
121
|
-
]),
|
|
122
|
-
trigger: f(() => [
|
|
123
|
-
y(l(_), {
|
|
124
|
-
class: h({
|
|
125
|
-
"rounded-tag": a.rounded,
|
|
126
|
-
"tag-editing": i.value && l(p) !== "outlined",
|
|
127
|
-
// outlined chips have an outline
|
|
128
|
-
"tag-hover-outline": a.label && s.value && l(p) !== "outlined",
|
|
129
|
-
// outlined chips have an outline
|
|
130
|
-
"unselected-tag-hover-outline": a.label && s.value && l(p) !== "outlined" && !o.value && !a.editable,
|
|
131
|
-
// for unselected tags that are not editable, we want to show a hover outline
|
|
132
|
-
"tag-disabled": a.disabled,
|
|
133
|
-
"empty-tag": l(I),
|
|
134
|
-
"unselected-tag": !o.value && a.selectable && a.label,
|
|
135
|
-
"editable-tag": a.editable && !a.disabled
|
|
136
|
-
}),
|
|
137
|
-
label: l(r),
|
|
138
|
-
"test-id": a.testId,
|
|
139
|
-
color: l(F),
|
|
140
|
-
size: a.size,
|
|
141
|
-
variant: l(p),
|
|
142
|
-
disabled: a.disabled,
|
|
143
|
-
style: T(l(G)),
|
|
144
|
-
onMouseover: t[5] || (t[5] = (c) => s.value = !0),
|
|
145
|
-
onMouseleave: t[6] || (t[6] = (c) => s.value = !1),
|
|
146
|
-
onClick: m(U, ["stop"])
|
|
147
|
-
}, {
|
|
101
|
+
return (n, t) => (v(), C(l(ee), {
|
|
102
|
+
placement: "top",
|
|
103
|
+
text: a.maxLengthTooltip,
|
|
104
|
+
"is-open": l(I),
|
|
105
|
+
disabled: !l(I),
|
|
106
|
+
distance: 10,
|
|
107
|
+
skidding: 10
|
|
108
|
+
}, {
|
|
109
|
+
content: f(() => [
|
|
110
|
+
E("div", ae, [
|
|
111
|
+
w(l(D), { variant: "body2" }, {
|
|
148
112
|
default: f(() => [
|
|
149
|
-
V(
|
|
150
|
-
a.iconName ? (v(), $(l(W), {
|
|
151
|
-
key: 0,
|
|
152
|
-
name: a.iconName,
|
|
153
|
-
size: "16px",
|
|
154
|
-
color: l(A),
|
|
155
|
-
class: "tag-icon",
|
|
156
|
-
type: a.iconType
|
|
157
|
-
}, null, 8, ["name", "color", "type"])) : O("", !0),
|
|
158
|
-
i.value ? H((v(), C("input", {
|
|
159
|
-
key: 2,
|
|
160
|
-
ref_key: "inputRef",
|
|
161
|
-
ref: B,
|
|
162
|
-
"onUpdate:modelValue": t[0] || (t[0] = (c) => Q(r) ? r.value = c : null),
|
|
163
|
-
placeholder: a.placeholder,
|
|
164
|
-
class: h(["tag-input", { "tag-input-outline": a.variant === "outlined" }]),
|
|
165
|
-
spellcheck: "false",
|
|
166
|
-
style: T({ width: g.value }),
|
|
167
|
-
maxlength: a.maxLength,
|
|
168
|
-
onBlur: Y,
|
|
169
|
-
onKeyup: [
|
|
170
|
-
K(m(w, ["prevent"]), ["enter"]),
|
|
171
|
-
K(m(w, ["prevent"]), ["esc"])
|
|
172
|
-
]
|
|
173
|
-
}, null, 46, te)), [
|
|
174
|
-
[
|
|
175
|
-
X,
|
|
176
|
-
l(r),
|
|
177
|
-
void 0,
|
|
178
|
-
{ trim: !0 }
|
|
179
|
-
]
|
|
180
|
-
]) : (v(), $(l(D), {
|
|
181
|
-
key: 1,
|
|
182
|
-
variant: "chipLabel",
|
|
183
|
-
class: h(["tag-label", {
|
|
184
|
-
"tag-label--placeholder": !l(r) && a.placeholder,
|
|
185
|
-
"tag-label--disabled": a.disabled
|
|
186
|
-
}])
|
|
187
|
-
}, {
|
|
188
|
-
default: f(() => [
|
|
189
|
-
R(z(l(r) || a.placeholder), 1)
|
|
190
|
-
]),
|
|
191
|
-
_: 1
|
|
192
|
-
}, 8, ["class"])),
|
|
193
|
-
i.value ? (v(), C("span", {
|
|
194
|
-
key: 3,
|
|
195
|
-
ref_key: "sizerRef",
|
|
196
|
-
ref: k,
|
|
197
|
-
class: "tag-input-sizer"
|
|
198
|
-
}, z(l(r) || a.placeholder || ""), 513)) : O("", !0)
|
|
199
|
-
]),
|
|
200
|
-
H(y(l(W), {
|
|
201
|
-
class: h(["clear-button", { "clear-button--invalid": a.isInvalid }]),
|
|
202
|
-
name: "x-circle",
|
|
203
|
-
size: "16px",
|
|
204
|
-
type: "fill",
|
|
205
|
-
color: l(q),
|
|
206
|
-
onMousedown: t[1] || (t[1] = m(() => {
|
|
207
|
-
}, ["prevent"])),
|
|
208
|
-
onMouseover: t[2] || (t[2] = (c) => x.value = !0),
|
|
209
|
-
onMouseleave: t[3] || (t[3] = (c) => x.value = !1),
|
|
210
|
-
onClick: t[4] || (t[4] = m((c) => b("remove"), ["stop"]))
|
|
211
|
-
}, null, 8, ["class", "color"]), [
|
|
212
|
-
[Z, a.editable && !l(I) && a.selectable]
|
|
213
|
-
])
|
|
113
|
+
V(T(a.maxLengthTooltip), 1)
|
|
214
114
|
]),
|
|
215
115
|
_: 1
|
|
216
|
-
}
|
|
217
|
-
])
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
116
|
+
})
|
|
117
|
+
])
|
|
118
|
+
]),
|
|
119
|
+
trigger: f(() => [
|
|
120
|
+
w(l(_), {
|
|
121
|
+
class: p({
|
|
122
|
+
"rounded-tag": a.rounded,
|
|
123
|
+
"tag-editing": r.value && l(g) !== "outlined",
|
|
124
|
+
// outlined chips have an outline
|
|
125
|
+
"tag-hover-outline": a.label && s.value && l(g) !== "outlined",
|
|
126
|
+
// outlined chips have an outline
|
|
127
|
+
"unselected-tag-hover-outline": a.label && s.value && l(g) !== "outlined" && !o.value && !a.editable,
|
|
128
|
+
// for unselected tags that are not editable, we want to show a hover outline
|
|
129
|
+
"tag-disabled": a.disabled,
|
|
130
|
+
"empty-tag": l(z),
|
|
131
|
+
"unselected-tag": !o.value && a.selectable && a.label,
|
|
132
|
+
"editable-tag": a.editable && !a.disabled
|
|
133
|
+
}),
|
|
134
|
+
label: l(i),
|
|
135
|
+
"test-id": a.testId,
|
|
136
|
+
color: l(F),
|
|
137
|
+
size: a.size,
|
|
138
|
+
variant: l(g),
|
|
139
|
+
disabled: a.disabled,
|
|
140
|
+
style: R(l(G)),
|
|
141
|
+
onMouseover: t[5] || (t[5] = (c) => s.value = !0),
|
|
142
|
+
onMouseleave: t[6] || (t[6] = (c) => s.value = !1),
|
|
143
|
+
onClick: m(U, ["stop"])
|
|
144
|
+
}, {
|
|
145
|
+
default: f(() => [
|
|
146
|
+
E("div", le, [
|
|
147
|
+
a.iconName ? (v(), C(l(W), {
|
|
148
|
+
key: 0,
|
|
149
|
+
name: a.iconName,
|
|
150
|
+
size: "16px",
|
|
151
|
+
color: l(A),
|
|
152
|
+
class: "tag-icon",
|
|
153
|
+
type: a.iconType
|
|
154
|
+
}, null, 8, ["name", "color", "type"])) : $("", !0),
|
|
155
|
+
r.value ? O((v(), H("input", {
|
|
156
|
+
key: 2,
|
|
157
|
+
ref_key: "inputRef",
|
|
158
|
+
ref: M,
|
|
159
|
+
"onUpdate:modelValue": t[0] || (t[0] = (c) => Q(i) ? i.value = c : null),
|
|
160
|
+
placeholder: a.placeholder,
|
|
161
|
+
class: p(["tag-input", { "tag-input-outline": a.variant === "outlined" }]),
|
|
162
|
+
spellcheck: "false",
|
|
163
|
+
style: R({ width: h.value }),
|
|
164
|
+
maxlength: a.maxLength,
|
|
165
|
+
onBlur: Y,
|
|
166
|
+
onKeyup: [
|
|
167
|
+
K(m(x, ["prevent"]), ["enter"]),
|
|
168
|
+
K(m(x, ["prevent"]), ["esc"])
|
|
169
|
+
]
|
|
170
|
+
}, null, 46, te)), [
|
|
171
|
+
[
|
|
172
|
+
X,
|
|
173
|
+
l(i),
|
|
174
|
+
void 0,
|
|
175
|
+
{ trim: !0 }
|
|
176
|
+
]
|
|
177
|
+
]) : (v(), C(l(D), {
|
|
178
|
+
key: 1,
|
|
179
|
+
variant: "chipLabel",
|
|
180
|
+
class: p(["tag-label", {
|
|
181
|
+
"tag-label--placeholder": !l(i) && a.placeholder,
|
|
182
|
+
"tag-label--disabled": a.disabled
|
|
183
|
+
}])
|
|
184
|
+
}, {
|
|
185
|
+
default: f(() => [
|
|
186
|
+
V(T(l(i) || a.placeholder), 1)
|
|
187
|
+
]),
|
|
188
|
+
_: 1
|
|
189
|
+
}, 8, ["class"])),
|
|
190
|
+
r.value ? (v(), H("span", {
|
|
191
|
+
key: 3,
|
|
192
|
+
ref_key: "sizerRef",
|
|
193
|
+
ref: y,
|
|
194
|
+
class: "tag-input-sizer"
|
|
195
|
+
}, T(l(i) || a.placeholder || ""), 513)) : $("", !0)
|
|
196
|
+
]),
|
|
197
|
+
O(w(l(W), {
|
|
198
|
+
class: p(["clear-button", { "clear-button--invalid": a.isInvalid }]),
|
|
199
|
+
name: "x-circle",
|
|
200
|
+
size: "16px",
|
|
201
|
+
type: "fill",
|
|
202
|
+
color: l(q),
|
|
203
|
+
onMousedown: t[1] || (t[1] = m(() => {
|
|
204
|
+
}, ["prevent"])),
|
|
205
|
+
onMouseover: t[2] || (t[2] = (c) => k.value = !0),
|
|
206
|
+
onMouseleave: t[3] || (t[3] = (c) => k.value = !1),
|
|
207
|
+
onClick: t[4] || (t[4] = m((c) => b("remove"), ["stop"]))
|
|
208
|
+
}, null, 8, ["class", "color"]), [
|
|
209
|
+
[Z, a.editable && !l(z) && a.selectable]
|
|
210
|
+
])
|
|
211
|
+
]),
|
|
212
|
+
_: 1
|
|
213
|
+
}, 8, ["class", "label", "test-id", "color", "size", "variant", "disabled", "style", "onClick"])
|
|
214
|
+
]),
|
|
215
|
+
_: 1
|
|
216
|
+
}, 8, ["text", "is-open", "disabled"]));
|
|
221
217
|
}
|
|
222
218
|
});
|
|
223
219
|
export {
|
package/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import './
|
|
1
|
+
import './MenuItem.vue_vue_type_style_index_0_scoped_67e53b85_lang.css';
|
|
2
2
|
import { AppTriggerTypes as eo } from "./components/appTrigger/index.js";
|
|
3
3
|
import { AutocompleteDropdownTypes as mo } from "./components/autocompleteDropdown/index.js";
|
|
4
4
|
import { MenuItemTypes as ao } from "./components/menuItem/index.js";
|
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";.font-tab-label2[data-v-4ee31123],.font-chart-2[data-v-4ee31123],.font-chart-1[data-v-4ee31123]{font-family:Inter,sans-serif;font-weight:700}.tag-input-sizer[data-v-4ee31123],.tag-input[data-v-4ee31123],.font-chip-label[data-v-4ee31123],.font-table-label[data-v-4ee31123],.font-button[data-v-4ee31123],.font-heading-6[data-v-4ee31123],.font-heading-5[data-v-4ee31123],.font-heading-4[data-v-4ee31123],.font-heading-3[data-v-4ee31123],.font-heading-2[data-v-4ee31123],.font-heading-1[data-v-4ee31123],.font-title[data-v-4ee31123]{font-family:Inter,sans-serif;font-weight:600}.font-tab-label1[data-v-4ee31123],.font-input-label[data-v-4ee31123],.font-overline[data-v-4ee31123],.font-subtitle-2[data-v-4ee31123],.font-subtitle-1[data-v-4ee31123]{font-family:Inter,sans-serif;font-weight:500}.font-caption[data-v-4ee31123],.font-body-2[data-v-4ee31123],.font-body-1[data-v-4ee31123]{font-family:Inter,sans-serif;font-weight:400}.font-title[data-v-4ee31123]{font-size:2.5rem;line-height:3rem;letter-spacing:-.055rem}.font-heading-1[data-v-4ee31123]{font-size:1.5rem;line-height:1.75rem;letter-spacing:-.0285rem}.font-heading-2[data-v-4ee31123]{font-size:1.125rem;line-height:1.75rem;letter-spacing:-.01575rem}.font-heading-3[data-v-4ee31123]{font-size:1rem;line-height:1.5rem;letter-spacing:-.011rem}.font-heading-4[data-v-4ee31123]{font-size:.875rem;line-height:1rem;letter-spacing:unset}.font-heading-5[data-v-4ee31123]{font-size:.8125rem;line-height:16px;letter-spacing:unset}.font-heading-6[data-v-4ee31123]{font-size:.75rem;line-height:.75rem;letter-spacing:0}.font-body-1[data-v-4ee31123]{font-size:.875rem;line-height:1.25rem;letter-spacing:-.00525rem}.font-body-2[data-v-4ee31123]{font-size:.8125rem;line-height:1.25rem;letter-spacing:-.00244rem}.font-subtitle-1[data-v-4ee31123]{font-size:.875rem;line-height:1.25rem;letter-spacing:-.00525rem}.font-subtitle-2[data-v-4ee31123]{font-size:.8125rem;line-height:1.25rem;letter-spacing:-.00244rem}.font-chart-1[data-v-4ee31123]{font-size:1.5rem;line-height:1.5rem;letter-spacing:-.015rem}.font-chart-2[data-v-4ee31123]{font-size:1.25rem;line-height:1.25rem;letter-spacing:-.0125rem}.font-button[data-v-4ee31123]{font-size:.875rem;line-height:1.25rem;letter-spacing:.00875rem}.font-overline[data-v-4ee31123]{font-size:.75rem;line-height:1rem;letter-spacing:.045rem;text-transform:uppercase}.font-caption[data-v-4ee31123]{font-size:.75rem;line-height:1rem}.font-table-label[data-v-4ee31123]{font-size:.8125rem;line-height:1.25rem;letter-spacing:.00813rem}.font-input-label[data-v-4ee31123]{font-size:.8125rem;line-height:1rem;letter-spacing:.00813rem}.font-tab-label1[data-v-4ee31123],.font-tab-label2[data-v-4ee31123]{font-size:.875rem;line-height:1rem}.tag-input-sizer[data-v-4ee31123],.tag-input[data-v-4ee31123],.font-chip-label[data-v-4ee31123]{font-size:.75rem;line-height:1rem}h1[data-v-4ee31123],h2[data-v-4ee31123],h3[data-v-4ee31123],h4[data-v-4ee31123],h5[data-v-4ee31123],h6[data-v-4ee31123]{margin:0}.tag-container[data-v-4ee31123]{position:relative;width:200px}.rounded-tag[data-v-4ee31123]{border-radius:100px}.tag-editing[data-v-4ee31123]{outline:1px solid var(--outline-color)}.unselected-tag-hover-outline[data-v-4ee31123]{background-color:var(--action-hover)}.tag-hover-outline[data-v-4ee31123]{outline:1px solid var(--outline-color);cursor:pointer}.unselected-tag[data-v-4ee31123]{outline:1px solid var(--action-outlined-border)}.tag-disabled[data-v-4ee31123]{background-color:transparent;outline:1px solid var(--action-disabled)}.tag-content[data-v-4ee31123]{display:flex;align-items:center;position:relative;min-width:.625rem;max-width:31.25rem}.tag-icon[data-v-4ee31123]{margin-right:.25rem}.tag-label[data-v-4ee31123]{user-select:none;min-width:.5rem}.tag-label--disabled[data-v-4ee31123]{color:var(--action-disabled)}.tag-label--hidden[data-v-4ee31123]{visibility:hidden}.tag-input[data-v-4ee31123]{position:static;width:auto;background:transparent;min-width:.6rem;padding:0;border:none;max-width:100%;overflow-x:auto;white-space:nowrap}.tag-input[data-v-4ee31123]:focus{outline:none}.tag-input-outline[data-v-4ee31123]::placeholder{color:var(--action-disabled)}.clear-button[data-v-4ee31123]{margin-left:.25rem;color:var(--action-active);cursor:pointer}.clear-button[data-v-4ee31123]:hover{color:var(--text-primary)}.clear-button--invalid[data-v-4ee31123]{color:var(--error-dark)}.clear-button--invalid[data-v-4ee31123]:hover{color:var(--error-darker)}.tag-input-sizer[data-v-4ee31123]{position:absolute;visibility:hidden;height:0;white-space:pre;pointer-events:none;padding:0}.editable-tag[data-v-4ee31123]{cursor:text}.empty-tag[data-v-4ee31123]{background-color:transparent;outline:1px dashed var(--action-outlined-border);color:var(--text-secondary)}.empty-tag[data-v-4ee31123]:hover:not(.tag-disabled){outline:1px dashed var(--action-active)}.tag-max-length-tooltip[data-v-4ee31123]{display:flex;width:250px;padding:.25rem}
|