@ironsource/shared-ui 2.2.0-test.10 → 2.2.0-test.11
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-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}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
/* empty css */import
|
|
3
|
-
// import "../../Tag.
|
|
4
|
-
const p = /* @__PURE__ */ e
|
|
1
|
+
import e from "./Tag.vue2.js";
|
|
2
|
+
/* empty css */import o from "../../_virtual/_plugin-vue_export-helper.js";
|
|
3
|
+
// import "../../Tag.vue_vue_type_style_index_0_scoped_4ee31123_lang.css"; //*');
|
|
4
|
+
const p = /* @__PURE__ */ o(e, [["__scopeId", "data-v-4ee31123"]]);
|
|
5
5
|
export {
|
|
6
6
|
p as default
|
|
7
7
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import "../../Tag.
|
|
1
|
+
import "../../Tag.vue_vue_type_style_index_0_scoped_4ee31123_lang.css"; import { defineComponent as J, ref as u, computed as d, watch as S, nextTick as E, openBlock as v, createElementBlock as C, normalizeStyle as T, createVNode as y, unref as l, withCtx as f, createElementVNode as V, createTextVNode as R, toDisplayString as z, normalizeClass as h, withModifiers as m, createBlock as $, createCommentVNode as O, withDirectives 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,25 +26,25 @@ 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, i = u(!1), k = u(null), g = u(void 0), x = u(!1), s = u(!1), o = u(e.isSelected || e.editable), I = d(() => !e.label && !i.value && e.placeholder), M = d(() => (console.log(
|
|
30
30
|
"isTooltipOpen",
|
|
31
|
-
e.maxLength &&
|
|
32
|
-
), e.maxLength &&
|
|
31
|
+
e.maxLength && r.value.length >= e.maxLength && i.value
|
|
32
|
+
), e.maxLength && r.value.length >= e.maxLength && i.value)), p = d(() => e.disabled || !e.selectable || i.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"), r = d({
|
|
33
33
|
get: () => e.label,
|
|
34
34
|
set: (n) => {
|
|
35
35
|
b("update:label", n);
|
|
36
36
|
}
|
|
37
37
|
}), B = u(null), P = () => B.value?.focus(), U = async () => {
|
|
38
|
-
e.disabled || !e.selectable || (e.editable ? (
|
|
38
|
+
e.disabled || !e.selectable || (e.editable ? (i.value = !0, await E(), P()) : o.value = !o.value);
|
|
39
39
|
}, Y = () => {
|
|
40
40
|
b("stopEditing"), w();
|
|
41
41
|
}, w = () => {
|
|
42
|
-
|
|
42
|
+
i.value = !1, !r.value && !e.placeholder && b("remove");
|
|
43
43
|
};
|
|
44
44
|
S(
|
|
45
|
-
() => [
|
|
45
|
+
() => [r.value, e.placeholder, i.value],
|
|
46
46
|
async () => {
|
|
47
|
-
await E(),
|
|
47
|
+
await E(), i.value && k.value ? g.value = k.value.offsetWidth + "px" : g.value = void 0;
|
|
48
48
|
},
|
|
49
49
|
{ immediate: !0 }
|
|
50
50
|
), S(
|
|
@@ -89,7 +89,7 @@ const ae = { class: "tag-max-length-tooltip" }, le = { class: "tag-content" }, t
|
|
|
89
89
|
return o.value || !e.selectable ? N[n] : "var(--action-active)";
|
|
90
90
|
}), G = d(() => {
|
|
91
91
|
if (e.editable && e.variant !== "outlined" || !e.selectable) {
|
|
92
|
-
const n =
|
|
92
|
+
const n = i.value ? L[e.color] : "var(--primary-main-50-p)";
|
|
93
93
|
return {
|
|
94
94
|
"--outline-color": e.isInvalid ? L.error : n
|
|
95
95
|
};
|
|
@@ -99,7 +99,7 @@ const ae = { class: "tag-max-length-tooltip" }, le = { class: "tag-content" }, t
|
|
|
99
99
|
} : {};
|
|
100
100
|
});
|
|
101
101
|
return (n, t) => (v(), C("div", {
|
|
102
|
-
style: T(
|
|
102
|
+
style: T(i.value ? { width: g.value } : void 0)
|
|
103
103
|
}, [
|
|
104
104
|
y(l(ee), {
|
|
105
105
|
placement: "top",
|
|
@@ -123,7 +123,7 @@ const ae = { class: "tag-max-length-tooltip" }, le = { class: "tag-content" }, t
|
|
|
123
123
|
y(l(_), {
|
|
124
124
|
class: h({
|
|
125
125
|
"rounded-tag": a.rounded,
|
|
126
|
-
"tag-editing":
|
|
126
|
+
"tag-editing": i.value && l(p) !== "outlined",
|
|
127
127
|
// outlined chips have an outline
|
|
128
128
|
"tag-hover-outline": a.label && s.value && l(p) !== "outlined",
|
|
129
129
|
// outlined chips have an outline
|
|
@@ -132,9 +132,9 @@ const ae = { class: "tag-max-length-tooltip" }, le = { class: "tag-content" }, t
|
|
|
132
132
|
"tag-disabled": a.disabled,
|
|
133
133
|
"empty-tag": l(I),
|
|
134
134
|
"unselected-tag": !o.value && a.selectable && a.label,
|
|
135
|
-
"editable-tag": a.editable
|
|
135
|
+
"editable-tag": a.editable && !a.disabled
|
|
136
136
|
}),
|
|
137
|
-
label: l(
|
|
137
|
+
label: l(r),
|
|
138
138
|
"test-id": a.testId,
|
|
139
139
|
color: l(F),
|
|
140
140
|
size: a.size,
|
|
@@ -155,11 +155,11 @@ const ae = { class: "tag-max-length-tooltip" }, le = { class: "tag-content" }, t
|
|
|
155
155
|
class: "tag-icon",
|
|
156
156
|
type: a.iconType
|
|
157
157
|
}, null, 8, ["name", "color", "type"])) : O("", !0),
|
|
158
|
-
|
|
158
|
+
i.value ? H((v(), C("input", {
|
|
159
159
|
key: 2,
|
|
160
160
|
ref_key: "inputRef",
|
|
161
161
|
ref: B,
|
|
162
|
-
"onUpdate:modelValue": t[0] || (t[0] = (c) => Q(
|
|
162
|
+
"onUpdate:modelValue": t[0] || (t[0] = (c) => Q(r) ? r.value = c : null),
|
|
163
163
|
placeholder: a.placeholder,
|
|
164
164
|
class: h(["tag-input", { "tag-input-outline": a.variant === "outlined" }]),
|
|
165
165
|
spellcheck: "false",
|
|
@@ -173,7 +173,7 @@ const ae = { class: "tag-max-length-tooltip" }, le = { class: "tag-content" }, t
|
|
|
173
173
|
}, null, 46, te)), [
|
|
174
174
|
[
|
|
175
175
|
X,
|
|
176
|
-
l(
|
|
176
|
+
l(r),
|
|
177
177
|
void 0,
|
|
178
178
|
{ trim: !0 }
|
|
179
179
|
]
|
|
@@ -181,21 +181,21 @@ const ae = { class: "tag-max-length-tooltip" }, le = { class: "tag-content" }, t
|
|
|
181
181
|
key: 1,
|
|
182
182
|
variant: "chipLabel",
|
|
183
183
|
class: h(["tag-label", {
|
|
184
|
-
"tag-label--placeholder": !l(
|
|
184
|
+
"tag-label--placeholder": !l(r) && a.placeholder,
|
|
185
185
|
"tag-label--disabled": a.disabled
|
|
186
186
|
}])
|
|
187
187
|
}, {
|
|
188
188
|
default: f(() => [
|
|
189
|
-
R(z(l(
|
|
189
|
+
R(z(l(r) || a.placeholder), 1)
|
|
190
190
|
]),
|
|
191
191
|
_: 1
|
|
192
192
|
}, 8, ["class"])),
|
|
193
|
-
|
|
193
|
+
i.value ? (v(), C("span", {
|
|
194
194
|
key: 3,
|
|
195
195
|
ref_key: "sizerRef",
|
|
196
196
|
ref: k,
|
|
197
197
|
class: "tag-input-sizer"
|
|
198
|
-
}, z(l(
|
|
198
|
+
}, z(l(r) || a.placeholder || ""), 513)) : O("", !0)
|
|
199
199
|
]),
|
|
200
200
|
H(y(l(W), {
|
|
201
201
|
class: h(["clear-button", { "clear-button--invalid": a.isInvalid }]),
|
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-211651e9],.font-chart-2[data-v-211651e9],.font-chart-1[data-v-211651e9]{font-family:Inter,sans-serif;font-weight:700}.tag-input-sizer[data-v-211651e9],.tag-input[data-v-211651e9],.font-chip-label[data-v-211651e9],.font-table-label[data-v-211651e9],.font-button[data-v-211651e9],.font-heading-6[data-v-211651e9],.font-heading-5[data-v-211651e9],.font-heading-4[data-v-211651e9],.font-heading-3[data-v-211651e9],.font-heading-2[data-v-211651e9],.font-heading-1[data-v-211651e9],.font-title[data-v-211651e9]{font-family:Inter,sans-serif;font-weight:600}.font-tab-label1[data-v-211651e9],.font-input-label[data-v-211651e9],.font-overline[data-v-211651e9],.font-subtitle-2[data-v-211651e9],.font-subtitle-1[data-v-211651e9]{font-family:Inter,sans-serif;font-weight:500}.font-caption[data-v-211651e9],.font-body-2[data-v-211651e9],.font-body-1[data-v-211651e9]{font-family:Inter,sans-serif;font-weight:400}.font-title[data-v-211651e9]{font-size:2.5rem;line-height:3rem;letter-spacing:-.055rem}.font-heading-1[data-v-211651e9]{font-size:1.5rem;line-height:1.75rem;letter-spacing:-.0285rem}.font-heading-2[data-v-211651e9]{font-size:1.125rem;line-height:1.75rem;letter-spacing:-.01575rem}.font-heading-3[data-v-211651e9]{font-size:1rem;line-height:1.5rem;letter-spacing:-.011rem}.font-heading-4[data-v-211651e9]{font-size:.875rem;line-height:1rem;letter-spacing:unset}.font-heading-5[data-v-211651e9]{font-size:.8125rem;line-height:16px;letter-spacing:unset}.font-heading-6[data-v-211651e9]{font-size:.75rem;line-height:.75rem;letter-spacing:0}.font-body-1[data-v-211651e9]{font-size:.875rem;line-height:1.25rem;letter-spacing:-.00525rem}.font-body-2[data-v-211651e9]{font-size:.8125rem;line-height:1.25rem;letter-spacing:-.00244rem}.font-subtitle-1[data-v-211651e9]{font-size:.875rem;line-height:1.25rem;letter-spacing:-.00525rem}.font-subtitle-2[data-v-211651e9]{font-size:.8125rem;line-height:1.25rem;letter-spacing:-.00244rem}.font-chart-1[data-v-211651e9]{font-size:1.5rem;line-height:1.5rem;letter-spacing:-.015rem}.font-chart-2[data-v-211651e9]{font-size:1.25rem;line-height:1.25rem;letter-spacing:-.0125rem}.font-button[data-v-211651e9]{font-size:.875rem;line-height:1.25rem;letter-spacing:.00875rem}.font-overline[data-v-211651e9]{font-size:.75rem;line-height:1rem;letter-spacing:.045rem;text-transform:uppercase}.font-caption[data-v-211651e9]{font-size:.75rem;line-height:1rem}.font-table-label[data-v-211651e9]{font-size:.8125rem;line-height:1.25rem;letter-spacing:.00813rem}.font-input-label[data-v-211651e9]{font-size:.8125rem;line-height:1rem;letter-spacing:.00813rem}.font-tab-label1[data-v-211651e9],.font-tab-label2[data-v-211651e9]{font-size:.875rem;line-height:1rem}.tag-input-sizer[data-v-211651e9],.tag-input[data-v-211651e9],.font-chip-label[data-v-211651e9]{font-size:.75rem;line-height:1rem}h1[data-v-211651e9],h2[data-v-211651e9],h3[data-v-211651e9],h4[data-v-211651e9],h5[data-v-211651e9],h6[data-v-211651e9]{margin:0}.tag-container[data-v-211651e9]{position:relative;width:200px}.rounded-tag[data-v-211651e9]{border-radius:100px}.tag-editing[data-v-211651e9]{outline:1px solid var(--outline-color)}.unselected-tag-hover-outline[data-v-211651e9]{background-color:var(--action-hover)}.tag-hover-outline[data-v-211651e9]{outline:1px solid var(--outline-color);cursor:pointer}.unselected-tag[data-v-211651e9]{outline:1px solid var(--action-outlined-border)}.tag-disabled[data-v-211651e9]{background-color:transparent;outline:1px solid var(--action-disabled)}.tag-content[data-v-211651e9]{display:flex;align-items:center;position:relative;min-width:.625rem;max-width:31.25rem}.tag-icon[data-v-211651e9]{margin-right:.25rem}.tag-label[data-v-211651e9]{user-select:none;min-width:.5rem}.tag-label--disabled[data-v-211651e9]{color:var(--action-disabled)}.tag-label--hidden[data-v-211651e9]{visibility:hidden}.tag-input[data-v-211651e9]{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-211651e9]:focus{outline:none}.tag-input-outline[data-v-211651e9]::placeholder{color:var(--action-disabled)}.clear-button[data-v-211651e9]{margin-left:.25rem;color:var(--action-active);cursor:pointer}.clear-button[data-v-211651e9]:hover{color:var(--text-primary)}.clear-button--invalid[data-v-211651e9]{color:var(--error-dark)}.clear-button--invalid[data-v-211651e9]:hover{color:var(--error-darker)}.tag-input-sizer[data-v-211651e9]{position:absolute;visibility:hidden;height:0;white-space:pre;pointer-events:none;padding:0}.editable-tag[data-v-211651e9]{cursor:text}.empty-tag[data-v-211651e9]{background-color:transparent;outline:1px dashed var(--action-outlined-border);color:var(--text-secondary)}.empty-tag[data-v-211651e9]:hover{outline:1px dashed var(--action-active)}.tag-max-length-tooltip[data-v-211651e9]{display:flex;width:250px;padding:.25rem}
|