@onereach/ui-components 26.6.4 → 26.6.5-beta.5950.0
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.
- package/dist/esm/{OrAutocomplete-DHadCcDG.mjs → OrAutocomplete-DwXEt9aq.mjs} +2 -2
- package/dist/esm/{OrAutocomplete-DHadCcDG.mjs.map → OrAutocomplete-DwXEt9aq.mjs.map} +1 -1
- package/dist/esm/{OrCardCollection-Dy4e0uU0.mjs → OrCardCollection-CQlpVaj3.mjs} +2 -2
- package/dist/esm/{OrCardCollection-Dy4e0uU0.mjs.map → OrCardCollection-CQlpVaj3.mjs.map} +1 -1
- package/dist/esm/{OrConfirm-bJHqUudY.mjs → OrConfirm-CeXBV1NK.mjs} +2 -2
- package/dist/esm/{OrConfirm-bJHqUudY.mjs.map → OrConfirm-CeXBV1NK.mjs.map} +1 -1
- package/dist/esm/{OrDataGrid-TQ-iAsg2.mjs → OrDataGrid-BsjzHZ6q.mjs} +4 -4
- package/dist/esm/{OrDataGrid-TQ-iAsg2.mjs.map → OrDataGrid-BsjzHZ6q.mjs.map} +1 -1
- package/dist/esm/OrInput-CxGhwo0q.mjs +350 -0
- package/dist/esm/OrInput-CxGhwo0q.mjs.map +1 -0
- package/dist/esm/{OrRichTextEditor-CzVp-mm9.mjs → OrRichTextEditor-zb1kQ0es.mjs} +2 -2
- package/dist/esm/{OrRichTextEditor-CzVp-mm9.mjs.map → OrRichTextEditor-zb1kQ0es.mjs.map} +1 -1
- package/dist/esm/{OrSearch-B92dyPu6.mjs → OrSearch-B_YGTJN8.mjs} +2 -2
- package/dist/esm/{OrSearch-B92dyPu6.mjs.map → OrSearch-B_YGTJN8.mjs.map} +1 -1
- package/dist/esm/{OrSelect-DC2IC8A9.mjs → OrSelect-BXBDdzDF.mjs} +2 -2
- package/dist/esm/{OrSelect-DC2IC8A9.mjs.map → OrSelect-BXBDdzDF.mjs.map} +1 -1
- package/dist/esm/components/index.mjs +8 -8
- package/dist/esm/components/or-autocomplete-v3/index.mjs +1 -1
- package/dist/esm/components/or-card-collection-v3/index.mjs +1 -1
- package/dist/esm/components/or-confirm-v3/index.mjs +1 -1
- package/dist/esm/components/or-data-grid-v3/index.mjs +1 -1
- package/dist/esm/components/or-input-v3/index.mjs +1 -1
- package/dist/esm/components/or-rich-text-editor-v3/index.mjs +1 -1
- package/dist/esm/components/or-search-v3/index.mjs +1 -1
- package/dist/esm/components/or-select-v3/index.mjs +1 -1
- package/dist/esm/index.mjs +8 -8
- package/package.json +4 -5
- package/dist/esm/OrInput-DGZPyIWa.mjs +0 -326
- package/dist/esm/OrInput-DGZPyIWa.mjs.map +0 -1
|
@@ -1,326 +0,0 @@
|
|
|
1
|
-
(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode("input[data-v-29afd138]{min-width:0;background:none;outline:none}input[type=search][data-v-29afd138]::-webkit-search-cancel-button{display:none}")),document.head.appendChild(e)}}catch(n){console.error("vite-plugin-css-injected-by-js",n)}})();
|
|
2
|
-
import { useIdAttribute as H, useControlAttributes as P, useValidationAttributes as T, useProxyModelValue as F, useResponsive as K } from "@onereach/ui-components-common/hooks";
|
|
3
|
-
import { O as R } from "./OrError-B5ihH6-3.mjs";
|
|
4
|
-
import { O as U } from "./OrHint-NvbZyURY.mjs";
|
|
5
|
-
import { O as j } from "./OrIconButton-Ds8k8FmS.mjs";
|
|
6
|
-
import { O as G } from "./OrIcon-k8cyvh-D.mjs";
|
|
7
|
-
import { O as J } from "./OrInputBox-6ciokFdU.mjs";
|
|
8
|
-
import { a as Q } from "./OrInputBox.vue_vue_type_script_lang-q2L7rmth.mjs";
|
|
9
|
-
import { O as W } from "./OrLabel-K7_HgvcK.mjs";
|
|
10
|
-
import { O as X } from "./OrLoader-2SaTMxmZ.mjs";
|
|
11
|
-
import { defineComponent as Y, reactive as Z, ref as $, computed as y, toRef as M, resolveComponent as a, openBlock as t, createElementBlock as S, normalizeClass as x, createBlock as s, withCtx as n, renderSlot as i, createTextVNode as p, toDisplayString as d, createCommentVNode as b, createElementVNode as I, createVNode as L, createSlots as w, withDirectives as B, mergeProps as _, vModelDynamic as ee, Fragment as z, withModifiers as q, vShow as E } from "vue";
|
|
12
|
-
import { _ as oe } from "./_plugin-vue_export-helper-CHgC5LLL.mjs";
|
|
13
|
-
const re = [
|
|
14
|
-
// Layout
|
|
15
|
-
"layout-column",
|
|
16
|
-
// Spacing
|
|
17
|
-
"gap-xs"
|
|
18
|
-
], te = [
|
|
19
|
-
// Box
|
|
20
|
-
"flex-auto",
|
|
21
|
-
// Typography
|
|
22
|
-
"typography-inherit",
|
|
23
|
-
// Theme (placeholder)
|
|
24
|
-
"placeholder:theme-foreground-outline",
|
|
25
|
-
"dark:placeholder:theme-foreground-outline-dark",
|
|
26
|
-
// Autofill hack,
|
|
27
|
-
// override Chrome autofill transition so theme switching doesn't "stick" to previous text color
|
|
28
|
-
// (Chrome's autofill styles may include long transitions; avoid transitioning `color`)
|
|
29
|
-
"autofill:[transition-property:background-color] autofill:duration-[5000s]",
|
|
30
|
-
// force correct text/caret color in Chrome autofill
|
|
31
|
-
"autofill:[-webkit-text-fill-color:currentColor!important]",
|
|
32
|
-
"autofill:[caret-color:currentColor!important]",
|
|
33
|
-
// override background color using box-shadow
|
|
34
|
-
"autofill:shadow-[10px_0_1000px_theme(backgroundColor.primary-opacity-0-08)_inset]",
|
|
35
|
-
"dark:autofill:shadow-[0_0_0px_1000px_theme(backgroundColor.primary-opacity-0-08-dark)_inset]"
|
|
36
|
-
];
|
|
37
|
-
var N = /* @__PURE__ */ ((e) => (e.Text = "text", e.Number = "number", e.Password = "password", e.Search = "search", e))(N || {}), D = /* @__PURE__ */ ((e) => (e.None = "none", e.Text = "text", e.Tel = "tel", e.Url = "url", e.Email = "email", e.Numeric = "numeric", e.Decimal = "decimal", e.Search = "search", e))(D || {});
|
|
38
|
-
const ne = Y({
|
|
39
|
-
name: "OrInput",
|
|
40
|
-
components: {
|
|
41
|
-
OrError: R,
|
|
42
|
-
OrHint: U,
|
|
43
|
-
OrIcon: G,
|
|
44
|
-
OrIconButton: j,
|
|
45
|
-
OrInputBox: J,
|
|
46
|
-
OrLabel: W,
|
|
47
|
-
OrLoader: X
|
|
48
|
-
},
|
|
49
|
-
model: {
|
|
50
|
-
prop: "modelValue",
|
|
51
|
-
event: "update:modelValue"
|
|
52
|
-
},
|
|
53
|
-
props: {
|
|
54
|
-
modelValue: {
|
|
55
|
-
type: void 0,
|
|
56
|
-
default: void 0
|
|
57
|
-
},
|
|
58
|
-
name: {
|
|
59
|
-
type: String,
|
|
60
|
-
default: void 0
|
|
61
|
-
},
|
|
62
|
-
type: {
|
|
63
|
-
type: String,
|
|
64
|
-
default: () => N.Text
|
|
65
|
-
},
|
|
66
|
-
autocomplete: {
|
|
67
|
-
type: String,
|
|
68
|
-
default: "off"
|
|
69
|
-
},
|
|
70
|
-
inputmode: {
|
|
71
|
-
type: String,
|
|
72
|
-
default: D.Text
|
|
73
|
-
},
|
|
74
|
-
variant: {
|
|
75
|
-
type: String,
|
|
76
|
-
default: void 0
|
|
77
|
-
},
|
|
78
|
-
size: {
|
|
79
|
-
type: String,
|
|
80
|
-
default: void 0
|
|
81
|
-
},
|
|
82
|
-
label: {
|
|
83
|
-
type: String,
|
|
84
|
-
default: void 0
|
|
85
|
-
},
|
|
86
|
-
placeholder: {
|
|
87
|
-
type: String,
|
|
88
|
-
default: void 0
|
|
89
|
-
},
|
|
90
|
-
hint: {
|
|
91
|
-
type: String,
|
|
92
|
-
default: void 0
|
|
93
|
-
},
|
|
94
|
-
error: {
|
|
95
|
-
type: [String, Boolean],
|
|
96
|
-
default: void 0
|
|
97
|
-
},
|
|
98
|
-
loading: {
|
|
99
|
-
type: Boolean,
|
|
100
|
-
default: !1
|
|
101
|
-
},
|
|
102
|
-
required: {
|
|
103
|
-
type: Boolean,
|
|
104
|
-
default: !1
|
|
105
|
-
},
|
|
106
|
-
readonly: {
|
|
107
|
-
type: Boolean,
|
|
108
|
-
default: !1
|
|
109
|
-
},
|
|
110
|
-
disabled: {
|
|
111
|
-
type: Boolean,
|
|
112
|
-
default: !1
|
|
113
|
-
}
|
|
114
|
-
},
|
|
115
|
-
emits: [
|
|
116
|
-
"update:modelValue",
|
|
117
|
-
"input",
|
|
118
|
-
"keydown",
|
|
119
|
-
"keyup",
|
|
120
|
-
"focus",
|
|
121
|
-
"blur"
|
|
122
|
-
],
|
|
123
|
-
expose: [
|
|
124
|
-
"root",
|
|
125
|
-
"clear",
|
|
126
|
-
"focus",
|
|
127
|
-
"blur"
|
|
128
|
-
],
|
|
129
|
-
setup(e, o) {
|
|
130
|
-
const v = Z({
|
|
131
|
-
id: H(),
|
|
132
|
-
...P(),
|
|
133
|
-
...T()
|
|
134
|
-
}), V = $(), C = y(() => [
|
|
135
|
-
"or-input-v3",
|
|
136
|
-
...re,
|
|
137
|
-
...e.variant === Q.Embedded ? ["grow"] : []
|
|
138
|
-
]), m = $(), g = y(() => [
|
|
139
|
-
...te
|
|
140
|
-
]), u = F(M(e, "modelValue"), o.emit), f = $(!1), h = y(() => {
|
|
141
|
-
var l;
|
|
142
|
-
return ((l = u.value) == null ? void 0 : l.toString().length) ?? 0;
|
|
143
|
-
}), O = y(() => v.maxlength);
|
|
144
|
-
function k() {
|
|
145
|
-
u.value = void 0;
|
|
146
|
-
}
|
|
147
|
-
function c() {
|
|
148
|
-
var l;
|
|
149
|
-
(l = m.value) == null || l.focus();
|
|
150
|
-
}
|
|
151
|
-
function r() {
|
|
152
|
-
var l;
|
|
153
|
-
(l = m.value) == null || l.blur();
|
|
154
|
-
}
|
|
155
|
-
const { isMobile: A } = K();
|
|
156
|
-
return {
|
|
157
|
-
attributes: v,
|
|
158
|
-
root: V,
|
|
159
|
-
rootStyles: C,
|
|
160
|
-
control: m,
|
|
161
|
-
controlStyles: g,
|
|
162
|
-
model: u,
|
|
163
|
-
disclosed: f,
|
|
164
|
-
length: h,
|
|
165
|
-
maxLength: O,
|
|
166
|
-
clear: k,
|
|
167
|
-
focus: c,
|
|
168
|
-
blur: r,
|
|
169
|
-
isMobile: A
|
|
170
|
-
};
|
|
171
|
-
}
|
|
172
|
-
}), le = { class: "layout-row gap-md md:gap-md" }, ae = ["name", "type", "inputmode", "autocomplete", "placeholder", "required", "readonly", "disabled"];
|
|
173
|
-
function ie(e, o, v, V, C, m) {
|
|
174
|
-
const g = a("OrLabel"), u = a("OrLoader"), f = a("OrIconButton"), h = a("OrIcon"), O = a("OrInputBox"), k = a("OrHint"), c = a("OrError");
|
|
175
|
-
return t(), S("div", {
|
|
176
|
-
ref: "root",
|
|
177
|
-
class: x(e.rootStyles)
|
|
178
|
-
}, [
|
|
179
|
-
e.$slots.label || e.$slots.addon || e.label ? (t(), s(g, {
|
|
180
|
-
key: 0,
|
|
181
|
-
"control-id": e.attributes.id,
|
|
182
|
-
variant: "input",
|
|
183
|
-
required: e.required,
|
|
184
|
-
disabled: e.disabled
|
|
185
|
-
}, {
|
|
186
|
-
addon: n(() => [
|
|
187
|
-
i(e.$slots, "addon", {}, void 0, !0)
|
|
188
|
-
]),
|
|
189
|
-
default: n(() => [
|
|
190
|
-
i(e.$slots, "label", {}, () => [
|
|
191
|
-
p(d(e.label), 1)
|
|
192
|
-
], !0)
|
|
193
|
-
]),
|
|
194
|
-
_: 3
|
|
195
|
-
}, 8, ["control-id", "required", "disabled"])) : b("", !0),
|
|
196
|
-
I("div", le, [
|
|
197
|
-
i(e.$slots, "prepend", {}, void 0, !0),
|
|
198
|
-
L(O, {
|
|
199
|
-
variant: e.variant,
|
|
200
|
-
size: e.size,
|
|
201
|
-
invalid: !!e.error,
|
|
202
|
-
readonly: e.readonly || e.loading,
|
|
203
|
-
disabled: e.disabled
|
|
204
|
-
}, w({
|
|
205
|
-
default: n(() => [
|
|
206
|
-
B(I("input", _({ ref: "control" }, e.attributes, {
|
|
207
|
-
"onUpdate:modelValue": o[0] || (o[0] = (r) => e.model = r),
|
|
208
|
-
class: e.controlStyles,
|
|
209
|
-
name: e.name,
|
|
210
|
-
type: e.type === "password" && e.disclosed ? "text" : e.type,
|
|
211
|
-
inputmode: e.inputmode,
|
|
212
|
-
autocomplete: e.autocomplete,
|
|
213
|
-
placeholder: e.placeholder,
|
|
214
|
-
required: e.required,
|
|
215
|
-
readonly: e.readonly || e.loading,
|
|
216
|
-
disabled: e.disabled,
|
|
217
|
-
onInput: o[1] || (o[1] = (r) => e.$emit("input", r)),
|
|
218
|
-
onKeydown: o[2] || (o[2] = (r) => e.$emit("keydown", r)),
|
|
219
|
-
onKeyup: o[3] || (o[3] = (r) => e.$emit("keyup", r)),
|
|
220
|
-
onFocus: o[4] || (o[4] = (r) => e.$emit("focus", r)),
|
|
221
|
-
onBlur: o[5] || (o[5] = (r) => e.$emit("blur", r))
|
|
222
|
-
}), null, 16, ae), [
|
|
223
|
-
[
|
|
224
|
-
ee,
|
|
225
|
-
e.model,
|
|
226
|
-
void 0,
|
|
227
|
-
{ trim: !0 }
|
|
228
|
-
]
|
|
229
|
-
])
|
|
230
|
-
]),
|
|
231
|
-
_: 2
|
|
232
|
-
}, [
|
|
233
|
-
e.$slots.prependInner ? {
|
|
234
|
-
name: "prepend",
|
|
235
|
-
fn: n(() => [
|
|
236
|
-
i(e.$slots, "prependInner", {}, void 0, !0)
|
|
237
|
-
]),
|
|
238
|
-
key: "0"
|
|
239
|
-
} : void 0,
|
|
240
|
-
e.loading || e.type === "password" || e.type === "search" || e.$slots.appendInner ? {
|
|
241
|
-
name: "addon",
|
|
242
|
-
fn: n(() => [
|
|
243
|
-
i(e.$slots, "appendInner", {}, () => [
|
|
244
|
-
e.loading ? (t(), s(u, {
|
|
245
|
-
key: 0,
|
|
246
|
-
variant: "circular",
|
|
247
|
-
color: e.error ? "danger" : "primary",
|
|
248
|
-
size: e.isMobile ? "m" : "s"
|
|
249
|
-
}, null, 8, ["color", "size"])) : (t(), S(z, { key: 1 }, [
|
|
250
|
-
e.type === "password" ? (t(), s(f, {
|
|
251
|
-
key: 0,
|
|
252
|
-
icon: { icon: e.disclosed ? "visibility" : "visibility_off", variant: "filled" },
|
|
253
|
-
size: "l",
|
|
254
|
-
color: "inherit",
|
|
255
|
-
disabled: e.disabled,
|
|
256
|
-
onClick: o[6] || (o[6] = q((r) => e.disclosed = !e.disclosed, ["stop"]))
|
|
257
|
-
}, null, 8, ["icon", "disabled"])) : b("", !0),
|
|
258
|
-
e.type === "search" ? (t(), S(z, { key: 1 }, [
|
|
259
|
-
e.modelValue && !e.readonly ? (t(), s(f, {
|
|
260
|
-
key: 0,
|
|
261
|
-
icon: "close",
|
|
262
|
-
color: "inherit",
|
|
263
|
-
size: "l",
|
|
264
|
-
disabled: e.disabled,
|
|
265
|
-
onClick: o[7] || (o[7] = q((r) => e.clear(), ["stop"]))
|
|
266
|
-
}, null, 8, ["disabled"])) : (t(), s(h, {
|
|
267
|
-
key: 1,
|
|
268
|
-
icon: "search",
|
|
269
|
-
size: "l",
|
|
270
|
-
variant: "outlined"
|
|
271
|
-
}))
|
|
272
|
-
], 64)) : b("", !0)
|
|
273
|
-
], 64))
|
|
274
|
-
], !0)
|
|
275
|
-
]),
|
|
276
|
-
key: "1"
|
|
277
|
-
} : void 0
|
|
278
|
-
]), 1032, ["variant", "size", "invalid", "readonly", "disabled"]),
|
|
279
|
-
i(e.$slots, "append", {}, void 0, !0)
|
|
280
|
-
]),
|
|
281
|
-
e.$slots.hint || e.hint || e.maxLength ? B((t(), s(k, {
|
|
282
|
-
key: 1,
|
|
283
|
-
disabled: e.disabled
|
|
284
|
-
}, w({
|
|
285
|
-
default: n(() => [
|
|
286
|
-
i(e.$slots, "hint", {}, () => [
|
|
287
|
-
p(d(e.hint), 1)
|
|
288
|
-
], !0)
|
|
289
|
-
]),
|
|
290
|
-
_: 2
|
|
291
|
-
}, [
|
|
292
|
-
e.maxLength ? {
|
|
293
|
-
name: "addon",
|
|
294
|
-
fn: n(() => [
|
|
295
|
-
p(d(e.length) + " / " + d(e.maxLength), 1)
|
|
296
|
-
]),
|
|
297
|
-
key: "0"
|
|
298
|
-
} : void 0
|
|
299
|
-
]), 1032, ["disabled"])), [
|
|
300
|
-
[E, !e.error]
|
|
301
|
-
]) : b("", !0),
|
|
302
|
-
B(L(c, { disabled: e.disabled }, w({
|
|
303
|
-
default: n(() => [
|
|
304
|
-
p(d(e.error) + " ", 1)
|
|
305
|
-
]),
|
|
306
|
-
_: 2
|
|
307
|
-
}, [
|
|
308
|
-
e.maxLength ? {
|
|
309
|
-
name: "addon",
|
|
310
|
-
fn: n(() => [
|
|
311
|
-
p(d(e.length) + " / " + d(e.maxLength), 1)
|
|
312
|
-
]),
|
|
313
|
-
key: "0"
|
|
314
|
-
} : void 0
|
|
315
|
-
]), 1032, ["disabled"]), [
|
|
316
|
-
[E, typeof e.error == "string" && e.error.length > 0]
|
|
317
|
-
])
|
|
318
|
-
], 2);
|
|
319
|
-
}
|
|
320
|
-
const Oe = /* @__PURE__ */ oe(ne, [["render", ie], ["__scopeId", "data-v-29afd138"]]);
|
|
321
|
-
export {
|
|
322
|
-
N as I,
|
|
323
|
-
Oe as O,
|
|
324
|
-
D as a
|
|
325
|
-
};
|
|
326
|
-
//# sourceMappingURL=OrInput-DGZPyIWa.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"OrInput-DGZPyIWa.mjs","sources":["../../../components/or-input-v3/src/styles.ts","../../../components/or-input-v3/src/types.ts","../../../components/or-input-v3/src/OrInput.vue"],"sourcesContent":["export const Input: string[] = [\n // Layout\n 'layout-column',\n\n // Spacing\n 'gap-xs',\n];\n\nexport const InputControl: string[] = [\n // Box\n 'flex-auto',\n\n // Typography\n 'typography-inherit',\n\n // Theme (placeholder)\n 'placeholder:theme-foreground-outline',\n 'dark:placeholder:theme-foreground-outline-dark',\n\n // Autofill hack,\n // override Chrome autofill transition so theme switching doesn't \"stick\" to previous text color\n // (Chrome's autofill styles may include long transitions; avoid transitioning `color`)\n 'autofill:[transition-property:background-color] autofill:duration-[5000s]',\n // force correct text/caret color in Chrome autofill\n 'autofill:[-webkit-text-fill-color:currentColor!important]',\n 'autofill:[caret-color:currentColor!important]',\n // override background color using box-shadow\n 'autofill:shadow-[10px_0_1000px_theme(backgroundColor.primary-opacity-0-08)_inset]',\n 'dark:autofill:shadow-[0_0_0px_1000px_theme(backgroundColor.primary-opacity-0-08-dark)_inset]',\n];\n","import { ModelValue } from '@onereach/ui-components-common/types';\n\nexport type InputModelValue = ModelValue<string | number>;\n\nexport enum InputType {\n Text = 'text',\n Number = 'number',\n Password = 'password',\n Search = 'search',\n}\n\nexport enum InputMode {\n None = 'none',\n Text = 'text',\n Tel = 'tel',\n Url = 'url',\n Email = 'email',\n Numeric = 'numeric',\n Decimal = 'decimal',\n Search = 'search',\n}\n","<template>\n <div\n :ref=\"'root'\"\n :class=\"rootStyles\"\n >\n <template v-if=\"$slots.label || $slots.addon || label\">\n <OrLabel\n :control-id=\"attributes.id\"\n :variant=\"'input'\"\n :required=\"required\"\n :disabled=\"disabled\"\n >\n <slot name=\"label\">\n {{ label }}\n </slot>\n\n <template v-slot:addon>\n <slot name=\"addon\" />\n </template>\n </OrLabel>\n </template>\n\n <div class=\"layout-row gap-md md:gap-md\">\n <slot name=\"prepend\" />\n <OrInputBox\n :variant=\"variant\"\n :size=\"size\"\n :invalid=\"!!error\"\n :readonly=\"readonly || loading\"\n :disabled=\"disabled\"\n >\n <template\n v-if=\"$slots.prependInner\"\n v-slot:prepend\n >\n <slot name=\"prependInner\" />\n </template>\n <input\n :ref=\"'control'\"\n v-bind=\"attributes\"\n v-model.trim=\"model\"\n :class=\"controlStyles\"\n :name=\"name\"\n :type=\"type === 'password' && disclosed ? 'text' : type\"\n :inputmode=\"inputmode\"\n :autocomplete=\"autocomplete\"\n :placeholder=\"placeholder\"\n :required=\"required\"\n :readonly=\"readonly || loading\"\n :disabled=\"disabled\"\n @input=\"$emit('input', $event)\"\n @keydown=\"$emit('keydown', $event)\"\n @keyup=\"$emit('keyup', $event)\"\n @focus=\"$emit('focus', $event)\"\n @blur=\"$emit('blur', $event)\"\n >\n\n <template\n v-if=\"loading || type === 'password' || type === 'search' || $slots.appendInner\"\n v-slot:addon\n >\n <slot name=\"appendInner\">\n <template v-if=\"loading\">\n <OrLoader\n :variant=\"'circular'\"\n :color=\"error ? 'danger' : 'primary'\"\n :size=\"isMobile ? 'm' : 's'\"\n />\n </template>\n\n <template v-else>\n <template v-if=\"type === 'password'\">\n <OrIconButton\n :icon=\"{ icon: disclosed ? 'visibility' : 'visibility_off', variant: 'filled' }\"\n :size=\"'l'\"\n :color=\"'inherit'\"\n :disabled=\"disabled\"\n @click.stop=\"disclosed = !disclosed\"\n />\n </template>\n\n <template v-if=\"type === 'search'\">\n <template v-if=\"modelValue && !readonly\">\n <OrIconButton\n :icon=\"'close'\"\n :color=\"'inherit'\"\n :size=\"'l'\"\n :disabled=\"disabled\"\n @click.stop=\"clear()\"\n />\n </template>\n\n <template v-else>\n <OrIcon\n :icon=\"'search'\"\n :size=\"'l'\"\n :variant=\"'outlined'\"\n />\n </template>\n </template>\n </template>\n </slot>\n </template>\n </OrInputBox>\n <slot name=\"append\" />\n </div>\n <template v-if=\"$slots.hint || hint || maxLength\">\n <OrHint\n v-show=\"!error\"\n :disabled=\"disabled\"\n >\n <slot name=\"hint\">\n {{ hint }}\n </slot>\n\n <template\n v-if=\"maxLength\"\n v-slot:addon\n >\n {{ length }} / {{ maxLength }}\n </template>\n </OrHint>\n </template>\n\n <OrError\n v-show=\"typeof error === 'string' && error.length > 0\"\n :disabled=\"disabled\"\n >\n {{ error }}\n\n <template\n v-if=\"maxLength\"\n v-slot:addon\n >\n {{ length }} / {{ maxLength }}\n </template>\n </OrError>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { useControlAttributes, useIdAttribute, useProxyModelValue, useResponsive, useValidationAttributes } from '@onereach/ui-components-common/hooks';\nimport { OrErrorV3 as OrError } from '@onereach/ui-components.or-error-v3';\nimport { OrHintV3 as OrHint } from '@onereach/ui-components.or-hint-v3';\nimport { OrIconButtonV3 as OrIconButton } from '@onereach/ui-components.or-icon-button-v3';\nimport { OrIconV3 as OrIcon } from '@onereach/ui-components.or-icon-v3';\nimport { InputBoxSize, InputBoxVariant, OrInputBoxV3 as OrInputBox } from '@onereach/ui-components.or-input-box-v3';\nimport { OrLabelV3 as OrLabel } from '@onereach/ui-components.or-label-v3';\nimport { OrLoaderV3 as OrLoader } from '@onereach/ui-components.or-loader-v3';\nimport { PropType, computed, defineComponent, reactive, ref, toRef } from 'vue';\n\nimport * as Styles from './styles';\nimport { InputMode, InputModelValue, InputType } from './types';\n\nexport default defineComponent({\n name: 'OrInput',\n\n components: {\n OrError,\n OrHint,\n OrIcon,\n OrIconButton,\n OrInputBox,\n OrLabel,\n OrLoader,\n },\n\n model: {\n prop: 'modelValue',\n event: 'update:modelValue',\n },\n\n props: {\n modelValue: {\n type: undefined as unknown as PropType<InputModelValue>,\n default: undefined,\n },\n\n name: {\n type: String,\n default: undefined,\n },\n\n type: {\n type: String as PropType<`${InputType}`>,\n default: () => InputType.Text,\n },\n\n autocomplete: {\n type: String,\n default: 'off',\n },\n\n inputmode: {\n type: String as PropType<`${InputMode}`>,\n default: InputMode.Text,\n },\n\n variant: {\n type: String as PropType<`${InputBoxVariant}`>,\n default: undefined,\n },\n\n size: {\n type: String as PropType<`${InputBoxSize}`>,\n default: undefined,\n },\n\n label: {\n type: String,\n default: undefined,\n },\n\n placeholder: {\n type: String,\n default: undefined,\n },\n\n hint: {\n type: String,\n default: undefined,\n },\n\n error: {\n type: [String, Boolean],\n default: undefined,\n },\n\n loading: {\n type: Boolean,\n default: false,\n },\n\n required: {\n type: Boolean,\n default: false,\n },\n\n readonly: {\n type: Boolean,\n default: false,\n },\n\n disabled: {\n type: Boolean,\n default: false,\n },\n },\n\n emits: [\n 'update:modelValue',\n\n 'input',\n 'keydown',\n 'keyup',\n 'focus',\n 'blur',\n ],\n\n expose: [\n 'root',\n\n 'clear',\n 'focus',\n 'blur',\n ],\n\n setup(props, context) {\n const attributes = reactive({\n id: useIdAttribute(),\n ...useControlAttributes(),\n ...useValidationAttributes(),\n });\n\n // Refs & Styles\n const root = ref<HTMLElement>();\n\n const rootStyles = computed(() => [\n 'or-input-v3',\n ...Styles.Input,\n ...props.variant === InputBoxVariant.Embedded ? ['grow'] : [],\n ]);\n\n const control = ref<HTMLInputElement>();\n\n const controlStyles = computed(() => [\n ...Styles.InputControl,\n ]);\n\n // State\n const model = useProxyModelValue(toRef(props, 'modelValue'), context.emit);\n const disclosed = ref(false);\n\n const length = computed(() => {\n return model.value?.toString().length ?? 0;\n });\n\n const maxLength = computed(() => {\n return attributes.maxlength;\n });\n\n // Methods\n function clear(): void {\n model.value = undefined;\n }\n\n function focus(): void {\n control.value?.focus();\n }\n\n function blur(): void {\n control.value?.blur();\n }\n\n // Helpers\n const { isMobile } = useResponsive();\n\n return {\n attributes,\n\n root,\n rootStyles,\n\n control,\n controlStyles,\n\n model,\n disclosed,\n\n length,\n maxLength,\n\n clear,\n focus,\n blur,\n\n isMobile,\n };\n },\n});\n</script>\n\n<style scoped>\ninput {\n min-width: 0;\n background: none;\n outline: none;\n}\n\ninput[type=\"search\"]::-webkit-search-cancel-button {\n display: none;\n}\n</style>\n"],"names":["Input","InputControl","InputType","InputMode","_sfc_main","defineComponent","OrError","OrHint","OrIcon","OrIconButton","OrInputBox","OrLabel","OrLoader","props","context","attributes","reactive","useIdAttribute","useControlAttributes","useValidationAttributes","root","ref","rootStyles","computed","Styles.Input","InputBoxVariant","control","controlStyles","Styles.InputControl","model","useProxyModelValue","toRef","disclosed","length","_a","maxLength","clear","focus","blur","isMobile","useResponsive","_resolveComponent","_openBlock","_createElementBlock","_normalizeClass","_ctx","_createBlock","_component_OrLabel","_renderSlot","_createCommentVNode","_createElementVNode","_hoisted_1","_createVNode","_component_OrInputBox","_mergeProps","_cache","$event","_withCtx","_component_OrLoader","_Fragment","_component_OrIconButton","_withModifiers","_component_OrIcon","_component_OrHint","_createSlots","_withDirectives","_component_OrError"],"mappings":"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"}
|