This commit is contained in:
2025-09-19 14:25:20 +08:00
parent 269893a435
commit fbf3f77229
24949 changed files with 2839404 additions and 0 deletions

View File

@@ -0,0 +1,78 @@
import type { Ref } from 'vue';
import type { Instance, Modifier, Options, State, VirtualElement } from '@popperjs/core';
type ElementType = HTMLElement | undefined;
type ReferenceElement = ElementType | VirtualElement;
export type PartialOptions = Partial<Options>;
export declare const usePopper: (referenceElementRef: Ref<ReferenceElement>, popperElementRef: Ref<ElementType>, opts?: Ref<PartialOptions> | PartialOptions) => {
state: import("vue").ComputedRef<{
elements?: {
reference: Element | VirtualElement;
popper: HTMLElement;
arrow?: HTMLElement;
} | undefined;
options?: import("@popperjs/core").OptionsGeneric<any> | undefined;
placement?: import("@popperjs/core").Placement | undefined;
strategy?: import("@popperjs/core").PositioningStrategy | undefined;
orderedModifiers?: Modifier<any, any>[] | undefined;
rects?: import("@popperjs/core").StateRects | undefined;
scrollParents?: {
reference: Array<Element | import("@popperjs/core").Window | import("@popperjs/core").VisualViewport>;
popper: Array<Element | import("@popperjs/core").Window | import("@popperjs/core").VisualViewport>;
} | undefined;
styles?: {
[key: string]: Partial<CSSStyleDeclaration>;
} | undefined;
attributes?: {
[key: string]: {
[key: string]: string | boolean;
};
} | undefined;
modifiersData?: {
[key: string]: any;
arrow?: {
x?: number;
y?: number;
centerOffset: number;
};
hide?: {
isReferenceHidden: boolean;
hasPopperEscaped: boolean;
referenceClippingOffsets: import("@popperjs/core").SideObject;
popperEscapeOffsets: import("@popperjs/core").SideObject;
};
offset?: {
top?: import("@popperjs/core").Offsets | undefined;
bottom?: import("@popperjs/core").Offsets | undefined;
left?: import("@popperjs/core").Offsets | undefined;
right?: import("@popperjs/core").Offsets | undefined;
auto?: import("@popperjs/core").Offsets | undefined;
"auto-start"?: import("@popperjs/core").Offsets | undefined;
"auto-end"?: import("@popperjs/core").Offsets | undefined;
"top-start"?: import("@popperjs/core").Offsets | undefined;
"top-end"?: import("@popperjs/core").Offsets | undefined;
"bottom-start"?: import("@popperjs/core").Offsets | undefined;
"bottom-end"?: import("@popperjs/core").Offsets | undefined;
"right-start"?: import("@popperjs/core").Offsets | undefined;
"right-end"?: import("@popperjs/core").Offsets | undefined;
"left-start"?: import("@popperjs/core").Offsets | undefined;
"left-end"?: import("@popperjs/core").Offsets | undefined;
};
preventOverflow?: import("@popperjs/core").Offsets;
popperOffsets?: import("@popperjs/core").Offsets;
} | undefined;
reset?: boolean | undefined;
}>;
styles: import("vue").ComputedRef<{
[key: string]: Partial<CSSStyleDeclaration>;
}>;
attributes: import("vue").ComputedRef<{
[key: string]: {
[key: string]: string | boolean;
};
}>;
update: () => Promise<Partial<State>> | undefined;
forceUpdate: () => void | undefined;
instanceRef: import("vue").ComputedRef<Instance | undefined>;
};
export type UsePopperReturn = ReturnType<typeof usePopper>;
export {};

View File

@@ -0,0 +1,95 @@
import { computed, unref, shallowRef, ref, watch, onBeforeUnmount } from 'vue';
import { createPopper } from '@popperjs/core';
import { fromPairs } from 'lodash-unified';
const usePopper = (referenceElementRef, popperElementRef, opts = {}) => {
const stateUpdater = {
name: "updateState",
enabled: true,
phase: "write",
fn: ({ state }) => {
const derivedState = deriveState(state);
Object.assign(states.value, derivedState);
},
requires: ["computeStyles"]
};
const options = computed(() => {
const { onFirstUpdate, placement, strategy, modifiers } = unref(opts);
return {
onFirstUpdate,
placement: placement || "bottom",
strategy: strategy || "absolute",
modifiers: [
...modifiers || [],
stateUpdater,
{ name: "applyStyles", enabled: false }
]
};
});
const instanceRef = shallowRef();
const states = ref({
styles: {
popper: {
position: unref(options).strategy,
left: "0",
top: "0"
},
arrow: {
position: "absolute"
}
},
attributes: {}
});
const destroy = () => {
if (!instanceRef.value)
return;
instanceRef.value.destroy();
instanceRef.value = void 0;
};
watch(options, (newOptions) => {
const instance = unref(instanceRef);
if (instance) {
instance.setOptions(newOptions);
}
}, {
deep: true
});
watch([referenceElementRef, popperElementRef], ([referenceElement, popperElement]) => {
destroy();
if (!referenceElement || !popperElement)
return;
instanceRef.value = createPopper(referenceElement, popperElement, unref(options));
});
onBeforeUnmount(() => {
destroy();
});
return {
state: computed(() => {
var _a;
return { ...((_a = unref(instanceRef)) == null ? void 0 : _a.state) || {} };
}),
styles: computed(() => unref(states).styles),
attributes: computed(() => unref(states).attributes),
update: () => {
var _a;
return (_a = unref(instanceRef)) == null ? void 0 : _a.update();
},
forceUpdate: () => {
var _a;
return (_a = unref(instanceRef)) == null ? void 0 : _a.forceUpdate();
},
instanceRef: computed(() => unref(instanceRef))
};
};
function deriveState(state) {
const elements = Object.keys(state.elements);
const styles = fromPairs(elements.map((element) => [element, state.styles[element] || {}]));
const attributes = fromPairs(elements.map((element) => [element, state.attributes[element]]));
return {
styles,
attributes
};
}
export { usePopper };
//# sourceMappingURL=index.mjs.map

File diff suppressed because one or more lines are too long