major server manager overhaul
This commit is contained in:
+830
@@ -0,0 +1,830 @@
|
||||
import {
|
||||
VInput,
|
||||
VLabel,
|
||||
makeFocusProps,
|
||||
makeVInputProps,
|
||||
useFocus
|
||||
} from "./chunk-IK67YVHF.js";
|
||||
import {
|
||||
useForm
|
||||
} from "./chunk-GAYXO4FM.js";
|
||||
import {
|
||||
VScaleTransition
|
||||
} from "./chunk-B4JFJDWM.js";
|
||||
import {
|
||||
forwardRefs
|
||||
} from "./chunk-GUNW7S2L.js";
|
||||
import {
|
||||
makeElevationProps,
|
||||
useElevation
|
||||
} from "./chunk-YJD2PNP6.js";
|
||||
import {
|
||||
makeRoundedProps,
|
||||
useRounded
|
||||
} from "./chunk-AQK3CYVW.js";
|
||||
import {
|
||||
ripple_default
|
||||
} from "./chunk-DS4J67XG.js";
|
||||
import {
|
||||
useBackgroundColor,
|
||||
useTextColor
|
||||
} from "./chunk-BHV5Z34M.js";
|
||||
import {
|
||||
useRtl
|
||||
} from "./chunk-ENTLCOCZ.js";
|
||||
import {
|
||||
useProxiedModel
|
||||
} from "./chunk-KA77II4V.js";
|
||||
import {
|
||||
clamp,
|
||||
convertToUnit,
|
||||
createRange,
|
||||
filterInputAttrs,
|
||||
genericComponent,
|
||||
getDecimals,
|
||||
keyValues,
|
||||
makeComponentProps,
|
||||
propsFactory,
|
||||
useRender
|
||||
} from "./chunk-LZ5T2ERG.js";
|
||||
import {
|
||||
Fragment,
|
||||
computed,
|
||||
createBaseVNode,
|
||||
createVNode,
|
||||
inject,
|
||||
mergeProps,
|
||||
nextTick,
|
||||
normalizeClass,
|
||||
normalizeStyle,
|
||||
onScopeDispose,
|
||||
provide,
|
||||
ref,
|
||||
shallowRef,
|
||||
toRef,
|
||||
vShow,
|
||||
withDirectives
|
||||
} from "./chunk-2MKFL3BX.js";
|
||||
|
||||
// node_modules/vuetify/lib/components/VSlider/VSlider.js
|
||||
import "/home/david/gitea_repo/personal_development/ServerManagerWebApp/frontend/node_modules/vuetify/lib/components/VSlider/VSlider.css";
|
||||
|
||||
// node_modules/vuetify/lib/components/VSlider/VSliderThumb.js
|
||||
import "/home/david/gitea_repo/personal_development/ServerManagerWebApp/frontend/node_modules/vuetify/lib/components/VSlider/VSliderThumb.css";
|
||||
|
||||
// node_modules/vuetify/lib/components/VSlider/slider.js
|
||||
var VSliderSymbol = /* @__PURE__ */ Symbol.for("vuetify:v-slider");
|
||||
function getOffset(e, el, direction) {
|
||||
const vertical = direction === "vertical";
|
||||
const rect = el.getBoundingClientRect();
|
||||
const touch = "touches" in e ? e.touches[0] : e;
|
||||
return vertical ? touch.clientY - (rect.top + rect.height / 2) : touch.clientX - (rect.left + rect.width / 2);
|
||||
}
|
||||
function getPosition(e, position) {
|
||||
if ("touches" in e && e.touches.length) return e.touches[0][position];
|
||||
else if ("changedTouches" in e && e.changedTouches.length) return e.changedTouches[0][position];
|
||||
else return e[position];
|
||||
}
|
||||
var makeSliderProps = propsFactory({
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: null
|
||||
},
|
||||
error: Boolean,
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
default: null
|
||||
},
|
||||
max: {
|
||||
type: [Number, String],
|
||||
default: 100
|
||||
},
|
||||
min: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
},
|
||||
step: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
},
|
||||
thumbColor: String,
|
||||
thumbLabel: {
|
||||
type: [Boolean, String],
|
||||
default: void 0,
|
||||
validator: (v) => typeof v === "boolean" || v === "always"
|
||||
},
|
||||
thumbSize: {
|
||||
type: [Number, String],
|
||||
default: 20
|
||||
},
|
||||
showTicks: {
|
||||
type: [Boolean, String],
|
||||
default: false,
|
||||
validator: (v) => typeof v === "boolean" || v === "always"
|
||||
},
|
||||
ticks: {
|
||||
type: [Array, Object]
|
||||
},
|
||||
tickSize: {
|
||||
type: [Number, String],
|
||||
default: 2
|
||||
},
|
||||
color: String,
|
||||
trackColor: String,
|
||||
trackFillColor: String,
|
||||
trackSize: {
|
||||
type: [Number, String],
|
||||
default: 4
|
||||
},
|
||||
direction: {
|
||||
type: String,
|
||||
default: "horizontal",
|
||||
validator: (v) => ["vertical", "horizontal"].includes(v)
|
||||
},
|
||||
reverse: Boolean,
|
||||
noKeyboard: Boolean,
|
||||
...makeRoundedProps(),
|
||||
...makeElevationProps({
|
||||
elevation: 2
|
||||
}),
|
||||
ripple: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
}, "Slider");
|
||||
var useSteps = (props) => {
|
||||
const min = computed(() => parseFloat(props.min));
|
||||
const max = computed(() => parseFloat(props.max));
|
||||
const step = computed(() => Number(props.step) > 0 ? parseFloat(props.step) : 0);
|
||||
const decimals = computed(() => Math.max(getDecimals(step.value), getDecimals(min.value)));
|
||||
function roundValue(value) {
|
||||
value = parseFloat(value);
|
||||
if (step.value <= 0) return value;
|
||||
const clamped = clamp(value, min.value, max.value);
|
||||
const offset = min.value % step.value;
|
||||
let newValue = Math.round((clamped - offset) / step.value) * step.value + offset;
|
||||
if (clamped > newValue && newValue + step.value > max.value) {
|
||||
newValue = max.value;
|
||||
}
|
||||
return parseFloat(Math.min(newValue, max.value).toFixed(decimals.value));
|
||||
}
|
||||
return {
|
||||
min,
|
||||
max,
|
||||
step,
|
||||
decimals,
|
||||
roundValue
|
||||
};
|
||||
};
|
||||
var useSlider = (_ref) => {
|
||||
let {
|
||||
props,
|
||||
steps,
|
||||
onSliderStart,
|
||||
onSliderMove,
|
||||
onSliderEnd,
|
||||
getActiveThumb
|
||||
} = _ref;
|
||||
const form = useForm(props);
|
||||
const {
|
||||
isRtl
|
||||
} = useRtl();
|
||||
const isReversed = toRef(() => props.reverse);
|
||||
const vertical = computed(() => props.direction === "vertical");
|
||||
const indexFromEnd = computed(() => vertical.value !== isReversed.value);
|
||||
const {
|
||||
min,
|
||||
max,
|
||||
step,
|
||||
decimals,
|
||||
roundValue
|
||||
} = steps;
|
||||
const thumbSize = computed(() => parseInt(props.thumbSize, 10));
|
||||
const tickSize = computed(() => parseInt(props.tickSize, 10));
|
||||
const trackSize = computed(() => parseInt(props.trackSize, 10));
|
||||
const numTicks = computed(() => (max.value - min.value) / step.value);
|
||||
const thumbColor = computed(() => props.error || form.isDisabled.value ? void 0 : props.thumbColor ?? props.color);
|
||||
const thumbLabelColor = computed(() => props.error || form.isDisabled.value ? void 0 : props.thumbColor);
|
||||
const trackColor = computed(() => props.error || form.isDisabled.value ? void 0 : props.trackColor ?? props.color);
|
||||
const trackFillColor = computed(() => props.error || form.isDisabled.value ? void 0 : props.trackFillColor ?? props.color);
|
||||
const mousePressed = shallowRef(false);
|
||||
const startOffset = shallowRef(0);
|
||||
const trackContainerRef = ref();
|
||||
const activeThumbRef = ref();
|
||||
function parseMouseMove(e) {
|
||||
const el = trackContainerRef.value?.$el;
|
||||
if (!el) return;
|
||||
const vertical2 = props.direction === "vertical";
|
||||
const start = vertical2 ? "top" : "left";
|
||||
const length = vertical2 ? "height" : "width";
|
||||
const position2 = vertical2 ? "clientY" : "clientX";
|
||||
const {
|
||||
[start]: trackStart,
|
||||
[length]: trackLength
|
||||
} = el.getBoundingClientRect();
|
||||
const clickOffset = getPosition(e, position2);
|
||||
let clickPos = clamp((clickOffset - trackStart - startOffset.value) / trackLength) || 0;
|
||||
if (vertical2 ? indexFromEnd.value : indexFromEnd.value !== isRtl.value) clickPos = 1 - clickPos;
|
||||
return roundValue(min.value + clickPos * (max.value - min.value));
|
||||
}
|
||||
const handleStop = (e) => {
|
||||
const value = parseMouseMove(e);
|
||||
if (value != null) {
|
||||
onSliderEnd({
|
||||
value
|
||||
});
|
||||
}
|
||||
mousePressed.value = false;
|
||||
startOffset.value = 0;
|
||||
};
|
||||
const handleStart = (e) => {
|
||||
const value = parseMouseMove(e);
|
||||
activeThumbRef.value = getActiveThumb(e);
|
||||
if (!activeThumbRef.value) return;
|
||||
mousePressed.value = true;
|
||||
if (activeThumbRef.value.contains(e.target)) {
|
||||
startOffset.value = getOffset(e, activeThumbRef.value, props.direction);
|
||||
} else {
|
||||
startOffset.value = 0;
|
||||
if (value != null) {
|
||||
onSliderMove({
|
||||
value
|
||||
});
|
||||
}
|
||||
}
|
||||
if (value != null) {
|
||||
onSliderStart({
|
||||
value
|
||||
});
|
||||
}
|
||||
nextTick(() => activeThumbRef.value?.focus());
|
||||
};
|
||||
const moveListenerOptions = {
|
||||
passive: true,
|
||||
capture: true
|
||||
};
|
||||
function onMouseMove(e) {
|
||||
const value = parseMouseMove(e);
|
||||
if (value != null) {
|
||||
onSliderMove({
|
||||
value
|
||||
});
|
||||
}
|
||||
}
|
||||
function onSliderMouseUp(e) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
handleStop(e);
|
||||
window.removeEventListener("mousemove", onMouseMove, moveListenerOptions);
|
||||
window.removeEventListener("mouseup", onSliderMouseUp);
|
||||
}
|
||||
function onSliderTouchend(e) {
|
||||
handleStop(e);
|
||||
window.removeEventListener("touchmove", onMouseMove, moveListenerOptions);
|
||||
e.target?.removeEventListener("touchend", onSliderTouchend);
|
||||
}
|
||||
function onSliderTouchstart(e) {
|
||||
handleStart(e);
|
||||
window.addEventListener("touchmove", onMouseMove, moveListenerOptions);
|
||||
e.target?.addEventListener("touchend", onSliderTouchend, {
|
||||
passive: false
|
||||
});
|
||||
}
|
||||
function onSliderMousedown(e) {
|
||||
if (e.button !== 0) return;
|
||||
e.preventDefault();
|
||||
handleStart(e);
|
||||
window.addEventListener("mousemove", onMouseMove, moveListenerOptions);
|
||||
window.addEventListener("mouseup", onSliderMouseUp, {
|
||||
passive: false
|
||||
});
|
||||
}
|
||||
onScopeDispose(() => {
|
||||
window.removeEventListener("touchmove", onMouseMove);
|
||||
window.removeEventListener("mousemove", onMouseMove);
|
||||
window.removeEventListener("mouseup", onSliderMouseUp);
|
||||
});
|
||||
const position = (val) => {
|
||||
const percentage = (val - min.value) / (max.value - min.value) * 100;
|
||||
return clamp(isNaN(percentage) ? 0 : percentage, 0, 100);
|
||||
};
|
||||
const showTicks = toRef(() => props.showTicks);
|
||||
const parsedTicks = computed(() => {
|
||||
if (!showTicks.value) return [];
|
||||
if (!props.ticks) {
|
||||
return numTicks.value !== Infinity ? createRange(numTicks.value + 1).map((t) => {
|
||||
const value = min.value + t * step.value;
|
||||
return {
|
||||
value,
|
||||
position: position(value)
|
||||
};
|
||||
}) : [];
|
||||
}
|
||||
if (Array.isArray(props.ticks)) return props.ticks.map((t) => ({
|
||||
value: t,
|
||||
position: position(t),
|
||||
label: t.toString()
|
||||
}));
|
||||
return Object.keys(props.ticks).map((key) => ({
|
||||
value: parseFloat(key),
|
||||
position: position(parseFloat(key)),
|
||||
label: props.ticks[key]
|
||||
}));
|
||||
});
|
||||
const hasLabels = computed(() => parsedTicks.value.some((_ref2) => {
|
||||
let {
|
||||
label
|
||||
} = _ref2;
|
||||
return !!label;
|
||||
}));
|
||||
const data = {
|
||||
activeThumbRef,
|
||||
color: toRef(() => props.color),
|
||||
decimals,
|
||||
disabled: form.isDisabled,
|
||||
direction: toRef(() => props.direction),
|
||||
elevation: toRef(() => props.elevation),
|
||||
hasLabels,
|
||||
isReversed,
|
||||
indexFromEnd,
|
||||
min,
|
||||
max,
|
||||
mousePressed,
|
||||
noKeyboard: toRef(() => props.noKeyboard),
|
||||
numTicks,
|
||||
onSliderMousedown,
|
||||
onSliderTouchstart,
|
||||
parsedTicks,
|
||||
parseMouseMove,
|
||||
position,
|
||||
readonly: form.isReadonly,
|
||||
rounded: toRef(() => props.rounded),
|
||||
roundValue,
|
||||
showTicks,
|
||||
startOffset,
|
||||
step,
|
||||
thumbSize,
|
||||
thumbColor,
|
||||
thumbLabelColor,
|
||||
thumbLabel: toRef(() => props.thumbLabel),
|
||||
ticks: toRef(() => props.ticks),
|
||||
tickSize,
|
||||
trackColor,
|
||||
trackContainerRef,
|
||||
trackFillColor,
|
||||
trackSize,
|
||||
vertical
|
||||
};
|
||||
provide(VSliderSymbol, data);
|
||||
return data;
|
||||
};
|
||||
|
||||
// node_modules/vuetify/lib/components/VSlider/VSliderThumb.js
|
||||
var makeVSliderThumbProps = propsFactory({
|
||||
focused: Boolean,
|
||||
max: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
min: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
modelValue: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
position: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
ripple: {
|
||||
type: [Boolean, Object],
|
||||
default: true
|
||||
},
|
||||
name: String,
|
||||
noKeyboard: Boolean,
|
||||
...makeComponentProps()
|
||||
}, "VSliderThumb");
|
||||
var VSliderThumb = genericComponent()({
|
||||
name: "VSliderThumb",
|
||||
directives: {
|
||||
vRipple: ripple_default
|
||||
},
|
||||
props: makeVSliderThumbProps(),
|
||||
emits: {
|
||||
"update:modelValue": (v) => true
|
||||
},
|
||||
setup(props, _ref) {
|
||||
let {
|
||||
slots,
|
||||
emit
|
||||
} = _ref;
|
||||
const slider = inject(VSliderSymbol);
|
||||
const {
|
||||
isRtl,
|
||||
rtlClasses
|
||||
} = useRtl();
|
||||
if (!slider) throw new Error("[Vuetify] v-slider-thumb must be used inside v-slider or v-range-slider");
|
||||
const {
|
||||
min,
|
||||
max,
|
||||
thumbColor,
|
||||
thumbLabelColor,
|
||||
step,
|
||||
disabled,
|
||||
thumbSize,
|
||||
thumbLabel,
|
||||
direction,
|
||||
isReversed,
|
||||
vertical,
|
||||
readonly,
|
||||
elevation,
|
||||
mousePressed,
|
||||
decimals,
|
||||
indexFromEnd
|
||||
} = slider;
|
||||
const elevationProps = computed(() => !disabled.value ? elevation.value : void 0);
|
||||
const {
|
||||
elevationClasses
|
||||
} = useElevation(elevationProps);
|
||||
const {
|
||||
textColorClasses,
|
||||
textColorStyles
|
||||
} = useTextColor(thumbColor);
|
||||
const {
|
||||
backgroundColorClasses,
|
||||
backgroundColorStyles
|
||||
} = useBackgroundColor(thumbLabelColor);
|
||||
const {
|
||||
pageup,
|
||||
pagedown,
|
||||
end,
|
||||
home,
|
||||
left,
|
||||
right,
|
||||
down,
|
||||
up
|
||||
} = keyValues;
|
||||
const relevantKeys = [pageup, pagedown, end, home, left, right, down, up];
|
||||
const multipliers = computed(() => {
|
||||
if (step.value) return [1, 2, 3];
|
||||
else return [1, 5, 10];
|
||||
});
|
||||
function parseKeydown(e, value) {
|
||||
if (props.noKeyboard || disabled.value) return;
|
||||
if (!relevantKeys.includes(e.key)) return;
|
||||
e.preventDefault();
|
||||
const _step = step.value || 0.1;
|
||||
const steps = (max.value - min.value) / _step;
|
||||
if ([left, right, down, up].includes(e.key)) {
|
||||
const increase = vertical.value ? [isRtl.value ? left : right, isReversed.value ? down : up] : indexFromEnd.value !== isRtl.value ? [left, up] : [right, up];
|
||||
const direction2 = increase.includes(e.key) ? 1 : -1;
|
||||
const multiplier = e.shiftKey ? 2 : e.ctrlKey ? 1 : 0;
|
||||
if (direction2 === -1 && value === max.value && !multiplier && !Number.isInteger(steps)) {
|
||||
value = value - steps % 1 * _step;
|
||||
} else {
|
||||
value = value + direction2 * _step * multipliers.value[multiplier];
|
||||
}
|
||||
} else if (e.key === home) {
|
||||
value = min.value;
|
||||
} else if (e.key === end) {
|
||||
value = max.value;
|
||||
} else {
|
||||
const direction2 = e.key === pagedown ? 1 : -1;
|
||||
value = value - direction2 * _step * (steps > 100 ? steps / 10 : 10);
|
||||
}
|
||||
return Math.max(props.min, Math.min(props.max, value));
|
||||
}
|
||||
function onKeydown(e) {
|
||||
const newValue = parseKeydown(e, props.modelValue);
|
||||
newValue != null && emit("update:modelValue", newValue);
|
||||
}
|
||||
useRender(() => {
|
||||
const positionPercentage = convertToUnit(indexFromEnd.value ? 100 - props.position : props.position, "%");
|
||||
return createBaseVNode("div", {
|
||||
"class": normalizeClass(["v-slider-thumb", {
|
||||
"v-slider-thumb--focused": props.focused,
|
||||
"v-slider-thumb--pressed": props.focused && mousePressed.value
|
||||
}, props.class, rtlClasses.value]),
|
||||
"style": normalizeStyle([{
|
||||
"--v-slider-thumb-position": positionPercentage,
|
||||
"--v-slider-thumb-size": convertToUnit(thumbSize.value)
|
||||
}, props.style]),
|
||||
"role": "slider",
|
||||
"tabindex": disabled.value ? -1 : 0,
|
||||
"aria-label": props.name,
|
||||
"aria-valuemin": min.value,
|
||||
"aria-valuemax": max.value,
|
||||
"aria-valuenow": props.modelValue,
|
||||
"aria-readonly": !!readonly.value,
|
||||
"aria-orientation": direction.value,
|
||||
"onKeydown": !readonly.value ? onKeydown : void 0
|
||||
}, [createBaseVNode("div", {
|
||||
"class": normalizeClass(["v-slider-thumb__surface", textColorClasses.value, elevationClasses.value]),
|
||||
"style": normalizeStyle(textColorStyles.value)
|
||||
}, null), withDirectives(createBaseVNode("div", {
|
||||
"class": normalizeClass(["v-slider-thumb__ripple", textColorClasses.value]),
|
||||
"style": normalizeStyle(textColorStyles.value)
|
||||
}, null), [[ripple_default, props.ripple, null, {
|
||||
circle: true,
|
||||
center: true
|
||||
}]]), createVNode(VScaleTransition, {
|
||||
"origin": "bottom center"
|
||||
}, {
|
||||
default: () => [withDirectives(createBaseVNode("div", {
|
||||
"class": "v-slider-thumb__label-container"
|
||||
}, [createBaseVNode("div", {
|
||||
"class": normalizeClass(["v-slider-thumb__label", backgroundColorClasses.value]),
|
||||
"style": normalizeStyle(backgroundColorStyles.value)
|
||||
}, [createBaseVNode("div", null, [slots["thumb-label"]?.({
|
||||
modelValue: props.modelValue
|
||||
}) ?? props.modelValue.toFixed(step.value ? decimals.value : 1)]), createBaseVNode("div", {
|
||||
"class": "v-slider-thumb__label-wedge"
|
||||
}, null)])]), [[vShow, thumbLabel.value && props.focused || thumbLabel.value === "always"]])]
|
||||
})]);
|
||||
});
|
||||
return {};
|
||||
}
|
||||
});
|
||||
|
||||
// node_modules/vuetify/lib/components/VSlider/VSliderTrack.js
|
||||
import "/home/david/gitea_repo/personal_development/ServerManagerWebApp/frontend/node_modules/vuetify/lib/components/VSlider/VSliderTrack.css";
|
||||
var makeVSliderTrackProps = propsFactory({
|
||||
start: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
stop: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
...makeComponentProps()
|
||||
}, "VSliderTrack");
|
||||
var VSliderTrack = genericComponent()({
|
||||
name: "VSliderTrack",
|
||||
props: makeVSliderTrackProps(),
|
||||
emits: {},
|
||||
setup(props, _ref) {
|
||||
let {
|
||||
slots
|
||||
} = _ref;
|
||||
const slider = inject(VSliderSymbol);
|
||||
if (!slider) throw new Error("[Vuetify] v-slider-track must be inside v-slider or v-range-slider");
|
||||
const {
|
||||
color,
|
||||
parsedTicks,
|
||||
rounded,
|
||||
showTicks,
|
||||
tickSize,
|
||||
trackColor,
|
||||
trackFillColor,
|
||||
trackSize,
|
||||
vertical,
|
||||
min,
|
||||
max,
|
||||
indexFromEnd
|
||||
} = slider;
|
||||
const {
|
||||
roundedClasses
|
||||
} = useRounded(rounded);
|
||||
const {
|
||||
backgroundColorClasses: trackFillColorClasses,
|
||||
backgroundColorStyles: trackFillColorStyles
|
||||
} = useBackgroundColor(trackFillColor);
|
||||
const {
|
||||
backgroundColorClasses: trackColorClasses,
|
||||
backgroundColorStyles: trackColorStyles
|
||||
} = useBackgroundColor(trackColor);
|
||||
const startDir = computed(() => `inset-${vertical.value ? "block" : "inline"}-${indexFromEnd.value ? "end" : "start"}`);
|
||||
const endDir = computed(() => vertical.value ? "height" : "width");
|
||||
const backgroundStyles = computed(() => {
|
||||
return {
|
||||
[startDir.value]: "0%",
|
||||
[endDir.value]: "100%"
|
||||
};
|
||||
});
|
||||
const trackFillWidth = computed(() => props.stop - props.start);
|
||||
const trackFillStyles = computed(() => {
|
||||
return {
|
||||
[startDir.value]: convertToUnit(props.start, "%"),
|
||||
[endDir.value]: convertToUnit(trackFillWidth.value, "%")
|
||||
};
|
||||
});
|
||||
const computedTicks = computed(() => {
|
||||
if (!showTicks.value) return [];
|
||||
const ticks = vertical.value ? parsedTicks.value.slice().reverse() : parsedTicks.value;
|
||||
return ticks.map((tick, index) => {
|
||||
const directionValue = tick.value !== min.value && tick.value !== max.value ? convertToUnit(tick.position, "%") : void 0;
|
||||
return createBaseVNode("div", {
|
||||
"key": tick.value,
|
||||
"class": normalizeClass(["v-slider-track__tick", {
|
||||
"v-slider-track__tick--filled": tick.position >= props.start && tick.position <= props.stop,
|
||||
"v-slider-track__tick--first": tick.value === min.value,
|
||||
"v-slider-track__tick--last": tick.value === max.value
|
||||
}]),
|
||||
"style": {
|
||||
[startDir.value]: directionValue
|
||||
}
|
||||
}, [(tick.label || slots["tick-label"]) && createBaseVNode("div", {
|
||||
"class": "v-slider-track__tick-label"
|
||||
}, [slots["tick-label"]?.({
|
||||
tick,
|
||||
index
|
||||
}) ?? tick.label])]);
|
||||
});
|
||||
});
|
||||
useRender(() => {
|
||||
return createBaseVNode("div", {
|
||||
"class": normalizeClass(["v-slider-track", roundedClasses.value, props.class]),
|
||||
"style": normalizeStyle([{
|
||||
"--v-slider-track-size": convertToUnit(trackSize.value),
|
||||
"--v-slider-tick-size": convertToUnit(tickSize.value)
|
||||
}, props.style])
|
||||
}, [createBaseVNode("div", {
|
||||
"class": normalizeClass(["v-slider-track__background", trackColorClasses.value, {
|
||||
"v-slider-track__background--opacity": !!color.value || !trackFillColor.value
|
||||
}]),
|
||||
"style": {
|
||||
...backgroundStyles.value,
|
||||
...trackColorStyles.value
|
||||
}
|
||||
}, null), createBaseVNode("div", {
|
||||
"class": normalizeClass(["v-slider-track__fill", trackFillColorClasses.value]),
|
||||
"style": {
|
||||
...trackFillStyles.value,
|
||||
...trackFillColorStyles.value
|
||||
}
|
||||
}, null), showTicks.value && createBaseVNode("div", {
|
||||
"class": normalizeClass(["v-slider-track__ticks", {
|
||||
"v-slider-track__ticks--always-show": showTicks.value === "always"
|
||||
}])
|
||||
}, [computedTicks.value])]);
|
||||
});
|
||||
return {};
|
||||
}
|
||||
});
|
||||
|
||||
// node_modules/vuetify/lib/components/VSlider/VSlider.js
|
||||
var makeVSliderProps = propsFactory({
|
||||
...makeFocusProps(),
|
||||
...makeSliderProps(),
|
||||
...makeVInputProps(),
|
||||
modelValue: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
}
|
||||
}, "VSlider");
|
||||
var VSlider = genericComponent()({
|
||||
name: "VSlider",
|
||||
inheritAttrs: false,
|
||||
props: makeVSliderProps(),
|
||||
emits: {
|
||||
"update:focused": (value) => true,
|
||||
"update:modelValue": (v) => true,
|
||||
start: (value) => true,
|
||||
end: (value) => true
|
||||
},
|
||||
setup(props, _ref) {
|
||||
let {
|
||||
slots,
|
||||
emit,
|
||||
attrs
|
||||
} = _ref;
|
||||
const thumbContainerRef = ref();
|
||||
const inputRef = ref();
|
||||
const {
|
||||
rtlClasses
|
||||
} = useRtl();
|
||||
const steps = useSteps(props);
|
||||
const model = useProxiedModel(props, "modelValue", void 0, (value) => {
|
||||
return steps.roundValue(value == null ? steps.min.value : value);
|
||||
});
|
||||
const {
|
||||
min,
|
||||
max,
|
||||
mousePressed,
|
||||
roundValue,
|
||||
onSliderMousedown,
|
||||
onSliderTouchstart,
|
||||
trackContainerRef,
|
||||
position,
|
||||
hasLabels,
|
||||
disabled,
|
||||
readonly,
|
||||
noKeyboard
|
||||
} = useSlider({
|
||||
props,
|
||||
steps,
|
||||
onSliderStart: () => {
|
||||
if (!disabled.value && !readonly.value) {
|
||||
emit("start", model.value);
|
||||
}
|
||||
},
|
||||
onSliderEnd: (_ref2) => {
|
||||
let {
|
||||
value
|
||||
} = _ref2;
|
||||
const roundedValue = roundValue(value);
|
||||
if (!disabled.value && !readonly.value) {
|
||||
model.value = roundedValue;
|
||||
}
|
||||
emit("end", roundedValue);
|
||||
},
|
||||
onSliderMove: (_ref3) => {
|
||||
let {
|
||||
value
|
||||
} = _ref3;
|
||||
if (!disabled.value && !readonly.value) {
|
||||
model.value = roundValue(value);
|
||||
}
|
||||
},
|
||||
getActiveThumb: () => thumbContainerRef.value?.$el
|
||||
});
|
||||
const {
|
||||
isFocused,
|
||||
focus,
|
||||
blur
|
||||
} = useFocus(props);
|
||||
const trackStop = computed(() => position(model.value));
|
||||
useRender(() => {
|
||||
const inputProps = VInput.filterProps(props);
|
||||
const [rootAttrs, inputAttrs] = filterInputAttrs(attrs);
|
||||
const hasPrepend = !!(props.label || slots.label || slots.prepend);
|
||||
return createVNode(VInput, mergeProps({
|
||||
"ref": inputRef,
|
||||
"class": ["v-slider", {
|
||||
"v-slider--has-labels": !!slots["tick-label"] || hasLabels.value,
|
||||
"v-slider--focused": isFocused.value,
|
||||
"v-slider--pressed": mousePressed.value,
|
||||
"v-slider--disabled": disabled.value
|
||||
}, rtlClasses.value, props.class],
|
||||
"style": props.style
|
||||
}, inputProps, rootAttrs, {
|
||||
"focused": isFocused.value
|
||||
}), {
|
||||
...slots,
|
||||
prepend: hasPrepend ? (slotProps) => createBaseVNode(Fragment, null, [slots.label?.(slotProps) ?? (props.label ? createVNode(VLabel, {
|
||||
"id": slotProps.id.value,
|
||||
"class": "v-slider__label",
|
||||
"text": props.label
|
||||
}, null) : void 0), slots.prepend?.(slotProps)]) : void 0,
|
||||
default: (_ref4) => {
|
||||
let {
|
||||
id,
|
||||
messagesId
|
||||
} = _ref4;
|
||||
return createBaseVNode("div", {
|
||||
"class": "v-slider__container",
|
||||
"onMousedown": !readonly.value ? onSliderMousedown : void 0,
|
||||
"onTouchstartPassive": !readonly.value ? onSliderTouchstart : void 0
|
||||
}, [createBaseVNode("input", {
|
||||
"id": id.value,
|
||||
"name": props.name || id.value,
|
||||
"disabled": disabled.value,
|
||||
"readonly": readonly.value,
|
||||
"tabindex": "-1",
|
||||
"value": model.value
|
||||
}, null), createVNode(VSliderTrack, {
|
||||
"ref": trackContainerRef,
|
||||
"start": 0,
|
||||
"stop": trackStop.value
|
||||
}, {
|
||||
"tick-label": slots["tick-label"]
|
||||
}), createVNode(VSliderThumb, mergeProps({
|
||||
"ref": thumbContainerRef,
|
||||
"aria-describedby": messagesId.value,
|
||||
"focused": isFocused.value,
|
||||
"noKeyboard": noKeyboard.value,
|
||||
"min": min.value,
|
||||
"max": max.value,
|
||||
"modelValue": model.value,
|
||||
"onUpdate:modelValue": (v) => model.value = v,
|
||||
"position": trackStop.value,
|
||||
"elevation": props.elevation,
|
||||
"onFocus": focus,
|
||||
"onBlur": blur,
|
||||
"ripple": props.ripple,
|
||||
"name": props.name
|
||||
}, inputAttrs), {
|
||||
"thumb-label": slots["thumb-label"]
|
||||
})]);
|
||||
}
|
||||
});
|
||||
});
|
||||
return forwardRefs({
|
||||
focus: () => thumbContainerRef.value?.$el.focus()
|
||||
}, inputRef);
|
||||
}
|
||||
});
|
||||
|
||||
export {
|
||||
getOffset,
|
||||
makeSliderProps,
|
||||
useSteps,
|
||||
useSlider,
|
||||
VSliderThumb,
|
||||
VSliderTrack,
|
||||
VSlider
|
||||
};
|
||||
//# sourceMappingURL=chunk-WGWEQK64.js.map
|
||||
Reference in New Issue
Block a user