JQuery Button menu (knockout)

JQuery button menu using knockout

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/base/jquery-ui.css">
<script src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-2.0.0.js"></script>
<button data-bind="juiButton: {
    icons:
    {
        primary: 'ui-icon-circle-check',
        secondary: 'ui-icon-triangle-1-s'
    }
}, juiButtonMenu: { items: bMenu() }">Test</button>
<button data-bind="juiButton: {
    icons:
    {
        primary: 'ui-icon-circle-check',
        secondary: 'ui-icon-triangle-1-s'
    }
}, juiButtonMenu: { items: bMenu() }">Test2</button>

CSS

body {
    font-size: 10px;
}
.s-buttonMenu {
    position: absolute;
    width: 200px;
}
.s-buttonMenuItem {
    padding: 4px;
    cursor: pointer;
}
.s-buttonMenuItem:hover {
    background-color: #ddd;
    color: #000;
}

JavaScript

// button menu widget
$.widget("s.buttonMenu", {

    // default options
    options: {
        items: []
    },
    _menuElement: null,
    _hidePending: false,

    _hideSubmenu: function () {
        if (this._hidePending) {
            this._menuElement.fadeOut();
        }
    },

    _submenuClick: function (e) {
        if ($.isFunction(e.data.click)) {
            e.data.click();
        }

        // prevent button click
        e.stopPropagation();
    },

    _showMenu: function () {
        var buttonOffset = this.element.offset();

        this._menuElement.css({
            top: buttonOffset.top - $(window).scrollTop() + this.element.outerHeight(),
            left: buttonOffset.left - $(window).scrollLeft()
        }).fadeIn();
    },

    _hideMenu: function () {
        this._hidePending = true;
        window.setTimeout($.proxy(this._hideSubmenu, this), 200);
    },

    _preventHide: function () {
        this._hidePending = false;
    },

    _create: function () {
        // create menu element
        this._menuElement = $('<div class="s-buttonMenu ui-widget-content ui-state-default ui-corner-all" style="display: none" />')
            .mouseenter($.proxy(this._preventHide, this))
            .mouseleave($.proxy(this._hideMenu, this))
            .appendTo('body');

        // attach button element event handlers
        this.element.mouseleave($.proxy(this._hideMenu, this))
            .click($.proxy(this._showMenu, this));
    },

    _setOption: function (key, value) {
        this.options[key] = value;
        this._update();
    },

    _update: function () {
        var i, len;

        this._menuElement.empty();

        for (i = 0, len = this.options.items.length; i < len; i += 1) {
            $('<div class="s-buttonMenuItem"/>')
                .text(this.options.items[i].text)
                .click(this.options.items[i], this._submenuClick).appendTo(this._menuElement);
        }
    },

    destroy: function () {
        if...