271 lines
8.5 KiB
JavaScript
271 lines
8.5 KiB
JavaScript
import {
|
|
makeAutocompleteProps,
|
|
useAutocomplete,
|
|
useAutofocus
|
|
} from "./chunk-IZQZFEAL.js";
|
|
import {
|
|
VCounter,
|
|
VField,
|
|
makeVFieldProps
|
|
} from "./chunk-ITO3JWXJ.js";
|
|
import {
|
|
VInput,
|
|
makeVInputProps,
|
|
useFocus
|
|
} from "./chunk-IK67YVHF.js";
|
|
import {
|
|
intersect_default
|
|
} from "./chunk-5ONGSJQ2.js";
|
|
import {
|
|
forwardRefs
|
|
} from "./chunk-GUNW7S2L.js";
|
|
import {
|
|
useProxiedModel
|
|
} from "./chunk-KA77II4V.js";
|
|
import {
|
|
callEvent,
|
|
filterInputAttrs,
|
|
genericComponent,
|
|
omit,
|
|
propsFactory,
|
|
useRender
|
|
} from "./chunk-LZ5T2ERG.js";
|
|
import {
|
|
Fragment,
|
|
cloneVNode,
|
|
computed,
|
|
createBaseVNode,
|
|
createVNode,
|
|
mergeProps,
|
|
nextTick,
|
|
normalizeClass,
|
|
ref,
|
|
withDirectives
|
|
} from "./chunk-2MKFL3BX.js";
|
|
|
|
// node_modules/vuetify/lib/components/VTextField/VTextField.js
|
|
import "/home/david/gitea_repo/personal_development/ServerManagerWebApp/frontend/node_modules/vuetify/lib/components/VTextField/VTextField.css";
|
|
var activeTypes = ["color", "file", "time", "date", "datetime-local", "week", "month"];
|
|
var makeVTextFieldProps = propsFactory({
|
|
autofocus: Boolean,
|
|
counter: [Boolean, Number, String],
|
|
counterValue: [Number, Function],
|
|
prefix: String,
|
|
placeholder: String,
|
|
persistentPlaceholder: Boolean,
|
|
persistentCounter: Boolean,
|
|
suffix: String,
|
|
role: String,
|
|
type: {
|
|
type: String,
|
|
default: "text"
|
|
},
|
|
modelModifiers: Object,
|
|
...makeAutocompleteProps(),
|
|
...makeVInputProps(),
|
|
...makeVFieldProps()
|
|
}, "VTextField");
|
|
var VTextField = genericComponent()({
|
|
name: "VTextField",
|
|
directives: {
|
|
vIntersect: intersect_default
|
|
},
|
|
inheritAttrs: false,
|
|
props: makeVTextFieldProps(),
|
|
emits: {
|
|
"click:control": (e) => true,
|
|
"mousedown:control": (e) => true,
|
|
"update:focused": (focused) => true,
|
|
"update:modelValue": (val) => true
|
|
},
|
|
setup(props, _ref) {
|
|
let {
|
|
attrs,
|
|
emit,
|
|
slots
|
|
} = _ref;
|
|
const model = useProxiedModel(props, "modelValue");
|
|
const {
|
|
isFocused,
|
|
focus,
|
|
blur
|
|
} = useFocus(props);
|
|
const {
|
|
onIntersect
|
|
} = useAutofocus(props);
|
|
const counterValue = computed(() => {
|
|
return typeof props.counterValue === "function" ? props.counterValue(model.value) : typeof props.counterValue === "number" ? props.counterValue : (model.value ?? "").toString().length;
|
|
});
|
|
const max = computed(() => {
|
|
if (attrs.maxlength) return attrs.maxlength;
|
|
if (!props.counter || typeof props.counter !== "number" && typeof props.counter !== "string") return void 0;
|
|
return props.counter;
|
|
});
|
|
const isPlainOrUnderlined = computed(() => ["plain", "underlined"].includes(props.variant));
|
|
const vInputRef = ref();
|
|
const vFieldRef = ref();
|
|
const inputRef = ref();
|
|
const autocomplete = useAutocomplete(props);
|
|
const isActive = computed(() => activeTypes.includes(props.type) || props.persistentPlaceholder || isFocused.value || props.active);
|
|
function onFocus() {
|
|
if (autocomplete.isSuppressing.value) {
|
|
autocomplete.update();
|
|
}
|
|
if (!isFocused.value) focus();
|
|
nextTick(() => {
|
|
if (inputRef.value !== document.activeElement) {
|
|
inputRef.value?.focus();
|
|
}
|
|
});
|
|
}
|
|
function onControlMousedown(e) {
|
|
emit("mousedown:control", e);
|
|
if (e.target === inputRef.value) return;
|
|
onFocus();
|
|
e.preventDefault();
|
|
}
|
|
function onControlClick(e) {
|
|
emit("click:control", e);
|
|
}
|
|
function onClear(e, reset) {
|
|
e.stopPropagation();
|
|
onFocus();
|
|
nextTick(() => {
|
|
reset();
|
|
callEvent(props["onClick:clear"], e);
|
|
});
|
|
}
|
|
function onInput(e) {
|
|
const el = e.target;
|
|
if (!(props.modelModifiers?.trim && ["text", "search", "password", "tel", "url"].includes(props.type))) {
|
|
model.value = el.value;
|
|
return;
|
|
}
|
|
const value = el.value;
|
|
const start = el.selectionStart;
|
|
const end = el.selectionEnd;
|
|
model.value = value;
|
|
nextTick(() => {
|
|
let offset = 0;
|
|
if (value.trimStart().length === el.value.length) {
|
|
offset = value.length - el.value.length;
|
|
}
|
|
if (start != null) el.selectionStart = start - offset;
|
|
if (end != null) el.selectionEnd = end - offset;
|
|
});
|
|
}
|
|
useRender(() => {
|
|
const hasCounter = !!(slots.counter || props.counter !== false && props.counter != null);
|
|
const hasDetails = !!(hasCounter || slots.details);
|
|
const [rootAttrs, inputAttrs] = filterInputAttrs(attrs);
|
|
const {
|
|
modelValue: _,
|
|
...inputProps
|
|
} = VInput.filterProps(props);
|
|
const fieldProps = VField.filterProps(props);
|
|
return createVNode(VInput, mergeProps({
|
|
"ref": vInputRef,
|
|
"modelValue": model.value,
|
|
"onUpdate:modelValue": ($event) => model.value = $event,
|
|
"class": ["v-text-field", {
|
|
"v-text-field--prefixed": props.prefix,
|
|
"v-text-field--suffixed": props.suffix,
|
|
"v-input--plain-underlined": isPlainOrUnderlined.value
|
|
}, props.class],
|
|
"style": props.style
|
|
}, rootAttrs, inputProps, {
|
|
"centerAffix": !isPlainOrUnderlined.value,
|
|
"focused": isFocused.value
|
|
}), {
|
|
...slots,
|
|
default: (_ref2) => {
|
|
let {
|
|
id,
|
|
isDisabled,
|
|
isDirty,
|
|
isReadonly,
|
|
isValid,
|
|
hasDetails: hasDetails2,
|
|
reset
|
|
} = _ref2;
|
|
return createVNode(VField, mergeProps({
|
|
"ref": vFieldRef,
|
|
"onMousedown": onControlMousedown,
|
|
"onClick": onControlClick,
|
|
"onClick:clear": (e) => onClear(e, reset),
|
|
"role": props.role
|
|
}, omit(fieldProps, ["onClick:clear"]), {
|
|
"id": id.value,
|
|
"labelId": `${id.value}-label`,
|
|
"active": isActive.value || isDirty.value,
|
|
"dirty": isDirty.value || props.dirty,
|
|
"disabled": isDisabled.value,
|
|
"focused": isFocused.value,
|
|
"details": hasDetails2.value,
|
|
"error": isValid.value === false
|
|
}), {
|
|
...slots,
|
|
default: (_ref3) => {
|
|
let {
|
|
props: {
|
|
class: fieldClass,
|
|
...slotProps
|
|
},
|
|
controlRef
|
|
} = _ref3;
|
|
const inputNode = createBaseVNode("input", mergeProps({
|
|
"ref": (val) => inputRef.value = controlRef.value = val,
|
|
"value": model.value,
|
|
"onInput": onInput,
|
|
"autofocus": props.autofocus,
|
|
"readonly": isReadonly.value,
|
|
"disabled": isDisabled.value,
|
|
"name": autocomplete.fieldName.value,
|
|
"autocomplete": autocomplete.fieldAutocomplete.value,
|
|
"placeholder": props.placeholder,
|
|
"size": 1,
|
|
"role": props.role,
|
|
"type": props.type,
|
|
"onFocus": focus,
|
|
"onBlur": blur,
|
|
"aria-labelledby": `${id.value}-label`
|
|
}, slotProps, inputAttrs), null);
|
|
return createBaseVNode(Fragment, null, [props.prefix && createBaseVNode("span", {
|
|
"class": "v-text-field__prefix"
|
|
}, [createBaseVNode("span", {
|
|
"class": "v-text-field__prefix__text"
|
|
}, [props.prefix])]), withDirectives(slots.default ? createBaseVNode("div", {
|
|
"class": normalizeClass(fieldClass),
|
|
"data-no-activator": ""
|
|
}, [slots.default({
|
|
id
|
|
}), inputNode]) : cloneVNode(inputNode, {
|
|
class: fieldClass
|
|
}), [[intersect_default, onIntersect, null, {
|
|
once: true
|
|
}]]), props.suffix && createBaseVNode("span", {
|
|
"class": "v-text-field__suffix"
|
|
}, [createBaseVNode("span", {
|
|
"class": "v-text-field__suffix__text"
|
|
}, [props.suffix])])]);
|
|
}
|
|
});
|
|
},
|
|
details: hasDetails ? (slotProps) => createBaseVNode(Fragment, null, [slots.details?.(slotProps), hasCounter && createBaseVNode(Fragment, null, [createBaseVNode("span", null, null), createVNode(VCounter, {
|
|
"active": props.persistentCounter || isFocused.value,
|
|
"value": counterValue.value,
|
|
"max": max.value,
|
|
"disabled": props.disabled
|
|
}, slots.counter)])]) : void 0
|
|
});
|
|
});
|
|
return forwardRefs({}, vInputRef, vFieldRef, inputRef);
|
|
}
|
|
});
|
|
|
|
export {
|
|
makeVTextFieldProps,
|
|
VTextField
|
|
};
|
|
//# sourceMappingURL=chunk-6MO6MKTY.js.map
|