@ironsource/shared-ui 2.1.6-rc.1 → 2.1.6-test.1

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 (5) hide show
  1. package/TextField.vue_vue_type_style_index_0_scoped_01778240_lang.css +1 -0
  2. package/components/input/v4/TextField.vue.js +3 -3
  3. package/components/input/v4/TextField.vue2.js +32 -29
  4. package/package.json +2 -1
  5. package/TextField.vue_vue_type_style_index_0_scoped_b5b2e8fd_lang.css +0 -1
package/TextField.vue_vue_type_style_index_0_scoped_01778240_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-01778240],.font-chart-2[data-v-01778240],.font-chart-1[data-v-01778240]{font-family:Inter,sans-serif;font-weight:700}.font-chip-label[data-v-01778240],.font-table-label[data-v-01778240],.font-button[data-v-01778240],.font-heading-6[data-v-01778240],.font-heading-5[data-v-01778240],.font-heading-4[data-v-01778240],.font-heading-3[data-v-01778240],.font-heading-2[data-v-01778240],.font-heading-1[data-v-01778240],.font-title[data-v-01778240]{font-family:Inter,sans-serif;font-weight:600}.font-tab-label1[data-v-01778240],.font-input-label[data-v-01778240],.font-overline[data-v-01778240],.font-subtitle-2[data-v-01778240],.font-subtitle-1[data-v-01778240]{font-family:Inter,sans-serif;font-weight:500}.font-caption[data-v-01778240],.font-body-2[data-v-01778240],.input-container .input[data-v-01778240],.font-body-1[data-v-01778240]{font-family:Inter,sans-serif;font-weight:400}.font-title[data-v-01778240]{font-size:2.5rem;line-height:3rem;letter-spacing:-.055rem}.font-heading-1[data-v-01778240]{font-size:1.5rem;line-height:1.75rem;letter-spacing:-.0285rem}.font-heading-2[data-v-01778240]{font-size:1.125rem;line-height:1.75rem;letter-spacing:-.01575rem}.font-heading-3[data-v-01778240]{font-size:1rem;line-height:1.5rem;letter-spacing:-.011rem}.font-heading-4[data-v-01778240]{font-size:.875rem;line-height:1rem;letter-spacing:unset}.font-heading-5[data-v-01778240]{font-size:.8125rem;line-height:16px;letter-spacing:unset}.font-heading-6[data-v-01778240]{font-size:.75rem;line-height:.75rem;letter-spacing:0}.input-container .input[data-v-01778240],.font-body-1[data-v-01778240]{font-size:.875rem;line-height:1.25rem;letter-spacing:-.00525rem}.font-body-2[data-v-01778240]{font-size:.8125rem;line-height:1.25rem;letter-spacing:-.00244rem}.font-subtitle-1[data-v-01778240]{font-size:.875rem;line-height:1.25rem;letter-spacing:-.00525rem}.font-subtitle-2[data-v-01778240]{font-size:.8125rem;line-height:1.25rem;letter-spacing:-.00244rem}.font-chart-1[data-v-01778240]{font-size:1.5rem;line-height:1.5rem;letter-spacing:-.015rem}.font-chart-2[data-v-01778240]{font-size:1.25rem;line-height:1.25rem;letter-spacing:-.0125rem}.font-button[data-v-01778240]{font-size:.875rem;line-height:1.25rem;letter-spacing:.00875rem}.font-overline[data-v-01778240]{font-size:.75rem;line-height:1rem;letter-spacing:.045rem;text-transform:uppercase}.font-caption[data-v-01778240]{font-size:.75rem;line-height:1rem}.font-table-label[data-v-01778240]{font-size:.8125rem;line-height:1.25rem;letter-spacing:.00813rem}.font-input-label[data-v-01778240]{font-size:.8125rem;line-height:1rem;letter-spacing:.00813rem}.font-tab-label1[data-v-01778240],.font-tab-label2[data-v-01778240]{font-size:.875rem;line-height:1rem}.font-chip-label[data-v-01778240]{font-size:.75rem;line-height:1rem}h1[data-v-01778240],h2[data-v-01778240],h3[data-v-01778240],h4[data-v-01778240],h5[data-v-01778240],h6[data-v-01778240]{margin:0}.disabled .input[data-v-01778240]::placeholder{color:var(--text-disabled)}.disabled .input-container[data-v-01778240]{cursor:no-drop;background-color:var(--action-disabled-background)}.disabled .input-container[data-v-01778240]:hover{outline:1px solid var(--action-outlined-border);background-color:var(--action-disabled-background)}.input-size-small[data-v-01778240]{height:28px}.input-size-medium[data-v-01778240]{height:32px}.input-size-large[data-v-01778240]{height:40px}.input-with-label-container[data-v-01778240]{display:flex;flex-direction:column;position:relative}.input-container[data-v-01778240]{flex-grow:2;display:flex;flex-direction:row;align-items:center;border-radius:var(--border-radius-md);background:var(--default-main);outline:1px solid var(--action-outlined-border);outline-offset:-1px;padding:0 var(--spacing-100);position:relative}.input-container[data-v-01778240]:hover{outline:1px solid var(--action-active);background-color:var(--action-hover)}.input-container .input[data-v-01778240]{padding:0;width:100%;border:none;background:transparent;color:var(--text-primary);line-height:normal}.input-container .input[data-v-01778240]:focus{outline:none}.input-container .input[data-v-01778240]:disabled{color:var(--text-disabled);cursor:no-drop}.input-container .input.view-only[data-v-01778240]{color:var(--text-disabled)}.input-container .input[type=number][data-v-01778240]::-webkit-inner-spin-button{opacity:.7;transform:scale(1.1)}.input-container .hide-arrows.input[type=number][data-v-01778240]::-webkit-inner-spin-button,.input-container .hide-arrows.input[type=number][data-v-01778240]::-webkit-outer-spin-button{margin:0;-webkit-appearance:none;appearance:none}.input-container .input[type=password][data-v-01778240]{letter-spacing:4px}.input-container[data-v-01778240] ::placeholder{color:var(--text-secondary);letter-spacing:normal}.input-container .label-inside[data-v-01778240]::placeholder{color:var(--text-primary)}.input-container .icon-container[data-v-01778240]{display:flex;align-items:center;color:var(--text-secondary)}.input-container .icon-before[data-v-01778240]{padding-right:var(--spacing-100)}.input-container .icon-after[data-v-01778240]{padding-left:var(--spacing-100)}.prefix-text[data-v-01778240]{color:var(--text-secondary, #646464);margin-right:var(--spacing-100)}.suffix-text[data-v-01778240]{color:var(--text-secondary, #646464);margin-left:var(--spacing-100)}.focused[data-v-01778240],.focused[data-v-01778240]:hover{outline:2px solid var(--primary-main);background-color:var(--action-hover)}.error-icon.error-icon[data-v-01778240],.error-icon.error-icon[data-v-01778240]:hover{color:var(--error-main)}.confirm-icon.confirm-icon[data-v-01778240]{padding-left:.25rem}.confirm-icon.confirm-icon[data-v-01778240]:hover{color:var(--primary-main)}.label-direction-left[data-v-01778240]{flex-direction:row;align-items:center;justify-content:space-between}.apply-button[data-v-01778240]{cursor:pointer;color:var(--primary-main);width:var(--spacing-250);height:var(--spacing-250)}.inline-error[data-v-01778240]{cursor:pointer;color:var(--error-main);display:flex;justify-content:center;align-items:center}.footer[data-v-01778240]{display:flex;justify-content:flex-end;margin:var(--spacing-50) 0}.footer.footer-absolute[data-v-01778240]{position:absolute;bottom:calc(0px - var(--spacing-300))}.password-visibility-toggle[data-v-01778240]{cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-secondary)}.variant-success .input-container[data-v-01778240],.variant-success .input-container[data-v-01778240]:hover{outline:2px solid var(--success-dark)}.variant-error .input-container[data-v-01778240],.variant-error .input-container[data-v-01778240]:hover{outline:2px solid var(--error-main)}.variant-warning .input-container[data-v-01778240],.variant-warning .input-container[data-v-01778240]:hover{outline:2px solid var(--warning-dark)}.field-max-length[data-v-01778240]{position:absolute;bottom:calc(0px - var(--spacing-250));right:0}
package/components/input/v4/TextField.vue.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import e from "./TextField.vue2.js";
2
2
  /* empty css */import o from "../../../_virtual/_plugin-vue_export-helper.js";
3
- // import "../../../TextField.vue_vue_type_style_index_0_scoped_b5b2e8fd_lang.css"; //*');
4
- const d = /* @__PURE__ */ o(e, [["__scopeId", "data-v-b5b2e8fd"]]);
3
+ // import "../../../TextField.vue_vue_type_style_index_0_scoped_01778240_lang.css"; //*');
4
+ const p = /* @__PURE__ */ o(e, [["__scopeId", "data-v-01778240"]]);
5
5
  export {
6
- d as default
6
+ p as default
7
7
  };
package/components/input/v4/TextField.vue2.js CHANGED
@@ -1,4 +1,4 @@
1
- import "../../../TextField.vue_vue_type_style_index_0_scoped_b5b2e8fd_lang.css"; import { defineComponent as M, computed as b, ref as G, openBlock as l, createElementBlock as r, mergeProps as y, unref as t, createBlock as d, createCommentVNode as n, createElementVNode as L, normalizeClass as V, renderSlot as C, withCtx as h, createTextVNode as E, toDisplayString as F, withKeys as W, withModifiers as P, createVNode as p } from "vue";
1
+ import "../../../TextField.vue_vue_type_style_index_0_scoped_01778240_lang.css"; import { defineComponent as M, computed as b, ref as G, openBlock as l, createElementBlock as r, mergeProps as y, unref as t, createBlock as d, createCommentVNode as n, createElementVNode as h, normalizeClass as V, renderSlot as C, withCtx as p, createTextVNode as E, toDisplayString as F, withKeys as W, withModifiers as P, createVNode as k } from "vue";
2
2
  import v from "../../icon/v4/IconV4.vue.js";
3
3
  import j from "../../tooltip/v4/TooltipV4.vue.js";
4
4
  import $ from "../../typography/v4/Typography.vue.js";
@@ -33,7 +33,7 @@ const Y = {
33
33
  mandatory: { type: Boolean, default: !1 },
34
34
  feedbackVariant: { default: null },
35
35
  feedbackText: { default: "" },
36
- feedbackPositionAbsolute: { type: Boolean, default: !1 },
36
+ feedbackPositionAbsolute: { type: Boolean, default: !0 },
37
37
  showFeedbackTextIcon: { type: Boolean, default: !1 },
38
38
  autoFocus: { type: Boolean, default: !1 },
39
39
  type: { default: "text" },
@@ -51,21 +51,21 @@ const Y = {
51
51
  inlineErrorText: { default: "" }
52
52
  },
53
53
  emits: ["update:modelValue", "apply"],
54
- setup(e, { expose: z, emit: k }) {
54
+ setup(e, { expose: z, emit: w }) {
55
55
  const s = e, c = X(s.testId, f), O = () => {
56
- s.showApply ? k("apply") : o?.confirmable && N();
57
- }, D = () => T.value.focus(), {
56
+ s.showApply ? w("apply") : o?.confirmable && N();
57
+ }, D = () => g.value.focus(), {
58
58
  onConfirm: N,
59
- onEnter: w,
60
- inputRef: T,
59
+ onEnter: T,
60
+ inputRef: g,
61
61
  isFocused: x,
62
- showLabelInside: g,
62
+ showLabelInside: I,
63
63
  api: o,
64
64
  labelText: S,
65
65
  sizeClass: H,
66
- handleInput: I,
67
- handleKeypress: B
68
- } = q(s, k), A = b(() => o.value?.value ?? s.modelValue), R = b(() => (A.value || "").length), m = G(!1), K = b(() => m.value && s.type === "password" ? "text" : s.type);
66
+ handleInput: B,
67
+ handleKeypress: A
68
+ } = q(s, w), L = b(() => o.value?.value ?? s.modelValue), R = b(() => (L.value || "").length), m = G(!1), K = b(() => m.value && s.type === "password" ? "text" : s.type);
69
69
  return z({
70
70
  manualFocus: D
71
71
  }), (u, a) => (l(), r("div", y({
@@ -84,10 +84,10 @@ const Y = {
84
84
  disabled: e.disabled,
85
85
  "test-id": e.testId
86
86
  }, null, 8, ["label", "mandatory", "hover-help-text", "hover-help-text-placement", "disabled", "test-id"])) : n("", !0),
87
- L("div", {
87
+ h("div", {
88
88
  class: V({
89
89
  "input-container": !0,
90
- "label-inside": t(g),
90
+ "label-inside": t(I),
91
91
  focused: t(x)
92
92
  })
93
93
  }, [
@@ -99,57 +99,57 @@ const Y = {
99
99
  class: "prefix-text",
100
100
  variant: "body1"
101
101
  }, {
102
- default: h(() => [
102
+ default: p(() => [
103
103
  E(F(e.prefix), 1)
104
104
  ]),
105
105
  _: 1
106
106
  })) : n("", !0),
107
- L("input", y({ ...u.$attrs, ...t(c)[t(f).FIELD] }, {
107
+ h("input", y({ ...u.$attrs, ...t(c)[t(f).FIELD] }, {
108
108
  ref_key: "inputRef",
109
- ref: T,
110
- value: t(A),
109
+ ref: g,
110
+ value: t(L),
111
111
  placeholder: t(S),
112
112
  disabled: e.disabled || e.viewOnly,
113
113
  type: t(K),
114
114
  class: ["input", {
115
115
  [t(H)]: !0,
116
116
  "view-only": e.viewOnly,
117
- "label-inside": t(g),
117
+ "label-inside": t(I),
118
118
  "hide-arrows": e.hideNumberArrows,
119
119
  "input-type": e.type
120
120
  }],
121
121
  step: e.step,
122
122
  maxlength: e.maxLength,
123
123
  onInput: a[0] || (a[0] = //@ts-ignore
124
- (...i) => t(I) && t(I)(...i)),
124
+ (...i) => t(B) && t(B)(...i)),
125
125
  onFocus: a[1] || (a[1] = (i) => x.value = !0),
126
126
  onBlur: a[2] || (a[2] = (i) => x.value = !1),
127
127
  onKeyup: a[3] || (a[3] = W(P(
128
128
  //@ts-ignore
129
- (...i) => t(w) && t(w)(...i),
129
+ (...i) => t(T) && t(T)(...i),
130
130
  ["prevent"]
131
131
  ), ["enter"])),
132
132
  onKeypress: a[4] || (a[4] = //@ts-ignore
133
- (...i) => t(B) && t(B)(...i))
133
+ (...i) => t(A) && t(A)(...i))
134
134
  }), null, 16, Z),
135
135
  e.showApply || t(o)?.confirmable && !t(o)?.error?.value ? (l(), r("div", {
136
136
  key: 2,
137
137
  class: "apply-button",
138
138
  onClick: P(O, ["stop", "prevent"])
139
139
  }, [
140
- p(t(v), {
140
+ k(t(v), {
141
141
  name: "check",
142
142
  size: "20px"
143
143
  })
144
144
  ], 8, _)) : n("", !0),
145
145
  e.inlineError || t(o)?.error?.value ? (l(), r("div", ee, [
146
- p(t(j), y({
146
+ k(t(j), y({
147
147
  disabled: !e.inlineErrorText && !t(o)?.error?.value,
148
148
  text: e.inlineErrorText || t(o)?.error?.value,
149
149
  "test-id": e.testId
150
150
  }, t(c)[t(f).TOOLTIP]), {
151
- default: h(() => [
152
- p(t(v), {
151
+ default: p(() => [
152
+ k(t(v), {
153
153
  name: "warning-circle",
154
154
  size: "16px"
155
155
  })
@@ -162,7 +162,7 @@ const Y = {
162
162
  class: "suffix-text",
163
163
  variant: "body1"
164
164
  }, {
165
- default: h(() => [
165
+ default: p(() => [
166
166
  E(F(e.suffix), 1)
167
167
  ]),
168
168
  _: 1
@@ -197,13 +197,16 @@ const Y = {
197
197
  variant: e.feedbackVariant,
198
198
  "show-icon": e.showFeedbackTextIcon,
199
199
  "test-id": e.testId
200
- }, null, 8, ["text", "variant", "show-icon", "test-id"])) : n("", !0),
200
+ }, null, 8, ["text", "variant", "show-icon", "test-id"])) : n("", !0)
201
+ ], 2)) : n("", !0),
202
+ h("div", null, [
201
203
  e.maxLength ? (l(), d(U, {
202
- key: 1,
204
+ key: 0,
205
+ class: "field-max-length",
203
206
  "current-length": t(R),
204
207
  "max-length": e.maxLength
205
208
  }, null, 8, ["current-length", "max-length"])) : n("", !0)
206
- ], 2)) : n("", !0)
209
+ ])
207
210
  ], 16));
208
211
  }
209
212
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ironsource/shared-ui",
3
- "version": "2.1.6-rc.1",
3
+ "version": "2.1.6-test.1",
4
4
  "engines": {
5
5
  "npm": ">=7.0.0",
6
6
  "node": ">=16.0.0"
@@ -49,6 +49,7 @@
49
49
  "test-storybook-pw": "concurrently 'npm run storybook:dist:pw --silent' 'npx wait-on http://localhost:6006 && npm run pw:ci' --kill-others --success first"
50
50
  },
51
51
  "dependencies": {
52
+ "@ironsource/shared-ui": "^2.1.6-rc.1",
52
53
  "@phosphor-icons/vue": "^2.1.6",
53
54
  "@storybook/cli": "^7.5.3",
54
55
  "@storybook/vue3-vite": "^7.5.3",
package/TextField.vue_vue_type_style_index_0_scoped_b5b2e8fd_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-b5b2e8fd],.font-chart-2[data-v-b5b2e8fd],.font-chart-1[data-v-b5b2e8fd]{font-family:Inter,sans-serif;font-weight:700}.font-chip-label[data-v-b5b2e8fd],.font-table-label[data-v-b5b2e8fd],.font-button[data-v-b5b2e8fd],.font-heading-6[data-v-b5b2e8fd],.font-heading-5[data-v-b5b2e8fd],.font-heading-4[data-v-b5b2e8fd],.font-heading-3[data-v-b5b2e8fd],.font-heading-2[data-v-b5b2e8fd],.font-heading-1[data-v-b5b2e8fd],.font-title[data-v-b5b2e8fd]{font-family:Inter,sans-serif;font-weight:600}.font-tab-label1[data-v-b5b2e8fd],.font-input-label[data-v-b5b2e8fd],.font-overline[data-v-b5b2e8fd],.font-subtitle-2[data-v-b5b2e8fd],.font-subtitle-1[data-v-b5b2e8fd]{font-family:Inter,sans-serif;font-weight:500}.font-caption[data-v-b5b2e8fd],.font-body-2[data-v-b5b2e8fd],.input-container .input[data-v-b5b2e8fd],.font-body-1[data-v-b5b2e8fd]{font-family:Inter,sans-serif;font-weight:400}.font-title[data-v-b5b2e8fd]{font-size:2.5rem;line-height:3rem;letter-spacing:-.055rem}.font-heading-1[data-v-b5b2e8fd]{font-size:1.5rem;line-height:1.75rem;letter-spacing:-.0285rem}.font-heading-2[data-v-b5b2e8fd]{font-size:1.125rem;line-height:1.75rem;letter-spacing:-.01575rem}.font-heading-3[data-v-b5b2e8fd]{font-size:1rem;line-height:1.5rem;letter-spacing:-.011rem}.font-heading-4[data-v-b5b2e8fd]{font-size:.875rem;line-height:1rem;letter-spacing:unset}.font-heading-5[data-v-b5b2e8fd]{font-size:.8125rem;line-height:16px;letter-spacing:unset}.font-heading-6[data-v-b5b2e8fd]{font-size:.75rem;line-height:.75rem;letter-spacing:0}.input-container .input[data-v-b5b2e8fd],.font-body-1[data-v-b5b2e8fd]{font-size:.875rem;line-height:1.25rem;letter-spacing:-.00525rem}.font-body-2[data-v-b5b2e8fd]{font-size:.8125rem;line-height:1.25rem;letter-spacing:-.00244rem}.font-subtitle-1[data-v-b5b2e8fd]{font-size:.875rem;line-height:1.25rem;letter-spacing:-.00525rem}.font-subtitle-2[data-v-b5b2e8fd]{font-size:.8125rem;line-height:1.25rem;letter-spacing:-.00244rem}.font-chart-1[data-v-b5b2e8fd]{font-size:1.5rem;line-height:1.5rem;letter-spacing:-.015rem}.font-chart-2[data-v-b5b2e8fd]{font-size:1.25rem;line-height:1.25rem;letter-spacing:-.0125rem}.font-button[data-v-b5b2e8fd]{font-size:.875rem;line-height:1.25rem;letter-spacing:.00875rem}.font-overline[data-v-b5b2e8fd]{font-size:.75rem;line-height:1rem;letter-spacing:.045rem;text-transform:uppercase}.font-caption[data-v-b5b2e8fd]{font-size:.75rem;line-height:1rem}.font-table-label[data-v-b5b2e8fd]{font-size:.8125rem;line-height:1.25rem;letter-spacing:.00813rem}.font-input-label[data-v-b5b2e8fd]{font-size:.8125rem;line-height:1rem;letter-spacing:.00813rem}.font-tab-label1[data-v-b5b2e8fd],.font-tab-label2[data-v-b5b2e8fd]{font-size:.875rem;line-height:1rem}.font-chip-label[data-v-b5b2e8fd]{font-size:.75rem;line-height:1rem}h1[data-v-b5b2e8fd],h2[data-v-b5b2e8fd],h3[data-v-b5b2e8fd],h4[data-v-b5b2e8fd],h5[data-v-b5b2e8fd],h6[data-v-b5b2e8fd]{margin:0}.disabled .input[data-v-b5b2e8fd]::placeholder{color:var(--text-disabled)}.disabled .input-container[data-v-b5b2e8fd]{cursor:no-drop;background-color:var(--action-disabled-background)}.disabled .input-container[data-v-b5b2e8fd]:hover{outline:1px solid var(--action-outlined-border);background-color:var(--action-disabled-background)}.input-size-small[data-v-b5b2e8fd]{height:28px}.input-size-medium[data-v-b5b2e8fd]{height:32px}.input-size-large[data-v-b5b2e8fd]{height:40px}.input-with-label-container[data-v-b5b2e8fd]{display:flex;flex-direction:column}.input-container[data-v-b5b2e8fd]{flex-grow:2;display:flex;flex-direction:row;align-items:center;border-radius:var(--border-radius-md);background:var(--default-main);outline:1px solid var(--action-outlined-border);outline-offset:-1px;padding:0 var(--spacing-100);position:relative}.input-container[data-v-b5b2e8fd]:hover{outline:1px solid var(--action-active);background-color:var(--action-hover)}.input-container .input[data-v-b5b2e8fd]{padding:0;width:100%;border:none;background:transparent;color:var(--text-primary);line-height:normal}.input-container .input[data-v-b5b2e8fd]:focus{outline:none}.input-container .input[data-v-b5b2e8fd]:disabled{color:var(--text-disabled);cursor:no-drop}.input-container .input.view-only[data-v-b5b2e8fd]{color:var(--text-disabled)}.input-container .input[type=number][data-v-b5b2e8fd]::-webkit-inner-spin-button{opacity:.7;transform:scale(1.1)}.input-container .hide-arrows.input[type=number][data-v-b5b2e8fd]::-webkit-inner-spin-button,.input-container .hide-arrows.input[type=number][data-v-b5b2e8fd]::-webkit-outer-spin-button{margin:0;-webkit-appearance:none;appearance:none}.input-container .input[type=password][data-v-b5b2e8fd]{letter-spacing:4px}.input-container[data-v-b5b2e8fd] ::placeholder{color:var(--text-secondary);letter-spacing:normal}.input-container .label-inside[data-v-b5b2e8fd]::placeholder{color:var(--text-primary)}.input-container .icon-container[data-v-b5b2e8fd]{display:flex;align-items:center;color:var(--text-secondary)}.input-container .icon-before[data-v-b5b2e8fd]{padding-right:var(--spacing-100)}.input-container .icon-after[data-v-b5b2e8fd]{padding-left:var(--spacing-100)}.prefix-text[data-v-b5b2e8fd]{color:var(--text-secondary, #646464);margin-right:var(--spacing-100)}.suffix-text[data-v-b5b2e8fd]{color:var(--text-secondary, #646464);margin-left:var(--spacing-100)}.focused[data-v-b5b2e8fd],.focused[data-v-b5b2e8fd]:hover{outline:2px solid var(--primary-main);background-color:var(--action-hover)}.error-icon.error-icon[data-v-b5b2e8fd],.error-icon.error-icon[data-v-b5b2e8fd]:hover{color:var(--error-main)}.confirm-icon.confirm-icon[data-v-b5b2e8fd]{padding-left:.25rem}.confirm-icon.confirm-icon[data-v-b5b2e8fd]:hover{color:var(--primary-main)}.label-direction-left[data-v-b5b2e8fd]{flex-direction:row;align-items:center;justify-content:space-between}.apply-button[data-v-b5b2e8fd]{cursor:pointer;color:var(--primary-main);width:var(--spacing-250);height:var(--spacing-250)}.inline-error[data-v-b5b2e8fd]{cursor:pointer;color:var(--error-main);display:flex;justify-content:center;align-items:center}.footer[data-v-b5b2e8fd]{display:flex;justify-content:flex-end;align-items:center;margin:var(--spacing-50) 0}.footer.footer-absolute[data-v-b5b2e8fd]{position:absolute;bottom:calc(0px - var(--spacing-300))}.password-visibility-toggle[data-v-b5b2e8fd]{cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-secondary)}.variant-success .input-container[data-v-b5b2e8fd],.variant-success .input-container[data-v-b5b2e8fd]:hover{outline:2px solid var(--success-dark)}.variant-error .input-container[data-v-b5b2e8fd],.variant-error .input-container[data-v-b5b2e8fd]:hover{outline:2px solid var(--error-main)}.variant-warning .input-container[data-v-b5b2e8fd],.variant-warning .input-container[data-v-b5b2e8fd]:hover{outline:2px solid var(--warning-dark)}