@ebay/ebayui-core
Version:
Collection of core eBay components; considered to be the building blocks for all composite structures, pages & apps.
70 lines (69 loc) • 2.26 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.DropdownUtil = void 0;
const floating_ui_1 = require("@internal/floating-ui");
class DropdownUtil {
constructor(host, overlay, options) {
this.host = host;
this.overlay = overlay;
this.options = options !== null && options !== void 0 ? options : {};
(0, floating_ui_1.load)()
.then((floatingUI) => {
this.computePosition =
floatingUI.computePosition;
this.autoUpdate = floatingUI.autoUpdate;
this.offset = floatingUI.offset;
this.flip = floatingUI.flip;
this.shift = floatingUI.shift;
this.loaded = true;
if (this.triggerShow) {
this.triggerShow = false;
this.show();
}
})
.catch(() => {
// This is the case where it's loaded on the server.
// Should be no-op
});
}
show() {
if (this.loaded) {
this.cleanupFn = this.autoUpdate(this.host, this.overlay, this.update.bind(this));
}
else {
this.triggerShow = true;
}
}
update() {
var _a, _b;
if (!this.loaded)
return;
const middleware = [];
middleware.push(this.offset((_a = this.options.offset) !== null && _a !== void 0 ? _a : 4));
if (this.options.flip) {
middleware.push(this.flip({
crossAxis: true,
}));
}
middleware.push(this.shift());
this.computePosition(this.host, this.overlay, {
placement: this.options.reverse ? "bottom-end" : "bottom-start",
strategy: (_b = this.options.strategy) !== null && _b !== void 0 ? _b : "fixed",
middleware,
}).then(({ x, y }) => {
Object.assign(this.overlay.style, {
left: `${x}px`,
top: `${y}px`,
});
});
}
cleanup() {
var _a;
(_a = this.cleanupFn) === null || _a === void 0 ? void 0 : _a.call(this);
}
hide() {
if (this.cleanup)
this.cleanup();
}
}
exports.DropdownUtil = DropdownUtil;