@indielayer/ui
Version:
Indielayer UI Components with Tailwind CSS build for Vue 3
135 lines (134 loc) • 4.43 kB
JavaScript
import { defineComponent as b, ref as a, openBlock as v, createBlock as S, unref as r, normalizeStyle as T, normalizeClass as A, withCtx as l, renderSlot as d } from "vue";
import { useTheme as B } from "../../composables/useTheme.js";
import { Dropdown as $ } from "../../node_modules/.pnpm/floating-vue@5.2.2_@nuxt_kit@3.10.1_rollup@3.29.4__vue@3.5.10_typescript@5.2.2_/node_modules/floating-vue/dist/floating-vue.js";
const k = {
placement: ["top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "left", "left-start", "left-end", "right", "right-start", "right-end"]
}, z = {
disabled: Boolean,
positioningDisabled: Boolean,
placement: {
type: String,
default: "bottom-start"
},
delay: {
type: [String, Number, Object],
default: 0
},
distance: [Number, String],
skidding: [Number, String],
triggers: {
type: Array,
default: () => ["click"]
},
hideArrow: {
type: Boolean,
default: !0
},
showTriggers: [Array, Function],
hideTriggers: [Array, Function],
popperTriggers: Array,
popperShowTriggers: [Array, Function],
popperHideTriggers: [Array, Function],
container: {
type: [String, Object, Boolean],
default: "body"
},
boundary: [String, Object],
strategy: {
type: String,
default: "absolute"
},
autoHide: {
type: [Boolean, Function],
default: !0
},
shown: Boolean,
handleResize: {
type: Boolean,
default: !0
},
instantMove: Boolean,
eagerMount: Boolean,
popperClass: [String, Array, Object],
computeTransformOrigin: Boolean
}, C = {
name: "XPopover",
validators: k
}, R = /* @__PURE__ */ b({
...C,
props: z,
emits: ["show", "hide", "update:shown", "apply-show", "apply-hide", "close-group", "close-directive", "auto-hide", "resize"],
setup(g, { expose: u }) {
const m = g, i = a(null);
function s() {
var e;
(e = i.value) == null || e.show();
}
function n() {
var e;
(e = i.value) == null || e.hide();
}
function y() {
t.value ? n() : s();
}
const t = a(!1);
u({ show: s, hide: n, toggle: y, isOpen: t });
const { styles: f, classes: p, className: h } = B("Popover", {}, m);
return (e, o) => (v(), S(r($), {
ref_key: "elRef",
ref: i,
style: T(r(f)),
class: A([r(h), r(p).wrapper]),
"positioning-disabled": e.positioningDisabled,
placement: e.placement,
disabled: e.disabled,
delay: e.delay,
shown: e.shown,
distance: e.distance,
skidding: e.skidding,
triggers: e.triggers,
"show-triggers": e.showTriggers,
"hide-triggers": e.hideTriggers,
"popper-triggers": e.popperTriggers,
"popper-show-triggers": e.popperShowTriggers,
"popper-hide-triggers": e.popperHideTriggers,
container: e.container,
boundary: e.boundary,
strategy: e.strategy,
"auto-hide": e.autoHide,
"handle-resize": e.handleResize,
"instant-move": e.instantMove,
"eager-mount": e.eagerMount,
"popper-class": [
r(p).content,
e.popperClass,
e.hideArrow ? "v-popper__popper--no-arrow" : ""
],
"compute-transform-origin": e.computeTransformOrigin,
onShow: o[0] || (o[0] = () => {
t.value = !0, e.$emit("show");
}),
onHide: o[1] || (o[1] = () => {
t.value = !1, e.$emit("hide");
}),
"onUpdate:shown": o[2] || (o[2] = (w) => e.$emit("update:shown", w)),
onApplyShow: o[3] || (o[3] = () => e.$emit("apply-show")),
onApplyHide: o[4] || (o[4] = () => e.$emit("apply-hide")),
onCloseGroup: o[5] || (o[5] = () => e.$emit("close-group")),
onCloseDirective: o[6] || (o[6] = () => e.$emit("close-directive")),
onAutoHide: o[7] || (o[7] = () => e.$emit("auto-hide")),
onResize: o[8] || (o[8] = () => e.$emit("resize"))
}, {
popper: l(() => [
d(e.$slots, "content")
]),
default: l(() => [
d(e.$slots, "default")
]),
_: 3
}, 8, ["style", "class", "positioning-disabled", "placement", "disabled", "delay", "shown", "distance", "skidding", "triggers", "show-triggers", "hide-triggers", "popper-triggers", "popper-show-triggers", "popper-hide-triggers", "container", "boundary", "strategy", "auto-hide", "handle-resize", "instant-move", "eager-mount", "popper-class", "compute-transform-origin"]));
}
});
export {
R as default
};