@ironsource/shared-ui 2.2.0-test.10 → 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.
Files changed (6) hide show
  1. package/Tag.vue_vue_type_style_index_0_scoped_4fd00d7c_lang.css +1 -0
  2. package/components/tag/Tag.vue.js +4 -4
  3. package/components/tag/Tag.vue2.js +129 -133
  4. package/index.js +1 -1
  5. package/package.json +1 -1
  6. package/Tag.vue_vue_type_style_index_0_scoped_211651e9_lang.css +0 -1
package/Tag.vue_vue_type_style_index_0_scoped_4fd00d7c_lang.css ADDED
@@ -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}
package/components/tag/Tag.vue.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import o from "./Tag.vue2.js";
2
- /* empty css */import e from "../../_virtual/_plugin-vue_export-helper.js";
3
- // import "../../Tag.vue_vue_type_style_index_0_scoped_211651e9_lang.css"; //*');
4
- const p = /* @__PURE__ */ e(o, [["__scopeId", "data-v-211651e9"]]);
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
- p as default
6
+ c as default
7
7
  };
package/components/tag/Tag.vue2.js CHANGED
@@ -1,4 +1,4 @@
1
- import "../../Tag.vue_vue_type_style_index_0_scoped_211651e9_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";
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, r = 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 && !r.value && e.placeholder), M = d(() => (console.log(
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
31
  e.maxLength && i.value.length >= e.maxLength && r.value
32
- ), e.maxLength && i.value.length >= e.maxLength && r.value)), p = 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({
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
- }), B = u(null), P = () => B.value?.focus(), U = async () => {
38
- e.disabled || !e.selectable || (e.editable ? (r.value = !0, await E(), P()) : o.value = !o.value);
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"), w();
41
- }, w = () => {
40
+ b("stopEditing"), x();
41
+ }, x = () => {
42
42
  r.value = !1, !i.value && !e.placeholder && b("remove");
43
43
  };
44
- S(
44
+ N(
45
45
  () => [i.value, e.placeholder, r.value],
46
46
  async () => {
47
- await E(), r.value && k.value ? g.value = k.value.offsetWidth + "px" : g.value = void 0;
47
+ await S(), r.value && y.value ? h.value = y.value.offsetWidth + "px" : h.value = void 0;
48
48
  },
49
49
  { immediate: !0 }
50
- ), S(
50
+ ), N(
51
51
  () => e.editable,
52
52
  () => {
53
53
  e.editable && (o.value = !0);
54
54
  }
55
55
  );
56
- const L = {
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
- }, N = {
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 x.value ? j[n] : N[n];
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 ? N[n] : "var(--action-active)";
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 = r.value ? L[e.color] : "var(--primary-main-50-p)";
92
+ const n = r.value ? B[e.color] : "var(--primary-main-50-p)";
93
93
  return {
94
- "--outline-color": e.isInvalid ? L.error : n
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("div", {
102
- style: T(r.value ? { width: g.value } : void 0)
103
- }, [
104
- y(l(ee), {
105
- placement: "top",
106
- text: a.maxLengthTooltip,
107
- "is-open": l(M),
108
- disabled: !l(M),
109
- distance: 10,
110
- skidding: 10
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": r.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
136
- }),
137
- label: l(i),
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("div", le, [
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
- r.value ? H((v(), C("input", {
159
- key: 2,
160
- ref_key: "inputRef",
161
- ref: B,
162
- "onUpdate:modelValue": t[0] || (t[0] = (c) => Q(i) ? i.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(i),
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(i) && a.placeholder,
185
- "tag-label--disabled": a.disabled
186
- }])
187
- }, {
188
- default: f(() => [
189
- R(z(l(i) || a.placeholder), 1)
190
- ]),
191
- _: 1
192
- }, 8, ["class"])),
193
- r.value ? (v(), C("span", {
194
- key: 3,
195
- ref_key: "sizerRef",
196
- ref: k,
197
- class: "tag-input-sizer"
198
- }, z(l(i) || 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
- }, 8, ["class", "label", "test-id", "color", "size", "variant", "disabled", "style", "onClick"])
217
- ]),
218
- _: 1
219
- }, 8, ["text", "is-open", "disabled"])
220
- ], 4));
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 './AutocompleteDropdown.vue_vue_type_style_index_0_scoped_214ddaf4_lang.css';
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,6 +1,6 @@
1
1
  {
2
2
  "name": "@ironsource/shared-ui",
3
- "version": "2.2.0-test.10",
3
+ "version": "2.2.0-test.12",
4
4
  "engines": {
5
5
  "npm": ">=7.0.0",
6
6
  "node": ">=16.0.0"
package/Tag.vue_vue_type_style_index_0_scoped_211651e9_lang.css DELETED
@@ -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}