major server manager overhaul
This commit is contained in:
+366
@@ -0,0 +1,366 @@
|
||||
import {
|
||||
VLabel
|
||||
} from "./chunk-IK67YVHF.js";
|
||||
import {
|
||||
makeDensityProps,
|
||||
useDensity
|
||||
} from "./chunk-TM3MIDYC.js";
|
||||
import {
|
||||
VIcon
|
||||
} from "./chunk-4XZHKYGH.js";
|
||||
import {
|
||||
IconValue
|
||||
} from "./chunk-OJDZBU5D.js";
|
||||
import {
|
||||
ripple_default
|
||||
} from "./chunk-DS4J67XG.js";
|
||||
import {
|
||||
useBackgroundColor,
|
||||
useTextColor
|
||||
} from "./chunk-BHV5Z34M.js";
|
||||
import {
|
||||
useProxiedModel
|
||||
} from "./chunk-KA77II4V.js";
|
||||
import {
|
||||
makeThemeProps
|
||||
} from "./chunk-3DSR7NCB.js";
|
||||
import {
|
||||
deepEqual,
|
||||
filterInputAttrs,
|
||||
genericComponent,
|
||||
makeComponentProps,
|
||||
matchesSelector,
|
||||
propsFactory,
|
||||
provideDefaults,
|
||||
useRender,
|
||||
wrapInArray
|
||||
} from "./chunk-LZ5T2ERG.js";
|
||||
import {
|
||||
Fragment,
|
||||
computed,
|
||||
createBaseVNode,
|
||||
createVNode,
|
||||
inject,
|
||||
mergeProps,
|
||||
nextTick,
|
||||
normalizeClass,
|
||||
normalizeStyle,
|
||||
onScopeDispose,
|
||||
provide,
|
||||
ref,
|
||||
shallowRef,
|
||||
toRef,
|
||||
useId,
|
||||
withDirectives
|
||||
} from "./chunk-2MKFL3BX.js";
|
||||
|
||||
// node_modules/vuetify/lib/components/VSelectionControlGroup/VSelectionControlGroup.js
|
||||
import "/home/david/gitea_repo/personal_development/ServerManagerWebApp/frontend/node_modules/vuetify/lib/components/VSelectionControlGroup/VSelectionControlGroup.css";
|
||||
var VSelectionControlGroupSymbol = /* @__PURE__ */ Symbol.for("vuetify:selection-control-group");
|
||||
var makeSelectionControlGroupProps = propsFactory({
|
||||
color: String,
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: null
|
||||
},
|
||||
defaultsTarget: String,
|
||||
error: Boolean,
|
||||
id: String,
|
||||
inline: Boolean,
|
||||
falseIcon: IconValue,
|
||||
trueIcon: IconValue,
|
||||
ripple: {
|
||||
type: [Boolean, Object],
|
||||
default: true
|
||||
},
|
||||
multiple: {
|
||||
type: Boolean,
|
||||
default: null
|
||||
},
|
||||
name: String,
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
default: null
|
||||
},
|
||||
modelValue: null,
|
||||
type: String,
|
||||
valueComparator: {
|
||||
type: Function,
|
||||
default: deepEqual
|
||||
},
|
||||
...makeComponentProps(),
|
||||
...makeDensityProps(),
|
||||
...makeThemeProps()
|
||||
}, "SelectionControlGroup");
|
||||
var makeVSelectionControlGroupProps = propsFactory({
|
||||
...makeSelectionControlGroupProps({
|
||||
defaultsTarget: "VSelectionControl"
|
||||
})
|
||||
}, "VSelectionControlGroup");
|
||||
var VSelectionControlGroup = genericComponent()({
|
||||
name: "VSelectionControlGroup",
|
||||
props: makeVSelectionControlGroupProps(),
|
||||
emits: {
|
||||
"update:modelValue": (value) => true
|
||||
},
|
||||
setup(props, _ref) {
|
||||
let {
|
||||
slots
|
||||
} = _ref;
|
||||
const modelValue = useProxiedModel(props, "modelValue");
|
||||
const uid = useId();
|
||||
const id = toRef(() => props.id || `v-selection-control-group-${uid}`);
|
||||
const name = toRef(() => props.name || id.value);
|
||||
const updateHandlers = /* @__PURE__ */ new Set();
|
||||
provide(VSelectionControlGroupSymbol, {
|
||||
modelValue,
|
||||
forceUpdate: () => {
|
||||
updateHandlers.forEach((fn) => fn());
|
||||
},
|
||||
onForceUpdate: (cb) => {
|
||||
updateHandlers.add(cb);
|
||||
onScopeDispose(() => {
|
||||
updateHandlers.delete(cb);
|
||||
});
|
||||
}
|
||||
});
|
||||
provideDefaults({
|
||||
[props.defaultsTarget]: {
|
||||
color: toRef(() => props.color),
|
||||
disabled: toRef(() => props.disabled),
|
||||
density: toRef(() => props.density),
|
||||
error: toRef(() => props.error),
|
||||
inline: toRef(() => props.inline),
|
||||
modelValue,
|
||||
multiple: toRef(() => !!props.multiple || props.multiple == null && Array.isArray(modelValue.value)),
|
||||
name,
|
||||
falseIcon: toRef(() => props.falseIcon),
|
||||
trueIcon: toRef(() => props.trueIcon),
|
||||
readonly: toRef(() => props.readonly),
|
||||
ripple: toRef(() => props.ripple),
|
||||
type: toRef(() => props.type),
|
||||
valueComparator: toRef(() => props.valueComparator)
|
||||
}
|
||||
});
|
||||
useRender(() => createBaseVNode("div", {
|
||||
"class": normalizeClass(["v-selection-control-group", {
|
||||
"v-selection-control-group--inline": props.inline
|
||||
}, props.class]),
|
||||
"style": normalizeStyle(props.style),
|
||||
"role": props.type === "radio" ? "radiogroup" : void 0
|
||||
}, [slots.default?.()]));
|
||||
return {};
|
||||
}
|
||||
});
|
||||
|
||||
// node_modules/vuetify/lib/components/VSelectionControl/VSelectionControl.js
|
||||
import "/home/david/gitea_repo/personal_development/ServerManagerWebApp/frontend/node_modules/vuetify/lib/components/VSelectionControl/VSelectionControl.css";
|
||||
var makeVSelectionControlProps = propsFactory({
|
||||
label: String,
|
||||
baseColor: String,
|
||||
trueValue: null,
|
||||
falseValue: null,
|
||||
value: null,
|
||||
...makeComponentProps(),
|
||||
...makeSelectionControlGroupProps()
|
||||
}, "VSelectionControl");
|
||||
function useSelectionControl(props) {
|
||||
const group = inject(VSelectionControlGroupSymbol, void 0);
|
||||
const {
|
||||
densityClasses
|
||||
} = useDensity(props);
|
||||
const modelValue = useProxiedModel(props, "modelValue");
|
||||
const trueValue = computed(() => props.trueValue !== void 0 ? props.trueValue : props.value !== void 0 ? props.value : true);
|
||||
const falseValue = computed(() => props.falseValue !== void 0 ? props.falseValue : false);
|
||||
const isMultiple = computed(() => !!props.multiple || props.multiple == null && Array.isArray(modelValue.value));
|
||||
const model = computed({
|
||||
get() {
|
||||
const val = group ? group.modelValue.value : modelValue.value;
|
||||
return isMultiple.value ? wrapInArray(val).some((v) => props.valueComparator(v, trueValue.value)) : props.valueComparator(val, trueValue.value);
|
||||
},
|
||||
set(val) {
|
||||
if (props.readonly) return;
|
||||
const currentValue = val ? trueValue.value : falseValue.value;
|
||||
let newVal = currentValue;
|
||||
if (isMultiple.value) {
|
||||
newVal = val ? [...wrapInArray(modelValue.value), currentValue] : wrapInArray(modelValue.value).filter((item) => !props.valueComparator(item, trueValue.value));
|
||||
}
|
||||
if (group) {
|
||||
group.modelValue.value = newVal;
|
||||
} else {
|
||||
modelValue.value = newVal;
|
||||
}
|
||||
}
|
||||
});
|
||||
const {
|
||||
textColorClasses,
|
||||
textColorStyles
|
||||
} = useTextColor(() => {
|
||||
if (props.error || props.disabled) return void 0;
|
||||
return model.value ? props.color : props.baseColor;
|
||||
});
|
||||
const {
|
||||
backgroundColorClasses,
|
||||
backgroundColorStyles
|
||||
} = useBackgroundColor(() => {
|
||||
return model.value && !props.error && !props.disabled ? props.color : props.baseColor;
|
||||
});
|
||||
const icon = computed(() => model.value ? props.trueIcon : props.falseIcon);
|
||||
return {
|
||||
group,
|
||||
densityClasses,
|
||||
trueValue,
|
||||
falseValue,
|
||||
model,
|
||||
textColorClasses,
|
||||
textColorStyles,
|
||||
backgroundColorClasses,
|
||||
backgroundColorStyles,
|
||||
icon
|
||||
};
|
||||
}
|
||||
var VSelectionControl = genericComponent()({
|
||||
name: "VSelectionControl",
|
||||
directives: {
|
||||
vRipple: ripple_default
|
||||
},
|
||||
inheritAttrs: false,
|
||||
props: makeVSelectionControlProps(),
|
||||
emits: {
|
||||
"update:modelValue": (value) => true
|
||||
},
|
||||
setup(props, _ref) {
|
||||
let {
|
||||
attrs,
|
||||
slots
|
||||
} = _ref;
|
||||
const {
|
||||
group,
|
||||
densityClasses,
|
||||
icon,
|
||||
model,
|
||||
textColorClasses,
|
||||
textColorStyles,
|
||||
backgroundColorClasses,
|
||||
backgroundColorStyles,
|
||||
trueValue
|
||||
} = useSelectionControl(props);
|
||||
const uid = useId();
|
||||
const isFocused = shallowRef(false);
|
||||
const isFocusVisible = shallowRef(false);
|
||||
const input = ref();
|
||||
const id = toRef(() => props.id || `input-${uid}`);
|
||||
const isInteractive = toRef(() => !props.disabled && !props.readonly);
|
||||
group?.onForceUpdate(() => {
|
||||
if (input.value) {
|
||||
input.value.checked = model.value;
|
||||
}
|
||||
});
|
||||
function onFocus(e) {
|
||||
if (!isInteractive.value) return;
|
||||
isFocused.value = true;
|
||||
if (matchesSelector(e.target, ":focus-visible") !== false) {
|
||||
isFocusVisible.value = true;
|
||||
}
|
||||
}
|
||||
function onBlur() {
|
||||
isFocused.value = false;
|
||||
isFocusVisible.value = false;
|
||||
}
|
||||
function onClickLabel(e) {
|
||||
e.stopPropagation();
|
||||
}
|
||||
function onInput(e) {
|
||||
if (!isInteractive.value) {
|
||||
if (input.value) {
|
||||
input.value.checked = model.value;
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (props.readonly && group) {
|
||||
nextTick(() => group.forceUpdate());
|
||||
}
|
||||
model.value = e.target.checked;
|
||||
}
|
||||
useRender(() => {
|
||||
const label = slots.label ? slots.label({
|
||||
label: props.label,
|
||||
props: {
|
||||
for: id.value
|
||||
}
|
||||
}) : props.label;
|
||||
const [rootAttrs, inputAttrs] = filterInputAttrs(attrs);
|
||||
const inputNode = createBaseVNode("input", mergeProps({
|
||||
"ref": input,
|
||||
"checked": model.value,
|
||||
"disabled": !!props.disabled,
|
||||
"id": id.value,
|
||||
"onBlur": onBlur,
|
||||
"onFocus": onFocus,
|
||||
"onInput": onInput,
|
||||
"aria-disabled": !!props.disabled,
|
||||
"aria-label": props.label,
|
||||
"type": props.type,
|
||||
"value": trueValue.value,
|
||||
"name": props.name,
|
||||
"aria-checked": props.type === "checkbox" ? model.value : void 0
|
||||
}, inputAttrs), null);
|
||||
return createBaseVNode("div", mergeProps({
|
||||
"class": ["v-selection-control", {
|
||||
"v-selection-control--dirty": model.value,
|
||||
"v-selection-control--disabled": props.disabled,
|
||||
"v-selection-control--error": props.error,
|
||||
"v-selection-control--focused": isFocused.value,
|
||||
"v-selection-control--focus-visible": isFocusVisible.value,
|
||||
"v-selection-control--inline": props.inline
|
||||
}, densityClasses.value, props.class]
|
||||
}, rootAttrs, {
|
||||
"style": props.style
|
||||
}), [createBaseVNode("div", {
|
||||
"class": normalizeClass(["v-selection-control__wrapper", textColorClasses.value]),
|
||||
"style": normalizeStyle(textColorStyles.value)
|
||||
}, [slots.default?.({
|
||||
backgroundColorClasses,
|
||||
backgroundColorStyles
|
||||
}), withDirectives(createBaseVNode("div", {
|
||||
"class": normalizeClass(["v-selection-control__input"])
|
||||
}, [slots.input?.({
|
||||
model,
|
||||
textColorClasses,
|
||||
textColorStyles,
|
||||
backgroundColorClasses,
|
||||
backgroundColorStyles,
|
||||
inputNode,
|
||||
icon: icon.value,
|
||||
props: {
|
||||
onFocus,
|
||||
onBlur,
|
||||
id: id.value
|
||||
}
|
||||
}) ?? createBaseVNode(Fragment, null, [icon.value && createVNode(VIcon, {
|
||||
"key": "icon",
|
||||
"icon": icon.value
|
||||
}, null), inputNode])]), [[ripple_default, !props.disabled && !props.readonly && props.ripple, null, {
|
||||
center: true,
|
||||
circle: true
|
||||
}]])]), label && createVNode(VLabel, {
|
||||
"for": id.value,
|
||||
"onClick": onClickLabel
|
||||
}, {
|
||||
default: () => [label]
|
||||
})]);
|
||||
});
|
||||
return {
|
||||
isFocused,
|
||||
input
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
export {
|
||||
makeSelectionControlGroupProps,
|
||||
VSelectionControlGroup,
|
||||
makeVSelectionControlProps,
|
||||
VSelectionControl
|
||||
};
|
||||
//# sourceMappingURL=chunk-KHWE4FHS.js.map
|
||||
Reference in New Issue
Block a user