import { __assign, __decorate, __extends, __metadata } from "tslib";
import { mergeOverflows, ktpTargetFromSequences } from '../../utilities/keytips/KeytipUtils';
import { Callout } from '../Callout';
import { KeytipContent } from './KeytipContent';
import { getCalloutStyles, getCalloutOffsetStyles } from './Keytip.styles';
import BaseComponent from '../BaseComponent';
import { Prop } from 'vue-property-decorator';
import { DirectionalHint } from '../../common/DirectionalHint';
/**
 * A callout corresponding to another Fabric component to describe a key sequence that will activate that component
 */
var Keytip = /** @class */ (function (_super) {
    __extends(Keytip, _super);
    function Keytip() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    Keytip.prototype.render = function (h) {
        var _a = this, keySequences = _a.keySequences, offset = _a.offset, overflowSetSequence = _a.overflowSetSequence;
        var calloutProps = this.calloutProps;
        var keytipTarget;
        // Take into consideration the overflow sequence
        if (overflowSetSequence) {
            keytipTarget = ktpTargetFromSequences(mergeOverflows(keySequences, overflowSetSequence));
        }
        else {
            keytipTarget = ktpTargetFromSequences(keySequences);
        }
        if (offset) {
            // Set callout to top-left corner, will be further positioned in
            // getCalloutOffsetStyles
            calloutProps = __assign(__assign({}, calloutProps), { coverTarget: true, directionalHint: DirectionalHint.topLeftEdge });
        }
        if (!calloutProps || calloutProps.directionalHint === undefined) {
            // Default callout directional hint to BottomCenter
            calloutProps = __assign(__assign({}, calloutProps), { directionalHint: DirectionalHint.bottomCenter });
        }
        return h(Callout, {
            attrs: __assign(__assign({}, calloutProps), { isBeakVisible: false, doNotLayer: true, minPagePadding: 0, styles: offset ? getCalloutOffsetStyles(offset) : getCalloutStyles, preventDismissOnScroll: true, target: keytipTarget }),
        }, [h(KeytipContent, { props: this.$props })]);
    };
    __decorate([
        Prop({ type: Array, default: undefined }),
        __metadata("design:type", Array)
    ], Keytip.prototype, "keySequences", void 0);
    __decorate([
        Prop({ type: Object, default: undefined }),
        __metadata("design:type", Object)
    ], Keytip.prototype, "offset", void 0);
    __decorate([
        Prop({ type: Array, default: undefined }),
        __metadata("design:type", Array)
    ], Keytip.prototype, "overflowSetSequence", void 0);
    __decorate([
        Prop({ type: Object, default: undefined }),
        __metadata("design:type", Object)
    ], Keytip.prototype, "calloutProps", void 0);
    return Keytip;
}(BaseComponent));
export { Keytip };
//# sourceMappingURL=Keytip.js.map