353 lines
11 KiB
JavaScript
353 lines
11 KiB
JavaScript
import {
|
|
acceleratedEasing,
|
|
animate,
|
|
deceleratedEasing,
|
|
genericComponent,
|
|
getTargetBox,
|
|
nullifyTransforms,
|
|
propsFactory,
|
|
standardEasing
|
|
} from "./chunk-I4KGD5X4.js";
|
|
import {
|
|
Transition,
|
|
TransitionGroup,
|
|
camelize,
|
|
createVNode,
|
|
h,
|
|
mergeProps
|
|
} from "./chunk-PD2AWGJV.js";
|
|
|
|
// node_modules/vuetify/lib/components/transitions/dialog-transition.mjs
|
|
var makeVDialogTransitionProps = propsFactory({
|
|
target: [Object, Array]
|
|
}, "v-dialog-transition");
|
|
var VDialogTransition = genericComponent()({
|
|
name: "VDialogTransition",
|
|
props: makeVDialogTransitionProps(),
|
|
setup(props, _ref) {
|
|
let {
|
|
slots
|
|
} = _ref;
|
|
const functions = {
|
|
onBeforeEnter(el) {
|
|
el.style.pointerEvents = "none";
|
|
el.style.visibility = "hidden";
|
|
},
|
|
async onEnter(el, done) {
|
|
var _a;
|
|
await new Promise((resolve) => requestAnimationFrame(resolve));
|
|
await new Promise((resolve) => requestAnimationFrame(resolve));
|
|
el.style.visibility = "";
|
|
const {
|
|
x,
|
|
y,
|
|
sx,
|
|
sy,
|
|
speed
|
|
} = getDimensions(props.target, el);
|
|
const animation = animate(el, [{
|
|
transform: `translate(${x}px, ${y}px) scale(${sx}, ${sy})`,
|
|
opacity: 0
|
|
}, {}], {
|
|
duration: 225 * speed,
|
|
easing: deceleratedEasing
|
|
});
|
|
(_a = getChildren(el)) == null ? void 0 : _a.forEach((el2) => {
|
|
animate(el2, [{
|
|
opacity: 0
|
|
}, {
|
|
opacity: 0,
|
|
offset: 0.33
|
|
}, {}], {
|
|
duration: 225 * 2 * speed,
|
|
easing: standardEasing
|
|
});
|
|
});
|
|
animation.finished.then(() => done());
|
|
},
|
|
onAfterEnter(el) {
|
|
el.style.removeProperty("pointer-events");
|
|
},
|
|
onBeforeLeave(el) {
|
|
el.style.pointerEvents = "none";
|
|
},
|
|
async onLeave(el, done) {
|
|
var _a;
|
|
await new Promise((resolve) => requestAnimationFrame(resolve));
|
|
const {
|
|
x,
|
|
y,
|
|
sx,
|
|
sy,
|
|
speed
|
|
} = getDimensions(props.target, el);
|
|
const animation = animate(el, [{}, {
|
|
transform: `translate(${x}px, ${y}px) scale(${sx}, ${sy})`,
|
|
opacity: 0
|
|
}], {
|
|
duration: 125 * speed,
|
|
easing: acceleratedEasing
|
|
});
|
|
animation.finished.then(() => done());
|
|
(_a = getChildren(el)) == null ? void 0 : _a.forEach((el2) => {
|
|
animate(el2, [{}, {
|
|
opacity: 0,
|
|
offset: 0.2
|
|
}, {
|
|
opacity: 0
|
|
}], {
|
|
duration: 125 * 2 * speed,
|
|
easing: standardEasing
|
|
});
|
|
});
|
|
},
|
|
onAfterLeave(el) {
|
|
el.style.removeProperty("pointer-events");
|
|
}
|
|
};
|
|
return () => {
|
|
return props.target ? createVNode(Transition, mergeProps({
|
|
"name": "dialog-transition"
|
|
}, functions, {
|
|
"css": false
|
|
}), slots) : createVNode(Transition, {
|
|
"name": "dialog-transition"
|
|
}, slots);
|
|
};
|
|
}
|
|
});
|
|
function getChildren(el) {
|
|
var _a;
|
|
const els = (_a = el.querySelector(":scope > .v-card, :scope > .v-sheet, :scope > .v-list")) == null ? void 0 : _a.children;
|
|
return els && [...els];
|
|
}
|
|
function getDimensions(target, el) {
|
|
const targetBox = getTargetBox(target);
|
|
const elBox = nullifyTransforms(el);
|
|
const [originX, originY] = getComputedStyle(el).transformOrigin.split(" ").map((v) => parseFloat(v));
|
|
const [anchorSide, anchorOffset] = getComputedStyle(el).getPropertyValue("--v-overlay-anchor-origin").split(" ");
|
|
let offsetX = targetBox.left + targetBox.width / 2;
|
|
if (anchorSide === "left" || anchorOffset === "left") {
|
|
offsetX -= targetBox.width / 2;
|
|
} else if (anchorSide === "right" || anchorOffset === "right") {
|
|
offsetX += targetBox.width / 2;
|
|
}
|
|
let offsetY = targetBox.top + targetBox.height / 2;
|
|
if (anchorSide === "top" || anchorOffset === "top") {
|
|
offsetY -= targetBox.height / 2;
|
|
} else if (anchorSide === "bottom" || anchorOffset === "bottom") {
|
|
offsetY += targetBox.height / 2;
|
|
}
|
|
const tsx = targetBox.width / elBox.width;
|
|
const tsy = targetBox.height / elBox.height;
|
|
const maxs = Math.max(1, tsx, tsy);
|
|
const sx = tsx / maxs || 0;
|
|
const sy = tsy / maxs || 0;
|
|
const asa = elBox.width * elBox.height / (window.innerWidth * window.innerHeight);
|
|
const speed = asa > 0.12 ? Math.min(1.5, (asa - 0.12) * 10 + 1) : 1;
|
|
return {
|
|
x: offsetX - (originX + elBox.left),
|
|
y: offsetY - (originY + elBox.top),
|
|
sx,
|
|
sy,
|
|
speed
|
|
};
|
|
}
|
|
|
|
// node_modules/vuetify/lib/components/transitions/createTransition.mjs
|
|
var makeTransitionProps = propsFactory({
|
|
disabled: Boolean,
|
|
group: Boolean,
|
|
hideOnLeave: Boolean,
|
|
leaveAbsolute: Boolean,
|
|
mode: String,
|
|
origin: String
|
|
}, "transition");
|
|
function createCssTransition(name, origin, mode) {
|
|
return genericComponent()({
|
|
name,
|
|
props: makeTransitionProps({
|
|
mode,
|
|
origin
|
|
}),
|
|
setup(props, _ref) {
|
|
let {
|
|
slots
|
|
} = _ref;
|
|
const functions = {
|
|
onBeforeEnter(el) {
|
|
if (props.origin) {
|
|
el.style.transformOrigin = props.origin;
|
|
}
|
|
},
|
|
onLeave(el) {
|
|
if (props.leaveAbsolute) {
|
|
const {
|
|
offsetTop,
|
|
offsetLeft,
|
|
offsetWidth,
|
|
offsetHeight
|
|
} = el;
|
|
el._transitionInitialStyles = {
|
|
position: el.style.position,
|
|
top: el.style.top,
|
|
left: el.style.left,
|
|
width: el.style.width,
|
|
height: el.style.height
|
|
};
|
|
el.style.position = "absolute";
|
|
el.style.top = `${offsetTop}px`;
|
|
el.style.left = `${offsetLeft}px`;
|
|
el.style.width = `${offsetWidth}px`;
|
|
el.style.height = `${offsetHeight}px`;
|
|
}
|
|
if (props.hideOnLeave) {
|
|
el.style.setProperty("display", "none", "important");
|
|
}
|
|
},
|
|
onAfterLeave(el) {
|
|
if (props.leaveAbsolute && (el == null ? void 0 : el._transitionInitialStyles)) {
|
|
const {
|
|
position,
|
|
top,
|
|
left,
|
|
width,
|
|
height
|
|
} = el._transitionInitialStyles;
|
|
delete el._transitionInitialStyles;
|
|
el.style.position = position || "";
|
|
el.style.top = top || "";
|
|
el.style.left = left || "";
|
|
el.style.width = width || "";
|
|
el.style.height = height || "";
|
|
}
|
|
}
|
|
};
|
|
return () => {
|
|
const tag = props.group ? TransitionGroup : Transition;
|
|
return h(tag, {
|
|
name: props.disabled ? "" : name,
|
|
css: !props.disabled,
|
|
...props.group ? void 0 : {
|
|
mode: props.mode
|
|
},
|
|
...props.disabled ? {} : functions
|
|
}, slots.default);
|
|
};
|
|
}
|
|
});
|
|
}
|
|
function createJavascriptTransition(name, functions) {
|
|
let mode = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : "in-out";
|
|
return genericComponent()({
|
|
name,
|
|
props: {
|
|
mode: {
|
|
type: String,
|
|
default: mode
|
|
},
|
|
disabled: Boolean
|
|
},
|
|
setup(props, _ref2) {
|
|
let {
|
|
slots
|
|
} = _ref2;
|
|
return () => {
|
|
return h(Transition, {
|
|
name: props.disabled ? "" : name,
|
|
css: !props.disabled,
|
|
// mode: props.mode, // TODO: vuejs/vue-next#3104
|
|
...props.disabled ? {} : functions
|
|
}, slots.default);
|
|
};
|
|
}
|
|
});
|
|
}
|
|
|
|
// node_modules/vuetify/lib/components/transitions/expand-transition.mjs
|
|
function expand_transition_default() {
|
|
let expandedParentClass = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "";
|
|
let x = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
|
|
const sizeProperty = x ? "width" : "height";
|
|
const offsetProperty = camelize(`offset-${sizeProperty}`);
|
|
return {
|
|
onBeforeEnter(el) {
|
|
el._parent = el.parentNode;
|
|
el._initialStyle = {
|
|
transition: el.style.transition,
|
|
overflow: el.style.overflow,
|
|
[sizeProperty]: el.style[sizeProperty]
|
|
};
|
|
},
|
|
onEnter(el) {
|
|
const initialStyle = el._initialStyle;
|
|
el.style.setProperty("transition", "none", "important");
|
|
el.style.overflow = "hidden";
|
|
const offset = `${el[offsetProperty]}px`;
|
|
el.style[sizeProperty] = "0";
|
|
void el.offsetHeight;
|
|
el.style.transition = initialStyle.transition;
|
|
if (expandedParentClass && el._parent) {
|
|
el._parent.classList.add(expandedParentClass);
|
|
}
|
|
requestAnimationFrame(() => {
|
|
el.style[sizeProperty] = offset;
|
|
});
|
|
},
|
|
onAfterEnter: resetStyles,
|
|
onEnterCancelled: resetStyles,
|
|
onLeave(el) {
|
|
el._initialStyle = {
|
|
transition: "",
|
|
overflow: el.style.overflow,
|
|
[sizeProperty]: el.style[sizeProperty]
|
|
};
|
|
el.style.overflow = "hidden";
|
|
el.style[sizeProperty] = `${el[offsetProperty]}px`;
|
|
void el.offsetHeight;
|
|
requestAnimationFrame(() => el.style[sizeProperty] = "0");
|
|
},
|
|
onAfterLeave,
|
|
onLeaveCancelled: onAfterLeave
|
|
};
|
|
function onAfterLeave(el) {
|
|
if (expandedParentClass && el._parent) {
|
|
el._parent.classList.remove(expandedParentClass);
|
|
}
|
|
resetStyles(el);
|
|
}
|
|
function resetStyles(el) {
|
|
const size = el._initialStyle[sizeProperty];
|
|
el.style.overflow = el._initialStyle.overflow;
|
|
if (size != null) el.style[sizeProperty] = size;
|
|
delete el._initialStyle;
|
|
}
|
|
}
|
|
|
|
// node_modules/vuetify/lib/components/transitions/index.mjs
|
|
var VFabTransition = createCssTransition("fab-transition", "center center", "out-in");
|
|
var VDialogBottomTransition = createCssTransition("dialog-bottom-transition");
|
|
var VDialogTopTransition = createCssTransition("dialog-top-transition");
|
|
var VFadeTransition = createCssTransition("fade-transition");
|
|
var VScaleTransition = createCssTransition("scale-transition");
|
|
var VScrollXTransition = createCssTransition("scroll-x-transition");
|
|
var VScrollXReverseTransition = createCssTransition("scroll-x-reverse-transition");
|
|
var VScrollYTransition = createCssTransition("scroll-y-transition");
|
|
var VScrollYReverseTransition = createCssTransition("scroll-y-reverse-transition");
|
|
var VSlideXTransition = createCssTransition("slide-x-transition");
|
|
var VSlideXReverseTransition = createCssTransition("slide-x-reverse-transition");
|
|
var VSlideYTransition = createCssTransition("slide-y-transition");
|
|
var VSlideYReverseTransition = createCssTransition("slide-y-reverse-transition");
|
|
var VExpandTransition = createJavascriptTransition("expand-transition", expand_transition_default());
|
|
var VExpandXTransition = createJavascriptTransition("expand-x-transition", expand_transition_default("", true));
|
|
|
|
export {
|
|
VDialogTransition,
|
|
VFadeTransition,
|
|
VScaleTransition,
|
|
VSlideYTransition,
|
|
VExpandTransition,
|
|
VExpandXTransition
|
|
};
|
|
//# sourceMappingURL=chunk-JVZUVJAC.js.map
|