import { r as registerInstance, h, H as Host, e as getElement } from './index-9bc5455c.js';
import { g as getIonMode } from './ionic-global-54ea523e.js';
var reorderIosCss = ":host([slot]){display:none;line-height:0;z-index:100}.reorder-icon{display:block;font-size:22px}.reorder-icon{font-size:34px;opacity:0.4}";
var reorderMdCss = ":host([slot]){display:none;line-height:0;z-index:100}.reorder-icon{display:block;font-size:22px}.reorder-icon{font-size:31px;opacity:0.3}";
var Reorder = /** @class */ (function () {
    function Reorder(hostRef) {
        registerInstance(this, hostRef);
    }
    Reorder.prototype.onClick = function (ev) {
        var reorderGroup = this.el.closest('ion-reorder-group');
        ev.preventDefault();
        // Only stop event propagation if the reorder is inside of an enabled
        // reorder group. This allows interaction with clickable children components.
        if (!reorderGroup || !reorderGroup.disabled) {
            ev.stopImmediatePropagation();
        }
    };
    Reorder.prototype.render = function () {
        var mode = getIonMode(this);
        var reorderIcon = mode === 'ios' ? 'reorder-three-outline' : 'reorder-two-sharp';
        return (h(Host, { class: mode }, h("slot", null, h("ion-icon", { name: reorderIcon, lazy: false, class: "reorder-icon", part: "icon" }))));
    };
    Object.defineProperty(Reorder.prototype, "el", {
        get: function () { return getElement(this); },
        enumerable: false,
        configurable: true
    });
    return Reorder;
}());
Reorder.style = {
    ios: reorderIosCss,
    md: reorderMdCss
};
export { Reorder as ion_reorder };
